*{box-sizing:border-box}body{margin:0;background:#f4efe5;color:#183f40;font-family:Georgia,serif}button,a{-webkit-tap-highlight-color:transparent}button{font:600 13px system-ui;cursor:pointer;border:1px solid #becbc3;background:#faf8f1;color:#214d4c;border-radius:9px;padding:11px 15px;transition:background .2s,transform .2s}button:hover:not(:disabled){background:#e0ede5;transform:translateY(-1px)}button:focus-visible,a:focus-visible{outline:3px solid #e29551;outline-offset:3px}button:disabled{opacity:.4;cursor:default}main{max-width:1060px;margin:auto;padding:0 28px}header{display:flex;justify-content:space-between;align-items:center;padding:25px 0;border-bottom:1px solid #d8ddd2}.brand{letter-spacing:5px;font:bold 22px Georgia;text-decoration:none;color:inherit}.brand span{display:block;letter-spacing:3px;font:11px system-ui;margin-top:4px}.intro{padding:30px 0 22px}.eyebrow{font:10px system-ui;letter-spacing:2px;color:#6a7c72}.intro h1{font-size:clamp(32px,4vw,46px);font-weight:400;letter-spacing:-1.5px;margin:10px 0}.intro>p:last-child{color:#687a70;font-size:15px}.workshop{background:#fffdf6;border:1px solid #d1d9ca;border-radius:20px;overflow:hidden;box-shadow:0 15px 45px #183f4010}.scene{height:220px;position:relative;background:#b7cfbe;overflow:hidden}.scene>img{width:100%;height:100%;object-fit:cover;object-position:50% 42%}.scene-label{position:absolute;left:24px;bottom:18px;color:white;text-shadow:0 2px 8px #113c3b;font:11px system-ui;letter-spacing:2px}.scene-label span{display:block;font-size:10px;letter-spacing:1px;margin-top:5px}.dashboard{padding:22px 24px 10px;display:flex;justify-content:space-between;gap:15px}.dashboard h2{margin:5px 0;font-weight:400;font-size:27px}.dashboard .eyebrow{margin:0}.totals{display:flex;gap:25px;font:9px system-ui;letter-spacing:1.4px}.totals strong{display:block;font:26px Georgia;letter-spacing:0;margin-top:7px}#forecast{display:flex;padding:10px 24px;gap:7px}.slot{flex:1;background:#e9ede4;text-align:center;border-radius:7px;padding:7px 0;font:14px system-ui;color:#5e7869}.slot.current{background:#e6b975;color:#3d3725;outline:2px solid #b48341;outline-offset:2px}.slot.past{opacity:.3}.slot small{display:block;font:8px system-ui;margin-top:3px}#status{margin:8px 24px 15px;min-height:20px;font:13px system-ui;color:#58776b}#pans{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:0 24px}.pan{border:1px solid #d4ded2;border-radius:15px;padding:15px;background:#f6f6ed}.pan h3{margin:0;font:12px system-ui;letter-spacing:2px}.basin{height:110px;border:7px solid #7ea99e;border-radius:50%;position:relative;overflow:hidden;margin:13px 8px;background:#e4d9bb;box-shadow:inset 0 4px 12px #173f4035,0 4px 0 #c4d0bc}.water{position:absolute;inset:0;background:linear-gradient(#60b6afbb,#187b7cdd),url('saltworks.webp') center/350px;transition:opacity .3s}.crystals{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;font:30px Georgia;color:#fff8e7;text-shadow:0 2px 6px #153f40;letter-spacing:2px}.pan.blocked .basin{border-color:#c8a36e}.pan p{font:12px system-ui;line-height:1.7;margin:5px 0;color:#60786a}.pan p b{color:#244a45}.pan .actions{display:flex;gap:6px;margin-top:11px}.actions button{flex:1;padding:10px 3px}.actions button:first-child{background:#194d4c;color:#fff8ea;border-color:#194d4c}.toolbar{padding:20px 24px;display:flex;gap:8px;flex-wrap:wrap}#next{background:#bf7541;color:white;border-color:#bf7541;margin-left:auto}#rules{padding:25px;background:#e4ebe1;border-radius:14px;margin-top:20px;font:14px/1.8 system-ui}#rules h2{font:25px Georgia;margin:0}#chapters{display:flex;gap:8px;justify-content:center;padding:23px 0;flex-wrap:wrap}#chapters button{width:39px;padding:10px 0}#chapters button.active{background:#194d4c;color:white}footer{font:11px/1.8 system-ui;color:#76857b;text-align:center;padding:0 0 28px}footer button{font-size:11px;border:0;background:none;text-decoration:underline}footer a{color:inherit}#credits{max-width:650px;margin:10px auto} [hidden]{display:none!important}@media(max-width:600px){main{padding:0 12px}header{padding:15px 2px}.intro{padding:18px 4px 12px}.intro .eyebrow{font-size:8px;letter-spacing:1px}.scene{height:155px}.dashboard{padding:18px 14px 8px}.dashboard h2{font-size:22px}.totals{gap:14px;font-size:8px}.totals strong{font-size:23px}#forecast{padding:10px 14px;gap:5px}#pans{padding:0 12px;gap:7px}.pan{padding:10px 6px}.pan h3{font-size:10px;letter-spacing:1px}.basin{height:76px;margin:12px 0;border-width:5px}.pan p{font-size:10px}.pan .actions{flex-direction:column}.actions button{font-size:12px;padding:10px 0}#status{margin:8px 14px 13px;font-size:12px}.toolbar{padding:17px 12px;gap:5px}.toolbar button{font-size:11px;padding:10px}.slot{font-size:11px}.slot small{font-size:7px}}