/* Layout only: surfaces, controls, typography and frame geometry remain UI02. */
.ac10-session-status { max-width: 1200px; margin: var(--ac-space-4) auto; padding: var(--ac-space-4); border: 1px solid var(--ac-mint); border-radius: var(--ac-radius); }
.ac10-shell { margin: 0; min-height: 100dvh; background: var(--ac-space); color: var(--ac-paper); font-family: var(--ac-font-body); font-size: 1rem; line-height: 1.5; padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left)); }
.ac10-shell *, .ac10-shell *::before, .ac10-shell *::after { box-sizing: border-box; }
.ac10-shell [hidden] { display: none !important; }
.ac10-shell main, .ac10-nav, .ac10-preview-note { max-width: 1200px; margin-inline: auto; }
.ac10-shell main { display: grid; gap: 24px; }
.ac10-shell p { max-width: 72ch; }
.ac10-shell a { text-underline-offset: .2em; }
.ac10-shell ::selection { background: var(--ac-mint); color: var(--ac-ink); }
.ac10-shell input { caret-color: var(--ac-ink); accent-color: var(--ac-mint-edge); }
.ac10-shell :focus-visible { outline: 3px solid var(--ac-focus); outline-offset: 3px; }
.ac10-shell .ac10-nav :focus-visible, .ac10-skip:focus-visible { outline-color: var(--ac-mint); }
.ac10-skip { position: absolute; left: 16px; top: -100px; padding: 12px; background: var(--ac-paper); color: var(--ac-ink); z-index: 20; }
.ac10-skip:focus { top: 8px; }
.ac10-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; padding: 8px 0 24px; color: var(--ac-paper); }
.ac10-brand { display: inline-flex; align-items: center; gap: 8px; font: 1.3rem var(--ac-font-display); min-height: 48px; color: var(--ac-paper); text-decoration: none; margin-right: auto; }
.ac10-brand .ac-icon { width: 36px; height: 36px; }
.ac10-nav__links, .ac10-menu__links { display: flex; gap: 8px; flex-wrap: wrap; }
.ac10-nav [aria-current='page'] { background: var(--ac-mint); color: var(--ac-ink); text-decoration: underline; text-decoration-thickness: 2px; }
.ac10-menu { position: relative; }
.ac10-menu > summary { display: flex; cursor: pointer; }
.ac10-menu__links { margin-top: 12px; }
.ac10-menu[open] { flex-basis: 100%; }
.ac10-menu[open] > summary { width: fit-content; }
.ac10-home { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 48px; min-height: 310px; }
.ac10-home-frame .ac-frame__header { text-align: left; }
.ac10-tagline { font: clamp(1.5rem, 3.4vw, 2.5rem)/1.15 var(--ac-font-display); margin: 0 0 24px; text-wrap: balance; }
.ac10-home__welcome > p { margin: 0 0 20px; }
.ac10-home__welcome > .ac-button { margin-top: 8px; width: min(100%, 360px); }
.ac10-home__scene { padding: 24px 0; }
.ac10-home__scene .ac-state { background: transparent; border: 0; padding: 0; }
.ac10-note { font-size: var(--ac-text-sm); color: var(--ac-ink-muted); }
.ac10-launch { display: flex; gap: 24px; justify-content: space-between; align-items: center; }
.ac10-launch-frame .ac-frame__header { text-align: left; }
.ac10-launch__status { font-size: 1.25rem; font-weight: 850; margin-top: 0; }
.ac10-countdown { font-variant-numeric: tabular-nums; }
.ac10-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.ac10-actions > * { max-width: 100%; }
.ac10-settings__fields { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; padding: 0; margin: 24px 0; border: 0; min-width: 0; }
.ac10-settings__fields section { min-width: 0; }
.ac10-settings h2 { margin: 0 0 20px; }
.ac10-check { display: flex; gap: 12px; align-items: center; min-height: 48px; cursor: pointer; padding-block: 8px; }
.ac10-check input { width: 24px; height: 24px; flex: 0 0 24px; margin: 0; }
.ac10-volume { margin-bottom: 16px; }
.ac10-volume > label:not(.ac10-check) { display: flex; gap: 12px; justify-content: space-between; font-weight: 800; }
.ac10-volume output { font-variant-numeric: tabular-nums; white-space: nowrap; }
.ac10-volume input[type='range'] { width: 100%; min-height: 48px; margin: 0; cursor: pointer; }
.ac10-result { margin: 24px 0; padding: 16px; border: 1px solid var(--ac-mint-edge); border-radius: var(--ac-radius); background: var(--ac-selected); }
.ac10-result--error { background: var(--ac-error-bg); color: var(--ac-error); border-color: var(--ac-error); }
.ac10-save-tools { border-top: 1px solid var(--ac-line); margin-top: 32px; padding-top: 24px; }
.ac10-save-tools input[type='file'] { display: block; width: 100%; min-width: 0; margin: 8px 0 16px; }
.ac10-save-tools input::file-selector-button { min-height: 44px; font: inherit; color: var(--ac-ink); background: var(--ac-paper-raised); border: 1px solid var(--ac-border); border-radius: var(--ac-radius); margin-right: 12px; padding: 8px; }
.ac10-save-tools > a { margin-top: 16px; }
.ac10-guide { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(0, 3fr); gap: 32px; align-items: start; }
.ac10-contents { display: flex; flex-direction: column; }
.ac10-contents a { min-height: 48px; padding: 12px 8px; color: var(--ac-ink); font-weight: 800; border-bottom: 1px solid var(--ac-line); }
.ac10-articles article { padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid var(--ac-line); scroll-margin-top: 24px; }
.ac10-articles article:last-child { border-bottom: 0; margin-bottom: 0; }
.ac10-articles h2 { margin-top: 0; }
.ac10-faq details { border-bottom: 1px solid var(--ac-line); padding: 8px 0; }
.ac10-faq summary { cursor: pointer; font-size: var(--ac-text-lg); font-weight: 850; min-height: 48px; padding: 12px; }
.ac10-faq details[open] summary { background: var(--ac-selected); }
.ac10-faq details p { padding: 0 12px; }
.ac10-help > p { margin-top: 0; }
.ac10-shell dialog { scrollbar-color: var(--ac-lilac) var(--ac-paper); }
.ac10-preview-note { font-size: .875rem; padding-bottom: 16px; }
@media (min-width: 1100px) { .ac10-nav { gap: 12px; } .ac10-menu, .ac10-menu[open] { display: contents; } .ac10-menu > summary { display: none; } .ac10-menu:not([open]) > .ac10-menu__links { display: flex; } .ac10-menu__links { margin: 0; } }
@media (max-width: 700px) {
  .ac10-shell { padding-inline: max(12px, env(safe-area-inset-left)) max(12px, env(safe-area-inset-right)); }
  .ac10-home, .ac10-settings__fields, .ac10-guide { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .ac10-home { min-height: 0; } .ac10-home__scene { padding: 0; }
  .ac10-launch { align-items: stretch; flex-direction: column; gap: 12px; }
  .ac10-nav { gap: 12px; padding-bottom: 16px; } .ac10-brand { flex-basis: 100%; }
  .ac10-nav__links { flex: 1; } .ac10-nav .ac-button { padding-inline: 12px; }
  .ac10-menu { align-self: flex-end; }
  .ac10-menu__links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ac10-contents { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
}
@media (max-width: 360px) { .ac10-nav__links { flex-basis: 100%; } .ac10-menu { width: 100%; } .ac10-actions > .ac-button { width: 100%; } .ac10-contents { grid-template-columns: minmax(0, 1fr); } }
@media (forced-colors: active) { .ac10-shell :focus-visible { outline-color: Highlight; } .ac10-nav [aria-current='page'] { outline: 2px solid Highlight; } }
