/* Kim Ne Yapıyor · KLASİK görünüm (eski KİM paneli, Eylül 2026)
   Etkinleşme: <html data-gorunum="klasik" data-theme="light|dark">. Görünüm "yeni" iken bu dosyanın hiçbir kuralı eşleşmez.
   Bağlama: app.css ve sayfaya özgü stillerden (pano.css, mecra.css) SONRA, <head>'in en sonunda yüklenir.
   Ortak alanlar kendi stilini <main> içinde yükler; bu yüzden bileşen kuralları :root[data-gorunum="klasik"] önekiyle
   (özgüllük 0,3,0) yazılır ve sıradan bağımsız kazanır.
   İki kabuk desteklenir:
     A) Yalnız CSS: mevcut .app-header masaüstünde sol menüye dönüşür (gruplar ve alt öğeler yok).
     B) Klasik kabuk parçası (klasik-kabuk.ts): .k-side + .k-top; gruplu sol menü, kırıntı, arama, "Yeni görev".
   Kurallar: docs/tasarim-ilkeleri.md (kutunun soluna çizgi yok; seçili = zemin + kalınlık), Türkçe için text-transform yok.
   Ham renk yalnız iki token bloğunda. */

/* ============ 1. Token: klasik açık (eski KİM paleti, kusurları giderilmiş) ============ */
:root[data-gorunum="klasik"][data-theme]{
  --bg:#FAFBFC;--surface:#FFFFFF;--surface-2:#F3F5F7;--line:#E3E7EC;--line-strong:#C9D1DA;
  --text:#001233;--muted:#5C677D;
  --primary:#0353A4;--on-primary:#FFFFFF;--brand:#14C38E;
  --live-bg:#EAF2FB;--live-text:#0353A4;--wait:#A15C00;--danger:#B42332;--focus:#0353A4;
  --mascot-eye:#0A0A0A;
  /* klasik'e özgü */
  --k-navy:#002855;--k-on-navy:#FFFFFF;--k-primary-hover:#023E7D;--k-field-line:#8794A5;
  --k-select-bg:#EAF2FB;--k-col-bg:#F3F5F7;--k-shadow:0 1px 2px rgb(0 18 51 / .06);--k-pop-shadow:0 8px 24px rgb(0 18 51 / .12);
  --k-scrim:rgb(0 18 51 / .32);
  color-scheme:light;

  /* türetilmişler (app.css'tekiyle aynı formüller, klasik renklerle) */
  --brand-edge:color-mix(in srgb,var(--primary) 30%,transparent);
  --brand-ring:color-mix(in srgb,var(--primary) 18%,transparent);
  --wait-bg:color-mix(in srgb,var(--wait) 10%,var(--surface));
  --wait-edge:color-mix(in srgb,var(--wait) 40%,transparent);
  --danger-edge:color-mix(in srgb,var(--danger) 40%,transparent);
  --primary-hover:var(--k-primary-hover);
  --header-bg:var(--surface);

  /* biçim: 4/8 ızgara, tek gutter, iki yarıçap (kontrol 8, kart 12), Inter */
  --radius:8px;--k-radius-lg:12px;--k-radius-xl:16px;
  --wrap:1680px;--k-side-w:264px;--k-top-h:64px;--header-h:var(--k-top-h);--hdr:var(--k-top-h);
  --gutter:32px;--k-in:20px;
  --ctl-h:40px;--ctl-h-sm:32px;
  --sans:"Inter Variable","Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:var(--sans);
  --fs-xs:12px;--fs-sm:13px;--fs-md:14px;--fs-lg:16px;--fs-xl:22px;--fs-2xl:24px;--fs-stock:48px;

  /* modül token'ları (mecra.css ve pano.css kendi :root bloklarında hex tanımlar) */
  --surface-3:#E9EDF1;--line-2:var(--line-strong);--line-3:#AEB8C4;--text-2:#33415C;
  --sel-bg:var(--k-select-bg);--scrim:var(--k-scrim);--glass:var(--surface);
  --plan-ink:#1E2B44;--plan-fill:#FFFFFF;--plan-fill-sel:#EAF2FB;--plan-grid:#F3F5F7;--plan-grid-2:#E3E7EC;--plan-soft:#97A2B3;
}

/* ============ 2. Token: klasik koyu ("gece lacivert"; eski paletin prussian tonlarından) ============ */
:root[data-gorunum="klasik"][data-theme="dark"]{
  --bg:#001233;--surface:#001845;--surface-2:#062A5A;--line:#18325A;--line-strong:#34507A;
  --text:#E8EDF5;--muted:#9AA7BB;
  --primary:#6AAEF2;--on-primary:#001233;--brand:#14C38E;
  --live-bg:#0B3A72;--live-text:#9CCBFA;--wait:#F5B547;--danger:#FF7A7A;--focus:#9CCBFA;
  --mascot-eye:#0A0A0A;
  --k-navy:#000B22;--k-on-navy:#FFFFFF;--k-primary-hover:#8CC2F6;--k-field-line:#5B7499;
  --k-select-bg:#0B3A72;--k-col-bg:#00143A;--k-shadow:none;--k-pop-shadow:0 8px 24px rgb(0 0 0 / .45);
  --k-scrim:rgb(0 6 20 / .6);
  color-scheme:dark;
  --surface-3:#0A3266;--line-3:#46628C;--text-2:#C6D0DF;
  --plan-ink:#DCE4F0;--plan-fill:#001845;--plan-fill-sel:#0B3A72;--plan-grid:#00143A;--plan-grid-2:#0A2550;--plan-soft:#5B7499;
}

