@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/outfit-400.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/outfit-500.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/outfit-600.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/outfit-700.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(assets/fonts/outfit-800.ttf) format('truetype');
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(assets/fonts/outfit-900.ttf) format('truetype');
}

:root{--phosphor:#98e8da;--amber:#ffb050;--frame:#7bd7cf;--camera-scale:.6}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#0a100e;color:var(--phosphor);font-family:'Courier New',monospace}button{font:inherit;cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.35;cursor:default}button:focus-visible{outline:3px solid #fff4a0;outline-offset:5px}.hidden{display:none!important}.viewport{position:fixed;inset:0;overflow:hidden;touch-action:pan-y}.ambient{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,#42504266 0,#151c18 40%,#050a08 90%)}.machine{position:absolute;width:1448px;height:1086px;left:50%;top:50%;transform-origin:0 0;transform:translate(-50%,-50%);transition:transform 850ms cubic-bezier(.22,.75,.22,1);will-change:transform;filter:drop-shadow(0 25px 65px #000)}.cabinet{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;user-select:none}.screen-bezel{position:absolute;left:303px;top:100px;width:925px;height:790px;padding:8px;border-radius:45px;background:#091312;box-shadow:0 0 0 6px #141812,0 0 0 9px #2a2a20,inset 0 0 0 4px #090f0c,0 0 30px #000;transition:box-shadow .8s}.screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:34px;background:#071b1c;box-shadow:inset 0 0 90px #000,inset 0 0 0 3px #183334}.glass{pointer-events:none;position:absolute;inset:0;z-index:8;border-radius:34px;background:repeating-linear-gradient(0deg,#00131112 0px,#00131112 2px,transparent 2px,transparent 5px);box-shadow:inset 0 0 80px #0008}.glass:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 25% 0,#ffffff0b,transparent 55%);border-radius:34px}.view{display:none;position:absolute;inset:0;padding:40px}.view.active{display:block}.title-view{text-align:center;padding-top:28px}.machine-id{font-size:16px;letter-spacing:4px;color:#78a9a3}.title-view h1{font:900 128px/1 'Arial Black',Impact,sans-serif;margin:39px 0 7px;letter-spacing:-5px;color:#fff0c4;text-shadow:0 3px #cea876,0 7px #29788c,0 15px #124451,0 19px #031c23;transform:skew(-5deg)}.title-view h1 span{color:#f57732;text-shadow:0 3px #ffb653,0 7px #a54623,0 15px #5c241b}.logo-stripes{height:9px;background:#eb7638;width:430px;margin:18px auto;box-shadow:0 13px #d95527;transform:skew(-10deg)}.tagline{font-size:22px;letter-spacing:2px;margin:30px 0 23px;color:#95ede0;text-shadow:0 0 12px #49c5b470}.main-menu{width:620px;margin:auto;display:grid;gap:13px}.main-menu button{height:101px;display:flex;align-items:center;gap:22px;background:linear-gradient(#0d363b,#071c23);border:2px solid #51b8c4;border-radius:10px;padding:12px 25px;text-align:left;box-shadow:inset 0 0 20px #36a4ac12,0 0 15px #318e9926}.main-menu button:hover,.main-menu button:first-child{border-color:#ffb456;background:linear-gradient(#40260e,#221b0d);color:#ffd899;box-shadow:inset 0 0 20px #ffc25520,0 0 18px #f5a23935}.main-menu b{font-size:43px;width:52px;text-align:center}.main-menu span{font-size:31px;font-weight:bold;letter-spacing:2px}.main-menu small{display:block;font-size:13px;font-weight:normal;letter-spacing:2px;margin-top:8px;opacity:.7}.main-menu i{font-size:29px;font-style:normal;margin-left:auto}.title-links{display:flex;justify-content:center;gap:45px;margin-top:27px}.title-links button,.terminal-back,.map-controls button{border:0;background:none;color:#a6dfd5;font-size:20px;padding:12px}.title-links button:hover{color:#ffd18b}.terminal-footer{display:flex;justify-content:space-between;font-size:14px;letter-spacing:2px;border-top:1px solid #317e7d;position:absolute;bottom:21px;left:42px;right:42px;padding-top:12px}.status-light{display:inline-block;width:10px;height:10px;background:#97ebaa;box-shadow:0 0 12px #72e3a5;margin-right:9px}.view-heading{height:75px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid #367171;padding-bottom:12px}.view-heading small{display:block;font-size:16px;letter-spacing:3px;color:#82a6a5}.view-heading h2{font-size:29px;letter-spacing:1px;margin:7px 0 0}.view-heading>span{font-size:21px;color:#e7b878}.terminal-back{font-size:20px;padding-left:0}.map-window{height:515px;position:relative;overflow:hidden;margin-top:20px;touch-action:none;border:1px solid #245957;border-radius:12px;background:radial-gradient(#153c3844 2px,transparent 2px);background-size:24px 24px;cursor:grab}.map-window:active{cursor:grabbing}.machine-wall{position:absolute;left:50%;top:50%;width:1px;height:1px;will-change:transform;transition:transform .4s}.map-node{position:absolute;width:215px;height:168px;background:linear-gradient(130deg,#bbb09b,#736c5d);border:4px solid #221e19;border-radius:13px;padding:12px 11px;box-shadow:0 6px #111b17,0 0 0 2px #6c695a;color:#bad2c3;display:block;user-select:none}.map-node:before,.map-node:after{content:'⊕';position:absolute;color:#332e27;font-size:14px;top:0;left:3px}.map-node:after{left:auto;right:3px}.mini-crt{display:block;height:111px;padding-top:23px;border:7px solid #17201a;border-radius:14px;background:#061b18;box-shadow:inset 0 0 20px #000;font-size:27px;font-weight:bold;text-shadow:0 0 8px #87ceaf66;position:relative}.mini-crt small{display:block;font-size:13px;margin-top:10px}.map-node .node-label{display:flex;justify-content:space-between;color:#272c22;font-size:13px;font-weight:bold;margin-top:7px}.map-node.active .mini-crt{color:#a9f0d1;background:radial-gradient(#123d31,#071b17);box-shadow:inset 0 0 16px #000,0 0 12px #65c39655}.map-node.adjacent .mini-crt{color:#eec58a;border-color:#3a301b;box-shadow:0 0 15px #dfa95455}.map-node.locked{filter:brightness(.45)}.map-node.complete .mini-crt{color:#ffd58a}.map-node.root:after{content:'◉';color:#ecac53}.map-wire{position:absolute;background:#3b6350;opacity:.6}.map-controls{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.map-controls span{font-size:13px;color:#8aaba4;letter-spacing:1px}.map-help{font-size:18px;line-height:1.6;margin:7px 0}.cluster-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}.puzzle-cell{height:134px;background:linear-gradient(#163d3d,#0a2328);border:2px solid #3c9391;border-radius:10px;padding:16px;display:flex;align-items:center;gap:17px;text-align:left}.puzzle-cell:hover{border-color:#ffe09e}.puzzle-cell .cell-number{font-size:49px;color:#f4d5a0;font-weight:bold}.puzzle-cell .cell-info{font-size:21px;line-height:1.5}.cell-info small{display:block;font-size:13px;letter-spacing:2px;color:#87b0a5}.puzzle-cell.cleared{background:linear-gradient(#20432d,#0b251e);border-color:#80b391}.puzzle-cell.boss{grid-column:1/-1;height:111px;border-color:#f1a24d;background:linear-gradient(#492711,#201a10);color:#ffd197}.puzzle-cell.boss .cell-number{font-size:42px}.puzzle-cell.boss:disabled{opacity:.5}.cluster-help{font-size:16px;letter-spacing:3px;text-align:center;margin-top:24px}.play-view{padding:0}.play-hud{width:650px;height:88px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:17px}.play-hud small{font-size:17px;color:#7ba49f;display:block;letter-spacing:1px;margin-bottom:5px}.play-hud strong{font-size:36px;color:#dff4d3;font-weight:bold;line-height:1}.play-hud .middle-stat{text-align:center;min-width:115px}.middle-stat strong{font-size:23px}.score-stat{text-align:right;min-width:105px}.pause-button{font-size:28px;width:73px;height:72px;border:1px solid #36655c;background:#102e2a;border-radius:10px;flex-shrink:0}.canvas-frame{width:650px;height:650px;position:relative;margin:auto;overflow:hidden;border-radius:19px;box-shadow:0 0 0 4px var(--frame),0 0 25px color-mix(in srgb,var(--frame),transparent 65%);transition:box-shadow 1s;background:#091c1d}canvas{width:100%;height:100%;display:block;touch-action:none;user-select:none}.play-bottom{width:650px;margin:14px auto 0;display:flex;justify-content:space-between;font-size:16px;letter-spacing:1px;min-height:18px;color:#82b5a8}.play-tip{position:absolute;bottom:42px;left:130px;right:130px;text-align:center;background:#102d28ee;border:1px solid #5b8d78;border-radius:6px;padding:12px;font-size:19px;line-height:1.4;pointer-events:none}.play-tip:empty{display:none}.combo{position:absolute;top:16px;right:19px;z-index:3;color:#ffdf91;background:#17372cee;border:1px solid #d5ba67;padding:6px 14px;border-radius:8px;font-weight:bold;font-size:30px;opacity:0;transition:opacity .2s}.combo.hot{opacity:1}.float-text{position:absolute;top:40%;left:0;width:100%;text-align:center;pointer-events:none;font:bold 43px Impact,sans-serif;color:#fff4bb;text-shadow:3px 3px #152832;opacity:0;transform:translateY(15px)}.float-text.show{animation:scorepop .9s ease-out forwards}@keyframes scorepop{0%{opacity:0;transform:translateY(15px) scale(.8)}20%{opacity:1;transform:translateY(0) scale(1.1)}75%{opacity:1}100%{opacity:0;transform:translateY(-35px)}}.crt-overlay{position:absolute;inset:28px;z-index:9;background:radial-gradient(ellipse at 50% 20%,#16332f,#051b1c);border:2px solid #518d80;border-radius:20px;padding:42px 36px;overflow:auto;box-shadow:0 0 35px #000;scrollbar-width:thin;scrollbar-color:#4b8b77 #0c2923}.close-modal{position:absolute;top:8px;right:15px;background:none;border:0;font-size:42px;padding:5px;z-index:1}.crt-overlay h2{font-size:51px;margin:9px 0 22px;color:#ffe1a3;letter-spacing:1px}.eyebrow{font-size:18px;letter-spacing:3px;color:#76ac9d}.crt-overlay p,.crt-overlay li{font-size:24px;line-height:1.6;color:#b6d0bd}.crt-overlay ul{padding-left:28px}.crt-overlay h3{font-size:28px}.primary,.secondary{font-size:25px;font-weight:bold;border:2px solid #ecb868;border-radius:8px;background:linear-gradient(#543615,#26200e);color:#ffdf9f;padding:18px 23px;margin:16px 13px 3px 0}.secondary{border-color:#548a7f;background:#112e2b;color:#aad5c7}.primary:hover{background:#754c21}.result-score{font-size:84px;color:#ffe4a1;font-weight:bold;text-shadow:0 0 18px #ffa73345;line-height:1.2}.result-score small{display:block;font-size:18px;letter-spacing:3px;color:#8ab7a7;margin-bottom:10px}.result-rounds{display:flex;gap:35px;align-items:center;margin:20px 0;border-top:1px solid #427063;border-bottom:1px solid #427063;padding:16px 0}.result-rounds small{display:block;font-size:17px;color:#8bac9c;letter-spacing:1px}.result-rounds b{display:block;font-size:38px;color:#cfdfba}.score-breakdown{font-size:23px;margin:22px 0}.score-breakdown>div{display:flex;justify-content:space-between;margin-top:10px;gap:20px}.score-breakdown .total-line{border-top:1px solid #437360;padding-top:14px;color:#ffe2a4}.score-formula{font-size:18px!important;color:#8eaa97!important}.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:20px 0}.offer{padding:18px 15px;border:2px solid #819774;border-radius:9px;background:linear-gradient(#243d2e,#0d241f)}.offer .card-icon{font-size:46px}.offer h3{font-size:24px;margin:12px 0}.offer p{font-size:17px;line-height:1.5;min-height:78px}.offer small{font-size:15px;display:block;line-height:1.5;color:#aabb94}.offer button{margin-top:17px;padding:12px;border:1px solid #e6b265;border-radius:6px;background:#493518;width:100%;font-size:20px;color:#ffe0a1}.offer.bought{opacity:.5}.slot-row{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.slot{border:1px solid #598879;padding:16px 8px;text-align:center;border-radius:7px;min-height:94px;font-size:21px}.slot b{font-size:30px;display:block;margin-bottom:8px;color:#e9c884}.deck-card{display:flex;justify-content:space-between;font-size:20px;border-bottom:1px solid #365a50;padding:13px 0}.settings-row{display:flex;align-items:center;justify-content:space-between;margin:20px 0;font-size:27px}.settings-row button{font-size:25px;padding:14px 24px;border:1px solid #7ab6a4;background:#12352c;border-radius:7px}.frame-corner{position:absolute;width:18px;height:18px;border-color:var(--frame);border-style:solid;transition:border-color 1s;pointer-events:none}.tl{top:91px;left:295px;border-width:3px 0 0 3px}.tr{top:91px;left:1223px;border-width:3px 3px 0 0}.bl{top:883px;left:295px;border-width:0 0 3px 3px}.br{top:883px;left:1223px;border-width:0 3px 3px 0}.level-pulse .screen-bezel{box-shadow:0 0 0 6px #141812,0 0 0 9px var(--frame),0 0 50px var(--frame)}.camera-controls{position:absolute;right:max(14px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));display:flex;gap:6px;z-index:20;transition:opacity .3s}.camera-controls button{width:42px;height:42px;background:#12251edf;border:1px solid #537360;border-radius:6px;font-size:25px;color:#c6d4b6}.boot-caption{position:absolute;left:20px;bottom:22px;font-size:11px;letter-spacing:3px;color:#849680;pointer-events:none}.boot-caption span{display:block;font-size:8px;color:#51634e;margin-top:7px}.playing .camera-controls,.playing .boot-caption{display:none}.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}@media(max-width:600px){.boot-caption{display:none}.machine{transition-duration:650ms}.camera-controls button{width:40px;height:40px}.camera-controls{bottom:12px;right:12px}.title-view h1{font-size:123px;margin-top:34px}.main-menu button{height:110px}.main-menu span{font-size:35px}.main-menu small{font-size:16px}.tagline{font-size:25px}.title-links button{font-size:24px}.crt-overlay p,.crt-overlay li{font-size:28px}.crt-overlay h2{font-size:54px}.primary,.secondary{font-size:30px;padding:22px 24px}.eyebrow{font-size:21px}.view-heading h2{font-size:33px}.view-heading small{font-size:19px}.terminal-back{font-size:23px}.cluster-help{font-size:22px}.cell-info small{font-size:18px}.puzzle-cell .cell-info{font-size:27px}.map-help{font-size:23px}.map-controls span{font-size:17px}.offers{gap:10px}.offer p{font-size:22px;min-height:100px}.offer h3{font-size:27px}.offer small{font-size:21px}.offer button{font-size:25px;padding:17px}.score-breakdown{font-size:27px}.result-rounds small{font-size:21px}.terminal-footer{font-size:18px}.play-hud small{font-size:19px}.play-hud strong{font-size:38px}.middle-stat strong{font-size:25px}}
@media(prefers-reduced-motion:reduce){.machine{transition:none}.float-text.show{animation:none;opacity:1}.level-pulse .screen-bezel{box-shadow:0 0 0 6px #141812,0 0 0 9px var(--frame)}}
@media(max-width:600px){.crt-overlay p,.crt-overlay li{font-size:36px}.primary,.secondary{font-size:34px;padding:29px 24px;min-height:105px}.score-formula{font-size:27px!important}.title-links button{font-size:29px}.settings-row button{font-size:34px;min-height:100px}.settings-row{font-size:35px}.close-modal{font-size:57px;padding:8px;min-width:88px;min-height:88px}.view-heading>span{font-size:23px}.map-controls button{font-size:22px;min-height:80px}.offer button{min-height:90px}.play-bottom{font-size:19px}.play-tip{font-size:24px}}
.screen-bezel{outline:3px solid color-mix(in srgb,var(--frame),#171e16 45%);outline-offset:6px;transition:box-shadow .8s,outline-color .8s}.viewport{touch-action:none}.machine-wall{touch-action:none}
/* Terminal typography and hardware colors follow the warm mainframe collage. */
:root{--phosphor:#d2d3ac;--amber:#d79b50;--frame:#c9b780}.ambient{background:radial-gradient(ellipse at 50% 40%,#66634655 0,#25281d 43%,#090e0b 90%)}.screen{background:#171e16;box-shadow:inset 0 0 90px #050a04,inset 0 0 0 3px #404632}.glass{background:repeating-linear-gradient(0deg,#1824100c 0,#1824100c 2px,transparent 2px,transparent 5px);box-shadow:inset 0 0 80px #03090066}.machine-id{color:#999d7c;letter-spacing:4px}.title-view h1{color:#e7dcc1;font-family:Impact,'Arial Black',sans-serif;letter-spacing:1px;text-shadow:0 2px #b1a78a,0 4px #343a2a,0 8px #070d08;transform:none}.title-view h1 span{color:#c76c39;text-shadow:0 2px #e29b53,0 4px #6a3a23,0 8px #070d08}.logo-stripes{height:6px;background:#ba5b35;width:430px;box-shadow:0 10px #d39043,0 20px #c6b478;transform:none;margin:16px auto 26px}.tagline{color:#c5c9a2;text-shadow:none;letter-spacing:3px;font-size:20px}.main-menu button{background:linear-gradient(#2f3927,#1d271c);border:1px solid #7b8260;box-shadow:inset 0 1px #c8c4a33d,0 4px #080e09;border-radius:5px;color:#dfd5b8}.main-menu button:hover,.main-menu button:first-child{background:linear-gradient(#584328,#30291a);border-color:#b39a61;color:#f0d7a6;box-shadow:inset 0 1px #dfd4a655,0 4px #080e09}.main-menu b{color:#d7a15d}.main-menu i{color:#c0b278}.main-menu span{font-size:29px;letter-spacing:3px}.title-links button,.terminal-back,.map-controls button{color:#bdc09b}.terminal-footer{border-color:#606848;color:#a7ab85}.view-heading{border-color:#616849}.view-heading small{color:#a7ad83}.view-heading h2{color:#e0d5b6}.view-heading>span{color:#d7a66b}.map-window{border-color:#555d40;background-color:#141d13;background-image:radial-gradient(#4e5c3c44 1px,transparent 1px);border-radius:5px}.circuit-wiring{position:absolute;left:-2000px;top:-1500px;width:5000px;height:4000px;pointer-events:none}.map-node{background:linear-gradient(125deg,#cfc3a8,#9c947b 55%,#736d59);border-color:#25271a;box-shadow:0 6px #0b120a,0 0 0 2px #817960}.mini-crt{background:#101a0d;border-color:#272f20;color:#a2a786;text-shadow:none}.map-node.active .mini-crt{color:#cbd4a2;background:radial-gradient(#2b3d20,#111e0f);box-shadow:inset 0 0 16px #000,0 0 8px #8fa66335}.map-node.adjacent .mini-crt{color:#d4b06d;border-color:#3c3823;box-shadow:0 0 8px #b38d3a35}.map-node.complete .mini-crt{color:#dfc388}.map-node .node-label{color:#363824}.map-help,.map-controls span,.cluster-help{color:#a8ac87}.puzzle-cell{background:linear-gradient(#34402b,#202c1c);border-color:#737e53;border-radius:5px;box-shadow:inset 0 1px #c3c7a122,0 3px #090f08}.puzzle-cell.cleared{background:linear-gradient(#3c4c2e,#26341f);border-color:#94a56c}.puzzle-cell.boss{background:linear-gradient(#65462b,#382a19);border-color:#bf9a5b}.cell-info small{color:#acb68c}.play-hud small,.play-bottom{color:#a3ac82}.play-hud strong{color:#e6dfbf}.pause-button{background:linear-gradient(#394332,#202c1c);border-color:#707c53;color:#d1cfaa;border-radius:5px;box-shadow:inset 0 1px #d0cca138,0 3px #070d07}.canvas-frame{border-radius:14px;box-shadow:0 0 0 5px #181d14,0 0 0 9px var(--frame),0 5px 0 11px #0b1008,0 0 30px #0008}.crt-overlay{background:radial-gradient(ellipse at 50% 20%,#35412b,#15200f);border-color:#879365;border-radius:10px}.crt-overlay h2{color:#e6d5ad}.crt-overlay p,.crt-overlay li{color:#c3c8a5}.eyebrow{color:#adb786}.primary{background:linear-gradient(#695131,#3e311e);border-color:#c1a166;color:#ebd4a6;box-shadow:inset 0 1px #d0c08c44,0 3px #0b1007}.secondary,.settings-row button{border-color:#899567;background:linear-gradient(#3c4b30,#26351d);color:#c5cf9f;box-shadow:inset 0 1px #c0c7902a,0 3px #0b1007}.primary:hover{background:#795d35}.result-score{color:#efddb5;text-shadow:none}.result-score small,.result-rounds small,.score-formula{color:#a8b38b!important}.result-rounds,.score-breakdown .total-line{border-color:#66754b}.offer{background:linear-gradient(#3a472d,#1b2a16);border-color:#8f9a68}.offer button{background:#5b482c;color:#e3d0a4;border-color:#b19965}.combo{background:#39412aee;border-color:#baa473;color:#e5cea0;box-shadow:0 3px #091007}.play-tip{background:#293620f5;border-color:#929d6c;color:#d3d9b2}.camera-controls button{background:#303d26ef;color:#d2d5b5;border-color:#76835d}.boot-caption{color:#9a9e7d}.status-light{background:#bec987;box-shadow:0 0 8px #bec98755}
@media(max-width:600px){.main-menu span{font-size:35px}.tagline{font-size:24px}}
.cabinet{filter:saturate(.75) sepia(.08)}
.drag-count{position:fixed;z-index:40;width:72px;min-height:66px;padding:7px 5px 6px;pointer-events:none;user-select:none;text-align:center;border:2px solid #aa9e6a;border-radius:11px;background:linear-gradient(#394530f5,#1c2b1cf5);box-shadow:0 4px 0 #080f09,0 7px 20px #0007;color:#f2e8c7}.drag-count strong{display:block;font:bold 30px/1.1 Arial,sans-serif;font-variant-numeric:tabular-nums}.drag-count small{display:block;font:bold 8px/1.4 'Courier New',monospace;letter-spacing:.5px;margin-top:4px;color:#c1c9a1}.drag-count[data-kind=ten]{background:linear-gradient(#9e4c24f5,#5b2917f5);border-color:#ffcc77;color:#fff1bb}.drag-count[data-kind=ten] small{color:#ffe3a0}.drag-count[data-kind=rock]{background:linear-gradient(#656d55f5,#3b4634f5);border-color:#b4b79c}
.machine{filter:none}.active-terminal{position:absolute;left:0;top:0;width:1448px;height:1086px;transform-origin:0 0}.machine-backplane{position:absolute;left:-7240px;top:-6516px;width:23168px;height:15204px;background-image:url('assets/console/panel-texture.webp');background-size:1448px 1086px;background-repeat:repeat;filter:saturate(.75) sepia(.08);pointer-events:none}.cabinet{filter:saturate(.75) sepia(.08)}.ambient{background:#121a10}
.loadout{width:650px;margin:8px auto 0}.four-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.loadout-slot{min-height:69px;padding:7px 4px;border:1px solid #65724f;background:linear-gradient(#303d28,#182517);border-radius:6px;text-align:center;position:relative}.loadout-slot b{float:left;font-size:29px;width:36px;color:#dac392}.loadout-slot span{display:block;font-size:15px;line-height:1.5}.loadout-slot small{display:block;font-size:11px;color:#a8b78b;margin-top:3px}.loadout-slot.equipped{border-color:#b6a878}.loadout-slot.activated{background:#7f6837;border-color:#ffe4a0;box-shadow:0 0 20px #e7ca8155}.dig-playing .play-hud{height:78px}.dig-playing .canvas-frame{width:590px;height:590px}.dig-playing .play-bottom{margin-top:7px;font-size:16px}.replace-slots{display:grid;grid-template-columns:repeat(2,1fr)}

/* Instructions occupy the reserved screen footer, outside the scaled CRT. */
.play-tip{display:none;position:fixed;left:12px;right:12px;bottom:env(safe-area-inset-bottom,0px);height:58px;max-width:650px;margin:0 auto;padding:7px 10px;border:0;border-radius:0;background:#111a13;color:#d3d9b2;font-size:13px;line-height:20px;text-align:center;z-index:12;overflow:hidden;pointer-events:none}
body.playing .play-tip:not(:empty){display:flex;align-items:center;justify-content:center}
/* Portrait cabinets keep the glass, instrument panels and live board in one physical console. */
.portrait-console,.intro-cabinet{width:min(100vw,56.28dvh);height:min(177.7vw,100dvh);position:relative;margin:auto;background:#c8b08a url('assets/console/panel-texture.webp') center/100% 100% no-repeat;box-shadow:0 0 80px #000}
.portrait-console{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:9;container-type:inline-size}
.portrait-window{position:absolute;inset:8.3% 5.7% 11.3%;border-radius:5%;overflow:hidden;background:repeating-linear-gradient(0deg,#00171912 0 1px,transparent 1px 3px)}
body.portrait-active #machine,body.portrait-active .camera-controls,body.portrait-active .boot-caption{visibility:hidden}
.portrait-window .view{inset:0;padding:3%;position:absolute}
.portrait-window .play-view.active{display:flex;flex-direction:column;justify-content:center;gap:2.2%;padding:2% 0}
.portrait-window .play-hud{width:100%;height:auto;min-height:12%;gap:2%;padding:3% 2%;margin:0;background:linear-gradient(#062629,#031417);border:1px solid #48b6bb;border-radius:8px;box-shadow:inset 0 0 12px #18b4c420;flex-shrink:0}
.portrait-window .play-hud>div{min-width:0;flex:1;border-left:1px solid #5acbd445;padding-left:2%}
.portrait-window .play-hud small{font-size:2.1cqw;color:#8ee4df;letter-spacing:.03em}
.portrait-window .play-hud strong{font-size:4.8cqw;line-height:1.2;color:#ffc778;text-shadow:0 0 9px #ef751960}
.portrait-window .play-hud .middle-stat strong{font-size:3cqw;color:#b6faff}
.portrait-window .pause-button{font-size:4cqw;width:9%;height:40px;min-width:0;padding:0;background:#0a2525;border:1px solid #5ca3a0;border-radius:4px}
.portrait-window .canvas-frame,.dig-playing .portrait-window .canvas-frame{width:98%;height:auto;aspect-ratio:1;margin:0 auto;flex-shrink:0;box-shadow:0 0 0 2px #102424,0 0 0 3px var(--frame),0 0 15px #1adce51a;border-radius:9px}
.portrait-window #board{width:100%;height:100%;display:block;touch-action:none}
.portrait-window .play-bottom,.dig-playing .portrait-window .play-bottom{width:98%;margin:0 auto;padding:2% 3%;font-size:2.4cqw;min-height:5%;background:#061e20;border:1px solid #387f7b;border-radius:5px;align-items:center}
.portrait-window .loadout{width:98%;margin:0 auto}.portrait-window .loadout-slot{min-height:0;padding:6% 2%;background:linear-gradient(#173638,#061b1f);border-color:#4c9693}.portrait-window .loadout-slot b{font-size:5cqw;width:28%;color:#ffc37c}.portrait-window .loadout-slot span{font-size:2cqw}.portrait-window .loadout-slot small{font-size:1.6cqw}.portrait-window .combo{font-size:4cqw}.portrait-window .float-text{font-size:5cqw}
.portrait-window .title-view{padding:5% 4%;text-align:center}.portrait-window .machine-id{font-size:2cqw;letter-spacing:1px}.portrait-window .title-view h1{font-size:15cqw;margin:14% 0 3%;letter-spacing:-.06em}.portrait-window .logo-stripes{width:70%;height:4px;margin:4% auto;box-shadow:0 7px #d95527}.portrait-window .tagline{font-size:2.8cqw;line-height:1.5;letter-spacing:1px;margin:9% 0}.portrait-window .main-menu{width:100%;gap:12px}.portrait-window .main-menu button{height:15cqw;padding:3%;gap:3%;border-radius:6px;background:linear-gradient(#0b3035,#04171b)}.portrait-window .main-menu b{font-size:6cqw;width:12%}.portrait-window .main-menu span{font-size:4cqw;letter-spacing:.03em}.portrait-window .main-menu small{font-size:1.8cqw;letter-spacing:0}.portrait-window .main-menu i{font-size:4cqw}.portrait-window .title-links{gap:6%;margin-top:8%}.portrait-window .title-links button{font-size:2.6cqw;padding:8px}.portrait-window .terminal-footer{font-size:1.8cqw;letter-spacing:0;left:5%;right:5%;bottom:4%;padding-top:8px}
.mode-intro{position:fixed;inset:0;z-index:14;background:#080c0b;display:flex;align-items:center;justify-content:center}.intro-cabinet{container-type:inline-size}.intro-cabinet img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}.intro-actions{position:absolute;left:25.5%;right:25.5%;top:49.5%;height:12%;display:flex;flex-direction:column;gap:8%;justify-content:center;background:#03181cee;border-radius:10px;padding:2% 1%}.intro-actions button{border:1px solid #53e9f0;background:linear-gradient(#703100,#2a1805);color:#fff3b0;box-shadow:inset 0 0 10px #ffa000,0 0 9px #00e5ff44;border-radius:5px;flex:1;font-size:4.5cqw;font-weight:bold;white-space:nowrap}.intro-actions #introBack{font-size:2.5cqw;background:#041b24;box-shadow:inset 0 0 10px #0a74884a;color:#8af1ff}.intro-actions button:active{transform:translateY(2px);filter:brightness(1.25)}
.mode-intro[data-mode=survivor] .intro-actions{top:44%;height:22%;left:26%;right:26%}.mode-intro[data-mode=dig] .intro-actions{top:43.8%;height:27.5%;left:26%;right:26%}.mode-intro[data-mode=survivor] .intro-actions button,.mode-intro[data-mode=dig] .intro-actions button{flex:0 0 28%}
#modal.crt-overlay{position:fixed;inset:0;z-index:30;padding:24px max(16px,calc((100vw - 620px)/2));overflow-y:auto;border-radius:0;background:#020b0bea;backdrop-filter:blur(5px);display:flex;align-items:flex-start;justify-content:center}
#modalContent{width:100%;max-width:620px;margin:auto;padding:24px 16px;background:linear-gradient(#123332,#071b1b);border:2px solid #a7a381;border-radius:15px;font-size:14px}#modalContent h2{font-size:clamp(22px,5vw,35px)}#modalContent p{font-size:14px}#modalContent button{font-size:16px;min-height:44px}#modalContent .offers{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}#modalContent .offer{padding:8px 4px}#modalContent .offer h3{font-size:13px}#modalContent .offer p,#modalContent .offer small{font-size:11px}#modalContent .offer button{font-size:12px}#closeModal{position:fixed;top:8px;right:12px;font-size:30px;z-index:31}.portrait-game .play-tip{bottom:max(10px,env(safe-area-inset-bottom));height:auto;max-height:48px;left:18%;right:18%;padding:4px 7px;font-size:11px;line-height:15px;background:#101c17ef;border-radius:4px}
@media(max-height:500px) and (orientation:landscape){.portrait-console,.intro-cabinet{width:56.28dvh;height:100dvh}.portrait-game .play-tip{left:5px;right:auto;width:25vw;bottom:10px}}
.portrait-window .play-tip,.portrait-game .portrait-window .play-tip{position:static;inset:auto;display:flex;align-items:center;justify-content:center;width:98%;height:36px;min-height:36px;max-height:36px;margin:0 auto;padding:3px 7px;font-size:2.5cqw;line-height:1.25;background:#082528;border:1px solid #427778;border-radius:5px;flex-shrink:0}
.portrait-window .play-tip:empty{display:block;visibility:hidden}
#modalContent li{font-size:14px}#modalContent .loadout-slot span{font-size:11px}#modalContent .loadout-slot b{font-size:20px;width:25px}#modalContent .loadout-slot small{font-size:9px}#modalContent .offer button{padding:8px 2px;min-height:44px}
.mode-readout{width:98%;margin:0 auto;font-size:2.3cqw;letter-spacing:.08em;color:#b1f0e8;line-height:1.3;padding:0 2%}
.portrait-window .play-bottom .combo{position:static;inset:auto;transform:none;margin-left:auto;display:block;font-size:3cqw;line-height:1;color:#ffcd7d;padding:0 0 0 6px;opacity:1}
.portrait-window .play-view.active{gap:1%}.portrait-window .play-hud{min-height:9%}.portrait-window .play-hud small{font-size:2.5cqw}.portrait-window .play-bottom{min-height:4%}.portrait-window .loadout-slot span{font-size:2.4cqw}.portrait-window .loadout-slot small{font-size:2cqw}.portrait-window .play-tip,.portrait-game .portrait-window .play-tip{height:30px;min-height:30px;max-height:30px}
/* One camera, fixed portrait CRT destinations. The drag badge is a body-level overlay. */
:root{--menu-pan-duration:1900ms;--menu-pan-ease:cubic-bezier(.25,.7,.25,1)}
.machine{transition:transform var(--menu-pan-duration) var(--menu-pan-ease)}
.machine-wall{transition:transform var(--menu-pan-duration) var(--menu-pan-ease)}
#portraitWorld{position:fixed;left:50%;top:50%;width:0;height:0;z-index:9;transform-origin:0 0;transition:transform var(--menu-pan-duration) var(--menu-pan-ease);will-change:transform}
#portraitWorld .portrait-console,#portraitWorld .title-cabinet,#portraitWorld .mode-intro{position:absolute;width:941px;height:1672px;left:0;top:0;transform:translate(-50%,-50%);margin:0;container-type:inline-size}
#portraitWorld #portraitConsole{left:5500px}
#portraitWorld .mode-intro{inset:auto;z-index:14;background:transparent;display:block}
#portraitWorld .intro-cabinet{width:941px;height:1672px}
#portraitWorld .title-cabinet img{width:100%;height:100%;display:block}
.portrait-backplane{position:absolute;left:-20000px;top:-20000px;width:40000px;height:40000px;background:linear-gradient(#0006,#0006),url('assets/console/panel-texture.webp') 129px 714px/1100px 1850px repeat;pointer-events:none;z-index:-1}
#dragCount{z-index:100;visibility:visible}
#portraitWorld .play-tip{height:72px;min-height:72px;max-height:72px}
#portraitWorld .pause-button{height:90px}
@media(prefers-reduced-motion:reduce){#portraitWorld,.machine,.machine-wall{transition:none}}
.special-block-art{display:block;width:100%;height:auto;aspect-ratio:1;filter:drop-shadow(0 3px 2px #0007)}
.portrait-window .loadout-slot{padding:4px 3px;display:flex;flex-direction:column;align-items:center}.portrait-window .loadout-slot .special-block-art{width:72%;max-width:140px}.portrait-window .loadout-slot span{font-size:2cqw;line-height:1.1}.portrait-window .loadout-slot small{font-size:1.8cqw;line-height:1.2;margin-top:2px}.empty-block{height:55px;display:grid;place-items:center;font-size:30px;color:#668681}
#modalContent .loadout-slot .special-block-art{width:74px;max-width:100%;margin:auto}#modalContent .offer .offer-block{display:block;width:100%;height:auto;min-height:0;padding:0;margin:0;background:none;border:0;box-shadow:none}#modalContent .offer .offer-block .special-block-art{max-width:140px;margin:auto}#modalContent .offer .offer-block:enabled:hover{filter:brightness(1.18)}#modalContent .replace-slots .special-block-art{width:65px;max-width:100%;margin:auto}.portrait-window .loadout{flex-shrink:0}
.dig-playing .portrait-window .canvas-frame{width:88%}.portrait-window .play-hud{padding:2%}
/* Mode titles swap within the hub's glass; only Start moves to a gameplay terminal. */
#portraitWorld #modeIntro{left:0;top:0;background:none;pointer-events:none}
#modeIntro .intro-cabinet{position:absolute;left:6%;top:8.3%;width:88%;height:80%;margin:0;background:none;overflow:hidden;border-radius:36px;pointer-events:auto}
#modeIntro #introArt{left:-6.82%;top:-12.5%;width:113.64%;height:156.25%;max-width:none}
#modeIntro .intro-actions{left:22.2%;right:22.2%;top:64.85%;height:18.75%}
#modeIntro[data-mode=survivor] .intro-actions{left:22.7%;right:22.7%;top:56.25%;height:34.4%}
#modeIntro[data-mode=dig] .intro-actions{left:22.7%;right:22.7%;top:55.9%;height:43%}
.portrait-window #mapView,.portrait-window #clusterView{padding:4%}
.portrait-window .view-heading{height:120px}.portrait-window .view-heading small{font-size:21px;letter-spacing:1px}.portrait-window .view-heading h2{font-size:31px}.portrait-window .terminal-back{font-size:25px}.portrait-window .map-window{height:920px;margin-top:26px}.portrait-window .map-controls{font-size:19px}.portrait-window .map-controls button{font-size:21px}.portrait-window .map-help,.portrait-window .cluster-help{font-size:22px;line-height:1.5}.portrait-window .cluster-grid{margin-top:36px;gap:18px}.portrait-window .puzzle-cell{min-height:160px}.portrait-window .cell-info{font-size:27px}.portrait-window .cell-info small{font-size:19px}
/* Gem ledger lives in the console rail, never over the board. */
#gemParticles{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:150}
.portrait-window .play-bottom{flex-wrap:wrap;height:auto;min-height:72px}
#gemReadout{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;font:bold 28px 'Courier New',monospace;color:#fff0bd;background:#12252c;border:2px solid #6e857e;border-radius:12px;padding:9px 14px;box-sizing:border-box}
#gemReadout:empty{display:none}#gemReadout small{display:block;font:12px Arial,sans-serif;color:#b7c9c8;letter-spacing:1px}#gemReadout b{font-size:42px;color:#ffd66c}#gemReadout.gem-step{animation:gem-step .45s ease-out}@keyframes gem-step{from{box-shadow:inset 0 0 30px #ffc65d;transform:perspective(400px) rotateX(-14deg)}to{transform:none}}
@media(prefers-reduced-motion:reduce){#gemReadout.gem-step{animation:none}}

body:not(.dig-playing) #gemReadout,body:not(.dig-playing) #gemParticles{display:none}
/* Short, visual menus; explanations are available on demand. */
.coffee-link{display:flex;justify-content:center;gap:12px;align-items:center;text-decoration:none;color:#f5deb0;background:#263d3b;border:1px solid #b79d65;border-radius:8px;padding:14px;margin-top:16px;font:700 16px Arial,sans-serif}.coffee-link:hover{background:#38534c}.coffee-link:focus-visible{outline:3px solid #ffd57a;outline-offset:3px}.coffee-link span{opacity:.7}
.score-details{margin:12px 0;font-size:14px}.score-details summary,.card-details summary{cursor:pointer;color:#bcbf9f;padding:8px 0}.score-details .score-formula{font-size:12px}.shop-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0;text-align:center}.shop-stats b{display:block;font-size:28px;color:#ffe0a3}.shop-stats small{font-size:11px;letter-spacing:1px;color:#abb9a0}.offer .card-effect{font-size:13px;min-height:30px;margin:6px 0}.offer .card-details{font-size:12px}.card-details p{font-size:12px!important}.offer h3{font-size:16px!important;margin:8px 0}.offer>small{font-size:11px}.offers{gap:10px}.quick-rules p{margin:10px 0}.about-view{padding:8%;overflow:auto;height:100%;box-sizing:border-box}.about-view h2{font:900 76px/1.05 Arial,sans-serif;color:#ffe0a4;margin:45px 0 28px}.about-view p{font:26px/1.5 Arial,sans-serif;color:#cad3bc}.about-view details{font:24px/1.5 Arial,sans-serif;margin:24px 0}.about-view summary{cursor:pointer;color:#e2bd77}.about-view .eyebrow{margin-top:55px;font-size:18px}.about-view .coffee-link{font-size:29px;padding:26px;margin-top:45px}.about-note{display:block;text-align:center;font-size:20px;margin-top:15px;color:#a4b49c}.title-links{flex-wrap:wrap}

html body,html body *{font-family:'Outfit',sans-serif!important}
.title-coffee{font-size:22px;padding:12px 20px;margin:12px auto 0;width:max-content;max-width:90%;}
.canvas-frame{position:relative;overflow:hidden}.crt-output{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;border-radius:inherit}.crt-fallback{position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:repeating-linear-gradient(0deg,transparent 0 2px,#0000000c 2px 3px),radial-gradient(ellipse,transparent 55%,#00000030 100%);box-shadow:inset 0 0 20px #07131d18}.canvas-frame::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(135deg,#ffffff06,transparent 35%);border:1px solid #ffffff0b}

.crt-controls{margin:18px 0}.crt-controls input{width:100%;accent-color:#ffb050;min-height:44px}.crt-range-labels{display:flex;justify-content:space-between;font-size:15px}.crt-preview-wrap{position:relative;width:100%;height:220px;overflow:hidden;border-radius:16px;background:#091b25;margin:12px 0}.crt-preview-wrap canvas{width:100%;height:100%}.crt-controls output{color:#ffdb94}.crt-controls small{display:block;font-size:17px}

/* One glass surface over the whole display, including its dialogs. */
.portrait-window{isolation:isolate;background:#071b20}
.whole-crt-glass{display:none;position:absolute;inset:0;z-index:200;pointer-events:none;border-radius:inherit;background:repeating-linear-gradient(0deg,transparent 0 2px,#000 2px 3px),radial-gradient(ellipse at center,transparent 45%,#000a 100%);opacity:var(--crt-glass-opacity);box-shadow:inset 0 0 65px #0009}
.crt-on .whole-crt-glass{display:block}.crt-on .portrait-window .view,.crt-on #modalContent{text-shadow:0 0 var(--crt-glow) currentColor}
#modal.crt-overlay{position:absolute;inset:0;padding:4%;border:0;border-radius:inherit;background:#051719f5;backdrop-filter:none;z-index:100;display:block;overflow:auto}
#modalContent{max-width:none;margin:0;padding:3%;border:0;background:none;font-size:3.6cqw}#modalContent h2{font-size:6cqw}#modalContent h3{font-size:4cqw}#modalContent p,#modalContent li{font-size:3.4cqw}#modalContent button{font-size:3.6cqw;min-height:65px}#modalContent .offer h3{font-size:3.1cqw!important}#modalContent .offer p,#modalContent .offer small,#modalContent .offer button{font-size:2.8cqw}#modalContent .settings-row{font-size:4cqw}#modalContent .result-score{font-size:12cqw}#modalContent .result-rounds small{font-size:2.7cqw}#modalContent .score-details{font-size:3cqw}#modalContent .shop-stats b{font-size:5cqw}#modalContent .shop-stats small{font-size:2.5cqw}#modalContent .coffee-link{font-size:3.5cqw}#closeModal{position:sticky;float:right;top:0;right:0;font-size:5cqw;z-index:101}#modalContent .crt-preview-wrap{height:260px}
.cabinet-controls{position:absolute;inset:0;pointer-events:none;z-index:12}.cabinet-controls button{position:absolute;top:90.55%;height:5.55%;padding:0;background:transparent;border:0;color:#382512;font-weight:900;text-shadow:0 1px #ffd36a;font-size:2.1cqw;pointer-events:auto;border-radius:10%;min-height:0}.cabinet-controls button:active{background:#6d300044;box-shadow:inset 0 0 16px #6c2600}.cabinet-controls button:focus-visible{outline:4px solid #fff4a0;outline-offset:3px}.cabinet-controls .hardware-pause{left:6.5%;width:9%;height:6.1%;font-size:4cqw}.hardware-hint{left:66.85%;width:7.5%}.hardware-help{left:76.65%;width:7.5%}.hardware-about{left:86.35%;width:7.5%}.portrait-window .pause-button{display:none}
#gemParticles{position:absolute;inset:0;width:100%;height:100%;z-index:80;pointer-events:none}

.portrait-window #dragCount{position:absolute;z-index:90;pointer-events:none}.cabinet-controls button:disabled{pointer-events:none;opacity:.35}

.crt-surface{position:absolute;inset:0;isolation:isolate;overflow:hidden;border-radius:inherit;background:#071b20}.crt-on .crt-surface{filter:url(#screenWarp)}.crt-surface #dragCount{position:absolute}.crt-on .canvas-frame::after{display:none}

.cabinet-controls button{top:90.05%;display:grid;place-items:center;line-height:1}.cabinet-controls .hardware-pause{top:89.95%}

.crt-surface{transform:translateZ(0);backface-visibility:hidden;contain:paint}.crt-surface #board{backface-visibility:hidden}

/* Avoid competing promoted layers under a live SVG filter. */
#portraitWorld{will-change:auto}.crt-surface{transform:none;backface-visibility:visible;contain:none}.crt-surface #board{backface-visibility:visible}.crt-on .crt-surface{filter:var(--screen-filter,url(#screenWarp))}

/* Wider logical scanlines survive cabinet scaling on small displays. */
.whole-crt-glass{background:repeating-linear-gradient(0deg,transparent 0 4px,#000 4px 6px),radial-gradient(ellipse at center,transparent 45%,#000a 100%);opacity:clamp(.27,var(--crt-glass-opacity),.5)}

/* The physical glass is the outer clip; distortion stays entirely inside it.
   Calibrated to portrait-console.png (941×1672): x 52..889, y 129..1430. */
#portraitWorld .portrait-window{inset:7.72% 5.53% 14.47%;border-radius:8% / 5%;overflow:hidden;clip-path:url(#crtGlassBoundary);isolation:isolate;background:#071b20}
#portraitWorld .crt-surface{inset:0;max-width:100%;max-height:100%;box-sizing:border-box;background:radial-gradient(ellipse at center,#09232a 45%,#041217 100%)}
#portraitWorld .portrait-window .play-view.active{width:100%;height:100%;max-height:100%;box-sizing:border-box;padding:2% 1%;justify-content:center}
#portraitWorld .portrait-window .play-hud,#portraitWorld .portrait-window .play-bottom,#portraitWorld .portrait-window .loadout{max-width:100%;box-sizing:border-box}
#modeIntro .intro-cabinet{left:5.53%;top:7.72%;width:88.94%;height:77.81%;border-radius:8% / 5%;clip-path:url(#crtGlassBoundary)}

/* Fill the safe glass width; fitBoard constrains height to the remaining UI space. */
#portraitWorld .portrait-window .play-view.active{padding:1% 0;gap:.65%}
#portraitWorld .portrait-window .canvas-frame,.dig-playing #portraitWorld .portrait-window .canvas-frame{width:98%;max-width:98%;height:auto;aspect-ratio:1;margin:0 auto}
#portraitWorld .portrait-window .play-hud{min-height:7%;padding:1.5% 2%}
#portraitWorld .portrait-window .play-tip:empty{display:none}

/* Sprite-based, arbitrary-size consoles. Bezel edges are nine-sliced, not stretched. */
#portraitWorld .modular-console{background:#c1a578 url('assets/console/panel-texture.webp') 0 0/150px 90px repeat;box-shadow:inset 0 0 0 3px #6e5236,inset 0 0 0 8px #ddc199,0 12px 24px #0008;border-radius:18px;overflow:hidden}
.modular-chrome{position:absolute;inset:0;pointer-events:none}.modular-bezel{position:absolute;box-sizing:border-box;border:26px solid transparent;border-image:url('assets/console/crt.webp') 23 18 22 18 fill / 26px stretch;background:#071b20;box-shadow:0 4px 6px #35251980}.console-greeble{position:absolute;background-size:100% 100%;background-repeat:no-repeat;pointer-events:none}.console-id{position:absolute;left:34px;font-size:24px;letter-spacing:3px;color:#30261b}.modular-static-glass{position:absolute;border-radius:8% / 5%;background:radial-gradient(ellipse at 25% 15%,#62757566,transparent 22%),linear-gradient(#101f25,#051317);box-shadow:inset 0 0 30px #000;clip-path:url(#crtGlassBoundary)}
#portraitWorld .portrait-window.modular-glass{inset:auto;clip-path:url(#crtGlassBoundary)}
.portrait-backplane,.machine-backplane{background:#9b805d url('assets/console/panel-texture.webp') 0 0/150px 90px repeat;filter:none}
.modular-neighbors{position:absolute;inset:0;z-index:-1;pointer-events:none}.modular-machine-tile{position:absolute;transform:translate(-50%,-50%);border-radius:18px;background:#b99b71 url('assets/console/panel-texture.webp') repeat;overflow:hidden}
.cabinet-controls button,.cabinet-controls .hardware-pause{background:transparent url('assets/console/button-on.webp') center/100% 100% no-repeat;color:#271c12;text-shadow:0 1px #ffe7b2;height:6.1%;top:89.95%;font-size:2cqw}.cabinet-controls .hardware-pause{font-size:3.5cqw}.cabinet-controls button:active{background-image:url('assets/console/button-off.webp');box-shadow:none}.cabinet-controls button:disabled{background-image:url('assets/console/button-disabled.webp');opacity:1;color:#8a8b85;text-shadow:none}
#modeIntro #introArt{object-fit:fill}

.portrait-backplane{z-index:-3}.modular-neighbors{z-index:-2}

/* Mode title, geometry, and actions all live inside the main CRT surface. */
#portraitWorld #hubConsole #modeIntro{position:absolute;inset:0;left:0;top:0;width:100%;height:100%;transform:none;z-index:8;margin:0;background:#071b20}
#modeIntro .intro-cabinet{position:relative;inset:auto;left:auto;top:auto;width:100%;height:100%;padding:6%;box-sizing:border-box;background:none;clip-path:none;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
#modeIntro #introArt{position:static;inset:auto;width:100%;height:auto;max-width:100%;margin:0}.mode-diagram{display:block;width:100%;height:auto;max-height:48cqw}
#modeIntro #introHeading{position:static;font-size:9cqw;line-height:1.1;color:#ead7ac;font-weight:800;letter-spacing:-.035em;margin:5% 0 2%}
#introSubline{font-size:2.5cqw;letter-spacing:.18em;color:#67b4a8;margin:0 0 6%}
#modeIntro .intro-actions,#modeIntro[data-mode=survivor] .intro-actions,#modeIntro[data-mode=dig] .intro-actions{position:static;inset:auto;width:90%;height:auto;display:flex;flex-direction:column;gap:18px}.intro-actions button{font-size:4cqw;height:85px;background:#173e41;border:2px solid #67b4a8;color:#ead7ac;border-radius:8px}.intro-actions button:first-child{background:#e97c43;border-color:#e97c43;color:#10282d}.intro-actions button:last-child{font-size:2.5cqw;background:transparent;height:65px}
.cabinet-controls button{font-size:1.55cqw}.cabinet-controls .hardware-pause{font-size:0}.cabinet-controls .hardware-pause::before{content:'';width:14px;height:29px;border-left:6px solid currentColor;border-right:6px solid currentColor;box-sizing:content-box}
/* Split-flap instruments: reusable live counters inside the machine. */
.split-counter{display:inline-flex!important;gap:.055em;align-items:center;justify-content:center;vertical-align:middle;padding:.12em .15em;background:#141c1b;border:2px solid #8c7958;border-radius:.14em;box-shadow:inset 0 1px 3px #0008;font-variant-numeric:tabular-nums;line-height:1!important;white-space:nowrap}.flap{position:relative;display:block;width:.66em;height:1.15em;perspective:160px;flex-shrink:0;color:#ffe2a6}.flap-top,.flap-bottom,.flap-turn-top,.flap-turn-bottom{position:absolute;left:0;width:100%;height:50%;overflow:hidden;background:linear-gradient(#34413e,#222c29);backface-visibility:hidden;border-radius:2px;box-sizing:border-box}.flap-top,.flap-turn-top{top:0;border-bottom:1px solid #080e0d}.flap-bottom,.flap-turn-bottom{bottom:0;background:linear-gradient(#202926,#303b35);border-top:1px solid #526052}.flap b{position:absolute;left:0;width:100%;height:200%;display:grid;place-items:center;font-size:1em!important;line-height:1;font-weight:700}.flap-top b,.flap-turn-top b{top:0}.flap-bottom b,.flap-turn-bottom b{bottom:0}.flap-turn-top{z-index:2;transform-origin:bottom;animation:flap-top .22s ease-in forwards}.flap-turn-bottom{z-index:3;transform-origin:top;animation:flap-bottom .22s ease-out forwards}@keyframes flap-top{0%{transform:rotateX(0)}50%,100%{transform:rotateX(-90deg)}}@keyframes flap-bottom{0%,50%{transform:rotateX(90deg)}100%{transform:rotateX(0)}}#gemReadout{gap:8px;font-size:23px;justify-content:space-around}#gemReadout>span{min-width:0;text-align:center}#gemReadout small{font-size:11px;margin-bottom:5px}#gemReadout b{font-size:30px}.banking{border-color:#ffdf8a!important}.play-hud .score-stat strong{font-size:3.8cqw}.play-bottom .combo.split-counter{font-size:2.5cqw!important;line-height:1!important}
@media(prefers-reduced-motion:reduce){.flap-turn-top,.flap-turn-bottom{animation:none}}

/* Physical flip modules sit in the beige chrome; the gameplay CRT holds the board. */
.hardware-readouts{display:none;position:absolute;inset:0;z-index:15;pointer-events:none;color:#30261b}
.board-console .hardware-readouts{display:block}
#portraitWorld .hardware-readouts .play-hud{position:absolute;left:52px;top:145px;width:837px;height:148px;margin:0;padding:16px 22px;min-height:0;border:3px solid #73583b;border-radius:12px;background:linear-gradient(#c1a57d,#e1c59a);box-shadow:inset 0 2px 4px #5d432966,0 3px 0 #8b6b47;gap:20px}
.hardware-readouts .play-hud small{font-size:21px;color:#4a3823;margin-bottom:12px;letter-spacing:2px}
.hardware-readouts .play-hud strong{font-size:54px;color:#fff1c8}
.hardware-readouts .middle-stat strong{font-size:44px}
.hardware-readouts .pause-button{display:none}
.hardware-readouts .mode-readout{position:absolute;left:64px;top:306px;width:810px;font-size:23px;color:#473823}
.hardware-readouts .play-bottom{position:absolute;left:52px;top:1420px;width:837px;height:88px;min-height:0;padding:0;margin:0;background:none;border:0;font-size:22px;display:flex;align-items:center}
.hardware-readouts #boardStatus{position:absolute;top:-1100px;right:12px;font-size:19px;color:#473823}
.hardware-readouts #combo{display:none}
.hardware-readouts #gemReadout{height:88px;background:linear-gradient(#b99b70,#dec299);color:#30261b;border:3px solid #765b3b;box-shadow:inset 0 2px 4px #5d432966,0 3px 0 #8b6b47;animation:none}
.hardware-readouts #gemReadout small{color:#4a3823;font-size:18px}
.hardware-readouts #gemReadout b{font-size:40px;color:#fff0bd}
.hardware-readouts .loadout{position:absolute;left:52px;top:1265px;width:837px;margin:0}
.hardware-readouts .loadout-slot{background:#a98e67;border-color:#705438;padding:4px;min-height:130px}
.hardware-readouts .loadout-slot .special-block-art{width:70px;margin:auto}
.hardware-readouts .loadout-slot span{font-size:20px;color:#342717}
.hardware-readouts .loadout-slot small{font-size:17px;color:#493821}
.hardware-readouts .play-tip{position:absolute;left:52px;top:1320px;width:837px;height:auto;min-height:0;background:#d5bd93;color:#352a1d;border-color:#8a704b;font-size:24px;text-align:center;padding:8px;margin:0;pointer-events:none}
.dig-playing .hardware-readouts .play-tip{top:1365px;font-size:18px}
#portraitWorld .board-console .play-view.active{padding:0;gap:0;align-items:center;justify-content:center}
#portraitWorld .board-console .canvas-frame{max-width:98%;margin:auto;border-radius:0;box-shadow:none;overflow:visible;transform:scale(var(--board-compensation,1));transform-origin:center}
#portraitWorld .board-console .canvas-frame::after{display:none}
#gemParticles{position:fixed;inset:0;width:100vw;height:100vh;z-index:150;pointer-events:none}
.hardware-readouts .flap{box-shadow:0 3px 0 #100e0a,0 0 0 2px #6a5338}
/* Sprite-sheet instrument housings: nine-sliced beige edges around mechanical flaps. */
#portraitWorld .hardware-readouts .play-hud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0;background:transparent;border:0;box-shadow:none}
.hardware-readouts .play-hud>div,.hardware-readouts #gemReadout>span{border:16px solid transparent;border-image:url('assets/console/crt-wide.webp') 23 24 22 24 / 16px stretch;background:#c1a578 url('assets/console/panel-texture.webp') repeat;box-shadow:none;border-radius:0;padding:5px 3px;text-align:center;min-width:0}
.hardware-readouts .play-hud small{margin-bottom:8px;font-size:19px}
.hardware-readouts .play-hud .score-stat strong{font-size:44px}
.hardware-readouts .split-counter{border:0;box-shadow:none;border-radius:0;background:#171b17;padding:.06em .08em}
.hardware-readouts #gemReadout{border:0;background:transparent;box-shadow:none;padding:0;gap:12px;height:88px;align-items:stretch;justify-content:stretch}
.hardware-readouts #gemReadout>span{flex:1;border-width:10px;border-image-width:10px;padding:0 2px}
.hardware-readouts #gemReadout small{font-size:15px;letter-spacing:1px;margin-bottom:2px}
.hardware-readouts #gemReadout b{font-size:32px}
.hardware-readouts .loadout-slot{border:12px solid transparent;border-image:url('assets/console/crt-wide.webp') 23 24 22 24 / 12px stretch;background:#c1a578 url('assets/console/panel-texture.webp') repeat;box-shadow:none;border-radius:0;padding:2px;min-height:130px}
.hardware-readouts .play-tip{border:10px solid transparent;border-image:url('assets/console/crt-wide.webp') 23 24 22 24 / 10px stretch;background:#c1a578 url('assets/console/panel-texture.webp') repeat;border-radius:0;box-shadow:none}

/* Oversized sprite edges retain their molded weight after mobile camera scaling. */
.hardware-readouts .play-hud>div{border-width:32px;border-image-width:32px;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:center}
.hardware-readouts .play-hud small{font-size:17px;margin-bottom:4px;letter-spacing:1px}
.hardware-readouts .play-hud strong{font-size:44px}
.hardware-readouts .play-hud .score-stat strong,.hardware-readouts .middle-stat strong{font-size:34px}
.hardware-readouts #gemReadout>span{border-width:22px;border-image-width:22px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0}
.hardware-readouts #gemReadout small{font-size:13px;margin:0;letter-spacing:0}
.hardware-readouts #gemReadout b{font-size:22px}
.hardware-readouts .loadout-slot{border-width:24px;border-image-width:24px;padding:0}
.hardware-readouts .loadout-slot .special-block-art{width:58px}
.hardware-readouts .loadout-slot span{font-size:16px}
.hardware-readouts .loadout-slot small{font-size:14px}
.hardware-readouts .play-tip{border-width:20px;border-image-width:20px}
.modular-bezel{border-width:52px;border-image-width:52px}

.hardware-readouts .play-bottom,.hardware-readouts #gemReadout{height:120px}
.hardware-readouts #gemReadout>span{border-width:30px;border-image-width:30px}
.hardware-readouts #gemReadout b{font-size:32px}
.board-console .cabinet-controls button,.board-console .cabinet-controls .hardware-pause{top:93.3%;height:5.2%}

/* Opaque instrument cavities beneath the sprite bezels. */
.hardware-readouts .play-hud>div,.hardware-readouts #gemReadout>span,.hardware-readouts .loadout-slot,.hardware-readouts .play-tip{background:#10191c;background-clip:border-box;color:#e8eadc}
.hardware-readouts .play-hud small,.hardware-readouts #gemReadout small,.hardware-readouts .loadout-slot span,.hardware-readouts .loadout-slot small{color:#c4cabb}

/* One CRT containing a moving digital world. */
:root{--phosphor:#92f8ef;--frame:#53e5f3;--amber:#ffb050}
body{background:#02070b;color:#b9fcf7}
#viewport,.boot-caption{display:none!important}
.crt-shell{position:fixed;inset:12px;overflow:hidden;isolation:isolate;border-radius:28px;background:radial-gradient(ellipse at 45% 30%,#102934,#02090f 85%);border:2px solid #255866;box-shadow:inset 0 0 60px #000,0 0 0 5px #050d12,0 0 30px #35e4ff18}
.crt-on .crt-shell{filter:url(#screenWarp)}
#portraitWorld{position:absolute;left:50%;top:50%}
#portraitWorld .portrait-backplane{display:none}
#portraitWorld .modular-console{background:none;box-shadow:none;border:0;border-radius:0;overflow:visible}
.modular-chrome,.modular-neighbors{display:none!important}
#portraitWorld .portrait-window.modular-glass{left:30px!important;top:30px!important;width:881px!important;height:1530px!important;border-radius:0;clip-path:none;overflow:hidden;background:transparent}
#portraitWorld .crt-surface,.crt-on #portraitWorld .crt-surface{filter:none!important;background:none;overflow:hidden;border-radius:0}
.terminal-glass{position:absolute;inset:0;z-index:300;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 75px #0009;background:radial-gradient(ellipse at 25% 5%,#c6faff0a,transparent 50%)}
.crt-on .terminal-glass{background:repeating-linear-gradient(0deg,transparent 0 3px,#0003 3px 4px),radial-gradient(ellipse at 25% 5%,#c6faff0a,transparent 50%)}
#portraitWorld .cabinet-controls{inset:auto 30px 18px;height:70px;display:flex;gap:16px;justify-content:center;pointer-events:auto}
#portraitWorld .cabinet-controls button,#portraitWorld .cabinet-controls .hardware-pause{position:static;width:140px;height:64px;min-height:64px;font-size:22px;background:#061b28;border:2px solid #53dbe8;border-radius:3px;color:#a6fcff;text-shadow:0 0 8px #39dcea80;box-shadow:inset 0 0 12px #26cce915,0 0 8px #26cce915}
#portraitWorld .cabinet-controls .hardware-pause{font-size:0}
#portraitWorld .cabinet-controls button:disabled{background:#05111a;color:#54737c;border-color:#22414c;opacity:.55}
#portraitWorld .portrait-window .play-view.active{padding:2% 1%;gap:12px;justify-content:center}
#portraitWorld .portrait-window .play-hud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:0;border:0;background:none;box-shadow:none;min-height:120px;flex-shrink:0}
#portraitWorld .play-hud>div{padding:14px 8px;border:2px solid #49d9ea;background:#071b28;border-radius:3px;text-align:center;box-shadow:inset 0 0 22px #2dcced12,0 0 12px #43c9ec20;display:flex;flex-direction:column;justify-content:center}
#portraitWorld .play-hud small{color:#8cd8e3;font-size:22px;letter-spacing:1px;margin-bottom:8px}
#portraitWorld .play-hud strong,#portraitWorld .play-hud .middle-stat strong,#portraitWorld .play-hud .score-stat strong{font-size:46px;color:#e4ffff}
.split-counter{border:0!important;border-image:none!important;border-radius:0!important;background:none!important;box-shadow:none!important;padding:0!important;gap:.04em;font-family:Outfit,sans-serif;text-shadow:0 0 12px #70eaff55}
.digital-digit{display:inline-block;min-width:.6em;text-align:center;line-height:1.15}
.digit-change{animation:digital-change .22s ease-out}@keyframes digital-change{from{opacity:.25;transform:translateY(-.15em);filter:brightness(2)}to{opacity:1;transform:none;filter:brightness(1)}}
#portraitWorld .canvas-frame{transform:none!important;border-radius:6px;box-shadow:0 0 0 2px #42cadd,0 0 25px #25bce91a;flex-shrink:0}
#portraitWorld .mode-readout{color:#75c9de;font-size:24px;letter-spacing:2px}
#portraitWorld .play-bottom,#portraitWorld #gemReadout{background:#061923;border:2px solid #397e92;color:#b9faff;box-shadow:none;border-radius:3px;min-height:65px;padding:10px;font-size:25px}
#portraitWorld #gemReadout{font-size:24px;gap:10px}
#portraitWorld #gemReadout small{font-size:18px;color:#8bdde9}#portraitWorld #gemReadout b{font-size:32px;color:#efffff}
#portraitWorld .loadout-slot{background:#061b28;border:2px solid #49cddf;border-radius:3px;box-shadow:inset 0 0 18px #39bfea14;padding:12px 6px}
#portraitWorld .loadout-slot span{color:#bffcff}#portraitWorld .loadout-slot small{color:#8dc8d8}
#portraitWorld .play-tip{color:#b9eef6;background:#061b28;border-color:#35758c;max-height:none;height:auto;min-height:40px}
#portraitWorld .play-tip:empty{display:none}
#portraitWorld .main-menu button,#portraitWorld .puzzle-cell,#portraitWorld .map-node,#portraitWorld .offer,#modalContent .secondary,#modalContent .settings-row button,#modeIntro .intro-actions button{background:#071c29;border:2px solid #55d3e4;color:#c0fcff;box-shadow:inset 0 0 22px #29c5ed14,0 0 14px #29c5ed18;border-radius:3px}
#portraitWorld .main-menu button:hover,#portraitWorld .main-menu button:first-child,#modalContent .primary,#portraitWorld .puzzle-cell.boss{background:#232017;border:2px solid #ffb857;color:#ffe2a4;box-shadow:0 0 18px #ffb05025}
#portraitWorld .map-node .node-label{color:#89c7dc}.map-node .mini-crt,.map-node.active .mini-crt{background:none;border:0;box-shadow:none;color:#9bfcf4}.map-node.adjacent .mini-crt{color:#ffca72}.map-node.locked{opacity:.4}
#portraitWorld .map-window{border-color:#27697e;background-color:#04111d;background-image:radial-gradient(#32667966 1px,transparent 1px)}
#portraitWorld .view-heading h2,#portraitWorld .title-links button,#portraitWorld .terminal-back,#portraitWorld .map-controls button{color:#adf9f3}
#modal.crt-overlay{background:#04131bf5;border:2px solid #2c7c94;border-radius:3px;color:#bdf8fa}
#modalContent h2,#modalContent p,#modalContent li{color:#cffbff}
@media(prefers-reduced-motion:reduce){.digit-change{animation:none}}

.crt-shell #gemParticles{position:absolute;inset:0;width:100%;height:100%;z-index:150;pointer-events:none}

/* Permanent numeric descent: moving survey tape beneath the CRT glass. */
#portraitWorld .depth-meter{display:flex;align-items:center;gap:24px;width:96%;height:126px;flex-shrink:0;margin:0 auto;border:2px solid #3ad2e4;background:linear-gradient(90deg,#0b3040,#05151f);box-shadow:inset 0 0 24px #36dfff16,0 0 14px #26dfff18;overflow:hidden;padding:0 24px 0 0}
.depth-ruler{position:relative;width:142px;height:100%;flex-shrink:0;border-right:2px solid #439bac;overflow:hidden;background:repeating-linear-gradient(0deg,transparent 0 21px,#2ac8de33 21px 22px)}
#depthTape{position:absolute;left:0;right:18px;top:50%;margin-top:-77px}
.depth-tick{display:block;text-align:right;padding-right:18px;height:22px;line-height:22px;font:18px Outfit,sans-serif;color:#589eae;border-right:10px solid #4b93a3}
.depth-tick.current{color:#d4ffff;border-color:#7cffff;font-weight:700;text-shadow:0 0 8px #42ffff}
.depth-ruler i{position:absolute;right:0;top:50%;transform:translateY(-50%);font-style:normal;font-size:20px;color:#ffcf7f}
.depth-main{display:flex;flex-direction:column;flex:1;min-width:0}.depth-main small{font-size:21px;color:#8bdee9;letter-spacing:2px}.depth-main strong{font-size:52px!important;color:#edffff;white-space:nowrap}
.depth-detail{display:flex;flex-direction:column;gap:10px;text-align:right}.depth-detail span{font-size:22px;color:#ffcf8a}.depth-detail small{font-size:16px;color:#70acbe;letter-spacing:1px}
.depth-result{color:#a9faff!important;font-family:Outfit,sans-serif}.depth-result small{font-size:.6em;color:#8ec7d4}

/* Readable numeric hierarchy at the shared camera scale. */
#portraitWorld .play-hud{min-height:152px!important}
#portraitWorld .play-hud strong,#portraitWorld .play-hud .middle-stat strong,#portraitWorld .play-hud .score-stat strong{font-size:68px;line-height:1.12}
#portraitWorld .play-hud small{font-size:25px}
#portraitWorld #gemReadout{min-height:106px;gap:16px;align-items:center}
#portraitWorld #gemReadout b{font-size:54px}#portraitWorld #gemReadout small{font-size:22px}
#portraitWorld .play-bottom .combo.split-counter{font-size:48px!important}
#portraitWorld .mode-readout{font-size:30px}
#portraitWorld .depth-main strong{font-size:72px!important}.depth-detail span{font-size:28px}.depth-tick{font-size:22px}
#portraitWorld .portrait-window .loadout-slot .special-block-art,#modalContent .loadout-slot .special-block-art{width:100%;max-width:176px;margin:0 auto}
#portraitWorld .portrait-window .loadout-slot,#modalContent .loadout-slot{padding:6px 4px;min-width:0}
#portraitWorld .portrait-window .loadout-slot span,#modalContent .loadout-slot span{font-size:25px;line-height:1.1}
#portraitWorld .portrait-window .loadout-slot small,#modalContent .loadout-slot small{font-size:23px;line-height:1.18;margin-top:6px}
#modalContent .shop-stats b{font-size:64px}#modalContent .shop-stats small{font-size:26px}
#modalContent .result-score{font-size:15cqw}#modalContent .result-rounds b{font-size:54px}#modalContent .result-rounds small{font-size:29px}
#modalContent .score-details{font-size:34px}#modalContent .score-formula{font-size:32px}
#modalContent .offer .offer-block .special-block-art{max-width:176px}#modalContent .replace-slots .special-block-art{width:120px}
#portraitWorld .map-node .mini-crt{font-size:48px}#portraitWorld .map-node .mini-crt small{font-size:20px}
#portraitWorld .puzzle-cell>strong,#portraitWorld .puzzle-cell .cell-number{font-size:48px}
#portraitWorld .play-hud .score-stat strong:has(.digital-digit:nth-child(8)),#portraitWorld .depth-main strong:has(.digital-digit:nth-child(10)){font-size:48px!important}

/* Puzzle results emphasize solving effort rather than explosion points. */
#modalContent .puzzle-result{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:36px 0;margin:26px 0}
#modalContent .puzzle-result b{display:block;font:800 100px/1.2 Outfit,sans-serif;color:#e4ffff;text-shadow:0 0 14px #70eaff44}
#modalContent .puzzle-result small{font-size:29px;color:#8cd8e3!important}

/* One brief overload, then a CRT shutdown before Puzzle retry. */

.crt-navigation{position:absolute;inset:0;z-index:490;overflow:hidden;cursor:wait;background:transparent}
.crt-navigation i{position:absolute;left:0;right:0;top:50%;height:2px;background:#c8ffff;box-shadow:0 0 16px 3px #65f3ef88;pointer-events:none}

/* Main-title settings layout is the baseline for all pause menus. */
#modalContent .pause-menu{width:100%;margin:0}
#modalContent .pause-loadout{margin-top:24px;border-top:1px solid #2c7c94;padding-top:20px;text-align:left}
#modalContent .pause-loadout>summary{cursor:pointer;font:700 29px Outfit,sans-serif;color:#adf9f3;padding:12px 0}
#modalContent .pause-loadout .four-slots{margin-top:18px}

/* Larger finger targets on every mode's subtitle screen. */
#modeIntro .intro-actions,#modeIntro[data-mode=survivor] .intro-actions,#modeIntro[data-mode=dig] .intro-actions{gap:40px}
#modeIntro .intro-actions button,#modeIntro .intro-actions #introBack{height:124px;min-height:124px;flex:0 0 124px}

/* Clear containment around the lightweight dot field. */
#portraitWorld .canvas-frame{border:3px solid #57bdce;border-radius:4px;box-shadow:0 0 0 2px #092531,0 0 14px #25bce912}

/* Widen the ruler's existing highlight, without adding a board icon. */
.depth-ruler{width:190px;background:repeating-linear-gradient(0deg,transparent 0 21px,#2ac8de22 21px 22px)}
#depthTape{right:12px}
.depth-tick{padding-right:18px;border-right:36px solid #4b93a366;font-size:26px;color:#80b6c4}
.depth-tick.current{border-color:#8dffff;color:#edffff}
.depth-ruler i{display:none}
#portraitWorld .canvas-frame{border:0!important;border-radius:0;box-shadow:none!important;background:transparent}
.canvas-frame::after{display:none!important}
#portraitWorld .minimal-slots{gap:16px}
#portraitWorld .minimal-slot{min-width:0;min-height:110px;padding:4px 12px;border:0;border-radius:0;background:none;box-shadow:none;display:flex;align-items:center;justify-content:center;pointer-events:auto}
.slot-indicator{width:110px;max-width:100%;height:110px;display:block}
.slot-empty{width:58px;height:58px;opacity:.5;background:linear-gradient(#69a3ae,#69a3ae) left top/12px 2px,linear-gradient(#69a3ae,#69a3ae) left top/2px 12px,linear-gradient(#69a3ae,#69a3ae) right top/12px 2px,linear-gradient(#69a3ae,#69a3ae) right top/2px 12px,linear-gradient(#69a3ae,#69a3ae) left bottom/12px 2px,linear-gradient(#69a3ae,#69a3ae) left bottom/2px 12px,linear-gradient(#69a3ae,#69a3ae) right bottom/12px 2px,linear-gradient(#69a3ae,#69a3ae) right bottom/2px 12px;background-repeat:no-repeat}
.minimal-slot[aria-expanded="true"]{background:#70e7ff0c!important}
.minimal-slot.activated .slot-indicator{animation:slot-pulse .4s ease-out}
@keyframes slot-pulse{50%{filter:brightness(1.8);transform:scale(1.08)}}
.slot-info{text-align:center;font-size:23px;color:#cbf8ff;padding:6px 12px}
.slot-info small{display:block;font-size:19px;color:#8ec4d0;margin-top:4px}
@media(prefers-reduced-motion:reduce){.minimal-slot.activated .slot-indicator{animation:none}}

/* Depth survey runs beside the full height of the Dig board. */
#portraitWorld .dig-playing .canvas-frame,.dig-playing #portraitWorld .canvas-frame{padding-left:110px;aspect-ratio:auto}
#portraitWorld #boardWrap #depthMeter{position:absolute;left:0;top:0;bottom:0;width:100px;height:100%;margin:0;padding:0;display:block;border:0;background:none;box-shadow:none;pointer-events:none}
#boardWrap .depth-ruler{width:100%;height:100%;border:0;background:none}
#boardWrap .depth-main,#boardWrap .depth-detail{display:none}
#boardWrap #depthTape{right:6px;margin-top:-451px}
#boardWrap .depth-tick{height:22px;line-height:22px;padding-right:9px;border-right:24px solid #4b93a355;font-size:var(--depth-font,26px);color:#7096a2}
#boardWrap .depth-tick.current{border-color:#96ffff;color:#fff;text-shadow:0 0 6px #49ffff66}

/* One contained number-and-direction treatment for owned and offered cards. */
#portraitWorld .minimal-slot{flex-direction:column;gap:7px;padding:4px 8px}
#portraitWorld .minimal-slot .slot-caption{font-size:21px;line-height:1.1;color:#bce8ee;text-align:center}
#modalContent .loadout-slot{background:none;border:0;box-shadow:none;border-radius:0}
#modalContent .loadout-slot .slot-indicator{width:100%;height:auto;max-width:150px;margin:0 auto}
#modalContent .offer-block .slot-indicator{width:100%;height:auto;max-width:155px;margin:0 auto}
#modalContent .replace-slots .slot-indicator{width:96px;height:96px;margin:0 auto}
#modalContent .loadout-slot span{font-size:22px;color:#c5edf4}

/* Retain every depth reached by this run as a continuous illuminated band. */
#boardWrap .depth-tick.session-lit{color:#c5ffff;border-color:#54bfc9;text-shadow:0 0 5px #5affff44}
#boardWrap .depth-tick.current{color:#fff;border-color:#b4ffff;text-shadow:0 0 8px #65ffff88}

/* Large, isolated close control inside the scaled CRT. */
#closeModal{width:16cqw;height:16cqw;min-width:132px;min-height:132px;max-width:176px;max-height:176px;display:flex;align-items:center;justify-content:center;padding:0;margin:0 0 12px 12px;font-size:9cqw;line-height:1;border:2px solid #76dce8;border-radius:4px;background:#082432;color:#e1ffff;touch-action:manipulation}
#closeModal:active{background:#164454}
#modalContent{clear:both}
#hubConsole .title-links{display:none}

/* Alternating fields make the scanline structure readable without a new animation. */
.crt-on .terminal-glass{background:repeating-linear-gradient(0deg,transparent 0 2px,#0005 2px 3px,#b7faff08 3px 4px,transparent 4px 6px,#0008 6px 7px,#b7faff0c 7px 8px),radial-gradient(ellipse at 25% 5%,#c6faff0a,transparent 50%)}

/* Forty-two scanline bands per board, independent of viewport pixel density. */
.crt-on .terminal-glass{background:repeating-linear-gradient(0deg,transparent 0 var(--scan-gap,4px),#0005 var(--scan-gap,4px) var(--scan-pitch,6.5px),transparent var(--scan-pitch,6.5px) var(--scan-next,10.5px),#0008 var(--scan-next,10.5px) var(--scan-repeat,13px)),radial-gradient(ellipse at 25% 5%,#c6faff0a,transparent 50%)}

/* Scanlines belong to the stationary glass, independent of the moving scene. */
.crt-on .terminal-glass{background:radial-gradient(ellipse at 25% 5%,#c6faff0a,transparent 50%)}
.terminal-scanlines{display:none;z-index:299;position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:var(--scan-opacity,.25);mix-blend-mode:var(--scan-blend,overlay);background:repeating-linear-gradient(0deg,transparent 0 var(--scan-gap),var(--scan-color-a,#000) var(--scan-gap) var(--scan-pitch),transparent var(--scan-pitch) var(--scan-next),var(--scan-color-b,#fff) var(--scan-next) var(--scan-repeat))}
.crt-on .terminal-scanlines{display:block}
.crt-settings .settings-row select{font:inherit;max-width:52%;min-height:80px;padding:12px;background:#082432;border:2px solid #62c5d4;border-radius:3px;color:#d6ffff}

/* Wide displays use one centered tablet-sized portrait CRT. */
@media(min-aspect-ratio:3/4){
 .crt-shell{inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);width:min(768px,calc(100vw - 24px),calc((100vh - 24px)*.75));width:min(768px,calc(100vw - 24px),calc((100dvh - 24px)*.75));height:auto;aspect-ratio:3/4}
}

/* Donation actions have a clear buffer from navigation and other CTAs. */
.coffee-link,.about-view .coffee-link,#modalContent .coffee-link{margin:48px 24px 36px}
.title-view .title-coffee{margin:48px auto 36px;max-width:calc(100% - 48px)}

/* Stronger digital chrome: quiet halo and a small lower-right cast shadow. */
:root{--ui-edge-shadow:5px 6px 3px #0009;--ui-edge-glow:0 0 9px #5ae5f32a}
#portraitWorld :is(.play-hud>div,.play-bottom,#gemReadout,.play-tip,.main-menu button,.puzzle-cell,.map-node,.map-window,.offer),#modeIntro .intro-actions button,#modalContent :is(.primary,.secondary,.settings-row button,.settings-row select,.offer,.offer button),.coffee-link,#closeModal,#portraitWorld .cabinet-controls button,#portraitWorld .cabinet-controls .hardware-pause{border-width:4px;box-shadow:var(--ui-edge-shadow),var(--ui-edge-glow),inset 0 0 10px #2acded0a}
#portraitWorld :is(.main-menu button:hover,.main-menu button:first-child,.puzzle-cell.boss),#modalContent .primary{--ui-edge-glow:0 0 10px #ffb85730}
#modal.crt-overlay{border-width:4px;box-shadow:var(--ui-edge-shadow),0 0 12px #55d3e426}
.crt-shell{border-width:3px;box-shadow:4px 5px 6px #000b,inset 0 0 60px #000,0 0 0 5px #050d12,0 0 16px #35e4ff1a}
.slot-indicator{filter:drop-shadow(3px 4px 2px #0008) drop-shadow(0 0 2px #65daee26)}
.slot-indicator polygon[stroke]:not([stroke="none"]){stroke-width:2.5}

/* Edge-to-edge metallic puzzle routes beneath compact frosted controls. */
#mapView{position:absolute;inset:0;padding:0;z-index:1;container-type:inline-size}
#mapView.active{display:block}
.puzzle-map-active #portraitWorld{z-index:2;pointer-events:none}
.puzzle-map-active #modal{pointer-events:auto}
#mapView .map-window{position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;border-radius:0;box-shadow:none;background:radial-gradient(#52778445 1px,transparent 1.5px),radial-gradient(ellipse at 50% 40%,#102631,#030d16 85%);background-size:24px 24px,100% 100%;touch-action:none}
#mapView .view-heading{position:absolute;top:16px;left:14px;right:14px;height:auto;min-height:70px;z-index:5;padding:10px 12px;gap:10px;border:3px solid #7ca6b7;border-radius:5px;background:#08202ee6;box-shadow:4px 5px 3px #0008,0 0 8px #70d7ea20;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#mapView .view-heading small{font-size:10px;letter-spacing:1.5px;color:#8eb7c3}
#mapView .view-heading h2{font-size:clamp(15px,4cqw,24px);margin:5px 0 0;letter-spacing:.5px;color:#d6faff}
#mapView .view-heading .terminal-back{font-size:14px;min-height:44px;padding:8px 4px;color:#b6eff5}
#mapView .view-heading>span{font-size:11px;white-space:nowrap;color:#a8e1e9}
#mapView .map-controls{position:absolute;bottom:86px;left:50%;transform:translateX(-50%);z-index:5;height:auto;width:max-content;max-width:calc(100% - 28px);padding:6px 12px;gap:14px;border:3px solid #6a95a5;border-radius:5px;background:#08202ee6;box-shadow:4px 5px 3px #0008,0 0 8px #70d7ea20;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#mapView .map-controls button{min-height:44px;font-size:13px;padding:6px;color:#c7f5fb}
#mapView .map-controls span{font-size:10px;color:#86aebc}
#mapView .map-help{display:none}
#mapView .machine-wall{transform-origin:0 0;top:44%;left:50%;transition:transform .35s ease-out}
.metal-routes{position:absolute;overflow:visible;pointer-events:none}
#mapView .map-node{width:190px;height:126px;padding:18px 14px;border:3px solid #758f9a;border-radius:7px;color:#a8bcc5;background:linear-gradient(135deg,#43545d 0,#263a45 8%,#0d1e29 44%,#182c37 92%,#354955);box-shadow:6px 7px 3px #0008,inset 2px 2px #cee5ea25,inset -2px -2px #0008;text-align:left;opacity:1}
#mapView .map-node::before,#mapView .map-node::after{font-size:12px;color:#9daeb4;left:3px;top:1px}
#mapView .map-node::after{left:auto;right:3px}
#mapView .map-node.active{border-color:#7bc6d4}
#mapView .map-node.current{border-color:#c4faff;box-shadow:6px 7px 3px #0008,0 0 12px #73e9ff26,inset 2px 2px #cee5ea25}
#mapView .map-node.adjacent{border-color:#c59158}
#mapView .map-node.locked{opacity:.48;border-color:#485e69}
.module-id{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:37px;font-weight:800;line-height:1;color:#dbecf0}
.module-id small{font-size:17px;letter-spacing:1px;color:#8fbdc9}
.map-node.adjacent .module-id small{color:#e8b778}
.module-lights{display:flex;align-items:center;gap:5px;margin-top:20px}
.module-lights i{display:block;width:10px;height:12px;background:#1b3440;border:1px solid #63858f;border-radius:2px}
.module-lights i.lit{background:#92f2dd;border-color:#c3fff2;box-shadow:0 0 5px #82ffdf55}
.module-lights i.finale{width:21px;height:19px;margin-left:3px;border-color:#ac8757}
.map-node.complete .module-lights i.finale{background:#ffcb83;box-shadow:0 0 7px #ffd09144}
@media(prefers-reduced-motion:reduce){#mapView .machine-wall{transition:none}}
@supports not (backdrop-filter:blur(1px)){#mapView .view-heading,#mapView .map-controls{background:#08202ef5}}

.puzzle-cell{position:relative}
.complete-badge{display:block;color:#b8ffe7;font-size:18px;font-weight:800;letter-spacing:1px;margin:8px 0;padding:4px 8px;border:2px solid #65c8a3;background:#092e2a;box-shadow:2px 3px 2px #0006}
.puzzle-cell.cleared .cell-info{font-size:21px}

/* Compact, bounded circuit tiles and persistent icon readouts. */
#portraitWorld #clusterGrid{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:16px}
#portraitWorld #clusterView .view-heading{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px}
#portraitWorld #clusterView .view-heading>div{min-width:0}
#portraitWorld #clusterView .view-heading h2{font-size:30px;overflow-wrap:anywhere}
#portraitWorld #clusterGrid .puzzle-cell{min-width:0;height:200px;min-height:200px;padding:12px 8px;display:flex;flex-direction:column;justify-content:center;gap:10px;overflow:hidden;text-align:center}
#portraitWorld #clusterGrid .cell-number{font-size:62px;line-height:1}
#portraitWorld #clusterGrid .cell-info{font-size:24px;line-height:1.1;white-space:nowrap}
#portraitWorld #clusterGrid .complete-badge{position:absolute;right:8px;top:8px;font-size:24px;line-height:1;margin:0;padding:2px 5px;border:0;box-shadow:none;background:none;color:#b8ffe7}
.puzzle-metrics{display:flex;justify-content:center;gap:16px;font-size:26px;color:#8fb9c7}
.puzzle-metrics>span{display:flex;gap:5px;align-items:center}
.puzzle-metrics b{font-weight:700;color:#c4e8ef}
.puzzle-metrics svg{width:21px;height:24px}
#portraitWorld #clusterGrid .boss{height:145px;min-height:145px;flex-direction:row;gap:28px}
#mapView,#mapView .map-window,#mapView .map-node{touch-action:none}

/* Generous hit areas for returning from circuit selection to the route map. */
#portraitWorld #clusterView .view-heading{height:160px;min-height:160px}
#portraitWorld #clusterBack{min-width:180px;min-height:132px;padding:20px 16px;font-size:32px;border:3px solid #70cedd;border-radius:4px;background:#092432;touch-action:manipulation;box-shadow:4px 5px 3px #0008,0 0 8px #70d7ea20}
#mapView #mapHome{min-height:48px;min-width:66px;touch-action:manipulation}

/* Softer glass and digital chrome corners. */
.crt-shell{border-radius:clamp(34px,5vw,48px)}
#portraitWorld :is(.play-hud>div,.play-bottom,#gemReadout,.play-tip,.main-menu button,.puzzle-cell,.map-node,.offer,.cabinet-controls button),#modeIntro .intro-actions button,#modalContent :is(.primary,.secondary,.settings-row button,.settings-row select,.offer,.offer button),.coffee-link,#closeModal,#portraitWorld #clusterBack{border-radius:18px}
#modal.crt-overlay{border-radius:22px}
#mapView :is(.view-heading,.map-controls){border-radius:14px}
#mapView .map-node{border-radius:16px}

/* Completed circuits read as finished modules rather than ordinary active ones. */
#mapView .map-node.complete{border:4px solid #a6f7cb;background:linear-gradient(135deg,#406453,#183d35 45%,#0a2927);box-shadow:6px 7px 3px #0008,0 0 15px #8df4bd38,inset 2px 2px #d5ffe535}
#mapView .map-node.complete .module-id{color:#e4fff0}
#mapView .map-node.complete .module-id small{color:#bdffdb;font-weight:800}
#mapView .map-node.complete .module-lights i.lit{background:#b9ffe0;border-color:#ddfff0}
#portraitWorld .puzzle-cell.cleared{border-color:#8ee4b5;background:#0b302b;box-shadow:5px 6px 3px #0009,0 0 9px #71e9b329}



.puzzle-lock{position:absolute;right:10px;top:10px;color:#91b3bf}
.puzzle-lock svg{width:25px;height:28px}

/* Puzzle navigation lives in the breadcrumb above the board. */
#portraitWorld #modeReadout.puzzle-breadcrumb{display:flex;align-items:center;gap:24px;min-height:132px;padding:0 2%;flex-shrink:0}
#portraitWorld #puzzleSelectCrumb{min-width:180px;min-height:132px;padding:20px 16px;font-size:32px;font-weight:700;border:4px solid #70cedd;border-radius:18px;background:#092432;color:#c8faff;box-shadow:var(--ui-edge-shadow),var(--ui-edge-glow);touch-action:manipulation}
#modeCrumb{min-width:0;overflow-wrap:anywhere}
#portraitWorld .puzzle-breadcrumb #modeCrumb{font-size:27px;line-height:1.4;letter-spacing:1px}

/* Route navigation matches the generous gameplay and circuit back controls. */
#mapView .view-heading{min-height:100px;padding:14px;gap:14px}
#mapView #mapHome{min-height:64px;min-width:88px;padding:12px 10px;font-size:16px;font-weight:700;border:3px solid #70cedd;border-radius:12px;background:#092432;color:#c8faff;box-shadow:4px 5px 3px #0008,0 0 8px #70d7ea20;touch-action:manipulation}
#mapView .view-heading>div{min-width:0;flex:1}
#mapView .view-heading h2{font-size:clamp(14px,4cqw,24px);line-height:1.2}
#mapView .view-heading>span{font-size:10px}

.round-readout{display:flex;align-items:baseline;justify-content:center;gap:.1em}
#portraitWorld #roundLimit{font-size:.5em;color:#8cc9d6;font-weight:600;letter-spacing:0}

.minimal-slot{position:relative}
.slot-burn{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;background:#071b20;animation:slot-countdown .5s ease-out}
.slot-burn .slot-indicator{height:110px}
.slot-explode{color:#fff3ad;background:radial-gradient(circle,#fff6a4 0,#ff9f25 28%,#f04b1766 55%,transparent 72%);animation:slot-detonate .65s ease-out forwards}
.slot-explode b{font-size:58px;text-shadow:2px 3px #8e261c}
@keyframes slot-countdown{from{transform:translateY(-8px);filter:brightness(1.8)}to{transform:none;filter:brightness(1)}}
@keyframes slot-detonate{0%{transform:scale(.7);opacity:1}40%{transform:scale(1.5);opacity:1}100%{transform:scale(1.9);opacity:0}}
@media(prefers-reduced-motion:reduce){.slot-burn{animation:none}.slot-explode{animation:slot-detonate .15s ease-out forwards}}
.minimal-slot.slot-burning{opacity:1}

/* Raw pool → multiplier → payout, then into the game total. */
#gemReadout.multiplying>span:nth-child(2){animation:pool-amplify .65s ease-in-out infinite;color:#baffdf}
#gemReadout.banking>span:last-child{animation:pool-amplify .65s ease-in-out infinite}
@keyframes pool-amplify{50%{transform:scale(1.05);text-shadow:0 0 9px #88ffd977}}
#modalContent .offers{align-items:stretch}
#modalContent .offer{display:flex;flex-direction:column;min-width:0}
#modalContent .offer>button:last-child{margin-top:auto;padding-top:12px;padding-bottom:12px}
#modalContent .offer>small:last-of-type{margin-bottom:16px}
@media(prefers-reduced-motion:reduce){#gemReadout.multiplying>span:nth-child(2),#gemReadout.banking>span:last-child{animation:none}}

/* CRT shadow-box depth: tight shadows cast consistently down and right. */
:root{--ui-edge-shadow:2px 7px 1.5px #0009;--ui-type-shadow:2px 7px 1px #0008}
#portraitWorld,#modeIntro,#modalContent,#closeModal,#dragCount{ text-shadow:var(--ui-type-shadow) }
#portraitWorld :is(button,.play-hud>div,.play-bottom,#gemReadout,.play-tip,.puzzle-cell,.map-node,.offer,.view-heading,.map-controls,.complete-badge),
#modeIntro .intro-actions button,
#modalContent :is(button,select,.offer),.coffee-link,#closeModal,#portraitWorld #clusterBack,#portraitWorld #puzzleSelectCrumb,
#mapView :is(.view-heading,.map-controls,.map-node,.map-node.current,.map-node.complete,#mapHome),#portraitWorld .puzzle-cell.cleared{
 box-shadow:var(--ui-edge-shadow),var(--ui-edge-glow),inset 0 0 10px #2acded0a;
}
/* The illustrated card casts its shadow; its transparent purchase hit area does not. */
#modalContent .offer .offer-block{box-shadow:none}
.slot-indicator,.special-block-art{filter:drop-shadow(2px 7px 1px #0008)}
.mode-diagram>g{filter:drop-shadow(2px 7px 1px #0008)}
/* A reserved output strip; messages never cover the board or change its size. */
#portraitWorld .play-tip.text-unit{position:relative;inset:auto;flex:0 0 92px;width:96%;height:92px;min-height:92px;max-height:92px;margin:0 auto;padding:10px 16px;overflow:auto;pointer-events:auto;text-align:left;border:3px solid #35758c;border-radius:18px;background:#061b28;box-shadow:var(--ui-edge-shadow),var(--ui-edge-glow);cursor:pointer;font-size:22px;line-height:1.25;}
.text-unit-label{display:block;font-size:14px;letter-spacing:2px;color:#719fa9;margin-bottom:5px}
.text-unit-copy{white-space:pre-wrap}
.text-unit.typing .text-unit-copy:after{content:'▌';color:#c5e7b7}
.text-unit-announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.text-unit:focus-visible{outline:3px solid #ffe4a3;outline-offset:3px}
/* A contained success burst, held long enough to register before results/shop. */
.completion-beat{position:absolute;inset:0;z-index:90;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;overflow:hidden;border:0;border-radius:inherit;background:radial-gradient(ellipse,#163c41e8,#03121be0);color:#d8fff0;text-align:center;box-shadow:none;text-shadow:2px 7px 1px #0009;touch-action:manipulation;animation:completion-enter .28s ease-out}
.completion-beat.dig{color:#ffe3a3;background:radial-gradient(ellipse,#4a3820eb,#071821ed)}
.completion-seal{display:grid;place-items:center;width:180px;height:180px;border:7px double currentColor;border-radius:50%;font-size:120px;line-height:1;box-shadow:2px 7px 1px #0009;animation:seal-lock .65s cubic-bezier(.16,1,.3,1)}
.completion-title{font-size:clamp(26px,6cqw,60px);font-weight:900;letter-spacing:2px;position:relative}
.completion-detail{font-size:clamp(14px,3cqw,30px);letter-spacing:1px;position:relative;padding:0 20px}
.completion-beat>small{font-size:18px;letter-spacing:3px;opacity:.6;margin-top:16px;position:relative}
.completion-rays{position:absolute;left:50%;top:40%;width:0;height:0;pointer-events:none}
.completion-rays i{position:absolute;width:7px;height:30px;border-radius:3px;background:currentColor;transform:rotate(var(--angle)) translateY(-90px);animation:completion-spark 1.3s var(--lag) ease-out both}
.completion-beat.boss .completion-seal{border-color:#ffd67b;color:#ffd67b}
@keyframes completion-enter{from{opacity:0}to{opacity:1}}
@keyframes seal-lock{from{opacity:0;transform:scale(.35) rotate(-25deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes completion-spark{0%{opacity:0;transform:rotate(var(--angle)) translateY(-60px) scale(.2)}20%{opacity:.85}100%{opacity:0;transform:rotate(var(--angle)) translateY(calc(-1 * var(--reach))) scale(.6)}}
.completion-beat.still,.completion-beat.still .completion-seal{animation:none}.completion-beat.still .completion-rays{display:none}
@media(prefers-reduced-motion:reduce){.completion-beat,.completion-seal{animation:none}.completion-rays{display:none}}