.preview-article{--preview-bg:#f6f8fa;--preview-surface:#fff;--preview-ink:#16394d;--preview-muted:#627685;--preview-line:#dce5ea;--preview-blue:#167fc1;background:var(--preview-bg);color:var(--preview-ink)}
.preview-article .preview-note{display:flex;justify-content:center;gap:8px;padding:9px 20px;background:#e6f2f9;color:#335c73;font:600 11px/1.4 'Segoe UI',Arial,sans-serif;letter-spacing:.04em;text-align:center}
.preview-article .preview-note strong{color:#075f96}
.preview-article .preview-breadcrumb{border-bottom:1px solid var(--preview-line)}
.preview-article .preview-breadcrumb .public-container{min-height:55px;display:flex;align-items:center;gap:12px;color:var(--preview-muted);font-size:13px}
.preview-article .preview-breadcrumb a{color:var(--preview-ink);white-space:nowrap;flex:none}
.preview-article .preview-breadcrumb span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.preview-hero{background:#082c43;color:#f8fbfd;overflow:hidden;position:relative}
.preview-hero:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 76% 42%,#2e83b452,transparent 35%),linear-gradient(120deg,#082c43 12%,#0d364e 65%,#112d42);pointer-events:none}
.preview-hero-inner{position:relative;min-height:520px;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(310px,.88fr);align-items:center;gap:54px;padding-top:84px;padding-bottom:86px}
.preview-kicker{display:inline-flex;align-items:center;gap:10px;color:#9dc8df;font-size:11px;font-weight:700;letter-spacing:.17em;text-transform:uppercase}
.preview-kicker:before{content:'';width:22px;height:2px;background:#59afe0}
.preview-hero h1{font:400 clamp(48px,5.7vw,79px)/1.04 Georgia,serif;letter-spacing:-.045em;color:#fff;max-width:780px;margin:22px 0 27px;text-wrap:balance}
.preview-hero p{font-size:19px;line-height:1.7;color:#c3d9e5;max-width:660px}
.preview-hero-meta{display:flex;gap:17px;flex-wrap:wrap;align-items:center;color:#a9c8d8;font-size:12px;margin-top:34px}
.preview-hero-meta span+span:before{content:'·';margin-right:17px;color:#6c9bb4}
.preview-art{position:relative;min-height:340px;display:grid;place-items:center;isolation:isolate}
.preview-art:before,.preview-art:after{content:'';position:absolute;border:1px solid #8bc6e62c;border-radius:50%;width:390px;height:390px;z-index:-1;animation:preview-orbit 13s linear infinite}
.preview-art:after{width:275px;height:275px;animation-duration:9s;animation-direction:reverse}
.preview-art-stack{width:100%;max-width:470px;display:grid;gap:14px;transform:rotate(-7deg)}
.preview-art-row{display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:18px;padding:20px 24px;border:1px solid #b6e3fc40;border-radius:16px;background:#f8fcffe8;color:#16394d;box-shadow:0 16px 50px #001d3590;animation:preview-arrive .7s both}
.preview-art-row:nth-child(2){transform:translateX(25px);animation-delay:.15s}
.preview-art-row:nth-child(3){transform:translateX(50px);animation-delay:.3s}
.preview-art-row .mark{font:700 13px/1 'Segoe UI',Arial,sans-serif;color:#2377a6;letter-spacing:.08em}
.preview-art-row b{font:400 27px/1 Georgia,serif}
.preview-art-row small{font-size:13px;color:#61798a}
.preview-shell{width:min(1200px,calc(100% - 80px));margin:auto;display:grid;grid-template-columns:190px minmax(0,710px) 1fr;column-gap:56px}
.preview-toc{grid-column:1;align-self:start;position:sticky;top:28px;padding-top:72px}
.preview-toc strong{display:block;font-size:11px;letter-spacing:.13em;color:var(--preview-muted);margin-bottom:20px}
.preview-toc a{display:block;color:var(--preview-muted);font-size:13px;padding:9px 0;border-left:2px solid transparent;padding-left:14px;transition:color .2s,border-color .2s}
.preview-toc a:hover,.preview-toc a[aria-current=true]{color:var(--preview-ink);border-color:var(--preview-blue);text-decoration:none}
.preview-copy{grid-column:2;padding:74px 0 90px;font-size:18px;line-height:1.82;color:var(--preview-ink)}
.preview-copy .lead{font-size:22px;line-height:1.65;color:var(--preview-ink);max-width:none;margin:0 0 32px}
.preview-copy p{margin:0 0 24px}.preview-copy p+p{margin-top:0}
.preview-copy h2{font:400 42px/1.17 Georgia,serif;letter-spacing:-.025em;margin:76px 0 25px;scroll-margin-top:25px}
.preview-copy h3{font:600 18px/1.35 'Segoe UI',Arial,sans-serif;letter-spacing:0;margin:32px 0 12px}
.preview-copy a{color:#0a6fae;text-decoration:underline;text-decoration-color:#8bbdd8;text-underline-offset:4px}
.preview-copy strong{font-weight:650}
.preview-rule{height:1px;background:var(--preview-line);margin:44px 0}
.preview-callout{border-left:3px solid #1e8bca;padding:20px 24px;background:#eaf4f9;border-radius:0 12px 12px 0;margin:36px 0;color:#23485f;font-size:16px}
.preview-callout p{margin:0}
.preview-models{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:36px 0}
.preview-model{background:var(--preview-surface);border:1px solid var(--preview-line);border-radius:15px;padding:22px;min-height:190px}
.preview-model .preview-model-symbol{width:34px;height:34px;display:grid;place-items:center;background:#cce1ed;color:#17455f;border-radius:9px;font-size:16px;font-weight:700;margin-bottom:18px}
.preview-model:nth-child(2) .preview-model-symbol{background:#d6e9f2;color:#145d80}
.preview-model:nth-child(3) .preview-model-symbol{background:#dceff8;color:#075e92}
.preview-model h3{font:400 25px/1.2 Georgia,serif;margin:0 0 8px}.preview-model p{font-size:13px;line-height:1.6;color:var(--preview-muted);margin:0}
.preview-figure{margin:42px 0 46px;background:var(--preview-surface);border:1px solid var(--preview-line);border-radius:18px;padding:29px 30px 24px;overflow:hidden}
.preview-figure figcaption{display:flex;justify-content:space-between;gap:20px;align-items:baseline;margin-bottom:25px}
.preview-figure figcaption strong{font:400 25px/1.25 Georgia,serif}
.preview-figure figcaption span{font-size:11px;color:var(--preview-muted)}
.preview-figure svg{width:100%;height:auto;display:block;overflow:visible}
.preview-figure .gridline{stroke:#dce7ec;stroke-width:1}
.preview-figure .axis-label{fill:#607586;font:12px 'Segoe UI',Arial,sans-serif}
.preview-figure .trace{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:900;stroke-dashoffset:900;transition:stroke-dashoffset 1.5s cubic-bezier(.18,.8,.22,1)}
.preview-figure.in-view .trace{stroke-dashoffset:0}
.preview-figure .trace-1{stroke:#50a8d6}.preview-figure .trace-2{stroke:#1679b1}.preview-figure .trace-3{stroke:#0d4166}
.preview-figure .dot{fill:var(--preview-surface);stroke-width:3;opacity:0;transition:opacity .4s 1.1s}
.preview-figure.in-view .dot{opacity:1}
.preview-figure .dot-1{stroke:#50a8d6}.preview-figure .dot-2{stroke:#1679b1}.preview-figure .dot-3{stroke:#0d4166}
.preview-figure-note{font-size:12px;line-height:1.6;color:var(--preview-muted);margin-top:22px}
.preview-figure figcaption>div{display:grid;gap:5px}
.preview-figure-overline{font:700 10px/1.2 'Segoe UI',Arial,sans-serif;letter-spacing:.16em;color:#287aa6}
.preview-line-figure{padding:35px 38px 27px}
.preview-chart-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--preview-line);margin-bottom:11px}
.preview-chart-tabs{display:flex;gap:28px}
.preview-chart-tabs button{appearance:none;background:none;border:0;border-bottom:2px solid transparent;color:var(--preview-muted);cursor:pointer;font:600 13px/1.3 'Segoe UI',Arial,sans-serif;padding:15px 0 14px;white-space:nowrap}
.preview-chart-tabs button[aria-selected=true]{color:var(--preview-ink);border-bottom-color:#1c8bca}
.preview-chart-tabs button:focus-visible{outline:2px solid #1c8bca;outline-offset:3px}
.preview-chart-legend{display:flex;gap:19px;flex-wrap:wrap;font:600 12px/1.3 'Segoe UI',Arial,sans-serif}
.preview-chart-legend span,.preview-track-key span{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.preview-chart-legend i{width:10px;height:10px;border-radius:50%;display:inline-block;background:var(--chart-color);border:1px solid #092c3f}
.preview-chart-legend .nipp,.chart-series.nipp{--chart-color:#2d9ec9}
.preview-chart-legend .ime,.chart-series.ime{--chart-color:#1282ad}
.preview-chart-legend .eepos,.chart-series.eepos{--chart-color:#0a3f5e}
.preview-chart-panel{overflow-x:auto;overflow-y:hidden}
.preview-chart-panel::-webkit-scrollbar{display:none}
.preview-chart-panel{scrollbar-width:none}
.preview-chart-panel[hidden]{display:none}
.preview-chart-hint{display:none}
.preview-chart-panel svg{width:100%;min-width:0;max-height:390px}
.preview-chart-panel .chart-grid{stroke:#d4e0e6;stroke-width:1;fill:none}
.preview-chart-panel .chart-grid line:last-child{stroke:#71848e;stroke-width:1.3}
.preview-chart-panel text{fill:var(--preview-muted);font-family:'Segoe UI',Arial,sans-serif}
.preview-chart-panel .chart-axis-title{font-size:12px;font-weight:700;fill:var(--preview-ink)}
.preview-chart-panel .chart-axis-label{font-size:11px}
.preview-chart-panel .chart-series{fill:none;stroke:var(--chart-color);stroke-width:3.4;stroke-linejoin:round;stroke-linecap:round}
.preview-chart-panel .chart-series polyline{stroke-dasharray:950;stroke-dashoffset:950;transition:stroke-dashoffset 1.15s cubic-bezier(.2,.8,.25,1)}
.preview-figure.in-view .chart-series polyline{stroke-dashoffset:0}
.preview-chart-panel .chart-series circle{fill:var(--preview-surface);stroke:var(--chart-color);stroke-width:3;opacity:0;transition:opacity .35s .85s}
.preview-figure.in-view .chart-series circle{opacity:1}
.preview-chart-panel .chart-series .chart-value{font:700 11px/1 'Segoe UI',Arial,sans-serif;fill:var(--chart-color);stroke:none;opacity:0;transition:opacity .35s .85s}
.preview-figure.in-view .chart-series .chart-value{opacity:1}
.preview-chart-panel .chart-category{font-size:11px;fill:var(--preview-ink)}
.preview-chart-panel .chart-grid text{font-size:11px;fill:var(--preview-muted)}
.preview-chart-panel .chart-grid .chart-axis{stroke:#8699a3;stroke-width:1.4}
.preview-mobile-score{display:none}
.preview-response-figure{padding:35px 38px 30px}
.preview-response-figure>p:not(.preview-figure-note){font-size:15px;line-height:1.65;color:var(--preview-muted);margin:0 0 25px}
.preview-speed-legend{display:flex;gap:19px;justify-content:flex-end;margin:0 0 18px;color:var(--preview-muted);font:600 11px/1.3 'Segoe UI',Arial,sans-serif}
.preview-speed-legend span{display:flex;align-items:center;gap:7px}
.preview-speed-legend i{width:12px;height:12px;background:#0a3f5e;border-radius:2px}
.preview-speed-legend span:last-child i{opacity:.34}
.preview-speed-axis{display:flex;justify-content:space-between;padding-left:101px;margin-bottom:9px;font:11px/1.3 'Segoe UI',Arial,sans-serif;color:var(--preview-muted)}
.preview-speed-rows{display:grid;gap:23px;padding:9px 0 5px}
.preview-speed-row{display:grid;grid-template-columns:82px minmax(0,1fr);gap:19px;align-items:center}
.preview-speed-row>strong{font-size:14px}
.preview-speed-pair{display:grid;gap:7px;background:repeating-linear-gradient(90deg,transparent,transparent calc(25% - 1px),var(--preview-line) calc(25% - 1px),var(--preview-line) 25%)}
.preview-speed-track{height:27px;position:relative;display:flex;align-items:center;gap:8px}
.preview-speed-bar{width:var(--bar-width);height:19px;background:var(--chart-color);display:block;border-radius:3px;transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.18,.8,.22,1)}
.preview-figure.in-view .preview-speed-bar{transform:scaleX(1)}
.preview-speed-track.is-previous .preview-speed-bar{opacity:.34;transition-delay:.14s}
.preview-speed-bar.eepos{--chart-color:#0a3f5e}.preview-speed-bar.ime{--chart-color:#1282ad}.preview-speed-bar.nipp{--chart-color:#2d9ec9}
.preview-speed-track b{font:700 12px/1 'Segoe UI',Arial,sans-serif;white-space:nowrap;color:var(--preview-ink)}
.preview-speed-track small{position:absolute;right:0;font:600 10px/1 'Segoe UI',Arial,sans-serif;color:var(--preview-muted)}
.preview-track-key{display:flex;flex-wrap:wrap;gap:20px;margin:6px 0 21px;font:600 11px/1.3 'Segoe UI',Arial,sans-serif;color:var(--preview-muted)}
.preview-track-key i{width:11px;height:11px;border-radius:3px;display:inline-block}
.key-answer,.track-answer{background:#154f72}.key-example,.track-example{background:#278fb9}.key-steps,.track-steps{background:#a4d2e6}
.preview-tracks{display:grid;gap:18px}
.preview-track{display:grid;grid-template-columns:91px minmax(0,1fr);align-items:center;gap:15px;font:600 12px/1.25 'Segoe UI',Arial,sans-serif}
.preview-track>div{display:flex;gap:4px;min-width:0;background:repeating-linear-gradient(90deg,transparent,transparent calc(25% - 1px),#dce7ec calc(25% - 1px),#dce7ec 25%);border-bottom:1px solid var(--preview-line);padding:6px 0;min-height:43px}
.preview-track>div span{display:flex;align-items:center;width:var(--segment);min-width:0;border-radius:4px;padding:0 10px;color:#fff;overflow:hidden;white-space:nowrap;transform:scaleX(0);transform-origin:left;transition:transform .75s cubic-bezier(.2,.8,.25,1)}
.preview-track>div .track-steps{color:#143b52}
.preview-figure.in-view .preview-track>div span{transform:scaleX(1)}
.preview-track:nth-child(2)>div span{transition-delay:.13s}.preview-track:nth-child(3)>div span{transition-delay:.26s}
.preview-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin:37px 0}
.preview-principles>div{background:var(--preview-surface);border:1px solid var(--preview-line);border-radius:13px;padding:20px}
.preview-principles span{display:block;color:#2589ba;font-size:11px;font-weight:700;letter-spacing:.1em;margin-bottom:17px}
.preview-principles strong{display:block;font-size:15px;line-height:1.3}
.preview-principles p{font-size:12px;line-height:1.55;color:var(--preview-muted);margin:8px 0 0}
.preview-copy h2.preview-section-first{margin-top:0}
.preview-compare{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:38px 0}
.preview-compare>div{padding:24px;border:1px solid var(--preview-line);border-radius:14px;background:var(--preview-surface)}
.preview-compare .compare-label{display:block;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--preview-muted);margin-bottom:16px}
.preview-compare p{font-size:15px;line-height:1.7;margin:0}
.preview-compare>div:last-child{border-color:#81bcd9;background:#f1f9fd}
.preview-steps{counter-reset:steps;list-style:none;padding:0;margin:32px 0;border-top:1px solid var(--preview-line)}
.preview-steps li{counter-increment:steps;display:grid;grid-template-columns:45px 1fr;gap:12px;border-bottom:1px solid var(--preview-line);padding:22px 0;font-size:16px}
.preview-steps li:before{content:counter(steps,decimal-leading-zero);color:#3f8eb9;font-weight:700;font-size:12px;padding-top:5px}
.preview-steps strong{display:block;margin-bottom:3px}
.preview-end{border-top:1px solid var(--preview-line);padding:32px 0 80px;display:flex;justify-content:space-between;gap:20px;align-items:center;color:var(--preview-muted);font-size:13px}
.preview-end a{font-size:15px;color:var(--preview-ink);font-weight:600}
.preview-article footer{background:var(--preview-surface)}
html[data-theme=dark] .preview-article{--preview-bg:#1d1d1d;--preview-surface:#252625;--preview-ink:#ecefeb;--preview-muted:#aab5b9;--preview-line:#383e40;--preview-blue:#8cc8e8}
html[data-theme=dark] .preview-article .preview-note{background:#1b3545;color:#bcd5e4}
html[data-theme=dark] .preview-article .preview-note strong{color:#bce5fa}
html[data-theme=dark] .preview-article .preview-callout{background:#213746;color:#d1e8f2}
html[data-theme=dark] .preview-article .preview-model-symbol{background:#28485c;color:#c5e9f9}
html[data-theme=dark] .preview-article .preview-compare>div:last-child{background:#203747;border-color:#45718c}
html[data-theme=dark] .preview-article .preview-copy a{color:#96d1f0}
html[data-theme=dark] .preview-figure .gridline{stroke:#3a464b}
html[data-theme=dark] .preview-figure .axis-label{fill:#a9b9c1}
html[data-theme=dark] .preview-chart-panel .chart-grid{stroke:#46545a}
html[data-theme=dark] .preview-chart-panel .chart-grid line:last-child{stroke:#93a9b4}
html[data-theme=dark] .preview-figure-overline{color:#8ec9e7}
html[data-theme=dark] .preview-chart-legend .eepos,html[data-theme=dark] .chart-series.eepos{--chart-color:#add4e9}
html[data-theme=dark] .preview-speed-bar.eepos{--chart-color:#add4e9}
html[data-theme=dark] .preview-speed-legend i{background:#add4e9}
html[data-theme=dark] .mobile-score-row .eepos{--bar-color:#add4e9}
html[data-theme=dark] .preview-track>div{background-image:repeating-linear-gradient(90deg,transparent,transparent calc(25% - 1px),#39494f calc(25% - 1px),#39494f 25%)}
@keyframes preview-orbit{to{transform:rotate(360deg)}}
@keyframes preview-arrive{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
@media(max-width:1100px){.preview-shell{grid-template-columns:165px minmax(0,1fr);column-gap:35px}.preview-copy{grid-column:2}.preview-hero-inner{gap:22px}}
@media(max-width:760px){.preview-hero-inner{grid-template-columns:1fr;gap:15px;padding-top:60px;padding-bottom:54px}.preview-art{min-height:260px}.preview-art:before{width:280px;height:280px}.preview-art:after{width:190px;height:190px}.preview-art-stack{max-width:370px}.preview-art-row{padding:15px 18px;grid-template-columns:58px 1fr auto}.preview-art-row b{font-size:23px}.preview-shell{display:block;width:calc(100% - 36px)}.preview-toc{position:static;padding:30px 0 0;display:flex;gap:12px;overflow:auto}.preview-toc strong{flex:none;margin:8px 8px 0 0}.preview-toc a{flex:none;border-left:0;border-bottom:2px solid transparent;padding:6px}.preview-toc a[aria-current=true],.preview-toc a:hover{border-bottom-color:var(--preview-blue)}.preview-copy{padding:38px 0 65px;font-size:16px}.preview-copy .lead{font-size:19px}.preview-copy h2{font-size:34px;margin-top:56px}.preview-copy h2.preview-section-first{margin-top:0}.preview-models{grid-template-columns:1fr}.preview-model{min-height:0}.preview-compare{grid-template-columns:1fr}.preview-figure{padding:20px}.preview-chart-tabs{gap:14px}.preview-chart-legend{padding:0 0 15px}.preview-chart-panel svg{min-width:560px}.preview-track{grid-template-columns:70px minmax(0,1fr);gap:8px}.preview-track>div span{font-size:10px;padding:0 6px}.preview-principles{grid-template-columns:1fr}.preview-end{padding-bottom:50px}}
@media(max-width:430px){.preview-hero h1{font-size:43px}.preview-hero p{font-size:17px}.preview-art-row{grid-template-columns:45px 1fr auto;gap:10px}.preview-art-row small{font-size:11px}.preview-art-row b{font-size:20px}}
@media(max-width:760px){.preview-chart-hint{display:block;text-align:right;color:var(--preview-muted);font-size:11px;padding-top:5px}}
@media(max-width:760px){.preview-line-figure .preview-chart-panel svg{display:none}.preview-mobile-score{display:grid;gap:20px;padding-top:20px}.mobile-score-task{border-bottom:1px solid var(--preview-line);padding-bottom:17px}.mobile-score-task:last-child{border-bottom:0}.mobile-score-task>strong{display:block;font-size:13px;margin-bottom:10px}.mobile-score-row{display:grid;grid-template-columns:48px minmax(0,1fr) 35px;gap:8px;align-items:center;margin:6px 0;font:11px/1.2 'Segoe UI',Arial,sans-serif}.mobile-score-row>div{height:10px;background:var(--preview-bg);border-radius:99px;overflow:hidden}.mobile-score-row i{display:block;width:var(--score-width);height:100%;border-radius:99px;background:var(--bar-color);transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.8,.25,1)}.preview-figure.in-view .mobile-score-row i{transform:scaleX(1)}.mobile-score-row .eepos{--bar-color:#0a3f5e}.mobile-score-row .ime{--bar-color:#1282ad}.mobile-score-row .nipp{--bar-color:#2d9ec9}.mobile-score-row b{text-align:right;font-weight:700}}
@media(max-width:760px){.preview-speed-row{grid-template-columns:54px minmax(0,1fr);gap:8px}.preview-speed-axis{padding-left:62px}.preview-speed-track small{display:none}.preview-speed-track b{font-size:10px}.preview-response-figure{padding:20px}}
@media(prefers-reduced-motion:reduce){.preview-art:before,.preview-art:after,.preview-art-row{animation:none}.preview-figure .trace,.preview-chart-panel .chart-series polyline{stroke-dashoffset:0;transition:none}.preview-figure .dot,.preview-chart-panel .chart-series circle,.preview-chart-panel .chart-series .chart-value{opacity:1;transition:none}.preview-track>div span,.preview-speed-bar,.mobile-score-row i{transform:none;transition:none}}