/* ═══════════════════════════════════════════════════════════════════
   ISCD: THE CONTINUITY GATE — GAME STYLES
═══════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=DM+Sans:wght@200;300;400&family=JetBrains+Mono:wght@300;400&display=swap');

#iscd-gate-root {
  --void:#050709; --abyss:#080c12; --navy:#0a0f1a; --dim:#1a2332;
  --fog:#3d5269; --smoke:#6b7fa0; --ash:#8fa3c0; --pale:#b8cce0;
  --ivory:#dce8f0; --white:#eef4f8;
  --amber:#c4903a; --amber-glow:#e8b050; --amber-pale:#f2cc7a;
  --cyan:#4a9eb5; --cyan-pale:#a0d4e6;
  --red:#9e3a3a; --red-pale:#e08080;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'DM Sans',system-ui,sans-serif;
  --mono:'JetBrains Mono','Courier New',monospace;

  position: fixed;
  inset: 0;
  z-index: 999999;
  background: var(--void);
  color: var(--ivory);
  font-family: var(--sans);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}
#iscd-gate-root *, #iscd-gate-root *::before, #iscd-gate-root *::after { box-sizing: border-box; }
#iscd-gate-root, #iscd-gate-root ul, #iscd-gate-root li, #iscd-gate-root p, #iscd-gate-root h1, #iscd-gate-root h2, #iscd-gate-root h3 { margin: 0; }
#iscd-gate-root ul { padding: 0; list-style: none; }

/* ── LOADER ─────────────────────────────────────────────────────── */
.iscd-gate-loader {
  position: absolute; inset: 0; z-index: 100;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.5rem;
  background: var(--void); transition: opacity .8s ease;
}
.iscd-gate-loader.hide { opacity: 0; pointer-events: none; }
.iscd-loader-text { font-family: var(--mono); font-size: .6rem; letter-spacing: .25em; text-transform: uppercase; color: var(--cyan); opacity: .7; }
.iscd-loader-bar-wrap { width: 260px; height: 1px; background: rgba(74,158,181,.15); }
.iscd-loader-bar { height: 100%; width: 0%; background: var(--amber); transition: width .3s ease; }

/* ── STAGE ──────────────────────────────────────────────────────── */
.iscd-gate-stage { position: absolute; inset: 0; z-index: 1; }

/* ── SCENE (background image layer) ─────────────────────────────── */
.iscd-scene {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: 0; transition: opacity 1.2s ease;
  z-index: 1;
}
.iscd-scene.show { opacity: 1; }
/* Parallax drift */
.iscd-scene-inner {
  position: absolute; inset: -5%;
  background-size: cover; background-position: center;
  will-change: transform;
  animation: iscd-drift 40s ease-in-out infinite alternate;
}
@keyframes iscd-drift {
  0%   { transform: scale(1.05) translateX(-1.5%); }
  100% { transform: scale(1.1) translateX(1.5%); }
}
/* Overlays */
.iscd-scene-vignette { position: absolute; inset: 0; z-index: 2; background: radial-gradient(ellipse at center, transparent 40%, rgba(5,7,9,.75) 100%); pointer-events: none; }
.iscd-scene-darken   { position: absolute; inset: 0; z-index: 2; background: linear-gradient(180deg, rgba(5,7,9,.5) 0%, rgba(5,7,9,.2) 35%, rgba(5,7,9,.6) 100%); pointer-events: none; }
.iscd-scanlines      { position: absolute; inset: 0; z-index: 3; background: repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(0,0,0,.05) 3px, rgba(0,0,0,.05) 4px); pointer-events: none; }
.iscd-particles      { position: absolute; inset: 0; z-index: 3; pointer-events: none; }

/* ── CONTENT LAYER ──────────────────────────────────────────────── */
.iscd-content {
  position: absolute; inset: 0; z-index: 10;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 2rem; text-align: center;
}

/* ── MENU ───────────────────────────────────────────────────────── */
.iscd-menu-box { max-width: 520px; width: 100%; padding: 1rem; }
.iscd-menu-eyebrow { font-family: var(--mono); font-size: .55rem; letter-spacing: .3em; text-transform: uppercase; color: var(--cyan); opacity: .7; margin-bottom: 1rem; }
.iscd-menu-title { font-family: var(--serif); font-size: clamp(2.5rem,7vw,5rem); font-weight: 300; color: var(--white); line-height: .95; letter-spacing: .02em; text-shadow: 0 0 40px rgba(0,0,0,.8); }
.iscd-menu-title span { color: var(--amber); display: block; font-size: .55em; font-style: italic; margin-top: .25rem; }
.iscd-menu-tagline { font-family: var(--serif); font-style: italic; font-size: 1.05rem; color: var(--pale); margin: 1.5rem auto; max-width: 440px; line-height: 1.6; text-shadow: 0 2px 12px rgba(0,0,0,.9); }
.iscd-menu-sub { font-family: var(--sans); font-size: .78rem; font-weight: 300; color: var(--ash); margin: 0 auto 2.5rem; max-width: 480px; line-height: 1.8; text-shadow: 0 2px 10px rgba(0,0,0,.9); }
.iscd-menu-list { list-style: none; display: inline-flex; flex-direction: column; gap: .5rem; min-width: 240px; }
.iscd-menu-item {
  font-family: var(--sans); font-size: .82rem; font-weight: 300; letter-spacing: .15em; text-transform: uppercase;
  color: var(--ash); padding: .7rem 1.5rem; cursor: pointer; transition: all .3s;
  border: .5px solid transparent; background: rgba(5,7,9,.4); backdrop-filter: blur(4px);
  position: relative;
}
.iscd-menu-item:hover, .iscd-menu-item:focus { color: var(--amber-pale); border-color: rgba(196,144,58,.4); background: rgba(196,144,58,.08); outline: none; letter-spacing: .2em; }

