/* ================================================================
 * SCiPNET · Area-14 Secure Intranet
 *   - Foundation OS aesthetic (boot/login/desktop/windows)
 *   - HSL tokens, hand-picked type & spacing scale (refactoring-ui)
 *   - WCAG AA, focus-visible, reduced-motion (platform-web)
 *   - Vault dark + Foundation amber + terminal cyan (ui-ux-pro-max)
 * ================================================================ */

/* ============ TOKENS ============ */
:root {
  /* Surface */
  --bg-screen:  #0a0d12;
  --bg-shell:   #11151c;
  --bg-window:  #161c25;
  --bg-header:  #1d2532;
  --bg-input:   #0c1015;

  --line-1:     #2a3344;
  --line-2:     #3b475c;

  --text-1:     #e8edf4;
  --text-2:     #a4b1c2;
  --text-3:     #6b7a90;
  --text-4:     #4a5468;

  --amber:      #f0a040;
  --amber-d:    #c97f25;
  --cyan:       #5ac8d9;
  --cyan-d:     #3aa7b8;
  --green:      #4ade80;
  --red:        #ef4444;
  --purple:     #a78bfa;
  --yellow:     #facc15;
  --orange:     #fb923c;

  --mono:  ui-monospace, "JetBrains Mono", "Source Code Pro", "Consolas", "Liberation Mono", monospace;
  --serif: "IBM Plex Serif", Georgia, "Times New Roman", serif;
  --sans:  -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  --scan-1: 0 1px 2px rgba(0,0,0,0.6);
  --scan-2: 0 4px 12px rgba(0,0,0,0.6), 0 2px 4px rgba(0,0,0,0.4);
  --scan-3: 0 24px 48px rgba(0,0,0,0.7), 0 8px 16px rgba(0,0,0,0.5);

  --t-fast: 100ms cubic-bezier(.4,0,.2,1);
  --t-base: 200ms cubic-bezier(.4,0,.2,1);

  /* ===== FAZ 19 — Polish Tokens ===== */
  /* Spacing scale (4px base) */
  --sp-0: 0;
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;

  /* Type scale */
  --tx-2xs: 9px;
  --tx-xs:  10px;
  --tx-sm:  11px;
  --tx-md:  12px;
  --tx-lg:  13px;
  --tx-xl:  15px;
  --tx-2xl: 18px;
  --tx-3xl: 22px;
  --tx-4xl: 28px;

  /* Line height */
  --lh-tight: 1.25;
  --lh-snug:  1.4;
  --lh-base:  1.55;
  --lh-loose: 1.75;

  /* Transitions */
  --t-slow: 380ms cubic-bezier(.4,0,.2,1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Glow shadows (subtle but readable) */
  --glow-cyan-sm:  0 0 8px rgba(90, 200, 217, 0.25);
  --glow-cyan-md:  0 0 14px rgba(90, 200, 217, 0.32);
  --glow-cyan-lg:  0 0 22px rgba(90, 200, 217, 0.40);
  --glow-amber-sm: 0 0 8px rgba(240, 160, 64, 0.28);
  --glow-amber-md: 0 0 14px rgba(240, 160, 64, 0.36);
  --glow-green-sm: 0 0 8px rgba(74, 222, 128, 0.30);
  --glow-green-md: 0 0 14px rgba(74, 222, 128, 0.40);
  --glow-red-sm:   0 0 8px rgba(239, 68, 68, 0.30);
  --glow-red-md:   0 0 14px rgba(239, 68, 68, 0.42);
  --glow-purple-sm:0 0 8px rgba(192, 132, 252, 0.30);
  --glow-purple-md:0 0 14px rgba(192, 132, 252, 0.42);

  /* Border-radius (Foundation is mostly square, very subtle softening) */
  --r-0: 0;
  --r-1: 1px;
  --r-2: 2px;
  --r-pill: 999px;

  /* Focus ring */
  --focus-ring: 0 0 0 1px var(--cyan), var(--glow-cyan-sm);

  /* Departman accent renkleri (consistent across apps) */
  --dept-bilim:      var(--cyan);
  --dept-medikal:    var(--green);
  --dept-guvenlik:   var(--red);
  --dept-mtf:        var(--orange);
  --dept-muhendis:   var(--yellow);
  --dept-etik:       #c084fc;
  --dept-idari:      var(--amber);
  --dept-o5:         #c084fc;
}

/* ============ TEMALAR ============ */
/* Yeşil terminal (klasik UNIX) */
body[data-theme="green"] {
  --bg-screen: #050a08;
  --bg-shell:  #0a1410;
  --bg-window: #0d1a16;
  --bg-header: #102420;
  --bg-input:  #07100c;
  --line-1:    #1c3a2e;
  --line-2:    #2a5544;
  --text-1:    #c8f0d2;
  --text-2:    #7eb892;
  --text-3:    #4e7a5e;
  --amber:     #4ade80;
  --amber-d:   #2da55c;
  --cyan:      #7ee8a8;
}
/* Kırmızı alarm / breach mode */
body[data-theme="red"] {
  --bg-screen: #0c0606;
  --bg-shell:  #160c0c;
  --bg-window: #1c1010;
  --bg-header: #251515;
  --bg-input:  #0a0404;
  --line-1:    #3a1f1f;
  --line-2:    #5a2828;
  --text-1:    #f4d8d8;
  --text-2:    #c08888;
  --text-3:    #804040;
  --amber:     #ff6464;
  --amber-d:   #c93030;
  --cyan:      #ff9090;
}
/* Mavi monitör (kurumsal) */
body[data-theme="blue"] {
  --bg-screen: #07101c;
  --bg-shell:  #0d1a2a;
  --bg-window: #142238;
  --bg-header: #1c2e48;
  --bg-input:  #050d18;
  --line-1:    #1f3858;
  --line-2:    #2f5080;
  --text-1:    #d8e8ff;
  --text-2:    #8aa8d0;
  --text-3:    #4a6890;
  --amber:     #5db8ff;
  --amber-d:   #2d8acc;
  --cyan:      #80d4ff;
}

/* Komut paleti (Ctrl+K) */
.cmd-overlay {
  position: fixed; inset: 0; z-index: 700;
  background: rgba(0,0,0,0.55);
  backdrop-filter: blur(4px);
  display: flex; align-items: flex-start; justify-content: center;
  padding-top: 12vh;
  animation: cmdFadeIn 120ms ease-out;
}
@keyframes cmdFadeIn { from { opacity: 0; } to { opacity: 1; } }
.cmd-palette {
  width: 640px; max-width: 92vw;
  background: var(--bg-window);
  border: 1px solid var(--line-2);
  box-shadow: 0 24px 60px rgba(0,0,0,0.7);
  font-family: var(--mono);
}
.cmd-head {
  padding: 14px 16px; border-bottom: 1px solid var(--line-1);
  display: flex; align-items: center; gap: 10px;
}
.cmd-head .cmd-icon { color: var(--amber); font-size: 18px; }
.cmd-head input {
  flex: 1;
  background: transparent; border: 0; outline: 0;
  color: var(--text-1); font-family: var(--mono); font-size: 14px;
}
.cmd-results { max-height: 480px; overflow-y: auto; }
.cmd-item {
  padding: 10px 16px; cursor: pointer;
  display: grid; grid-template-columns: 24px 1fr auto; gap: 10px; align-items: center;
  border-bottom: 1px solid var(--line-1);
  transition: background 80ms;
}
.cmd-item:hover, .cmd-item.active { background: rgba(240, 160, 64, 0.10); }
.cmd-item .ico { font-size: 16px; color: var(--cyan); }
.cmd-item .body { min-width: 0; }
.cmd-item .body .t { color: var(--text-1); font-size: 13px; font-weight: 600; }
.cmd-item .body .m { color: var(--text-3); font-size: 11px; }
.cmd-item .tag {
  font-size: 9px; padding: 2px 6px; letter-spacing: 1px;
  border: 1px solid var(--line-2); color: var(--text-2);
}
.cmd-empty { padding: 30px; text-align: center; color: var(--text-3); font-size: 12px; }
.cmd-foot {
  padding: 8px 16px; border-top: 1px solid var(--line-1);
  font-size: 10px; color: var(--text-3); display: flex; gap: 12px;
}
.cmd-foot kbd {
  background: var(--bg-input); border: 1px solid var(--line-2);
  padding: 1px 5px; font-family: var(--mono); color: var(--text-2);
}

/* Sağ tık masaüstü menüsü */
.ctx-menu {
  position: fixed; z-index: 750;
  background: var(--bg-window);
  border: 1px solid var(--line-2);
  box-shadow: 0 12px 32px rgba(0,0,0,0.6);
  min-width: 220px;
  font-family: var(--mono); font-size: 12px;
  animation: cmdFadeIn 80ms ease-out;
}
.ctx-item {
  padding: 8px 14px; cursor: pointer;
  display: flex; align-items: center; gap: 10px;
  color: var(--text-1);
  transition: background 80ms;
  position: relative;
}
.ctx-item:hover { background: rgba(240, 160, 64, 0.10); color: var(--amber); }
.ctx-item .ico { width: 16px; text-align: center; color: var(--cyan); }
.ctx-sep { height: 1px; background: var(--line-1); margin: 4px 0; }
.ctx-sub {
  position: absolute; left: 100%; top: 0;
  background: var(--bg-window); border: 1px solid var(--line-2);
  min-width: 180px; display: none;
}
.ctx-item:hover > .ctx-sub { display: block; }
.ctx-item .arrow { margin-left: auto; color: var(--text-3); }

/* Klavye kısayol help modali */
.kbd-help-overlay { position: fixed; inset: 0; z-index: 760; background: rgba(0,0,0,0.6); display: flex; align-items: center; justify-content: center; animation: cmdFadeIn 120ms; }
.kbd-help-panel {
  background: var(--bg-window); border: 1px solid var(--line-2);
  width: 560px; max-width: 92vw; max-height: 80vh; overflow-y: auto;
  font-family: var(--mono);
}
.kbd-help-panel h2 {
  padding: 14px 18px; border-bottom: 1px solid var(--line-1);
  color: var(--amber); font-size: 13px; letter-spacing: 2px;
  display: flex; justify-content: space-between; align-items: center;
}
.kbd-help-panel h2 button {
  background: transparent; border: 0; color: var(--text-3); font-size: 18px; cursor: pointer;
}
.kbd-row {
  padding: 8px 18px; display: grid; grid-template-columns: 160px 1fr;
  gap: 12px; align-items: center; border-bottom: 1px solid var(--line-1);
}
.kbd-row .keys { display: flex; gap: 4px; align-items: center; }
.kbd-row kbd {
  background: var(--bg-input); border: 1px solid var(--line-2);
  padding: 3px 7px; font-family: var(--mono); color: var(--amber);
  font-size: 11px; min-width: 22px; text-align: center;
}
.kbd-row .desc { color: var(--text-2); font-size: 12px; }
.kbd-sec {
  padding: 8px 18px; background: var(--bg-shell);
  color: var(--text-3); font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase;
}

/* ============ RESET + GLOBAL ============ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: var(--mono);
  font-size: 13px;
  line-height: 1.5;
  color: var(--text-1);
  background: var(--bg-screen);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}
button { font: inherit; color: inherit; background: transparent; border: 0; cursor: pointer; }
input, textarea, select { font: inherit; color: inherit; background: transparent; border: 0; outline: 0; }
:focus-visible { outline: 1px solid var(--amber); outline-offset: 2px; }

/* CRT overlay */
.crt-overlay {
  position: fixed; inset: 0; pointer-events: none; z-index: 9999;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,0.18) 0 1px, transparent 1px 3px),
    radial-gradient(ellipse at center, transparent 60%, rgba(0,0,0,0.55) 100%);
  mix-blend-mode: multiply;
}
.crt-flicker { animation: flicker 7s infinite; }
@keyframes flicker {
  0%, 100% { opacity: 1; }
  47% { opacity: 1; } 48% { opacity: 0.85; } 49% { opacity: 1; }
  90% { opacity: 1; } 91% { opacity: 0.92; } 92% { opacity: 1; }
}

* { scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: var(--line-2); }
*::-webkit-scrollbar-thumb:hover { background: var(--text-3); }

/* ============ BOOT ============ */
.boot {
  position: fixed; inset: 0; z-index: 200;
  background: #000;
  color: var(--green);
  padding: 24px;
  font: 13px/1.5 var(--mono);
  overflow: hidden;
}
.boot .line { white-space: pre; opacity: 0; animation: fadein 200ms forwards; }
.boot .line.warn { color: var(--amber); }
.boot .line.err  { color: var(--red); }
.boot .line.ok   { color: var(--green); }
.boot .cursor {
  display: inline-block; width: 8px; height: 14px;
  background: var(--green); vertical-align: middle; margin-left: 4px;
  animation: blink 1s steps(2) infinite;
}
@keyframes blink { 50% { opacity: 0; } }
@keyframes fadein { to { opacity: 1; } }

/* ============ LOGIN ============ */
.login {
  position: fixed; inset: 0; z-index: 150;
  display: none;
  align-items: center; justify-content: center;
  background:
    radial-gradient(ellipse 800px 600px at 50% 30%, rgba(240,160,64,0.10), transparent 70%),
    #0a0d12;
  overflow: hidden;
}
.login.on { display: flex; }
.login::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 24px 24px;
}
.login-box {
  position: relative;
  width: 480px; max-width: 90vw;
  background: var(--bg-window);
  border: 1px solid var(--amber);
  box-shadow: 0 0 60px rgba(240,160,64,0.18), 0 24px 48px rgba(0,0,0,0.7);
  padding: 32px;
}
.login-box::before {
  content: ""; position: absolute; top: 6px; left: 6px; right: 6px; bottom: 6px;
  pointer-events: none;
  background:
    linear-gradient(to right,  var(--amber) 14px, transparent 14px) top    left  / 14px 1px no-repeat,
    linear-gradient(to bottom, var(--amber) 14px, transparent 14px) top    left  /  1px 14px no-repeat,
    linear-gradient(to left,   var(--amber) 14px, transparent 14px) top    right / 14px 1px no-repeat,
    linear-gradient(to bottom, var(--amber) 14px, transparent 14px) top    right /  1px 14px no-repeat,
    linear-gradient(to right,  var(--amber) 14px, transparent 14px) bottom left  / 14px 1px no-repeat,
    linear-gradient(to top,    var(--amber) 14px, transparent 14px) bottom left  /  1px 14px no-repeat,
    linear-gradient(to left,   var(--amber) 14px, transparent 14px) bottom right / 14px 1px no-repeat,
    linear-gradient(to top,    var(--amber) 14px, transparent 14px) bottom right /  1px 14px no-repeat;
  opacity: 0.7;
}
.login-banner { text-align: center; margin-bottom: 24px; }
.login-banner .ascii {
  color: var(--amber);
  font-family: var(--mono);
  font-size: 9px;
  line-height: 1;
  letter-spacing: 0;
  white-space: pre;
  margin-bottom: 12px;
  display: inline-block;
  text-align: left;
}
.login-banner h1 { font-size: 18px; letter-spacing: 4px; color: var(--text-1); margin-bottom: 4px; }
.login-banner p { font-size: 11px; color: var(--text-3); letter-spacing: 2px; }
.login-form .row { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.login-form .row label { color: var(--cyan); width: 110px; font-size: 12px; }
.login-form .row input {
  flex: 1; padding: 8px 10px; background: var(--bg-input);
  border: 1px solid var(--line-2); color: var(--text-1);
}
.login-form .row input:focus { border-color: var(--amber); }
.login-form .row input.fake { color: var(--green); }
.login-form .meta {
  font-size: 11px; color: var(--text-3);
  margin-top: 12px; padding-top: 12px;
  border-top: 1px solid var(--line-1);
  display: flex; justify-content: space-between;
}
.login-form .meta .ok { color: var(--green); }
.login-status {
  text-align: center; margin-top: 18px; font-size: 12px;
  color: var(--text-3); min-height: 18px;
}
.login-status.ok  { color: var(--green); }
.login-status.err { color: var(--red); }

/* Auth tabs (GİRİŞ / KAYIT) */
.auth-tabs {
  display: flex; gap: 0; margin-bottom: 18px;
  border-bottom: 1px solid var(--line-2);
}
.auth-tabs button {
  flex: 1;
  padding: 8px 12px;
  font-family: var(--mono);
  font-size: 11px; font-weight: 700; letter-spacing: 2px;
  color: var(--text-3);
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  transition: color var(--t-fast), border-color var(--t-fast);
}
.auth-tabs button:hover { color: var(--text-1); }
.auth-tabs button.active {
  color: var(--amber);
  border-bottom-color: var(--amber);
}

/* Login submit button (full-width amber) */
.login-submit {
  width: 100%;
  margin-top: 6px;
  padding: 10px 14px;
  background: var(--amber);
  color: #000;
  font-family: var(--mono);
  font-size: 12px; font-weight: 700; letter-spacing: 2px;
  border: 0; cursor: pointer;
  transition: background var(--t-fast);
}
.login-submit:hover { background: var(--amber-d); }
.login-submit:active { transform: translateY(1px); }

/* ============ DESKTOP ============ */
.desktop {
  position: fixed; inset: 0;
  display: none;
  flex-direction: column;
  background:
    radial-gradient(ellipse 1000px 700px at 50% 100%, rgba(240,160,64,0.06), transparent 60%),
    radial-gradient(ellipse 600px 400px at 0% 0%, rgba(90,200,217,0.05), transparent 60%),
    var(--bg-screen);
}
.desktop.on { display: flex; }
.desktop::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 48px 48px;
}

.desk-watermark {
  position: absolute; right: 32px; bottom: 64px;
  text-align: right;
  color: rgba(240,160,64,0.10);
  font-family: var(--serif);
  pointer-events: none; z-index: 0;
}
.desk-watermark .big { font-size: 96px; font-weight: 700; letter-spacing: -2px; line-height: 0.9; }
.desk-watermark .small { font-size: 16px; letter-spacing: 6px; margin-top: 6px; }

/* 3D dönen SCP Foundation logosu — desktop merkezi */
.scp-logo-3d {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 400px;
  height: 400px;
  margin-top: -200px;
  margin-left: -200px;
  pointer-events: none;
  z-index: 0;
  color: rgba(250, 204, 21, 0.30);
  filter: drop-shadow(0 0 20px rgba(250, 204, 21, 0.14));
  /* 3D perspektif */
  perspective: 900px;
  transform-style: preserve-3d;
  /* GPU compositing — flicker önler. NOT: backface-visibility KULLANMA,
     logo arkası dönerken yok olur. */
  will-change: transform;
}
.scp-logo-3d svg {
  width: 100%;
  height: 100%;
  display: block;
  transform-origin: 50% 50%;
  animation: scpSpin3D 24s linear infinite;
  will-change: transform;
  /* Arka yüz görünür kalmalı — logo dönerken 'aynalı' versiyonu da gözüksün */
  backface-visibility: visible;
  -webkit-backface-visibility: visible;
}
@keyframes scpSpin3D {
  0%   { transform: rotateY(0deg)   rotateX(8deg); }
  100% { transform: rotateY(360deg) rotateX(8deg); }
}
/* NOT: hover speed-up KALDIRILDI — `:hover` toggle animation-duration'ı değiştirip
   animasyonu restart ettiriyordu, mouse pencere dışına çıkıp gelince flicker yaratıyordu. */

@media (max-width: 768px) {
  .scp-logo-3d { width: 260px; height: 260px; margin-top: -130px; margin-left: -130px; }
}
@media (prefers-reduced-motion: reduce) {
  .scp-logo-3d svg { animation: none; }
}

.icon-area {
  flex: 1; position: relative; padding: 24px;
  display: grid; grid-template-columns: repeat(auto-fill, 96px); grid-auto-rows: 100px; gap: 8px;
  align-content: start; z-index: 1;
}
.desk-icon {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 8px; border: 1px solid transparent; cursor: pointer;
  transition: background var(--t-fast), border-color var(--t-fast);
  /* Drag esnasında text selection olmasın (Windows feeling) */
  user-select: none;
  -webkit-user-select: none;
  width: 96px;  /* sabit boyut — absolute pozisyon için tutarlı */
  height: 100px;
}
.desk-icon:hover, .desk-icon:focus-visible {
  background: rgba(255,255,255,0.04); border-color: var(--line-1);
}
.desk-icon .glyph {
  width: 48px; height: 48px;
  border: 1px solid var(--line-2);
  background: var(--bg-window);
  display: grid; place-items: center;
  color: var(--amber);
}
.desk-icon .glyph svg { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 1.6; }
.desk-icon.cyan   .glyph { color: var(--cyan); }
.desk-icon.green  .glyph { color: var(--green); }
.desk-icon.red    .glyph { color: var(--red); }
.desk-icon.purple .glyph { color: var(--purple); }
.desk-icon.yellow .glyph { color: var(--yellow); }
.desk-icon.orange .glyph { color: var(--orange); }
.desk-icon .label { font-size: 11px; color: var(--text-2); text-align: center; letter-spacing: 0.5px; }
.desk-icon .label .ext { color: var(--text-4); }