/* ============ 3. Temel ============ */
:root[data-gorunum="klasik"] body{font:450 var(--fs-md)/1.6 var(--sans);font-variant-numeric:tabular-nums;font-feature-settings:"cv11","ss03";letter-spacing:0}
:root[data-gorunum="klasik"] :focus-visible{outline:2px solid var(--focus);outline-offset:2px}
:root[data-gorunum="klasik"] .mono,:root[data-gorunum="klasik"] .meta-line,:root[data-gorunum="klasik"] .crumb{font-family:var(--sans)}
:root[data-gorunum="klasik"] h1,:root[data-gorunum="klasik"] h2,:root[data-gorunum="klasik"] h3{letter-spacing:-.01em}

/* ============ 4A. Yalnız CSS kabuğu: .app-header → sol menü (masaüstü) ============ */
@media (min-width:901px){
  :root[data-gorunum="klasik"] .app-header{position:fixed;inset:0 auto 0 0;width:var(--k-side-w);background:var(--surface);border-bottom:0;border-right:1px solid var(--line);backdrop-filter:none;-webkit-backdrop-filter:none;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;z-index:30}
  :root[data-gorunum="klasik"] .app-header-inner{max-width:none;min-height:100%;flex-direction:column;align-items:stretch;gap:0;padding:0}
  :root[data-gorunum="klasik"] .app-header .brand{background:var(--k-navy);color:var(--k-on-navy);padding:24px 20px;min-height:88px;gap:12px}
  :root[data-gorunum="klasik"] .app-header .brand-name{color:var(--k-on-navy);font-weight:600;white-space:normal;line-height:1.3}
  :root[data-gorunum="klasik"] .app-header .brand-logo{height:auto;max-height:40px;max-width:200px;filter:brightness(0) invert(1)}
  :root[data-gorunum="klasik"] .app-header .brand:has(.brand-logo) .brand-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  :root[data-gorunum="klasik"] .app-header .brand-mark{color:var(--k-on-navy)}
  :root[data-gorunum="klasik"] .app-nav{flex-direction:column;gap:2px;padding:20px 16px 8px}
  :root[data-gorunum="klasik"] .app-nav::before{content:"Çalışma alanı";display:block;padding:0 12px 6px;font-size:var(--fs-xs);font-weight:600;color:var(--muted)}
  :root[data-gorunum="klasik"] .app-nav a{height:40px;padding:0 12px;border-radius:var(--radius);font-size:14px;color:var(--muted)}
  :root[data-gorunum="klasik"] .app-nav a:hover{background:var(--surface-2);color:var(--text)}
  :root[data-gorunum="klasik"] .app-nav a[aria-current="page"]{background:var(--k-select-bg);color:var(--primary);font-weight:600}
  :root[data-gorunum="klasik"] .app-header .pending-count{margin:4px 16px 0;justify-content:space-between}
  :root[data-gorunum="klasik"] .user-menu{margin:auto 0 0;padding:16px;border-top:1px solid var(--line);flex-wrap:wrap;gap:8px}
  :root[data-gorunum="klasik"] .user-menu .user-link{flex:1 1 100%;order:-1;min-height:44px;color:var(--text)}
  :root[data-gorunum="klasik"] .user-menu .user-name{display:inline}
  :root[data-gorunum="klasik"] .app-header ~ main,:root[data-gorunum="klasik"] .app-header ~ .toast{margin-left:var(--k-side-w)}
  :root[data-gorunum="klasik"] .app-header ~ main{--hdr:0px;--header-h:0px}
  :root[data-gorunum="klasik"] .app-header ~ .toast{left:calc(50% + var(--k-side-w) / 2);margin-left:0}
}
@media (max-width:900px){
  :root[data-gorunum="klasik"] .app-header{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}
  :root[data-gorunum="klasik"] .app-header .brand{flex:1 1 100%;background:var(--k-navy);color:var(--k-on-navy);margin:0 calc(-1 * var(--gutter));padding:0 var(--gutter);align-self:stretch}
  :root[data-gorunum="klasik"] .app-header .brand-name{color:var(--k-on-navy)}
  :root[data-gorunum="klasik"] .app-header .brand-logo{filter:brightness(0) invert(1);max-height:32px}
  :root[data-gorunum="klasik"] .app-header .brand:has(.brand-logo) .brand-name{display:none}
  :root[data-gorunum="klasik"] .app-nav a[aria-current="page"]{background:var(--k-select-bg);color:var(--primary);font-weight:600}
  :root[data-gorunum="klasik"] .app-header ~ main{--hdr:var(--header-h)}
}

