@layer components{.screen.bf-stage{padding:48px 12px max(16px, calc(env(safe-area-inset-bottom) + 10px));color:var(--on-dark);background:radial-gradient(90% 60% at 50% 0,#123526 0%,#07120d 70%);gap:10px}.bf-board{flex-direction:column;flex:auto;justify-content:center;gap:8px;width:min(760px,100%);min-height:0;margin:0 auto;display:flex}.bf-found{text-align:center;min-height:clamp(58px,9vh,78px);animation:bf-land .46s var(--ease-pop) both;border-radius:14px;flex:none;align-content:center;place-items:center;gap:3px;padding:6px 14px;display:grid}.bf-found b{letter-spacing:.01em;font-size:15px;font-weight:800}.bf-found span{opacity:.86;font-size:13px;font-weight:600}@keyframes bf-land{0%{opacity:0;transform:scale(.92)translateY(14px)}to{opacity:1;transform:none}}.bf-grid{min-height:0;max-height:calc(var(--rows) * 108px + (var(--rows) - 1) * 8px);flex:auto;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(56px,1fr);gap:8px;display:grid;container-type:inline-size}.bf-board[data-rows="4"]{--rows:4}.bf-board[data-rows="3"]{--rows:3}.bf-board[data-rows="2"]{--rows:2}.bf-board[data-rows="1"]{--rows:1}.bf-tile{text-align:center;color:#0d0d0f;min-width:0;transition:transform .2s var(--ease-spring), background .14s ease, color .14s ease, box-shadow .14s ease;-webkit-user-select:none;user-select:none;touch-action:manipulation;background:linear-gradient(#f6f3ec,#e6e1d5);border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:0 4px;display:flex;position:relative;box-shadow:inset 0 -3px #00000024,0 1px #ffffff14}.bf-tile b{max-width:100%;font-size:max(11px, min(19px, calc((25cqw - 16px) / (var(--len) * .6))));letter-spacing:-.01em;overflow-wrap:anywhere;font-weight:800;line-height:1.05}.bf-tile small{white-space:nowrap;text-overflow:ellipsis;opacity:.62;max-width:100%;font-size:10.5px;font-weight:600;line-height:1.1;overflow:hidden}.bf-tile:active{transform:scale(.95)}.bf-tile.is-on{color:#fff;background:linear-gradient(#8a70ff,#6447f0);transform:translateY(-2px);box-shadow:inset 0 -3px #0000004d,0 8px 18px -8px #000000b3}.bf-tile.is-on small{opacity:.8}.bf-tile:focus-visible{outline:3px solid var(--rn);outline-offset:2px}.bf-tile.is-hop{animation:bf-hop .3s var(--ease-out) both;animation-delay:calc(var(--i) * 90ms)}.bf-tile.is-wrong{animation:bf-shake .38s var(--ease-out) both}@keyframes bf-hop{40%{transform:translateY(-14px)}to{transform:translateY(-2px)}}@keyframes bf-shake{20%,60%{transform:translate(-7px)}40%,80%{transform:translate(7px)}}@media (hover:hover){.bf-tile:not(.is-on):hover{filter:brightness(1.04)}}.bf-toast{z-index:5;white-space:nowrap;color:#0d0d0f;animation:pop .26s var(--ease-pop) both;background:#fff;border-radius:999px;padding:9px 16px;font-size:14px;font-weight:650;position:absolute;top:52px;left:50%;translate:-50%;box-shadow:0 10px 24px -10px #0009}.bf-clue{text-align:center;max-width:min(560px,100%);color:var(--on-dark-dim);flex:none;margin:0 auto;font-size:14px;font-weight:600}.bf-clue b{color:var(--on-dark)}.bf-lives{color:var(--on-dark-dim);flex:none;justify-content:center;align-items:center;gap:7px;font-size:13.5px;font-weight:550;display:flex}.bf-lives span{margin-right:4px}.bf-lives i{width:12px;height:12px;transition:background .3s ease, transform .3s var(--ease-pop);background:#ffffff24;border-radius:50%}.bf-lives i.on{background:var(--rn)}.bf-lives i:not(.on){transform:scale(.75)}.bf-actions{flex:none;gap:8px;width:min(600px,100%);margin:0 auto;display:flex}.bf-actions .key{flex:1 1 0;min-width:0;padding:0 8px}.bf-actions .bf-submit{flex:1.3 1 0}.bf-wait{color:var(--on-dark-dim);margin:auto;font-size:16px;font-weight:650}.bf-sum{justify-items:center;gap:12px;display:grid}.bf-sum-bars{gap:6px;width:min(100%,380px);display:grid}.bf-sum-bars .bf-found{border-radius:10px;min-height:0;padding:8px 10px;animation:none}.bf-sum-bars .bf-found b{font-size:13px}.bf-sum-bars .bf-found span{font-size:12px}.bf-sum-grid{gap:4px;display:grid}.bf-sum-grid div{gap:4px;display:flex}.bf-sum-grid i{border-radius:5px;width:18px;height:18px}.bf-sum-note{color:var(--stage-dim);margin:0;font-size:14px}@media (prefers-reduced-motion:reduce){.bf-found,.bf-tile.is-hop,.bf-tile.is-wrong,.bf-toast{animation:none}}}