/* ============ TASKBAR + START ============ */
.taskbar {
  height: 36px;
  background: var(--bg-shell);
  border-top: 1px solid var(--line-2);
  display: flex; align-items: stretch;
  position: relative; z-index: 100;
  font-size: 12px;
}
.tb-start {
  display: flex; align-items: center; gap: 8px;
  padding: 0 14px;
  background: var(--bg-header);
  border-right: 1px solid var(--line-2);
  color: var(--amber); font-weight: 700; letter-spacing: 1.5px;
}
.tb-start::before {
  content: ""; display: inline-block;
  width: 10px; height: 10px;
  background: var(--amber); box-shadow: 0 0 8px var(--amber);
}
.tb-start:hover { background: var(--bg-window); }
.tb-tasks { display: flex; align-items: stretch; flex: 1; min-width: 0; overflow-x: auto; }
.tb-task {
  display: flex; align-items: center; gap: 6px;
  padding: 0 12px; border-right: 1px solid var(--line-1);
  color: var(--text-2);
  white-space: nowrap; max-width: 220px; overflow: hidden; text-overflow: ellipsis;
}
.tb-task:hover { background: var(--bg-window); color: var(--text-1); }
.tb-task.active { background: var(--bg-window); color: var(--amber); border-bottom: 2px solid var(--amber); }
.tb-task svg { width: 14px; height: 14px; }
.tb-tray {
  display: flex; align-items: center; gap: 10px;
  padding: 0 16px;
  border-left: 1px solid var(--line-2);
  background: var(--bg-header);
  color: var(--text-2);
}
.tb-tray .led { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 6px var(--green); }
.tb-tray .user { color: var(--cyan); }
.tb-tray .clock { color: var(--text-1); font-weight: 700; min-width: 64px; text-align: right; }
.tb-tray .threat {
  padding: 1px 8px; font-size: 11px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase;
  border: 1px solid currentColor;
}
.tb-tray .threat.yellow  { color: var(--yellow); }
.tb-tray .threat.orange  { color: var(--orange); }
.tb-tray .threat.red     {
  color: var(--red);
  background: rgba(239, 68, 68, 0.1);
  animation: threatPulse 900ms ease-in-out infinite;
}
@keyframes threatPulse {
  0%, 100% { background: rgba(239, 68, 68, 0.08); box-shadow: 0 0 0 rgba(239, 68, 68, 0); }
  50%      { background: rgba(239, 68, 68, 0.30); box-shadow: 0 0 12px rgba(239, 68, 68, 0.6); }
}

/* Notification bell */
.tb-notify {
  position: relative;
  background: transparent;
  border: 1px solid transparent;
  color: var(--text-2);
  padding: 4px 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: color 120ms, border-color 120ms;
}
.tb-notify:hover { color: var(--amber); border-color: var(--line-2); }
.tb-notify.has-unread { color: var(--amber); }
.tb-notify .badge {
  position: absolute;
  top: -2px;
  right: -2px;
  background: var(--red);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  padding: 1px 4px;
  border-radius: 8px;
  font-family: var(--mono);
  min-width: 14px;
  text-align: center;
  line-height: 1.2;
}

