/* GENERATED from media-app-ui/tokens.css; do not edit. */
/* Media apps unified visual tokens — canonical source. Keep behavior/app styling local. */
:root {
  color-scheme: dark;
  --media-bg: #111310;
  --media-surface: #1b1e18;
  --media-surface-raised: #22261e;
  --media-border: #343a2e;
  --media-text: #f1f1e8;
  --media-muted: #a7ad9d;
  --media-accent: #d2ec9a;
  --media-accent-ink: #1a2310;
  --media-serif: Georgia, 'Noto Serif KR', serif;
  --media-sans: system-ui, -apple-system, 'Noto Sans KR', sans-serif;
  --media-space-1: 4px;
  --media-space-2: 8px;
  --media-space-3: 12px;
  --media-space-4: 16px;
  --media-space-6: 24px;
  --media-radius: 7px;
  --media-focus: 2px solid var(--media-accent);
}

/* Voice-only opt-in theme: shared apps keep the canonical defaults above. */
.voice-atlas-theme {
  color-scheme: light dark;
  --media-bg: #f5f1e9;
  --media-surface: #fffdf8;
  --media-surface-raised: #eee8dc;
  --media-border: #d8d0c3;
  --media-text: #292b29;
  --media-muted: #686f6b;
  --media-accent: #247f79;
  --media-accent-ink: #ffffff;
  --media-serif: var(--media-sans);
  font-family: var(--media-sans);
}
@media (prefers-color-scheme: dark) {
  .voice-atlas-theme {
    --media-bg: #171c1b;
    --media-surface: #202827;
    --media-surface-raised: #293432;
    --media-border: #3d4b48;
    --media-text: #f2f1e9;
    --media-muted: #b2beb9;
    --media-accent: #79c7bd;
    --media-accent-ink: #122321;
  }
}

/* Shared app header contract: identity left, app navigation right. */
.media-app-header { display:flex; align-items:center; justify-content:space-between; gap:var(--media-space-3); }
.media-app-header > .brand { display:flex; align-items:center; min-height:44px; flex-shrink:0; }
.media-app-header .app-links { display:flex; align-items:center; gap:var(--media-space-3); margin-left:auto; }
.media-app-header .app-links a { display:inline-flex; align-items:center; min-height:44px; padding-inline:var(--media-space-1); color:var(--media-accent); font:500 12px/1.3 var(--media-sans); white-space:nowrap; }
.media-app-header .app-links a:focus-visible,
.media-app-header > .brand:focus-visible,
.media-app-header .section-links a:focus-visible { outline:var(--media-focus); outline-offset:2px; border-radius:4px; }
.media-app-header #mode:empty { display:none; }
.media-app-header .header-nav-groups { display:flex; align-items:center; gap:var(--media-space-3); margin-left:auto; }
.media-app-header .section-links { display:flex; align-items:center; gap:var(--media-space-2); padding-left:var(--media-space-3); border-left:1px solid var(--media-border); }
.media-app-header .section-links a { display:inline-flex; align-items:center; min-height:44px; padding-inline:var(--media-space-1); color:var(--media-muted); font:500 12px/1.3 var(--media-sans); white-space:nowrap; }
@media (max-width:680px) {
  .media-app-header { gap:var(--media-space-2); }
  .media-app-header .app-links { gap:var(--media-space-1); }
  .media-app-header .app-links a,.media-app-header .section-links a { font-size:12px; }
  .media-app-header .header-nav-groups { gap:var(--media-space-2); }
  .media-app-header .section-links { gap:var(--media-space-1); padding-left:var(--media-space-2); }
}

/* Task navigation and accessible content entry shared by all media apps. */
:root{--media-space-8:32px;--media-control-size:44px}
.skip-link{position:fixed;inset:12px auto auto 12px;transform:translateY(-180%);z-index:1000;display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border-radius:7px;background:var(--media-accent);color:var(--media-accent-ink);font:600 14px/1.4 var(--media-sans);text-decoration:none}
.skip-link:focus{transform:none;outline:2px solid var(--media-text);outline-offset:3px}
.media-task-nav{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--media-border);padding:0;margin:0 0 20px}
.media-task-nav a,.media-task-nav button{display:inline-flex;justify-content:center;align-items:center;min-height:44px;padding:10px 16px;border:0;border-radius:0;background:transparent;color:var(--media-muted);font:500 14px/1.4 var(--media-sans);text-decoration:none}
.media-task-nav [aria-current=page],.media-task-nav [aria-pressed=true]{color:var(--media-text);font-weight:700;box-shadow:inset 0 -2px var(--media-accent)}
.media-app-header .app-links a{color:var(--media-muted);text-decoration:none;font-size:12px}
.media-app-header .app-links a:hover{color:var(--media-accent);text-decoration:underline}
@media(max-width:680px){.media-task-nav a,.media-task-nav button{padding-inline:12px}.media-app-header{height:auto;min-height:64px;flex-wrap:wrap}.media-app-header .brand{min-width:0;flex-shrink:1}.media-app-header .app-links{flex-wrap:wrap;min-width:0}.media-app-header .header-nav-groups{flex-wrap:wrap;min-width:0}}