.story-page{--navy:#173f55;--ink:#173f55;--muted:#526d79;color:#173f55;padding-bottom:55px}
.story-page>.story-layout{padding-top:28px}
.road-page>.road-layout{margin-top:24px}
.story-highlights{display:flex;flex-wrap:wrap;list-style:none;gap:12px;padding:20px 0 0;margin:0}.story-highlights li{border:1px solid #c8e1e3;background:#f3fafa;color:#173f55;padding:10px 16px;border-radius:10px;font-size:12px}
.story-page :is(h2,h3,p,li,td,th){overflow-wrap:anywhere}
.story-cover{padding-top:24px}.story-cover>div{height:300px;display:flex;align-items:center;justify-content:center;background:linear-gradient(120deg,#edf7f7,#fff);border:1px solid #c8e1e3;border-radius:20px;padding:24px;overflow:hidden}
.story-cover :is(svg,img){width:100%;height:100%;max-height:260px;object-fit:contain!important}
.story-nav{display:flex;flex-wrap:wrap;gap:9px;padding-block:24px}.story-nav a{background:#f4fafa;color:#174d5d;border:1px solid #c8e1e3;border-radius:24px;padding:9px 16px;font-size:12px}.story-nav a:hover{background:#A9DDDD}
.story-layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:24px;align-items:start}.story-article{min-width:0;display:grid;gap:22px}.story-layout>.side-panel{position:sticky;top:110px;max-height:calc(100vh - 130px);overflow:auto;min-width:0}
.story-panel{background:#fff;color:#173f55;border:1px solid #c8e1e3;border-radius:18px;padding:30px;scroll-margin-top:115px;min-width:0}
html[data-theme="theme-9"] .story-page :is(h2,h3){color:#173f55}
html[data-theme="theme-9"] .story-page p{color:#526d79}
.story-panel h2{font-size:24px;margin:0 0 20px}.story-panel p{line-height:2.05;font-size:14px;margin:12px 0}
.story-panel p{white-space:pre-line}
.story-page[data-story-project="p3"] .story-step-body{grid-template-columns:140px minmax(0,1fr);gap:28px;min-height:190px;background:linear-gradient(110deg,#edf8f7,#fff);padding:28px}
.story-step-graphic{display:block;width:120px;height:120px;max-width:100%;margin:auto}
.story-page[data-story-project="p3"] .story-step-copy p{font-size:19px;font-weight:700;color:#173f55;margin:0}
@media(max-width:600px){.story-page[data-story-project="p3"] .story-step-body{grid-template-columns:1fr;gap:18px;padding:22px}.story-step-graphic{width:90px;height:90px}.story-page[data-story-project="p3"] .story-step-copy{min-height:70px;text-align:center;justify-content:center}.story-page[data-story-project="p3"] .story-step-copy p{font-size:16px}}
.story-items{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0 0}.story-items li{padding:18px;border-radius:12px;border:1px solid #d7e7e8;background:#f4fafa;font-size:13px;line-height:1.9}
.story-photos{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:22px}.story-photos figure{margin:0;flex:1 1 220px;min-width:0;max-width:100%}.story-source-image{display:block;background:#f1f6f6;width:100%;height:280px;border-radius:12px;padding:12px;box-sizing:border-box;max-width:100%}
.story-table-wrap{overflow-x:auto;margin-top:20px;border:1px solid #d7e7e8;border-radius:12px}.story-table-wrap table{width:100%;border-collapse:collapse;min-width:0;table-layout:fixed}.story-table-wrap :is(th,td){padding:14px;border-bottom:1px solid #d7e7e8;text-align:start;font-size:12px;line-height:1.9;color:#173f55}.story-table-wrap th{background:#edf7f7}
.story-steps{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0}.story-steps button{flex:1 1 120px;font:inherit;font-size:12px;line-height:1.8;cursor:pointer;border:1px solid #c8e1e3;background:#edf7f7;color:#173f55;border-radius:12px;padding:13px 9px;min-height:50px}.story-steps button[aria-pressed="true"]{background:#174d5d;color:white;border-color:#174d5d}
.story-step-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center;gap:22px;border:1px solid #d7e7e8;background:#f4fafa;border-radius:14px;padding:20px}.story-step-body>[data-story-image]:empty{display:none}.story-step-body:has(>[data-story-image]:empty){grid-template-columns:1fr}.story-step-copy{min-width:0;min-height:110px;display:flex;align-items:center}.story-step-body .story-source-image{height:190px;background:#fff}
.story-controls{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px;align-items:center}.story-controls .button{font-size:12px}.story-controls button:disabled{opacity:.4;cursor:default}.story-reset{border:0;background:transparent;font:inherit;font-size:12px;color:#087e80;text-decoration:underline;cursor:pointer;margin-inline-start:auto}
.story-flow{display:flex;gap:5px;align-items:center;margin-bottom:18px}.story-flow span{flex:1;height:5px;background:#d1e7e7;border-radius:5px}.story-flow span.current{background:#087e80}
.story-panel details{border:1px solid #c8e1e3;padding:18px;border-radius:12px}.story-panel summary{cursor:pointer;font-weight:bold;color:#174d5d}
.story-page :is(button,a):focus-visible{outline:3px solid #087e80;outline-offset:3px}
@media(max-width:1000px){.story-layout{grid-template-columns:minmax(0,1fr)}.story-layout>.side-panel{position:static;max-height:none;overflow:visible}}
@media(max-width:600px){.story-cover>div{height:220px;padding:14px}.story-panel{padding:20px;scroll-margin-top:105px}.story-panel h2{font-size:21px}.story-panel p{font-size:13px}.story-items{grid-template-columns:1fr}.story-step-body{grid-template-columns:1fr;padding:15px}.story-step-copy{min-height:130px}.story-steps button{flex-basis:42%;font-size:11px}.story-nav a{font-size:11px;padding:8px 12px}.story-source-image{height:240px}.story-table-wrap :is(th,td){padding:8px;font-size:10px}.story-reset{flex-basis:100%;text-align:start}}
@media(prefers-reduced-motion:reduce){.story-page *{scroll-behavior:auto;transition:none}}