:root {
  --black: #07090a;
  --black-2: #0c0f10;
  --panel: #111516;
  --paper: #d9ddd5;
  --muted: #89908a;
  --line: rgba(217, 221, 213, .19);
  --acid: #b8ff4f;
  --danger: #ff4a42;
  --mono: "IBM Plex Mono", monospace;
  --sans: "Noto Sans KR", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--black); }
body { margin: 0; min-width: 320px; background: var(--black); color: var(--paper); font-family: var(--sans); overflow-x: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }

.noise, .scanlines { position: fixed; inset: 0; pointer-events: none; z-index: 100; }
.noise { opacity: .055; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); animation: grain .18s steps(2) infinite; }
.scanlines { opacity: .12; background: repeating-linear-gradient(0deg, transparent 0 3px, rgba(255,255,255,.12) 4px); mix-blend-mode: overlay; }
@keyframes grain { 0%{transform:translate(0)} 25%{transform:translate(1%, -1%)} 50%{transform:translate(-1%, 1%)} 75%{transform:translate(1%,1%)} }

.access-screen { position: fixed; inset: 0; z-index: 30; display: grid; grid-template-rows: auto 1fr auto; min-height: 100svh; background: radial-gradient(circle at 50% 45%, #17201c 0, #0b0e0e 34%, #050606 74%); transition: opacity .55s ease, visibility .55s; }
.access-screen.dismissed { opacity: 0; visibility: hidden; }
.access-screen::before { content:""; position:absolute; inset:14px; border:1px solid rgba(184,255,79,.15); pointer-events:none; }
.system-bar, .screen-footer { position:relative; z-index:2; display:flex; justify-content:space-between; gap:20px; padding:23px 32px; color:#788078; font:500 11px/1 var(--mono); letter-spacing:.12em; }
.system-bar { border-bottom:1px solid var(--line); }
.screen-footer { border-top:1px solid var(--line); }
.signal { color:#a6afa6; }.signal i, .operational i { display:inline-block; width:6px; height:6px; margin-right:7px; border-radius:50%; background:var(--acid); box-shadow:0 0 12px var(--acid); animation: pulse 1.8s infinite; }
@keyframes pulse { 50% { opacity:.25; } }

.access-content { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:30px 24px; text-align:center; }
.classification { position:absolute; top:30px; left:32px; color:#606860; font:10px var(--mono); letter-spacing:.17em; writing-mode:vertical-rl; }
.logo-stage { position:relative; width:min(36vh, 280px); aspect-ratio:1; margin-bottom:5px; filter:drop-shadow(0 0 35px rgba(184,255,79,.06)); animation:flicker 6s infinite; }
.ark-logo { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; mix-blend-mode:screen; filter:invert(1) contrast(1.45) brightness(.72); }
.logo-ghost { opacity:0; }
.ghost-red { filter:invert(1) sepia(1) saturate(8) hue-rotate(320deg) contrast(2); animation:ghostRed 4.2s steps(1) infinite; }
.ghost-cyan { filter:invert(1) sepia(1) saturate(7) hue-rotate(115deg) contrast(2); animation:ghostCyan 4.2s steps(1) infinite; }
.reticle { position:absolute; z-index:4; inset:-18px; border:1px solid rgba(184,255,79,.16); border-radius:50%; border-left-color:transparent; border-right-color:transparent; animation:spin 20s linear infinite; }
.reticle-two { inset:-32px; border-style:dashed; animation-direction:reverse; animation-duration:30s; }
@keyframes spin { to { transform:rotate(360deg); } }
@keyframes flicker { 0%,18%,20%,23%,64%,66%,100%{opacity:1} 19%,22%,65%{opacity:.22} }
@keyframes ghostRed { 0%,91%,100%{opacity:0;transform:none;clip-path:inset(0)} 92%{opacity:.45;transform:translate(8px,-2px);clip-path:inset(20% 0 58% 0)} 93%{opacity:0} 96%{opacity:.35;transform:translate(-6px,1px);clip-path:inset(63% 0 14% 0)} }
@keyframes ghostCyan { 0%,89%,100%{opacity:0;transform:none;clip-path:inset(0)} 90%{opacity:.4;transform:translate(-7px,2px);clip-path:inset(47% 0 34% 0)} 91%{opacity:0} 96%{opacity:.3;transform:translate(5px);clip-path:inset(11% 0 72% 0)} }
.glitch-bar { position:absolute; z-index:6; left:-12%; width:124%; height:3px; background:rgba(184,255,79,.75); box-shadow:0 0 10px var(--acid); opacity:0; }
.gb-one { top:35%; animation:barShift 5.7s infinite; }.gb-two{top:70%;animation:barShift 7.3s 1.2s infinite;}
@keyframes barShift { 0%,92%,100%{opacity:0;transform:translateY(0)} 93%{opacity:.65;transform:translateY(15px)} 94%{opacity:0} 97%{opacity:.4;transform:translateY(-8px)} }
.eyebrow { margin:7px 0 4px; color:var(--acid); font:500 11px var(--mono); letter-spacing:.35em; }
.access-copy h1 { margin:0; color:#f2f4ef; font:600 clamp(3.2rem,8vw,6.7rem)/.94 var(--mono); letter-spacing:.12em; text-indent:.12em; text-shadow:0 0 30px rgba(255,255,255,.11); }
.kicker { margin:16px 0 0; color:#8f978f; font-size:14px; letter-spacing:.16em; }
.enter-button { position:relative; width:min(460px, 86vw); margin-top:38px; padding:17px 40px 15px; border:1px solid rgba(184,255,79,.54); color:#e9f0e5; background:rgba(184,255,79,.035); cursor:pointer; text-transform:uppercase; transition:.25s ease; overflow:hidden; }
.enter-button::before { content:""; position:absolute; inset:0; background:var(--acid); transform:translateX(-102%); transition:.35s ease; }
.enter-button:hover, .enter-button:focus-visible { color:#071006; box-shadow:0 0 32px rgba(184,255,79,.16); outline:none; }
.enter-button:hover::before, .enter-button:focus-visible::before { transform:none; }
.enter-button span { position:relative; z-index:1; display:block; }
.enter-main { font-weight:600; font-size:16px; letter-spacing:.08em; }
.enter-sub { margin-top:7px; color:#7f8d79; font:9px var(--mono); letter-spacing:.16em; transition:.25s; }.enter-button:hover .enter-sub{color:#314729;}
.button-corners::before,.button-corners::after { content:""; position:absolute; z-index:2; width:8px; height:8px; border-color:var(--acid); }.button-corners::before{left:4px;top:4px;border-left:1px solid;border-top:1px solid}.button-corners::after{right:4px;bottom:4px;border-right:1px solid;border-bottom:1px solid}
.warning-line { margin:18px 0 0; color:#656d65; font:11px var(--mono); }.warning-line span{color:var(--danger);margin-right:8px;}

.door-sequence { position:fixed; inset:0; z-index:40; display:flex; pointer-events:none; visibility:hidden; }
.door-sequence.active { visibility:visible; }
.door { position:absolute; top:0; bottom:0; width:50.5%; background:#090b0c; border-color:#2b3130; transition:transform 1.55s cubic-bezier(.72,0,.19,1); overflow:hidden; }
.door::before { content:""; position:absolute; inset:4% 5%; border:1px solid #222827; background:repeating-linear-gradient(90deg, transparent 0 70px, rgba(255,255,255,.025) 71px 72px); }
.door::after { content:""; position:absolute; top:0; bottom:0; width:18px; background:#111616; box-shadow:0 0 25px #000; }
.door-left { left:0; border-right:1px solid #55605a; }.door-left::after{right:0}.door-right{right:0;border-left:1px solid #55605a}.door-right::after{left:0}
.door-mark { position:absolute; z-index:2; top:50%; color:#252b29; font:600 14vw/1 var(--mono); transform:translateY(-50%); }.door-left .door-mark{right:-.03em}.door-right .door-mark{left:0}
.door-sequence.open .door-left { transform:translateX(-102%); }.door-sequence.open .door-right { transform:translateX(102%); }
.door-status { position:absolute; z-index:5; left:50%; top:50%; width:280px; padding:16px; transform:translate(-50%,-50%); border:1px solid rgba(184,255,79,.25); color:var(--acid); background:#080a09; text-align:center; font:11px var(--mono); letter-spacing:.14em; transition:opacity .35s; }
.door-status i { display:block; height:2px; margin-top:12px; background:var(--acid); transform-origin:left; animation:load 1.1s ease forwards; }@keyframes load{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.door-sequence.open .door-status{opacity:0}

.facility { min-height:100vh; background:#0a0d0e; opacity:0; transition:opacity .5s; }
.facility.visible { opacity:1; }
.facility-nav { position:sticky; top:0; z-index:10; height:80px; padding:0 clamp(22px,5vw,72px); display:flex; align-items:center; justify-content:space-between; background:rgba(7,9,10,.88); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.brand{display:flex;align-items:center;gap:13px;color:inherit;text-decoration:none}.brand img{width:46px;height:46px;object-fit:contain;filter:invert(1) brightness(.8);}.brand span{display:grid}.brand b{font:600 20px/1 var(--mono);letter-spacing:.16em}.brand small{margin-top:5px;color:#757d76;font:9px var(--mono);letter-spacing:.22em}
.nav-meta{display:flex;gap:28px;color:#7e867f;font:11px var(--mono);letter-spacing:.08em}.nav-meta b{color:#e2e7df}.operational{color:#a8b0a8}
.briefing { min-height:calc(100vh - 80px); padding:clamp(70px,10vw,140px) clamp(24px,8vw,130px); display:grid; grid-template-columns:minmax(0,1.25fr) minmax(280px,.55fr); align-items:center; gap:clamp(55px,9vw,150px); border-bottom:1px solid var(--line); background:radial-gradient(circle at 75% 45%, rgba(184,255,79,.055), transparent 28%); }
.section-label { display:flex;align-items:center;gap:13px;color:#69716b;font:10px var(--mono);letter-spacing:.18em}.section-label span{display:inline-grid;place-items:center;width:28px;height:28px;border:1px solid #3a403d;color:var(--acid)}
.overline{margin:34px 0 17px;color:#a7afa7;font-size:14px;letter-spacing:.08em}.briefing-copy>h2{margin:0;font-size:clamp(2.5rem,5.2vw,5.7rem);line-height:1.12;font-weight:300;letter-spacing:-.055em}.briefing-copy>h2 em{font-style:normal;color:var(--acid);position:relative}.briefing-copy>h2 em::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;background:var(--acid);box-shadow:0 0 12px var(--acid)}
.body-copy{max-width:690px;margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:30px;color:#9ca39d;font-size:16px;line-height:1.9}.body-copy p{margin:0}.body-copy strong{color:#e8ece5;font-weight:500}
.appointment{max-width:690px;margin-top:38px;padding:24px 27px;border-left:2px solid var(--acid);background:#0f1312}.appointment span{color:var(--acid);font:10px var(--mono);letter-spacing:.18em}.appointment p{margin:11px 0 7px;color:#dfe4dd;font-size:15px}.appointment small{color:#747c75;font-size:13px}
.identity-card{position:relative;max-width:370px;justify-self:end;width:100%;padding:20px;border:1px solid #313735;background:#0d1111;box-shadow:20px 24px 0 #080a0a,20px 24px 0 1px #222827;transform:rotate(1.4deg)}.card-top{display:flex;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid var(--line);color:#788079;font:9px var(--mono);letter-spacing:.13em}.card-top span:last-child{color:var(--danger)}.id-symbol{display:grid;place-items:center;height:210px;background:#080b0b;border:1px solid #222a27;margin:18px 0}.id-symbol img{width:82%;height:82%;object-fit:contain;filter:invert(1) contrast(1.45) brightness(.78)}.identity-card dl{margin:0}.identity-card dl div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #242a28}.identity-card dt{color:#687069;font-size:12px}.identity-card dd{margin:0;font:500 12px var(--mono);letter-spacing:.08em}.active-status{color:var(--acid)!important}.barcode{height:34px;margin-top:20px;background:repeating-linear-gradient(90deg,#d9ddd5 0 2px,transparent 2px 5px,#d9ddd5 5px 6px,transparent 6px 10px)}.identity-card>p{margin:8px 0 0;text-align:center;color:#777f78;font:10px var(--mono);letter-spacing:.28em}.identity-card>p strong{color:var(--acid)}
.definition{padding:90px clamp(24px,8vw,130px);display:grid;grid-template-columns:130px 1fr .8fr;align-items:center;gap:50px;border-bottom:1px solid var(--line);background:#d5d9d1;color:#0a0d0e}.definition-mark{font:600 clamp(6rem,13vw,13rem)/.8 var(--mono);color:#c2c7bd}.definition .section-label{color:#626961}.definition .section-label span{color:#23331c;border-color:#929a90}.definition h2{margin:25px 0 18px;font-size:clamp(2rem,4vw,4rem);font-weight:600;letter-spacing:-.05em}.definition h2 small{display:block;margin-top:8px;color:#697168;font:11px var(--mono);letter-spacing:.25em}.definition p{max-width:610px;color:#4f5650;line-height:1.85}.definition blockquote{margin:0;padding-left:40px;border-left:1px solid #9ea59b;font-size:clamp(1.3rem,2.2vw,2.2rem);line-height:1.6;font-weight:300}
.sectors{padding:110px clamp(24px,6vw,100px) 130px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:50px}.section-heading h2{margin:23px 0 0;font-size:clamp(2.3rem,4vw,4.2rem);font-weight:300;letter-spacing:-.05em}.section-heading>p{margin:0;color:#737b75;text-align:right;font-size:13px;line-height:1.7}
.sector-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.sector-card{position:relative;min-height:430px;padding:29px;text-align:left;border:1px solid #2c3230;background:#0d1111;color:var(--paper);cursor:pointer;overflow:hidden;transition:.35s ease}.sector-card::before{content:"";position:absolute;inset:0;background:var(--acid);transform:translateY(101%);transition:.45s cubic-bezier(.2,.8,.2,1)}.sector-card>*{position:relative;z-index:1}.sector-card:hover,.sector-card:focus-visible{border-color:var(--acid);color:#091007;transform:translateY(-5px);outline:none}.sector-card:hover::before,.sector-card:focus-visible::before{transform:none}.sector-index{display:block;color:#667068;font:10px var(--mono);letter-spacing:.2em}.sector-icon{display:flex;align-items:center;justify-content:center;gap:7px;height:155px;margin:20px 0}.sector-icon i{display:block;width:13%;height:65%;border:1px solid #343c38;transition:.35s}.sector-icon i:nth-child(2){height:90%}.sector-card:hover .sector-icon i{border-color:#25391a;background:rgba(0,0,0,.06);transform:translateY(-5px)}.sector-name{display:block;font-size:25px;font-weight:500}.sector-en{display:block;margin-top:7px;color:#687169;font:10px var(--mono);letter-spacing:.15em}.sector-count{display:flex;justify-content:space-between;margin-top:35px;padding-top:17px;border-top:1px solid #2b322e;color:#7a837c;font-size:12px}.sector-count b{font:500 14px var(--mono)}.sector-action{position:absolute;left:29px;right:29px;bottom:27px;display:flex;justify-content:space-between;align-items:center;font-size:13px}.sector-action i{width:35px;height:1px;background:currentColor;position:relative}.sector-action i::after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid;border-right:1px solid;transform:rotate(45deg)}
.facility-footer{min-height:100px;padding:24px clamp(24px,6vw,100px);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:#626a64;font:10px var(--mono);letter-spacing:.1em}.facility-footer img{width:45px;height:45px;object-fit:contain;filter:invert(1) brightness(.5)}
.sector-dialog{width:min(520px,calc(100% - 32px));padding:45px;border:1px solid #4b554f;background:#0d1111;color:var(--paper);text-align:center;box-shadow:0 30px 100px #000}.sector-dialog::backdrop{background:rgba(0,0,0,.82);backdrop-filter:blur(5px)}.dialog-close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:#89918b;font-size:27px;cursor:pointer}.dialog-code{margin:0;color:var(--acid);font:10px var(--mono);letter-spacing:.2em}.dialog-symbol{display:grid;place-items:center;width:100px;height:100px;margin:30px auto;border:1px solid #3b443f;border-radius:50%}.dialog-symbol span{width:28px;height:28px;border:1px solid var(--acid);transform:rotate(45deg);box-shadow:0 0 20px rgba(184,255,79,.15)}.sector-dialog h2{font-size:22px;font-weight:500}.sector-dialog>p:not(.dialog-code){color:#7f8881;font-size:14px;line-height:1.8}.dialog-confirm{width:100%;margin-top:22px;padding:13px;border:1px solid #475048;background:transparent;color:var(--paper);cursor:pointer}.dialog-confirm:hover,.dialog-confirm:focus-visible{background:var(--acid);color:#081006;outline:none}

@media(max-width:900px){.briefing{grid-template-columns:1fr}.identity-card{justify-self:start;max-width:430px}.definition{grid-template-columns:70px 1fr}.definition blockquote{grid-column:2}.sector-grid{grid-template-columns:1fr}.sector-card{min-height:320px}.sector-icon{height:100px}.nav-meta span:first-child{display:none}}
@media(max-width:600px){.system-bar,.screen-footer{padding:19px 20px}.system-bar span:first-child,.screen-footer span:nth-child(2){display:none}.screen-footer{justify-content:space-between}.classification{display:none}.logo-stage{width:min(52vw,220px)}.access-copy h1{font-size:clamp(2.5rem,15vw,4.3rem)}.kicker{font-size:12px;line-height:1.7}.warning-line{font-size:9px}.facility-nav{height:68px}.brand img{width:38px;height:38px}.brand b{font-size:17px}.briefing{padding-top:80px}.body-copy{grid-template-columns:1fr}.definition{grid-template-columns:1fr}.definition-mark{display:none}.definition blockquote{grid-column:1;padding:25px 0 0;border-left:0;border-top:1px solid #9ea59b}.section-heading{align-items:start;flex-direction:column}.section-heading>p{text-align:left}.facility-footer{justify-content:center;text-align:center}.facility-footer img,.facility-footer span:last-child{display:none}.sector-dialog{padding:40px 24px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.door{transition-duration:.01ms!important}}


/* =========================
   ARK ACCESS PROLOGUE
========================= */
.ark-prologue{
  position:fixed;
  inset:0;
  z-index:200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:radial-gradient(circle at 50% 50%,#111815 0,#080a09 38%,#040505 100%);
  transition:opacity .7s ease,visibility .7s ease;
}
.ark-prologue.hide{opacity:0;visibility:hidden;pointer-events:none}
.ark-terminal{
  position:relative;
  width:min(680px,92vw);
  min-height:390px;
  border:1px solid #303833;
  background:linear-gradient(180deg,rgba(18,23,20,.97),rgba(7,9,8,.99));
  box-shadow:0 35px 100px rgba(0,0,0,.75),0 0 40px rgba(184,255,79,.035);
  font-family:var(--mono);
}
.ark-terminal::before,.ark-terminal::after{
  content:"";position:absolute;width:14px;height:14px;pointer-events:none
}
.ark-terminal::before{left:-1px;top:-1px;border-left:2px solid var(--acid);border-top:2px solid var(--acid)}
.ark-terminal::after{right:-1px;bottom:-1px;border-right:2px solid var(--acid);border-bottom:2px solid var(--acid)}
.terminal-header{
  height:47px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;
  border-bottom:1px solid var(--line);color:#8c958d;font-size:10px;letter-spacing:.13em
}
.terminal-live{color:#aab3aa}
.terminal-live i{
  display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;
  background:var(--acid);box-shadow:0 0 10px var(--acid);animation:pulse 1.8s infinite
}
.terminal-body{min-height:295px;padding:20px 25px 25px}
.terminal-meta{
  display:flex;justify-content:space-between;margin-bottom:30px;color:#515a53;
  font-size:9px;letter-spacing:.13em
}
.terminal-output{color:#cbd1ca;font-size:13px;line-height:1.9;letter-spacing:.015em}
.terminal-line{min-height:25px;margin-bottom:9px}
.terminal-line::before{content:">";margin-right:10px;color:#667067}
.terminal-line.alert{color:var(--danger)}
.terminal-cursor{
  display:inline-block;width:7px;height:14px;margin-left:5px;vertical-align:-2px;
  background:var(--acid);animation:terminalBlink .65s steps(1) infinite
}
@keyframes terminalBlink{50%{opacity:0}}
.terminal-auth{
  display:none;margin-top:24px;padding:15px 17px;border-left:2px solid var(--acid);
  background:rgba(184,255,79,.035);font-size:9px;letter-spacing:.13em;line-height:1.9
}
.terminal-auth.show{display:grid;animation:authAppear .25s ease}
.terminal-auth span{color:#777f78}
.terminal-auth b{color:#adb5ad;font-weight:400}
.terminal-auth strong{color:var(--acid);font-weight:500;text-shadow:0 0 12px rgba(184,255,79,.45)}
@keyframes authAppear{0%{opacity:0;transform:translateY(5px)}100%{opacity:1;transform:none}}
.terminal-footer{
  height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;
  border-top:1px solid var(--line);color:#505851;font-size:9px;letter-spacing:.13em
}
@media(max-width:600px){
  .ark-prologue{padding:16px}
  .ark-terminal{width:100%;min-height:360px}
  .terminal-header{padding:0 13px;font-size:8px}
  .terminal-body{padding:18px 17px 22px}
  .terminal-output{font-size:12px;line-height:1.8}
  .terminal-meta,.terminal-footer{font-size:8px}
  .terminal-footer{padding:0 13px}
}


/* =========================
   SPLIT ARK EMBLEM GATE
   One source PNG; each door shows one clipped half.
========================= */
.door-mark{display:none!important}

.door-emblem{
  position:absolute;
  z-index:3;
  top:50%;
  width:min(520px,70vw);
  height:auto;
  object-fit:contain;
  pointer-events:none;
  user-select:none;
  filter:invert(1) brightness(.28);
}

/* Both images reconstruct one centered emblem while the doors are closed. */
.door-left .door-emblem{
  left:100%;
  transform:translate(-50%,-50%);
}
.door-right .door-emblem{
  left:0;
  transform:translate(-50%,-50%);
}

.door-emblem-left{
  clip-path:inset(0 50% 0 0);
}
.door-emblem-right{
  clip-path:inset(0 0 0 50%);
}

/* Keep the emblem subtle behind the gate status panel. */
.door-status{
  z-index:6;
}

@media(max-width:600px){
  .door-emblem{
    width:min(430px,86vw);
  }
}


/* =========================
   WALPURGIS FACILITY EMBLEM
========================= */

/* Personnel card emblem */
.id-symbol .walpurgis-id-logo{
  width:88%;
  height:88%;
  object-fit:contain;
  filter:none;
}

/* Replace the decorative W with a faint facility emblem */
.definition-mark{
  display:flex;
  align-items:center;
  justify-content:center;
}

.definition-mark img{
  display:block;
  width:125px;
  max-width:100%;
  height:auto;
  object-fit:contain;
  opacity:.13;
  filter:grayscale(1) contrast(.9);
}

@media(max-width:900px){
  .definition-mark img{
    width:70px;
    opacity:.12;
  }
}

/* Existing mobile layout intentionally hides definition-mark under 600px. */


/* =========================
   SUBJECT CASE FILE EXAMPLE
========================= */
.case-dialog{
  width:min(1120px,94vw);
  max-width:none;
  padding:0;
  overflow:hidden;
  border:1px solid #343d37;
  background:#080a09;
  color:#d9ddd8;
}
.case-dialog::backdrop{background:rgba(0,0,0,.84);backdrop-filter:blur(4px)}
.case-dialog .dialog-close{z-index:20}
.case-file{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  min-height:610px;
}
.case-visual{
  position:relative;
  min-height:610px;
  overflow:hidden;
  background:#050606;
  border-right:1px solid #343d37;
}
.case-visual::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 55%,rgba(3,5,4,.68));
  pointer-events:none;
}
.case-visual img{width:100%;height:100%;object-fit:cover;display:block}
.case-photo-tag{
  position:absolute;z-index:3;left:20px;top:18px;
  padding:6px 9px;border:1px solid rgba(184,255,79,.35);
  background:rgba(5,7,6,.76);color:var(--acid);
  font:9px var(--mono);letter-spacing:.14em
}
.case-photo-corner{position:absolute;z-index:3;width:30px;height:30px}
.case-photo-corner.tl{left:12px;top:12px;border-left:1px solid var(--acid);border-top:1px solid var(--acid)}
.case-photo-corner.br{right:12px;bottom:12px;border-right:1px solid var(--acid);border-bottom:1px solid var(--acid)}
.case-data{
  position:relative;padding:45px 42px 34px;
  background:
    linear-gradient(rgba(184,255,79,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(184,255,79,.025) 1px,transparent 1px),
    #090b0a;
  background-size:38px 38px;
}
.case-topline{display:flex;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid #303833;font:9px var(--mono);letter-spacing:.15em;color:#727b74}
.case-topline b{color:var(--danger);font-weight:500}
.case-row{display:grid;grid-template-columns:90px 1fr;gap:16px;margin-top:27px;font-family:var(--mono)}
.case-row span,.case-name small,.case-grid>span{font:9px var(--mono);letter-spacing:.14em;color:#667067}
.case-row strong{font-size:14px;font-weight:400;letter-spacing:.08em;color:#dce1dc}
.case-name{display:grid;grid-template-columns:90px 1fr;gap:16px;align-items:center;margin-top:22px}
.case-name h2{margin:0;font-size:40px;font-weight:600;letter-spacing:-.05em;color:#f2f4f1}
.case-grid{display:grid;grid-template-columns:90px 1fr;gap:13px 16px;margin-top:27px;padding:23px 0;border-top:1px solid #303833;border-bottom:1px solid #303833}
.case-grid p{margin:0;font-size:13px;line-height:1.65;color:#c6cbc6}
.case-grid .case-stable{font:11px var(--mono);letter-spacing:.12em;color:var(--acid)}
.case-incident{margin-top:25px;padding:18px 20px;border-left:2px solid var(--danger);background:rgba(255,59,48,.035)}
.case-incident span{display:block;margin-bottom:8px;font:8px var(--mono);letter-spacing:.15em;color:#7b837c}
.case-incident strong{display:block;margin-bottom:9px;color:#e1e5e0;font-size:15px}
.case-incident p{margin:0;color:#929a93;font-size:11px;line-height:1.7}
.case-risk{display:flex;align-items:center;gap:4px;margin-top:22px}
.case-risk span{margin-right:12px;font:8px var(--mono);letter-spacing:.12em;color:#69716b}
.case-risk i{width:18px;height:4px;background:var(--acid);box-shadow:0 0 8px rgba(184,255,79,.18)}
.case-risk i.off{background:#263029;box-shadow:none}
.case-confirm{margin-top:27px}
.case-placeholder{display:none;padding:55px}
.case-dialog.placeholder .case-file{display:none}
.case-dialog.placeholder .case-placeholder{display:block}

@media(max-width:760px){
  .case-dialog{width:94vw;max-height:92vh;overflow:auto}
  .case-file{grid-template-columns:1fr;min-height:0}
  .case-visual{min-height:0;height:56vh;border-right:0;border-bottom:1px solid #343d37}
  .case-data{padding:34px 22px 28px}
  .case-name h2{font-size:34px}
  .case-row,.case-name,.case-grid{grid-template-columns:78px 1fr}
}


/* Cthulhu containment-space visual */
.case-room{
  position:relative;
  margin-top:24px;
  border:1px solid #303833;
  background:#050706;
  overflow:hidden;
}
.case-room-head{
  height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 12px;
  border-bottom:1px solid #303833;
  font:8px var(--mono);
  letter-spacing:.13em;
  color:#747d76;
}
.case-room-head b{
  color:var(--acid);
  font-weight:400;
}
.case-room img{
  display:block;
  width:100%;
  height:165px;
  object-fit:cover;
  object-position:center;
  filter:brightness(.72) saturate(.78) contrast(1.05);
}
.case-room-caption{
  position:absolute;
  left:0;right:0;bottom:0;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  padding:30px 13px 11px;
  background:linear-gradient(transparent,rgba(3,5,4,.92));
}
.case-room-caption strong{
  font:9px var(--mono);
  letter-spacing:.12em;
  color:#e0e5df;
}
.case-room-caption span{
  font-size:10px;
  color:#929b94;
}

@media(max-width:760px){
  .case-room img{height:145px}
  .case-room-caption{align-items:flex-start;flex-direction:column;gap:3px}
}


/* =========================
   EXPANDED SUBJECT INFORMATION
========================= */
.case-grid{
  row-gap:14px;
}

.case-grid > span{
  padding-top:2px;
}

.case-grid p{
  line-height:1.72;
}

.case-contamination-note{
  display:grid;
  grid-template-columns:118px 1fr;
  gap:14px;
  margin-top:14px;
  padding:13px 15px;
  border:1px solid #252d28;
  background:rgba(184,255,79,.018);
}

.case-contamination-note span{
  font:8px var(--mono);
  letter-spacing:.13em;
  color:#69716b;
}

.case-contamination-note p{
  margin:0;
  font-size:10px;
  line-height:1.7;
  color:#929a93;
}

@media(max-width:760px){
  .case-contamination-note{
    grid-template-columns:1fr;
    gap:6px;
  }
}


/* =========================
   INTERVIEW ARCHIVE TAB
========================= */
.interview-tab{
  position:absolute;
  top:18px;
  right:64px;
  z-index:12;
  height:28px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 10px;
  border:1px solid rgba(184,255,79,.28);
  background:rgba(5,10,7,.88);
  color:#aab4ac;
  font:7px var(--mono);
  letter-spacing:.16em;
  cursor:pointer;
  transition:.18s ease;
}
.interview-tab b{
  color:var(--acid);
  font-weight:500;
}
.interview-tab:hover,
.interview-tab.active{
  border-color:var(--acid);
  color:var(--acid);
  background:rgba(184,255,79,.055);
}

.case-dialog{
  position:relative;
}

.interview-panel{
  position:absolute;
  inset:0;
  z-index:10;
  display:flex;
  justify-content:flex-end;
  pointer-events:none;
  overflow:hidden;
  background:rgba(0,0,0,.12);
  opacity:0;
  transition:opacity .22s ease;
}
.interview-panel.open{
  opacity:1;
  pointer-events:auto;
}

.interview-paper{
  width:50%;
  min-width:470px;
  height:100%;
  overflow:auto;
  padding:48px 38px 24px;
  box-sizing:border-box;
  color:#b7b8ae;
  background:
    linear-gradient(rgba(0,0,0,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,.018) 1px, transparent 1px),
    #d4d1c2;
  background-size:24px 24px;
  border-left:1px solid #71756b;
  box-shadow:-22px 0 55px rgba(0,0,0,.68);
  transform:translateX(102%);
  transition:transform .32s cubic-bezier(.2,.72,.25,1);
  color:#171b18;
}
.interview-panel.open .interview-paper{
  transform:translateX(0);
}

.interview-head{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding-bottom:16px;
  border-bottom:2px solid #252b27;
}
.interview-head small{
  display:block;
  margin-bottom:8px;
  font:7px var(--mono);
  letter-spacing:.2em;
  color:#505950;
}
.interview-head h3{
  margin:0;
  font:600 13px var(--mono);
  letter-spacing:.08em;
}
.interview-classified{
  align-self:flex-start;
  padding:5px 7px;
  border:1px solid #7b211d;
  color:#8d211c;
  font:700 7px var(--mono);
  letter-spacing:.15em;
  transform:rotate(2deg);
}

.interview-meta{
  display:grid;
  grid-template-columns:92px 1fr;
  gap:7px 12px;
  padding:15px 0;
  border-bottom:1px solid rgba(30,36,31,.42);
  font-family:var(--mono);
}
.interview-meta span{
  color:#5c655d;
  font-size:7px;
  letter-spacing:.15em;
}
.interview-meta strong{
  font-size:9px;
  font-weight:500;
}

.interview-transcript{
  padding:18px 0 12px;
}
.interview-transcript p{
  position:relative;
  margin:0 0 13px;
  padding-left:64px;
  font-size:10px;
  line-height:1.75;
}
.interview-transcript p b{
  position:absolute;
  left:0;
  top:1px;
  width:52px;
  font:700 8px var(--mono);
  letter-spacing:.04em;
  color:#414b43;
}
.interview-transcript p.subject{
  color:#101410;
}
.interview-transcript p.subject b{
  color:#35510d;
}
.interview-transcript .final-line{
  font-weight:600;
}
.interview-note{
  margin:18px 0;
  padding:9px 11px;
  border-left:2px solid #6c211e;
  background:rgba(70,25,22,.055);
  color:#6c211e;
  font:8px var(--mono);
  letter-spacing:.06em;
}

.interview-footer{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding-top:12px;
  border-top:1px solid rgba(30,36,31,.5);
  color:#525a53;
  font:7px var(--mono);
  letter-spacing:.13em;
}

@media(max-width:760px){
  .interview-tab{
    top:12px;
    right:52px;
  }
  .interview-paper{
    width:100%;
    min-width:0;
    padding:54px 22px 22px;
  }
}


/* =========================
   V2 — COMPACT VISUAL + READABLE INTERVIEW TAB
   Keep the existing CASE FILE design; only correct scale/readability.
========================= */
.case-dialog{
  width:min(1080px,92vw);
  max-height:92vh;
}

.case-file{
  grid-template-columns:minmax(0, .92fr) minmax(430px, 1.08fr);
  min-height:0;
  height:min(760px,88vh);
}

.case-visual{
  min-height:0;
  height:100%;
}

/* Do not enlarge the portrait to fill the panel.
   It stays contained at its natural aspect ratio against a dark record frame. */
.case-visual img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  background:#050606;
}

.case-data{
  overflow-y:auto;
  padding:42px 38px 30px;
}

/* Larger, more obvious archive control beside X */
.interview-tab{
  top:14px;
  right:66px;
  min-width:142px;
  height:34px;
  justify-content:center;
  gap:10px;
  padding:0 14px;
  border-color:rgba(184,255,79,.48);
  background:rgba(5,10,7,.96);
  color:#d6ddd7;
  font-size:9px;
  font-weight:600;
  letter-spacing:.13em;
  box-shadow:0 0 0 1px rgba(184,255,79,.04) inset;
}
.interview-tab b{
  font-size:9px;
}

/* Give the close icon its own breathing room. */
.case-dialog .dialog-close{
  top:12px;
  right:14px;
}

@media(max-width:900px){
  .case-dialog{
    width:94vw;
    max-height:92vh;
    overflow:auto;
  }
  .case-file{
    grid-template-columns:1fr;
    height:auto;
  }
  .case-visual{
    height:min(620px,68vh);
  }
  .case-visual img{
    object-fit:contain;
  }
  .case-data{
    overflow:visible;
  }
}

@media(max-width:760px){
  .interview-tab{
    top:10px;
    right:54px;
    min-width:126px;
    height:32px;
    padding:0 10px;
    font-size:8px;
  }
}


/* =========================
   V3 — INTERVIEW READABILITY
========================= */

/* Old tiny top-right trigger is no longer used. */
.interview-tab{ display:none !important; }

/* Large action in the empty lower area of the subject record. */
.interview-open-button{
  width:100%;
  min-height:72px;
  margin-top:18px;
  padding:13px 18px;
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto auto;
  align-items:center;
  text-align:left;
  border:1px solid rgba(184,255,79,.42);
  background:
    linear-gradient(90deg, rgba(184,255,79,.055), rgba(184,255,79,.012)),
    #070a08;
  color:#dbe3dc;
  cursor:pointer;
  transition:.18s ease;
}
.interview-open-button:hover,
.interview-open-button.active{
  border-color:var(--acid);
  background:
    linear-gradient(90deg, rgba(184,255,79,.10), rgba(184,255,79,.025)),
    #070a08;
  box-shadow:inset 3px 0 0 var(--acid);
}
.interview-open-kicker{
  grid-column:1 / -1;
  margin-bottom:7px;
  color:#6f7c72;
  font:8px var(--mono);
  letter-spacing:.16em;
}
.interview-open-button strong{
  font-size:16px;
  font-weight:600;
  letter-spacing:-.02em;
}
.interview-open-arrow{
  color:var(--acid);
  font:8px var(--mono);
  letter-spacing:.12em;
}

/* The archive is meant to be read, so give the paper more room. */
.interview-paper{
  width:58%;
  min-width:560px;
  padding:54px 44px 30px;
}

/* Readable web typography instead of tiny prop-document text. */
.interview-head small{
  font-size:9px;
}
.interview-head h3{
  font-size:16px;
  line-height:1.35;
}
.interview-classified{
  font-size:9px;
  padding:6px 8px;
}
.interview-meta{
  grid-template-columns:110px 1fr;
  gap:10px 14px;
  padding:18px 0;
}
.interview-meta span{
  font-size:9px;
}
.interview-meta strong{
  font-size:12px;
}
.interview-transcript{
  padding:22px 0 16px;
}
.interview-transcript p{
  margin-bottom:17px;
  padding-left:78px;
  font-size:14px;
  line-height:1.78;
}
.interview-transcript p b{
  width:64px;
  font-size:11px;
  line-height:1.6;
}
.interview-note{
  margin:22px 0;
  padding:12px 14px;
  font-size:10px;
  line-height:1.6;
}
.interview-footer{
  padding-top:15px;
  font-size:8px;
}

/* Preserve scrolling: larger type is intentional. */
.interview-paper{
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:#687064 transparent;
}

@media(max-width:900px){
  .interview-paper{
    width:100%;
    min-width:0;
    padding:54px 28px 28px;
  }
}
@media(max-width:600px){
  .interview-open-button{
    min-height:66px;
  }
  .interview-open-button strong{
    font-size:15px;
  }
  .interview-transcript p{
    padding-left:0;
    font-size:13px;
  }
  .interview-transcript p b{
    position:static;
    display:block;
    width:auto;
    margin-bottom:4px;
  }
}


/* =========================
   V5 — MODAL VIEWPORT POSITION FIX
   The CASE FILE belongs to the viewport, not the document's top.
========================= */
.case-dialog[open]{
  position:fixed !important;
  inset:50% auto auto 50% !important;
  margin:0 !important;
  transform:translate(-50%, -50%) !important;
  max-height:92vh;
}

/* Keep the backdrop independent from page scroll. */
.case-dialog::backdrop{
  position:fixed;
  inset:0;
}

/* On smaller screens keep the same viewport-centered behavior. */
@media(max-width:900px){
  .case-dialog[open]{
    top:50% !important;
    left:50% !important;
    width:94vw;
    max-height:92vh;
    overflow:auto;
  }
}


/* =========================
   V6 — SUBJECT PREVIEW ON SECTOR CARD
========================= */
.sector-card-occupied .sector-subject-preview{
  position:relative;
  display:block;
  height:175px;
  margin:18px 0 20px;
  overflow:hidden;
  border:1px solid #303834;
  background:#080b0a;
}
.sector-card-occupied .sector-subject-preview::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(5,8,7,.05),rgba(5,8,7,.34)),
    repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px);
  pointer-events:none;
}
.sector-card-occupied .sector-subject-preview img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 28%;
  filter:saturate(.72) brightness(.72) contrast(1.05);
  transform:scale(1.01);
  transition:filter .35s ease,transform .45s ease;
}
.sector-card-occupied .subject-preview-code{
  position:absolute;
  z-index:2;
  left:10px;
  bottom:9px;
  padding:5px 7px;
  border-left:2px solid var(--acid);
  background:rgba(4,8,6,.78);
  color:var(--acid);
  font:7px var(--mono);
  letter-spacing:.13em;
}
.sector-card-occupied:hover .sector-subject-preview img,
.sector-card-occupied:focus-visible .sector-subject-preview img{
  filter:saturate(.92) brightness(.92) contrast(1.02);
  transform:scale(1.035);
}
.sector-card-occupied:hover .sector-subject-preview,
.sector-card-occupied:focus-visible .sector-subject-preview{
  border-color:#26391c;
}
.sector-card-occupied .sector-count{
  align-items:center;
}
.sector-card-occupied .sector-count b{
  color:#e9eee8;
  font-family:inherit;
  font-size:14px;
  font-weight:500;
  letter-spacing:0;
}
.sector-card-occupied:hover .sector-count b,
.sector-card-occupied:focus-visible .sector-count b{
  color:#091007;
}

@media(max-width:900px){
  .sector-card-occupied .sector-subject-preview{
    height:155px;
    max-width:420px;
  }
}


/* =========================
   V7 — MULTI SUBJECT PREVIEWS
========================= */
/* Replace the single large preview with compact occupant portraits. */
.sector-card-occupied .sector-subject-preview{display:none;}

.sector-subject-strip{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  height:174px;
  margin:18px 0 20px;
}
.subject-mini{
  position:relative;
  min-width:0;
  overflow:hidden;
  border:1px solid #303834;
  background:#080b0a;
}
.subject-mini::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,transparent 48%,rgba(2,5,4,.88) 100%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.015) 0 1px,transparent 1px 4px);
}
.subject-mini img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 22%;
  filter:saturate(.72) brightness(.72) contrast(1.04);
  transition:filter .3s ease,transform .4s ease;
}
.subject-mini > span{
  position:absolute;
  z-index:2;
  left:9px;
  bottom:8px;
  color:#dfe6df;
  font-size:10px;
  font-weight:600;
  letter-spacing:-.02em;
}
.sector-card-occupied:hover .subject-mini img,
.sector-card-occupied:focus-visible .subject-mini img{
  filter:saturate(.95) brightness(.92) contrast(1.02);
  transform:scale(1.035);
}

/* Cleaner occupant line: fixes the awkward label/name alignment. */
.sector-card-occupied .sector-count{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:16px;
  align-items:center;
  width:100%;
}
.sector-card-occupied .sector-count > span{
  color:#6f8175;
  white-space:nowrap;
}
.sector-card-occupied .sector-count b{
  justify-self:end;
  text-align:right;
  color:#e5ebe6;
  font-size:11px;
  font-weight:600;
  line-height:1.4;
}
.sector-card-occupied:hover .sector-count b,
.sector-card-occupied:focus-visible .sector-count b{
  color:#0b1209;
}

@media(max-width:900px){
  .sector-subject-strip{
    height:160px;
  }
}


/* =========================
   V8 — ONE SUBJECT PER CARD
========================= */
.sector-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.sector-card-single{
  min-width:0;
}

.single-subject-preview{
  position:relative;
  display:block;
  width:100%;
  height:210px;
  margin:20px 0 24px;
  overflow:hidden;
  border:1px solid #303834;
  background:#080b0a;
}

.single-subject-preview::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,transparent 58%,rgba(2,5,4,.88) 100%),
    repeating-linear-gradient(0deg,rgba(255,255,255,.014) 0 1px,transparent 1px 4px);
}

.single-subject-preview img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 24%;
  filter:saturate(.76) brightness(.76) contrast(1.04);
  transition:filter .3s ease,transform .4s ease;
}

.single-subject-preview > span{
  position:absolute;
  z-index:2;
  left:12px;
  bottom:10px;
  color:#eef3ee;
  font-size:11px;
  font-weight:600;
}

.sector-card-single:hover .single-subject-preview img,
.sector-card-single:focus-visible .single-subject-preview img{
  filter:saturate(.96) brightness(.94) contrast(1.02);
  transform:scale(1.025);
}

/* No A/B/C/E/F/G labels: only sequential facility numbers. */
.sector-card-single .sector-count{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:28px;
  width:100%;
  margin-top:30px;
  padding-top:20px;
}

.sector-card-single .sector-count > span{
  white-space:nowrap;
  color:#6f8175;
}

.sector-card-single .sector-count b{
  justify-self:end;
  text-align:right;
  color:#e8eee9;
  font-size:12px;
  font-weight:600;
}

.sector-card-single .sector-action{
  margin-top:16px;
  padding-top:2px;
}

.sector-card-single:hover .sector-count b,
.sector-card-single:focus-visible .sector-count b{
  color:#0a1008;
}

@media(max-width:1000px){
  .sector-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:620px){
  .sector-grid{
    grid-template-columns:1fr;
  }
  .single-subject-preview{
    height:260px;
  }
}


/* =========================
   V9 — CARD FOOTER OVERLAP FIX
========================= */
.sector-card-single .sector-count,
.sector-card-single .sector-action{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;
}

.sector-card-single .sector-count{
  display:flex !important;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  min-height:24px;
  margin:30px 0 0 !important;
  padding:20px 0 0 !important;
  border-top:1px solid #303834;
}

.sector-card-single .sector-count > span{
  flex:0 0 auto;
}

.sector-card-single .sector-count b{
  flex:1 1 auto;
  min-width:0;
  text-align:right;
  white-space:nowrap;
}

.sector-card-single .sector-action{
  display:flex !important;
  justify-content:space-between;
  align-items:center;
  width:100%;
  min-height:28px;
  margin:12px 0 0 !important;
  padding:0 !important;
}

@media(max-width:620px){
  .sector-card-single .sector-count{
    gap:18px;
  }
}


/* =========================
   V10 — VISUAL RECORD BLACK GAP REMOVAL
   Keep the current portrait placement/scale; remove only the black letterbox space.
========================= */
.case-file{
  align-items:start;
}

.case-visual{
  height:auto !important;
  min-height:0 !important;
  align-self:start;
  overflow:hidden;
  background:transparent !important;
}

.case-visual img{
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  display:block;
  object-fit:initial !important;
  object-position:initial !important;
  background:transparent !important;
}

/* Preserve the existing VISUAL RECORD label position. */
.case-visual .visual-label,
.case-visual .visual-record,
.case-visual > span:first-child{
  z-index:3;
}

@media(max-width:900px){
  .case-visual{
    height:auto !important;
  }
  .case-visual img{
    width:100% !important;
    height:auto !important;
  }
}


/* =========================================================
   V15 — INDEPENDENT LEFT / RIGHT HEIGHTS
   Left ends with the portrait. Right keeps its own scroll.
   No filler image, no forced equal-height stretching.
========================================================= */

.case-file{
  height:min(760px,88vh) !important;
  max-height:88vh !important;
  align-items:start !important;
  overflow:hidden !important;
}

/* LEFT: natural image height only. */
.case-visual{
  height:auto !important;
  min-height:0 !important;
  align-self:start !important;
  overflow:hidden !important;
  background:transparent !important;
}

.case-visual > img{
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  display:block !important;
  object-fit:initial !important;
  object-position:initial !important;
  background:transparent !important;
}

/* RIGHT: independent fixed-height record with scroll. */
.case-data{
  height:min(760px,88vh) !important;
  max-height:88vh !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain;
  padding-bottom:32px !important;
  scrollbar-width:thin;
  scrollbar-color:#536159 #090c0a;
}

.case-data::-webkit-scrollbar{
  width:7px;
}
.case-data::-webkit-scrollbar-track{
  background:#090c0a;
}
.case-data::-webkit-scrollbar-thumb{
  background:#536159;
  border:2px solid #090c0a;
}

@media(max-width:900px){
  .case-file{
    height:auto !important;
    max-height:92vh !important;
    overflow-y:auto !important;
  }
  .case-visual,
  .case-data{
    height:auto !important;
    max-height:none !important;
  }
  .case-data{
    overflow:visible !important;
  }
}


/* =========================================================
   V16 — ATTACHED INTERVIEW RECORD IN LEFT EMPTY SPACE
   Keep V15 portrait size/layout. Use only the remaining black area.
========================================================= */

/* Left column now owns portrait + archive action in normal flow. */
.case-visual{
  display:flex !important;
  flex-direction:column;
  height:min(760px,88vh) !important;
  background:#050606 !important;
}

.case-visual > img{
  flex:0 0 auto !important;
  width:100% !important;
  height:auto !important;
}

/* The archive card consumes the leftover black area without resizing the portrait. */
.case-visual .interview-open-button{
  position:relative !important;
  inset:auto !important;
  flex:1 1 auto;
  width:100% !important;
  min-height:150px;
  margin:0 !important;
  padding:24px 22px !important;
  display:flex !important;
  flex-direction:column;
  justify-content:space-between;
  align-items:stretch;
  text-align:left;
  border:0 !important;
  border-top:1px solid rgba(184,255,79,.38) !important;
  background:
    linear-gradient(180deg,rgba(184,255,79,.025),rgba(184,255,79,.055)),
    #050806 !important;
  color:#e6ece7;
}

.case-visual .interview-open-button::before{
  content:"";
  position:absolute;
  inset:12px;
  border:1px solid rgba(184,255,79,.10);
  pointer-events:none;
}

.case-visual .interview-open-kicker{
  position:relative;
  z-index:1;
  margin:0;
  color:#728078;
  font:8px var(--mono);
  letter-spacing:.17em;
}

.case-visual .interview-open-main{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
}

.case-visual .interview-open-main > span:first-child{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.case-visual .interview-open-button strong{
  font-size:18px;
  line-height:1.2;
  font-weight:600;
  letter-spacing:-.025em;
}

.case-visual .interview-open-button small{
  color:#67736b;
  font:7px var(--mono);
  letter-spacing:.13em;
}

.case-visual .interview-open-arrow{
  flex:0 0 auto;
  color:var(--acid);
  font:8px var(--mono);
  letter-spacing:.12em;
  white-space:nowrap;
}

.case-visual .interview-open-button:hover,
.case-visual .interview-open-button:focus-visible{
  border-top-color:var(--acid) !important;
  background:
    linear-gradient(180deg,rgba(184,255,79,.045),rgba(184,255,79,.09)),
    #050806 !important;
}

.case-visual .interview-open-button:hover::before,
.case-visual .interview-open-button:focus-visible::before{
  border-color:rgba(184,255,79,.25);
}

/* Right side remains V15's independent scroll area. */
.case-data{
  height:min(760px,88vh) !important;
  max-height:88vh !important;
  overflow-y:auto !important;
}

@media(max-width:900px){
  .case-visual{
    height:auto !important;
  }
  .case-visual .interview-open-button{
    min-height:135px;
    flex:none;
  }
}

/* V19 Haku containment visual */
.haku-room-record{
  margin-top:22px;
  border:1px solid rgba(184,255,79,.18);
  background:#060908;
}
.haku-room-image{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
}
.haku-room-image::after{
  content:"";
  position:absolute;
  inset:0;
  box-shadow:inset 0 0 40px rgba(0,0,0,.55);
  pointer-events:none;
}
.haku-room-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.haku-room-caption{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:11px 13px;
  border-top:1px solid rgba(184,255,79,.12);
}
.haku-room-caption span{
  color:#718077;
  font:8px var(--mono);
  letter-spacing:.13em;
}
.haku-room-caption b{
  color:#dfe7e1;
  font-size:11px;
  font-weight:500;
}


/* V21 — ANUBIS C-SECTOR CONTAINMENT VISUAL */
.anubis-room-record{
  margin-top:22px;
  border:1px solid rgba(184,255,79,.18);
  background:#080806;
}
.anubis-room-image{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
}
.anubis-room-image::after{
  content:"";
  position:absolute;
  inset:0;
  box-shadow:inset 0 0 42px rgba(0,0,0,.5);
  pointer-events:none;
}
.anubis-room-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.anubis-room-caption{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:11px 13px;
  border-top:1px solid rgba(184,255,79,.12);
}
.anubis-room-caption span{
  color:#817a6d;
  font:8px var(--mono);
  letter-spacing:.13em;
}
.anubis-room-caption b{
  color:#e6e0d4;
  font-size:11px;
  font-weight:500;
}


/* V22 — TAMAMO E-SECTOR CONTAINMENT VISUAL */
.tamamo-room-record{
  margin-top:22px;
  border:1px solid rgba(184,255,79,.18);
  background:#080707;
}
.tamamo-room-image{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
}
.tamamo-room-image::after{
  content:"";
  position:absolute;
  inset:0;
  box-shadow:inset 0 0 42px rgba(0,0,0,.48);
  pointer-events:none;
}
.tamamo-room-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.tamamo-room-caption{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:11px 13px;
  border-top:1px solid rgba(184,255,79,.12);
}
.tamamo-room-caption span{
  color:#81757d;
  font:8px var(--mono);
  letter-spacing:.13em;
}
.tamamo-room-caption b{
  color:#e5dfe3;
  font-size:11px;
  font-weight:500;
}


/* V24 — SHUTEN F-SECTOR CONTAINMENT VISUAL */
.shuten-room-record{
  margin-top:22px;
  border:1px solid rgba(184,255,79,.18);
  background:#080707;
}
.shuten-room-image{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
}
.shuten-room-image::after{
  content:"";
  position:absolute;
  inset:0;
  box-shadow:inset 0 0 42px rgba(0,0,0,.48);
  pointer-events:none;
}
.shuten-room-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.shuten-room-caption{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:11px 13px;
  border-top:1px solid rgba(184,255,79,.12);
}
.shuten-room-caption span{
  color:#81756f;
  font:8px var(--mono);
  letter-spacing:.13em;
}
.shuten-room-caption b{
  color:#e7dfda;
  font-size:11px;
  font-weight:500;
}


/* V25 — FENRIR G-SECTOR CONTAINMENT VISUAL */
.fenrir-room-record{
  margin-top:22px;
  border:1px solid rgba(184,255,79,.18);
  background:#06080a;
}
.fenrir-room-image{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
}
.fenrir-room-image::after{
  content:"";
  position:absolute;
  inset:0;
  box-shadow:inset 0 0 42px rgba(0,0,0,.5);
  pointer-events:none;
}
.fenrir-room-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.fenrir-room-caption{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:11px 13px;
  border-top:1px solid rgba(184,255,79,.12);
}
.fenrir-room-caption span{
  color:#71808a;
  font:8px var(--mono);
  letter-spacing:.13em;
}
.fenrir-room-caption b{
  color:#dce6ec;
  font-size:11px;
  font-weight:500;
}


/* V26 — ARK INTERNAL PERSONNEL */
.ark-personnel-section{
  width:min(1180px,calc(100% - 48px));
  margin:70px auto 90px;
  padding-top:28px;
  border-top:1px solid rgba(184,255,79,.22);
}
.personnel-section-head{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:flex-end;
  margin-bottom:24px;
}
.personnel-section-head .eyebrow{
  color:var(--acid);
  font:10px var(--mono);
  letter-spacing:.16em;
}
.personnel-section-head h2{
  margin:8px 0 6px;
  font-size:26px;
  letter-spacing:-.04em;
}
.personnel-section-head p{
  margin:0;
  color:#777f79;
  font-size:12px;
}
.personnel-access{
  border:1px solid rgba(184,255,79,.3);
  color:var(--acid);
  padding:7px 10px;
  font:9px var(--mono);
  letter-spacing:.12em;
}
.personnel-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.personnel-card{
  padding:0;
  text-align:left;
  color:inherit;
  border:1px solid rgba(255,255,255,.08);
  background:#070908;
  cursor:pointer;
  overflow:hidden;
  transition:.18s ease;
}
.personnel-card:hover{
  border-color:rgba(184,255,79,.42);
  transform:translateY(-2px);
}
.personnel-thumb{
  aspect-ratio:4/3;
  overflow:hidden;
  background:#0b0d0c;
}
.personnel-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 22%;
  display:block;
  filter:saturate(.78) brightness(.82);
  transition:.18s ease;
}
.personnel-card:hover .personnel-thumb img{
  filter:saturate(.92) brightness(.95);
}
.personnel-card-body{
  padding:16px 17px 18px;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.personnel-card-body span{
  color:#68716b;
  font:8px var(--mono);
  letter-spacing:.12em;
}
.personnel-card-body strong{
  font-size:20px;
  font-weight:600;
}
.personnel-card-body small{
  min-height:32px;
  color:#929993;
  font-size:11px;
  line-height:1.5;
}
.personnel-card-body em{
  margin-top:9px;
  color:var(--acid);
  font:9px var(--mono);
  font-style:normal;
  letter-spacing:.08em;
}
.personnel-file{
  display:grid;
  grid-template-columns:minmax(310px,.82fr) minmax(0,1.18fr);
  height:min(760px,88vh);
  overflow:hidden;
  background:#050706;
}
.personnel-file-visual{
  display:flex;
  flex-direction:column;
  min-height:0;
  border-right:1px solid rgba(255,255,255,.08);
  background:#050706;
}
.personnel-file-visual > img{
  width:100%;
  height:auto;
  max-height:580px;
  object-fit:cover;
  object-position:center top;
  display:block;
}
.personnel-file-data{
  height:min(760px,88vh);
  overflow-y:auto;
  padding:30px;
}
.personnel-room-record{
  margin-top:22px;
  border:1px solid rgba(184,255,79,.18);
  background:#080909;
}
.personnel-room-image{
  aspect-ratio:16/9;
  overflow:hidden;
}
.personnel-room-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.personnel-room-caption{
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:11px 13px;
  border-top:1px solid rgba(184,255,79,.12);
}
.personnel-room-caption span{
  color:#707871;
  font:8px var(--mono);
  letter-spacing:.13em;
}
.personnel-room-caption b{
  color:#dfe5e0;
  font-size:11px;
  font-weight:500;
}
@media(max-width:900px){
  .personnel-grid{grid-template-columns:1fr 1fr}
  .personnel-file{grid-template-columns:1fr;height:min(88vh,900px);overflow-y:auto}
  .personnel-file-visual{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
  .personnel-file-data{height:auto;overflow:visible}
}
@media(max-width:620px){
  .ark-personnel-section{width:min(100% - 28px,1180px)}
  .personnel-section-head{align-items:flex-start;flex-direction:column}
  .personnel-grid{grid-template-columns:1fr}
}


/* V28 — personnel attached-record readability fix */
.personnel-file-visual .interview-open-button{
  width:calc(100% - 20px);
  margin:16px 10px 10px;
  padding:15px 18px 16px;
  min-height:92px;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:stretch;
  gap:10px;
  overflow:hidden;
}
.personnel-file-visual .interview-open-main{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:18px;
}
.personnel-file-visual .interview-open-main > span:first-child{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}
.personnel-file-visual .interview-open-main strong{
  display:block;
  white-space:normal;
  font-size:15px;
  line-height:1.25;
}
.personnel-file-visual .interview-open-main small{
  display:block;
  white-space:normal;
  color:#a7afa8;
  font:8px/1.35 var(--mono);
  letter-spacing:.08em;
}
.personnel-file-visual .interview-open-arrow{
  white-space:nowrap;
  align-self:end;
  font-size:8px;
  line-height:1.2;
}
.personnel-file-visual .interview-open-kicker{
  display:block;
  width:100%;
  white-space:normal;
}
@media(max-width:520px){
  .personnel-file-visual .interview-open-main{
    grid-template-columns:1fr;
    gap:8px;
  }
  .personnel-file-visual .interview-open-arrow{
    justify-self:start;
  }
}


/* V29 — unify generated records with the original Cthulhu visual language */

/* Haku / Anubis / Tamamo / Shuten / Fenrir + ARK personnel visual-record badge */
.haku-case .visual-label,
.anubis-case .visual-label,
.tamamo-case .visual-label,
.shuten-case .visual-label,
.fenrir-case .visual-label,
.personnel-dialog .visual-label{
  position:absolute !important;
  top:18px !important;
  left:18px !important;
  z-index:8 !important;
  display:inline-flex !important;
  align-items:center !important;
  width:auto !important;
  max-width:calc(100% - 36px) !important;
  min-height:28px !important;
  padding:0 14px !important;
  margin:0 !important;
  border:1px solid rgba(184,255,79,.55) !important;
  background:rgba(5,8,6,.90) !important;
  color:var(--acid) !important;
  font:700 9px/1 var(--mono) !important;
  letter-spacing:.12em !important;
  white-space:nowrap !important;
  box-sizing:border-box !important;
}

/* Their left image wrappers need to be positioning contexts like Cthulhu's. */
.haku-case .case-visual,
.anubis-case .case-visual,
.tamamo-case .case-visual,
.shuten-case .case-visual,
.fenrir-case .case-visual,
.personnel-dialog .personnel-file-visual{
  position:relative !important;
}

/* Match the original Cthulhu attached-record block.
   V28 personnel-specific rules had made this card taller and more sparse. */
.personnel-dialog .interview-open-button{
  width:calc(100% - 20px) !important;
  min-height:0 !important;
  height:auto !important;
  flex:0 0 auto !important;
  margin:16px 10px 10px !important;
  padding:14px 18px 15px !important;
  display:block !important;
  overflow:hidden !important;
}
.personnel-dialog .interview-open-kicker{
  display:block !important;
  margin:0 0 18px !important;
  color:#667169 !important;
  font:8px/1.2 var(--mono) !important;
  letter-spacing:.14em !important;
}
.personnel-dialog .interview-open-main{
  width:100% !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  align-items:end !important;
  gap:14px !important;
}
.personnel-dialog .interview-open-main > span:first-child{
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:5px !important;
}
.personnel-dialog .interview-open-main strong{
  display:block !important;
  color:#f0f3f0 !important;
  font-size:15px !important;
  line-height:1.2 !important;
  white-space:normal !important;
}
.personnel-dialog .interview-open-main small{
  display:block !important;
  color:#667169 !important;
  font:7px/1.2 var(--mono) !important;
  letter-spacing:.1em !important;
  white-space:normal !important;
}
.personnel-dialog .interview-open-arrow{
  align-self:end !important;
  justify-self:end !important;
  color:var(--acid) !important;
  font:700 8px/1.2 var(--mono) !important;
  white-space:nowrap !important;
}

/* Ensure the five non-Cthulhu subject attached-record cards inherit the same
   compact spacing rather than any template-specific expansion. */
.haku-case .interview-open-button,
.anubis-case .interview-open-button,
.tamamo-case .interview-open-button,
.shuten-case .interview-open-button,
.fenrir-case .interview-open-button{
  flex:0 0 auto !important;
}

@media(max-width:520px){
  .personnel-dialog .interview-open-main{
    grid-template-columns:minmax(0,1fr) auto !important;
  }
}


/* V30 — generated CASE/PERSONNEL header normalization
   Match the original Cthulhu record hierarchy without altering Cthulhu itself. */
.haku-case .case-data,
.anubis-case .case-data,
.tamamo-case .case-data,
.shuten-case .case-data,
.fenrir-case .case-data,
.personnel-dialog .personnel-file-data{
  position:relative;
}

.haku-case .case-head,
.anubis-case .case-head,
.tamamo-case .case-head,
.shuten-case .case-head,
.fenrir-case .case-head,
.personnel-dialog .case-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  width:100% !important;
  min-height:40px !important;
  padding:0 0 14px !important;
  margin:0 0 22px !important;
  border-bottom:1px solid rgba(255,255,255,.14) !important;
  box-sizing:border-box !important;
}
.haku-case .case-head > span,
.anubis-case .case-head > span,
.tamamo-case .case-head > span,
.shuten-case .case-head > span,
.fenrir-case .case-head > span,
.personnel-dialog .case-head > span{
  display:block !important;
  color:#8a938d !important;
  font:8px/1.2 var(--mono) !important;
  letter-spacing:.18em !important;
  white-space:nowrap !important;
}
.haku-case .case-head > b,
.anubis-case .case-head > b,
.tamamo-case .case-head > b,
.shuten-case .case-head > b,
.fenrir-case .case-head > b,
.personnel-dialog .case-head > b{
  display:block !important;
  margin-left:auto !important;
  color:var(--danger) !important;
  font:700 8px/1.2 var(--mono) !important;
  letter-spacing:.14em !important;
  white-space:nowrap !important;
}

/* CASE + NAME block: same compact label/value rhythm as Cthulhu. */
.haku-case .case-title,
.anubis-case .case-title,
.tamamo-case .case-title,
.shuten-case .case-title,
.fenrir-case .case-title,
.personnel-dialog .case-title{
  display:grid !important;
  grid-template-columns:92px minmax(0,1fr) !important;
  grid-template-rows:auto auto !important;
  column-gap:14px !important;
  row-gap:22px !important;
  align-items:center !important;
  margin:0 0 30px !important;
  padding:0 0 28px !important;
  border-bottom:1px solid rgba(255,255,255,.14) !important;
}
.haku-case .case-title small,
.anubis-case .case-title small,
.tamamo-case .case-title small,
.shuten-case .case-title small,
.fenrir-case .case-title small,
.personnel-dialog .case-title small{
  display:block !important;
  margin:0 !important;
  color:#65716a !important;
  font:8px/1.2 var(--mono) !important;
  letter-spacing:.18em !important;
}
.haku-case .case-title h2,
.anubis-case .case-title h2,
.tamamo-case .case-title h2,
.shuten-case .case-title h2,
.fenrir-case .case-title h2,
.personnel-dialog .case-title h2{
  margin:0 !important;
  color:#eef3ef !important;
  font:500 14px/1.25 var(--mono) !important;
  letter-spacing:.04em !important;
}
.haku-case .case-title h3,
.anubis-case .case-title h3,
.tamamo-case .case-title h3,
.shuten-case .case-title h3,
.fenrir-case .case-title h3,
.personnel-dialog .case-title h3{
  margin:0 !important;
  color:#f2f5f2 !important;
  font-size:34px !important;
  font-weight:700 !important;
  line-height:1.1 !important;
  letter-spacing:-.05em !important;
}

/* Prevent old generic rules from making the first CLASS row jump upward. */
.haku-case .case-grid,
.anubis-case .case-grid,
.tamamo-case .case-grid,
.shuten-case .case-grid,
.fenrir-case .case-grid,
.personnel-dialog .case-grid{
  margin-top:0 !important;
}

@media(max-width:620px){
  .haku-case .case-title,
  .anubis-case .case-title,
  .tamamo-case .case-title,
  .shuten-case .case-title,
  .fenrir-case .case-title,
  .personnel-dialog .case-title{
    grid-template-columns:76px minmax(0,1fr) !important;
    column-gap:10px !important;
  }
  .haku-case .case-title h3,
  .anubis-case .case-title h3,
  .tamamo-case .case-title h3,
  .shuten-case .case-title h3,
  .fenrir-case .case-title h3,
  .personnel-dialog .case-title h3{
    font-size:28px !important;
  }
}


/* V31 — 03 PSYCHIC EROSION */
.erosion-section{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto 72px;
  padding-top:8px;
}
.erosion-section-heading{
  align-items:flex-end;
}
.erosion-status{
  color:#667169;
  font:8px var(--mono);
  letter-spacing:.13em;
  border:1px solid rgba(184,255,79,.16);
  padding:7px 10px;
}
.erosion-summary{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);
  border:1px solid rgba(255,255,255,.09);
  background:#070908;
}
.erosion-summary-copy{
  padding:24px 26px;
  border-right:1px solid rgba(255,255,255,.08);
}
.erosion-summary-copy > span,
.erosion-response-head > span,
.erosion-control-note > span{
  color:#69736c;
  font:8px var(--mono);
  letter-spacing:.14em;
}
.erosion-summary-copy strong{
  display:block;
  margin:10px 0 9px;
  color:#edf2ee;
  font-size:16px;
  line-height:1.5;
}
.erosion-summary-copy p,
.erosion-response-head p,
.erosion-polarity-card p,
.erosion-control-note p{
  margin:0;
  color:#89928c;
  font-size:11px;
  line-height:1.8;
}
.erosion-types{
  display:grid;
  grid-template-columns:1fr 1fr;
}
.erosion-types span{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  min-height:72px;
  padding:13px 16px;
  border-right:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  color:#69736d;
  font:8px var(--mono);
}
.erosion-types b{
  color:#dce4de;
  font-size:11px;
  font-weight:500;
}
.erosion-response{
  margin-top:12px;
  border:1px solid rgba(255,255,255,.09);
  background:#070908;
}
.erosion-response-head{
  padding:20px 24px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.erosion-response-head h3{
  margin:8px 0 7px;
  color:#e9eeea;
  font-size:17px;
}
.erosion-polarity{
  display:grid;
  grid-template-columns:1fr 1fr;
}
.erosion-polarity-card{
  position:relative;
  min-height:190px;
  padding:22px 24px;
}
.erosion-polarity-card + .erosion-polarity-card{
  border-left:1px solid rgba(255,255,255,.08);
}
.erosion-polarity-card.positive{
  box-shadow:inset 0 2px 0 var(--acid);
}
.erosion-polarity-card.negative{
  box-shadow:inset 0 2px 0 var(--danger);
}
.polarity-code{
  color:#667169;
  font:8px var(--mono);
  letter-spacing:.13em;
}
.erosion-polarity-card h3{
  margin:9px 0 10px;
  font-size:20px;
}
.erosion-polarity-card.positive h3{color:var(--acid)}
.erosion-polarity-card.negative h3{color:#ff5757}
.erosion-example{
  margin-top:18px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.08);
}
.erosion-example span{
  display:block;
  margin-bottom:5px;
  color:#667169;
  font:7px var(--mono);
  letter-spacing:.13em;
}
.erosion-example strong{
  color:#cbd4cd;
  font-size:10px;
  font-weight:500;
}
.erosion-control-note{
  display:grid;
  grid-template-columns:160px 1fr;
  gap:18px;
  margin-top:12px;
  padding:16px 20px;
  border:1px solid rgba(184,255,79,.18);
  background:rgba(184,255,79,.025);
}
.erosion-control-note > span{
  color:var(--acid);
}
@media(max-width:820px){
  .erosion-summary{grid-template-columns:1fr}
  .erosion-summary-copy{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
}
@media(max-width:620px){
  .erosion-section{width:min(100% - 28px,1180px)}
  .erosion-status{display:none}
  .erosion-types{grid-template-columns:1fr 1fr}
  .erosion-polarity{grid-template-columns:1fr}
  .erosion-polarity-card + .erosion-polarity-card{
    border-left:0;
    border-top:1px solid rgba(255,255,255,.08);
  }
  .erosion-control-note{grid-template-columns:1fr;gap:7px}
}


/* V32 — 04 ADMINISTRATOR SCHEDULE */
.schedule-section{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto 72px;
}
.schedule-heading{align-items:flex-end}
.schedule-status{
  color:#68716b;
  font:8px var(--mono);
  letter-spacing:.13em;
  border:1px solid rgba(184,255,79,.16);
  padding:7px 10px;
}
.schedule-layout{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);
  gap:12px;
}
.schedule-panel{
  border:1px solid rgba(255,255,255,.09);
  background:#070908;
}
.schedule-panel > header{
  padding:18px 20px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.schedule-panel > header span{
  color:#69736c;
  font:8px var(--mono);
  letter-spacing:.14em;
}
.schedule-panel > header h3{
  margin:6px 0 0;
  color:#edf2ee;
  font-size:18px;
}
.timeline-row{
  display:grid;
  grid-template-columns:90px 1fr;
  min-height:82px;
  border-bottom:1px solid rgba(255,255,255,.065);
}
.timeline-row:last-child{border-bottom:0}
.timeline-row time{
  padding:18px 16px;
  border-right:1px solid rgba(255,255,255,.065);
  color:var(--acid);
  font:9px/1.5 var(--mono);
}
.timeline-row > div{padding:16px 18px}
.timeline-row strong,
.weekday strong{
  display:block;
  margin-bottom:6px;
  color:#dce4de;
  font-size:12px;
}
.timeline-row p,
.weekday p{
  margin:0;
  color:#7f8982;
  font-size:10px;
  line-height:1.7;
}
.timeline-row.night{
  background:rgba(184,255,79,.018);
}
.weekly-grid{
  display:grid;
}
.weekday{
  position:relative;
  padding:17px 18px 18px 68px;
  min-height:104px;
  border-bottom:1px solid rgba(255,255,255,.065);
}
.weekday:last-child{border-bottom:0}
.weekday > span{
  position:absolute;
  left:17px;
  top:20px;
  color:var(--acid);
  font:700 9px var(--mono);
  letter-spacing:.1em;
}
.weekday > b{
  display:block;
  margin-bottom:7px;
  color:#667169;
  font:8px var(--mono);
  font-weight:400;
}
@media(max-width:850px){
  .schedule-layout{grid-template-columns:1fr}
}
@media(max-width:620px){
  .schedule-section{width:min(100% - 28px,1180px)}
  .schedule-status{display:none}
  .timeline-row{grid-template-columns:76px 1fr}
  .timeline-row time{padding:16px 12px}
  .timeline-row > div{padding:15px}
}

/* V33 — ARK section quick navigation */
html{scroll-behavior:smooth}
#briefing,#definition,#erosion,#schedule,#containment,#arkPersonnel{scroll-margin-top:62px}
.section-jump{
  position:sticky;top:0;z-index:45;width:100%;min-height:42px;
  display:flex;align-items:stretch;justify-content:center;
  border-top:1px solid rgba(184,255,79,.12);
  border-bottom:1px solid rgba(184,255,79,.18);
  background:rgba(5,8,7,.95);backdrop-filter:blur(10px);
  overflow-x:auto;scrollbar-width:none;
}
.section-jump::-webkit-scrollbar{display:none}
.section-jump-label{
  display:flex;align-items:center;padding:0 16px;
  border-right:1px solid rgba(255,255,255,.07);
  color:#657069;font:7px/1 var(--mono);letter-spacing:.14em;white-space:nowrap;
}
.section-jump a{
  position:relative;display:flex;align-items:center;gap:7px;
  min-height:42px;padding:0 15px;border-right:1px solid rgba(255,255,255,.055);
  color:#8a938d;text-decoration:none;font:9px/1 var(--mono);white-space:nowrap;
}
.section-jump a b{color:#566159;font-size:7px;font-weight:500}
.section-jump a:hover,.section-jump a.is-active{color:#eef3ef;background:rgba(184,255,79,.035)}
.section-jump a.is-active b{color:var(--acid)}
.section-jump a.is-active::after{
  content:"";position:absolute;left:12px;right:12px;bottom:0;height:1px;background:var(--acid)
}
@media(max-width:760px){
  .section-jump{justify-content:flex-start}
  .section-jump-label{display:none}
  .section-jump a{padding:0 12px}
}

/* V34 — merged facility header + section navigation */
.section-jump{display:none!important}
.facility-nav{
  position:sticky!important;top:0!important;z-index:50!important;
  min-height:64px!important;height:auto!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:center!important;gap:20px!important;
  padding:0 28px!important;
  background:rgba(5,8,7,.97)!important;
  border-bottom:1px solid rgba(184,255,79,.20)!important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.top-section-nav{
  min-width:0;height:64px;display:flex;align-items:stretch;justify-content:center;
  overflow-x:auto;scrollbar-width:none
}
.top-section-nav::-webkit-scrollbar{display:none}
.top-section-nav a{
  position:relative;display:flex;align-items:center;gap:7px;
  min-width:max-content;padding:0 16px;
  border-left:1px solid rgba(255,255,255,.05);
  color:#aeb6b0;text-decoration:none;
  font:600 11px/1 var(--mono);letter-spacing:.015em;
}
.top-section-nav a:last-child{border-right:1px solid rgba(255,255,255,.05)}
.top-section-nav a b{color:#69746c;font-size:8px;font-weight:600}
.top-section-nav a:hover,.top-section-nav a.is-active{
  color:#f4f7f5;background:rgba(184,255,79,.04)
}
.top-section-nav a.is-active b{color:var(--acid)}
.top-section-nav a.is-active::after{
  content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;background:var(--acid)
}
#briefing,#definition,#erosion,#schedule,#containment,#arkPersonnel{scroll-margin-top:78px}
.facility-nav .brand,.facility-nav .nav-meta{min-width:max-content}
@media(max-width:980px){
  .facility-nav{grid-template-columns:auto minmax(0,1fr)!important;padding:0 16px!important;gap:12px!important}
  .facility-nav .nav-meta{display:none!important}
  .top-section-nav{justify-content:flex-start}
}
@media(max-width:620px){
  .facility-nav{min-height:56px!important;padding:0 10px!important}
  .top-section-nav{height:56px}
  .top-section-nav a{padding:0 11px;font-size:10px}
  .top-section-nav a b{font-size:7px}
}