/* ============ 4B. Klasik kabuk parçası (.k-side + .k-top) ============ */
:root[data-gorunum="klasik"] .k-side{display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;margin:0;padding:0;width:var(--k-side-w);height:100dvh;max-height:none;background:var(--surface);color:var(--text);border:0;border-right:1px solid var(--line);overflow:hidden;z-index:30}
:root[data-gorunum="klasik"] .k-brand{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:88px;padding:20px;background:var(--k-navy);color:var(--k-on-navy)}
:root[data-gorunum="klasik"] .k-brand-link{display:flex;align-items:center;gap:12px;min-width:0;color:inherit}
:root[data-gorunum="klasik"] .k-logo{display:block;width:auto;height:auto;max-width:200px;max-height:44px;filter:brightness(0) invert(1)}
:root[data-gorunum="klasik"] .k-logo[data-ton="renkli"]{filter:none}
:root[data-gorunum="klasik"] .k-wordmark{font-size:18px;font-weight:650;line-height:1.25;letter-spacing:-.01em;overflow-wrap:anywhere}
:root[data-gorunum="klasik"] .k-brand .brand-mark{width:32px;height:32px;flex:none;color:var(--k-on-navy)}
:root[data-gorunum="klasik"] .k-nav{flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;display:flex;flex-direction:column;gap:20px;padding:20px 16px}
:root[data-gorunum="klasik"] .k-group{display:grid;gap:2px}
:root[data-gorunum="klasik"] .k-group-title{margin:0 0 4px;padding:0 12px;font-size:var(--fs-xs);font-weight:600;line-height:20px;color:var(--muted)}
:root[data-gorunum="klasik"] .k-nav a,:root[data-gorunum="klasik"] .k-nav-btn{display:flex;align-items:center;gap:12px;width:100%;min-height:40px;padding:0 12px;border:0;border-radius:var(--radius);background:transparent;color:var(--muted);font:450 14px/1.3 var(--sans);text-align:left;cursor:pointer}
:root[data-gorunum="klasik"] .k-nav a:hover,:root[data-gorunum="klasik"] .k-nav-btn:hover{background:var(--surface-2);color:var(--text)}
:root[data-gorunum="klasik"] .k-nav a[aria-current="page"]{background:var(--k-select-bg);color:var(--primary);font-weight:600}
:root[data-gorunum="klasik"] .k-ico{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
:root[data-gorunum="klasik"] .k-count{margin-left:auto;display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:6px;background:var(--primary);color:var(--on-primary);font-size:12px;font-weight:600;line-height:1}
:root[data-gorunum="klasik"] .k-side-foot{flex:none;display:grid;gap:2px;padding:12px 16px 16px;border-top:1px solid var(--line)}
:root[data-gorunum="klasik"] .k-profile{display:flex;align-items:center;gap:12px;min-height:52px;padding:6px 12px;border-radius:var(--radius);color:var(--text)}
:root[data-gorunum="klasik"] .k-profile:hover,:root[data-gorunum="klasik"] .k-profile[aria-current="page"]{background:var(--surface-2)}
:root[data-gorunum="klasik"] .k-profile b{display:block;font-weight:600;font-size:14px;line-height:1.3;overflow-wrap:anywhere}
:root[data-gorunum="klasik"] .k-profile small{display:block;font-size:12px;color:var(--muted);line-height:1.4}
:root[data-gorunum="klasik"] .k-side-foot form{margin:0}

:root[data-gorunum="klasik"] .k-top{position:sticky;top:0;z-index:20;margin-left:var(--k-side-w);height:var(--k-top-h);display:flex;align-items:center;gap:16px;padding:0 var(--gutter);background:var(--surface);border-bottom:1px solid var(--line)}
:root[data-gorunum="klasik"] .k-crumb{display:flex;align-items:center;gap:8px;min-width:0;font-size:13px;color:var(--muted);white-space:nowrap}
:root[data-gorunum="klasik"] .k-crumb a:hover{color:var(--text)}
:root[data-gorunum="klasik"] .k-crumb strong{font-weight:600;color:var(--text);overflow:hidden;text-overflow:ellipsis}
:root[data-gorunum="klasik"] .k-crumb .k-ico{width:14px;height:14px;color:var(--muted)}
:root[data-gorunum="klasik"] .k-search{margin-left:auto;display:flex;align-items:center;gap:8px;width:280px;height:var(--ctl-h);padding:0 12px;border:1px solid var(--k-field-line);border-radius:var(--radius);background:var(--surface);color:var(--muted)}
:root[data-gorunum="klasik"] .k-search:focus-within{border-color:var(--primary);outline:2px solid var(--brand-ring);outline-offset:0}
:root[data-gorunum="klasik"] .k-search input{flex:1;min-width:0;height:100%;border:0;background:transparent;font-size:14px;color:var(--text);outline:none}
:root[data-gorunum="klasik"] .k-search input::placeholder{color:var(--muted)}
:root[data-gorunum="klasik"] .k-top .tema{width:var(--ctl-h);height:var(--ctl-h);border-color:var(--line);border-radius:var(--radius);color:var(--muted)}
:root[data-gorunum="klasik"] .k-top .k-new{height:var(--ctl-h);padding:0 16px}
:root[data-gorunum="klasik"] .k-top .k-new .k-ico{width:16px;height:16px}
:root[data-gorunum="klasik"] .k-icon{display:inline-grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:var(--radius);background:transparent;color:inherit;cursor:pointer}
:root[data-gorunum="klasik"] .k-icon .k-ico{width:22px;height:22px}
:root[data-gorunum="klasik"] .k-only-mobile{display:none}
:root[data-gorunum="klasik"] .k-top ~ main{margin-left:var(--k-side-w)}
:root[data-gorunum="klasik"] .k-top ~ .toast{left:calc(50% + var(--k-side-w) / 2)}
/* Parça varken: Görevler alt görünümleri sol menüde; sekme ve sayfa içi "Yeni görev" tekrar etmesin */
:root[data-gorunum="klasik"] .k-top ~ main .view-tabs{display:none}
:root[data-gorunum="klasik"] .k-top:has(.k-new) ~ main .page-actions > a.btn-live[href="/gorevler/yeni"]{display:none}
/* görünüm değiştir düğmesi (kullanıcı menüsü, iki kabukta) */
:root .gorunum-form{display:inline;margin:0}

/* ============ 5. Sayfa iskeleti ============ */
:root[data-gorunum="klasik"] .page{max-width:var(--wrap);margin:0 auto;border:0;padding:0 0 var(--sp-12)}
:root[data-gorunum="klasik"] .k-top ~ main.page{margin-left:var(--k-side-w)}
@media (min-width:901px){:root[data-gorunum="klasik"] .k-top ~ main.page{max-width:none}}
:root[data-gorunum="klasik"] .page-head{border-bottom:0;padding:32px var(--gutter) 24px;align-items:flex-end}
:root[data-gorunum="klasik"] .page-title h1{font:600 var(--fs-2xl)/1.3 var(--sans);letter-spacing:-.02em}
:root[data-gorunum="klasik"] .page-title p{margin-top:6px;font-size:14px;color:var(--muted)}
:root[data-gorunum="klasik"] .crumb{font-size:13px;margin-bottom:8px;color:var(--primary)}

/* görünüm sekmeleri → eski "segmented" denetim */
:root[data-gorunum="klasik"] .view-tabs{display:flex;width:fit-content;gap:2px;margin:0 var(--gutter) 20px;padding:2px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2)}
:root[data-gorunum="klasik"] .view-tabs a{height:32px;padding:0 14px;border:0;border-radius:6px;font-size:14px;color:var(--muted)}
:root[data-gorunum="klasik"] .view-tabs a:hover{color:var(--text)}
:root[data-gorunum="klasik"] .view-tabs a[aria-current="page"]{background:var(--primary);color:var(--on-primary);font-weight:600}

