:root{--bg: #0a0a0c;--fg: #ffffff;--muted: #9aa0a6;--accent: #1e88ff;--accent-hover: #3d9bff;--track: #23262b;--tile: #16181d;--tile-border: #2a2e35}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior:none}#lobby{min-height:100vh;display:flex;justify-content:center;padding:5vh 5vw}#lobby>section{margin-block:auto}.action-bar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;flex-direction:column;align-items:center;gap:1vh;padding:2.2vh 5vw calc(2.2vh + env(safe-area-inset-bottom,0px));text-align:center;background:linear-gradient(to top,#0a0c0efa 55%,#0a0c0e00);backdrop-filter:blur(8px)}.library-loading{display:flex;flex-direction:column;align-items:center;gap:3vh;text-align:center}.library-loading-label{margin:0;font-size:clamp(18px,3.2vw,28px);color:var(--muted)}.library-error{text-align:center;max-width:760px}.library-error h1{font-size:clamp(26px,5vw,48px);font-weight:800;line-height:1.2}.library-error-detail{margin-top:1.2em;font-size:clamp(15px,2.6vw,20px);color:var(--muted);word-break:break-word}.stage{display:flex;flex-direction:column;align-items:center;gap:5vh;width:100%;max-width:1400px;text-align:center}.stage-title{margin:0;font-size:clamp(28px,5vw,56px);font-weight:800;letter-spacing:-.02em}.picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:clamp(20px,3vw,36px);width:100%}.tile{position:relative;display:flex;flex-direction:column;padding:0;border:3px solid var(--tile-border);border-radius:20px;background:var(--tile);color:var(--fg);cursor:pointer;overflow:hidden;aspect-ratio:16 / 9;transition:transform .12s ease,border-color .12s ease;touch-action:manipulation}.tile:hover{border-color:var(--accent-hover)}.tile:active{transform:scale(.98)}.tile.selected,.tile.ready{border-color:var(--accent)}.tile.ready{border-color:#2fd07a;box-shadow:0 0 0 3px #2fd07a59,0 12px 32px #00000073}.tile.downloading{cursor:default}.tile-badge{position:absolute;top:14px;right:14px;z-index:4;padding:8px 16px;border-radius:999px;background:#2fd07a;color:#06281a;font-size:clamp(13px,1.8vw,18px);font-weight:800;letter-spacing:.01em}.tile-saved{position:absolute;top:14px;left:14px;z-index:4;display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:#0a0c10d1;border:1px solid #2fd07a;color:#7ff0b6;font-size:clamp(12px,1.7vw,16px);font-weight:700}.tile-saved:before{content:"";width:12px;height:12px;border-radius:50%;background:#2fd07a}.tile.saved{border-color:#2fd07a}.tile-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.tile.no-thumb .tile-thumb{display:none}.tile-title{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(16px,2.5vw,28px);font-size:clamp(20px,2.6vw,30px);font-weight:800;text-align:left;text-shadow:0 2px 12px rgba(0,0,0,.8);background:linear-gradient(to top,#000000c7,#0000)}.tile.no-thumb .tile-title{position:static;display:flex;align-items:center;justify-content:center;height:100%;text-align:center;background:none}.tile-progress{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4vh;background:#0000009e;backdrop-filter:blur(2px)}.tile-progress[hidden]{display:none}.tile-progress-value{font-size:clamp(22px,3.4vw,38px);font-weight:800;line-height:1;font-variant-numeric:tabular-nums}.tile-progress-track{width:72%;height:10px;border-radius:999px;background:var(--track);overflow:hidden}.tile-progress-bar{height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent-hover));transition:width .15s ease-out}.spinner{width:96px;height:96px;border-radius:50%;border:10px solid var(--track);border-top-color:var(--accent);animation:spin .9s linear infinite}.tile-progress .spinner{width:56px;height:56px;border-width:7px}@keyframes spin{to{transform:rotate(360deg)}}.enter-button{appearance:none;border:none;cursor:pointer;font-size:clamp(28px,5vw,48px);font-weight:800;color:#fff;background:var(--accent);padding:clamp(20px,4vh,36px) clamp(48px,10vw,96px);border-radius:999px;min-width:min(520px,80vw);transition:transform .12s ease,background .12s ease,opacity .12s ease;touch-action:manipulation}.enter-button:not(:disabled):hover{background:var(--accent-hover)}.enter-button:not(:disabled):active{transform:scale(.97)}.enter-button:disabled{opacity:.3;background:#2a2e35;cursor:default}.enter-button.ready:not(:disabled){background:var(--accent);box-shadow:0 10px 30px #1e88ff66}.ready-line{margin:0;font-size:clamp(16px,2.8vw,22px);font-weight:700;color:#2fd07a}.offline{display:flex;flex-direction:column;align-items:center;gap:1.6vh;width:100%}.offline-button{appearance:none;cursor:pointer;border:2px solid var(--tile-border);background:var(--tile);color:var(--fg);font-size:clamp(16px,2.6vw,22px);font-weight:700;padding:clamp(14px,2.2vh,20px) clamp(28px,5vw,44px);border-radius:999px;transition:border-color .12s ease,opacity .12s ease,background .12s ease;touch-action:manipulation}.offline-button:not(:disabled):hover{border-color:var(--accent-hover)}.offline-button:disabled{opacity:.5;cursor:default}.offline-status{margin:0;font-size:clamp(15px,2.4vw,20px);font-weight:600;color:var(--fg)}.storage-line{margin:0;font-size:clamp(13px,2.2vw,17px);color:var(--muted)}.link-button{appearance:none;border:none;background:none;cursor:pointer;color:var(--muted);font-size:clamp(13px,2.2vw,17px);text-decoration:underline;padding:6px 10px;touch-action:manipulation}.link-button:hover{color:var(--fg)}.exit-help{margin:0;font-size:clamp(14px,2.4vw,19px);color:var(--muted)}.hint{margin:0;min-height:1.4em;font-size:clamp(15px,2.6vw,20px);color:var(--muted)}.hint.error{color:#ff6b6b}.unsupported{text-align:center;max-width:720px}.unsupported h1{font-size:clamp(28px,6vw,56px);font-weight:800;line-height:1.2}[hidden]{display:none!important}