:root { color-scheme: light; }
body { margin:0; font-family:"Century Gothic","Avenir Next","PingFang TC",system-ui,sans-serif; color:#2b2440; background:#fefcff; }
a { color:inherit; }
.topbar { z-index:20; }
.title-wrap { padding-left:40px; }
.top-actions { padding-right:32px; }
.shell-environment { font-size:12px; color:#fff; opacity:.8; }
.nav-item { text-decoration:none; }
.nav-item .menu-icon img { display:block; width:24px; height:24px; object-fit:contain; }
.campaign-menu-icon img { filter:brightness(0) invert(1); }
.nav-item.active .campaign-menu-icon img { filter:none; }
.nav-caption { margin:0 0 18px; padding:0 22px; font-size:11px; letter-spacing:1.8px; color:#fff; opacity:.85; }
.side-user { margin:24px auto 0; width:100%; grid-template-columns:32px minmax(0,1fr) 8px; padding:12px; }
.side-user-name { font-size:14px; }
.user-mark { font-weight:700; color:#442c8c; }
.user-state { width:7px; height:7px; border-radius:50%; background:#fff; }
.skip-link { position:fixed; left:12px; top:-60px; z-index:100; background:white; color:#442c8c; padding:12px; }
.skip-link:focus { top:12px; }
:focus-visible { outline:3px solid #b789d6; outline-offset:3px; }
.shell-collapsed { --rail-width:84px; }
.shell-collapsed .nav-label,.shell-collapsed .nav-caption,.shell-collapsed .side-user-name,.shell-collapsed .user-state { display:none; }
.shell-collapsed .nav-item { justify-content:center; padding:0; }
.shell-collapsed .starry-logo img { width:70px; }
.shell-collapsed .side-user { display:flex; justify-content:center; border:0; padding:0; }
.shell-collapsed .menu-toggle { margin-left:auto; margin-right:auto; }
.dashboard-heading { padding:24px 0 32px; }
.dashboard-heading h1 { margin:8px 0; font-size:32px; color:#442c8c; }
.dashboard-heading p { color:#808080; }
.eyebrow { font-size:11px; letter-spacing:2px; color:#808080; font-weight:700; }
.dashboard-card { max-width:580px; display:block; padding:32px; background:#fff; border:1px solid #e5e5e5; border-radius:8px; text-decoration:none; box-shadow:0 4px 16px #442c8c08; }
.dashboard-card:hover { border-color:#b789d6; }
.dashboard-card h2 { color:#442c8c; font-size:24px; margin:16px 0 8px; }
.dashboard-card p { color:#808080; line-height:1.7; }
.dashboard-card img { width:24px; height:24px; }
.dashboard-card strong { display:block; color:#442c8c; margin-top:28px; }
.dashboard-note { margin-top:28px; font-size:12px; color:#808080; }
@media(max-width:820px) {
  .topbar { position:relative; flex-direction:row; padding:20px; min-height:76px; }
  .brand { flex-direction:row; align-items:center; height:auto; gap:20px; }
  .starry-logo { width:100px; height:40px; flex:0 0 100px; }
  .starry-logo img { width:100px; height:auto; }
  .title-wrap { height:auto; padding:0; }
  .title { font-size:16px; }
  .top-actions { display:none; }
  .layout { display:block; }
  .rail { position:relative; top:auto; width:100%; height:auto; display:block; padding:8px 16px; }
  .rail>div:first-child { display:flex; align-items:center; gap:12px; }
  .menu-toggle,.nav-caption,.side-user { display:none; }
  .side-menu { display:flex; flex-wrap:wrap; gap:8px; }
  .nav-item { height:40px; padding:0 12px; font-size:13px; }
  .main { padding:24px 16px; min-height:calc(100vh - 150px); }
  .shell-collapsed .nav-label { display:inline; }
  .shell-collapsed .nav-item { padding:0 12px; }
}

.nav-item { cursor:pointer!important; }
.language-picker { display:inline-flex; align-items:center; }
.language-picker select { font:inherit; font-size:12px; min-height:36px; padding:6px 12px; border:1px solid #ffffff66; border-radius:8px; background:#ffffff12; color:#fff; cursor:pointer; }
.language-picker option { background:#fff; color:#2b2440; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media(max-width:820px) { .topbar { flex-wrap:wrap; gap:12px; } .top-actions { display:flex; min-height:0; padding:0; margin-left:auto; } }

/* Horizontal module navigation — review candidate, October 2026. */
:root { --topbar-height:80px; --rail-width:0px; }
.app { display:block; }
.topbar { min-height:80px; height:80px; padding:0 40px; flex-wrap:nowrap; gap:24px; }
.brand { height:auto; gap:28px; }
.starry-logo { width:116px; height:48px; flex:0 0 116px; }
.starry-logo img { width:116px; height:44px; }
.title-wrap { height:auto; padding:0; }
.title { font-size:18px; }
.subtitle { font-size:12px; }
.top-actions { display:flex; align-items:center; gap:24px; padding:0; min-height:0; }
.header-user { display:flex; align-items:center; gap:10px; font-size:13px; white-space:nowrap; }
.header-user .user-mark { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#eee6f6; }
.layout { display:block; }
.module-nav { background:#fff; border-bottom:1px solid #e9e3ef; }
.module-nav-inner { display:flex; gap:32px; max-width:1440px; margin:0 auto; padding:0 40px; overflow-x:auto; }
.module-tab { position:relative; display:flex; align-items:center; flex-shrink:0; height:58px; padding:0 4px; border:0; border-radius:0; background:none; color:#756e81; font:inherit; font-size:14px; font-weight:600; text-decoration:none; white-space:nowrap; }
.module-tab.active { color:#442c8c; }
.module-tab.active::after { content:""; position:absolute; height:3px; bottom:0; left:0; right:0; background:#442c8c; border-radius:3px 3px 0 0; }
.module-tab:disabled { color:#9c96a5; cursor:not-allowed; opacity:1; }
.layout>.main { width:100%; max-width:1440px; margin:0 auto; padding:32px 40px 60px; min-height:calc(100vh - 138px); }
body { background:#fefcff; }
@media(max-width:820px) {
  .topbar { padding:0 20px; gap:12px; }
  .brand { gap:16px; }
  .title { font-size:14px; }
  .subtitle { display:none; }
  .top-actions { gap:12px; }
  .header-user>span:last-child { display:none; }
  .module-nav-inner { padding:0 20px; gap:24px; }
  .module-tab { font-size:13px; height:52px; }
  .layout>.main { padding:24px 20px 40px; }
}
@media(max-width:520px) {
  .topbar { height:72px; min-height:72px; padding:0 16px; }
  .starry-logo { width:90px; flex-basis:90px; }
  .starry-logo img { width:90px; }
  .title-wrap { display:none; }
  .module-nav-inner { padding:0 16px; gap:20px; }
  .layout>.main { padding:24px 16px 40px; }
}
@media(max-width:820px) {
  .topbar { align-items:center; }
  .brand { width:auto; flex:1 1 auto; align-items:center; }
  .top-actions { width:auto; flex:0 0 auto; flex-wrap:nowrap; }
  .layout { padding:0; }
}
/* User Figma frame 15:334: shared header and module navigation. */
.topbar { padding:0; gap:0; }
.brand { gap:0; }
.brand-lockup { width:280px; flex:0 0 280px; height:80px; padding:0 48px; display:flex; align-items:center; }
.starry-logo { flex:0 0 134px; width:134px; height:50px; position:relative; overflow:visible; }
.starry-logo img { position:absolute; left:1.14px; top:2.31px; width:131.72px; height:44.72px; }
.internal-badge { align-self:flex-start; margin:16px 0 0 4px; padding:4px 8px; border:.5px solid white; border-radius:16px; font-size:12px; line-height:1; }
.title-wrap { padding:0 56px; }
.title { font-size:20px; line-height:1.2; letter-spacing:.6px; }
.subtitle { display:block; margin-top:4px; font-size:12px; line-height:18px; }
.top-actions { gap:16px; }
.header-user { padding:8px 24px; gap:5px; font-size:16px; font-weight:700; }
.header-user .user-mark { width:26px; height:26px; background:#b789d6; color:white; font-size:18px; }
.header-language { position:relative; display:flex; align-items:center; margin:0 24px; border:1px solid #e8caff; border-radius:8px; padding:4px 8px; gap:5px; }
.header-language>img { width:16px; height:16px; pointer-events:none; }
.header-language .language-chevron { width:14px; height:14px; }
.header-language .language-picker select { border:0!important; background:none!important; appearance:none!important; min-height:24px; padding:0!important; width:34px; font-size:16px; font-weight:700; }
.module-nav { border-color:#e8caff; }
.module-nav-inner { gap:24px; }
.module-tab { padding:16px 8px; height:58px; font-size:16px; letter-spacing:.48px; }
.module-tab:disabled { color:#b789d6; }
.module-tab.active::after { height:2px; }
@media(max-width:1100px) { .brand-lockup { width:240px; flex-basis:240px; padding:0 24px; } .title-wrap { padding:0 24px; } .header-user { padding:8px 16px; } .header-language { margin:0 8px; } }
@media(max-width:820px) { .title-wrap { display:none; } .brand-lockup { width:auto; flex-basis:auto; padding:0 20px; } .header-user>span:last-child { display:none; } .module-tab { font-size:13px; } .module-nav-inner { gap:12px; } }
@media(max-width:520px) { .brand-lockup { padding:0 16px; height:72px; } .starry-logo { flex-basis:105px; width:105px; } .starry-logo img { width:103.2px; height:35px; top:7px; } .internal-badge { font-size:10px; padding:3px 5px; } .top-actions { gap:0; } .header-user { padding:8px; } .header-language { margin:0 4px; } }
.internal-badge { white-space:nowrap; }
.header-language .language-picker { flex:0 0 auto; }