.fb{--fb-gold: #ffd27a;--fb-ink: #f1f3f5;--fb-muted: #a9b0b9;--fb-cell: min(64px, calc((100vw - 92px) / (1.24 * var(--fb-cols) - .24)), calc((100dvh - 330px) / (1.24 * var(--fb-cols) - .24)));--fb-gap: calc(var(--fb-cell) * .24);--fb-pad: 12px;position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:14px 16px 16px;border-radius:14px;color:var(--fb-ink);background:linear-gradient(160deg,#474c55,#2a2d34 55%,#1f2228);border:2px solid #14161a;box-shadow:inset 0 1px #ffffff29,inset 0 -8px 18px #00000073,0 14px 30px #00000073;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.fb-rivet{position:absolute;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#9aa0a8,#3a3d44 70%);box-shadow:0 1px 1px #0009}.fb-tl{top:6px;left:6px}.fb-tr{top:6px;right:6px}.fb-bl{bottom:6px;left:6px}.fb-br{bottom:6px;right:6px}.fb-head{display:flex;align-items:center;justify-content:space-between;width:100%;gap:10px;padding:0 6px}.fb-plate{padding:5px 12px;border-radius:4px;font-family:Georgia,Times New Roman,serif;font-size:.72rem;font-weight:700;letter-spacing:.16em;color:#2b1d08;background:linear-gradient(180deg,#e8c068,#a07a2e);box-shadow:inset 0 1px #ffffff80,0 1px 2px #0009}.fb-gauge{width:96px;height:58px;flex:none}.fb-needle{transform-origin:48px 50px}.fb-ready .fb-needle{transition:transform .45s cubic-bezier(.3,1.6,.5,1)}.fb-grid{position:relative;display:grid;grid-template-columns:repeat(var(--fb-cols),var(--fb-cell));grid-auto-rows:var(--fb-cell);gap:var(--fb-gap);padding:var(--fb-pad);border-radius:10px;background:#16181d;box-shadow:inset 0 3px 10px #000c;touch-action:none}.fb-bars{position:absolute;inset:var(--fb-pad);width:calc(100% - 2 * var(--fb-pad));height:calc(100% - 2 * var(--fb-pad));overflow:visible;pointer-events:none}.fb-bar{stroke:#6f5626;stroke-width:9;stroke-linecap:round;transition:stroke .12s,filter .12s}.fb-bar.fb-live{stroke:var(--fb-gold);filter:drop-shadow(0 0 6px rgb(255 210 122 / .9))}.fb-cell{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--fb-cell) * .1);width:var(--fb-cell);height:var(--fb-cell);padding:0;border-radius:calc(var(--fb-cell) * .14);border:1px solid #0c0d10;background:linear-gradient(180deg,#2b2e36,#1b1d23);box-shadow:inset 0 1px #ffffff1a,0 2px 3px #0009;color:inherit;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}.fb-cell:hover{filter:none}.fb-cell:focus-visible{outline:2px solid var(--fb-gold);outline-offset:2px}.fb-cell.fb-reach{border-color:var(--fb-gold);box-shadow:inset 0 1px #ffffff1a,0 0 0 1px var(--fb-gold),0 0 12px #ffd27a73}.fb-cell.fb-hint{animation:fb-hint .9s ease-in-out 3}@keyframes fb-hint{50%{box-shadow:0 0 0 3px #2ec4b6,0 0 16px #2ec4b6}}.fb-lamp{width:calc(var(--fb-cell) * .32);height:calc(var(--fb-cell) * .32);border-radius:50%;border:2px solid #0b0c0e;background:radial-gradient(circle at 35% 30%,#5a4426,#241a0c 70%);box-shadow:inset 0 0 4px #000c}.fb-ready .fb-lamp{transition:background .12s,box-shadow .12s}.fb-cell[data-lamp=amber] .fb-lamp{background:radial-gradient(circle at 35% 30%,#fff3d6,#ffb43a 45%,#a3600b);box-shadow:0 0 10px #ffb43acc,inset 0 0 3px #fff9}.fb-cell[data-lamp=green] .fb-lamp{background:radial-gradient(circle at 35% 30%,#e6fff1,#3fe08c 45%,#0f7a43);box-shadow:0 0 12px #3fe08cd9,inset 0 0 3px #fff9}.fb-lamp{position:relative}.fb-cell[data-lamp=green] .fb-lamp:after{content:"";position:absolute;top:14%;right:14%;bottom:14%;left:14%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.8 3.8 7.2-8' fill='none' stroke='%230a3a20' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat}.fb-button{position:relative;width:calc(var(--fb-cell) * .38);height:calc(var(--fb-cell) * .38);border-radius:50%;background:#07080a;box-shadow:inset 0 2px 4px #000}.fb-button:after{content:"";position:absolute;top:12%;right:12%;bottom:12%;left:12%;border-radius:50%;background:radial-gradient(circle at 38% 32%,#f7dc95,#c99a43 55%,#6e5320);box-shadow:0 3px #4a3714,0 4px 4px #0009;transform:translateY(-2px);transition:transform .08s,box-shadow .08s}.fb-cell.fb-held .fb-button:after{transform:translateY(1px);box-shadow:0 0 #4a3714,0 1px 1px #0009}.fb-cell.fb-pressed:not(.fb-held) .fb-button:after{animation:fb-push .18s ease-out}@keyframes fb-push{40%{transform:translateY(1px);box-shadow:0 0 #4a3714,0 1px 1px #0009}}.fb-dead{cursor:default;background:#121317;box-shadow:inset 0 3px 8px #000}.fb-dead .fb-lamp{background:radial-gradient(circle at 50% 50%,#1c1512,#050505);box-shadow:none}.fb-dead .fb-button{opacity:.3}.fb-dead .fb-button:after{display:none}.fb-name{position:absolute;top:3%;left:7%;font-size:max(9px,calc(var(--fb-cell) * .17));font-weight:800;line-height:1;letter-spacing:.02em;color:var(--fb-muted);pointer-events:none}.fb-dead .fb-name{opacity:.5}.fb-diagram .fb-gauge{visibility:hidden}.fb-diagram .fb-cell[aria-pressed=true]{border-color:var(--fb-gold);box-shadow:0 0 0 3px var(--fb-gold),0 0 16px #ffd27a99}.fb-diagram .fb-cell[aria-pressed=true] .fb-name{color:var(--fb-gold)}.fb-main{display:flex;align-items:center;gap:12px;width:100%;padding:0 6px}.fb-label{flex:1;display:flex;flex-direction:column;font-size:.8rem;line-height:1.3;color:var(--fb-muted)}.fb-label b{color:var(--fb-ink);font-size:.9rem}.fb-breaker{position:relative;flex:none;width:120px;height:44px;padding:0;border-radius:8px;background:#0b0c0e;border:1px solid #000;box-shadow:inset 0 3px 8px #000;cursor:pointer}.fb-breaker:hover{filter:none}.fb-breaker[aria-disabled=true]{opacity:.6;cursor:default}.fb-breaker i{position:absolute;top:4px;left:4px;width:54px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:6px;font-style:normal;font-size:.7rem;font-weight:800;letter-spacing:.1em;color:#f3d6d6;background:linear-gradient(180deg,#8d2f2f,#5a1a1a);box-shadow:0 3px 5px #000000b3;transition:left .25s cubic-bezier(.3,1.6,.5,1),background .2s}.fb-breaker.fb-armed{opacity:1;box-shadow:inset 0 3px 8px #000,0 0 0 2px var(--fb-gold),0 0 16px #ffd27a99;animation:fb-armed 1.2s ease-in-out infinite}@keyframes fb-armed{50%{box-shadow:inset 0 3px 8px #000,0 0 0 2px var(--fb-gold),0 0 4px #ffd27a4d}}.fb-breaker.fb-locked i{animation:fb-locked .3s ease-in-out}@keyframes fb-locked{30%{left:10px}60%{left:2px}}.fb-breaker.fb-on{opacity:1}.fb-breaker.fb-on i{left:60px;color:#e6fff1;background:linear-gradient(180deg,#3fae78,#17603d)}.fb-thrown .fb-cell{cursor:default}@media(prefers-reduced-motion:reduce){.fb-ready .fb-needle,.fb-breaker i{transition:none}.fb-cell.fb-hint,.fb-breaker.fb-armed{animation:none}.fb-cell.fb-hint{box-shadow:0 0 0 3px #2ec4b6}}:root{--bg: #0b0d1c;--surface: #151a33;--line: #2a3057;--ink: #eef1ff;--muted: #9aa3cc;--accent: #7c8cff;--accent-ink: #0b0d1c;--pad-bg: var(--bg);--pad-surface: var(--surface);--pad-line: var(--line);--pad-ink: var(--ink);--pad-muted: var(--muted);--pad-accent: var(--accent);--pad-accent-strong: var(--accent);--pad-accent-ink: var(--accent-ink);--pad-tile: #1b2142;--pad-bad: #ff8a80;color-scheme:dark}@media(prefers-color-scheme:light){:root{--bg: #f5f6fb;--surface: #ffffff;--line: #dfe3f2;--ink: #161a2e;--muted: #5d6488;--accent: #4353d6;--accent-ink: #ffffff;--pad-accent: #7c8cff;--pad-accent-strong: #4353d6;--pad-tile: #eef0fa;--pad-bad: #b3261e;color-scheme:light}}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:var(--bg);color:var(--ink);font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overscroll-behavior:none;touch-action:manipulation}.site{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px}.board{display:flex;flex-direction:column;align-items:center;gap:12px}.stage{display:flex;align-items:center;justify-content:center}.tools{display:flex;align-items:center;justify-content:space-between;gap:12px;width:min(100%,420px);font-size:.9rem;color:var(--muted);font-variant-numeric:tabular-nums}button{font:inherit;font-weight:700;min-height:44px;padding:8px 16px;border-radius:999px;cursor:pointer}button.quiet{color:var(--ink);background:var(--surface);border:1px solid var(--line)}button.link{padding:0;color:var(--muted);background:none;border:0;font-weight:400;text-decoration:underline;text-underline-offset:3px}button:hover{filter:brightness(1.08)}button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}