/* paneller → beyaz kart */
:root[data-gorunum="klasik"] .panel,:root[data-gorunum="klasik"] .form-panel{margin:0 var(--gutter) 24px;padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--k-radius-lg)}
:root[data-gorunum="klasik"] .panel-narrow,:root[data-gorunum="klasik"] .form-panel{max-width:760px}
:root[data-gorunum="klasik"] .panel-title{font:600 var(--fs-lg)/1.4 var(--sans);margin-bottom:16px}
:root[data-gorunum="klasik"] .panel-title-bar{margin:0 var(--gutter);padding:8px 0 12px}
:root[data-gorunum="klasik"] .profile{max-width:none}
:root[data-gorunum="klasik"] .profile .panel{max-width:880px}

/* süzgeç çubuğu → eski açık gri filtre kutusu */
:root[data-gorunum="klasik"] .toolbar{margin:0 var(--gutter) 16px;padding:16px;gap:12px;background:var(--surface-2);border:0;border-radius:var(--k-radius-lg)}

/* listeler → tek kart, satırlar arası ince çizgi */
:root[data-gorunum="klasik"] .person-list,:root[data-gorunum="klasik"] .item-list,:root[data-gorunum="klasik"] .task-lines-dense,:root[data-gorunum="klasik"] .people-list,:root[data-gorunum="klasik"] .move-list{--gutter:var(--k-in);margin:0 32px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--k-radius-lg);overflow:hidden}
:root[data-gorunum="klasik"] .panel .people-list,:root[data-gorunum="klasik"] .panel .move-list{margin:0}
:root[data-gorunum="klasik"] .person-row:last-child,:root[data-gorunum="klasik"] .item-row:last-child,:root[data-gorunum="klasik"] .task-lines-dense .task-line:last-child,:root[data-gorunum="klasik"] .person-item:last-child,:root[data-gorunum="klasik"] .move-row:last-child{border-bottom:0}
:root[data-gorunum="klasik"] .item-row-head{background:var(--surface-2);font:600 12px/1 var(--sans);letter-spacing:0;color:var(--muted)}
:root[data-gorunum="klasik"] a.item-row:hover,:root[data-gorunum="klasik"] .person-sum:hover{background:var(--surface-2)}
:root[data-gorunum="klasik"] .item-thumb{border-radius:var(--radius)}
:root[data-gorunum="klasik"] .item-name span,:root[data-gorunum="klasik"] .item-qty small{font-family:var(--sans)}
:root[data-gorunum="klasik"] .item-qty b{font:600 16px var(--sans)}
:root[data-gorunum="klasik"] .list-foot{margin:0 var(--gutter);padding:0 0 24px;font-family:var(--sans)}
:root[data-gorunum="klasik"] .person-body{background:var(--bg)}
:root[data-gorunum="klasik"] .sub-head{font:600 12px var(--sans)}
:root[data-gorunum="klasik"] .person-links a{color:var(--primary)}
:root[data-gorunum="klasik"] .task-title{font-weight:550}
:root[data-gorunum="klasik"] .task-title:hover{color:var(--primary);text-decoration:none}
:root[data-gorunum="klasik"] .detail-layout,:root[data-gorunum="klasik"] .stock-summary,:root[data-gorunum="klasik"] .fact-list{border-color:var(--line)}