.notify-panel {
  position: fixed;
  bottom: 40px;
  right: 8px;
  width: 360px;
  max-height: 480px;
  background: var(--bg-window);
  border: 1px solid var(--line-2);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.6);
  z-index: 600;
  display: flex;
  flex-direction: column;
  font-family: var(--mono);
}
.notify-head {
  padding: 10px 14px;
  background: var(--bg-header);
  border-bottom: 1px solid var(--line-2);
  font-size: 11px;
  letter-spacing: 1.5px;
  color: var(--amber);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.notify-body {
  overflow-y: auto;
  flex: 1;
}
.notify-item {
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
  display: grid;
  grid-template-columns: 22px 1fr auto;
  gap: 8px;
  align-items: start;
}
.notify-item:hover { background: rgba(90, 200, 217, 0.06); }
.notify-item .ico { font-size: 14px; color: var(--cyan); }
.notify-item .body { min-width: 0; }
.notify-item .body .t { color: var(--text-1); font-size: 12px; line-height: 1.4; }
.notify-item .body .m { color: var(--text-3); font-size: 11px; margin-top: 2px; }
.notify-item .ts { color: var(--text-3); font-size: 10px; white-space: nowrap; }
.notify-item.unread .body .t { color: var(--amber); font-weight: 700; }
.notify-empty {
  padding: 30px 14px;
  text-align: center;
  color: var(--text-3);
  font-size: 12px;
}

/* Threat RED visual takeover */
.threat-red-overlay {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 5;
  background: radial-gradient(ellipse at center,
    rgba(239, 68, 68, 0) 40%,
    rgba(239, 68, 68, 0.15) 80%,
    rgba(239, 68, 68, 0.35) 100%);
  opacity: 0;
  transition: opacity 600ms;
}
body.threat-red .threat-red-overlay {
  opacity: 1;
  animation: threatRedFlicker 1800ms ease-in-out infinite;
}
@keyframes threatRedFlicker {
  0%, 100% { opacity: 0.8; }
  45%      { opacity: 1; }
  50%      { opacity: 0.55; }
  55%      { opacity: 1; }
}
body.threat-red .taskbar {
  border-top-color: var(--red);
  box-shadow: 0 -2px 12px rgba(239, 68, 68, 0.4);
}

/* Classified (Thaumiel/Apollyon — L5 altı) sidebar item */
.fb-sidebar .item.classified {
  background: linear-gradient(90deg, rgba(74,18,18,0.18), transparent 60%);
  border-left: 2px solid #4a1212;
  cursor: not-allowed;
  pointer-events: auto;
}
.fb-sidebar .item.classified::before {
  content: "⚠";
  margin-right: 6px;
  color: #7a1f1f;
}

/* ============================================================
   FAZ 10A — Admin Requests
   ============================================================ */
.req-row {
  display: grid;
  grid-template-columns: 40px 1fr 110px;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.req-row:hover { background: rgba(90, 200, 217, 0.06); }
.req-row.sel  { background: rgba(250, 204, 21, 0.08); border-left: 2px solid var(--amber); }
.req-ico {
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.req-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.req-head {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.req-head .req-id {
  color: var(--amber);
  font-weight: 700;
  font-family: var(--mono);
  font-size: 11px;
}
.req-head .req-type {
  color: var(--text-2);
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.req-subject {
  color: var(--text-1);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.req-meta {
  color: var(--text-3);
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.req-status {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* ============================================================
   FAZ 10B — Bulletin cards
   ============================================================ */
.bul-card {
  background: var(--bg-window);
  border: 1px solid var(--line-2);
  padding: 14px 16px;
  margin-bottom: 12px;
  cursor: pointer;
  transition: border-color 120ms, transform 120ms;
}
.bul-card:hover {
  border-color: var(--cyan);
  transform: translateX(2px);
}
.bul-card.pinned {
  border-left: 3px solid var(--amber);
  background: linear-gradient(90deg, rgba(250,204,21,0.06), transparent 50%);
}
.bul-card.expired,
.bul-card.archived {
  opacity: 0.55;
}
.bul-card .bul-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.bul-card .bul-ico {
  font-size: 20px;
  flex-shrink: 0;
}
.bul-card .bul-meta {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
  flex: 1;
  min-width: 0;
}
.bul-card .bul-id {
  color: var(--amber);
  font-family: var(--mono);
  font-weight: 700;
  font-size: 11px;
}
.bul-card .bul-type {
  color: var(--text-2);
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}
.bul-card .bul-aud {
  color: var(--text-3);
  font-size: 10px;
  font-family: var(--mono);
  letter-spacing: 1px;
  flex-shrink: 0;
}
.bul-card .bul-title {
  font-size: 15px;
  color: var(--text-1);
  margin-bottom: 6px;
  line-height: 1.3;
}
.bul-card .bul-body {
  color: var(--text-2);
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 8px;
  white-space: pre-wrap;
}
.bul-card .bul-foot {
  color: var(--text-3);
  font-size: 11px;
  border-top: 1px dashed var(--line-1);
  padding-top: 6px;
}

/* ============================================================
   FAZ 10C — Discipline rows
   ============================================================ */
.disc-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  align-items: start;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.disc-row:hover { background: rgba(239, 68, 68, 0.04); }
.disc-ico {
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.disc-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.disc-head {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.disc-head .disc-id {
  color: var(--amber);
  font-weight: 700;
  font-family: var(--mono);
  font-size: 11px;
}
.disc-head .disc-level {
  color: var(--text-2);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.disc-reason {
  color: var(--text-1);
  font-size: 13px;
  line-height: 1.4;
}
.disc-meta {
  color: var(--text-3);
  font-size: 11px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

/* ============================================================
   FAZ 10D — Visitors + İdari Dashboard
   ============================================================ */
.vis-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.vis-row:hover { background: rgba(90, 200, 217, 0.06); }
.vis-ico { font-size: 22px; }
.vis-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.vis-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.vis-head .vis-id {
  color: var(--amber);
  font-family: var(--mono);
  font-weight: 700;
  font-size: 11px;
}
.vis-head .vis-type {
  color: var(--text-2);
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.vis-name {
  color: var(--text-1);
  font-size: 13px;
  font-weight: 600;
}
.vis-meta {
  color: var(--text-3);
  font-size: 11px;
}

/* İdari Dashboard */
.idash-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 10px;
}
.idash-card {
  background: var(--bg-window);
  border: 1px solid var(--line-2);
  padding: 16px;
  cursor: pointer;
  transition: border-color 120ms, transform 120ms;
}
.idash-card:hover {
  border-color: var(--cyan);
  transform: translateY(-2px);
}
.idash-card.idash-pending { border-left: 3px solid var(--amber); }
.idash-card.idash-req     { border-left: 3px solid var(--cyan); }
.idash-card.idash-vis     { border-left: 3px solid var(--green); }
.idash-card.idash-disc    { border-left: 3px solid var(--red); }
.idash-card.idash-bul     { border-left: 3px solid var(--purple); }
.idash-num {
  font-size: 36px;
  color: var(--text-1);
  font-weight: 700;
  font-family: var(--mono);
  line-height: 1;
  margin-bottom: 6px;
}
.idash-lbl {
  font-size: 11px;
  color: var(--cyan);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.idash-sub {
  font-size: 11px;
  color: var(--text-3);
  line-height: 1.4;
}

.idash-types {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
}
.idash-type {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
  font-size: 12px;
}
.idash-type-ico { font-size: 16px; }
.idash-type-lbl { flex: 1; color: var(--text-2); }
.idash-type-num { color: var(--amber); font-weight: 700; font-family: var(--mono); }

/* ============================================================
   FAZ 11A — Labs + Equipment
   ============================================================ */
.lab-row {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.lab-row:hover { background: rgba(90, 200, 217, 0.06); }
.lab-time {
  display: flex; flex-direction: column;
  align-items: center;
  padding: 6px;
  background: var(--bg-shell);
  border-left: 3px solid var(--amber);
}
.lab-time .lab-day { color: var(--text-1); font-size: 11px; font-weight: 700; }
.lab-time .lab-hours { color: var(--cyan); font-size: 11px; font-family: var(--mono); }
.lab-body { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.lab-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.lab-purpose { color: var(--text-1); font-size: 13px; font-weight: 600; }
.lab-meta { color: var(--text-3); font-size: 11px; }

.eq-row {
  display: grid;
  grid-template-columns: 40px 1fr 110px;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.eq-row:hover { background: rgba(74, 222, 128, 0.06); }
.eq-ico { font-size: 22px; }
.eq-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.eq-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.eq-head .eq-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 11px; }
.eq-head .eq-cat { color: var(--text-2); font-size: 11px; letter-spacing: 1px; text-transform: uppercase; }
.eq-name { color: var(--text-1); font-size: 13px; font-weight: 600; }
.eq-meta { color: var(--text-3); font-size: 11px; }
.eq-action { display: flex; justify-content: flex-end; }

/* ============================================================
   FAZ 12B — OrgChart v2 (departman bazlı kolonlu hiyerarşi)
   ============================================================ */
.org-tier {
  display: flex; justify-content: center; padding: 8px 0;
}
.org-tier-2 {
  display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
  padding: 8px 16px;
}
.org-deputy-col {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.org-deputy-label {
  font-size: 10px; letter-spacing: 1.5px; color: var(--cyan);
  font-weight: 700; text-transform: uppercase;
}
.org-line {
  width: 1px; height: 18px; background: var(--line-2);
  margin: 4px auto;
}

.org-dept-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  padding: 16px;
}
.org-dept-col {
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
  border-top: 3px solid var(--dept-color, var(--text-2));
  padding: 10px;
  display: flex; flex-direction: column; gap: 6px;
}
.org-dept-header {
  display: flex; gap: 6px; align-items: center;
  padding-bottom: 6px; border-bottom: 1px dashed var(--line-1);
  margin-bottom: 6px;
}
.org-dept-ico { font-size: 16px; }
.org-dept-name {
  color: var(--dept-color, var(--text-1));
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1.5px;
}
.org-dept-empty {
  color: var(--text-4); font-size: 11px; padding: 10px; text-align: center;
}

.org-branch {
  display: flex; flex-direction: column; gap: 4px;
}
.org-children {
  margin-left: 14px; padding-left: 6px; border-left: 1px dashed var(--line-2);
  display: flex; flex-direction: column; gap: 4px;
}

.org-node {
  background: var(--bg-window);
  border: 1px solid var(--line-2);
  padding: 8px 10px;
  display: flex; flex-direction: column; gap: 3px;
  transition: border-color 120ms;
  position: relative;
}
.org-node:hover { border-color: var(--cyan); }
.org-node.lead { border-color: var(--amber); }
.org-node.offsite {
  border-color: var(--red);
  background: linear-gradient(135deg, rgba(239,68,68,0.06), var(--bg-window));
}
.org-node.acting {
  border-color: var(--red);
  border-width: 2px;
  box-shadow: 0 0 12px rgba(239,68,68,0.35);
  animation: orgActingPulse 2s ease-in-out infinite;
}
@keyframes orgActingPulse {
  0%, 100% { box-shadow: 0 0 8px rgba(239,68,68,0.25); }
  50%      { box-shadow: 0 0 18px rgba(239,68,68,0.55); }
}
.org-node .org-acting {
  position: absolute; top: -8px; right: -4px;
  background: var(--red); color: #fff;
  font-size: 9px; padding: 1px 6px; font-weight: 700;
  letter-spacing: 1px;
}
.org-node .org-title {
  color: var(--text-1); font-size: 12px; font-weight: 600; line-height: 1.3;
}
.org-node .org-meta {
  display: flex; gap: 4px; align-items: center; flex-wrap: wrap;
}
.org-node .org-sub {
  font-size: 10px; padding: 2px 0; margin-top: 2px;
}
.org-node .org-sub.assigned { color: var(--cyan); }
.org-node .org-sub.vacant   { color: var(--text-4); font-style: italic; }

/* Sections */
.org-section {
  padding: 16px;
  margin: 8px 0;
}
.org-section-title {
  font-size: 11px; letter-spacing: 2px; color: var(--amber);
  font-weight: 700; margin-bottom: 8px;
  border-bottom: 1px solid var(--line-1);
  padding-bottom: 4px;
}
.org-offsite-section { background: rgba(239,68,68,0.04); border-left: 3px solid var(--red); }
.org-offsite-note {
  font-size: 11px; color: var(--text-3); margin-bottom: 10px; line-height: 1.5;
}
.org-advisory-section { background: rgba(255,255,255,0.02); border-left: 3px dashed var(--text-3); }
.org-advisory-note {
  font-size: 11px; color: var(--text-3); margin-bottom: 10px; line-height: 1.5;
}

/* Cooperation */
.org-coop-note {
  display: flex; gap: 10px; align-items: center;
  padding: 10px 16px; margin: 16px;
  background: var(--bg-shell); border-left: 3px solid var(--cyan);
  font-size: 11px; color: var(--text-2); line-height: 1.4;
}

/* O5 note */
.org-o5-note {
  display: flex; gap: 10px; align-items: center;
  padding: 10px 16px; margin: 0 16px 12px;
  background: var(--bg-shell); border-left: 3px solid var(--purple);
  font-size: 11px; color: var(--text-2);
}

/* Escalation banner */
.org-esc-banner {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 12px; align-items: center;
  padding: 12px 16px; margin: 0 0 16px;
  background: linear-gradient(90deg, rgba(239,68,68,0.18), rgba(239,68,68,0.05));
  border: 2px solid var(--red);
  animation: orgActingPulse 2s ease-in-out infinite;
}
.org-esc-icon { font-size: 28px; color: var(--red); text-align: center; }
.org-esc-title {
  color: var(--red); font-weight: 700; letter-spacing: 1.5px;
  font-size: 13px;
}
.org-esc-desc { color: var(--text-1); font-size: 12px; margin-top: 4px; }
.org-esc-meta { color: var(--text-3); font-size: 11px; margin-top: 4px; }
.org-esc-btn {
  background: var(--bg-input); border: 1px solid var(--red); color: var(--red);
  padding: 6px 12px; cursor: pointer; font-weight: 700; font-size: 11px;
  font-family: var(--mono);
}
.org-esc-btn:hover { background: var(--red); color: #fff; }

/* Legend */
.org-legend {
  display: flex; flex-wrap: wrap; gap: 14px;
  padding: 10px 16px; border-top: 1px solid var(--line-1);
  font-size: 10px; color: var(--text-3);
}
.org-legend div { display: flex; gap: 4px; align-items: center; }
.org-legend .lg {
  width: 12px; height: 12px; border: 1px solid var(--line-2);
}
.org-legend .lg.lead { border-color: var(--amber); }
.org-legend .lg.dept { background: var(--bg-window); }
.org-legend .lg.offsite { border-color: var(--red); }
.org-legend .lg.acting { border-color: var(--red); background: rgba(239,68,68,0.2); }
.org-legend .lg.coop { background: var(--cyan); }

/* Escalation panel cards */
.esc-card {
  background: var(--bg-window);
  border: 1px solid var(--line-2);
  padding: 10px 14px;
}
.esc-card.active { border-color: var(--red); background: rgba(239,68,68,0.05); }
.esc-card-head { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }
.esc-key { color: var(--amber); font-weight: 700; letter-spacing: 1.5px; }
.esc-desc { color: var(--text-2); font-size: 12px; line-height: 1.5; }
.esc-elevated { color: var(--text-1); font-size: 12px; margin-top: 4px; }
.esc-reason { color: var(--text-3); font-size: 11px; margin-top: 4px; font-style: italic; }
.esc-card-actions { margin-top: 8px; }

/* ============================================================
   GLOBAL CRT GLITCH EFEKTI — realtime data değişiminde tetiklenir
   ============================================================ */
@keyframes siteGlitchShake {
  0%   { transform: translate(0, 0); }
  15%  { transform: translate(-2px, 1px) skewX(0.4deg); }
  30%  { transform: translate(2px, -1px) skewX(-0.3deg); }
  45%  { transform: translate(-1px, 1px); }
  60%  { transform: translate(1px, 0); }
  75%  { transform: translate(0, -1px); }
  100% { transform: translate(0, 0); }
}
@keyframes siteGlitchChroma {
  0%, 100% { filter: none; }
  20%      { filter: hue-rotate(-4deg) saturate(1.3) brightness(1.05); }
  50%      { filter: hue-rotate(3deg) saturate(1.1); }
  80%      { filter: brightness(1.08); }
}
@keyframes siteGlitchScan {
  0%, 100% { opacity: 0.05; }
  50%      { opacity: 0.18; }
}
@keyframes siteGlitchTear {
  0%   { clip-path: inset(0 0 0 0); transform: translate(0, 0); }
  20%  { clip-path: inset(20% 0 40% 0); transform: translate(3px, 0); }
  40%  { clip-path: inset(60% 0 10% 0); transform: translate(-2px, 0); }
  60%  { clip-path: inset(0 0 70% 0); transform: translate(1px, 0); }
  80%  { clip-path: inset(30% 0 30% 0); transform: translate(0, 0); }
  100% { clip-path: inset(0 0 0 0); transform: translate(0, 0); }
}

body.site-glitch #desktop,
body.site-glitch .login,
body.site-glitch .boot {
  animation: siteGlitchShake 280ms ease-out,
             siteGlitchChroma 280ms ease-out;
}
body.site-glitch .crt-overlay {
  animation: siteGlitchScan 280ms ease-out;
}
/* Tearing efekti — pseudo-element ile çift katman */
body.site-glitch #desktop::after,
body.site-glitch .login::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg,
    transparent 0%, rgba(90, 200, 217, 0.04) 30%,
    transparent 50%, rgba(239, 68, 68, 0.03) 75%,
    transparent 100%);
  animation: siteGlitchTear 280ms ease-out;
  z-index: 99;
}

/* Daha güçlü (strong) varyant — kritik olaylarda (threat değişikliği gibi) */
body.site-glitch-strong #desktop,
body.site-glitch-strong .login {
  animation: siteGlitchShake 450ms ease-out,
             siteGlitchChroma 450ms ease-out;
}

/* Reduced motion — glitch tamamen kapanır */
@media (prefers-reduced-motion: reduce) {
  body.site-glitch #desktop,
  body.site-glitch .crt-overlay,
  body.site-glitch .login,
  body.site-glitch .boot,
  body.site-glitch-strong #desktop {
    animation: none !important;
  }
  body.site-glitch #desktop::after,
  body.site-glitch .login::after { display: none; }
}

/* ============================================================
   FAZ 12D — ACS (Anomaly Classification System)
   SCP-Wiki kanon ACS bar
   ============================================================ */
.acs-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 14px 0;
  border: 1px solid var(--line-2);
  background: var(--bg-shell);
  font-family: var(--mono);
}
.acs-cell {
  position: relative;
  padding: 12px 10px;
  text-align: center;
  border-right: 1px solid var(--line-1);
  background:
    linear-gradient(135deg,
      var(--acs-c, var(--text-3)) 0%,
      var(--acs-c, var(--text-3)) 35%,
      rgba(0,0,0,0.15) 35%,
      rgba(0,0,0,0.15) 100%);
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
  min-height: 90px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  cursor: help;
  transition: transform 120ms;
}
.acs-cell:last-child { border-right: 0; }
.acs-cell:hover { transform: scale(1.02); z-index: 2; }
.acs-cell.empty {
  background: var(--bg-input);
  color: var(--text-4);
  text-shadow: none;
}

.acs-cell .acs-cat {
  font-size: 9px;
  letter-spacing: 2px;
  font-weight: 700;
  opacity: 0.85;
  text-transform: uppercase;
}
.acs-cell .acs-name {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.acs-cell .acs-icon {
  width: 32px;
  height: 32px;
  margin: 2px 0;
  background: rgba(255,255,255,0.18);
  border: 2px solid currentColor;
  border-radius: 50%;
  position: relative;
}
.acs-cell .acs-icon::before {
  content: "";
  position: absolute;
  inset: 6px;
  background: currentColor;
  border-radius: 50%;
  opacity: 0.7;
}
/* Hover'da tooltip — title attribute kullanıyor ama ek stilleme yok */

/* Faz 12C — Investigation rows */
.inv-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.inv-row:hover { background: rgba(239, 68, 68, 0.04); }
.inv-ico { font-size: 22px; color: var(--red); }
.inv-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.inv-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.inv-head .inv-id {
  color: var(--amber);
  font-family: var(--mono);
  font-weight: 700;
  font-size: 11px;
}
.inv-title {
  color: var(--text-1); font-size: 13px; font-weight: 600;
}
.inv-meta {
  color: var(--text-3); font-size: 11px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Desktop drop target (klasör üzerine sürüklenirken) */
.desk-item.drop-target {
  background: rgba(240, 160, 64, 0.18) !important;
  border: 1px dashed var(--amber) !important;
  box-shadow: 0 0 16px rgba(240, 160, 64, 0.4);
  transform: scale(1.08);
  transition: transform 80ms;
}

/* ============================================================
   FAZ 14 — Güvenlik Paketi (Patrol + Drills + Armory)
   ============================================================ */

/* Patrol rows */
.pat-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.pat-row:hover { background: rgba(239,68,68,0.04); }
.pat-shield { font-size: 22px; color: var(--red); }
.pat-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pat-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.pat-head .pat-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 11px; }
.pat-head .pat-sector { color: var(--cyan); font-size: 11px; font-weight: 600; }
.pat-obs { color: var(--text-1); font-size: 13px; }
.pat-meta { color: var(--text-3); font-size: 11px; }

/* Drill rows */
.drl-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.drl-row:hover { background: rgba(251,146,60,0.05); }
.drl-ico { font-size: 22px; }
.drl-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.drl-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.drl-head .drl-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 11px; }
.drl-head .drl-type { color: var(--text-2); font-size: 11px; letter-spacing: 1px; text-transform: uppercase; }
.drl-title { color: var(--text-1); font-size: 13px; font-weight: 600; }
.drl-meta { color: var(--text-3); font-size: 11px; }

/* Armory rows */
.arm-row {
  display: grid;
  grid-template-columns: 40px 1fr 110px;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.arm-row:hover { background: rgba(239,68,68,0.04); }
.arm-ico { font-size: 22px; }
.arm-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.arm-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.arm-head .arm-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 11px; }
.arm-head .arm-cat { color: var(--text-2); font-size: 11px; letter-spacing: 1px; text-transform: uppercase; }
.arm-name { color: var(--text-1); font-size: 13px; font-weight: 600; }
.arm-meta { color: var(--text-3); font-size: 11px; }
.arm-action { display: flex; justify-content: flex-end; }

/* Threat level değiştirme butonları */
.threat-btn {
  padding: 10px 8px;
  border: 2px solid var(--line-2);
  background: var(--bg-input);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  cursor: pointer;
  transition: all 120ms;
}
.threat-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}
.threat-btn:disabled, .threat-btn.current {
  cursor: not-allowed;
  opacity: 0.55;
}
.threat-btn.green   { border-color: var(--green);  color: var(--green); }
.threat-btn.yellow  { border-color: var(--yellow); color: var(--yellow); }
.threat-btn.orange  { border-color: var(--orange); color: var(--orange); }
.threat-btn.red     { border-color: var(--red);    color: var(--red); }
.threat-btn.current { background: currentColor; color: #000; }

/* ============================================================
   FAZ 13 — Atmosfer paketi UI elemanları
   ============================================================ */

/* Custom status mesajı */
.status-msg {
  font-size: 11px;
  color: var(--cyan);
  cursor: pointer;
  padding: 2px 8px;
  border: 1px dashed var(--line-2);
  font-family: var(--mono);
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.status-msg:hover { background: rgba(90,200,217,0.06); border-color: var(--cyan); }

/* Online count badge */
.online-count {
  font-size: 11px;
  color: var(--green);
  font-family: var(--mono);
  letter-spacing: 1px;
  padding: 0 6px;
}

/* Atmosphere audio toggle button */
.tb-audio {
  background: transparent;
  border: 1px solid transparent;
  color: var(--text-3);
  cursor: pointer;
  font-size: 14px;
  padding: 2px 6px;
  transition: color 120ms;
}
.tb-audio:hover { color: var(--amber); border-color: var(--line-2); }

/* Login spotlight */
.login-spotlight {
  padding: 10px 14px;
  margin: 14px 0;
  background: var(--bg-shell);
  border-left: 3px solid var(--amber);
  font-family: var(--mono);
  font-size: 11px;
}
.login-spotlight .lspot-label {
  color: var(--amber);
  letter-spacing: 1.5px;
  font-weight: 700;
  margin-bottom: 4px;
}
.login-spotlight .lspot-id {
  color: var(--cyan);
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 2px;
}
.login-spotlight .lspot-class {
  color: var(--text-3);
  font-size: 11px;
  letter-spacing: 1px;
}

/* Taskbar escalation badge */
.esc-badge {
  padding: 2px 8px;
  background: var(--red);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  font-family: var(--mono);
  cursor: pointer;
  animation: orgActingPulse 1.5s ease-in-out infinite;
}
.esc-badge::before { content: "⚡ "; }

/* Faz 11B — Proposal rows */
.prop-row {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
  align-items: stretch;
}
.prop-row:hover { background: rgba(167, 139, 250, 0.06); }
.prop-body { min-width: 0; display: flex; flex-direction: column; gap: 4px; padding: 4px 0; }
.prop-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.prop-head .prop-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 11px; }
.prop-title { color: var(--text-1); font-size: 13px; font-weight: 600; line-height: 1.3; }
.prop-meta { color: var(--text-3); font-size: 11px; }

/* SCP referans tıklanabilir link */
.scp-ref {
  color: var(--cyan);
  cursor: pointer;
  border-bottom: 1px dashed var(--cyan);
  text-decoration: none;
  padding: 0 1px;
  transition: background 120ms;
}
.scp-ref:hover {
  background: rgba(90, 200, 217, 0.15);
  color: var(--amber);
  border-bottom-color: var(--amber);
}

.start-menu {
  position: absolute; bottom: 36px; left: 0;
  width: 280px;
  background: var(--bg-window);
  border: 1px solid var(--line-2); border-bottom: 0;
  box-shadow: 0 -12px 24px rgba(0,0,0,0.5);
  display: none; z-index: 90;
  max-height: 70vh; overflow-y: auto;
}
.start-menu.open { display: block; }
.start-menu .head { padding: 12px 14px; background: var(--bg-header); border-bottom: 1px solid var(--line-2); }
.start-menu .head .who { font-size: 13px; font-weight: 700; color: var(--amber); }
.start-menu .head .what { font-size: 11px; color: var(--text-3); letter-spacing: 1.5px; }
.start-menu .item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 14px; font-size: 12px; color: var(--text-2);
  border-bottom: 1px solid var(--line-1);
}
.start-menu .item:hover { background: var(--bg-shell); color: var(--text-1); }
.start-menu .item.danger { color: var(--red); }
.start-menu .item .ico { width: 14px; color: var(--amber); }

/* ============ WINDOW ============ */
.window {
  position: absolute;
  background: var(--bg-window);
  border: 1px solid var(--line-2);
  box-shadow: var(--scan-3);
  display: flex; flex-direction: column;
  min-width: 480px; min-height: 320px;
  z-index: 10;
  opacity: 0; transform: translateY(8px) scale(.99);
  transition: opacity var(--t-base), transform var(--t-base);
}
.window.open { opacity: 1; transform: none; }

.win-titlebar {
  display: flex; align-items: center; gap: 10px;
  padding: 0 8px 0 14px;
  height: 32px;
  background: var(--bg-header);
  border-bottom: 1px solid var(--line-2);
  cursor: move; user-select: none;
}
.win-titlebar .title-ico { color: var(--amber); display: flex; }
.win-titlebar .title-ico svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 1.6; }
.win-titlebar .title { flex: 1; font-size: 12px; color: var(--text-1); letter-spacing: 1px; font-weight: 700; }
.win-titlebar .controls { display: flex; gap: 2px; }
.win-titlebar .controls button {
  width: 28px; height: 24px;
  display: grid; place-items: center;
  color: var(--text-3); font-family: var(--mono);
}
.win-titlebar .controls button:hover { background: var(--line-1); color: var(--text-1); }
.win-titlebar .controls .close:hover { background: var(--red); color: white; }

.win-body { flex: 1; overflow: auto; padding: 0; background: var(--bg-window); }

.win-menubar {
  display: flex; gap: 0;
  padding: 4px 8px;
  background: var(--bg-shell);
  border-bottom: 1px solid var(--line-1);
  font-size: 11px; color: var(--text-2);
}
.win-menubar > * { padding: 4px 10px; cursor: pointer; }
.win-menubar > *:hover { background: var(--bg-window); color: var(--text-1); }

.win-statusbar {
  display: flex; align-items: center; gap: 12px;
  padding: 4px 12px;
  height: 24px;
  background: var(--bg-shell);
  border-top: 1px solid var(--line-1);
  font-size: 11px; color: var(--text-3);
}
.win-statusbar .sep { color: var(--line-2); }

/* ============ APP: FILE BROWSER (SCP Files / D-Class / MTF) ============ */
.fb { display: grid; grid-template-columns: 220px 1fr; height: 100%; }
.fb-sidebar { border-right: 1px solid var(--line-1); background: var(--bg-shell); overflow-y: auto; }
.fb-sidebar .sec {
  padding: 8px 12px; font-size: 10px; letter-spacing: 1.5px;
  color: var(--text-4); text-transform: uppercase; margin-top: 8px;
}
.fb-sidebar .item {
  padding: 6px 14px; font-size: 12px; color: var(--text-2);
  cursor: pointer; display: flex; align-items: center; gap: 8px;
}
.fb-sidebar .item:hover { background: var(--bg-window); color: var(--text-1); }
.fb-sidebar .item.active { background: var(--bg-window); color: var(--amber); }
.fb-sidebar .item::before { content: "▸"; color: var(--text-4); font-size: 10px; }

.fb-main { display: flex; flex-direction: column; overflow: hidden; }
.fb-list { font-size: 12px; }
.fb-list .head, .fb-list .row { display: grid; }
.fb-list .head > *, .fb-list .row > * {
  padding: 6px 10px;
  border-bottom: 1px solid var(--line-1);
  display: flex; align-items: center; gap: 6px;
}
.fb-list .head > * {
  background: var(--bg-shell); color: var(--text-3);
  font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 700;
  position: sticky; top: 0;
}
.fb-list .row { cursor: pointer; }
.fb-list .row > * { color: var(--text-2); }
.fb-list .row:hover > * { background: var(--bg-shell); }
.fb-list .name { color: var(--amber); font-weight: 700; }

/* Status pills */
.pill {
  display: inline-block; padding: 1px 8px; font-size: 10px; font-weight: 700; letter-spacing: 1px;
  background: var(--bg-window);
}
.pill.green  { color: var(--green);  }
.pill.amber  { color: var(--amber);  }
.pill.red    { color: var(--red);    }
.pill.yellow { color: var(--yellow); }
.pill.cyan   { color: var(--cyan);   }
.pill.muted  { color: var(--text-3); }

/* ============ DOCUMENT VIEWER ============ */
.doc { padding: 24px 32px; font-family: var(--serif); font-size: 14px; line-height: 1.7; color: var(--text-1); background: var(--bg-window); overflow-y: auto; }
.doc .head { text-align: center; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 2px solid var(--amber); }
.doc .head .seal { font-size: 11px; color: var(--amber); letter-spacing: 4px; margin-bottom: 8px; font-family: var(--mono); }
.doc .head h2 { font-size: 22px; letter-spacing: 2px; color: var(--text-1); font-weight: 700; }
.doc .head .sub { font-size: 11px; color: var(--text-3); letter-spacing: 2px; margin-top: 4px; font-family: var(--mono); }

.doc .meta-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 16px;
  padding: 12px; background: var(--bg-shell);
  border: 1px solid var(--line-1);
  margin: 14px 0;
  font-family: var(--mono); font-size: 12px;
}
.doc .meta-grid .k { color: var(--cyan); }
.doc .meta-grid .v { color: var(--text-1); }

.doc h3 {
  font-family: var(--mono); font-size: 12px;
  color: var(--amber); letter-spacing: 2px; text-transform: uppercase;
  margin: 18px 0 8px; padding-bottom: 4px; border-bottom: 1px dashed var(--line-2);
}
.doc p { margin-bottom: 10px; text-align: justify; }
.doc .redacted { background: #000; color: #000; padding: 1px 6px; }
.doc .redacted:hover { color: var(--red); }
.doc blockquote {
  border-left: 3px solid var(--amber);
  padding: 6px 12px; margin: 10px 0;
  color: var(--text-2); font-style: italic; background: var(--bg-shell);
}

/* ============ EDITOR (Test / Incident / Ethics) ============ */
.editor { display: grid; grid-template-columns: 240px 1fr; height: 100%; }
.ed-list { border-right: 1px solid var(--line-1); background: var(--bg-shell); overflow-y: auto; }
.ed-list .head { padding: 10px 12px; border-bottom: 1px solid var(--line-2); }
.ed-list .head button {
  width: 100%; padding: 6px 10px;
  background: var(--amber); color: #000;
  font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  display: flex; align-items: center; justify-content: center; gap: 6px;
}
.ed-list .head button:hover { background: var(--amber-d); }
.ed-list .row {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer; font-size: 12px;
}
.ed-list .row:hover { background: var(--bg-window); }
.ed-list .row.sel { background: rgba(240,160,64,0.08); }
.ed-list .row .t { font-weight: 700; color: var(--text-1); margin-bottom: 2px; }
.ed-list .row .m { color: var(--text-3); font-size: 11px; }
.ed-list .row .badge {
  display: inline-block; padding: 1px 6px; margin-left: 4px;
  font-size: 9px; letter-spacing: 1px; font-weight: 700;
  background: var(--bg-window); color: var(--cyan);
}
.ed-list .row .badge.draft  { color: var(--yellow); }
.ed-list .row .badge.posted { color: var(--green);  }
.ed-list .row .badge.pending{ color: var(--amber);  }
.ed-list .row .badge.approved{ color: var(--green); }
.ed-list .row .badge.rejected{ color: var(--red);   }

.ed-main { display: flex; flex-direction: column; overflow: hidden; }
.ed-toolbar {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px;
  background: var(--bg-shell); border-bottom: 1px solid var(--line-2);
}
.ed-toolbar .meta { flex: 1; font-size: 11px; color: var(--text-3); display: flex; gap: 12px; }
.ed-toolbar .meta .ok { color: var(--green); }
.ed-toolbar .meta .warn { color: var(--amber); }
.ed-toolbar button {
  padding: 5px 10px; border: 1px solid var(--line-2);
  font-size: 11px; color: var(--text-2); letter-spacing: 1px;
}
.ed-toolbar button:hover { background: var(--bg-window); color: var(--text-1); }
.ed-toolbar button.primary {
  background: var(--amber); color: #000; border-color: var(--amber); font-weight: 700;
}
.ed-toolbar button.primary:hover { background: var(--amber-d); }

.ed-form { flex: 1; overflow-y: auto; padding: 22px 28px; background: var(--bg-window); }
.ed-form .field { margin-bottom: 16px; }
.ed-form .field label {
  display: block; font-size: 10px; color: var(--cyan);
  letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 4px; font-weight: 700;
}
.ed-form .field input,
.ed-form .field select,
.ed-form .field textarea {
  width: 100%;
  background: var(--bg-input); border: 1px solid var(--line-2);
  padding: 8px 10px; color: var(--text-1); font-size: 13px; font-family: var(--mono);
}
.ed-form .field textarea { min-height: 100px; resize: vertical; line-height: 1.6; }
.ed-form .field input:focus, .ed-form .field select:focus, .ed-form .field textarea:focus { border-color: var(--amber); }
.ed-form .field .help { font-size: 11px; color: var(--text-4); margin-top: 4px; }
.ed-form .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ed-form .row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.ed-form .template-hint {
  background: var(--bg-shell); border-left: 3px solid var(--cyan);
  padding: 8px 12px; font-size: 11px; color: var(--text-2); margin-bottom: 16px;
}
.ed-form .template-hint strong { color: var(--cyan); }

/* ============ TERMINAL ============ */
.term { height: 100%; padding: 14px 18px; background: #000; color: var(--green); font: 13px var(--mono); overflow-y: auto; }
.term .ln { white-space: pre-wrap; }
.term .ln.amber { color: var(--amber); }
.term .ln.cyan { color: var(--cyan); }
.term .ln.red  { color: var(--red); }
.term .prompt { display: flex; align-items: center; gap: 6px; }
.term .prompt .p { color: var(--amber); }
.term .prompt input { flex: 1; background: transparent; color: var(--green); font: 13px var(--mono); caret-color: var(--green); }

/* ============ TABLE (Personnel, MTF members, D-Class) ============ */
.tbl-wrap { padding: 16px 18px; }
.tbl-wrap table { width: 100%; border-collapse: collapse; font-size: 12px; }
.tbl-wrap th, .tbl-wrap td {
  padding: 6px 10px; border-bottom: 1px solid var(--line-1); text-align: left;
}
.tbl-wrap th {
  background: var(--bg-shell); color: var(--text-3);
  font-size: 10px; letter-spacing: 1.5px; text-transform: uppercase;
}
.tbl-wrap td .pill.l1, .tbl-wrap td .pill.l2 { color: var(--text-3); background: var(--bg-shell); }
.tbl-wrap td .pill.l3 { color: var(--cyan);   background: rgba(90,200,217,0.10); }
.tbl-wrap td .pill.l4 { color: var(--green);  background: rgba(74,222,128,0.10); }
.tbl-wrap td .pill.l5 { color: var(--amber);  background: rgba(240,160,64,0.10); }
.tbl-wrap td .pill.o5 { color: var(--purple); background: rgba(167,139,250,0.18); border: 1px solid var(--purple); }
.tbl-wrap td .online::before  { content: "●"; color: var(--green);    margin-right: 6px; }
.tbl-wrap td .offline::before { content: "○"; color: var(--text-4);   margin-right: 6px; }

.note-box {
  margin: 14px 16px; padding: 10px 12px;
  background: var(--bg-shell); border-left: 3px solid var(--cyan);
  font-size: 11px; color: var(--text-2);
}
.note-box strong { color: var(--cyan); }

/* ============ MTF SPECIFIC ============ */
.mtf-team {
  display: grid; grid-template-columns: 1fr; gap: 16px;
  padding: 18px;
}
.mtf-header {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(74,222,128,0.10), rgba(90,200,217,0.06));
  border: 1px solid var(--green); border-left-width: 4px;
}
.mtf-header h3 { font-size: 18px; color: var(--text-1); margin-bottom: 4px; }
.mtf-header .codename { font-family: var(--mono); color: var(--green); letter-spacing: 2px; font-size: 11px; }
.mtf-header .specialty { font-size: 12px; color: var(--text-2); margin-top: 8px; max-width: 50ch; }
.mtf-header .status-block { text-align: right; font-size: 11px; color: var(--text-3); }
.mtf-header .status-block .v { color: var(--text-1); font-size: 14px; font-weight: 700; }

.mtf-section { background: var(--bg-shell); border: 1px solid var(--line-1); padding: 14px; }
.mtf-section h4 {
  font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--amber); margin-bottom: 10px;
}
.mtf-section ul { list-style: none; }
.mtf-section li {
  font-size: 12px; padding: 4px 0;
  border-bottom: 1px dashed var(--line-1);
  display: flex; align-items: center; gap: 8px;
}
.mtf-section li:last-child { border-bottom: 0; }
.mtf-section li .role { color: var(--cyan); min-width: 100px; font-size: 11px; letter-spacing: 1px; }
.mtf-section li .name { color: var(--text-1); flex: 1; }

/* ============ THREAT BOARD ============ */
.threat-board { padding: 18px; }
.threat-level {
  padding: 22px 24px;
  border: 2px solid currentColor;
  text-align: center;
  margin-bottom: 18px;
  position: relative;
  overflow: hidden;
}
.threat-level.yellow { color: var(--yellow); background: rgba(250,204,21,0.05); }
.threat-level.orange { color: var(--orange); background: rgba(251,146,60,0.05); }
.threat-level.red    { color: var(--red);    background: rgba(239,68,68,0.06);  }
.threat-level .label {
  font-family: var(--mono); font-size: 11px; letter-spacing: 3px;
  color: var(--text-3); margin-bottom: 6px;
}
.threat-level .name {
  font-size: 36px; font-weight: 700; letter-spacing: 6px;
}
.threat-level .desc {
  font-size: 12px; color: var(--text-2); margin-top: 8px;
  font-family: var(--sans); max-width: 60ch; margin-inline: auto;
}
.threat-level::before {
  content: ""; position: absolute; left: -20%; right: -20%; top: -20%; bottom: -20%;
  background: repeating-linear-gradient(45deg, currentColor 0 10px, transparent 10px 30px);
  opacity: 0.04; pointer-events: none;
}

.alert-feed { display: flex; flex-direction: column; gap: 8px; }
.alert {
  display: grid; grid-template-columns: 90px 1fr auto;
  gap: 12px; align-items: center;
  padding: 10px 14px;
  background: var(--bg-shell); border-left: 3px solid var(--line-2);
}
.alert.high { border-left-color: var(--red); }
.alert.mid  { border-left-color: var(--orange); }
.alert.low  { border-left-color: var(--green); }
.alert .ts { font-family: var(--mono); color: var(--text-3); font-size: 11px; }
.alert .txt { font-size: 12px; color: var(--text-1); }
.alert .ack { font-size: 10px; color: var(--text-3); letter-spacing: 1px; }

/* ============ ORG CHART (komuta zinciri) ============ */
.org-chart {
  padding: 28px 28px 18px;
  display: flex; flex-direction: column; align-items: stretch;
  gap: 0;
  font-family: var(--mono);
}
.org-tier {
  display: flex; gap: 16px;
  justify-content: center; align-items: stretch;
}
.org-tier.center { justify-content: center; }
.org-line {
  width: 2px; height: 22px;
  background: var(--line-2);
  margin: 0 auto;
}
.org-tier-branched {
  display: grid;
  grid-template-columns: 1fr 220px;
  gap: 32px;
  align-items: start;
  margin-top: 4px;
}
.org-branches {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  position: relative;
}
.org-branches::before {
  content: ""; position: absolute; left: 50%; top: -22px;
  width: 2px; height: 22px; background: var(--line-2);
  transform: translateX(-50%);
}
.org-node {
  background: var(--bg-shell);
  border: 1px solid var(--line-2);
  padding: 10px 12px;
  display: flex; flex-direction: column; gap: 4px;
  min-width: 160px;
  position: relative;
  transition: border-color var(--t-fast), transform var(--t-fast);
}
.org-node:hover { border-color: var(--amber); transform: translateY(-2px); }
.org-node.lead {
  background: rgba(167,139,250,0.06);
  border-color: var(--purple);
  border-left-width: 4px;
}
.org-node.ethics {
  background: rgba(240,160,64,0.05);
  border-color: var(--amber);
  border-style: dashed;
}
.org-node .org-title {
  font-size: 12px; font-weight: 700; color: var(--text-1);
  letter-spacing: 0.5px; line-height: 1.3;
}
.org-node .org-meta { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.org-node .org-sub {
  font-size: 10px; letter-spacing: 1px;
  padding-top: 2px;
  border-top: 1px dashed var(--line-1);
  margin-top: 2px;
}
.org-node .org-sub.assigned { color: var(--cyan); }
.org-node .org-sub.vacant   { color: var(--text-4); font-style: italic; }

.org-o5-note {
  display: flex; align-items: center; gap: 10px;
  margin-top: 18px;
  padding: 10px 14px;
  background: rgba(167,139,250,0.08);
  border-left: 3px solid var(--purple);
  font-size: 11px;
  color: var(--text-2);
  font-family: var(--sans);
}
.org-o5-note strong { color: var(--purple); }

.org-ethics-rail {
  display: flex; flex-direction: column; align-items: stretch; gap: 8px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(240,160,64,0.04), transparent);
  border: 1px dashed var(--amber);
}
.org-ethics-rail .org-ethics-label {
  font-size: 10px; letter-spacing: 2px; color: var(--amber);
  text-transform: uppercase; font-weight: 700; text-align: center;
  margin-bottom: 4px;
}
.org-ethics-rail .org-ethics-note {
  font-size: 10px; color: var(--text-3); text-align: center;
  font-family: var(--sans); line-height: 1.4;
}
.org-ethics-rail .org-node { border-style: solid; }

.org-legend {
  margin-top: 28px;
  padding: 12px 14px;
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
  display: flex; gap: 18px; flex-wrap: wrap;
  font-size: 11px; color: var(--text-2);
  align-items: center;
}
.org-legend .lg {
  display: inline-block; width: 12px; height: 12px;
  margin-right: 6px; vertical-align: middle;
  border: 1px solid var(--line-2);
}
.org-legend .lg.lead   { background: rgba(167,139,250,0.4); border-color: var(--purple); }
.org-legend .lg.dept   { background: var(--bg-shell); }
.org-legend .lg.ethics { background: rgba(240,160,64,0.3); border-color: var(--amber); border-style: dashed; }
.org-legend .lg-line {
  display: inline-block; width: 22px; height: 2px;
  margin-right: 6px; vertical-align: middle;
}
.org-legend .lg-line.solid  { background: var(--line-2); }
.org-legend .lg-line.dashed { background: repeating-linear-gradient(90deg, var(--amber) 0 4px, transparent 4px 8px); }

/* ============ O5 COUNCIL ============ */
.o5-banner {
  display: flex; align-items: center; gap: 18px;
  padding: 18px;
  background: linear-gradient(135deg, rgba(167,139,250,0.12), rgba(167,139,250,0.02));
  border: 1px solid var(--purple);
  border-left-width: 4px;
  margin-bottom: 18px;
}
.o5-seal {
  font-size: 28px; font-weight: 900;
  letter-spacing: 4px;
  color: var(--purple);
  text-shadow: 0 0 16px rgba(167,139,250,0.6);
}
.o5-grid {
  display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.o5-card {
  background: var(--bg-shell);
  border: 1px solid var(--line-2);
  padding: 14px;
  display: flex; flex-direction: column; gap: 4px;
  transition: border-color var(--t-fast), transform var(--t-fast);
}
.o5-card:hover { border-color: var(--purple); transform: translateY(-2px); }
.o5-card.self {
  border-color: var(--purple);
  background: linear-gradient(135deg, rgba(167,139,250,0.08), transparent);
  border-left-width: 4px;
}
.o5-card.classified {
  background: #000;
  border-style: dashed;
}
.o5-card.classified .o5-name { color: var(--red); letter-spacing: 1px; }
.o5-id {
  font-size: 11px; letter-spacing: 2px; color: var(--purple); font-weight: 700;
}
.o5-name { font-size: 15px; color: var(--text-1); font-weight: 700; }
.o5-user { font-size: 11px; color: var(--cyan); }
.o5-role { font-size: 11px; color: var(--text-3); margin-top: 4px; }
.o5-meta { display: flex; gap: 6px; margin-top: 8px; flex-wrap: wrap; }

/* ============ ADMIN PANELİ (O5) ============ */
.adm-card {
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
  border-left: 3px solid var(--amber);
  padding: 12px 14px;
  margin-bottom: 10px;
}
.adm-card-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 10px;
}
.adm-name { font-size: 14px; color: var(--amber); font-weight: 700; font-family: var(--mono); }
.adm-meta { font-size: 11px; color: var(--text-3); margin-top: 2px; }
.adm-card-actions {
  display: grid;
  grid-template-columns: 90px 160px 1fr auto auto;
  gap: 6px; align-items: center;
}

.adm-pos-row {
  display: flex; gap: 8px; align-items: center;
  padding: 10px 12px;
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
}
.adm-pos-info { min-width: 200px; }
.adm-pos-info strong { font-size: 13px; color: var(--text-1); }

.adm-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.adm-table thead th {
  padding: 8px 10px;
  background: var(--bg-header);
  color: var(--text-3);
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  text-align: left;
  border-bottom: 1px solid var(--line-2);
}
.adm-table tbody td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line-1);
}
.adm-table tbody tr:hover { background: var(--bg-window); }

/* ============ CALENDAR / VARDİYA ============ */
.cal-cell {
  min-height: 96px;
  padding: 6px;
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
  cursor: pointer;
  position: relative;
  transition: border-color var(--t-fast), background var(--t-fast);
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cal-cell:hover { border-color: var(--cyan); }
.cal-cell.today { border-color: var(--amber); }
.cal-cell.today .cal-cell-num { color: var(--amber); font-weight: 700; }
.cal-cell.sel   { background: rgba(240,160,64,0.08); border-color: var(--amber); }
.cal-cell-num { font-size: 12px; color: var(--text-2); font-family: var(--mono); font-weight: 700; }
.cal-evt {
  font-size: 10px; padding: 2px 4px;
  background: var(--bg-window);
  display: flex; gap: 4px; align-items: center;
  overflow: hidden;
  border-left-width: 3px; border-left-style: solid;
}
.cal-evt-title {
  color: var(--text-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cal-evt-more { font-size: 9px; color: var(--text-4); text-align: center; padding: 2px 0; }

.cal-side-evt {
  padding: 10px 14px;
  background: var(--bg-window);
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background var(--t-fast);
}
.cal-side-evt:hover { background: var(--bg-header); }

/* ============ MAIL ============ */
.mail-row {
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background var(--t-fast);
}
.mail-row:hover { background: var(--bg-shell); }
.mail-row.sel  { background: rgba(240,160,64,0.08); border-left: 3px solid var(--amber); padding-left: 11px; }
.mail-row.unread .mail-subj { font-weight: 700; color: var(--text-1); }
.mail-row .mail-meta {
  font-size: 11px; color: var(--text-3); font-family: var(--mono);
  margin-bottom: 4px;
}
.mail-row .mail-subj {
  font-size: 13px; color: var(--text-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  margin-bottom: 2px;
}
.mail-row .mail-snippet {
  font-size: 11px; color: var(--text-4);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Mail badge ikon overlay (desktop icon + start menu) */
.mail-badge-icon {
  position: absolute; top: 4px; right: 4px;
  background: var(--red); color: #fff;
  font-size: 10px; font-weight: 700;
  padding: 2px 6px; border-radius: 10px;
  min-width: 18px; text-align: center;
  border: 2px solid var(--bg-screen);
}
.mail-badge-menu {
  display: inline-block;
  background: var(--red); color: #fff;
  font-size: 10px; font-weight: 700;
  padding: 0 6px; border-radius: 8px;
  margin-left: 6px;
}

/* ============ BELGE ARŞİVİ (Archive) ============ */
.arc-row {
  display: grid;
  grid-template-columns: 50px 1fr 110px;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  align-items: start;
  transition: background var(--t-fast);
}
.arc-row:hover { background: var(--bg-shell); }
.arc-icon { text-align: center; }
.arc-meta { min-width: 0; }
.arc-title { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.arc-title strong { color: var(--text-1); font-size: 14px; }
.arc-id {
  font-family: var(--mono); color: var(--text-3);
  font-size: 11px; letter-spacing: 1px;
  background: var(--bg-shell); padding: 1px 6px;
  border: 1px solid var(--line-2);
}
.arc-sub { color: var(--text-3); font-size: 11px; margin-top: 4px; font-family: var(--mono); }
.arc-summary {
  color: var(--text-2); font-size: 12px; margin-top: 6px;
  line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.arc-tags { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 4px; }
.arc-tag {
  display: inline-block;
  font-size: 10px; padding: 1px 6px;
  background: var(--bg-shell); border: 1px solid var(--line-2);
  color: var(--cyan); font-family: var(--mono);
}
.arc-side { text-align: right; display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
.arc-reads { font-size: 10px; color: var(--text-3); font-family: var(--mono); }

/* ============ REDACTED BLOCK ============ */
.redacted-block {
  position: relative;
  background: #000;
  color: var(--red);
  padding: 18px 16px;
  margin: 10px 0;
  border: 1px solid var(--red);
  overflow: hidden;
  text-align: center;
  font-family: var(--mono);
}
.redacted-block::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    repeating-linear-gradient(90deg, transparent 0 8px, rgba(239,68,68,0.06) 8px 16px),
    repeating-linear-gradient(0deg, rgba(239,68,68,0.04) 0 1px, transparent 1px 3px);
}
.redacted-stripe {
  position: absolute; top: 0; left: -100%; right: 100%; height: 2px;
  background: linear-gradient(90deg, transparent, var(--red), transparent);
  animation: redacted-scan 4s linear infinite;
}
@keyframes redacted-scan {
  0% { transform: translateX(0); }
  100% { transform: translateX(200%); }
}
.redacted-text {
  font-size: 14px; font-weight: 700; letter-spacing: 3px;
  color: var(--red); text-shadow: 0 0 8px rgba(239,68,68,0.4);
  position: relative; z-index: 1;
}
.redacted-hint {
  font-size: 11px; color: rgba(239,68,68,0.6); margin-top: 8px;
  letter-spacing: 1px; font-style: italic;
  position: relative; z-index: 1;
}

/* ============ ATTACHMENTS ============ */
.att-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.att-chip {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px;
  background: var(--bg-shell);
  border: 1px solid var(--line-2);
  cursor: pointer;
  transition: border-color var(--t-fast), background var(--t-fast);
}
.att-chip:hover { border-color: var(--cyan); background: var(--bg-window); }
.att-icon { font-size: 18px; }
.att-meta { flex: 1; min-width: 0; }
.att-name { font-size: 13px; color: var(--text-1); }
.att-size { font-size: 11px; color: var(--text-3); font-family: var(--mono); }

/* ============ DOC SECTION EDITOR ============ */
.doc-section-edit {
  padding: 12px;
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
  border-left: 3px solid var(--cyan);
  margin-bottom: 10px;
}
.doc-section-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px;
}

/* ============ DOCUMENTS v2 ============ */
.docs-row {
  transition: background var(--t-fast);
}
.docs-row:hover {
  background: var(--bg-shell);
}
.docs-row.sel {
  background: rgba(240,160,64,0.08);
  border-left: 3px solid var(--amber);
}
.docs-row button:hover {
  background: var(--bg-shell) !important;
}

/* ============ RESPONSIVE ============ */
@media (max-width: 760px) {
  .icon-area { grid-template-columns: repeat(auto-fill, 80px); }
  .window { left: 4% !important; top: 4% !important; width: 92% !important; height: 80% !important; min-width: 0; }
  .fb { grid-template-columns: 1fr; }
  .fb-sidebar { display: none; }
  .editor { grid-template-columns: 1fr; }
  .ed-list { display: none; }
  .desk-watermark .big { font-size: 56px; }
  .tb-tray { display: none; }
  .org-tier-branched { grid-template-columns: 1fr; }
  .o5-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
  .crt-overlay { display: none; }
}

/* ============================================================
   FAZ 7 — Personnel rows
   ============================================================ */
.per-row {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 10px;
  align-items: center;
  padding: 8px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.per-row:hover {
  background: rgba(90, 200, 217, 0.06);
}
.per-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.per-name {
  color: var(--text-1);
  font-weight: 600;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.per-sub {
  color: var(--text-2);
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.per-meta {
  color: var(--text-3);
  font-size: 10px;
  letter-spacing: 1px;
  display: flex;
  gap: 6px;
  align-items: center;
  margin-top: 2px;
}
.per-status {
  color: var(--cyan);
  font-size: 11px;
  font-style: italic;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ============================================================
   FAZ 15 — Medikal Paketi (Patients + Pharmacy + Autopsy)
   ============================================================ */

/* Patient rows */
.pat15-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.pat15-row:hover { background: rgba(74, 222, 128, 0.05); }
.pat15-ico { font-size: 22px; color: var(--green); }
.pat15-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pat15-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.pat15-head .pat15-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 11px; }
.pat15-complaint { color: var(--text-1); font-size: 13px; }
.pat15-meta { color: var(--text-3); font-size: 11px; }

/* Pharmacy rows */
.phr-row {
  display: grid;
  grid-template-columns: 40px 1fr 140px;
  gap: 10px;
  align-items: center;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  transition: background 120ms;
}
.phr-row:hover { background: rgba(74, 222, 128, 0.04); }
.phr-ico { font-size: 22px; color: var(--green); }
.phr-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.phr-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.phr-head .phr-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 11px; }
.phr-head .phr-cat { color: var(--text-2); font-size: 11px; letter-spacing: 1px; text-transform: uppercase; }
.phr-name { color: var(--text-1); font-size: 13px; font-weight: 600; }
.phr-meta { color: var(--text-3); font-size: 11px; }
.phr-action { display: flex; gap: 4px; justify-content: flex-end; align-items: center; }
.phr-action button {
  padding: 4px 8px;
  background: var(--bg-input);
  border: 1px solid var(--line-2);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11px;
  cursor: pointer;
  transition: all 120ms;
}
.phr-action button:hover { color: var(--green); border-color: var(--green); }

/* Autopsy rows */
.aut-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.aut-row:hover { background: rgba(239, 68, 68, 0.05); }
.aut-ico { font-size: 22px; color: var(--red); }
.aut-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.aut-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.aut-head .aut-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 11px; }
.aut-subject { color: var(--text-1); font-size: 13px; font-weight: 600; }
.aut-meta { color: var(--text-3); font-size: 11px; }

/* ============================================================
   FAZ 15B — Medical Codex (Foundation Medical Reference)
   ============================================================ */
.cdx-row {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  transition: background 120ms;
}
.cdx-row:hover { background: rgba(74, 222, 128, 0.04); }
.cdx-ico { font-size: 22px; color: var(--cyan); text-align: center; padding-top: 2px; }
.cdx-body { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cdx-head { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cdx-name { color: var(--text-1); font-size: 13px; font-weight: 700; font-family: var(--mono); }
.cdx-meta { color: var(--text-2); font-size: 11px; line-height: 1.5; }
.cdx-meta b { color: var(--amber); font-weight: 600; }

/* Medical Codex — thumbnails + lightbox */
.cdx-row-img {
  grid-template-columns: 72px 1fr;
  align-items: start;
}
.cdx-thumb {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border: 1px solid var(--line-2);
  background: #0a0a0a;
  cursor: zoom-in;
  transition: border-color 120ms, transform 120ms;
}
.cdx-thumb:hover {
  border-color: var(--cyan);
  transform: scale(1.04);
}
.cdx-thumb-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-3);
  font-family: var(--mono);
  font-size: 14px;
  cursor: default;
}

/* Lightbox overlay */
.codex-lb {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.88);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 40px;
  backdrop-filter: blur(6px);
}
.codex-lb.on { display: flex; }
.codex-lb-inner {
  background: var(--bg-1);
  border: 1px solid var(--cyan);
  box-shadow: 0 0 40px rgba(90, 200, 217, 0.3);
  max-width: 92vw;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
}
.codex-lb-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 14px;
  border-bottom: 1px solid var(--line-2);
  background: var(--bg-2);
  font-family: var(--mono);
  font-size: 12px;
  color: var(--amber);
  letter-spacing: 1px;
}
.codex-lb-bar button {
  background: none;
  border: 1px solid var(--line-2);
  color: var(--text-2);
  width: 28px;
  height: 28px;
  font-size: 14px;
  cursor: pointer;
  transition: all 120ms;
}
.codex-lb-bar button:hover {
  color: var(--red);
  border-color: var(--red);
}
.codex-lb-inner img {
  max-width: 86vw;
  max-height: 78vh;
  object-fit: contain;
  display: block;
  background: #000;
}
.codex-lb-foot {
  padding: 6px 14px;
  border-top: 1px solid var(--line-2);
  background: var(--bg-2);
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-3);
  text-align: right;
}

/* ============================================================
   Threat RED — Containment Breach Banner
   ============================================================ */
.breach-banner {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: radial-gradient(ellipse at center, rgba(139, 0, 0, 0.94) 0%, rgba(0, 0, 0, 0.97) 80%);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: breachFadeIn 280ms ease-out, breachShake 80ms steps(4) infinite;
  pointer-events: auto;
}
@keyframes breachFadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes breachShake {
  0%, 100% { transform: translate(0, 0); }
  25%      { transform: translate(-2px, 1px); }
  50%      { transform: translate(1px, -2px); }
  75%      { transform: translate(-1px, 2px); }
}
.breach-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(239, 68, 68, 0.06) 0px,
    rgba(239, 68, 68, 0.06) 1px,
    transparent 1px,
    transparent 3px
  );
  pointer-events: none;
}
.breach-inner {
  text-align: center;
  color: #ff3a3a;
  font-family: var(--mono);
  position: relative;
  z-index: 1;
  max-width: 720px;
  padding: 30px;
}
.breach-line {
  font-size: 32px;
  letter-spacing: 12px;
  color: #ff3a3a;
  animation: breachBlink 600ms ease-in-out infinite alternate;
  margin: 10px 0;
}
@keyframes breachBlink {
  from { opacity: 0.45; }
  to   { opacity: 1; }
}
.breach-title {
  font-size: 64px;
  font-weight: 900;
  letter-spacing: 10px;
  color: #ff3a3a;
  text-shadow: 0 0 24px rgba(239, 68, 68, 0.7),
               0 0 50px rgba(239, 68, 68, 0.5);
  margin: 14px 0;
}
.breach-sub {
  font-size: 16px;
  letter-spacing: 4px;
  color: #ffaaaa;
  margin-bottom: 24px;
}
.breach-red {
  color: #fff;
  background: #ff3a3a;
  padding: 2px 10px;
  letter-spacing: 6px;
  font-weight: 900;
}
.breach-text {
  font-size: 13px;
  line-height: 2;
  color: #ffd4d4;
  letter-spacing: 2px;
  margin-bottom: 28px;
}
.breach-close {
  background: transparent;
  border: 2px solid #ff3a3a;
  color: #ff3a3a;
  font-family: var(--mono);
  font-size: 13px;
  letter-spacing: 4px;
  font-weight: 700;
  padding: 12px 28px;
  cursor: pointer;
  transition: all 160ms;
}
.breach-close:hover {
  background: #ff3a3a;
  color: #000;
  box-shadow: 0 0 24px rgba(239, 68, 68, 0.7);
}

/* Scanline interference during RED state */
body.threat-red::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 6;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(239, 68, 68, 0.025) 0px,
    rgba(239, 68, 68, 0.025) 1px,
    transparent 1px,
    transparent 4px
  );
  animation: redScanlineDrift 7s linear infinite;
}
@keyframes redScanlineDrift {
  from { background-position: 0 0; }
  to   { background-position: 0 100px; }
}

/* Orange threat — milder warning */
body.threat-orange .taskbar {
  border-top-color: var(--orange);
  box-shadow: 0 -2px 8px rgba(251, 146, 60, 0.25);
}

/* ============================================================
   Anomaly Database — Canonical SCP Reference Wiki
   ============================================================ */
.anom-row {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.anom-row:hover { background: rgba(239, 68, 68, 0.04); }

.anom-class {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-weight: 900;
  font-size: 22px;
  border: 2px solid var(--line-2);
  background: var(--bg-shell);
  letter-spacing: 0;
  align-self: center;
}
.anom-class-green  { color: var(--green);  border-color: var(--green);  box-shadow: 0 0 12px rgba(74, 222, 128, 0.25); }
.anom-class-amber  { color: var(--amber);  border-color: var(--amber);  box-shadow: 0 0 12px rgba(251, 191, 36, 0.25); }
.anom-class-red    { color: var(--red);    border-color: var(--red);    box-shadow: 0 0 12px rgba(239, 68, 68, 0.3); }
.anom-class-purple { color: #c084fc;       border-color: #c084fc;       box-shadow: 0 0 12px rgba(192, 132, 252, 0.25); }
.anom-class-cyan   { color: var(--cyan);   border-color: var(--cyan);   box-shadow: 0 0 12px rgba(90, 200, 217, 0.25); }

.anom-body { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.anom-head { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.anom-id { color: var(--amber); font-family: var(--mono); font-weight: 700; font-size: 13px; letter-spacing: 1px; }
.anom-name { color: var(--text-1); font-size: 13px; font-weight: 600; }
.anom-desc { color: var(--text-2); font-size: 12px; line-height: 1.5; }
.anom-meta { color: var(--text-3); font-size: 11px; }

/* Detail document */
.anom-doc {
  padding: 24px 30px;
  background: var(--bg-1);
  font-family: var(--mono);
  color: var(--text-1);
  overflow-y: auto;
  height: 100%;
}
.anom-doc-header {
  border-bottom: 2px solid var(--line-2);
  padding-bottom: 14px;
  margin-bottom: 18px;
}
.anom-id-big {
  font-size: 22px;
  font-weight: 700;
  color: var(--amber);
  letter-spacing: 2px;
  margin-bottom: 8px;
}
.anom-doc-meta {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.anom-doc-section {
  margin-bottom: 18px;
  padding-left: 14px;
  border-left: 2px solid var(--line-2);
}
.anom-doc-label {
  color: var(--amber);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  margin-bottom: 6px;
  text-transform: uppercase;
}
.anom-doc-body {
  color: var(--text-1);
  font-size: 13px;
  line-height: 1.7;
  white-space: pre-wrap;
}
.anom-doc-footer {
  margin-top: 24px;
  padding-top: 14px;
  border-top: 1px solid var(--line-1);
  color: var(--text-3);
  font-size: 10px;
  line-height: 1.6;
  text-align: center;
  letter-spacing: 0.5px;
}

/* Foundation-style CLASSIFIED photo placeholder card */
.anom-photo-card {
  position: relative;
  max-width: 440px;
  margin: 0 auto 22px;
  background: linear-gradient(135deg, #0a0a0a 0%, #160a0a 100%);
  border: 1px solid var(--line-2);
  padding: 28px 24px;
  font-family: var(--mono);
  overflow: hidden;
}
.anom-photo-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    45deg,
    transparent 0,
    transparent 12px,
    rgba(255, 255, 255, 0.015) 12px,
    rgba(255, 255, 255, 0.015) 13px
  );
  pointer-events: none;
}
.anom-photo-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(
    0deg,
    rgba(0, 0, 0, 0.18) 0px,
    rgba(0, 0, 0, 0.18) 1px,
    transparent 1px,
    transparent 3px
  );
  pointer-events: none;
}
.anom-photo-corner {
  position: absolute;
  font-size: 9px;
  letter-spacing: 1.5px;
  color: var(--text-3);
  text-transform: uppercase;
  z-index: 2;
}
.anom-photo-tl { top: 6px; left: 8px; }
.anom-photo-tr { top: 6px; right: 8px; }
.anom-photo-bl { bottom: 6px; left: 8px; }
.anom-photo-br { bottom: 6px; right: 8px; }
.anom-photo-body {
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 18px 0;
}
.anom-photo-stamp {
  font-size: 14px;
  letter-spacing: 8px;
  color: var(--text-2);
  margin-bottom: 4px;
}
.anom-photo-stamp-big {
  font-size: 36px;
  font-weight: 900;
  letter-spacing: 10px;
  margin: 4px 0 14px;
  color: var(--red);
  text-shadow: 0 0 18px rgba(239, 68, 68, 0.5);
  animation: anomStampPulse 2.4s ease-in-out infinite;
}
@keyframes anomStampPulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.72; }
}
.anom-photo-bar {
  height: 6px;
  width: 70%;
  margin: 0 auto 12px;
  background: var(--red);
  box-shadow: 0 0 16px rgba(239, 68, 68, 0.6);
}
.anom-photo-meta {
  font-size: 10px;
  letter-spacing: 3px;
  color: var(--amber);
  text-transform: uppercase;
}
.anom-photo-green  .anom-photo-bar { background: var(--green); box-shadow: 0 0 16px rgba(74, 222, 128, 0.5); }
.anom-photo-amber  .anom-photo-bar { background: var(--amber); box-shadow: 0 0 16px rgba(251, 191, 36, 0.5); }
.anom-photo-red    .anom-photo-bar { background: var(--red);   box-shadow: 0 0 18px rgba(239, 68, 68, 0.65); }
.anom-photo-purple .anom-photo-bar { background: #c084fc;      box-shadow: 0 0 16px rgba(192, 132, 252, 0.5); }
.anom-photo-cyan   .anom-photo-bar { background: var(--cyan);  box-shadow: 0 0 16px rgba(90, 200, 217, 0.5); }
.anom-photo-green  { border-color: rgba(74, 222, 128, 0.35); }
.anom-photo-amber  { border-color: rgba(251, 191, 36, 0.35); }
.anom-photo-red    { border-color: rgba(239, 68, 68, 0.45); }
.anom-photo-purple { border-color: rgba(192, 132, 252, 0.4); }

/* Purple pill (Thaumiel) */
.pill.purple {
  background: rgba(192, 132, 252, 0.16);
  color: #c084fc;
  border: 1px solid rgba(192, 132, 252, 0.35);
}

/* ============================================================
   Area-14 Interactive Facility Map
   ============================================================ */
.map-floor-tab {
  cursor: pointer;
  padding: 3px 10px;
  margin-right: 4px;
  border: 1px solid var(--line-2);
  background: var(--bg-input);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 1px;
  transition: all 120ms;
}
.map-floor-tab:hover { color: var(--cyan); border-color: var(--cyan); }
.map-floor-tab.active {
  background: var(--cyan);
  color: #000;
  font-weight: 700;
  border-color: var(--cyan);
}

.map-wrap {
  display: grid;
  grid-template-columns: 1fr 280px;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.map-canvas-wrap {
  background: var(--bg-1);
  overflow: hidden;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.map-floor-title {
  color: var(--cyan);
  font-family: var(--mono);
  font-size: 13px;
  letter-spacing: 2px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line-1);
}
.map-floor-title b { color: var(--amber); }
.map-floor-desc {
  color: var(--text-3);
  font-size: 11px;
  letter-spacing: 0.5px;
  margin-top: 4px;
  font-weight: normal;
}
.map-svg {
  width: 100%;
  flex: 1;
  min-height: 0;
  display: block;
  background:
    radial-gradient(ellipse at center, rgba(90, 200, 217, 0.04) 0%, transparent 70%),
    #050a0e;
  border: 1px solid var(--line-2);
}
.map-room {
  transition: filter 140ms;
}
.map-room:hover {
  filter: brightness(1.6) drop-shadow(0 0 4px rgba(90, 200, 217, 0.5));
}
.map-room.selected rect {
  filter: drop-shadow(0 0 8px rgba(251, 191, 36, 0.7));
}
.map-pin circle {
  cursor: help;
}

.map-legend {
  display: flex;
  gap: 14px;
  margin-top: 10px;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-3);
  letter-spacing: 0.5px;
  flex-wrap: wrap;
}
.map-legend .dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
}

.map-sidebar {
  background: var(--bg-shell);
  border-left: 1px solid var(--line-1);
  overflow-y: auto;
  padding: 16px 14px;
  font-family: var(--mono);
}
.map-sb-room-link {
  padding: 6px 8px;
  font-size: 12px;
  color: var(--text-1);
  cursor: pointer;
  transition: background 100ms;
  border-bottom: 1px solid var(--line-1);
}
.map-sb-room-link:hover {
  background: rgba(90, 200, 217, 0.08);
  color: var(--cyan);
}

/* SCP Archive — interview + incident log blocks */
.scp-interview-log,
.scp-incident-log {
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.7;
  padding: 12px 16px;
  margin: 8px 0 18px;
  white-space: pre-wrap;
  border-left: 3px solid var(--cyan);
  background: rgba(90, 200, 217, 0.04);
  color: var(--text-1);
}
.scp-incident-log {
  border-left-color: var(--red);
  background: rgba(239, 68, 68, 0.04);
}

/* ============================================================
   Custom Modal — replaces browser prompt/confirm/alert
   ============================================================ */
.modal-ov {
  position: fixed;
  inset: 0;
  z-index: 99998;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  animation: modalOvIn 160ms ease-out;
}
@keyframes modalOvIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
.modal-card {
  background: var(--bg-1);
  border: 1px solid var(--cyan);
  box-shadow: 0 0 30px rgba(90, 200, 217, 0.22),
              0 12px 40px rgba(0, 0, 0, 0.6);
  min-width: 360px;
  max-width: 520px;
  width: 100%;
  font-family: var(--mono);
  animation: modalCardIn 180ms ease-out;
}
@keyframes modalCardIn {
  from { transform: translateY(-8px) scale(0.97); opacity: 0; }
  to   { transform: translateY(0) scale(1); opacity: 1; }
}
.modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: var(--bg-2);
  border-bottom: 1px solid var(--line-2);
}
.modal-title {
  color: var(--amber);
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 700;
}
.modal-x {
  background: none;
  border: 1px solid var(--line-2);
  color: var(--text-2);
  width: 26px;
  height: 26px;
  font-size: 13px;
  cursor: pointer;
  transition: all 100ms;
}
.modal-x:hover { color: var(--red); border-color: var(--red); }
.modal-body {
  padding: 16px 18px;
  max-height: 60vh;
  overflow-y: auto;
}
.modal-text {
  color: var(--text-1);
  font-size: 13px;
  line-height: 1.6;
  margin-bottom: 12px;
  white-space: pre-wrap;
}
.modal-input,
.modal-form input[type="text"],
.modal-form input[type="number"],
.modal-form input[type="email"],
.modal-form input[type="password"],
.modal-form textarea,
.modal-form select {
  width: 100%;
  padding: 8px 10px;
  background: var(--bg-input);
  border: 1px solid var(--line-2);
  color: var(--text-1);
  font-family: var(--mono);
  font-size: 12px;
  outline: none;
  transition: border-color 120ms;
}
.modal-input:focus,
.modal-form input:focus,
.modal-form textarea:focus,
.modal-form select:focus {
  border-color: var(--cyan);
}
.modal-form textarea { resize: vertical; min-height: 60px; }
.modal-field { margin-bottom: 12px; }
.modal-field label {
  display: block;
  color: var(--text-2);
  font-size: 10px;
  letter-spacing: 1.5px;
  margin-bottom: 4px;
  text-transform: uppercase;
}
.modal-field-inline {
  display: flex;
  align-items: center;
  gap: 8px;
}
.modal-field-inline label {
  margin: 0;
  text-transform: none;
  font-size: 12px;
  color: var(--text-1);
  letter-spacing: 0.5px;
}
.modal-field-inline input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--cyan);
}
.modal-foot {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding: 12px 14px;
  background: var(--bg-2);
  border-top: 1px solid var(--line-2);
}
.modal-btn {
  padding: 8px 18px;
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 1px;
  cursor: pointer;
  transition: all 120ms;
}
.modal-btn:hover {
  color: var(--text-1);
  border-color: var(--text-2);
}
.modal-btn-primary {
  background: var(--cyan);
  color: #000;
  border-color: var(--cyan);
  font-weight: 700;
}
.modal-btn-primary:hover {
  background: #7ad8e8;
  border-color: #7ad8e8;
}
.modal-btn-danger {
  background: var(--red);
  color: #fff;
  border-color: var(--red);
  font-weight: 700;
}
.modal-btn-danger:hover {
  background: #c53030;
}

/* Window — minimized state */
.window.minimized {
  display: none;
}
.tb-task.minimized {
  opacity: 0.55;
  font-style: italic;
}
.tb-task.minimized::before {
  content: "_ ";
  color: var(--amber);
}

/* Snap-to-edge hint overlay */
.snap-hint {
  position: fixed;
  background: rgba(90, 200, 217, 0.18);
  border: 2px solid var(--cyan);
  box-shadow: 0 0 24px rgba(90, 200, 217, 0.4);
  pointer-events: none;
  z-index: 99997;
  opacity: 0;
  transition: opacity 120ms;
}
.snap-hint.on { opacity: 1; }
.snap-hint[data-zone="l"]   { left: 0; top: 0; width: 50%; height: calc(100% - 36px); }
.snap-hint[data-zone="r"]   { left: 50%; top: 0; width: 50%; height: calc(100% - 36px); }
.snap-hint[data-zone="top"] { left: 0; top: 0; width: 100%; height: calc(100% - 36px); }
.snap-hint[data-zone="tl"]  { left: 0; top: 0; width: 50%; height: calc((100% - 36px) / 2); }
.snap-hint[data-zone="tr"]  { left: 50%; top: 0; width: 50%; height: calc((100% - 36px) / 2); }
.snap-hint[data-zone="bl"]  { left: 0; top: calc((100% - 36px) / 2); width: 50%; height: calc((100% - 36px) / 2); }
.snap-hint[data-zone="br"]  { left: 50%; top: calc((100% - 36px) / 2); width: 50%; height: calc((100% - 36px) / 2); }

/* Online presence dot — used in Personnel app */
.online-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #4a4a4a;
  margin-right: 4px;
  vertical-align: middle;
  flex-shrink: 0;
}
.online-dot.on {
  background: var(--green);
  box-shadow: 0 0 6px rgba(74, 222, 128, 0.6);
  animation: onlinePulse 2.2s ease-in-out infinite;
}
@keyframes onlinePulse {
  0%, 100% { box-shadow: 0 0 6px rgba(74, 222, 128, 0.6); }
  50%      { box-shadow: 0 0 10px rgba(74, 222, 128, 0.9); }
}

/* Status popover (Faz 17: #17) */
.status-pop {
  position: fixed;
  background: var(--bg-1);
  border: 1px solid var(--cyan);
  box-shadow: 0 0 20px rgba(90, 200, 217, 0.2), 0 8px 24px rgba(0, 0, 0, 0.5);
  font-family: var(--mono);
  padding: 14px;
  width: 320px;
  z-index: 9999;
  bottom: 48px;
  right: 16px;
}
.status-pop-title {
  color: var(--amber);
  font-size: 11px;
  letter-spacing: 1.5px;
  font-weight: 700;
  margin-bottom: 10px;
}
.status-emoji-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 4px;
  margin-bottom: 10px;
}
.status-emoji-btn {
  font-size: 18px;
  padding: 4px;
  background: var(--bg-input);
  border: 1px solid var(--line-2);
  cursor: pointer;
  transition: all 100ms;
}
.status-emoji-btn:hover, .status-emoji-btn.sel {
  border-color: var(--cyan);
  background: rgba(90, 200, 217, 0.15);
  transform: scale(1.1);
}
.status-msg-input {
  width: 100%;
  padding: 6px 8px;
  background: var(--bg-input);
  border: 1px solid var(--line-2);
  color: var(--text-1);
  font-family: var(--mono);
  font-size: 12px;
  margin-bottom: 10px;
}
.status-pop-actions {
  display: flex;
  gap: 6px;
}
.status-pop-actions button {
  flex: 1;
  padding: 6px 10px;
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 1px;
  cursor: pointer;
  transition: all 100ms;
}
.status-pop-actions button:hover { color: var(--text-1); border-color: var(--text-2); }
.status-pop-actions .primary {
  background: var(--cyan);
  color: #000;
  border-color: var(--cyan);
  font-weight: 700;
}
.status-pop-actions .clear { color: var(--red); border-color: var(--red); }
.status-pop-actions .clear:hover { background: var(--red); color: #fff; }

/* Threat transition banner (Faz 17 #8) — non-RED level changes */
.threat-trans-banner {
  position: fixed;
  top: -80px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  background: var(--bg-1);
  border: 1px solid var(--line-2);
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 24px;
  min-width: 480px;
  max-width: 720px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6);
  font-family: var(--mono);
  transition: top 380ms cubic-bezier(0.22, 1, 0.36, 1);
}
.threat-trans-banner.on { top: 12px; }
.threat-trans-green  { border-left: 5px solid var(--green);  box-shadow: 0 0 22px rgba(74, 222, 128, 0.35), 0 12px 32px rgba(0,0,0,0.6); }
.threat-trans-yellow { border-left: 5px solid var(--yellow); box-shadow: 0 0 22px rgba(251, 191, 36, 0.35), 0 12px 32px rgba(0,0,0,0.6); }
.threat-trans-orange { border-left: 5px solid var(--orange); box-shadow: 0 0 22px rgba(251, 146, 60, 0.35), 0 12px 32px rgba(0,0,0,0.6); }

.threat-trans-banner .ttb-ico {
  font-size: 22px;
  font-weight: 900;
}
.threat-trans-green .ttb-ico  { color: var(--green); }
.threat-trans-yellow .ttb-ico { color: var(--yellow); }
.threat-trans-orange .ttb-ico { color: var(--orange); animation: ttbPulse 1.4s ease-in-out infinite; }
@keyframes ttbPulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.55; }
}
.threat-trans-banner .ttb-main { flex: 1; }
.threat-trans-banner .ttb-head {
  font-size: 11px;
  letter-spacing: 2.5px;
  font-weight: 700;
  margin-bottom: 4px;
}
.threat-trans-green .ttb-head  { color: var(--green); }
.threat-trans-yellow .ttb-head { color: var(--yellow); }
.threat-trans-orange .ttb-head { color: var(--orange); }
.threat-trans-banner .ttb-msg {
  font-size: 12px;
  color: var(--text-2);
  letter-spacing: 0.5px;
}
.threat-trans-banner .ttb-close {
  background: none;
  border: 1px solid var(--line-2);
  color: var(--text-3);
  width: 26px;
  height: 26px;
  cursor: pointer;
  font-family: var(--mono);
  transition: all 100ms;
}
.threat-trans-banner .ttb-close:hover {
  color: var(--text-1);
  border-color: var(--text-2);
}

/* Threat-yellow body class — taskbar accent */
body.threat-yellow .taskbar {
  border-top-color: var(--yellow);
  box-shadow: 0 -2px 8px rgba(251, 191, 36, 0.18);
}

/* Anomaly DB ↔ SCP Files cross-link button */
.anom-xlink-btn {
  background: rgba(90, 200, 217, 0.08);
  border: 1px solid var(--cyan);
  color: var(--cyan);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 1px;
  padding: 6px 14px;
  cursor: pointer;
  transition: all 120ms;
}
.anom-xlink-btn:hover {
  background: var(--cyan);
  color: #000;
  box-shadow: 0 0 14px rgba(90, 200, 217, 0.4);
}

/* Faz 17 #25 — Skeleton loaders */
.skel {
  background: linear-gradient(90deg, var(--bg-input) 0%, rgba(255,255,255,0.04) 50%, var(--bg-input) 100%);
  background-size: 200% 100%;
  animation: skelPulse 1.4s ease-in-out infinite;
  border-radius: 2px;
}
@keyframes skelPulse {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.skel-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
}
.skel-circle { width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0; }
.skel-line { height: 12px; flex: 1; }
.skel-line.sm { height: 9px; max-width: 50%; }

/* Doc bookmark button (Faz 17 #9) */
.doc-bookmark-btn {
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11px;
  padding: 4px 10px;
  cursor: pointer;
  transition: all 120ms;
}
.doc-bookmark-btn:hover {
  border-color: var(--amber);
  color: var(--amber);
}
.doc-bookmark-btn.bookmarked {
  background: rgba(251, 191, 36, 0.12);
  border-color: var(--amber);
  color: var(--amber);
  font-weight: 700;
}

/* Faz 17 #19 — Bulletin acknowledge + comments */
.bul-ack-section {
  margin: 16px 0;
  padding: 12px 14px;
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
}
.bul-ack-row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.bul-ack-btn {
  background: var(--green);
  color: #000;
  border: 1px solid var(--green);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 8px 14px;
  cursor: pointer;
  transition: all 120ms;
}
.bul-ack-btn:hover { background: #6ee79c; }
.bul-ack-btn.done {
  background: transparent;
  color: var(--green);
  cursor: default;
}
.bul-ack-btn:disabled { opacity: 1; }
.bul-reads-btn {
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11px;
  padding: 8px 14px;
  cursor: pointer;
  transition: all 120ms;
  margin-left: auto;
}
.bul-reads-btn:hover { border-color: var(--cyan); color: var(--cyan); }

.bul-comments,
.prop-comments {
  margin: 16px 0;
  padding-top: 12px;
  border-top: 1px dashed var(--line-2);
}
.bul-comments-title,
.prop-comments-title {
  color: var(--amber);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 2px;
  margin-bottom: 10px;
  font-weight: 700;
}
.bul-comments-list,
.prop-comments-list {
  max-height: 260px;
  overflow-y: auto;
  margin-bottom: 10px;
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
}
.bul-comment,
.prop-comment {
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
}
.bul-comment:last-child,
.prop-comment:last-child { border-bottom: none; }
.bul-comment-head,
.prop-comment-head {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 4px;
}
.bul-comment-body,
.prop-comment-body {
  color: var(--text-1);
  font-size: 12px;
  line-height: 1.6;
  white-space: pre-wrap;
}
.bul-comment-form,
.prop-comment-form {
  display: flex;
  gap: 6px;
}
.bul-comment-form textarea,
.prop-comment-form textarea {
  flex: 1;
  padding: 6px 10px;
  background: var(--bg-input);
  border: 1px solid var(--line-2);
  color: var(--text-1);
  font-family: var(--mono);
  font-size: 12px;
  resize: vertical;
  min-height: 36px;
}
.bul-comment-form textarea:focus,
.prop-comment-form textarea:focus { border-color: var(--cyan); outline: none; }
.bul-comment-form button,
.prop-comment-form button {
  background: var(--cyan);
  color: #000;
  border: 1px solid var(--cyan);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  padding: 6px 14px;
  cursor: pointer;
  transition: all 120ms;
}
.bul-comment-form button:hover,
.prop-comment-form button:hover { background: #7ad8e8; }

/* Faz 17 #20 — Drill AAR */
.drill-aar {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid var(--line-2);
  background: var(--bg-shell);
}
.drill-aar.drill-aar-pending {
  color: var(--text-3);
  text-align: center;
  font-style: italic;
}
.aar-title {
  color: var(--amber);
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 700;
  margin-bottom: 8px;
}
.aar-hint {
  color: var(--text-3);
  font-size: 11px;
  margin-bottom: 12px;
  line-height: 1.5;
}
.aar-block {
  padding: 8px 0;
  border-bottom: 1px solid var(--line-1);
  font-size: 12px;
  line-height: 1.6;
  color: var(--text-1);
  white-space: pre-wrap;
}
.aar-block:last-child { border-bottom: none; }
.aar-block b { color: var(--cyan); margin-right: 4px; }
.aar-field { margin-bottom: 10px; }
.aar-field label {
  display: block;
  color: var(--cyan);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 1.5px;
  margin-bottom: 4px;
}
.aar-field textarea {
  width: 100%;
  padding: 6px 10px;
  background: var(--bg-input);
  border: 1px solid var(--line-2);
  color: var(--text-1);
  font-family: var(--mono);
  font-size: 12px;
  resize: vertical;
  min-height: 40px;
}
.aar-field textarea:focus { border-color: var(--cyan); outline: none; }
.aar-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 10px;
}
.aar-actions button {
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 1px;
  padding: 8px 14px;
  cursor: pointer;
  transition: all 120ms;
}
.aar-actions button:hover { color: var(--text-1); border-color: var(--text-2); }
.aar-actions .aar-finalize {
  background: var(--green);
  color: #000;
  border-color: var(--green);
  font-weight: 700;
}
.aar-actions .aar-finalize:hover { background: #6ee79c; }
.drill-aar-final {
  border-color: var(--green);
  background: rgba(74, 222, 128, 0.04);
}

/* Faz 17 #5 + #14 — Profile/DClass detail tabs */
.prof-tabs,
.dc-tabs {
  margin-top: 18px;
  border: 1px solid var(--line-2);
  background: var(--bg-shell);
}
.prof-tabs-head,
.dc-tabs-head {
  display: flex;
  border-bottom: 1px solid var(--line-2);
  background: var(--bg-2);
  flex-wrap: wrap;
}
.prof-tab {
  flex: 1;
  min-width: 120px;
  background: transparent;
  border: none;
  border-right: 1px solid var(--line-1);
  color: var(--text-3);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.5px;
  padding: 10px 12px;
  cursor: pointer;
  transition: all 100ms;
}
.prof-tab:last-child { border-right: none; }
.prof-tab:hover { color: var(--text-1); background: rgba(90, 200, 217, 0.04); }
.prof-tab.active {
  color: var(--amber);
  background: var(--bg-shell);
  font-weight: 700;
  border-bottom: 2px solid var(--amber);
}
.prof-tabs-body {
  max-height: 320px;
  overflow-y: auto;
}
.prof-tab-item {
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.prof-tab-item:last-child { border-bottom: none; }
.prof-tab-item:hover { background: rgba(90, 200, 217, 0.05); }

/* D-Class portrait placeholder */
.dc-portrait {
  width: 80px;
  height: 100px;
  background: linear-gradient(135deg, #1a0a0a 0%, #0a0a0a 100%);
  border: 1px solid var(--red);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  color: var(--red);
  font-weight: 900;
  font-size: 26px;
  letter-spacing: 1px;
  box-shadow: inset 0 0 12px rgba(239, 68, 68, 0.2);
  flex-shrink: 0;
}

/* Faz 17 #2 — SCP revisions modal */
.scp-rev-item {
  border: 1px solid var(--line-1);
  padding: 12px 14px;
  margin-bottom: 10px;
  background: var(--bg-shell);
}
.scp-rev-head {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 1px dashed var(--line-1);
}
.scp-rev-num {
  color: var(--cyan);
  font-family: var(--mono);
  font-weight: 700;
  font-size: 12px;
  background: rgba(90, 200, 217, 0.1);
  padding: 2px 8px;
}
.scp-rev-content {
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.6;
}
.scp-rev-row {
  padding: 3px 0;
  color: var(--text-2);
}
.scp-rev-row b { color: var(--amber); margin-right: 4px; }
.scp-rev-det {
  margin-top: 6px;
  border: 1px solid var(--line-1);
  padding: 6px;
  background: var(--bg-input);
}
.scp-rev-det summary {
  cursor: pointer;
  color: var(--cyan);
  font-size: 11px;
  letter-spacing: 0.5px;
  padding: 2px;
}
.scp-rev-det pre {
  margin-top: 6px;
  padding: 8px;
  background: #050a0e;
  color: var(--text-2);
  font-size: 11px;
  white-space: pre-wrap;
  max-height: 200px;
  overflow-y: auto;
}

/* Faz 17 #1 — Ethics rows */
.eth-row {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.eth-row:hover { background: rgba(192, 132, 252, 0.04); }
.eth-row-head {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}

/* Purple pill variant for O5 escalation */
.pill.purple {
  background: rgba(192, 132, 252, 0.12);
  border: 1px solid rgba(192, 132, 252, 0.4);
  color: #c084fc;
}

/* Faz 17 #10 — Mail attachments edit */
.mail-attachments-edit {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  background: var(--bg-input);
  border: 1px dashed var(--line-2);
  min-height: 40px;
}
.mail-att-empty {
  color: var(--text-3);
  font-size: 11px;
  font-style: italic;
  padding: 4px;
}
.mail-att-chip {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  background: var(--bg-shell);
  border: 1px solid var(--line-2);
  font-family: var(--mono);
  font-size: 11px;
  color: var(--text-1);
}
.mail-att-kind { font-size: 14px; }
.mail-att-name { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ============================================================
   FAZ 18 — Department-specific styling
   ============================================================ */

/* Yellow desk icon (Engineering) */
.desk-icon.yellow .glyph { color: var(--yellow); }
.desk-icon.purple .glyph { color: #c084fc; }

/* APP_maintenance — Engineering */
.maint-row {
  display: flex;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: background 120ms;
}
.maint-row:hover { background: rgba(251, 191, 36, 0.04); }
.maint-icon {
  font-size: 22px;
  text-align: center;
  width: 28px;
  flex-shrink: 0;
  padding-top: 2px;
}

/* APP_anchors — Reality Anchor */
.anchor-card {
  border: 1px solid var(--line-2);
  background: var(--bg-shell);
  padding: 14px 16px;
  margin-bottom: 12px;
  position: relative;
}
.anchor-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 10px;
}
.anchor-gauge {
  height: 6px;
  background: var(--bg-input);
  border: 1px solid var(--line-1);
  margin: 8px 0;
  position: relative;
  overflow: hidden;
}
.anchor-gauge-bar {
  height: 100%;
  transition: width 400ms ease-out, background 300ms;
  box-shadow: 0 0 12px currentColor;
}
.anchor-meta {
  display: flex;
  gap: 12px;
  align-items: center;
  font-family: var(--mono);
  font-size: 11px;
}

/* APP_command — O5 Command Center */
.cmd-card {
  border: 1px solid var(--line-2);
  border-left: 3px solid var(--cyan);
  background: var(--bg-shell);
  padding: 12px 14px;
  margin-bottom: 12px;
}
.cmd-card-purple { border-left-color: #c084fc; }
.cmd-card-red { border-left-color: var(--red); background: rgba(239, 68, 68, 0.06); }
.cmd-card-muted { opacity: 0.55; border-left-color: var(--line-2); }

/* Site Lockdown global overlay */
body.site-lockdown-active {
  filter: hue-rotate(-15deg) saturate(1.2);
}
body.site-lockdown-active::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 99996;
  border: 6px solid var(--red);
  box-shadow: inset 0 0 80px rgba(239, 68, 68, 0.4);
  animation: lockdownPulse 1.4s ease-in-out infinite alternate;
}
@keyframes lockdownPulse {
  from { box-shadow: inset 0 0 40px rgba(239, 68, 68, 0.25); }
  to   { box-shadow: inset 0 0 100px rgba(239, 68, 68, 0.55); }
}
.lockdown-overlay {
  position: fixed;
  top: 50px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99997;
  pointer-events: auto;
  font-family: var(--mono);
  transition: top 300ms;
}
.lockdown-overlay.minimized {
  top: -300px;
}
.lockdown-inner {
  background: rgba(20, 0, 0, 0.95);
  border: 2px solid var(--red);
  box-shadow: 0 0 40px rgba(239, 68, 68, 0.6);
  padding: 20px 36px;
  text-align: center;
  min-width: 480px;
}
.lockdown-stripe {
  color: var(--red);
  font-size: 11px;
  letter-spacing: 6px;
  margin-bottom: 8px;
  animation: lockdownStripe 1s linear infinite;
}
@keyframes lockdownStripe { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
.lockdown-title {
  font-size: 32px;
  font-weight: 900;
  letter-spacing: 10px;
  color: var(--red);
  text-shadow: 0 0 18px rgba(239, 68, 68, 0.6);
  margin: 10px 0;
}
.lockdown-mode {
  font-size: 14px;
  letter-spacing: 4px;
  color: var(--amber);
  margin: 8px 0;
}
.lockdown-timer {
  font-size: 22px;
  color: var(--red);
  margin: 8px 0;
  font-weight: 900;
}
.lockdown-reason {
  color: var(--text-2);
  font-size: 12px;
  margin: 8px 0 12px;
  letter-spacing: 1px;
}
.lockdown-dismiss {
  background: transparent;
  border: 1px solid var(--red);
  color: var(--red);
  font-family: var(--mono);
  font-size: 11px;
  padding: 6px 18px;
  cursor: pointer;
  letter-spacing: 2px;
}
.lockdown-dismiss:hover {
  background: var(--red);
  color: #fff;
}

/* Directive ACK Gate */
.directive-ack-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.92);
  backdrop-filter: blur(8px);
  z-index: 99998;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  font-family: var(--mono);
}
.directive-ack-card {
  background: var(--bg-1);
  border: 2px solid #c084fc;
  box-shadow: 0 0 50px rgba(192, 132, 252, 0.4);
  max-width: 720px;
  width: 100%;
  max-height: 92vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.directive-ack-head {
  background: var(--bg-2);
  color: #c084fc;
  padding: 14px 20px;
  letter-spacing: 4px;
  font-weight: 700;
  font-size: 13px;
  border-bottom: 1px solid #c084fc;
  text-align: center;
}
.directive-ack-body {
  padding: 20px;
  overflow-y: auto;
  flex: 1;
}
.directive-item {
  border: 1px solid var(--line-2);
  border-left: 3px solid #c084fc;
  padding: 14px 16px;
  margin-bottom: 14px;
  background: var(--bg-shell);
}
.directive-ack-btn {
  background: #c084fc;
  color: #000;
  border: 1px solid #c084fc;
  padding: 8px 18px;
  font-family: var(--mono);
  font-weight: 700;
  letter-spacing: 1px;
  cursor: pointer;
}
.directive-ack-btn:hover { background: #d4a5ff; }
.directive-ack-btn.done {
  background: transparent;
  color: var(--green);
  border-color: var(--green);
  cursor: default;
}

/* Pill purple */
.pill.purple {
  background: rgba(192, 132, 252, 0.12);
  border: 1px solid #c084fc;
  color: #c084fc;
}

/* Critical patient row pulse */
.pat15-row.pat15-critical {
  background: rgba(239, 68, 68, 0.07);
  border-left: 3px solid var(--red);
  animation: critPulse 1.6s ease-in-out infinite;
}
@keyframes critPulse {
  0%, 100% { background: rgba(239, 68, 68, 0.07); }
  50%      { background: rgba(239, 68, 68, 0.16); }
}

/* ================================================================
   FAZ 19 — UI POLISH PASS
   Tutarli spacing, type, animation. Subtle glow accents.
   Personnel + Profile spesifik ornek, diger app'ler ayni pattern alacak.
   ================================================================ */

/* Universal hover state */
.per-row, .eth-row, .pat15-row, .anom-row, .cdx-row, .maint-row,
.prop-row, .aut-row, .req-row, .disc-row, .vis-row, .int-row,
.pat-row, .drl-row, .arm-row, .phr-row {
  position: relative;
  border-left: 2px solid transparent;
  transition: background var(--t-fast),
              border-left-color var(--t-base),
              box-shadow var(--t-base);
}
.per-row:hover, .eth-row:hover, .pat15-row:hover, .anom-row:hover,
.cdx-row:hover, .maint-row:hover, .prop-row:hover, .aut-row:hover,
.req-row:hover, .disc-row:hover, .vis-row:hover, .int-row:hover,
.pat-row:hover, .drl-row:hover, .arm-row:hover, .phr-row:hover {
  background: linear-gradient(90deg,
    rgba(90, 200, 217, 0.06) 0%,
    rgba(90, 200, 217, 0.02) 60%,
    transparent 100%);
  border-left-color: var(--cyan);
  box-shadow: inset 0 0 12px rgba(90, 200, 217, 0.04);
}

/* Foundation Empty State Component */
.empty-state {
  padding: var(--sp-10) var(--sp-6);
  text-align: center;
  font-family: var(--mono);
  color: var(--text-3);
}
.empty-state-icon {
  font-size: 36px;
  opacity: 0.4;
  margin-bottom: var(--sp-3);
  filter: grayscale(1);
}
.empty-state-title {
  color: var(--text-2);
  font-size: var(--tx-md);
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: var(--sp-2);
}
.empty-state-desc {
  font-size: var(--tx-sm);
  letter-spacing: 0.5px;
  line-height: var(--lh-base);
  max-width: 320px;
  margin: 0 auto;
}
.empty-state-redacted {
  display: inline-block;
  padding: 2px 14px;
  background: linear-gradient(90deg, transparent, #1a0a0a 20%, #1a0a0a 80%, transparent);
  color: var(--red);
  letter-spacing: 4px;
  font-size: var(--tx-xs);
  font-family: var(--mono);
  font-weight: 700;
  margin-bottom: var(--sp-3);
}

/* Button hierarchy */
.btn-primary, .btn-secondary, .btn-ghost, .btn-danger {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-4);
  font-family: var(--mono);
  font-size: var(--tx-sm);
  font-weight: 700;
  letter-spacing: 1.5px;
  cursor: pointer;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-2);
  transition: all var(--t-fast);
  white-space: nowrap;
  text-transform: uppercase;
}
.btn-primary { background: var(--cyan); color: #000; border-color: var(--cyan); }
.btn-primary:hover { background: #7ad8e8; box-shadow: var(--glow-cyan-sm); }
.btn-secondary { border-color: var(--line-2); color: var(--text-2); }
.btn-secondary:hover { border-color: var(--cyan); color: var(--cyan); box-shadow: var(--glow-cyan-sm); }
.btn-ghost { color: var(--text-3); }
.btn-ghost:hover { color: var(--text-1); background: rgba(255,255,255,0.04); }
.btn-danger { background: var(--red); color: #fff; border-color: var(--red); }
.btn-danger:hover { background: #c53030; box-shadow: var(--glow-red-sm); }
.btn-sm { padding: 4px 10px; font-size: var(--tx-xs); }

/* Personnel app polish — improved row layout */
.per-row {
  display: flex;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  align-items: center;
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
}
.per-row .avatar { position: relative; flex-shrink: 0; transition: transform var(--t-base); }
.per-row:hover .avatar { transform: scale(1.05); }
.per-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.per-name {
  color: var(--text-1);
  font-size: var(--tx-lg);
  font-weight: 700;
  letter-spacing: 0.3px;
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}
.per-sub { color: var(--text-2); font-size: var(--tx-md); letter-spacing: 0.2px; }
.per-meta {
  color: var(--text-3);
  font-size: var(--tx-xs);
  letter-spacing: 1.5px;
  margin-top: 2px;
  display: flex;
  gap: var(--sp-2);
  align-items: center;
  text-transform: uppercase;
}
.per-status {
  color: var(--cyan);
  font-size: var(--tx-sm);
  font-style: italic;
  margin-top: 4px;
  padding-left: var(--sp-2);
  border-left: 2px solid var(--cyan);
  opacity: 0.85;
}

/* Online dot upgrade */
.online-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: var(--r-pill);
  background: var(--text-4);
  flex-shrink: 0;
  vertical-align: middle;
  margin-right: 6px;
  transition: all var(--t-base);
}
.online-dot.on {
  background: var(--green);
  box-shadow: 0 0 0 2px rgba(74, 222, 128, 0.18), var(--glow-green-sm);
  animation: onlinePulse19 2.4s ease-in-out infinite;
}
@keyframes onlinePulse19 {
  0%, 100% { box-shadow: 0 0 0 2px rgba(74, 222, 128, 0.18), var(--glow-green-sm); }
  50%      { box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.28), var(--glow-green-md); }
}

/* Profile detail polish */
.profile-header {
  display: flex;
  gap: var(--sp-5);
  padding: var(--sp-6) var(--sp-5);
  margin-bottom: var(--sp-5);
  border-bottom: 1px solid var(--line-1);
  background: linear-gradient(180deg, rgba(90,200,217,0.04) 0%, transparent 100%);
}
.profile-avatar {
  position: relative;
  width: 88px;
  height: 88px;
  flex-shrink: 0;
}
.profile-avatar > img,
.profile-avatar > div {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border-radius: 50% !important;
  border: 2px solid var(--line-2) !important;
  transition: border-color var(--t-base), box-shadow var(--t-base);
  font-size: 36px !important;
}
.profile-avatar.online > img,
.profile-avatar.online > div {
  border-color: var(--green) !important;
  box-shadow: var(--glow-green-md);
}
.profile-avatar .presence-pill {
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  padding: 2px 10px;
  background: var(--bg-1);
  border: 1px solid var(--green);
  color: var(--green);
  font-family: var(--mono);
  font-size: var(--tx-xs);
  font-weight: 700;
  letter-spacing: 1.5px;
  white-space: nowrap;
}
.profile-id { flex: 1; min-width: 0; }
.profile-username {
  color: var(--text-1);
  font-size: var(--tx-3xl);
  font-weight: 700;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  margin-bottom: var(--sp-1);
  font-family: var(--mono);
  flex-wrap: wrap;
}
.profile-name { color: var(--text-2); font-size: var(--tx-lg); margin-bottom: 4px; letter-spacing: 0.3px; }
.profile-title-line {
  color: var(--text-3);
  font-size: var(--tx-md);
  letter-spacing: 1px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex-wrap: wrap;
}
.profile-title-line .seperator { color: var(--line-2); }

/* Profile section blocks */
.profile-block {
  padding: var(--sp-4) var(--sp-5);
  border-left: 3px solid var(--cyan);
  background: var(--bg-shell);
  margin-bottom: var(--sp-3);
}
.profile-block.b-amber  { border-left-color: var(--amber); }
.profile-block.b-green  { border-left-color: var(--green); }
.profile-block.b-red    { border-left-color: var(--red); background: rgba(239, 68, 68, 0.04); }
.profile-block.b-purple { border-left-color: #c084fc; }
.profile-block-label {
  color: var(--cyan);
  font-size: var(--tx-xs);
  letter-spacing: 2px;
  font-weight: 700;
  margin-bottom: var(--sp-2);
  text-transform: uppercase;
}
.profile-block.b-amber  .profile-block-label { color: var(--amber); }
.profile-block.b-green  .profile-block-label { color: var(--green); }
.profile-block.b-red    .profile-block-label { color: var(--red); }
.profile-block.b-purple .profile-block-label { color: #c084fc; }
.profile-block-body { color: var(--text-1); font-size: var(--tx-lg); line-height: var(--lh-base); white-space: pre-wrap; }

/* Profile meta grid */
.profile-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-3);
  padding: var(--sp-4);
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
  margin-bottom: var(--sp-4);
}
.profile-meta-item {
  font-family: var(--mono);
  font-size: var(--tx-md);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.profile-meta-label {
  color: var(--text-3);
  font-size: var(--tx-xs);
  letter-spacing: 1.5px;
  text-transform: uppercase;
}
.profile-meta-value { color: var(--text-1); font-weight: 700; }

/* Profile actions toolbar */
.profile-actions {
  display: flex;
  gap: var(--sp-2);
  flex-wrap: wrap;
  padding: var(--sp-4) var(--sp-5);
  background: linear-gradient(180deg, transparent, rgba(0,0,0,0.2));
  border-top: 1px solid var(--line-1);
  margin-top: var(--sp-5);
}

/* Profile tabs polish */
.prof-tabs {
  margin-top: var(--sp-5);
  border: 1px solid var(--line-2);
  background: var(--bg-shell);
}
.prof-tabs-head {
  display: flex;
  border-bottom: 2px solid var(--line-2);
  background: var(--bg-2);
}
.prof-tab {
  flex: 1;
  background: transparent;
  border: none;
  border-right: 1px solid var(--line-1);
  color: var(--text-3);
  font-family: var(--mono);
  font-size: var(--tx-sm);
  letter-spacing: 1px;
  padding: var(--sp-3) var(--sp-3);
  cursor: pointer;
  transition: all var(--t-fast);
  position: relative;
}
.prof-tab::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 2px;
  background: var(--amber);
  transition: width var(--t-base) var(--ease-out);
  box-shadow: var(--glow-amber-sm);
}
.prof-tab:hover { color: var(--text-1); background: rgba(255,255,255,0.02); }
.prof-tab.active { color: var(--amber); background: var(--bg-shell); font-weight: 700; }
.prof-tab.active::after { width: 80%; }
.prof-tabs-body { max-height: 320px; overflow-y: auto; background: var(--bg-1); }
.prof-tab-item {
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: all var(--t-fast);
  border-left: 2px solid transparent;
}
.prof-tab-item:hover {
  background: rgba(90, 200, 217, 0.05);
  border-left-color: var(--cyan);
  padding-left: calc(var(--sp-4) + 2px);
}

/* IA Notes block */
.ia-notes-block {
  margin-top: var(--sp-4);
  padding: var(--sp-4);
  background: rgba(239, 68, 68, 0.04);
  border: 1px solid var(--red);
  border-left: 3px solid var(--red);
  position: relative;
}
.ia-notes-block-label {
  position: absolute;
  top: -8px;
  left: var(--sp-3);
  padding: 0 var(--sp-2);
  background: var(--bg-1);
  color: var(--red);
  font-family: var(--mono);
  font-size: var(--tx-xs);
  letter-spacing: 2px;
  font-weight: 700;
}

/* Focus rings */
*:focus-visible {
  outline: 1px solid var(--cyan);
  outline-offset: 1px;
  box-shadow: var(--glow-cyan-sm);
}
button:focus-visible, .tb-task:focus-visible, .desk-icon:focus-visible {
  outline-offset: 2px;
}

/* Custom scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--bg-shell); }
::-webkit-scrollbar-thumb {
  background: var(--line-2);
  border: 1px solid var(--bg-shell);
  transition: background var(--t-fast);
}
::-webkit-scrollbar-thumb:hover { background: var(--cyan); }
::-webkit-scrollbar-corner { background: var(--bg-shell); }

/* Pills upgrade — global consistency */
.pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  font-family: var(--mono);
  font-size: var(--tx-xs);
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  border: 1px solid;
  white-space: nowrap;
}
.pill.green  { color: var(--green);  border-color: rgba(74, 222, 128, 0.55); background: rgba(74, 222, 128, 0.08); }
.pill.red    { color: var(--red);    border-color: rgba(239, 68, 68, 0.55);  background: rgba(239, 68, 68, 0.08); }
.pill.amber  { color: var(--amber);  border-color: rgba(240, 160, 64, 0.55); background: rgba(240, 160, 64, 0.08); }
.pill.cyan   { color: var(--cyan);   border-color: rgba(90, 200, 217, 0.55); background: rgba(90, 200, 217, 0.08); }
.pill.orange { color: var(--orange); border-color: rgba(251, 146, 60, 0.55); background: rgba(251, 146, 60, 0.08); }
.pill.muted, .pill.gray { color: var(--text-3); border-color: var(--line-2); background: rgba(255, 255, 255, 0.02); }
.pill.o5     { color: #c084fc; border-color: rgba(192, 132, 252, 0.55); background: rgba(192, 132, 252, 0.10); box-shadow: var(--glow-purple-sm); }
.pill.purple { color: #c084fc; border-color: rgba(192, 132, 252, 0.55); background: rgba(192, 132, 252, 0.10); }
.pill.glow-cyan   { box-shadow: var(--glow-cyan-sm); }
.pill.glow-amber  { box-shadow: var(--glow-amber-sm); }
.pill.glow-green  { box-shadow: var(--glow-green-sm); }
.pill.glow-red    { box-shadow: var(--glow-red-sm); }

/* Sidebar items — better active state */
.fb-sidebar .item {
  position: relative;
  padding: var(--sp-2) var(--sp-4);
  font-size: var(--tx-md);
  color: var(--text-2);
  cursor: pointer;
  border-left: 2px solid transparent;
  transition: all var(--t-fast);
}
.fb-sidebar .item:hover {
  background: rgba(90, 200, 217, 0.04);
  color: var(--text-1);
  border-left-color: var(--text-3);
}
.fb-sidebar .item.active {
  background: linear-gradient(90deg,
    rgba(240, 160, 64, 0.12) 0%,
    rgba(240, 160, 64, 0.02) 100%);
  color: var(--amber);
  border-left-color: var(--amber);
  font-weight: 700;
  box-shadow: inset 0 0 12px rgba(240, 160, 64, 0.06);
}
.fb-sidebar .sec {
  padding: var(--sp-3) var(--sp-4) var(--sp-1);
  color: var(--text-3);
  font-size: var(--tx-2xs);
  letter-spacing: 2.5px;
  text-transform: uppercase;
  font-weight: 700;
}

/* Menubar polish */
.win-menubar {
  display: flex;
  gap: var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
  background: var(--bg-2);
  border-bottom: 1px solid var(--line-1);
  font-size: var(--tx-md);
  flex-wrap: wrap;
  align-items: center;
}
.win-menubar > span {
  padding: 2px var(--sp-2);
  color: var(--text-2);
  cursor: pointer;
  transition: all var(--t-fast);
  border-bottom: 1px solid transparent;
}
.win-menubar > span:hover {
  color: var(--cyan);
  border-bottom-color: var(--cyan);
}
.win-menubar .sep { color: var(--line-2); cursor: default; padding: 0 2px; }
.win-menubar > span.sep:hover { color: var(--line-2); border-bottom-color: transparent; }

/* ================================================================
   FAZ 19B — Polish'i tum siteye yay
   Existing classes upgrade — JS degisiklikleri minimal kalir
   ================================================================ */

/* ---------- Window chrome polish ---------- */
.window {
  border-radius: var(--r-0);
  box-shadow: var(--scan-3);
  transition: box-shadow var(--t-base);
}
.window:focus-within {
  box-shadow: var(--scan-3), var(--glow-cyan-sm);
}
.win-titlebar {
  background: linear-gradient(180deg, var(--bg-header) 0%, var(--bg-2) 100%);
  border-bottom: 1px solid var(--line-2);
  padding: var(--sp-1) var(--sp-3);
}
.win-titlebar .title {
  letter-spacing: 1.2px;
  font-size: var(--tx-md);
  text-transform: uppercase;
  color: var(--text-1);
  font-weight: 700;
}
.win-titlebar .controls button {
  transition: all var(--t-fast);
  border-radius: var(--r-0);
}
.win-titlebar .controls button:hover {
  background: rgba(255,255,255,0.06);
  box-shadow: inset 0 -2px 0 var(--cyan);
}
.win-titlebar .controls button.close:hover {
  background: var(--red);
  color: #fff;
  box-shadow: var(--glow-red-sm);
}
.win-statusbar {
  background: var(--bg-2);
  border-top: 1px solid var(--line-1);
  padding: 4px var(--sp-3);
  font-size: var(--tx-xs);
  letter-spacing: 1.2px;
  color: var(--text-3);
  text-transform: uppercase;
  font-family: var(--mono);
}
.win-statusbar b { color: var(--amber); }
.win-statusbar .sep { color: var(--line-2); margin: 0 var(--sp-2); }

/* ---------- login-submit button gets upgrade (used by old code) ---------- */
.login-submit {
  background: var(--cyan);
  color: #000;
  border: 1px solid var(--cyan);
  font-family: var(--mono);
  font-size: var(--tx-sm);
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: var(--sp-2) var(--sp-4);
  cursor: pointer;
  transition: all var(--t-fast);
}
.login-submit:hover {
  background: #7ad8e8;
  box-shadow: var(--glow-cyan-sm);
}
.login-submit[style*="background:var(--red)"]:hover,
.login-submit[style*="background: var(--red)"]:hover {
  background: #c53030 !important;
  box-shadow: var(--glow-red-sm);
}

/* ---------- Form fields (used in editors site-wide) ---------- */
.ed-form .field,
.ed-form .field label {
  display: block;
}
.ed-form .field {
  margin-bottom: var(--sp-3);
}
.ed-form .field label {
  color: var(--text-3);
  font-size: var(--tx-xs);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: var(--sp-1);
  font-weight: 700;
}
.ed-form input[type="text"],
.ed-form input[type="number"],
.ed-form input[type="email"],
.ed-form input[type="password"],
.ed-form input[type="date"],
.ed-form input:not([type]),
.ed-form select,
.ed-form textarea {
  width: 100%;
  padding: var(--sp-2) var(--sp-3);
  background: var(--bg-input);
  border: 1px solid var(--line-2);
  color: var(--text-1);
  font-family: var(--mono);
  font-size: var(--tx-md);
  outline: none;
  transition: all var(--t-fast);
}
.ed-form input:focus,
.ed-form select:focus,
.ed-form textarea:focus {
  border-color: var(--cyan);
  box-shadow: var(--glow-cyan-sm);
}
.ed-form textarea {
  resize: vertical;
  min-height: 80px;
  line-height: var(--lh-base);
}
.ed-form .row2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-3);
}
.ed-form .row3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: var(--sp-3);
}
.ed-form .template-hint {
  padding: var(--sp-3) var(--sp-4);
  background: var(--bg-shell);
  border-left: 3px solid var(--cyan);
  color: var(--text-2);
  font-size: var(--tx-md);
  line-height: var(--lh-base);
  margin-bottom: var(--sp-4);
}
.ed-form .help {
  color: var(--text-3);
  font-size: var(--tx-sm);
  letter-spacing: 0.5px;
  margin-top: var(--sp-1);
  font-style: italic;
}

.ed-toolbar {
  display: flex;
  gap: var(--sp-2);
  align-items: center;
  padding: var(--sp-2) var(--sp-3);
  background: var(--bg-2);
  border-bottom: 1px solid var(--line-2);
}
.ed-toolbar .meta {
  flex: 1;
  font-family: var(--mono);
  color: var(--text-2);
  font-size: var(--tx-sm);
  display: flex;
  gap: var(--sp-2);
  letter-spacing: 1px;
  text-transform: uppercase;
}
.ed-toolbar .meta .warn { color: var(--amber); }
.ed-toolbar button {
  padding: var(--sp-1) var(--sp-3);
  background: transparent;
  border: 1px solid var(--line-2);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: var(--tx-xs);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all var(--t-fast);
}
.ed-toolbar button:hover {
  border-color: var(--cyan);
  color: var(--cyan);
}
.ed-toolbar button.primary {
  background: var(--cyan);
  color: #000;
  border-color: var(--cyan);
  font-weight: 700;
}
.ed-toolbar button.primary:hover {
  background: #7ad8e8;
  box-shadow: var(--glow-cyan-sm);
}

/* ---------- Document (SCP/Archive) polish ---------- */
.doc {
  padding: var(--sp-6) var(--sp-6);
  background: var(--bg-1);
  font-family: var(--mono);
  color: var(--text-1);
  line-height: var(--lh-base);
}
.doc .head {
  border-bottom: 2px solid var(--line-2);
  padding-bottom: var(--sp-4);
  margin-bottom: var(--sp-5);
  text-align: center;
  position: relative;
}
.doc .head .seal {
  display: inline-block;
  padding: 4px var(--sp-4);
  border: 1px solid var(--amber);
  color: var(--amber);
  font-size: var(--tx-xs);
  letter-spacing: 4px;
  margin-bottom: var(--sp-3);
  text-transform: uppercase;
  background: linear-gradient(180deg, rgba(240,160,64,0.06), transparent);
}
.doc .head h2 {
  font-size: var(--tx-4xl);
  letter-spacing: 4px;
  color: var(--amber);
  margin: var(--sp-2) 0 var(--sp-2);
  font-weight: 900;
  text-shadow: 0 0 12px rgba(240, 160, 64, 0.3);
}
.doc .head .sub {
  color: var(--text-3);
  font-size: var(--tx-sm);
  letter-spacing: 3px;
  text-transform: uppercase;
}
.doc h3 {
  color: var(--amber);
  font-size: var(--tx-md);
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: var(--sp-5) 0 var(--sp-2);
  padding-bottom: var(--sp-1);
  border-bottom: 1px solid var(--line-1);
  font-weight: 700;
}
.doc p {
  margin: 0 0 var(--sp-3);
  color: var(--text-1);
  font-size: var(--tx-lg);
  line-height: var(--lh-loose);
  white-space: pre-wrap;
}
.doc blockquote {
  margin: var(--sp-3) 0;
  padding: var(--sp-3) var(--sp-4);
  background: var(--bg-shell);
  border-left: 3px solid var(--amber);
  font-style: italic;
  color: var(--text-2);
  font-size: var(--tx-md);
}
.doc .meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-2) var(--sp-4);
  padding: var(--sp-3) var(--sp-4);
  background: var(--bg-shell);
  border: 1px solid var(--line-1);
  margin-bottom: var(--sp-4);
  font-family: var(--mono);
}
.doc .meta-grid .k {
  color: var(--text-3);
  font-size: var(--tx-xs);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-right: var(--sp-2);
}
.doc .meta-grid .v {
  color: var(--text-1);
  font-weight: 700;
  font-size: var(--tx-md);
}

/* SCP reference inline link */
.scp-ref {
  display: inline-block;
  padding: 0 4px;
  background: rgba(90, 200, 217, 0.12);
  color: var(--cyan);
  border: 1px solid transparent;
  font-family: var(--mono);
  font-weight: 700;
  cursor: pointer;
  transition: all var(--t-fast);
  font-size: 0.95em;
}
.scp-ref:hover {
  background: rgba(90, 200, 217, 0.22);
  border-color: var(--cyan);
  box-shadow: var(--glow-cyan-sm);
}

/* ---------- Table polish (used by D-Class, Activity, others) ---------- */
.tbl-wrap {
  overflow-x: auto;
  background: var(--bg-1);
}
.tbl-wrap table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--mono);
  font-size: var(--tx-md);
}
.tbl-wrap thead th {
  position: sticky;
  top: 0;
  background: var(--bg-2);
  color: var(--text-3);
  font-size: var(--tx-xs);
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 700;
  padding: var(--sp-2) var(--sp-3);
  border-bottom: 2px solid var(--line-2);
  text-align: left;
}
.tbl-wrap tbody tr {
  transition: background var(--t-fast);
  border-bottom: 1px solid var(--line-1);
}
.tbl-wrap tbody tr:hover {
  background: rgba(90, 200, 217, 0.06);
}
.tbl-wrap tbody td {
  padding: var(--sp-2) var(--sp-3);
  color: var(--text-1);
  vertical-align: middle;
}

/* ---------- File browser layout polish ---------- */
.fb {
  display: flex;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.fb-sidebar {
  width: 200px;
  background: var(--bg-shell);
  border-right: 1px solid var(--line-1);
  flex-shrink: 0;
}
.fb-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.fb-list .head {
  display: grid;
  background: var(--bg-2);
  border-bottom: 2px solid var(--line-2);
  padding: var(--sp-2) var(--sp-3);
  font-size: var(--tx-xs);
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--text-3);
  font-weight: 700;
  font-family: var(--mono);
}
.fb-list .row {
  display: grid;
  padding: var(--sp-2) var(--sp-3);
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  font-size: var(--tx-md);
  transition: all var(--t-fast);
  border-left: 2px solid transparent;
  align-items: center;
}
.fb-list .row:hover {
  background: linear-gradient(90deg, rgba(90, 200, 217, 0.06), transparent 60%);
  border-left-color: var(--cyan);
}
.fb-list .row .name {
  color: var(--amber);
  font-family: var(--mono);
  font-weight: 700;
  letter-spacing: 0.5px;
}

/* ---------- Attachment chip polish ---------- */
.att-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3);
  background: var(--bg-shell);
  border: 1px solid var(--line-2);
  margin: 2px var(--sp-1) 2px 0;
  transition: all var(--t-fast);
  cursor: pointer;
}
.att-chip:hover {
  border-color: var(--cyan);
  background: rgba(90, 200, 217, 0.06);
  box-shadow: var(--glow-cyan-sm);
}
.att-icon { font-size: var(--tx-lg); }
.att-meta { display: flex; flex-direction: column; min-width: 0; }
.att-name {
  color: var(--text-1);
  font-size: var(--tx-md);
  font-weight: 700;
  font-family: var(--mono);
}
.att-size {
  color: var(--text-3);
  font-size: var(--tx-xs);
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* ---------- Bulletin card polish ---------- */
.bul-card {
  padding: var(--sp-4) var(--sp-4);
  border: 1px solid var(--line-2);
  background: var(--bg-shell);
  margin-bottom: var(--sp-3);
  cursor: pointer;
  border-left: 3px solid var(--line-2);
  transition: all var(--t-fast);
}
.bul-card:hover {
  background: var(--bg-2);
  border-left-color: var(--cyan);
  box-shadow: var(--glow-cyan-sm);
}
.bul-card.pinned {
  border-left-color: var(--amber);
  background: linear-gradient(90deg, rgba(240, 160, 64, 0.06), var(--bg-shell) 80%);
}
.bul-card.pinned:hover {
  border-left-color: var(--amber);
  box-shadow: var(--glow-amber-sm);
}
.bul-card.expired { opacity: 0.55; }
.bul-card.archived {
  background: var(--bg-1);
  border-style: dashed;
}

/* ---------- Threat board polish ---------- */
.threat-btn {
  padding: var(--sp-3) var(--sp-3);
  background: var(--bg-shell);
  border: 2px solid var(--line-2);
  color: var(--text-2);
  font-family: var(--mono);
  font-size: var(--tx-md);
  font-weight: 700;
  letter-spacing: 2px;
  cursor: pointer;
  transition: all var(--t-fast);
  text-transform: uppercase;
  position: relative;
  overflow: hidden;
}
.threat-btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: currentColor;
  opacity: 0;
  transition: opacity var(--t-base);
}
.threat-btn:hover::before { opacity: 0.06; }
.threat-btn.green:hover  { border-color: var(--green);  color: var(--green); box-shadow: var(--glow-green-sm); }
.threat-btn.yellow:hover { border-color: var(--yellow); color: var(--yellow); box-shadow: 0 0 8px rgba(250, 204, 21, 0.4); }
.threat-btn.orange:hover { border-color: var(--orange); color: var(--orange); box-shadow: 0 0 8px rgba(251, 146, 60, 0.4); }
.threat-btn.red:hover    { border-color: var(--red);    color: var(--red); box-shadow: var(--glow-red-sm); }
.threat-btn.current {
  cursor: default;
  opacity: 0.55;
}

/* Threat state cards */
.threat-state .level {
  font-size: var(--tx-4xl);
  letter-spacing: 6px;
  font-weight: 900;
  text-shadow: 0 0 16px currentColor;
}
.threat-state .label {
  letter-spacing: 4px;
  font-size: var(--tx-md);
  text-transform: uppercase;
  color: var(--text-2);
}
.alert {
  padding: var(--sp-3) var(--sp-4);
  border-left: 3px solid;
  background: var(--bg-shell);
  margin-bottom: var(--sp-2);
  font-family: var(--mono);
  font-size: var(--tx-md);
}
.alert.low      { border-left-color: var(--text-3); }
.alert.mid      { border-left-color: var(--amber); }
.alert.high     { border-left-color: var(--orange); }
.alert.critical { border-left-color: var(--red); box-shadow: inset 0 0 12px rgba(239, 68, 68, 0.06); }
.alert .ts { color: var(--text-3); font-size: var(--tx-xs); letter-spacing: 1.5px; text-transform: uppercase; margin-bottom: 2px; }
.alert .txt { color: var(--text-1); line-height: var(--lh-base); }

/* ---------- MTF team polish ---------- */
.mtf-team {
  background: var(--bg-shell);
  border: 1px solid var(--line-2);
  border-left: 3px solid var(--orange);
  padding: var(--sp-5);
  margin-bottom: var(--sp-4);
}
.mtf-team .mtf-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--sp-4);
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--line-1);
  margin-bottom: var(--sp-3);
}
.mtf-team .codename {
  color: var(--orange);
  font-family: var(--mono);
  font-weight: 700;
  font-size: var(--tx-md);
  letter-spacing: 2px;
  text-transform: uppercase;
}
.mtf-team h3 {
  font-size: var(--tx-2xl);
  color: var(--text-1);
  margin: 4px 0;
  letter-spacing: 1px;
}
.mtf-team .specialty {
  color: var(--text-3);
  font-size: var(--tx-md);
  font-style: italic;
  margin: 0;
}
.mtf-team .status-block {
  text-align: right;
  font-family: var(--mono);
  font-size: var(--tx-xs);
  letter-spacing: 1.5px;
  color: var(--text-3);
  text-transform: uppercase;
}
.mtf-team .status-block .v {
  color: var(--amber);
  font-size: var(--tx-2xl);
  font-weight: 900;
  letter-spacing: 1px;
  margin: 2px 0;
}
.mtf-team .mtf-section h4 {
  color: var(--text-3);
  font-size: var(--tx-xs);
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: var(--sp-2);
  font-weight: 700;
}
.mtf-team .mtf-section ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.mtf-team .mtf-section li {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--line-1);
  background: var(--bg-1);
  margin-bottom: var(--sp-1);
  transition: all var(--t-fast);
}
.mtf-team .mtf-section li:hover {
  border-color: var(--orange);
  background: var(--bg-shell);
}
.mtf-team .role {
  color: var(--orange);
  font-family: var(--mono);
  font-size: var(--tx-xs);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  min-width: 70px;
}
.mtf-team .name {
  color: var(--text-1);
  font-size: var(--tx-md);
}

