/* AuraSpektra AP-UX03 · Desktop / Mobile / Guide Polish
   Append-only overrides: existing DSP, routing, pad geometry, themes remain intact. */

/* Persistent 'no autosave' warnings are gone. Onboarding and the Archive
   remain the deliberate places for explaining session persistence. */
#apSessionInternal,.library-session-banner,#libraryLocationHint{display:none!important}
.ap-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%)}

/* One true page heading, no duplicate H1/H2 banner on every static view. */
.workspace-heading{min-height:0;padding:4px 4px 10px}
.workspace-heading h1{font-size:clamp(23px,2.7vw,32px);margin:1px 0 3px}
.workspace-heading p{font-size:12px;line-height:1.45}
.workspace-view>.workspace-card-title{position:relative;display:flex;align-items:center;gap:12px;padding:0 0 9px;margin-bottom:13px;min-height:32px}
.workspace-view>.workspace-card-title h2,.workspace-view>.workspace-card-title .view-kicker{display:none}
.workspace-view>.workspace-card-title p{flex:1;max-width:900px;font-size:12px;line-height:1.5;margin:0}
.workspace-view>.workspace-card-title .hfc-chapter-help{flex:none;float:none;margin:0 0 0 auto}
.workspace-view{min-height:0}

/* Capture: visible three-source choice + separate analysis confirmation. */
#view-capture .capture-hero{min-height:0;padding:12px 15px;gap:11px;margin-bottom:12px}
#view-capture .capture-hero-icon{width:42px;height:42px;flex:0 0 42px;font-size:23px}
#view-capture .capture-hero p{margin:3px 0 0;max-width:none}
#view-capture .capture-source-workflow{display:flex;flex-direction:column;align-items:stretch;gap:11px;padding:0}
#view-capture .capture-source-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;width:100%;align-items:stretch}
#view-capture .capture-source-option{min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:7px;padding:14px 12px;border:1px solid var(--ap-stroke-subtle,#425c62);background:var(--ap-panel-soft,#14222a);clip-path:var(--ap-cut-card)}
#view-capture .capture-source-option strong{color:var(--ap-headline);font:750 clamp(12px,1.2vw,16px) var(--ap-display),sans-serif;letter-spacing:.045em;line-height:1.2}
#view-capture .capture-source-option p{margin:0 0 5px;color:var(--ap-muted);font-size:12px;line-height:1.4;min-height:32px}
#view-capture .capture-source-step{font:700 10px/1.3 ui-monospace,monospace;color:var(--ap-accent)}
#view-capture .capture-source-option button,#view-capture .capture-source-option .filebutton{align-self:flex-start;min-height:40px;font-size:11px;padding:9px 12px;white-space:normal;text-align:center}
#view-capture .capture-source-option .filebutton{display:inline-flex}
#view-capture .capture-source-option #saveMic{margin-top:auto}
#view-capture #bundledSampleSelect{flex:0 1 auto;max-width:100%;width:100%;min-width:0;margin-top:auto;min-height:40px}
#view-capture .bundled-capture-source{flex:initial;border-top:1px solid var(--ap-stroke-subtle);padding-top:14px}
#view-capture .bundled-capture-source label:not(.ap-visually-hidden){display:none}
#view-capture .capture-analysis-step{display:flex;align-items:center;flex-wrap:wrap;gap:9px;border:1px solid var(--ap-stroke-subtle);background:var(--ap-panel);padding:12px 14px;width:100%}
#view-capture .capture-analysis-step #analyze{min-height:41px;padding:9px 16px;font-size:12px}
#view-capture .capture-analysis-step .detail{flex:1 1 190px;font-size:12px;white-space:normal;min-width:0}
#view-capture .capture-tech-note{width:100%;border-top:1px solid var(--ap-stroke-subtle);padding:9px 0;margin-top:0;color:var(--ap-muted);font-size:11px}
#view-capture .capture-tech-note summary{cursor:pointer;letter-spacing:.05em;color:var(--ap-accent);font-weight:650}
#view-capture .capture-tech-note p{margin:7px 0 0;line-height:1.5}
#view-capture>.workspace-hint{margin-top:9px;font-size:11px}

