:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:inherit}

/* ---------- Era palettes: --l-* light, --d-* dark ---------- */
html[data-era="e50"]{
  --l-bg:#f7efd9;--l-panel:#fffaf0;--l-ink:#24323a;--l-muted:#566870;--l-accent:#c93a31;--l-accent2:#1f7d74;--l-onaccent:#fff;
  --l-pattern:radial-gradient(circle,rgba(31,125,116,.16) 0 2px,transparent 2.5px),radial-gradient(circle,rgba(201,58,49,.12) 0 2px,transparent 2.5px);--l-patsize:46px 46px,29px 29px;
  --d-bg:#0f262b;--d-panel:#163339;--d-ink:#f6ead0;--d-muted:#a9c3c0;--d-accent:#ff7a98;--d-accent2:#62e0d1;--d-onaccent:#0f262b;
  --d-pattern:radial-gradient(circle,rgba(255,122,152,.18) 0 1.5px,transparent 2px);--d-patsize:38px 38px;
  --hfont:'Pacifico',cursive;--bfont:'Courier Prime','Courier New',monospace;--fs:1.05rem;--radius:22px;--bw:2px;--bstyle:dashed;
}
html[data-era="e70"]{
  --l-bg:#f3e1bb;--l-panel:#fbeccb;--l-ink:#3b2314;--l-muted:#6b4529;--l-accent:#b04e0c;--l-accent2:#56641b;--l-onaccent:#fff6e0;
  --d-bg:#271810;--d-panel:#382315;--d-ink:#f6dfae;--d-muted:#d4ac77;--d-accent:#f08a32;--d-accent2:#cfc65c;--d-onaccent:#271810;
  --hfont:'Shrikhand',Georgia,serif;--bfont:'Bitter',Georgia,serif;--fs:1.05rem;--radius:26px;--bw:4px;--bstyle:solid;
}
html[data-era="e80"]{
  --l-bg:#f3f6ee;--l-panel:#ffffff;--l-ink:#1b2a1d;--l-muted:#3f5a43;--l-accent:#1f7a36;--l-accent2:#7a4f00;--l-onaccent:#fff;
  --l-pattern:repeating-linear-gradient(#f3f6ee 0 2.4em,#dcebd6 2.4em 4.8em);--l-patsize:auto;
  --d-bg:#020a03;--d-panel:#04160a;--d-ink:#45ff7a;--d-muted:#2bc75a;--d-accent:#ffd23d;--d-accent2:#45ff7a;--d-onaccent:#020a03;
  --d-pattern:repeating-linear-gradient(rgba(69,255,122,0) 0 2px,rgba(69,255,122,.05) 2px 3px);--d-patsize:auto;
  --hfont:'VT323','Courier New',monospace;--bfont:'VT323','Courier New',monospace;--fs:1.32rem;--radius:0px;--bw:1px;--bstyle:solid;
}
html[data-era="e90"]{
  --l-bg:#ffffff;--l-panel:#f2f2f2;--l-ink:#000080;--l-muted:#333366;--l-accent:#cc0000;--l-accent2:#0000ee;--l-onaccent:#ffff00;
  --l-pattern:radial-gradient(circle,#ffc6f0 1px,transparent 1.6px);--l-patsize:18px 18px;
  --d-bg:#000033;--d-panel:#000055;--d-ink:#ffffcc;--d-muted:#ccccff;--d-accent:#ff33ff;--d-accent2:#00ffff;--d-onaccent:#000033;
  --d-pattern:radial-gradient(circle,#ffffff 1px,transparent 1.6px),radial-gradient(circle,#ffff99 1px,transparent 1.6px);--d-patsize:61px 61px,37px 37px;
  --hfont:'Comic Neue','Comic Sans MS',cursive;--bfont:'Times New Roman',Times,serif;--fs:1.12rem;--radius:0px;--bw:4px;--bstyle:ridge;
}
html[data-era="e00"]{
  --l-bg:#eaf4fb;--l-panel:#ffffff;--l-ink:#2b3640;--l-muted:#56677a;--l-accent:#c94e00;--l-accent2:#0068aa;--l-onaccent:#fff;
  --l-pattern:linear-gradient(180deg,#cfe7f8 0,#eaf4fb 360px);--l-patsize:100% 100%;
  --d-bg:#0a1824;--d-panel:#132a3c;--d-ink:#e4f1fa;--d-muted:#9fb8c9;--d-accent:#ff8a33;--d-accent2:#55c2ff;--d-onaccent:#0a1824;
  --d-pattern:linear-gradient(180deg,#123049 0,#0a1824 360px);--d-patsize:100% 100%;
  --hfont:'Trebuchet MS','Lucida Grande',Verdana,sans-serif;--bfont:Verdana,Tahoma,'Segoe UI',sans-serif;--fs:.98rem;--radius:10px;--bw:1px;--bstyle:solid;
}
html{--bg:var(--l-bg);--panel:var(--l-panel);--ink:var(--l-ink);--muted:var(--l-muted);--accent:var(--l-accent);--accent2:var(--l-accent2);--onaccent:var(--l-onaccent);--pattern:var(--l-pattern,none);--patsize:var(--l-patsize,auto);color-scheme:light}
@media (prefers-color-scheme:dark){
  html:not([data-theme="light"]){--bg:var(--d-bg);--panel:var(--d-panel);--ink:var(--d-ink);--muted:var(--d-muted);--accent:var(--d-accent);--accent2:var(--d-accent2);--onaccent:var(--d-onaccent);--pattern:var(--d-pattern,none);--patsize:var(--d-patsize,auto);color-scheme:dark}
}
html[data-theme="dark"]{--bg:var(--d-bg);--panel:var(--d-panel);--ink:var(--d-ink);--muted:var(--d-muted);--accent:var(--d-accent);--accent2:var(--d-accent2);--onaccent:var(--d-onaccent);--pattern:var(--d-pattern,none);--patsize:var(--d-patsize,auto);color-scheme:dark}

/* ---------- Base ---------- */
body{margin:0;background-color:var(--bg);background-image:var(--pattern);background-size:var(--patsize);color:var(--ink);font-family:var(--bfont);font-size:var(--fs);line-height:1.6;transition:background-color .4s,color .4s}
.wrap{max-width:960px;margin:0 auto;padding:0 20px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px}
.skip:focus{left:12px;z-index:70;background:var(--panel);color:var(--ink);padding:8px 12px}
a{color:var(--accent2)}
:focus-visible{outline:3px solid var(--accent2);outline-offset:2px}
p{max-width:68ch;margin:0 0 .9em}
.muted{color:var(--muted)}
.lede{font-size:1.15em}
.notice{border-left:4px solid var(--accent);padding:.2em .8em;color:var(--muted)}

.era-banner{font-size:.85rem;text-align:center;padding:6px 12px;background:var(--accent);color:var(--onaccent);min-height:1.6em}
.stripes{display:none;height:24px;background:linear-gradient(#3b2314 0 25%,#b04e0c 25% 50%,#e8a325 50% 75%,#6f7f2a 75%)}
html[data-era="e70"] .stripes{display:block}
.construction{display:none;height:12px;margin:8px 0 0;background:repeating-linear-gradient(45deg,#000 0 12px,#ffd400 12px 24px)}
html[data-era="e90"] .construction{display:block}
.marquee{display:none;overflow:hidden;white-space:nowrap;border-top:2px solid var(--accent);border-bottom:2px solid var(--accent);color:var(--accent);font-family:var(--hfont);font-weight:700}
.marquee span{display:inline-block;padding-left:100%;animation:marq 22s linear infinite}
html[data-era="e90"] .marquee{display:block}
@keyframes marq{to{transform:translateX(-100%)}}

/* ---------- Masthead ---------- */
.masthead{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;padding:26px 0 12px}
.logo{display:block;width:112px;color:var(--accent2);background:none;border:0;padding:0;cursor:pointer}
.logo svg{display:block;width:100%;height:auto}
#eyeLid{transform-box:fill-box;transform-origin:center;transition:transform .12s}
.logo.wink #eyeLid{transform:scaleY(.08)}
.ddate{margin:0;color:var(--muted);font-size:.9rem}
.site-name{font-family:var(--hfont);font-weight:400;font-size:clamp(2.1rem,6.5vw,4.2rem);line-height:1.05;margin:.12em 0 .14em;color:var(--ink);transition:transform .6s}
.tagline{margin:0;color:var(--muted);font-style:italic}
.beta{display:none}
html[data-era="e50"] .site-name{color:var(--accent);transform:rotate(-2deg);transform-origin:left center}
html[data-era="e70"] .site-name{text-shadow:3px 3px 0 var(--accent),6px 6px 0 var(--accent2)}
html[data-era="e80"] .site-name{color:var(--accent2);text-shadow:0 0 10px color-mix(in srgb,var(--accent2) 60%,transparent);letter-spacing:.03em}
html[data-era="e80"] .site-name::after{content:"_";animation:blink 1s steps(1) infinite}
html[data-era="e90"] .site-name{font-weight:700;background:linear-gradient(90deg,#e00,#f80,#dc0,#0b0,#08f,#80f);-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-era="e00"] .site-name{font-weight:700;letter-spacing:-.02em;color:var(--accent2);margin-bottom:.4em;-webkit-box-reflect:below -.32em linear-gradient(transparent 58%,rgba(255,255,255,.28))}
html[data-era="e00"] .beta{display:inline-block;background:radial-gradient(circle,#ffe66b,#ff9f1c);color:#5a2500;font:bold .72rem Verdana,sans-serif;padding:.9em .7em;border-radius:50%;transform:rotate(12deg);margin-left:.4em;vertical-align:middle}
@keyframes blink{50%{opacity:0}}
.site-name.flip{transform:rotate(180deg)!important}

/* ---------- Nav ---------- */
.nav{display:flex;flex-wrap:wrap;gap:10px;padding:10px 0 20px}
.nav a{color:var(--ink);text-decoration:none;padding:.3em .95em;border:var(--bw) var(--bstyle) var(--ink);border-radius:var(--radius);font-family:var(--hfont);background:var(--panel)}
.nav a[aria-current="page"]{background:var(--accent);color:var(--onaccent);border-color:var(--accent)}
html[data-era="e50"] .nav a{border-radius:999px}
html[data-era="e80"] .nav a{border:0;background:none;padding:.1em .25em;color:var(--accent2)}
html[data-era="e80"] .nav a::before{content:"["}
html[data-era="e80"] .nav a::after{content:"]"}
html[data-era="e80"] .nav a[aria-current="page"]{background:var(--accent2);color:var(--bg)}
html[data-era="e90"] .nav a{border:0;background:none;color:var(--accent2);text-decoration:underline;font-family:var(--bfont);padding:.1em .2em}
html[data-era="e90"] .nav a::before{content:"» "}
html[data-era="e90"] .nav a[aria-current="page"]{background:none;color:var(--accent)}
html[data-era="e00"] .nav a{font-weight:700;border-radius:9px 9px 0 0;border-color:color-mix(in srgb,var(--accent2) 40%,var(--panel));background:linear-gradient(var(--panel),color-mix(in srgb,var(--accent2) 16%,var(--panel)))}
html[data-era="e00"] .nav a[aria-current="page"]{background:linear-gradient(#ffb36b,var(--accent));color:#fff;border-color:var(--accent)}

/* ---------- Panels & content ---------- */
.panel{background:var(--panel);border:var(--bw) var(--bstyle) var(--ink);border-radius:var(--radius);padding:clamp(18px,3vw,30px);margin:0 0 22px}
.panel[hidden]{display:none}
html[data-era="e50"] .panel{box-shadow:6px 6px 0 var(--accent2)}
html[data-era="e90"] .panel{border-color:#999}
html[data-era="e00"] .panel{border-color:color-mix(in srgb,var(--accent2) 30%,var(--panel));background:linear-gradient(180deg,var(--panel),color-mix(in srgb,var(--accent2) 6%,var(--panel)));box-shadow:0 6px 18px rgba(0,50,100,.12)}
h2{font-family:var(--hfont);font-weight:400;font-size:clamp(1.6rem,4vw,2.4rem);line-height:1.15;margin:0 0 .45em}
h3{font-family:var(--hfont);font-weight:400;font-size:1.35rem;line-height:1.25;margin:.2em 0 .35em}
html[data-era="e00"] h2,html[data-era="e00"] h3,html[data-era="e90"] h2,html[data-era="e90"] h3{font-weight:700}
html[data-era="e90"] h2{color:var(--accent)}
.bulletins{margin:0;padding-left:1.2em}
.bulletins li{margin:.35em 0;max-width:66ch}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.dept{display:block;padding:16px;border:var(--bw) var(--bstyle) var(--ink);border-radius:var(--radius);text-decoration:none;color:var(--ink);background:var(--bg)}
.dept strong{display:block;font-family:var(--hfont);font-weight:400;font-size:1.3rem;color:var(--accent);margin-bottom:.2em}
html[data-era="e00"] .dept strong,html[data-era="e90"] .dept strong{font-weight:700}
.dept:hover{background:var(--panel)}

/* ---------- Controls ---------- */
.btn{display:inline-block;text-decoration:none;font:inherit;font-family:var(--hfont);font-size:1.05rem;line-height:1.3;background:var(--accent);color:var(--onaccent);border:var(--bw) solid var(--accent);border-radius:var(--radius);padding:.45em 1.1em;cursor:pointer}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn:disabled{opacity:.55;cursor:not-allowed}
html[data-era="e50"] .btn{border-radius:999px}
html[data-era="e80"] .btn{background:transparent;color:var(--accent2);border:1px solid var(--accent2)}
html[data-era="e80"] .btn::before{content:"> "}
html[data-era="e90"] .btn{border:3px outset #ddd;background:#c0c0c0;color:#000;font-family:var(--bfont);border-radius:0}
html[data-era="e00"] .btn{font-weight:700;color:#fff;border-color:color-mix(in srgb,var(--accent) 70%,#000);background:linear-gradient(180deg,#ffb36b 0,var(--accent) 52%,color-mix(in srgb,var(--accent) 82%,#000) 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.55)}
html[data-era="e00"] .btn.ghost{background:linear-gradient(var(--panel),color-mix(in srgb,var(--accent2) 14%,var(--panel)));color:var(--ink);border-color:color-mix(in srgb,var(--accent2) 40%,var(--panel))}
label{display:block;font-weight:700;margin:.9em 0 .25em}
input,textarea,select{font:inherit;width:100%;max-width:560px;padding:.5em .6em;background:var(--bg);color:var(--ink);border:2px solid var(--ink);border-radius:min(var(--radius),10px)}
textarea{min-height:110px;resize:vertical}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:12px}
.row input{flex:1 1 220px;width:auto}
.row.flush{margin-top:0}
.gap-top{margin-top:1.4em}
.gap-top-sm{margin-top:.8em}
.small{font-size:.9em}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}

/* ---------- Fnords ---------- */
.fnord{color:transparent;font-size:.72em;user-select:none;-webkit-user-select:none}
html.fnord-vision .fnord{color:var(--onaccent);background:var(--accent);border-radius:3px;padding:0 .25em;margin:0 .1em}
.fnord-found{background:var(--accent);color:var(--onaccent);border-radius:3px;padding:0 .25em}
.fout{white-space:pre-wrap;margin-top:1em}

/* ---------- Archive ---------- */
.case{border-top:var(--bw) var(--bstyle) var(--ink);padding-top:16px;margin-top:20px}
.case:first-of-type{border-top:0;margin-top:0;padding-top:0}
.case .no{margin:0;color:var(--muted);font-size:.9rem}
.src{font-size:.9rem;color:var(--muted)}
.redact{font:inherit;color:transparent;background:var(--ink);border:0;padding:0 .2em;border-radius:2px;cursor:pointer}
.redact.open{color:inherit;background:transparent;text-decoration:underline dotted;cursor:default}

/* ---------- Oracle, cards, lists ---------- */
.oracle-out{font-family:var(--hfont);font-size:1.3rem;color:var(--accent);min-height:1.5em;margin:.7em 0 0}
.card-img{display:block;width:100%;max-width:600px;height:auto}
.plain{list-style:none;padding:0;margin:0}
.plain li{padding:.55em 0;border-top:1px dashed var(--muted)}
.plain li:first-child{border-top:0}
.entry{border-top:var(--bw) var(--bstyle) var(--ink);padding:14px 0}
.entry:first-child{border-top:0;padding-top:0}
.entry .meta{color:var(--muted);font-size:.9rem}
.entry .msg{white-space:pre-wrap;margin:.35em 0}
.linkbtn{background:none;border:0;padding:0;color:var(--accent2);text-decoration:underline;cursor:pointer;font:inherit;font-size:.9rem}
.apple-btn{background:none;border:0;padding:0;cursor:pointer;width:96px}
.apple-btn svg{display:block;width:100%;height:auto}

/* ---------- Eris, apples, Chao ---------- */
.aside{font-style:italic;color:var(--muted);border-left:3px dashed var(--accent2);padding:.2em .8em;margin:1em 0 0;font-size:.95em}
.chao-float{float:right;width:56px;height:56px;margin:0 0 10px 14px;background:none;border:0;padding:0;cursor:pointer;color:var(--accent2);animation:chaoSpin 23s linear infinite}
.chao-float.ccw{animation-direction:reverse}
.chao-float svg,.chao-big svg{display:block;width:100%;height:100%}
.chao-big{width:min(260px,70vw);aspect-ratio:1;color:var(--accent2);margin:6px 0 16px;transition:transform 2.3s cubic-bezier(.2,.8,.2,1)}
@keyframes chaoSpin{to{transform:rotate(360deg)}}
.stray-apple{display:inline-block;width:1.3em;height:1.3em;vertical-align:-.25em;margin-left:.35em;background:none;border:0;padding:0;cursor:pointer;animation:rollIn 1.4s ease-out 1}
.stray-apple svg{display:block;width:100%;height:100%}
@keyframes rollIn{from{transform:translateX(-140px) rotate(-720deg);opacity:0}to{transform:none;opacity:1}}

/* ---------- Careers ---------- */
.job{border-top:var(--bw) var(--bstyle) var(--ink);padding:16px 0}
.job:first-child{border-top:0;padding-top:0}
.job[hidden]{display:none}
.job summary{cursor:pointer;list-style:none;display:grid;gap:.2em}
.job summary::-webkit-details-marker{display:none}
.job-title{font-family:var(--hfont);font-size:1.4rem;line-height:1.25;color:var(--ink)}
.job-title::after{content:"  +";color:var(--accent)}
.job details[open] .job-title::after{content:"  −"}
html[data-era="e00"] .job-title,html[data-era="e90"] .job-title{font-weight:700}
.job-meta{color:var(--muted);font-size:.92rem}
.pay{color:var(--accent);font-weight:700}
.job-body{padding-top:.7em}
.job h4{font-family:var(--hfont);font-weight:400;font-size:1.12rem;margin:1em 0 .2em}
html[data-era="e00"] .job h4,html[data-era="e90"] .job h4{font-weight:700}
.btn[aria-pressed="true"]{text-decoration:underline;text-underline-offset:.2em}
html[data-era="e90"] .btn[aria-pressed="true"]{border-style:inset;background:#9a9a9a}
html[data-era="e80"] .btn[aria-pressed="true"]{background:var(--accent2);color:var(--bg)}

/* ---------- Footer ---------- */
.foot{padding:24px 20px 44px;color:var(--muted);font-size:.92rem;border-top:var(--bw) var(--bstyle) var(--ink);margin-top:30px}
.foot p{margin:.35em 0}
.foot button{font:inherit;color:var(--accent2);background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}
.counter{font-family:'VT323',monospace;background:#000;color:#3f3;padding:0 .4em;letter-spacing:.12em}
.hole{font-size:.72rem;opacity:.4;color:var(--muted)}
.hole:hover,.hole:focus{opacity:1}

/* ---------- Effects ---------- */
#toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translate(-50%,160%);background:var(--panel);color:var(--ink);border:var(--bw) var(--bstyle) var(--ink);border-radius:var(--radius);padding:.7em 1.1em;width:max-content;max-width:min(92vw,520px);z-index:40;transition:transform .3s;box-shadow:0 8px 24px rgba(0,0,0,.25)}
#toast.show{transform:translate(-50%,0)}
#glitch{position:fixed;inset:0;pointer-events:none;z-index:60;opacity:0;mix-blend-mode:difference;background:repeating-linear-gradient(0deg,rgba(255,0,128,.35) 0 6px,rgba(0,255,200,.3) 6px 12px,transparent 12px 34px)}
#glitch.on{animation:glitch .7s steps(6) 1}
@keyframes glitch{0%{opacity:1;transform:translateY(0)}50%{opacity:.9;transform:translateY(-24px) skewX(9deg)}100%{opacity:0;transform:translateY(10px)}}
.apple{position:fixed;top:-40px;width:28px;height:28px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff6b0,#e8b10e 45%,#a86f00);z-index:55;pointer-events:none;animation:fall linear forwards}
.apple::after{content:"";position:absolute;width:11px;height:6px;background:#5d8a1f;border-radius:0 8px;top:-4px;left:14px}
@keyframes fall{to{transform:translateY(115vh) rotate(540deg)}}
html.omf main{transform:rotate(-.7deg)}
html.omf .site-name{transform:scaleX(-1)}
html.omf .nav{flex-direction:row-reverse;justify-content:flex-end}
html.greyface body{filter:grayscale(1)}

@media (max-width:560px){
  .masthead{grid-template-columns:72px 1fr;gap:14px}
  .logo{width:72px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .marquee span{padding-left:0}
}