:root{--bg-void:#07010d;--bg-deep:#14001f;--bg-panel:#2a0a38;--magenta:#ff2d95;--magenta-hot:#ff79c6;--cyan:#00f0ff;--lime:#b8ff3d;--gold:#ffe566;--violet:#7b2cbf;--wood:#3a1a14;--wood-hi:#6a3428;--bezel:#1c1218;--win-face:#c3c7cb;--win-dark:#404040;--win-light:#fff;--win-shadow:gray;--ink:#1a0a14;--font-pixel:"Press Start 2P", system-ui, sans-serif;--font-mono:"Share Tech Mono", "VT323", ui-monospace, monospace;--font-display:"Monoton", "Comic Neue", system-ui, sans-serif;--font-comic:"Comic Neue", "Comic Sans MS", cursive;--font-vt:"VT323", "Share Tech Mono", monospace}*{box-sizing:border-box}html,body,#root{min-height:100%}html{background:teal}body{color:navy;background:teal;margin:0;font-family:Tahoma,MS Sans Serif,sans-serif;font-size:12px;line-height:1.2;overflow-x:hidden}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible,.panel:focus-visible,.card:focus-visible{outline-offset:3px;outline:3px dotted #ff0}.lounge{flex-direction:column;gap:8px;min-height:100vh;padding:12px 12px 0;display:flex}.win-window{background:silver;border:2px solid #404040;border-color:#fff #404040 #404040 #fff;width:100%;max-width:1120px;margin:0 auto;padding:2px;position:relative;box-shadow:2px 2px #000}.titlebar-dummy{gap:2px;display:flex}.titlebar-dummy b{color:#000;background:silver;border:2px solid #404040;border-color:#fff #404040 #404040 #fff;place-items:center;width:16px;height:14px;font-family:Tahoma,sans-serif;font-size:10px;font-weight:700;display:grid}.win-status{color:#000;background:silver;border:2px inset #fff;justify-content:space-between;gap:8px;margin:2px;padding:2px 6px;font-family:Tahoma,sans-serif;font-size:11px;display:flex}.screen{background-color:#102;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72'%3E%3Crect width='72' height='72' fill='%23110022'/%3E%3Ccircle cx='8' cy='12' r='1.2' fill='%23ffffff'/%3E%3Ccircle cx='26' cy='6' r='0.8' fill='%23ff99ff'/%3E%3Ccircle cx='44' cy='18' r='1.4' fill='%23ffff66'/%3E%3Ccircle cx='62' cy='8' r='0.7' fill='%23ffffff'/%3E%3Ccircle cx='14' cy='40' r='1' fill='%23cc66ff'/%3E%3Ccircle cx='34' cy='52' r='0.9' fill='%23ffffff'/%3E%3Ccircle cx='54' cy='42' r='1.1' fill='%23ffccff'/%3E%3Ccircle cx='66' cy='60' r='0.6' fill='%23ffffaa'/%3E%3Ccircle cx='20' cy='64' r='1.3' fill='%23ff66cc'/%3E%3Ccircle cx='48' cy='30' r='0.7' fill='%23ffffff'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Ccircle cx='4' cy='9' r='0.7' fill='%23ffffff'/%3E%3Ccircle cx='18' cy='3' r='0.5' fill='%23ffff00'/%3E%3Ccircle cx='22' cy='20' r='0.8' fill='%23ff66ff'/%3E%3C/svg%3E");background-size:72px 72px,28px 28px;border:3px solid #000;min-height:0;animation:18s linear infinite star-drift;position:relative;overflow:hidden}.screen:before{content:"";pointer-events:none;z-index:0;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Crect width='40' height='40' fill='%23000000'/%3E%3Cpolygon points='20,4 34,34 6,34' fill='%23ff8800'/%3E%3Crect x='6' y='30' width='28' height='6' fill='%23222222'/%3E%3Crect x='16' y='16' width='8' height='3' fill='%23ffffff'/%3E%3C/svg%3E");background-size:40px 40px;animation:28s linear infinite cone-scroll;position:absolute;inset:0}.screen:after{content:"";pointer-events:none;z-index:0;mix-blend-mode:screen;opacity:.45;background-image:radial-gradient(circle,#fff 1px,#0000 1px),radial-gradient(circle,#f0f 1.5px,#0000 2px);background-size:17px 17px,43px 43px;animation:.9s step-end infinite twinkle;position:absolute;inset:0}@keyframes star-drift{0%{background-position:0 0,0 0}to{background-position:72px 72px,-28px 56px}}@keyframes cone-scroll{0%{background-position:0 0}to{background-position:40px 40px}}@keyframes twinkle{0%,49%{opacity:.55}50%,to{opacity:.15}}.scanlines,.vignette{display:none}@keyframes flicker{0%,97%,to{opacity:.85}98%{opacity:.4}}.hypno-page{z-index:1;border:14px solid #0000;border-image:repeating-linear-gradient(-45deg,#f80 0 8px,#111 8px 16px) 14;padding:16px 14px 28px;position:relative}.rainbow-hr{background:linear-gradient(90deg,red,#f90,#ff0,#0f0,#0ff,#00f,#f0f);border:2px inset #fff;height:6px;margin:8px 0}.top-bar{color:#ff0;justify-content:space-between;align-items:center;gap:8px;font-family:Tahoma,sans-serif;font-size:11px;display:flex}.blink{animation:1s step-end infinite blink}@keyframes blink{50%{opacity:0}}.marquee-wrap{color:#0f0;background:#000;border:2px inset #fff;margin:8px 0 10px;padding:4px 0;font-family:Courier New,monospace;font-size:13px;overflow:hidden}.marquee-track{width:max-content;animation:22s linear infinite marquee;display:flex}.marquee-track span{white-space:nowrap;padding-right:48px}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.hero{grid-template-columns:1fr;align-items:start;gap:12px;margin-bottom:12px;display:grid}.hero h1{letter-spacing:2px;color:#ff0;text-shadow:3px 3px #000,5px 5px #f0f;text-align:left;margin:0;font-family:Comic Neue,Comic Sans MS,cursive;font-size:40px;font-weight:700;line-height:1.05}.hero h1 .title-line{display:block}.hero p{font-family:var(--font-comic);color:#0f0;text-shadow:2px 2px #000;margin:6px 0 0;font-size:18px}.webmaster-toys{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin:0 0 12px;display:flex}.spin-earth{font-size:36px;line-height:1;animation:2.8s linear infinite spin-earth;display:inline-block}.spin-earth.reverse{font-size:32px;animation-direction:reverse}@keyframes spin-earth{to{transform:rotate(360deg)}}.hit-sparkle{font-family:var(--font-pixel);color:#ff0;text-shadow:1px 1px #000;background:#f0f;border:3px outset #fff;padding:5px 7px;font-size:8px;line-height:1.3}.midi-widget{color:#000;background:silver;border:2px outset #fff;width:168px;padding:6px}.midi-widget strong{color:#000;margin-bottom:6px;font-family:Tahoma,sans-serif;font-size:11px;display:block}.eq{align-items:flex-end;gap:3px;height:28px;display:flex}.eq i{transform-origin:bottom;background:navy;width:8px;animation:.7s ease-in-out infinite bounce;display:block}.eq i:nth-child(odd){animation-duration:.55s}.eq i:nth-child(3n){animation-delay:.12s}@keyframes bounce{0%,to{height:30%}50%{height:100%}}.midi-name{color:navy;margin-top:6px;font-family:Tahoma,sans-serif;font-size:11px}.grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.panel{appearance:none;text-align:left;min-height:120px;color:inherit;background:navy;border:6px ridge #f0f;grid-template-columns:78px 1fr;align-items:center;gap:10px;padding:10px 12px;display:grid;box-shadow:5px 5px #ff0}.panel:hover,.panel[data-hot=true]{background:#00c;box-shadow:5px 5px #0f0}.panel:active{border-style:inset}.glyph{color:#000;background:var(--panel-accent,var(--magenta));width:70px;height:70px;font-size:36px;font-family:var(--font-pixel);border:3px outset #fff;place-items:center;display:grid}.panel-copy .kicker{font-family:var(--font-pixel);color:var(--gold);letter-spacing:.12em;font-size:8px}.panel-copy h2{font-family:var(--font-pixel);color:#ffe566;text-shadow:2px 2px #000;margin:0 0 6px;font-size:11px;line-height:1.45}.panel-copy p{font-family:var(--font-comic);color:#ff9;margin:0;font-size:16px}.select-hint{text-align:center;font-family:var(--font-pixel);color:#ff0;margin:10px 0 0;font-size:8px}.construction{font-family:var(--font-comic);color:#ff0;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin-top:8px;display:flex}.cone{background:repeating-linear-gradient(-45deg,#ff8a00,#ff8a00 4px,#111 4px 8px);width:18px;height:18px;animation:1.4s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.counter{font-family:var(--font-pixel);color:#f44;letter-spacing:.2em;background:#000;border:2px inset #444;padding:4px 8px;font-size:10px}.badges{flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px;display:flex}.badge{font-family:var(--font-pixel);text-transform:uppercase;border:2px solid;padding:6px 8px;font-size:7px}.badge.ns{color:#fff;background:#1a1a8a;border-color:#fff}.badge.ie{color:#000;background:#fe8;border-color:#000}.badge.hits{color:#ff0;background:#f0a;border-color:#ff0}.screen-foot{text-align:center;background:#000;border:4px dashed #ff0;margin-top:14px;padding:10px}.screen-foot .oops{font-family:var(--font-pixel);color:#ff0;margin:0;font-size:10px;line-height:1.6}.screen-foot .sub{font-family:var(--font-comic);color:#0f0;margin:8px 0 0;font-size:15px}.bar{background:silver;border:2px solid #404040;border-color:#fff #404040 #404040 #fff;width:100%;max-width:1120px;margin:0 auto 12px;padding:2px;position:relative;box-shadow:2px 2px #000}.bar-body{grid-template-columns:80px 1fr;align-items:center;gap:10px;padding:8px;display:grid}.juno{background:navy;border:2px inset #fff;grid-template-rows:1fr auto;place-items:center;width:80px;height:80px;display:grid}.juno .face{color:#fff;font-size:32px}.juno .tag{color:#000;text-align:center;background:silver;border-top:1px solid gray;width:100%;padding:2px 0;font-family:Tahoma,sans-serif;font-size:10px}.bubble{color:#000;background:#fff;border:2px inset #fff;min-height:64px;padding:8px 10px}.bubble .who{color:navy;margin-bottom:4px;font-family:Tahoma,sans-serif;font-size:11px;font-weight:700}.bubble p{color:#000;margin:0;font-family:Tahoma,sans-serif;font-size:13px}.modal-back{z-index:20;background:#008080cc;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.win95{background:var(--win-face);width:min(720px,100%);max-height:min(88vh,720px);color:var(--ink);border:3px solid;border-color:var(--win-light) var(--win-dark) var(--win-dark) var(--win-light);overflow:auto;box-shadow:8px 8px #000a}.titlebar{color:#fff;background:navy;justify-content:space-between;align-items:center;gap:8px;padding:3px 4px;font-family:Tahoma,MS Sans Serif,sans-serif;font-size:12px;font-weight:700;display:flex}.titlebar button{background:var(--win-face);border:2px solid;border-color:var(--win-light) var(--win-dark) var(--win-dark) var(--win-light);width:22px;height:22px;font-family:var(--font-pixel);font-size:10px;line-height:1}.win-body{padding:12px}.menubar{background:var(--win-face);border-bottom:1px solid var(--win-shadow);gap:12px;padding:4px 8px;font-family:Tahoma,sans-serif;font-size:13px;display:flex}.menubar button{color:var(--ink);background:0 0;border:0;padding:2px 4px}.menubar button:hover{color:#fff;background:navy}.notepad{resize:none;white-space:nowrap;word-break:keep-all;field-sizing:fixed;color:#000;background:#fff;border:2px inset #fff;width:100%;height:24px;padding:2px 4px;font-family:Courier New,Courier,monospace;font-size:13px;line-height:18px;overflow:scroll hidden}.statusbar{background:var(--win-face);border:2px inset #fff;justify-content:space-between;margin-top:6px;padding:2px 6px;font-family:Tahoma,sans-serif;font-size:11px;display:flex}.hint{color:#333;margin:8px 0 0;font-family:Tahoma,sans-serif;font-size:12px}.toast{background:#ffc;border:2px solid #000;margin-top:8px;padding:8px;font-family:Tahoma,sans-serif;font-size:13px}.cards{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.card{appearance:none;perspective:600px;background:0 0;border:0;height:170px;padding:0}.card-inner{height:100%;transform-style:preserve-3d;transition:transform .45s}.card[data-flipped=true] .card-inner{transform:rotateY(180deg)}.card-face{backface-visibility:hidden;border:4px solid var(--gold);text-align:center;place-items:center;padding:8px;display:grid;position:absolute;inset:0}.card-face.back{color:#ff0;font-family:var(--font-pixel);background:repeating-linear-gradient(45deg,navy,navy 8px,#000 8px 16px);font-size:18px}.card-face.front{color:#ff0;background:navy;transform:rotateY(180deg)}.card-face.front strong{font-family:var(--font-pixel);color:var(--gold);margin-bottom:8px;font-size:10px;line-height:1.4;display:block}.card-face.front span{font-family:var(--font-vt);font-size:18px}.juno.mini{width:72px;height:72px}.juno.mini .face{font-size:22px}.juno-take{background:silver;border:2px inset #fff;grid-template-columns:72px 1fr;align-items:center;gap:12px;margin-top:12px;padding:8px;display:grid}.juno-take[data-mood=good]{border-color:#0f0}.juno-take[data-mood=bad]{border-color:red}.juno-take p{color:#000;margin:0;font-family:Tahoma,sans-serif;font-size:13px}.reading{color:#000;min-height:72px;margin-top:12px;font-family:Tahoma,sans-serif;font-size:13px}.wizard-copy{font-family:Tahoma,Segoe UI,sans-serif;font-size:14px}.progress{background:#fff;border:2px inset #fff;height:22px;margin:12px 0}.progress>span{height:100%;width:var(--pct,8%);background:repeating-linear-gradient(90deg,navy 0 10px,#1084d0 10px 20px);transition:width .25s linear;display:block}.choices{gap:6px;margin:10px 0;display:grid}.choices label{align-items:center;gap:8px;display:flex}.wizard-nav{justify-content:flex-end;gap:8px;margin-top:12px;display:flex}.win-btn{background:var(--win-face);border:2px solid;border-color:var(--win-light) var(--win-dark) var(--win-dark) var(--win-light);min-width:84px;padding:4px 10px;font-family:Tahoma,sans-serif;font-size:13px}.win-btn:disabled{color:gray;cursor:not-allowed}.reels{background:#000;border:6px ridge gold;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px;display:grid}.reel{height:88px;font-family:var(--font-pixel);text-align:center;color:#0f0;background:#000;border:2px inset #fff;place-items:center;font-size:10px;line-height:1.3;display:grid;overflow:hidden}.reel[data-spinning=true]{animation:.12s steps(2,end) infinite reel}@keyframes reel{to{filter:hue-rotate(80deg)}}.pitch-out{min-height:64px;font-family:var(--font-comic);color:navy;margin-top:12px;font-size:20px}.splash{text-align:center;background:teal;place-items:center;min-height:100vh;padding:24px;display:grid}.splash h1{color:#000;background:silver;border:2px solid #404040;border-color:#fff #404040 #404040 #fff;margin:0;padding:16px 20px 8px;font-family:Tahoma,MS Sans Serif,sans-serif;font-size:16px;font-weight:700}.splash .progress{background:silver;border-left:2px solid silver;border-right:2px solid silver;width:min(420px,90vw);margin:0 auto;padding:8px 20px 16px}.splash p{color:#000;background:silver;border:2px solid #404040;border-color:silver #404040 #404040 silver;margin:0;padding:0 20px 16px;font-family:Tahoma,sans-serif}@media (width>=1100px){.hero{grid-template-columns:minmax(0,1fr) 168px}}@media (width<=760px){.lounge{padding:8px 8px 0}.hero,.grid,.bar,.cards,.reels{grid-template-columns:1fr}.midi-widget{width:100%}.panel{min-height:110px}.screen{min-height:0}.juno{width:72px;height:72px}}
