[hidden]{display:none!important}
:root{--bg:#f4f4f8;--surface:#fff;--ink:#1d1d1f;--ink2:#6e6e73;--ink3:#9a9aa1;--line:#e6e6ee;--soft:#f2f2f7;
--a1:#2962ff;--a2:#7c4dff;--ok:#00b85c;--err:#ff2d55;--warn:#ff9f0a;--r:20px;
--font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--sh:0 1px 0 rgba(255,255,255,.9) inset,0 0 0 1px rgba(30,40,120,.06),0 18px 40px -28px rgba(40,50,140,.4)}
*{box-sizing:border-box}html,body{margin:0}
body{font-family:var(--font);background:radial-gradient(60% 50% at 100% 0%,#efe9ff,transparent 60%),radial-gradient(50% 40% at 0% 100%,#e4f6ff,transparent 60%),var(--bg);color:var(--ink);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}
.ic{width:18px;height:18px;flex:none}
.shell{display:grid;grid-template-columns:256px 1fr;min-height:100vh}
.side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:14px;padding:18px 14px;background:rgba(236,236,242,.82);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-right:1px solid rgba(30,40,120,.07)}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;letter-spacing:-.03em;padding:6px 8px 10px}
.brand svg{filter:drop-shadow(0 6px 12px rgba(98,77,255,.4))}
.snav{display:flex;flex-direction:column;gap:2px}
.snav a{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:12px;font-weight:550;color:#3a3a40;transition:background .2s}
.snav a:hover{background:rgba(255,255,255,.6)}
.snav a.on{background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06),0 6px 16px -10px rgba(40,50,140,.35);color:var(--ink)}
.tile{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 6px 12px -6px var(--c1),inset 0 1px 0 rgba(255,255,255,.35);flex:none}
.tile .ic{width:16px;height:16px}
.eng{margin-top:auto;padding:12px;border-radius:16px;background:#fff;box-shadow:var(--sh)}
.eng-h{display:flex;align-items:center;gap:8px;font-size:13px}
.eng small{display:block;color:var(--ink2);font-size:12px;margin-top:2px}
.dot{width:9px;height:9px;border-radius:50%;background:var(--ok);flex:none}
.dot.run{background:var(--a1);animation:pulse 1.6s infinite;color:var(--a1)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(41,98,255,.5)}70%{box-shadow:0 0 0 7px rgba(41,98,255,0)}100%{box-shadow:0 0 0 0 rgba(41,98,255,0)}}
.me{display:flex;align-items:center;gap:10px;padding:8px}
.me b{display:block;font-size:13px}.me small{display:block;font-size:11.5px;color:var(--ink2);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me a{margin-left:auto;color:var(--ink2)}
.av{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;background:linear-gradient(135deg,#7c4dff,#00b8d4);flex:none}
.main{padding:22px 32px 60px;min-width:0}
.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.top h1{margin:0;font-size:30px;letter-spacing:-.035em}
.na{font-size:12px;font-weight:700;color:#fff;padding:5px 11px;border-radius:999px;background:linear-gradient(135deg,#2962ff,#aa00ff 60%,#f50057)}
.banner{padding:12px 16px;border-radius:14px;background:#fff7e6;color:#8a5a00;font-size:13.5px;margin-bottom:14px;box-shadow:inset 0 0 0 1px #f6deaa}
.flash{padding:12px 16px;border-radius:14px;margin-bottom:12px;font-weight:550;font-size:14px}
.flash.ok{background:#e6f9ee;color:#0b7a3e}.flash.err{background:#ffe9ee;color:#b0103a}
.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--surface);border-radius:var(--r);box-shadow:var(--sh);padding:20px;position:relative;overflow:hidden}
.card h2{margin:0 0 4px;font-size:17px;letter-spacing:-.02em}
.card > p.sub{margin:0 0 14px;color:var(--ink2);font-size:13.5px}
.kpi small{display:block;color:var(--ink2);font-size:12.5px}
.kpi b{display:block;font-size:28px;letter-spacing:-.04em;margin-top:2px;font-variant-numeric:tabular-nums}
.kpi .tile{position:absolute;right:16px;top:16px}
.kpi em{font-style:normal;font-size:12px;font-weight:600;color:var(--ok)}
.grad b{background:linear-gradient(90deg,var(--c1),var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}
.row{display:flex;align-items:center;gap:12px}
.list{display:flex;flex-direction:column}
.li{display:flex;align-items:center;gap:12px;padding:12px 2px;border-top:1px solid var(--line)}
.li:first-child{border-top:0}
.li .grow{flex:1;min-width:0}.li b{display:block;font-size:14px}.li small{display:block;color:var(--ink2);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:650;white-space:nowrap}
.chip.ok{background:#e3f8ec;color:#08854a}.chip.err{background:#ffe6ec;color:#c4103f}.chip.run{background:#e8eeff;color:#2346d8}.chip.wait{background:var(--soft);color:var(--ink2)}
.bar{height:8px;border-radius:8px;background:var(--soft);overflow:hidden}
.bar i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,var(--a1),var(--a2),#f50057);transition:width .4s}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:10px 18px;font-weight:650;font-size:14px;cursor:pointer;transition:transform .12s,box-shadow .2s;white-space:nowrap}
.btn:active{transform:scale(.97)}
.btn-pri{color:#fff;background:linear-gradient(135deg,#2962ff,#7c4dff 60%,#aa00ff);box-shadow:0 10px 22px -10px rgba(98,60,255,.8),inset 0 1px 0 rgba(255,255,255,.35)}
.btn-ghost{background:rgba(30,40,120,.06)}
.btn-danger{background:#ffe6ec;color:#c4103f}
.btn-sm{padding:7px 13px;font-size:13px}
.btn[disabled]{opacity:.5;cursor:default}
form.stack{display:grid;gap:12px}
label.f{display:grid;gap:6px;font-size:13px;font-weight:600;color:#3a3a40}
.in,select.in,textarea.in{width:100%;padding:11px 13px;border-radius:12px;border:1px solid var(--line);background:#fafafd;font-size:14.5px;outline:none;transition:border-color .2s,box-shadow .2s}
.in:focus{border-color:#8fa4ff;box-shadow:0 0 0 4px rgba(41,98,255,.12);background:#fff}
.hint{font-size:12.5px;color:var(--ink2);font-weight:500}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.empty{text-align:center;padding:36px 20px;color:var(--ink2)}
.empty b{display:block;color:var(--ink);font-size:17px;margin-bottom:6px}
.kinds{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.kind{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:16px;border:1.5px solid var(--line);background:#fff;cursor:pointer;text-align:left;transition:border-color .2s,box-shadow .2s}
.kind b{font-size:14px}.kind small{font-size:12px;color:var(--ink2)}
.kind.on{border-color:#7c8cff;box-shadow:0 0 0 4px rgba(41,98,255,.1)}
.steps{display:grid;gap:10px;counter-reset:s}
.stp{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;background:var(--soft)}
.stp i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#fff;font-style:normal;font-weight:700;font-size:13px;color:var(--ink2);box-shadow:inset 0 0 0 1.5px var(--line)}
.stp.done i{background:var(--ok);color:#fff;box-shadow:none}
.prog{display:grid;gap:10px}
.prog .nums{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.prog .nums div{padding:12px;border-radius:14px;background:var(--soft)}
.prog .nums small{display:block;font-size:11.5px;color:var(--ink2)}.prog .nums b{font-size:18px;font-variant-numeric:tabular-nums}
.mono{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:12.5px}
.spark{display:flex;align-items:flex-end;gap:5px;height:90px}
.spark i{flex:1;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,#7c4dff,#2962ff);min-height:3px}
.table{width:100%;border-collapse:collapse;font-size:13.5px}
.table th{text-align:left;font-size:12px;color:var(--ink2);font-weight:600;padding:8px 6px;border-bottom:1px solid var(--line)}
.table td{padding:10px 6px;border-bottom:1px solid var(--line)}
.qr{display:grid;place-items:center;padding:16px;background:#fff;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line)}
.tabbar{display:none}
@media (max-width:960px){
  .shell{grid-template-columns:1fr}.side{display:none}
  .main{padding:16px 16px 100px}
  .g4{grid-template-columns:repeat(2,1fr)}.g3,.g2,.two{grid-template-columns:1fr}
  .prog .nums{grid-template-columns:repeat(2,1fr)}
  .tabbar{display:flex;position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));justify-content:space-around;padding:8px 6px;border-radius:22px;background:rgba(255,255,255,.88);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);box-shadow:var(--sh);z-index:20}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;font-weight:600;color:#3a3a40}
  .tabbar .tile{width:28px;height:28px}
}
/* auth pages */
.auth{min-height:100vh;display:grid;place-items:center;padding:24px}
.auth-card{width:min(420px,100%);background:#fff;border-radius:28px;padding:32px;box-shadow:var(--sh)}
.auth-card .brand{justify-content:center;font-size:24px;margin-bottom:6px}
.auth-card h1{text-align:center;font-size:22px;margin:4px 0 4px;letter-spacing:-.03em}
.auth-card p.sub{text-align:center;color:var(--ink2);margin:0 0 22px;font-size:14px}
.auth-card .alt{text-align:center;font-size:13.5px;color:var(--ink2);margin-top:16px}.auth-card .alt a{color:var(--a1);font-weight:650}
#bridgeCard{margin-top:0}
.maint[hidden]{display:none!important}
.vxtoasts{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px;z-index:50;max-width:min(380px,calc(100vw - 36px))}
.vxtoast{padding:12px 16px;border-radius:16px;background:rgba(255,255,255,.96);box-shadow:0 0 0 1px rgba(30,40,120,.08),0 20px 40px -20px rgba(40,50,140,.5);font-size:13.5px;font-weight:600;border-left:4px solid var(--ok);animation:tin .4s cubic-bezier(.2,.9,.3,1.2)}
.vxtoast.err{border-left-color:var(--err)}.vxtoast.info{border-left-color:var(--a1)}.vxtoast.out{opacity:0;transform:translateX(20px);transition:.35s}
@keyframes tin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.kind .tile{margin-bottom:4px}
@media (max-width:960px){.vxtoasts{bottom:96px}}
.oa-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.oa-btn{width:100%;display:flex;align-items:center;gap:10px;padding:12px;border-radius:16px;border:1.5px solid var(--line);background:#fff;cursor:pointer;text-align:left;transition:transform .2s,box-shadow .2s,border-color .2s}
.oa-btn:hover:not([disabled]){transform:translateY(-2px);border-color:color-mix(in srgb,var(--c1) 50%,#fff);box-shadow:0 14px 28px -18px var(--c1)}
.oa-btn[disabled]{opacity:.55;cursor:default}
.oa-btn b{display:block;font-size:14px}.oa-btn small{display:block;font-size:12px;color:var(--ink2)}
@media (max-width:960px){.oa-row{grid-template-columns:1fr}}

/* ===== Ultra premium katman ===== */
.top-sub{display:block;color:var(--ink2);font-size:13px;margin-top:2px}
.top-r{display:flex;align-items:center;gap:10px}
.pulse-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:#fff;box-shadow:var(--sh);font-size:12.5px;font-weight:650}
.pulse-pill i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(0,184,92,.5);animation:pg 2s infinite}
.pulse-pill.run i{background:var(--a1);animation:pb 1.2s infinite}
@keyframes pg{70%{box-shadow:0 0 0 8px rgba(0,184,92,0)}}@keyframes pb{70%{box-shadow:0 0 0 8px rgba(41,98,255,0)}}
.bell-wrap{position:relative}
.bell{position:relative;width:40px;height:40px;border-radius:50%;border:0;background:#fff;box-shadow:var(--sh);display:grid;place-items:center;cursor:pointer;transition:transform .2s}
.bell:hover{transform:translateY(-1px)}.bell .ic{width:19px;height:19px}
.bell.ring .ic{animation:ring .9s cubic-bezier(.36,.07,.19,.97)}
@keyframes ring{10%,90%{transform:rotate(-2deg)}20%,80%{transform:rotate(10deg)}30%,50%,70%{transform:rotate(-14deg)}40%,60%{transform:rotate(14deg)}}
.bell b{position:absolute;top:-3px;right:-3px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:linear-gradient(135deg,#ff2d55,#ff6d00);color:#fff;font-size:11px;display:grid;place-items:center;box-shadow:0 4px 10px -4px #ff2d55;animation:pop .35s cubic-bezier(.2,.9,.3,1.6)}
@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
.npanel{position:absolute;right:0;top:50px;width:min(380px,calc(100vw - 30px));max-height:70vh;overflow:auto;background:rgba(255,255,255,.97);backdrop-filter:blur(24px);border-radius:22px;box-shadow:0 0 0 1px rgba(30,40,120,.07),0 40px 80px -30px rgba(40,50,140,.5);z-index:40;animation:npIn .3s cubic-bezier(.2,.9,.3,1.1);transform-origin:top right}
@keyframes npIn{from{opacity:0;transform:scale(.94) translateY(-6px)}to{opacity:1;transform:none}}
.np-h{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:inherit}
.np-h button{border:0;background:none;color:var(--a1);font-weight:650;font-size:12.5px;cursor:pointer}
.np-it{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);transition:background .2s}
.np-it:hover{background:#f7f8ff}.np-it.new{background:linear-gradient(90deg,#f1f4ff,#fff)}
.np-it i{flex:none;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;color:#fff;font-style:normal;font-size:14px;background:linear-gradient(135deg,#00c853,#00b8d4)}
.np-it.err i{background:linear-gradient(135deg,#ff2d55,#ff6d00)}.np-it.info i{background:linear-gradient(135deg,#2962ff,#aa00ff)}
.np-it b{display:block;font-size:13.5px}.np-it small{display:block;color:var(--ink2);font-size:12.5px}.np-it em{display:block;font-style:normal;color:var(--ink3);font-size:11.5px;margin-top:2px}
.np-empty{padding:30px;text-align:center;color:var(--ink2);font-size:13.5px}
/* dinamik ada */
.island{position:fixed;left:50%;top:12px;z-index:60;display:flex;align-items:center;gap:12px;padding:8px 10px 8px 8px;min-width:0;border-radius:999px;background:#0b0b10;color:#fff;box-shadow:0 20px 40px -18px rgba(0,0,0,.55);transform:translate(-50%,-140%) scale(.6);opacity:0;transition:transform .55s cubic-bezier(.2,.9,.25,1.15),opacity .3s,width .4s}
.island.on{transform:translate(-50%,0) scale(1);opacity:1}
.is-ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2962ff,#aa00ff);flex:none}
.is-ic svg{width:18px;height:18px;color:#fff}
.island.ok .is-ic{background:linear-gradient(135deg,#00c853,#00b8d4)}.island.err .is-ic{background:linear-gradient(135deg,#ff2d55,#ff6d00)}
.is-tx b{display:block;font-size:13.5px;white-space:nowrap;max-width:46vw;overflow:hidden;text-overflow:ellipsis}.is-tx small{display:block;font-size:12px;color:#b9bac8;white-space:nowrap;max-width:46vw;overflow:hidden;text-overflow:ellipsis}
.is-ring{width:30px;height:30px;transform:rotate(-90deg);flex:none}.is-ring circle{fill:none;stroke-width:3.5}.is-ring .bg{stroke:rgba(255,255,255,.14)}.is-ring .fg{stroke:url(#vlg);stroke:#7c8cff;stroke-linecap:round;stroke-dasharray:94.25;stroke-dashoffset:94.25;transition:stroke-dashoffset .5s}
.island.ok .is-ring .fg{stroke:#00e676}
/* cihaz algılandı */
.detect{position:fixed;inset:0;z-index:70;display:grid;place-items:center;background:rgba(244,244,248,.55);backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);animation:dIn .35s ease}
.detect.out{animation:dOut .5s ease forwards}
@keyframes dIn{from{opacity:0}to{opacity:1}}@keyframes dOut{to{opacity:0}}
.dt-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:34px 46px 30px;border-radius:34px;background:rgba(255,255,255,.9);box-shadow:0 0 0 1px rgba(30,40,120,.06),0 60px 120px -40px rgba(60,40,200,.55);animation:cardIn .6s cubic-bezier(.2,.9,.25,1.2)}
.detect.out .dt-card{animation:cardOut .5s cubic-bezier(.6,0,.4,1) forwards}
@keyframes cardIn{from{transform:scale(.7) translateY(30px);opacity:0}to{transform:none;opacity:1}}
@keyframes cardOut{to{transform:translateY(-46vh) scale(.25);opacity:0}}
.dt-stage{position:relative;width:200px;height:200px;display:grid;place-items:center;margin-bottom:10px}
.dt-ring{position:absolute;inset:0;border-radius:50%;border:2px solid transparent;background:conic-gradient(from 0deg,#2962ff,#aa00ff,#f50057,#ff6d00,#00c853,#2962ff) border-box;-webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;animation:wave 2.4s cubic-bezier(.2,.6,.3,1) infinite}
.dt-ring.r2{animation-delay:.6s}.dt-ring.r3{animation-delay:1.2s}
@keyframes wave{0%{transform:scale(.35);opacity:0}25%{opacity:.9}100%{transform:scale(1.15);opacity:0}}
.dt-dev{position:relative;z-index:2;width:84px;height:84px;border-radius:26px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#2962ff,#7c4dff 55%,#d500f9);box-shadow:0 20px 40px -14px rgba(98,60,255,.8),inset 0 1px 0 rgba(255,255,255,.4);animation:devIn .7s cubic-bezier(.2,.9,.25,1.4),float 3s ease-in-out .7s infinite}
.dt-dev svg{width:42px;height:42px}
@keyframes devIn{from{transform:translateY(60px) rotate(-12deg) scale(.4);opacity:0}to{transform:none;opacity:1}}
@keyframes float{50%{transform:translateY(-6px)}}
.dt-spark{position:absolute;width:8px;height:8px;border-radius:50%;background:#7c4dff;box-shadow:0 0 12px #7c4dff;animation:orbit 2.6s linear infinite}
.dt-spark.s2{background:#f50057;box-shadow:0 0 12px #f50057;animation-delay:-.65s}.dt-spark.s3{background:#00c853;box-shadow:0 0 12px #00c853;animation-delay:-1.3s}.dt-spark.s4{background:#ffab00;box-shadow:0 0 12px #ffab00;animation-delay:-1.95s}
@keyframes orbit{from{transform:rotate(0) translateX(78px) rotate(0)}to{transform:rotate(360deg) translateX(78px) rotate(-360deg)}}
.dt-card b{font-size:22px;letter-spacing:-.03em}.dt-card small{color:var(--ink2);font-size:14px}
/* kip */
.modal{position:fixed;inset:0;z-index:65;display:grid;place-items:center;background:rgba(20,20,40,.28);backdrop-filter:blur(8px);animation:dIn .25s}
.md-card{width:min(440px,calc(100vw - 30px));background:#fff;border-radius:26px;padding:24px;box-shadow:0 50px 100px -40px rgba(40,50,140,.6);animation:cardIn .4s cubic-bezier(.2,.9,.25,1.15)}
.md-card h2{margin:0 0 4px;font-size:19px;letter-spacing:-.02em}
/* giriş animasyonları */
.main .card{animation:rise .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 55ms)}
@keyframes rise{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.card{transition:box-shadow .3s,transform .3s}
.kpi:hover,.oa-btn:hover{transform:translateY(-2px)}
.snav a .tile{transition:transform .3s cubic-bezier(.2,.9,.3,1.4)}.snav a:hover .tile,.snav a.on .tile{transform:scale(1.08) rotate(-4deg)}
/* panonun canlı katmanı */
.hero-card{position:relative;overflow:hidden;color:#fff;background:linear-gradient(135deg,#2962ff,#7c4dff 50%,#d500f9)!important;box-shadow:0 30px 60px -30px rgba(98,60,255,.8)!important}
.hero-card::before,.hero-card::after{content:"";position:absolute;border-radius:50%;filter:blur(40px);opacity:.55;animation:drift 14s ease-in-out infinite alternate}
.hero-card::before{width:260px;height:260px;background:#00e5ff;right:-60px;top:-80px}.hero-card::after{width:220px;height:220px;background:#ff4081;left:30%;bottom:-120px;animation-delay:-5s}
@keyframes drift{to{transform:translate(-30px,20px) scale(1.15)}}
.hero-card > *{position:relative;z-index:1}
.hero-card h2{font-size:24px;letter-spacing:-.03em}.hero-card .sub{color:rgba(255,255,255,.85)!important}
.hero-card .btn-ghost{background:rgba(255,255,255,.18);color:#fff}
.flow{position:relative;height:56px;margin-top:14px;border-radius:16px;background:rgba(255,255,255,.12);overflow:hidden}
.flow i{position:absolute;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:3px;background:#fff;opacity:0;animation:fl 2.8s cubic-bezier(.5,0,.5,1) infinite;box-shadow:0 0 12px rgba(255,255,255,.8)}
.flow i:nth-child(2){animation-delay:.5s;width:14px}.flow i:nth-child(3){animation-delay:1s}.flow i:nth-child(4){animation-delay:1.5s;width:8px}.flow i:nth-child(5){animation-delay:2s}.flow i:nth-child(6){animation-delay:2.4s;width:12px}
@keyframes fl{0%{left:3%;opacity:0;transform:scale(.6)}15%{opacity:1;transform:none}85%{opacity:1}100%{left:94%;opacity:0;transform:scale(.6) rotate(90deg)}}
.flow span{position:absolute;top:50%;transform:translateY(-50%);font-size:11.5px;font-weight:700;color:rgba(255,255,255,.9)}.flow .a{left:12px}.flow .b{right:12px}
.rings{display:flex;gap:18px;align-items:center}
.ring2{position:relative;width:96px;height:96px;flex:none}.ring2 svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring2 circle{fill:none;stroke-width:9}.ring2 .bg{stroke:var(--soft)}.ring2 .fg{stroke-linecap:round;stroke-dasharray:251.3;stroke-dashoffset:251.3;transition:stroke-dashoffset 1.6s cubic-bezier(.2,.8,.2,1)}
.ring2 b{position:absolute;inset:0;display:grid;place-items:center;font-size:19px;letter-spacing:-.03em}
.ring-l small{display:block;color:var(--ink2);font-size:12.5px}.ring-l b{font-size:15px}
@media (prefers-reduced-motion:reduce){.main .card,.dt-dev,.dt-ring,.dt-spark,.flow i,.hero-card::before,.hero-card::after{animation:none!important}.dt-ring{opacity:.5}}
@media (max-width:960px){.pulse-pill,.top .na{display:none}.top{align-items:flex-start}}
.grow{flex:1;min-width:0}
/* ===== Pano: zengin grafikler ===== */
.dash-top{display:grid;grid-template-columns:1fr 280px;gap:16px}
.dash-2{grid-template-columns:1.35fr 1fr;align-items:start}
.gauge-card{display:flex;flex-direction:column;align-items:center;justify-content:center}
.gauge{width:100%;max-width:220px}.gauge path{fill:none;stroke-width:14;stroke-linecap:round}
.g-bg{stroke:var(--soft2,#ebebf1)}.g-fg{stroke:url(#gg);stroke-dasharray:100;stroke-dashoffset:100;animation:gfill 1.8s cubic-bezier(.2,.8,.2,1) .2s forwards}
@keyframes gfill{to{stroke-dashoffset:calc(100 - var(--v))}}
.g-val{margin-top:-58px;text-align:center}.g-val b{display:block;font-size:34px;letter-spacing:-.05em}.g-val small{color:var(--ink2);font-size:12.5px}
.ring2.sm{width:70px;height:70px}.ring2.sm b{font-size:15px}
.setup-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:14px}
.ss{position:relative;display:flex;flex-direction:column;gap:2px;padding:14px;border-radius:16px;background:var(--soft);transition:transform .25s,box-shadow .25s}
.ss:hover{transform:translateY(-2px)}.ss i{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800;color:#fff;background:#d1d1db;margin-bottom:6px}
.ss b{font-size:13.5px}.ss small{font-size:12px;color:var(--ink2)}
.ss.done i{background:linear-gradient(135deg,#00c853,#00b8d4)}.ss.done{opacity:.75}
.ss.cur{background:linear-gradient(135deg,#eef1ff,#f7eeff);box-shadow:0 0 0 2px #7c4dff inset,0 14px 30px -18px rgba(124,77,255,.8)}
.ss.cur i{background:linear-gradient(135deg,#2962ff,#aa00ff);animation:pb 1.4s infinite}
.area{width:100%;height:190px;margin-top:10px;overflow:visible}.area .gl{stroke:var(--line);stroke-dasharray:3 5}
.a-line{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2s cubic-bezier(.4,0,.2,1) .2s forwards;filter:drop-shadow(0 6px 10px rgba(124,77,255,.35))}
.a-fill{opacity:0;animation:fadeA 1s ease 1.2s forwards}
@keyframes draw{to{stroke-dashoffset:0}}@keyframes fadeA{to{opacity:1}}
.ax{display:flex;justify-content:space-between;font-size:11.5px;color:var(--ink3)}
.donut-wrap{position:relative;width:200px;height:200px;margin:4px auto 10px}
.donut{width:100%;height:100%;transform:rotate(-90deg)}.donut circle{fill:none;stroke-width:16}
.d-bg{stroke:var(--soft)}.d-seg{stroke-dasharray:0 100;stroke-dashoffset:var(--off);stroke-linecap:butt;animation:seg 1.2s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:var(--d)}
@keyframes seg{to{stroke-dasharray:var(--len) 100}}
.d-c{position:absolute;inset:0;display:grid;place-items:center;align-content:center;text-align:center}.d-c b{font-size:20px;letter-spacing:-.03em}.d-c small{color:var(--ink2);font-size:12px}
.legend2{display:grid;gap:8px}.legend2 span{display:flex;align-items:center;gap:8px;font-size:13px}.legend2 i{width:10px;height:10px;border-radius:3px}.legend2 em{margin-left:auto;font-style:normal;color:var(--ink2);font-variant-numeric:tabular-nums}
.heat{display:grid;grid-template-rows:repeat(7,1fr);grid-auto-flow:column;grid-auto-columns:1fr;gap:5px;margin-top:12px}
.heat i{aspect-ratio:1;border-radius:5px;background:var(--soft);opacity:0;transform:scale(.4);animation:hpop .45s cubic-bezier(.2,.9,.3,1.4) forwards;animation-delay:calc(var(--i) * 9ms)}
.heat .h1{background:#d6dcff}.heat .h2{background:#9fa9ff}.heat .h3{background:#7c4dff}.heat .h4{background:linear-gradient(135deg,#aa00ff,#f50057)}
@keyframes hpop{to{opacity:1;transform:none}}
.heat-l{display:flex;align-items:center;gap:5px;justify-content:flex-end;margin-top:10px;font-size:11.5px;color:var(--ink3)}.heat-l i{width:12px;height:12px;border-radius:3px;background:var(--soft)}
.heat-l .h1{background:#d6dcff}.heat-l .h2{background:#9fa9ff}.heat-l .h3{background:#7c4dff}.heat-l .h4{background:linear-gradient(135deg,#aa00ff,#f50057)}
.dev-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dv{position:relative;display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:16px;background:var(--soft);transition:transform .25s}
.dv:hover{transform:translateY(-2px)}.dv b{font-size:13.5px}.dv small{font-size:12px;color:var(--ink2)}
.dv-dot{position:absolute;top:14px;right:14px;width:9px;height:9px;border-radius:50%;background:#c7c7d1}
.dv.on .dv-dot{background:var(--ok);box-shadow:0 0 0 0 rgba(0,184,92,.5);animation:pg 2s infinite}
.tl{position:relative;padding-left:18px}.tl::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;border-radius:2px;background:linear-gradient(#7c4dff,#00b8d4)}
.tl-i{position:relative;display:block;padding:8px 0 12px}.tl-i i{position:absolute;left:-18px;top:12px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #7c4dff}
.tl-i b{display:block;font-size:13.5px}.tl-i small{color:var(--ink2);font-size:12px}
/* ===== Kurulum sihirbazı ===== */
.wiz{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:16px;background:radial-gradient(60% 60% at 20% 10%,rgba(124,77,255,.35),transparent 60%),radial-gradient(50% 50% at 90% 90%,rgba(0,184,212,.3),transparent 60%),rgba(244,244,248,.7);backdrop-filter:blur(18px) saturate(170%);-webkit-backdrop-filter:blur(18px) saturate(170%);animation:dIn .4s}
.wiz.out{animation:dOut .5s forwards}
.wz-card{position:relative;width:min(760px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#fff;border-radius:32px;padding:30px 30px 24px;box-shadow:0 60px 120px -40px rgba(60,40,200,.55);animation:cardIn .6s cubic-bezier(.2,.9,.25,1.15)}
.wz-prog{height:6px;border-radius:6px;background:var(--soft);overflow:hidden;margin-bottom:22px}.wz-prog i{display:block;height:100%;width:8%;border-radius:6px;background:linear-gradient(90deg,#2962ff,#aa00ff,#f50057);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.wz-step{display:none}.wz-step.on{display:block;animation:stepIn .5s cubic-bezier(.2,.9,.3,1.05)}
@keyframes stepIn{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
.wz-step h2{font-size:26px;letter-spacing:-.035em;margin:0 0 6px}.wz-step .sub{font-size:15px}
.wz-art{position:relative;width:170px;height:170px;margin:0 auto 18px;display:grid;place-items:center}.wz-art .dt-dev{background:#fff;box-shadow:0 20px 40px -14px rgba(98,60,255,.6)}
.wz-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}
.wz-opts button{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:16px;border-radius:20px;border:2px solid var(--line);background:#fff;cursor:pointer;text-align:left;transition:transform .2s,border-color .2s,box-shadow .25s}
.wz-opts button .tile{background:linear-gradient(135deg,var(--c1),var(--c2));width:38px;height:38px;border-radius:12px}
.wz-opts button b{font-size:14.5px}.wz-opts button small{font-size:12px;color:var(--ink2)}
.wz-opts button:hover{transform:translateY(-2px)}
.wz-opts button.on{border-color:transparent;box-shadow:0 0 0 2px var(--c1),0 18px 34px -20px var(--c1)}
.wz-opts button.on::after{content:"✓";position:absolute;top:12px;right:12px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:13px;background:linear-gradient(135deg,var(--c1),var(--c2));animation:pop .3s cubic-bezier(.2,.9,.3,1.6)}
.wz-nav{display:flex;justify-content:space-between;gap:10px;margin-top:18px}
.wz-plan{display:grid;gap:10px;margin-top:16px;counter-reset:wp}
.wp{display:flex;align-items:center;gap:14px;padding:14px;border-radius:18px;background:var(--soft);opacity:0;animation:stepIn .45s cubic-bezier(.2,.9,.3,1.05) forwards;animation-delay:calc(var(--i) * 90ms)}
.wp::before{counter-increment:wp;content:counter(wp);width:30px;height:30px;flex:none;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--c1,#2962ff),var(--c2,#aa00ff))}
.wp b{display:block;font-size:14px}.wp small{display:block;font-size:12.5px;color:var(--ink2)}.wp .btn{margin-left:auto}
.confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:32px}
.confetti i{position:absolute;top:-12px;width:9px;height:14px;border-radius:3px;animation:conf 1.8s cubic-bezier(.2,.6,.4,1) forwards}
@keyframes conf{to{transform:translate(var(--x),110vh) rotate(var(--r));opacity:.9}}
@media (max-width:960px){.dash-top,.dash-2{grid-template-columns:1fr}.setup-steps{grid-template-columns:repeat(2,1fr)}.wz-opts{grid-template-columns:1fr 1fr}.dev-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.a-line,.a-fill,.d-seg,.heat i,.g-fg,.wp,.wz-step.on{animation-duration:.01ms!important;animation-delay:0s!important}}
/* ===== Sihirbaz sahneleri ===== */
.wz-opts button[disabled]{opacity:.45;cursor:default;transform:none!important}
.scene{position:relative;height:210px;margin:-6px 0 14px;border-radius:24px;background:linear-gradient(160deg,#f1f3ff,#fbf1ff 55%,#eafaf8);overflow:hidden}
.sc-glow{position:absolute;inset:-30%;background:radial-gradient(30% 30% at 30% 40%,rgba(124,77,255,.25),transparent 70%),radial-gradient(30% 30% at 75% 35%,rgba(0,184,212,.25),transparent 70%);animation:drift 12s ease-in-out infinite alternate}
.sc-path{position:absolute;inset:0;width:100%;height:100%}.sc-path path{fill:none;stroke:#b9bff5;stroke-width:2;stroke-dasharray:6 8;animation:dash 1.6s linear infinite}
@keyframes dash{to{stroke-dashoffset:-28}}
.dv-phone{position:absolute;left:9%;bottom:26px;width:62px;height:118px;border-radius:16px;background:#1b1c20;padding:5px;box-shadow:0 20px 30px -16px rgba(0,0,0,.45);z-index:2;animation:float 4s ease-in-out infinite}
.dv-phone .scr{height:100%;border-radius:12px;background:linear-gradient(160deg,#e9edff,#fff);display:grid;grid-template-columns:repeat(2,1fr);gap:4px;padding:8px 6px;align-content:start}
.dv-phone .scr i{aspect-ratio:1;border-radius:4px;background:linear-gradient(135deg,#ffd6a5,#ff8a3d 50%,#e5488f)}.dv-phone .scr i:nth-child(2n){background:linear-gradient(135deg,#a0c4ff,#6c8cff)}.dv-phone .scr i:nth-child(3n){background:linear-gradient(135deg,#b9fbc0,#58c98a)}
.dv-laptop{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);width:160px;z-index:2}
.dv-laptop .scr{height:98px;border-radius:10px 10px 4px 4px;background:#1b1c20;padding:6px}.dv-laptop .scr .lg{height:100%;border-radius:6px;background:linear-gradient(160deg,#fff,#eef1ff);display:grid;place-items:center}
.dv-laptop .lg svg{animation:float 3s ease-in-out infinite}
.dv-laptop .base{height:9px;margin:0 -14px;border-radius:0 0 12px 12px;background:linear-gradient(#d7d9e3,#b8bbc8)}
.dv-cloud{position:absolute;right:8%;top:30px;width:120px;height:66px;border-radius:40px;background:linear-gradient(135deg,#2962ff,#00b8d4);box-shadow:0 20px 34px -16px rgba(41,98,255,.6);z-index:2;display:grid;place-items:center;animation:float 5s ease-in-out .6s infinite}
.dv-cloud span{position:absolute;width:56px;height:56px;border-radius:50%;background:inherit;top:-24px;left:22px}.dv-cloud b{position:relative;color:#fff;font-size:12.5px}
.fly{position:absolute;z-index:3;width:16px;height:20px;border-radius:4px;background:linear-gradient(135deg,#7c4dff,#f50057);box-shadow:0 6px 12px -4px rgba(124,77,255,.6);opacity:0;animation:hop 3.6s cubic-bezier(.45,0,.55,1) infinite}
.fly.f2{animation-delay:.9s;background:linear-gradient(135deg,#00c853,#00b8d4)}.fly.f3{animation-delay:1.8s;background:linear-gradient(135deg,#ffab00,#ff3d00)}.fly.f4{animation-delay:2.7s}
@keyframes hop{0%{left:13%;top:62%;opacity:0;transform:scale(.6)}10%{opacity:1;transform:none}45%{left:47%;top:30%}55%{left:50%;top:52%;transform:scale(.8)}62%{left:52%;top:40%;transform:none}92%{left:80%;top:22%;opacity:1}100%{left:83%;top:24%;opacity:0;transform:scale(.4)}}
.lock-scene{position:relative;width:150px;height:150px;margin:0 auto 14px;display:grid;place-items:center}
.ls-ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 55%,#7c4dff 85%,#f50057 100%);-webkit-mask:radial-gradient(circle,transparent 66px,#000 67px);mask:radial-gradient(circle,transparent 66px,#000 67px);animation:spin 2.4s linear infinite}
.ls-lock{width:78px;height:78px;border-radius:24px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#2962ff,#7c4dff 60%,#aa00ff);box-shadow:0 20px 40px -14px rgba(98,60,255,.7);animation:float 3s ease-in-out infinite}.ls-lock .ic{width:34px;height:34px}
.ls-bit{position:absolute;font:700 11px ui-monospace,Menlo,monospace;color:#7c4dff;font-style:normal;opacity:0;animation:bit 2.8s ease-in-out infinite}
.ls-bit.b1{left:-6px;top:30px}.ls-bit.b2{right:-14px;top:40px;animation-delay:.7s;color:#f50057}.ls-bit.b3{left:4px;bottom:24px;animation-delay:1.4s;color:#00b8d4}.ls-bit.b4{right:0;bottom:30px;animation-delay:2.1s}
@keyframes bit{0%{opacity:0;transform:translateY(8px)}30%,60%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-10px)}}
.vault-scene{display:flex;align-items:center;justify-content:center;gap:0;height:150px;margin:-4px 0 12px;border-radius:24px;background:linear-gradient(160deg,#f1f3ff,#fbf1ff 55%,#eafaf8)}
.vs-src{width:70px;height:70px;border-radius:22px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#ffab00,#ff3d00);box-shadow:0 16px 30px -14px rgba(255,61,0,.6)}.vs-src .ic{width:32px;height:32px}
.vs-lane{position:relative;width:200px;height:40px}.vs-lane::before{content:"";position:absolute;left:8px;right:8px;top:50%;border-top:2px dashed #c9cdf0}
.vs-lane i{position:absolute;top:50%;left:0;width:14px;height:18px;margin-top:-9px;border-radius:4px;background:linear-gradient(135deg,#7c4dff,#f50057);opacity:0}
.vault-scene.run .vs-lane i{animation:lane 1.8s cubic-bezier(.5,0,.5,1) infinite}.vault-scene.run .vs-lane i:nth-child(2){animation-delay:.35s}.vault-scene.run .vs-lane i:nth-child(3){animation-delay:.7s}.vault-scene.run .vs-lane i:nth-child(4){animation-delay:1.05s}.vault-scene.run .vs-lane i:nth-child(5){animation-delay:1.4s}
@keyframes lane{0%{left:0;opacity:0;transform:scale(.6)}15%{opacity:1;transform:none}85%{opacity:1}100%{left:calc(100% - 14px);opacity:0;transform:scale(.5) rotate(90deg)}}
.vs-vault{position:relative;width:96px;height:96px;border-radius:30px;display:grid;place-items:center;background:#0b0b10;box-shadow:0 20px 40px -16px rgba(0,0,0,.5)}
.vs-ring{position:absolute;inset:8px;width:80px;height:80px;transform:rotate(-90deg)}.vs-ring circle{fill:none;stroke-width:3.5}.vs-ring .bg{stroke:rgba(255,255,255,.14)}.vs-ring .fg{stroke:#8f9bff;stroke-linecap:round;stroke-dasharray:94.25;stroke-dashoffset:94.25;transition:stroke-dashoffset .4s}
.vault-scene.ok .vs-ring .fg{stroke:#00e676}
.vs-vault b{position:relative;color:#fff;font-size:16px}
.done-scene{position:relative;width:130px;height:130px;margin:0 auto 12px;display:grid;place-items:center}
.dn-burst{position:absolute;inset:0;border-radius:50%;background:conic-gradient(#2962ff,#aa00ff,#f50057,#ff6d00,#00c853,#00b8d4,#2962ff);filter:blur(16px);opacity:.55;animation:spin 6s linear infinite}
.dn-check{position:relative;width:86px;height:86px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#00c853,#00b8d4);box-shadow:0 20px 40px -14px rgba(0,200,83,.7);animation:pop .6s cubic-bezier(.2,.9,.3,1.6)}.dn-check .ic{width:42px;height:42px}
@media (max-width:700px){.scene{height:180px}.dv-laptop{width:120px}.dv-cloud{width:96px;right:4%}.vs-lane{width:110px}}
/* ===== Ekranlar: geçişler (Chrome/Edge, NativeAir) ===== */
@view-transition{navigation:auto}
.side{view-transition-name:vx-side}.top{view-transition-name:vx-top}.main{view-transition-name:vx-screen}
::view-transition-old(vx-screen){animation:scrOut .28s cubic-bezier(.4,0,1,1) both}
::view-transition-new(vx-screen){animation:scrIn .55s cubic-bezier(.2,.8,.2,1) both}
::view-transition-old(root),::view-transition-new(root){animation:none}
@keyframes scrOut{to{opacity:0;transform:translateY(-10px) scale(.99);filter:blur(4px)}}
@keyframes scrIn{from{opacity:0;transform:translateY(22px) scale(.985);filter:blur(8px)}}
/* ===== Ekran sahneleri ===== */
.sh{position:relative;display:flex;align-items:center;gap:20px;min-height:150px;margin-bottom:18px;padding:22px 26px;border-radius:26px;color:#fff;overflow:hidden;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 30px 60px -32px var(--c1);animation:rise .6s cubic-bezier(.2,.8,.2,1) both}
.sh::before{content:"";position:absolute;width:320px;height:320px;right:-80px;top:-140px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.35),transparent 70%);animation:drift 12s ease-in-out infinite alternate}
.sh-tx{position:relative;flex:1;min-width:0}.sh-tx h2{margin:0 0 6px;font-size:30px;letter-spacing:-.04em}.sh-tx p{margin:0;max-width:56ch;color:rgba(255,255,255,.88);font-size:14.5px}
.sh-scene{position:relative;width:300px;height:110px;flex:none}
.sh .ic{width:22px;height:22px}
.sh-lane{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between}
.sh-box{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);backdrop-filter:blur(6px)}
.sh-box.b{background:#0b0b10;box-shadow:0 10px 24px -10px rgba(0,0,0,.5)}
.sh-lane i{position:absolute;left:70px;top:50%;width:14px;height:17px;margin-top:-8px;border-radius:4px;background:#fff;opacity:0;animation:shl 2.2s cubic-bezier(.5,0,.5,1) infinite}
.sh-lane i:nth-of-type(2){animation-delay:.55s}.sh-lane i:nth-of-type(3){animation-delay:1.1s}.sh-lane i:nth-of-type(4){animation-delay:1.65s}
@keyframes shl{0%{left:70px;opacity:0;transform:scale(.6)}15%{opacity:1;transform:none}85%{opacity:1}100%{left:215px;opacity:0;transform:scale(.5) rotate(90deg)}}
.sh-orbit{position:absolute;inset:0;display:grid;place-items:center}
.sh-core{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;background:#0b0b10;z-index:2;animation:float 3s ease-in-out infinite}
.sh-orbit .o{position:absolute;width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.25);box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);animation:orb 6s linear infinite}
.sh-orbit .o .ic{width:17px;height:17px}.sh-orbit .o2{animation-delay:-2s}.sh-orbit .o3{animation-delay:-4s}
@keyframes orb{from{transform:rotate(0) translateX(96px) rotate(0)}to{transform:rotate(360deg) translateX(96px) rotate(-360deg)}}
.sh-orbit .w{position:absolute;width:70px;height:70px;border-radius:50%;border:2px solid rgba(255,255,255,.6);animation:wave 2.4s ease-out infinite}.sh-orbit .w2{animation-delay:1.2s}
.sh-plug{position:absolute;inset:0}
.sh-plug .port{position:absolute;right:30px;top:32px;width:70px;height:46px;border-radius:14px;background:#0b0b10;box-shadow:inset 0 0 0 3px rgba(255,255,255,.12)}
.sh-plug .plug{position:absolute;left:30px;top:30px;width:90px;height:50px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.95);color:var(--c1);animation:plugin 3s cubic-bezier(.6,0,.3,1) infinite}
@keyframes plugin{0%,15%{transform:translateX(0)}45%,80%{transform:translateX(118px)}100%{transform:translateX(0)}}
.sh-plug .spark{position:absolute;right:58px;top:46px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 0 22px 8px rgba(255,255,255,.8);opacity:0;animation:spk 3s ease infinite}
@keyframes spk{0%,44%{opacity:0;transform:scale(.4)}50%{opacity:1;transform:scale(1.3)}70%,100%{opacity:0;transform:scale(2)}}
.sh-sync{position:absolute;inset:0}
.sh-sync .disk{position:absolute;left:20px;top:28px;width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#0b0b10}
.sh-sync .cl{position:absolute;width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.25);box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.sh-sync .c1{right:24px;top:4px;animation:float 4s ease-in-out infinite}.sh-sync .c2{right:70px;bottom:2px;animation:float 4s ease-in-out -2s infinite}
.sh-sync .arc{position:absolute;left:78px;top:20px;width:150px;height:70px;border:2px dashed rgba(255,255,255,.6);border-left:0;border-bottom:0;border-radius:0 60px 0 0;animation:dashm 1.6s linear infinite}
.sh-sync .dot{position:absolute;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 12px #fff;offset-path:path("M88 40 C150 0 200 0 250 30");animation:mv2 2.2s linear infinite}.sh-sync .d2{animation-delay:1.1s}
@keyframes mv2{from{offset-distance:0%}to{offset-distance:100%}}
.sh-clock{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:24px}
.sh-clock .face{position:relative;width:84px;height:84px;border-radius:50%;background:#0b0b10;box-shadow:inset 0 0 0 4px rgba(255,255,255,.15)}
.sh-clock .face i{position:absolute;left:50%;bottom:50%;width:3px;border-radius:3px;background:#fff;transform-origin:bottom}
.sh-clock .hh{height:22px;margin-left:-1.5px;animation:spin 24s linear infinite}.sh-clock .mm{height:32px;margin-left:-1.5px;background:var(--c1)!important;animation:spin 3s linear infinite}
.sh-clock .bars{display:flex;flex-direction:column;gap:8px;width:120px}.sh-clock .bars i{height:9px;border-radius:9px;background:rgba(255,255,255,.3);position:relative;overflow:hidden}
.sh-clock .bars i::after{content:"";position:absolute;inset:0;width:0;border-radius:9px;background:#fff;animation:barf 2.8s ease-in-out infinite}
.sh-clock .bars i:nth-child(2)::after{animation-delay:.4s}.sh-clock .bars i:nth-child(3)::after{animation-delay:.8s}.sh-clock .bars i:nth-child(4)::after{animation-delay:1.2s}
@keyframes barf{0%{width:0}60%,100%{width:100%}}
.sh-rewind{position:absolute;inset:0;display:grid;place-items:center}
.sh-rewind .ring{position:absolute;border-radius:50%;border:3px solid transparent;border-top-color:#fff;border-left-color:rgba(255,255,255,.5)}
.sh-rewind .r1{width:96px;height:96px;animation:spin 2.4s linear infinite reverse}.sh-rewind .r2{width:70px;height:70px;animation:spin 1.6s linear infinite}
.sh-rewind .core{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#0b0b10}
.sh-rewind .tk{position:absolute;width:8px;height:8px;border-radius:50%;background:#fff;opacity:.8}.sh-rewind .t1{left:30px;top:20px;animation:float 3s infinite}.sh-rewind .t2{right:40px;top:60px;animation:float 3s -1s infinite}.sh-rewind .t3{left:60px;bottom:10px;animation:float 3s -2s infinite}
.sh-sliders{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:16px;padding-left:40px}
.sh-sliders span{position:relative;width:200px;height:8px;border-radius:8px;background:rgba(255,255,255,.3)}
.sh-sliders i{position:absolute;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;background:#fff;box-shadow:0 4px 10px rgba(0,0,0,.25);animation:sld 4s ease-in-out infinite}
.sh-sliders span:nth-child(2) i{animation-delay:-1.3s}.sh-sliders span:nth-child(3) i{animation-delay:-2.6s}
@keyframes sld{0%,100%{left:10%}50%{left:80%}}
@media (max-width:960px){.sh{flex-direction:column;align-items:flex-start}.sh-scene{width:100%;max-width:300px;margin:0 auto}}
@media (prefers-reduced-motion:reduce){.sh *{animation:none!important}}
@keyframes dashm{50%{opacity:.55}}
.main:has(.sh) .top h1{font-size:20px;color:var(--ink2)}
.buy{display:flex;flex-direction:column;gap:6px}
.buy .price{font-size:26px;font-weight:800;letter-spacing:-.04em}.buy .price small{font-size:12.5px;color:var(--ink2);font-weight:500}
.buy ul{list-style:none;margin:6px 0 10px;padding:0;display:grid;gap:5px;font-size:13px;color:#3a3a40}.buy li::before{content:"✓ ";color:var(--ok);font-weight:800}
.buy.cur{box-shadow:0 0 0 2px #7c4dff,var(--sh)}

/* =====================================================================
   VERİSYON OS — premium tasarım katmanı (Apple Silicon)
   ===================================================================== */
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/inter-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/inter-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{
  --font:"Inter",-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI Variable Text","Segoe UI",Roboto,sans-serif;
  --ink:#0d0d12;--ink2:#5f6070;--ink3:#9a9bab;--line:rgba(16,18,40,.08);--soft:#f3f3f8;--soft2:#ebebf3;
  --glass:rgba(255,255,255,.62);--glass2:rgba(255,255,255,.82);
  --sh:0 1px 1px rgba(16,18,40,.03),0 2px 6px -2px rgba(16,18,40,.06),0 18px 44px -26px rgba(40,46,140,.32);
  --sh-hi:0 1px 1px rgba(16,18,40,.04),0 10px 24px -10px rgba(16,18,40,.12),0 40px 80px -40px rgba(60,50,180,.45);
  --r:24px;
}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font);font-size:14.5px;line-height:1.5;letter-spacing:-.006em;font-feature-settings:"cv05","cv08","ss03","tnum" 0;color:var(--ink);
  background:#eef0f7 fixed;background-image:
   radial-gradient(42% 46% at 6% 4%,rgba(124,77,255,.22),transparent 70%),
   radial-gradient(38% 42% at 96% 8%,rgba(0,184,212,.20),transparent 70%),
   radial-gradient(46% 50% at 80% 100%,rgba(245,0,87,.12),transparent 70%),
   radial-gradient(40% 46% at 20% 96%,rgba(41,98,255,.16),transparent 70%)}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
h1,h2,h3,b,strong{font-weight:650}
/* pencere düzeni */
.shell{position:relative;z-index:1;grid-template-columns:264px 1fr;gap:14px;padding:14px;min-height:100vh}
.side{top:14px;height:calc(100vh - 28px);border-radius:28px;padding:20px 14px 14px;background:var(--glass);backdrop-filter:saturate(190%) blur(28px);-webkit-backdrop-filter:saturate(190%) blur(28px);border:1px solid rgba(255,255,255,.7);box-shadow:var(--sh),inset 0 1px 0 rgba(255,255,255,.9)}
.brand{font-size:20px;font-weight:750;letter-spacing:-.04em;padding:2px 10px 14px}
.snav{gap:1px;overflow:auto;margin:0 -4px;padding:0 4px}
.snav-l{display:block;margin:14px 12px 6px;font-size:11px;font-weight:650;letter-spacing:.04em;color:var(--ink3);text-transform:uppercase}
.snav a{padding:7px 10px;border-radius:14px;font-size:14px;font-weight:550;letter-spacing:-.01em;color:#2b2c38;transition:background .25s,box-shadow .25s,transform .2s}
.snav a:hover{background:rgba(255,255,255,.7)}
.snav a.on{background:#fff;color:var(--ink);box-shadow:0 1px 1px rgba(16,18,40,.04),0 8px 18px -10px rgba(40,46,140,.45)}
.tile{width:32px;height:32px;border-radius:10px;position:relative;overflow:hidden;box-shadow:0 6px 14px -6px var(--c1),inset 0 1px 0 rgba(255,255,255,.5),inset 0 -6px 12px rgba(0,0,0,.08)}
.tile::after{content:"";position:absolute;inset:0 0 50% 0;background:linear-gradient(180deg,rgba(255,255,255,.35),transparent)}
.tile .ic{position:relative;z-index:1;width:17px;height:17px}
.eng{border-radius:18px;background:rgba(255,255,255,.75);box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),0 8px 20px -14px rgba(40,46,140,.4)}
.me{border-top:1px solid var(--line);margin-top:6px;padding-top:12px}
.main{position:relative;padding:0;border-radius:32px;background:var(--glass2);backdrop-filter:saturate(180%) blur(30px);-webkit-backdrop-filter:saturate(180%) blur(30px);border:1px solid rgba(255,255,255,.75);box-shadow:var(--sh);min-height:calc(100vh - 28px)}
.main > *:not(.top){margin-left:30px;margin-right:30px}
.main > :last-child{margin-bottom:30px}
.top{position:sticky;top:14px;z-index:15;margin:0 0 18px;padding:20px 30px 16px;border-radius:32px 32px 0 0;background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.7));backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border-bottom:1px solid var(--line)}
.top h1{font-size:30px;font-weight:750;letter-spacing:-.045em;line-height:1.1}
.main:has(.sh) .top h1{font-size:22px;color:var(--ink)}
.top-sub{font-size:13px;color:var(--ink2);letter-spacing:-.005em}
.na{font-size:11.5px;font-weight:650;letter-spacing:.01em;padding:6px 12px}
.pulse-pill,.bell{background:#fff;box-shadow:0 1px 1px rgba(16,18,40,.04),0 6px 16px -10px rgba(40,46,140,.4),inset 0 0 0 1px var(--line)}
/* kartlar */
.card{border-radius:var(--r);background:#fff;border:1px solid var(--line);box-shadow:var(--sh);padding:22px;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.card:hover{box-shadow:var(--sh-hi)}
.card h2{font-size:17px;font-weight:700;letter-spacing:-.025em}
.card > p.sub,.sub{color:var(--ink2);font-size:13.5px}
.grid{gap:18px}
.kpi{padding:20px 22px}.kpi small{font-size:12.5px;font-weight:550;color:var(--ink2)}
.kpi b{font-size:32px;font-weight:750;letter-spacing:-.05em;line-height:1.15;font-feature-settings:"tnum" 1}
.kpi em{font-size:12px;font-weight:600}
.kpi:hover{transform:translateY(-3px)}
.hero-card,.sh{border:0;border-radius:28px}
.sh-tx h2{font-size:32px;font-weight:750;letter-spacing:-.045em}
/* düğmeler ve alanlar */
.btn{height:40px;padding:0 18px;border-radius:999px;font-weight:620;font-size:14px;letter-spacing:-.01em;transition:transform .15s,box-shadow .25s,background .25s,filter .2s}
.btn-sm{height:34px;padding:0 14px;font-size:13px}
.btn-pri{background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0)),linear-gradient(135deg,#2962ff,#6a4dff 55%,#a100ff);box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 10px 22px -10px rgba(98,60,255,.75),0 2px 4px -2px rgba(98,60,255,.6)}
.btn-pri:hover{filter:brightness(1.07);box-shadow:0 1px 0 rgba(255,255,255,.35) inset,0 14px 28px -10px rgba(98,60,255,.85)}
.btn-ghost{background:rgba(16,18,40,.05);color:var(--ink)}.btn-ghost:hover{background:rgba(16,18,40,.08)}
.btn-danger{background:#fff0f3;color:#d0103f}
.in,select.in,textarea.in{min-height:46px;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:#f7f7fb;font-size:14.5px;font-family:var(--font);letter-spacing:-.005em;transition:border-color .2s,box-shadow .25s,background .2s}
textarea.in{min-height:96px}
.in:focus{background:#fff;border-color:transparent;box-shadow:0 0 0 2px #7c6dff,0 0 0 6px rgba(124,109,255,.16)}
label.f{font-size:12.5px;font-weight:600;color:#3d3e4c;letter-spacing:-.005em}
.hint{color:var(--ink2)}
.chip{font-size:11.5px;font-weight:650;padding:4px 10px;letter-spacing:-.005em}
.kind{border-radius:18px;border:1px solid var(--line);box-shadow:0 1px 1px rgba(16,18,40,.03)}
.kind:hover{border-color:rgba(124,109,255,.4);transform:translateY(-1px)}
.kind.on{border-color:transparent;box-shadow:0 0 0 2px #7c6dff,0 12px 26px -16px rgba(124,109,255,.8)}
.li{padding:13px 4px}.li b{font-weight:620;letter-spacing:-.01em}
.table th{font-size:11.5px;font-weight:650;letter-spacing:.02em;text-transform:uppercase;color:var(--ink3)}
.flash{border-radius:16px;font-weight:600}
.stp{border-radius:16px;background:#f6f6fb;border:1px solid var(--line)}
.prog .nums div{border-radius:16px;background:#f6f6fb;border:1px solid var(--line)}
.prog .nums b{font-size:20px;font-weight:700;letter-spacing:-.03em;font-feature-settings:"tnum" 1}
.bar{height:8px;background:#ececf4}
.empty b{font-size:18px;font-weight:700;letter-spacing:-.025em}
/* mobil */
@media (max-width:960px){
  .shell{padding:0;gap:0}
  .main{border-radius:0;border:0;min-height:100vh}
  .main > *:not(.top){margin-left:16px;margin-right:16px}
  .top{top:0;border-radius:0;padding:14px 16px 12px}
  .top h1{font-size:24px}
  .tabbar{border-radius:26px;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.8)}
}
/* giriş sayfaları */
.auth-card{border-radius:32px;background:rgba(255,255,255,.86);backdrop-filter:blur(30px) saturate(180%);border:1px solid rgba(255,255,255,.8);box-shadow:var(--sh-hi);padding:36px}
.auth-card h1{font-size:26px;font-weight:750;letter-spacing:-.045em}
.main:has(.sh) .top h1{display:none}
.main:has(.sh) .top-sub{font-size:15px;font-weight:600;color:var(--ink);margin:0}
.sh{margin-top:0}

/* =====================================================================
   VERİSYON PRO — sade, az renkli, düzgün (son katman; öncekileri geçersiz kılar)
   ===================================================================== */
:root{--accent:#5e5ce6;--accent-2:#4b49d1;--accent-soft:#efeffd;--ink:#1d1d1f;--ink2:#6e6e73;--ink3:#a1a1a6;--line:#e5e5ea;--line2:#ededf0;--soft:#f5f5f7;--soft2:#ececf0;
  --sh:0 1px 2px rgba(0,0,0,.04),0 1px 1px rgba(0,0,0,.02);--sh-hi:0 1px 2px rgba(0,0,0,.05),0 8px 24px -12px rgba(0,0,0,.12);--r:14px}
body{font-size:13px;letter-spacing:-.003em;background:#f5f5f7;background-image:none;color:var(--ink)}
body::after{display:none}
/* düzen: tam boy kenar çubuğu + içerik */
.shell{grid-template-columns:232px 1fr;gap:0;padding:0}
.side{position:sticky;top:0;height:100vh;border-radius:0;padding:16px 10px 12px;background:rgba(246,246,248,.92);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border:0;border-right:1px solid var(--line);box-shadow:none;overflow:hidden;gap:0}
.brand{font-size:15px;font-weight:650;letter-spacing:-.02em;padding:2px 10px 14px;gap:9px}.brand svg{width:24px;height:24px;filter:none}
.snav{overflow:visible;gap:0;margin:0;padding:0}
.snav-l{margin:12px 10px 4px;font-size:10.5px;font-weight:600;letter-spacing:.02em;text-transform:none;color:var(--ink3)}
.snav a{gap:9px;padding:5px 10px;border-radius:8px;font-size:13px;font-weight:500;color:#3a3a3c;line-height:20px}
.snav a:hover{background:rgba(0,0,0,.04)}
.snav a.on{background:rgba(0,0,0,.065);box-shadow:none;color:var(--ink);font-weight:600}
.snav .tile,.tabbar .tile{width:20px;height:20px;border-radius:0;background:none!important;box-shadow:none!important;color:#6e6e73;overflow:visible}
.snav .tile::after,.tabbar .tile::after{display:none}
.snav .tile .ic{width:17px;height:17px}.snav a.on .tile{color:var(--accent)}
.snav a:hover .tile,.snav a.on .tile{transform:none}
.eng{margin-top:auto;padding:10px;border-radius:10px;background:#fff;border:1px solid var(--line);box-shadow:none}
.eng-h{font-size:12px}.eng small{font-size:11.5px}
.eng .tile{width:22px;height:22px;border-radius:6px}
.me{padding:10px 6px 0;border-top:1px solid var(--line);margin-top:10px}.me .av{width:26px;height:26px;font-size:11px;background:#1d1d1f}
.me b{font-size:12px}.me small{font-size:11px}
/* içerik */
.main{border-radius:0;border:0;box-shadow:none;background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;min-height:100vh}
.main > *:not(.top){margin-left:auto;margin-right:auto;max-width:1160px;padding-left:28px;padding-right:28px;box-sizing:border-box;width:100%}
.main > .grid{display:grid}
.top{position:sticky;top:0;margin:0 0 22px;padding:0 28px;height:52px;display:flex;align-items:center;border-radius:0;background:rgba(255,255,255,.86);backdrop-filter:saturate(180%) blur(20px);-webkit-backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--line)}
.top h1,.main:has(.sh) .top h1{display:block;font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.top-sub,.main:has(.sh) .top-sub{display:none}
.top-r{gap:8px}
.pulse-pill{padding:4px 10px;font-size:11.5px;font-weight:500;box-shadow:none;border:1px solid var(--line);background:#fff}
.na{background:none!important;color:var(--ink2);border:1px solid var(--line);font-weight:500;font-size:11px;padding:4px 9px}
.bell{width:30px;height:30px;box-shadow:none;border:1px solid var(--line)}.bell .ic{width:16px;height:16px}
.bell b{min-width:16px;height:16px;font-size:10px;background:var(--accent);box-shadow:none}
/* ekran başlığı (sahne) — sade */
.sh{min-height:0;padding:22px 24px;margin-bottom:20px;border-radius:16px;background:linear-gradient(180deg,#fff,#fafafc);border:1px solid var(--line);box-shadow:none;color:var(--ink)}
.sh::before{display:none}
.sh-tx h2{font-size:22px;font-weight:650;letter-spacing:-.03em;margin:0 0 4px}
.sh-tx p{font-size:13px;color:var(--ink2);max-width:60ch}
.sh-scene{height:96px;width:260px}
.sh .ic{width:20px;height:20px}
.sh-box{width:50px;height:50px;border-radius:14px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink2);backdrop-filter:none}
.sh-box.b{background:#1d1d1f;color:#fff}
.sh-lane i{background:var(--accent)}
.sh-core{background:#1d1d1f;color:#fff;width:54px;height:54px;border-radius:16px}
.sh-orbit .o{background:#fff;color:var(--ink2);box-shadow:inset 0 0 0 1px var(--line),0 4px 10px -6px rgba(0,0,0,.2)}
.sh-orbit .w{border-color:rgba(94,92,230,.35)}
.sh-plug .port{background:#1d1d1f}.sh-plug .plug{background:#fff;color:var(--accent);box-shadow:inset 0 0 0 1px var(--line),0 6px 14px -8px rgba(0,0,0,.25)}
.sh-plug .spark{background:var(--accent);box-shadow:0 0 18px 6px rgba(94,92,230,.45)}
.sh-sync .disk{background:#1d1d1f;color:#fff}.sh-sync .cl{background:#fff;color:var(--ink2);box-shadow:inset 0 0 0 1px var(--line)}
.sh-sync .arc{border-color:rgba(94,92,230,.45)}.sh-sync .dot{background:var(--accent);box-shadow:0 0 10px rgba(94,92,230,.6)}
.sh-clock .face{background:#1d1d1f}.sh-clock .mm{background:#8e8cff!important}
.sh-clock .bars i{background:var(--soft2)}.sh-clock .bars i::after{background:var(--accent)}
.sh-rewind .ring{border-top-color:var(--accent);border-left-color:rgba(94,92,230,.3)}.sh-rewind .core{background:#1d1d1f;color:#fff}.sh-rewind .tk{background:var(--accent)}
.sh-sliders span{background:var(--soft2)}.sh-sliders i{box-shadow:0 1px 3px rgba(0,0,0,.25),inset 0 0 0 1px var(--line)}
/* kartlar ve tipografi */
.card{border-radius:var(--r);border:1px solid var(--line);box-shadow:var(--sh);padding:18px}
.card:hover{box-shadow:var(--sh)}
.card h2{font-size:14px;font-weight:600;letter-spacing:-.015em;margin-bottom:2px}
.card > p.sub,.sub{font-size:12.5px;color:var(--ink2)}
.grid{gap:14px}
.kpi{padding:16px 18px}.kpi:hover{transform:none}
.kpi small{font-size:12px;font-weight:500}
.kpi b,.grad b{font-size:24px;font-weight:650;letter-spacing:-.035em;background:none!important;-webkit-text-fill-color:currentColor;color:var(--ink)!important}
.kpi em{font-size:11.5px;font-weight:500;color:var(--ink2)}
.kpi .tile{position:absolute;right:14px;top:14px;width:28px;height:28px;border-radius:8px;background:var(--soft)!important;color:var(--ink2);box-shadow:none}
.kpi .tile::after{display:none}.kpi .tile .ic{width:15px;height:15px}
.li{padding:11px 2px;border-top:1px solid var(--line2)}.li b{font-size:13px;font-weight:550}.li small{font-size:12px}
.li .tile,.list .tile,.dv .tile,.mega-tab .tile{width:30px;height:30px;border-radius:8px;background:var(--soft)!important;color:var(--ink2);box-shadow:none}
.li .tile::after,.dv .tile::after{display:none}
.chip{font-size:11px;font-weight:550;padding:3px 8px}
.chip.ok{background:#e9f7ef;color:#1a7f45}.chip.run{background:var(--accent-soft);color:var(--accent)}.chip.err{background:#fdecef;color:#c4103f}
/* düğmeler ve alanlar */
.btn{height:32px;padding:0 14px;font-size:13px;font-weight:550;border-radius:8px;gap:6px}
.btn-sm{height:28px;padding:0 11px;font-size:12.5px;border-radius:7px}
.btn-pri{background:var(--accent);box-shadow:0 1px 2px rgba(94,92,230,.35),inset 0 1px 0 rgba(255,255,255,.15)}
.btn-pri:hover{background:var(--accent-2);filter:none;box-shadow:0 1px 2px rgba(94,92,230,.35)}
.btn-ghost{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.btn-ghost:hover{background:var(--soft)}
.btn .ic{width:15px;height:15px}
.in,select.in,textarea.in{min-height:36px;padding:7px 11px;border-radius:8px;font-size:13px;background:#fff;border:1px solid #d9d9de}
.in:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(94,92,230,.18)}
label.f{font-size:12px;font-weight:500;color:var(--ink2);gap:5px}
.kind{border-radius:12px;padding:12px}.kind b{font-size:13px}.kind small{font-size:11.5px}
.kind.on{box-shadow:0 0 0 1.5px var(--accent);background:#fbfbff}
.prog .nums div,.stp{border-radius:10px;background:var(--soft);border:0}
.prog .nums b{font-size:16px;font-weight:600}
.bar{height:6px;background:var(--soft2)}.bar i{background:var(--accent)}
.flash{border-radius:10px;font-size:13px;font-weight:500}
.empty b{font-size:15px;font-weight:600}
.table th{font-size:11px;letter-spacing:.01em;text-transform:none;font-weight:600}
.table td{font-size:12.5px}
.hero-card{background:#fff!important;color:var(--ink);border:1px solid var(--line)!important;box-shadow:none!important}
.hero-card::before,.hero-card::after{display:none}
.hero-card h2{font-size:20px!important;font-weight:650}.hero-card .sub{color:var(--ink2)!important}
.hero-card .btn-ghost{background:#fff;color:var(--ink)}
.flow{background:var(--soft);height:44px}.flow i{background:var(--accent);box-shadow:none}.flow span{color:var(--ink2)}
.a-line{filter:none}
.heat .h1{background:#e3e2fb}.heat .h2{background:#bdbaf6}.heat .h3{background:#8e8bef}.heat .h4{background:var(--accent)}
.heat-l .h1{background:#e3e2fb}.heat-l .h2{background:#bdbaf6}.heat-l .h3{background:#8e8bef}.heat-l .h4{background:var(--accent)}
.g-val b{font-size:28px;font-weight:650}
.ss.cur{box-shadow:0 0 0 1.5px var(--accent) inset;background:#fbfbff}.ss.cur i{background:var(--accent);animation:none}
.ss.done i{background:#34c759}
.dv{background:var(--soft);border-radius:12px}
.tl::before{background:var(--line)}.tl-i i{box-shadow:0 0 0 2px var(--accent)}
@media (max-width:960px){.shell{grid-template-columns:1fr}.main > *:not(.top){padding-left:16px;padding-right:16px}.top{padding:0 16px}.tabbar .tile{color:var(--ink2)}}
/* ===== Cihaza özgü görüntüler ===== */
.dart{position:relative;display:inline-grid;place-items:center;flex:none;font-size:2.4px;width:16em;height:16em;perspective:60em}
.dart-md{font-size:4px}.dart-lg{font-size:10px}
.dart > *{transform-style:preserve-3d}
.d-body{position:relative;display:block;width:7.2em;height:14.4em;padding:.38em;border-radius:1.7em;background:#1d1d1f;box-shadow:0 0 0 .14em #8e8e93 inset,0 .8em 1.6em -.6em rgba(0,0,0,.45)}
.dart-iphone .d-body{background:linear-gradient(145deg,#3a3a3c,#1d1d1f);box-shadow:0 0 0 .16em #b9b9be,0 .8em 1.8em -.6em rgba(0,0,0,.45)}
.dart-pixel .d-body{border-radius:1.4em;background:#202124;box-shadow:0 0 0 .16em #5f6368,0 .8em 1.6em -.6em rgba(0,0,0,.45)}
.dart-galaxy .d-body{border-radius:1em;padding:.26em;background:#111}
.dart-ipad .d-body,.dart-tablet .d-body{width:11em;height:14.6em;border-radius:1.3em;padding:.6em}
.d-scr{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:.55em;align-content:start;width:100%;height:100%;padding:2.2em .7em .7em;border-radius:1.35em;overflow:hidden;background:linear-gradient(165deg,#e9ebff,#f7f3ff 55%,#eaf7fb)}
.dart-galaxy .d-scr{border-radius:.8em}.dart-ipad .d-scr,.dart-tablet .d-scr{border-radius:.8em;grid-template-columns:repeat(4,1fr)}
.d-time{grid-column:1/-1;font-size:1.2em;font-weight:650;color:#1d1d1f;text-align:center;letter-spacing:-.02em;margin:-.6em 0 .2em}
.d-app{aspect-ratio:1;border-radius:.45em;background:#fff;box-shadow:0 .1em .2em rgba(0,0,0,.08)}
.d-app:nth-of-type(1){background:#5e5ce6}.d-app:nth-of-type(4){background:#34c759}
.d-island{position:absolute;top:.85em;left:50%;width:2.6em;height:.8em;margin-left:-1.3em;border-radius:1em;background:#000}
.d-punch{position:absolute;top:.85em;left:50%;width:.7em;height:.7em;margin-left:-.35em;border-radius:50%;background:#000}
.d-cam{position:absolute;top:.25em;left:50%;width:.35em;height:.35em;margin-left:-.18em;border-radius:50%;background:#444}
.d-sync{position:absolute;left:50%;top:58%;width:3em;height:3em;margin:-1.5em 0 0 -1.5em;border-radius:50%;border:.2em solid var(--accent);opacity:0}
.dart-laptop{width:20em;height:14em}
.d-lid{display:block;width:16em;height:10em;padding:.45em;border-radius:.8em .8em .2em .2em;background:#1d1d1f;box-shadow:0 0 0 .12em #8e8e93 inset}
.d-lid .d-scr{display:block;border-radius:.4em;padding:0;background:linear-gradient(165deg,#e9ebff,#f7f3ff 55%,#eaf7fb)}
.d-base{display:block;width:19em;height:.9em;margin:-.05em auto 0;border-radius:0 0 .9em .9em;background:linear-gradient(#d1d1d6,#aeaeb2)}
.dart-camera{width:18em;height:13em}
.d-cbody{position:relative;display:block;width:16em;height:10em;margin-top:2em;border-radius:1.4em;background:linear-gradient(160deg,#3a3a3c,#1c1c1e);box-shadow:0 .9em 1.8em -.7em rgba(0,0,0,.5)}
.d-grip{position:absolute;left:0;top:0;bottom:0;width:3.4em;border-radius:1.4em 0 0 1.4em;background:#111}
.d-hump{position:absolute;left:50%;top:-1.6em;width:5em;height:2em;margin-left:-2.5em;border-radius:.6em .6em 0 0;background:#2c2c2e}
.d-flash{position:absolute;right:1.4em;top:1.2em;width:1.6em;height:.8em;border-radius:.2em;background:#e5e5ea}
.d-lens{position:absolute;left:50%;top:50%;width:7.4em;height:7.4em;margin:-3.7em 0 0 -3.2em;border-radius:50%;background:radial-gradient(circle,#0b0b10 34%,#2c2c2e 36%,#1c1c1e 48%,#3a3a3c 50%,#111 64%,#48484a 66%,#1c1c1e 100%);box-shadow:0 0 0 .2em #000}
.d-glass{position:absolute;inset:28%;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(140,140,255,.9),rgba(94,92,230,.35) 30%,transparent 60%);overflow:hidden}
.d-glass::after{content:"";position:absolute;left:-20%;top:-20%;width:40%;height:140%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);transform:rotate(25deg)}
.dart-action{width:14em;height:12em}
.d-abody{position:relative;display:block;width:12em;height:9em;border-radius:1.2em;background:linear-gradient(160deg,#2c2c2e,#111);box-shadow:0 .8em 1.6em -.6em rgba(0,0,0,.5)}
.d-alens{position:absolute;left:1.2em;top:50%;width:5em;height:5em;margin-top:-2.5em;border-radius:1em;background:radial-gradient(circle,#0b0b10 40%,#3a3a3c 44%,#1c1c1e 70%);box-shadow:0 0 0 .2em #48484a}
.d-rec{position:absolute;right:1.3em;top:1.2em;width:.8em;height:.8em;border-radius:50%;background:#ff3b30}
.d-adisp{position:absolute;right:1.1em;bottom:1.2em;width:3.6em;height:2.6em;border-radius:.4em;background:#1f2a44;box-shadow:inset 0 0 0 .15em #000}
.dart-card{width:12em;height:14em}
.d-sd{position:relative;display:grid;place-items:center;width:9.4em;height:12em;border-radius:.6em;background:linear-gradient(160deg,#2c2c2e,#1c1c1e);clip-path:polygon(28% 0,100% 0,100% 100%,0 100%,0 18%);color:#fff;font-size:1em}
.d-sd b{font-size:2.4em;font-weight:800;letter-spacing:-.04em;margin-top:2em}
.d-pins{position:absolute;top:.8em;left:34%;right:.8em;height:2.4em;background:repeating-linear-gradient(90deg,#d4af37 0 .7em,transparent .7em 1.2em);border-radius:.2em}
/* canlı: tanındığında */
.dart.live > :first-child{animation:dTilt 5s ease-in-out infinite}
.dart.live .d-sync{animation:dSync 1.8s ease-out infinite}
.dart.live .d-scr{animation:dGlow 2.4s ease-in-out infinite}
.dart.live .d-rec{animation:dBlink 1s steps(2) infinite}
.dart.live .d-glass::after{animation:dShine 2.6s ease-in-out infinite}
.dart.live .d-flash{animation:dFlash 3s ease-in-out infinite}
@keyframes dTilt{0%,100%{transform:rotateY(-14deg) rotateX(4deg) translateY(0)}50%{transform:rotateY(14deg) rotateX(-2deg) translateY(-.6em)}}
@keyframes dSync{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(2.2)}}
@keyframes dGlow{50%{filter:brightness(1.06) saturate(1.15)}}
@keyframes dBlink{50%{opacity:.2}}
@keyframes dShine{0%{left:-40%}60%,100%{left:120%}}
@keyframes dFlash{0%,88%,100%{background:#e5e5ea;box-shadow:none}92%{background:#fff;box-shadow:0 0 2em 1em rgba(255,255,255,.9)}}
.dv .dart{margin-bottom:4px}
.li .dart-sm{margin:-2px 0}
.dt-dev.art{width:auto;height:auto;background:none;box-shadow:none;border-radius:0;animation:devIn .7s cubic-bezier(.2,.9,.25,1.4)}
@media (prefers-reduced-motion:reduce){.dart *{animation:none!important}}
.main{padding:0 28px 32px}
.main > *:not(.top){max-width:1104px;margin-left:auto;margin-right:auto;padding-left:revert-layer;padding-right:revert-layer}
.main > .card,.main > .sh{padding-left:22px;padding-right:22px}
.main > .grid{padding-left:0;padding-right:0}
.top{margin:0 -28px 22px}
.dart-sm .d-time,.dart-md .d-time{display:none}.dart-sm .d-scr,.dart-md .d-scr{padding-top:1.6em}
@media (max-width:960px){.main{padding:0 14px 110px}.top{margin:0 -14px 16px}}
.dt-ring{background:conic-gradient(from 0deg,#5e5ce6,#c9c8ff,#5e5ce6) border-box}
.dt-spark{background:#5e5ce6!important;box-shadow:0 0 10px rgba(94,92,230,.6)!important}
.dt-card{box-shadow:0 0 0 1px var(--line),0 40px 90px -40px rgba(30,30,60,.45)}
.dt-card b{font-size:19px;font-weight:650}.dt-card small{font-size:13px}
.island .is-ic{background:#2c2c2e}.island.ok .is-ic{background:#34c759}.island.err .is-ic{background:#ff3b30}.is-ring .fg{stroke:#a5a3ff}

/* =====================================================================
   VERİSYON SİLİKON — Apple Silicon renkleri + gerçek uygulama davranışları
   ===================================================================== */
/* menü: Sistem Ayarları tarzı renkli simge kareleri */
.snav{position:relative}
.snav a{position:relative;z-index:1}
.snav a.on{background:transparent}
.snav-ind{position:absolute;left:0;right:0;top:0;z-index:0;border-radius:8px;background:rgba(0,0,0,.07);opacity:0;transition:transform .42s cubic-bezier(.3,1.25,.4,1),height .3s;pointer-events:none}
.snav .tile{width:22px;height:22px;border-radius:6px;background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 88%,#fff),var(--c1))!important;color:#fff!important;box-shadow:0 1px 1.5px rgba(0,0,0,.18),inset 0 .5px 0 rgba(255,255,255,.35)!important}
.snav .tile .ic{width:14px;height:14px}
.snav a.on .tile{color:#fff!important}
.snav a:active .tile{transform:scale(.92)}
/* büyük başlık */
.lt{max-width:1104px;margin:4px auto 22px!important;padding:0!important}
.lt h1{margin:0;font-size:32px;font-weight:700;letter-spacing:-.035em;line-height:1.1;transition:opacity .25s,transform .35s}
.lt p{margin:6px 0 0;font-size:14px;color:var(--ink2);max-width:70ch}
.top h1{opacity:0;transform:translateY(6px);transition:opacity .25s,transform .3s}
body.lt-small .top h1{opacity:1;transform:none}
body.lt-small .lt h1{opacity:.0;transform:translateY(-6px)}
.top{transition:box-shadow .3s,border-color .3s;border-bottom-color:transparent}
body.lt-small .top{border-bottom-color:var(--line);box-shadow:0 1px 0 rgba(0,0,0,.02)}
/* komut paleti */
.cmdk-btn{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 8px 0 10px;border-radius:8px;border:1px solid var(--line);background:#fff;color:var(--ink2);font:500 12.5px var(--font);cursor:pointer;transition:border-color .2s,box-shadow .2s}
.cmdk-btn:hover{border-color:#cfcfd6;box-shadow:0 1px 2px rgba(0,0,0,.05)}.cmdk-btn .ic{width:14px;height:14px}
.cmdk-btn kbd,.cmdk-f kbd{font:600 10.5px var(--font);padding:2px 5px;border-radius:5px;background:var(--soft);border:1px solid var(--line);color:var(--ink2)}
.cmdk{position:fixed;inset:0;z-index:90;display:grid;place-items:start center;padding-top:14vh;background:rgba(20,20,30,.18);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:dIn .15s}
.cmdk-box{width:min(620px,calc(100vw - 24px));border-radius:16px;background:rgba(255,255,255,.96);backdrop-filter:blur(30px) saturate(180%);box-shadow:0 0 0 1px rgba(0,0,0,.08),0 30px 80px -20px rgba(0,0,0,.35);overflow:hidden;animation:cmdIn .22s cubic-bezier(.2,.9,.3,1.2)}
@keyframes cmdIn{from{opacity:0;transform:scale(.97) translateY(-6px)}to{opacity:1;transform:none}}
.cmdk-box input{width:100%;border:0;outline:none;padding:18px 20px;font:500 16px var(--font);letter-spacing:-.01em;background:transparent;border-bottom:1px solid var(--line)}
.cmdk-list{max-height:52vh;overflow:auto;padding:6px}
.cmdk-i{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;font-size:13.5px;color:var(--ink)}
.cmdk-i svg{color:var(--ink2)}.cmdk-i em{margin-left:auto;font-style:normal;font-size:12px;color:var(--ink3);opacity:0}
.cmdk-i.on{background:var(--accent);color:#fff}.cmdk-i.on svg{color:#fff}.cmdk-i.on em{opacity:1;color:rgba(255,255,255,.8)}
.cmdk-e{padding:22px;text-align:center;color:var(--ink2)}
.cmdk-f{display:flex;gap:16px;padding:10px 16px;border-top:1px solid var(--line);font-size:11.5px;color:var(--ink3)}
/* Apple Silicon renk dokunuşları */
.kpi .tile{background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 88%,#fff),var(--c1))!important;color:#fff!important;box-shadow:0 1px 1.5px rgba(0,0,0,.15)!important}
.kpi b{color:var(--ink)!important}
.chip.run{background:#e8f0ff;color:#0a64d6}
.bar i{background:linear-gradient(90deg,#0a84ff,#5e5ce6)}
/* basma ve odak geri bildirimi */
.btn:active{transform:scale(.97)}
.card{transition:box-shadow .3s,transform .3s}
.li{transition:background .2s}.list .li:hover{background:#fafafc}
.main .card{animation:rise .45s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 40ms)}
@media (max-width:960px){.cmdk-btn span,.cmdk-btn kbd{display:none}.lt h1{font-size:26px}}
/* yer aç */
.ya-dev{display:flex;align-items:center;gap:14px;min-height:84px;padding:12px;margin:10px 0 14px;border-radius:14px;background:var(--soft)}
.ya-dev b{display:block;font-size:14px}.ya-dev small{color:var(--ink2);font-size:12px}
.ya-ph{color:var(--ink3);font-size:13px;padding:10px}
.ya-meter{margin:6px 0 12px}
.ya-bar{display:flex;height:14px;border-radius:8px;overflow:hidden;background:var(--soft2)}
.ya-bar i{display:block;height:100%;transition:width .6s cubic-bezier(.2,.8,.2,1)}
#yaUsed{background:linear-gradient(90deg,#0a84ff,#5e5ce6);width:0}#yaFree{background:repeating-linear-gradient(45deg,#34c759 0 6px,#30d158 6px 12px);width:0}
.ya-leg{display:flex;gap:14px;align-items:center;margin-top:8px;font-size:12px;color:var(--ink2)}.ya-leg i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:6px}.ya-leg .u{background:#5e5ce6}.ya-leg .f{background:#34c759}.ya-leg b{margin-left:auto;font-size:15px;color:var(--ink)}
.ya-filter{margin-bottom:8px}
.ya-list{max-height:420px;overflow:auto;border:1px solid var(--line);border-radius:12px}
.ya-row{display:flex;align-items:center;gap:10px;padding:9px 12px;border-top:1px solid var(--line2);cursor:pointer;animation:rise .35s both;animation-delay:calc(var(--i) * 15ms)}
.ya-row:first-child{border-top:0}.ya-row:hover{background:#fafafc}
.ya-ico{width:34px;height:34px;flex:none;border-radius:8px;display:grid;place-items:center;font:700 9.5px var(--font);color:#fff;background:linear-gradient(180deg,#8e8cff,#5e5ce6)}
.ya-row b{display:block;font-size:13px;font-weight:550}.ya-row small{display:block;font-size:11.5px;color:var(--ink2)}.ya-row em{font-style:normal;font-size:12px;color:var(--ink2);font-variant-numeric:tabular-nums}
.hwid{color:var(--ink3)!important;font-size:11.5px!important}
.ya-ways{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:6px}
.ya-way{position:relative;padding:16px 16px 14px;border-radius:14px;background:var(--soft);border:1px solid transparent}
.ya-way.rec{background:#fff;border-color:var(--accent);box-shadow:0 0 0 3px rgba(94,92,230,.12)}
.ya-way.rec::after{content:"Sizin için önerilen";position:absolute;top:12px;right:12px;font-size:10.5px;font-weight:650;color:var(--accent);background:var(--accent-soft);padding:3px 8px;border-radius:999px}
.ya-n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#1d1d1f;color:#fff;font-size:11.5px;font-weight:700;margin-bottom:8px}
.ya-way b{display:block;font-size:14px}.ya-way small{display:block;color:var(--ink2);font-size:12px;margin-top:2px}
.ya-way ol{margin:10px 0 8px;padding-left:18px;font-size:12.5px;line-height:1.55;color:#3a3a3c}
.ya-way em{display:block;font-style:normal;font-size:11.5px;color:var(--ink3)}
.ya-ios{margin-top:12px;padding:12px;border-radius:12px;background:var(--soft)}.ya-ios b{font-size:13px}
@media (max-width:960px){.ya-ways{grid-template-columns:1fr}}
/* Köprü kurulumu */
.kb-flow{margin-top:14px}
.kb-os{margin-bottom:12px}
.kb-steps{display:grid;gap:8px}
.kb-s{display:flex;align-items:flex-start;gap:12px;padding:14px;border-radius:14px;background:var(--soft);transition:background .3s,box-shadow .3s}
.kb-s > i{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;color:#fff;background:#1d1d1f;transition:background .3s}
.kb-s b{display:block;font-size:13.5px}.kb-s small{display:block;font-size:12.5px;color:var(--ink2);margin-top:2px}
.kb-s kbd{font:600 11px var(--font);padding:1px 6px;border-radius:5px;background:#fff;border:1px solid var(--line)}
.kb-s.done > i{background:#34c759;font-size:0}.kb-s.done > i::before{content:"✓";font-size:12px}
.kb-s.live > i.spin{background:none;border:2px solid #d1d1d6;border-top-color:var(--accent);animation:spin .9s linear infinite}
.kb-s.live.done > i.spin{animation:none;border:0;background:#34c759}
.kb-s.live.done{background:#f0faf3;box-shadow:inset 0 0 0 1px #c9ecd5}
.kb-s#kbS5:not(.act):not(.done){opacity:.55}
.kb-cmd{display:flex;align-items:center;gap:8px;margin-top:10px;padding:10px 10px 10px 14px;border-radius:10px;background:#1d1d1f;color:#e5e5ea}
.kb-cmd code{flex:1;min-width:0;font:12.5px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all;color:#fff}
.kb-cmd .btn{flex:none}
#kbArt .dart{margin:-6px 0}
.kb-alt{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:12px;padding:14px;border-radius:14px;border:1px dashed #d1d1d6}
.kb-alt b{display:block;font-size:13.5px}.kb-alt small{display:block;font-size:12.5px;color:var(--ink2);margin-top:2px}
/* ===== Telefon sayfası (QR ile açılır) ===== */
body.phone{background:#f5f5f7}
.ph-wrap{min-height:100vh;display:flex;justify-content:center;padding:max(16px,env(safe-area-inset-top)) 14px 30px}
.ph-card{width:min(460px,100%);display:grid;gap:16px;align-content:start}
.ph-center{text-align:center;justify-items:center;padding-top:20vh}
.ph-head{display:flex;align-items:center;gap:14px;padding:18px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:0 20px 40px -30px rgba(30,30,80,.35);animation:rise .5s both}
.ph-head small{font-size:11.5px;font-weight:600;color:var(--accent)}.ph-head h1{margin:0;font-size:22px;letter-spacing:-.03em}.ph-head p{margin:2px 0 0;font-size:12.5px;color:var(--ink2)}
.ph-step{display:grid;gap:10px;padding:16px;border-radius:20px;background:#fff;border:1px solid var(--line);animation:rise .5s both .08s}
.ph-t{font-size:14px}
.ph-picks{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ph-pick{position:relative;display:flex;flex-direction:column;gap:4px;padding:16px 14px;border-radius:16px;background:var(--soft);cursor:pointer;transition:transform .15s,background .2s;-webkit-tap-highlight-color:transparent}
.ph-pick:active{transform:scale(.97);background:#ececf3}
.ph-pick b{font-size:14px}.ph-pick small{font-size:11.5px;color:var(--ink2)}
.ph-in{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0)}
.ph-ico{width:34px;height:34px;border-radius:10px;margin-bottom:6px;background:linear-gradient(135deg,#ff9f0a,#ff375f)}
.ph-ico-1{background:conic-gradient(from 200deg,#ff9f0a,#ffd60a,#30d158,#0a84ff,#bf5af2,#ff375f,#ff9f0a);-webkit-mask:radial-gradient(circle,transparent 6px,#000 7px);mask:radial-gradient(circle,transparent 6px,#000 7px);border-radius:50%}
.ph-ico-2{background:linear-gradient(180deg,#64d2ff,#0a84ff)}
.ph-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.ph-th{aspect-ratio:1;border-radius:10px;background:#e5e5ea center/cover;display:grid;place-items:center;font:700 10px var(--font);color:#636366;position:relative;animation:rise .35s both}
.ph-th.v::after{content:"▶";position:absolute;right:5px;bottom:4px;font-size:9px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.ph-th.more{background:#1d1d1f;color:#fff;font-size:13px}
.ph-sum{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:13px}.ph-sum span{color:var(--ink2)}.ph-sum button{margin-left:auto;border:0;background:none;color:var(--accent);font:600 13px var(--font)}
.ph-hint{font-size:11.5px;color:var(--ink3)}
.ph-go{height:48px;font-size:15px;border-radius:14px}
.ph-run{display:flex;align-items:center;gap:16px;padding:16px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.ph-ring{position:relative;width:76px;height:76px;flex:none}.ph-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ph-ring circle{fill:none;stroke-width:3.4}.ph-ring .bg{stroke:#ececf0}.ph-ring .fg{stroke:var(--accent);stroke-linecap:round;stroke-dasharray:97.4;stroke-dashoffset:97.4;transition:stroke-dashoffset .4s}
.ph-run.ok .fg{stroke:#34c759}
.ph-ring b{position:absolute;inset:0;display:grid;place-items:center;font-size:17px}
.ph-run .prog{flex:1}
.ph-msg{font-size:12.5px;color:var(--ink2);text-align:center;margin:0}
/* ===== Telefon ekleme sihirbazı ===== */
.pw-cta{margin-bottom:16px}.pw-art .dart{margin:-8px 0}
#kbGo.pulse{animation:pb 1.2s 3}
.pw{position:fixed;inset:0;z-index:85;display:grid;place-items:center;padding:16px;background:rgba(245,245,247,.72);backdrop-filter:blur(18px) saturate(170%);-webkit-backdrop-filter:blur(18px) saturate(170%);animation:dIn .3s}
.pw-card{position:relative;width:min(760px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#fff;border-radius:26px;padding:26px;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 50px 110px -40px rgba(30,30,80,.45);animation:cardIn .5s cubic-bezier(.2,.9,.25,1.15)}
.pw-x{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:50%;border:0;background:var(--soft);font-size:18px;cursor:pointer;color:var(--ink2)}
.pw-prog{height:4px;border-radius:4px;background:var(--soft);overflow:hidden;margin:0 40px 20px 0}.pw-prog i{display:block;height:100%;width:10%;background:var(--accent);border-radius:4px;transition:width .5s cubic-bezier(.2,.8,.2,1)}
.pw-s{display:none}.pw-s.on{display:block;animation:stepIn .45s cubic-bezier(.2,.9,.3,1.05)}
.pw-s h2{font-size:22px;letter-spacing:-.03em;margin:0 0 4px}
.pw-opts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.pw-opt{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:16px;border-radius:20px;border:1.5px solid var(--line);background:#fff;text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .25s,transform .2s}
.pw-opt:hover{border-color:var(--accent);box-shadow:0 18px 36px -22px rgba(94,92,230,.6);transform:translateY(-2px)}
.pw-opt b{font-size:15px}.pw-opt small{font-size:12.5px;color:var(--ink2);line-height:1.45}.pw-opt em{font-style:normal;font-size:11.5px;font-weight:600;color:var(--accent);margin-top:4px}
.pw-sc{position:relative;width:100%;height:120px;border-radius:14px;background:linear-gradient(160deg,#f1f2ff,#f8f3ff 60%,#eef9f8);margin-bottom:8px;overflow:hidden}
.q-ph{position:absolute;left:50%;top:14px;width:58px;height:106px;margin-left:-29px;border-radius:13px;background:#1d1d1f;padding:4px;animation:float 3.4s ease-in-out infinite}
.q-scr{position:relative;display:block;height:100%;border-radius:10px;background:#0b0b10;overflow:hidden}
.q-code{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;background:repeating-conic-gradient(#fff 0 25%,#1d1d1f 0 50%) 0 0/10px 10px;border-radius:3px;opacity:.9}
.q-beam{position:absolute;left:4px;right:4px;height:2px;top:20%;background:#30d158;box-shadow:0 0 10px #30d158;animation:qbeam 1.6s ease-in-out infinite alternate}
@keyframes qbeam{to{top:78%}}
.q-cam{position:absolute;top:2px;left:50%;width:14px;height:4px;margin-left:-7px;border-radius:4px;background:#000;z-index:2}
.c-ph{position:absolute;left:18%;top:26px;width:40px;height:74px;border-radius:9px;background:#1d1d1f;box-shadow:0 0 0 2px #b9b9be}
.c-lap{position:absolute;right:12%;top:30px;width:110px;height:66px;border-radius:7px 7px 2px 2px;background:#1d1d1f;padding:4px}.c-lap span{display:block;height:100%;border-radius:4px;background:linear-gradient(165deg,#e8ebff,#f6f0ff)}
.c-lap::after{content:"";position:absolute;left:-10px;right:-10px;bottom:-7px;height:7px;border-radius:0 0 8px 8px;background:#c7c7cc}
.c-cable{position:absolute;left:calc(18% + 40px);right:calc(12% + 110px);top:72px;height:3px;border-radius:3px;background:#d1d1d6;overflow:hidden}
.c-cable i{position:absolute;top:0;left:-30%;width:30%;height:100%;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:cflow 1.4s linear infinite}
@keyframes cflow{to{left:100%}}
.pw-ts{display:grid;gap:8px;margin-top:14px}
.pw-t{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;border:1.5px solid var(--line);cursor:pointer}
.pw-t:has(input:checked){border-color:var(--accent);background:#fbfbff}.pw-t b{display:block;font-size:14px}.pw-t small{font-size:12px;color:var(--ink2)}
.pw-nav{display:flex;justify-content:space-between;margin-top:18px}
.pw-qr-wrap{display:flex;gap:26px;align-items:center;flex-wrap:wrap;justify-content:center}
.pw-qr{position:relative;padding:16px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px var(--line),0 24px 50px -30px rgba(30,30,80,.4)}
.pw-qr img,.pw-qr canvas{display:block}
.pw-corner{position:absolute;width:26px;height:26px;border:3px solid var(--accent)}
.pw-corner.c1{left:-4px;top:-4px;border-right:0;border-bottom:0;border-radius:10px 0 0 0}.pw-corner.c2{right:-4px;top:-4px;border-left:0;border-bottom:0;border-radius:0 10px 0 0}.pw-corner.c3{left:-4px;bottom:-4px;border-right:0;border-top:0;border-radius:0 0 0 10px}.pw-corner.c4{right:-4px;bottom:-4px;border-left:0;border-top:0;border-radius:0 0 10px 0}
.pw-laser{position:absolute;left:12px;right:12px;height:2px;top:14px;background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:0 0 12px var(--accent);animation:qbeam2 2.2s ease-in-out infinite alternate}
@keyframes qbeam2{to{top:calc(100% - 16px)}}
.pw-how{flex:1;min-width:240px}.pw-how ol{margin:10px 0 14px;padding-left:20px;line-height:1.7;font-size:13.5px}
.pw-wait{display:flex;align-items:center;gap:10px;padding:12px;border-radius:12px;background:var(--soft);font-size:13px}
.spin{display:inline-block;width:16px;height:16px;border-radius:50%;border:2px solid #d1d1d6;border-top-color:var(--accent);animation:spin .9s linear infinite;flex:none;font-style:normal}
.pw-found{text-align:center;display:grid;justify-items:center;gap:4px}.pw-found .dart{margin-bottom:6px}
.pw-next{display:grid;gap:8px;margin-top:16px}
.pw-ns{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--soft);font-size:13.5px}
.pw-ns > i{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;color:#fff;background:#1d1d1f}
.pw-ns > i.spin{width:20px;height:20px;background:none}
.pw-ns.done{background:#f0faf3}.pw-ns.done > i{animation:none;border:0;background:#34c759;width:24px;height:24px}
@media (max-width:700px){.pw-opts{grid-template-columns:1fr}}
/* ===== iPhone çizimi ===== */
.ip3d{position:relative;display:inline-block;perspective:1400px}
.ip-in{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.ip-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.ip-back{transform:rotateY(180deg)}
.ip-svg{width:100%;height:100%;display:block;filter:drop-shadow(0 18px 26px rgba(0,0,0,.28))}
.ip3d.live .ip-in{animation:ipShow 7s cubic-bezier(.45,0,.2,1) .4s both}
@keyframes ipShow{0%{transform:rotateY(-24deg) rotateX(6deg) translateY(30px) scale(.9);opacity:0}12%{transform:rotateY(-14deg) rotateX(4deg);opacity:1}38%{transform:rotateY(10deg) rotateX(-2deg)}58%{transform:rotateY(180deg)}72%{transform:rotateY(196deg)}88%,100%{transform:rotateY(348deg) rotateX(2deg)}}
.ip3d.live .ip-scr{animation:ipScr 1.4s ease .6s both}
@keyframes ipScr{from{opacity:0}to{opacity:1}}
.ip3d.live .ip-island{animation:ipIsl 2.6s cubic-bezier(.3,1.4,.4,1) 1.6s}
@keyframes ipIsl{0%,100%{transform:scaleX(1)}30%,70%{transform:scaleX(1.55)}}
.ip-island{transform-box:fill-box;transform-origin:center}
.ip-sync{position:absolute;left:50%;top:55%;width:40%;aspect-ratio:1;margin-left:-20%;border-radius:50%;border:3px solid rgba(255,255,255,.85);opacity:0}
.ip3d.live .ip-sync{animation:dSync 1.8s ease-out 1.8s 3}
.ip3d:hover .ip-in{transform:rotateY(180deg)}
@media (prefers-reduced-motion:reduce){.ip3d *{animation:none!important}}
.ipm{display:inline-flex;flex:none}.ipm .ip-svg{filter:drop-shadow(0 4px 6px rgba(0,0,0,.18))}
/* ===== Giriş ve kayıt: canlı kolaj + form ===== */
body.auth2-body{background:#f5f5f7}
.auth2{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr);min-height:100vh}
.a2-show{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:34px 40px;background:radial-gradient(70% 60% at 10% 10%,rgba(124,77,255,.55),transparent 60%),radial-gradient(60% 60% at 90% 90%,rgba(0,184,212,.45),transparent 60%),radial-gradient(50% 50% at 80% 20%,rgba(245,0,87,.35),transparent 60%),#0d0b1f;color:#fff}
.a2-glow{position:absolute;inset:-20%;background:conic-gradient(from var(--ha,0deg),rgba(41,98,255,.25),rgba(170,0,255,.2),rgba(245,0,87,.18),rgba(0,200,83,.15),rgba(0,184,212,.22),rgba(41,98,255,.25));filter:blur(80px);animation:haloSpin 18s linear infinite}
@property --ha{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes haloSpin{to{--ha:360deg}}
.a2-top{position:relative;display:flex;align-items:center;gap:10px;font-size:18px;letter-spacing:-.03em}.a2-top b{font-weight:700}
.a2-stage{position:relative;flex:1;min-height:520px;margin:20px 0}
.a2-card{position:absolute;border-radius:22px;background:rgba(255,255,255,.1);backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 30px 60px -30px rgba(0,0,0,.6);color:#fff}
.a2-detect{left:4%;top:4%;width:300px;height:220px;display:flex;align-items:center;gap:16px;padding:18px;animation:a2f 7s ease-in-out infinite}
.a2-ip{flex:none;width:76px;display:grid;place-items:center}
.a2-dtx small{display:block;font-size:11px;font-weight:600;color:#7dffb0;letter-spacing:.02em}.a2-dtx b{display:block;font-size:19px;letter-spacing:-.02em;margin:2px 0}.a2-dtx span{font-size:12px;color:rgba(255,255,255,.7)}
.a2-ring{position:absolute;left:38px;top:50%;width:90px;height:90px;margin-top:-45px;border-radius:50%;border:2px solid rgba(125,255,176,.6);opacity:0;animation:a2r 2.6s ease-out infinite}.a2-ring.r2{animation-delay:1.3s}
@keyframes a2r{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.8);opacity:0}}
.a2-xfer{right:4%;top:14%;width:330px;padding:18px;animation:a2f 8s ease-in-out -2s infinite}
.a2-xh{display:flex;justify-content:space-between;font-size:13px}.a2-xh span{font-variant-numeric:tabular-nums;color:#b9b7ff}
.a2-lane{position:relative;display:flex;justify-content:space-between;align-items:center;height:56px;margin:12px 0}
.a2-lane::before{content:"";position:absolute;left:44px;right:44px;top:50%;border-top:2px dashed rgba(255,255,255,.25)}
.a2-src,.a2-dst{position:relative;z-index:1;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:rgba(255,255,255,.16)}.a2-dst{background:#fff;color:#5e5ce6}
.a2-lane i{position:absolute;left:48px;top:50%;width:12px;height:15px;margin-top:-7px;border-radius:3px;background:linear-gradient(135deg,#8e8cff,#ff5fa2);opacity:0;animation:a2l 1.8s cubic-bezier(.5,0,.5,1) infinite}
.a2-lane i:nth-of-type(2){animation-delay:.45s}.a2-lane i:nth-of-type(3){animation-delay:.9s}.a2-lane i:nth-of-type(4){animation-delay:1.35s}
@keyframes a2l{0%{left:48px;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:calc(100% - 60px);opacity:0;transform:rotate(90deg) scale(.6)}}
.a2-file{display:flex;align-items:center;gap:10px}.a2-fi{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;font:700 9.5px var(--font);background:linear-gradient(135deg,#ff9f0a,#ff375f)}
.a2-file b{display:block;font-size:13px}.a2-file small{font-size:11.5px;color:rgba(255,255,255,.65)}
.a2-bar{height:6px;border-radius:6px;background:rgba(255,255,255,.15);margin-top:12px;overflow:hidden}.a2-bar i{display:block;height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,#7dffb0,#64d2ff,#8e8cff);transition:width .16s linear}
.a2-stats{left:10%;bottom:12%;display:flex;gap:22px;padding:16px 20px;animation:a2f 9s ease-in-out -4s infinite}
.a2-stats small{display:block;font-size:11px;color:rgba(255,255,255,.65)}.a2-stats b{font-size:22px;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.a2-toasts{position:absolute;right:4%;bottom:6%;width:320px;display:flex;flex-direction:column;gap:8px}
.a2-toast{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.92);color:#1d1d1f;box-shadow:0 20px 40px -20px rgba(0,0,0,.6);animation:a2t .55s cubic-bezier(.2,.9,.3,1.2)}
.a2-toast i{flex:none;width:28px;height:28px;border-radius:9px;background:linear-gradient(135deg,#34c759,#00b8d4)}.a2-toast.info i{background:linear-gradient(135deg,#5e5ce6,#bf5af2)}
.a2-toast b{display:block;font-size:13px}.a2-toast small{font-size:11.5px;color:#6e6e73}
@keyframes a2t{from{opacity:0;transform:translateY(-14px) scale(.96)}to{opacity:1;transform:none}}
.a2-island{position:absolute;left:50%;top:-6px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:7px 9px 7px 7px;border-radius:999px;background:#000;box-shadow:0 14px 30px -14px rgba(0,0,0,.8)}
.a2-ii{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#2962ff,#aa00ff)}
.a2-island b{display:block;font-size:12.5px;white-space:nowrap}.a2-island small{display:block;font-size:11px;color:#a1a1aa}
.a2-island svg{width:26px;height:26px;transform:rotate(-90deg)}.a2-island circle{fill:none;stroke-width:3.5}.a2-island .bg{stroke:rgba(255,255,255,.15)}.a2-island .fg{stroke:#8e8cff;stroke-linecap:round;stroke-dasharray:94.25;stroke-dashoffset:94.25}
@keyframes a2f{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.a2-foot{position:relative}.a2-foot b{display:block;font-size:22px;letter-spacing:-.03em;font-weight:700}.a2-foot span{font-size:13px;color:rgba(255,255,255,.7)}
.a2-main{display:grid;place-items:center;padding:30px}
.a2-form{width:min(400px,100%)}
.a2-form h1{font-size:30px;letter-spacing:-.04em;margin:0 0 4px}.a2-form .sub{margin:0 0 18px}
.a2-mbrand{display:none}
.a2-badge{display:inline-block;margin-bottom:10px;padding:4px 10px;border-radius:999px;font-size:11.5px;font-weight:650;color:#5e5ce6;background:#efeffd}
.a2-trial{display:flex;align-items:center;gap:12px;padding:12px 14px;margin-bottom:14px;border-radius:16px;background:linear-gradient(135deg,#f0efff,#fdf0ff);box-shadow:inset 0 0 0 1px rgba(124,77,255,.2)}
.a2-tn{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font:800 19px var(--font);color:#fff;background:linear-gradient(135deg,#2962ff,#aa00ff)}
.a2-trial b{display:block;font-size:14px}.a2-trial small{font-size:12px;color:var(--ink2)}
.a2-or{display:flex;align-items:center;gap:10px;margin:22px 0 12px;font-size:12px;color:var(--ink3)}.a2-or::before,.a2-or::after{content:"";flex:1;height:1px;background:var(--line)}
.a2-cta{position:relative;display:flex;align-items:center;gap:12px;padding:14px 14px 14px 18px;border-radius:18px;text-decoration:none;color:#fff;overflow:hidden;background:linear-gradient(135deg,#2962ff,#6a4dff 50%,#c51dff);box-shadow:0 18px 36px -16px rgba(98,60,255,.8);transition:transform .25s cubic-bezier(.2,.9,.25,1.3),box-shadow .25s}
.a2-cta::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.4) 50%,transparent 65%);transform:translateX(-120%);animation:a2sh 4s ease-in-out 1.2s infinite}
@keyframes a2sh{0%{transform:translateX(-120%)}30%,100%{transform:translateX(120%)}}
.a2-cta:hover{transform:translateY(-2px);box-shadow:0 24px 44px -16px rgba(98,60,255,.9)}
.a2-cta-in{flex:1}.a2-cta b{display:block;font-size:15px}.a2-cta small{font-size:12px;color:rgba(255,255,255,.85)}
.a2-cta-go{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.2)}
@media (max-width:980px){.auth2{grid-template-columns:1fr}.a2-show{display:none}.a2-mbrand{display:flex;margin-bottom:18px}}
@media (prefers-reduced-motion:reduce){.a2-show *{animation:none!important}}
/* paketler */
.pk-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:6px 0 14px}
.pk-seg em{font-style:normal;font-size:10.5px;font-weight:650;color:#34c759;margin-left:4px}
.pk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:18px}
.pk{position:relative;display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:18px;background:#fff;border:1px solid var(--line);animation:rise .45s both;animation-delay:calc(var(--i) * 60ms);transition:transform .3s,box-shadow .3s}
.pk:hover{transform:translateY(-3px);box-shadow:0 20px 40px -24px rgba(30,30,80,.35)}
.pk.hl{border:0;background:linear-gradient(#fff,#fff) padding-box,conic-gradient(from var(--ha,0deg),#2962ff,#aa00ff,#f50057,#ff6d00,#00c853,#00b8d4,#2962ff) border-box;border:1.5px solid transparent;animation:rise .45s both,haloSpin 10s linear infinite}
.pk.cur{box-shadow:0 0 0 2px var(--accent)}
.pk-pop{position:absolute;top:-10px;left:18px;padding:3px 10px;border-radius:999px;font-size:10.5px;font-weight:700;color:#fff;background:linear-gradient(135deg,#2962ff,#aa00ff)}
.pk-n{font-size:17px}.pk-t{font-size:12px;color:var(--ink2);min-height:16px}
.pk-p{margin:6px 0 4px}.pk-v{font-size:32px;font-weight:750;letter-spacing:-.045em;font-variant-numeric:tabular-nums}.pk-c{font-size:16px;font-weight:600}.pk-per{font-size:12.5px;color:var(--ink2);font-weight:500}
.pk ul{list-style:none;margin:6px 0 14px;padding:0;display:grid;gap:6px;font-size:13px;color:#3a3a3c;flex:1}.pk li::before{content:"✓ ";color:#34c759;font-weight:800}
.pk-buy{width:100%;justify-content:center}
.a2-dest{left:22%;top:50%;width:300px;padding:16px 18px;display:grid;gap:10px;animation:a2f 10s ease-in-out -6s infinite}
.a2-dest > b{font-size:13px}
.a2-dr{display:flex;align-items:center;gap:10px;font-size:12.5px;color:rgba(255,255,255,.85)}
.a2-dl{width:10px;height:10px;border-radius:3px;background:var(--c)}
.a2-dr span:nth-child(2){flex:1}
.a2-live{width:8px;height:8px;border-radius:50%;background:#7dffb0;box-shadow:0 0 0 0 rgba(125,255,176,.6);animation:a2p 1.8s infinite}.a2-live.d2{animation-delay:.6s}.a2-live.d3{animation-delay:1.2s}
@keyframes a2p{70%{box-shadow:0 0 0 7px rgba(125,255,176,0)}}
/* ===== Yedekle: cihaz seçimi (sayfa içi ve sihirbaz) ===== */
.dv-inline{margin-bottom:16px}
.dv-pick{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:14px}
.dp{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 10px 12px;border-radius:18px;border:1px solid var(--line);background:linear-gradient(180deg,#fff,#fafafc);cursor:pointer;text-align:center;transition:transform .3s cubic-bezier(.2,.9,.25,1.3),box-shadow .3s,border-color .3s}
.dp:hover{transform:translateY(-4px);border-color:rgba(94,92,230,.45);box-shadow:0 22px 40px -24px rgba(94,92,230,.6)}
.dp:active{transform:scale(.97)}
.dp b{font-size:13px;margin-top:4px}.dp small{font-size:11px;color:var(--ink2);line-height:1.35}
.dp-sc{position:relative;height:86px;display:grid;place-items:center}
.dp-sc .dart-md{font-size:4.6px}
.dp-ring{position:absolute;left:50%;top:50%;width:70px;height:70px;margin:-35px 0 0 -35px;border-radius:50%;border:2px solid rgba(94,92,230,.5);opacity:0}
.dp:hover .dp-ring{animation:dSync 1.4s ease-out infinite}
.dp:hover .dart > :first-child,.dp:hover .ip-in{animation:dTilt 2.4s ease-in-out infinite}
.dp-flash{position:absolute;right:18%;top:22%;width:10px;height:10px;border-radius:50%;background:#fff;opacity:0}
.dp:hover .dp-flash{animation:spk 2s ease infinite}
.dp-fly{position:absolute;left:12%;top:40%;width:9px;height:11px;border-radius:2px;background:linear-gradient(135deg,#5e5ce6,#bf5af2);opacity:0}
.dp:hover .dp-fly{animation:dpFly 1.6s ease-in-out infinite}.dp-fly.f2{animation-delay:.8s!important}
@keyframes dpFly{0%{transform:translate(0,0);opacity:0}20%{opacity:1}100%{transform:translate(60px,-14px);opacity:0}}
.dp-sc-usb{width:100px}
.dp-port{position:absolute;right:12px;top:30px;width:34px;height:24px;border-radius:7px;background:#1d1d1f}
.dp-plug{position:absolute;left:8px;top:28px;width:44px;height:28px;border-radius:8px;background:linear-gradient(180deg,#f2f2f7,#d1d1d6);box-shadow:inset 0 0 0 1px #c7c7cc}
.dp:hover .dp-plug{animation:dpPlug 2.4s cubic-bezier(.6,0,.3,1) infinite}
@keyframes dpPlug{0%,15%{transform:none}45%,80%{transform:translateX(26px)}100%{transform:none}}
.ipm .ip3d{pointer-events:none}
/* sihirbaz */
.bw{position:fixed;inset:0;z-index:84;display:grid;place-items:center;padding:16px;background:rgba(13,11,31,.55);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);animation:dIn .3s}
.bw-card{position:relative;width:min(980px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:30px;border-radius:30px;color:#fff;background:radial-gradient(70% 60% at 10% 0%,rgba(124,77,255,.55),transparent 60%),radial-gradient(60% 60% at 100% 100%,rgba(0,184,212,.4),transparent 60%),radial-gradient(50% 50% at 90% 10%,rgba(245,0,87,.3),transparent 60%),#0d0b1f;box-shadow:0 60px 120px -40px rgba(0,0,0,.7);animation:cardIn .55s cubic-bezier(.2,.9,.25,1.15)}
.bw-card .pw-x{background:rgba(255,255,255,.14);color:#fff}
.bw-k{display:inline-block;font-size:11.5px;font-weight:650;color:#b9b7ff;letter-spacing:.02em}
.bw-s{display:none}.bw-s.on{display:block;animation:stepIn .45s cubic-bezier(.2,.9,.3,1.05)}
.bw-s h2{font-size:30px;letter-spacing:-.04em;margin:4px 0 6px}.bw-s .sub{color:rgba(255,255,255,.75)}
.bw .dv-pick{grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}
.bw .dp{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(12px);padding:20px 14px 16px;animation:rise .5s both}
.bw .dp:nth-child(2){animation-delay:.05s}.bw .dp:nth-child(3){animation-delay:.1s}.bw .dp:nth-child(4){animation-delay:.15s}.bw .dp:nth-child(5){animation-delay:.2s}.bw .dp:nth-child(6){animation-delay:.25s}
.bw .dp:hover{background:rgba(255,255,255,.15);border-color:rgba(185,183,255,.6);box-shadow:0 26px 50px -24px rgba(124,77,255,.8)}
.bw .dp small{color:rgba(255,255,255,.7)}.bw .dp b{font-size:15px}
.bw .dp-sc{height:120px}.bw .dp-sc .dart-md{font-size:6.2px}
.bw-back{border:0;background:rgba(255,255,255,.12);color:#fff;font:600 13px var(--font);padding:6px 12px;border-radius:999px;cursor:pointer}
.bw-hero{display:grid;place-items:center;min-height:220px;margin:6px 0 4px}
.bw-hero .dart-lg{font-size:13px}
.bw-ways{display:grid;gap:10px;margin-top:18px}
.bw-way{display:flex;align-items:center;gap:14px;width:100%;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;text-align:left;cursor:pointer;animation:rise .45s both;animation-delay:calc(var(--i) * 70ms);transition:background .25s,transform .25s,border-color .25s}
.bw-way:hover{background:rgba(255,255,255,.15);border-color:rgba(185,183,255,.6);transform:translateX(4px)}
.bw-way b{display:block;font-size:15px}.bw-way small{display:block;font-size:12.5px;color:rgba(255,255,255,.72);margin-top:2px}
.bw-wi{flex:none;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#2962ff,#aa00ff)}
.bw-way.k-qr .bw-wi{background:linear-gradient(135deg,#30d158,#00b8d4)}.bw-way.k-cable .bw-wi,.bw-way.k-usb .bw-wi{background:linear-gradient(135deg,#5e5ce6,#bf5af2)}.bw-way.k-card .bw-wi,.bw-way.k-folder .bw-wi{background:linear-gradient(135deg,#ff9f0a,#ff375f)}.bw-way.k-auto .bw-wi{background:linear-gradient(135deg,#0a84ff,#64d2ff)}
.bw-go{font-size:24px;color:rgba(255,255,255,.6)}
@media (max-width:980px){.dv-pick{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){.dv-pick,.bw .dv-pick{grid-template-columns:repeat(2,1fr)}.bw-s h2{font-size:24px}}
/* yedekle sihirbazı: gruplar ve sihirbaz içi QR eşleştirme */
.bw-g{display:flex;align-items:baseline;gap:10px;margin:22px 0 0}.bw-g b{font-size:14px}.bw-g small{font-size:12px;color:rgba(255,255,255,.6)}
.bw .bw-two{grid-template-columns:repeat(2,1fr);margin-top:10px}.bw .bw-four{grid-template-columns:repeat(4,1fr);margin-top:10px}
.bw .bw-two .dp-sc{height:140px}
.bwq{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;margin-top:10px}
.bwq h2{font-size:28px}
.bwq-steps{list-style:none;padding:0;margin:14px 0;display:grid;gap:10px}
.bwq-steps li{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:rgba(255,255,255,.88)}
.bwq-steps i{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:12.5px;background:linear-gradient(135deg,#2962ff,#aa00ff)}
.bwq-t{display:grid;gap:6px;font-size:12.5px;color:rgba(255,255,255,.75);margin:6px 0 12px}
.bwq-t .in{background:rgba(255,255,255,.95)}
.bwq-wait{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.1);font-size:13.5px}
.bwq-r{position:relative;display:grid;place-items:center;min-height:300px}
.bwq-phone{position:absolute;left:-10px;bottom:0;transform:rotate(-12deg);z-index:2;animation:bwqPh 3.4s ease-in-out infinite}
.bwq-phone .q-ph{position:relative;left:auto;top:auto;margin:0;width:70px;height:128px;display:block;animation:none}
@keyframes bwqPh{0%,100%{transform:rotate(-12deg) translate(0,0)}50%{transform:rotate(-6deg) translate(16px,-10px)}}
.bwq-qr{background:#fff}
.bwf{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center;margin-top:6px}
.bwf-art{display:grid;place-items:center;min-width:180px}
.bwf .pw-ns{background:rgba(255,255,255,.1);color:#fff}.bwf .pw-ns > i{background:linear-gradient(135deg,#2962ff,#aa00ff)}.bwf .pw-ns.done{background:rgba(52,199,89,.2)}
@media (max-width:800px){.bwq,.bwf{grid-template-columns:1fr}.bw .bw-four{grid-template-columns:repeat(2,1fr)}.bwq-phone{display:none}}
/* ===== Yedekle sihirbazı (ayrı sayfa) ===== */
.bflow{margin-bottom:18px}
.fl-steps{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:14px;font-size:12.5px;color:var(--ink3)}
.fl-steps span{display:flex;align-items:center;gap:6px}.fl-steps b{flex:0 0 18px;height:1px;background:var(--line)}
.fl-steps i{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:700;background:var(--soft2);color:var(--ink2)}
.fl-steps .on{color:var(--ink);font-weight:600}.fl-steps .on i{background:var(--accent);color:#fff}
.fl-steps .done i{background:#34c759;color:#fff}
.fl-body{position:relative;padding:30px;border-radius:26px;color:#fff;overflow:hidden;min-height:440px;background:radial-gradient(70% 60% at 0% 0%,rgba(124,77,255,.55),transparent 60%),radial-gradient(60% 60% at 100% 100%,rgba(0,184,212,.38),transparent 60%),radial-gradient(50% 50% at 90% 10%,rgba(245,0,87,.28),transparent 60%),#0d0b1f;box-shadow:0 40px 90px -40px rgba(30,20,90,.6)}
.fl-body.in > *{animation:stepIn .45s cubic-bezier(.2,.9,.3,1.05) both}
.fl-body h1{font-size:30px;letter-spacing:-.04em;margin:4px 0 8px;color:#fff}
.fl-sub{color:rgba(255,255,255,.75);font-size:14.5px;max-width:62ch;margin:0 0 6px}
.fl-k{display:inline-block;font-size:11.5px;font-weight:650;color:#b9b7ff;letter-spacing:.02em}.fl-k.ok{color:#7dffb0}
.fl-back{border:0;background:rgba(255,255,255,.12);color:#fff;font:600 13px var(--font);padding:6px 12px;border-radius:999px;cursor:pointer;margin-bottom:10px}
.fl-g{display:flex;align-items:baseline;gap:10px;margin:22px 0 10px}.fl-g b{font-size:14px}.fl-g small{font-size:12px;color:rgba(255,255,255,.6)}
.fl-devs{display:grid;gap:14px}.fl-devs.two{grid-template-columns:repeat(2,1fr)}.fl-devs.four{grid-template-columns:repeat(4,1fr)}
.fl-dev{display:flex;flex-direction:column;align-items:center;gap:4px;padding:18px 12px 16px;border-radius:20px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;text-align:center;backdrop-filter:blur(12px);transition:transform .3s cubic-bezier(.2,.9,.25,1.3),background .3s,border-color .3s,box-shadow .3s;animation:rise .5s both}
.fl-dev:hover{transform:translateY(-4px);background:rgba(255,255,255,.14);border-color:rgba(185,183,255,.6);box-shadow:0 26px 50px -24px rgba(124,77,255,.8)}
.fl-dev:active{transform:scale(.97)}
.fl-dev b{font-size:15px;margin-top:6px}.fl-dev small{font-size:12px;color:rgba(255,255,255,.7)}
.fl-pic{position:relative;height:150px;display:grid;place-items:center}.fl-devs.four .fl-pic{height:110px}
.fl-devs.four .dart-md{font-size:6px}.fl-devs.two .dart-lg{font-size:9px}
.fl-ring{position:absolute;left:50%;top:50%;width:90px;height:90px;margin:-45px 0 0 -45px;border-radius:50%;border:2px solid rgba(185,183,255,.6);opacity:0}
.fl-dev:hover .fl-ring{animation:dSync 1.4s ease-out infinite}
.fl-usb{position:relative;width:110px;height:60px}.fl-usb i{position:absolute;left:4px;top:16px;width:50px;height:30px;border-radius:9px;background:linear-gradient(180deg,#f2f2f7,#c7c7cc);animation:dpPlug 2.6s cubic-bezier(.6,0,.3,1) infinite}.fl-usb b{position:absolute;right:6px;top:18px;width:38px;height:26px;border-radius:7px;background:#000;box-shadow:inset 0 0 0 2px #333}
.fl-split{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center}
.fl-hero{display:grid;place-items:center;min-width:220px}.fl-hero .dart-lg{font-size:12px}
.fl-ways{display:grid;gap:10px;margin-top:14px}
.fl-way{display:flex;align-items:center;gap:14px;width:100%;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;text-align:left;cursor:pointer;animation:rise .45s both;animation-delay:calc(var(--i) * 70ms);transition:background .25s,transform .25s,border-color .25s}
.fl-way:hover{background:rgba(255,255,255,.15);border-color:rgba(185,183,255,.6);transform:translateX(4px)}
.fl-way b{display:block;font-size:15px}.fl-way small{display:block;font-size:12.5px;color:rgba(255,255,255,.72);margin-top:2px}
.fl-wi{flex:none;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#2962ff,#aa00ff)}
.fl-way.k-qr .fl-wi{background:linear-gradient(135deg,#30d158,#00b8d4)}.fl-way.k-cable .fl-wi,.fl-way.k-usb .fl-wi{background:linear-gradient(135deg,#5e5ce6,#bf5af2)}.fl-way.k-folder .fl-wi{background:linear-gradient(135deg,#ff9f0a,#ff375f)}.fl-way.k-auto .fl-wi{background:linear-gradient(135deg,#0a84ff,#64d2ff)}
.fl-go{font-size:24px;color:rgba(255,255,255,.6)}
.fl-ts{display:grid;gap:8px;margin:14px 0}
.fl-t{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);cursor:pointer}
.fl-t:has(input:checked){border-color:rgba(185,183,255,.8);background:rgba(255,255,255,.14)}
.fl-t input{accent-color:#8e8cff}.fl-t b{display:block;font-size:14px}.fl-t small{font-size:12px;color:rgba(255,255,255,.65)}
.fl-ti{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#5e5ce6,#bf5af2)}.fl-ti.cl{background:linear-gradient(135deg,#0a84ff,#64d2ff)}
.fl-pass{max-width:360px;color:rgba(255,255,255,.75)}.fl-pass .in{background:#fff}
.fl-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;flex-wrap:wrap}
.fl-msg{font-size:13px;color:rgba(255,255,255,.8)}.fl-msg.err{color:#ffb3c1}
.fl-qr{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}
.fl-ol{list-style:none;padding:0;margin:14px 0;display:grid;gap:10px}
.fl-ol li{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:rgba(255,255,255,.88)}
.fl-ol i{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:12.5px;background:linear-gradient(135deg,#2962ff,#aa00ff)}
.fl-wait{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.1);font-size:13.5px}
.fl-qrr{position:relative;display:grid;place-items:center;min-height:300px}
.fl-qrr .pw-qr{background:#fff}
.fl-hand{position:absolute;left:-6px;bottom:4px;z-index:2;transform:rotate(-12deg);animation:bwqPh 3.4s ease-in-out infinite}
.fl-hand .q-ph{position:relative;left:auto;top:auto;margin:0;width:70px;height:128px;display:block;animation:none}
@keyframes bwqPh{0%,100%{transform:rotate(-12deg) translate(0,0)}50%{transform:rotate(-6deg) translate(16px,-10px)}}
.fl-next{display:grid;gap:8px;margin-top:14px}
.fl-n{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.1);font-size:13.5px}
.fl-n > i{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;background:linear-gradient(135deg,#2962ff,#aa00ff)}
.fl-n > i.spin{background:none;border-color:rgba(255,255,255,.3);border-top-color:#fff;width:20px;height:20px}
.fl-n.done{background:rgba(52,199,89,.22)}.fl-n.done > i{animation:none;border:0;background:#34c759;width:24px;height:24px}
.fl-folders{display:grid;gap:8px;margin-top:12px}
.fl-fo{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.08)}.fl-fo b{display:block;font-size:13.5px}.fl-fo small{font-size:12px;color:rgba(255,255,255,.65)}
.fl-run{text-align:center}.fl-run .vault-scene{background:rgba(255,255,255,.06);margin:0 auto 14px;max-width:560px}
.fl-run h1{text-align:center}.fl-run .fl-sub{margin:0 auto 14px}
.fl-nums{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:640px;margin:0 auto}
.fl-nums div{padding:12px;border-radius:14px;background:rgba(255,255,255,.08)}.fl-nums small{display:block;font-size:11.5px;color:rgba(255,255,255,.6)}.fl-nums b{font-size:18px;font-variant-numeric:tabular-nums}
.fl-done{text-align:center;display:grid;justify-items:center;gap:6px;padding-top:10px}.fl-done .fl-sub{text-align:center}
details.classic{margin-top:6px}details.classic > summary{cursor:pointer;font-weight:600;font-size:13.5px;color:var(--ink2);list-style:none}details.classic > summary::before{content:"› ";display:inline-block;transition:transform .2s}details.classic[open] > summary::before{transform:rotate(90deg)}
details.classic[open] > summary{margin-bottom:14px}
@media (max-width:900px){.fl-devs.four{grid-template-columns:repeat(2,1fr)}.fl-split,.fl-qr{grid-template-columns:1fr}.fl-hand{display:none}.fl-nums{grid-template-columns:repeat(2,1fr)}.fl-body{padding:20px}}
#flQr,#bwQr,#pwQr{min-width:220px;min-height:220px;color:#1d1d1f;font-size:11px;word-break:break-all;display:grid;place-items:center}
.ph-prep{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:14px;background:#f0efff;color:#3d2fb3;font-size:12.5px;line-height:1.45}
.ph-prep .spin{margin-top:2px}
.ph-more{font-size:12.5px;color:var(--ink2)}.ph-more summary{cursor:pointer;color:var(--accent);font-weight:600}.ph-more p{margin:8px 0 0;line-height:1.5}
/* ===== Performans ===== */
@keyframes spinT{to{transform:rotate(360deg)}}
.a2-glow{animation:spinT 30s linear infinite!important;background:conic-gradient(rgba(41,98,255,.25),rgba(170,0,255,.2),rgba(245,0,87,.18),rgba(0,200,83,.15),rgba(0,184,212,.22),rgba(41,98,255,.25))!important;will-change:transform}
.pk.hl{animation:rise .45s both!important}
.main .card{animation-duration:.3s}
button.ph-pick{border:0;font:inherit;color:inherit;text-align:left;width:100%}
.ph-diag{padding:12px 14px;border-radius:16px;background:#fff;border:1px solid var(--line);font-size:12px}
.ph-diag summary{cursor:pointer;font-weight:650;font-size:13px}
.ph-diag ol{margin:8px 0 0;padding-left:18px;display:grid;gap:3px;color:var(--ink2);font-variant-numeric:tabular-nums}
.ph-diag li.ok{color:#13703a}.ph-diag li.err{color:#b0103a;font-weight:600}
.fl-block{max-width:340px;padding:22px;border-radius:20px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);text-align:left}
.fl-block b{display:block;font-size:16px;margin-bottom:6px}.fl-block p{margin:0 0 14px;font-size:13.5px;color:rgba(255,255,255,.8);line-height:1.5}
/* cihaz hakkı doluyken */
.fl-lim{display:grid;grid-template-columns:.9fr 1.1fr;gap:16px;margin-top:16px}
.fl-up{position:relative;padding:22px;border-radius:22px;background:linear-gradient(160deg,rgba(124,77,255,.35),rgba(0,184,212,.18));border:1px solid rgba(185,183,255,.5);box-shadow:0 30px 60px -30px rgba(124,77,255,.8)}
.fl-up-k{display:inline-block;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:999px;background:#fff;color:#5e5ce6;margin-bottom:8px}
.fl-up b{display:block;font-size:22px;letter-spacing:-.03em}.fl-up-p{font-size:15px;color:rgba(255,255,255,.85);margin:2px 0 10px}
.fl-up ul{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:6px;font-size:13.5px}.fl-up li::before{content:"✓ ";color:#7dffb0;font-weight:800}
.fl-up p{font-size:13.5px;color:rgba(255,255,255,.8)}
.fl-up-b{width:100%;justify-content:center;height:46px;font-size:15px}
.fl-swap{padding:20px;border-radius:22px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);display:grid;gap:8px;align-content:start}
.fl-swap > b{font-size:14.5px}.fl-swap > small{font-size:12.5px;color:rgba(255,255,255,.65)}
.fl-dv{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.08)}.fl-dv b{display:block;font-size:13.5px}.fl-dv small{font-size:11.5px;color:rgba(255,255,255,.6)}
.fl-dv .btn-ghost{background:rgba(255,255,255,.14);color:#fff}
@media (max-width:900px){.fl-lim{grid-template-columns:1fr}}
.fl-back{display:table}
.ph-picks .ph-wide{grid-column:1 / -1}
.ph-ico-3{background:linear-gradient(135deg,#5e5ce6,#bf5af2)}
.ph-main{padding:18px 16px;background:linear-gradient(135deg,#f0efff,#fdf0ff);box-shadow:inset 0 0 0 1.5px rgba(124,77,255,.35)}
.ph-main b{font-size:15.5px}.ph-main small b{font-size:inherit}
.fl-pass small{display:block;font-size:12px;color:rgba(255,255,255,.6);margin-top:6px;font-weight:400}
.fl-note{font-size:12.5px;color:rgba(255,255,255,.7);margin:12px 0 0}
.perm-bar{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:95;display:flex;align-items:center;gap:14px;padding:12px 12px 12px 18px;border-radius:16px;background:#1d1d1f;color:#fff;font-size:13.5px;box-shadow:0 24px 50px -20px rgba(0,0,0,.6);animation:rise .4s both}
.perm-bar b{color:#fff}
/* ===== Sihirbaz: paket hakları ve satın alma ===== */
.fl-plan{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px;font-size:12.5px;color:rgba(255,255,255,.8)}
.fl-plan-b{padding:5px 11px;border-radius:999px;font-weight:700;color:#fff;background:linear-gradient(135deg,#2962ff,#aa00ff);box-shadow:0 8px 20px -10px rgba(124,77,255,.9)}
.fl-plan-t{padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.12)}
.fl-plan-m{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 5px;border-radius:999px;background:rgba(255,255,255,.08)}
.fl-plan-m svg{transform:rotate(-90deg)}.fl-plan-m circle{fill:none;stroke-width:4}.fl-plan-m .bg{stroke:rgba(255,255,255,.15)}.fl-plan-m .fg{stroke:#7dffb0;stroke-linecap:round;stroke-dasharray:94.25}
.fl-plan-a{margin-left:auto;color:#b9b7ff;font-weight:600;text-decoration:none}
.fl-resume{position:relative;display:flex;align-items:center;gap:14px;padding:16px 18px;margin-bottom:18px;border-radius:18px;background:linear-gradient(135deg,rgba(52,199,89,.3),rgba(0,184,212,.22));border:1px solid rgba(125,255,176,.5);overflow:hidden;animation:rise .5s both}
.fl-resume b{display:block;font-size:16px}.fl-resume small{color:rgba(255,255,255,.8)}
.fl-confetti{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 30%,#ffd60a 2px,transparent 3px),radial-gradient(circle at 30% 70%,#ff375f 2px,transparent 3px),radial-gradient(circle at 60% 20%,#64d2ff 2px,transparent 3px),radial-gradient(circle at 85% 60%,#bf5af2 2px,transparent 3px);animation:fcf 3s linear infinite}
@keyframes fcf{to{background-position:0 40px,0 -30px,0 50px,0 -40px}}
.fl-x{border:0;background:none;color:rgba(255,255,255,.7);font-size:20px;cursor:pointer}
.fl-own,.fl-lock,.fl-warn{display:inline-block;margin-top:6px;font-style:normal;font-size:11.5px;font-weight:650;padding:3px 9px;border-radius:999px}
.fl-own{background:rgba(52,199,89,.2);color:#7dffb0}.fl-lock{background:rgba(255,214,10,.16);color:#ffd60a}.fl-warn{background:rgba(255,159,10,.18);color:#ffb340}
.fl-way.locked{border-style:dashed}
.fl-new{margin:14px 0 4px}.fl-new > b{font-size:13.5px}
.fl-newb{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;margin-top:8px}
.fl-nb{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;border:1px dashed rgba(255,255,255,.25);background:rgba(255,255,255,.04);color:#fff;text-align:left;cursor:pointer;text-decoration:none;transition:background .2s,border-color .2s}
.fl-nb:hover{background:rgba(255,255,255,.1);border-color:rgba(185,183,255,.7)}.fl-nb b{display:block;font-size:13.5px}.fl-nb small{font-size:11.5px;color:rgba(255,255,255,.6)}
.fl-ti.c-gdrive{background:conic-gradient(#34a853 0 33%,#fbbc04 0 66%,#4285f4 0)}.fl-ti.c-dropbox{background:#0061ff}.fl-ti.c-onedrive{background:linear-gradient(135deg,#0078d4,#28a8ea)}
.fl-ups{display:grid;grid-template-columns:1fr 1.1fr;gap:30px;align-items:center}
.fl-ben{list-style:none;padding:0;margin:10px 0 16px;display:grid;gap:8px}
.fl-ben li{display:flex;gap:10px;align-items:center;font-size:14px;animation:rise .45s both;animation-delay:calc(var(--i) * 90ms + .2s)}
.fl-ben li::before{content:"✓";flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;background:linear-gradient(135deg,#34c759,#00b8d4)}
.fl-offer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 18px 18px 20px;border-radius:20px;background:linear-gradient(135deg,rgba(124,77,255,.4),rgba(0,184,212,.2));border:1px solid rgba(185,183,255,.55);box-shadow:0 30px 60px -30px rgba(124,77,255,.9)}
.fl-offer small{display:block;font-size:12px;color:rgba(255,255,255,.8)}.fl-offer b{display:block;font-size:26px;letter-spacing:-.03em}.fl-offer span{font-size:12.5px;color:rgba(255,255,255,.75)}
.fl-buy{height:50px;padding:0 26px;font-size:16px;position:relative;overflow:hidden}
.fl-buy::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);animation:a2sh 3.2s ease-in-out 1s infinite}
@keyframes a2sh{0%{transform:translateX(-120%)}30%,100%{transform:translateX(120%)}}
.fl-after{font-size:12.5px;color:rgba(255,255,255,.7);margin:12px 0 0}.fl-after a{color:#b9b7ff}
.up-sc{position:relative;height:340px;border-radius:24px;background:rgba(255,255,255,.05);overflow:hidden}
.up-ip{position:absolute;left:14%;top:50%;transform:translateY(-50%)}
.up-cable{position:absolute;left:36%;right:30%;top:58%;height:3px;border-radius:3px;background:rgba(255,255,255,.2);overflow:hidden}.up-cable i{position:absolute;left:-30%;width:30%;height:100%;background:linear-gradient(90deg,transparent,#7dffb0,transparent);animation:cflow 1.3s linear infinite}
@keyframes cflow{to{left:100%}}
.up-lap{position:absolute;right:8%;top:50%;width:150px;height:96px;margin-top:-48px;border-radius:8px 8px 3px 3px;background:#1d1d1f;padding:5px;box-shadow:0 0 0 1.5px #8e8e93 inset}.up-lap span{display:block;height:100%;border-radius:4px;background:linear-gradient(160deg,#3b2bff,#a03cff 55%,#ff4f8b)}
.up-lap::after{content:"";position:absolute;left:-12px;right:-12px;bottom:-8px;height:8px;border-radius:0 0 9px 9px;background:linear-gradient(#e5e5ea,#a1a1a6)}
.up-bub{position:absolute;padding:6px 11px;border-radius:999px;font-size:12px;font-weight:650;background:#fff;color:#1d1d1f;box-shadow:0 12px 24px -12px rgba(0,0,0,.6);opacity:0;animation:upB 6s ease-in-out infinite}
.up-bub.b1{left:40%;top:14%}.up-bub.b2{left:58%;top:24%;animation-delay:1.2s}.up-bub.b3{left:44%;bottom:16%;animation-delay:2.4s}.up-bub.b4{left:62%;bottom:24%;animation-delay:3.6s}
@keyframes upB{0%{opacity:0;transform:translate(-40px,10px) scale(.8)}12%{opacity:1;transform:none}40%{opacity:1;transform:translate(40px,0)}55%,100%{opacity:0;transform:translate(70px,-4px) scale(.8)}}
.up-lap.big{left:50%;right:auto;margin-left:-110px;width:220px;height:140px;margin-top:-80px}
.up-sd{position:absolute;left:12%;top:50%;width:46px;height:58px;margin-top:-29px;border-radius:6px 14px 6px 6px;background:#1d1d1f;color:#fff;font:800 12px var(--font);display:grid;place-items:center;animation:upSd 4s cubic-bezier(.6,0,.3,1) infinite}
@keyframes upSd{0%,15%{transform:none}45%,85%{transform:translateX(120px);opacity:1}100%{transform:translateX(120px);opacity:0}}
.up-spark{position:absolute;width:10px;height:10px;border-radius:50%;background:#ffd60a;box-shadow:0 0 12px #ffd60a;opacity:0;animation:upSp 4s ease infinite}.up-spark.s1{left:52%;top:28%;animation-delay:1.8s}.up-spark.s2{left:64%;top:36%;animation-delay:2s}.up-spark.s3{left:58%;top:22%;animation-delay:2.2s}
@keyframes upSp{0%,40%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1.2)}70%,100%{opacity:0;transform:scale(.4) translateY(-20px)}}
.up-tag{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);padding:8px 14px;border-radius:999px;background:#fff;color:#1d1d1f;font-size:12.5px;font-weight:650;white-space:nowrap;opacity:0;animation:upT 4s ease infinite}
@keyframes upT{0%,50%{opacity:0;transform:translate(-50%,10px)}60%,90%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}
.up-core{position:absolute;left:50%;top:50%;width:70px;height:70px;margin:-35px 0 0 -35px;border-radius:22px;background:linear-gradient(135deg,#2962ff,#aa00ff);box-shadow:0 0 0 10px rgba(124,77,255,.15),0 20px 40px -10px rgba(124,77,255,.8)}
.up-cl{position:absolute;padding:8px 12px;border-radius:12px;background:#fff;color:#1d1d1f;font-size:12.5px;font-weight:650;animation:rise .5s both}
.up-cl.c1{left:8%;top:14%}.up-cl.c2{right:8%;top:14%;animation-delay:.15s}.up-cl.c3{left:8%;bottom:14%;animation-delay:.3s}.up-cl.c4{right:8%;bottom:14%;animation-delay:.45s}
.up-ln{position:absolute;left:50%;top:50%;width:160px;height:2px;transform-origin:0 50%;background:repeating-linear-gradient(90deg,#7dffb0 0 8px,transparent 8px 14px);animation:upL 1s linear infinite}
.up-ln.l1{transform:rotate(-150deg)}.up-ln.l2{transform:rotate(-30deg)}.up-ln.l3{transform:rotate(150deg)}.up-ln.l4{transform:rotate(30deg)}
@keyframes upL{to{background-position:-14px 0}}
.up-dv span{position:absolute;animation:rise .6s both}.up-dv .dart-md{font-size:6.5px}.up-dv .u1{left:12%;top:16%}.up-dv .u2{right:14%;top:12%;animation-delay:.2s}.up-dv .u3{left:16%;bottom:12%;animation-delay:.4s}.up-dv .u4{right:12%;bottom:16%;animation-delay:.6s}
@media (max-width:900px){.fl-ups{grid-template-columns:1fr}.fl-offer{flex-direction:column;align-items:stretch}.up-sc{height:260px}}
/* telefon: gerçek dosya kutusu düğmenin tamamını kaplar (doğrudan dokunma) */
label.ph-pick{position:relative;overflow:hidden;cursor:pointer}
.ph-cover{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;font-size:200px;z-index:2}
.ph-grid{display:grid;grid-template-columns:1fr;gap:4px;max-height:260px;overflow:auto}
.ph-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:10px;background:var(--soft);font-size:12.5px}
.ph-row i{flex:none;width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,#ff9f0a,#ff375f)}.ph-row i.v{background:linear-gradient(135deg,#5e5ce6,#bf5af2)}.ph-row i.d{background:linear-gradient(135deg,#64d2ff,#0a84ff)}
.ph-row b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.ph-row small{color:var(--ink2);font-variant-numeric:tabular-nums}
.ph-more-n{font-size:12px;color:var(--ink2);padding:4px 8px}
/* ===== Telefon sayfası: premium uygulama görünümü (Apple Silicon) ===== */
body.phone{background:#0b0a18;color:#fff;min-height:100vh;-webkit-font-smoothing:antialiased}
body.phone::before{content:"";position:fixed;inset:-30%;z-index:-1;background:radial-gradient(40% 35% at 20% 15%,rgba(91,140,255,.45),transparent 60%),radial-gradient(35% 30% at 85% 25%,rgba(255,111,168,.35),transparent 60%),radial-gradient(45% 40% at 60% 90%,rgba(0,184,212,.3),transparent 60%);filter:blur(30px);animation:phBg 18s ease-in-out infinite alternate}
@keyframes phBg{to{transform:translate3d(4%,-3%,0) scale(1.08)}}
body.phone .ph-wrap{padding:max(18px,env(safe-area-inset-top)) 16px calc(110px + env(safe-area-inset-bottom))}
body.phone .ph-card{gap:14px}
body.phone .ph-head{flex-direction:column;align-items:center;text-align:center;gap:6px;padding:26px 18px 22px;border-radius:30px;background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14);box-shadow:0 40px 80px -40px rgba(91,140,255,.6),inset 0 1px 0 rgba(255,255,255,.18);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%)}
body.phone #phArt{position:relative;display:grid;place-items:center;min-height:120px}
body.phone #phArt::before{content:"";position:absolute;width:150px;height:150px;border-radius:50%;background:conic-gradient(from 0deg,#5b8cff,#b56bff,#ff6fa8,#30d158,#5b8cff);filter:blur(34px);opacity:.55;animation:spinT 10s linear infinite}
@keyframes spinT{to{transform:rotate(360deg)}}
body.phone .ph-head small{color:#b9b7ff;font-size:12px;letter-spacing:.04em;text-transform:uppercase}
body.phone .ph-head h1{font-size:28px;color:#fff}
body.phone .ph-head p{color:rgba(255,255,255,.7);font-size:13px}
body.phone .ph-step{padding:18px;border-radius:24px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
body.phone .ph-t{font-size:13px;letter-spacing:.02em;color:rgba(255,255,255,.75);text-transform:uppercase;font-weight:700}
body.phone .ph-step .in{height:52px;border-radius:16px;background:rgba(255,255,255,.95);font-size:16px}
body.phone .ph-hint{color:rgba(255,255,255,.55)}
body.phone .ph-main{position:relative;padding:22px 18px;border-radius:22px;background:linear-gradient(135deg,rgba(91,140,255,.25),rgba(181,107,255,.22) 50%,rgba(255,111,168,.2));border:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),0 20px 40px -20px rgba(181,107,255,.7);color:#fff;isolation:isolate}
body.phone .ph-main::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.18) 50%,transparent 65%);transform:translateX(-120%);animation:phSh 3.6s ease-in-out 1s infinite}
@keyframes phSh{0%{transform:translateX(-120%)}35%,100%{transform:translateX(120%)}}
body.phone .ph-main b{font-size:17px}body.phone .ph-main small{color:rgba(255,255,255,.75);font-size:12.5px}
body.phone .ph-main .ph-ico{width:46px;height:46px;margin-bottom:10px}
body.phone .ph-main:active{transform:scale(.98)}
body.phone .ph-row{background:rgba(255,255,255,.08);color:#fff;transition:background .3s}
body.phone .ph-row small{color:rgba(255,255,255,.6)}
body.phone .ph-row.cur{background:rgba(91,140,255,.25)}
body.phone .ph-row.done{background:rgba(48,209,88,.16)}
body.phone .ph-row.done i{background:#30d158;position:relative}body.phone .ph-row.done i::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;font:800 12px var(--font);color:#fff}
body.phone .ph-sum{color:#fff}body.phone .ph-sum span{color:rgba(255,255,255,.6)}body.phone .ph-sum button{color:#b9b7ff}
body.phone .ph-go{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:20;height:58px;border-radius:20px;font-size:17px;font-weight:700;border:0;color:#fff;background:linear-gradient(135deg,#5b8cff,#8a63ff 50%,#ff6fa8);box-shadow:0 20px 40px -14px rgba(138,99,255,.9),inset 0 1px 0 rgba(255,255,255,.3);overflow:hidden;max-width:460px;margin:0 auto}
body.phone .ph-go::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);animation:phSh 3s ease-in-out infinite}
body.phone .ph-go:disabled{opacity:.6}
body.phone .ph-msg{color:rgba(255,255,255,.75)}
body.phone .ph-prep{background:rgba(255,255,255,.1);color:#fff}
body.phone .ph-more{color:rgba(255,255,255,.65)}body.phone .ph-more summary{color:#b9b7ff}
body.phone .ph-diag{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:rgba(255,255,255,.7)}
body.phone .ph-diag ol{color:rgba(255,255,255,.6)}body.phone .ph-diag li.ok{color:#7dffb0}body.phone .ph-diag li.err{color:#ff8fa8}
/* yükleme ekranı: tam ekran */
body.phone .ph-run{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:max(24px,env(safe-area-inset-top)) 22px calc(24px + env(safe-area-inset-bottom));background:#0b0a18;border:0;border-radius:0;animation:dIn .35s}
body.phone .ph-run[hidden]{display:none!important}
.pr-bg{position:absolute;inset:0;overflow:hidden;z-index:-1}
.pr-bg i{position:absolute;width:70vmax;height:70vmax;border-radius:50%;filter:blur(60px);opacity:.45;animation:prB 12s ease-in-out infinite alternate}
.pr-bg i:nth-child(1){left:-30%;top:-20%;background:#5b8cff}.pr-bg i:nth-child(2){right:-35%;top:10%;background:#ff6fa8;animation-delay:-4s}.pr-bg i:nth-child(3){left:-10%;bottom:-40%;background:#00b8d4;animation-delay:-8s}
@keyframes prB{to{transform:translate3d(10%,8%,0) scale(1.15)}}
.pr-top{position:absolute;top:max(18px,env(safe-area-inset-top));left:0;right:0;display:flex;justify-content:center}
.pr-chip{padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.12);font-size:12.5px;font-weight:600;backdrop-filter:blur(14px)}
.pr-stage{display:grid;justify-items:center;gap:18px}
.pr-ringwrap{position:relative;width:min(68vw,260px);aspect-ratio:1}
.pr-ring{width:100%;height:100%;transform:rotate(-90deg);filter:drop-shadow(0 20px 40px rgba(138,99,255,.55))}
.pr-ring circle{fill:none;stroke-width:14}.pr-ring .bg{stroke:rgba(255,255,255,.1)}.pr-ring .fg{stroke:url(#prg);stroke-linecap:round;stroke-dasharray:603.2;stroke-dashoffset:603.2;transition:stroke-dashoffset .5s cubic-bezier(.2,.8,.2,1)}
.pr-core{position:absolute;inset:16%;border-radius:50%;display:grid;place-items:center;align-content:center;text-align:center;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.18),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.2);backdrop-filter:blur(10px)}
.pr-core b{font-size:clamp(40px,13vw,56px);font-weight:800;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.pr-core small{max-width:80%;margin-top:4px;font-size:12px;color:rgba(255,255,255,.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-orbit{position:absolute;inset:-6px;animation:spinT 3.2s linear infinite}
.pr-orbit i{position:absolute;left:50%;top:0;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:#fff;box-shadow:0 0 14px #b56bff,0 0 4px #fff}
.pr-orbit i:nth-child(2){transform:rotate(120deg);transform-origin:5px calc(min(34vw,130px) + 6px);opacity:.6}.pr-orbit i:nth-child(3){transform:rotate(240deg);transform-origin:5px calc(min(34vw,130px) + 6px);opacity:.35}
.pr-check{position:absolute;left:50%;top:50%;width:46%;height:46%;transform:translate(-50%,-50%);opacity:0}
.pr-check path{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40}
.pr-flow{display:flex;align-items:center;gap:10px;width:min(80vw,300px)}
.pr-ph{flex:none;width:26px;height:44px;border-radius:7px;background:#1d1d1f;box-shadow:0 0 0 1.5px rgba(255,255,255,.4)}
.pr-vault{flex:none;width:44px;height:44px;border-radius:13px;background:linear-gradient(135deg,#5b8cff,#b56bff);box-shadow:0 10px 24px -8px rgba(138,99,255,.9)}
.pr-lane{position:relative;flex:1;height:2px;background:rgba(255,255,255,.18);border-radius:2px}
.pr-lane i{position:absolute;top:-5px;width:10px;height:12px;border-radius:3px;background:linear-gradient(135deg,#ffd60a,#ff6fa8);opacity:0;animation:prL 1.6s cubic-bezier(.5,0,.5,1) infinite}
.pr-lane i:nth-child(2){animation-delay:.4s}.pr-lane i:nth-child(3){animation-delay:.8s}.pr-lane i:nth-child(4){animation-delay:1.2s}
@keyframes prL{0%{left:0;opacity:0}15%,85%{opacity:1}100%{left:calc(100% - 10px);opacity:0;transform:scale(.6)}}
.pr-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:min(92vw,420px)}
.pr-stats div{padding:12px 6px;border-radius:16px;text-align:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1)}
.pr-stats small{display:block;font-size:10.5px;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.04em}.pr-stats b{font-size:14.5px;font-variant-numeric:tabular-nums}
.pr-done{display:none;text-align:center}.pr-done h2{font-size:30px;margin:0;letter-spacing:-.03em}.pr-done p{color:rgba(255,255,255,.75);font-size:14px;margin:6px 0 16px}
.pr-btn{height:52px;padding:0 28px;border:0;border-radius:18px;font:700 16px var(--font);color:#0b0a18;background:#fff;box-shadow:0 14px 30px -12px rgba(255,255,255,.5)}
.ph-run.ok .pr-ring .fg{stroke:#30d158}
.ph-run.ok .pr-core b,.ph-run.ok .pr-core small,.ph-run.ok .pr-orbit,.ph-run.ok .pr-flow,.ph-run.ok .pr-stats{display:none}
.ph-run.ok .pr-check{opacity:1}.ph-run.ok .pr-check path{animation:prCk .6s cubic-bezier(.3,1.4,.5,1) .15s forwards}
@keyframes prCk{to{stroke-dashoffset:0}}
.ph-run.ok .pr-done{display:block;animation:rise .5s both .2s}
.ph-run.ok .pr-core{background:radial-gradient(circle,rgba(48,209,88,.35),rgba(48,209,88,.1))}
.pr-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.pr-confetti i{position:absolute;top:-12px;width:8px;height:14px;border-radius:2px;opacity:0}
.ph-run.ok .pr-confetti i{animation:prC 2.4s cubic-bezier(.2,.6,.3,1) forwards}
@keyframes prC{0%{opacity:1;transform:translate(0,0) rotate(0)}100%{opacity:0;transform:translate(var(--dx),105vh) rotate(var(--r))}}
@media (prefers-reduced-motion:reduce){body.phone *{animation:none!important}}
body.phone .ph-main small b{font-size:inherit;font-weight:700}
/* telefon: düz formdaki gibi görünür dosya kutusu */
.ph-form{margin:0}
.ph-file{display:block;width:100%;box-sizing:border-box;padding:14px;border-radius:18px;font-size:15px;color:#fff;background:linear-gradient(135deg,rgba(91,140,255,.28),rgba(181,107,255,.24) 50%,rgba(255,111,168,.22));border:1.5px dashed rgba(255,255,255,.35)}
.ph-file::file-selector-button,.ph-file::-webkit-file-upload-button{margin-right:12px;padding:12px 16px;border:0;border-radius:12px;font:700 15px var(--font);color:#0b0a18;background:#fff}
body.phone .ph-hint b{color:#fff}
/* telefon: iPhone’u yormayan sabit arka plan (hareketli bulanıklık ve cam efekti yok) */
body.phone::before{filter:none!important;animation:none!important;inset:0!important;background:radial-gradient(60% 40% at 15% 0%,rgba(91,140,255,.35),transparent 70%),radial-gradient(50% 35% at 100% 20%,rgba(255,111,168,.25),transparent 70%),radial-gradient(70% 45% at 50% 100%,rgba(0,184,212,.22),transparent 70%)!important}
body.phone .ph-head,body.phone .ph-step,body.phone .pr-core,body.phone .pr-chip{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.phone #phArt::before{filter:none!important;animation:none!important;background:radial-gradient(circle,rgba(181,107,255,.45),transparent 65%)!important}
body.phone .ph-main::after,body.phone .ph-go::after{animation:none!important;display:none}
.pr-bg i{filter:none!important;animation:none!important;opacity:.25!important}
/* telefon: animasyonlu seçim grafiği (gerçek dosya kutusu görünmez olarak üstünde; parmak doğrudan ona dokunur) */
.ph-drop{position:relative;display:grid;justify-items:center;gap:6px;padding:28px 18px 22px;border-radius:26px;text-align:center;overflow:hidden;isolation:isolate;background:linear-gradient(160deg,#1b1840,#2a1c4a 55%,#3a1e46);box-shadow:0 26px 50px -24px rgba(138,99,255,.85),inset 0 1px 0 rgba(255,255,255,.14)}
.ph-drop-ring{position:absolute;inset:-60%;z-index:-2;background:conic-gradient(from 0deg,#5b8cff,#b56bff,#ff6fa8,#ffd60a,#30d158,#64d2ff,#5b8cff);animation:spinT 6s linear infinite}
.ph-drop::before{content:"";position:absolute;inset:2px;z-index:-1;border-radius:24px;background:linear-gradient(160deg,#16133a,#24183f 55%,#311a3c)}
.ph-stack{position:relative;width:118px;height:96px;margin-bottom:8px}
.ph-stack i{position:absolute;left:50%;top:50%;width:62px;height:76px;margin:-38px 0 0 -31px;border-radius:12px;border:3px solid #fff;box-shadow:0 12px 24px -10px rgba(0,0,0,.6)}
.ph-stack .s1{background:linear-gradient(160deg,#ffb347,#ff5e7e);animation:phS1 3.2s ease-in-out infinite}
.ph-stack .s2{background:linear-gradient(160deg,#64d2ff,#5b8cff);animation:phS2 3.2s ease-in-out infinite}
.ph-stack .s3{background:linear-gradient(160deg,#b56bff,#ff6fa8);animation:phS3 3.2s ease-in-out infinite}
.ph-stack .s3::after{content:"";position:absolute;left:8px;right:8px;bottom:9px;height:22px;background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.6) 40% 55%,transparent 55%),linear-gradient(225deg,transparent 45%,rgba(255,255,255,.45) 45% 60%,transparent 60%)}
.ph-stack .s3::before{content:"";position:absolute;right:10px;top:10px;width:10px;height:10px;border-radius:50%;background:#ffd60a}
@keyframes phS1{0%,100%{transform:rotate(-14deg) translate(-16px,4px)}50%{transform:rotate(-20deg) translate(-24px,0)}}
@keyframes phS2{0%,100%{transform:rotate(12deg) translate(16px,4px)}50%{transform:rotate(18deg) translate(24px,0)}}
@keyframes phS3{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.ph-plus{position:absolute;right:-2px;bottom:-4px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font:800 22px/1 var(--font);font-style:normal;color:#0b0a18;background:#fff;box-shadow:0 8px 18px -6px rgba(0,0,0,.6);animation:phP 1.8s ease-in-out infinite}
@keyframes phP{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
.ph-drop b#phDropT{font-size:18px;color:#fff;letter-spacing:-.02em}
.ph-drop small{font-size:12.5px;color:rgba(255,255,255,.7)}.ph-drop small b{color:#fff}
.ph-drop-in{position:absolute;inset:0;width:100%;height:100%;opacity:0;z-index:5;cursor:pointer;font-size:200px}
.ph-drop.has .ph-plus{background:#30d158;color:#fff}.ph-drop.has .ph-plus::before{content:"✓";font-size:18px}.ph-drop.has .ph-plus{font-size:0}
.ph-drop:active{transform:scale(.985)}
@media (prefers-reduced-motion:reduce){.ph-drop *{animation:none!important}}
.ph-stack .s3::after{left:6px;right:6px;bottom:8px;height:26px;background:rgba(255,255,255,.75);clip-path:polygon(0 100%,30% 30%,50% 65%,68% 15%,100% 100%)}
