.sys-home,.sys-world-page,.sys-play{color:#173f41}.sys-hero{padding:clamp(24px,5vw,54px);background:linear-gradient(120deg,#e4f5ef,#e5f2fa);border-radius:25px;border:1px solid #c6ddd7;margin:16px 0 30px}.sys-hero h1{font-size:clamp(2.1rem,4vw,3.7rem);margin:5px 0}.sys-hero p{max-width:62ch;line-height:1.6}.sys-world-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}.sys-world{display:flex;flex-direction:column;text-align:left;gap:12px;min-height:155px;border:1px solid #bcd8d2;border-radius:18px;padding:19px;color:#17474b;background:#f4faf4}.sys-world.sky{background:#e9f5fb}.sys-world.mint{background:#e7f6ec}.sys-world.berry{background:#f6edf5}.sys-world.garden{background:#f0f5df}.sys-world:hover,.sys-challenge-list button:hover{filter:brightness(.97);transform:translateY(-1px)}.sys-world small{font-size:.72rem;letter-spacing:.1em;font-weight:700;color:#47716d}.sys-world strong{font-size:1.35rem}.sys-world span{font-size:.85rem;line-height:1.4;color:#54726d}.sys-world-page h1{font-size:clamp(2rem,4vw,3.2rem);margin:5px 0}.sys-world-page>p{max-width:70ch}.sys-challenge-list{display:grid;gap:10px;margin:20px 0}.sys-challenge-list button{display:flex;align-items:center;gap:16px;text-align:left;padding:16px;background:white;border:1px solid #cddfd9;border-radius:14px;color:#173f41}.sys-challenge-list b{border-radius:50%;width:36px;height:36px;display:grid;place-items:center;background:#d7f0e9}.sys-challenge-list strong,.sys-challenge-list small{display:block}.sys-challenge-list small{color:#56716c;margin-top:4px}.sys-challenge-list em{margin-left:auto;font-style:normal;font-size:.8rem;color:#2f756c;white-space:nowrap}.sys-top{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#4c6e68;font-size:.88rem}.sys-engineer-toggle,.sys-tabs button,.sys-overlays button,.sys-actions button:not(.primary),.sys-tools button,.sys-card button:not(.primary){border:1px solid #a9c9c1;border-radius:9px;padding:8px 10px;background:#fff;color:#174f54;min-height:42px}.sys-engineer-toggle[aria-pressed=true],.sys-tabs button[aria-pressed=true],.sys-overlays button[aria-pressed=true],.sys-tools button[aria-pressed=true],.sys-card button[aria-pressed=true]{background:#175c64;color:white;border-color:#175c64}.sys-heading{margin:15px 0}.sys-heading h1{font-size:clamp(1.8rem,3vw,2.8rem);margin:5px 0}.sys-heading p:last-child{line-height:1.45;margin:4px 0}.sys-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(275px,340px);align-items:start;gap:16px}.sys-workbench,.sys-side{border:1px solid #d4e2dc;border-radius:18px;background:#fffefa;padding:14px;box-shadow:0 10px 30px #25423b0d}.sys-side{display:grid;gap:12px}.sys-tabs,.sys-overlays,.sys-actions{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 10px}.sys-overlays button{font-size:.78rem;min-height:36px}.sys-map-wrap{overflow:auto;background:#d8e8d6;border-radius:14px;padding:8px}.sys-map{--sys-cell:clamp(30px,5vw,57px);display:grid;grid-template-columns:repeat(12,var(--sys-cell));grid-template-rows:repeat(7,var(--sys-cell));width:max-content;margin:auto;border:3px solid #81a58d;border-radius:8px;overflow:hidden}.sys-cell{border:1px solid #86a990;padding:0;display:grid;place-items:center;background:#aad0a2;color:#235f5c;position:relative;min-width:0}.sys-cell span{font-size:clamp(15px,2vw,26px);z-index:1}.sys-cell small{position:absolute;bottom:0;right:1px;font-size:.55rem;background:#fff8}.sys-cell.forest{background:#69aa6c}.sys-cell.bare{background:#c9a87e}.sys-cell.pavement{background:#aeb9b8}.sys-cell.garden{background:#74be83}.sys-cell.wetland{background:#83b2a6}.sys-cell.channel{background:#77bad3}.sys-cell.low{box-shadow:inset 0 -6px #41a6d58a}.sys-cell.medium{box-shadow:inset 0 -14px #258bc2a8}.sys-cell.high{box-shadow:inset 0 -24px #0878b9c0}.sys-cell.has-dam{background:#75624b;color:#fff}.sys-cell.has-generator{color:#ffe169;text-shadow:0 1px #415447}.sys-cell.flood-risk{outline:3px solid #d35d47;outline-offset:-4px}.sys-cell.watershed-main{border-color:#277cc3}.sys-map-key{display:flex;justify-content:space-around;flex-wrap:wrap;gap:6px;font-size:.72rem;color:#3c6866;padding:8px 0 2px}.sys-pipe-map{position:relative;aspect-ratio:12/7;min-height:320px;background:linear-gradient(120deg,#edf7ee,#e1eef2);border:3px solid #b7d4ce;border-radius:12px;overflow:hidden}.sys-pipe-map svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.sys-node{position:absolute;transform:translate(-50%,-50%);border:2px solid #528b8b;border-radius:14px;background:#fff;padding:5px 8px;min-width:57px;min-height:51px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#194f55;box-shadow:0 3px 8px #17454220}.sys-node.reservoir,.sys-node.tank{background:#d4f0f5}.sys-node.house,.sys-node.school,.sys-node.farm{background:#fff0d9}.sys-node strong{font-size:1.25rem;line-height:1}.sys-node small{font-size:.62rem}.sys-pipe-button{width:100%;height:100%;background:#fff;border:1px solid #288da7;border-radius:50%;cursor:pointer;color:#176d87;font-size:5px;padding:0}.sys-hint{font-size:.78rem;color:#56736e}.sys-actions{margin-top:12px;align-items:center}.sys-actions span{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:700;color:#315e5c}.sys-status{min-height:38px;padding:9px 11px;background:#e8f5ec;border-radius:9px;font-size:.85rem;line-height:1.35}.sys-tools{display:grid;gap:7px;margin-top:10px}.sys-tools section{border-top:1px solid #d8e7e0;padding-top:7px}.sys-tools h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;margin:3px 0 6px;color:#5e7770}.sys-tools section>div{display:flex;flex-wrap:wrap;gap:5px}.sys-tools button{font-size:.78rem;min-height:37px;padding:6px 8px}.sys-card{border:1px solid #d7e5df;border-radius:12px;padding:12px}.sys-card h2{font-size:1rem;margin:0 0 8px}.sys-card p{font-size:.85rem;line-height:1.45;margin:7px 0}.sys-card button:not(.primary){display:block;width:100%;margin:6px 0;text-align:left}.sys-light-note{color:#637b76}.sys-meters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.sys-meters>div{padding:7px;background:#edf6f3;border-radius:7px}.sys-meters small,.sys-meters strong{display:block}.sys-meters small{font-size:.68rem;color:#536e68}.sys-meters strong{font-size:.85rem;font-variant-numeric:tabular-nums}.sys-balance{background:#f1f8ee;border-radius:8px;padding:8px;margin-top:9px}.sys-balance strong{font-size:.8rem}.sys-balance p{font-size:.72rem;margin:4px 0}.sys-trends{display:grid;gap:8px;margin-top:9px}.sys-trends small{display:block;font-size:.72rem;color:#58736f}.sys-spark{height:36px;width:100%;background:#f4f8f6;border-radius:5px}.sys-cell:focus-visible,.sys-node:focus-visible,.sys-pipe-button:focus-visible{outline:3px solid #e17c4b;outline-offset:2px}@media(max-width:1050px){.sys-main{grid-template-columns:1fr}.sys-side{grid-template-columns:repeat(2,minmax(0,1fr))}.sys-side>.companion{grid-column:span 2}.sys-map{--sys-cell:clamp(36px,6.5vw,56px)}}@media(max-width:650px){.sys-home,.sys-world-page,.sys-play{padding:0}.sys-main{gap:10px}.sys-workbench,.sys-side{padding:9px}.sys-side{grid-template-columns:1fr}.sys-side>.companion{grid-column:auto}.sys-map{--sys-cell:max(26px,7.4vw)}.sys-top{flex-wrap:wrap}.sys-world-grid{grid-template-columns:1fr}.sys-pipe-map{min-height:255px}.sys-node{min-width:43px;min-height:42px;padding:3px}.sys-node small{font-size:.5rem}.sys-actions button,.sys-tabs button{font-size:.78rem}.sys-challenge-list em{font-size:.68rem}}@media(max-width:385px){.sys-map{--sys-cell:25px}}@media(prefers-reduced-motion:reduce){.sys-world:hover,.sys-challenge-list button:hover{transform:none}}
.sys-heading .sys-story{max-width:68ch;margin:10px 0 0;padding:10px 13px;border-left:4px solid #2c8b82;border-radius:0 8px 8px 0;background:#edf6ed;color:#315b55;font-weight:700}
.sys-goal{display:grid;gap:3px;margin-bottom:12px;padding:11px 13px;border:1px solid #a9d4c9;border-radius:11px;background:#edf8f3}
.sys-goal strong{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:#286e69}
.sys-goal span{font-weight:700;line-height:1.35}
.sys-goal small{font-size:.76rem;color:#476e68}
.sys-comparison{background:#f6fbfa}
.sys-comparison .sys-compare-note{color:#476b66}
.sys-compare-values{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.sys-compare-values>div{padding:9px;border-radius:8px;background:#eaf3ef}
.sys-compare-values>div:last-child{background:#dff3f2}
.sys-compare-values small,.sys-compare-values strong{display:block}
.sys-compare-values small{font-size:.68rem;color:#54736d}
.sys-compare-values strong{font-size:1.05rem;font-variant-numeric:tabular-nums;color:#174f54}
.sys-compare-values em{font-size:.62rem;font-style:normal;font-weight:700}
.sys-top .save-status{font-size:.74rem;color:#4a766c;min-width:4.5em;text-align:right}
.sys-how{margin:11px 0 7px;padding:9px 11px;border-radius:9px;background:#edf3fb;color:#285d68;font-size:.82rem;line-height:1.4}
.sys-map-ends{display:flex;justify-content:space-between;gap:8px;margin:0 2px 5px;color:#315f63;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.sys-comparison .sys-measure-help{margin-top:9px;color:#57736e;font-size:.72rem}
.sys-overlay-help{margin:0 0 9px;color:#476d70;font-size:.75rem;line-height:1.35}

/* Waterworks illustration system and Creekside crew */
.sys-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 90% 10%,#fff7c8 0 6%,transparent 7%),linear-gradient(130deg,#e9f8ee 20%,#cbeae8 67%,#d7ecfb)}
.sys-world-grid{gap:18px}
.sys-world{overflow:hidden;min-height:265px;padding:0 0 17px;gap:8px;background:#fbfdf9!important;box-shadow:0 8px 20px #215b5320;transition:transform .2s,box-shadow .2s}
.sys-world:hover{transform:translateY(-4px);box-shadow:0 14px 28px #215b5333;filter:none}
.sys-world:focus-visible,.sys-challenge-list button:focus-visible{outline:3px solid #c76a36;outline-offset:3px}
.sys-world>small,.sys-world>strong,.sys-world>span:not(.sys-world-art),.sys-world>em{margin-left:17px;margin-right:17px}
.sys-world>strong{font-size:1.28rem;line-height:1.13}
.sys-world>span:not(.sys-world-art){font-size:.84rem;color:#365f5a}
.sys-world>em{font-size:.72rem;font-style:normal;font-weight:700;color:#1b6866;margin-top:auto}
.sys-world-art{position:relative;display:block!important;height:125px!important;width:100%;margin:0!important;overflow:hidden;border-bottom:2px solid #b6d8c9}
.sys-world-scene{display:block;width:100%;height:100%}
.sys-world-art [data-sys-crew]{position:absolute;right:4px;bottom:-3px;width:80px;height:113px;display:block;filter:drop-shadow(0 3px 2px #28545144)}
.sys-world-art [data-sys-crew] img{display:block;width:100%;height:100%;object-fit:contain;object-position:bottom}
.sys-world-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,42%);overflow:hidden;margin:16px 0 20px;background:linear-gradient(115deg,#e9f6ed,#d9eef5);border:1px solid #b9d9d1;border-radius:20px;box-shadow:0 10px 25px #215b531b}
.sys-world-feature>div:first-child{padding:clamp(22px,4vw,42px);align-self:center}
.sys-world-feature p{line-height:1.55;max-width:55ch}
.sys-world-feature-art{height:240px;position:relative;overflow:hidden}
.sys-world-feature-art figure{position:absolute;right:4%;bottom:0;margin:0;width:36%;height:90%;filter:drop-shadow(0 7px 4px #28545144)}
.sys-world-feature-art figure img{width:100%;height:100%;object-fit:contain;object-position:bottom}
.sys-world-feature-art .sys-world-scene{object-fit:cover}
.sys-challenge-list button{transition:transform .18s,box-shadow .18s}
.sys-challenge-list button:hover{box-shadow:0 7px 18px #215b531a}
.sys-map-wrap{background:linear-gradient(135deg,#d8e9d5,#cce5e1);box-shadow:inset 0 2px 10px #30695c1c}
.sys-map{border-color:#7cae9c;box-shadow:0 4px 15px #23584930}
.sys-cell{color:#245b5c;background-image:linear-gradient(135deg,#ffffff20 25%,transparent 25%,transparent 50%,#ffffff20 50%,#ffffff20 75%,transparent 75%);background-size:19px 19px;transition:filter .15s,outline .15s}
.sys-cell:hover{filter:brightness(1.12)}
.sys-cell.raised{background-color:#d9c590}
.sys-cell.channel{background-color:#72c0d2;background-image:repeating-linear-gradient(155deg,#ffffff26 0 4px,transparent 4px 20px)}
.sys-cell.has-dam{background-color:#b99a74;color:#533f33}
.sys-cell.has-generator{color:#62521d;background-color:#a9d4bb}
.sys-cell-art{display:grid;place-items:center;width:80%;height:80%}
.sys-icon{display:block;width:100%;height:100%;max-width:37px;max-height:37px;pointer-events:none}
.sys-cell .sys-icon{filter:drop-shadow(0 1px 1px #1b4b3440)}
.sys-cell .sys-flow-arrow{position:absolute;top:0;right:1px;font-size:.7rem;line-height:1;color:#084d8c;background:#f1fbffbd;border-radius:50%;width:14px;height:14px;display:grid;place-items:center}
.sys-cell.selected,.sys-node.selected,.sys-pipe-button.selected{outline:3px solid #1d6e9c;outline-offset:-3px;z-index:3}
.sys-cell.hinted,.sys-node.hinted,.sys-pipe-button.hinted{outline:4px solid #e89a22;outline-offset:-4px;z-index:4;box-shadow:0 0 0 3px #fff7c8,0 0 12px #e89a22}
.sys-map-key{justify-content:center;gap:12px}
.sys-map-key span{display:flex;align-items:center;gap:3px}
.sys-map-key .sys-icon{width:22px;height:22px}
.sys-pipe-map{background-color:#eaf4e7;background-image:linear-gradient(#679f8d21 1px,transparent 1px),linear-gradient(90deg,#679f8d21 1px,transparent 1px),linear-gradient(125deg,#eaf4e7,#d7e9e8);background-size:36px 36px,36px 36px,100% 100%}
.sys-pipe-map>svg{pointer-events:auto}
.sys-pipe-map .sys-icon{position:static;inset:auto;overflow:visible}
.sys-pipe-map line.pipe-flow{stroke-dasharray:4 2;animation:sys-pipe-current var(--flow-duration) linear infinite}
.sys-pipe-map line.pipe-flow.reverse{animation-direction:reverse}
@keyframes sys-pipe-current{to{stroke-dashoffset:-12}}
.sys-pipe-button{display:grid;place-items:center;color:#176d87;box-shadow:0 1px 3px #23584945}
.sys-pipe-button .sys-icon{width:72%;height:72%;max-width:none;max-height:none}
.sys-node{border-radius:12px;box-shadow:0 4px 10px #17454230}
.sys-node strong{display:grid;place-items:center;width:32px;height:30px}
.sys-node .sys-icon{width:29px;height:29px}
.sys-node.tank{background:linear-gradient(to top,#6cc4dc 0 var(--fill),#e6f4f1 var(--fill) 100%)}
.sys-node.junction{min-width:43px;min-height:43px;border-radius:50%;background:#e1f2ef}
.sys-node.junction small{max-width:54px;overflow:hidden;text-overflow:ellipsis}
.sys-side .companion{display:flex;align-items:center;gap:12px;background:linear-gradient(120deg,#e9f8ef,#e4f3f9);border:1px solid #b9dacf;border-radius:13px;padding:12px}
.sys-side .companion figure{flex:0 0 82px;width:82px;height:82px;margin:0;display:grid;place-items:center}
.sys-side .companion figure img{width:100%;height:100%;object-fit:contain}
.sys-side .companion>div{min-width:0}
.sys-side .companion small{font-size:.68rem;font-weight:700;letter-spacing:.06em;color:#217174}
.sys-side .companion p{font-size:.87rem;line-height:1.45;margin:5px 0}
.sys-help-button{border:1px solid #8eb8ac;border-radius:8px;background:#fff;color:#175b5e;min-height:38px;padding:5px 10px;font-weight:700;font-size:.76rem;cursor:pointer}
.sys-help-button[aria-pressed=true]{background:#175b5e;color:#fff}
@media(max-width:650px){.sys-world-feature{grid-template-columns:1fr}.sys-world-feature-art{height:160px}.sys-world-feature-art figure{width:95px;height:150px}.sys-world{min-height:240px}.sys-world-art{height:112px!important}.sys-node strong{width:25px;height:24px}.sys-node .sys-icon{width:23px;height:23px}.sys-side .companion figure{flex-basis:65px;width:65px;height:65px}}
@media(prefers-reduced-motion:reduce){.sys-pipe-map line.pipe-flow{animation:none}.sys-world:hover{transform:none}}
.sys-main,.sys-workbench,.sys-side{min-width:0}
@media(max-width:1050px){.sys-main{grid-template-columns:minmax(0,1fr)}}
.sys-workbench>.sys-tools{margin:4px 0 8px;padding:10px 12px;border:1px solid #a9d4c9;border-radius:11px;background:#f0f9f4}
.sys-workbench>.sys-tools section{border-top:0;padding-top:0}
.sys-workbench>.sys-tools h3{margin:0 0 7px;color:#236f67}
.sys-workbench>.sys-tools button{min-height:42px;font-weight:700}
.sys-workbench>.sys-how{margin:0 0 11px}
.sys-workbench>.sys-overlays{margin:11px 0 4px}
.sys-workbench>.sys-overlay-help{margin-bottom:11px}
.sys-scenery{position:relative;display:block;width:100%;height:100%;overflow:hidden}
.sys-scenery>.sys-world-scene,.sys-scenery>img{position:absolute;inset:0;display:block;width:100%;height:100%}
.sys-scenery>img{object-fit:cover}
.sys-scenery.scene-downhill>img{object-position:27% center}
.sys-scenery.scene-power>img{object-position:78% center}
.sys-scenery.scene-repairs>img{object-position:88% center}
.sys-scenery.scene-pipes>img{object-position:57% center}
.sys-scenery.scene-pressure>img{object-position:12% center}
.sys-scenery.scene-town>img{object-position:88% center}
.sys-scenery.scene-storm>img{object-position:17% center}
.sys-scenery.scene-watershed>img{object-position:72% center}
.sys-world-art .sys-scenery,.sys-world-feature-art .sys-scenery{height:100%}
.sys-world-art [data-sys-crew],.sys-world-feature-art figure{z-index:2}
.sys-world-art:after,.sys-world-feature-art:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#143d4233,transparent 65%)}
.sys-world-art [data-sys-crew]{filter:drop-shadow(0 3px 3px #183c3d99)}
.sys-heading{min-height:142px;padding:17px 20px;border:1px solid #c7dcd3;border-radius:17px;background-size:cover;background-position:center;box-shadow:0 6px 20px #23584918}
.sys-heading.scene-downhill,.sys-heading.scene-power,.sys-heading.scene-repairs{background-image:linear-gradient(90deg,#f7fbf4 0%,#f7fbf4f5 35%,#f7fbf4aa 68%,#f7fbf430 100%),url('/CreeksideWaterworks/assets/scenes/creek-valley.webp')}
.sys-heading.scene-pipes,.sys-heading.scene-pressure,.sys-heading.scene-town{background-image:linear-gradient(90deg,#f7fbf4 0%,#f7fbf4f5 35%,#f7fbf4aa 68%,#f7fbf430 100%),url('/CreeksideWaterworks/assets/scenes/town-water.webp')}
.sys-heading.scene-storm,.sys-heading.scene-watershed{background-image:linear-gradient(90deg,#f7fbf4 0%,#f7fbf4f5 35%,#f7fbf4aa 68%,#f7fbf430 100%),url('/CreeksideWaterworks/assets/scenes/storm-wetland.webp')}
.sys-heading .sys-story{max-width:48ch;background:#edf6ede0}
.sys-hero{background-image:linear-gradient(90deg,#e8f7ee 0%,#e8f7eef5 31%,#e8f7eed6 48%,#e8f7ee22 76%),url('/CreeksideWaterworks/assets/scenes/creek-valley.webp');background-size:cover;background-position:center;min-height:315px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.sys-hero p:not(.eyebrow){max-width:48ch;background:#eaf8efb8;border-radius:8px;padding:4px 7px}
@media(max-width:650px){.sys-hero{min-height:290px;background-image:linear-gradient(90deg,#e8f7eefc 0%,#e8f7eedd 62%,#e8f7ee77 100%),url('/CreeksideWaterworks/assets/scenes/creek-valley.webp');background-position:36% center}}
@media(max-width:650px){.sys-heading{min-height:130px;padding:13px 14px;background-position:60% center}.sys-heading h1{font-size:1.8rem}}
.sys-basics{display:flex;flex-direction:column;text-align:left;gap:8px;min-height:265px;padding:0 0 17px;overflow:hidden;border:1px solid #bcd8d2;border-radius:18px;background:#fbfdf9;box-shadow:0 8px 20px #215b5320;color:#17474b;transition:transform .2s,box-shadow .2s}
.sys-basics:hover{transform:translateY(-4px);box-shadow:0 14px 28px #215b5333}
.sys-basics>small,.sys-basics>strong,.sys-basics>span:not(.sys-world-art),.sys-basics>em{margin-left:17px;margin-right:17px}
.sys-basics>small,.sys-world>small{font-size:.72rem;letter-spacing:.1em;font-weight:700;color:#47716d}
.sys-basics>strong{font-size:1.28rem;line-height:1.13}
.sys-basics>span:not(.sys-world-art){font-size:.84rem;line-height:1.4;color:#365f5a}
.sys-basics>em{font-size:.72rem;font-style:normal;font-weight:700;color:#1b6866;margin-top:auto}
.sys-basics .sys-world-art{position:relative;display:block;height:125px;width:100%;margin:0;overflow:hidden;border-bottom:2px solid #b6d8c9}
.sys-basics .sys-world-art>.sys-scenery{height:100%}
.sys-basics [data-sys-crew]{position:absolute;right:4px;bottom:-3px;width:80px;height:113px;z-index:2}
.sys-basics [data-sys-crew] img{width:100%;height:100%;object-fit:contain;object-position:bottom}
.sys-basics:focus-visible{outline:3px solid #c76a36;outline-offset:3px}
.adventure-continue{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}
.adventure-continue small{font-weight:700;color:#235f5c}
.sandbox-choices{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 8px}
.sys-objectives ol{list-style:none;display:grid;gap:8px;margin:8px 0 0;padding:0}
.sys-objectives li{display:flex;align-items:flex-start;gap:8px;font-size:.84rem;line-height:1.4;color:#536e68}
.sys-objectives li>span{flex:0 0 1.2em;font-weight:700;color:#56736e}
.sys-objectives li.goal-done{color:#1c725e;font-weight:700}
.sys-objectives li.goal-done>span{color:#1c8a64}
@media(max-width:650px){.sys-basics{min-height:240px}.sys-basics .sys-world-art{height:112px}}
@media(prefers-reduced-motion:reduce){.sys-basics:hover{transform:none}}

/* Device-specific Waterworks layouts. Keep the campaign comfortable in each
   suite shell instead of relying on width-only defaults. */
html[data-jke-device-profile="desktop"] .sys-home,
html[data-jke-device-profile="desktop"] .sys-world-page,
html[data-jke-device-profile="desktop"] .sys-play{min-width:0}
html[data-jke-device-profile="desktop"] .sys-hero{min-height:340px;padding:clamp(34px,4vw,62px)}
html[data-jke-device-profile="desktop"] .sys-world-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
html[data-jke-device-profile="desktop"] .sys-world,
html[data-jke-device-profile="desktop"] .sys-basics{min-width:0;width:100%}
html[data-jke-device-profile="desktop"] .sys-main{grid-template-columns:minmax(0,1fr) minmax(290px,350px)}

html[data-jke-device-profile="smartphone"] #app{width:100%;max-width:100%;min-width:0;padding:14px 12px calc(30px + env(safe-area-inset-bottom))}
html[data-jke-device-profile="smartphone"] .sys-home,
html[data-jke-device-profile="smartphone"] .sys-world-page,
html[data-jke-device-profile="smartphone"] .sys-play,
html[data-jke-device-profile="smartphone"] .sys-hero,
html[data-jke-device-profile="smartphone"] .sys-world-grid,
html[data-jke-device-profile="smartphone"] .sandbox-choices{width:100%;max-width:100%;min-width:0}
html[data-jke-device-profile="smartphone"] .sys-hero{min-height:0;margin:0 0 22px;padding:23px 18px;border-radius:22px}
html[data-jke-device-profile="smartphone"] .sys-hero h1{max-width:13ch;font-size:clamp(2rem,9vw,2.6rem);line-height:1.05}
html[data-jke-device-profile="smartphone"] .sys-hero p:not(.eyebrow){max-width:36ch;line-height:1.48}
html[data-jke-device-profile="smartphone"] .adventure-continue{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;width:100%;margin-top:12px}
html[data-jke-device-profile="smartphone"] .adventure-continue .primary{width:100%;min-width:0;white-space:normal}
html[data-jke-device-profile="smartphone"] .adventure-continue small{display:block;max-width:34ch;line-height:1.4}
html[data-jke-device-profile="smartphone"] .sys-home>h2{font-size:1.5rem;line-height:1.15;margin:0 0 14px}
html[data-jke-device-profile="smartphone"] .sys-world-grid{grid-template-columns:minmax(0,1fr);gap:12px}
html[data-jke-device-profile="smartphone"] .sys-world,
html[data-jke-device-profile="smartphone"] .sys-basics{min-width:0;width:100%;min-height:0}
html[data-jke-device-profile="smartphone"] .sys-world-art{height:96px!important}
html[data-jke-device-profile="smartphone"] .sys-basics .sys-world-art{height:96px}
html[data-jke-device-profile="smartphone"] .sys-world>small,
html[data-jke-device-profile="smartphone"] .sys-basics>small{font-size:.66rem}
html[data-jke-device-profile="smartphone"] .sys-world>strong,
html[data-jke-device-profile="smartphone"] .sys-basics>strong{font-size:1.14rem}
html[data-jke-device-profile="smartphone"] .sys-world>span:not(.sys-world-art),
html[data-jke-device-profile="smartphone"] .sys-basics>span:not(.sys-world-art){line-height:1.35}
html[data-jke-device-profile="smartphone"] .sys-challenge-list button{min-width:0;gap:10px;padding:12px}
html[data-jke-device-profile="smartphone"] .sys-challenge-list button>span{min-width:0;overflow-wrap:anywhere}
html[data-jke-device-profile="smartphone"] .sys-challenge-list em{white-space:normal;text-align:right}
html[data-jke-device-profile="smartphone"] .sys-world-feature{grid-template-columns:minmax(0,1fr)}
html[data-jke-device-profile="smartphone"] .sys-main{grid-template-columns:minmax(0,1fr)}
html[data-jke-device-profile="smartphone"] .sys-workbench,
html[data-jke-device-profile="smartphone"] .sys-side{min-width:0}
html[data-jke-device-profile="smartphone"] .sys-map-wrap{max-width:100%;overflow:auto}

html[data-jke-device-profile="tablet"] #app{width:100%;max-width:100%;min-width:0;padding:20px 22px calc(32px + env(safe-area-inset-bottom))}
html[data-jke-device-profile="tablet"] .sys-home,
html[data-jke-device-profile="tablet"] .sys-world-page,
html[data-jke-device-profile="tablet"] .sys-play,
html[data-jke-device-profile="tablet"] .sys-world-grid{min-width:0;max-width:100%}
html[data-jke-device-profile="tablet"] .sys-hero{min-height:280px;padding:30px}
html[data-jke-device-profile="tablet"] .sys-hero h1{max-width:16ch;font-size:clamp(2.3rem,5vw,3.3rem)}
html[data-jke-device-profile="tablet"] .sys-world-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
html[data-jke-device-profile="tablet"] .sys-world,
html[data-jke-device-profile="tablet"] .sys-basics{min-width:0;width:100%;min-height:238px}
html[data-jke-device-profile="tablet"] .sys-world-art,
html[data-jke-device-profile="tablet"] .sys-basics .sys-world-art{height:104px!important}
html[data-jke-device-profile="tablet"] .sys-main{grid-template-columns:minmax(0,1fr)}
html[data-jke-device-profile="tablet"] .sys-workbench{padding:14px}
html[data-jke-device-profile="tablet"] .sys-side{grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-jke-device-profile="tablet"] .sys-side>.companion{grid-column:span 2}
html[data-jke-device-profile="tablet"] .sys-map{--sys-cell:clamp(42px,6.4vw,58px)}
html[data-jke-device-profile="tablet"] .sys-world-feature{grid-template-columns:minmax(0,1fr) minmax(220px,38%)}

@media(max-width:650px){
  html[data-jke-device-profile="desktop"] .sys-world-grid{grid-template-columns:minmax(0,1fr)}
  html[data-jke-device-profile="desktop"] .sys-main{grid-template-columns:minmax(0,1fr)}
}
.sys-crew-sprite{display:block;width:100%;height:100%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 2px 2px #153c3c30)}
.sys-world-art .sys-crew-sprite{filter:drop-shadow(0 3px 3px #183c3d77)}
.sys-replay-score{display:block;margin-top:4px;color:#316d60;font-weight:700;line-height:1.4}
.sys-earned-stamp{margin:0 0 8px;padding:8px 10px;border-radius:8px;background:#fff2c5;color:#6a4e16;font-weight:700}
.sys-stamp-guide{max-width:72ch;padding:10px 13px;border-radius:10px;background:#eef6f1;color:#456961;font-size:.82rem;line-height:1.45}
.sys-play .sys-side .companion figure{flex-basis:96px;width:96px;height:112px;align-items:end}
@media(max-width:650px){.sys-play .sys-side .companion figure{flex-basis:66px;width:66px;height:90px}.sys-earned-stamp{font-size:.82rem}}