/* ── PANELS / CHAPTERS ──────────────────────────────────────────── */
.iscd-panel {
  background: rgba(8,12,18,.82); backdrop-filter: blur(8px);
  border: .5px solid rgba(74,158,181,.18); border-top: 2px solid var(--amber);
  padding: 1.25rem 1.9rem; max-width: 720px; width: 100%; position: relative;
  max-height: 92vh; overflow-y: auto;
}
.iscd-panel::-webkit-scrollbar { width: 4px; }
.iscd-panel::-webkit-scrollbar-thumb { background: rgba(74,158,181,.3); }
.iscd-corner { position: absolute; width: 14px; height: 14px; }
.iscd-corner.tl { top: 8px; left: 8px; border-top: 1px solid rgba(196,144,58,.4); border-left: 1px solid rgba(196,144,58,.4); }
.iscd-corner.tr { top: 8px; right: 8px; border-top: 1px solid rgba(196,144,58,.4); border-right: 1px solid rgba(196,144,58,.4); }
.iscd-corner.bl { bottom: 8px; left: 8px; border-bottom: 1px solid rgba(196,144,58,.4); border-left: 1px solid rgba(196,144,58,.4); }
.iscd-corner.br { bottom: 8px; right: 8px; border-bottom: 1px solid rgba(196,144,58,.4); border-right: 1px solid rgba(196,144,58,.4); }

.iscd-ch-eyebrow { font-family: var(--mono); font-size: .55rem; letter-spacing: .25em; text-transform: uppercase; color: var(--cyan); opacity: .75; margin-bottom: .5rem; }
.iscd-ch-title { font-family: var(--serif); font-size: clamp(1.5rem,3.6vw,2.2rem); font-weight: 300; color: var(--white); line-height: 1.12; margin-bottom: .4rem; }
.iscd-ch-theme { font-family: var(--serif); font-style: italic; font-size: .95rem; color: var(--amber); margin-bottom: 1rem; }
.iscd-ch-divider { height: .5px; background: linear-gradient(to right, var(--amber), transparent); margin-bottom: 1rem; border: none; }
.iscd-ch-narrative { font-family: var(--sans); font-size: .82rem; font-weight: 300; color: var(--ash); line-height: 1.75; margin-bottom: 1rem; }

/* ── TERMINAL ───────────────────────────────────────────────────── */
.iscd-terminal {
  background: rgba(5,7,9,.85); border: .5px solid rgba(74,158,181,.15); border-left: 1.5px solid var(--cyan);
  padding: 1rem 1.3rem; margin: 1rem 0; font-family: var(--mono); font-size: .72rem; line-height: 1.95; color: var(--ash);
}
.iscd-terminal p { margin: 0 0 .5rem; }
.iscd-terminal p:last-child { margin-bottom: 0; }
.iscd-tw-cursor { display: inline-block; width: 2px; height: .8em; background: var(--cyan); vertical-align: middle; animation: iscd-blink .7s step-end infinite; }
@keyframes iscd-blink { 50% { opacity: 0; } }
.iscd-hl-amber { color: var(--amber-pale); }
.iscd-hl-cyan  { color: var(--cyan-pale); }
.iscd-hl-red   { color: var(--red-pale); }
.iscd-scramble { color: var(--cyan); opacity: .7; }

/* ── CHOICES ────────────────────────────────────────────────────── */
.iscd-choices { display: flex; flex-direction: column; gap: .5rem; margin-top: 1.1rem; }
.iscd-choice {
  display: flex; align-items: center; gap: 1rem;
  font-family: var(--sans); font-size: .82rem; font-weight: 300; color: var(--ivory);
  background: rgba(10,15,26,.7); border: .5px solid rgba(74,158,181,.2); border-left: 2px solid transparent;
  padding: .55rem 1.25rem; cursor: pointer; transition: all .3s; text-align: left; line-height: 1.4;
  min-height: 45px;
}
.iscd-choice:hover { border-left-color: var(--amber); background: rgba(196,144,58,.06); color: var(--amber-pale); padding-left: 1.5rem; }
.iscd-choice.disabled { opacity: .35; pointer-events: none; }
.iscd-choice.chosen { border-left-color: var(--cyan); background: rgba(74,158,181,.08); opacity: 1; }
.iscd-choice-num {
  font-family: var(--mono); font-size: .75rem; color: var(--cyan); opacity: .7;
  flex-shrink: 0; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center;
  border: .5px solid rgba(74,158,181,.3); border-radius: 50%;
}
.iscd-choice:hover .iscd-choice-num { border-color: var(--amber); color: var(--amber-pale); }
.iscd-choice-text { flex: 1; }

