/* Approved illustrated field guide: shared content treatment for all 26 pages. */
.case-study{--ds-ink:#10115e;--ds-muted:#354d90;--ds-blue:#3159ff;--ds-line:#b9dcff;--ds-tint:#e8f6ff;--study-ink:#10115e;color:#10115e;background:#fffef6;padding:22px 28px 26px;box-sizing:border-box;min-height:100%;font-size:16px}
.study-header{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:22px;padding:0 0 18px;margin-bottom:18px;border-bottom:1px solid #bee4ff}.study-header>div{min-width:0}.study-kicker{display:inline-block;color:#1857ff;font-size:14px;font-weight:800;background:linear-gradient(95deg,#ddf3ff,#eef5ff);border-radius:18px;padding:3px 18px;letter-spacing:.04em}
.case-study .study-header h4{font-size:clamp(27px,2.6vw,42px);font-weight:900;line-height:1.25;letter-spacing:.01em;color:#090b62;margin:9px 0 8px;text-shadow:0 1px 0 #fff,1px 2px 0 #d9e4ff;position:relative}.study-header h4:before{content:'';position:absolute;width:7px;height:18px;background:#ffc600;left:-17px;top:0;transform:rotate(-35deg);border-radius:3px}.case-study p{font-size:16px;line-height:1.7;color:#354d90;margin:0}.case-study .study-lead{font-size:16px;color:#273a83;max-width:1000px}.study-page-number{background:linear-gradient(120deg,#e5dfff,#e1f9ff);border-radius:45% 35% 42% 30%;padding:11px 15px;font-size:27px;font-weight:900;color:#0d1264;white-space:nowrap}.study-page-number small{font-size:14px}
.study-body{display:grid;gap:19px}.study-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}.study-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.study-feature{display:grid;grid-template-columns:minmax(0,2.35fr) minmax(250px,1fr);gap:28px;align-items:start}.study-phone-layout{display:grid;grid-template-columns:minmax(210px,.8fr) minmax(0,1.8fr);gap:28px;align-items:start}.study-stack,.study-sidebar{display:grid;gap:17px;min-width:0}.study-three-zone{display:grid;grid-template-columns:minmax(180px,.85fr) minmax(180px,.85fr) minmax(240px,1.3fr);gap:23px;align-items:start}.study-tutorial-final{display:grid;grid-template-columns:minmax(0,2.5fr) minmax(250px,1fr);gap:22px}.study-section{min-width:0;display:grid;gap:9px}.case-study h5{font-size:19px;line-height:1.45;color:#11156a;font-weight:800;margin:0}.case-study .study-section-title{display:flex;gap:12px;align-items:center;font-size:20px}.study-section-title>span{display:inline-grid;place-items:center;min-width:44px;padding:2px 10px;border-radius:45% 35% 40% 30%;background:linear-gradient(110deg,#9ddcff,#d8faff);font-size:21px;color:#071168}.study-section:nth-child(3n+2) .study-section-title>span{background:linear-gradient(110deg,#a8f3f5,#d4fff0)}.study-section:nth-child(3n) .study-section-title>span{background:linear-gradient(110deg,#ffd2a7,#ffedce)}
.study-image{margin:0;min-width:0}.study-image button{position:relative;width:100%;padding:0;display:block;overflow:hidden;background:#e7f4ff;border:1px solid #8fc5ff;border-radius:9px;cursor:zoom-in;box-shadow:0 2px 0 #b7e7ff}.study-image img{display:block;width:100%;height:auto}.study-image button>span{position:absolute;bottom:8px;right:8px;color:#3020d4;background:#f5faffdf;border:1px solid #c6d5ff;border-radius:7px;padding:3px 8px}.study-image figcaption{font-size:13px;color:#6177a7;line-height:1.5;padding-top:6px}.study-portrait{width:min(100%,320px);justify-self:center}.study-portrait img{max-height:none;object-fit:contain}.art-window{position:relative;overflow:hidden;border-radius:8px;background:#eaf4ff;outline:1px solid #c1dfff}.art-window>img{position:absolute;max-width:none;height:auto;display:block}
.study-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:16px}.study-cards>section{display:flex;align-items:flex-start;gap:12px;min-width:0;background:linear-gradient(110deg,#e5f5ff,#f4faff);padding:16px;border:1px solid #dbedff;border-radius:10px}.study-token{flex:none;display:grid;place-items:center;background:linear-gradient(125deg,#b3eaff,#9ddbf6);color:#1323be;font-size:19px;font-weight:900;width:37px;height:37px;border-radius:50%;box-shadow:inset 0 2px 0 #ffffffb3}.study-cards>section:nth-child(3n+2) .study-token{background:linear-gradient(125deg,#abf3eb,#d2ecff)}.study-cards>section:nth-child(3n) .study-token{background:linear-gradient(125deg,#d8c8ff,#e2edff)}.study-cards h5{margin-bottom:5px}.study-sidebar .study-cards{grid-template-columns:1fr;gap:15px}.study-sidebar .study-cards>section{background:transparent;border:0;border-bottom:1px solid #a69aff;border-radius:0;padding:0 0 15px}.study-sidebar .study-cards>section:last-child{border-bottom:0}.study-sidebar .study-token{background:#e0d8ff;color:#552bff}
.study-note{display:flex;align-items:center;gap:20px;border:0;border-radius:12px;background:linear-gradient(100deg,#ece7ff,#f3efff);padding:14px 20px}.study-note strong{flex:none;color:#5430f5;font-size:20px;font-weight:900;padding-right:18px;border-right:1px solid #ac93ff}.case-study .study-note p{color:#111864;font-weight:650}.study-sidebar .study-note,.study-columns .study-note{display:block;padding:13px 15px;background:#eaf6ff}.study-sidebar .study-note strong,.study-columns .study-note strong{display:block;border:0;padding:0;margin-bottom:6px;font-size:16px}.case-study .study-footnote{font-size:13px;color:#7183b2;line-height:1.6}
.study-flow{display:flex;list-style:none;padding:0;margin:0;gap:19px;align-items:stretch}.study-flow li{position:relative;flex:1;min-width:0;padding:15px 10px;display:grid;align-content:center;justify-items:center;gap:8px;background:linear-gradient(140deg,#e1f5ff,#edf0ff);border:1px solid #9bd1ff;border-radius:10px;text-align:center}.study-flow li:not(:last-child):after{content:'›';position:absolute;right:-18px;top:50%;transform:translateY(-50%);font-size:32px;color:#5667ff}.study-flow small{font-weight:900;font-size:14px;background:#346cff;border-radius:50%;color:#fff;width:27px;height:27px;display:grid;place-items:center}.study-flow b{font-size:16px;line-height:1.5;color:#11186b}.study-picture-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.study-picture-flow figcaption{font-size:16px;text-align:center;color:#151966;font-weight:800}.study-picture-flow img{aspect-ratio:1.7;object-fit:cover}
.study-requirements{margin:0;border:1px solid #b6e2ff;border-radius:12px;overflow:hidden}.study-requirements>div{display:grid;grid-template-columns:minmax(150px,.8fr) 3fr;padding:11px 20px;background:#e6f5ff;gap:20px}.study-requirements>div:nth-child(2){background:#fff9e7}.study-requirements dt{font-weight:800;color:#111369;border-right:1px solid #a8cefb}.study-requirements dd{margin:0;color:#334887;line-height:1.65}.study-states{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:12px}.study-states>div{border:1px solid #d3e9ff;background:linear-gradient(120deg,#f0faff,#fafbff);border-radius:12px;padding:12px;display:grid;gap:5px}.study-states b{font-size:16px;color:#14186d}.study-states span{font-size:14px;color:#4a61a0;line-height:1.6}
.study-list{padding:14px 0}.study-list h5{font-size:22px;display:flex;align-items:center;gap:10px}.study-list h5:before{content:'✓';display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#d7e7ff;color:#572aff}.study-list ul{margin:12px 0 0;padding-left:23px;color:#2c4287;font-size:16px;line-height:1.9}.study-related{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:14px;border-radius:12px;background:#e3f5ff}.study-related button{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;text-align:left;border:1px solid #d3eaff;background:#fffef9;color:#121976;border-radius:8px;padding:13px;cursor:pointer}.study-related button>span{grid-row:span 2;font-size:29px;color:#4844ff}.study-related b{font-size:15px}.study-related small{font-size:12px;color:#6c7fb2}.study-related button:hover{border-color:#7260ff;box-shadow:0 3px 0 #c7c6ff;transform:translateY(-2px)}
.study-visual-guide{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:20px;border-top:1px solid #bae5ff;padding-top:18px}.study-palette{display:flex;gap:12px;margin-top:10px}.study-palette span{font-size:12px;text-align:center;flex:1;color:#33427f}.study-palette i{display:block;height:35px;border-radius:10px;margin-bottom:6px}.study-icons{display:flex;gap:8px;flex-wrap:wrap;padding-top:15px}.study-icons img{width:48px;height:48px;object-fit:contain}.study-decision{display:grid;grid-template-columns:1.3fr 1fr 1fr;align-items:center;gap:24px}.study-branch{display:grid;gap:12px}.study-branch>section{border:1px dashed #8ecaff;background:#f5fbff;padding:12px;border-radius:12px;display:grid;gap:9px}.study-branch>section>b{font-size:14px;color:#355fff}.study-missing{min-height:240px;display:flex;flex-direction:column;justify-content:center;gap:15px;align-items:center;background:#eef7ff;border:1px dashed #9bc6f2;border-radius:12px;color:#6d83b0;text-align:center;padding:20px}.study-missing>b{font-size:23px}.study-missing small{line-height:1.7}
/* The page surface and controls match the approved book while preserving viewport sizing. */
.reading-project .case-deck,#project-one .case-deck{border:2px solid #171572;border-radius:24px 14px 25px 17px;background:#fffef6;box-shadow:5px 6px 0 #b5e6fc,8px 9px 0 #4949ab,12px 12px 0 #d6f2ff}
.reading-project .deck-titlebar,#project-one .deck-titlebar{background:#fffef6;border-bottom:1px solid #b6ddff;padding:10px 25px}.reading-project .deck-titlebar h3{color:#11166a;font-weight:850}.reading-project .deck-titlebar>div>span{color:#3155e4;font-weight:800}.reading-project .page-toolbar,#project-one .page-toolbar{background:#fffef6;border-top:1px solid #b9e1ff;padding:10px 17px;gap:12px}.reading-project .page-jumps{min-width:0;overflow-x:auto;scrollbar-width:thin}.reading-project .page-jumps>button,#project-one .page-jumps>button{background:#f0f5fb;border:1px solid transparent;color:#1c2b7e;box-shadow:none;border-radius:8px;padding:7px 12px;font-size:14px}.reading-project .page-jumps>button[aria-current],#project-one .page-jumps>button[aria-current]{background:linear-gradient(110deg,#b6e7ff,#d2d6ff);color:#3022e7;border-color:#bbcaff;font-weight:800}.reading-project .page-jumps small{border-radius:50%;background:#ffffffa8;padding:3px 5px;color:#243acf}.reading-project .page-arrow,#project-one .page-arrow{border-color:#222079;background:#f4fcff;color:#20148b;border-radius:9px 12px 9px 11px;box-shadow:2px 3px 0 #8ebaff,inset 0 0 0 2px #fff}.reading-project .page-arrow:last-child,#project-one .page-arrow:last-child{background:linear-gradient(140deg,#9476ff,#572bff);color:#fff;border-color:#211176;box-shadow:2px 3px 0 #252273,inset 0 0 0 2px #b6a1ff}.reading-project .expand-slide,#project-one .expand-slide{background:#f4fbff;border:1px solid #a8ceff;color:#2451d6;box-shadow:0 2px 0 #c6dfff}
.reading-project .case-tabs>button,#project-one .case-tabs>button{background:linear-gradient(130deg,#fffef0,#fff6d8);border-color:#181571;color:#10166a;box-shadow:inset 4px 0 0 #e2d1a5,inset 0 -5px 0 #f3dfa9,-5px 5px 0 #a6dafa,0 6px 0 #36388b}.reading-project .case-tabs>button:nth-child(2),.reading-project .case-tabs>button:nth-child(3),.reading-project .case-tabs>button:nth-child(4){background:linear-gradient(130deg,#f4ffff,#d9f1ff)}.reading-project .case-tabs>button:last-child{background:linear-gradient(130deg,#f2fff9,#d2f9ef)}.reading-project .case-tabs>button[aria-selected=true],#project-one .case-tabs>button[aria-selected=true]{color:#fff;background:linear-gradient(145deg,#8b72ff,#5430fa);border-color:#21117a;box-shadow:inset 4px 0 0 #b1a4ff,inset 0 -5px 0 #4721c5,-5px 5px 0 #8c9aea,0 6px 0 #211677}.case-tab-icon{width:26px;height:28px;flex:none;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round}.reading-project .case-tabs>button>span{flex:1}.reading-project .case-tabs>button small{order:3}
/* Project overview inherits the same ink and paper; text and loop are untouched. */
.ds-page.ds-overview{--ds-ink:#10156a;--ds-muted:#354d90;--ds-blue:#3158fa;--ds-line:#b9dcff;--ds-tint:#e6f5ff;background:#fffef6}.ds-overview-header h3{font-size:32px;font-weight:900}.ds-section-label h4{font-weight:850;color:#14176c}.ds-role-strip{background:#eaf6ff;border-radius:10px;padding:12px 16px}.ds-challenge-pair{background:linear-gradient(100deg,#e8f7ff,#f8fcff);border:1px solid #d4eaff;border-radius:12px;padding:15px!important;margin-bottom:15px}.ds-contributions>div{background:#edf7ff;border:1px solid #cfe4ff;border-radius:10px;padding:12px}.ds-complete-loop rect{fill:#e5f5ff;stroke:#69aaff;stroke-width:1.7;rx:12}.ds-complete-loop text{fill:#243b86}.ds-complete-loop g:nth-of-type(4) text{fill:#2d41e8;font-weight:800}.ds-reward-modal{border:2px solid #4541b6!important;border-radius:16px!important;background:#f5faff!important;box-shadow:0 5px 0 #567bdc}.ds-overview .ds-callout{background:#eee9ff;border-radius:10px}.project-background,.showcase{background:#fffef6}.background-field{border-color:#b7dcff!important;background:#edf8ff;border-radius:10px;padding:16px}.background-intro h3,.showcase-heading h3{color:#131467;font-weight:900}
.case-study button:focus-visible,.reading-project .case-tabs button:focus-visible{outline:3px solid #4f37ff;outline-offset:4px}.native-reading .case-study{padding:22px 26px}.native-reading .study-header h4{font-size:34px}
@media(max-width:1000px){.study-feature{grid-template-columns:minmax(0,1.6fr) minmax(220px,1fr)}.study-three-zone{grid-template-columns:1fr 1fr}.study-three-zone>.study-sidebar{grid-column:1/-1}.study-three-zone .study-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.study-visual-guide{grid-template-columns:repeat(2,minmax(0,1fr))}.study-decision{grid-template-columns:1fr}.study-tutorial-final{grid-template-columns:1fr}.study-related{grid-template-columns:repeat(2,minmax(0,1fr))}.study-phone-layout{grid-template-columns:minmax(180px,.7fr) minmax(0,1.4fr)}}
@media(max-width:700px){.case-study,.native-reading .case-study{padding:18px}.study-grid,.study-feature,.study-phone-layout,.study-columns,.study-three-zone{grid-template-columns:1fr}.study-three-zone>.study-sidebar{grid-column:auto}.study-three-zone .study-cards{grid-template-columns:1fr}.study-header{gap:10px}.study-page-number{font-size:20px;padding:8px}.study-header h4:before{left:-12px;width:5px;height:12px}.study-cards{grid-template-columns:1fr}.study-picture-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.study-flow{flex-wrap:wrap;gap:12px}.study-flow li{flex:1 1 120px}.study-flow li:after{display:none}.study-note{display:block;padding:14px}.study-note strong{display:block;border:0;padding:0;margin-bottom:6px}.study-requirements>div{grid-template-columns:1fr;gap:5px;padding:12px}.study-requirements dt{border:0}.study-visual-guide{grid-template-columns:1fr}.study-portrait{width:min(100%,300px)}.case-tab-icon{width:21px;height:23px}.study-related{grid-template-columns:1fr 1fr}.study-related button{padding:9px;display:block}.study-related button>span{display:none}.study-related small{display:block;margin-top:5px}}
/* Reuse the cover's illustration instead of inventing a second art style. */
.study-header{padding-right:145px;min-height:117px}.study-page-number{position:absolute;right:0;top:0}.study-birds{position:absolute;right:0;bottom:10px;width:139px;height:63px;pointer-events:none}.study-birds i{position:absolute;display:block;background-image:url('/assets/art/flight/birds.png');background-repeat:no-repeat;background-size:501px 283px;width:77px;height:57px;left:0;top:0;background-position:-31.5px -57px;transform:rotate(-7deg)}.study-birds i+ i{background-size:585px 330px;background-position:-229px -72px;width:76px;height:46px;left:63px;top:17px;filter:hue-rotate(-22deg)}
@media(max-width:700px){.study-header{padding-right:0;min-height:0}.study-header>div{padding-right:60px}.study-birds{display:none}.study-page-number{font-size:18px;padding:7px}.study-page-number small{font-size:12px}.study-header .study-lead{margin-right:-60px}}