/* ============ 6. Bileşenler ============ */
/* düğmeler: 8 px köşe, tek mavi */
:root[data-gorunum="klasik"] .btn{height:36px;border-radius:var(--radius);font:500 14px/1 var(--sans)}
:root[data-gorunum="klasik"] .btn-live{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
:root[data-gorunum="klasik"] .btn-live:hover{background:var(--k-primary-hover);border-color:var(--k-primary-hover)}
:root[data-gorunum="klasik"] .btn-line{background:var(--surface);border-color:var(--line-strong);color:var(--text)}
:root[data-gorunum="klasik"] .btn-line:hover{border-color:var(--muted);background:var(--surface-2)}
:root[data-gorunum="klasik"] .btn-ghost{color:var(--primary)}
:root[data-gorunum="klasik"] .btn-ghost:hover{color:var(--k-primary-hover);background:var(--surface-2)}
:root[data-gorunum="klasik"] .btn-sm{height:var(--ctl-h-sm);font-size:13px}

/* alanlar: 40 px, belirgin kenar (≥3:1), odakta mavi */
:root[data-gorunum="klasik"] .input{height:var(--ctl-h);background:var(--surface);border-color:var(--k-field-line);border-radius:var(--radius);font-size:14px;font-family:var(--sans)}
:root[data-gorunum="klasik"] textarea.input{height:auto;padding:10px 12px}
:root[data-gorunum="klasik"] .input:focus{border-color:var(--primary)}
:root[data-gorunum="klasik"] .input:focus-visible{outline:2px solid var(--brand-ring);outline-offset:0;border-color:var(--primary)}
:root[data-gorunum="klasik"] .input-sm{height:var(--ctl-h-sm);font-size:13px}
:root[data-gorunum="klasik"] .input[type="file"]{height:auto;min-height:var(--ctl-h);padding:6px 8px;line-height:26px}
/* logo önizlemesi: sol menüde nasıl görüneceği (lacivert zemin, beyaz logo) */
:root[data-gorunum="klasik"] .logo-preview{display:inline-block;padding:16px 20px;border-radius:var(--radius);background:var(--k-navy)}
:root[data-gorunum="klasik"] .logo-preview img{padding:0;border:0;background:transparent;filter:brightness(0) invert(1)}
:root[data-gorunum="klasik"] .field label,:root[data-gorunum="klasik"] .field-label{font-size:13px;font-weight:500;color:var(--text)}
:root[data-gorunum="klasik"] .check input{accent-color:var(--primary)}
:root[data-gorunum="klasik"] .segmented{border-color:var(--line);background:var(--surface-2);padding:2px;gap:2px;border-radius:var(--radius)}
:root[data-gorunum="klasik"] .segmented span{border-right:0;border-radius:6px;height:32px}
:root[data-gorunum="klasik"] .segmented input:checked+span{background:var(--primary);color:var(--on-primary);font-weight:600}
:root[data-gorunum="klasik"] .opts span{border-radius:var(--radius);border-color:var(--line-strong)}
:root[data-gorunum="klasik"] .opts input:checked+span{background:var(--k-select-bg);border-color:var(--primary);color:var(--primary);font-weight:600}
:root[data-gorunum="klasik"] .opts .swatch{border-radius:50%}
:root[data-gorunum="klasik"] .alert{margin:16px var(--gutter) 0;border-radius:var(--radius);border-color:var(--line);background:var(--surface-2);color:var(--text)}
:root[data-gorunum="klasik"] .alert-error{background:color-mix(in srgb,var(--danger) 6%,var(--surface));border-color:var(--danger-edge);color:var(--danger)}

/* durum: eski "nokta + yazı" (çerçevesiz). Şekil kuralı korunur: yapılıyor dolu, bitti boş halka */
:root[data-gorunum="klasik"] .tag{height:auto;min-height:22px;padding:0;border:0;background:transparent;border-radius:0;font:500 13px/1.3 var(--sans);color:var(--text-2,var(--text));gap:7px}
:root[data-gorunum="klasik"] .tag::before{width:10px;height:10px;background:transparent;border:1.5px solid var(--muted);box-shadow:none}
:root[data-gorunum="klasik"] .tag.live{color:var(--primary);background:transparent;border:0}
:root[data-gorunum="klasik"] .tag.live::before{background:var(--primary);border-color:var(--primary);box-shadow:none}
:root[data-gorunum="klasik"] .tag.wait{color:var(--wait)}
:root[data-gorunum="klasik"] .tag.wait::before{background:var(--wait);border-color:var(--wait);border-radius:2px}
:root[data-gorunum="klasik"] .tag.done::before{background:transparent;border-color:var(--muted)}
:root[data-gorunum="klasik"] .tag.plain{padding:0 8px;min-height:24px;border-radius:6px;background:var(--surface-2);color:var(--muted)}
:root[data-gorunum="klasik"] .tag.is-low{padding:0 8px;min-height:24px;border-radius:6px;background:var(--wait-bg);color:var(--wait)}
:root[data-gorunum="klasik"] .tag.is-low::before{background:var(--wait);border-color:var(--wait)}
:root[data-gorunum="klasik"] .person-now .tag.live{padding:0 8px;border-radius:6px;background:var(--live-bg)}
:root[data-gorunum="klasik"] .page-title p .tag.live{padding:0 8px;border-radius:6px;background:var(--live-bg)}
/* etiket çipleri: eski sade etiket; tıklanabilir olduğu belli olsun */
:root[data-gorunum="klasik"] .chip{height:22px;padding:0 8px;border:0;border-radius:6px;background:var(--surface-2);font:500 12px/1 var(--sans);color:var(--text-2,var(--muted))}
:root[data-gorunum="klasik"] a.chip:hover{background:var(--k-select-bg);color:var(--primary)}
:root[data-gorunum="klasik"] .due{font:500 12px var(--sans);color:var(--muted)}
:root[data-gorunum="klasik"] .due.is-late{color:var(--danger)}
:root[data-gorunum="klasik"] .status-select[data-status="yapiliyor"]{border-color:var(--primary)}
:root[data-gorunum="klasik"] .status-select[data-status="bekliyor"]{border-color:var(--wait)}

/* sayaçlar: tek biçim (22 px yuvarlatılmış kare). Nötr gri; dikkat isteyen mavi dolu */
:root[data-gorunum="klasik"] .count-n,:root[data-gorunum="klasik"] .board-col-count,:root[data-gorunum="klasik"] .kb-count b{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:6px;background:var(--surface-2);color:var(--text);font:600 12px/1 var(--sans)}
:root[data-gorunum="klasik"] .count-item.is-wait .count-n{background:var(--wait-bg);color:var(--wait)}
:root[data-gorunum="klasik"] .person-counts{gap:16px;align-items:center}
:root[data-gorunum="klasik"] .person-counts .count-item{display:inline-flex;align-items:center;gap:6px}
:root[data-gorunum="klasik"] .pending-count{min-height:32px;border-radius:var(--radius);background:var(--primary);color:var(--on-primary);font-weight:600}
:root[data-gorunum="klasik"] .pending-count:hover{background:var(--k-primary-hover)}

/* boş durum: kart içinde, sıkı; tek cümle + (varsa) tek düğme */
:root[data-gorunum="klasik"] .empty-block{margin:0 var(--gutter) 24px;padding:48px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--k-radius-lg);color:var(--muted);font-size:14px}
:root[data-gorunum="klasik"] .empty-block svg{width:72px;height:72px}
:root[data-gorunum="klasik"] .empty-block p:first-of-type{font-weight:600;color:var(--text)}
:root[data-gorunum="klasik"] .empty-line{font-size:13px}

