/* Turab Yapı Operasyon - tasarım sistemi (token'lar, yazı tipi, butonlar, formlar, giriş ve eski yükleme sayfası).
   Çalışma ekranına özel stiller: workbook.css. Yazı tipi: Inter (SIL OFL 1.1), kendi sunucumuzdan. */

@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;
  src:url("/static/fonts/inter-latin-ext-wght-normal.woff2") format("woff2-variations");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter Variable";font-style:normal;font-display:swap;font-weight:100 900;
  src:url("/static/fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  color-scheme:light;
  --font:"Inter Variable",Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;

  /* nötr yüzeyler */
  --bg:#f6f7f9;
  --surface:#ffffff;
  --surface-2:#f9fafb;
  --surface-3:#f3f4f6;
  --border:#e5e7eb;
  --border-strong:#d1d5db;
  --text:#111827;
  --text-2:#374151;
  --muted:#6b7280;

  /* tek vurgu rengi: derin indigo */
  --accent:#4338ca;
  --accent-hover:#3730a3;
  --accent-soft:#eef2ff;
  --accent-soft-2:#e0e7ff;
  --accent-text:#4338ca;
  --accent-ring:rgba(67,56,202,.30);
  --on-accent:#ffffff;

  /* durum renkleri */
  --danger:#dc2626;
  --danger-text:#b91c1c;
  --danger-soft:#fef2f2;
  --danger-soft-2:#fee2e2;
  --danger-border:#fecaca;
  --success:#16a34a;
  --success-text:#15803d;
  --success-soft:#f0fdf4;
  --success-soft-2:#dcfce7;

  --row-hover:#f5f6ff;
  --row-sel:#e8ebff;

  /* köşe, gölge, boşluk */
  --r-sm:6px;--r-md:8px;--r-lg:12px;--r-xl:16px;
  --sh-1:0 1px 2px rgba(16,24,40,.05);
  --sh-2:0 1px 3px rgba(16,24,40,.08),0 1px 2px rgba(16,24,40,.04);
  --sh-3:0 4px 12px -2px rgba(16,24,40,.10),0 2px 6px -2px rgba(16,24,40,.06);
  --sh-pop:0 16px 40px -8px rgba(16,24,40,.22),0 4px 12px -2px rgba(16,24,40,.08);
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --dur:.18s;
}
@media (prefers-color-scheme:dark){
  :root{
    color-scheme:dark;
    --bg:#0b0d12;
    --surface:#12151c;
    --surface-2:#161a23;
    --surface-3:#1d222d;
    --border:#252b37;
    --border-strong:#343c4b;
    --text:#e9ebf0;
    --text-2:#c4c9d4;
    --muted:#98a1b3;
    --accent:#5b5fe6;
    --accent-hover:#6d71ee;
    --accent-soft:rgba(129,140,248,.14);
    --accent-soft-2:rgba(129,140,248,.22);
    --accent-text:#a5b4fc;
    --accent-ring:rgba(129,140,248,.45);
    --danger:#f87171;
    --danger-text:#fca5a5;
    --danger-soft:rgba(248,113,113,.10);
    --danger-soft-2:rgba(248,113,113,.18);
    --danger-border:rgba(248,113,113,.35);
    --success:#4ade80;
    --success-text:#86efac;
    --success-soft:rgba(74,222,128,.10);
    --success-soft-2:rgba(74,222,128,.18);
    --row-hover:rgba(129,140,248,.08);
    --row-sel:rgba(129,140,248,.18);
    --sh-1:0 1px 2px rgba(0,0,0,.4);
    --sh-2:0 1px 3px rgba(0,0,0,.5);
    --sh-3:0 6px 16px -4px rgba(0,0,0,.6);
    --sh-pop:0 20px 48px -8px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.04);
  }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:14px;line-height:1.5;background:var(--bg);color:var(--text);
  font-feature-settings:"cv11","ss03";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.01em;color:var(--text)}
a{color:var(--accent-text)}
small{color:var(--muted)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
[hidden]{display:none}

/* ikon: Lucide tarzı, currentColor çizgi */
.ico{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.ico.lg{width:20px;height:20px}

/* ---------- butonlar ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);height:34px;padding:0 14px;font:inherit;font-size:13.5px;font-weight:500;line-height:1;
  border-radius:var(--r-md);border:1px solid var(--border-strong);background:var(--surface);color:var(--text);cursor:pointer;text-decoration:none;white-space:nowrap;
  box-shadow:var(--sh-1);transition:background-color var(--dur) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform .06s}
.btn:hover{background:var(--surface-3);border-color:var(--border-strong)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring);border-color:var(--accent)}
.btn:disabled{opacity:.55;cursor:progress;transform:none}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:var(--sh-1),inset 0 1px 0 rgba(255,255,255,.14)}
.btn.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn.ghost{background:var(--surface)}
.btn.danger{background:var(--danger-text);border-color:var(--danger-text);color:#fff}
.btn.danger:hover{filter:brightness(.92)}
.btn.lg{height:40px;padding:0 20px;font-size:14px}
.btn.block{width:100%}
.btn.link{background:none;border-color:transparent;box-shadow:none;color:var(--text-2)}
.btn.link:hover{background:var(--surface-3)}
.btn .ico{width:16px;height:16px}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border-radius:var(--r-md);border:1px solid transparent;background:none;color:var(--text-2);cursor:pointer;transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.icon-btn:hover{background:var(--surface-3);color:var(--text)}
.icon-btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring)}

/* ---------- form ---------- */
.field{margin:0 0 var(--sp-4)}
.field-row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);margin-bottom:6px}
label,.label{display:block;font-size:13px;font-weight:500;color:var(--text-2)}
.field-row label{margin:0}
.input,input[type=text],input[type=password],input[type=search],input[type=number]{font:inherit;font-size:14px;color:var(--text)}
.input{display:block;width:100%;height:40px;padding:0 12px;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--r-md);box-shadow:var(--sh-1);
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.input::placeholder{color:var(--muted)}
.input:hover{border-color:var(--muted)}
.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring)}
.input[aria-invalid=true]{border-color:var(--danger)}
.input[aria-invalid=true]:focus{box-shadow:0 0 0 3px var(--danger-border)}
.input.file{height:auto;padding:6px;cursor:pointer}
.input.file::file-selector-button{font:inherit;font-size:13px;font-weight:500;margin-right:12px;padding:6px 12px;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface-3);color:var(--text);cursor:pointer}
.input.file::file-selector-button:hover{background:var(--surface-2)}

