/* Layout: çalışma kitabı – üstte başlık + hücre şeridi, ortada ızgara tablolar, altta sayfa sekmeleri (Excel gibi) */
:root{
  --bg:#f3f5f3; --sheet:#ffffff; --grid:#d9ded9; --head:#eef1ee; --ink:#1f2a24; --muted:#5d6b63;
  --accent:#1d6b43; --accent-ink:#ffffff; --sel:#e3f1e8;
  --ok:#1d7a46; --ok-bg:#e2f3e8; --warn:#9a6400; --warn-bg:#fbf0d9; --bad:#b3261e; --bad-bg:#fbe4e2; --info:#2b5c9e; --info-bg:#e4ecf8;
  --font:"Source Sans 3",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#141a17; --sheet:#1b2320; --grid:#2f3a35; --head:#222c28; --ink:#e4ebe6; --muted:#9aaba1;
  --accent:#4cb07a; --accent-ink:#0d1a12; --sel:#24382d;
  --ok:#6fcf97; --ok-bg:#1f3a2a; --warn:#e7b65a; --warn-bg:#3a2f16; --bad:#f08a80; --bad-bg:#3d2220; --info:#8fb4ec; --info-bg:#1f2b40; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#141a17; --sheet:#1b2320; --grid:#2f3a35; --head:#222c28; --ink:#e4ebe6; --muted:#9aaba1;
  --accent:#4cb07a; --accent-ink:#0d1a12; --sel:#24382d;
  --ok:#6fcf97; --ok-bg:#1f3a2a; --warn:#e7b65a; --warn-bg:#3a2f16; --bad:#f08a80; --bad-bg:#3d2220; --info:#8fb4ec; --info-bg:#1f2b40; color-scheme:dark}
*{box-sizing:border-box}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font:15px/1.4 var(--font);font-variant-numeric:tabular-nums;margin:0}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--accent)}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--accent);color:var(--accent-ink);
  padding-block:10px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
  display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.top h1{font-size:17px;font-weight:700;margin:0;letter-spacing:.01em}
.top .upd{font-size:12.5px;opacity:.85}
main{padding-block:14px 96px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));max-width:1100px;margin:0 auto;display:grid;gap:14px}
h2{font-size:19px;margin:0;text-wrap:balance}
.sub{color:var(--muted);font-size:13.5px;margin-top:2px}
.cells{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--grid);background:var(--sheet)}
.cell{padding:8px 10px;border-right:1px solid var(--grid);min-width:0}
.cell:last-child{border-right:0}
.cell .k{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.cell .v{font-size:18px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:560px){.cells{grid-template-columns:repeat(2,minmax(0,1fr))}.cell:nth-child(2){border-right:0}.cell:nth-child(-n+2){border-bottom:1px solid var(--grid)}}
.bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.seg{display:inline-flex;border:1px solid var(--grid);background:var(--sheet)}
.seg button{font:inherit;font-size:14px;border:0;background:transparent;color:var(--ink);padding:7px 12px;cursor:pointer;border-right:1px solid var(--grid)}
.seg button:last-child{border-right:0}
.seg button[aria-pressed="true"]{background:var(--sel);color:var(--accent);font-weight:700}
.tw{overflow-x:auto;border:1px solid var(--grid);background:var(--sheet);-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:14px}
th,td{border:1px solid var(--grid);padding:6px 8px;text-align:left;vertical-align:top}
thead th{background:var(--head);font-weight:600;font-size:12.5px;color:var(--muted);position:sticky;top:0;white-space:nowrap}
td.n,th.n{text-align:right;white-space:nowrap}
td.rn{background:var(--head);color:var(--muted);text-align:right;width:34px;font-size:12px}
tr.tot td{font-weight:700;background:var(--head)}
td.note{color:var(--muted);font-size:13px;min-width:200px}
tbody tr:hover td:not(.rn){background:var(--sel)}
.pill{display:inline-block;font-size:12px;font-weight:600;padding:1px 7px;border-radius:3px;white-space:nowrap}
.p-ok{background:var(--ok-bg);color:var(--ok)}.p-warn{background:var(--warn-bg);color:var(--warn)}.p-bad{background:var(--bad-bg);color:var(--bad)}.p-info{background:var(--info-bg);color:var(--info)}
.notes{border:1px solid var(--grid);background:var(--sheet);padding:10px 12px;margin:0;display:grid;gap:6px;list-style:none}
.notes li{padding-left:14px;position:relative}
.notes li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;background:var(--accent)}
a{color:var(--accent)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
/* alt sekmeler */
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:6;background:var(--head);border-top:1px solid var(--grid);
  padding-bottom:env(safe-area-inset-bottom,0px);padding-left:max(8px,env(safe-area-inset-left,0px));padding-right:max(8px,env(safe-area-inset-right,0px));
  display:flex;overflow-x:auto;gap:2px}
.tabs button{font:inherit;font-size:14px;border:0;border-top:3px solid transparent;background:transparent;color:var(--muted);padding:10px 14px 9px;white-space:nowrap;cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--sheet);color:var(--accent);font-weight:700;border-top-color:var(--accent)}
/* Ramo */
.chat{border:1px solid var(--grid);background:var(--sheet);display:flex;flex-direction:column;min-height:50vh}
.msgs{padding:12px;display:grid;gap:12px;align-content:start;flex:1}
.m{display:grid;gap:4px;max-width:92%}
.m .who{font-size:12px;color:var(--muted)}
.m .q{background:var(--head);border:1px solid var(--grid);padding:8px 10px;white-space:pre-wrap;overflow-wrap:anywhere}
.m .a{background:var(--sel);border-left:3px solid var(--accent);padding:8px 10px;white-space:pre-wrap;overflow-wrap:anywhere}
.m .f{font-size:13.5px}
.compose{border-top:1px solid var(--grid);padding:10px;display:grid;gap:8px}
.compose textarea{font:inherit;width:100%;min-height:64px;resize:vertical;border:1px solid var(--grid);background:var(--bg);color:var(--ink);padding:8px}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.btn{font:inherit;font-size:14px;font-weight:600;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);padding:8px 14px;cursor:pointer}
.btn.ghost{background:transparent;color:var(--accent)}
.btn:disabled{opacity:.5;cursor:default}
.hint{font-size:13px;color:var(--muted)}
.info{border:1px solid var(--grid);background:var(--info-bg);color:var(--ink);padding:9px 12px;font-size:13.5px}
.empty{color:var(--muted);padding:12px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

.login{max-width:380px;margin:8vh auto 0;border:1px solid var(--grid);background:var(--sheet);padding:20px;display:grid;gap:12px}
.login label{font-size:13px;color:var(--muted)}
.login input{font:inherit;width:100%;border:1px solid var(--grid);background:var(--bg);color:var(--ink);padding:9px}
.err{color:var(--bad);font-size:13.5px}
.top .sp{flex:1}
.top .me{font-size:13px;opacity:.9}
.top .out{font:inherit;font-size:13px;background:transparent;color:var(--accent-ink);border:1px solid currentColor;padding:3px 9px;cursor:pointer}
.mini{font:inherit;font-size:12px;border:1px solid var(--grid);background:var(--sheet);color:var(--muted);padding:1px 7px;cursor:pointer}
