html body #music-screen{container-type:inline-size;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:max(14px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));border:0;border-radius:0;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,var(--theme-glow,#29467040),transparent 70%),var(--bg);color:var(--text)}
#music-screen[open]{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:12px}
.music-header{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
#music-screen h2{font:clamp(20px,2.5vw,60px)/1.15 Georgia,serif;padding:0;min-width:0;overflow-wrap:anywhere;flex:1}
#music-screen .btn{width:clamp(48px,4vw,96px);height:clamp(48px,4vw,96px);min-width:48px;min-height:48px;padding:4px;margin:0;flex-shrink:0}
#music-screen #music-close{position:static}
#music-screen #music-help{width:auto;max-width:140px;height:auto;min-height:48px;padding:6px 10px;gap:6px;font-size:14px;line-height:1.2}
.music-stage{display:grid;grid-template-rows:minmax(0,1fr) auto;min-width:0;min-height:0}
#music-sky{display:block;width:100%;height:100%;min-width:0;min-height:0;touch-action:none;user-select:none;-webkit-touch-callout:none;border-radius:18px;outline-offset:-3px}
#music-sky:focus-visible{outline:2px solid var(--accent)}
#music-word{font:clamp(24px,3vw,68px)/1.2 Georgia,serif;text-align:center;color:var(--accent);margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.music-panel{display:grid;justify-items:center;gap:10px;min-width:0}
.music-guide{font-size:clamp(14px,1.25vw,28px);line-height:1.4;color:var(--muted);max-width:100%;padding:6px 0}
.music-guide p+p{margin-top:4px}
.music-volume-control{display:grid;justify-items:center;gap:2px;max-width:100%}
.music-volume-control label{margin:0;font-size:clamp(14px,1.2vw,26px);color:var(--muted)}
#music-screen #music-close .close-star-art{display:none}
#music-screen #music-close[data-icon]::before{display:block;background-image:url('/assets/action-icons-arcana.png');background-size:400% 400%;background-position:0 66.666667%;background-color:transparent;mask:none;-webkit-mask:none;filter:none}
.music-controls{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;max-width:100%}
#music-screen .btn[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 18px var(--theme-glow,#aecfff50)}
#music-screen #music-record[aria-pressed=true]{border-color:#f4a6ac;box-shadow:0 0 18px #f4a6ac50}
#music-volume{width:min(300px,100%);max-width:65vw;height:48px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;accent-color:var(--accent)}
#music-volume::-webkit-slider-runnable-track{height:6px;background:#6e88b670;border-radius:8px}
#music-volume::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:24px;height:24px;margin-top:-9px;border:2px solid var(--accent);background:var(--bg);border-radius:50%;box-shadow:0 0 10px var(--theme-glow,#aecfff50)}
#music-volume::-moz-range-track{height:6px;background:#6e88b670;border-radius:8px}
#music-volume::-moz-range-thumb{width:24px;height:24px;border:2px solid var(--accent);background:var(--bg);border-radius:50%}
#music-status{min-height:1.3em;font-size:clamp(16px,1.2vw,28px);color:var(--accent);text-align:center}
#music-screen [hidden]{display:none!important}
#music-screen .btn[data-icon]::before{width:clamp(28px,2.5vw,56px);height:clamp(28px,2.5vw,56px);flex-basis:clamp(28px,2.5vw,56px)}
.btn[data-icon=music]::before{background-image:url('/assets/action-icons-arcana.png');background-size:400% 400%;background-position:100% 66.666667%;mask:none;-webkit-mask:none}
#music-open{min-width:48px;min-height:48px;flex:none}
.collection-heading:has(#music-open:not([hidden])){flex-wrap:wrap}
.collection-heading:has(#music-open:not([hidden])) h1{flex:1 1 200px;min-width:0}
.collection-heading:has(#music-open:not([hidden]))>.btn{width:48px;height:48px;min-width:48px;flex:0 0 48px;padding:4px}
@media(max-width:600px){.collection-heading:has(#music-open:not([hidden])){justify-content:flex-end}.collection-heading:has(#music-open:not([hidden])) h1{flex-basis:100%}}
@media(orientation:landscape) and (max-height:600px){#music-screen[open]{grid-template-columns:minmax(0,1fr) minmax(250px,.6fr);grid-template-rows:auto auto minmax(0,1fr);gap:6px}.music-header,.music-guide{grid-column:1/-1}.music-guide{font-size:12px;line-height:1.2;padding:0}.music-guide p+p{margin-top:2px}.music-panel{align-self:center;gap:4px}.music-stage{height:100%}#music-screen h2{font-size:20px}#music-word{font-size:22px}#music-status:empty{display:none}.music-controls{gap:6px}}
@media(horizontal-viewport-segments:2){#music-screen[open]{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);column-gap:calc(env(viewport-segment-left 1 0) - env(viewport-segment-right 0 0) + 32px)}.music-header{grid-column:2;grid-row:1}.music-stage{grid-column:1;grid-row:1/3}.music-panel{grid-column:2;grid-row:2;align-self:center}}
@media(vertical-viewport-segments:2){#music-screen[open]{grid-template-rows:auto minmax(0,1fr) minmax(0,1fr);row-gap:calc((env(viewport-segment-top 0 1) - env(viewport-segment-bottom 0 0))/2 + 12px)}}