/* ---------- Loading skeleton polish ---------- */
.skel {
  background: linear-gradient(90deg,
    var(--bg-input) 0%,
    rgba(90, 200, 217, 0.06) 50%,
    var(--bg-input) 100%);
  background-size: 200% 100%;
  animation: skelShimmer 1.6s ease-in-out infinite;
}
@keyframes skelShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ---------- Cmd palette polish ---------- */
.cmd-palette {
  background: var(--bg-1);
  border: 1px solid var(--cyan);
  box-shadow: var(--scan-3), var(--glow-cyan-md);
  max-width: 720px;
  width: 90vw;
  margin: 8vh auto;
}
.cmd-head {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--line-2);
  background: var(--bg-2);
}
.cmd-head .cmd-icon {
  color: var(--cyan);
  font-size: var(--tx-xl);
}
.cmd-head input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: var(--text-1);
  font-family: var(--mono);
  font-size: var(--tx-lg);
  letter-spacing: 0.5px;
}
.cmd-results {
  max-height: 60vh;
  overflow-y: auto;
}
.cmd-item {
  display: flex;
  gap: var(--sp-3);
  align-items: center;
  padding: var(--sp-2) var(--sp-4);
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: all var(--t-fast);
  border-left: 2px solid transparent;
}
.cmd-item:hover, .cmd-item.active {
  background: rgba(90, 200, 217, 0.08);
  border-left-color: var(--cyan);
}
.cmd-item .ico { font-size: var(--tx-lg); width: 28px; text-align: center; }
.cmd-item .body { flex: 1; min-width: 0; }
.cmd-item .t {
  color: var(--text-1);
  font-size: var(--tx-md);
  font-weight: 700;
}
.cmd-item .m {
  color: var(--text-3);
  font-size: var(--tx-xs);
  letter-spacing: 0.5px;
  margin-top: 1px;
}
.cmd-item .tag {
  color: var(--text-3);
  font-size: var(--tx-2xs);
  letter-spacing: 1.5px;
  font-family: var(--mono);
  text-transform: uppercase;
  padding: 1px 6px;
  border: 1px solid var(--line-2);
}
.cmd-foot {
  padding: var(--sp-2) var(--sp-4);
  border-top: 1px solid var(--line-2);
  background: var(--bg-2);
  display: flex;
  gap: var(--sp-4);
  font-size: var(--tx-xs);
  color: var(--text-3);
  letter-spacing: 1px;
}
.cmd-foot kbd {
  display: inline-block;
  padding: 1px 6px;
  background: var(--bg-shell);
  border: 1px solid var(--line-2);
  font-family: var(--mono);
  font-size: var(--tx-2xs);
  color: var(--cyan);
}
.cmd-empty {
  padding: var(--sp-8);
  text-align: center;
  color: var(--text-3);
  font-style: italic;
}

