/* eBattery · ultra2.css — v6: sahne, rota, 3B, oyun, ToC, dock, tema geçişi */
@property --ang{syntax:'<angle>';initial-value:0deg;inherits:false}
/* kart kenarında dönen ışık */
.feature-card,.journal-card,.reference-card{position:relative}
.feature-card::before,.journal-card::before,.reference-card::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;pointer-events:none;opacity:0;transition:opacity .4s;
 background:conic-gradient(from var(--ang),transparent 0 55%,#2f6bff,#9676e9 80%,transparent);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.feature-card:hover::before,.journal-card:hover::before,.reference-card:hover::before{opacity:1;animation:ub-ang 3s linear infinite}
@keyframes ub-ang{to{--ang:360deg}}
/* hero telefonu kaydırmayla döner, hikâye ekranları 3B geçişle gelir */
.hero-showcase{perspective:1400px}
.hero-phone-main{rotate:y calc(var(--sy,0)*-16deg)}.hero-phone-back{rotate:y calc(var(--sy,0)*14deg)}
.story-frame:not([hidden]){animation:ub-flip .9s cubic-bezier(.22,.8,.25,1)}
@keyframes ub-flip{from{opacity:0;rotate:y -32deg;translate:46px 0;scale:.93}}
.screen-gallery .gallery-item{animation:ub-fan linear both;animation-timeline:view();animation-range:entry 0% entry 85%}
@keyframes ub-fan{from{translate:0 70px;rotate:z 4deg;scale:.9}}
/* sonsuz parıltı: footer yazısı, bölüm etiketleri */
.ub-mega{background:linear-gradient(100deg,#2f6bff44 20%,#9676e9aa 45%,#28b68a88 55%,#2f6bff44 80%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;animation:ub-sheen 9s linear infinite}
@keyframes ub-sheen{to{background-position:-250% 0}}
/* Web3: düğümler sırayla yanar */
.infra-nodes>div{animation:ub-node 4.5s ease-in-out infinite}.infra-nodes>div:nth-child(2){animation-delay:1.5s}.infra-nodes>div:nth-child(3){animation-delay:3s}
@keyframes ub-node{0%,70%,100%{box-shadow:0 0 0 0 #6f9bff00}20%{box-shadow:0 0 0 1px #6f9bffaa,0 0 38px #2f6bff88;translate:0 -4px}}
.infra-visual .primary{animation:ub-node 4.5s ease-in-out infinite}

/* rota bölümü */
.ub-route{position:relative;padding:clamp(40px,7vw,100px) 0}
.ub-route svg{width:100%;height:auto;overflow:visible}
.ub-route .base{fill:none;stroke:#2f6bff22;stroke-width:6;stroke-linecap:round;stroke-dasharray:2 14}
.ub-route .live{fill:none;stroke:url(#ubg);stroke-width:6;stroke-linecap:round;filter:drop-shadow(0 0 8px #2f6bff88)}
.ub-route .pin circle{fill:#fff;stroke:#2f6bff55;stroke-width:3;transition:all .5s}
.ub-route .pin.on circle{fill:#28b68a;stroke:#28b68a;r:15;filter:drop-shadow(0 0 12px #28b68a)}
.ub-route .pin text{font:600 17px Inter,sans-serif;fill:var(--muted);text-anchor:middle;transition:fill .4s}.ub-route .pin.on text{fill:var(--ink)}
.ub-route .car{filter:drop-shadow(0 6px 10px #2f6bff66)}
html[data-theme=dark] .ub-route .pin circle{fill:#0f1830}
/* 3B sahne */
.ub-3d{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(20px,4vw,60px);align-items:center}
.ub-3d h2{font:700 clamp(30px,4vw,54px)/1.05 "Space Grotesk",sans-serif;letter-spacing:-.03em;margin:.3em 0}
.ub-3d p{color:var(--muted);max-width:44ch}
.ub-cv{position:relative;aspect-ratio:1.25;border-radius:36px;background:radial-gradient(circle at 50% 45%,#2f6bff22,transparent 65%);cursor:grab}
.ub-cv canvas{width:100%!important;height:100%!important;display:block}
.ub-cv small{position:absolute;bottom:12px;left:0;right:0;text-align:center;color:var(--muted);font-size:12px;pointer-events:none}
@media (max-width:860px){.ub-3d{grid-template-columns:1fr}}
/* sandık demosu */
.ub-chest{display:grid;justify-items:center;gap:16px;text-align:center;padding:clamp(28px,5vw,56px);border-radius:36px;border:1px solid var(--line);background:linear-gradient(135deg,#f3f0ff,#eef4ff);position:relative;overflow:hidden}
html[data-theme=dark] .ub-chest{background:linear-gradient(135deg,#17143a,#0e1a33)}
.ub-chest button.cbtn{border:0;background:none;cursor:pointer;padding:0;transition:transform .3s}.ub-chest button.cbtn:hover{transform:scale(1.06) rotate(-3deg)}
.ub-chest img{width:128px;height:128px;filter:drop-shadow(0 18px 24px #8359e955)}
.ub-chest.shake img{animation:ub-shk .6s}
@keyframes ub-shk{20%{rotate:-12deg}40%{rotate:12deg}60%{rotate:-8deg}80%{rotate:6deg}}
.ub-chest h3{font:700 28px "Space Grotesk",sans-serif;margin:0}.ub-chest p{margin:0;color:var(--muted);max-width:44ch}
.ub-xp{width:min(360px,80%);height:12px;border-radius:9px;background:#2f6bff22;overflow:hidden}.ub-xp i{display:block;height:100%;width:var(--w,12%);background:var(--ub-grad);border-radius:9px;transition:width 1.1s cubic-bezier(.22,.8,.25,1)}
.ub-prize{font:700 34px "Space Grotesk",sans-serif;min-height:42px;background:var(--ub-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ub-conf{position:fixed;inset:0;z-index:99990;pointer-events:none;width:100%;height:100%}
/* mobil alt menü */
.ub-dock{display:none}
@media (max-width:760px){
 body{padding-bottom:78px}.back-top{bottom:92px}
 .ub-dock{display:flex;position:fixed;left:12px;right:12px;bottom:max(10px,env(safe-area-inset-bottom));z-index:900;justify-content:space-around;padding:8px;border-radius:26px;background:#ffffffd9;backdrop-filter:blur(18px) saturate(1.6);box-shadow:0 14px 40px #11243b30;border:1px solid #ffffffaa;transition:translate .4s cubic-bezier(.22,.8,.25,1)}
 html[data-theme=dark] .ub-dock{background:#0f1830dd;border-color:#26354f}
 .ub-dock.hide{translate:0 140%}
 .ub-dock a{display:grid;justify-items:center;gap:3px;padding:6px 10px;border-radius:18px;font:600 10.5px Inter,sans-serif;color:var(--muted);text-decoration:none;transition:all .25s}
 .ub-dock a img{width:24px;height:24px}.ub-dock a.on{background:#2f6bff18;color:#2f6bff}
}
/* tema geçişi: tıklanan yerden dairesel açılma */
html.ub-theme-vt::view-transition-old(root),html.ub-theme-vt::view-transition-new(root){animation:none;mix-blend-mode:normal}
html.ub-theme-vt::view-transition-new(root){z-index:2}html.ub-theme-vt::view-transition-old(root){z-index:1}
@media (prefers-reduced-motion:reduce){.ub-mega,.infra-nodes>div,.story-frame,.feature-card::before{animation:none!important}}
