:root{
  --bg:#f4f6fb; --card:#fff; --ink:#0f1e38; --muted:#5b6b82; --line:#e2e8f2;
  --brand:#0e4fd8; --brand2:#0bb5a0; --navy:#0a1c33; --danger:#d92d20; --ok:#067647;
  --radius:16px; --shadow:0 10px 30px rgba(15,30,56,.08);
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter','Inter Fallback',system-ui,-apple-system,'Segoe UI',sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--brand);text-decoration:none} a:hover{text-decoration:underline}
.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:28px;padding:12px 28px;background:rgba(10,28,51,.97);color:#fff;box-shadow:0 4px 20px rgba(0,0,0,.18)}
.brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;font-size:19px}
.brand:hover{text-decoration:none}.brand em{font-style:normal;color:#5eead4}
.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--brand2));font-family:'Playfair Display',serif;font-size:20px}
.nav{display:flex;gap:20px;margin-right:auto}.nav a{color:#cbd8ec;font-weight:500;font-size:14.5px}.nav a:hover{color:#fff;text-decoration:none}
.userbox{display:flex;align-items:center;gap:12px}
.userchip{display:flex;align-items:center;gap:10px}
.avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand2));font-weight:700}
.uname{display:flex;flex-direction:column;line-height:1.15;font-size:13.5px;font-weight:600}
.uname small{color:#9fb2cf;font-weight:500;font-size:11px}
.container{max-width:1120px;margin:0 auto;padding:32px 20px 60px}
.footer{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;padding:22px 28px;color:var(--muted);font-size:13px;border-top:1px solid var(--line);background:#fff}
.dev-credit{flex-basis:100%;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);text-decoration:none}
.dev-credit:hover{text-decoration:none;color:#475569}
.dev-credit:hover strong{text-decoration:underline}
.dev-credit:hover img{transform:scale(1.06)}
.dev-credit img{transition:transform .15s}
.dev-credit img{height:30px;width:auto;object-fit:contain}
.map-frame{width:100%;height:380px;border:0;border-radius:14px;display:block}
.dev-credit strong{color:#334155;font-weight:700}
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;border-radius:11px;padding:11px 18px;font-weight:600;font-size:14.5px;cursor:pointer;transition:.15s;font-family:inherit}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,var(--brand),#0a3cb0);color:#fff;box-shadow:0 6px 16px rgba(14,79,216,.3)}
.btn-teal{background:linear-gradient(135deg,#0bb5a0,#078a76);color:#fff}
.btn-ghost{background:transparent;border-color:#33456b;color:#dbe6f7}
.btn-light{background:#fff;color:var(--ink);border-color:var(--line)}
.btn-danger{background:#fff1f0;color:var(--danger);border-color:#f3c2bd}
.btn-sm{padding:8px 13px;font-size:13.5px;border-radius:9px}
.btn[disabled]{opacity:.55;pointer-events:none}
.hero{background:radial-gradient(1000px 500px at 15% -10%,#1d4ed8 0,transparent 55%),radial-gradient(800px 400px at 90% 0,#0bb5a0 0,transparent 50%),var(--navy);color:#fff;border-radius:24px;padding:52px 48px;margin-bottom:30px;box-shadow:var(--shadow)}
.hero h1{font-family:'Playfair Display',serif;font-size:42px;line-height:1.12;margin:0 0 14px}
.hero h1 em{font-style:normal;color:#5eead4}
.hero p{color:#c3d3ec;font-size:16.5px;max-width:720px;line-height:1.65;margin:0 0 26px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:30px}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.step > b{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#e8effd;color:var(--brand);font-size:17px;margin-bottom:12px}
.step h3{margin:0 0 6px;font-size:16px}.step p{margin:0;color:var(--muted);font-size:14px;line-height:1.55}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.card h3{margin:0 0 8px;font-size:18px}.card p{color:var(--muted);font-size:14px;line-height:1.6}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.02em}
.badge-editor{background:#fef3c7;color:#92400e}.badge-author{background:#e0ecff;color:#174ea6}
.badge-all{background:#d3f8e3;color:#05603a}.badge-off{background:#f1f4f9;color:#8494ad}
.badge-ok{background:#d3f8e3;color:#05603a}.badge-no{background:#ffe4e0;color:#b42318}
.meta{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.notes{background:#f8fafc;border:1px dashed var(--line);border-radius:12px;padding:13px 16px;font-size:13.5px;color:var(--muted)}
.notes li{margin:3px 0}
.alert{border-radius:12px;padding:14px 18px;margin-bottom:20px;font-weight:500;font-size:14.5px}
.alert-success{background:#ecfdf3;border:1px solid #a6f4c5;color:var(--ok)}
.alert-error{background:#fef3f2;border:1px solid #fecdca;color:var(--danger)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}
.panel h2{margin:0 0 6px}.sub{color:var(--muted);margin:0 0 22px;font-size:14.5px;line-height:1.6}
label.f{display:block;font-weight:600;font-size:13.5px;margin:16px 0 7px}
input[type=text],input[type=email],input[type=password],select,textarea{width:100%;padding:12px 14px;border:1.5px solid var(--line);border-radius:11px;font:inherit;font-size:14.5px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid #b9d0fb;border-color:var(--brand)}
textarea{font-family:ui-monospace,'Cascadia Code',Consolas,monospace;font-size:12.5px;line-height:1.5}
.dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;min-height:150px;border:2px dashed #b7c8e8;border-radius:16px;padding:28px 24px;text-align:center;background:#f8fbff;transition:.15s;cursor:pointer;margin:6px 0 4px}
.dropzone:hover,.dropzone.drag{border-color:var(--brand);background:#eef4ff}
.dropzone .big{font-size:34px;line-height:1}.dropzone p{color:var(--muted);margin:0;font-size:14px;line-height:1.55;max-width:520px}
.dropzone input{display:none}.file-name{font-weight:700;color:var(--brand);font-size:14px;overflow-wrap:anywhere}
.upload-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
.upload-grid>div{min-width:0}
.checkline{display:flex;gap:9px;align-items:center;font-weight:600;font-size:14px;margin:14px 0 4px;cursor:pointer}
.checkline input{width:17px;height:17px;flex:0 0 auto}
.auth-wrap{max-width:440px;margin:40px auto}
table.tbl{width:100%;border-collapse:collapse;font-size:14px}
table.tbl th{text-align:left;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding:10px 12px;border-bottom:2px solid var(--line)}
table.tbl td{padding:13px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.flex{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.spread{justify-content:space-between}
.dl-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0}
.dl{background:#f8fbff;border:1.5px solid var(--line);border-radius:14px;padding:22px;text-align:center}
.dl .ico{font-size:34px}.dl h4{margin:10px 0 4px}.dl p{color:var(--muted);font-size:13px;margin:0 0 14px}
.pdf-frame{width:100%;height:640px;border:1px solid var(--line);border-radius:14px;background:#fff}
.tabs{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.tabs a{padding:9px 16px;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:600;font-size:14px;color:var(--ink)}
.tabs a.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.tabs a:hover{text-decoration:none}
.empty{border:1.5px dashed var(--line);border-radius:16px;padding:44px;text-align:center;color:var(--muted);background:#fff}
code.k{background:#eef2f7;padding:2px 7px;border-radius:6px;font-size:13px}
/* ---- Sağlamlaştırma / cila ---- */
.panel{overflow:visible}
.card{transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-2px);box-shadow:0 16px 38px rgba(15,30,56,.12)}
.step{transition:transform .15s}.step:hover{transform:translateY(-2px)}
table.tbl td{overflow-wrap:anywhere}
select{appearance:auto}
.btn-primary:active,.btn-teal:active{transform:translateY(0)}
input[type=file]{max-width:100%}
.grid>*{min-width:0}
.topbar{flex-wrap:wrap;row-gap:8px}
@media(max-width:1020px){.steps{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:820px){
  .steps,.dl-cards,.upload-grid{grid-template-columns:1fr!important}
  .hero{padding:36px 24px}.hero h1{font-size:31px}
  .nav{display:none}.uname{display:none}
  .container{padding:22px 14px 44px}
  .panel{padding:20px}
  .dropzone{min-height:128px;padding:22px 16px}
  .pdf-frame{height:460px}
}
@media(max-width:560px){.steps{grid-template-columns:1fr!important}.grid{grid-template-columns:1fr!important}}

/* ============================================================
   TEMA v2 — ThinkBro tasarım dili: lacivert + altın, cam kartlar,
   hap butonlar, dalgalar, yumuşak geçişler, dizgi animasyonları
   ============================================================ */
:root{
  --brand:#0d3a7d; --brand2:#c9973f; --navy:#081f42; --gold:#d4a437; --gold2:#b9821e;
  --radius:20px; --shadow:0 14px 40px rgba(8,31,66,.10);
  --ease:cubic-bezier(.22,.9,.28,1);
}
body{background:linear-gradient(180deg,#f7f9fd 0,#eef2f9 320px,#f4f6fb 100%)}
::selection{background:#f3d489;color:#3a2a05}
::-webkit-scrollbar{width:11px}::-webkit-scrollbar-track{background:#edf1f8}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#9db6dd,#c9973f);border-radius:8px;border:2px solid #edf1f8}

/* --- Üst bar: açık cam, lacivert metin, hap menü (ThinkBro tarzı) --- */
.topbar{background:rgba(255,255,255,.88);backdrop-filter:blur(14px);color:var(--ink);
  box-shadow:0 6px 24px rgba(8,31,66,.08);border-bottom:1px solid rgba(226,232,242,.9)}
.brand{color:var(--navy)} .brand em{color:var(--gold2)}
.brand-logo{height:44px;width:auto;display:block;transition:transform .35s var(--ease)}
.brand:hover .brand-logo{transform:scale(1.06) rotate(-1.5deg)}
.brand-mark{background:linear-gradient(135deg,var(--navy),#144a96);color:#f3d489;box-shadow:0 6px 16px rgba(8,31,66,.25)}
.nav a{color:#3c5173;font-weight:600;padding:8px 14px;border-radius:999px;transition:all .35s var(--ease);position:relative}
.nav a:hover{color:#fff;background:linear-gradient(135deg,var(--navy),#144a96);text-decoration:none;box-shadow:0 8px 18px rgba(8,31,66,.22)}
.nav a::after{content:"";position:absolute;left:50%;bottom:-4px;width:0;height:3px;border-radius:3px;
  background:linear-gradient(90deg,var(--gold),var(--gold2));transform:translateX(-50%);transition:width .35s var(--ease)}
.nav a:hover::after{width:55%}
.uname small{color:#8494ad}
.avatar{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#fff;box-shadow:0 6px 14px rgba(201,151,63,.4)}
.topbar .btn-ghost{background:#fff;border-color:#d7e0ef;color:var(--navy)}
.topbar .btn-ghost:hover{border-color:var(--gold);color:var(--gold2)}

/* --- Butonlar: hap form, parlama süpürmesi, altın/lacivert --- */
.btn{border-radius:999px;padding:12px 22px;transition:all .35s var(--ease);position:relative;overflow:hidden;isolation:isolate}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .35s var(--ease);
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%)}
.btn:hover::before{opacity:1;transform:translateX(120%);transition:transform .8s var(--ease),opacity .2s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn-primary{background:linear-gradient(135deg,#144a96,var(--navy));color:#fff;box-shadow:0 10px 24px rgba(8,31,66,.30)}
.btn-primary:hover{box-shadow:0 16px 32px rgba(8,31,66,.38)}
.btn-teal{background:linear-gradient(135deg,#e8c268,var(--gold) 55%,var(--gold2));color:#23180a;box-shadow:0 10px 24px rgba(201,151,63,.38)}
.btn-teal:hover{box-shadow:0 16px 34px rgba(201,151,63,.48)}
.btn-light{border-color:#d7e0ef;box-shadow:0 4px 12px rgba(8,31,66,.06)}
.btn-light:hover{border-color:var(--gold);color:var(--gold2)}
.btn-sm{padding:9px 16px;border-radius:999px}

/* --- Hero: lacivert derinlik, altın ışık lekeleri, dalga, süzülen tipografi işaretleri --- */
.hero{position:relative;overflow:hidden;border-radius:28px;
  background:radial-gradient(900px 480px at 85% -10%,rgba(212,164,55,.38) 0,transparent 55%),
             radial-gradient(800px 500px at 8% 110%,rgba(20,74,150,.65) 0,transparent 55%),
             linear-gradient(150deg,#0b2c5c 0%,#081f42 58%,#061831 100%);
  box-shadow:0 24px 60px rgba(8,31,66,.28)}
.hero::before,.hero::after{content:"";position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}
.hero::before{width:340px;height:340px;right:-90px;top:-120px;
  background:radial-gradient(circle at 35% 35%,rgba(243,212,137,.85),rgba(201,151,63,.25) 65%,transparent 72%);
  animation:goldFloat 9s ease-in-out infinite}
.hero::after{width:200px;height:200px;left:-60px;bottom:-90px;
  background:radial-gradient(circle at 40% 40%,rgba(96,150,230,.5),transparent 70%);animation:goldFloat 12s ease-in-out infinite reverse}
@keyframes goldFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(22px) scale(1.06)}}
.hero>*{position:relative;z-index:2}
.hero-wave{position:absolute;left:0;right:0;bottom:-2px;z-index:1;pointer-events:none;opacity:.9}
.hero h1 em{background:linear-gradient(92deg,#f3d489,#d4a437);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .btn-ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.35);color:#eef3fc;backdrop-filter:blur(6px)}
.hero .btn-ghost:hover{border-color:var(--gold);color:#f3d489}
.glyphs{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.glyphs span{position:absolute;color:rgba(243,212,137,.16);font-family:'Playfair Display',serif;font-weight:700;
  animation:glyphFloat linear infinite}
@keyframes glyphFloat{0%{transform:translateY(24px) rotate(-6deg);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateY(-120px) rotate(8deg);opacity:0}}

/* --- Kartlar / paneller: büyük yarıçap, kademeli belirme --- */
.card,.step,.panel,.dl{border-radius:22px;transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease)}
.card:hover,.step:hover{transform:translateY(-6px);box-shadow:0 24px 48px rgba(8,31,66,.15);border-color:#ecd9a8}
.step > b{background:linear-gradient(135deg,#fdf3d7,#f3d489);color:#7c5a10;box-shadow:inset 0 0 0 1px #ecd9a8}
.rv{opacity:0;transform:translateY(26px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.rv.in{opacity:1;transform:none}
.tabs a{transition:all .35s var(--ease)}
.tabs a:hover{transform:translateY(-2px);border-color:var(--gold);color:var(--gold2)}
.tabs a.on{background:linear-gradient(135deg,#144a96,var(--navy));border-color:transparent;box-shadow:0 10px 22px rgba(8,31,66,.25)}
input:focus,select:focus,textarea:focus{outline:2px solid #f3d489;border-color:var(--gold)}
.dropzone{border-radius:20px;transition:all .4s var(--ease)}
.dropzone:hover,.dropzone.drag{border-color:var(--gold);background:linear-gradient(180deg,#fffaf0,#fff4d9);transform:scale(1.01)}
.dropzone.drag .big{animation:dzBounce .6s ease infinite alternate}
@keyframes dzBounce{from{transform:translateY(0)}to{transform:translateY(-7px)}}
.alert{animation:alertIn .5s var(--ease)}
@keyframes alertIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.badge-all{background:linear-gradient(135deg,#fdf3d7,#f6e2ac);color:#7c5a10}

/* --- Kayan şerit (ticker) --- */
.ticker{overflow:hidden;border-radius:999px;margin:0 0 30px;padding:11px 0;color:#5b6b82;font-weight:600;font-size:13.5px;
  background:rgba(255,255,255,.75);border:1px solid var(--line);white-space:nowrap;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ticker-track{display:inline-flex;gap:0;animation:tickerMove 30s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track span{padding:0 18px}
.ticker-track b{color:var(--gold2)}
@keyframes tickerMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* --- Sayaç şeridi --- */
.stats-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:30px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:22px;text-align:center;box-shadow:var(--shadow)}
.stat .num{font-size:34px;font-weight:800;color:var(--navy);line-height:1}
.stat .num i{font-style:normal;color:var(--gold2)}
.stat p{margin:6px 0 0;color:var(--muted);font-size:13.5px}

/* --- Canlı dizgi demosu (hero içi) --- */
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:34px;align-items:center}
.typeset-demo{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:24px;
  padding:18px;backdrop-filter:blur(10px);box-shadow:0 24px 50px rgba(0,0,0,.30)}
.dp-head{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.dp-dot{width:9px;height:9px;border-radius:50%;background:#34d399;box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:dpPulse 1.8s infinite}
@keyframes dpPulse{70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.dp-live{color:#a7f3d0;font-size:12px;font-weight:700;letter-spacing:.08em}
.dp-fmt{margin-left:auto;background:linear-gradient(135deg,#f3d489,var(--gold));color:#23180a;font-weight:800;
  font-size:12.5px;padding:5px 12px;border-radius:999px;transition:opacity .4s}
.dp-paper{background:#fffdf7;color:#20304a;border-radius:16px;padding:26px 24px;box-shadow:0 14px 34px rgba(0,0,0,.25);
  transition:padding .9s var(--ease)}
.dp-paper .dp-title{height:15px;width:72%;border-radius:5px;background:linear-gradient(90deg,#144a96,#3f74c9);margin-bottom:8px;transition:all .9s var(--ease)}
.dp-paper .dp-authors{height:8px;width:44%;border-radius:4px;background:#c9d6ea;margin-bottom:16px}
.dp-cols{display:grid;grid-template-columns:1fr;gap:16px;transition:all .9s var(--ease)}
.dp-cols.two{grid-template-columns:1fr 1fr}
.dp-line{height:7px;border-radius:4px;background:linear-gradient(90deg,#dbe4f2,#e8eef8);margin-bottom:8px;transition:all .9s var(--ease)}
.dp-line.short{width:62%}.dp-line.mid{width:84%}
.dp-paper.serif .dp-title{background:linear-gradient(90deg,#5b4a1f,#a37f22)}
.dp-meta{margin-top:14px;display:grid;gap:9px}
.dp-row{display:grid;grid-template-columns:92px 1fr 62px;align-items:center;gap:10px;font-size:12px;color:#c3d3ec}
.dp-row b{color:#f3d489;text-align:right;font-size:12px}
.dp-bar{height:7px;border-radius:99px;background:rgba(255,255,255,.14);overflow:hidden}
.dp-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#7fb0f5,var(--gold));
  transition:width .9s var(--ease)}
.dp-pipe{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.pipe-chip{font-size:12px;font-weight:700;padding:6px 12px;border-radius:999px;color:#9fb2cf;
  border:1px solid rgba(255,255,255,.18);transition:all .5s var(--ease)}
.pipe-chip.on{color:#23180a;background:linear-gradient(135deg,#f3d489,var(--gold));border-color:transparent;
  box-shadow:0 8px 18px rgba(201,151,63,.35)}
.pipe-arrow{align-self:center;color:#5f7bab;font-size:12px}

@media(max-width:1020px){.stats-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.hero-grid{grid-template-columns:1fr}.stats-strip{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important}
  .rv{opacity:1;transform:none}.ticker-track{animation:none}
}

/* ============================================================
   TEMA v3 — dalgalı geçişler ve sayfa dinamikleri
   ============================================================ */
/* Sayfa açılış/kapanış yumuşaklığı */
.container{animation:pageIn .7s var(--ease)}
@keyframes pageIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
body.page-out .container{opacity:0;transform:translateY(10px);transition:opacity .22s ease,transform .22s ease}
body.page-out{cursor:progress}

/* Hero ve footer dalgalarında yavaş sürüklenme */
.hero-wave{width:112%!important;left:-6%;animation:waveDrift 11s ease-in-out infinite alternate}
.foot-wave{overflow:hidden;line-height:0;margin-bottom:-1px}
.foot-wave svg{display:block;width:112%;height:58px;margin-left:-6%;animation:waveDrift 13s ease-in-out infinite alternate}
@keyframes waveDrift{from{transform:translateX(0)}to{transform:translateX(-2.2%)}}
.footer{border-top:none}

/* Kaydırma ilerleme çubuğu (altın) */
.scroll-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:120;background:transparent;pointer-events:none}
.scroll-progress i{display:block;height:100%;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,var(--gold),#f3d489,var(--brand));border-radius:0 3px 3px 0}
.topbar.scrolled{box-shadow:0 12px 32px rgba(8,31,66,.14)}

/* Yukarı çık butonu */
#to-top{position:fixed;right:22px;bottom:22px;z-index:110;width:46px;height:46px;border:none;border-radius:50%;
  display:grid;place-items:center;font-size:20px;font-weight:800;color:#23180a;cursor:pointer;
  background:linear-gradient(135deg,#f3d489,var(--gold) 60%,var(--gold2));box-shadow:0 12px 26px rgba(201,151,63,.45);
  opacity:0;transform:translateY(16px) scale(.9);pointer-events:none;transition:all .45s var(--ease)}
#to-top.show{opacity:1;transform:none;pointer-events:auto}
#to-top:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 18px 34px rgba(201,151,63,.55)}

/* Tablo ve kart mikro etkileşimleri */
table.tbl tbody tr{transition:background .3s var(--ease)}
table.tbl tbody tr:hover{background:#f7faff}
.dl{transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease)}
.dl:hover{transform:translateY(-5px);box-shadow:0 20px 42px rgba(8,31,66,.13);border-color:#ecd9a8}
.step > b{transition:transform .5s var(--ease)}
.step:hover > b{transform:rotate(-8deg) scale(1.1)}
.typeset-demo{animation:demoFloat 8s ease-in-out infinite}
@keyframes demoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.auth-wrap{animation:pageFade .35s ease-out}
.badge{transition:transform .3s var(--ease)}
.badge:hover{transform:scale(1.06)}
.userchip{transition:transform .35s var(--ease)}
.userchip:hover{transform:translateY(-1px)}
button.btn.is-loading{opacity:.75;pointer-events:none}
@media (prefers-reduced-motion: reduce){
  .container,.auth-wrap{animation:none}
  .hero-wave,.foot-wave svg,.typeset-demo{animation:none}
  body.page-out .container{opacity:1;transform:none}
}

/* ============================================================
   TEMA v4 — şık form kontrolleri: yumuşak zemin, altın odak halkası
   ============================================================ */
input[type=text],input[type=email],input[type=password],input[type=number],
input[type=search],input[type=tel],input[type=url],input[type=date],select,textarea{
  background:linear-gradient(180deg,#fcfdfe,#f4f7fc);
  border:1.5px solid #d9e2f0;border-radius:14px;padding:13px 16px;
  box-shadow:inset 0 2px 5px rgba(8,31,66,.045), 0 1px 2px rgba(8,31,66,.03);
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease),transform .3s var(--ease);
}
input[type=text]:hover,input[type=email]:hover,input[type=password]:hover,input[type=number]:hover,
input[type=search]:hover,input[type=tel]:hover,select:hover,textarea:hover{
  border-color:#b7c9e6;background:#fff;
}
input[type=text]:focus,input[type=email]:focus,input[type=password]:focus,input[type=number]:focus,
input[type=search]:focus,input[type=tel]:focus,input[type=url]:focus,input[type=date]:focus,select:focus,textarea:focus{
  background:#fff;border-color:var(--gold);outline:none;transform:translateY(-1px);
  box-shadow:0 0 0 4px rgba(212,164,55,.16),0 10px 22px rgba(8,31,66,.09);
}
::placeholder{color:#9db0ca;opacity:1}
select{appearance:none;-webkit-appearance:none;padding-right:42px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23c9973f' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E"),
  linear-gradient(180deg,#fcfdfe,#f4f7fc);
  background-repeat:no-repeat;background-size:12px 8px,100% 100%;background-position:right 16px center,0 0}
/* :hover/:focus kurallarındaki background kısayolu repeat'i sıfırlar; select'te açıkça geri ver */
select:hover,select:focus{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23c9973f' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E"),
  linear-gradient(180deg,#ffffff,#ffffff);
  background-repeat:no-repeat;background-size:12px 8px,100% 100%;background-position:right 16px center,0 0}
textarea{resize:vertical;min-height:110px}
input[type=checkbox],input[type=radio]{accent-color:#c08c1d;width:17px;height:17px;cursor:pointer;vertical-align:-3px}
input[type=file]{font-size:13.5px;color:var(--muted)}

/* Etiketler: küçük, koyu lacivert, düzenli aralık */
label.f{font-size:13px;font-weight:700;color:#2c4368;letter-spacing:.02em;margin:18px 0 8px}
form label:has(> input[type=text]),form label:has(> input[type=email]),form label:has(> input[type=password]),
form label:has(> input[type=number]),form label:has(> input[type=search]),form label:has(> select),
form label:has(> textarea){
  display:block;font-size:13px;font-weight:700;color:#2c4368;letter-spacing:.02em;margin:16px 0 10px;cursor:text;
}
form label:has(> input[type=text]) > input,form label:has(> input[type=email]) > input,
form label:has(> input[type=password]) > input,form label:has(> input[type=number]) > input,
form label:has(> input[type=search]) > input,form label:has(> select) > select,
form label:has(> textarea) > textarea{margin-top:7px}

/* Butonlar: odak halkası ve basınç hissi */
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid rgba(212,164,55,.55);outline-offset:2px}
.btn{letter-spacing:.01em}
.btn-teal{box-shadow:0 10px 24px rgba(201,151,63,.38),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-primary{box-shadow:0 10px 24px rgba(8,31,66,.30),inset 0 1px 0 rgba(255,255,255,.18)}

/* ============================================================
   TEMA v5 — Dönüşüm geçmişi: özet bandı, araç çubuğu, kayıt kartları,
   pencereler (düzenle / onay) ve toplu seçim çubuğu
   ============================================================ */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.btn-xs{padding:7px 15px;font-size:13px}
.btn-danger-solid{background:linear-gradient(135deg,#ef4444,#c81e1e);color:#fff;box-shadow:0 10px 24px rgba(200,30,30,.30)}
.btn-danger-solid:hover{box-shadow:0 16px 30px rgba(200,30,30,.42)}

/* Özet bandı (küçük hero) */
.hero.hero-sm{padding:34px 38px 30px;margin-bottom:20px}
.hero-sm .hh-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-wrap:wrap}
.hero-sm h1{font-size:34px;margin:10px 0 8px}
.hero-sm p{margin:0;font-size:15px}
.hh-eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:#f3d489;background:rgba(243,212,137,.12);border:1px solid rgba(243,212,137,.3);padding:5px 12px;border-radius:999px}
.hh-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px}
.hh-stat{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:14px 16px;
  backdrop-filter:blur(8px);transition:transform .45s var(--ease),background .45s var(--ease),border-color .45s var(--ease)}
.hh-stat:hover{transform:translateY(-3px);background:rgba(255,255,255,.11);border-color:rgba(243,212,137,.4)}
.hh-stat b{display:block;font-size:23px;font-weight:800;color:#fff;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hh-stat b i{font-style:normal}
.hh-stat b small{font-size:15px;color:#8fa6c9;font-weight:700;margin:0 2px}
.hh-stat span{display:block;margin-top:4px;font-size:12.5px;color:#a9bddc;font-weight:600}

/* Araç çubuğu: arama, tür filtresi, sıralama, tümünü seç */
.hist-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:16px;padding:12px;
  background:rgba(255,255,255,.82);border:1px solid var(--line);border-radius:22px;box-shadow:0 8px 24px rgba(8,31,66,.06);backdrop-filter:blur(10px)}
.hist-search{position:relative;flex:1 1 280px;min-width:min(100%,220px);margin:0}
.hist-search .ico{position:absolute;left:16px;top:50%;transform:translateY(-50%);font-size:15px;opacity:.55;pointer-events:none;z-index:1}
.hist-search input{width:100%;padding-left:44px!important;padding-right:46px!important;margin:0}
.hist-search kbd{position:absolute;right:12px;top:50%;transform:translateY(-50%);font:700 11.5px/1 'Inter',sans-serif;color:#8494ad;
  background:#fff;border:1px solid #d9e2f0;border-bottom-width:2px;border-radius:7px;padding:4px 8px;pointer-events:none;transition:opacity .25s}
.hist-search input:focus ~ kbd,.hist-search input:not(:placeholder-shown) ~ kbd{opacity:0}
.seg{display:inline-flex;gap:4px;padding:4px;background:#eef2f9;border-radius:999px;border:1px solid #e3eaf5}
.seg button{border:0;background:transparent;font:inherit;font-size:13.5px;font-weight:700;color:#3c5173;padding:8px 14px;border-radius:999px;
  cursor:pointer;white-space:nowrap;transition:all .35s var(--ease)}
.seg button b{display:inline-grid;place-items:center;min-width:22px;height:20px;padding:0 6px;margin-left:5px;border-radius:999px;
  background:#fff;color:var(--navy);font-size:11.5px}
.seg button:hover{color:var(--navy);background:rgba(255,255,255,.7)}
.seg button.on{background:linear-gradient(135deg,#144a96,var(--navy));color:#fff;box-shadow:0 8px 18px rgba(8,31,66,.22)}
.seg button.on b{background:rgba(255,255,255,.18);color:#fff}
.hist-toolbar select{width:auto;min-width:min(100%,190px);max-width:100%}
.hist-all{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:13.5px;color:#2c4368;padding:0 8px;cursor:pointer;white-space:nowrap}

/* Kayıt kartları */
.hist-list{display:grid;gap:12px}
.hist-item{position:relative;display:grid;grid-template-columns:auto 54px minmax(0,1fr) auto;gap:16px;align-items:center;
  background:var(--card);border:1px solid var(--line);border-radius:22px;padding:16px 18px 16px 14px;box-shadow:0 8px 22px rgba(8,31,66,.06);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease),background .45s var(--ease);
  animation:histIn .6s var(--ease) backwards;animation-delay:calc(var(--i,0) * 45ms)}
.hist-item::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:4px;border-radius:0 4px 4px 0;
  background:linear-gradient(180deg,var(--gold),var(--gold2));opacity:0;transition:opacity .35s var(--ease)}
.hist-item:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(8,31,66,.12);border-color:#ecd9a8}
.hist-item:hover::before,.hist-item.sel::before{opacity:1}
.hist-item.sel{background:linear-gradient(180deg,#fffdf6,#fff7e3);border-color:#e9cf8f}
.hist-item[hidden]{display:none!important}
@keyframes histIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.hist-check{display:grid;place-items:center;width:30px;height:30px;margin:0;border-radius:10px;cursor:pointer;transition:background .3s}
.hist-check:hover{background:#f4f1e6}
.hist-check input{width:19px;height:19px;margin:0}
.hist-ico{display:grid;place-items:center;width:54px;height:54px;border-radius:17px;font-size:25px;
  background:linear-gradient(135deg,#fdf3d7,#f3d489);box-shadow:inset 0 0 0 1px #ecd9a8,0 8px 18px rgba(201,151,63,.18);transition:transform .45s var(--ease)}
.k-thesis .hist-ico{background:linear-gradient(135deg,#e6eefc,#c3d5f5);box-shadow:inset 0 0 0 1px #cad9f3,0 8px 18px rgba(20,74,150,.14)}
.hist-item:hover .hist-ico{transform:rotate(-6deg) scale(1.06)}
.hist-main{min-width:0}
.hist-title{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:800;font-size:15.5px;line-height:1.42;color:var(--navy)}
.hist-title:hover{color:#144a96;text-decoration:none}
.hist-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.chip{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:4px 10px;border-radius:999px;background:#f3f6fb;
  border:1px solid #e3eaf5;color:#4a5d7a;font-size:12.5px;font-weight:600;line-height:1.35;white-space:nowrap}
.chip-file{display:inline-block;max-width:260px;overflow:hidden;text-overflow:ellipsis;vertical-align:top}
.chip-kind{background:#fdf3d7;border-color:#ecd9a8;color:#7c5a10}
.k-thesis .chip-kind{background:#e6eefc;border-color:#cad9f3;color:#174ea6}
.chip-gold{background:linear-gradient(135deg,#fdf3d7,#f6e2ac);border-color:#ecd9a8;color:#7c5a10}
.chip-warn{background:#fff4e5;border-color:#fbd9a5;color:#9a5b00}
.hist-note{margin:10px 0 0;padding:8px 12px;border-radius:12px;background:#fffbef;border:1px dashed #ecd9a8;color:#6b5320;
  font-size:13px;line-height:1.55;white-space:pre-line;overflow-wrap:anywhere}
.hist-side{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.dl-group{display:inline-flex;padding:3px;border-radius:999px;background:#f3f6fb;border:1px solid #e3eaf5}
.dlp{display:inline-flex;align-items:center;gap:5px;padding:6px 11px;border-radius:999px;font-size:12.5px;font-weight:700;color:#2c4368;
  white-space:nowrap;transition:all .3s var(--ease)}
.dlp:hover{background:#fff;color:var(--navy);text-decoration:none;box-shadow:0 4px 12px rgba(8,31,66,.10)}
.dlp.off{opacity:.42;cursor:not-allowed}
.dlp.off:hover{background:transparent;box-shadow:none}
.hist-actions{display:flex;align-items:center;gap:8px}
.hist-actions form{margin:0;display:inline-flex}
.hist-actions .btn{white-space:nowrap}
.icon-btn{display:inline-grid;place-items:center;width:36px;height:36px;padding:0;border-radius:50%;border:1px solid #d7e0ef;background:#fff;
  color:#2c4368;font-size:15px;line-height:1;cursor:pointer;box-shadow:0 4px 10px rgba(8,31,66,.06);transition:all .35s var(--ease)}
.icon-btn:hover{transform:translateY(-2px);border-color:var(--gold);color:var(--gold2);text-decoration:none;box-shadow:0 10px 20px rgba(8,31,66,.12)}
.icon-btn.danger:hover{border-color:#f3c2bd;color:var(--danger);background:#fff5f4}

/* Boş durum / eşleşme yok */
.hist-empty{text-align:center;padding:56px 24px;border:1.5px dashed #d7e0ef;border-radius:26px;background:linear-gradient(180deg,#fff,#f8fbff)}
.hist-empty[hidden]{display:none}
.hist-empty .big{display:inline-grid;place-items:center;width:92px;height:92px;border-radius:28px;font-size:44px;margin-bottom:16px;
  background:linear-gradient(135deg,#fdf3d7,#f3d489);box-shadow:0 14px 30px rgba(201,151,63,.3);animation:demoFloat 6s ease-in-out infinite}
.hist-empty h3{margin:0 0 6px;font-size:20px;color:var(--navy)}
.hist-empty p{margin:0 auto 18px;color:var(--muted);max-width:460px;line-height:1.6}
#hist-nomatch{margin-top:4px}

/* Pencereler (düzenle / onay) */
dialog.modal{border:0;padding:20px;background:transparent;width:min(600px,calc(100vw - 16px));max-width:none;color:var(--ink);overflow:visible}
dialog.modal::backdrop{background:rgba(8,31,66,.46);backdrop-filter:blur(4px)}
dialog.modal[open]{animation:modalIn .4s var(--ease)}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.modal-card{background:#fff;border-radius:24px;padding:24px 26px;border:1px solid #ecd9a8;box-shadow:0 30px 80px rgba(8,31,66,.35);margin:0;
  max-height:calc(100vh - 60px);overflow:auto}
.modal-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:4px}
.modal-head h3{margin:2px 0 4px;font-size:19px;color:var(--navy)}
.modal-head p{margin:0;color:var(--muted);font-size:14px;line-height:1.55;overflow-wrap:anywhere}
.modal-ico{flex:0 0 auto;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;font-size:20px;
  background:linear-gradient(135deg,#fdf3d7,#f3d489);box-shadow:inset 0 0 0 1px #ecd9a8}
.modal-ico.danger{background:linear-gradient(135deg,#ffeceb,#ffcbc4);box-shadow:inset 0 0 0 1px #f3c2bd}
.modal-x{display:grid;place-items:center;flex:0 0 auto;margin-left:auto;width:34px;height:34px;border-radius:50%;background:#f1f5fb;
  color:#4a5d7a;font-size:21px;line-height:1;transition:all .3s var(--ease)}
.modal-x:hover{background:#ffeceb;color:var(--danger);transform:rotate(90deg);text-decoration:none}
.modal-card label small{font-weight:600;color:var(--muted);letter-spacing:0}
.modal-card textarea{font-family:inherit;font-size:14.5px;line-height:1.55;min-height:96px}
.modal-hint{margin:14px 0 0;padding:10px 12px;border-radius:12px;background:#f6f8fc;font-size:12.5px;line-height:1.6;color:var(--muted);overflow-wrap:anywhere}
.modal-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}

/* Toplu seçim çubuğu */
.bulk-bar{position:fixed;left:50%;bottom:22px;z-index:115;display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;
  padding:9px 10px 9px 18px;border-radius:999px;color:#fff;background:linear-gradient(135deg,#0b2c5c,#081f42);
  border:1px solid rgba(243,212,137,.35);box-shadow:0 22px 50px rgba(8,31,66,.42);
  transform:translate(-50%,160%);opacity:0;pointer-events:none;transition:transform .5s var(--ease),opacity .4s var(--ease)}
.bulk-bar.show{transform:translate(-50%,0);opacity:1;pointer-events:auto}
.bulk-bar .cnt{font-weight:700;font-size:14px;white-space:nowrap}
.bulk-bar .cnt b{display:inline-grid;place-items:center;min-width:26px;height:26px;padding:0 8px;margin-right:7px;border-radius:999px;
  background:linear-gradient(135deg,#f3d489,var(--gold));color:#23180a}
.bulk-bar .btn-link{background:transparent;border:0;color:#c3d3ec;font:inherit;font-weight:700;font-size:13.5px;cursor:pointer;padding:7px 10px;border-radius:999px}
.bulk-bar .btn-link:hover{color:#fff;background:rgba(255,255,255,.09)}
.bulk-bar form{margin:0}
body:has(.bulk-bar.show) #to-top{opacity:0;pointer-events:none}

@media(max-width:900px){
  .hh-stats{grid-template-columns:repeat(2,1fr)}
  .hist-item{grid-template-columns:auto 46px minmax(0,1fr);row-gap:12px}
  .hist-ico{width:46px;height:46px;font-size:21px;border-radius:14px}
  .hist-side{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:center}
}
@media(max-width:560px){
  .hero.hero-sm{padding:26px 20px 22px}
  .hero-sm h1{font-size:27px}
  .hh-stat b{font-size:19px}
  .seg{width:100%}.seg button{flex:1;padding:8px 6px}
  .hist-toolbar select{flex:1 1 100%}
  .chip-file{max-width:100%}
  .bulk-bar{left:10px;right:10px;border-radius:22px;transform:translateY(160%)}
  .bulk-bar.show{transform:none}
}

/* ============================================================
   TEMA v6 — Eksik ve kural denetimi: durum şeridi, puan halkası,
   sınır göstergeleri, madde listesi ve geçmiş etiketi
   ============================================================ */
.audit-strip{display:flex;align-items:center;gap:12px;margin:0 0 18px;padding:11px 16px 11px 12px;border-radius:16px;
  border:1px solid var(--line);background:#f8fafd;color:var(--ink);font-size:14px;line-height:1.45;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.audit-strip:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(8,31,66,.08);text-decoration:none}
.as-dot{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-weight:800;font-size:13px;color:#fff}
.as-text{flex:1;min-width:0}
.as-go{flex:none;font-weight:700;font-size:13px;color:#144a96;white-space:nowrap}
.audit-strip.audit-bad{background:#fff6f5;border-color:#fdd3cf}
.audit-strip.audit-mid{background:#fffaf0;border-color:#f6dfae}
.audit-strip.audit-good{background:#f2fbf6;border-color:#bfe8d0}
.audit-bad .as-dot,.ai-error .ai-ico,.ac.ac-error b{background:linear-gradient(135deg,#f97066,#d92d20)}
.audit-mid .as-dot,.ai-warn .ai-ico,.ac.ac-warn b{background:linear-gradient(135deg,#f5b544,#d68a0c)}
.audit-good .as-dot,.ac.ac-ok b{background:linear-gradient(135deg,#32c48d,#067647)}
.ai-info .ai-ico,.ac.ac-info b{background:linear-gradient(135deg,#5b8def,#144a96)}

.audit{--tone:#067647;--tone-soft:#e8f7ef;margin:26px 0 8px;padding:24px;border-radius:24px;border:1px solid var(--line);
  background:linear-gradient(180deg,#fbfcfe,#fff 160px);box-shadow:0 12px 32px rgba(8,31,66,.07);scroll-margin-top:90px}
.audit.audit-mid{--tone:#c27803;--tone-soft:#fdf3dc}
.audit.audit-bad{--tone:#d92d20;--tone-soft:#fdecea}
.audit-head{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.audit-ring{--p:0;flex:none;position:relative;display:grid;place-items:center;align-content:center;width:104px;height:104px;border-radius:50%;
  background:conic-gradient(var(--tone) calc(var(--p) * 1%),#e9eef6 0);box-shadow:0 10px 24px rgba(8,31,66,.10)}
.audit-ring::before{content:"";position:absolute;inset:9px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px #eef2f8}
.audit-ring b,.audit-ring small{position:relative}
.audit-ring b{font-size:30px;font-weight:800;line-height:1;color:var(--navy)}
.audit-ring small{font-size:11.5px;font-weight:700;color:var(--muted);margin-top:3px}
.audit-sum{flex:1 1 220px;min-width:0}
.audit-eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--tone);background:var(--tone-soft);padding:5px 11px;border-radius:999px}
.audit-sum h3{margin:10px 0 12px;font-size:19px;line-height:1.35;color:var(--navy)}
.audit-counts{display:flex;flex-wrap:wrap;gap:8px}
.ac{display:inline-flex;align-items:center;gap:6px;padding:4px 12px 4px 5px;border-radius:999px;font-size:13px;font-weight:700;
  background:#f3f6fb;border:1px solid #e3eaf5;color:#4a5d7a}
.ac b{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 7px;border-radius:999px;font-size:12.5px;color:#fff;background:#8494ad}

.audit-gauges{display:grid;grid-template-columns:repeat(var(--cols,5),minmax(0,1fr));gap:10px;margin:22px 0 4px}
.ag{position:relative;padding:12px 14px;border-radius:16px;background:#f7f9fc;border:1px solid #e6ecf5;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.ag:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(8,31,66,.08)}
.ag span{display:block;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#7a8aa3}
.ag b{display:block;margin-top:3px;font-size:22px;font-weight:800;color:var(--navy);line-height:1.2}
.ag small{display:block;margin-top:2px;font-size:12px;font-weight:600;color:#8494ad}
.ag.within{background:#f2fbf6;border-color:#c9ecd8}
.ag.within small{color:#067647}
.ag.over{background:#fff5f4;border-color:#fdcdc8}
.ag.over b,.ag.over small{color:#b42318}
.ag.within::after,.ag.over::after{content:"";position:absolute;top:13px;right:13px;width:8px;height:8px;border-radius:50%}
.ag.within::after{background:#32c48d}
.ag.over::after{background:#f04438;box-shadow:0 0 0 4px rgba(240,68,56,.15)}

.audit-list{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:10px}
.ai{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:#fff;border:1px solid var(--line);
  border-left:4px solid #8494ad;box-shadow:0 4px 14px rgba(8,31,66,.04);animation:histIn .5s var(--ease) backwards}
.ai-error{border-left-color:#f04438;background:linear-gradient(90deg,#fff7f6,#fff 60%)}
.ai-warn{border-left-color:#f5a524;background:linear-gradient(90deg,#fffaf0,#fff 60%)}
.ai-info{border-left-color:#5b8def;background:linear-gradient(90deg,#f5f8ff,#fff 60%)}
.ai-ico{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-weight:800;font-size:13px;color:#fff;margin-top:1px}
.ai-info .ai-ico{font-family:Georgia,serif;font-style:italic}
.ai-body{flex:1;min-width:0}
.ai-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ai-top b{font-size:15px;color:var(--navy)}
.ai-grp{font-size:11.5px;font-weight:700;color:#7a8aa3;background:#f3f6fb;border:1px solid #e3eaf5;padding:2px 9px;border-radius:999px;white-space:nowrap}
.ai-body p{margin:5px 0 0;font-size:14px;line-height:1.55;color:#40536f}
.ai-body .ai-fix{margin-top:8px;padding:8px 11px;border-radius:11px;background:rgba(255,255,255,.8);border:1px dashed #dbe3ef;color:#2c4368;font-size:13.5px}

.audit-ok{margin-top:14px;border:1px solid #d5eedf;border-radius:16px;background:#f6fcf8;overflow:hidden}
.audit-ok summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;padding:12px 16px;font-weight:700;font-size:14px;color:#05603a}
.audit-ok summary::-webkit-details-marker{display:none}
.audit-ok summary::after{content:"▾";margin-left:auto;transition:transform .3s var(--ease)}
.audit-ok[open] summary::after{transform:rotate(180deg)}
.audit-ok ul{list-style:none;margin:0;padding:4px 16px 14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px}
.audit-ok li{display:flex;flex-direction:column;gap:2px;padding:9px 12px;border-radius:12px;background:#fff;border:1px solid #e1f2e8;font-size:13.5px}
.audit-ok li b{color:#05603a}
.audit-ok li b::before{content:"✓ "}
.audit-ok li span{color:var(--muted);font-size:13px;line-height:1.45}
.audit-src{margin:14px 2px 0;font-size:12.5px;color:#7a8aa3;line-height:1.55}

.chip-audit{transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.chip-audit:hover{text-decoration:none;transform:translateY(-1px);box-shadow:0 6px 14px rgba(8,31,66,.10)}
.chip-audit.is-bad{background:#fff1f0;border-color:#fdcdc8;color:#b42318}
.chip-audit.is-mid{background:#fff7e6;border-color:#f6dfae;color:#9a5b00}
.chip-audit.is-good{background:#ecfbf3;border-color:#bfe8d0;color:#05603a}

@media(max-width:900px){
  .audit-gauges{grid-template-columns:repeat(auto-fill,minmax(128px,1fr))}
}
@media(max-width:560px){
  .audit{padding:18px 16px}
  .audit-ring{width:86px;height:86px}
  .audit-ring b{font-size:25px}
  .audit-sum h3{font-size:17px}
  .audit-strip{flex-wrap:wrap}
  .as-go{margin-left:40px}
}

/* ============================================================
   TEMA v7 — Üst menü: yüzen, yumuşak çerçeveli cam kapsül;
   segmentli bağlantılar, aktif sayfa, token rozeti, açılır mobil menü
   ============================================================ */
.topbar{position:sticky;top:0;z-index:60;display:block;padding:12px 20px 0;background:none;border:0;box-shadow:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:none}
.topbar.scrolled{box-shadow:none}
.topbar-inner{pointer-events:auto;position:relative;display:flex;align-items:center;justify-content:center;gap:14px;
  width:fit-content;max-width:100%;margin:0 auto;box-sizing:border-box;
  padding:8px 8px 8px 12px;border-radius:24px;background:rgba(255,255,255,.76);border:1px solid rgba(214,224,239,.85);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 10px 30px rgba(8,31,66,.07),0 2px 6px rgba(8,31,66,.04);
  -webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);
  transition:padding .4s var(--ease),box-shadow .4s var(--ease),background .4s var(--ease),border-color .4s var(--ease)}
.topbar.scrolled .topbar-inner{padding-top:6px;padding-bottom:6px;background:rgba(255,255,255,.9);border-color:#d6e0ef;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 16px 40px rgba(8,31,66,.13),0 2px 6px rgba(8,31,66,.05)}
.brand{flex:none;gap:10px;font-size:18px;letter-spacing:-.01em;white-space:nowrap}
.brand-logo{height:40px}

.nav{display:flex;align-items:center;gap:2px;margin:0;padding:4px;border-radius:999px;
  background:rgba(239,243,250,.9);border:1px solid #e5ebf5;box-shadow:inset 0 1px 2px rgba(8,31,66,.04)}
.nav a{display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border-radius:999px;color:#43577b;font-size:14px;font-weight:600;
  white-space:nowrap;transition:color .3s var(--ease),background .3s var(--ease),box-shadow .3s var(--ease)}
.nav a::after{display:none}
.nav a:hover{color:var(--navy);background:rgba(255,255,255,.9);box-shadow:none;text-decoration:none}
.nav a.on{color:var(--navy);background:#fff;box-shadow:0 4px 12px rgba(8,31,66,.08),0 0 0 1px rgba(214,224,239,.9)}
.nav a.on::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:linear-gradient(135deg,#f3d489,var(--gold2));
  box-shadow:0 0 0 3px rgba(212,164,55,.18)}
.nav .nav-token,.nav .nav-auth,.nav-user{display:none}
.nav-user{align-items:center;gap:11px;padding:8px 10px 12px;margin-bottom:4px;border-bottom:1px solid #edf1f7}
.nav-user .avatar{width:38px;height:38px;font-size:16px}
.nav-user .uname{display:flex;font-size:14.5px}
.nav-user .uname small{font-size:12px}
.nav a.nav-cta{color:#fff;background:linear-gradient(135deg,#144a96,var(--navy));box-shadow:0 8px 18px rgba(8,31,66,.2)}

.userbox{flex:none;display:flex;align-items:center;gap:8px}
.token-chip{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 14px 0 11px;border-radius:999px;white-space:nowrap;
  background:linear-gradient(135deg,#fdf7e6,#f7e5b5);border:1px solid #efd9a2;color:#6f4f0c;font-size:13.5px;font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.token-chip b{font-weight:800;color:#5a3f06}
.token-chip small{font-size:12px;font-weight:600;color:#8a6a24}
.token-chip:hover{text-decoration:none;transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 8px 18px rgba(201,151,63,.25)}
.token-chip[aria-current]{box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 0 0 3px rgba(212,164,55,.22)}
.userchip{gap:9px;height:40px;padding:0 14px 0 3px;border-radius:999px;background:#fff;border:1px solid #e3e9f3;box-shadow:0 2px 8px rgba(8,31,66,.04)}
.userchip:hover{transform:none}
.avatar{width:32px;height:32px;font-size:14px;box-shadow:0 4px 10px rgba(201,151,63,.35)}
.uname{font-size:13px;color:var(--navy)}
.uname small{font-size:11px}
.logout-form{display:inline-flex;margin:0}
button.btn-logout{font-family:inherit;cursor:pointer;line-height:1}
.btn-logout{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 15px 0 13px;border-radius:999px;background:#fff;
  border:1px solid #e3e9f3;color:#43577b;font-size:13.5px;font-weight:700;white-space:nowrap;transition:all .3s var(--ease)}
.btn-logout svg{width:16px;height:16px;flex:none}
.btn-logout:hover{text-decoration:none;color:#b42318;border-color:#fdcdc8;background:#fff6f5}
.topbar .btn-sm{height:40px;padding:0 18px;display:inline-flex;align-items:center}

.nav-toggle{display:none;position:relative;flex:none;width:42px;height:42px;padding:0;border-radius:14px;cursor:pointer;
  background:#fff;border:1px solid #e3e9f3;transition:background .3s var(--ease),border-color .3s var(--ease)}
.nav-toggle:hover{border-color:#d1dbea;background:#f7f9fc}
.nav-toggle span{position:absolute;left:12px;right:12px;top:50%;height:2px;margin-top:-1px;border-radius:2px;background:var(--navy);
  transition:transform .35s var(--ease),opacity .25s var(--ease)}
.nav-toggle span:nth-child(1){transform:translateY(-6px)}
.nav-toggle span:nth-child(3){transform:translateY(6px)}
.topbar.open .nav-toggle span:nth-child(1){transform:rotate(45deg)}
.topbar.open .nav-toggle span:nth-child(2){opacity:0}
.topbar.open .nav-toggle span:nth-child(3){transform:rotate(-45deg)}

.topbar-inner .scroll-progress{position:absolute;top:auto;left:24px;right:24px;bottom:-1px;height:2px;z-index:1;border-radius:2px;overflow:hidden}
@keyframes navDrop{from{opacity:0;transform:translate(-50%,-8px) scale(.98)}to{opacity:1;transform:translateX(-50%)}}

@media(max-width:1320px){
  .topbar.in .userbox .uname,.topbar.in .token-chip small{display:none}
  .topbar.in .userchip{padding:0 3px}
  .nav a{padding:8px 11px}
}
/* Giriş yapmış kullanıcıda bağlantı + hesap birlikte sığmaz; menü açılır, sağ grup sıkı kalır */
@media(max-width:1180px){
  .topbar.in .nav-toggle{display:block}
  .topbar.in .nav{display:none;position:absolute;top:calc(100% + 8px);left:50%;right:auto;width:max-content;
    min-width:min(280px,calc(100vw - 28px));max-width:calc(100vw - 28px);margin:0;transform:translateX(-50%);
    flex-direction:column;align-items:stretch;gap:2px;padding:8px;border-radius:18px;background:#fff;
    border:1px solid rgba(214,224,239,.95);box-shadow:0 24px 50px rgba(8,31,66,.16);
    -webkit-backdrop-filter:none;backdrop-filter:none}
  .topbar.in.open .nav{display:flex;animation:navDrop .35s var(--ease)}
  .topbar.in .nav a{padding:11px 16px;font-size:15px;border-radius:12px;justify-content:flex-start}
  .topbar.in .nav a:hover{background:#f3f6fb}
  .topbar.in .nav a.on{background:linear-gradient(135deg,#fdf7e6,#fff);box-shadow:0 0 0 1px #efd9a2}
}
@media(max-width:1100px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;top:calc(100% + 8px);left:50%;right:auto;width:max-content;
    min-width:min(280px,calc(100vw - 28px));max-width:calc(100vw - 28px);margin:0;transform:translateX(-50%);
    flex-direction:column;align-items:stretch;gap:2px;padding:8px;border-radius:18px;background:#fff;
    border:1px solid rgba(214,224,239,.95);box-shadow:0 24px 50px rgba(8,31,66,.16);
    -webkit-backdrop-filter:none;backdrop-filter:none}
  .topbar.open .nav{display:flex;animation:navDrop .35s var(--ease)}
  .nav a{padding:11px 16px;font-size:15px;border-radius:12px;justify-content:flex-start}
  .nav a:hover{background:#f3f6fb}
  .nav a.on{background:linear-gradient(135deg,#fdf7e6,#fff);box-shadow:0 0 0 1px #efd9a2}
}
/* Dizgi Paneli: menünün ana eylemi (yalnız oturum açıkken var) */
.topbar .nav a.nav-dash{position:relative;overflow:hidden;isolation:isolate;gap:8px;padding:6px 16px 6px 7px;color:#fff;font-weight:700;letter-spacing:.01em;
  background:linear-gradient(135deg,#1f5bb3 0%,#0f3a7a 48%,#081f42 100%);background-size:180% 180%;background-position:0 0;
  box-shadow:0 0 0 1.5px rgba(212,164,55,.6),0 8px 18px rgba(8,31,66,.26),inset 0 1px 0 rgba(255,255,255,.16);
  transition:transform .5s var(--ease),box-shadow .45s var(--ease),background-position .6s var(--ease),color .3s var(--ease)}
.topbar .nav a.nav-dash svg{flex:none;width:26px;height:26px;padding:5px;border-radius:50%;color:#e8c268;background:rgba(232,194,104,.16);box-shadow:inset 0 0 0 1px rgba(232,194,104,.4)}
.topbar .nav a.nav-dash::before{display:none}
.topbar .nav a.nav-dash::after{display:block;content:"";position:absolute;z-index:-1;top:0;bottom:0;left:0;width:42%;height:auto;border-radius:0;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.22),transparent);transform:translateX(-130%) skewX(-18deg);animation:dashShine 9s ease-in-out 2s infinite}
@keyframes dashShine{0%,82%{transform:translateX(-130%) skewX(-18deg)}100%{transform:translateX(330%) skewX(-18deg)}}
.topbar .nav a.nav-dash:hover{color:#fff;transform:translateY(-3px);background:linear-gradient(135deg,#1f5bb3 0%,#0f3a7a 48%,#081f42 100%);background-size:180% 180%;background-position:100% 100%;
  box-shadow:0 0 0 1.5px rgba(232,194,104,.85),0 14px 28px rgba(8,31,66,.36),inset 0 1px 0 rgba(255,255,255,.2)}
.topbar .nav a.nav-dash:active{transform:translateY(-1px)}
.topbar .nav a.nav-dash[aria-current]{color:#fff;background:linear-gradient(135deg,#1f5bb3 0%,#0f3a7a 48%,#081f42 100%);background-size:180% 180%;
  box-shadow:0 0 0 2px var(--gold),0 0 0 5px rgba(212,164,55,.28),0 8px 18px rgba(8,31,66,.26),inset 0 1px 0 rgba(255,255,255,.16)}
.topbar .nav a.nav-dash:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
@media(max-width:1180px){
  .topbar.in .nav a.nav-dash{order:-1;justify-content:center;gap:10px;padding:12px 16px;margin-bottom:4px;border-radius:14px;font-size:15.5px}
  .topbar.in .nav a.nav-dash:hover{background-position:100% 100%;background-color:transparent}
}
@media (prefers-reduced-motion: reduce){
  .topbar .nav a.nav-dash::after{animation:none;display:none}
  .topbar .nav a.nav-dash:hover,.topbar .nav a.nav-dash:active{transform:none}
}
@media(max-width:560px){
  .topbar{padding:10px 10px 0}
  .topbar-inner{gap:8px;padding:7px 7px 7px 12px;border-radius:20px}
  .brand{font-size:15px;gap:8px}
  .brand-logo{height:32px}
  .token-chip,.userbox .userchip,.userbox .btn-primary{display:none}
  .nav .nav-token,.nav .nav-auth,.nav-user{display:flex}
  .nav .nav-login{display:none}
  .btn-logout{width:40px;padding:0;justify-content:center}
  .btn-logout .lbl{display:none}
  .topbar .btn-sm{padding:0 14px}
}
@media(max-width:370px){
  .userbox .btn-ghost{display:none}
  .nav .nav-login{display:flex}
}
@media(max-width:330px){
  .brand span{display:none}
}

/* Hazır şablonlar */
.ready-panel{border:1px solid #ead9a4;background:linear-gradient(180deg,#fffdf8 0%,#fff 42%)}
.mod-panel{border:1px solid #d5e3fb;background:linear-gradient(180deg,#f7faff 0%,#fff 46%)}
.dash-ready-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);gap:22px;align-items:start}
.tpl-stage{min-width:0}
.tpl-detail{background:#fff;border:1px solid #f0e2bc;border-radius:18px;padding:18px 16px 14px;box-shadow:0 12px 28px rgba(120,80,10,.06)}
.tpl-detail[hidden]{display:none}
.tpl-kicker{margin:0 0 6px;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8a6a24}
.tpl-detail h3{margin:0 0 8px;font-size:17px;line-height:1.35}
.tpl-desc{margin:0 0 12px;color:var(--muted);font-size:14px;line-height:1.55}
.tpl-rules{margin:0;padding:0;list-style:none;max-height:340px;overflow:auto;display:flex;flex-direction:column;gap:8px}
.tpl-rules li{margin:0;padding:10px 12px;border-radius:12px;background:#fffdf6;border:1px solid #f3e6c4;font-size:13.5px;line-height:1.45;color:#3c5173}
@media(max-width:860px){
  .dash-ready-grid{grid-template-columns:1fr}
  .tpl-rules{max-height:none}
}
.tpl-off{opacity:.72}
.editbox{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.editbox summary{cursor:pointer;font-weight:600;color:var(--navy)}
.editbox summary:hover{color:var(--gold2)}

/* Geniş tablolar sayfayı yana itmesin, kendi kutusunda kaysın */
.table-scroll{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-scroll .tbl{min-width:720px;margin:0}
.pack-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.meter{display:flex;align-items:center;gap:12px;margin:9px 0;font-size:14px}
.meter .lab{flex:none;width:86px;color:var(--muted)}
.meter .bar{flex:1;min-width:0;height:14px;border-radius:999px;background:#eef2f7;overflow:hidden}
.meter .bar > div{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--brand),var(--brand2))}
.meter b{flex:none;width:150px;text-align:right}

/* ============================================================
   Her genişlik: sütunlar alta insin, satır taşmasın, menü karışmasın
   ============================================================ */
img,video,iframe,canvas{max-width:100%}
.brand-logo,.dev-credit img{max-width:none}
code.k{overflow-wrap:anywhere}
h1,h2,h3,p,li,.sub,.card p{overflow-wrap:break-word}
.container,.panel,.card,.step,.hero{min-width:0}

@media(max-width:1180px){
  .nav{max-height:min(70vh,560px);overflow-y:auto;overscroll-behavior:contain}
}
@media(max-width:900px){
  .grid[style*="grid-template-columns"]{grid-template-columns:1fr!important}
  .dl-cards{grid-template-columns:1fr!important}
  .stats-strip{grid-template-columns:1fr 1fr}
  .hh-stats{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .container{padding:18px 12px 48px}
  .panel,.card{padding:18px 16px}
  .hero{padding:28px 18px;border-radius:20px}
  .hero h1,.hero-sm h1{font-size:28px}
  .empty{padding:28px 16px}
  .map-frame{height:240px}
  .pdf-frame{height:68vh;min-height:280px}
  .footer{padding:18px 14px}
  .dev-credit{flex-wrap:wrap;justify-content:center;text-align:center;line-height:1.45;padding-inline:8px}
  .modal-card{padding:18px 16px}
  .modal-foot{flex-wrap:wrap}
  .modal-foot .btn{flex:1 1 auto;justify-content:center}
  .audit{padding:16px 14px}
  .checkline{align-items:flex-start}
  .editbox input[type=file],input[type=file]{max-width:100%}
  .stat .num{font-size:28px}
  .meter{flex-wrap:wrap}
  .meter .lab{width:auto}
  .meter .bar{flex:1 1 120px}
  .meter b{width:auto;margin-left:auto}
  .hist-toolbar select{width:100%}
  .seg{max-width:100%}
  .tabs a{padding:8px 12px;font-size:13px}
}
.gap-box{margin:0 0 18px;padding:16px 16px 14px;border:1px solid #f0d7a2;background:linear-gradient(180deg,#fffaf0,#fff);border-radius:16px}
.gap-box h3{margin:0 0 6px;font-size:17px}
.gap-box .gap-lead{margin:0 0 12px;color:#7c5a12;font-size:14px;line-height:1.5}
.gap-field{margin:0 0 12px}
.gap-field legend,.gap-field .f{font-weight:700;margin-bottom:4px}
.gap-field p{margin:0 0 8px;font-size:13.5px;color:#6b5420}
.gap-opts{display:grid;gap:8px}
.gap-opt{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid #ead7b0;border-radius:12px;background:#fff;cursor:pointer}
.gap-opt input{margin-top:3px}
.gap-opt b{display:block}
.gap-opt small{color:#6b5420}
.gap-num{display:flex;align-items:center;gap:8px}
.gap-num input{width:7rem}
.use-note{display:flex;gap:12px;align-items:flex-start;margin:0 0 22px;padding:14px 16px;border:1px solid #ead9a4;background:linear-gradient(180deg,#fffdf6,#fff);border-radius:16px;box-shadow:0 8px 20px rgba(120,80,10,.05)}
.use-note p{margin:0;min-width:0;font-size:14.5px;line-height:1.55;color:#713f12}
.use-note b{color:#713f12}
.privacy-note{display:flex;gap:12px;align-items:flex-start;margin:0 0 22px;padding:14px 16px;border:1px solid #b7e4c7;background:linear-gradient(180deg,#f3fbf6,#fff);border-radius:16px;box-shadow:0 8px 20px rgba(6,95,70,.05)}
.privacy-note p{margin:0;min-width:0;font-size:14.5px;line-height:1.55;color:#14532d}
.privacy-note b{color:#064e3b}
.privacy-note a{font-weight:700;white-space:nowrap}
.pn-ico{flex:0 0 auto;font-size:20px;line-height:1.35}
.gone-box{margin:4px 0 18px;padding:18px;border-radius:16px;background:#f8fafc;border:1px dashed #cbd5e1}
.gone-box h3{margin:0 0 6px;font-size:18px}
.gone-box p{margin:0;color:var(--muted);line-height:1.55}
.legal-nav{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px}
.legal-nav a{font-size:13.5px;font-weight:600;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink)}
.legal-nav a[aria-current="page"]{background:#eef4ff;border-color:#c9d8f5;color:var(--brand)}
.legal-meta{color:var(--muted);font-size:13px;margin:8px 0 0}
.privacy-page h3{margin:26px 0 8px;font-size:18px}
.privacy-page p,.privacy-page li{line-height:1.65;color:#334155}
.privacy-page ul{margin:8px 0 0;padding-left:18px}
.privacy-dl{display:grid;grid-template-columns:minmax(120px,200px) 1fr;gap:8px 16px;margin:12px 0 0}
.privacy-dl dt{font-weight:700}
.privacy-dl dd{margin:0;color:#334155}
.dl-group .wait{display:inline-flex;align-items:center;min-height:32px;padding:0 8px;color:var(--muted);font-size:12.5px;font-weight:600}
@media(max-width:720px){
  .privacy-note,.use-note{flex-direction:column;gap:6px}
  .privacy-note a{white-space:normal}
  .privacy-dl{grid-template-columns:1fr}
  .privacy-dl dt{margin-top:8px}
}
@media(max-width:420px){
  .hero h1,.hero-sm h1{font-size:24px}
  .stats-strip,.hh-stats{grid-template-columns:1fr}
  .dropzone{padding:16px 12px}
  .dropzone p{font-size:13px}
  .btn{max-width:100%}
  .table-scroll .tbl{min-width:640px}
}

/* ---------- Profil sayfası ---------- */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;min-width:0!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
a.userchip,a.nav-user{color:inherit;text-decoration:none}
a.userchip:hover{text-decoration:none;border-color:#d6e0ef;box-shadow:0 6px 16px rgba(8,31,66,.08)}
a.userchip[aria-current]{box-shadow:0 0 0 3px rgba(212,164,55,.22)}
a.nav-user:hover{text-decoration:none;background:#f7f9fc;border-radius:12px}
/* nav-user artık bağlantı: .nav a kuralı onu masaüstünde göstermesin; yalnız dar ekran menüsünde görünür */
.nav a.nav-user{display:none}
@media(max-width:560px){.nav a.nav-user{display:flex}}
.nav .nav-profile{display:none}
@media(max-width:1180px){.topbar.in .nav .nav-profile{display:flex}}
@media(max-width:880px){.nav .nav-profile{display:flex}}
/* ---------- Üyelik durumu (onay.php) ---------- */
.status-wrap{max-width:560px}
.status-card{text-align:center;padding:34px 30px}
.status-icon{display:grid;place-items:center;width:72px;height:72px;margin:0 auto 14px;border-radius:50%;font-size:30px;font-weight:800;
  background:linear-gradient(135deg,#fdf7e6,#f7e5b5);color:#6f4f0c;box-shadow:inset 0 0 0 1px #efd9a2}
.status-stop .status-icon{background:#fef3f2;color:var(--danger);box-shadow:inset 0 0 0 1px #fecdca}
.status-card h2{margin:0 0 8px}
.status-text{margin:0 0 16px;color:#2c4368;font-size:15.5px;line-height:1.6}
.status-note{margin:0 0 16px;padding:12px 14px;border-radius:12px;background:#f5f7fb;border:1px solid var(--line);text-align:left;font-size:14px;color:#43577b}
.status-facts{display:grid;gap:8px;margin:0 0 20px;padding:14px 16px;border-radius:14px;background:#fafbfd;border:1px solid var(--line);text-align:left}
.status-facts div{display:flex;justify-content:space-between;gap:14px;font-size:14px}
.status-facts dt{color:var(--muted);font-weight:600}
.status-facts dd{margin:0;font-weight:600;color:var(--navy);text-align:right;overflow-wrap:anywhere}
.status-actions{display:flex;flex-direction:column;align-items:center}
@media(max-width:560px){.status-card{padding:26px 18px}.status-facts div{flex-direction:column;gap:2px}.status-facts dd{text-align:left}}

/* ---------- Yönetim: üyelik başvuruları, güvenlik, bildirimler ---------- */
.appr-views{display:flex;flex-wrap:wrap;gap:6px}
.appr-views a{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;background:#f3f6fb;border:1px solid var(--line);
  color:#43577b;font-size:13.5px;font-weight:600;text-decoration:none}
.appr-views a b{font-weight:800;color:var(--navy)}
.appr-views a.on{background:#fff;border-color:#efd9a2;box-shadow:0 0 0 3px rgba(212,164,55,.18);color:var(--navy)}
.appr-filter{margin:14px 0 0;font-size:14px;color:var(--muted)}
.appr-bulk{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:18px 0 12px;padding:10px 12px;border-radius:14px;background:#fafbfd;border:1px solid var(--line)}
.appr-list{display:grid;gap:14px}
.appr-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,300px);gap:18px;padding:18px 20px;border-radius:18px;background:#fff;
  border:1px solid var(--line);border-left:5px solid #c9d6ea}
.appr-row.appr-high{border-left-color:#d92d20;background:linear-gradient(90deg,#fff7f6,#fff 40%)}
.appr-row.appr-medium{border-left-color:#d4a437}
.appr-row.appr-clean{border-left-color:#3aa76d}
.appr-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.appr-head h3{margin:0;font-size:17px;overflow-wrap:anywhere}
.appr-mail{margin:4px 0 10px;color:#43577b;font-size:14px;overflow-wrap:anywhere}
.appr-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:6px 14px;margin:0}
.appr-facts div{min-width:0}
.appr-facts dt{font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.appr-facts dd{margin:2px 0 0;font-size:14px;font-weight:600;color:var(--navy);overflow-wrap:anywhere}
.appr-note{margin:10px 0 0;padding:9px 12px;border-radius:10px;background:#f5f7fb;font-size:13.5px;color:#2c4368;overflow-wrap:anywhere}
.appr-signals{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0;padding:0;list-style:none}
.appr-signals li{padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700}
.appr-signals .sig-high{background:#ffe4e0;color:#b42318}
.appr-signals .sig-medium{background:#fef3c7;color:#92400e}
.appr-signals a{color:inherit}
.appr-actions{display:flex;flex-direction:column;gap:10px}
.appr-actions form{display:flex;flex-direction:column;gap:6px}
.appr-actions input[type=text]{padding:8px 10px;font-size:13.5px}
.appr-nogift{margin:0;font-size:13px;font-weight:500}
.appr-actions .btn{justify-content:center}
@media(max-width:820px){.appr-row{grid-template-columns:1fr}}
.sec-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px;margin-bottom:22px}
.sec-stat{display:block;min-width:0;padding:16px 18px;border-radius:18px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);color:var(--ink)}
a.sec-stat:hover{text-decoration:none;border-color:#efd9a2}
.sec-stat small{display:block;color:var(--muted);font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.sec-stat b{display:block;margin-top:6px;font-size:26px;font-weight:800;color:var(--navy);line-height:1.2}
.sec-stat span{display:block;margin-top:4px;font-size:13px;color:var(--muted)}
.sec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}
.sec-health{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.sec-health li{padding:12px 14px 12px 16px;border-radius:12px;border:1px solid var(--line);border-left:5px solid #c9d6ea;background:#fafbfd;font-size:14.5px}
.sec-health li small{display:block;margin-top:3px;color:var(--muted);font-size:12.5px;line-height:1.5}
.sec-health li.h-ok{border-left-color:#3aa76d}.sec-health li.h-warn{border-left-color:#d4a437}.sec-health li.h-bad{border-left-color:#d92d20;background:#fff7f6}
.sec-rule-form,.sec-filter{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin:0 0 14px}
.sec-rule-form label,.sec-filter label{display:flex;flex-direction:column;gap:4px;min-width:120px;flex:1;font-size:12px;font-weight:700;color:#2c4368}
.sec-rule-form input,.sec-rule-form select,.sec-filter input,.sec-filter select{padding:8px 10px;font-size:13.5px}
.sec-events{min-width:1000px}
.sec-events td{vertical-align:top}
.sec-events .badge,.sec-events code.k,.sec-events .btn{white-space:nowrap;overflow-wrap:normal}
.sec-events td:nth-child(5){overflow-wrap:anywhere;min-width:170px}
.sec-pages{display:flex;gap:10px;justify-content:center;margin-top:14px}
.notif-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.notif-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:start;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:#fff}
.notif-item.unread{border-left:5px solid #d4a437;background:linear-gradient(90deg,#fffbf0,#fff 45%)}
.notif-item.unread.sev-critical{border-left-color:#d92d20;background:linear-gradient(90deg,#fff5f4,#fff 45%)}
.notif-item h3{margin:0;font-size:15px}
.notif-item p{margin:3px 0 0;font-size:13.5px;color:#43577b;overflow-wrap:anywhere}
.notif-item time{display:block;margin-top:4px;font-size:12px;color:var(--muted)}
.notif-count{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:#f1f4f9;color:#43577b;font-size:12px;font-weight:800}
.tabs a .tab-badge{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:#d92d20;color:#fff;font-size:11.5px;font-weight:800}
@media(max-width:820px){.sec-grid{grid-template-columns:1fr}.notif-item{grid-template-columns:1fr}}

/* Şablonun sunucu uyumu (yazı tipleri / LaTeX paketleri) */
.badge-warn{background:#fff4e0;color:#8a5a00;border:1px solid #f3d9a4}
.compat{margin-top:12px;border:1px solid var(--line);border-radius:14px;background:#fafbfd;overflow:hidden}
.compat-ok{border-color:#d5eedf;background:#f6fcf8}
.compat-warn{border-color:#f3e0b5;background:#fffbf2}
.compat summary{cursor:pointer;list-style:none;display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 14px;font-size:13.5px}
.compat summary::-webkit-details-marker{display:none}
.compat summary::after{content:"▾";margin-left:auto;color:var(--muted);transition:transform .3s var(--ease)}
.compat[open] summary::after{transform:rotate(180deg)}
.compat-sum{color:#43577b;line-height:1.45;min-width:0;overflow-wrap:anywhere;flex:1 1 180px}
.compat-list{list-style:none;margin:0;padding:2px 14px 10px;display:grid;gap:6px}
.compat-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:8px 11px;border-radius:11px;background:#fff;border:1px solid var(--line);border-left:4px solid #c9d6ea;font-size:13.5px}
.compat-list li b{color:var(--navy);overflow-wrap:anywhere}
.compat-list li small{grid-column:1/-1;color:var(--muted);font-size:12.5px;line-height:1.45;overflow-wrap:anywhere}
.compat-list .c-state{font-size:12px;font-weight:700;color:#43577b;white-space:nowrap}
.compat-list .c-birebir,.compat-list .c-olcuce_es{border-left-color:#3aa76d}
.compat-list .c-yaklasik{border-left-color:#d4a437}.compat-list .c-yaklasik .c-state{color:#8a5a00}
.compat-list .c-yok{border-left-color:#d92d20}.compat-list .c-yok .c-state{color:#b42318}
.compat-list .c-skip{opacity:.75}
.compat-note{margin:0;padding:0 14px 12px;font-size:12.5px;color:var(--muted);line-height:1.55;overflow-wrap:anywhere}
.compat-note code{font-size:12px;background:#eef2f9;padding:1px 5px;border-radius:6px}
.compat-fill{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:12px 0 0;font-size:13px;color:#43577b;line-height:1.45}
.compat-fill span:last-child:not(.badge){min-width:0;overflow-wrap:anywhere}

/* ---------- Ana sayfa: tanıtım videosu (#tanitim) ---------- */
.hero-watch{display:inline-flex;align-items:center;gap:10px;margin-top:18px;color:#e9eefb;font-weight:700;font-size:14.5px;text-decoration:none}
.hero-watch:hover{color:#f3d489}
.hero-watch-ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:11px;padding-left:2px;
  background:linear-gradient(92deg,#f3d489,#d4a437);color:#081f42;box-shadow:0 0 0 6px rgba(212,164,55,.18)}
.promo{margin:0 0 30px;padding:38px 34px 34px;border-radius:28px;text-align:center;scroll-margin-top:90px;
  background:radial-gradient(900px 300px at 50% -10%,rgba(212,164,55,.14),transparent 70%),var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
.promo-eyebrow{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gold2);background:#fdf3dc;border:1px solid #f6dfae;padding:6px 12px;border-radius:999px}
.promo-head h2{font-family:'Playfair Display',serif;font-size:34px;line-height:1.15;color:var(--navy);margin:14px 0 10px}
.promo-head p{color:var(--muted);font-size:16px;line-height:1.6;max-width:720px;margin:0 auto 24px}
.promo-frame{position:relative;max-width:1040px;margin:0 auto;aspect-ratio:16/9;border-radius:22px;overflow:hidden;background:#081f42;
  box-shadow:0 24px 60px rgba(8,31,66,.28),0 0 0 1px rgba(8,31,66,.08)}
.promo-frame.is-dikey{aspect-ratio:9/16;width:100%;max-width:min(100%,calc(78vh * 9 / 16),460px)}
.promo-video{display:block;width:100%;height:100%;object-fit:contain;background:#081f42}
.promo-play{position:absolute;left:50%;bottom:7%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:12px;white-space:nowrap;
  padding:10px 24px 10px 10px;border:0;border-radius:999px;cursor:pointer;font:inherit;font-weight:800;font-size:16px;color:#081f42;
  background:linear-gradient(92deg,#f3d489,#d4a437);box-shadow:0 14px 34px rgba(0,0,0,.38);transition:transform .25s var(--ease),box-shadow .25s}
.promo-play:hover,.promo-play:focus-visible{transform:translateX(-50%) scale(1.05);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.promo-play:focus-visible{outline:3px solid #fff;outline-offset:3px}
.promo-play-ic{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:17px;padding-left:3px;
  background:#081f42;color:#f3d489;animation:promoPulse 2.4s ease-in-out infinite}
@keyframes promoPulse{0%,100%{box-shadow:0 0 0 0 rgba(8,31,66,.45)}50%{box-shadow:0 0 0 9px rgba(8,31,66,0)}}
.promo-frame.is-playing .promo-play{display:none}
.promo-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:24px}
.promo .btn-ghost{background:#fff;border-color:#d7e0ef;color:var(--navy)}
.promo .btn-ghost:hover{border-color:var(--gold);color:var(--gold2)}
@media(max-width:560px){
  .promo{padding:26px 14px 22px;border-radius:22px}
  .promo-head h2{font-size:26px}
  .promo-head p{font-size:15px;margin-bottom:18px}
  .promo-frame{border-radius:18px}
  .promo-play{font-size:15px;gap:10px;padding:8px 20px 8px 8px}
  .promo-play-ic{width:40px;height:40px;font-size:15px}
  .promo-cta .btn{width:100%;justify-content:center}
}
@media (prefers-reduced-motion: reduce){.promo-play-ic{animation:none}}

/* ---------- Altyapı notu: journial.org (footer ve Hakkında) ---------- */
.infra-credit{flex-basis:100%;text-align:center;font-size:12.5px;color:var(--muted);margin-top:2px}
.infra-credit a{font-weight:700;color:var(--brand)}
.infra-panel{text-align:center}
.infra-panel h2 a{color:var(--navy);text-decoration:none;border-bottom:2px solid var(--gold)}
.infra-panel h2 a:hover{color:var(--gold2)}
.infra-panel .sub{max-width:680px;margin-left:auto!important;margin-right:auto!important;line-height:1.65}

/* ============================================================
   TEMA v8 — Her ölçekte duyarlılık (320–1920 px) ve yeni footer.
   Kurallar: metin kesilmez, alt satıra iner; gövde metni iki yana yaslı ve hecelenir;
   mobilde tek başına duran düğmeler tam genişlik; sekmeler mobilde tek satırda kayar;
   çentikli ekranlarda kenar ve alt payı bırakılır.
   ============================================================ */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}

/* Açık zemindeki ikincil düğme: lacivert çerçeve (koyu zeminde .hero kuralı geçerli kalır) */
.btn-ghost{background:#fff;border-color:#d7e0ef;color:var(--navy);box-shadow:0 4px 12px rgba(8,31,66,.06)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold2)}

/* İki yana yaslı gövde metni; ortalı ve kısa öğeler kendi hizasında kalır */
main :is(p,li,dd){text-align:justify;-webkit-hyphens:auto;hyphens:auto;text-wrap:pretty}
main :is(.dropzone,.empty,.hist-empty,.stat,.dl,.status-card,.promo,.infra-panel,.hero-cta,.promo-cta,.dl-cards,.typeset-demo,.tabs,.legal-nav,table,.badge,.btn,.pf-btn,.checkline,label,.steps .step > b,[style*="text-align:center"],[style*="text-align: center"]) :is(p,li,dd),
main :is(p,li,dd):is([style*="text-align:center"],[style*="display:flex"],.center,.hint,.file-name,:has(br)),
main p[style*="display:flex"] *,
main .hero-watch{text-align:inherit;-webkit-hyphens:manual;hyphens:manual}
main :is(h1,h2,h3,h4){text-wrap:balance;overflow-wrap:break-word;-webkit-hyphens:manual;hyphens:manual}
.card p:last-child,.step p:last-child,.panel > p:last-child{margin-bottom:0}

/* Tablet ve altı: sekmeler sarılmaz, kendi satırında kayar */
@media(max-width:820px){
  .tabs{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    margin-inline:-12px;padding:2px 12px 6px;scroll-padding-inline:12px}
  .tabs::-webkit-scrollbar{display:none}
  .tabs a{flex:none;white-space:nowrap}
}

/* Mobil: tek başına duran düğmeler tam genişlik, yazı ortada ve gerekirse alt satıra iner */
@media(max-width:600px){
  main .btn:not(.btn-sm),main .pf-btn{width:100%;justify-content:center;text-align:center;white-space:normal;line-height:1.3}
  main :is(.hero-cta,.promo-cta,.modal-foot){flex-direction:column;align-items:stretch;width:100%;flex:1 1 100%}
  main form .btn:not(.btn-sm){min-height:48px}
  .hero-watch{display:flex;justify-content:center;text-align:center}
  #to-top{right:max(14px,env(safe-area-inset-right));bottom:calc(14px + env(safe-area-inset-bottom));width:44px;height:44px}
}


/* Tablolar: dar ekranda harf harf kırılmaz; kelimeden kırılır, sığmazsa kendi kutusunda yana kayar */
@media(max-width:820px){
  table.tbl{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  table.tbl td,table.tbl th{overflow-wrap:normal;word-break:normal;min-width:72px}
  table.tbl :is(.badge,.btn,button,.pf-btn,time){white-space:nowrap}
  .table-scroll table.tbl{display:table}
}

/* ============================================================
   TEMA v9 — Dar ekran menüsü (yan panel), istatistik şeridi, mobil footer
   ============================================================ */

/* Menü düğmesi görünürken eski açılır liste hiç açılmaz; bağlantılar yan paneldedir */
@media(max-width:1100px){.topbar:not(.in) .nav{display:none!important}}
@media(max-width:1180px){.topbar.in .nav{display:none!important}}

/* Telefonda üst bar: tam genişlik, solda marka, sağda menü düğmesi */
@media(max-width:600px){
  .topbar-inner{width:100%;justify-content:space-between;padding:7px 7px 7px 12px}
  .userbox{display:none}
  .nav-toggle{width:44px;height:44px}
}
@media(max-width:330px){
  .brand span{display:inline;font-size:14px}
  .brand-logo{height:30px}
}

/* ---------- Canlı dizgi önizlemesi: biçim değişirken kartın boyu sabit kalır ---------- */
.dp-head{flex-wrap:nowrap;min-height:28px}
.dp-live{white-space:nowrap}
.dp-fmt{white-space:nowrap}
.dp-paper{box-sizing:border-box;height:212px;overflow:hidden}
.dp-row{grid-template-columns:92px minmax(0,1fr) 132px}
.dp-row b{white-space:nowrap}
.dp-pipe{flex-wrap:nowrap}
.pipe-chip{white-space:nowrap}
@media(max-width:520px){
  .typeset-demo{padding:14px}
  .dp-head{display:grid;grid-template-columns:auto 1fr;row-gap:10px;min-height:0}
  .dp-fmt{grid-column:1/-1;justify-self:start;margin-left:0}
  .dp-paper{height:188px}
  .dp-row{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"lab val" "bar bar";row-gap:6px}
  .dp-row > span:first-child{grid-area:lab}
  .dp-row .dp-bar{grid-area:bar}
  .dp-row b{grid-area:val}
  .dp-pipe{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:6px}
  .pipe-chip{display:flex;justify-content:center;padding:7px 4px;font-size:11.5px}
}

/* ============================================================
   TEMA v10 — Lacivert menü paneli, premium footer, yukarı-çık hizası, iletişim kartı
   ============================================================ */

/* ---------- Footer: lacivert zemin, altın kural ve § işareti, Playfair satır ---------- */
.foot-wave{margin-top:24px}
.footer{position:relative;overflow:hidden;display:block;margin:0;padding:0 0 env(safe-area-inset-bottom);border-top:0;color:#b9c7dd;font-size:14px;
  background:radial-gradient(760px 340px at 88% 0,rgba(212,164,55,.17) 0,transparent 60%),
             radial-gradient(640px 380px at 0 100%,rgba(20,74,150,.48) 0,transparent 62%),
             linear-gradient(180deg,#081f42 0%,#061831 100%)}
.ft-glyph{position:absolute;right:-26px;top:-60px;z-index:0;line-height:1;pointer-events:none;user-select:none;
  font-family:'Playfair Display',serif;font-weight:800;font-size:380px;color:transparent;
  background:linear-gradient(180deg,rgba(243,212,137,.11),rgba(243,212,137,0) 80%);-webkit-background-clip:text;background-clip:text}
.ft-top,.ft-rule,.ft-grid,.ft-bottom{position:relative;z-index:1;max-width:1120px;margin-left:auto;margin-right:auto}
.ft-top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px 32px;padding:24px 20px 0}
.ft-logo{display:inline-flex;align-items:center;gap:12px;color:#fff;font-weight:800;font-size:20px;letter-spacing:-.01em;white-space:nowrap}
.ft-logo:hover{text-decoration:none;color:#fff}
.ft-logo em{font-style:normal;color:#e8c268}
.ft-logo-chip{display:grid;place-items:center;width:50px;height:50px;border-radius:15px;background:#fff;box-shadow:0 10px 22px rgba(0,0,0,.3)}
.ft-logo-chip img{height:38px;width:auto}
.ft-lead{margin:0;font-family:'Playfair Display',serif;font-style:italic;font-size:18px;line-height:1.5;color:#dbe5f4}
.ft-pipe{display:flex;align-items:center;gap:8px;margin:0}
.ft-pipe span{display:inline-flex;align-items:center;justify-content:center;padding:7px 13px;border-radius:999px;white-space:nowrap;font-size:12.5px;font-weight:700;
  color:#f3d489;background:rgba(212,164,55,.12);border:1px solid rgba(212,164,55,.38)}
.ft-pipe i{font-style:normal;color:#7f93b4}
.ft-rule{display:flex;align-items:center;gap:16px;padding:0 20px;margin-top:26px;color:#e8c268}
.ft-rule::before,.ft-rule::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(232,194,104,.5))}
.ft-rule::after{background:linear-gradient(90deg,rgba(232,194,104,.5),transparent)}
.ft-rule span{font-family:'Playfair Display',serif;font-size:19px;line-height:1}
.ft-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 32px;padding:26px 20px 30px}
.ft-col{min-width:0}
.ft-col h2{margin:0;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#e8c268}
.ft-col summary{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;list-style:none;cursor:default}
.ft-col summary::-webkit-details-marker{display:none}
.ft-chev{display:none}
.ft-links{display:flex;flex-direction:column;align-items:flex-start;gap:11px}
.ft-links a{position:relative;color:#dbe5f4;font-weight:500;transition:color .25s var(--ease),padding .3s var(--ease)}
.ft-links a::before{content:"§";position:absolute;left:-6px;top:50%;transform:translateY(-52%);opacity:0;color:#e8c268;
  font-family:'Playfair Display',serif;font-weight:700;transition:opacity .25s var(--ease),left .3s var(--ease)}
.ft-links a:hover{color:#f3d489;padding-left:16px;text-decoration:none}
.ft-links a:hover::before{opacity:1;left:0}
.ft-contact{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.ft-contact h2{margin-bottom:4px}
.ft-ct{display:flex;align-items:center;gap:12px;min-width:0;max-width:100%;color:#eef3fc;font-weight:600}
.ft-ct:hover{text-decoration:none;color:#f3d489}
.ft-ct-ic{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;color:#e8c268;
  background:rgba(232,194,104,.12);border:1px solid rgba(232,194,104,.32);transition:background .25s,color .25s}
.ft-ct:hover .ft-ct-ic{background:linear-gradient(135deg,#f3d489,var(--gold));color:#23180a}
.ft-ct-ic svg{width:17px;height:17px}
.ft-ct > span:last-child{min-width:0;overflow-wrap:anywhere}
.ft-status{display:inline-flex;align-items:center;gap:8px;margin-top:6px;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;line-height:1.35;
  color:#c7f0dc;background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.3)}
.ft-status i{flex:none;width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.2)}
.ft-status.off{color:#fde2b0;background:rgba(212,164,55,.1);border-color:rgba(212,164,55,.3)}
.ft-status.off i{background:var(--gold);box-shadow:0 0 0 3px rgba(212,164,55,.2)}
.ft-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px 28px;padding:18px 20px 22px;border-top:1px solid rgba(255,255,255,.09)}
.footer .dev-credit{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:center;gap:12px;flex-basis:auto;margin:0;padding:0;border:0;color:#b9c7dd;font-size:13.5px;text-align:left}
.footer .dev-credit:hover{color:#fff;text-decoration:none}
.footer .dev-credit:hover strong{text-decoration:underline;text-decoration-color:var(--gold)}
.footer .dev-credit strong{color:#fff}
.dev-logo{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#fff;box-shadow:0 8px 18px rgba(0,0,0,.3)}
.footer .dev-credit img{height:32px;width:auto}
.dev-tx{display:flex;flex-direction:column;gap:2px;line-height:1.4;min-width:0}
.dev-tx small{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#e8c268}
.ft-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 18px;margin:0;font-size:13px;color:#8fa3c2}
.footer .infra-credit{flex-basis:auto;margin:0;text-align:left;font-size:13px;color:#8fa3c2}
.footer .infra-credit a{color:#f3d489;font-weight:700}
.ft-copy{color:#7389aa}
.footer :focus-visible{outline:3px solid rgba(232,194,104,.75);outline-offset:3px;border-radius:8px}
@media(max-width:1240px){.ft-bottom{padding-right:84px}}
@media(max-width:1020px){
  .ft-top{grid-template-columns:auto minmax(0,1fr)}
  .ft-pipe{grid-column:1/-1}
}
@media(max-width:720px){
  .foot-wave svg{height:40px}
  .ft-glyph{font-size:250px;right:-34px;top:-30px}
  .ft-top{grid-template-columns:1fr;justify-items:center;gap:14px;padding:16px 16px 0;text-align:center}
  .ft-lead{font-size:16.5px;max-width:420px}
  .ft-pipe{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:6px;width:100%;max-width:440px}
  .ft-pipe span{min-height:40px;padding:8px 4px;border-radius:14px;font-size:12.5px}
  .ft-rule{margin-top:22px;padding:0 16px}
  .ft-grid{grid-template-columns:1fr;gap:0;padding:10px 16px 6px}
  .ft-col{border-bottom:1px solid rgba(255,255,255,.08)}
  .ft-col summary{min-height:56px;margin:0;padding:0 4px;cursor:pointer}
  .ft-chev{display:grid;color:#e8c268;transition:transform .3s var(--ease)}
  .ft-chev svg{width:18px;height:18px}
  .ft-col[open] .ft-chev{transform:rotate(90deg)}
  .ft-links{gap:0;padding:0 4px 12px}
  .ft-links a{display:block;width:100%;padding:10px 0;font-size:15px}
  .ft-links a:hover{padding-left:16px}
  .ft-contact{border-bottom:0;align-items:stretch;gap:8px;padding:20px 0 6px}
  .ft-contact h2{padding:0 4px;margin-bottom:6px}
  .ft-ct{padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
  .ft-status{align-self:center;margin-top:10px}
  .ft-bottom{flex-direction:column;align-items:stretch;gap:12px;padding:18px 16px 24px}
  .footer .dev-credit{padding-right:64px;min-height:48px}
  .ft-meta{justify-content:flex-start;padding-left:58px}
}
@media(max-width:380px){
  .ft-logo{font-size:17px}
  .ft-pipe span{font-size:11.5px}
  .ft-meta{padding-left:0}
}

/* ---------- Yukarı çık: kayarken sağ altta, sayfa sonunda ThinkBro logosunun hizasında durur (app.js) ---------- */
#to-top{transition:opacity .45s var(--ease),transform .45s var(--ease),box-shadow .3s var(--ease)}

/* ---------- İletişim kartı: lacivert başlık, simgeli satırlar ---------- */
.ct-card{padding:0;overflow:hidden;border-color:#e6ecf5}
.ct-head{position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;padding:24px 24px 22px;color:#fff;
  background:radial-gradient(380px 200px at 100% 0,rgba(212,164,55,.32) 0,transparent 62%),linear-gradient(150deg,#0b2c5c 0%,#081f42 60%,#061831 100%)}
.ct-head::after{content:"§";position:absolute;right:14px;bottom:-34px;font-family:'Playfair Display',serif;font-weight:800;font-size:130px;line-height:1;color:rgba(243,212,137,.1);pointer-events:none}
.ct-logo{flex:none;display:grid;place-items:center;width:60px;height:60px;border-radius:17px;background:#fff;box-shadow:0 10px 22px rgba(0,0,0,.3)}
.ct-logo img{height:44px;width:auto}
.ct-title{position:relative;z-index:1;min-width:0}
.ct-card .ct-title h3{margin:0;font-family:'Playfair Display',serif;font-size:21px;line-height:1.25;color:#fff}
main .ct-card .ct-title p{margin:6px 0 0;font-size:13px;font-weight:700;letter-spacing:.04em;color:#e8c268;text-align:left;-webkit-hyphens:manual;hyphens:manual}
.ct-list{list-style:none;margin:0;padding:10px 12px}
main .ct-list li{text-align:left;-webkit-hyphens:manual;hyphens:manual}
.ct-list li > a,.ct-list li:not(:has(> a)){display:flex;align-items:center;gap:14px;padding:12px;border-radius:16px;color:var(--ink)}
.ct-list li + li{border-top:1px solid #eef2f8}
.ct-list li > a{transition:background .25s var(--ease)}
.ct-list li > a:hover{text-decoration:none;background:#f6f9fd}
.ct-ic{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:13px;color:#7c5a10;
  background:linear-gradient(135deg,#fdf3d7,#f3d489);box-shadow:inset 0 0 0 1px #ecd9a8}
.ct-ic svg{width:20px;height:20px}
.ct-tx{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.ct-tx small{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.ct-tx > span{font-size:15px;font-weight:600;line-height:1.45;color:var(--navy);overflow-wrap:anywhere}
.ct-go{flex:none;display:grid;color:#b7c4da;transition:transform .3s var(--ease),color .3s}
.ct-go svg{width:18px;height:18px}
.ct-list li > a:hover .ct-go{color:var(--gold2);transform:translateX(3px)}
main .ct-card .ct-note{display:flex;align-items:center;gap:10px;margin:0;padding:14px 24px 18px;border-top:1px solid #eef2f8;
  font-size:13.5px;color:var(--muted);text-align:left;background:linear-gradient(180deg,#fff,#fbfcfe)}
.ct-note > span{font-family:'Playfair Display',serif;font-size:18px;color:var(--gold2)}
.ct-note b{color:var(--navy)}
.ct-card:hover{transform:none}
@media(max-width:420px){
  .ct-head{padding:20px 18px 18px;gap:12px}
  .ct-logo{width:52px;height:52px;border-radius:15px}
  .ct-logo img{height:38px}
  .ct-card .ct-title h3{font-size:18px}
  .ct-list{padding:8px}
  .ct-list li > a,.ct-list li:not(:has(> a)){padding:10px 8px;gap:12px}
  main .ct-card .ct-note{padding:12px 18px 16px}
}

/* ============================================================
   TEMA v11 — Erişilebilirlik paneli (kaynak: özel depo dizgim-erisilebilirlik, çıktı: assets/erisilebilirlik/)
   ============================================================ */
/* Panel düğmesi sağ altta; iPhone'da ev çubuğunun üstünde kalır. Menü paneli ya da sitenin bir penceresi açıkken gizlenir;
   klavyeyle odaklanmış düğme gizlenmez. */
a11yw-launcher{bottom:var(--a11y-bottom,calc(20px + env(safe-area-inset-bottom)))!important;transition:opacity .2s ease-out,visibility .2s}
html:has(.modal.show,[aria-modal="true"]:not(#m-menu)) a11yw-launcher{opacity:0;visibility:hidden;pointer-events:none}
a11yw-launcher:focus-within{opacity:1!important;visibility:visible!important;pointer-events:auto!important}

/* Yukarı çık: panel düğmesinin üstünde, ortaları aynı dikey hizada (mühür 60 px, sağdan 20 px → merkez 50 px).
   Taban yüksekliği --tt-base; app.js sayfa sonunda düğmeyi ThinkBro logosunun hizasına kaldırır. */
#to-top{--tt-base:22px;bottom:var(--tt-base)}
html:has(a11yw-launcher:not([style*="display: none"])) #to-top{--tt-base:calc(94px + env(safe-area-inset-bottom));right:27px}
@media(max-width:600px){
  #to-top{--tt-base:calc(14px + env(safe-area-inset-bottom))}
  html:has(a11yw-launcher:not([style*="display: none"])) #to-top{--tt-base:calc(92px + env(safe-area-inset-bottom));right:28px}
}
/* Footer'ın son satırı panel düğmesinin üstünde kalsın: düğmenin yeri boş bir şerit olarak ayrılır. */

/* "Animasyonları durdur": sitenin kendi hareketleri de durur (dalgalar, süzülen işaretler, şerit, önizleme). */
html[data-a11yw-stop-animations]{scroll-behavior:auto}
html[data-a11yw-stop-animations] :is(.hero,.hero::before,.hero::after,.glyphs span,.ticker-track,.foot-wave svg,.hero-wave,.typeset-demo,.dp-dot,.promo-play-ic,.container,.topbar .nav a.nav-dash::after){animation:none!important}
html[data-a11yw-stop-animations] :is(.hero::before,.hero::after){animation:none!important}

/* Büyük yazı, disleksi yazı tipi ya da geniş harf aralığı açıkken: uzun kelimeler kesilmez, alt satıra kırılır;
   üst menü sığmazsa (app.js ölçer) menü düğmesine, logo yazısı da sığmazsa yalnız logoya geçilir. */
html:is([data-a11yw-text-size],[data-a11yw-dyslexia-font],[data-a11yw-text-spacing]) body :is(h1,h2,h3,h4,p,a,li,dt,dd,label,button,span,b,strong,em,small){overflow-wrap:anywhere}
html:is([data-a11yw-text-size],[data-a11yw-dyslexia-font],[data-a11yw-text-spacing]) :is(.ft-logo,.brand,.mm-brand){white-space:normal}
html.nav-compact .topbar .nav{display:none!important}
html.nav-compact .topbar .nav-toggle{display:block}
html.nav-compact .topbar .userbox{display:none}
html.nav-compact .topbar-inner{width:100%;justify-content:space-between}
html.brand-compact .topbar .brand span{display:none}

/* Sayfa sonu: erişilebilirlik düğmesi ThinkBro logosuyla aynı hizada (app.js), yukarı çık onun üstünde; footer © ile biter. */
.ft-bottom{padding-bottom:calc(30px + env(safe-area-inset-bottom))}
html:has(a11yw-launcher:not([style*="display: none"])) .ft-bottom{padding-right:100px}
@media(max-width:720px){
  html:has(a11yw-launcher:not([style*="display: none"])) .ft-bottom{padding-right:16px}
  .footer .dev-credit{padding-right:84px;min-height:60px}
  .ft-meta{flex-direction:column;align-items:stretch;gap:10px;padding-left:0}
  .footer .infra-credit{padding-left:58px}
  .ft-copy{text-align:center;padding-top:12px;border-top:1px solid rgba(255,255,255,.07)}
  .ft-bottom{padding-bottom:calc(20px + env(safe-area-inset-bottom))}
}
@media(max-width:380px){.footer .infra-credit{padding-left:0}}

/* Üst menü: etkin sayfanın altın noktası yer kaplamaz (yazının altında durur); sayfa değişince menü genişliği oynamaz. */
.topbar .nav a{position:relative}
.topbar .nav a.on:not(.nav-dash)::before{position:absolute;left:50%;bottom:3px;width:5px;height:5px;margin-left:-2.5px;box-shadow:0 0 0 2px rgba(212,164,55,.18)}

/* Sayfalar arası geçişte üst menü oynamasın:
   - kaydırma çubuğunun yeri her sayfada ayrılır (özel çubuk 11 px; kısa sayfada ya da yüklenirken ortalı menü kaymaz),
   - Inter gelmeden önceki yedek yazı tipi Inter'in ölçülerine eşlenir (genişlik sıçramaz),
   - logoların gerçek en/boy değerleri HTML'dedir (görsel gelmeden yeri ayrılır). */
html{scrollbar-gutter:stable}
@font-face{font-family:'Inter Fallback';src:local('Arial'),local('Helvetica Neue'),local('Helvetica');size-adjust:107.2%;ascent-override:90.2%;descent-override:22.48%;line-gap-override:0%}
.brand-logo,.mm-logo img,.ft-logo-chip img,.dev-logo img,.ct-logo img{width:auto}

/* Sayfa açılışı: içerik kaymaz, yalnız hafifçe solar (üst menü sabitken içerik zıplamasın). */
.container{animation:pageFade .35s ease-out}
@keyframes pageFade{from{opacity:0}to{opacity:1}}
body.page-out .container{opacity:0;transform:none;transition:opacity .18s ease}
.typeset-demo.dp-still,.typeset-demo.dp-still *{transition:none!important}
@media (prefers-reduced-motion: reduce){.container{animation:none}}

/* ---------- Sayfa geçişi: boş kare yok, üst menü sabit ----------
   Tarayıcı eski sayfayı yeni sayfa çizilene kadar tutar; destekleyen tarayıcıda kısa bir çapraz geçiş olur.
   Üst menü geçişin dışındadır (kendi katmanında, aynı yerde kalır). İçerik açılışta solmaz ve kaymaz. */
@view-transition{navigation:auto}
.topbar-inner{view-transition-name:site-topbar}
::view-transition-group(site-topbar){animation:none}
::view-transition-old(site-topbar){display:none}
::view-transition-new(site-topbar){animation:none}
::view-transition-old(root),::view-transition-new(root){animation-duration:.16s;animation-timing-function:ease-out}
.container,.auth-wrap{animation:none}
body.page-out .container{opacity:1;transition:none}
@media (prefers-reduced-motion: reduce){
  @view-transition{navigation:none}
}

/* ---------- Ana sayfa hero: iki düğme aynı satırda eşit genişlikte; deneme düğmesi önizlemenin altında, onunla aynı genişlikte ---------- */
.hero-cta.hero-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:520px}
.hero-cta.hero-pair .btn{width:100%;justify-content:center;text-align:center;white-space:normal;line-height:1.3}
main .hero-cta.hero-pair{flex-direction:row}
.hero-side{display:flex;flex-direction:column;gap:16px;min-width:0;animation:demoFloat 8s ease-in-out infinite}
.hero-side .typeset-demo{animation:none}
.hero-try{width:100%;justify-content:center;text-align:center;min-height:52px;font-size:15.5px}
@media(max-width:600px){
  main .hero-cta.hero-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:none}
  main .hero-cta.hero-pair .btn{padding:12px 6px;font-size:13.5px;letter-spacing:-.01em;min-height:52px}
}
@media(max-width:340px){main .hero-cta.hero-pair .btn{font-size:13px;padding:10px 8px}}
@media (prefers-reduced-motion: reduce){.hero-side{animation:none}}
html[data-a11yw-stop-animations] .hero-side{animation:none!important}

/* ---------- Ana sayfa hero ızgarası: iki düğme ile deneme düğmesi aynı satırda, aynı yükseklikte ----------
   Üst satır: metin | önizleme (alt kenarları hizalı). Alt satır: Kayıt Ol + Giriş Yap | Üye olmadan dene.
   Telefonda sıra: metin, iki düğme, tanıtım bağlantısı, önizleme, deneme düğmesi. */
.hero-grid{grid-template-areas:"text demo" "cta try" "watch .";row-gap:20px;align-items:end}
.hero-text{grid-area:text;min-width:0}
.hero-grid > .hero-pair{grid-area:cta;max-width:none;margin:0}
.hero-grid > .typeset-demo{grid-area:demo;animation:none}
.hero-grid > .hero-try{grid-area:try;align-self:stretch}
.hero-grid > .hero-watch{grid-area:watch;justify-self:start;margin-top:0}
.hero-grid:not(:has(.hero-try)){grid-template-areas:"text demo" "cta demo" "watch demo"}
.hero-pair .btn,.hero-grid > .hero-try{min-height:52px;padding-top:12px;padding-bottom:12px;font-size:15px;line-height:1.3}
.hero-text .use-note{margin-bottom:0}
@media(max-width:1000px){
  .hero-grid,.hero-grid:not(:has(.hero-try)){grid-template-columns:1fr;grid-template-areas:"text" "cta" "watch" "demo" "try";row-gap:16px}
}
@media(max-width:600px){
  .hero-pair .btn{font-size:13.5px}
}

/* İletişim sayfası: iletişim kartı ile mesaj formu aynı yükseklikte; kartın satırları artan boşluğu eşit doldurur. */
.ct-grid{align-items:stretch}
.ct-card{display:flex;flex-direction:column}
.ct-list{flex:1;display:flex;flex-direction:column;justify-content:space-around}
.ct-card .ct-note{margin-top:auto}

/* Telefonda iki düğme yazılarının uzunluğuna göre paylaşır (ör. %60–%40), yazı tek satırda kalır;
   aynı satıra sığmazsa ikisi de tam genişlikte alt alta iner. Geniş ekranda eşit genişlik kuralı geçerli. */
@media(max-width:600px){
  main .hero-cta.hero-pair{display:flex;flex-wrap:wrap;gap:10px}
  main .hero-cta.hero-pair .btn{flex:1 1 auto;width:auto;white-space:nowrap;padding:12px 16px}
}

/* ---------- Giriş kutusu: "Giriş Yap" düğmesinin hemen altında açılan küçük panel (konumu app.js verir) ---------- */
.lp{position:fixed;z-index:150;top:0;left:0;width:min(320px,calc(100vw - 24px));border-radius:20px;background:#fff;color:var(--ink);
  border:1px solid rgba(212,164,55,.4);box-shadow:0 26px 60px -16px rgba(4,14,30,.45),0 8px 22px rgba(8,31,66,.14);
  transform-origin:var(--lp-origin,top right);animation:lpIn .2s var(--ease)}
.lp[hidden]{display:none}
.lp.up{animation-name:lpInUp}
@keyframes lpIn{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
@keyframes lpInUp{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
.lp-caret{position:absolute;top:-7px;left:var(--lp-caret,50%);width:14px;height:14px;margin-left:-7px;transform:rotate(45deg);border-radius:3px 0 0 0;
  background:#0b2c5c;border-left:1px solid rgba(212,164,55,.4);border-top:1px solid rgba(212,164,55,.4)}
.lp.up .lp-caret{top:auto;bottom:-7px;border-radius:0 0 3px 0;background:#fff;border:0;border-right:1px solid rgba(212,164,55,.4);border-bottom:1px solid rgba(212,164,55,.4)}
.lp-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 12px 12px 18px;border-radius:19px 19px 0 0;color:#fff;
  background:radial-gradient(200px 90px at 100% 0,rgba(212,164,55,.35) 0,transparent 70%),linear-gradient(150deg,#0b2c5c 0%,#081f42 65%,#061831 100%)}
.lp-head h2{display:flex;align-items:center;gap:8px;margin:0;font-family:'Playfair Display',serif;font-size:19px;line-height:1.2;color:#fff}
.lp-head h2 span{color:#e8c268;font-size:18px}
.lp-close{display:grid;place-items:center;flex:none;width:34px;height:34px;padding:0;border-radius:50%;cursor:pointer;color:#fff;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);transition:border-color .25s,color .25s}
.lp-close:hover{border-color:var(--gold);color:#f3d489}
.lp-close svg{width:16px;height:16px}
.lp-body{display:flex;flex-direction:column;gap:11px;padding:16px 18px 16px}
.lp-field{display:flex;flex-direction:column;gap:6px;margin:0;font-size:12.5px;font-weight:700;color:#2c4368}
.lp-field input{width:100%;padding:11px 13px;font-size:14px}
.lp-error{margin:0;padding:9px 12px;border-radius:11px;border:1px solid #fecdca;background:#fef3f2;color:var(--danger);font-size:13px;font-weight:600;line-height:1.4}
.lp-error[hidden]{display:none}
.lp-submit{width:100%;justify-content:center;min-height:46px;margin-top:4px;font-size:14.5px}
.lp-submit[aria-busy="true"]{opacity:.75;pointer-events:none}
main .lp-links,.lp-links{margin:2px 0 0;font-size:13px;color:var(--muted);text-align:center}
.lp-links a{font-weight:700}
.lp :focus-visible{outline:3px solid rgba(212,164,55,.75);outline-offset:2px}
.lp-close:focus-visible{outline-color:#f3d489}
html:has(.lp:not([hidden])) a11yw-launcher{opacity:0;visibility:hidden;pointer-events:none}
@media (prefers-reduced-motion: reduce){.lp{animation:none}}

/* Giriş kutusu: kompakt düzen (ince başlık, simgeli 40 px alanlar, sıkı aralıklar). */
.lp{width:min(280px,calc(100vw - 24px));border-radius:16px}
.lp-caret{top:-6px;width:12px;height:12px;margin-left:-6px;background:#fff;border-color:rgba(212,164,55,.45)}
.lp-head{padding:10px 8px 10px 14px;border-radius:15px 15px 0 0;color:var(--navy);background:linear-gradient(180deg,#fffdf7,#fff);border-bottom:1px solid #eef2f8}
.lp-head h2{gap:6px;font-size:16px;color:var(--navy)}
.lp-head h2 span{font-size:15px;color:var(--gold2)}
.lp-close{width:28px;height:28px;color:var(--muted);background:transparent;border:1px solid transparent}
.lp-close:hover{color:var(--navy);border-color:#e3e9f3;background:#f6f8fc}
.lp-close svg{width:14px;height:14px}
.lp-close:focus-visible{outline-color:rgba(212,164,55,.75)}
.lp-body{gap:8px;padding:12px 14px 12px}
.lp-in{position:relative;margin:0}
.lp-in > span{position:absolute;z-index:1;left:12px;top:50%;transform:translateY(-50%);display:grid;color:#8a9ab3;pointer-events:none}
.lp-in > span svg{width:16px;height:16px}
.lp .lp-in input{display:block;width:100%;height:40px;margin:0;padding:0 12px 0 36px;font-size:14px;border-radius:11px}
.lp .lp-in:focus-within > span{color:var(--gold2)}
.lp-error{padding:7px 10px;border-radius:10px;font-size:12.5px}
.lp-submit{min-height:40px;height:40px;margin-top:2px;padding:0 16px;font-size:14px}
main .lp-links,.lp-links{margin:2px 0 0;font-size:12.5px}

/* ---------- Dar ekran menüsü: menü düğmesinin altında açılan kompakt panel (giriş kutusuyla aynı dil) ---------- */
.mm{position:fixed;z-index:150;top:0;left:0;display:flex;flex-direction:column;gap:6px;width:min(292px,calc(100vw - 24px));
  max-height:calc(100dvh - 96px);overflow-y:auto;overscroll-behavior:contain;padding:8px;border-radius:18px;background:#fff;color:var(--ink);
  border:1px solid rgba(212,164,55,.42);box-shadow:0 26px 60px -16px rgba(4,14,30,.45),0 8px 22px rgba(8,31,66,.14);
  transform-origin:var(--mm-origin,top right);animation:lpIn .2s var(--ease)}
.mm[hidden]{display:none}
.mm-caret{position:absolute;top:-6px;left:var(--mm-caret,90%);width:12px;height:12px;margin-left:-6px;transform:rotate(45deg);border-radius:3px 0 0 0;
  background:#fff;border-left:1px solid rgba(212,164,55,.45);border-top:1px solid rgba(212,164,55,.45)}
.mm-user{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;color:var(--navy);background:#f6f8fc}
.mm-user:hover,.mm-user.on{text-decoration:none;background:#eef3fb}
.mm-user .avatar{flex:none;width:34px;height:34px;font-size:14px}
.mm-uname{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.25}
.mm-uname b{font-size:14px;overflow-wrap:anywhere}
.mm-uname small{font-size:11.5px;color:var(--muted)}
.mm-credit{flex:none;padding:4px 9px;border-radius:999px;white-space:nowrap;font-size:12px;font-weight:800;color:#5a3f06;background:linear-gradient(135deg,#fdf7e6,#f7e5b5);border:1px solid #efd9a2}
.mm-dash{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;color:#23180a;font-weight:800;font-size:14px;
  background:linear-gradient(135deg,#f3d489 0%,var(--gold) 55%,var(--gold2) 100%);box-shadow:0 8px 18px rgba(201,151,63,.3),inset 0 1px 0 rgba(255,255,255,.4)}
.mm-dash:hover{text-decoration:none;color:#23180a;filter:brightness(1.03)}
.mm-dash-ic{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:var(--navy);background:rgba(8,31,66,.12)}
.mm-dash-ic svg{width:17px;height:17px}
.mm-dash .mm-tx{flex:1;min-width:0}
.mm-dash .mm-go{display:grid;color:var(--navy)}
.mm-dash .mm-go svg{width:17px;height:17px}
.mm-list{display:flex;flex-direction:column;gap:1px;padding:2px 0}
.mm-link{position:relative;display:flex;align-items:center;gap:10px;min-height:42px;padding:6px 10px;border-radius:11px;color:var(--navy);font-weight:600;font-size:14.5px}
.mm-link:hover{text-decoration:none;background:#f3f6fb}
.mm-ic{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:8px;color:#144a96;background:#eef3fb}
.mm-ic svg{width:16px;height:16px}
.mm-tx{flex:1;min-width:0}
.mm-link.on{background:linear-gradient(135deg,#fdf7e6,#fff);box-shadow:inset 0 0 0 1px #efd9a2}
.mm-link.on .mm-ic{color:#3a2a05;background:linear-gradient(135deg,#f3d489,var(--gold))}
.mm-link.on::after{content:"";position:absolute;right:12px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--gold2)}
.mm-foot{display:flex;flex-direction:column;gap:6px;padding:8px 2px 2px;border-top:1px solid #eef2f8}
.mm-foot form{margin:0}
.mm-btn{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;height:40px;padding:0 14px;border-radius:999px;cursor:pointer;
  font-family:inherit;font-weight:700;font-size:14px;border:1px solid transparent}
.mm-btn:hover{text-decoration:none}
.mm-btn svg{width:16px;height:16px}
.mm-btn-gold{color:#23180a;background:linear-gradient(135deg,#e8c268,var(--gold) 55%,var(--gold2));box-shadow:0 8px 18px rgba(201,151,63,.3)}
.mm-btn-gold:hover{color:#23180a}
.mm-btn-out{color:#b42318;background:#fff6f5;border-color:#fdcdc8}
.mm-legal{display:flex;justify-content:center;gap:6px;margin:0;font-size:12px;color:#9aabc6}
.mm-legal a{color:var(--muted)}
.mm-legal a:hover{color:var(--gold2)}
.mm :focus-visible{outline:3px solid rgba(212,164,55,.75);outline-offset:2px}
html:has(.mm:not([hidden])) a11yw-launcher{opacity:0;visibility:hidden;pointer-events:none}
@media (prefers-reduced-motion: reduce){.mm{animation:none}}

/* Telefonda üst bar: marka | Giriş | menü düğmesi (Giriş yalnız ziyaretçide; giriş kutusunu altında açar). */
.tb-login{display:none;flex:none;align-items:center;gap:6px;height:40px;padding:0 14px 0 11px;border-radius:999px;white-space:nowrap;
  color:var(--navy);background:#fff;border:1px solid #d7e0ef;font-size:14px;font-weight:700;transition:border-color .25s,color .25s}
.tb-login svg{width:16px;height:16px}
.tb-login:hover,.tb-login[aria-expanded="true"]{text-decoration:none;border-color:var(--gold);color:var(--gold2)}
@media(max-width:600px){
  .tb-login{display:inline-flex;margin-left:auto}
  .topbar-inner > .brand{min-width:0}
}
html.nav-compact .tb-login{display:inline-flex;margin-left:auto}
/* Ok ucu panelin dışına taşar: kaydırma panelde değil, bağlantı listesinde (çok kısa ekranlar için). */
.mm{overflow:visible;max-height:none}
.mm-list{max-height:calc(100dvh - 330px);min-height:132px;overflow-y:auto;overscroll-behavior:contain}

/* ============================================================
   TEMA v12 — Yönetim ve kullanıcı paneli: her ölçekte düzen
   ============================================================ */
/* Kayıt çipleri dar ekranda alt satıra iner (uzun şablon adı kartı ve sayfayı yana itmesin). */
.hist-meta .chip:not(.chip-file){white-space:normal;overflow-wrap:anywhere;text-align:left}

/* Sekmeler (yönetim menüsü): her genişlikte tek satır; sığmazsa şerit kayar, kenarlarda ok düğmeleri belirir (app.js). */
.tabs-wrap{position:relative;margin-bottom:20px}
.tabs-wrap > .tabs{flex-wrap:nowrap;overflow-x:auto;margin:0;padding:4px 2px 8px;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;scroll-padding-inline:48px}
.tabs-wrap > .tabs::-webkit-scrollbar{display:none}
.tabs-wrap > .tabs a{flex:none;white-space:nowrap}
.tabs-wrap.fade-l > .tabs{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 56px);mask-image:linear-gradient(90deg,transparent 0,#000 56px)}
.tabs-wrap.fade-r > .tabs{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent 100%);mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent 100%)}
.tabs-wrap.fade-l.fade-r > .tabs{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 56px,#000 calc(100% - 56px),transparent 100%)}
.tabs-arrow{position:absolute;top:50%;z-index:2;display:none;place-items:center;width:36px;height:36px;margin-top:-20px;padding:0;border-radius:50%;cursor:pointer;
  color:var(--navy);background:#fff;border:1px solid #d7e0ef;box-shadow:0 6px 16px rgba(8,31,66,.14);transition:border-color .25s,color .25s}
.tabs-arrow:hover{border-color:var(--gold);color:var(--gold2)}
.tabs-arrow svg{width:16px;height:16px}
.tabs-arrow.l{left:-4px}.tabs-arrow.r{right:-4px}
.tabs-arrow.l svg{transform:rotate(180deg)}
.tabs-wrap.fade-l .tabs-arrow.l,.tabs-wrap.fade-r .tabs-arrow.r{display:grid}
@media(max-width:820px){.tabs-wrap{margin-inline:-12px}.tabs-wrap > .tabs{padding-inline:12px}.tabs-arrow{display:none!important}}

/* Dokunma hedefleri: onay kutuları ve küçük denetimler parmakla rahat seçilsin. */
main input[type=checkbox],main input[type=radio]{width:20px;height:20px;flex:none;accent-color:#c08c1d}
main details > summary{min-height:40px;padding-block:9px;box-sizing:border-box}
main .btn-link{min-height:36px}

/* Tablolar sığmayınca kart olur: her satır bir kart, her hücre "başlık: değer". Karar app.js'te verilir (dar ekran ya da
   sütunlar bulunduğu alana sığmıyor → .stack); etiketleri thead'den yazar. Tablo yana kaydırılmaz, sütun kaçmaz. */

  .table-scroll:has(table.tbl-cards.stack){overflow:visible}
  table.tbl.tbl-cards.stack,.table-scroll table.tbl.tbl-cards.stack{display:block;min-width:0;width:100%;overflow:visible}
  table.tbl-cards.stack thead{display:none}
  table.tbl-cards.stack tbody{display:flex;flex-direction:column;gap:10px}
  table.tbl-cards.stack tr{display:block;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 6px 16px rgba(8,31,66,.05)}
  table.tbl-cards.stack tbody tr:hover{background:#fff}
  table.tbl-cards.stack td{display:block;min-width:0;padding:8px 0;border:0;border-bottom:1px dashed #eef2f8;overflow-wrap:anywhere}
  table.tbl-cards.stack td:last-child{border-bottom:0}
  table.tbl-cards.stack td::before{content:attr(data-label);display:block;margin-bottom:5px;font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
  table.tbl-cards.stack td[data-label=""]::before,table.tbl-cards.stack td:not([data-label])::before,table.tbl-cards.stack td[colspan]::before{display:none}
  table.tbl-cards.stack td > *{min-width:0;max-width:100%}
  table.tbl-cards.stack td input:not([type=checkbox]):not([type=radio]),table.tbl-cards.stack td select{width:100%}
  table.tbl-cards.stack td .btn,table.tbl-cards.stack td button{white-space:nowrap}
  table.tbl-cards.stack td form{display:flex;flex-wrap:wrap;gap:6px;margin:0}
  table.tbl-cards.stack td code,table.tbl-cards.stack td .k{word-break:break-all}


/* Kredi paketleri: telefonda ad tam satır; kredi ve fiyat yan yana; Aktif, Kaydet ve Sil alt satırda. */
@media(max-width:900px){
  .pkg-form{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;align-items:center}
  .pkg-form > input[name=name]{grid-column:1/-1}
  .pkg-form > input{width:100%;min-width:0;height:42px}
  .pkg-form > label{min-height:40px}
  .pkg-form > .btn{justify-self:stretch;justify-content:center;min-height:40px}
  .pkg-new > .btn{grid-column:1/-1}
  table.tbl-cards td[colspan] > form[data-confirm]{display:flex;margin-top:8px}
  table.tbl-cards td[colspan] > form[data-confirm] .btn{width:100%;justify-content:center;min-height:40px}
}
@media(min-width:601px){
  table.tbl-cards.stack tr{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));column-gap:20px}
  table.tbl-cards.stack td[colspan]{grid-column:1/-1}
}
/* Geçmişim türü süzgeci: çok dar ekranda düğmeler sığsın (sayı rozeti ve boşluk küçülür). */
@media(max-width:380px){
  .seg button{padding:8px 4px;gap:4px;font-size:13px;min-width:0}
  .seg button b,.seg button .n,.seg button span:last-child{padding-inline:6px}
}

/* ============================================================
   TEMA v13 — Yönetim kenar çubuğu
   Geniş ekran (≥1100): solda yapışkan lacivert çubuk + içerik. Dar ekran: içeriğin üstünde açılır menü düğmesi.
   ============================================================ */
.container:has(> .adm){max-width:1360px}
.adm{display:grid;grid-template-columns:264px minmax(0,1fr);gap:28px;align-items:start}
.adm-main{min-width:0}
.adm-side{position:sticky;top:100px;min-width:0}
.adm-nav{position:relative;overflow:hidden;isolation:isolate;padding:18px 12px 12px;border-radius:24px;color:#dbe5f4;
  background:radial-gradient(260px 180px at 100% 0,rgba(212,164,55,.28) 0,transparent 65%),radial-gradient(260px 220px at 0 100%,rgba(20,74,150,.5) 0,transparent 65%),
             linear-gradient(165deg,#0b2c5c 0%,#081f42 55%,#061831 100%);
  border:1px solid rgba(212,164,55,.3);box-shadow:0 24px 50px -18px rgba(8,31,66,.45)}
.adm-nav::after{content:"§";position:absolute;z-index:-1;right:0;bottom:-46px;font:800 170px/1 'Playfair Display',serif;color:rgba(243,212,137,.07);pointer-events:none}
.adm-head{display:flex;align-items:center;gap:8px;margin:0 8px 10px;font-family:'Playfair Display',serif;font-size:21px;font-weight:700;color:#fff}
.adm-head span{color:#e8c268}
.adm-group{margin:14px 10px 6px;font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#e8c268;opacity:.9}
.adm-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.adm-link{position:relative;display:flex;align-items:center;gap:11px;min-height:42px;padding:6px 10px;border-radius:12px;color:#dbe5f4;font-size:14px;font-weight:600;
  transition:background .25s var(--ease),color .25s var(--ease)}
.adm-link:hover{text-decoration:none;color:#fff;background:rgba(255,255,255,.07)}
.adm-ic{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:#e8c268;background:rgba(232,194,104,.1);
  box-shadow:inset 0 0 0 1px rgba(232,194,104,.22)}
.adm-ic svg{width:16px;height:16px}
.adm-tx{flex:1;min-width:0;overflow-wrap:anywhere;line-height:1.3}
.adm-link.on{color:#fff;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(232,194,104,.35)}
.adm-link.on::before{content:"";position:absolute;left:-12px;top:9px;bottom:9px;width:4px;border-radius:0 4px 4px 0;background:linear-gradient(180deg,#f3d489,var(--gold2))}
.adm-link.on .adm-ic{color:#23180a;background:linear-gradient(135deg,#f3d489,var(--gold));box-shadow:none}
.adm-badge{flex:none;display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;font-size:11.5px;font-weight:800;
  color:#23180a;background:linear-gradient(135deg,#f3d489,var(--gold));font-variant-numeric:tabular-nums}
.adm-badge.crit{color:#fff;background:#d92d20;box-shadow:0 0 0 3px rgba(217,45,32,.25)}
.adm-foot{margin-top:14px;padding-top:10px;border-top:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:2px}
.adm-foot .adm-ic{color:#9fb2cf;background:rgba(255,255,255,.06);box-shadow:none}
.adm-nav :focus-visible{outline:3px solid rgba(232,194,104,.8);outline-offset:2px}
.adm-toggle{display:none}

/* Dar ekran: kenar çubuğu içeriğin üstünde açılır menü olur. */
@media(max-width:1099px){
  .adm{grid-template-columns:minmax(0,1fr);gap:16px}
  .adm-side{position:relative;top:auto;z-index:20}
  .adm-toggle{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:8px 14px 8px 8px;border-radius:18px;cursor:pointer;font:inherit;text-align:left;color:#fff;
    background:radial-gradient(240px 120px at 100% 0,rgba(212,164,55,.3) 0,transparent 65%),linear-gradient(150deg,#0b2c5c 0%,#081f42 60%,#061831 100%);
    border:1px solid rgba(212,164,55,.32);box-shadow:0 14px 30px -14px rgba(8,31,66,.5)}
  .adm-toggle-ic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:#23180a;background:linear-gradient(135deg,#f3d489,var(--gold))}
  .adm-toggle-ic svg{width:19px;height:19px}
  .adm-toggle-tx{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.25}
  .adm-toggle-tx small{font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#e8c268}
  .adm-toggle-tx b{font-size:16px;overflow-wrap:anywhere}
  .adm-chev{flex:none;display:grid;color:#e8c268;transform:rotate(90deg);transition:transform .3s var(--ease)}
  .adm-chev svg{width:18px;height:18px}
  .adm-toggle[aria-expanded="true"] .adm-chev{transform:rotate(-90deg)}
  .adm-toggle:focus-visible{outline:3px solid rgba(232,194,104,.8);outline-offset:3px}
  .adm-side.js .adm-nav{position:absolute;left:0;right:0;top:calc(100% + 8px);max-height:min(70dvh,560px);overflow-y:auto;overscroll-behavior:contain;
    box-shadow:0 30px 60px -16px rgba(4,14,30,.55)}
  .adm-side.js:not(.open) .adm-nav{display:none}
  .adm-side.open .adm-nav{animation:lpIn .2s var(--ease)}
  .adm-head{display:none}
  .adm-nav{padding:6px 12px 12px}
  .adm-nav > ul,.adm-nav .adm-group + ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));gap:2px 8px}
  .adm-link.on::before{left:-4px}
}
@media (prefers-reduced-motion: reduce){.adm-side.open .adm-nav{animation:none}}

/* Yönetim: dar ekranda toplu işlem satırındaki seçim kutusu taşmasın. */
.appr-bulk{flex-wrap:wrap;min-width:0}
.appr-bulk select{min-width:0;max-width:100%;flex:1 1 180px}
/* Kenar çubuğu yapışkan: kayarken üst barın altında kalır, içerik bitince içerikle birlikte bırakılır (footer'a inilir).
   Ekran kısaysa çubuk ekran yüksekliğini aşmaz, kendi içinde kayar. */
@media(min-width:1100px){
  .adm{align-items:start}
  .adm-side{position:sticky;top:100px;align-self:start}
  .adm-nav{max-height:calc(100dvh - 116px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(232,194,104,.4) transparent}
}

/* ---------- Dar ekranda yönetim menüsü üst barda: hamburgerin solunda altın düğme, menü düğmenin altında açılır ---------- */
.tb-admin{display:none;position:relative;flex:none;align-items:center;gap:8px;height:44px;min-width:44px;padding:0 13px;border-radius:14px;cursor:pointer;font:inherit;
  font-size:14px;font-weight:800;color:#23180a;background:linear-gradient(135deg,#f3d489,var(--gold) 55%,var(--gold2));border:1px solid rgba(185,130,30,.55);
  box-shadow:0 8px 18px rgba(201,151,63,.32),inset 0 1px 0 rgba(255,255,255,.45);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.tb-admin:hover{transform:translateY(-1px);box-shadow:0 12px 22px rgba(201,151,63,.42),inset 0 1px 0 rgba(255,255,255,.45)}
.tb-admin svg{width:19px;height:19px;flex:none}
.tb-admin .tb-admin-n{position:absolute;top:-7px;right:-7px;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;
  font-size:11px;font-weight:800;color:#fff;background:var(--navy);box-shadow:0 0 0 2px #fff}
.tb-admin[aria-expanded="true"]{box-shadow:0 0 0 3px rgba(212,164,55,.35),0 8px 18px rgba(201,151,63,.32)}
.tb-admin:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
@media(max-width:1099px){
  .tb-admin{display:inline-flex}
  .topbar-inner > .tb-admin{margin-left:auto}
  .topbar-inner > .tb-admin ~ .nav-toggle{margin-left:0}
  .adm-toggle{display:none!important}
  .adm-side,.adm-side.js{position:static;height:0;margin:0}
  .adm{gap:0}
  .adm-side.js .adm-nav{position:fixed;z-index:150;left:auto;right:auto;top:0;width:min(340px,calc(100vw - 24px));max-height:calc(100dvh - 110px);
    padding:6px 10px 10px;border-radius:20px;overflow-y:auto}
  .adm-side.js .adm-nav > ul,.adm-side.js .adm-nav .adm-group + ul{display:flex;grid-template-columns:none}
  .adm-side.js .adm-nav::before{content:"";position:absolute;top:-6px;left:var(--adm-caret,50%);width:12px;height:12px;margin-left:-6px;transform:rotate(45deg);
    background:#0b2c5c;border-left:1px solid rgba(212,164,55,.4);border-top:1px solid rgba(212,164,55,.4)}
  .adm-side.js .adm-nav{overflow:visible}
  .adm-side.js .adm-nav .adm-scroll{max-height:calc(100dvh - 130px);overflow-y:auto;overscroll-behavior:contain;margin:0 -4px;padding:0 4px}
}
@media(min-width:601px) and (max-width:1099px){.tb-admin::after{content:"Yönetim"}}
@media(max-width:600px){.tb-admin{padding:0;justify-content:center;width:44px}}
@media(max-width:360px){.topbar-inner:has(.tb-admin) .brand span{display:none}}

/* ============================================================
   TEMA v14 — Panel standardı (yönetim ve kullanıcı paneli)
   1. Filtre ve çip satırları (.chips-x, .meta, .hist-meta): telefonda tek satır, yana kayar, kenarlar solar.
   2. Eylem satırı (.act-row): düğmeler aynı satırda, eşit genişlikte, satırı doldurur.
   3. Alan + düğme (.fx): tek satır; alan esner, düğme yazısı kadar.
   4. Tek düğme (.btn-full) ve kayıt kartlarındaki formlar: telefonda tam genişlik.
   5. Kayıt kartı (.rec): solda kimlik, çipler ve bilgiler; sağda işlemler. 900 px altında işlemler alta iner.
   ============================================================ */

/* 1. Kayan çip ve filtre satırları */
@media(max-width:720px){
  .chips-x,main .meta,main .hist-meta{display:flex;flex-wrap:nowrap!important;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;
    -webkit-overflow-scrolling:touch;margin-right:-16px;padding-right:16px;
    -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
  .chips-x::-webkit-scrollbar,main .meta::-webkit-scrollbar,main .hist-meta::-webkit-scrollbar{display:none}
  .chips-x > *,main .meta > *,main .hist-meta > *{flex:none;white-space:nowrap}
  main .hist-meta .chip:not(.chip-file){white-space:nowrap}
  .seg.chips-x{width:auto;max-width:none}
  .seg.chips-x button{flex:none;padding:8px 14px}
  .appr-views.chips-x{padding-block:3px}
}

/* 2–4. Eylemler */
.act-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px;align-items:stretch}
.act-row > form{display:flex;margin:0;min-width:0}
.act-row .btn{width:100%;justify-content:center;min-height:42px}
.fx{display:flex;gap:8px;align-items:stretch;min-width:0}
.fx > input,.fx > select{flex:1 1 auto;min-width:0;width:auto!important;margin:0!important;height:42px;padding:0 12px!important;font-size:14px}
.fx > .btn{flex:none;min-height:42px;white-space:nowrap}
@media(max-width:720px){
  .btn-full .btn{width:100%;justify-content:center;min-height:44px}
}

/* Dosya seçimi: tarayıcının ham düğmesi yerine kart görünümü */
.file-pick{display:flex;flex-direction:column;gap:6px;margin:0;padding:10px 12px;border:1.5px dashed #c8d5ea;border-radius:12px;background:#f8fbff;cursor:pointer;font-weight:600}
.file-pick > span{font-size:12.5px;color:var(--muted)}
.file-pick input[type=file]{width:100%;font-size:13px}
.file-pick:hover{border-color:var(--gold);background:#fffaf0}
main input[type=file]::file-selector-button{margin-right:10px;padding:8px 14px;border:1px solid #d7e0ef;border-radius:999px;background:#fff;color:var(--navy);
  font:inherit;font-weight:700;font-size:13px;cursor:pointer}
main input[type=file]::file-selector-button:hover{border-color:var(--gold);color:var(--gold2)}

/* 5. Kayıt kartı */
.rec-list{display:grid;gap:14px}
.rec{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:18px 22px;padding:18px 20px;border-radius:20px;background:#fff;
  border:1px solid var(--line);border-left:4px solid #dfe6f1;box-shadow:0 8px 22px rgba(8,31,66,.05);min-width:0}
.rec.rec-pending,.rec.rec-new{border-left-color:var(--gold)}
.rec.rec-approved{border-left-color:#3aa76d}
.rec.rec-rejected{border-left-color:#d92d20}
.rec-main{min-width:0}
.rec-head{display:flex;align-items:center;gap:12px;min-width:0}
.rec-av{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:13px;font-weight:800;font-size:17px;color:#7c5a10;
  background:linear-gradient(135deg,#fdf3d7,#f3d489);box-shadow:inset 0 0 0 1px #ecd9a8}
.rec-id{flex:1;min-width:0}
.rec-id h3{margin:0;font-size:16.5px;line-height:1.3;color:var(--navy);overflow-wrap:anywhere}
.rec-mail{display:block;font-size:13.5px;color:#43577b;overflow-wrap:anywhere}
.rec-amount{flex:none;font-family:'Playfair Display',serif;font-size:20px;color:var(--navy);white-space:nowrap}
.rec-chips{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.rec-chips .badge{white-space:nowrap}
.rec-chips code.k{align-self:center}
.rec .appr-facts{margin-top:12px}
main .rec-note{margin:10px 0 0;font-size:13.5px;text-align:left}
.rec-msg{margin-top:12px;padding:12px 14px;border-radius:14px;background:#f7f9fd;border:1px solid #eef2f8}
.rec-msg b{display:block;color:var(--navy);font-size:14.5px;overflow-wrap:anywhere}
main .rec-msg p{margin:6px 0 0;white-space:pre-wrap;font-size:14px;line-height:1.6;color:#334155;text-align:left;overflow-wrap:anywhere}
.rec-acts{display:flex;flex-direction:column;gap:12px;min-width:0;padding-left:20px;border-left:1px dashed #e3e9f3}
.rec-field{display:flex;flex-direction:column;gap:6px;margin:0;min-width:0}
.rec-field > label:not(.file-pick){margin:0;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.rec-field > small{font-size:12px;color:var(--muted)}
.rec-field > input[type=text]{height:42px;padding:0 12px;font-size:14px;margin:0}
.rec-field > .btn{justify-content:center;min-height:42px}
@media(max-width:900px){
  .rec{grid-template-columns:minmax(0,1fr);padding:16px}
  .rec-acts{padding:14px 0 0;border-left:0;border-top:1px dashed #e3e9f3}
  .rec-field > .btn{width:100%}
}
@media(min-width:901px) and (max-width:1280px){.rec{grid-template-columns:minmax(0,1fr) minmax(240px,280px)}}

/* Hediye: seçilebilir kullanıcı listesi */
.pick-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:14px 0 10px}
.pick-tools input[type=search]{flex:1 1 240px;min-width:0;margin:0}
.pick-tools .checkline{margin:0}
.pick-list{list-style:none;margin:0;padding:6px;max-height:360px;overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--line);border-radius:16px;background:#fafbfd;
  display:flex;flex-direction:column;gap:4px}
.pick-list li > label{display:flex;align-items:center;gap:12px;margin:0;padding:10px 12px;border-radius:12px;cursor:pointer;background:#fff;border:1px solid transparent;font-weight:500}
.pick-list li > label:hover{border-color:#e3e9f3}
.pick-list li > label:has(input:checked){border-color:#efd9a2;background:linear-gradient(135deg,#fffaf0,#fff)}
.pick-list .rec-av{width:36px;height:36px;font-size:15px;border-radius:11px}
.pick-id{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.3}
.pick-id b{color:var(--navy);font-size:14.5px;overflow-wrap:anywhere}
.pick-id small{color:var(--muted);font-size:12.5px;overflow-wrap:anywhere}
.pick-side{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:13px}
.pick-empty{padding:16px;color:var(--muted);text-align:center}
.gift-send{display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:12px;align-items:end;margin-top:16px}
.gift-send > label{margin:0!important}
.gift-send > .btn{min-height:46px;justify-content:center}
@media(max-width:720px){
  .gift-send{grid-template-columns:minmax(0,1fr)}
  .gift-send > .btn{width:100%}
  .pick-list{max-height:none}
  .pick-side{display:none}
}

/* Gösterge kutuları (yönetim özetleri, kredi): masaüstünde tek satır, telefonda 2×2; simge solda, sayı ve açıklama sağda. */
.steps.kpis{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))!important;gap:14px}
.kpis .step{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:16px 18px}
.kpis .step > b{grid-row:1/3;margin:0;width:44px;height:44px}
.kpis .step h3{margin:0;font-size:17px;line-height:1.25;overflow-wrap:anywhere}
.kpis .step p{margin:2px 0 0;font-size:13px;line-height:1.4;text-align:left}
@media(max-width:720px){
  .steps.kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
  .kpis .step{grid-template-columns:minmax(0,1fr);padding:14px}
  .kpis .step > b{grid-row:auto;width:36px;height:36px;font-size:15px;margin-bottom:8px}
  .kpis .step h3{font-size:15.5px}
  .kpis .step p{font-size:12px}
}
/* Hediye: alanlar tam genişlik */
.gift-send label input{display:block;width:100%;margin-top:7px}
/* Kayıt kartı bilgileri telefonda iki sütun */
.rec .appr-facts{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px 14px}
.pkg-form > input{font-size:14px!important}
/* Kart tabloları her genişlikte sıkı ızgara (bilgiler 2+ sütun); notlar sola yaslı */
table.tbl-cards.stack tr{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));column-gap:16px}
table.tbl-cards.stack td[colspan]{grid-column:1/-1}
@media(max-width:720px){main .compat-fill{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:8px}main .compat-fill > *{flex:none;white-space:nowrap}}
/* Geniş kayıt kartı (Üyeler): işlemler kartın altında tek şerit — Kredi | Rol | Şifre | Askıya al · Sil */
.rec.rec-wide{grid-template-columns:minmax(0,1fr)}
.rec-wide .rec-main{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 20px}
.rec-wide .rec-head{flex:1 1 280px}
.rec-wide .rec-chips{margin:0}
.rec-wide .rec-note{flex-basis:100%;margin:0}
.rec-wide .rec-acts{padding:14px 0 0;border-left:0;border-top:1px dashed #e3e9f3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(190px,auto);gap:14px 16px;align-items:start}
.rec-wide .rec-acts > .act-row{align-self:start;margin-top:21px}
@media(max-width:1280px){.rec-wide .rec-acts{grid-template-columns:repeat(2,minmax(0,1fr))}.rec-wide .rec-acts > .act-row{margin-top:0;align-self:end}}
@media(max-width:720px){.rec-wide .rec-acts{grid-template-columns:minmax(0,1fr)}.rec-wide .rec-main{display:block}.rec-wide .rec-chips{margin-top:12px}}
.adm-nav > .adm-scroll > .adm-group:first-child,.adm-nav > .adm-group:first-child{margin-top:4px}

/* ============================================================
   TEMA v15 — Seçim kutusu ve liste araması
   ============================================================ */
.ds-wrap{position:relative;display:block;min-width:0;width:100%}
.fx > .ds-wrap{flex:1 1 auto;width:auto}
.ds-native{position:absolute!important;inset:0;width:100%!important;height:100%!important;opacity:0!important;pointer-events:none!important;margin:0!important}
.ds-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:42px;padding:0 12px 0 14px;border-radius:12px;cursor:pointer;
  font:inherit;font-size:14.5px;font-weight:600;text-align:left;color:var(--ink);background:linear-gradient(180deg,#fcfdfe,#f4f7fc);border:1.5px solid #d9e2f0;
  box-shadow:inset 0 1px 2px rgba(8,31,66,.04);transition:border-color .2s,box-shadow .2s,background .2s}
.ds-btn:hover{border-color:#b7c9e6;background:#fff}
.ds-wrap.open .ds-btn,.ds-btn:focus-visible{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(212,164,55,.16)}
.ds-btn:disabled{opacity:.6;cursor:not-allowed}
.ds-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ds-chev{flex:none;width:17px;height:17px;color:var(--gold2);transition:transform .25s var(--ease)}
.ds-wrap.open .ds-chev{transform:rotate(180deg)}
.ds-list{position:fixed;z-index:400;margin:0;padding:6px;list-style:none;overflow-y:auto;overscroll-behavior:contain;border-radius:16px;background:#fff;
  border:1px solid rgba(212,164,55,.42);box-shadow:0 24px 50px -14px rgba(4,14,30,.4),0 6px 16px rgba(8,31,66,.12);animation:lpIn .16s var(--ease);
  font-family:Inter,'Inter Fallback',system-ui,sans-serif}
.ds-list.up{animation-name:lpInUp}
.ds-list:focus{outline:none}
.ds-list li{position:relative;display:flex;align-items:center;min-height:40px;padding:8px 34px 8px 12px;border-radius:10px;cursor:pointer;font-size:14.5px;font-weight:600;
  line-height:1.35;color:var(--navy)}
.ds-list li.act{background:#f3f6fb}
.ds-list li[aria-selected="true"]{background:linear-gradient(135deg,#fdf7e6,#fff);box-shadow:inset 0 0 0 1px #efd9a2;color:#5a3f06}
.ds-list li[aria-selected="true"]::after{content:"";position:absolute;right:12px;top:50%;width:6px;height:11px;margin-top:-7px;border:solid var(--gold2);border-width:0 2px 2px 0;transform:rotate(45deg)}
.ds-list li[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
@media (prefers-reduced-motion: reduce){.ds-list{animation:none}}

.list-search{position:relative;display:flex;align-items:center;margin:4px 0 14px}
.list-search > svg{position:absolute;left:14px;width:17px;height:17px;color:#8a9ab3;pointer-events:none}
.list-search input{width:100%;height:44px;margin:0;padding:0 70px 0 42px;border-radius:999px;font-size:14.5px}
.list-search:focus-within > svg{color:var(--gold2)}
.ls-count{position:absolute;right:16px;font-size:12.5px;font-weight:700;color:var(--muted)}
main .ls-empty{margin:4px 0 0;padding:22px;border:1.5px dashed var(--line);border-radius:16px;text-align:center;color:var(--muted)}
.rec[hidden],.appr-row[hidden],tr[hidden]{display:none!important}
/* Uzun seçenek adı seçim kutusunu ve bulunduğu ızgarayı genişletmesin */
.ds-wrap,.ds-btn{max-width:100%;min-width:0}
.dash-ready-grid > *,.upload-grid > *,.tpl-stage > *{min-width:0}

/* Güvenlik olayları: süzgeç tek satır ve aynı hizada; numaralı 10'lu sayfalama */
.sec-filter{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) auto;align-items:end;gap:10px}
.sec-filter label{min-width:0;margin:0!important;gap:6px;font-size:12px}
.sec-filter label > span{line-height:16px}
.sec-filter :is(input,.ds-btn){height:42px;min-height:42px;margin:0!important;padding-top:0;padding-bottom:0;font-size:13.5px;line-height:42px}
.sec-filter input[type=date]{padding:0 10px}
.sec-filter > .btn{height:42px;padding:0 18px;justify-content:center}
@media(max-width:1280px){.sec-filter{grid-template-columns:repeat(3,minmax(0,1fr))}.sec-filter > .btn{grid-column:auto}}
@media(max-width:600px){.sec-filter{grid-template-columns:repeat(2,minmax(0,1fr))}.sec-filter > .btn,.sec-filter > a.btn{grid-column:1/-1;width:100%}}
.ev-no{font-variant-numeric:tabular-nums;font-weight:800;color:var(--gold2);white-space:nowrap}
.sec-pages{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:16px}
.pg-nums{display:flex;align-items:center;gap:4px}
.pg-step,.pg-num{display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 14px;border-radius:999px;font-size:14px;font-weight:700;color:var(--navy);
  background:#fff;border:1px solid #d7e0ef;transition:border-color .2s,color .2s}
.pg-num{padding:0 10px}
a.pg-step:hover,a.pg-num:hover{text-decoration:none;border-color:var(--gold);color:var(--gold2)}
.pg-num.on{color:#fff;background:linear-gradient(135deg,#144a96,var(--navy));border-color:transparent}
.pg-step[aria-disabled="true"]{opacity:.45}
.pg-gap{padding:0 4px;color:var(--muted)}
#sec-log{scroll-margin-top:96px}
#sec-log.loading{opacity:.6;transition:opacity .15s}
@media(max-width:600px){.sec-pages{gap:6px}.pg-step{flex:1 1 40%}.pg-nums{order:-1;flex-basis:100%;justify-content:center}}
.sec-filter > label{display:flex!important;flex-direction:column;justify-content:flex-end;gap:6px;font-size:12px!important;letter-spacing:0!important}
.sec-filter > label > span{display:block;height:16px;line-height:16px}
main input[type=date]{font-family:inherit;font-variant-numeric:tabular-nums}
/* Seçim kutusunda uzun seçenek adı kesilmez, alt satıra iner */
.ds-text{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.35}
.ds-btn{height:auto;padding-top:9px;padding-bottom:9px}
.sec-filter .ds-btn{padding-top:0;padding-bottom:0}
.sec-filter .ds-text{white-space:nowrap;overflow:hidden}

/* Satır formları (güvenlik kuralı, olay süzgeci): aynı etiket, aynı alan yüksekliği, alt kenarlar tek hizada */
.sec-rule-form{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) minmax(0,2fr) auto;align-items:end;gap:10px}
.sec-rule-form > label{display:flex!important;flex-direction:column;justify-content:flex-end;gap:6px;min-width:0;margin:0!important;font-size:12px!important;letter-spacing:0!important}
.sec-rule-form > label > span{display:block;height:16px;line-height:16px}
.sec-rule-form :is(input:not([type=hidden]),.ds-btn){height:42px;min-height:42px;margin:0!important;padding-top:0;padding-bottom:0;font-size:13.5px}
.sec-rule-form .ds-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sec-rule-form > .btn{height:42px;padding:0 20px;justify-content:center}
@media(max-width:1280px){.sec-rule-form{grid-template-columns:repeat(2,minmax(0,1fr))}.sec-rule-form > .btn{grid-column:1/-1}}
@media(max-width:600px){.sec-rule-form{grid-template-columns:minmax(0,1fr)}.sec-rule-form > .btn{width:100%}}

/* Güvenlik göstergeleri: geniş ekranda tek satır, dar ekranda tek satırda yana kayar */
.sec-cards{display:grid!important;grid-template-columns:none!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:12px;margin-bottom:22px}
.sec-cards .sec-stat{display:flex;flex-direction:column;padding:14px 14px 13px}
.sec-cards .sec-stat small{min-height:2.6em;font-size:11px;line-height:1.3;letter-spacing:.05em}
.sec-cards .sec-stat b{margin-top:2px}
.sec-cards .sec-stat span{margin-top:auto;padding-top:4px;font-size:12.5px}
@media(max-width:1280px){
  .sec-cards{grid-auto-columns:minmax(150px,1fr);overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;scroll-snap-type:x proximity;
    padding:4px 2px 10px;margin-right:0;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
  .sec-cards::-webkit-scrollbar{display:none}
  .sec-cards .sec-stat{scroll-snap-align:start;box-shadow:0 6px 16px rgba(8,31,66,.06)}
}
@media(max-width:600px){.sec-cards{grid-auto-columns:minmax(140px,44%)}}

/* Kredi paketi satırı: ad, kredi, fiyat, Aktif, Kaydet ve Sil tek satırda */
td.pkg-td{display:flex;align-items:center;gap:8px}
td.pkg-td > form.pkg-form{flex:1 1 auto;min-width:0;margin:0}
td.pkg-td > form[data-confirm]{flex:none;margin:0;display:flex}
@media(max-width:900px){
  td.pkg-td{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
  td.pkg-td > form.pkg-form{grid-column:1/-1}
  td.pkg-td > form[data-confirm]{grid-column:2}
  td.pkg-td > form.pkg-form > .btn{grid-column:1}
}

/* ============================================================
   Hazır şablonlar: aranabilir, süzülebilir, sayfalı tablo; satır "Ayrıntı" ile açılır
   ============================================================ */
.tpl-panel{padding-bottom:20px}
.tpl-top h2{display:flex;align-items:center;gap:10px;margin:0 0 14px}
.tpl-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-bottom:14px}
.tpl-tools .tpl-search{flex:1 1 280px;margin:0}
.tpl-tools .appr-views button{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;background:#f3f6fb;border:1px solid var(--line);
  font:inherit;font-size:13.5px;font-weight:700;color:#43577b;cursor:pointer;white-space:nowrap}
.tpl-tools .appr-views button.on{background:#fff;border-color:#efd9a2;box-shadow:0 0 0 3px rgba(212,164,55,.18);color:var(--navy)}
.tpl-table{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.tpl-tr{display:grid;grid-template-columns:minmax(0,1fr) 130px 160px 170px 300px;gap:14px;align-items:center;padding:12px 16px}
.tpl-th{padding-top:11px;padding-bottom:11px;background:#f7f9fd;border-bottom:1px solid var(--line);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.tpl-item{border-bottom:1px solid #eef2f8;transition:background .2s}
.tpl-item:last-child{border-bottom:0}
.tpl-item:hover,.tpl-item.open{background:#fbfcfe}
.tpl-item.open{box-shadow:inset 3px 0 0 var(--gold)}
.tpl-item[hidden]{display:none}
.tpl-c-name{min-width:0}
.tpl-c-name b{display:block;color:var(--navy);font-size:14.5px;line-height:1.35;overflow-wrap:anywhere}
.tpl-c-name small{display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;margin-top:2px;color:var(--muted);font-size:12.5px}
.tpl-c-state{display:flex;flex-wrap:wrap;gap:6px}
.tpl-c-act .act-row .btn{min-height:36px;padding:0 10px;font-size:13px}
.tpl-more[aria-expanded="true"]{border-color:var(--gold);color:var(--gold2)}
.tpl-off .tpl-c-name b{color:#6b7a92}
.tpl-detail-row{display:none;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:22px;padding:4px 16px 18px}
.tpl-item.open .tpl-detail-row{display:grid}
html:not(.js-tpl) .tpl-detail-row{display:grid}
main .tpl-d-desc{margin:0 0 10px;color:#334155;text-align:left}
.tpl-d-motor{margin:0 0 10px}
.tpl-d-info .notes{margin-top:10px}
.tpl-motor{margin-top:12px}
.tpl-d-edit{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:#fff}
.tpl-d-edit h4{margin:0 0 4px;font-size:14px;color:var(--navy)}
.tpl-d-edit .file-pick{margin-top:10px}
@media(max-width:1280px){
  .tpl-tr{grid-template-columns:minmax(0,1fr) 120px 150px 280px}
  .tpl-c-compat,.tpl-th > :nth-child(4){display:none}
}
@media(max-width:900px){
  .tpl-table{border:0;background:none;overflow:visible}
  .tpl-th{display:none}
  .tpl-body{display:flex;flex-direction:column;gap:10px}
  .tpl-item{border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 6px 16px rgba(8,31,66,.05)}
  .tpl-item:last-child{border-bottom:1px solid var(--line)}
  .tpl-tr{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name name" "kind state" "act act";gap:10px;padding:14px}
  .tpl-c-name{grid-area:name}.tpl-c-kind{grid-area:kind}.tpl-c-state{grid-area:state;justify-content:flex-end}.tpl-c-act{grid-area:act}
  .tpl-c-name small{-webkit-line-clamp:2;line-clamp:2}
  .tpl-detail-row{grid-template-columns:minmax(0,1fr);padding:0 14px 14px}
}
button.pg-step,button.pg-num{font:inherit;font-size:14px;font-weight:700;cursor:pointer}button.pg-step:disabled{opacity:.45;cursor:default}
.tpl-tr{grid-template-columns:minmax(200px,1fr) 136px 112px 112px max-content}
.tpl-c-act .act-row{grid-auto-columns:max-content}
.tpl-c-act .act-row .btn{white-space:nowrap;padding:0 14px}
.tpl-c-state .badge,.tpl-c-kind .badge,.tpl-c-compat .badge{white-space:nowrap}
@media(max-width:1280px){.tpl-tr{grid-template-columns:minmax(180px,1fr) 136px 112px max-content}}
@media(max-width:900px){.tpl-tr{grid-template-columns:minmax(0,1fr) auto}.tpl-c-act .act-row{grid-auto-columns:minmax(0,1fr)}.tpl-c-act .act-row .btn{padding:0 8px}}
/* Tablo sığmadığında (dar ekran ya da kenar çubuğuyla daralan içerik) satırlar karta döner */
.tpl-panel{container-type:inline-size}
@container (max-width:860px){
  .tpl-table{border:0;background:none;overflow:visible}
  .tpl-th{display:none}
  .tpl-body{display:flex;flex-direction:column;gap:10px}
  .tpl-item{border:1px solid var(--line)!important;border-radius:18px;background:#fff;box-shadow:0 6px 16px rgba(8,31,66,.05)}
  .tpl-tr{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name name" "kind state" "act act";gap:10px;padding:14px}
  .tpl-c-name{grid-area:name}.tpl-c-kind{grid-area:kind}.tpl-c-state{grid-area:state;justify-content:flex-end}.tpl-c-act{grid-area:act}
  .tpl-c-compat{display:none}
  .tpl-c-act .act-row{grid-auto-columns:minmax(0,1fr)}
  .tpl-detail-row{grid-template-columns:minmax(0,1fr);padding:0 14px 14px}
}
@container (max-width:400px){.tpl-c-act .act-row .btn{font-size:12px;padding:0 4px;letter-spacing:-.01em}}

/* Şablon tablosu: sabit sütunlar (her satırda aynı hiza), aynı boyda kategori çipleri */
.tpl-tr{grid-template-columns:minmax(200px,1fr) 118px 118px 140px 286px!important}
.tpl-th > *{white-space:nowrap}
.tpl-c-act .act-row{grid-auto-columns:minmax(0,1fr)!important}
.tchip{display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;width:100%;height:30px;padding:0 10px;border-radius:999px;
  font-size:12.5px;font-weight:700;white-space:nowrap;border:1px solid transparent}
.tchip svg{flex:none;width:15px;height:15px}
.tc-article{color:#7c5a10;background:#fdf3d7;border-color:#efd9a2}
.tc-thesis{color:#174ea6;background:#e6eefc;border-color:#c7d8f6}
.tc-live{color:#05603a;background:#d9f7e6;border-color:#a6e7c2}
.tc-off{color:#5b6b82;background:#f1f4f9;border-color:#dfe6f1}
.tc-ok{color:#0f6b5c;background:#dcf5f0;border-color:#a7e3d6}
.tc-warn{color:#9a5b00;background:#fff4e5;border-color:#fbd9a5}
.tc-none{color:#5b6b82;background:#f1f4f9;border-color:#dfe6f1}
@media(max-width:1280px){.tpl-tr{grid-template-columns:minmax(180px,1fr) 118px 118px 270px!important}}
@container (max-width:860px){
  .tpl-tr{grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-areas:"name name name" "kind state compat" "act act act"!important}
  .tpl-c-compat{display:block!important;grid-area:compat}
  .tpl-c-state{justify-content:stretch}
}
/* Açıklama ve notlar iki yana yaslı */
main .tpl-d-desc,main .notes li{text-align:justify;-webkit-hyphens:auto;hyphens:auto}
main .notes{padding-left:22px}
.tpl-tr{grid-template-columns:minmax(200px,1fr) 132px 132px 132px 286px!important}
@media(max-width:1280px){.tpl-tr{grid-template-columns:minmax(180px,1fr) 132px 132px 270px!important}}


/* Grafik etiketleri hecelenmez ve yaslanmaz; yedi kartın son satırı boş kalmaz */
/* Şablon tablosu sütunları (sırası önemli: dar kap kuralı en sonda) */
.tpl-tr{grid-template-columns:minmax(180px,1fr) 128px 128px 128px 300px!important}
@media(max-width:1280px){.tpl-tr{grid-template-columns:minmax(160px,1fr) 128px 128px 300px!important}}
@container (max-width:860px){
  .tpl-tr{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .tchip{padding:0 6px;font-size:12px}
}
@container (max-width:340px){.tchip svg{display:none}}
.tpl-tr{grid-template-columns:minmax(180px,1fr) 128px 128px 128px 330px!important}
@media(max-width:1280px){.tpl-tr{grid-template-columns:minmax(160px,1fr) 128px 128px 330px!important}}
@container (max-width:860px){.tpl-tr{grid-template-columns:repeat(3,minmax(0,1fr))!important}}

/* PDF önizleme (vivePDF) */
.pdf-view{margin:10px 0 0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#f4f6fb;box-shadow:0 10px 26px rgba(8,31,66,.08)}
.pdf-view vive-pdf{display:block;width:100%;height:min(78vh,860px);min-height:420px}
@media(max-width:720px){.pdf-view vive-pdf{height:72vh;min-height:360px}.pdf-view{border-radius:14px}}
.pdf-view vive-pdf:not(:defined) > a{margin:18px}

/* ============================================================
   Genel bakış (yönetim) — dizgim dili: lacivert "etkinlik" paneli + altın alan grafiği; beyaz kutularda halka grafikler.
   Renkler: altın #e8c268 lacivert zeminde; açık zeminde lacivert #1f5bb3 / altın #b9821e (renk körlüğü denetiminden geçti).
   Durum renkleri yalnız üyelik durumunda ve etiketli.
   ============================================================ */
.ov{margin:0 0 22px}
.ov-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin:0 0 14px}
.ov-head h2{margin:0;font-family:'Playfair Display',serif;font-size:28px;color:var(--navy)}
.ov-hero{position:relative;overflow:hidden;isolation:isolate;padding:22px 22px 18px;border-radius:26px;color:#eef3fc;
  background:radial-gradient(520px 260px at 100% 0,rgba(212,164,55,.28) 0,transparent 62%),radial-gradient(560px 320px at 0 100%,rgba(20,74,150,.55) 0,transparent 62%),
             linear-gradient(155deg,#0b2c5c 0%,#081f42 58%,#061831 100%);
  border:1px solid rgba(212,164,55,.3);box-shadow:0 24px 50px -18px rgba(8,31,66,.5)}
.ov-glyph{position:absolute;z-index:-1;right:18px;top:-50px;font:800 220px/1 'Playfair Display',serif;color:rgba(243,212,137,.06);pointer-events:none}
.ov-hero-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.ov-kicker{margin:0;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#e8c268;text-align:left!important}
.ov-big{margin:6px 0 0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;text-align:left!important;-webkit-hyphens:manual!important;hyphens:manual!important}
.ov-big span{font:800 40px/1.05 'Playfair Display',serif;color:#fff;font-variant-numeric:tabular-nums}
.ov-big small{font-size:15px;font-weight:700;color:#c3d3ec}
.ov-more{flex:none;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:999px;color:#fff;font-size:13.5px;font-weight:700;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22)}
.ov-more:hover{text-decoration:none;border-color:var(--gold);color:#f3d489}
.ov-more svg{width:16px;height:16px}
.ov-plot{position:relative;height:250px;margin:14px -6px 4px}
.ov-plot svg{display:block;width:100%;height:100%;overflow:visible}
.ov-plot .ax{fill:#8fa3c2;font:600 11px Inter,'Inter Fallback',sans-serif}
.ov-plot .gl{stroke:rgba(255,255,255,.08);stroke-width:1}
.ov-plot .ln{fill:none;stroke:#e8c268;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.ov-plot .ar{stroke:none}
.ov-plot .xh{stroke:rgba(243,212,137,.55);stroke-width:1;stroke-dasharray:3 3}
.ov-plot .dot{fill:#081f42;stroke:#f3d489;stroke-width:2.5}
.ov-plot .hit{fill:transparent;cursor:crosshair}
.ov-ptip{position:absolute;top:0;z-index:2;pointer-events:none;padding:7px 11px;border-radius:11px;white-space:nowrap;font-size:12.5px;font-weight:700;color:#fff;
  background:rgba(4,14,30,.88);border:1px solid rgba(212,164,55,.45);box-shadow:0 10px 24px rgba(0,0,0,.35);transform:translate(-50%,-100%)}
.ov-ptip small{display:block;font-size:11px;font-weight:600;color:#9fb2cf}
.ov-tiles{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;margin-top:10px}
.ov-tile{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;padding:10px 12px 8px;border-radius:16px;cursor:pointer;text-align:left;font:inherit;color:#dbe5f4;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);transition:background .2s,border-color .2s,transform .2s var(--ease)}
.ov-tile:hover{background:rgba(255,255,255,.09);transform:translateY(-1px)}
.ov-tile.on{background:rgba(232,194,104,.14);border-color:rgba(232,194,104,.75);box-shadow:inset 0 0 0 1px rgba(232,194,104,.35)}
.ov-tile:focus-visible{outline:3px solid rgba(232,194,104,.8);outline-offset:2px}
.ov-t-label{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#9fb2cf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ov-tile.on .ov-t-label{color:#e8c268}
.ov-t-num{font:800 19px/1.2 'Playfair Display',serif;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
.ov-t-delta{font-size:11px;font-weight:700;color:#9fb2cf}
.ov-spark{width:100%;height:24px;margin-top:4px}
.ov-spark polyline{fill:none;stroke:rgba(159,178,207,.7);stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.ov-tile.on .ov-spark polyline{stroke:#e8c268}
@media(max-width:1280px){.ov-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:720px){
  .ov-hero{padding:18px 14px 14px;border-radius:22px}
  .ov-big span{font-size:32px}
  .ov-plot{height:190px;margin-inline:-4px}
  .ov-tiles{display:flex;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;margin-inline:-14px;padding:2px 14px 4px}
  .ov-tiles::-webkit-scrollbar{display:none}
  .ov-tile{flex:0 0 132px;scroll-snap-align:start}
  .ov-more span,.ov-more{font-size:12.5px}
}
.ov-mix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}
.ov-box{min-width:0;padding:18px 20px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 26px rgba(8,31,66,.06)}
.ov-box h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 14px;font-family:'Playfair Display',serif;font-size:19px;color:var(--navy)}
.ov-box h3 small{font-family:Inter,'Inter Fallback',sans-serif;font-size:12px;font-weight:600;color:var(--muted)}
.ov-dn{display:grid;grid-template-columns:150px minmax(0,1fr);gap:18px;align-items:center}
.ov-donut{width:150px;height:150px;transform:rotate(-90deg)}
.ov-donut circle{fill:none;stroke-width:13}
.dn-track{stroke:#eef2f8}
.dn-seg{stroke-linecap:butt;transition:stroke-width .2s;cursor:default}
.dn-seg:hover{stroke-width:16}
.ov-donut text{transform:rotate(90deg);transform-origin:55px 55px;text-anchor:middle}
.dn-num{font:800 22px 'Playfair Display',serif;fill:var(--navy)}
.dn-sub{font:700 9px Inter,'Inter Fallback',sans-serif;fill:#62728b;letter-spacing:.08em;text-transform:uppercase}
.c-ok{stroke:#2f9e6b;background:#2f9e6b}.c-warn{stroke:#d4a437;background:#d4a437}.c-bad{stroke:#d92d20;background:#d92d20}.c-off{stroke:#8a99b0;background:#8a99b0}
.c-gold{stroke:#b9821e;background:#b9821e}.c-navy{stroke:#1f5bb3;background:#1f5bb3}
.ov-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.ov-legend li{display:grid;grid-template-columns:10px minmax(0,1fr) auto 40px;align-items:center;gap:10px;font-size:14px;color:#334155;text-align:left!important}
.ov-legend i{width:10px;height:10px;border-radius:3px}
.ov-legend b{color:var(--navy);font-variant-numeric:tabular-nums}
.ov-legend small{text-align:right;color:var(--muted);font-size:12px}
.ov-rank{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.ov-rank li{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:12px;text-align:left!important}
.rk-no{font:italic 700 16px 'Playfair Display',serif;color:var(--gold2)}
.rk-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.rk-name{font-size:13.5px;font-weight:600;color:#334155;overflow-wrap:anywhere;line-height:1.35}
.rk-bar{height:7px;border-radius:999px;background:#eef2f8;overflow:hidden}
.rk-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#1f5bb3,#0d3a7d)}
.ov-rank b{font-variant-numeric:tabular-nums;color:var(--navy)}
.ov-flow{display:flex;flex-direction:column;gap:10px}
.fl-row{display:grid;grid-template-columns:90px minmax(0,1fr) auto;align-items:center;gap:12px;font-size:13.5px;color:#334155}
.fl-bar{height:12px;border-radius:999px;background:#eef2f8;overflow:hidden}
.fl-bar i{display:block;height:100%;border-radius:999px}
.fl-row b{font:800 16px 'Playfair Display',serif;color:var(--navy);font-variant-numeric:tabular-nums}
.ov-flow-list{list-style:none;margin:14px 0 0;padding:12px 0 0;border-top:1px dashed #e3e9f3;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px 16px}
.ov-flow-list li{display:flex;justify-content:space-between;gap:8px;font-size:13px;color:var(--muted)}
.ov-flow-list b{color:var(--navy)}
main .ch-empty{margin:0;color:var(--muted);text-align:left}
.ov-table{margin-top:14px}
.ov-table summary{cursor:pointer;font-weight:700;color:var(--navy)}
.ov-table .table-scroll{margin-top:10px}
.ch-tip{position:fixed;z-index:500;pointer-events:none;padding:6px 10px;border-radius:9px;background:var(--navy);color:#fff;font-size:12.5px;font-weight:700;
  box-shadow:0 10px 24px rgba(4,14,30,.3);border:1px solid rgba(212,164,55,.4);white-space:nowrap;transform:translate(-50%,calc(-100% - 10px))}
@media(max-width:900px){.ov-mix{grid-template-columns:minmax(0,1fr)}}
@media(max-width:420px){.ov-dn{grid-template-columns:minmax(0,1fr);justify-items:center}.ov-legend{width:100%}}
@media (prefers-reduced-motion: reduce){.ov-tile,.dn-seg{transition:none}}
.ls-pages[hidden]{display:none}
.ov-t-label{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25;min-height:2.5em}
.ov-ptip small{margin-bottom:1px}

/* Kayıt tabloları (güvenlik olayları, hediye geçmişi, dönüşümler…): her genişlikte tablo; dar ekranda yana kayar, satırlar tek satır */
.log-scroll{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:16px;background:#fff;scrollbar-width:thin;scrollbar-color:#c9d4e6 transparent}
table.tbl.tbl-log{display:table;width:100%;min-width:max-content;margin:0}
table.tbl-log th,table.tbl-log td{white-space:nowrap;overflow-wrap:normal;word-break:normal;min-width:0;padding:11px 14px;vertical-align:middle}
table.tbl-log td small{display:block}
table.tbl-log td:has(> small:only-child){white-space:normal;min-width:220px}
table.tbl-log thead th{position:sticky;top:0;background:#f7f9fd}
table.tbl-log tbody tr:nth-child(even){background:#fbfcfe}
.ov-head .chips-x{margin-right:0;padding-right:0;min-width:0;max-width:100%}
table.tbl-log :is(th,td){position:static}
/* Hediye alıcı listesi sayfalı: kutu sınırı yok, liste 10 kişilik */
.pick-list{max-height:none;overflow:visible}
.pick-list li[hidden]{display:none}
/* Yönetim dışı sayfalarda yönetim menüsü yalnız dar ekranda, üst bardaki düğmeyle açılır */
.adm-float{display:none}
@media(max-width:1099px){.adm-float{display:block;position:static;height:0;margin:0}}
.tb-admin svg{width:19px;height:19px}

/* Ana sayfa sayaçları: tek beyaz şerit, altın ayraçlar; sayı Playfair lacivert, birim altın italik */
.counters{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 30px;padding:8px;border-radius:26px;background:#fff;
  border:1px solid var(--line);box-shadow:0 14px 40px rgba(8,31,66,.08)}
.counters::before{content:"";position:absolute;left:28px;right:28px;top:-1px;height:3px;border-radius:0 0 3px 3px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.cn-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0;padding:22px 14px 20px;text-align:center}
.cn-item + .cn-item::before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:1px;background:linear-gradient(180deg,transparent,#e8c268,transparent)}
main .counters p{margin:0;text-align:center;-webkit-hyphens:manual;hyphens:manual}
.cn-num{display:flex;align-items:baseline;justify-content:center;gap:8px;line-height:1}
.cn-num span{font:800 44px/1 'Playfair Display',serif;color:var(--navy);font-variant-numeric:tabular-nums}
.cn-num em{font:italic 700 24px/1 'Playfair Display',serif;color:var(--gold2)}
main .counters .cn-lbl{font-size:14px;line-height:1.45;color:var(--muted);max-width:230px}
@media(max-width:900px){
  .counters{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cn-item + .cn-item::before{display:none}
  .cn-item:nth-child(even)::before{display:block;content:"";position:absolute;left:0;top:22%;bottom:22%;width:1px;background:linear-gradient(180deg,transparent,#e8c268,transparent)}
  .cn-item:nth-child(n+3)::after{content:"";position:absolute;top:0;left:18%;right:18%;height:1px;background:linear-gradient(90deg,transparent,#e8c268,transparent)}
}
@media(max-width:600px){
  .counters{border-radius:22px;padding:4px}
  .cn-item{padding:18px 8px 16px}
  .cn-num span{font-size:34px}
  .cn-num em{font-size:19px}
  main .counters .cn-lbl{font-size:12.5px}
}

/* Giriş kutusu: iOS'ta yer tutucu dikey ortada; 16px yazı ile odaklanınca sayfa yakınlaşmaz */
.lp .lp-in input{-webkit-appearance:none;appearance:none;height:44px;line-height:normal;padding:0 12px 0 38px;font-size:16px}
.lp .lp-in input::placeholder{line-height:normal}
.lp-submit{min-height:44px;height:44px}

/* Genel Bakış bildirim özeti: aynı başlıklar tek satırda, en fazla dört satır */
.nt-panel{padding:20px 22px}
.nt-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.nt-head h2{display:flex;align-items:center;gap:10px;margin:0}
main .nt-none{margin:0;color:var(--muted);text-align:left}
.nt-list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.nt-row + .nt-row{border-top:1px solid #eef2f8}
.nt-row a{display:flex;align-items:center;gap:12px;min-height:54px;padding:9px 14px;color:var(--ink)}
.nt-row a:hover{text-decoration:none;background:#f7f9fd}
.nt-dot{flex:none;width:9px;height:9px;border-radius:50%;background:#c3cfe0}
.nt-row.unread .nt-dot{background:var(--gold);box-shadow:0 0 0 3px rgba(212,164,55,.2)}
.nt-row.unread.sev-critical .nt-dot{background:#d92d20;box-shadow:0 0 0 3px rgba(217,45,32,.2)}
.nt-row.unread.sev-warning .nt-dot{background:#d97706}
.nt-body{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.35}
.nt-body b{font-size:14.5px;color:var(--navy)}
.nt-body small{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nt-count{flex:none;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:800;color:#5b6b82;background:#f1f4f9;white-space:nowrap}
.nt-row.unread .nt-count{color:#7c5a10;background:#fdf3d7}

/* Kredi paketleri: başlık ve satırlar aynı sütun ızgarası (kayma yok); telefonda Kaydet ve Sil aynı satırda */
table.pkg-table,table.pkg-table tbody{display:block;width:100%}
table.pkg-table thead tr,table.pkg-table td.pkg-td{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) 92px minmax(0,1.1fr);gap:10px;align-items:center}
table.pkg-table thead tr{padding:0 12px}
table.pkg-table thead th{padding:10px 0;border:0}
table.pkg-table thead{display:block;border-bottom:2px solid var(--line)}
table.pkg-table tbody tr{display:block}
table.pkg-table td.pkg-td{padding:12px;border-bottom:1px solid var(--line)}
td.pkg-td > form.pkg-form{display:contents!important}
td.pkg-td > form.pkg-form > input{width:100%;min-width:0;height:42px;margin:0;flex:none!important}
td.pkg-td > form.pkg-form > label{display:flex;align-items:center;gap:6px;margin:0;white-space:nowrap}
td.pkg-td .pf-row-acts,td.pkg-td > form.pkg-form > .btn,td.pkg-td > form[data-confirm]{min-width:0}
td.pkg-td > form.pkg-form > .btn{grid-column:5;grid-row:1;justify-self:start;width:calc(50% - 5px);justify-content:center;min-height:40px}
td.pkg-td > form[data-confirm]{grid-column:5;grid-row:1;justify-self:end;width:calc(50% - 5px);display:flex}
td.pkg-td > form[data-confirm] .btn{width:100%;justify-content:center;min-height:40px}
.pkg-new{display:grid!important;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) 92px minmax(0,1.1fr);gap:10px!important;align-items:center;padding:0 12px}
.pkg-new > input{width:100%;min-width:0;height:42px;margin:0;flex:none!important}
.pkg-new > .btn{grid-column:4/-1;justify-content:center;min-height:42px}
@media(max-width:900px){
  table.pkg-table thead{display:none}
  table.pkg-table tbody{display:flex;flex-direction:column;gap:10px}
  table.pkg-table td.pkg-td{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:14px;border:1px solid var(--line);border-radius:16px;background:#fff}
  td.pkg-td > form.pkg-form > input[name=name]{grid-column:1/-1}
  td.pkg-td > form.pkg-form > label{grid-column:1/-1;min-height:36px}
  td.pkg-td > form.pkg-form > .btn{grid-column:1;grid-row:auto;width:100%;justify-self:stretch}
  td.pkg-td > form[data-confirm]{grid-column:2;grid-row:auto;width:100%;justify-self:stretch;margin:0!important}
  .pkg-new{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:0}
  .pkg-new > input[name=name]{grid-column:1/-1}
  .pkg-new > .btn{grid-column:1/-1}
}

/* Hediye alıcıları: tablo; dar ekranda tablo kutusu içinde yana kayar, satırlar tek satır */
.gift-scroll{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:16px;background:#fff}
table.gift-table{width:100%;min-width:620px;margin:0}
table.gift-table th,table.gift-table td{white-space:nowrap;padding:10px 14px;vertical-align:middle}
table.gift-table thead th{background:#f7f9fd}
table.gift-table tbody tr[hidden]{display:none}
table.gift-table tbody tr:has(.gift-user:checked){background:#fffaf0}
table.gift-table td label{margin:0;cursor:pointer;font-weight:500}
.gt-cb{width:44px;text-align:center}
.gt-num{text-align:right}
.table-scroll table.pkg-table{min-width:0}.table-scroll:has(table.pkg-table){overflow:visible}

/* Bildirim özeti: alt satır kesilmez, alt satıra iner */
.nt-body small{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}

/* dizgim ipucu: lacivert kutu, altın kenar, ok ucu; fareyle ve klavye odağıyla açılır */
.dz-tip{position:relative;display:flex;min-width:0;outline:none}
.dz-tip > .btn{width:100%;justify-content:center;min-height:42px;pointer-events:none}
.dz-tip > .btn[disabled]{opacity:.45;filter:grayscale(.3);cursor:not-allowed}
.dz-tip{cursor:not-allowed}
.dz-tip::after,.dz-tip::before{position:absolute;left:50%;opacity:0;pointer-events:none;transition:opacity .18s var(--ease),transform .18s var(--ease);z-index:30}
.dz-tip::after{content:attr(data-tip);bottom:calc(100% + 10px);width:max-content;max-width:min(280px,80vw);padding:9px 12px;border-radius:11px;
  font-size:12.5px;font-weight:600;line-height:1.45;text-align:left;white-space:normal;color:#eef3fc;background:var(--navy);
  border:1px solid rgba(212,164,55,.5);box-shadow:0 14px 30px rgba(4,14,30,.35);transform:translate(-50%,4px)}
.dz-tip::before{content:"";bottom:calc(100% + 4px);width:10px;height:10px;margin-left:-5px;background:var(--navy);border-right:1px solid rgba(212,164,55,.5);
  border-bottom:1px solid rgba(212,164,55,.5);transform:rotate(45deg) translate(2px,2px)}
.dz-tip:hover::after,.dz-tip:focus::after,.dz-tip:hover::before,.dz-tip:focus::before{opacity:1}
.dz-tip:hover::after,.dz-tip:focus::after{transform:translate(-50%,0)}
.dz-tip:focus-visible{box-shadow:0 0 0 3px rgba(212,164,55,.55);border-radius:999px}
.act-locked .dz-tip:last-child::after{left:auto;right:0;transform:translate(0,4px)}
.act-locked .dz-tip:last-child:hover::after,.act-locked .dz-tip:last-child:focus::after{transform:none}

/* Güvenlik ayarları: gruplu kartlar, satırda solda açıklama sağda denetim; anahtar biçimli onay kutuları */
.st-form{display:flex;flex-direction:column;gap:14px;margin-top:6px}
.st-group{margin:0;padding:6px 16px 4px;border:1px solid var(--line);border-radius:18px;background:#fbfcfe;min-width:0}
.st-group legend{display:flex;align-items:center;gap:8px;padding:0 8px;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gold2)}
.st-group legend svg{width:16px;height:16px}
.st-row{display:flex;align-items:center;justify-content:space-between;gap:12px 18px;margin:0!important;padding:12px 0;font-weight:500}
.st-row + .st-row{border-top:1px dashed #e3e9f3}
.st-tx{display:flex;flex-direction:column;gap:2px;min-width:0;margin:0!important;cursor:pointer}
.st-tx b{font-size:14.5px;color:var(--navy);line-height:1.35}
.st-tx small{font-size:12.5px;color:var(--muted);line-height:1.45}
.st-num{flex:none;width:130px!important;height:42px;margin:0!important;text-align:right;font-variant-numeric:tabular-nums}
.st-stack{flex-direction:column;align-items:stretch}
.st-stack > input,.st-stack > textarea{width:100%;margin:0!important}
.st-stack > textarea{font-family:inherit;font-size:14px;min-height:96px}
.st-toggle{cursor:pointer}
input.st-sw{-webkit-appearance:none;appearance:none;flex:none;position:relative;width:48px!important;height:28px!important;margin:0;border-radius:999px;cursor:pointer;
  background:#c9d4e6;border:0;transition:background .2s var(--ease)}
input.st-sw::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(8,31,66,.25);transition:transform .22s var(--ease)}
input.st-sw:checked{background:linear-gradient(135deg,#e8c268,var(--gold) 55%,var(--gold2))}
input.st-sw:checked::after{transform:translateX(20px)}
input.st-sw:focus-visible{outline:3px solid rgba(212,164,55,.6);outline-offset:2px}
.st-save{margin:4px 0 0}
.st-save .btn{min-height:46px;justify-content:center}
@media(max-width:600px){
  .st-group{padding:4px 12px 2px}
  .st-row:not(.st-toggle):not(.st-stack){flex-direction:column;align-items:stretch}
  .st-num{width:100%!important;text-align:left}
  .st-save .btn{width:100%}
}
@media (prefers-reduced-motion: reduce){input.st-sw,input.st-sw::after,.dz-tip::after,.dz-tip::before{transition:none}}

/* Paket aktif/pasif: dizgim anahtarı + durum yazısı */
td.pkg-td > form.pkg-form > label.pkg-active{display:inline-flex;align-items:center;gap:10px;margin:0;cursor:pointer;font-size:14px;font-weight:700;white-space:nowrap}
.pkg-active .pa-on{color:#7c5a10}.pkg-active .pa-off{color:var(--muted);display:none}
.pkg-active:not(:has(input:checked)) .pa-on{display:none}
.pkg-active:not(:has(input:checked)) .pa-off{display:inline}
/* Telefonda kredi ve fiyat alanlarının ne olduğu kutunun içinde yazar */
@media(max-width:900px){
  td.pkg-td > form.pkg-form > label.pkg-active{grid-column:1/-1;justify-content:space-between;min-height:44px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:#fbfcfe}
  td.pkg-td > form.pkg-form > label.pkg-active .st-sw{order:2}
}
td.pkg-td > form.pkg-form > label.pkg-f{position:relative;display:block;margin:0;min-width:0}
label.pkg-f > input{width:100%;height:42px;margin:0;padding-right:58px}
label.pkg-f > span{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);pointer-events:none;display:none}
@media(max-width:900px){label.pkg-f > span{display:block}}
@media(min-width:901px){label.pkg-f > input{padding-right:12px}}
@media(min-width:901px){
  table.pkg-table thead tr,table.pkg-table td.pkg-td,.pkg-new{grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) 112px 196px}
  td.pkg-td > form.pkg-form > .btn,td.pkg-td > form[data-confirm]{width:92px}
}

/* Güvenlik: Sağlık üstte dört kart, Ayarlar altında tam genişlik */
.sec-grid.sec-stack{grid-template-columns:minmax(0,1fr)}
.hc-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.hc{position:relative;display:flex;flex-direction:column;gap:3px;min-width:0;padding:14px 16px 16px;border-radius:18px;background:#fff;border:1px solid var(--line);
  box-shadow:0 6px 18px rgba(8,31,66,.05);overflow:hidden}
.hc::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:#c9d6ea}
.hc.h-ok::before{background:#2f9e6b}.hc.h-warn::before{background:var(--gold)}.hc.h-bad::before{background:#d92d20}
.hc-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.hc-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;color:#144a96;background:#eef3fb}
.hc-ic svg{width:18px;height:18px}
.hc-st{padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:800;color:#5b6b82;background:#f1f4f9}
.hc.h-ok .hc-st{color:#05603a;background:#d9f7e6}.hc.h-warn .hc-st{color:#7c5a10;background:#fdf3d7}.hc.h-bad .hc-st{color:#b42318;background:#ffe4e0}
.hc-k{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.hc-v{font-size:16px;line-height:1.3;color:var(--navy);overflow-wrap:anywhere}
main .hc p{margin:4px 0 0;font-size:12.5px;line-height:1.5;color:var(--muted);text-align:left;-webkit-hyphens:manual;hyphens:manual}
.st-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.st-form > input[type=hidden]{display:none}
.st-form > .st-save{grid-column:1/-1}
@media(max-width:1280px){.hc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.st-form{grid-template-columns:minmax(0,1fr)}}
@media(max-width:420px){.hc-grid{grid-template-columns:minmax(0,1fr)}}
table.tbl.gift-table{display:table!important;max-width:none;overflow:visible}
/* Hediye tablosu: uzun ad ve e-posta hücre içinde alt satıra iner; sütunlar tek kaydırıcıyla görünür */
table.gift-table td:nth-child(2),table.gift-table td:nth-child(3){white-space:normal;overflow-wrap:anywhere;min-width:150px;max-width:240px;line-height:1.35}
@media(max-width:600px){table.gift-table{min-width:560px}}
/* dizgim ipucu artık JS ile konumlanır (ekran dışına taşmaz); eski CSS balonu kapalı */
.dz-tip::after,.dz-tip::before{display:none!important}
.dz-tipbox{position:fixed;z-index:600;max-width:min(300px,calc(100vw - 24px));padding:10px 13px;border-radius:12px;font-size:12.5px;font-weight:600;line-height:1.5;
  color:#eef3fc;background:var(--navy);border:1px solid rgba(212,164,55,.5);box-shadow:0 14px 30px rgba(4,14,30,.35);pointer-events:none;animation:lpIn .16s var(--ease)}
.dz-tipbox[hidden]{display:none}
.dz-tipbox i{position:absolute;width:10px;height:10px;margin-left:-5px;background:var(--navy);transform:rotate(45deg)}
.dz-tipbox:not(.below) i{bottom:-6px;border-right:1px solid rgba(212,164,55,.5);border-bottom:1px solid rgba(212,164,55,.5)}
.dz-tipbox.below i{top:-6px;border-left:1px solid rgba(212,164,55,.5);border-top:1px solid rgba(212,164,55,.5)}
@media (prefers-reduced-motion: reduce){.dz-tipbox{animation:none}}
/* Hediye tablosu rol çipleri aynı genişlikte */
table.gift-table td .badge{display:inline-flex;justify-content:center;min-width:132px;white-space:nowrap}