*{box-sizing:border-box}body{margin:0;background:#eaece1;color:#18362e;font:16px/1.5 system-ui,sans-serif}header{padding:26px 5vw 18px;border-bottom:1px solid #bac7b7;background:#f8f7ec}header small{text-transform:uppercase;letter-spacing:3px;color:#63796c}h1{font:clamp(30px,4vw,52px)/1.1 Georgia,serif;margin:8px 0}h2{font:26px Georgia,serif;margin:5px 0 14px}main{max-width:1300px;margin:auto;padding:26px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:25px}section,aside{min-width:0}aside{background:#f8f7ec;border:1px solid #c1cbbb;padding:22px;border-radius:8px;align-self:start}.scene{position:relative;min-height:400px;background:#dbe4ce;border:8px solid #fffaf0;border-radius:10px;overflow:hidden;box-shadow:0 10px 30px #28452d22}.scene>img{position:absolute;width:100%;height:100%;object-fit:cover;opacity:.42;inset:0}.scene>*:not(img){position:relative}.bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:14px 0}.stat{background:#234d40;color:#fff9df;border-radius:5px;padding:10px 15px;font-weight:650}.status{padding:14px 18px;border-left:4px solid #bd9138;background:#fff9df;min-height:58px;margin:14px 0}.status.win{background:#d0ebc6;border-color:#398455}button,select,input{font:inherit}button,select{border:1px solid #77927c;border-radius:5px;padding:10px 15px;background:#fffdf2;color:#183c30;cursor:pointer;min-height:44px}button:hover{background:#def0ce}button:focus-visible{outline:3px solid #b17e22;outline-offset:2px}button.primary{background:#214c3d;color:#fff8dd}button:disabled{opacity:.45;cursor:default}.board{padding:20px;display:grid;gap:10px;min-height:390px}.tile{min-width:0;min-height:74px;padding:7px;background:#fff9e8e8;box-shadow:0 3px 5px #1232;border:2px solid #efeddc;line-height:1.2}.tile b{display:block;font-size:21px}.tile small{display:block;font-size:12px;margin-top:5px}.tile.on{background:#254e3c;color:#fff9df;border-color:#d7b855}.tile.here{outline:4px solid #dba333}.tile.done{background:#d1e5ba}.tile.danger{background:#ddc0ac}.grid4{grid-template-columns:repeat(4,1fr)}.grid3{grid-template-columns:repeat(3,1fr)}.grid7{grid-template-columns:repeat(7,1fr);gap:4px;padding:14px;min-height:420px}.grid7 .cell{display:flex;align-items:center;justify-content:center;background:#b9d8d0cc;border:1px solid #6c9d91;border-radius:3px;font-size:24px;min-height:48px}.grid7 .reef{background:#a99f7c}.grid7 .trail{background:#e7dfa2}.grid7 .boat{background:#fff9d1;outline:3px solid #a86f21}.metric{display:flex;justify-content:space-between;border-bottom:1px solid #ccd2c4;padding:7px 0}p{margin:9px 0 15px}ol{padding-left:22px}footer{max-width:1250px;margin:0 auto;padding:0 26px 30px;font-size:12px;color:#5e7165}details{margin-top:18px}a{color:#215e4b}svg.chart{width:100%;height:130px;background:#f8f8e9;border-radius:5px}.choices{display:flex;gap:10px;flex-wrap:wrap}.choices button{flex:1;min-width:110px}.log{font:13px/1.6 ui-monospace,monospace;max-height:180px;overflow:auto;background:#eef0e4;padding:12px}.slider{display:block;margin:14px 0}.slider input{width:100%}@media(max-width:700px){header{padding:20px}main{display:flex;flex-direction:column;padding:16px;gap:18px}.scene{min-height:340px}.board{padding:12px;gap:7px}.tile{min-height:70px;font-size:13px}.tile b{font-size:18px}.grid7{min-height:330px;gap:3px;padding:8px}.grid7 .cell{min-height:38px;font-size:18px}aside{width:100%;padding:18px}.bar .stat{padding:8px 10px;font-size:13px}.grid4{grid-template-columns:repeat(3,1fr)}}
.scene>img{opacity:.72}.scene .stat{background:#234d40eb}.grid4 .tile{background:#fff9e8d9}.grid4 .tile.on{background:#254e3ce8;color:#fff9df}