/* ── BUTTONS ────────────────────────────────────────────────────── */
.iscd-btn {
  display: inline-flex; align-items: center; gap: .6rem; font-family: var(--sans);
  font-size: .68rem; font-weight: 400; letter-spacing: .2em; text-transform: uppercase;
  padding: 1.1rem 2.4rem; cursor: pointer; border: none; transition: all .3s; text-decoration: none; background: none;
}
.iscd-btn-primary { background: var(--amber); color: var(--void); }
.iscd-btn-primary:hover { background: var(--amber-glow); box-shadow: 0 0 22px rgba(232,176,80,.28); }
.iscd-btn-ghost { color: var(--ivory); border: .5px solid rgba(184,204,224,.3); }
.iscd-btn-ghost:hover { border-color: var(--ivory); }
.iscd-btn-cyan { color: var(--cyan-pale); border: .5px solid rgba(74,158,181,.3); }
.iscd-btn-cyan:hover { border-color: var(--cyan); background: rgba(74,158,181,.06); }
.iscd-actions { display: flex; gap: .85rem; flex-wrap: wrap; margin-top: 1.6rem; justify-content: center; }

/* ── CONTENT FADE TRANSITIONS ───────────────────────────────────── */
.iscd-panel { animation: iscd-panel-in .9s ease both; }
@keyframes iscd-panel-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.iscd-panel.iscd-fading-out { animation: iscd-panel-out .6s ease both; }
@keyframes iscd-panel-out { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(-14px); } }
.iscd-reveal { opacity: 0; transform: translateY(8px); transition: opacity .8s ease, transform .8s ease; }
.iscd-reveal.show { opacity: 1; transform: translateY(0); }

/* ── HUD ────────────────────────────────────────────────────────── */
.iscd-hud {
  position: absolute; top: 1rem; left: 1rem; z-index: 50;
  display: flex; flex-direction: column; gap: .75rem;
  background: rgba(5,7,9,.72); backdrop-filter: blur(8px);
  border: .5px solid rgba(74,158,181,.18); padding: .95rem 1.1rem;
  animation: iscd-hud-appear .8s ease both;
}
@keyframes iscd-hud-appear { from { opacity:0; transform: translateX(-12px); } to { opacity:1; transform: translateX(0); } }
.iscd-hud-title { font-family: var(--mono); font-size: .42rem; letter-spacing: .2em; text-transform: uppercase; color: var(--cyan); opacity: .6; margin-bottom: .15rem; }
.iscd-hud-meters { display: flex; flex-direction: column; gap: .55rem; }
.iscd-meter { display: flex; align-items: center; gap: .6rem; }
.iscd-meter-label { font-family: var(--mono); font-size: .44rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ash); width: 64px; }
.iscd-meter-bar { width: 96px; height: 4px; background: rgba(74,158,181,.12); border-radius: 2px; overflow: hidden; position: relative; }
.iscd-meter-fill {
  height: 100%; width: 50%; background: var(--cyan); border-radius: 2px;
  transition: width .9s cubic-bezier(.4,0,.2,1), background .9s ease;
  position: relative;
}
/* constant shimmer travelling across the fill */
.iscd-meter-fill::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
  transform: translateX(-100%);
  animation: iscd-meter-shimmer 2.8s ease-in-out infinite;
}
@keyframes iscd-meter-shimmer { 0% { transform: translateX(-100%); } 60%,100% { transform: translateX(220%); } }
/* gentle breathing pulse on the whole bar */
.iscd-meter-bar { animation: iscd-meter-breathe 4s ease-in-out infinite; }
@keyframes iscd-meter-breathe { 0%,100% { box-shadow: 0 0 0 0 rgba(74,158,181,0); } 50% { box-shadow: 0 0 6px 0 rgba(74,158,181,.15); } }
/* value readout */
.iscd-meter-val { font-family: var(--mono); font-size: .46rem; color: var(--cyan-pale); width: 22px; text-align: right; transition: color .6s; }
/* flash when a value changes */
.iscd-meter-fill.iscd-meter-changed { animation: iscd-meter-flash .7s ease; }
@keyframes iscd-meter-flash { 0% { filter: brightness(2.2); } 100% { filter: brightness(1); } }
.iscd-meter-val.iscd-up { color: #6ddb9e; }
.iscd-meter-val.iscd-down { color: var(--red-pale); }
.iscd-hud-errors { display: flex; gap: .4rem; justify-content: center; padding-top: .55rem; border-top: .5px solid rgba(74,158,181,.1); }
.iscd-err-dot { width: 7px; height: 7px; border-radius: 50%; border: .5px solid rgba(224,128,128,.4); transition: all .4s; }
.iscd-err-dot.active { background: var(--red-pale); box-shadow: 0 0 8px var(--red-pale); border-color: var(--red-pale); animation: iscd-err-pulse 1.4s ease-in-out infinite; }
@keyframes iscd-err-pulse { 0%,100% { box-shadow: 0 0 6px var(--red-pale); } 50% { box-shadow: 0 0 14px var(--red-pale); } }

/* ── EXIT BUTTON (always visible during play) ───────────────────── */
.iscd-exit-btn {
  position: absolute; top: 1rem; right: 1rem; z-index: 55;
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--mono); font-size: .48rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--ash); background: rgba(5,7,9,.72); backdrop-filter: blur(8px);
  border: .5px solid rgba(74,158,181,.18); padding: .6rem .9rem; cursor: pointer; transition: all .3s;
}
.iscd-exit-btn:hover { color: var(--red-pale); border-color: rgba(224,128,128,.4); }
.iscd-exit-btn svg { width: 10px; height: 10px; }

