:root{font-family:Arial,sans-serif;color:#3a4f50;background:#f2eee3;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top right,#dbe4df,transparent 55%)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;border:1px solid #aebeb8;background:#f8f4e8;border-radius:6px;padding:10px}button:hover{background:#e3e9df}button:focus-visible,a:focus-visible{outline:3px solid #c08b43;outline-offset:3px}button:disabled{opacity:.4;cursor:default}header{margin:0 24px;padding:25px 3%;border-bottom:1px solid #c8d0c6;display:flex;align-items:center;justify-content:space-between;gap:15px}header a{font:30px Georgia;color:inherit;text-decoration:none}header span{font-size:10px;letter-spacing:3px}main{max-width:1160px;margin:auto;padding:36px 25px}.hero{display:flex;justify-content:space-between;align-items:center;margin-bottom:34px}.hero-art{width:225px;display:flex}.hero-art img{width:135px;border-radius:50%;box-shadow:0 10px 30px #3e51451c}.hero-art img+img{margin-left:-35px;margin-top:60px;transform:rotate(12deg)}.eyebrow{font-size:10px;font-weight:bold;letter-spacing:3px;color:#5b7c76}h1{font:52px/1.04 Georgia;margin:12px 0 20px;letter-spacing:-1.5px}h2{font:27px Georgia;margin:7px 0 18px}p,li{font-size:14px;line-height:1.65}.hero p{font-size:15px}.hero .eyebrow{font-size:10px}.layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:45px}aside{padding-top:10px}nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:22px 0 34px}nav button{padding:12px 4px}nav .current{background:#587873;color:white}nav .solved:after{content:' ·';font-weight:bold}summary{cursor:pointer;font-weight:bold}aside p{font-size:13px}.example{display:flex;justify-content:center;flex-wrap:wrap;margin:20px 0;gap:4px}.example span{display:grid;place-items:center;width:40px;height:40px;border:1px solid #bdc8bd;background:#e4e8d8;font:bold 22px Georgia}.example b{width:100%;text-align:center;font-size:10px;margin-top:7px;color:#6b7b66}.play{background:#fffcef;border:1px solid #aabdb4;border-radius:20px;padding:24px;box-shadow:0 15px 45px #3a63500d}.titlebar{display:flex;justify-content:space-between;align-items:center}.titlebar>span{font-size:12px;color:#758578}#board{display:grid;gap:0;max-width:520px;margin:10px auto 0;border:2px solid #527574}.cell{padding:0;aspect-ratio:1;position:relative;background:#e8eddf;border:1px solid #ccd5c5;border-radius:0;overflow:hidden;min-width:0}.cell.pool{background:#dceae3}.cell img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;opacity:.7}.cell .number{position:absolute;inset:0;display:grid;place-items:center;font:bold 31px Georgia;color:#283e3c;text-shadow:0 1px 2px #fff;z-index:1}.cell .pin{position:absolute;top:3px;right:4px;font-size:9px;color:#58624d;z-index:2}.cell .rid{position:absolute;top:3px;left:4px;font-size:9px;background:#fff9e6d9;padding:1px 3px;border-radius:2px;z-index:2}.cell.reach:after{content:'';position:absolute;inset:5px;border:2px dashed #b48a48;pointer-events:none;z-index:3}.cell.bad .number{color:#ac4930}.cell.bad{background:#f0d3be}.cell.selected:before{content:'';position:absolute;inset:2px;border:3px solid #3c6c70;z-index:4;pointer-events:none}.cell.flagged:before{content:'';position:absolute;inset:2px;border:3px solid #c56536;z-index:4;pointer-events:none}.cell:focus-visible{outline:3px solid #d7ae61;outline-offset:-5px;z-index:5}#pool-info{font-size:12px;min-height:20px;margin:14px 0 10px}#palette{display:flex;gap:8px;justify-content:center}#palette button{min-width:43px;font:bold 20px Georgia;padding:8px}#palette .active{background:#dce8d6;border-color:#7d9b80}#reach-info{font-size:11px;min-height:38px;background:#f0e9d5;border-left:3px solid #c8a368;padding:8px 10px;margin:12px 0}#metrics{font-size:11px;color:#6b7d6d}#status{min-height:65px;font-size:13px}.actions{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.actions button{font-size:11px;padding:10px 3px}.keys{text-align:center;color:#7c8c7c;font-size:10px;margin:20px 0 0;line-height:1.7}#win{text-align:center;margin-top:20px;background:#dfe9d5;border:1px solid #a9bfa0;border-radius:12px;padding:20px}#win button{background:#587873;color:white}#win p{font-size:12px}footer{border-top:1px solid #c8d0c6;padding:25px 0;margin-top:34px;font-size:12px}footer p{max-width:700px}a{color:#587873}[hidden]{display:none!important}@media(max-width:700px){header{margin:0 16px;padding:20px 0}header a{font-size:25px}header span:nth-child(2){display:none}header span{font-size:9px;letter-spacing:1px}main{padding:20px 16px}.hero{margin-bottom:22px;gap:10px}.hero-art{width:115px}.hero-art img{width:75px}.hero-art img+img{margin-left:-25px;margin-top:40px}h1{font-size:35px;margin:10px 0 14px}.hero p{font-size:12px}.hero .eyebrow{font-size:8px;letter-spacing:2px}.layout{display:flex;flex-direction:column;gap:28px}.play{order:-1;padding:15px;border-radius:17px}h2{font-size:25px}.cell .number{font-size:25px}.cell .rid{font-size:8px;padding:0 2px;left:2px;top:2px}.cell .pin{font-size:8px;right:3px}.cell.reach:after{inset:4px}#pool-info{font-size:10px}#palette{gap:6px}#palette button{min-width:35px;padding:7px;font-size:18px}#reach-info{font-size:10px}#metrics{font-size:10px}#status{font-size:12px;min-height:65px}.actions button{font-size:10px}.keys{font-size:9px}nav{grid-template-columns:repeat(6,1fr);margin-bottom:25px}aside{padding-top:0}}
