*{box-sizing:border-box}body{margin:0;background:#eaf0e8;color:#253f3b;font:16px/1.5 system-ui,sans-serif}main{max-width:1200px;margin:auto;padding:28px}header{border-bottom:1px solid #97b3a3;margin-bottom:20px}h1{font:72px Georgia,serif;margin:0}h2{font:25px Georgia,serif;margin:0 0 12px}.eyebrow,small{font-size:11px;letter-spacing:.12em;font-weight:750}.brief,.panel{background:#f9f7e9;padding:22px;border:1px solid #a9b8a4;border-radius:14px}p{margin:8px 0 16px}.toolbar{display:flex;gap:12px;align-items:end;flex-wrap:wrap}label{display:grid;gap:6px}button,select{min-height:46px;font:inherit;color:inherit;border:1px solid #8ba395;border-radius:8px;padding:9px 14px;background:#fffef3;cursor:pointer}button:hover{background:#dce9d9}button:focus-visible,select:focus-visible{outline:3px solid #b77e2d;outline-offset:3px}.metrics{display:flex;gap:14px;margin:20px 0}.metrics>div{flex:1;border-top:3px solid #587c66;padding:14px;background:#dce6d5}strong{display:block;font-size:27px}.layout{display:grid;grid-template-columns:1.6fr 1fr;gap:20px}.board{background:url('coast.webp') center/cover;border:1px solid #7d9b81;border-radius:14px;overflow:hidden}svg{display:block;width:100%}.legend{font-size:13px;padding:10px}.control{padding:14px 0;border-bottom:1px solid #c5cdb9;display:grid;grid-template-columns:1fr 92px;gap:8px}.control p{font-size:13px;margin:4px 0}.primary{background:#31594b;color:white;width:100%;margin-top:18px}.primary:hover{background:#214639}.panel>button{width:100%}#feedback{padding:14px;background:#e5e9d6;border-left:4px solid #a87c30;margin-top:14px}details{padding:22px 0;margin-top:18px;border-top:1px solid #a9b8a4}summary{cursor:pointer;font-weight:700}a{color:#31594b}@media(max-width:800px){.layout{grid-template-columns:1fr}h1{font-size:54px}}@media(max-width:480px){main{padding:14px}.brief,.panel{padding:16px}.metrics{gap:6px}.metrics>div{padding:9px 6px}small{font-size:9px;letter-spacing:0}strong{font-size:20px}.legend{font-size:12px}}