/* avatar: açık zeminde ince halka (renk-paleti.md) */
:root[data-gorunum="klasik"] .av{border-color:var(--line);background:var(--surface-2);font-family:var(--sans)}

/* bildirim ve sürüm uyarısı: eski açılır kart */
:root[data-gorunum="klasik"] .toast{background:var(--surface);border-color:var(--line);border-radius:var(--k-radius-lg);box-shadow:var(--k-pop-shadow);font-size:14px}

/* giriş ve tek kart sayfaları: eski giriş kartı */
:root[data-gorunum="klasik"] .page-bare{background:var(--bg)}
:root[data-gorunum="klasik"] .auth-card{background:var(--surface);border-color:var(--line);border-radius:var(--k-radius-lg);padding:32px}
:root[data-gorunum="klasik"] .auth-card h1{font:600 22px/1.3 var(--sans);letter-spacing:-.02em}
:root[data-gorunum="klasik"] .auth-card .btn{height:44px}
:root[data-gorunum="klasik"] .tenant-list a{border-color:var(--line);border-radius:var(--radius)}
:root[data-gorunum="klasik"] .tenant-list a:hover{background:var(--surface-2)}

/* ============ 7. Görevler: pano (sunucu yedeği .board + istemci bileşeni .kb) ============ */
:root[data-gorunum="klasik"] .board{gap:16px;margin:0 var(--gutter);border:0}
:root[data-gorunum="klasik"] .board-col{border:0;border-radius:var(--k-radius-xl);background:var(--k-col-bg)}
:root[data-gorunum="klasik"] .board-col-head{border-bottom:0;padding:16px 16px 8px}
:root[data-gorunum="klasik"] .board-cards{padding:8px 12px 16px}
:root[data-gorunum="klasik"] .board-card{border-color:var(--line);border-radius:var(--k-radius-lg);background:var(--surface);box-shadow:var(--k-shadow);padding:16px}
:root[data-gorunum="klasik"] .board.kb-host{margin:0;gap:0}
:root[data-gorunum="klasik"] .kb-host{height:calc(100dvh - var(--k-top-h) - 160px);padding:0 var(--gutter)}
:root[data-gorunum="klasik"] .kb[data-mode="desk"] .kb-board{grid-template-columns:repeat(4,minmax(232px,1fr))}
:root[data-gorunum="klasik"] .kb-col .kb-dot{width:9px;height:9px}
:root[data-gorunum="klasik"] [data-status="yapiliyor"]>.kb-dot,:root[data-gorunum="klasik"] .kb-col[data-status="yapiliyor"] .kb-dot,:root[data-gorunum="klasik"] .kb-dot[data-status="yapiliyor"]{background:var(--primary);outline-color:var(--live-bg)}
:root[data-gorunum="klasik"] .kb-av.is-live::after{background:var(--primary)}
:root[data-gorunum="klasik"] .kb-filters{padding:0 0 16px;border-bottom:0;gap:8px}
:root[data-gorunum="klasik"] .kb-search{width:260px;height:var(--ctl-h);border-color:var(--k-field-line);border-radius:var(--radius)}
:root[data-gorunum="klasik"] .kb-select select,:root[data-gorunum="klasik"] .kb-toggle{height:var(--ctl-h);border-radius:var(--radius);border-color:var(--line-strong);font-family:var(--sans)}
:root[data-gorunum="klasik"] .kb-toggle[aria-pressed="true"]{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
:root[data-gorunum="klasik"] .kb-board{gap:16px;--fade:0px;padding-bottom:8px}
:root[data-gorunum="klasik"] .kb-col{border:0;border-radius:var(--k-radius-xl);background:var(--k-col-bg)}
:root[data-gorunum="klasik"] .kb-col-head{height:52px;padding:0 16px;border-bottom:0}
:root[data-gorunum="klasik"] .kb-col-head h2{font:600 15px/1.4 var(--sans);color:var(--text)}
:root[data-gorunum="klasik"] .kb-col[data-status="yapiliyor"] .kb-col-head{border-bottom:0}
:root[data-gorunum="klasik"] .kb-scroll{padding:4px 12px 16px}
:root[data-gorunum="klasik"] .kb-list{gap:10px}
:root[data-gorunum="klasik"] .kb-card,:root[data-gorunum="klasik"] .kb-card-in{border-radius:var(--k-radius-lg)}
:root[data-gorunum="klasik"] .kb-card-in{padding:14px 16px;border-color:var(--line);background:var(--surface);box-shadow:var(--k-shadow)}
:root[data-gorunum="klasik"] .kb-card:hover .kb-card-in{border-color:var(--line-strong)}
:root[data-gorunum="klasik"] .kb-title{font-size:14px;font-weight:550;line-height:1.45}
:root[data-gorunum="klasik"] .kb-add-b{border-radius:var(--radius);color:var(--primary)}

/* ============ 8. Mecra ve Ortak alanlar (token'lar 1–2'de; burada yalnız biçim) ============ */
:root[data-gorunum="klasik"] .mecra-main{--hdr:var(--k-top-h)}
:root[data-gorunum="klasik"] .app-header ~ .mecra-main{--hdr:0px}
:root[data-gorunum="klasik"] .mbar{background:var(--surface)}
:root[data-gorunum="klasik"] .mecra .tree{background:var(--surface)}
:root[data-gorunum="klasik"] .mecra .tn[aria-current=page]{background:var(--k-select-bg);color:var(--primary);font-weight:600}
:root[data-gorunum="klasik"] .mecra .search{border-radius:var(--radius);border-color:var(--k-field-line);background:var(--surface)}
:root[data-gorunum="klasik"] .mecra .seg [aria-current=page],:root[data-gorunum="klasik"] .mecra .seg [aria-pressed=true]{background:var(--primary);color:var(--on-primary)}
:root[data-gorunum="klasik"] .mecra .ph h1{font:600 var(--fs-2xl)/1.3 var(--sans);letter-spacing:-.02em}
:root[data-gorunum="klasik"] .mecra .mpanel{box-shadow:var(--k-pop-shadow)}
:root[data-gorunum="klasik"] .al{--radius:8px;--sans:"Inter Variable","Inter",ui-sans-serif,system-ui,"Segoe UI",sans-serif;--mono:var(--sans);font-family:var(--sans)}
:root[data-gorunum="klasik"] .al-head{padding:32px var(--gutter) 24px;border-bottom:0}
:root[data-gorunum="klasik"] .al-head h1{font:600 var(--fs-2xl)/1.3 var(--sans);letter-spacing:-.02em}
:root[data-gorunum="klasik"] .al-cards{padding:0 var(--gutter);gap:16px}
:root[data-gorunum="klasik"] .al-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--k-radius-lg);padding:20px}
:root[data-gorunum="klasik"] .al-card:hover{border-color:var(--line-strong);background:var(--surface)}
:root[data-gorunum="klasik"] .al-sec{padding:32px var(--gutter) 12px;border:0}
:root[data-gorunum="klasik"] .al-box{margin:0 var(--gutter) 24px;padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--k-radius-lg)}
:root[data-gorunum="klasik"] .al-in{border-color:var(--k-field-line);border-radius:var(--radius);height:var(--ctl-h)}
:root[data-gorunum="klasik"] .al-btn{border-radius:var(--radius)}
:root[data-gorunum="klasik"] .al-btn.live{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
:root[data-gorunum="klasik"] .al-lbl{color:var(--text);font-weight:500}

/* ============ 9. Orta ekran ve telefon ============ */
@media (pointer:coarse){
  :root[data-gorunum="klasik"]{--ctl-h:44px}
  :root[data-gorunum="klasik"] .k-nav a,:root[data-gorunum="klasik"] .k-nav-btn,:root[data-gorunum="klasik"] .btn{min-height:44px}
}
@media (max-width:900px){
  :root[data-gorunum="klasik"]{--gutter:16px;--k-in:16px;--k-top-h:56px}
  /* menü: popover (soldan kayar, dışına dokununca kapanır, Esc kapatır) */
  :root[data-gorunum="klasik"] .k-side:not(:popover-open){display:none}
  :root[data-gorunum="klasik"] .k-side{width:min(300px,86vw);box-shadow:var(--k-pop-shadow);transition:transform .22s cubic-bezier(.2,.8,.2,1),overlay .22s allow-discrete,display .22s allow-discrete}
  :root[data-gorunum="klasik"] .k-side:popover-open{transform:none}
  @starting-style{:root[data-gorunum="klasik"] .k-side:popover-open{transform:translateX(-100%)}}
  :root[data-gorunum="klasik"] .k-side::backdrop{background:var(--k-scrim)}
  :root[data-gorunum="klasik"] .k-only-mobile{display:inline-grid}
  :root[data-gorunum="klasik"] .k-brand .k-only-mobile{color:var(--k-on-navy);margin-right:-8px}
  :root[data-gorunum="klasik"] .k-top{margin-left:0;gap:8px;padding:0 8px 0 4px}
  :root[data-gorunum="klasik"] .k-top ~ main,:root[data-gorunum="klasik"] .k-top ~ main.page{margin-left:0}
  :root[data-gorunum="klasik"] .k-top ~ .toast{left:50%}
  :root[data-gorunum="klasik"] .k-search{display:none}
  :root[data-gorunum="klasik"] .k-crumb{flex:1;font-size:14px}
  :root[data-gorunum="klasik"] .k-crumb > :not(:last-child){display:none}
  :root[data-gorunum="klasik"] .k-top .k-new{margin-left:auto;padding:0 12px}
  :root[data-gorunum="klasik"] .page-head{padding:20px var(--gutter) 16px}
  :root[data-gorunum="klasik"] .page-title h1{font-size:var(--fs-xl)}
  :root[data-gorunum="klasik"] .person-list,:root[data-gorunum="klasik"] .item-list,:root[data-gorunum="klasik"] .task-lines-dense,:root[data-gorunum="klasik"] .people-list,:root[data-gorunum="klasik"] .move-list{margin:0 16px 16px}
  :root[data-gorunum="klasik"] .panel,:root[data-gorunum="klasik"] .form-panel{padding:20px 16px}
  :root[data-gorunum="klasik"] .board{gap:12px}
  :root[data-gorunum="klasik"] .board-col{border-bottom:0}
  :root[data-gorunum="klasik"] .kb-host{height:calc(100dvh - var(--k-top-h) - 140px);padding:0}
  :root[data-gorunum="klasik"] .kb-filters{padding:0 var(--gutter) 12px}
  :root[data-gorunum="klasik"] .kb-search{width:auto;flex:1}
}
@media (max-width:600px){
  :root[data-gorunum="klasik"] .k-top .k-new span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  :root[data-gorunum="klasik"] .k-top .k-new{width:44px;padding:0}
  :root[data-gorunum="klasik"] .person-counts{gap:12px;flex-wrap:wrap}
  :root[data-gorunum="klasik"] .empty-block{padding:32px 16px}
}

/* ============ 10. Görünüm geçişi (docs/tema-gecisi.md ile aynı ilke: çapraz geçiş; hareket azaltmada anında) ============
   Görünüm değişince kabuk değiştiği için sayfa yeniden yüklenir: belge arası View Transition. Yalnız görünüm değişiminde
   çalışır; diğer gezintilerde pageswap/pagereveal içinde atlanır (bkz. gorunum-gecisi.md). */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  ::view-transition-group(root){animation-duration:.32s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
}
@media (prefers-reduced-motion:reduce){
  :root[data-gorunum="klasik"] .k-side{transition:none}
}