/* SmartBarkod — telefon sayfaları (giris, hesap) ve e-posta bağlantı sayfaları (sifre-sifirla, davet) ortak stili.
   Kaynak: maket/giris.html (koyu tema). Dış kaynak yok. */
:root{--bg:#0c0e14;--card:#161a24;--card-2:#1d2230;--border:rgba(255,255,255,.12);--primary:#6c5ce7;--accent:#00cec9;
  --success:#00b894;--warning:#fdcb6e;--danger-text:#ff7675;--text:#f5f6fa;--muted:#8e9aa8;color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:"Inter","Segoe UI",system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.45;
  -webkit-text-size-adjust:100%}
button,input{font:inherit}
button{cursor:pointer}
a{color:var(--accent)}
[hidden]{display:none!important}
:focus-visible{outline:3px solid #8b7bff;outline-offset:2px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Sayfa düzeni: telefonda tam ekran, geniş ekranda ortalanmış sütun (en çok 420 px) */
.sayfa{max-width:420px;margin:0 auto;padding:12px 20px 32px;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.adim{display:flex;flex-direction:column;flex:1}
@media (min-width:600px){
  body.kok{display:flex;align-items:flex-start;justify-content:center;padding:48px 16px}
  body.kok .sayfa{min-height:0;width:100%;background:var(--card);border:1px solid var(--border);border-radius:20px;padding:24px 28px 28px;margin:0}
  body.kok .inp,body.kok .keybox{background:var(--bg)}
}

.logo{font-weight:800;letter-spacing:-.02em;white-space:nowrap;line-height:1;font-size:24px}
.logo .a{color:#8b7bff}.logo .b{color:#00cec9}
.p-logo{margin:22px 0 6px}
.ust{display:flex;align-items:center;justify-content:space-between;margin:10px 0 16px;min-height:44px}
.p-h1{font-size:22px;font-weight:700;margin:14px 0 6px;line-height:1.25}
.p-h1:focus{outline:none}
.p-sub{color:var(--muted);font-size:14px;margin:0 0 20px}
.p-txt{font-size:14px;margin:0 0 12px}
.p-note{font-size:12px;color:var(--muted);text-align:center;margin:-6px 0 16px}
.p-hint{font-size:12px;color:var(--muted);margin:6px 0 0}
.center{text-align:center}

/* Form */
.fld{margin-bottom:14px}
.fld label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px;font-weight:500}
.inp{width:100%;min-height:48px;background:var(--card);border:1px solid var(--border);color:var(--text);border-radius:12px;padding:12px 14px;font-size:16px}
.inp:focus{outline:2px solid var(--primary);outline-offset:0;border-color:transparent}
.inp.err{border-color:var(--danger-text);box-shadow:0 0 0 1px var(--danger-text)}
.inp.kod{font-family:ui-monospace,Consolas,monospace;font-size:22px;font-weight:700;letter-spacing:.3em;text-align:center;font-variant-numeric:tabular-nums}
.pw{position:relative}.pw .inp{padding-right:52px}
.eye{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:44px;height:44px;background:none;border:0;color:var(--muted);display:grid;place-items:center;border-radius:10px}
.eye:hover{color:var(--text)}
.msg-err{color:var(--danger-text);font-size:13px;display:flex;gap:8px;align-items:flex-start;margin:-4px 0 14px;font-weight:500}
.msg-ok{color:#55efc4;font-size:13px;display:flex;gap:8px;align-items:flex-start;margin:-4px 0 14px;font-weight:500}
.msg-err svg,.msg-ok svg{flex:none;margin-top:1px}

/* Düğmeler */
.btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;border:0;border-radius:14px;padding:12px 14px;font-weight:700;font-size:15px;
  background:var(--primary);color:#fff;text-align:center;text-decoration:none}
.btn:hover:not(:disabled){filter:brightness(1.08)}
.btn:disabled{background:#2a3040;color:#8e9aa8;cursor:not-allowed}
.btn.ghost{background:transparent;border:1px solid var(--border);color:var(--text)}
.btn.danger{background:transparent;border:1px solid rgba(255,118,117,.55);color:var(--danger-text)}
.btn.danger-dolu{background:#d63031;color:#fff}
.btn+.btn{margin-top:10px}
.btn-sira{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btn-sira .btn{margin:0}
.lnk{background:none;border:0;color:var(--accent);font-weight:600;padding:10px;min-height:44px;font-size:14px;text-decoration:underline;text-underline-offset:3px}
.lnk:disabled{color:var(--muted);text-decoration:none;cursor:default}
.back{align-self:flex-start;display:flex;gap:6px;align-items:center;background:none;border:0;color:var(--muted);font-size:14px;padding:8px 4px;min-height:44px;margin-top:4px}
.back:hover{color:var(--text)}
.mini{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--card-2);border:1px solid var(--border);color:var(--text);border-radius:10px;
  padding:8px 12px;min-height:44px;font-size:13px;font-weight:600;flex:none}
.mini.danger{color:var(--danger-text);border-color:rgba(255,118,117,.45)}
.mini:disabled{color:var(--muted);cursor:default}

/* Simge kutuları ve bildirimler */
.p-ico{width:56px;height:56px;border-radius:16px;background:rgba(0,206,201,.14);color:var(--accent);display:grid;place-items:center;margin-top:14px}
.p-ico.uyari{background:rgba(253,203,110,.14);color:var(--warning)}
.p-ico.hata{background:rgba(255,118,117,.14);color:var(--danger-text)}
.p-ico.ok{background:rgba(0,184,148,.16);color:#55efc4}
.ynote{display:flex;gap:8px;align-items:flex-start;background:var(--warning);color:#2a1f00;border-radius:12px;padding:10px 12px;font-size:13px;font-weight:600;margin:0 0 14px}
.ynote svg{flex:none;margin-top:1px}
.okcard{display:flex;align-items:center;gap:14px;background:rgba(0,184,148,.12);border:1px solid rgba(0,184,148,.45);border-radius:16px;padding:14px;margin-bottom:14px}
.okcard .ck{width:44px;height:44px;border-radius:50%;background:var(--success);color:#04241c;display:grid;place-items:center;flex:none}
.okcard b{display:block;font-size:16px}
.okcard span{font-size:14px;color:var(--text)}
.bilgi{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:12px 14px;font-size:14px;margin:0 0 14px}
.resend{font-size:13px;color:var(--muted);text-align:center;margin:0 0 12px;min-height:44px;display:flex;align-items:center;justify-content:center}
.alert{flex:1;display:flex;flex-direction:column;justify-content:center;text-align:center;padding:10px 4px}
.al-ic{width:76px;height:76px;border-radius:50%;background:rgba(255,118,117,.14);color:var(--danger-text);display:grid;place-items:center;margin:0 auto 18px}
.alert h1{font-size:22px;margin:0 0 10px;line-height:1.25}
.alert p{color:var(--muted);font-size:14px;margin:0 0 24px}
.yukleniyor{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);gap:14px}
.spin{width:40px;height:40px;border-radius:50%;border:4px solid rgba(255,255,255,.12);border-top-color:var(--accent);animation:sp .9s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.skip9{text-align:center;margin-top:10px}
.skip9 .p-hint{text-align:center}

/* Hesap sayfası */
.kimlik{display:flex;gap:14px;align-items:center;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px;margin-bottom:20px}
.av{width:48px;height:48px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-size:16px;font-weight:700;flex:none}
.kimlik-m{min-width:0;flex:1}
.kimlik-m b{display:block;font-size:16px;overflow:hidden;text-overflow:ellipsis}
.kimlik-m span{display:block;font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.rozet{display:inline-block;margin-top:6px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700;background:rgba(108,92,231,.22);color:#c7bfff}
.bolum{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:16px;scroll-margin-top:12px}
.bolum h2{font-size:16px;margin:0 0 8px;display:flex;align-items:center;gap:10px}
.bolum h2 svg{color:var(--accent);flex:none}
.bolum .inp,.bolum .keybox{background:var(--bg)}
.bolum .p-sub{margin-bottom:14px}
.durum{display:flex;align-items:center;gap:8px;font-size:14px;margin:0 0 12px}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none}
.dot.ok{background:#00b894}.dot.no{background:#fdcb6e}
.sec-h{font-size:12px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.08em;margin:4px 0 10px}
.st9{list-style:none;margin:6px 0 14px;padding:0;display:flex;flex-direction:column;gap:14px}
.st9 li{display:flex;gap:10px;align-items:flex-start}
.st9 li>div{flex:1;min-width:0;font-size:14px}
.sn{width:24px;height:24px;border-radius:50%;background:rgba(108,92,231,.22);color:#c7bfff;font-weight:700;font-size:12px;display:grid;place-items:center;flex:none}
.st-s{display:block;font-size:12px;color:var(--muted);margin-top:4px}
.st9 .btn{margin:8px 0 0}
.st-l{display:block;font-size:12px;color:var(--muted);font-weight:600;margin:12px 0 6px}
.qr{background:#fff;border-radius:12px;padding:8px;width:200px;max-width:100%;margin:10px 0 0}
.qr svg{display:block;width:100%;height:auto}
.keybox{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:6px 6px 6px 12px}
.keybox code{flex:1;min-width:0;font-family:ui-monospace,Consolas,monospace;font-size:14px;letter-spacing:.04em;color:var(--text);overflow-wrap:anywhere}
.bk{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin:0 0 12px;
  font-family:ui-monospace,Consolas,monospace;font-size:14px;letter-spacing:.04em}
.bk-act{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.bk-act .btn{margin:0;font-size:14px}
.oturum{list-style:none;margin:0;padding:0}
.oturum li{display:flex;align-items:center;gap:12px;padding:10px 0}
.oturum li+li{border-top:1px solid var(--border)}
.ot-ic{flex:none;width:38px;height:38px;border-radius:10px;background:var(--card-2);display:grid;place-items:center;color:var(--muted)}
.ot-m{flex:1;min-width:0;line-height:1.35}
.ot-m b{display:block;font-size:14px}
.ot-m span{display:block;font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.bu{flex:none;font-size:12px;font-weight:700;color:#55efc4;background:rgba(0,184,148,.14);border-radius:999px;padding:4px 10px}
.cikis{margin-top:8px}
.onay{border:1px solid rgba(255,118,117,.55);border-radius:14px;padding:14px}
.onay p{margin:0 0 12px;font-size:14px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .spin{border-top-color:var(--accent)}
}

/* ---- Abonelik (Faz 4): abonelik.html + hesap.html'deki abonelik şeridi ve satırı; kaynak maket/telefon.html Abonelik ---- */
textarea{font:inherit}
textarea.inp{font-size:16px;line-height:1.4;min-height:72px;resize:vertical}
.ab-h1{margin:0 0 14px}
/* Şerit (hesap.html): deneme mor, bitiyor sarı, ek süre ve kapalı kırmızı (E-3) */
.ab-serit{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;margin:0 0 14px;padding:10px 12px;border-radius:12px;
  background:rgba(108,92,231,.2);border:1px solid rgba(139,123,255,.55);color:#e4dfff;font-size:13px;font-weight:600;line-height:1.35;text-decoration:none}
.ab-serit svg{flex:none}
.ab-serit u{text-underline-offset:2px}
.ab-serit.bitiyor{background:rgba(253,203,110,.14);border-color:rgba(253,203,110,.6);color:#ffeaa7}
.ab-serit.ek,.ab-serit.kapali{background:rgba(214,48,49,.18);border-color:rgba(255,118,117,.6);color:#ffc4c3}
.ab-satir{display:flex;align-items:center;gap:12px;min-height:60px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:12px 14px;
  margin-bottom:16px;color:var(--text);text-decoration:none}
.ab-satir:hover{border-color:rgba(255,255,255,.24)}
.ab-satir-ic{flex:none;width:38px;height:38px;border-radius:10px;background:rgba(0,206,201,.14);color:var(--accent);display:grid;place-items:center}
.ab-satir-m{flex:1;min-width:0;line-height:1.35}
.ab-satir-m b{display:block;font-size:15px}
.ab-satir-m span{display:block;font-size:12px;color:var(--muted)}
.ab-satir-d{flex:none;max-width:45%;font-size:12px;font-weight:600;color:var(--muted);text-align:right}
.ab-satir>svg{flex:none;color:var(--muted)}
/* Durum kartı ve rozetler (B1: deneme camgöbeği, etkin yeşil, bitiyor sarı, ek süre turuncu, doldu kırmızı) */
.ab-kart{display:flex;flex-direction:column;gap:8px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px 16px;margin-bottom:16px}
.ab-kart-ust{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ab-kart-ust h2{font-size:13px;color:var(--muted);font-weight:700;margin:0}
.ab-satirlar{display:flex;flex-direction:column;gap:6px}
.ab-rozet{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.ab-rozet.deneme{background:rgba(0,206,201,.16);color:#81ecec}
.ab-rozet.etkin{background:rgba(0,184,148,.16);color:#55efc4}
.ab-rozet.bitiyor{background:rgba(253,203,110,.16);color:var(--warning)}
.ab-rozet.ek{background:rgba(225,112,85,.2);color:#fab1a0}
.ab-rozet.kapali{background:rgba(255,118,117,.16);color:var(--danger-text)}
.ab-kv{display:flex;justify-content:space-between;gap:10px;font-size:14px}
.ab-kv span{color:var(--muted)}
.ab-kv b{text-align:right;overflow-wrap:anywhere}
.ab-kv small,.ab-lbl small{font-size:12px;font-weight:400}
.ab-kv.toplam{border-top:1px solid var(--border);padding-top:8px;font-size:15px;align-items:baseline}
.ab-kv.toplam b{font-size:22px}
.ab-uyari{margin:4px 0 0;border-radius:12px;padding:10px 12px;font-size:13px;font-weight:600;line-height:1.45}
.ab-uyari.kirmizi{background:rgba(214,48,49,.16);border:1px solid rgba(255,118,117,.55);color:#ffc4c3}
.ab-uyari.sari{background:rgba(253,203,110,.1);border:1px solid rgba(253,203,110,.55);color:#ffeaa7}
.ab-red{background:rgba(214,48,49,.16);border:1px solid rgba(255,118,117,.6);border-radius:16px;padding:14px;margin-bottom:16px}
.ab-red p{margin:0 0 6px;font-size:14px;font-weight:600;color:#ffc4c3;overflow-wrap:anywhere}
.ab-red .ab-red-alt{font-size:12px;font-weight:500;color:var(--muted);margin-bottom:12px}
/* Adımlar: Paket, Fatura, Ödeme, Onay */
.ab-adimlar{list-style:none;display:flex;gap:6px;padding:0;margin:4px 0 16px;scroll-margin-top:12px}
.ab-adimlar li{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;color:var(--muted);font-weight:600}
.ab-adimlar li i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:13px;background:var(--card-2);
  border:1px solid var(--border);color:#c3ccd6}
.ab-adimlar li.tamam i{background:rgba(0,184,148,.18);border-color:var(--success);color:#55efc4}
.ab-adimlar li.simdi{color:var(--text)}
.ab-adimlar li.simdi i{background:var(--primary);border-color:var(--primary);color:#fff}
.ab-adim,.ab-form,.ab-grup{display:flex;flex-direction:column;gap:12px}
.ab-adim h2{font-size:18px;margin:0;line-height:1.3}
.ab-adim h2:focus{outline:none}
.ab-adim .fld,.ab-adim .p-hint,.ab-adim .ynote,.ab-adim .msg-err,.ab-adim .msg-ok,.ab-kutu .msg-err,.ab-kutu .msg-ok{margin:0}
.ab-adim .fld .p-hint{margin:6px 0 0}
.ab-adim .btn+.btn{margin-top:0}
.ab-ferr{margin:6px 0 0;font-size:13px;color:var(--danger-text);font-weight:500}
.ab-ipucu{font-weight:400;color:var(--muted)}
.ab-seg{display:flex;gap:4px;padding:4px;background:var(--card);border:1px solid var(--border);border-radius:14px}
.ab-seg button{flex:1;min-height:44px;border:0;border-radius:10px;background:none;color:var(--muted);font-size:13px;font-weight:600;padding:4px 6px;line-height:1.25}
.ab-seg button[aria-pressed=true]{background:var(--primary);color:#fff}
.ab-paketler{display:flex;flex-direction:column;gap:10px}
.ab-pk{display:flex;flex-direction:column;gap:4px;width:100%;text-align:left;padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--border);color:var(--text)}
.ab-pk[aria-pressed=true]{border-color:var(--primary);background:rgba(108,92,231,.14);box-shadow:inset 0 0 0 1px var(--primary)}
.ab-pk.pasif{cursor:not-allowed}
.ab-pk.pasif .ab-pk-h,.ab-pk.pasif>small{opacity:.55}
.ab-pk-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.ab-pk-h b{font-size:16px}
.ab-pk-p{font-size:16px;font-weight:700;white-space:nowrap}
.ab-pk small{font-size:12px;color:var(--muted);font-weight:500}
.ab-pk-x{font-size:13px;color:var(--danger-text);font-weight:600}
/* Havale/EFT, dekont ve bekleme kutuları */
.ab-kutu{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--border)}
.ab-kutu h3{font-size:13px;color:var(--muted);font-weight:700;margin:0}
.ab-kutu .p-hint,.ab-kutu .bk-act{margin:0}
.ab-lbl{font-size:12px;color:var(--muted);font-weight:600;margin-top:4px}
.ab-yontem{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid var(--border);font-size:14px}
.ab-yontem.secili{border-color:var(--primary);background:rgba(108,92,231,.12)}
.ab-yontem.kapali{color:var(--muted)}
.ab-yontem svg{flex:none}
.ab-yontem em{margin-left:auto;font-style:normal;font-size:12px;font-weight:600}
.ab-kopya{display:flex;align-items:center;gap:8px}
.ab-kopya code{flex:1;min-width:0;font-family:ui-monospace,Consolas,monospace;font-size:14px;letter-spacing:.02em;overflow-wrap:anywhere}
.ab-kopya.ref{border:1px dashed var(--primary);background:rgba(108,92,231,.1);border-radius:12px;padding:6px 6px 6px 12px}
.ab-kopya.ref code{font-size:20px;font-weight:700;color:#fff;letter-spacing:.06em}
.ab-kopya.tutar code{font-size:16px;font-weight:700}
.ab-dk-sec{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;background:rgba(0,184,148,.1);border:1px solid rgba(0,184,148,.45);border-radius:12px;padding:8px 8px 8px 12px}
.ab-dk-ok{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:#55efc4}
.ab-dk-ad{flex:1;min-width:0;font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.ab-bekle{flex-direction:row;align-items:flex-start;gap:12px;font-size:14px;line-height:1.45}
.ab-bekle p{margin:0}
.ab-bekle-ic{flex:none;width:36px;height:36px;border-radius:50%;background:rgba(253,203,110,.16);color:var(--warning);display:grid;place-items:center}
.ab-iptal{display:flex;flex-direction:column;align-items:center}
.ab-iptal .onay{width:100%}
.ab-iptal .onay .msg-err{margin:0 0 12px}
.lnk.tehlike{color:var(--danger-text)}
.ab-alt h2{font-size:16px;margin:0}
.ab-alt .p-sub,.ab-alt .p-txt{margin:0}
.ab-alt>div{display:flex;flex-direction:column;gap:10px}


/* ==== Faz 3: alt gezinme, Tanımlar, Bilgisayar (görünüş ve metinler: maket/telefon.html) ==== */
/* Alt gezinme: ortak/telefon-gezinme.js çizer. Sayfa: <body class="gezinmeli"> … <nav id="alt-gezinme" data-etkin="…"> */
body.gezinmeli .sayfa{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
#alt-gezinme{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;min-height:64px;
  background:var(--card);border-top:1px solid var(--border);padding:6px max(4px,calc((100% - 420px) / 2)) calc(10px + env(safe-area-inset-bottom))}
#alt-gezinme a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0;border-radius:12px;font-size:12px;
  font-weight:600;color:var(--muted);text-decoration:none;-webkit-tap-highlight-color:transparent}
#alt-gezinme svg{width:24px;height:24px}
#alt-gezinme a:hover,#alt-gezinme a[aria-current=page]{color:var(--text)}
#alt-gezinme a[aria-current=page] svg{color:var(--accent)}

/* Ortak parçalar (maket .pg-top .note .lbl .info .warn .seg .kv .btn.pri/.sec) */
.pg-top{display:flex;align-items:center;gap:10px;min-height:44px;margin:4px 0 12px}
.pg-top h1{font-size:20px;font-weight:700;letter-spacing:-.01em;line-height:1.25;margin:0;min-width:0}
.pg-top h1:focus{outline:none}
.geri-hap{flex:none;min-height:36px;padding:8px 12px;border:0;border-radius:14px;background:rgba(255,255,255,.08);font-size:14px;font-weight:600;color:var(--text)}
.yigin{display:flex;flex-direction:column;gap:12px}
.yigin>.lnk{align-self:center}
.note{font-size:13px;color:var(--muted);line-height:1.45;margin:0}
.lbl{font-size:13px;color:var(--muted);font-weight:600;margin:0 0 -4px}
.lbl span{font-weight:400}
.info{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:12px;background:rgba(0,206,201,.08);
  border:1px solid rgba(0,206,201,.3);color:#b8f1ef;font-size:13px;line-height:1.45;text-align:left}
.info svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--accent)}
.warn{border:1px solid var(--warning);background:rgba(253,203,110,.07);border-radius:14px;padding:12px 14px;font-size:14px;line-height:1.45}
.warn p{margin:0}
.seg{display:flex;background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:4px;gap:4px}
.seg button{flex:1;min-height:40px;border:0;border-radius:8px;background:none;font-size:13px;font-weight:600;color:var(--muted);padding:4px 6px;line-height:1.25}
.seg button[aria-pressed=true]{background:var(--primary);color:#fff}
.kv{display:flex;justify-content:space-between;gap:10px;font-size:14px}
.kv span{color:var(--muted)}
.kv b{text-align:right;overflow-wrap:anywhere}
a.btn{text-decoration:none}
.btn svg{flex:none;width:20px;height:20px}
.btn.pri{box-shadow:0 8px 24px rgba(108,92,231,.45)}
.btn.sec{background:var(--card-2);border:1px solid var(--border);color:var(--text)}
.btn.sec.kirmizi{color:var(--danger-text)}
.alert h2{font-size:22px;margin:0 0 10px;line-height:1.25}
.acts{display:flex;flex-direction:column;gap:10px}
.acts .btn+.btn,.sheet .btn+.btn,.bos-ekran .btn+.btn{margin-top:0}

/* Tanımlar (tanimlar.html) */
.df{display:flex;align-items:center;gap:12px;width:100%;padding:12px 12px 12px 14px;border-radius:16px;background:var(--card);
  border:1px solid var(--border);text-align:left;color:var(--text)}
.df:hover{border-color:rgba(255,255,255,.24)}
.df-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.df-t b{font-size:15px}
.df-t small{font-size:12px;color:var(--muted);line-height:1.35}
.df .parts{font-size:12px}
.df>svg{flex:none;width:18px;height:18px;color:var(--muted)}
.df.off{opacity:.55}
.tag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:8px;font-size:11px;font-weight:700;vertical-align:1px;
  background:rgba(0,206,201,.12);color:var(--accent)}
.tag.u{background:rgba(255,255,255,.08);color:#c3ccd6}
.parts{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font:600 14px/1.35 Consolas,"Cascadia Mono",ui-monospace,monospace}
.pt{padding:2px 6px;border-radius:6px;background:rgba(255,255,255,.08);word-break:break-all}
.pt.raw{font-family:Inter,"Segoe UI",system-ui,sans-serif;font-style:italic;font-weight:500;color:var(--muted)}
.sep{color:var(--accent);font-weight:800;padding:0 1px}
.key{flex:none;padding:2px 7px;border-radius:6px;background:rgba(108,92,231,.25);border:1px solid rgba(139,123,255,.55);color:#dcd6ff;
  font:700 12px/1.5 Inter,"Segoe UI",system-ui,sans-serif;white-space:nowrap}
.fl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border-radius:14px;background:var(--card);border:1px solid var(--border);overflow:hidden}
.fl li{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 12px}
.fl li+li{border-top:1px solid var(--border)}
.fl .n{flex:none;width:24px;height:24px;border-radius:50%;background:var(--primary);color:#fff;font-size:12px;font-weight:800;display:grid;place-items:center}
.fl .ft{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.fl .ft b{font-size:14px}
.fl .ft code{font:12px Consolas,"Cascadia Mono",ui-monospace,monospace;color:var(--muted)}
.ud{flex:none;width:36px;height:36px;border:0;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.06);color:var(--text)}
.ud svg{width:18px;height:18px}
.ud:disabled{opacity:.25;cursor:default}
.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.keys.f{grid-template-columns:repeat(6,1fr)}
.keys button{min-height:38px;padding:0 2px;border-radius:10px;background:var(--card-2);border:1px solid var(--border);font-size:13px;font-weight:600;color:#c3ccd6}
.keys button[aria-pressed=true]{background:var(--primary);border-color:var(--primary);color:#fff}
/* Sondaki tuşun kaç kez basılacağı (Tanımlar; 01.10.2026) */
.sayac{display:flex;align-items:center;gap:10px;margin-top:8px}
.sayac span{flex:1;font-size:13px;font-weight:600;color:var(--muted)}
.sayac button{width:44px;height:40px;border-radius:10px;background:var(--card-2);border:1px solid var(--border);font-size:20px;font-weight:700;color:#c3ccd6}
.sayac button:disabled{opacity:.4}
.sayac b{min-width:28px;text-align:center;font-size:17px}
.pvl{display:flex;flex-direction:column;gap:8px;padding:12px 14px;border-radius:14px;background:#0f1219;border:1px dashed rgba(0,206,201,.45)}
.pvl>small{font-size:12px;font-weight:700;color:var(--accent);letter-spacing:.04em;text-transform:uppercase}
.swrow{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--border);text-align:left;color:var(--text)}
.swt{flex:1;font-size:15px;font-weight:600;line-height:1.3}
.swt small{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:3px;line-height:1.4}
.sw{position:relative;flex:none;width:44px;height:26px;border-radius:13px;background:#4a5263;transition:background .2s}
.sw::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s}
.swrow[aria-checked=true] .sw{background:var(--success)}
.swrow[aria-checked=true] .sw::after{transform:translateX(18px)}
/* Tanımlar › Kimlik ön yüzü (yazma şablonu; maket/kimlik-sablon.html) */
.grup{margin:8px 0 -2px;font-size:12.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#c3ccd6}
.grup span{font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted)}
.tag.oz{background:rgba(108,92,231,.22);color:#cfc8ff}
.seg.iki{display:grid;grid-template-columns:1fr 1fr}
.seg button:disabled{opacity:.45;cursor:default}
.fl li.kapali .ft{opacity:.45}
.fl li.kapali .n{background:#3a4152;color:var(--muted)}
/* Bilgi aç/kapa anahtarı (maket/kimlik-sablon.html). Yalnız role=switch: .mini aynı zamanda küçük düğme (Kopyala, Kapat, Kaldır);
   kural eskiden bütün .mini'lere uyuyor, düğmeler anahtar gibi görünüyordu (06.10). min-height/padding düğme kuralından gelir, sıfırlanır. */
.mini[role=switch]{position:relative;flex:none;width:36px;height:22px;min-height:0;padding:0;border:0;border-radius:11px;background:#4a5263;transition:background .2s}
.mini[role=switch]::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s}
.mini[role=switch][aria-checked=true]{background:var(--success)}
.mini[role=switch][aria-checked=true]::after{transform:translateX(14px)}
.hiz{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#c3ccd6}
.hiz i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--success)}
.hiz.yavas i{background:var(--warning)}
.kayit-durum{min-height:20px;margin:0;font-size:13px;color:var(--muted);text-align:center}
.kayit-durum.hata{color:var(--danger-text)}
.kayit-durum .lnk{min-height:0;padding:0 4px}

/* Bilgisayar (bilgisayar.html) */
.pc{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:18px;background:var(--card);border:1px solid var(--border)}
.pc-h{display:flex;align-items:center;gap:12px}
.pc-ic{flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:rgba(0,206,201,.12);color:var(--accent)}
.pc-ic svg{width:28px;height:28px}
.pc-ic.buyuk{width:72px;height:72px;border-radius:22px}
.pc-h b{font-size:19px;display:block}
.pc-h small{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);margin-top:4px}
.bos-ekran{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:14px}
.bos-ekran h2{font-size:21px;margin:0}
.bos-ekran p{color:#c3ccd6;line-height:1.5;margin:0}
.adimlar{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;font-size:14px;color:#c3ccd6}

/* Alt sayfa (maket .sheet): onay ve açıklama pencereleri */
.ovl{position:fixed;inset:0;z-index:40;background:rgba(5,6,10,.62)}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:41;max-width:480px;max-height:92%;margin:0 auto;overflow-y:auto;background:var(--card);
  border-top:1px solid var(--border);border-radius:24px 24px 0 0;padding:10px 18px calc(22px + env(safe-area-inset-bottom));
  display:flex;flex-direction:column;gap:12px;animation:sheetUp .28s ease-out}
.sheet h2{font-size:18px;margin:0}
.sheet .msg-err{margin:0}
.grab{flex:none;width:40px;height:5px;border-radius:3px;background:rgba(255,255,255,.22);align-self:center}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:none}}

/* Programı indir kutusu (Bilgisayar sekmesi; maket .dlb) */
.dlb{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:16px;background:var(--card);border:1px dashed var(--border);text-align:left;align-self:stretch}
.sheet .dlb{background:var(--card-2)}
.dlb-h{display:flex;align-items:center;gap:10px}
.dlb-h b{font-size:15px}
.dlb-ic{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(108,92,231,.18);color:#b3abff}
.dlb-ic svg{width:19px;height:19px}
.dlb p{margin:0;font-size:13px;color:var(--muted);line-height:1.45}
.dlb-u{font:600 15px/1.3 ui-monospace,Consolas,monospace;color:var(--accent);background:var(--card-2);border-radius:10px;padding:9px 12px;user-select:all;word-break:break-all}
.sheet .dlb-u{background:var(--bg)}
.dlb .btn{align-self:flex-start;width:auto;min-height:44px;font-size:14px;margin:0}
/* ---- Cihaz adı, rozet ve bağlantı (STANDART.md §5; maket telefon.html 365–398; 03.10.2026). Rozetin biçimi ortak/rozet.css. ---- */
.pc [hidden],.sheet [hidden],.ab-satir[hidden]{display:none!important}
.rz-yer{flex:none;display:flex;align-items:center;justify-content:center}
.ab-satir .rz-yer{width:38px}
.pc-hs{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pc-h .pc-nm{font-size:21px;font-weight:800;line-height:1.2;overflow-wrap:anywhere}
.pc-h .pc-tur{font-size:12.5px;margin-top:0}
.pc-rn{flex:none;align-self:flex-start;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font-size:13px;padding:6px 2px;min-height:36px}
.pc-rn svg{width:14px;height:14px;flex:none}
.pc-sep{width:100%;border:0;border-top:1px solid var(--border);margin:2px 0 0}
.btn.sec.pc-kes{color:var(--danger-text)}
.pc.ayr .pc-h,.pc.ayr .kv{opacity:.5}
.pc.ayr .sb-rozet,.pc.ayr .pc-ic{filter:grayscale(1)}
.dot.ayr{background:var(--warning)}
.pc .pc-kal{display:block;margin:0 auto;color:var(--danger-text);font-size:13.5px}
.kes-op{display:flex;flex-direction:column;gap:4px;width:100%;padding:14px 16px;border-radius:16px;background:var(--card-2);border:1px solid var(--border);color:var(--text);text-align:left;font:inherit;cursor:pointer}
.kes-op b{font-size:16.5px;font-weight:700}
.kes-op small{font-size:13.5px;line-height:1.45;color:var(--muted)}
.kes-op.dng b{color:var(--danger-text)}
.kes-op:active{transform:scale(.99)}
.kes-op:disabled{opacity:.5;cursor:default}
.rn-pv{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:var(--card-2);border:1px solid var(--border)}
.rn-pv b{font-size:19px;font-weight:700;min-width:0;overflow-wrap:anywhere}
.rn-cs{display:flex;gap:10px;flex-wrap:wrap}
.rn-c{width:40px;height:40px;padding:0;border-radius:50%;border:3px solid var(--card);box-shadow:0 0 0 1px var(--border);cursor:pointer}
.rn-c[aria-checked="true"]{box-shadow:0 0 0 2px #fff}
.sheet .inp{background:var(--bg)}
.sheet .fld{margin:0}
.sheet .fld label span{font-weight:400}
.bildirim{position:fixed;left:14px;right:14px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:50;max-width:480px;margin:0 auto;background:#f5f6fa;color:#0c0e14;border-radius:14px;padding:12px 14px;font-size:14px;font-weight:600;line-height:1.4;box-shadow:0 12px 30px rgba(0,0,0,.5);opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s;pointer-events:none}
.bildirim.show{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.bildirim{transition:none}}