/* P116 / 29 Sep 2026: content-first Notes. The shell owns viewport height;
   the collection and document scroll independently. No separate Focus mode. */
html[data-theme] .app.voice-app #notes-panel .notes-content-first { min-width: 0; height: 100% !important; min-height: 0 !important; flex: 1 !important; overflow: hidden !important; padding-top: 0 !important; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .mod-nav { --workspace-header-height: 52px; --workspace-header-control: 36px; flex-wrap: wrap; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .mod-page-body { display: flex; flex-direction: column; flex: 1 !important; min-height: 0; padding: 12px 16px 16px !important; overflow: hidden; max-width: none !important; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-layout { display: flex; flex: 1; min-height: 0; width: 100%; max-width: none !important; margin: 0 !important; padding: 0 !important; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-split { display: grid; flex: 1; min-width: 0; min-height: 0; grid-template-columns: 196px minmax(0,1fr); grid-template-rows: minmax(0,1fr); gap: 16px; align-items: stretch; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-sidebar { display: flex; flex-direction: column; min-width: 0; min-height: 0; padding: 0 !important; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-search-row { display: flex; flex-shrink: 0; gap: 4px; margin-bottom: 8px; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-search-row input { flex: 1; min-width: 0; width: 100%; height: 36px; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-list { display: flex; flex-direction: column; gap: 2px; min-height: 0; overflow-y: auto; padding: 3px; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-list-row { flex-shrink: 0; display: flex; align-items: center; text-align: left; font: inherit; width: 100%; min-width: 0; min-height: 40px; padding: 8px 10px !important; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--s-text-primary); cursor: pointer; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-list-row:hover { background: var(--s-bg-hover); border-color: var(--s-border); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-list-row.active { background: var(--s-bg-selected); border-color: var(--s-border-strong); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-list-title { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px !important; font-weight: 500 !important; color: var(--s-text-primary); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-list-title-text { overflow: hidden; text-overflow: ellipsis; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-pin { flex-shrink: 0; font-size: 14px !important; color: var(--s-text-secondary); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-editor { display: flex; flex-direction: column; min-width: 0; min-height: 0; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-editor-bar { display: flex; flex-shrink: 0; align-items: center; gap: 8px; min-height: 48px; padding: 4px 12px 4px 20px !important; border-bottom: 1px solid var(--s-border-subtle); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first input.notes-title-input { flex: 1; width: 0; min-width: 0; height: 36px; background: transparent !important; border: 0 !important; border-radius: 3px !important; box-shadow: none !important; padding: 0 !important; font-size: 14px !important; line-height: 1.5 !important; font-weight: 500 !important; color: var(--s-text-primary); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-body-wrap { display: flex; flex: 1; min-height: 0; min-width: 0; padding: 16px 20px !important; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first textarea.notes-body { display: block; flex: 1; width: 100%; height: 100%; min-height: 0; min-width: 0; resize: none; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 0 !important; font-family: inherit; font-size: 15px !important; line-height: 1.65 !important; color: var(--s-text-primary); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-editor-foot { display: flex; flex-shrink: 0; justify-content: space-between; gap: 12px; min-height: 26px; padding: 4px 20px !important; color: var(--s-text-secondary); font-size: 11px; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-save-status.error { color: var(--s-status-error); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-actions { position: relative; flex-shrink: 0; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-actions summary { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; cursor: pointer; border-radius: 6px; list-style: none; color: var(--s-text-secondary); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-actions summary::-webkit-details-marker { display: none; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-actions summary:hover { background: var(--s-bg-hover); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-actions-menu { position: absolute; top: calc(100% + 4px); right: 0; z-index: 5; display: flex; flex-direction: column; min-width: 132px; padding: 6px; border: 1px solid var(--s-border); border-radius: 8px; background: var(--s-bg-surface); }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-actions-menu button { justify-content: flex-start; min-height: 40px; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-empty { padding: 24px; color: var(--s-text-secondary); overflow-wrap: anywhere; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-list-empty { padding: 12px; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-mobile-back { display: none; }
html[data-theme] .app.voice-app #notes-panel .notes-content-first :is(button,input,summary):focus-visible { outline: 2px solid var(--s-accent); outline-offset: 2px; }
/* The writing area stays unboxed while editing; the caret indicates focus. */
html[data-theme] .app.voice-app #notes-panel .notes-content-first textarea.notes-body:is(:focus, :focus-visible) { outline: none !important; }
@media(max-width:1000px) { html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-split { grid-template-columns: 172px minmax(0,1fr); gap: 12px; } }
@media(max-width:760px) {
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .mod-page-body { padding: 8px max(12px,env(safe-area-inset-right,0px)) 12px max(12px,env(safe-area-inset-left,0px)) !important; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-split { grid-template-columns: minmax(0,1fr); }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-reading .notes-sidebar, html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-split:not(.notes-reading) .notes-editor { display: none; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-list-row { min-height: 44px; padding: 10px 12px !important; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-search-row input { min-height: 44px; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-editor-bar { padding: 4px 8px !important; gap: 4px; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-mobile-back { display: inline-flex; width: 44px; min-width: 44px; min-height: 44px; padding: 0 !important; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-actions summary { width: 44px; height: 44px; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-actions-menu button { min-height: 44px; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first input.notes-title-input { font-size: 16px !important; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-body-wrap { padding: 12px 16px !important; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first textarea.notes-body { font-size: 16px !important; }
 html[data-theme] .app.voice-app #notes-panel .notes-content-first .notes-editor-foot { padding-inline: 16px !important; }
}

/* Native QA, P116 · 30 Sep: a landscape IME must leave room to write.
 * Hide redundant navigation only during body editing in a short viewport;
 * keep document controls except at the shortest heights. Closing the IME restores them. */
@media (max-height: 500px) {
 html.mirai-mobile body.keyboard-open:has(#notes-panel.active #notes-body:focus) .mobile-work-subnav,
 html.mirai-mobile body.keyboard-open:has(#notes-panel.active #notes-body:focus) #notes-panel .notes-content-first > .mod-nav,
 html.mirai-mobile body.keyboard-open:has(#notes-panel.active #notes-body:focus) #notes-panel .notes-editor-foot:not(:has(.notes-save-status:not(:empty))) { display: none !important; }
 html.mirai-mobile body.keyboard-open .app.voice-app #notes-panel:has(#notes-body:focus) .notes-content-first .mod-page-body { padding-block: 4px !important; }
 html.mirai-mobile body.keyboard-open .app.voice-app #notes-panel:has(#notes-body:focus) .notes-content-first .notes-body-wrap { padding-block: 6px !important; }
}

@media (max-height: 220px) {
 html.mirai-mobile body.keyboard-open:has(#notes-panel.active #notes-body:focus) #notes-panel .notes-editor-bar { display: none !important; }
}

/* P116, 30 Sep: Notes writes directly on the page background at every viewport. */