/* Helpful empty states, without hiding or disabling research controls. */
.ap-empty-state,.ap-pad-empty,.ap-sequencer-empty{border:1px solid var(--ap-stroke-subtle);border-left:3px solid var(--ap-accent);background:var(--ap-panel-soft);color:var(--ap-muted);padding:12px 15px;margin:0 0 12px;line-height:1.45;font-size:12px}
.ap-empty-state strong,.ap-pad-empty strong{display:block;color:var(--ap-headline);font-size:13px;margin-bottom:4px;letter-spacing:.04em}
.ap-empty-state span,.ap-pad-empty span{display:block}
.ap-empty-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:10px}
.ap-empty-actions button{min-height:34px;padding:7px 11px;font-size:11px}
#view-spectral .controls label{min-width:112px}
#view-spectral .controls select{min-height:38px}
#view-spectral .lab-subhead{margin-top:16px}
#view-spectral .nav-spectral-panel .fineprint{line-height:1.55}

/* Sample editor: pad selection stays compact; waveform is the visual center. */
#view-editor .editor-selector{margin-bottom:10px!important;padding:12px!important}
#view-editor .editor-selector-head{margin-bottom:6px}
#view-editor .guide-kit-panel{padding:8px 10px;margin:4px 0 9px;gap:6px}
#view-editor .guide-kit-panel p{margin:2px 0;font-size:11px}
#view-editor .editor-selector-actions{margin-bottom:8px}
#view-editor .editor-select-hint{margin:7px 0 0;font-size:11px}
#view-editor .standalone-editor-host .pad-waveform-editor{border-color:var(--ap-stroke)}
#view-editor #padWaveformCanvas{height:clamp(145px,20vw,220px);display:block}
#view-editor .pad-waveform-viewport{min-height:145px}
#view-editor .standalone-editor-host .pad-edit-section{padding:13px!important}
#view-editor .pad-edit-actions{gap:7px}
#view-editor .pad-edit-actions :is(button,.filebutton,select){min-height:38px}

/* Performance pad: reclaim available stage, guide user's first action. */
#view-pads .pad-workbench{justify-content:center}
#view-pads .ap-pad-empty{flex:0 0 auto;max-width:650px;width:100%;box-sizing:border-box;align-self:center;padding:8px 12px;margin:2px auto}
#view-pads .ap-pad-empty .ap-empty-actions{margin-top:5px}
#view-pads .ap-pad-empty button{min-height:30px;padding:5px 10px}
#view-pads .pad-topline{gap:7px}
#view-pads .pad-performance-dock{gap:8px;scrollbar-width:thin}
#view-pads .pad-scale-source{white-space:normal;line-height:1.25}
@media(min-width:921px) and (min-height:801px){
 #view-pads .performance-grid,#view-pads .performance-grid.is-classic{width:min(100%,calc(100dvh - 215px),720px)!important;max-width:720px!important}
}

/* Sequencer: preserve the important bar/page actions, collapse expert tools on phones. */
.ap-sequencer-empty{font-size:11px;padding:6px 10px;margin:0 0 4px;flex:none}
.ap-sequencer-empty span{font-weight:800;color:var(--ap-accent)}
#rollToolsToggle{display:none}
#view-sequencer .roll-header-actions button{min-height:35px}

/* Export: make the complete mix the primary action and keep research optional. */
#view-export .export-grid{gap:12px}
#view-export .export-card{min-height:0;padding:17px}
#view-export .export-card:nth-child(1){grid-column:1;grid-row:1;border-color:var(--ap-stroke);background:var(--ap-panel-raised)!important}
#view-export .export-card:nth-child(2){grid-column:2;grid-row:1}
#view-export .export-card p{font-size:12px;line-height:1.5}
#view-export .export-card button{min-height:40px}
#view-export .export-research{margin-top:12px;padding:13px 17px}
#view-export .ap-export-advanced>summary{cursor:pointer;font:750 12px var(--ap-display),sans-serif;color:var(--ap-accent);padding:4px 0;letter-spacing:.05em}
#view-export .ap-export-advanced[open]>summary{margin-bottom:9px}
#view-export .export-research p{margin:0 0 9px}
#view-export .workspace-hint{font-size:11px}