/* ---------- Mail polish ---------- */
.mail-row {
  padding: var(--sp-2) var(--sp-3);
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  border-left: 2px solid transparent;
  transition: all var(--t-fast);
}
.mail-row:hover, .mail-row.selected {
  background: var(--bg-2);
  border-left-color: var(--cyan);
}
.mail-row.selected {
  box-shadow: inset 0 0 12px rgba(90, 200, 217, 0.06);
}
.mail-row.unread {
  background: linear-gradient(90deg, rgba(240, 160, 64, 0.06), transparent 60%);
}
.mail-row.unread .subj { color: var(--amber); font-weight: 700; }

/* ---------- Per-tab content polish ---------- */
.prof-tabs-body .prof-tab-item:last-child {
  border-bottom: none;
}

/* ---------- O5 Command card polish ---------- */
.cmd-card {
  padding: var(--sp-4) var(--sp-5);
  border-radius: var(--r-0);
  transition: all var(--t-fast);
}
.cmd-card:hover {
  box-shadow: var(--glow-cyan-sm);
  border-color: var(--cyan);
}
.cmd-card-purple:hover { box-shadow: var(--glow-purple-sm); border-color: #c084fc; }
.cmd-card-red:hover { box-shadow: var(--glow-red-sm); }
.cmd-card-muted { opacity: 0.55; }
.cmd-card-muted:hover { opacity: 0.7; box-shadow: none; }

/* ---------- Maintenance row polish ---------- */
.maint-row {
  display: flex;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--line-1);
  align-items: center;
  cursor: pointer;
}

