/* be014714 的三类窗口材质；真实控件与谱面内容继续由各模块提供。 */
.workbench-v2 { --window-header-bottom:114px; --window-drawer-width:420px; }
:is(.tempo-panel,.transpose-popover,.score-track-panel,.import-panel),:is(#appearance-panel,#account-panel) { background:var(--material-paper); border-color:var(--material-line); box-shadow:0 2px 5px #263b3010,0 14px 36px #263b301a; }
:is(.tempo-panel,.transpose-popover) { border-radius:14px; opacity:0; translate:0 -6px; transition:opacity 140ms ease,translate 140ms ease,display 140ms allow-discrete; }
:is(.tempo-panel,.transpose-popover):not([hidden]) { opacity:1; translate:0 0; transition-duration:220ms; transition-timing-function:cubic-bezier(.2,.8,.25,1.08); }
:is(.tempo-panel,.transpose-popover)[hidden] { pointer-events:none; }
.tempo-panel { padding:22px; font-size:14px; }
.tempo-panel header strong { font-size:20px; }
.tempo-panel p { font-size:12px; line-height:1.6; }
.window-close { display:grid; place-items:center; flex:none; min-width:44px; min-height:44px; padding:6px; border:0; border-radius:9px; background:transparent; color:var(--material-green); font-size:24px; line-height:1; }
.window-close:hover { background:var(--material-soft); filter:none; }
.tempo-panel header { gap:8px; }
.tempo-panel header span { margin-left:auto; }
.workbench-v2>.transpose-popover { padding-top:20px; }
.transpose-popover>.window-close { float:right; margin:-10px -10px 0 0; }
.score-track-panel { inset:var(--window-header-bottom) 12px 84px auto; width:min(var(--window-drawer-width),calc(100vw - 24px)); height:auto; max-height:none; padding:0 24px 12px; border-radius:12px; box-shadow:-4px 0 18px #263b3010,0 2px 5px #263b300c; font-size:14px; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--material-line) transparent; opacity:0; translate:24px 0; transition:opacity 180ms ease,translate 180ms ease,display 180ms allow-discrete,overlay 180ms allow-discrete; }
.score-track-panel[data-window-open=true] { opacity:1; translate:0 0; transition-duration:260ms; transition-timing-function:cubic-bezier(.2,.75,.25,1); }
.score-track-panel::backdrop { inset:var(--window-header-bottom) calc(min(var(--window-drawer-width),100vw - 24px) + 12px) 84px auto; width:12px; background:transparent; pointer-events:none; -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); -webkit-mask-image:linear-gradient(to left,#000,transparent); mask-image:linear-gradient(to left,#000,transparent); }
.score-track-panel>header { position:sticky; top:0; z-index:1; margin:0; padding:16px 0; background:var(--material-paper); border-color:var(--material-line); grid-template-columns:85px minmax(0,1fr) 44px; }
.score-track-panel>header strong { font-size:22px; font-weight:600; }
.score-track-panel [data-track-close] { width:44px; height:44px; }
.score-track-panel .track-display-items { flex-wrap:wrap; width:100%; }
/* 内部轨道表格仍是正式原布局，较窄侧窗可横向滚动。 */
.score-track-panel>.track-columns,.score-track-panel .track-group { min-width:360px; }
:is(.workbench-v2:fullscreen,.v2-fullscreen) .score-track-panel { top:12px; }
:is(.workbench-v2:fullscreen,.v2-fullscreen) .score-track-panel::backdrop { top:12px; }
:is(#appearance-panel,#account-panel),.import-panel { opacity:0; translate:0 8px; scale:.985; border-radius:16px; box-shadow:0 2px 8px #182b2214,0 24px 70px #182b2233; transition:opacity 180ms ease,translate 180ms ease,scale 180ms ease,display 180ms allow-discrete,overlay 180ms allow-discrete; }
:is(#appearance-panel,#account-panel)[open],.import-layer[open] .import-panel { opacity:1; translate:0 0; scale:1; transition-duration:280ms; transition-timing-function:cubic-bezier(.2,.8,.25,1.04); }
:is(#appearance-panel,#account-panel)::backdrop { background:#21352a24; backdrop-filter:blur(5px); opacity:0; transition:opacity 180ms ease,display 180ms allow-discrete,overlay 180ms allow-discrete; }
:is(#appearance-panel,#account-panel)[open]::backdrop { opacity:1; transition-duration:240ms; }
.import-layer { padding:24px; }
.import-panel { width:min(1000px,100%); max-height:calc(100dvh - 48px); background:var(--material-paper); animation:none; }
.import-scrim,.import-scrim:hover { background:#21352a24; backdrop-filter:blur(5px); opacity:0; transition:opacity 180ms ease; }
.import-layer { transition:display 180ms allow-discrete,overlay 180ms allow-discrete; }
.import-layer[open] .import-scrim { opacity:1; transition-duration:240ms; }
.import-discard { flex:none; margin:0 24px 12px; padding:16px; border:1px solid #cdb98d; border-radius:12px; background:#fff8e9; }
.import-discard p { margin:0 0 12px; color:#775b2b; font-size:13px; }
.import-discard>div { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
.import-discard button { min-height:44px; border-radius:9px; }
:root[data-night=true] .import-discard { background:#393327; border-color:#7b6b4b; }
:root[data-night=true] .import-discard p { color:#cdb889; }
@starting-style {
  :is(.tempo-panel,.transpose-popover):not([hidden]) { opacity:0; translate:0 -8px; }
  .score-track-panel[data-window-open=true] { opacity:0; translate:24px 0; }
  :is(#appearance-panel,#account-panel)[open],.import-layer[open] .import-panel { opacity:0; translate:0 8px; scale:.985; }
  :is(#appearance-panel,#account-panel)[open]::backdrop,.import-layer[open] .import-scrim { opacity:0; }
}
@media(max-width:600px) {
  .score-track-panel { padding-inline:18px; bottom:84px; }
  .score-track-panel>header { grid-template-columns:minmax(0,1fr) 44px; }
  .import-layer { padding:12px; }
  .import-panel { max-height:calc(100dvh - 24px); }
}
:root[data-reduced-motion=true] :is(.tempo-panel,.transpose-popover,.score-track-panel,#appearance-panel,#account-panel,.import-panel) { transition:none!important; translate:none!important; scale:1!important; }
:root[data-reduced-motion=true] :is(#appearance-panel,#account-panel)::backdrop,:root[data-reduced-motion=true] .import-scrim { backdrop-filter:none; transition:none!important; }
@media(prefers-reduced-motion:reduce) {
  :is(.tempo-panel,.transpose-popover,.score-track-panel,#appearance-panel,#account-panel,.import-panel) { transition:none!important; translate:none!important; scale:1!important; }
  :is(#appearance-panel,#account-panel)::backdrop,.import-scrim { backdrop-filter:none; transition:none!important; }
}