/* Hızlı — döşeme menü ve görsel tasarım denemeleri.
   Ortak yapı (her tasarımda): başlık bandı, kısayol hapları, modül/grup/ekran karoları.
   <html data-hz="renkli|lacivert|gece|kagit|kompakt"> tasarımı seçer; yoksa "Mevcut" görünüm.
   --m: karonun modül rengi (RGB üçlüsü, netsis.js modulRenk). */

@font-face { font-family: "Manrope"; font-weight: 400 800; font-display: swap; src: url(/static/fonts/manrope-latin-400-800.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Manrope"; font-weight: 400 800; font-display: swap; src: url(/static/fonts/manrope-latin-ext-400-800.woff2) format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "IBM Plex Sans"; font-weight: 100 700; font-display: swap; src: url(/static/fonts/ibm-plex-sans-latin-wght.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans"; font-weight: 100 700; font-display: swap; src: url(/static/fonts/ibm-plex-sans-latin-ext-wght.woff2) format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "Space Grotesk"; font-weight: 300 700; font-display: swap; src: url(/static/fonts/space-grotesk-latin-400-700.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Space Grotesk"; font-weight: 300 700; font-display: swap; src: url(/static/fonts/space-grotesk-latin-ext-400-700.woff2) format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: "Fraunces"; font-weight: 400 700; font-display: swap; src: url(/static/fonts/fraunces-latin-400-700.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Fraunces"; font-weight: 400 700; font-display: swap; src: url(/static/fonts/fraunces-latin-ext-400-700.woff2) format("woff2"); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ---------- ortak yapı (Mevcut görünüm) ---------- */
:root { --m: var(--ink); --kr: 16px; --baslik: inherit; }
.nx-bant { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 22px 24px; border-radius: 18px;
  color: #fff; background-image: linear-gradient(120deg, var(--b1), var(--b2)); box-shadow: 0 18px 40px -24px var(--b1); }
.nx-bant-ust { font-size: 12.5px; opacity: .82; }
.nx-bant-baslik { margin-top: 4px; font-family: var(--baslik); font-size: clamp(22px, 3vw, 30px); font-weight: 700; letter-spacing: -.02em; line-height: 1.15; }
.nx-bant-alt { margin-top: 4px; font-size: 13px; opacity: .85; }
.nx-bant-ara { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border-radius: 12px; font-size: 13.5px;
  background: rgb(255 255 255 / .16); color: #fff; border: 1px solid rgb(255 255 255 / .28); transition: background .15s; }
.nx-bant-ara:hover { background: rgb(255 255 255 / .26); }
.nx-bant-ara svg { width: 16px; height: 16px; }
.nx-bant-ara kbd { font: 11px ui-monospace, monospace; padding: 1px 5px; border-radius: 5px; background: rgb(255 255 255 / .2); }
@media (max-width: 640px) { .nx-bant { padding: 18px; } .nx-bant-ara kbd { display: none; } }

.nx-kisayol { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.nx-hap { display: inline-flex; flex-shrink: 0; align-items: center; gap: 6px; max-width: 240px; height: 32px; padding: 0 12px; border-radius: 999px; font-size: 13px;
  border: 1px solid rgb(var(--line)); background: rgb(var(--sheet)); color: rgb(var(--graphite)); transition: border-color .15s, background .15s; }
.nx-hap:hover { border-color: rgb(var(--ink) / .45); background: rgb(var(--ink) / .05); }
.nx-hap svg { width: 14px; height: 14px; color: rgb(var(--muted)); flex-shrink: 0; }

.nx-karolar { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) { .nx-karolar { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .nx-karolar { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.nx-karo { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-height: 104px; padding: 16px; text-align: left;
  border-radius: var(--kr); border: 1px solid rgb(var(--line)); background: rgb(var(--sheet)); color: rgb(var(--graphite));
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: nx-gir .32s ease both; animation-delay: calc(var(--i, 0) * 25ms); }
.nx-karo:hover { transform: translateY(-2px); border-color: rgb(var(--m) / .45); box-shadow: 0 14px 28px -18px rgb(var(--m) / .55); }
.nx-karo:focus-visible { outline: 2px solid rgb(var(--m)); outline-offset: 2px; }
.nx-karo-ikon { display: flex; width: 40px; height: 40px; flex-shrink: 0; align-items: center; justify-content: center; border-radius: 12px;
  background: rgb(var(--m) / .12); color: rgb(var(--m)); }
.nx-karo-ikon svg { width: 20px; height: 20px; }
.nx-karo-govde { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.nx-karo-ad { font-family: var(--baslik); font-size: 14.5px; font-weight: 650; line-height: 1.3; }
.nx-karo-ekran .nx-karo-ad { font-size: 13.5px; font-weight: 550; }
.nx-karo-say { font-size: 12px; color: rgb(var(--muted)); }
.nx-karo-alt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 4px; font-size: 12px; line-height: 1.45; color: rgb(var(--muted) / .9); }
.nx-karo-no, .nx-karo-ok { display: none; }
.nx-bolum-baslik { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: rgb(var(--muted)); }
.nx-bolum-say { padding: 0 7px; border-radius: 999px; font-size: 11px; letter-spacing: 0; background: rgb(var(--m) / .12); color: rgb(var(--m)); }
@keyframes nx-gir { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .nx-karo { animation: none; transition: none; } }

/* ---------- 1 · Renkli: sıcak zemin, modül renkleri öne çıkar, dolgun simgeler ---------- */
html[data-hz="renkli"] {
  --paper: 250 247 242; --sheet: 255 255 255; --raised: 246 242 235; --line: 236 229 218; --rule: 242 236 227;
  --graphite: 32 27 22; --muted: 112 102 90; --ink: 234 88 12; --ink-soft: 255 237 222;
  --b1: #F97316; --b2: #E11D74; --g1: #FB923C; --g2: #F472B6; --g3: #FACC15;
  --kr: 20px; --baslik: "Manrope", system-ui, sans-serif;
}
[data-hz="renkli"] body { background: radial-gradient(1200px 500px at 100% -10%, rgb(255 214 170 / .35), transparent 60%), radial-gradient(900px 400px at -10% 0%, rgb(255 190 220 / .25), transparent 60%), rgb(var(--paper)); background-attachment: fixed; }
[data-hz="renkli"] .nx-ust { background: rgb(255 255 255 / .8); }
[data-hz="renkli"] .nx-bant { background-image: linear-gradient(120deg, #F97316, #E11D74 60%, #7C3AED); position: relative; overflow: hidden; }
[data-hz="renkli"] .nx-bant::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 85% 20%, rgb(255 255 255 / .28), transparent 35%), radial-gradient(circle at 70% 120%, rgb(255 255 255 / .18), transparent 40%); }
[data-hz="renkli"] .nx-bant > * { position: relative; z-index: 1; }
[data-hz="renkli"] .nx-karo { border-color: transparent; box-shadow: 0 1px 2px rgb(60 40 20 / .06), 0 8px 24px -14px rgb(60 40 20 / .25); overflow: hidden; }
[data-hz="renkli"] .nx-karo::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: rgb(var(--m)); }
[data-hz="renkli"] .nx-karo-modul { min-height: 150px; }
[data-hz="renkli"] .nx-karo-modul .nx-karo-ikon, [data-hz="renkli"] .nx-karo-grup .nx-karo-ikon { width: 48px; height: 48px; border-radius: 14px; color: #fff;
  background: linear-gradient(135deg, rgb(var(--m)), rgb(var(--m) / .7)); box-shadow: 0 8px 18px -8px rgb(var(--m)); }
[data-hz="renkli"] .nx-karo-modul .nx-karo-ikon svg { width: 24px; height: 24px; }
[data-hz="renkli"] .nx-karo-ok { display: block; position: absolute; right: 14px; bottom: 14px; width: 18px; height: 18px; color: rgb(var(--m)); opacity: 0; transform: translateX(-4px); transition: .18s; }
[data-hz="renkli"] .nx-karo:hover .nx-karo-ok { opacity: 1; transform: none; }
[data-hz="renkli"] .nx-karo-ad { font-weight: 750; }
[data-hz="renkli"] .nx-pencere { border-color: transparent; box-shadow: 0 1px 2px rgb(60 40 20 / .06), 0 16px 40px -24px rgb(60 40 20 / .35); }
[data-hz="renkli"] .nx-tab-on { border-radius: 10px 10px 0 0; box-shadow: inset 0 3px 0 rgb(var(--ink)); }
[data-hz="renkli"] .nx-karsila { background-image: linear-gradient(120deg, #F97316, #E11D74 60%, #7C3AED); }
[data-hz="renkli"] h1, [data-hz="renkli"] h2 { font-family: var(--baslik); }

/* ---------- 2 · Lacivert: Netsis'e yakın kurumsal görünüm, koyu üst çubuk ve sekmeler ---------- */
html[data-hz="lacivert"] {
  --paper: 238 242 248; --sheet: 255 255 255; --raised: 245 248 252; --line: 214 222 235; --rule: 230 236 245;
  --graphite: 15 30 56; --muted: 86 102 130; --ink: 29 95 200; --ink-soft: 226 236 252;
  --b1: #1D5FC8; --b2: #1D5FC8; --g1: #3B82F6; --g2: #60A5FA; --g3: #FBBF24;
  --kr: 6px; --baslik: "IBM Plex Sans", system-ui, sans-serif;
}
[data-hz="lacivert"] body { font-family: "IBM Plex Sans", system-ui, sans-serif; background: rgb(var(--paper)); }
[data-hz="lacivert"] .nx-ust { background: #0B2447; border-color: #0B2447; color: #fff; }
[data-hz="lacivert"] .nx-ust .text-muted { color: rgb(255 255 255 / .7); }
[data-hz="lacivert"] .nx-ust .nx-ikon-btn { color: #fff; }
[data-hz="lacivert"] .nx-ust .nx-ikon-btn:hover { background: rgb(255 255 255 / .1); }
[data-hz="lacivert"] .nx-ust .nx-in { background: rgb(255 255 255 / .1); border-color: rgb(255 255 255 / .18); color: #fff; }
[data-hz="lacivert"] .nx-ust .nx-in::placeholder { color: rgb(255 255 255 / .6); }
[data-hz="lacivert"] .nx-ust .nx-in option { color: #0F1E38; }
[data-hz="lacivert"] .nx-ust .nx-arac { background: transparent; border-color: rgb(255 255 255 / .25); color: #fff; }
[data-hz="lacivert"] .nx-ust kbd { background: rgb(255 255 255 / .12); border-color: transparent; color: rgb(255 255 255 / .7); }
[data-hz="lacivert"] .nx-sekmeler { background: #19376D; border-color: #19376D; }
[data-hz="lacivert"] .nx-tab { color: rgb(255 255 255 / .75); border-radius: 4px 4px 0 0; }
[data-hz="lacivert"] .nx-tab:hover { color: #fff; }
[data-hz="lacivert"] .nx-tab-on { background: rgb(var(--paper)); color: #0B2447; border-color: transparent; font-weight: 600; }
[data-hz="lacivert"] .nx-bant { background: #0B2447; border-radius: 6px; box-shadow: none; position: relative; overflow: hidden; }
[data-hz="lacivert"] .nx-bant::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .35;
  background: repeating-linear-gradient(135deg, transparent 0 14px, rgb(255 255 255 / .05) 14px 15px), linear-gradient(90deg, transparent 50%, rgb(59 130 246 / .5)); }
[data-hz="lacivert"] .nx-bant > * { position: relative; z-index: 1; }
[data-hz="lacivert"] .nx-bant-ara { border-radius: 4px; }
[data-hz="lacivert"] .nx-karo { border-left: 4px solid rgb(var(--m)); box-shadow: 0 1px 2px rgb(15 30 56 / .08); flex-direction: row; align-items: center; min-height: 84px; }
[data-hz="lacivert"] .nx-karo:hover { transform: none; background: rgb(var(--m) / .04); box-shadow: 0 4px 14px -6px rgb(15 30 56 / .2); }
[data-hz="lacivert"] .nx-karo-ikon { border-radius: 4px; background: transparent; border: 1px solid rgb(var(--m) / .35); }
[data-hz="lacivert"] .nx-karo-ok { display: block; margin-left: auto; width: 16px; height: 16px; flex-shrink: 0; color: rgb(var(--muted)); }
[data-hz="lacivert"] .nx-karo-ad { font-weight: 600; }
[data-hz="lacivert"] .nx-pencere { border-radius: 6px; box-shadow: 0 1px 3px rgb(15 30 56 / .1); }
[data-hz="lacivert"] .nx-pencere > div:first-child { background: #F3F6FB; }
[data-hz="lacivert"] .nx-arac, [data-hz="lacivert"] .nx-in, [data-hz="lacivert"] .nx-bul, [data-hz="lacivert"] .nx-hap, [data-hz="lacivert"] .panel { border-radius: 4px; }
[data-hz="lacivert"] .nx-arac-ana { background: #1D5FC8; }
[data-hz="lacivert"] .nx-ftab-on { box-shadow: inset 0 -2px 0 rgb(var(--ink)); }
[data-hz="lacivert"] .nx-karsila { background: #0B2447; border-radius: 6px; }
[data-hz="lacivert"] .nx-menu { background: #F3F6FB; }

/* ---------- 3 · Gece: koyu zemin, modül renkli ışıltılar, cam paneller ---------- */
html[data-hz="gece"] {
  --paper: 8 10 18; --sheet: 17 20 33; --raised: 23 27 44; --line: 38 43 66; --rule: 28 32 52;
  --graphite: 232 235 245; --muted: 142 150 180; --ink: 129 140 248; --ink-soft: 32 34 72;
  --debit: 255 107 129; --ok: 52 211 153; --warn: 251 191 36;
  --b1: #6366F1; --b2: #06B6D4; --g1: #818CF8; --g2: #22D3EE; --g3: #F0ABFC;
  --kr: 18px; --baslik: "Space Grotesk", system-ui, sans-serif; color-scheme: dark;
}
[data-hz="gece"] body { background: radial-gradient(900px 500px at 90% -10%, rgb(99 102 241 / .22), transparent 60%), radial-gradient(800px 500px at 0% 110%, rgb(6 182 212 / .14), transparent 60%), rgb(var(--paper)); background-attachment: fixed; }
[data-hz="gece"] .nx-ust { background: rgb(12 14 25 / .75); }
[data-hz="gece"] .nx-bant { background: linear-gradient(120deg, rgb(99 102 241 / .9), rgb(6 182 212 / .75)); border: 1px solid rgb(255 255 255 / .12); position: relative; overflow: hidden; }
[data-hz="gece"] .nx-bant::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 80% 0%, rgb(240 171 252 / .45), transparent 40%); }
[data-hz="gece"] .nx-bant > * { position: relative; z-index: 1; }
[data-hz="gece"] .nx-karo { background: linear-gradient(180deg, rgb(255 255 255 / .04), rgb(255 255 255 / .015)), rgb(var(--sheet)); border-color: rgb(255 255 255 / .07); overflow: hidden; }
[data-hz="gece"] .nx-karo::after { content: ""; position: absolute; width: 160px; height: 160px; right: -60px; top: -60px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgb(var(--m) / .35), transparent 70%); opacity: .55; transition: opacity .2s; }
[data-hz="gece"] .nx-karo:hover { border-color: rgb(var(--m) / .55); box-shadow: 0 0 0 1px rgb(var(--m) / .25), 0 18px 40px -20px rgb(var(--m) / .7); }
[data-hz="gece"] .nx-karo:hover::after { opacity: 1; }
[data-hz="gece"] .nx-karo-ikon { background: rgb(var(--m) / .16); color: rgb(var(--m)); box-shadow: inset 0 0 0 1px rgb(var(--m) / .3); }
[data-hz="gece"] .nx-karo-modul { min-height: 150px; }
[data-hz="gece"] .nx-karo-no { display: block; position: absolute; right: 16px; top: 14px; font: 600 12px "Space Grotesk", monospace; color: rgb(var(--m)); opacity: .8; }
[data-hz="gece"] .nx-karo-ad { font-weight: 600; letter-spacing: -.01em; }
[data-hz="gece"] .nx-hap { background: rgb(255 255 255 / .04); border-color: rgb(255 255 255 / .08); }
[data-hz="gece"] .nx-pencere { background: rgb(var(--sheet) / .85); border-color: rgb(255 255 255 / .08); box-shadow: 0 24px 60px -30px rgb(0 0 0 / .8); backdrop-filter: blur(10px); }
[data-hz="gece"] .nx-karsila { background: linear-gradient(120deg, #6366F1, #06B6D4); }
[data-hz="gece"] h1, [data-hz="gece"] h2 { font-family: var(--baslik); }

/* ---------- 4 · Kâğıt: muhasebe defteri; krem kâğıt, serif başlıklar, ince çizgiler ---------- */
html[data-hz="kagit"] {
  --paper: 245 240 229; --sheet: 251 248 240; --raised: 240 233 219; --line: 214 202 178; --rule: 230 221 202;
  --graphite: 30 26 20; --muted: 108 97 80; --ink: 154 52 18; --ink-soft: 243 224 210;
  --b1: #1E1A14; --b2: #1E1A14; --g1: #9A3412; --g2: #B45309; --g3: #A16207;
  --kr: 2px; --baslik: "Fraunces", Georgia, serif;
}
[data-hz="kagit"] body { background: rgb(var(--paper)); background-image: radial-gradient(rgb(120 100 70 / .07) 1px, transparent 1px); background-size: 22px 22px; }
[data-hz="kagit"] .nx-ust, [data-hz="kagit"] .nx-sekmeler { background: rgb(var(--paper)); border-color: rgb(var(--graphite)); }
[data-hz="kagit"] .nx-tab { border-radius: 0; }
[data-hz="kagit"] .nx-tab-on { background: rgb(var(--sheet)); border-color: rgb(var(--graphite)); font-family: var(--baslik); font-style: italic; }
[data-hz="kagit"] .nx-bant { background: none; color: rgb(var(--graphite)); box-shadow: none; border-radius: 0; padding: 8px 0 18px; border-bottom: 3px double rgb(var(--graphite)); }
[data-hz="kagit"] .nx-bant-ust { text-transform: uppercase; letter-spacing: .14em; font-size: 11px; opacity: 1; color: rgb(var(--muted)); }
[data-hz="kagit"] .nx-bant-baslik { font-size: clamp(30px, 4.4vw, 48px); font-weight: 500; letter-spacing: -.02em; font-variation-settings: "opsz" 144; }
[data-hz="kagit"] .nx-bant-alt { font-style: italic; font-family: var(--baslik); font-size: 15px; opacity: 1; color: rgb(var(--muted)); }
[data-hz="kagit"] .nx-bant-ara { background: rgb(var(--sheet)); color: rgb(var(--graphite)); border-color: rgb(var(--graphite)); border-radius: 0; }
[data-hz="kagit"] .nx-bant-ara kbd { background: rgb(var(--raised)); }
[data-hz="kagit"] .nx-karolar { gap: 0; border-top: 1px solid rgb(var(--graphite)); border-left: 1px solid rgb(var(--line)); }
[data-hz="kagit"] .nx-karo { border: 0; border-right: 1px solid rgb(var(--line)); border-bottom: 1px solid rgb(var(--line)); background: transparent; min-height: 132px; padding: 18px; animation: none; }
[data-hz="kagit"] .nx-karolar-ekran .nx-karo { min-height: 96px; }
[data-hz="kagit"] .nx-karo:hover { transform: none; box-shadow: none; background: rgb(var(--sheet)); }
[data-hz="kagit"] .nx-karo:hover .nx-karo-ad { text-decoration: underline; text-decoration-color: rgb(var(--m)); text-underline-offset: 4px; }
[data-hz="kagit"] .nx-karo-no { display: block; font: 500 28px/1 var(--baslik); font-style: italic; color: rgb(var(--m)); }
[data-hz="kagit"] .nx-karo-modul .nx-karo-ikon, [data-hz="kagit"] .nx-karo-grup .nx-karo-ikon { display: none; }
[data-hz="kagit"] .nx-karo-ikon { width: 28px; height: 28px; border-radius: 0; background: none; color: rgb(var(--m)); }
[data-hz="kagit"] .nx-karo-ad { font-family: var(--baslik); font-size: 18px; font-weight: 500; }
[data-hz="kagit"] .nx-karo-ekran .nx-karo-ad { font-family: inherit; font-size: 14px; font-weight: 500; }
[data-hz="kagit"] .nx-hap { border-radius: 0; background: transparent; border-color: rgb(var(--line)); }
[data-hz="kagit"] .nx-bolum-baslik { color: rgb(var(--graphite)); border-bottom: 1px solid rgb(var(--graphite)); padding-bottom: 6px; }
[data-hz="kagit"] .nx-bolum-say { background: none; color: rgb(var(--muted)); font-family: var(--baslik); font-style: italic; font-size: 13px; }
[data-hz="kagit"] .nx-pencere { border-radius: 0; border-color: rgb(var(--graphite)); background: rgb(var(--sheet)); box-shadow: 6px 6px 0 rgb(var(--graphite) / .08); }
[data-hz="kagit"] .nx-arac, [data-hz="kagit"] .nx-in, [data-hz="kagit"] .nx-bul, [data-hz="kagit"] .panel, [data-hz="kagit"] .nx-ftab { border-radius: 0; }
[data-hz="kagit"] .nx-in { background: transparent; border-width: 0 0 1px; border-color: rgb(var(--graphite) / .5); }
[data-hz="kagit"] .nx-in:focus { box-shadow: none; border-color: rgb(var(--ink)); }
[data-hz="kagit"] .nx-arac-ana { background: rgb(var(--graphite)); }
[data-hz="kagit"] .nx-karsila { background: rgb(var(--graphite)); border-radius: 0; box-shadow: none; }
[data-hz="kagit"] h1, [data-hz="kagit"] h2 { font-family: var(--baslik); font-weight: 500; }
[data-hz="kagit"] .nx-menu { background: rgb(var(--paper)); }

/* ---------- 5 · Kompakt: yoğun iş ekranı; küçük köşeler, satır karolar, yeşil-mavi vurgu ---------- */
html[data-hz="kompakt"] {
  --paper: 241 243 245; --sheet: 255 255 255; --raised: 247 248 250; --line: 222 226 231; --rule: 234 237 241;
  --graphite: 17 24 39; --muted: 100 110 125; --ink: 13 128 120; --ink-soft: 220 243 240;
  --b1: #0D8078; --b2: #0D8078; --g1: #14B8A6; --g2: #38BDF8; --g3: #FACC15;
  --kr: 6px;
}
[data-hz="kompakt"] body { font-size: 13px; background: rgb(var(--paper)); }
[data-hz="kompakt"] .nx-ust { height: 48px; }
[data-hz="kompakt"] .nx-sekmeler { background: rgb(var(--sheet)); padding-top: 0; }
[data-hz="kompakt"] .nx-tab { border: 0; border-radius: 0; padding: 10px 12px; }
[data-hz="kompakt"] .nx-tab-on { background: transparent; box-shadow: inset 0 -2px 0 rgb(var(--ink)); color: rgb(var(--ink)); margin-bottom: 0; }
[data-hz="kompakt"] .nx-karo-alan { max-width: 1400px; }
[data-hz="kompakt"] .nx-bant { padding: 14px 16px; border-radius: 6px; background: rgb(var(--sheet)); color: rgb(var(--graphite)); border: 1px solid rgb(var(--line)); box-shadow: none; align-items: center; }
[data-hz="kompakt"] .nx-bant-baslik { font-size: 20px; }
[data-hz="kompakt"] .nx-bant-ust, [data-hz="kompakt"] .nx-bant-alt { color: rgb(var(--muted)); opacity: 1; }
[data-hz="kompakt"] .nx-bant-ara { background: rgb(var(--raised)); color: rgb(var(--muted)); border-color: rgb(var(--line)); border-radius: 6px; height: 34px; }
[data-hz="kompakt"] .nx-bant-ara kbd { background: rgb(var(--sheet)); }
[data-hz="kompakt"] .nx-karolar { gap: 8px; }
@media (min-width: 1024px) { [data-hz="kompakt"] .nx-karolar-ekran { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
[data-hz="kompakt"] .nx-karo { flex-direction: row; align-items: center; gap: 10px; min-height: 0; padding: 10px 12px; box-shadow: inset 3px 0 0 rgb(var(--m)); animation: none; }
[data-hz="kompakt"] .nx-karo:hover { transform: none; box-shadow: inset 3px 0 0 rgb(var(--m)), 0 2px 8px -4px rgb(17 24 39 / .2); background: rgb(var(--m) / .04); }
[data-hz="kompakt"] .nx-karo-ikon { width: 30px; height: 30px; border-radius: 6px; }
[data-hz="kompakt"] .nx-karo-ikon svg { width: 16px; height: 16px; }
[data-hz="kompakt"] .nx-karo-ad { font-size: 13.5px; font-weight: 600; }
[data-hz="kompakt"] .nx-karo-ekran .nx-karo-ad { font-size: 13px; font-weight: 500; }
[data-hz="kompakt"] .nx-karo-alt { -webkit-line-clamp: 1; margin-top: 0; }
[data-hz="kompakt"] .nx-karo-ok { display: block; margin-left: auto; width: 14px; height: 14px; flex-shrink: 0; color: rgb(var(--muted)); }
[data-hz="kompakt"] .nx-hap { height: 28px; border-radius: 6px; font-size: 12.5px; }
[data-hz="kompakt"] .nx-pencere { border-radius: 6px; }
[data-hz="kompakt"] .nx-arac, [data-hz="kompakt"] .nx-in, [data-hz="kompakt"] .nx-bul, [data-hz="kompakt"] .panel { border-radius: 5px; }
@media (min-width: 1024px) { [data-hz="kompakt"] .nx-in { height: 32px; font-size: 13px; } [data-hz="kompakt"] .nx-arac { height: 30px; } [data-hz="kompakt"] .nx-satir { gap: 8px; } }
[data-hz="kompakt"] .nx-karsila { background: rgb(var(--ink)); box-shadow: none; border-radius: 6px; }

/* zemin ışıkları ve üst çubuktaki seçici: tasarıma uyum */
html[data-hz="lacivert"], html[data-hz="kagit"], html[data-hz="kompakt"] { --glow: 0; }
html[data-hz="renkli"] { --isik1: 255 170 110; --isik2: 255 140 190; --isik3: 250 204 21; }
html[data-hz="gece"] { --isik1: 99 102 241; --isik2: 6 182 212; --isik3: 240 171 252; }
[data-hz="lacivert"] .nx-ust select.nx-in { padding-top: 0; padding-bottom: 0;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e"); }
[data-hz="lacivert"] .nx-ust select.nx-in { background-repeat: no-repeat; background-position: right .5rem center; background-size: 1.25em 1.25em; }
@media (max-width: 639px) { [data-hz="lacivert"] .nx-karolar, [data-hz="kompakt"] .nx-karolar { grid-template-columns: minmax(0, 1fr); } }

/* hesap menüsü üst çubuğun koyu renginden etkilenmesin */
[data-hz] .nx-hesap { color: rgb(var(--graphite)); }
[data-hz] .nx-hesap .text-muted { color: rgb(var(--muted)); }
[data-hz] .nx-hesap .nx-in { background-color: rgb(var(--sheet)); color: rgb(var(--graphite)); border-color: rgb(var(--line)); }

/* Renkli: masaüstü, rapor sayfası ve ekran pencereleri */
[data-hz="renkli"] .panel { border-color: transparent; background: rgb(255 255 255 / .92); box-shadow: 0 1px 2px rgb(60 40 20 / .05), 0 10px 30px -18px rgb(60 40 20 / .28); }
[data-hz="renkli"] .nx-modul-kart { position: relative; overflow: hidden; }
[data-hz="renkli"] .nx-modul-kart::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: rgb(var(--m)); }
[data-hz="renkli"] .nx-modul-kart .nx-karo-ikon { color: #fff; background: linear-gradient(135deg, rgb(var(--m)), rgb(var(--m) / .7)); box-shadow: 0 8px 18px -8px rgb(var(--m)); }
[data-hz="renkli"] .nx-modul-kart .nx-chip:hover { border-color: rgb(var(--m) / .5); background: rgb(var(--m) / .06); }
[data-hz="renkli"] .nx-rapor-kat { border-top: 3px solid rgb(var(--m)); }
[data-hz="renkli"] .nx-rapor-alan .nx-tur { color: rgb(var(--m)); }
[data-hz="renkli"] .nx-rapor-alan .nx-menu-btn:hover { background: rgb(var(--m) / .07); }
[data-hz="renkli"] .nx-rapor-alan h1 { font-family: var(--baslik); font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
[data-hz="renkli"] .nx-pencere > div:first-child { background: linear-gradient(90deg, rgb(255 237 222 / .7), rgb(255 255 255 / 0) 70%); }
[data-hz="renkli"] .nx-pencere h2 { font-family: var(--baslik); font-weight: 750; }
[data-hz="renkli"] .nx-hizli { border-color: transparent; background: rgb(var(--raised)); }
[data-hz="renkli"] .nx-hizli:hover { background: rgb(var(--ink-soft)); }
[data-hz="renkli"] .nx-alt { background: rgb(255 255 255 / .92); }

/* panel Canlı düzen: sayfa başı (bölüm › başlık) */
.nx-sayfa-bas { display: flex; flex-direction: column; gap: 2px; }
.nx-sayfa-bolum { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: rgb(var(--m)); }
.nx-sayfa-bolum::before { content: ""; width: 8px; height: 8px; border-radius: 3px; background: rgb(var(--m)); }
.nx-sayfa-bolum:hover { text-decoration: underline; text-underline-offset: 3px; }
.nx-sayfa-ad { font-family: var(--baslik); font-size: clamp(22px, 2.6vw, 28px); font-weight: 750; letter-spacing: -.02em; line-height: 1.2; color: rgb(var(--graphite)); }

/* --- ortak veri tablosu (tablo.js / _tablo.html): gruplama alanı, araç çubuğu, sıralama, filtre satırı ---------- */
.nxt-arac { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 6px; }
.nxt-grup { flex: 1 1 260px; min-height: 34px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 4px 8px;
  border: 1px dashed rgb(var(--line)); border-radius: 10px; background: rgb(var(--raised) / .5); transition: border-color .15s, background .15s; }
.nxt-grup.nxt-hedef { border-color: rgb(var(--ink)); background: rgb(var(--ink) / .06); }
.nxt-ipucu { font-size: 12px; color: rgb(var(--muted)); }
.nxt-cip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 4px 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 600;
  background: rgb(var(--ink) / .1); color: rgb(var(--ink)); cursor: grab; }
.nxt-cip + .nxt-cip::before { content: "›"; margin: 0 4px 0 -8px; color: rgb(var(--muted)); }
.nxt-cip button { width: 18px; height: 18px; border-radius: 999px; font-size: 10px; line-height: 18px; }
.nxt-cip button:hover { background: rgb(var(--ink) / .15); }
.nxt-grup-ac { margin-left: auto; display: flex; gap: 8px; font-size: 12px; color: rgb(var(--ink)); }
.nxt-grup-ac button:hover { text-decoration: underline; }
.nxt-sag { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.nxt-ara { display: flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px; border: 1px solid rgb(var(--line)); border-radius: 8px; background: rgb(var(--sheet)); }
.nxt-ara:focus-within { border-color: rgb(var(--ink)); }
.nxt-ara svg, .nxt-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
.nxt-ara input { width: 180px; border: 0; background: transparent; padding: 0; font-size: 13px; outline: none; box-shadow: none; }
.nxt-btn { display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 10px; border: 1px solid rgb(var(--line)); border-radius: 8px;
  background: rgb(var(--sheet)); font-size: 12.5px; color: rgb(var(--graphite)); }
.nxt-btn:hover, .nxt-btn.nxt-acik { border-color: rgb(var(--ink)); color: rgb(var(--ink)); }
.nxt-btn.nxt-acik { background: rgb(var(--ink) / .07); }
.nxt-menu { position: absolute; right: 0; top: 36px; z-index: 30; width: 240px; max-height: 340px; overflow: auto; padding: 6px; border: 1px solid rgb(var(--line));
  border-radius: 12px; background: rgb(var(--sheet)); box-shadow: 0 12px 32px rgb(0 0 0 / .14); }
.nxt-menu label { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; font-size: 13px; cursor: pointer; }
.nxt-menu label:hover { background: rgb(var(--raised)); }
.nxt-menu button { width: 100%; margin-top: 4px; padding: 7px 8px; border-top: 1px solid rgb(var(--line)); font-size: 12.5px; color: rgb(var(--ink)); text-align: left; }
.nxt-say { font-size: 12px; color: rgb(var(--muted)); white-space: nowrap; }
.nxt-tablo th.text-right { text-align: right; }
.nxt-tablo th { position: relative; user-select: none; cursor: pointer; }
.nxt-tablo th.nxt-ozel { cursor: default; }
.nxt-tablo th:hover:not(.nxt-ozel) { color: rgb(var(--graphite)); }
.nxt-tablo th.nxt-birak { box-shadow: inset 3px 0 0 rgb(var(--ink)); }
.nxt-tablo td { overflow: hidden; text-overflow: ellipsis; }
.nxt-sira { margin-left: 4px; font-size: 10px; color: rgb(var(--ink)); }
.nxt-gen { position: absolute; top: 0; right: -3px; bottom: 0; width: 7px; cursor: col-resize; z-index: 2; }
.nxt-gen:hover { background: rgb(var(--ink) / .35); }
.nxt-filtre th { padding: 3px 4px; background: rgb(var(--sheet)); cursor: default; }
.nxt-filtre input { width: 100%; min-width: 50px; height: 26px; padding: 0 6px; border: 1px solid rgb(var(--line)); border-radius: 6px; background: rgb(var(--paper));
  font-size: 12px; font-weight: 400; color: rgb(var(--graphite)); }
.nxt-filtre input:focus { border-color: rgb(var(--ink)); outline: none; box-shadow: none; }
.nxt-gsatir td { background: rgb(var(--raised) / .7); font-size: 12.5px; cursor: pointer; }
.nxt-gsatir:hover td { background: rgb(var(--ink) / .07); }
.nxt-ok { display: inline-block; width: 14px; color: rgb(var(--ink)); }
.nxt-gozet { margin-left: 10px; font-size: 12px; color: rgb(var(--muted)); font-variant-numeric: tabular-nums; }
.nxt-ozet { cursor: pointer; }
.nxt-ozet:hover { color: rgb(var(--ink)); }
.nxt-daha { display: block; width: 100%; padding: 8px; font-size: 12.5px; color: rgb(var(--ink)); border-top: 1px solid rgb(var(--line)); }
.nxt-daha:hover { background: rgb(var(--ink) / .05); }
@media (max-width: 640px) { .nxt-ara input { width: 120px; } .nxt-btn span { display: none; } }