/* Library: search is the hero, not a buried administrative function. */
#view-library .library-current{min-height:0;padding:12px;gap:12px}
#view-library .library-current-icon{width:45px;height:45px;flex:0 0 45px;font-size:24px}
#view-library .library-current-text h3{font-size:17px;margin:4px 0}
#view-library .library-current-text p{margin:0 0 7px}
#view-library .library-chips{gap:5px}
#view-library .library-chips span{padding:3px 6px}
#view-library .library-zip-actions{gap:8px;padding:12px;margin:8px 0}
#view-library .library-zip-message p{margin:2px 0;font-size:11px}
#view-library .bundled-browser{padding:15px;margin-top:10px}
#view-library .bundled-filters input{min-height:43px;font-size:13px}
#view-library .bundled-filters select{min-height:42px}
#view-library .bundled-entries{max-height:min(68vh,680px)}
#view-library .bundled-entries .library-item{gap:6px}
#view-library .bundled-browser>.detail:last-child{font-size:10px;line-height:1.4}

/* GUIDE-UX: consistently anchored target spotlight, including live interactions. */
.hfc-tour{pointer-events:none}
.hfc-tour .hfc-tour-block{pointer-events:auto}
.hfc-tour .hfc-tour-card{pointer-events:auto;max-height:min(48dvh,345px);padding:13px 15px!important;box-shadow:0 8px 36px #000d}
.hfc-tour .hfc-tour-card h2{font-size:clamp(15px,1.9vw,19px);line-height:1.25;margin:5px 0}
.hfc-tour .hfc-tour-card p{font-size:12px;line-height:1.47;margin:6px 0 9px}
.hfc-tour .hfc-tour-actions button{min-height:34px}
.hfc-tour .hfc-tour-focus{pointer-events:none}
.hfc-tour-inline-focus{outline-offset:2px!important}

/* MOBILE: content first, not a stacking of desktop title banners. */
@media(max-width:920px){
  .workspace-heading{padding:1px 2px 5px}
  .workspace-heading h1{font-size:clamp(19px,5vw,26px);margin:0 0 2px}
  .workspace-heading p{font-size:11px;line-height:1.35}
  .workspace-pill{display:none}
  .workspace-view{padding:clamp(9px,2.5vw,14px)}
  .workspace-view>.workspace-card-title{margin-bottom:9px;padding-bottom:6px}
  .workspace-view>.workspace-card-title p{display:none}
  .workspace-view>.workspace-card-title .hfc-chapter-help{margin-left:auto}
  #view-capture .capture-source-flow{grid-template-columns:1fr}
  #view-capture .capture-source-option{padding:10px 12px;gap:6px}
  #view-capture .capture-source-option p{min-height:0;margin:0}
  #view-capture .capture-source-option button,#view-capture .capture-source-option .filebutton{min-height:41px}
  #view-capture #bundledSampleSelect{min-width:0}
  #view-capture .capture-analysis-step{padding:9px 10px;gap:7px}
  #view-capture .capture-tech-note{font-size:10px}
  #view-editor .guide-kit-panel{padding:7px 9px}
  #view-editor .guide-kit-panel p{display:none}
  #view-editor .editor-select-hint{font-size:10px}
  #view-editor #padWaveformCanvas{height:160px}
  #view-export .export-grid{grid-template-columns:1fr}
  #view-export .export-card:nth-child(1),#view-export .export-card:nth-child(2){grid-column:auto;grid-row:auto}
  #view-export .export-card:nth-child(1){order:-1}
  #view-export .export-card{min-height:0;padding:13px}
  #view-export .export-card p{margin:6px 0 9px}
  #view-library{display:flex;flex-direction:column;gap:8px}
  #view-library[hidden]{display:none!important}
  #view-library>.workspace-card-title{order:0}
  #view-library>.bundled-browser{order:1;margin:0}
  #view-library>.library-current{order:2}
  #view-library>.library-zip-actions{order:4}
  #view-library>.library-browser:not(.bundled-browser){order:3}
  #view-library>.workspace-quick-actions{order:5}
  #view-library .bundled-entries{max-height:55dvh}
  #view-library .library-current{padding:9px 11px;gap:9px}
  #view-library .library-current-icon{display:none}
  #view-library .library-current-text h3{font-size:15px;margin:3px 0}
  #view-library .library-zip-message p{line-height:1.45}
  #view-library .library-zip-buttons{flex-direction:row;gap:7px}
  #view-library .library-zip-buttons button{min-height:38px;width:auto;flex:1 1 160px}
}
@media(max-width:680px){
  .hfc-tour .hfc-tour-card{width:calc(100vw - 20px);max-height:min(39dvh,285px);padding:10px 12px!important}
  .hfc-tour .hfc-tour-card h2{font-size:15px}
  .hfc-tour .hfc-tour-card p{font-size:11px;line-height:1.35}
  .hfc-tour .hfc-tour-actions{gap:4px}
  .hfc-tour .hfc-tour-actions button{font-size:10px;min-height:32px;padding:5px 8px}
  #view-sequencer #rollToolsToggle{display:block;width:max-content;flex:none;min-height:31px;margin:3px 0;padding:5px 9px;font-size:10px}
  body:not(.ap-roll-tools-open) #view-sequencer #rollAdvancedTools > :nth-child(n+6){display:none}
  #view-sequencer #rollAdvancedTools{flex:0 0 auto;min-height:34px}
  #view-sequencer .roll-header-actions button{min-height:33px}
  #view-pads .ap-pad-empty{padding:6px 8px;margin:2px auto;font-size:10px}
  #view-pads .ap-pad-empty strong{font-size:11px}
  #view-pads .ap-pad-empty span{display:none}
  #view-pads .ap-pad-empty button{font-size:10px;min-height:30px}
  #view-pads .performance-grid,#view-pads .performance-grid.is-classic{width:min(100%,calc(100dvh - 270px))!important}
  #view-pads .pad-performance-dock{max-width:100%;overflow-x:auto;justify-content:flex-start}
  #view-pads .pad-performance-dock button{font-size:10px;min-height:36px}
  #view-pads .pad-scale-source{font-size:10px}
}
@media (orientation:landscape) and (max-height:800px){
 #view-pads .ap-pad-empty{display:none!important} /* no overlay stealing pad performance space */
}

/* UX03 finishing touches */
#view-keys .ap-keys-identity{display:flex;align-items:center;flex-wrap:wrap;gap:7px 12px;min-width:0}
#view-keys .ap-active-sound{display:inline-block;max-width:min(32vw,330px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ap-accent);font:700 10px/1.25 ui-monospace,monospace}
#view-export .ap-export-summary{padding:10px 12px;margin:0 0 11px;border-left:3px solid var(--ap-accent);background:var(--ap-panel-soft);font:11px/1.4 ui-monospace,monospace;color:var(--ap-accent);overflow-wrap:anywhere}
body:has(#spectrumEmptyState:not([hidden])) #view-spectral #spectrogram{height:190px}
body:has(#spectrumEmptyState:not([hidden])) #view-spectral #waveform{height:105px}
@media(max-width:680px){
 #view-keys .ap-active-sound{max-width:150px;font-size:9px}
 body:has(#spectrumEmptyState:not([hidden])) #view-spectral #spectrogram{height:130px}
 body:has(#spectrumEmptyState:not([hidden])) #view-spectral #waveform{height:75px}
}
