@layer pages{.breakout-sound{--sound-accent:var(--breakout-accent);gap:var(--space-xs);grid-template-rows:auto auto minmax(0,1fr) auto;min-height:0;display:grid;position:relative}.breakout-sound[data-sound-mode=se]{--sound-accent:var(--breakout-signal)}.breakout-sound :where(button,select){min-width:0;min-height:var(--breakout-touch-control-height);border:1px solid var(--breakout-rule);border-radius:var(--breakout-ui-radius);background:var(--breakout-paper);padding:var(--space-xs);color:var(--breakout-ink);font:700 var(--font-size-xs) / 1.2 var(--font-body);cursor:pointer}.breakout-sound :where(button,select,input):focus-visible{outline:2px solid var(--sound-accent);outline-offset:2px}.breakout-sound button:disabled{opacity:.5;cursor:wait}.breakout-sound-tabs{border:0;border-bottom:1px solid var(--breakout-rule);grid-template-columns:1fr 1fr;min-width:0;margin:0;padding:0;display:grid;position:relative}.breakout-sound-tabs:after{background:var(--sound-accent);content:"";width:50%;height:3px;transition:transform .22s,background .22s;position:absolute;inset:auto auto -1px 0}.breakout-sound[data-sound-mode=se] .breakout-sound-tabs:after{transform:translate(100%)}.breakout-sound-tabs button{min-height:var(--breakout-compact-control-size);justify-content:center;align-items:center;gap:var(--space-xs);color:var(--breakout-muted);letter-spacing:.12em;background:0 0;border:0;display:flex}.breakout-sound-tabs button[aria-pressed=true]{color:var(--sound-accent)}.breakout-sound-tabs span{font-size:var(--font-size-2xs);letter-spacing:0}.breakout-sound-deck{min-width:0;padding:var(--space-xs);border:1px solid var(--breakout-rule);border-radius:var(--breakout-ui-shell-radius);background:var(--breakout-panel);box-shadow:inset 0 2px var(--sound-accent)}.breakout-sound-status,.breakout-sound-meta{justify-content:space-between;align-items:center;gap:var(--space-xs);color:var(--breakout-muted);font-size:var(--font-size-2xs);font-variant-numeric:tabular-nums;display:flex}.breakout-sound-status{letter-spacing:.08em}.breakout-sound-status>span:first-child{align-items:center;gap:var(--space-xs);display:flex}.breakout-sound-status>span:first-child:before{width:var(--space-2xs);height:var(--space-2xs);border:1px solid var(--breakout-muted);content:"";border-radius:50%}.breakout-sound-status>[data-playing]{color:var(--sound-accent)}.breakout-sound-status>[data-playing]:before{background:currentColor;border-color:currentColor}.breakout-sound-title{margin:var(--space-2xs) 0;color:var(--breakout-ink);font-size:var(--font-size-base);overflow-wrap:anywhere;line-height:1.3}.breakout-sound-meta{margin:0;margin-bottom:var(--space-2xs);line-height:1.3}.breakout-sound-meta span{color:var(--sound-accent);flex-shrink:0}.breakout-sound-score{gap:var(--space-xs);background:var(--breakout-game-field);border:1px solid var(--breakout-rule);padding:var(--space-2xs);grid-template-columns:minmax(0,1fr) auto;display:grid}.breakout-sound-score canvas{width:100%;height:var(--breakout-sound-score-height);font:700 var(--font-size-2xs) / 1 var(--font-body)}.breakout-sound-channels{align-content:center;gap:var(--space-2xs);border:0;grid-template-columns:1fr 1fr;margin:0;padding:0;display:grid}.breakout-sound-channels button{width:var(--breakout-sound-channel-size);min-height:var(--breakout-sound-channel-size);color:var(--breakout-muted);padding:0}.breakout-sound-channels [data-channel=A]{--channel-color:var(--breakout-sound-channel-a)}.breakout-sound-channels [data-channel=B]{--channel-color:var(--breakout-sound-channel-b)}.breakout-sound-channels [data-channel=C]{--channel-color:var(--breakout-sound-channel-c)}.breakout-sound-channels [data-channel=D]{--channel-color:var(--breakout-sound-channel-d)}.breakout-sound-channels [aria-pressed=true]{border-color:var(--channel-color);color:var(--channel-color);background:var(--breakout-panel)}.breakout-sound-seek{align-items:center;gap:var(--space-xs);color:var(--breakout-muted);font-size:var(--font-size-2xs);font-variant-numeric:tabular-nums;grid-template-columns:auto minmax(0,1fr) auto;display:grid}.breakout-sound input[type=range]{width:100%;min-width:0;height:var(--breakout-sound-slider-height);accent-color:var(--sound-accent);cursor:pointer;margin:0}.breakout-sound-transport{grid-template-columns:var(--breakout-touch-control-height) minmax(0, 1fr) var(--breakout-touch-control-height) auto;gap:var(--space-2xs);display:grid}.breakout-sound[data-sound-mode=se] .breakout-sound-transport{grid-template-columns:var(--breakout-touch-control-height) minmax(0, 1fr) var(--breakout-touch-control-height)}.breakout-sound-transport button{min-height:var(--breakout-compact-control-size)}.breakout-sound-transport .breakout-sound-play{border-color:var(--sound-accent);background:var(--sound-accent);color:var(--breakout-action-ink)}.breakout-sound-extra[aria-pressed=true]{border-color:var(--sound-accent);color:var(--sound-accent)}.breakout-sound-library{grid-template-rows:auto minmax(0,1fr);min-height:0;display:grid;position:relative}.breakout-sound-library-heading{padding-bottom:var(--space-2xs);border-bottom:1px solid var(--breakout-rule);justify-content:space-between;align-items:center;display:flex}.breakout-sound-library h3{color:var(--breakout-muted);font-size:var(--font-size-2xs);letter-spacing:.12em;margin:0;font-weight:400}.breakout-sound-library select{min-height:var(--breakout-compact-control-size);max-width:60%;padding-block:var(--space-2xs);color:var(--sound-accent)}.breakout-sound-list{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--sound-accent) var(--breakout-game-field);min-height:0;padding-bottom:var(--space-xl);position:relative;overflow-y:auto}.breakout-sound-list button{align-items:center;gap:var(--space-xs);border:0;border-bottom:1px solid var(--breakout-rule);width:100%;padding:var(--space-xs) var(--space-sm);text-align:left;background:0 0;border-radius:0;grid-template-columns:auto minmax(0,1fr) auto;display:grid}.breakout-sound-list button[aria-pressed=true]{background:var(--breakout-panel);box-shadow:inset 3px 0 var(--sound-accent)}.breakout-sound-list button:focus-visible{outline-offset:-2px}.breakout-sound-index,.breakout-sound-row-end{color:var(--breakout-muted);font-size:var(--font-size-2xs);font-variant-numeric:tabular-nums;font-weight:400}.breakout-sound-entry{gap:var(--space-2xs);min-width:0;display:grid}.breakout-sound-entry strong{font-size:var(--font-size-sm);overflow-wrap:anywhere;line-height:1.2}.breakout-sound :where(.breakout-sound-entry,.breakout-sound-row-end) small{color:var(--breakout-muted);font-size:var(--font-size-2xs);font-weight:400;display:block}.breakout-sound-list [aria-pressed=true] :where(strong,.breakout-sound-index,.breakout-sound-cue){color:var(--sound-accent)}.breakout-sound-row-end{text-align:right}.breakout-sound-more{bottom:0;right:var(--space-sm);align-items:center;gap:var(--space-xs);min-height:var(--breakout-scroll-hint-height);padding:var(--space-2xs) var(--space-sm);border-color:var(--sound-accent);border-radius:var(--breakout-ui-shell-radius) var(--breakout-ui-shell-radius) 0 0;background:var(--breakout-panel);color:var(--sound-accent);display:flex;position:absolute}.breakout-sound-more span:last-child{font-size:var(--font-size-base);animation:1.3s ease-in-out infinite breakoutSoundMore}.breakout-sound-volume{align-items:center;gap:var(--space-xs);border-top:1px solid var(--breakout-rule);padding-top:var(--space-2xs);color:var(--breakout-muted);font-size:var(--font-size-2xs);font-variant-numeric:tabular-nums;grid-template-columns:auto auto minmax(0,1fr) 3ch;display:grid}.breakout-sound-volume button{min-height:var(--breakout-compact-control-size);width:var(--breakout-compact-control-size);border:0}.breakout-sound-volume output{text-align:right}.breakout-sound-error{inset:auto 0 var(--breakout-touch-control-height);padding:var(--space-xs);border:1px solid var(--sound-accent);background:var(--breakout-panel);color:var(--breakout-ink);font-size:var(--font-size-xs);margin:0;position:absolute}.breakout-sound [hidden]{display:none}@keyframes breakoutSoundMore{50%{transform:translateY(2px)}}@container breakout-menu (height<480px){.breakout-sound-status,.breakout-sound-meta{display:none}.breakout-sound-list button{min-height:var(--breakout-compact-control-size)}.breakout-sound{gap:var(--space-xs)}.breakout-sound-tabs button{min-height:var(--breakout-compact-control-size)}.breakout-sound-deck{padding:var(--space-xs)}.breakout-sound-score canvas{height:var(--breakout-sound-score-compact-height)}.breakout-sound-entry small,.breakout-sound-row-end small{display:none}}@container breakout-menu (height<420px){.breakout-sound-score canvas{display:none}.breakout-sound-score{display:block}.breakout-sound-channels{justify-content:flex-end;align-items:center;display:flex}.breakout-sound-channels:before{content:"CHANNELS";color:var(--breakout-muted);font-size:var(--font-size-2xs);margin-right:auto}}@media (prefers-reduced-motion:reduce){.breakout-sound-tabs:after{transition:none}.breakout-sound-more span:last-child{animation:none}}}