/* ── DEGRADATION STATES ─────────────────────────────────────────── */
#iscd-gate-root.degrade-1 .iscd-scene-inner { filter: saturate(.85) brightness(.95); }
#iscd-gate-root.degrade-2 .iscd-scene-inner { filter: saturate(.6) brightness(.85) hue-rotate(-8deg); }
#iscd-gate-root.degrade-2 .iscd-panel { border-top-color: var(--red); }
#iscd-gate-root.degrade-1 .iscd-glitch-flash { animation: iscd-glitch-soft .3s steps(2,end); }
@keyframes iscd-glitch-soft { 0%,100%{transform:translateX(0);} 50%{transform:translateX(2px);filter:hue-rotate(20deg);} }

/* ── ENDING REPORT ──────────────────────────────────────────────── */
.iscd-ending-title { font-family: var(--serif); font-size: clamp(2rem,5vw,3.2rem); font-weight: 300; color: var(--white); margin-bottom: 1rem; letter-spacing: .04em; }
.iscd-ending-title.degraded { color: var(--red-pale); }

/* broken neon flicker for Coherence Failure title */
.iscd-ending-title.broken-neon {
  color: #ff6b6b;
  text-shadow: 0 0 8px rgba(224,80,80,.7), 0 0 18px rgba(224,80,80,.4);
  animation: iscd-neon-break 3.5s infinite;
}
@keyframes iscd-neon-break {
  0%, 19%, 21%, 23%, 80%, 100% { opacity: 1; text-shadow: 0 0 8px rgba(224,80,80,.7), 0 0 18px rgba(224,80,80,.4); }
  20% { opacity: .3; text-shadow: none; }
  22% { opacity: .85; }
  55% { opacity: 1; }
  56% { opacity: .15; text-shadow: none; }
  57% { opacity: 1; text-shadow: 0 0 14px rgba(224,80,80,.9); transform: translateX(1px); }
  58% { transform: translateX(-1px); }
  59% { transform: translateX(0); }
}
/* a line that flickers irregularly */
.iscd-flicker-line { animation: iscd-line-flicker 2.4s infinite steps(1,end); }
@keyframes iscd-line-flicker {
  0%,100% { opacity: 1; } 8% { opacity: .2; } 9% { opacity: 1; }
  40% { opacity: 1; } 41% { opacity: .1; } 43% { opacity: .9; }
  70% { opacity: 1; } 72% { opacity: .35; } 74% { opacity: 1; }
}
.iscd-flicker-strong { animation: iscd-line-flicker-strong 1.6s infinite steps(1,end); color: #ff8080 !important; }
@keyframes iscd-line-flicker-strong {
  0%,100% { opacity: .9; } 15% { opacity: .15; } 17% { opacity: 1; }
  30% { opacity: .2; } 33% { opacity: .85; } 60% { opacity: .1; } 63% { opacity: 1; }
}
@keyframes iscd-flicker { 0%,100%{opacity:1;} 92%{opacity:1;} 94%{opacity:.4;} 96%{opacity:.9;} }

.iscd-report { background: rgba(5,7,9,.8); border: .5px solid rgba(74,158,181,.15); border-left: 1.5px solid var(--cyan); padding: 1.6rem 1.8rem; margin: 1.5rem 0; font-family: var(--mono); font-size: .74rem; line-height: 2.25; color: var(--ash); text-align: left; }
.iscd-report.degraded { border-left-color: var(--red); background: rgba(20,6,6,.6); }
.iscd-report p { margin: 0 0 .35rem; padding: 0; }
.iscd-report p:last-child { margin: 0; }
.iscd-final-text { font-family: var(--serif); font-size: 1.3rem; font-weight: 300; font-style: italic; color: var(--white); line-height: 1.8; margin: 1.6rem 0; }

/* compact buttons row for endings */
.iscd-actions.iscd-actions-row { flex-wrap: nowrap; gap: .6rem; }
.iscd-actions.iscd-actions-row .iscd-btn { padding: .7rem 1.2rem; font-size: .58rem; letter-spacing: .14em; white-space: nowrap; }
@media (max-width: 640px){ .iscd-actions.iscd-actions-row { flex-wrap: wrap; } }

/* ── INTRO SEQUENCE ─────────────────────────────────────────────── */
.iscd-intro { position: absolute; inset: 0; z-index: 60; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.5rem; background: var(--void); transition: opacity 1.4s ease; padding: 2rem; text-align: center; }
.iscd-intro.fade { opacity: 0; pointer-events: none; }
.iscd-intro-line { font-family: var(--mono); font-size: .62rem; letter-spacing: .24em; text-transform: uppercase; color: var(--cyan); opacity: 0; transform: translateY(8px); transition: opacity .8s ease, transform .8s ease; max-width: 560px; line-height: 1.9; }
.iscd-intro-line.show { opacity: .8; transform: translateY(0); }
.iscd-intro-title { font-family: var(--serif); font-size: clamp(2.5rem,7vw,5rem); font-weight: 300; color: var(--white); line-height: .95; opacity: 0; transform: scale(.94); transition: opacity 1.6s ease, transform 1.6s ease; text-shadow: 0 0 50px rgba(232,176,80,.25); }
.iscd-intro-title.show { opacity: 1; transform: scale(1); }
.iscd-intro-title span { display: block; color: var(--amber); font-style: italic; font-size: .5em; margin-top: .3rem; }
.iscd-intro-ring { position: absolute; top: 50%; left: 50%; width: 400px; height: 400px; border-radius: 50%; border: .5px solid rgba(196,144,58,.2); transform: translate(-50%,-50%) scale(.5); opacity: 0; transition: all 2.5s ease; }
.iscd-intro-ring.show { transform: translate(-50%,-50%) scale(1); opacity: 1; }
.iscd-intro-glow { position: absolute; top: 50%; left: 50%; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, rgba(232,176,80,.15), transparent 65%); transform: translate(-50%,-50%); opacity: 0; transition: opacity 2s ease; animation: gate-breathe 4s ease-in-out infinite; }
.iscd-intro-glow.show { opacity: 1; }
@keyframes gate-breathe { 0%,100%{transform:translate(-50%,-50%) scale(1);} 50%{transform:translate(-50%,-50%) scale(1.12);} }

