html[data-theme=dark] body:has(:is(#homePage,#connectionPage):not([hidden])) .shell { width:min(1560px,calc(100% - 36px)); padding:4px 0 10px; }
html[data-theme=dark] body:has(:is(#homePage,#connectionPage):not([hidden])) .shell>header { min-height:58px; gap:10px; padding-bottom:4px; }
html[data-theme=dark] body:has(:is(#homePage,#connectionPage):not([hidden])) .shell>header .brand { flex-basis:190px; }
html[data-theme=dark] body:has(:is(#homePage,#connectionPage):not([hidden])) .brand .theme-logo { width:190px; height:50px; }
html[data-theme=dark] body:has(:is(#homePage,#connectionPage):not([hidden])) .main-nav a { padding:14px 9px; }
html[data-theme=dark] body:has(:is(#homePage,#connectionPage):not([hidden])) footer { padding-top:5px; margin-top:4px; font-size:9px; }
html[data-theme=dark] #homePage { padding-top:8px; }
html[data-theme=dark] #homePage .city-heading { padding-bottom:8px; }
html[data-theme=dark] #homePage .city-history { padding:6px 0; }
html[data-theme=dark] #homePage .city-hit-outline { display:none; }
html[data-theme=dark] #homePage .city-sign { overflow:visible; }
html[data-theme=dark] #homePage .city-light { display:block; position:absolute; inset:0; width:100%; height:100%; pointer-events:none; mix-blend-mode:screen; opacity:.035; mask-image:radial-gradient(ellipse at center,#000 48%,transparent 76%); animation:neon-shimmer 19s 2s infinite; }
html[data-theme=dark] #homePage .city-record .city-light { animation-delay:7s; }
html[data-theme=dark] #homePage .city-records .city-light { animation-delay:12s; }
html[data-theme=dark] #homePage .city-tuner .city-light { animation-delay:16s; }
html[data-theme=dark] #homePage .city-notice .city-light { animation-delay:10s; }
html[data-theme=dark] #homePage .city-sign:hover .city-light,
html[data-theme=dark] #homePage .city-sign:focus-visible .city-light,
html[data-theme=dark] #homePage .city-notice summary:hover .city-light,
html[data-theme=dark] #homePage .city-notice summary:focus-visible .city-light { animation:none; opacity:.38; filter:brightness(1.15); }
html[data-theme=dark] #homePage .city-notice summary:hover { background:none; box-shadow:none; }
html[data-theme=dark] #homePage .city-sign:focus-visible::after { content:""; position:absolute; width:7px; height:7px; border-radius:50%; left:50%; bottom:0; background:#e0f6ff; box-shadow:0 0 8px #83c5d8; }
html[data-theme=dark] #homePage .city-logo-light { position:absolute; left:8%; top:7%; width:29%; height:25%; pointer-events:none; }
html[data-theme=dark] #homePage .city-logo-light .city-light { animation:none; opacity:.06; }
@keyframes neon-shimmer { 0%,83%,90%,100% { opacity:.035; } 84%,87% { opacity:.12; } 85.5%,88.5% { opacity:.015; } }

html[data-theme=dark] #connectionPage { padding-top:8px; }
html[data-theme=dark] #connectionPage .record-page-title { margin:0 0 19px; font-size:12px; }
html[data-theme=dark] #connectionPage :is(.studio-tuner,.studio-metro,.studio-transport,.studio-console,.studio-history) { padding:19px 18px 8px; }
html[data-theme=dark] #connectionPage :is(.tuner-label,.studio-metro h2,.studio-transport h2,.mixer-title h2,.take-heading h2) { top:-13px; left:18px; font-size:16px; padding:3px 12px 5px; line-height:1.3; }
html[data-theme=dark] #connectionPage :is(.studio-tuner,.studio-metro,.studio-transport,.studio-console,.studio-history)::before { animation:panel-spark 23s var(--power-delay) infinite; }
@keyframes panel-spark { 0%,89%,94%,100% { opacity:.6; box-shadow:none; } 90%,92% { opacity:1; box-shadow:0 0 9px var(--sign-glow),inset 0 0 6px var(--sign-glow); } 91%,93% { opacity:.4; box-shadow:none; } }
html[data-theme=dark] #connectionPage .panel-help { position:absolute; top:-12px; right:14px; width:26px; height:26px; min-height:0; padding:0; border:1px solid var(--sign-color); border-radius:50%; color:#c7d4e4; background:#091019; font:14px/1 'Segoe UI',sans-serif; box-shadow:none; z-index:2; }
html[data-theme=dark] #connectionPage .panel-help:hover { background:#1c2b38; }
html[data-theme=dark] #connectionPage .hero { min-height:0; }
html[data-theme=dark] #connectionPage .note-stage { min-height:90px; grid-template-columns:80px minmax(0,1fr); grid-template-rows:0 20px 36px 22px; gap:0 18px; }
html[data-theme=dark] #connectionPage .note { font-size:48px; }
html[data-theme=dark] #connectionPage .octave { font-size:13px; }
html[data-theme=dark] #connectionPage .frequency { font-size:12px; }
html[data-theme=dark] #connectionPage .cents-row { margin-top:0; }
html[data-theme=dark] #connectionPage .control-panel { margin-top:5px; gap:8px; }
html[data-theme=dark] #connectionPage :is(.device-field select,#startButton) { min-height:34px; padding:6px 9px; }
html[data-theme=dark] #connectionPage .device-field>span { margin-bottom:3px; font-size:10px; }
html[data-theme=dark] #connectionPage .connection-details { margin-top:4px; }
html[data-theme=dark] #connectionPage .connection-details summary { font-size:10px; }
html[data-theme=dark] #connectionPage .connection-details[open] { position:relative; z-index:3; }
html[data-theme=dark] #connectionPage .connection-details[open] .connection-options { position:absolute; top:100%; left:0; right:0; padding:14px; background:#0b141f; border:1px solid #536c7e; border-radius:6px; box-shadow:0 8px 25px #000b; }
html[data-theme=dark] #connectionPage .studio-top { gap:20px; }
html[data-theme=dark] #connectionPage .studio-metro { gap:8px 16px; }
html[data-theme=dark] #connectionPage .bpm-control input { font-size:46px; width:84px; }
html[data-theme=dark] #connectionPage .bpm-control button { min-height:34px; }
html[data-theme=dark] #connectionPage .metro-options { gap:6px; }
html[data-theme=dark] #connectionPage .metro-options select { min-height:32px; padding:5px 9px; }
html[data-theme=dark] #connectionPage #metroButton { min-height:34px; }
html[data-theme=dark] #connectionPage .beat-dots { margin-bottom:11px; }
html[data-theme=dark] #connectionPage .beat-dots i { width:17px; height:17px; flex-basis:17px; }
html[data-theme=dark] #connectionPage .beat-dots i::after { top:20px; }
html[data-theme=dark] #connectionPage .recorder-card { padding:0; margin:0; border:0; background:none; }
html[data-theme=dark] #connectionPage .studio-transport { margin-top:20px; gap:8px 18px; grid-template-columns:minmax(150px,.7fr) minmax(220px,1fr) minmax(260px,1.45fr); }
html[data-theme=dark] #connectionPage #recordTime { font-size:32px; overflow-wrap:anywhere; }
html[data-theme=dark] #connectionPage #recordTime.recording { font-size:24px; }
html[data-theme=dark] #connectionPage .source-statuses { padding-left:12px; gap:6px; }
html[data-theme=dark] #connectionPage .source-statuses strong { padding:4px 8px; }
html[data-theme=dark] #connectionPage .capture-actions { gap:8px; }
html[data-theme=dark] #connectionPage .capture-actions button { min-height:36px; padding:7px 10px; flex:0 1 auto; }
html[data-theme=dark] #connectionPage .tab-signal { grid-column:2; max-width:none; }
html[data-theme=dark] #connectionPage :is(.recording-control-hint,#tabSourceDetail,.meter-legend,#mixerMode,.status-grid) { display:none; }
html[data-theme=dark] #connectionPage .studio-bottom { margin-top:20px; gap:20px; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); }
html[data-theme=dark] #connectionPage .mixer-title { margin:0; min-height:0; }
html[data-theme=dark] #connectionPage .mixer { padding-top:4px; }
html[data-theme=dark] #connectionPage .mixer-channel { gap:4px; padding-inline:12px; }
html[data-theme=dark] #connectionPage .strip-name { font-size:12px; }
html[data-theme=dark] #connectionPage .fader-readout { font-size:20px; margin-bottom:5px; }
html[data-theme=dark] #connectionPage .mixer-channel .fader-well { height:108px; min-height:108px; margin-bottom:20px; }
html[data-theme=dark] #connectionPage .mixer-channel .fader-well input[type=range] { height:108px; }
html[data-theme=dark] #connectionPage .mixer-channel .mute-button { min-height:28px; padding:4px 8px; }
html[data-theme=dark] #connectionPage .monitor-setting { padding-top:7px; margin-top:8px; }
html[data-theme=dark] #connectionPage .take-heading { min-height:12px; margin-bottom:6px; padding-right:40px; }
html[data-theme=dark] #connectionPage #takeList { min-height:78px; max-height:112px; overflow-y:auto; scrollbar-width:thin; }
html[data-theme=dark] #connectionPage #takeList>p { min-height:78px; font-size:12px; }
html[data-theme=dark] #connectionPage .take-row { margin:3px 0; }
html[data-theme=dark] #connectionPage .take-row button { min-height:30px; padding:6px 10px; font-size:11px; border-radius:4px; }
html[data-theme=dark] #connectionPage .take-row button:first-child::before { content:'♫'; margin-right:8px; color:#a6b9cd; }
html[data-theme=dark] #connectionPage .take-row.selected button:first-child { border-left:3px solid #8dbdc7; background:#14232f; }
html[data-theme=dark] #connectionPage .take-more { position:absolute; top:24px; right:18px; margin:0; padding:0; border:0; background:none; z-index:3; }
html[data-theme=dark] #connectionPage .take-more summary { cursor:pointer; padding:2px 8px; min-height:24px; list-style:none; color:#bccada; }
html[data-theme=dark] #connectionPage .take-more summary::-webkit-details-marker { display:none; }
html[data-theme=dark] #connectionPage .take-more .take-actions { position:absolute; right:0; top:100%; width:220px; padding:10px; background:#101a27; border:1px solid #52657b; border-radius:5px; box-shadow:0 8px 25px #000b; }
html[data-theme=dark] #connectionPage .take-actions button { display:block; width:100%; padding:10px; margin:3px 0; text-align:left; font-size:12px; }
html[data-theme=dark] #connectionPage .playback-mode { margin-top:6px; gap:6px; }
html[data-theme=dark] #connectionPage .playback-mode button { min-height:26px; padding:4px 12px; font-size:11px; }
html[data-theme=dark] #connectionPage #playbackStatus { margin:4px 0; font-size:11px; line-height:1.3; }
html[data-theme=dark] #connectionPage #playbackStatus:empty { display:none; }
html[data-theme=dark] #connectionPage .recording-timeline { padding:7px 10px; margin:6px 0; }
html[data-theme=dark] #connectionPage .recording-timeline>div { font-size:10px; }
html[data-theme=dark] #connectionPage .recording-timeline #recordingSeek { height:20px; margin-top:3px; }
html[data-theme=dark] #connectionPage .playback-actions { margin-top:6px; gap:6px; }
html[data-theme=dark] #connectionPage .playback-actions button { min-height:32px; min-width:38px; padding:5px 12px; }
html[data-theme=dark] #connectionPage button[data-ui-icon],
html[data-theme=dark] #connectionPage button[data-ui-icon] span { font-size:0!important; }
html[data-theme=dark] #connectionPage button[data-ui-icon]::before { content:attr(data-ui-icon); font:500 20px/1 'Segoe UI Symbol','Segoe UI',sans-serif; vertical-align:middle; }
html[data-theme=dark] #connectionPage :is(#recordButton,#stopRecordButton)::before { font-size:14px; }
html[data-theme=dark] #connectionPage :is(#recordStatus,#playbackStatus) { overflow-wrap:anywhere; }
html[data-theme=dark] #connectionPage #recordStatus { margin:7px 0 0; min-height:0; }
html[data-theme=dark] #connectionPage #recordStatus:empty { display:none; }
html[data-theme=dark] #connectionPage #recordStatus:not(:empty) { padding:7px 10px; font-size:11px; }
.studio-help-dialog { width:min(540px,calc(100% - 32px)); max-height:80dvh; padding:28px; border:1px solid #607e93; border-radius:10px; background:#0b1420; color:#d5e2ef; box-shadow:0 20px 70px #000a; }
.studio-help-dialog::backdrop { background:#01050ac9; }
.studio-help-dialog h2 { font-size:18px; margin:0 32px 20px 0; }
.studio-help-dialog p { font-size:14px; line-height:1.8; margin:12px 0; }
.studio-help-dialog .studio-help-current { border-left:2px solid #658ba4; padding-left:12px; color:#a9c0d5; font-size:12px; }
.studio-help-dialog button { min-height:36px; background:#142638; color:#d5e2ef; border:1px solid #65849c; border-radius:5px; padding:7px 12px; }
.studio-help-dialog .studio-help-close { position:absolute; right:14px; top:14px; min-width:32px; padding:0; font-size:24px; }
.studio-help-dialog button:focus-visible { outline:2px solid #d6f5ff; outline-offset:4px; }
body.neon-motion-paused .city-light,
body.neon-motion-paused :is(.studio-tuner,.studio-metro,.studio-transport,.studio-console,.studio-history)::before { animation-play-state:paused!important; }
@media(min-width:1180px) {
  html[data-theme=dark] body:has(:is(#homePage,#connectionPage):not([hidden])) .shell>header .global-state { order:0; flex-basis:auto; max-width:250px; padding:0; }
}
@media(max-width:1100px) {
  html[data-theme=dark] #connectionPage .studio-top { grid-template-columns:1fr 1fr; }
  html[data-theme=dark] #connectionPage .control-panel { grid-template-columns:minmax(0,1fr) auto; }
  html[data-theme=dark] #connectionPage .level-box { grid-column:1/-1; padding:0; border:0; }
  html[data-theme=dark] #connectionPage .studio-transport { grid-template-columns:140px 1fr; }
  html[data-theme=dark] #connectionPage .capture-actions { grid-column:1/-1; }
  html[data-theme=dark] #connectionPage .tab-signal { grid-column:2; }
}
@media(max-width:800px) {
  html[data-theme=dark] #connectionPage .studio-top,html[data-theme=dark] #connectionPage .studio-bottom { grid-template-columns:1fr; gap:24px; }
  html[data-theme=dark] #connectionPage .note-stage { grid-template-columns:70px minmax(0,1fr); }
  html[data-theme=dark] #connectionPage .mixer-channel { padding-inline:7px; }
  html[data-theme=dark] #connectionPage .studio-metro { min-height:175px; }
  html[data-theme=dark] #connectionPage .studio-transport { grid-template-columns:1fr; }
  html[data-theme=dark] #connectionPage .tab-signal { grid-column:1/-1; }
  html[data-theme=dark] #connectionPage .source-statuses { padding:0; border:0; }
}
@media(prefers-reduced-motion:reduce) {
  html[data-theme=dark] #homePage .city-light { animation:none; }
  html[data-theme=dark] #connectionPage :is(.studio-tuner,.studio-metro,.studio-transport,.studio-console,.studio-history)::before { animation:none; }
}