:root{color-scheme:dark;--bg:#281f32;--ink:#f2e5dc;--muted:#bcaab7;--peach:#e9b99d;--mint:#a8cabd;--line:#665064}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 10% 36%,#453044 0,transparent 57%),var(--bg);color:var(--ink);font:14px/1.6 system-ui,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;background:#3d2f43;border:1px solid #765f73;padding:10px 16px;border-radius:7px;cursor:pointer;touch-action:manipulation}button:hover{background:#564052}button:active{transform:translateY(1px)}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--peach);outline-offset:4px}a{color:var(--peach);text-decoration:none}header,main,footer{max-width:1190px;margin:auto}header{padding:28px 28px 15px;display:flex;align-items:center;justify-content:space-between}.brand{font:38px Georgia,serif;color:var(--ink);line-height:1;letter-spacing:-1.5px}.brand span{display:block;font:9px/2.4 system-ui,sans-serif;letter-spacing:2.5px;color:var(--peach)}.header-controls{display:flex;gap:9px}.header-controls button{font-size:11px;background:transparent}.intro{display:flex;justify-content:space-between;align-items:flex-end;padding:25px 28px 38px}.eyebrow{color:var(--peach);font-size:10px;letter-spacing:2px;font-weight:600}h1{font:clamp(36px,4.8vw,62px)/1.06 Georgia,serif;letter-spacing:-1.8px;margin:13px 0 0}.intro-copy{font-size:15px;color:var(--muted);padding:0 12px 6px 25px;line-height:1.8}.chapter-row{margin:0 28px;padding:20px 0 18px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line)}#chapter{font-size:10px;letter-spacing:2px;color:var(--peach)}h2{font:28px Georgia,serif;margin:5px 0}.score{text-align:right}.score strong{font:30px Georgia,serif;display:block}.score span{font-size:10px;color:var(--muted)}.workshop{display:grid;grid-template-columns:minmax(0,1fr) 298px;gap:36px;padding:0 28px;align-items:start}.surface{min-width:0}.board{aspect-ratio:1;position:relative;background:url('silk.webp') center/cover;box-shadow:0 20px 50px #100c1666;border-radius:4px;isolation:isolate}#links,#cells,#seeds{position:absolute;inset:14%}#links{pointer-events:none;z-index:0}#cells{pointer-events:none;z-index:1}#seeds{z-index:2}#seeds>*,#cells>*,#links>*{position:absolute}.seed{border:none;transform:translate(-50%,-50%);border-radius:50%;padding:0;display:flex;align-items:center;justify-content:center;background:transparent;transition:box-shadow .2s}.seed img{width:88%;height:auto;pointer-events:none;transition:transform .24s;filter:drop-shadow(0 2px 2px #0008)}.seed.fixed{pointer-events:none;opacity:.48}.seed.editable{background:#f5dbb40d;border:1px solid #e8c0a073;box-shadow:0 0 12px #ffbf9533}.seed.editable:hover{background:#eed8c024}.seed.selected{outline:2px solid #f4c5a6;outline-offset:3px;box-shadow:0 0 18px #e5b28b55}.seed .number{position:absolute;bottom:-11px;font-size:10px;color:#ecd1c3;line-height:1;background:#352335;padding:1px 3px;border-radius:5px}.line{height:1px;background:#c9a1a03a;transform-origin:0 50%}.cell{transform:translate(-50%,-50%);border:1px dashed #dfad9b90;border-radius:14px;display:grid;place-items:center;background:#2c193933;transition:border-color .2s,background .2s}.cell.match{border-color:#9cd5b48c;background:#94c9b00b}.cell img{width:52%;height:52%;object-fit:contain;filter:drop-shadow(0 2px 4px #0005)}.cell.still img{width:16%;height:16%;opacity:.8}.cell .tick{position:absolute;right:4px;bottom:0;font-size:9px;color:#b3dcc0}.board-note{font-size:11px;text-align:center;color:var(--muted);margin:15px 0}.touch-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--peach);margin-right:6px}.target-box{padding:18px 20px 12px;border:1px solid var(--line);background:#35293c;border-radius:10px}.target-box>.eyebrow{margin:0 0 14px;font-size:9px;text-align:center}#target{display:grid;gap:5px;max-width:210px;margin:auto}.target-cell{aspect-ratio:1;display:grid;place-items:center;border:1px solid #8c6d8050;border-radius:8px;background:#251a30}.target-cell img{width:72%;height:72%;object-fit:contain}.target-cell.still img{width:28%;height:28%}.target-cell.match{border-color:#9cccb3}.legend{display:flex;justify-content:space-between;margin-top:10px;font-size:10px;color:var(--muted)}.legend span{display:flex;align-items:center;gap:3px}.legend img{width:22px;height:22px;object-fit:contain}.turn-box{margin-top:18px}.label{font-size:10px;letter-spacing:1.3px;color:var(--peach);margin:0 0 10px}.turn-controls{display:flex;gap:9px}.turn-controls button{flex:1;font-size:26px;line-height:1.2;padding:11px 3px;background:#e9b99d;color:#342438;border-color:var(--peach)}.turn-controls button:hover{background:#f4d0b5}.turn-controls span{display:block;font-size:11px}.meter{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:10px;font-size:11px;color:var(--muted)}#par{color:var(--peach)}#preview{font-size:11px;color:var(--muted);min-height:35px;margin:10px 0}#status{font-size:12px;min-height:40px;color:#d7c5ce}.tools{display:flex;gap:7px}.tools button{flex:1;font-size:11px;padding:9px 4px}#success{margin-top:18px;padding:17px;border:1px solid #b7c7a0;background:#364039;border-radius:10px}#success>.eyebrow{margin:0;color:#dde2ac}#success h3{font:26px Georgia,serif;margin:7px 0}#success p:not(.eyebrow){font-size:12px;margin:5px 0 14px}#success button{width:100%;background:#b9cfae;color:#29352c;border:0}.shelf{margin:36px 28px 0;padding-top:22px;border-top:1px solid var(--line)}.shelf-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.shelf-label h2{font-size:25px}.shelf-label span{font-size:11px;color:var(--muted)}#levels{display:grid;grid-template-columns:repeat(8,1fr);gap:9px}#levels button{padding:13px 3px;display:flex;flex-direction:column;align-items:center;border-color:#745969;background:#372a3e}#levels img{width:28px;height:28px;object-fit:contain;opacity:.65;margin-bottom:5px}#levels span{font-size:11px}#levels button.current{outline:2px solid var(--peach);outline-offset:3px}#levels button.gold{background:#6c4b3c}#levels button.copper{background:#584438}#levels button.gold img,#levels button.copper img{opacity:1}.shelf>p{font-size:10px;color:var(--muted);margin-top:18px}#instructions{margin:30px 28px;padding:25px;background:#382b3e;border:1px solid var(--line);border-radius:12px}#instructions p{color:#d4c1cf}details{padding:12px;background:#2e2234;border-radius:7px}summary{cursor:pointer;color:var(--peach)}footer{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);padding:30px 28px;margin-top:35px;border-top:1px solid #66506455}[hidden]{display:none!important}@media(max-width:760px){header{padding:20px}.brand{font-size:31px}.header-controls button{font-size:10px;padding:8px}.intro{padding:24px 20px;display:block}.intro h1{font-size:42px}.intro-copy{padding:0;font-size:13px;line-height:1.7;margin:18px 0 0}.intro-copy br{display:none}.chapter-row{margin:0 20px;padding:15px 0}.chapter-row h2{font-size:25px}.score strong{font-size:26px}.workshop{grid-template-columns:1fr;gap:18px;padding:0 12px;max-width:580px;margin:auto}aside{display:grid;grid-template-columns:1fr 1.2fr;gap:14px;align-items:start;padding:0 7px}.target-box{padding:12px 9px}.target-box>.eyebrow{font-size:8px;letter-spacing:.9px}#target{gap:3px}.legend{font-size:8px;gap:2px}.legend img{width:15px;height:15px}.turn-box{margin:0}.turn-controls button{padding:8px 2px;font-size:23px}#preview{font-size:10px;min-height:34px}.meter{font-size:9px}#status{font-size:11px;min-height:47px}.tools{gap:4px}.tools button{font-size:10px}.board-note{font-size:10px;margin:12px 0}.seed .number{font-size:8px;bottom:-9px}.cell{border-radius:8px}.cell .tick{font-size:7px;right:2px}#success{grid-column:1/-1;margin:0}.shelf{margin:30px 20px 0}.shelf-label h2{font-size:23px}.shelf-label span{font-size:10px}#levels{gap:6px}#levels button{padding:10px 2px}#levels img{width:20px;height:20px}#levels span{font-size:10px}#instructions{margin:25px 16px;padding:20px}footer{padding:25px 20px;gap:15px;font-size:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.seed:active{transform:translate(-50%,-50%)}