/* ── GUIDE / OBJECTIVE BOX ──────────────────────────────────────── */
.iscd-guide-box { background: rgba(6,12,20,.7); border: .5px solid rgba(196,144,58,.2); border-left: 2px solid var(--amber); padding: 1.4rem 1.6rem; margin: 1.25rem 0; text-align: left; }
.iscd-guide-box h3 { font-family: var(--mono); font-size: .55rem; letter-spacing: .2em; text-transform: uppercase; color: var(--amber-pale); margin: 0 0 .75rem; }
.iscd-guide-box p { font-family: var(--sans); font-size: .8rem; font-weight: 300; color: var(--ash); line-height: 1.85; margin: 0 0 .6rem; }
.iscd-guide-box p:last-child { margin: 0; }
.iscd-guide-box strong { color: var(--cyan-pale); }
.iscd-guide-list { list-style: none; padding: 0; margin: .5rem 0; }
.iscd-guide-list li { font-family: var(--sans); font-size: .78rem; color: var(--ash); line-height: 1.9; padding-left: 1.25rem; position: relative; }
.iscd-guide-list li::before { content: '→'; position: absolute; left: 0; color: var(--amber); }

/* ── REGISTRATION FORM ──────────────────────────────────────────── */
.iscd-form { text-align: left; margin-top: 1.75rem; }
.iscd-form-field { margin-bottom: 1.5rem; }
.iscd-form-label { font-family: var(--mono); font-size: .52rem; letter-spacing: .18em; text-transform: uppercase; color: var(--cyan); display: block; margin-bottom: .5rem; }
.iscd-form-input, .iscd-form-textarea {
  width: 100%; font-family: var(--sans); font-size: .85rem; font-weight: 300;
  background: rgba(5,7,9,.7); border: .5px solid rgba(74,158,181,.25); color: var(--ivory);
  padding: .8rem 1rem; outline: none; transition: border-color .3s;
}
.iscd-form-input:focus, .iscd-form-textarea:focus { border-color: var(--cyan); }
.iscd-form-textarea { resize: vertical; min-height: 70px; }
.iscd-form-check { display: flex; align-items: flex-start; gap: .6rem; margin-bottom: 1rem; cursor: pointer; }
.iscd-form-check input { margin-top: .2rem; accent-color: var(--amber); }
.iscd-form-check-label { font-family: var(--sans); font-size: .74rem; font-weight: 300; color: var(--ash); line-height: 1.55; }
.iscd-form-msg { font-family: var(--mono); font-size: .58rem; letter-spacing: .1em; margin-top: 1rem; min-height: 1rem; }
.iscd-form-submit-wrap { margin-top: 2rem; padding-top: 1.5rem; border-top: .5px solid rgba(74,158,181,.12); display: flex; justify-content: center; }
.iscd-coupon-remaining {
  font-family: var(--serif); font-size: 1.2rem; font-weight: 300; line-height: 1.6;
  color: var(--amber-pale); margin-bottom: 1.5rem; text-align: center;
}
.iscd-coupon-remaining strong { color: var(--white); font-size: 1.35rem; }

