/* ── Compiler background ─────────────────────────────────────────────────── */
#compiler-bg{position:fixed;inset:0;z-index:0;pointer-events:none;display:block;padding:0;overflow:hidden;}
#compiler-shell{position:fixed;inset:0;width:100%;height:100%;height:100dvh;border:none;border-radius:0;background:transparent;box-shadow:none;overflow:hidden;opacity:var(--compiler-opacity);will-change:opacity;transform:none;}
#compiler-head{display:none;}
.comp-left,.comp-right{display:flex;align-items:center;gap:10px}
.comp-dots{display:flex;gap:6px}
.comp-dot{width:10px;height:10px;border-radius:50%}
.comp-dot.r{background:#ff5f56}.comp-dot.y{background:#ffbd2e}.comp-dot.g{background:#27c93f}
.comp-pill{padding:3px 8px;border:1px solid rgba(19,28,40,.95);border-radius:999px}
#compiler-title{color:rgba(0,212,255,.9)}
#compiler-stage{color:rgba(0,255,136,.72)}
#compiler-screen{height:100%;padding:28px 32px 28px 24px;overflow:hidden;white-space:pre;word-break:normal;scrollbar-width:none;font-family:'JetBrains Mono',monospace;font-size:16px;line-height:1.55;color:rgba(178,242,218,.86);text-shadow:0 0 10px rgba(28,220,160,.12);min-width:0;max-width:100%;}
#compiler-screen::-webkit-scrollbar{display:none}
.comp-key{color:rgba(92,226,248,.94)}.comp-type{color:rgba(190,166,244,.9)}.comp-cmt{color:rgba(108,144,164,.92)}.comp-log{color:rgba(92,240,168,.94)}.comp-warn{color:rgba(255,174,104,.9)}
.comp-cur{display:inline-block;width:9px;height:1.15em;vertical-align:-.18em;background:rgba(95,238,214,.9);box-shadow:0 0 10px rgba(0,212,255,.34);animation:curblink 1s steps(1,end) infinite}
@keyframes curblink{50%{opacity:0}}

/* ── Compiler layout + wrap ───────────────────────────────────────────────── */
#compiler-wrap{display:flex;height:100%;width:100%;max-width:100%;overflow:hidden;position:relative;}
#compiler-lines{padding:28px 10px 28px 12px;font-family:'JetBrains Mono',monospace;font-size:16px;line-height:1.55;color:rgba(68,85,102,.6);text-align:right;min-width:48px;flex-shrink:0;user-select:none;overflow:hidden;white-space:pre;border-right:1px solid rgba(19,28,40,.5);background:rgba(8,12,18,.25);}
#compiler-screen{height:100%;padding:28px 32px 28px 24px;flex:1 1 auto;min-width:0;max-width:100%;overflow:hidden;}

/* ── Hard mode compiler effects (JS-controlled) ──────────────────────────── */
.ff-compiler-danger-1,
.ff-compiler-danger-2,
.ff-compiler-danger-3{position:relative;}
.ff-compiler-danger-1{box-shadow:0 0 28px rgba(239,68,68,.22),inset 0 0 44px rgba(239,68,68,.08);}
.ff-compiler-danger-2{box-shadow:0 0 46px rgba(239,68,68,.38),inset 0 0 70px rgba(239,68,68,.15);}
.ff-compiler-danger-3{box-shadow:0 0 70px rgba(239,68,68,.55),inset 0 0 100px rgba(239,68,68,.22);}
.ff-compiler-glitching{animation:ffCompilerGlitch .18s linear 5;}
.ff-compiler-crashing{animation:ffCompilerCrashShake .12s linear infinite;}
.ff-compiler-crashing #compiler-screen,.ff-compiler-crashing #compiler-lines{transform:scale(1.045);transform-origin:center;transition:transform 220ms ease;}
.ff-compiler-blackout{opacity:.08;transition:opacity 260ms ease;}
@keyframes ffCompilerGlitch{0%{transform:translate(0,0);filter:none}25%{transform:translate(1px,-1px);filter:saturate(1.4)}50%{transform:translate(-1px,1px);filter:contrast(1.2)}75%{transform:translate(1px,1px);filter:saturate(1.2)}100%{transform:translate(0,0);filter:none}}
@keyframes ffCompilerCrashShake{0%{transform:translate(0,0)}25%{transform:translate(2px,-1px)}50%{transform:translate(-2px,1px)}75%{transform:translate(1px,2px)}100%{transform:translate(0,0)}}

/* ── Accessibility overrides (compiler elements) ─────────────────────────── */
body.ff-large-text #compiler-screen{font-size:24px}
body.ff-large-text #compiler-lines{font-size:20px}
body.ff-high-contrast #compiler-shell{opacity:var(--compiler-opacity) !important;}
body.ff-high-contrast #compiler-screen{color:rgba(170,232,214,.82) !important;}

/* ── Non-focus panels: dim compiler so it doesn't compete with modals ─────── */
body[data-panel="settings"] #compiler-shell,
body[data-panel="stats"] #compiler-shell,
body[data-panel="team"] #compiler-shell{
  opacity:calc(var(--compiler-opacity)*.82) !important;
}

body.repo-open #compiler-shell{
  opacity:calc(var(--compiler-opacity) * .45) !important;
}
