:root{--bb-bg: #002b36;--bb-surface: #073642;--bb-surface-alt: #0a3f4c;--bb-line: #586e75;--bb-line-strong: #657b83;--bb-text: #eee8d5;--bb-text-secondary: #93a1a1;--bb-text-muted: #839496;--bb-accent: #268bd2;--bb-accent-strong: #2aa198;--bb-danger: #dc322f;--bb-tier-bronze: #cb4b16;--bb-tier-gold: #b58900;--bb-scrim: rgba(0, 43, 54, .75)}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;min-height:100%;background:var(--bb-bg);overscroll-behavior:none;scroll-behavior:smooth}#app-shell{position:relative;width:100%;height:100vh;height:100svh;overflow:hidden}#game{width:100%;height:100%;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}#game canvas{display:block;touch-action:none}.prose{color:var(--bb-text);font-size:clamp(15px,1.15vw + 12px,18px);line-height:1.6;text-align:start;font-family:serif}.prose>*{max-width:68ch;margin-inline:auto}.prose-section{margin-bottom:40px}.prose-section h2{margin-bottom:12px;font-size:clamp(19px,1.8vw + 12px,24px);line-height:1.3;color:var(--bb-text)}.prose-section p{color:var(--bb-text-secondary)}.prose-list{padding-inline-start:22px;list-style:disc}.prose-list li{margin-bottom:14px;color:var(--bb-text-secondary)}.prose-list strong{color:var(--bb-text)}.prose-qa{margin-bottom:20px}.prose-question{margin-bottom:4px;font-size:clamp(16px,1.2vw + 12px,19px);line-height:1.4;color:var(--bb-text)}.prose-answer{color:var(--bb-text-secondary)}.screen{position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:24px;padding-bottom:calc(24px + var(--bb-footer-height));background:var(--bb-bg);touch-action:auto}.screen[hidden]{display:none}.screen-panel{width:min(420px,100%);display:flex;flex-direction:column;align-items:stretch;text-align:center;font-family:sans-serif;color:var(--bb-text-secondary);max-height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}.app-icon{align-self:center;width:auto;height:min(112px,16vh);margin-bottom:16px}.screen-title{margin-bottom:12px;color:var(--bb-text);font-size:34px}.screen-subtitle{margin-bottom:28px;font-size:16px;line-height:1.5}.screen-btn{margin-top:12px;padding:16px;border:0;border-radius:12px;font:600 18px/1 sans-serif;cursor:pointer}.screen-btn-primary{background:var(--bb-accent);color:var(--bb-bg)}.screen-btn-secondary{background:var(--bb-line);color:var(--bb-text)}.screen-btn-primary:hover{background:var(--bb-accent-strong)}.screen-btn-secondary:hover{background:var(--bb-line-strong)}.screen-link{display:block;text-align:center;text-decoration:none}.website-link{color:var(--bb-accent);text-decoration:underline;text-underline-offset:3px}.play-link{display:inline-flex;align-self:center;justify-content:center;padding:12px;background:none}.play-link img{display:block;width:auto;height:48px}.play-link-nested{display:flex;width:fit-content}.play-trademark{margin-top:4px;font-size:12px;color:var(--bb-text-muted)}.start-brand,.start-menu{display:flex;flex-direction:column;align-items:stretch}.start-brand{align-items:center}@media(max-height:600px){.screen{padding:12px;padding-bottom:calc(12px + var(--bb-footer-height))}.app-icon{height:min(64px,10vh);margin-bottom:6px}.screen-title{margin-bottom:6px;font-size:22px}.screen-subtitle{margin-bottom:8px;font-size:14px}.screen-btn{margin-top:6px;padding:10px;font-size:16px}.play-link{padding:8px}.play-link img{height:32px}.settings-sections{gap:12px}}@media(max-height:600px)and (min-aspect-ratio:4/3){.screen-start .screen-panel{width:min(760px,100%);flex-direction:row;align-items:center;gap:24px}.screen-start .start-brand{flex:0 0 38%}.screen-start .start-menu{flex:1 1 auto;display:grid;grid-template-columns:1fr 1fr;gap:8px}.screen-start .start-menu .screen-btn{margin-top:0}.screen-start .start-menu .screen-btn-primary{grid-column:1 / -1}.screen-start .start-menu .play-link{grid-column:1 / -1;justify-self:center}}.settings-sections{display:flex;flex-direction:column;gap:18px;overflow-y:auto;margin-bottom:8px}.settings-section-title{margin-bottom:6px;color:var(--bb-text);font:600 15px/1.3 sans-serif;text-align:start}.settings-list{display:flex;flex-direction:column;gap:4px;text-align:left}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:10px;background:var(--bb-surface);font:500 15px/1.3 sans-serif}.settings-row[hidden]{display:none}.settings-text{display:flex;flex:1;flex-direction:column;gap:4px}.settings-label{flex:1}.settings-hint{color:var(--bb-text-muted);font:400 12px/1.35 sans-serif}.settings-number{width:72px;padding:8px;border:1px solid var(--bb-line);border-radius:8px;background:var(--bb-bg);color:var(--bb-text);font:600 16px/1 sans-serif;text-align:center}.settings-select{padding:8px;border:1px solid var(--bb-line);border-radius:8px;background:var(--bb-bg);color:var(--bb-text);font:600 15px/1 sans-serif}.settings-toggle{width:22px;height:22px;accent-color:var(--bb-accent)}.game-chrome{display:contents}.game-chrome[hidden]{display:none}.game-chrome-cluster{position:absolute;top:max(12px,env(safe-area-inset-top));z-index:10;display:flex;gap:8px}.game-chrome-actions{right:max(12px,env(safe-area-inset-right))}.chrome-round-btn{position:relative;width:44px;height:44px;border:0;border-radius:50%;font:600 22px/1 sans-serif;cursor:pointer}.confirm-moves-button{border:2px solid var(--bb-accent);background:var(--bb-bg);color:var(--bb-accent)}.confirm-moves-button[aria-pressed=true]{background:var(--bb-accent);color:var(--bb-bg)}.confirm-moves-button:hover[aria-pressed=true]{border-color:var(--bb-accent-strong);background:var(--bb-accent-strong)}.confirm-moves-button:hover[aria-pressed=false]{border-color:var(--bb-accent-strong);color:var(--bb-accent-strong)}.undo-button{background:var(--bb-accent);color:var(--bb-bg)}.undo-button:hover:not(:disabled){background:var(--bb-accent-strong)}.undo-button:disabled{background:var(--bb-line);color:var(--bb-text-muted);cursor:default}#help-button{background:var(--bb-line);color:var(--bb-text)}#help-button:hover{background:var(--bb-line-strong)}.chrome-key-hint{position:absolute;right:-2px;bottom:-2px;min-width:15px;padding:1px 3px;border:1px solid var(--bb-bg);border-radius:4px;background:var(--bb-line);color:var(--bb-text-muted);font:600 10px/1.1 ui-monospace,monospace;text-align:center;pointer-events:none}.chrome-key-hint[hidden]{display:none}.home-button{display:flex;align-items:center;justify-content:center;background:var(--bb-line);color:var(--bb-text)}.home-button:hover{background:var(--bb-line-strong)}.home-glyph{flex:none;width:1em;height:1em;pointer-events:none}.tutorial-mark-ring{position:absolute;inset:-6px;border:3px solid var(--bb-accent);border-radius:50%;pointer-events:none;animation:bb-mark-pulse var(--bb-mark-pulse-ms) ease-in-out infinite}.tutorial-mark-ring[hidden]{display:none}@keyframes bb-mark-pulse{0%,to{opacity:1}50%{opacity:var(--bb-mark-pulse-min)}}@media(prefers-reduced-motion:reduce){.tutorial-mark-ring{animation:none}html,body{scroll-behavior:auto}}.tutorial-mark-label{position:absolute;top:calc(max(12px,env(safe-area-inset-top)) + 56px);right:max(12px,env(safe-area-inset-right));z-index:10;display:flex;align-items:center;height:44px;padding:0 14px;border:3px solid var(--bb-accent);border-radius:22px;background:var(--bb-surface-alt);color:var(--bb-text);font:600 15px/1 sans-serif;pointer-events:none}.tutorial-mark-label[hidden]{display:none}#help-overlay{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:16px;background:#06060cd1;touch-action:auto}#help-overlay[hidden]{display:none}.help-panel{width:min(560px,100%);max-height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:28px;border-radius:18px;background:var(--bb-surface-alt);color:var(--bb-text-secondary);font-family:sans-serif;line-height:1.55}.help-panel h1{margin-bottom:8px;color:var(--bb-text);font-size:28px}.help-panel h2{margin-top:22px;margin-bottom:6px;color:var(--bb-accent);font-size:18px}.help-panel p{margin-bottom:8px;font-size:16px}.help-keys{width:100%;margin:6px 0 10px;border-collapse:collapse;font-size:15px}.help-keys td{padding:5px 6px 5px 0;vertical-align:middle}.help-keys td:first-child{width:40%;white-space:nowrap}.help-keys kbd,.help-keys-footer kbd{display:inline-block;min-width:26px;margin-right:4px;padding:3px 7px;border:1px solid var(--bb-line);border-bottom-width:3px;border-radius:6px;background:var(--bb-bg);color:var(--bb-text);font:600 13px/1.2 ui-monospace,monospace;text-align:center}.help-keys-footer{color:var(--bb-text-muted);font-size:14px;line-height:2.1}.help-keys-group{display:inline-block;margin-right:10px;white-space:nowrap}.help-dismiss{width:100%;margin-top:28px;padding:14px;border:0;border-radius:12px;background:var(--bb-accent);color:var(--bb-bg);font:600 17px/1 sans-serif;cursor:pointer}.help-replay{width:100%;margin-top:10px;padding:14px;border:0;border-radius:12px;background:var(--bb-line);color:var(--bb-text);font:600 17px/1 sans-serif;cursor:pointer}.help-replay:hover{background:var(--bb-line-strong)}.run-end-overlay{position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bb-scrim);touch-action:auto}.run-end-overlay[hidden]{display:none}.run-end-score{margin-bottom:12px;color:var(--bb-text);font:700 44px/1 sans-serif}.run-end-marks{--bb-badge-size: 32px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;min-height:var(--bb-badge-size);margin-bottom:8px}.run-end-score[hidden],.run-end-marks[hidden],.run-end-overlay .screen-subtitle[hidden],.run-end-overlay .screen-btn[hidden]{display:none}.run-end-overlay .screen-subtitle,.abandon-prompt .screen-subtitle,.consent-prompt .screen-subtitle{color:var(--bb-text)}@media(max-height:600px){.run-end-score{margin-bottom:8px;font-size:32px}.run-end-marks{--bb-badge-size: 24px;margin-bottom:4px}}.abandon-prompt{position:absolute;inset:0;z-index:32;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bb-scrim);touch-action:auto}.abandon-prompt[hidden]{display:none}.consent-prompt{position:absolute;inset:0;z-index:32;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--bb-scrim);touch-action:auto}.consent-prompt[hidden]{display:none}.consent-prompt .screen-panel{padding:24px;border:1px solid var(--bb-line);border-radius:18px;background:var(--bb-surface)}.consent-link{display:block;margin-top:16px;font-size:14px;text-align:center;color:var(--bb-text);text-decoration:underline;text-underline-offset:3px}.scores-list{display:flex;flex-direction:column;gap:6px;overflow-y:auto;margin-bottom:8px;padding-left:0;list-style:none;text-align:left}.scores-row{display:flex;align-items:baseline;gap:12px;padding:10px 12px;border-radius:10px;background:var(--bb-surface);font-family:sans-serif}.scores-score{min-width:64px;color:var(--bb-text);font:700 20px/1 sans-serif;text-align:right}.scores-detail{display:flex;flex:1;flex-direction:column;gap:2px}.scores-meta{color:var(--bb-text-secondary);font:500 13px/1.3 sans-serif}.scores-settings{color:var(--bb-text-muted);font:400 12px/1.35 sans-serif}.scores-empty{margin-bottom:12px;color:var(--bb-text-muted);font:400 15px/1.4 sans-serif}.scores-empty[hidden]{display:none}.challenges-list{display:flex;flex-direction:column;gap:8px;overflow-y:auto;margin-bottom:8px;padding-left:0;list-style:none;text-align:left}.challenges-row{display:flex;align-items:flex-start;gap:12px;padding:10px 12px;border-radius:10px;background:var(--bb-surface);font-family:sans-serif}.challenges-detail{display:flex;flex:1;flex-direction:column;gap:4px}.challenges-name{color:var(--bb-text);font:700 16px/1.2 sans-serif}.challenges-tiers{display:flex;flex-direction:column;gap:2px;padding-left:0;list-style:none}.challenges-tier{display:flex;align-items:baseline;gap:6px;color:var(--bb-text-muted);font:400 13px/1.35 sans-serif}.challenges-tick{flex:0 0 auto;width:12px;font:700 13px/1.35 sans-serif;text-align:center}.challenges-tier[data-earned=true]{color:var(--bb-text-secondary)}.challenges-tier--bronze .challenges-tick{color:var(--bb-tier-bronze)}.challenges-tier--silver .challenges-tick{color:var(--bb-line-strong)}.challenges-tier--gold .challenges-tick{color:var(--bb-tier-gold)}.challenges-empty{margin-bottom:12px;color:var(--bb-text-muted);font:400 15px/1.4 sans-serif}.challenges-empty[hidden]{display:none}:root{--bb-safe-bottom: env(safe-area-inset-bottom, 0px);--bb-footer-offset: max(8px, var(--bb-safe-bottom));--bb-footer-font-size: 12px;--bb-footer-line-height: 1.4;--bb-footer-height: calc( var(--bb-footer-offset) + var(--bb-footer-font-size) * var(--bb-footer-line-height) + 8px )}.app-footer{position:absolute;right:0;bottom:var(--bb-footer-offset);left:0;z-index:31;display:flex;gap:8px;align-items:baseline;justify-content:center;padding:0 16px;color:var(--bb-text-muted);font:400 var(--bb-footer-font-size) / var(--bb-footer-line-height) sans-serif;pointer-events:none}.app-footer[hidden]{display:none}:root{--bb-badge-size: 44px}.challenge-badge{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;width:var(--bb-badge-size);height:var(--bb-badge-size);border:0;border-radius:8px;background:transparent}.challenge-mark{display:block;width:55%;height:55%}.challenge-badge--bronze{background:var(--bb-tier-bronze);color:var(--bb-bg)}.challenge-badge--silver{background:var(--bb-line-strong);color:var(--bb-bg)}.challenge-badge--gold{background:var(--bb-tier-gold);color:var(--bb-bg)}.challenge-badge--locked{border:3px solid var(--bb-line);background:none;color:var(--bb-line)}
