/* Reading layout for the published W2 articles; lesson logic stays in its source. */
:root[data-ph-article][data-ph-group]{
  --bg:#f5f6f8;--bg-primary:#f5f6f8;--bg-deep:#f5f6f8;--night-deep:#f5f6f8;
  --muted:#53627a;--white:#172335;--star-bright:#172335;--rose-mist:#92516f;
  --blue:#075fd4;--magenta:#86408e;--duck-yellow:#846000;--shark:#b33361;
  --duck-glow:transparent;--shark-glow:transparent;--purple-glow:transparent;
  --red-dim:#b82c3f12;--red-glow:transparent;--green-glow-strong:transparent;
  --accent-border:#075fd433;--warn:#855a08;--warn-dim:#855a0810;--warn-border:#855a0840;
  --serif:var(--ph-system);--code-bg:#edf2f8;--code-ink:#243b57;
  --symp-glow:#b82c3f;--para-glow:#08748c;
}
body.ph-reading{background:#f5f6f8;font-size:16px;line-height:1.65}
.ph-reading-content{min-width:0;display:flow-root}
.ph-reading-content :is(h1,h2,h3,h4,.hero-title,.logo-text,.logo-sub,.hero-sub,.section-title,.nav-brand,.quiz-question){font-family:var(--ph-system);text-shadow:none;letter-spacing:-.025em}
.ph-reading-content :is(h1,.hero-title,.logo-text){font-size:clamp(32px,5vw,68px);line-height:1.12;overflow-wrap:anywhere}
.ph-reading-content .omg-logo{font:800 clamp(52px,9vw,100px)/1.1 var(--ph-system);letter-spacing:-.04em;text-shadow:none}
.ph-reading-content .hero{min-height:0;padding-block:48px 64px}
.ph-reading-content :is(.hero,.hero-title,.logo-text,.omg-logo,.hero h1,.hero-badge,.hero-subtitle,.hero-buttons){animation:none;opacity:1;transform:none}
.ph-reading-content :is(.hero-bg,.cursor,.scroll-hint),.ph-reading-content .hero::after,.ph-reading-content .hero::before{display:none}
.ph-reading-content :is(.reveal,.timeline-item,.card,.info-block){opacity:1;transform:none;animation:none}
.ph-reading-content :is(.hero-emoji,.product-icon){filter:none}
.ph-reading-content :is(.product-card,.comp-card,.spec-card,.usecase-card,.feature-item,.net-mode,.device-port,.step,.pillar-card,.myth-card){border-radius:22px;border-color:#d6dfeb;box-shadow:0 12px 32px -26px #29476e50}
.ph-reading-content :is(.product-card,.comp-card,.pillar-card,.myth-card,.quiz-container,.calculator-card,.balance-section){background:linear-gradient(135deg,#ffffffed,#f6f8fce0)}
.ph-reading-content :is(.product-card,.pillar-card,.comp-card):hover{box-shadow:0 16px 32px -24px #29476e55}
.ph-reading-content :is(.card p,.card .expand-content .detail){font-size:14px}
.ph-reading-content :is(.feature-list,.product-grid,.component-grid,.software-grid,.card-grid,.pillars-grid,.tips-grid,.usecase-grid,.spec-grid,.combo-grid,.match-grid,.cmd-grid,.feat-grid){grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))}
.ph-reading-content :is(.feature-list,.component-grid){grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.ph-reading-content :is(.container,.section,.product-section){min-width:0}
.ph-reading-content>nav:not(.toc),.ph-reading-content .topnav{position:sticky;top:0;z-index:80;min-height:44px;background:#f5f6f8ed;color:#172335;border-color:#d6dfeb;backdrop-filter:blur(12px)}
.ph-reading-content nav :is(.nav-inner,.nav-links,.topnav-links){height:auto;min-height:44px;flex-wrap:wrap}
.ph-reading-content .status-bar{position:relative;inset:auto;min-height:32px;height:auto;flex-wrap:wrap;gap:8px;padding:8px 24px}
.ph-reading-content :is(button,summary,[role="button"]){min-height:44px}
.ph-reading-content :is(button,input,select){font-family:inherit}
.ph-reading-content :is(.time-picker input,.wake-time-chip,.quiz-option){background:#fff;color:#172335;border-color:#bdcce0}
.ph-reading-content .quiz-option:hover{background:#edf2fb;border-color:#7e96bc}
.ph-reading-content :is(.quiz-container,.calculator-card){border-color:#d6dfeb}
/* Code uses a solid light surface so its contrast does not depend on glass layers. */
.ph-reading-content :is(code,kbd,samp){background:#edf2f8;color:#243b57;border:1px solid #cbd5e3;border-radius:6px;padding:.12em .4em;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.92em;line-height:inherit;overflow-wrap:anywhere;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.ph-reading-content :is(pre,.code-block,.terminal,.terminal-body,.term-body,.code-body){
  background:#edf2f8;color:#243b57;border-color:#cbd5e3;border-radius:14px;text-shadow:none;
  --text:#243b57;--text-primary:#243b57;--text-secondary:#4c5d74;--text-dim:#53627a;--text-muted:#53627a;--text-bright:#243b57;--text-faint:#53627a;
  --ink:#243b57;--ink-soft:#4c5d74;--white:#243b57;--code-bg:#edf2f8;--code-ink:#243b57;
  --accent:#075fd4;--green:#18734c;--cyan:#08748c;--accent-yellow:#856200;--yellow:#856200;--accent-orange:#a85406;--orange:#a85406;--border:#cbd5e3;--line:#cbd5e3;
  max-width:100%;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px;line-height:1.7;
}
.ph-reading-content pre code{background:transparent;color:inherit;border:0;border-radius:0;padding:0;font:inherit;white-space:inherit;overflow-wrap:normal}
.ph-reading-content :is(.terminal,.code-block) pre{background:transparent;border:0;border-radius:0;margin:0;box-shadow:none}
.ph-reading-content .terminal .term-header{background:#f5f7fb;border-color:#cbd5e3;color:#4c5d74}
.ph-reading-content :is(pre,.code-block,.terminal) .comment{color:#53627a}
.ph-reading-content .indicator{background:#edf2f8;color:#172335;border-color:#cbd5e3;border-radius:14px}
.ph-reading-content .indicator .ind-label{color:#4c5d74}
.ph-reading-content .indicator .ind-value{color:#172335;overflow-wrap:anywhere}
.ph-reading-content .sleep-card .phase-num{color:#d3ddeb}
.ph-reading-content input[type="range"]{accent-color:#075fd4}
.ph-table-scroll{max-width:100%;overflow:auto;margin-block:16px;overscroll-behavior-inline:contain;border-radius:12px}
.ph-table-scroll>table{width:100%;margin:0}
.ph-reading :is([role="button"],.ph-table-scroll):focus-visible{outline:3px solid #075fd4;outline-offset:4px}
.ph-reading-content :is(.expanded .expand-content,.expanded .pillar-detail,.open .myth-answer){max-height:none}
.ph-reading-content :is(.card,.pillar-card) .expand-hint{display:flex;align-items:center;opacity:1;font-size:12px;letter-spacing:normal;text-transform:none}
@media(max-width:640px){
  .ph-reading-content .hero{padding:32px 20px 44px}
  .ph-reading-content :is(.container,.section,.product-section){padding-inline:20px}
  .ph-reading-content :is(.quiz-container,.calculator-card,.pillar-card){padding:24px 20px}
  .ph-reading-content :is(.quiz-options,.device-layout,.net-modes,.byline){grid-template-columns:1fr}
  .ph-reading-content>nav:not(.toc),.ph-reading-content .topnav{position:relative;display:flex;flex-wrap:wrap;gap:12px;padding:12px 20px}
  .ph-reading-content nav .nav-inner{flex-wrap:wrap;gap:12px}
  .ph-reading-content .badge{white-space:normal}
  .ph-reading-content .hero .specs-bar{gap:12px}
}
@media print{.ph-reading-content nav,.ph-reading-content .status-bar{display:none}.ph-reading-content .hero{padding:20px 0}.ph-table-scroll{overflow:visible}.ph-reading-content :is(.reveal,.timeline-item){opacity:1;transform:none}.ph-reading-content :is(.expand-content,.pillar-detail,.myth-answer,.symptom-body){max-height:none!important;overflow:visible}.ph-reading-content .section{display:block}}