.bb{--bw: 360px;--u: 40px;display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:8px;max-width:560px;margin:0 auto}.bb-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 44px;gap:6px;width:min(100%,var(--bw));align-items:stretch}.bb-stat{display:grid;align-content:center;padding:4px 10px;min-height:46px;border-radius:12px;background:var(--cell);border:1px solid var(--line);line-height:1.1;min-width:0}.bb-stat small{font-size:.72rem;font-weight:600;color:var(--ink-2);letter-spacing:.02em;white-space:nowrap;overflow:hidden}.bb-stat b{font-family:var(--font-display);font-size:1.22rem;color:var(--ink);font-variant-numeric:tabular-nums}.bb-gear{min-height:44px;min-width:44px;padding:0;font-size:1.2rem;align-self:center}.bb-stage{position:relative;width:var(--bw);height:calc(var(--bw) * 1.42);touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.bb-field{display:block;width:100%;height:100%;border-radius:calc(var(--u) * .45);box-shadow:0 1px 2px #28190a14,inset 0 0 0 1px var(--line);cursor:crosshair}.bb-stage.is-covered .bb-field{cursor:default}.bb-swap{position:absolute;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:1px;min-width:max(52px,calc(var(--u) * 1.3));min-height:max(52px,calc(var(--u) * 1.4));padding:4px 6px 3px;border:1px solid var(--line);border-radius:16px;background:var(--cell);color:var(--ink-2);cursor:pointer;touch-action:manipulation}.bb-swap small{font-size:clamp(.68rem,calc(var(--u) * .27),.9rem);font-weight:700;line-height:1;letter-spacing:.03em}.bb-swap canvas{display:block}.bb-swap:active{transform:translate(-50%,-50%) scale(calc(1 - .06 * var(--motion)))}.bb-swap:disabled{opacity:.45;cursor:default}.bb-swap:focus-visible{outline:3px solid var(--sky);outline-offset:2px}.bb-rows{position:absolute;transform:translateY(-50%);display:grid;justify-items:center;gap:4px;text-align:center;pointer-events:none;color:var(--ink-2)}.bb-rows-text{font-size:clamp(.74rem,calc(var(--u) * .29),.95rem);font-weight:700;line-height:1.15;text-wrap:balance}.bb-pips{display:flex;gap:4px}.bb-pips i{width:clamp(8px,calc(var(--u) * .2),12px);height:clamp(8px,calc(var(--u) * .2),12px);border-radius:50%;background:var(--line)}.bb-pips i.is-on{background:var(--ink-2)}.bb-rows.is-close{color:var(--coral)}.bb-rows.is-close .bb-pips i.is-on{background:var(--coral);animation:bb-pulse calc(1s * var(--motion)) ease-in-out infinite alternate}@keyframes bb-pulse{0%{transform:scale(1)}to{transform:scale(1.35)}}.bb-overlay{position:absolute;inset:0;display:grid;place-items:center;padding:16px;border-radius:calc(var(--u) * .45);background:color-mix(in srgb,var(--bg) 62%,transparent);backdrop-filter:blur(2px)}.bb-card{display:grid;justify-items:center;gap:10px;max-width:300px;padding:18px 20px;border-radius:18px;background:var(--cell);border:1px solid var(--line);box-shadow:var(--shadow);text-align:center}.bb-card p{margin:0;color:var(--ink-2);text-wrap:balance}.bb-card .bb-big{font-family:var(--font-display);font-weight:800;font-size:1.5rem;color:var(--ink);line-height:1.15}.bb-card .bb-big.is-small{font-size:1.25rem}.bb-card .suvi-btn{min-width:200px}.bb-msg{min-height:1.4em;margin:0;width:min(100%,var(--bw));text-align:center;color:var(--ink-2);font-size:.92rem;line-height:1.35;text-wrap:balance}.bb-tools{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;width:min(100%,var(--bw))}.bb-tools .suvi-btn{min-height:44px}.bb-other{text-decoration:none;font-weight:700}.bb-result .bb-note{margin:4px 0 10px;color:var(--ink-2);font-size:.92rem;text-align:center}:root[data-text-size=large] .bb-stat small{font-size:calc(.72rem * 16 / 19)}:root[data-text-size=large] .bb-stat b{font-size:calc(1.22rem * 17 / 19)}:root[data-text-size=large] .bb-swap small{font-size:clamp(calc(.68rem * 17 / 19),calc(var(--u) * .27),.8rem)}:root[data-text-size=large] .bb-rows-text{font-size:clamp(calc(.74rem * 17 / 19),calc(var(--u) * .29),.85rem)}