/* SiteAI paneli: ortak tasarım dili (tasarim-seti-v2 demosu, birebir). Fontlar yerelden (fontlar/), CDN yok.
   Satır içi stil yok; JS yalnız element.style ve Web Animations ile oynatır (CSP style-src 'self'). */
@font-face{ font-family:'Inter'; font-style:normal; font-display:swap; font-weight:100 900; src:url(/fontlar/inter-latin-ext-wght-normal.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:'Inter'; font-style:normal; font-display:swap; font-weight:100 900; src:url(/fontlar/inter-latin-wght-normal.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Inter Tight'; font-style:normal; font-display:swap; font-weight:100 900; src:url(/fontlar/inter-tight-latin-ext-wght-normal.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:'Inter Tight'; font-style:normal; font-display:swap; font-weight:100 900; src:url(/fontlar/inter-tight-latin-wght-normal.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face{ font-family:'Geist Mono'; font-style:normal; font-display:swap; font-weight:100 900; src:url(/fontlar/geist-mono-latin-ext-wght-normal.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face{ font-family:'Geist Mono'; font-style:normal; font-display:swap; font-weight:100 900; src:url(/fontlar/geist-mono-latin-wght-normal.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }

/* ===== Tokenlar (koyu varsayılan) ===== */
@property --acc   { syntax:'<color>'; inherits:true; initial-value:#7aa2ff; }
@property --acc-2 { syntax:'<color>'; inherits:true; initial-value:#3ddc97; }
:root{
  color-scheme:dark;
  --bg:#07090e; --bg-2:#0b0e15; --side:#090c12;
  --solid:#0e131c; --solid-2:#121824;
  --surface:rgba(255,255,255,.03); --surface-2:rgba(255,255,255,.055); --surface-3:rgba(255,255,255,.085);
  --line:rgba(255,255,255,.07); --line-strong:rgba(255,255,255,.13);
  --edge-a:rgba(255,255,255,.14); --edge-b:rgba(255,255,255,.03);
  --text:#ecf0f7; --muted:#99a2b4; --faint:#677086;
  --good:#3ecf8e; --warn:#f2b84b; --bad:#ff7373;
  --on-acc:#05070c;
  --shadow:0 24px 60px -18px rgba(0,0,0,.75), 0 0 0 1px rgba(255,255,255,.04);
  --glow:13%; --scrim:rgba(3,5,10,.5);
  --s1:#3987e5; --s2:#d95926;
  --siteai-1:#7aa2ff; --siteai-2:#3ddc97;
  --kim-1:#45c486;   --kim-2:#b5e07a;
  --akar-1:#2fc0cf;  --akar-2:#ff9f45;
  --acc:var(--siteai-1); --acc-2:var(--siteai-2);
  --f-display:'Inter Tight','Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --f-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --f-mono:'Geist Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;
  --spring-ease:cubic-bezier(.2,.9,.25,1); --spring-dur:480ms;
  --r-sm:8px; --r-md:12px; --r-lg:16px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ color-scheme:dark; --bg:#07090e; --text:#ecf0f7; --muted:#99a2b4; }
}
:root[data-theme="dark"]{ color-scheme:dark; --bg:#07090e; --text:#ecf0f7; --muted:#99a2b4; }
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f5f6f9; --bg-2:#eef0f5; --side:#eceff4;
  --solid:#ffffff; --solid-2:#fbfcfd;
  --surface:rgba(255,255,255,.8); --surface-2:rgba(15,23,42,.04); --surface-3:rgba(15,23,42,.07);
  --line:rgba(15,23,42,.09); --line-strong:rgba(15,23,42,.15);
  --edge-a:rgba(15,23,42,.11); --edge-b:rgba(15,23,42,.05);
  --text:#0d1220; --muted:#4a5468; --faint:#7a8396;
  --good:#138a55; --warn:#a86a00; --bad:#c43b3b;
  --on-acc:#ffffff;
  --shadow:0 24px 60px -24px rgba(15,23,42,.3), 0 0 0 1px rgba(15,23,42,.05);
  --glow:8%; --scrim:rgba(15,23,42,.22);
  --s1:#2a78d6; --s2:#eb6834;
  --siteai-1:#1f4fa3; --siteai-2:#16865a;
  --kim-1:#1f6b4a;   --kim-2:#4f8a2b;
  --akar-1:#0f5c66;  --akar-2:#c76612;
}
:root[data-brand="kim"]{ --acc:var(--kim-1); --acc-2:var(--kim-2); }
:root[data-brand="akaryakit"]{ --acc:var(--akar-1); --acc-2:var(--akar-2); }
:root{ transition:--acc .6s ease, --acc-2 .6s ease; }
:root[data-size="big"]{ font-size:125%; }

/* ===== Temel ===== */
*,*::before,*::after{ box-sizing:border-box; }
html,body{ height:100%; }
body{ margin:0; background:var(--bg); color:var(--text); font-family:var(--f-body); font-size:.875rem; line-height:1.5; -webkit-font-smoothing:antialiased; overflow:hidden; }
svg{ max-width:100%; }
h1,h2,h3,h4{ margin:0; font-family:var(--f-display); text-wrap:balance; letter-spacing:-.02em; font-weight:600; }
p{ margin:0; }
button,input,select,textarea{ font:inherit; color:inherit; }
button{ cursor:pointer; }
:focus-visible{ outline:2px solid var(--acc); outline-offset:2px; border-radius:6px; }
.num{ font-variant-numeric:tabular-nums; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
[hidden]{ display:none !important; }
kbd{ font-family:var(--f-mono); font-size:.6875rem; line-height:1; padding:.2rem .35rem; border-radius:5px; border:1px solid var(--line-strong); border-bottom-width:2px; color:var(--muted); background:var(--surface); }
i[data-lucide], svg.lucide{ width:1rem; height:1rem; flex:none; }

/* ===== Kabuk ===== */
.shell{ display:grid; grid-template-columns:15rem minmax(0,1fr); height:100%; }
.sb{ position:relative; display:flex; flex-direction:column; gap:.15rem; padding:.75rem .6rem; background:var(--side); border-right:1px solid var(--line); overflow-y:auto; z-index:40; }
.ws{ display:flex; align-items:center; gap:.6rem; padding:.4rem .5rem .7rem; }
.ws-mark{ width:1.75rem; height:1.75rem; border-radius:8px; display:grid; place-items:center; background:linear-gradient(135deg, var(--acc), var(--acc-2)); color:var(--on-acc); box-shadow:0 6px 18px -6px var(--acc); }
.ws-mark svg{ width:.95rem; height:.95rem; }
.ws b{ display:block; font-family:var(--f-display); font-size:.9rem; letter-spacing:-.01em; }
.ws small{ display:block; color:var(--faint); font-size:.6875rem; }
.sb-search{ display:flex; align-items:center; gap:.5rem; margin:0 0 .6rem; padding:.45rem .6rem; border-radius:9px; border:1px solid var(--line); background:var(--surface); color:var(--faint); font-size:.8125rem; text-align:left; transition:border-color .2s, background .2s; }
.sb-search:hover{ border-color:var(--line-strong); background:var(--surface-2); color:var(--muted); }
.sb-search kbd{ margin-left:auto; }
.sb-label{ font-size:.6875rem; font-weight:600; color:var(--faint); padding:.9rem .6rem .35rem; letter-spacing:.02em; }
.nav-item{ position:relative; z-index:1; display:flex; align-items:center; gap:.6rem; width:100%; border:0; background:none; text-align:left; padding:.42rem .6rem; border-radius:8px; color:var(--muted); font-weight:500; transition:color .15s, background .15s; }
.nav-item:hover{ color:var(--text); background:var(--surface); }
.nav-item[aria-current="page"]{ color:var(--text); background:none; }
.nav-item .meta{ margin-left:auto; display:flex; gap:.2rem; align-items:center; }
.nav-item .cnt{ font-family:var(--f-mono); font-size:.6875rem; color:var(--faint); }
.nav-item .keys{ display:none; gap:.15rem; }
.nav-item:hover .keys{ display:flex; } .nav-item:hover .cnt{ display:none; }
.nav-ind{ position:absolute; left:0; top:0; border-radius:8px; background:var(--surface-3); box-shadow:inset 0 1px 0 var(--edge-a), inset 0 0 0 1px var(--line); transition:transform var(--spring-dur) var(--spring-ease), width var(--spring-dur) var(--spring-ease), height var(--spring-dur) var(--spring-ease); pointer-events:none; }
.nav-ind::before{ content:""; position:absolute; left:-.6rem; top:22%; bottom:22%; width:3px; border-radius:0 3px 3px 0; background:var(--acc); }
.sb-foot{ margin-top:auto; padding:.75rem .6rem .25rem; display:grid; gap:.5rem; border-top:1px solid var(--line); font-size:.75rem; color:var(--faint); }
.sb-foot .row-x{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; }

.content{ position:relative; display:flex; flex-direction:column; min-width:0; height:100%; background:radial-gradient(50rem 26rem at 85% -8%, color-mix(in oklab, var(--acc) var(--glow), transparent), transparent 70%), var(--bg); }
.tb{ flex:none; display:flex; align-items:center; gap:.6rem; height:3.25rem; padding:0 clamp(16px, 2vw, 1.5rem); border-bottom:1px solid var(--line); background:color-mix(in oklab, var(--bg) 70%, transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.icon-btn.menu-btn{ display:none; }
.crumb{ display:flex; align-items:center; gap:.45rem; min-width:0; overflow:hidden; font-size:.8125rem; color:var(--faint); white-space:nowrap; }
.crumb b{ color:var(--text); font-weight:600; display:inline-block; overflow:hidden; text-overflow:ellipsis; }
.crumb svg{ width:.8rem; height:.8rem; }
.tb-right{ margin-left:auto; display:flex; align-items:center; gap:.45rem; }
.cmdk{ display:flex; align-items:center; gap:.5rem; height:2rem; padding:0 .45rem 0 .7rem; border-radius:8px; border:1px solid var(--line); background:var(--surface); color:var(--faint); font-size:.8125rem; }
.cmdk:hover{ border-color:var(--line-strong); color:var(--muted); }
.icon-btn{ display:grid; place-items:center; width:2rem; height:2rem; border-radius:8px; border:1px solid var(--line); background:var(--surface); color:var(--muted); }
.icon-btn:hover{ color:var(--text); border-color:var(--line-strong); }
.icon-btn svg{ width:1rem; height:1rem; }
.view{ position:relative; flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; view-transition-name:screen; scroll-behavior:smooth; }
@media (min-width:1800px){ .screen{ max-width:120rem !important; } }
.screen{ max-width:88rem; margin-inline:auto; padding:1.5rem clamp(16px, 2.4vw, 2rem) 3rem; display:grid; gap:1.1rem; align-content:start; }
.ph{ display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-bottom:.25rem; }
.ph h1{ font-size:1.5rem; font-weight:650; letter-spacing:-.03em; }
.ph p{ color:var(--faint); font-size:.8125rem; margin-top:.15rem; }
.ph-actions{ display:flex; gap:.5rem; flex-wrap:wrap; }

/* ===== Kart / cam ===== */
.card{ position:relative; border-radius:var(--r-lg); border:1px solid transparent;
  background:linear-gradient(var(--surface), var(--surface)) padding-box, linear-gradient(180deg, var(--edge-a), var(--edge-b)) border-box; }
.card-h{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.9rem 1rem .25rem; }
.card-h h3{ font-family:var(--f-body); font-size:.875rem; font-weight:600; letter-spacing:0; }
.card-h span{ font-size:.75rem; color:var(--faint); }
.card-b{ padding:.75rem 1rem 1rem; }
.spot::after{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:radial-gradient(20rem circle at var(--mx,50%) var(--my,50%), color-mix(in oklab, var(--acc) 13%, transparent), transparent 45%); opacity:0; transition:opacity .3s; }
.spot:hover::after{ opacity:1; }
.tilt{ will-change:transform; }
.grid{ display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:1rem; }
.s3{ grid-column:span 3; } .s4{ grid-column:span 4; } .s5{ grid-column:span 5; } .s6{ grid-column:span 6; } .s7{ grid-column:span 7; } .s8{ grid-column:span 8; } .s12{ grid-column:span 12; }

/* rakam kartları */
.stat{ padding:1rem 1.1rem; display:grid; gap:.45rem; }
.stat-top{ display:flex; justify-content:space-between; align-items:center; color:var(--muted); font-size:.8125rem; }
.stat-top svg{ color:var(--faint); }
.stat-val{ font-family:var(--f-display); font-size:1.75rem; font-weight:650; letter-spacing:-.04em; line-height:1.1; }
.stat-foot{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:.75rem; color:var(--faint); }
.delta{ display:inline-flex; align-items:center; gap:.25rem; font-size:.75rem; font-weight:600; padding:.1rem .45rem; border-radius:999px; }
.delta svg{ width:.75rem; height:.75rem; }
.delta.good{ color:var(--good); background:color-mix(in oklab, var(--good) 12%, transparent); }
.delta.bad{ color:var(--bad); background:color-mix(in oklab, var(--bad) 12%, transparent); }

/* ===== Düğmeler, rozetler ===== */
.btn{ --h:2rem; display:inline-flex; align-items:center; justify-content:center; gap:.45rem; height:var(--h); padding:0 .8rem; border-radius:8px; border:1px solid transparent; font-weight:550; font-size:.8125rem; white-space:nowrap; text-decoration:none; user-select:none; -webkit-user-select:none;
  transition:translate .3s var(--spring-ease), background .2s, border-color .2s, box-shadow .25s, color .2s; }
.btn svg{ width:.95rem; height:.95rem; }
.btn:hover{ translate:0 -1px; }
html:not(.has-motion) .btn:active{ scale:.97; }
.btn-primary{ background:var(--acc); color:var(--on-acc); box-shadow:0 6px 18px -8px color-mix(in oklab, var(--acc) 80%, transparent), inset 0 1px 0 rgba(255,255,255,.22); }
.btn-primary:hover{ box-shadow:0 10px 26px -8px color-mix(in oklab, var(--acc) 90%, transparent), inset 0 1px 0 rgba(255,255,255,.28); }
.btn-secondary{ background:var(--surface-2); border-color:var(--line-strong); color:var(--text); }
.btn-secondary:hover{ background:var(--surface-3); }
.btn-ghost{ background:transparent; color:var(--muted); }
.btn-ghost:hover{ color:var(--text); background:var(--surface-2); }
.btn-danger{ background:color-mix(in oklab, var(--bad) 13%, transparent); color:var(--bad); border-color:color-mix(in oklab, var(--bad) 32%, transparent); }
.btn-lg{ --h:2.4rem; padding:0 1.05rem; font-size:.875rem; }
.btn[disabled]{ opacity:.75; cursor:progress; }
.spinner{ width:.9rem; height:.9rem; border-radius:50%; border:2px solid currentColor; border-right-color:transparent; animation:spin .7s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.badge{ display:inline-flex; align-items:center; gap:.35rem; height:1.35rem; padding:0 .5rem; border-radius:999px; font-size:.6875rem; font-weight:600; white-space:nowrap; border:1px solid; }
.badge::before{ content:""; width:.35rem; height:.35rem; border-radius:50%; background:currentColor; }
.b-good{ color:var(--good); background:color-mix(in oklab, var(--good) 11%, transparent); border-color:color-mix(in oklab, var(--good) 26%, transparent); }
.b-warn{ color:var(--warn); background:color-mix(in oklab, var(--warn) 11%, transparent); border-color:color-mix(in oklab, var(--warn) 26%, transparent); }
.b-bad{ color:var(--bad); background:color-mix(in oklab, var(--bad) 11%, transparent); border-color:color-mix(in oklab, var(--bad) 26%, transparent); }
.b-neutral{ color:var(--muted); background:var(--surface-2); border-color:var(--line-strong); }
.b-acc{ color:var(--acc); background:color-mix(in oklab, var(--acc) 12%, transparent); border-color:color-mix(in oklab, var(--acc) 30%, transparent); }

/* bölmeli seçici (seg) */
.seg{ position:relative; display:inline-flex; padding:2px; border-radius:9px; background:var(--surface-2); border:1px solid var(--line); }
.seg button{ position:relative; z-index:1; border:0; background:none; padding:.3rem .7rem; font-size:.8125rem; font-weight:550; color:var(--muted); border-radius:7px; transition:color .2s; white-space:nowrap; display:inline-flex; align-items:center; gap:.4rem; }
.seg button[aria-pressed="true"]{ color:var(--text); }
.seg button .c{ font-family:var(--f-mono); font-size:.6875rem; color:var(--faint); }
.seg .thumb{ position:absolute; top:2px; bottom:2px; left:0; border-radius:7px; background:var(--solid-2); box-shadow:0 1px 3px rgba(0,0,0,.25), inset 0 1px 0 var(--edge-a), 0 0 0 1px var(--line); transition:transform var(--spring-dur) var(--spring-ease), width var(--spring-dur) var(--spring-ease); }

/* ===== Özet ===== */
.spark-top{ display:flex; align-items:flex-end; gap:.75rem; flex-wrap:wrap; }
.kpis{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; margin-top:.9rem; padding-top:.9rem; border-top:1px solid var(--line); }
.kpis span{ display:block; font-size:.75rem; color:var(--faint); }
.kpis b{ font-family:var(--f-display); font-size:1.05rem; font-weight:600; letter-spacing:-.02em; }
.hist{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:4px; }
.hist i{ display:block; height:1.6rem; border-radius:4px; }
.hist-l{ display:flex; justify-content:space-between; font-size:.6875rem; color:var(--faint); margin-top:.3rem; }
.spark-top b{ font-family:var(--f-display); font-size:1.6rem; font-weight:650; letter-spacing:-.04em; line-height:1; }
.todo{ display:grid; gap:.15rem; }
.todo label{ display:flex; align-items:center; gap:.6rem; padding:.45rem .5rem; border-radius:8px; cursor:pointer; transition:background .15s; }
.todo label:hover{ background:var(--surface-2); }
.todo input{ accent-color:var(--acc); width:.95rem; height:.95rem; }
.todo input:checked + span{ color:var(--faint); text-decoration:line-through; }
.att{ display:grid; gap:.4rem; }
.att button{ display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:.75rem; padding:.55rem .65rem; border-radius:10px; border:1px solid var(--line); background:var(--surface); text-align:left; transition:background .15s, border-color .15s; }
.att button:hover{ background:var(--surface-2); border-color:var(--line-strong); }
.att small{ display:block; color:var(--faint); font-size:.75rem; }

/* ===== Daireler ===== */
.toolbar{ display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.search{ position:relative; flex:1 1 14rem; max-width:22rem; }
.search svg{ position:absolute; left:.6rem; top:50%; translate:0 -50%; width:.9rem; height:.9rem; color:var(--faint); }
.search .input{ padding-left:2rem; height:2rem; }
.list{ display:grid; gap:.35rem; }
.list-head{ display:grid; grid-template-columns:minmax(0,1fr) 7rem 6rem 7rem; gap:.75rem; padding:0 2.9rem 0 .9rem; font-size:.6875rem; font-weight:600; color:var(--faint); }
.row{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) 2rem; align-items:center; border-radius:10px; background:var(--surface); border:1px solid var(--line); transition:background .15s, border-color .15s, box-shadow .25s, opacity .2s; }
.row:hover{ background:var(--surface-2); border-color:var(--line-strong); box-shadow:0 8px 22px -16px rgba(0,0,0,.7); }
.row-main{ display:grid; grid-template-columns:minmax(0,1fr) 7rem 6rem 7rem; gap:.75rem; align-items:center; border:0; background:none; text-align:left; padding:.55rem .9rem; border-radius:inherit; min-width:0; }
.who{ display:flex; align-items:center; gap:.65rem; min-width:0; }
.who b{ font-weight:600; display:block; }
.who small{ color:var(--faint); font-size:.75rem; }
.av{ width:1.9rem; height:1.9rem; border-radius:8px; display:grid; place-items:center; flex:none; font-family:var(--f-mono); font-size:.6875rem; font-weight:500; color:var(--acc); background:color-mix(in oklab, var(--acc) 12%, transparent); border:1px solid color-mix(in oklab, var(--acc) 26%, transparent); }
.amt{ text-align:right; font-variant-numeric:tabular-nums; font-weight:600; }
.muted{ color:var(--faint); }
.row-del{ width:1.75rem; height:1.75rem; border-radius:7px; border:0; background:none; color:var(--faint); display:grid; place-items:center; opacity:0; transition:opacity .15s, color .15s, background .15s; }
.row:hover .row-del, .row-del:focus-visible{ opacity:1; }
.row-del:hover{ color:var(--bad); background:color-mix(in oklab, var(--bad) 12%, transparent); }
.row-del svg{ width:.9rem; height:.9rem; }
.is-source{ opacity:.2 !important; }
.flash{ animation:flash 1.1s ease; }
@keyframes flash{ 0%{ box-shadow:0 0 0 1px var(--acc), 0 0 22px -4px color-mix(in oklab, var(--acc) 60%, transparent); } 100%{ box-shadow:0 0 0 1px transparent; } }
@media (hover:none){ .row-del{ opacity:1; } }
.list-empty{ padding:2rem 1rem; text-align:center; color:var(--faint); border:1px dashed var(--line-strong); border-radius:12px; }

/* ===== Banka ===== */
.acct{ padding:1rem 1.1rem; display:grid; gap:.3rem; background:linear-gradient(135deg, color-mix(in oklab, var(--acc) 13%, transparent), transparent 60%) padding-box, linear-gradient(180deg, var(--edge-a), var(--edge-b)) border-box; }
.acct span{ color:var(--muted); font-size:.8125rem; }
.acct b{ font-family:var(--f-display); font-size:1.5rem; font-weight:650; letter-spacing:-.03em; }
.acct small{ font-family:var(--f-mono); font-size:.6875rem; color:var(--faint); }
.tx{ display:grid; grid-template-columns:auto minmax(0,1fr) auto 6.5rem; gap:.75rem; align-items:center; padding:.6rem .8rem; border-radius:10px; border:1px solid var(--line); background:var(--surface); }
.tx-ic{ width:1.9rem; height:1.9rem; border-radius:8px; display:grid; place-items:center; background:var(--surface-2); color:var(--muted); }
.tx small{ display:block; color:var(--faint); font-size:.75rem; }
.tx .in{ color:var(--good); font-weight:600; } .tx .out{ font-weight:600; }
.tx-act{ justify-self:end; }

/* ===== Raporlar: sekmeler ===== */
.tabs{ position:relative; display:flex; gap:.15rem; border-bottom:1px solid var(--line); overflow-x:auto; scrollbar-width:none; }
.tab{ border:0; background:none; padding:.55rem .75rem; font-size:.8125rem; font-weight:550; color:var(--faint); white-space:nowrap; transition:color .2s; }
.tab:hover{ color:var(--muted); }
.tab[aria-selected="true"]{ color:var(--text); }
.tab-line{ position:absolute; bottom:-1px; left:0; height:2px; border-radius:2px; background:linear-gradient(90deg, var(--acc), var(--acc-2)); transition:transform var(--spring-dur) var(--spring-ease), width var(--spring-dur) var(--spring-ease); }
.tab-body{ display:grid; padding-top:1rem; }
.tab-body > [role="tabpanel"]{ grid-area:1/1; min-width:0; }
.legend{ display:flex; flex-wrap:wrap; gap:1rem; font-size:.75rem; color:var(--muted); }
.legend span{ display:inline-flex; align-items:center; gap:.4rem; }
.legend i{ width:.65rem; height:.65rem; border-radius:3px; display:block; }
.chart svg{ width:100%; height:auto; display:block; overflow:visible; }
.ax{ fill:var(--faint); font-size:11px; font-family:var(--f-body); }
.gridl{ stroke:var(--line); stroke-width:1; }
.dlabel{ fill:var(--text); font-size:11px; font-weight:600; font-family:var(--f-body); }
.bar1{ fill:var(--s1); } .bar2{ fill:var(--s2); }
.b{ transform-box:fill-box; transform-origin:50% 100%; }
.grp .hl{ fill:transparent; transition:fill .15s; } .grp:hover .hl{ fill:var(--surface-2); }
.hit{ fill:transparent; }
.tip{ position:fixed; left:0; top:0; z-index:90; pointer-events:none; padding:.5rem .65rem; border-radius:10px; background:color-mix(in oklab, var(--solid-2) 95%, transparent); border:1px solid var(--line-strong); box-shadow:0 14px 30px -12px rgba(0,0,0,.6); font-size:.75rem; min-width:9rem; opacity:0; transition:opacity .12s; }
.tip.on{ opacity:1; }
.tip b{ display:block; margin-bottom:.2rem; font-size:.8125rem; }
.tip div{ display:flex; justify-content:space-between; gap:1rem; color:var(--muted); }
.tip div span:last-child{ color:var(--text); font-weight:600; font-variant-numeric:tabular-nums; }
.tip i{ display:inline-block; width:.55rem; height:.55rem; border-radius:2px; margin-right:.35rem; }
.donut{ display:grid; place-items:center; position:relative; padding:.5rem 0; }
.donut-c{ position:absolute; inset:0; display:grid; place-content:center; text-align:center; pointer-events:none; }
.donut-c b{ font-family:var(--f-display); font-size:2.2rem; font-weight:700; letter-spacing:-.05em; line-height:1; }
.donut-c span{ font-size:.75rem; color:var(--muted); }
.hbars{ display:grid; gap:.65rem; }
.hb{ display:grid; grid-template-columns:8rem minmax(0,1fr) 5.5rem; gap:.75rem; align-items:center; font-size:.8125rem; }
.hb .tr{ height:.6rem; border-radius:4px; background:var(--surface-2); overflow:hidden; }
.hb .tr i{ display:block; height:100%; border-radius:0 4px 4px 0; background:var(--s2); transform-origin:left; }
.hb .v{ text-align:right; font-weight:600; font-variant-numeric:tabular-nums; }
.tbl-scroll{ max-height:22rem; overflow:auto; border-radius:12px; border:1px solid var(--line); }
table{ width:100%; border-collapse:separate; border-spacing:0; min-width:36rem; }
thead th{ position:sticky; top:0; z-index:1; background:color-mix(in oklab, var(--solid-2) 94%, transparent); backdrop-filter:blur(8px); text-align:left; font-weight:600; font-size:.75rem; color:var(--muted); border-bottom:1px solid var(--line-strong); padding:0; }
thead th > button, thead th > span{ display:flex; align-items:center; gap:.3rem; width:100%; border:0; background:none; padding:.6rem .85rem; font-weight:600; color:inherit; text-align:inherit; }
thead th.r > button{ justify-content:flex-end; }
thead th svg{ width:.75rem; height:.75rem; opacity:.3; transition:transform .3s var(--spring-ease), opacity .2s; }
thead th[aria-sort] > button{ color:var(--text); }
thead th[aria-sort] svg{ opacity:1; color:var(--acc); }
thead th[aria-sort="ascending"] svg{ transform:rotate(180deg); }
tbody td{ padding:.6rem .85rem; border-bottom:1px solid var(--line); }
tbody td.r{ text-align:right; font-variant-numeric:tabular-nums; font-weight:600; }
tbody tr{ background:radial-gradient(16rem circle at var(--mx,-30rem) 50%, color-mix(in oklab, var(--acc) 11%, transparent), transparent 70%); }
tbody tr:hover{ background-color:var(--surface-2); }
tbody tr:last-child td{ border-bottom:0; }

/* ===== Bileşenler ===== */
.demo{ padding:1.1rem; display:grid; gap:.9rem; align-content:start; }
.demo > h3{ font-size:.8125rem; font-weight:600; color:var(--muted); letter-spacing:0; font-family:var(--f-body); display:flex; justify-content:space-between; gap:1rem; }
.demo > h3 span{ font-weight:500; color:var(--faint); }
.wrap-row{ display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.field{ display:grid; gap:.35rem; }
.field label{ font-size:.8125rem; font-weight:550; }
.help{ font-size:.75rem; color:var(--faint); }
.err{ font-size:.75rem; color:var(--bad); }
.input{ height:2.25rem; width:100%; padding:0 .75rem; border-radius:8px; border:1px solid var(--line-strong); background:var(--surface-2); outline:none; transition:border-color .2s, box-shadow .3s, background .2s; }
textarea.input{ height:auto; min-height:4.5rem; padding:.5rem .75rem; resize:vertical; }
.input:hover{ border-color:color-mix(in oklab, var(--text) 24%, transparent); }
.input:focus{ border-color:var(--acc); background:var(--surface); box-shadow:0 0 0 3px color-mix(in oklab, var(--acc) 20%, transparent), 0 0 22px -6px color-mix(in oklab, var(--acc) 60%, transparent); }
.input.is-err{ border-color:color-mix(in oklab, var(--bad) 60%, transparent); }
.affix{ position:relative; } .affix span{ position:absolute; left:.75rem; top:50%; translate:0 -50%; color:var(--faint); } .affix .input{ padding-left:1.6rem; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:.85rem; }
.form-grid .full{ grid-column:1/-1; }
.empty{ display:grid; justify-items:center; text-align:center; gap:.6rem; padding:1.5rem 1rem; border-radius:12px; border:1px dashed var(--line-strong); }
.empty-ic{ width:3rem; height:3rem; border-radius:50%; display:grid; place-items:center; color:var(--good); background:color-mix(in oklab, var(--good) 12%, transparent); box-shadow:0 0 0 7px color-mix(in oklab, var(--good) 6%, transparent); }
.empty-ic svg{ width:1.3rem; height:1.3rem; }
.empty b{ font-family:var(--f-display); font-size:1rem; }
.empty p{ font-size:.8125rem; color:var(--muted); max-width:20rem; }
.dd{ position:relative; display:inline-block; }
.dd-menu{ position:absolute; z-index:10; top:calc(100% + .35rem); left:0; min-width:12.5rem; padding:.3rem; border-radius:12px; background:color-mix(in oklab, var(--solid-2) 94%, transparent); backdrop-filter:blur(14px); border:1px solid var(--line-strong); box-shadow:0 22px 46px -18px rgba(0,0,0,.6); transform-origin:top left; display:grid; }
.dd-menu button{ display:flex; align-items:center; gap:.55rem; border:0; background:none; text-align:left; padding:.45rem .55rem; border-radius:8px; font-size:.8125rem; }
.dd-menu button svg{ color:var(--muted); }
.dd-menu button kbd{ margin-left:auto; }
.dd-menu button:hover, .dd-menu button:focus-visible{ background:var(--surface-3); outline:none; }
.dd-menu hr{ border:0; border-top:1px solid var(--line); margin:.25rem .2rem; }
.dd-menu .danger, .dd-menu .danger svg{ color:var(--bad); }
.icons{ display:grid; grid-template-columns:repeat(8, minmax(0,1fr)); gap:.5rem; }
.ic{ display:grid; justify-items:center; gap:.5rem; padding:.9rem .4rem; border-radius:10px; border:1px solid var(--line); background:var(--surface); transition:border-color .2s, background .2s, translate .4s var(--spring-ease); }
.ic svg{ width:1.3rem; height:1.3rem; stroke-width:1.75; transition:transform .45s var(--spring-ease), color .2s; }
.ic span{ font-size:.6875rem; color:var(--muted); }
.ic:hover{ border-color:color-mix(in oklab, var(--acc) 40%, transparent); background:var(--surface-2); translate:0 -3px; }
.ic:hover svg{ transform:rotate(-8deg) scale(1.08); color:var(--acc); }

/* ===== Hareket ayarları ===== */
.sliders{ display:grid; gap:.9rem; }
.sl-top{ display:flex; justify-content:space-between; font-size:.8125rem; }
.sl-top output{ font-family:var(--f-mono); font-size:.8125rem; color:var(--muted); }
input[type="range"]{ -webkit-appearance:none; appearance:none; width:100%; height:1.4rem; background:transparent; }
input[type="range"]::-webkit-slider-runnable-track{ height:4px; border-radius:4px; background:linear-gradient(90deg, var(--acc) var(--p,50%), var(--line-strong) var(--p,50%)); }
input[type="range"]::-moz-range-track{ height:4px; border-radius:4px; background:var(--line-strong); }
input[type="range"]::-moz-range-progress{ height:4px; border-radius:4px; background:var(--acc); }
input[type="range"]::-webkit-slider-thumb{ -webkit-appearance:none; width:1rem; height:1rem; margin-top:-.375rem; border-radius:50%; background:var(--text); border:3px solid var(--acc); box-shadow:0 0 0 4px color-mix(in oklab, var(--acc) 20%, transparent); transition:transform .2s; }
input[type="range"]::-moz-range-thumb{ width:.8rem; height:.8rem; border-radius:50%; background:var(--text); border:3px solid var(--acc); }
input[type="range"]:active::-webkit-slider-thumb{ transform:scale(1.2); }
.curve{ width:100%; height:auto; display:block; }
.meta{ display:flex; flex-wrap:wrap; gap:.4rem 1.2rem; font-size:.75rem; color:var(--muted); }
.meta b{ color:var(--text); font-family:var(--f-mono); font-weight:500; }
.track{ position:relative; height:4.75rem; border-radius:12px; background:repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 2.5rem), var(--surface); border:1px solid var(--line); overflow:hidden; }
.puck{ position:absolute; left:.6rem; top:50%; margin-top:-1.5rem; height:3rem; padding:0 .9rem; border-radius:12px; display:flex; align-items:center; gap:.55rem; background:var(--solid-2); border:1px solid var(--line-strong); box-shadow:0 10px 26px -10px rgba(0,0,0,.6), 0 0 26px -10px color-mix(in oklab, var(--acc) 70%, transparent); font-weight:600; white-space:nowrap; }
.puck .av{ width:1.6rem; height:1.6rem; }
.cat-item{ display:grid; grid-template-columns:1.9rem minmax(0,1fr) auto; gap:.8rem; align-items:center; padding:.7rem .75rem; border-radius:10px; transition:background .15s; }
.cat-item:hover{ background:var(--surface-2); }
.cat-item + .cat-item{ border-top:1px solid var(--line); }
.cat-n{ width:1.9rem; height:1.9rem; border-radius:50%; display:grid; place-items:center; font-family:var(--f-mono); font-size:.75rem; color:var(--acc); border:1px solid color-mix(in oklab, var(--acc) 35%, transparent); }
.cat-item b{ display:block; font-weight:600; }
.cat-item p{ font-size:.8125rem; color:var(--muted); }

/* ===== Ayarlar ===== */
.set{ display:grid; }
.set-row{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:1rem; align-items:center; padding:1rem 1.1rem; }
.set-row + .set-row{ border-top:1px solid var(--line); }
.set-row b{ display:block; font-weight:600; }
.set-row p{ color:var(--muted); font-size:.8125rem; }
.brands{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:.75rem; padding:0 1.1rem 1.1rem; }
.brand{ text-align:left; padding:0; overflow:hidden; display:grid; border-radius:14px; transition:box-shadow .35s; }
.brand[aria-pressed="true"]{ box-shadow:0 0 0 2px var(--b1), 0 18px 40px -20px color-mix(in oklab, var(--b1) 80%, transparent); }
.brand-top{ height:4.5rem; position:relative; background:radial-gradient(14rem 7rem at 15% 0%, color-mix(in oklab, var(--b1) 55%, transparent), transparent), radial-gradient(12rem 6rem at 100% 100%, color-mix(in oklab, var(--b2) 45%, transparent), transparent), var(--solid-2); border-bottom:1px solid var(--line); }
.brand-mark{ position:absolute; left:1rem; bottom:-1rem; width:2.2rem; height:2.2rem; border-radius:10px; display:grid; place-items:center; background:linear-gradient(135deg, var(--b1), var(--b2)); color:#fff; box-shadow:0 8px 20px -8px var(--b1); }
.brand-body{ padding:1.5rem 1rem 1rem; display:grid; gap:.4rem; }
.brand-body b{ font-family:var(--f-display); font-size:1.05rem; }
.brand-body p{ font-size:.75rem; color:var(--muted); }
.brand-sw{ display:flex; gap:.35rem; align-items:center; font-size:.6875rem; color:var(--faint); }
.brand-sw i{ width:.9rem; height:.9rem; border-radius:4px; display:block; }
.brand-state{ font-size:.75rem; font-weight:600; color:var(--b1); }
.b-kim{ --b1:var(--kim-1); --b2:var(--kim-2); } .b-siteai{ --b1:var(--siteai-1); --b2:var(--siteai-2); } .b-akar{ --b1:var(--akar-1); --b2:var(--akar-2); }
.steps{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:.75rem; }
.step{ padding:1rem 1.1rem; display:grid; gap:.4rem; align-content:start; }
.step-n{ width:1.6rem; height:1.6rem; border-radius:50%; display:grid; place-items:center; font-family:var(--f-mono); font-size:.75rem; background:var(--acc); color:var(--on-acc); }
.step p{ font-size:.8125rem; color:var(--muted); }
.step code{ font-family:var(--f-mono); font-size:.6875rem; color:var(--acc); }

/* iskelet */
.sk{ position:relative; overflow:hidden; border-radius:12px; background:var(--surface-2); }
.sk::after{ content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg, transparent, var(--surface-3), transparent); animation:shimmer 1.1s ease-in-out infinite; }
@keyframes shimmer{ to{ transform:translateX(100%); } }

/* ===== Katmanlar: perde, çekmece, pencere, palet, bildirim ===== */
.scrim{ position:fixed; inset:0; z-index:70; background:var(--scrim); backdrop-filter:blur(4px) saturate(120%); -webkit-backdrop-filter:blur(4px) saturate(120%); }
.drawer{ position:fixed; z-index:71; top:.6rem; right:.6rem; bottom:.6rem; width:min(26rem, calc(100% - 1.2rem)); }
.drawer-shell{ position:absolute; inset:0; border-radius:16px; background:var(--solid-2); border:1px solid var(--line-strong); box-shadow:var(--shadow); transform-origin:0 0; }
.drawer-in{ position:relative; height:100%; display:flex; flex-direction:column; padding:1rem 1.1rem; gap:.9rem; overflow:auto; }
.d-head{ display:flex; align-items:center; gap:.75rem; }
.d-head .av{ width:2.4rem; height:2.4rem; font-size:.8125rem; border-radius:11px; }
.d-head h2{ font-size:1.15rem; font-weight:650; }
.d-head p{ font-size:.75rem; color:var(--faint); }
.d-head .icon-btn{ margin-left:auto; }
.d-bal{ padding:.9rem 1rem; border-radius:12px; display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; background:linear-gradient(135deg, color-mix(in oklab, var(--acc) 16%, transparent), transparent 70%), var(--surface); border:1px solid var(--line); }
.d-bal span{ font-size:.75rem; color:var(--muted); display:block; }
.d-bal b{ font-family:var(--f-display); font-size:1.85rem; font-weight:700; letter-spacing:-.04em; line-height:1.1; }
.kv{ display:grid; }
.kv div{ display:flex; justify-content:space-between; gap:1rem; padding:.5rem 0; border-bottom:1px dashed var(--line); font-size:.8125rem; }
.kv div span:first-child{ color:var(--muted); }
.mv{ display:grid; gap:.35rem; font-size:.8125rem; }
.mv div{ display:flex; justify-content:space-between; gap:1rem; padding:.45rem .6rem; border-radius:8px; background:var(--surface); }
.d-form{ margin-top:auto; display:grid; gap:.6rem; }
.modal{ position:fixed; z-index:72; left:50%; top:50%; width:min(25rem, calc(100% - 2rem)); translate:-50% -50%; border-radius:16px; background:var(--solid-2); border:1px solid var(--line-strong); box-shadow:var(--shadow); padding:1.15rem; display:grid; gap:.9rem; }
.modal h2{ font-size:1.05rem; font-weight:650; }
.modal p{ color:var(--muted); }
.match{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:.5rem; }
.match > div{ padding:.65rem; border-radius:10px; background:var(--surface); border:1px solid var(--line); }
.match small{ display:block; color:var(--faint); font-size:.6875rem; }
.match svg{ color:var(--acc); width:1rem; }
.modal-actions{ display:flex; justify-content:flex-end; gap:.5rem; }
.pal{ position:fixed; z-index:80; left:50%; top:12%; width:min(36rem, calc(100% - 32px)); translate:-50% 0; border-radius:16px; background:color-mix(in oklab, var(--solid-2) 96%, transparent); backdrop-filter:blur(20px); border:1px solid var(--line-strong); box-shadow:var(--shadow), 0 0 80px -30px color-mix(in oklab, var(--acc) 50%, transparent); overflow:hidden; }
.pal-in{ display:flex; align-items:center; gap:.6rem; padding:.8rem 1rem; border-bottom:1px solid var(--line); }
.pal-in svg{ width:1.05rem; height:1.05rem; color:var(--faint); }
.pal-in input{ flex:1; border:0; outline:none; background:none; font-size:1rem; min-width:0; }
.pal-list{ position:relative; max-height:min(22rem, 55vh); overflow-y:auto; padding:.35rem; }
.pal-g{ font-size:.6875rem; font-weight:600; color:var(--faint); padding:.55rem .65rem .3rem; }
.pal-item{ position:relative; z-index:1; display:flex; align-items:center; gap:.65rem; width:100%; border:0; background:none; text-align:left; padding:.5rem .65rem; border-radius:9px; color:var(--muted); }
.pal-item[aria-selected="true"]{ color:var(--text); }
.pal-item .meta2{ margin-left:auto; display:flex; gap:.2rem; font-size:.75rem; color:var(--faint); }
.pal-hl{ position:absolute; left:.35rem; right:.35rem; top:0; border-radius:9px; background:var(--surface-3); box-shadow:inset 0 0 0 1px var(--line); transition:transform .28s var(--spring-ease), height .2s; pointer-events:none; }
.pal-foot{ display:flex; gap:1rem; padding:.55rem 1rem; border-top:1px solid var(--line); font-size:.6875rem; color:var(--faint); }
.pal-foot span{ display:inline-flex; gap:.3rem; align-items:center; }
.pal-none{ padding:1.5rem; text-align:center; color:var(--faint); }
.toasts{ position:fixed; z-index:95; right:1rem; bottom:1rem; display:grid; gap:.5rem; justify-items:end; pointer-events:none; }
.toast{ pointer-events:auto; position:relative; overflow:hidden; display:flex; align-items:center; gap:.6rem; padding:.65rem .9rem .75rem .75rem; border-radius:12px; background:color-mix(in oklab, var(--solid-2) 92%, transparent); backdrop-filter:blur(12px); border:1px solid var(--line-strong); box-shadow:0 18px 40px -16px rgba(0,0,0,.6); font-size:.8125rem; font-weight:500; max-width:22rem; }
.toast .ok{ width:1.4rem; height:1.4rem; border-radius:50%; display:grid; place-items:center; background:color-mix(in oklab, var(--good) 18%, transparent); color:var(--good); flex:none; }
.toast .ok svg{ width:.8rem; height:.8rem; }
.toast .bar{ position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--good); transform-origin:left; opacity:.7; }
.toasts{ transition:right .35s var(--spring-ease); }
html.drawer-open .toasts{ right:calc(min(26rem, 100% - 1.2rem) + 1.4rem); }
@media (max-width:820px){ html.drawer-open .toasts{ right:1rem; bottom:auto; top:calc(env(safe-area-inset-top,0px) + 1rem); } }
.kbd-hint{ position:fixed; z-index:96; left:50%; bottom:1.2rem; translate:-50% 0; display:flex; gap:.3rem; align-items:center; padding:.4rem .6rem; border-radius:10px; background:var(--solid-2); border:1px solid var(--line-strong); box-shadow:var(--shadow); font-size:.75rem; color:var(--muted); }

/* ===== Duyarlı ===== */
@media (max-width: 1100px){
  .s3{ grid-column:span 6; } .s4,.s5,.s7,.s8{ grid-column:span 12; } .s6{ grid-column:span 12; }
  .icons{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .brands, .steps{ grid-template-columns:1fr; }
}
@media (max-width: 820px){
  .shell{ grid-template-columns:minmax(0,1fr); }
  .sb{ position:fixed; left:0; top:0; bottom:0; width:min(17rem, 85vw); z-index:75; transform:translateX(-105%); box-shadow:var(--shadow); padding-top:calc(.75rem + env(safe-area-inset-top,0px)); }
  .sb.open{ transform:none; }
  .icon-btn.menu-btn{ display:grid; }
  .crumb #crumbApp, .crumb svg{ display:none; }
  .cmdk kbd{ display:none; } .cmdk{ padding:0 .55rem; }
  .cmdk .t{ display:none; }
  .tb-right .btn-primary .t{ display:none; }
  .list-head{ display:none; }
  .row-main{ grid-template-columns:minmax(0,1fr) auto; }
  .row-main .c-st, .row-main .c-last{ display:none; }
  .tx{ grid-template-columns:auto minmax(0,1fr) auto; }
  .tx-act{ grid-column:2 / -1; }
  .form-grid{ grid-template-columns:1fr; }
  .set-row{ grid-template-columns:1fr; }
  .hb{ grid-template-columns:6rem minmax(0,1fr) 4.5rem; }
}
@media (max-width: 480px){
  .s3{ grid-column:span 6; }
  .grid{ gap:.6rem; }
  .stat{ padding:.8rem .85rem; }
  .stat-val{ font-size:1.35rem; }
  .ph h1{ font-size:1.3rem; }
  .cat-item{ grid-template-columns:1.9rem minmax(0,1fr); }
  .cat-item .btn{ grid-column:2; justify-self:start; }
}

/* ===== Görünüm geçişleri ===== */
::view-transition-old(root), ::view-transition-new(root){ animation:none; }
html.vt-fade::view-transition-old(root){ animation:vtFadeOut .3s ease both; }
html.vt-fade::view-transition-new(root){ animation:vtFadeIn .3s ease both; }
html.vt-screen::view-transition-group(screen){ animation-duration:0s; }
html.vt-screen::view-transition-old(screen){ animation:vtOut .16s cubic-bezier(.4,0,1,1) both; transform-origin:50% 20%; }
html.vt-screen::view-transition-new(screen){ animation:vtIn var(--spring-dur) var(--spring-ease) both; }
@keyframes vtOut{ to{ opacity:0; transform:scale(.98); filter:blur(2px); } }
@keyframes vtIn{ from{ opacity:0; transform:translateY(12px); } }
@keyframes vtFadeOut{ to{ opacity:0; } }
@keyframes vtFadeIn{ from{ opacity:0; } }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* =====================================================================
   SiteAI canlı ekleri: demodaki satır içi stillerin sınıf karşılıkları ve
   gerçek veri ekranlarının (giriş, kayıtlar, rapor tabloları, formlar) parçaları.
   Hepsi yukarıdaki tokenlarla; yeni renk yok.
   ===================================================================== */
:root{ padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px); }
.giris-yok .shell{ display:none; }
/* satır içi stillerin yerine */
.sk-h1{ height:2.2rem; width:14rem; } .sk-stat{ height:6.4rem; } .sk-big{ height:15rem; } .sk-row{ height:2.9rem; }
.kbd-in{ border-color:transparent; background:rgba(0,0,0,.15); color:inherit; }
.mt-chart{ margin-top:.6rem; }
.c-good{ color:var(--good); } .c-bad{ color:var(--bad); } .c-warn{ color:var(--warn); } .fw6{ font-weight:600; }
.card-h.pt{ padding-top:.2rem; }
.card-b.stack{ display:grid; gap:.6rem; }
.lg-s1{ background:var(--s1); } .lg-s2{ background:var(--s2); }
.h-good{ background:color-mix(in oklab, var(--good) 45%, transparent); } .h-bad{ background:color-mix(in oklab, var(--bad) 55%, transparent); } .hist i.h-none{ background:var(--surface-2); }
.help.center{ text-align:center; } .help.gap{ margin:1rem 0 .45rem; }
.card.pad-s{ padding:.4rem; } .card-h.tight{ padding:.7rem .75rem .4rem; }
.hb .tr i{ width:var(--w,0%); }
/* üst çubuk: site seçici */
.site-sel{ position:relative; display:flex; align-items:center; min-width:0; }
.site-sel svg{ position:absolute; left:.6rem; width:.9rem; height:.9rem; color:var(--faint); pointer-events:none; }
.site-sel select{ height:2rem; max-width:clamp(7rem, 22vw, 16rem); padding:0 1.6rem 0 1.9rem; border-radius:8px; border:1px solid var(--line); background-color:var(--surface); color:var(--text); font-size:.8125rem; font-weight:550; text-overflow:ellipsis; appearance:none; -webkit-appearance:none;
  background-image:linear-gradient(45deg, transparent 50%, var(--faint) 50%), linear-gradient(135deg, var(--faint) 50%, transparent 50%); background-position:calc(100% - .85rem) 52%, calc(100% - .6rem) 52%; background-size:.25rem .25rem; background-repeat:no-repeat; }
.site-sel select:hover{ border-color:var(--line-strong); }
.site-sel select option{ background:var(--solid-2); color:var(--text); }
/* menü altı: kullanıcı */
.sb-user{ display:flex; align-items:center; gap:.5rem; min-width:0; }
.sb-user .av{ width:1.6rem; height:1.6rem; font-size:.625rem; }
.sb-user span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); }
.sb-user .icon-btn{ margin-left:auto; width:1.75rem; height:1.75rem; }
/* giriş */
.giris{ position:fixed; inset:0; z-index:60; display:grid; place-items:center; padding:2rem 16px; background:radial-gradient(50rem 26rem at 85% -8%, color-mix(in oklab, var(--acc) var(--glow), transparent), transparent 70%), var(--bg); overflow-y:auto; }
.giris-in{ width:min(24rem, 100%); display:grid; gap:1rem; }
.giris .ws{ padding:0 .25rem; }
.giris-kart{ padding:1.4rem 1.35rem 1.3rem; display:grid; gap:.9rem; }
.giris-kart h1{ font-size:1.35rem; font-weight:650; letter-spacing:-.03em; }
.giris-kart > p{ color:var(--muted); font-size:.8125rem; margin-top:-.55rem; }
.giris-kart .btn{ width:100%; }
.giris-alt{ font-size:.75rem; color:var(--faint); text-align:center; }
/* uyarı satırı */
.callout{ display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; padding:.65rem .8rem; border-radius:10px; border:1px solid var(--line); background:var(--surface); font-size:.8125rem; }
.callout > svg{ width:1rem; height:1rem; flex:none; }
.callout > span{ flex:1 1 12rem; min-width:0; }
.callout.warn{ border-color:color-mix(in oklab, var(--warn) 30%, transparent); background:color-mix(in oklab, var(--warn) 8%, transparent); } .callout.warn > svg{ color:var(--warn); }
.callout.bad{ border-color:color-mix(in oklab, var(--bad) 30%, transparent); background:color-mix(in oklab, var(--bad) 8%, transparent); } .callout.bad > svg{ color:var(--bad); }
.callout.info > svg{ color:var(--acc); }
/* araç çubuğu: tarih aralığı */
.toolbar.end{ align-items:flex-end; }
.toolbar .field{ gap:.25rem; }
.toolbar .field label{ font-size:.75rem; color:var(--faint); font-weight:550; }
.toolbar .input{ height:2rem; }
.toolbar .input[type="date"]{ width:auto; min-width:9.5rem; }
.toolbar .grow{ flex:1 1 14rem; max-width:24rem; }
/* daire satırı: sağdaki ok (demodaki sil düğmesinin yeri) */
.row-go{ width:1.75rem; height:1.75rem; border-radius:7px; display:grid; place-items:center; color:var(--faint); opacity:0; transition:opacity .15s, color .15s, translate .3s var(--spring-ease); pointer-events:none; }
.row:hover .row-go{ opacity:1; translate:2px 0; color:var(--acc); }
.row-go svg{ width:.9rem; height:.9rem; }
@media (hover:none){ .row-go{ opacity:1; } }
.who small{ display:block; line-height:1.3125rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.who > span:last-child{ min-width:0; }
/* yapılacaklar (gezinme satırı) */
.todo button{ display:flex; align-items:center; gap:.6rem; padding:.45rem .5rem; border-radius:8px; border:0; background:none; text-align:left; transition:background .15s; width:100%; }
.todo button:hover{ background:var(--surface-2); }
.todo button .dot{ width:.95rem; height:.95rem; border-radius:50%; border:2px solid var(--acc); flex:none; }
.todo button .n{ margin-left:auto; font-family:var(--f-mono); font-size:.75rem; color:var(--muted); }
.todo button svg{ width:.85rem; height:.85rem; color:var(--faint); }
.todo .bos{ display:flex; align-items:center; gap:.6rem; padding:.45rem .5rem; color:var(--faint); }
.todo .bos svg{ color:var(--good); }
/* tablolar (rapor, kayıt) */
.tbl-scroll.uzun{ max-height:min(70vh, 44rem); }
tbody tr.tik{ cursor:pointer; }
tbody tr.tik:focus-visible{ outline:2px solid var(--acc); outline-offset:-2px; }
tbody td.muted{ color:var(--faint); }
tbody tr.iptal td{ color:var(--faint); text-decoration:line-through; text-decoration-color:color-mix(in oklab, var(--faint) 60%, transparent); }
tbody tr.iptal td:last-child{ text-decoration:none; }
tbody tr.bos td{ text-align:center; color:var(--faint); padding:1.6rem 1rem; }
tfoot td{ position:sticky; bottom:0; padding:.6rem .85rem; font-weight:600; background:color-mix(in oklab, var(--solid-2) 94%, transparent); backdrop-filter:blur(8px); border-top:1px solid var(--line-strong); }
tfoot td.r{ text-align:right; font-variant-numeric:tabular-nums; }
.kod{ font-family:var(--f-mono); font-size:.6875rem; color:var(--faint); padding:.05rem .35rem; border-radius:5px; border:1px solid var(--line); margin-left:.45rem; white-space:nowrap; }
.agac{ display:inline-flex; align-items:center; gap:.35rem; }
.agac svg{ width:.8rem; height:.8rem; color:var(--faint); transition:transform .3s var(--spring-ease); }
.agac.kapali svg{ transform:rotate(-90deg); }
.agac i{ display:inline-block; width:.8rem; }
td.d1{ padding-left:2rem; } td.d2{ padding-left:3.2rem; } td.d3{ padding-left:4.4rem; } td.d4{ padding-left:5.6rem; }
tr.ust td{ font-weight:600; }
/* çekmece içi */
.d-sec{ display:grid; gap:.5rem; }
.d-sec + .d-sec{ margin-top:1rem; }
.d-sec h4{ font-family:var(--f-body); font-size:.75rem; font-weight:600; color:var(--faint); letter-spacing:.02em; display:flex; justify-content:space-between; gap:.5rem; }
.d-sec h4 span{ font-weight:500; }
.mv div{ align-items:center; }
.mv small{ display:block; color:var(--faint); font-size:.6875rem; }
.mv .r{ text-align:right; white-space:nowrap; }
.mv-more{ justify-self:start; }
.kisi{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.35rem .75rem; align-items:center; padding:.55rem .65rem; border-radius:10px; background:var(--surface); border:1px solid var(--line); font-size:.8125rem; }
.kisi b{ font-weight:600; display:block; overflow:hidden; text-overflow:ellipsis; }
.kisi small{ display:block; color:var(--faint); font-size:.6875rem; }
.kisi .tel{ display:inline-flex; align-items:center; gap:.3rem; font-variant-numeric:tabular-nums; color:var(--muted); }
.kisi .tel .icon-btn{ width:1.6rem; height:1.6rem; }
.kisi .tel .icon-btn svg{ width:.8rem; height:.8rem; }
.kisi .satir{ grid-column:1/-1; display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
.kisi .satir .input{ flex:1 1 8rem; height:2rem; width:auto; }
.kisi.bitti{ opacity:.7; }
.btn-sm{ --h:1.75rem; padding:0 .6rem; font-size:.75rem; }
.d-form .form-grid{ gap:.6rem; }
.zam-liste{ display:grid; gap:.35rem; }
.chk{ display:flex; align-items:center; gap:.6rem; padding:.45rem .6rem; border-radius:8px; background:var(--surface); font-size:.8125rem; cursor:pointer; }
.chk input{ accent-color:var(--acc); width:.95rem; height:.95rem; }
.chk span:last-child{ margin-left:auto; font-variant-numeric:tabular-nums; font-weight:600; }
.satir-kayit{ display:grid; grid-template-columns:minmax(0,1fr) 6.5rem 5.5rem 1.75rem; gap:.4rem; align-items:center; }
.satir-kayit .input{ height:2rem; }
.satir-kayit .row-del{ opacity:1; }
.modal-actions .sol{ margin-right:auto; }
.modal .form-grid{ gap:.6rem; }
/* hesap planı ve banka hesabı satırları */
.plan{ display:grid; gap:.1rem; max-height:26rem; overflow-y:auto; }
.plan-row{ display:flex; align-items:center; gap:.6rem; padding:.3rem .5rem; border-radius:8px; font-size:.8125rem; }
.plan-row:hover{ background:var(--surface-2); }
.plan-row .kod{ margin:0; }
.plan-row .ad{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.plan-row .btn{ opacity:0; transition:opacity .15s; }
.plan-row:hover .btn, .plan-row .btn:focus-visible{ opacity:1; }
.plan-row.d1{ padding-left:1.5rem; } .plan-row.d2{ padding-left:2.5rem; } .plan-row.d3{ padding-left:3.5rem; } .plan-row.d4{ padding-left:4.5rem; }
@media (hover:none){ .plan-row .btn{ opacity:1; } }
.hesap-satir{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.75rem; align-items:center; padding:.6rem .7rem; border-radius:10px; border:1px solid var(--line); background:var(--surface); }
.hesap-satir small{ display:block; color:var(--faint); font-size:.75rem; }
.hesap-satir .err{ display:block; }
/* hazırlanıyor ekranı */
.empty.genis{ padding:2.4rem 1rem; }
.empty-ic.acc{ color:var(--acc); background:color-mix(in oklab, var(--acc) 12%, transparent); box-shadow:0 0 0 7px color-mix(in oklab, var(--acc) 6%, transparent); }
.empty.genis p{ max-width:30rem; }
.toast .ok.bad{ background:color-mix(in oklab, var(--bad) 18%, transparent); color:var(--bad); }
.toast .bar.bad{ background:var(--bad); }
.acct .err{ font-size:.6875rem; }
@media (max-width: 820px){
  .satir-kayit{ grid-template-columns:minmax(0,1fr) 5.5rem 1.75rem; }
  .satir-kayit .yon{ grid-column:1 / 2; }
  .toolbar .field{ flex:1 1 8rem; }
  .toolbar .input[type="date"]{ min-width:0; width:100%; }
  .site-sel select{ max-width:8rem; }
}
@media (max-width: 480px){
  .crumb{ display:none; }
  .tb-right{ margin-left:auto; }
}
.nav{ display:contents; }
.list-head .r{ text-align:right; }
.brand-sw .sw1{ background:var(--b1); } .brand-sw .sw2{ background:var(--b2); }
.field{ align-content:start; }
thead th.r > span{ justify-content:flex-end; }
.ph-actions .field{ gap:0; }
.ph-actions .input{ height:2rem; }
.ph-actions .input[type="date"]{ width:auto; min-width:9.25rem; }
.screen{ grid-template-columns:minmax(0,1fr); }
.toolbar .seg{ max-width:100%; overflow-x:auto; scrollbar-width:none; }
.toolbar .seg::-webkit-scrollbar{ display:none; }
@media (max-width: 480px){
  .ph-actions{ width:100%; }
  .ph-actions .input[type="date"]{ min-width:0; flex:1 1 7.5rem; }
}
.d-form .form-grid{ grid-template-columns:1fr 1fr; }

/* ===== Kasa, Giderler, Personel ===== */
.field.soru > label{ font-size:.8125rem; font-weight:600; color:var(--text); }
tbody tr.devir td{ color:var(--muted); font-style:italic; }
tbody tr.devir td.r{ font-style:normal; font-weight:600; color:var(--text); }
tbody td .badge{ margin-left:.4rem; vertical-align:middle; }
.satir-btn{ display:flex; flex-wrap:wrap; gap:.4rem; }
.mv div.iptal > span:first-child{ color:var(--faint); text-decoration:line-through; text-decoration-color:color-mix(in oklab, var(--faint) 60%, transparent); }
.mv div > .btn-sm{ flex:none; }
.per{ display:grid; gap:.7rem; padding:1rem 1.1rem; text-align:left; color:inherit; cursor:pointer; font:inherit; }
.per:hover{ border-color:var(--line-strong); }
.per.pasif{ opacity:.68; }
.per-top{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.65rem; align-items:center; }
.per-ad{ min-width:0; }
.per-ad b{ display:block; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.per-ad small{ display:block; color:var(--faint); font-size:.75rem; }
.per .kv div{ padding:.38rem 0; }
.per .kv div:last-child{ border-bottom:0; }
.bordro-son{ align-items:stretch; }
.bordro-son > div:last-child{ text-align:right; }
.bordro-son b{ font-size:1.35rem; }
.input.elle{ border-color:color-mix(in oklab, var(--acc) 55%, var(--line)); }
.d-sec h4 .btn{ font-family:var(--f-body); }
@media (max-width: 820px){
  .per{ grid-column:span 12; }
}
.per{ align-content:start; }
.toolbar select.input{ width:auto; flex:0 1 15rem; min-width:0; }
.d-sec > .seg{ max-width:100%; overflow-x:auto; scrollbar-width:none; }
@media (max-width: 820px){
  .toolbar select.input{ flex:1 1 100%; }
}