/* ── RESPONSIVE ─────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .iscd-panel { padding: 1.5rem 1.25rem; max-height: 78vh; }

  /* HUD becomes a compact top bar instead of an overlay covering the quiz */
  .iscd-hud{
    top:0; left:0; right:0; width:100%;
    flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:center;
    gap:.3rem .7rem; padding:.45rem .55rem;
    background:rgba(5,7,9,.95); border:none; border-bottom:.5px solid rgba(74,158,181,.2);
  }
  .iscd-hud-title{ display:none; }
  .iscd-hud-meters{ flex-direction:row; flex-wrap:wrap; justify-content:center; gap:.25rem .55rem; }
  .iscd-meter{ gap:.25rem; }
  .iscd-meter-label{ width:auto; font-size:.4rem; }
  .iscd-meter-bar{ width:34px; }
  .iscd-meter-val{ width:15px; font-size:.42rem; }
  .iscd-cog-hud{ margin:0; padding:0 0 0 .5rem; border:none; border-left:.5px solid rgba(74,158,181,.2); display:inline-flex; align-items:center; gap:.35rem; }
  .iscd-cog-hud-label{ font-size:.38rem; margin:0; }
  .iscd-cog-hud-val{ font-size:.72rem; margin:0; }
  .iscd-hud-errors{ padding-top:0; border-top:none; gap:.3rem; }

  /* while the assessment is running, drop the quiz below the HUD bar (no overlap) */
  #iscd-gate-root.iscd-playing .iscd-content{ justify-content:flex-start; padding-top:6.2rem; }

  .iscd-meter-bar { width: 34px; }
  .iscd-menu-item { font-size: .75rem; }
  .iscd-actions { flex-direction: column; }
  .iscd-btn { width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════════════
   ISCD GAME v7 — mini-games, 5-level degradation, cognitive index
═══════════════════════════════════════════════════════════════════ */

/* ── Fracture overlay layer ─────────────────────────────────────── */
.iscd-fracture-layer{
  position:absolute; inset:0; z-index:6; pointer-events:none;
  background-size:cover; background-position:center; opacity:0;
  transition:opacity 1.2s ease; mix-blend-mode:screen;
  --frac-op:0;
}
/* When active, the layer breathes (pulse) and periodically glitches.
   Intensity is carried by --frac-op (set in JS from the fracture count). */
.iscd-fracture-layer.iscd-frac-on{
  opacity:var(--frac-op);
  transition:none;
  will-change:opacity, transform, filter;
  animation: iscd-frac-pulse 2.6s ease-in-out infinite,
             iscd-frac-glitch 6s steps(1,end) infinite;
}
@keyframes iscd-frac-pulse{
  0%,100%{ opacity:calc(var(--frac-op) * .68); filter:brightness(.92) drop-shadow(0 0 2px rgba(158,58,58,.0)); }
  50%    { opacity:var(--frac-op);             filter:brightness(1.18) drop-shadow(0 0 6px rgba(224,128,128,.45)); }
}
/* Mostly idle, with short violent glitch bursts */
@keyframes iscd-frac-glitch{
  0%,7%,12%,100%{ transform:translate(0,0) skewX(0); filter:none; }
  8%   { transform:translate(-3px,1px) skewX(-1.2deg); filter:hue-rotate(-12deg) contrast(1.3) brightness(1.3); }
  9%   { transform:translate(4px,-2px) skewX(1.4deg);  filter:hue-rotate(8deg) contrast(1.2); }
  10%  { transform:translate(-2px,0)   skewX(0);       filter:brightness(1.4); }
  62%  { transform:translate(0,0); }
  63%  { transform:translate(3px,-1px) skewX(1deg); filter:hue-rotate(-10deg) contrast(1.25) brightness(1.25); }
  64%  { transform:translate(-3px,1px); filter:none; }
}
/* Chromatic split of the cracks during glitch bursts (red / cyan ghosts) */
.iscd-fracture-layer.iscd-frac-on::before,
.iscd-fracture-layer.iscd-frac-on::after{
  content:''; position:absolute; inset:0;
  background:inherit; background-size:cover; background-position:center;
  mix-blend-mode:screen; opacity:0; pointer-events:none;
}
.iscd-fracture-layer.iscd-frac-on::before{ animation: iscd-frac-split-r 6s steps(1,end) infinite; }
.iscd-fracture-layer.iscd-frac-on::after { animation: iscd-frac-split-c 6s steps(1,end) infinite; }
@keyframes iscd-frac-split-r{
  0%,7.5%,11%,62%,64.5%,100%{ opacity:0; transform:translate(0,0); }
  8%,9%{ opacity:.55; transform:translate(-5px,0); filter:sepia(1) saturate(6) hue-rotate(-35deg); }
  63%  { opacity:.5;  transform:translate(4px,0);  filter:sepia(1) saturate(6) hue-rotate(-35deg); }
}
@keyframes iscd-frac-split-c{
  0%,7.5%,11%,62%,64.5%,100%{ opacity:0; transform:translate(0,0); }
  8%,9%{ opacity:.45; transform:translate(5px,0); filter:sepia(1) saturate(5) hue-rotate(150deg); }
  63%  { opacity:.4;  transform:translate(-4px,0); filter:sepia(1) saturate(5) hue-rotate(150deg); }
}
/* Higher degradation = faster, more nervous pulsing and more frequent glitches */
#iscd-gate-root.degrade-3 .iscd-fracture-layer.iscd-frac-on{ animation-duration:2.1s, 4.5s; }
#iscd-gate-root.degrade-4 .iscd-fracture-layer.iscd-frac-on{ animation-duration:1.6s, 3.2s; }
#iscd-gate-root.degrade-5 .iscd-fracture-layer.iscd-frac-on{ animation-duration:1.15s, 2.3s; }
#iscd-gate-root.degrade-4 .iscd-fracture-layer.iscd-frac-on::before,
#iscd-gate-root.degrade-5 .iscd-fracture-layer.iscd-frac-on::before{ animation-duration:3.2s; }
#iscd-gate-root.degrade-4 .iscd-fracture-layer.iscd-frac-on::after,
#iscd-gate-root.degrade-5 .iscd-fracture-layer.iscd-frac-on::after{ animation-duration:3.2s; }
@media (prefers-reduced-motion: reduce){
  .iscd-fracture-layer.iscd-frac-on{ animation:none; opacity:var(--frac-op); }
  .iscd-fracture-layer.iscd-frac-on::before,
  .iscd-fracture-layer.iscd-frac-on::after{ animation:none; opacity:0; }
}

/* ── 5-level irreversible degradation ───────────────────────────── */
#iscd-gate-root.degrade-1 .iscd-scene-inner{ filter:saturate(.92) contrast(1.02); }
#iscd-gate-root.degrade-2 .iscd-scene-inner{ filter:saturate(.8) contrast(1.05) hue-rotate(-8deg); }
#iscd-gate-root.degrade-3 .iscd-scene-inner{ filter:saturate(.62) contrast(1.1) hue-rotate(-14deg) brightness(.95); }
#iscd-gate-root.degrade-4 .iscd-scene-inner{ filter:saturate(.42) contrast(1.16) hue-rotate(-20deg) brightness(.9); }
#iscd-gate-root.degrade-5 .iscd-scene-inner{ filter:saturate(.2) contrast(1.25) hue-rotate(-26deg) brightness(.82); }
#iscd-gate-root.degrade-3 .iscd-panel,
#iscd-gate-root.degrade-4 .iscd-panel,
#iscd-gate-root.degrade-5 .iscd-panel{ border-color:rgba(158,58,58,.5)!important; border-top-color:var(--red)!important; }
#iscd-gate-root.degrade-4 .iscd-scanlines,
#iscd-gate-root.degrade-5 .iscd-scanlines{ opacity:.5; animation:iscd-scan-jitter .2s steps(2) infinite; }
@keyframes iscd-scan-jitter{ 0%{transform:translateY(0);} 100%{transform:translateY(2px);} }
#iscd-gate-root.degrade-4 .iscd-content,
#iscd-gate-root.degrade-5 .iscd-content{ animation:iscd-tremor 4s ease-in-out infinite; }
@keyframes iscd-tremor{ 0%,100%{transform:translate(0,0);} 25%{transform:translate(.5px,-.4px);} 50%{transform:translate(-.4px,.5px);} 75%{transform:translate(.3px,.3px);} }

.iscd-shake{ animation:iscd-shake .42s cubic-bezier(.36,.07,.19,.97); }
@keyframes iscd-shake{ 10%,90%{transform:translate(-1px,0);} 20%,80%{transform:translate(2px,0);} 30%,50%,70%{transform:translate(-3px,0);} 40%,60%{transform:translate(3px,0);} }

/* ── Cognitive Index HUD readout ────────────────────────────────── */
.iscd-cog-hud{ margin-top:.6rem; padding-top:.5rem; border-top:.5px solid rgba(74,158,181,.2); }
.iscd-cog-hud-label{ font-family:var(--mono); font-size:.4rem; letter-spacing:.2em; text-transform:uppercase; color:var(--cyan); opacity:.6; }
.iscd-cog-hud-val{ font-family:var(--mono); font-size:.9rem; color:var(--cyan-pale); letter-spacing:.05em; margin-top:.1rem; }

/* ── Final cognitive index reveal ───────────────────────────────── */
.iscd-cog-final{ text-align:center; margin:1.5rem 0; }
.iscd-cog-final-label{ font-family:var(--mono); font-size:.5rem; letter-spacing:.25em; text-transform:uppercase; color:var(--cyan); opacity:.7; }
.iscd-cog-final-num{ font-family:var(--mono); font-size:2.4rem; color:var(--cyan-pale); letter-spacing:.05em; margin:.4rem 0; text-shadow:0 0 24px rgba(74,158,181,.3); }
.iscd-cog-final-class{ font-family:var(--serif); font-style:italic; font-size:1.05rem; color:var(--cyan-pale); letter-spacing:.05em; }

/* ── Graded answer states ───────────────────────────────────────── */
.iscd-choice.partial{ border-left-color:var(--amber)!important; background:rgba(196,144,58,.07)!important; }
.iscd-choice.wrong{ border-left-color:var(--red)!important; background:rgba(158,58,58,.08)!important; color:var(--red-pale)!important; }

/* ── Mini-game shared ───────────────────────────────────────────── */
.iscd-minigame{ margin:1rem 0; display:flex; flex-direction:column; align-items:center; }
.iscd-mx-prompt{ font-family:var(--mono); font-size:.62rem; letter-spacing:.1em; color:var(--cyan); opacity:.85; text-align:center; margin:1rem 0 .75rem; }

/* Raven matrix */
.iscd-mx-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; width:min(300px,80vw); }
.iscd-mx-cell{ aspect-ratio:1; background:rgba(8,12,18,.6); border:.5px solid rgba(74,158,181,.2); display:flex; align-items:center; justify-content:center; }
.iscd-mx-cell img{ width:78%; height:78%; object-fit:contain; }
.iscd-mx-empty{ border:.5px dashed rgba(196,144,58,.5); }
.iscd-mx-q{ font-family:var(--mono); font-size:1.6rem; color:var(--amber); opacity:.6; }
.iscd-mx-options{ display:flex; gap:10px; margin-top:1rem; flex-wrap:wrap; justify-content:center; }
.iscd-mx-opt,.iscd-rot-opt,.iscd-seq-opt{ width:72px; height:72px; background:rgba(8,12,18,.7); border:.5px solid rgba(74,158,181,.25); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .25s; padding:6px; }
.iscd-mx-opt img,.iscd-rot-opt img,.iscd-seq-opt img{ width:100%; height:100%; object-fit:contain; transition:transform .3s; }
.iscd-mx-opt:hover,.iscd-rot-opt:hover,.iscd-seq-opt:hover{ border-color:var(--amber); background:rgba(196,144,58,.08); transform:translateY(-2px); }
.iscd-mx-opt.chosen,.iscd-rot-opt.chosen,.iscd-seq-opt.chosen{ border-color:var(--cyan); background:rgba(74,158,181,.12); }
.iscd-mx-opt.partial,.iscd-rot-opt.partial,.iscd-seq-opt.partial{ border-color:var(--amber); }
.iscd-mx-opt.wrong,.iscd-rot-opt.wrong,.iscd-seq-opt.wrong{ border-color:var(--red); }
.iscd-mx-opt.disabled,.iscd-rot-opt.disabled,.iscd-seq-opt.disabled{ pointer-events:none; opacity:.5; }
.iscd-mx-opt.chosen,.iscd-mx-opt.partial,.iscd-mx-opt.wrong{ opacity:1; }

