 :root{font-family:system-ui,sans-serif;color:#fff1d4;background:#071319;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(#06131dcc,#06131def),url('/images/arcade-background.webp') center/cover fixed}main{max-width:840px;margin:auto;padding:12px}header{display:flex;justify-content:space-between;align-items:center;font-size:14px;margin-bottom:8px}.exit{display:flex;gap:6px;align-items:center;background:#086848;color:white;min-height:44px;padding:4px 8px;text-decoration:none;font-weight:800}.exit img{object-fit:contain}
.cabinet{position:relative;width:100%;max-width:460px;margin:auto;aspect-ratio:724/2171}.cabinet-art{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.monitor{position:absolute;left:14%;width:73%;top:11.4%;height:61.3%;overflow:hidden;background:#071218;border-radius:4px;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto}.hud{height:40px;display:flex;justify-content:space-between;align-items:center;gap:5px;padding:4px 8px;background:#081d23;font-size:14px;line-height:1.3}.hud b{color:#ffd479}canvas{display:block;width:100%;height:100%;object-fit:contain;background:#071218;outline-offset:-4px}.meter{display:flex;height:40px;align-items:center;gap:8px;padding:4px 8px;background:#081d23;font-size:14px}.meter meter{min-width:0;width:40%;height:16px}
.screen-title{position:absolute;inset:40px 4%;display:flex;flex-direction:column;align-items:center;justify-content:safe center;gap:3px;text-align:center;background:linear-gradient(#052028ed,#092e32db);border-block:1px solid #b8a36380;box-shadow:inset 0 0 40px #1b676b40;padding:4px;overflow-y:auto}.screen-title>*{flex-shrink:0}.screen-title h2{font-size:20px;margin:0;color:#ffdc87}.screen-title p{font-size:16px;line-height:1.5;margin:0}.screen-title>span{font-size:14px;letter-spacing:.2em}.mascot{width:64px;height:64px;background:url('/images/crystal-sprites-v1.webp') 0 100%/400% 300% no-repeat;animation:float 3s ease-in-out infinite}.screen-title button{font:inherit;font-size:18px;font-weight:900;border:0;background:transparent;color:#ffe18d;min-height:48px;cursor:pointer;animation:beacon 1.4s ease-in-out infinite}.feedback{position:absolute;inset:32% 2% auto;text-align:center;pointer-events:none;font-size:clamp(24px,6vw,38px);font-weight:950;color:#ffe291;text-shadow:0 3px #183537,0 0 20px #ebbc4f;line-height:1.2}
.play-controls,.service-controls{position:absolute;left:9%;right:9%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;align-items:start}.play-controls{top:74%;height:6%}.service-controls{top:81.2%;height:6%}.physical{position:relative;min-height:64px;min-width:44px;border:0;background:transparent;color:#fff1d4;padding:0;cursor:pointer;touch-action:manipulation;font:inherit;font-size:14px;font-weight:800}.physical:before{content:'';display:block;width:40px;height:50px;margin:auto;background:url('/images/cosmic-hardware-v1.webp') 100% 0/400% 200% no-repeat;filter:drop-shadow(0 3px 3px #000)}.physical.gold:before{background-position:33.333% 0}.physical.red:before{background-position:66.667% 0}.physical:active:before{transform:translateY(3px)}.physical:disabled:before{opacity:.55;filter:grayscale(.4)}.physical span{display:block;line-height:1.3;text-shadow:0 2px #001416;overflow-wrap:anywhere}.physical.ready:before{filter:drop-shadow(0 0 10px #ffd65b);animation:beacon 1.4s ease-in-out infinite}
.result-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;width:100%}.result-details span{padding:4px;font-size:14px;line-height:1.4;min-width:0;background:#0b373e;border:1px solid #a1925780}.result-details b{display:block;font-size:20px;color:#ffe4a5}.screen-title.result{gap:4px;animation:reveal .5s ease-out}.screen-title.result #crystal-best-line,.screen-title.result>span{display:none}#crystal-loading{text-align:center;font-size:16px;line-height:1.6;min-height:26px}.guide{padding:20px;background:#0b2227ed;border-top:2px solid #b5a56b;line-height:1.8}.guide h2{font-size:22px}.guide p{font-size:16px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}[hidden]{display:none!important}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #ffe18d;outline-offset:3px}
@keyframes float{50%{transform:translateY(-6px)}}@keyframes beacon{50%{opacity:.65}}@keyframes reveal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@media(max-width:520px){main{padding:4px}.guide{padding:16px 12px}}@media(min-width:700px){.cabinet{max-width:420px}}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important}}
.text-zoom header,.text-zoom .hud,.text-zoom .meter,.text-zoom .physical,.text-zoom .screen-title>span{font-size:28px}.text-zoom .screen-title p,.text-zoom .guide p,.text-zoom #crystal-loading{font-size:32px}.text-zoom .screen-title h2{font-size:40px}.text-zoom .guide h2{font-size:44px}.text-zoom .screen-title button{font-size:36px}.text-zoom .result-details b{font-size:40px}.text-zoom .hud,.text-zoom .meter{height:auto;min-height:64px;flex-wrap:wrap;overflow-wrap:anywhere}.text-zoom .hud>span{min-width:0}.text-zoom .hud{min-height:96px}.text-zoom .meter meter{width:100%}.text-zoom .physical{min-height:110px}.text-zoom .service-controls{top:82.4%}.text-zoom .screen-title{inset:96px 4%;justify-content:flex-start}.text-zoom .screen-title p{max-width:100%;overflow-wrap:anywhere}.text-zoom header{gap:8px;flex-wrap:wrap}.text-zoom .result-details{grid-template-columns:1fr}.text-zoom .result-details span{font-size:28px}.text-zoom .cabinet{max-width:460px}

.record-panel{margin:12px auto;max-width:460px;padding:16px;background:#0b2227ed;font-size:16px;line-height:1.6}.record-panel button,.record-panel a{display:inline-flex;align-items:center;min-height:44px;padding:8px;color:#fff1d4;font:inherit}#crystal-ranking{width:100%;font-size:14px}#crystal-records{padding:0;list-style:none;margin:4px 0}#crystal-records li{display:flex;justify-content:space-between;gap:8px}#crystal-records li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}#crystal-records strong{flex-shrink:0}.text-zoom #crystal-ranking{font-size:28px}.text-zoom .record-panel{font-size:32px}

.furnace-rule{margin:0;padding:5px 8px;background:#09272b;color:#f5dfa2;font-size:14px;line-height:1.5;text-align:center;flex-shrink:0}.text-zoom .furnace-rule{font-size:28px}.screen-title.result #crystal-ranking{display:none}

/* Enlarged text needs document flow rather than squeezing the playable board into the artwork. */
.text-zoom .cabinet{aspect-ratio:auto}.text-zoom .cabinet-art{display:none}.text-zoom .monitor{position:relative;left:0;top:0;width:100%;height:auto;grid-template-rows:auto auto 620px auto;border:2px solid #b5a56b}.text-zoom .play-controls,.text-zoom .service-controls{position:relative;left:0;right:0;top:0;height:auto;padding:12px 0;background:#0b2227}.text-zoom .screen-title{inset:120px 4%;justify-content:flex-start}.text-zoom .furnace-rule{overflow-wrap:anywhere}

.result-record-status{display:none}.screen-title.result .result-record-status:not(:empty){display:block;font-size:14px;line-height:1.5;color:#b4efe8}.text-zoom .screen-title.result .result-record-status{font-size:28px}#crystal-ranking ol li{flex-wrap:wrap}#crystal-ranking ol li span{white-space:normal;overflow-wrap:anywhere}

.screen-title{inset:40px 4% auto;max-height:calc(100% - 80px);justify-content:flex-start;padding:12px;gap:8px}.screen-title.result{inset:40px 4%;justify-content:safe center}.text-zoom .screen-title{inset:120px 4%;justify-content:flex-start}
.screen-title.result .mascot{width:120px;height:120px;animation:float 3s ease-in-out infinite}.screen-title.result h2{line-height:1.5}.screen-title.result.victory{border-color:#ffe18d;background:linear-gradient(#123632f0,#0d252ddd);box-shadow:inset 0 0 50px #dfbd4b30}.screen-title.result.victory .result-details b{color:#fff0b1}.screen-title.result #crystal-press{width:100%;border-block:1px solid #e8cc7e66;margin-top:8px}.text-zoom .screen-title.result .mascot{width:120px;height:120px}
.screen-title.result{inset:40px 4% auto;gap:8px}.furnace-seals{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));width:100%;gap:3px;margin:4px 0}.furnace-seals span{min-height:56px;opacity:.3;filter:grayscale(1);font-size:14px}.furnace-seals span:before{content:'';display:block;width:30px;height:30px;margin:auto;background:url('/images/crystal-sprites-v1.webp') 0 0/400% 300% no-repeat}.furnace-seals span.filled{opacity:1;filter:none}.furnace-seals b{display:block;background:#0b292a;color:#ffedb1;line-height:20px}.text-zoom .furnace-seals{grid-template-columns:repeat(3,minmax(0,1fr))}.text-zoom .furnace-seals span{height:74px;font-size:28px}.text-zoom .furnace-seals b{line-height:40px}

.feedback{white-space:pre-line}
.crystal-guide h3{font-size:20px;margin:32px 0 12px;color:#ffe4a5}.crystal-guide h4{font-size:20px;line-height:1.4;margin:4px 0 10px}.crystal-steps{padding-left:24px}.crystal-steps>li{padding:8px 0}.crystal-steps p{margin:4px 0}.crystal-furnaces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.crystal-furnaces article{min-width:0;background:#0c2b30;border:1px solid #9e8b554d;overflow:hidden}.crystal-furnaces article>div:last-child{padding:16px}.crystal-furnaces article b{font-size:16px}.crystal-furnaces article p{margin:12px 0 0}.crystal-furnace-number{font-size:14px;color:#dfbd76;font-weight:800;letter-spacing:.12em}.crystal-furnace-art{height:160px;background-image:url('/images/crystal-furnaces-v1.webp');background-size:300% auto;background-repeat:no-repeat}.furnace-1{background-position:0 0}.furnace-2{background-position:50% 0}.furnace-3{background-position:100% 0}.furnace-4{background-position:0 100%}.furnace-5{background-position:50% 100%}.furnace-6{background-position:100% 100%}.crystal-guide dt{font-size:18px;font-weight:800;color:#ffe4a5;margin-top:16px}.crystal-guide dd{margin:6px 0 16px;font-size:16px}.crystal-key-table table{width:100%;border-collapse:collapse;font-size:16px;table-layout:fixed}.crystal-key-table caption{text-align:left;padding-bottom:8px;font-weight:800}.crystal-key-table th,.crystal-key-table td{text-align:left;padding:12px 8px;border-bottom:1px solid #9e8b554d;overflow-wrap:anywhere}.crystal-key-table th:first-child{width:45%}.crystal-guide a{display:inline-flex;align-items:center;min-height:44px;padding:8px 0;color:#b4efe8;overflow-wrap:anywhere}.crystal-guide-links{display:flex;flex-direction:column;gap:4px}.text-zoom .crystal-guide h3,.text-zoom .crystal-guide h4{font-size:40px}.text-zoom .crystal-guide b,.text-zoom .crystal-guide dt,.text-zoom .crystal-guide dd,.text-zoom .crystal-key-table table{font-size:32px}.text-zoom .crystal-furnace-number{font-size:28px}.text-zoom .crystal-furnaces{grid-template-columns:1fr}@media(max-width:600px){.crystal-furnaces{grid-template-columns:1fr}}
.crystal-guide{overflow-wrap:anywhere}.crystal-guide a{max-width:100%}
#crystal-asset-retry{display:block;margin:12px auto;min-height:48px;padding:10px 20px;font:700 16px/1.6 system-ui;background:#edcf87;color:#14262b;border:2px solid #fff0bd;border-radius:6px;cursor:pointer}#crystal-asset-retry:focus-visible{outline:3px solid #b4efe8;outline-offset:4px}.text-zoom #crystal-asset-retry{font-size:32px;max-width:100%;overflow-wrap:anywhere}
/* The active monitor and both physical decks should fit a typical viewport together. */
body.crystal-playing:not(.text-zoom) .cabinet{max-width:min(420px,max(260px,calc((100dvh - 96px)*.477)))}
.crystal-board-text{max-width:820px;margin:24px auto;padding:16px;background:#08262b;color:#f6efd9;font:16px/1.7 system-ui;border:1px solid #b4995a}.crystal-board-text summary{min-height:44px;cursor:pointer;font-weight:800;align-content:center}.crystal-board-text summary:focus-visible,.crystal-board-scroll:focus-visible{outline:3px solid #b4efe8;outline-offset:3px}.crystal-board-scroll{overflow:auto;max-height:440px}.crystal-board-text table{border-collapse:collapse;min-width:100%;font-size:16px}.crystal-board-text th,.crystal-board-text td{padding:10px;border:1px solid #b4995a66;white-space:nowrap;text-align:center}.crystal-board-text caption{text-align:left;padding:8px 0}.text-zoom .crystal-board-text,.text-zoom .crystal-board-text table{font-size:32px}
