:root{color-scheme:light;--bg:#eee9dd;--ink:#2b3e35;--muted:#728174;--line:#c7ccbb;--green:#3e6650;--gold:#a67a3b}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top left,#fbf8ec,#eee8dc 65%);color:var(--ink);font:14px system-ui,-apple-system,sans-serif}main{max-width:1270px;margin:auto;padding:0 38px}button,select{font:inherit}button{cursor:pointer;color:var(--ink);border:1px solid var(--line);background:#f6f3e9;border-radius:7px;padding:10px 13px}button:hover:not(:disabled){background:#e0e9d4;border-color:#6c8868}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #b18a42;outline-offset:3px}a{color:var(--green);text-underline-offset:3px}header{height:79px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}header>a{text-decoration:none;font-size:14px;font-weight:750;letter-spacing:2.5px}header>div{display:flex;gap:8px;align-items:center}header span{font:italic 14px Georgia;color:#8c8269;margin-right:22px}header button{background:transparent;border:0;font-size:12px}.intro{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:32px 0 28px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:var(--gold);margin:0 0 10px}h1{font:400 42px/1.15 Georgia,serif;margin:0 0 10px;letter-spacing:-1px}h1 em{color:#68815a}.intro p:not(.eyebrow){font-size:13px;color:#6c7b6d;margin:0}.chapter{display:flex;flex-direction:column;gap:7px;min-width:235px}.chapter label{font-size:9px;letter-spacing:1.5px;color:#7a826b}.chapter select{border:1px solid #b7bfaa;border-radius:6px;background:#f6f5e9;color:#435641;padding:11px}.chapter small{font-size:10px;text-align:right;color:#87927c}.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px}.puzzle-panel{border:1px solid #b5bfa9;border-radius:12px;overflow:hidden;box-shadow:0 15px 60px #6a654014;background:#f7f3e7;align-self:start}.topbar{display:flex;justify-content:space-between;align-items:center;padding:15px 22px;background:#e9eddd;border-bottom:1px solid #bec5ad;font-size:12px}.topbar span:last-child{color:#718368;font-size:11px}.stage{position:relative;min-height:470px;padding:40px;background:url('cedar-desk.webp') center/cover;display:flex;justify-content:center;align-items:center}#board{display:grid;width:min(100%,470px);gap:2px;background:#344d40;border:7px solid #344d40;border-radius:6px;box-shadow:0 8px 35px #3336}.black,.square{position:relative;aspect-ratio:1;min-width:0;border:0;border-radius:0}.black{background:#344d40;color:#ebe6cb;font-size:clamp(11px,1.2vw,17px)}.black .ac{position:absolute;right:5px;top:9px}.black .dn{position:absolute;left:5px;bottom:9px}.black .ac+.dn:before{content:"";position:absolute;transform:rotate(-44deg);background:#859477;width:1px;height:40px;bottom:-8px;left:21px}.black .complete{color:#b7dc8c}.square{background:#fcf6e4eb;color:#334b3d;display:flex;align-items:center;justify-content:center;padding:0;font:400 clamp(22px,2.6vw,40px)/1 Georgia}.square:hover:not(:disabled){background:#d5e2be}.square.related{background:#eff0d9e8}.square.selected{background:#d4e2b7;box-shadow:inset 0 0 0 3px #819969}.square.conflict{color:#b24e3e;background:#f4ded0}.pencil{display:grid;grid-template-columns:repeat(3,1fr);width:85%;height:85%;font:10px/1 system-ui;color:#6e7a5d;align-items:center;justify-items:center}.pencil i{font-style:normal}#message{padding:13px 18px;border-top:1px solid #c7cbb3;min-height:45px;color:#5c6e4c;font-size:12px;background:#f1f0df}.keypad{display:flex;gap:5px;padding:13px 15px 5px}.keypad button{flex:1;padding:10px 2px;font-size:18px;background:#f9f7eb;border-color:#c4cbb6}.tools{padding:10px 15px 15px;display:flex;gap:7px;flex-wrap:wrap}.tools button{font-size:11px;padding:9px 12px}.tools .active{background:#4e7255;color:#fff7e3;border-color:#4e7255}.card{border:1px solid #c5cbb7;border-radius:10px;background:#f5f3e7;padding:22px;margin-bottom:17px}h2{font:400 28px/1.2 Georgia;margin:0 0 10px}.muted,.card p:not(.eyebrow){font-size:12px;line-height:1.7;color:#74816a}.run-card{border-top:1px solid #d5d9c5;padding:15px 0 4px}.run-card h3{font-size:12px;font-weight:600;margin:0 0 6px}.run-card p{font-size:10px!important;margin:0 0 8px}.combinations{display:flex;gap:5px;flex-wrap:wrap;font-size:10px;max-height:200px;overflow:auto}.combinations span{background:#e4e9d7;border:1px solid #cbd3bc;border-radius:4px;padding:4px 6px}.example{display:flex;gap:3px;margin:18px 0}.example>*{height:41px;width:41px;display:grid;place-items:center;font-size:20px;background:#e2e9cf;border:1px solid #aebba0}.example b{background:#46614b;color:#f6f0d4;font-size:13px}.keys{font-size:10px!important;border-top:1px solid #d4d8c3;padding-top:12px}.primary{background:#48694d;color:#fff9e8;border-color:#48694d}.primary:hover:not(:disabled){background:#6b855a;color:#fff}.hidden{display:none!important}#win{position:absolute;inset:17% 12%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:#f4f4e6f7;border:1px solid #93a580;border-radius:16px;box-shadow:0 15px 40px #3344;padding:20px}#win p:first-child{font-size:10px;letter-spacing:2px;color:#94764a}#win h2{font-size:34px}#win p{font-size:12px;color:#7a8268}#win button{margin:5px}footer{padding:22px 0 28px;display:flex;justify-content:space-between;font-size:10px;color:#8a927c;gap:10px}dialog{max-width:610px;width:calc(100% - 30px);padding:32px;border:1px solid #b5c0a3;border-radius:15px;background:#f6f4e8;color:#42583f;font-size:13px;line-height:1.7;box-shadow:0 15px 80px #172b4366}dialog::backdrop{background:#263e35a8;backdrop-filter:blur(5px)}dialog h2{font-size:34px}.close{position:absolute;right:10px;top:8px;font-size:22px;background:transparent;border:0;padding:0 7px}code{font-size:11px;overflow-wrap:anywhere}@media(max-width:950px){main{padding:0 22px}.layout{grid-template-columns:minmax(0,1fr) 250px;gap:15px}.card{padding:17px}.stage{padding:25px;min-height:400px}h1{font-size:35px}header span{display:none}.black{font-size:12px}.black .ac{right:3px;top:5px}.black .dn{left:3px;bottom:5px}}@media(max-width:730px){main{padding:0 14px}header{height:65px}header>a{font-size:12px;letter-spacing:1.5px}header button{padding:6px;font-size:10px}header>div{gap:0}.intro{padding:24px 0 20px;align-items:start;gap:12px}.eyebrow{font-size:8px;letter-spacing:1.4px}h1{font-size:31px;max-width:220px}.intro p:not(.eyebrow){font-size:11px;line-height:1.5}.chapter{min-width:0;width:43%;flex-shrink:0;max-width:200px}.chapter label{font-size:8px}.chapter select{padding:9px 4px;font-size:10px;width:100%}.chapter small{font-size:8px}.layout{grid-template-columns:1fr}.stage{padding:22px;min-height:340px}#board{max-width:440px;border-width:5px}.square{font-size:clamp(19px,6vw,32px)}.black{font-size:clamp(9px,2.7vw,14px)}.black .ac{top:5px}.black .dn{bottom:5px}.black .ac+.dn:before{height:28px;left:15px;bottom:-3px}.pencil{font-size:8px}.topbar{padding:13px 15px}.keypad{gap:4px;padding:11px 11px 3px}.keypad button{padding:9px 2px;font-size:17px}.tools{padding:9px 11px 12px;gap:5px}.tools button{font-size:10px;padding:8px}.card{padding:18px;margin-bottom:12px}aside{display:grid;grid-template-columns:1fr 1fr;gap:10px}.story{align-self:start}aside h2{font-size:24px}.card p:not(.eyebrow){font-size:10px}.run-card h3{font-size:10px}.combinations span{font-size:9px;padding:3px}.example>*{width:31px;height:31px;font-size:16px}#win{inset:10% 7%}#win h2{font-size:29px}footer{flex-direction:column;font-size:9px;gap:4px}}@media(max-width:390px){aside{grid-template-columns:1fr}.intro h1{font-size:29px}.stage{padding:18px}}
@media(max-width:730px){.black{line-height:1}.black .ac{top:2px;right:2px}.black .dn{bottom:2px;left:2px}.black .ac+.dn:before{display:none}}