/* Rotation */
.iscd-rot-ref{ text-align:center; margin-bottom:.5rem; }
.iscd-rot-reflabel{ font-family:var(--mono); font-size:.45rem; letter-spacing:.2em; color:var(--cyan); opacity:.6; margin-bottom:.4rem; }
.iscd-rot-ref img{ width:120px; height:120px; object-fit:contain; }
.iscd-rot-options{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }

/* Memory grid */
.iscd-mem-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; width:min(280px,76vw); }
.iscd-mem-cell{ aspect-ratio:1; background:rgba(8,12,18,.7); border:.5px solid rgba(74,158,181,.25); cursor:pointer; transition:all .18s; border-radius:2px; }
.iscd-mem-cell:hover:not(:disabled){ border-color:var(--amber); }
.iscd-mem-cell.lit{ background:radial-gradient(circle,rgba(160,212,230,.6),rgba(74,158,181,.15)); border-color:var(--cyan-pale); box-shadow:0 0 18px rgba(74,158,181,.5); }
.iscd-mem-cell:disabled{ cursor:default; }

/* Sequence */
.iscd-seq-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:center; }
.iscd-seq-cell{ width:58px; height:58px; background:rgba(8,12,18,.6); border:.5px solid rgba(74,158,181,.2); display:flex; align-items:center; justify-content:center; padding:5px; }
.iscd-seq-cell img{ width:100%; height:100%; object-fit:contain; }
.iscd-seq-q{ border:.5px dashed rgba(196,144,58,.5); }
.iscd-seq-q span{ font-family:var(--mono); font-size:1.3rem; color:var(--amber); opacity:.6; }
.iscd-seq-options{ display:flex; gap:10px; margin-top:1rem; flex-wrap:wrap; justify-content:center; }