/* ---------- Anchor card polish ---------- */
.anchor-card {
  border-radius: var(--r-0);
  transition: all var(--t-fast);
  padding: var(--sp-4) var(--sp-5);
}
.anchor-card:hover {
  background: var(--bg-2);
  box-shadow: var(--glow-cyan-sm);
}

/* ---------- Notification panel polish ---------- */
.notify-panel {
  background: var(--bg-1);
  border: 1px solid var(--cyan);
  box-shadow: var(--scan-3), var(--glow-cyan-md);
}
.notify-item {
  padding: var(--sp-3);
  border-bottom: 1px solid var(--line-1);
  cursor: pointer;
  transition: all var(--t-fast);
  border-left: 2px solid transparent;
}
.notify-item:hover {
  background: var(--bg-2);
  border-left-color: var(--cyan);
}
.notify-item.unread {
  background: linear-gradient(90deg, rgba(240, 160, 64, 0.04), transparent);
  border-left-color: var(--amber);
}

/* ---------- Taskbar polish ---------- */
.taskbar {
  background: linear-gradient(180deg, var(--bg-2), var(--bg-shell));
  border-top: 1px solid var(--line-2);
  box-shadow: 0 -2px 8px rgba(0,0,0,0.3);
}
.tb-task {
  padding: 0 var(--sp-3);
  background: transparent;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  color: var(--text-3);
  font-family: var(--mono);
  font-size: var(--tx-sm);
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all var(--t-fast);
  height: 28px;
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
}
.tb-task:hover {
  background: var(--bg-2);
  color: var(--text-1);
}
.tb-task.active {
  color: var(--cyan);
  border-bottom-color: var(--cyan);
  background: var(--bg-2);
  box-shadow: 0 -1px 6px rgba(90, 200, 217, 0.18);
}
.tb-task svg {
  width: 14px;
  height: 14px;
}

