.bb-shell{--ink:#102c3a;--cream:#fff0dd;--accent:#c1f56c;max-width:1040px;margin:auto;background:var(--ink);color:var(--cream);font-family:Arial,sans-serif;border:1px solid #5d726e;border-radius:18px;overflow:hidden;box-shadow:0 22px 65px #16363830}.bb-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 26px;background:linear-gradient(110deg,#174c58,#102c3a);border-bottom:1px solid #58726b}.bb-eyebrow{display:block;font-size:10px;letter-spacing:2px;font-weight:700;color:#f3d99c}.bb-header strong{display:block;font-size:26px;letter-spacing:1px;margin-top:7px;font-weight:900}.bb-header em{font-style:normal;color:#ffb56b}.bb-best{font-size:10px;text-align:right;color:#cbded5;letter-spacing:1px}.bb-best b{display:block;font-size:24px;color:var(--accent);margin-top:4px}.bb-hud{display:grid;grid-template-columns:repeat(4,1fr);padding:15px 0;background:#153b48}.bb-hud>div{padding:0 25px;border-right:1px solid #536762}.bb-hud>div:last-child{border:0}.bb-hud small,.bb-strip small{display:block;color:#c9dbd2;font-size:10px;letter-spacing:1px}.bb-hud b{display:block;margin-top:5px;font-size:23px;font-variant-numeric:tabular-nums}.bb-stage{position:relative}.bb-stage canvas{display:block;width:100%;height:auto;touch-action:none;cursor:crosshair}.bb-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#152e35ee,#17383bb5);display:grid;place-items:center;text-align:center;padding:24px}.bb-overlay[hidden]{display:none}.bb-card{max-width:560px}.bb-card h2{font-size:clamp(28px,4.5vw,52px);font-family:Georgia,serif;font-weight:500;letter-spacing:-1px;line-height:1.1;margin:17px 0;color:#fff3d4}.bb-card p{font-size:15px;line-height:1.7;color:#d6e7de;margin:10px 0}.bb-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:22px 0}.bb-tags span{border:1px solid #839588;border-radius:20px;padding:8px 12px;font-size:10px;letter-spacing:1px}.bb-card button{min-height:50px;border:0;border-radius:8px;background:var(--accent);color:#203735;font-size:16px;font-weight:800;padding:14px 25px;cursor:pointer}.bb-strip{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 24px;border-bottom:1px solid #4e6e66}.bb-strip b{display:block;color:#ffd2a0;font-size:16px;margin-top:6px}.bb-focus{width:24%}.bb-focus>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px}.bb-focus b{margin:0;font-size:12px;color:var(--accent)}.bb-meter{height:5px;border-radius:5px;background:#496761;margin-top:10px;overflow:hidden}.bb-meter span{display:block;width:100%;height:100%;background:var(--accent)}.bb-toolbar{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:16px 12px 0}.bb-toolbar button{min-height:44px;padding:10px 15px;background:#41465f;border:1px solid #71918a;color:#f8f0d7;border-radius:7px;font-size:12px;font-weight:700;cursor:pointer;transition:background .15s}.bb-toolbar button:hover{background:#575a73}.bb-toolbar button:disabled{opacity:.5;cursor:default}.bb-toolbar button:first-child{color:var(--accent)}.bb-toolbar kbd{margin-left:8px}.bb-shell button:focus-visible,.bb-stage canvas:focus-visible{outline:3px solid var(--accent);outline-offset:-4px}.bb-help{font-size:12px;line-height:1.8;text-align:center;color:#c5d8cf;padding:13px 14px 19px;margin:0}.bb-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.bb-shell:fullscreen{max-width:none;width:100%;height:100dvh;overflow:auto;border-radius:0}.bb-shell:fullscreen .bb-stage{max-width:1100px;margin:auto}.bb-shell:fullscreen canvas{max-height:calc(100dvh - 310px);object-fit:contain}@media(max-width:600px){.bb-header{padding:15px}.bb-header strong{font-size:19px}.bb-eyebrow{font-size:8px;letter-spacing:.8px}.bb-best{font-size:8px}.bb-best b{font-size:19px}.bb-hud>div{padding:0 12px}.bb-hud b{font-size:18px}.bb-hud small{font-size:8px;letter-spacing:.5px}.bb-overlay{padding:10px}.bb-card h2{font-size:26px;margin:9px 0}.bb-card p{font-size:11px;line-height:1.4;margin:6px 0}.bb-tags{display:none}.bb-card button{min-height:44px;font-size:12px;padding:10px 16px;margin-top:7px}.bb-strip{padding:14px 12px;gap:12px;flex-wrap:wrap}.bb-strip small{font-size:8px;letter-spacing:.4px}.bb-strip b{font-size:13px}.bb-focus{width:100%;display:flex;gap:15px;align-items:center}.bb-focus>div:first-child{min-width:110px}.bb-meter{flex:1;margin:0}.bb-toolbar button{padding:10px 12px}}
@media(prefers-reduced-motion:reduce){.bb-toolbar button{transition:none}}

.bb-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 20px;border-bottom:1px solid #67748d}.bb-materials{display:flex;gap:8px}.bb-controls button{min-height:44px;border:1px solid #9aa8c4;background:#38435b;color:#fff0dd;border-radius:8px;padding:9px 15px;font-weight:700;cursor:pointer}.bb-controls button[aria-pressed=true]{background:#c1f56c;color:#293247}.bb-controls button:disabled{opacity:.5;cursor:default}.bb-sliders{display:flex;gap:18px;flex:1;min-width:230px}.bb-sliders label{flex:1;font-size:11px;color:#dfe4ef}.bb-sliders input{display:block;width:100%;min-height:44px;accent-color:#c1f56c;cursor:pointer}.bb-sliders b{color:#ffd5a2}.bb-controls #bb-throw{background:#ffb56b;color:#293247}.bb-strip>div{flex:1}.bb-help a{color:#ffd7a5;text-decoration:underline}.bb-stage canvas{outline-offset:-4px}@media(max-width:600px){.bb-controls{padding:12px;gap:10px}.bb-materials{flex:1}.bb-sliders{width:100%;order:2}.bb-controls button{padding:10px 13px}.bb-strip{gap:10px}.bb-header strong{font-size:19px}}

.bb-materials{flex-wrap:wrap}.bb-header strong{font-family:Arial,sans-serif;font-style:italic}.bb-card h2{font-family:Arial,sans-serif;font-weight:900}.bb-help a{color:#c1f56c}.bb-sliders input:focus-visible{outline:2px solid #c1f56c}@media(max-width:600px){.bb-materials button{flex:1;padding:10px 8px;font-size:11px}.bb-materials{width:100%}}