/* ending title drift variant */
.iscd-ending-title.drift{ color:var(--amber-pale); text-shadow:0 0 18px rgba(196,144,58,.3); }
.iscd-report.drift{ border-left-color:var(--amber); }

/* ── Terminal text degradation (last lives) — v1.4.2 ─────────────────
   As fractures accumulate, the readable text itself reddens, flickers and
   grows harder to read — not just the background. */
.iscd-scramble-red{ color:var(--red-pale)!important; opacity:.9; text-shadow:0 0 5px rgba(158,58,58,.6); }

#iscd-gate-root.degrade-3 .iscd-terminal,
#iscd-gate-root.degrade-3 .iscd-report p{ color:#caa0a0; }

#iscd-gate-root.degrade-4 .iscd-terminal,
#iscd-gate-root.degrade-4 .iscd-report p,
#iscd-gate-root.degrade-5 .iscd-terminal,
#iscd-gate-root.degrade-5 .iscd-report p{
  color:var(--red-pale)!important;
  text-shadow:0 0 6px rgba(158,58,58,.55);
}
#iscd-gate-root.degrade-4 .iscd-terminal .iscd-hl-cyan,
#iscd-gate-root.degrade-5 .iscd-terminal .iscd-hl-cyan{ color:var(--red-pale)!important; }

/* the whole panel flickers like a failing display in the last lives */
#iscd-gate-root.degrade-4 .iscd-panel{ animation:iscd-panel-flicker 3.4s infinite steps(1,end); }
#iscd-gate-root.degrade-5 .iscd-panel{ animation:iscd-panel-flicker 2.0s infinite steps(1,end); }
#iscd-gate-root.degrade-5 .iscd-terminal{ letter-spacing:.4px; }
@keyframes iscd-panel-flicker{
  0%,100%{opacity:1;} 69%{opacity:1;} 70%{opacity:.5;} 72%{opacity:.92;}
  86%{opacity:1;} 87%{opacity:.35;} 89%{opacity:.85;} 90%{opacity:1;}
}
@media (prefers-reduced-motion: reduce){
  #iscd-gate-root.degrade-4 .iscd-panel,
  #iscd-gate-root.degrade-5 .iscd-panel{ animation:none; }
}