/* ---------- Desk icon polish ---------- */
.desk-icon {
  transition: all var(--t-base);
}
.desk-icon:hover .glyph {
  transform: scale(1.08);
  filter: drop-shadow(0 0 8px currentColor);
}
.desk-icon .glyph {
  transition: all var(--t-base);
}
.desk-icon .label {
  font-family: var(--mono);
  font-size: var(--tx-xs);
  letter-spacing: 0.5px;
  margin-top: var(--sp-1);
  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
}
.desk-icon .ext {
  color: var(--text-3);
  font-size: var(--tx-2xs);
  letter-spacing: 1px;
}

/* ---------- Universal empty state utility ---------- */
.fb-main > div[id$="List"]:empty::before {
  display: none;
}

/* Active filter visual feedback */
.fb-sidebar .item.active::before {
  content: "▸ ";
  color: var(--amber);
}

/* ---------- Pat15 / Phr / Aut rows polish ---------- */
.pat15-row, .phr-row, .aut-row {
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--line-1);
}
.pat15-id, .phr-id, .aut-id {
  color: var(--amber);
  font-family: var(--mono);
  font-weight: 700;
  letter-spacing: 0.5px;
}

/* ---------- Better field separator ---------- */
hr, .hr {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line-2), transparent);
  margin: var(--sp-4) 0;
}

