/* The same five activities, in the same order, at every screen size. */
.top-actions {margin-left:auto;gap:10px;}
.header-link,.more-button {display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:12px;white-space:nowrap;color:var(--ink-3);}
.header-link:hover,.more-button:hover,.header-link.is-active {color:var(--ink);}
.header-link.is-active {text-decoration:underline;text-underline-offset:7px;}
#menuBtn.more-button {width:auto;height:auto;padding:0 9px;border:1px solid var(--line-strong);border-radius:6px;color:var(--ink);}
.header-account {display:none;}
.bottom-nav {height:calc(76px + env(safe-area-inset-bottom,0px));padding:7px max(8px,env(safe-area-inset-right,0px)) calc(7px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;background:var(--bg);border-top:1px solid var(--line-strong);border-radius:0;box-shadow:none;}
.bottom-nav .nav-item {justify-content:center;min-width:0;min-height:60px;height:100%;gap:5px;padding:7px 2px;color:var(--ink-3);border-radius:9px;transition:background-color 140ms ease,color 140ms ease;}
.bottom-nav .nav-icon {width:23px;height:23px;stroke-width:1.65;}
.bottom-nav .nav-label {font-size:11px;line-height:1.2;letter-spacing:0;white-space:nowrap;}
.bottom-nav .nav-item.is-active {color:var(--world-accent,var(--cta));background:color-mix(in srgb,var(--world-accent,var(--cta)) 11%,var(--bg));}
.bottom-nav .nav-item.is-active .nav-label {font-weight:600;}
.bottom-nav .nav-item.is-active .nav-icon {stroke-width:2.1;}
.bottom-nav .nav-item.is-active::after {display:none;}
.bottom-nav .nav-item:active {transform:none;background:color-mix(in srgb,var(--world-accent,var(--cta)) 16%,var(--bg));}
.nav-item:focus-visible,.desktop-nav a:focus-visible,.header-link:focus-visible,.more-button:focus-visible {outline:2px solid var(--world-accent,var(--cta));outline-offset:2px;}
.viewport {scroll-padding-top:96px;scroll-padding-bottom:calc(92px + env(safe-area-inset-bottom,0px));}
/* Activity switches are frequent: no exit delay or decorative page rise. */
.screen {animation:none;}
.menu-group+.menu-group {margin-top:22px;}
.menu-group-label {font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:4px;}
.menu-group .sheet-option {min-height:56px;padding:13px 0;}
.menu-group .sheet-option__title {font-size:16px;}
html:lang(th) .bottom-nav .nav-label {font-size:11px;line-height:1.4;}
html:lang(th) .menu-group-label {letter-spacing:0;}
@media(max-width:899px){
 .top-bar {padding-inline:16px;gap:8px;}
 .top-actions {gap:8px;}
 .top-bar .logo {font-size:25px;}
 .top-bar .language-picker {width:44px;max-width:44px;min-height:44px;padding-inline:3px;font-size:11px;}
 [data-layout='signin'] .top-actions {display:flex;}
 [data-layout='signin'] .bottom-nav,[data-layout='story'] .bottom-nav {display:grid;}
 [data-layout='signin'] .viewport {padding-bottom:calc(104px + env(safe-area-inset-bottom,0px));}
}
@media(max-width:360px){.top-bar{padding-inline:12px;}.top-bar .logo{font-size:23px;}.top-actions{gap:5px;}.header-link,.more-button{font-size:11px;}#menuBtn.more-button{padding-inline:7px;}}
@media(min-width:900px){
 .bottom-nav {display:none;}
 .desktop-nav,[data-layout='signin'] .desktop-nav {display:flex;gap:22px;margin-left:auto;}
 .desktop-nav a {display:flex;align-items:center;min-height:44px;font-family:var(--font-sans);font-size:13px;padding:10px 2px;color:var(--ink-3);}
 .desktop-nav a.is-active {color:var(--world-accent,var(--cta));border-bottom:2px solid currentColor;font-weight:600;}
 .top-bar {gap:28px;}
 .top-actions,[data-layout='signin'] .top-actions {display:flex;margin-left:0;gap:16px;}
 .header-account {display:inline-flex;}
 .viewport {scroll-padding-bottom:32px;}
}
@media(min-width:900px) and (max-width:1050px){.top-bar{gap:18px;padding-inline:24px;}.desktop-nav{gap:15px;}.top-actions{gap:10px;}.top-bar .logo{font-size:28px;}.header-account{max-width:90px;}}
@media(prefers-reduced-motion:reduce){.bottom-nav .nav-item{transition:none;}}

/* Public articles/artwork keep the same activity bar across the document boundary. */
.public-utilities {display:flex;align-items:center;gap:16px;}
.public-editorial .public-header {position:sticky;top:0;z-index:40;background:var(--bg);gap:26px;padding-block:16px;}
.public-editorial .bottom-nav {position:fixed;}
.public-editorial {scroll-padding-top:100px;scroll-padding-bottom:100px;}
.public-editorial .public-main {scroll-margin-top:100px;}
@media(max-width:899px){
 .public-editorial .public-header {gap:12px;padding:16px;}
 .public-header .desktop-nav {display:none;}
 .public-utilities {gap:10px;}
 .public-wordmark {font-size:25px;white-space:nowrap;}
 .public-utilities .header-link {font-size:11px;}
 .public-utilities .language-picker {width:44px;padding-inline:3px;}
 .public-editorial {padding-bottom:calc(84px + env(safe-area-inset-bottom,0px));}
}
@media(min-width:900px){.public-header .desktop-nav{gap:18px;flex-wrap:nowrap;}.public-editorial .public-header{padding-inline:24px;}.public-header .desktop-nav a{font-family:var(--font-sans);font-size:13px;}.public-wordmark{white-space:nowrap;}}

/* Header utilities: quieter controls, one clear way in. */
.top-bar .language-picker {border-color:transparent;background:transparent;border-radius:999px;padding-inline:8px;transition:background-color 140ms ease;}
.top-bar .language-picker:hover {background:color-mix(in srgb,var(--ink) 6%,transparent);}
#menuBtn.more-button {border:0;border-radius:999px;padding:0 16px;min-height:40px;background:color-mix(in srgb,var(--ink) 7%,transparent);font-weight:500;transition:background-color 140ms ease;}
#menuBtn.more-button:hover {background:color-mix(in srgb,var(--ink) 12%,transparent);}
@media(min-width:900px){
 .top-actions {padding-left:18px;border-left:1px solid var(--line-soft);}
 .header-account {min-height:40px;padding:0 16px;border:1px solid color-mix(in srgb,var(--world-accent,var(--cta)) 60%,transparent);border-radius:999px;color:var(--world-accent,var(--cta));font-weight:500;transition:background-color 140ms ease,color 140ms ease;}
 .header-account:hover {background:var(--world-accent,var(--cta));color:var(--bg);}
 [data-member='true'] .header-account {border-color:var(--line-soft);color:var(--ink-2);}
 [data-member='true'] .header-account:hover {background:color-mix(in srgb,var(--ink) 7%,transparent);color:var(--ink);}
}
@media(max-width:899px){#menuBtn.more-button{padding:0 14px;}.top-bar .language-picker{padding-inline:3px;}}
@media(max-width:360px){#menuBtn.more-button{padding:0 10px;}}
@media(prefers-reduced-motion:reduce){.top-bar .language-picker,#menuBtn.more-button,.header-account{transition:none;}}