.alert{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:var(--r-md);font-size:13.5px;line-height:1.45;margin-bottom:var(--sp-4);border:1px solid}
.alert .ico{margin-top:2px}
.alert.err{background:var(--danger-soft);border-color:var(--danger-border);color:var(--danger-text)}

/* ---------- marka ---------- */
.logo-mark{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;background:linear-gradient(145deg,#5b5fe6,#3730a3);color:#fff;box-shadow:0 1px 2px rgba(55,48,163,.35),inset 0 1px 0 rgba(255,255,255,.2);flex:none}
.logo-mark .ico{width:18px;height:18px}

/* ---------- giriş ---------- */
.auth{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:var(--sp-5) var(--sp-4);
  background:radial-gradient(900px 420px at 50% -120px,var(--accent-soft-2),transparent 70%),var(--bg)}
.auth-card{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--sh-3);padding:var(--sp-6)}
.auth-brand{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--sp-3);margin-bottom:var(--sp-5)}
.auth-brand .logo-mark{width:44px;height:44px;border-radius:12px}
.auth-brand .logo-mark .ico{width:24px;height:24px}
.auth-brand h1{font-size:20px}
.auth-brand p{margin:2px 0 0;color:var(--muted);font-size:13.5px}
.cap-q{display:inline-flex;align-items:center;padding:2px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent-text);font-weight:600;font-size:13px;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.auth-foot{margin:var(--sp-5) 0 0;text-align:center;color:var(--muted);font-size:12.5px}

/* ---------- eski yükleme sayfası ---------- */
.topnav{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:var(--sp-4);padding:10px var(--sp-5);background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.topnav .brand{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px;color:var(--text);text-decoration:none}
.topnav nav{display:flex;gap:2px;margin-left:var(--sp-3)}
.topnav nav a{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:var(--r-md);color:var(--text-2);text-decoration:none;font-weight:500;font-size:13.5px}
.topnav nav a:hover{background:var(--surface-3);color:var(--text)}
.topnav form{margin:0 0 0 auto}
.page{max-width:900px;margin:var(--sp-5) auto var(--sp-6);padding:0 var(--sp-4)}
.page-title{margin:0 0 var(--sp-1);font-size:20px}
.page-sub{margin:0 0 var(--sp-5);color:var(--muted)}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:var(--sp-5);margin-bottom:var(--sp-4)}
.card h2{font-size:16px;margin-bottom:var(--sp-4)}
.card h3{font-size:14px;margin:var(--sp-5) 0 var(--sp-2)}
.card p{margin:var(--sp-3) 0 0}
.upload-grid{display:grid;gap:var(--sp-4);grid-template-columns:1fr}
@media (min-width:700px){.upload-grid{grid-template-columns:1fr 1fr}}
.upload-grid .field{margin:0}
.upload-grid label{margin-bottom:6px}
.form-foot{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-3) var(--sp-4);margin-top:var(--sp-5)}
.stats{display:grid;gap:var(--sp-3);grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.stat{padding:var(--sp-4);border-radius:var(--r-md);border:1px solid var(--border);background:var(--surface-2);color:var(--muted);font-size:13px}
.stat b{display:block;font-size:26px;line-height:1.2;font-weight:650;color:var(--text);font-variant-numeric:tabular-nums;margin-bottom:2px}
.stat.neu{background:var(--accent-soft);border-color:var(--accent-soft-2)}.stat.neu b{color:var(--accent-text)}
.stat.ok{background:var(--success-soft);border-color:var(--success-soft-2)}.stat.ok b{color:var(--success-text)}
.stat.bad{background:var(--danger-soft);border-color:var(--danger-border)}.stat.bad b{color:var(--danger-text)}
.scroll{max-height:380px;overflow:auto;border:1px solid var(--border);border-radius:var(--r-md);margin-top:var(--sp-2)}
.data-table{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px;font-variant-numeric:tabular-nums}
.data-table th,.data-table td{text-align:left;padding:8px 12px;border-bottom:1px solid var(--border)}
.data-table th{position:sticky;top:0;background:var(--surface-3);color:var(--text-2);font-weight:600;font-size:12.5px}
.data-table tr:last-child td{border-bottom:0}
.data-table tbody tr:hover td{background:var(--row-hover)}
.note{color:var(--muted);font-size:13px}

@media (prefers-reduced-motion:reduce){.btn,.input,.icon-btn{transition:none}.btn:active{transform:none}}