:root{color-scheme:light;--ink:#183a32;--mint:#d8ecb9;--paper:#f4f2e9;--line:#cdd5c7;--orange:#bd5a36}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 system-ui,sans-serif}button,select,a{-webkit-tap-highlight-color:transparent}button,select{font:inherit;color:inherit}button{border:1px solid #94a895;border-radius:9px;padding:10px 15px;background:#fffaf0;cursor:pointer}button:hover{background:#e7efdb}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--orange);outline-offset:3px}header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 auto;max-width:1180px;padding:24px 26px;border-bottom:1px solid var(--line)}.brand{font-weight:900;letter-spacing:2px;text-decoration:none;color:inherit}header span,.kicker{font-size:11px;letter-spacing:2px}.intro{max-width:1080px;margin:42px auto 28px;padding:0 22px;position:relative}.intro:after{content:'↯';position:absolute;right:50px;top:-45px;font-size:190px;font-weight:200;color:#cddcaf;transform:rotate(13deg);z-index:-1}h1{font:clamp(38px,5vw,64px)/1.02 Georgia,serif;letter-spacing:-2px;margin:12px 0 18px}.lede{color:#526c5f;max-width:430px}.work{max-width:1080px;margin:auto;background:#fffdf6;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:0 20px 70px #203b2110}.order{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:11px;letter-spacing:1px}.order select{padding:8px;max-width:100%;border:1px solid var(--line);background:var(--paper);border-radius:5px}.order span{margin-left:auto}.heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px}h2{font:30px Georgia,serif;margin:8px 0}#badge{font-size:10px;letter-spacing:1px;background:#e8eddf;border-radius:50px;padding:7px 12px}#note{color:#526c5f;margin-top:4px}.targets{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.target{flex:1;min-width:130px;background:#eef2e6;border-radius:9px;padding:12px 15px;font-size:12px}.target b{display:block;font-size:23px}.layout{display:grid;grid-template-columns:1fr 1.2fr;gap:28px}h3{font-size:11px;letter-spacing:1.5px;margin:18px 0 4px}.layout p{font-size:12px;color:#607468;margin:0 0 14px}#cells{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.cell{min-height:100px;padding:8px;text-align:left;position:relative;background:#e6edda;border:2px solid transparent;border-top:5px solid #9db67c;border-radius:7px}.cell:before{content:'';position:absolute;right:12px;top:-9px;width:17px;height:4px;background:#7f9870;border-radius:3px}.cell strong{font-size:21px}.cell small{display:block;font-size:11px}.cell.selected{border-color:var(--orange);background:#ffe4cf}.cell.placed{background:#f1eee2;border-top-color:#c6bd99}.cell .where{float:right;font-size:10px;background:#fff9;padding:2px 4px;border-radius:3px}.bank{display:block;width:100%;text-align:left;padding:12px 16px;margin-bottom:10px;border:1px solid #a8bba5;border-left:5px solid #6b8e63;background:#f6f8ed;min-height:88px}.bank b{font-size:13px}.bank .slots{font-size:19px;letter-spacing:4px;display:block;margin:5px 0}.bank small{font-size:11px;color:#536b5a}.bank.full{border-left-color:#d29656}.meter{padding:15px 0;border-top:1px solid var(--line);margin-top:24px;display:flex;gap:20px;flex-wrap:wrap;font-size:13px}.meter b{font-size:20px}.good{color:#2b7341}.bad{color:#aa492c}#message{min-height:48px;padding:12px 15px;background:#eef2e5;border-radius:8px;font-size:13px}.actions{display:flex;gap:8px;flex-wrap:wrap}.primary{background:var(--ink);color:#fff}.primary:hover{background:#315b4e}footer{text-align:center;margin:26px 15px;color:#6a796d;font-size:11px}a{color:#3f6650}dialog{max-width:610px;width:calc(100% - 30px);max-height:85dvh;border:1px solid var(--line);border-radius:18px;padding:28px;color:var(--ink);background:#fffdf6}dialog::backdrop{background:#183a3266}dialog #close{float:right}dialog p{font-size:14px}@media(max-width:700px){header{padding:16px}header span{display:none}.intro{margin:28px auto 24px}.intro:after{font-size:140px;right:20px;top:0}.work{margin:0 12px;padding:16px}.layout{grid-template-columns:1fr;gap:10px}h2{font-size:25px}.heading{align-items:flex-start}#badge{white-space:nowrap;font-size:8px;padding:7px}.cell{min-height:94px}.order span{margin-left:0}.actions button{flex:1;min-width:110px}.target{min-width:95px;padding:10px}.target b{font-size:20px}}