/* ---------- Generic card upgrade ---------- */
.card-elevated {
  background: var(--bg-shell);
  border: 1px solid var(--line-2);
  padding: var(--sp-4);
  transition: all var(--t-fast);
}
.card-elevated:hover {
  border-color: var(--cyan);
  background: var(--bg-2);
}

/* ---------- Detail toolbar (used in many app detail windows) ---------- */
.detail-toolbar {
  display: flex;
  gap: var(--sp-2);
  padding: var(--sp-3) var(--sp-4);
  background: var(--bg-2);
  border-bottom: 1px solid var(--line-2);
  font-family: var(--mono);
  align-items: center;
}

/* ---------- Quick polish for spans used as buttons ---------- */
.win-menubar > span[onclick] {
  user-select: none;
}

/* ---------- Tooltip-like title hint ---------- */
[title]:hover {
  cursor: help;
}
button[title]:hover, [onclick][title]:hover, .desk-icon[title]:hover {
  cursor: pointer;
}

/* Faz 21 — Warhead Control Panel */
.warhead-panel {
  margin: 14px 0;
  padding: 12px;
  background: repeating-linear-gradient(45deg, #1a0c00, #1a0c00 10px, #160a00 10px, #160a00 20px);
  border: 1px solid var(--orange);
  border-left: 3px solid var(--orange);
}
.warhead-panel-title {
  font-size: 11px;
  letter-spacing: 2px;
  color: var(--orange);
  margin-bottom: 10px;
  font-weight: 700;
  text-shadow: 0 0 8px rgba(251, 146, 60, 0.4);
}
.warhead-card {
  background: var(--bg-1);
  border: 1px solid var(--line-2);
  padding: 12px;
  text-align: center;
  transition: all var(--t-base);
}
.warhead-card.armed {
  border-color: var(--red);
  background: rgba(239, 68, 68, 0.08);
  animation: warheadPulse 1.2s ease-in-out infinite;
}
@keyframes warheadPulse {
  0%, 100% { box-shadow: inset 0 0 12px rgba(239, 68, 68, 0.2), 0 0 8px rgba(239,68,68,0.3); }
  50%      { box-shadow: inset 0 0 24px rgba(239, 68, 68, 0.4), 0 0 16px rgba(239,68,68,0.5); }
}
.warhead-name {
  font-family: var(--mono);
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 3px;
  color: var(--text-1);
}
.warhead-card.armed .warhead-name { color: var(--red); }
.warhead-status {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 2px;
  margin: 4px 0;
  color: var(--text-3);
}
.warhead-card.armed .warhead-status { color: var(--red); font-weight: 700; }
.warhead-armer {
  font-size: 9px;
  color: var(--text-3);
  font-style: italic;
  margin-bottom: 6px;
}
.warhead-actions { margin-top: 8px; }
.warhead-actions button {
  width: 100%;
  padding: 8px;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  cursor: pointer;
  border: 1px solid;
  transition: all var(--t-fast);
}
.wh-arm {
  background: transparent;
  border-color: var(--orange);
  color: var(--orange);
}
.wh-arm:hover {
  background: var(--orange);
  color: #000;
  box-shadow: 0 0 14px rgba(251, 146, 60, 0.5);
}
.wh-abort {
  background: var(--red);
  border-color: var(--red);
  color: #fff;
}
.wh-abort:hover {
  background: #c53030;
  box-shadow: var(--glow-red-md);
}
.wh-disabled {
  background: transparent;
  border-color: var(--line-2);
  color: var(--text-4);
  cursor: not-allowed;
}