/* WOC 3.16 — coherent newsroom typography + consent-first onboarding.
   All brand artwork retained; no copied third-party interface assets. */
:root{--woc316-ink:#1c2023;--woc316-red:#ad2934;--woc316-sub:#697077;--woc316-rule:#e5e7e8;--woc316-paper:#fff}
#readerPanel .reader-article{max-width:700px;padding:18px max(18px,4vw) calc(32px + env(safe-area-inset-bottom));line-height:1.66}
#readerPanel .reader-article>h1{font-family:Georgia,"Times New Roman",serif!important;font-size:clamp(28px,7.1vw,39px)!important;font-weight:700!important;line-height:1.16!important;letter-spacing:-.026em!important;margin:14px 0 20px!important;text-wrap:pretty}
#readerPanel .reader-meta{font-size:11px!important;letter-spacing:.055em!important;font-weight:750!important}
#readerPanel .reader-body{line-height:1.7}
#readerPanel .reader-body .reader-intro{font-size:clamp(17px,4.4vw,20px)!important;line-height:1.52!important;letter-spacing:-.008em!important;font-weight:430!important;color:var(--reader-text)!important;margin:0 0 1.5em!important}
#readerPanel .reader-body .reader-intro strong{font-weight:600!important}
#readerPanel .reader-body h2{font-family:Georgia,"Times New Roman",serif!important;font-size:1.32em!important;font-weight:700!important;line-height:1.23!important;letter-spacing:-.012em!important;margin:1.5em 0 .6em!important}
#readerPanel .reader-body h3{font-family:Georgia,"Times New Roman",serif!important;font-size:1.17em!important;line-height:1.3!important;margin:1.3em 0 .55em!important}
#readerPanel .reader-body p{line-height:1.72!important;overflow-wrap:break-word;hyphens:auto}
#readerPanel .reader-body strong{font-weight:720}
#readerPanel .reader-head{min-height:58px!important;box-shadow:none!important;border-bottom:1px solid var(--line)!important}
#readerPanel .reader-brand{font-weight:720!important;letter-spacing:-.02em!important;font-size:13px!important}
#readerPanel .reader-icon-btn{width:39px!important;height:39px!important;min-width:37px!important;border-radius:50%!important;border:1px solid var(--line)!important}
#readerPanel .reader-head-actions{display:flex;align-items:center;gap:4px}
#readerPanel .reader-progress{height:3px!important}
#readerPanel .woc22-reader-topline{background:transparent!important;border-radius:0!important}
#readerPanel .woc22-toc{border:1px solid var(--woc316-rule)!important;border-radius:10px!important;background:var(--surface-solid,#fff)!important;box-shadow:none!important}
#readerPanel .woc22-toc summary{font-size:13px!important;font-weight:700!important}
#readerPanel .woc22-toc nav button{font-size:14px!important;line-height:1.45!important;text-align:left!important}
#readerPanel .woc22-reader-actions button{font-size:12px!important;border-radius:8px!important;box-shadow:none!important}
#readerPanel .reader-cover{border-radius:0!important}
@media(max-width:380px){#readerPanel .reader-head{gap:4px!important;padding-inline:8px!important}#readerPanel .reader-brand{font-size:12px!important;flex:1 1 auto;min-width:0}#readerPanel .reader-icon-btn{width:34px!important;min-width:34px!important;height:34px!important}#readerPanel .reader-head-actions{gap:1px!important}}
/* Native-looking setup without gimmicks. */
.woc316-backdrop{position:fixed;inset:0;background:rgba(16,19,22,.57);z-index:10020;display:grid;place-items:center;padding:16px;padding-top:calc(16px + env(safe-area-inset-top));padding-bottom:calc(16px + env(safe-area-inset-bottom));overflow-y:auto}
.woc316-dialog{background:#fff;color:var(--woc316-ink);border-radius:18px;width:min(430px,100%);max-height:min(730px,calc(100dvh - 42px));overflow-y:auto;padding:clamp(22px,5.2vw,31px);box-shadow:0 18px 75px #03040547;position:relative;overscroll-behavior:contain}
.woc316-overline{display:block;text-transform:uppercase;color:var(--woc316-red);font:750 10px/1.45 system-ui,sans-serif;letter-spacing:.13em;margin-bottom:11px}
.woc316-dialog h2{font:700 clamp(26px,7vw,34px)/1.12 Georgia,"Times New Roman",serif;letter-spacing:-.024em;margin:0 0 12px;text-wrap:balance}
.woc316-dialog p{font:400 14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#62676b;margin:0 0 18px}
.woc316-dialog .woc316-features{padding:4px 0 18px;margin:0;list-style:none}
.woc316-features li{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #ebebea;font:550 13px/1.45 system-ui,sans-serif}
.woc316-feature-dot{width:8px;height:8px;border-radius:50%;background:var(--woc316-red);flex-shrink:0}
.woc316-primary,.woc316-secondary,.woc316-tertiary{display:block;width:100%;min-height:47px;border:0;border-radius:9px;cursor:pointer;font:700 14px/1.35 system-ui,sans-serif;margin-top:10px;padding:12px 14px}
.woc316-primary{background:var(--woc316-red);color:#fff}
.woc316-secondary{background:#f0f1f1;color:#25292c}
.woc316-tertiary{color:#545b60;background:transparent;text-decoration:underline;text-underline-offset:3px}
.woc316-status{font-size:12px!important;color:#8e272e!important;min-height:0;margin:12px 0 0!important}
.woc316-dialog button:focus-visible{outline:3px solid #517bd5;outline-offset:3px}
.woc316-dialog[aria-busy="true"] button{opacity:.68}
.woc316-dialog .woc316-illustration{display:flex;gap:9px;align-items:center;margin:0 0 15px}
.woc316-logo{width:111px;height:auto;object-fit:contain;display:block}
.woc316-step-indicator{display:flex;gap:5px;margin:14px 0 8px}
.woc316-step-indicator span{height:4px;border-radius:4px;background:#e0e1e0;flex:1}
.woc316-step-indicator span.active{background:var(--woc316-red)}
/* Onboarding tour spotlight: actual controls highlighted, no arrows drawn on screenshots */
.woc316-tour-cutout{position:fixed;z-index:10021;box-shadow:0 0 0 250vmax rgba(15,20,24,.73);border:2px solid #fff;border-radius:15px;pointer-events:auto;transition:top .18s,left .18s,width .18s,height .18s}
.woc316-tour-card{position:fixed;z-index:10022;left:16px;bottom:calc(env(safe-area-inset-bottom) + 114px);width:min(400px,calc(100vw - 32px));background:#fff;border-radius:14px;box-shadow:0 10px 50px #0005;padding:19px 18px;color:#202427}
.woc316-tour-card h2{font:700 24px/1.15 Georgia,"Times New Roman",serif;margin:5px 0 9px;letter-spacing:-.024em}
.woc316-tour-card p{font:400 13px/1.6 system-ui,sans-serif;color:#595f63;margin:0 0 13px}
.woc316-tour-actions{display:flex;gap:9px;justify-content:space-between;align-items:center}
.woc316-tour-actions button{min-height:41px;padding:10px 16px;border-radius:8px;font:700 13px system-ui,sans-serif}
.woc316-tour-skip{border:1px solid #dedfe0;background:#fff;color:#444}
.woc316-tour-next{border:0;background:var(--woc316-red);color:#fff;flex:1}
.woc316-tour-step{color:#9b2f3a;font:750 10px system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase}
.woc316-tour-card button:focus-visible{outline:3px solid #477ad5;outline-offset:2px}
@media(max-height:650px){.woc316-tour-card{bottom:calc(env(safe-area-inset-bottom) + 91px);padding:13px 16px}.woc316-tour-card h2{font-size:20px}.woc316-tour-card p{font-size:12px;margin-bottom:8px}.woc316-dialog{padding:19px 20px}.woc316-features li{padding:8px 0}}
@media(prefers-reduced-motion:reduce){.woc316-tour-cutout{transition:none}}
/* Final visual alignment, preserving user-adjustable article body font settings. */
:root{--woc316-red:#b32c35;--red:#b32c35;--red-dark:#9e252f;--soft-red:rgba(179,44,53,.08)}
#readerPanel .reader-brand{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;min-width:0!important;font-size:11.5px!important;letter-spacing:-.035em!important;line-height:1.2!important}
#readerPanel .reader-cover{display:block!important;margin-bottom:15px!important}
#readerPanel{background:#fff!important}
html[data-theme="dark"] #readerPanel{background:var(--bg)!important}
@media(max-width:350px){#readerPanel .reader-brand{font-size:10.5px!important}#readerPanel .reader-head-actions{gap:0!important}}

@media(max-width:360px){#readerPanel .reader-brand{font-size:0!important;text-overflow:clip!important}#readerPanel .reader-brand::after{content:"WOC";font-size:14px;font-weight:800;letter-spacing:.02em}}

/* Legacy full paragraphs accidentally stored as headings in WordPress. */
#readerPanel .reader-body .reader-recovered-paragraph{
 font-size:inherit!important;line-height:1.72!important;
 font-weight:400!important;letter-spacing:normal!important;
 margin:0 0 1.15em!important;color:var(--reader-text)!important
}
#readerPanel .reader-body .reader-intro{font-weight:430!important}
