/* Era is independent of the existing color and terminal theme preferences. */
.era-panel{width:330px;max-height:calc(100dvh - 100px);overflow:auto}
.era-options{clear:both;display:grid;gap:7px}
.era-option{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:5px;cursor:pointer}
.era-option:has(:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.era-option:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.era-option input{accent-color:var(--accent);margin:0;flex-shrink:0}
.era-option strong{display:block;font-size:11px;color:var(--text)}
.era-option small{display:block;font-size:9px;color:var(--muted);line-height:1.6;margin-top:3px}
.era-symbol{font-size:24px;color:var(--accent);width:26px;text-align:center;flex-shrink:0}
[data-era-icon]{font-size:18px;line-height:1}
html:is([data-era=prehistoric],[data-era=medieval],[data-era=retro],[data-era=future]){color-scheme:dark;--era-heading:Georgia,serif;--era-radius:3px}
html:root[data-era=prehistoric]{--bg:#16130d;--surface:#262116;--surface2:#302a1d;--line:#61533a;--text:#f4e6c8;--muted:#c6b797;--purple:#ceb99b;--blue:#b9c6a0;--era-heading:'Palatino Linotype',Georgia,serif;--era-radius:22px 7px 25px 9px}
html:root[data-era=medieval]{--bg:#100c0b;--surface:#201817;--surface2:#2b1c19;--line:#685043;--text:#eee0c5;--muted:#c3ac97;--purple:#c3a3ad;--blue:#a5b9ba;--era-heading:'Palatino Linotype',Georgia,serif;--era-radius:2px}
html:root[data-era=retro]{--bg:#080f11;--surface:#101b1c;--surface2:#172729;--line:#42615a;--text:#deefda;--muted:#a2bca9;--purple:#cbb5e3;--blue:#a9c8d3;--era-heading:'Courier New',monospace;--era-radius:0px}
html:root[data-era=future]{--bg:#060e1b;--surface:#101e30;--surface2:#182b42;--line:#385977;--text:#e0effc;--muted:#a8bfd5;--purple:#b9adf3;--blue:#a5d6f3;--era-heading:'Trebuchet MS',Arial,sans-serif;--era-radius:16px}
/* Light-mode accent values are too dark on the deliberately dark era surfaces. */
html[data-era]:not([data-era=nocturne])[data-accent=rose]{--accent:#e6a3ae}
html[data-era]:not([data-era=nocturne])[data-accent=green]{--accent:#a1e8b5}
html[data-era]:not([data-era=nocturne])[data-accent=blue]{--accent:#93c5fd}
html[data-era]:not([data-era=nocturne])[data-accent=yellow]{--accent:#f4d875}
html[data-era]:not([data-era=nocturne])[data-accent=fuchsia]{--accent:#f3a0d7}
html[data-era]:not([data-era=nocturne])[data-accent=purple]{--accent:#c4b5fd}
html[data-era]:not([data-era=nocturne])[data-accent=orange]{--accent:#f5b183}
html[data-era]:not([data-era=nocturne]) :is(h1,h2,.brand,.project-card h3,.job h3,.arcade-selector strong){font-family:var(--era-heading)}
html[data-era]:not([data-era=nocturne]) :is(.terminal-window,.system-card,.stack-card,.project-card,.arcade-cabinet){border-radius:var(--era-radius)}
html[data-era]:not([data-era=nocturne]) .terminal-window{border:1px solid var(--line)}
html[data-era]:not([data-era=nocturne]) .nocturne-note{display:none}
html[data-era]:not([data-era=nocturne]) .terminal-window:before{display:block;padding:10px 20px;border-bottom:1px solid var(--line);font-size:9px;letter-spacing:3px;color:var(--accent);background:var(--surface2)}
html:root[data-era=prehistoric] body{background-image:repeating-linear-gradient(115deg,transparent 0 90px,#bc8f4520 91px,transparent 93px 210px),radial-gradient(ellipse at 80% 0%,#81603240,transparent 60%)}
[data-era=prehistoric] .terminal-window:before{content:'◬   I · ORIGINS   /   40 000 BCE'}
[data-era=prehistoric] .terminal-window{box-shadow:7px 9px 0 #090805, inset 0 0 50px #78603a20!important;border-width:3px!important}
[data-era=prehistoric] :is(.button,.tag,.nav-link.active){border-radius:9px 3px 11px 4px;border-style:dashed}
[data-era=prehistoric] h1{font-weight:700;text-shadow:2px 3px #0008}
[data-era=prehistoric] .orbit-core{border-radius:44% 56% 37% 63%;border-width:3px;background:#362b19}
[data-era=prehistoric] .orbit-one{border-style:dashed;transform:translate(-50%,-50%) rotate(20deg);border-radius:40%}
[data-era=prehistoric] .window-dots i{border-radius:50%;transform:none}
html:root[data-era=medieval] body{background-image:radial-gradient(ellipse at 50% 0%,#9f381c30,transparent 65%),repeating-linear-gradient(0deg,transparent 0 99px,#d5a45308 100px)}
[data-era=medieval] .terminal-window:before{content:'♜   II · THE CITADEL   /   ANNO 1348'}
[data-era=medieval] .terminal-window{border:3px double #8b6a47!important;box-shadow:0 25px 80px #0009,inset 0 0 40px #0005}
[data-era=medieval] :is(.window-bar,.terminal-status){background:linear-gradient(#37261c,#181210);border-color:#745638}
[data-era=medieval] :is(h1,h2){font-variant:small-caps;text-shadow:0 3px 0 #000;letter-spacing:1px}
[data-era=medieval] :is(.system-card,.stack-card,.project-card){border:3px double #745638}
[data-era=medieval] .orbit-core{border-radius:50% 50% 3px 3px;background:radial-gradient(ellipse at bottom,#682619,#1e1210);border:3px double #b48c55}
[data-era=medieval] .button{border:2px outset #806548;box-shadow:inset 0 0 0 1px #0005}
[data-era=medieval] .hero-divider{border-top:3px double #745638}
html:root[data-era=retro] body{background-image:linear-gradient(#80caa008 1px,transparent 1px),linear-gradient(90deg,#80caa008 1px,transparent 1px);background-size:32px 32px}
[data-era=retro] .terminal-window:before{content:'▣   III · PERSONAL COMPUTER   /   1986'}
[data-era=retro] .terminal-window{box-shadow:7px 7px 0 #42615a!important;border-width:2px!important}
[data-era=retro] .terminal-body{background:repeating-linear-gradient(0deg,#0002 0 1px,transparent 1px 4px)}
[data-era=retro] :is(h1,h2){font-weight:700;font-size:clamp(30px,3.4vw,52px);letter-spacing:-2px;text-shadow:2px 0 #8dddad40}
[data-era=retro] :is(.button,.tag,.planet,.nav-link,.arcade-selector button){border-radius:0;box-shadow:2px 2px 0 var(--line)}
[data-era=retro] .window-dots i{transform:none;border-radius:0;opacity:1}
[data-era=retro] .orbit{border-radius:0;transform:translate(-50%,-50%)}
[data-era=retro] .orbit-core{border-radius:0;font-family:monospace;border:3px double var(--accent);background:var(--surface)}
html:root[data-era=future] body{background-image:radial-gradient(circle at 10% 20%,#bddeff80 1px,transparent 2px),radial-gradient(circle at 80% 50%,#bddeff40 1px,transparent 2px),radial-gradient(ellipse at 80% 0%,#347dbd30,transparent 65%);background-size:180px 180px,260px 260px,100% 100%}
[data-era=future] .terminal-window:before{content:'◎   IV · ORBITAL STATION   /   2189'}
[data-era=future] .terminal-window{box-shadow:0 0 45px #38a8df15,inset 0 1px 0 #b3e5ff30}
[data-era=future] :is(.window-bar,.terminal-status){background:#152a40;border-color:#4a7897}
[data-era=future] h1{letter-spacing:-2px;font-weight:700}
[data-era=future] .button{border-radius:20px}
[data-era=future] .tag{border-radius:12px;background:#99d9ff08}
[data-era=future] .orbit-core{border-radius:50%;height:100px;background:radial-gradient(circle,#285779,#0c1b2d);box-shadow:0 0 40px #78cffc30}
[data-era=future] .orbit-one{border-radius:50%;transform:translate(-50%,-50%) rotate(-25deg) scaleY(.45)}
[data-era=future] .orbit-two{transform:translate(-50%,-50%) rotate(45deg) scaleY(.65)}
[data-era=future] .nav-link.active{border-radius:0 20px 20px 0;background:#77bbef10}
@media(max-width:1100px){.top-meta{display:none}.top-actions{gap:10px}}
@media(max-width:640px){.era-label{display:none}.era-panel{width:min(330px,calc(100vw - 24px))}.brand small{display:none}.topbar{gap:6px}.top-actions{gap:5px}html[data-era]:not([data-era=nocturne]) .terminal-window:before{font-size:8px;letter-spacing:1px;padding:10px 14px}}
