/* A linen-and-vermilion atelier, not a shared arcade skin. */
:root{color-scheme:light;--paper:#f3ecdc;--ink:#302d27;--muted:#736952;--red:#b64730;--blue:#365f99;--gold:#ab7e30;--edge:#d1c3a8;--cloth:#fbf6eb}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{background:var(--paper);color:var(--ink);font:14px/1.4 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-tap-highlight-color:transparent}button,input,a{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.42}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--blue);outline-offset:3px}a{color:inherit}button{border:0}button,input{-webkit-user-select:none;user-select:none}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.game-shell{height:100vh;height:100dvh;width:100%;max-width:700px;margin:auto;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:10px;padding:max(10px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.masthead{display:flex;align-items:center;gap:9px;min-width:0;border-bottom:1px solid var(--edge);padding-bottom:9px}.icon{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;background:transparent;border:1px solid var(--edge);border-radius:50%;text-decoration:none;font-size:22px}.back{border-color:transparent}.wordmark{flex:1;min-width:0}.wordmark h1{margin:0;font:27px/.96 Georgia,"Times New Roman",serif;letter-spacing:-1.4px;white-space:nowrap}.wordmark em{font-weight:400}.wordmark>span{display:block;margin-top:7px;font-size:8px;font-weight:750;letter-spacing:2px}.tools{display:flex;gap:5px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px}.dashboard{display:flex;align-items:center;min-height:72px;gap:12px}.score{flex:0 0 auto}.score>.eyebrow{display:block;font-size:9px}.score>strong{font:46px/.96 Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:-2px}.pattern{flex:1;min-width:0;display:grid;gap:3px;padding-left:10px;border-left:1px solid var(--edge)}.pattern>b{font:italic 17px/1.1 Georgia,serif}.pattern>small{font-size:8px;color:var(--muted);letter-spacing:.6px}.knots{text-align:center;flex:0 0 53px;color:var(--red)}.knots strong{display:block;font:40px/.96 Georgia,serif}.knots>span{display:block;font-size:8px;letter-spacing:1px;font-weight:700}
.stage{position:relative;min-height:0;overflow:hidden;border:1px solid #c8b99a;border-radius:24px;background:var(--cloth);box-shadow:inset 0 0 0 5px var(--paper),inset 0 0 0 6px #d7cbb3,0 8px 26px #76613a0a;touch-action:none;isolation:isolate}.stage:after{content:"";position:absolute;inset:12px;border:1px dashed #d6c7a9;border-radius:15px;pointer-events:none;z-index:0}.stage-label,.stage-caption{position:absolute;left:22px;right:22px;display:flex;justify-content:space-between;gap:10px;pointer-events:none;font-size:8px;letter-spacing:1.3px;font-weight:650;color:#85775c;z-index:1}.stage-label{top:21px}.stage-caption{bottom:20px}#threads{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#pins{position:absolute;inset:0;z-index:3;pointer-events:none}.pin{position:absolute;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:transparent;display:grid;place-items:center;padding:0;touch-action:none;pointer-events:auto}.pin:before{content:"";position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle at 33% 23%,#fce9b4 0,#dbc385 40%,#bb9650 72%,#9c7835 100%);border:1px solid #98702d;box-shadow:0 3px 0 #94703b,0 5px 7px #2c231431,inset 0 0 0 3px #f5e2ac,0 0 0 4px #fbf6eb}.pin:after{content:"";position:absolute;inset:12px;border:1px solid #9d783f6e;border-radius:50%}.pin>span{position:relative;z-index:1;font:700 12px Georgia,serif;color:#493416;text-shadow:0 1px #fff4d2}.pin.held:before{box-shadow:0 7px 0 #94703b,0 13px 12px #2c231435,inset 0 0 0 3px #f5e2ac,0 0 0 5px #365f9933;transform:translateY(-3px)}.pin.hinted{outline:2px dashed var(--red);outline-offset:1px}.pin.bad:before{box-shadow:0 3px 0 #94703b,0 0 0 5px #b647302b,inset 0 0 0 3px #f5e2ac}.pin:focus-visible{outline:3px solid var(--blue)}.guide{position:absolute;z-index:2;pointer-events:none;transform:translate(-50%,-50%);text-align:center}.guide-dot{display:block;width:42px;height:42px;border:1px dashed var(--red);border-radius:50%;background:#b6473007}.guide b{position:absolute;top:48px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:8px;letter-spacing:1.3px;color:var(--red)}.welcome{position:absolute;left:0;right:0;bottom:14%;z-index:1;text-align:center;pointer-events:none}.welcome>.eyebrow{color:var(--muted);font-size:8px}.welcome p{font:30px/1.06 Georgia,serif;margin:8px 0;color:#302d27}.welcome p em{font-weight:400;color:var(--red)}.award{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.94);z-index:5;min-width:210px;padding:22px;text-align:center;background:#fbf6ebee;border:1px solid #b5a478;border-radius:80px;opacity:0;pointer-events:none;transition:opacity .16s,transform .2s}.award.visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.award>span{font-size:9px;letter-spacing:2px;font-weight:700;color:var(--blue)}.award>strong{display:block;font:50px/1.05 Georgia,serif;color:var(--ink)}.award>small{font-size:10px;color:var(--muted)}
.console{display:flex;align-items:center;gap:13px;min-height:88px}.spool{flex:0 0 28px;height:45px;background:repeating-linear-gradient(0deg,#ab472c 0,#ab472c 2px,#d77751 2px,#d77751 4px);border-radius:8px;position:relative;box-shadow:inset 4px 0 7px #68251536}.spool:before,.spool:after{content:"";position:absolute;left:-3px;right:-3px;height:8px;border:1px solid #a3844a;border-radius:50%;background:#d1b075}.spool:before{top:-3px}.spool:after{bottom:-3px}.thread-time{flex:1;min-width:0}.thread-time>div:first-child{display:flex;align-items:baseline;justify-content:space-between;gap:3px}.thread-time .eyebrow{font-size:8px;letter-spacing:1px}.thread-time strong{font:29px/1 Georgia,serif;font-variant-numeric:tabular-nums}.thread-time strong span{font:13px Georgia,serif}.time-meter{height:4px;background:#d8cbb4;margin:7px 0 6px;overflow:hidden}.time-meter>i{display:block;height:100%;background:var(--red);width:64.3%;transform-origin:left}.thread-time p{font-size:10px;line-height:1.25;margin:0;color:var(--muted);min-height:25px}.hint-button{flex:0 0 83px;min-height:62px;border-left:1px solid var(--edge);background:transparent;padding:4px 0 4px 10px;display:grid;justify-items:center;gap:1px}.hint-button>span{font-size:25px;line-height:1.1;color:var(--red)}.hint-button b{font-size:11px;font-weight:650}.hint-button small{font-size:9px;color:var(--muted)}.footnote{min-height:28px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--edge)}.footnote>span{font-size:8px;letter-spacing:.8px;color:var(--muted);font-weight:700}.text-button{background:transparent;padding:11px 6px;min-height:44px;font-size:12px;text-decoration:underline;text-underline-offset:4px}.footnote .text-button{font-size:10px;padding:4px;min-height:44px}
.overlay{position:fixed;inset:0;z-index:100;background:#39302065;backdrop-filter:blur(7px);display:grid;place-items:center;padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}.panel{width:min(100%,440px);max-height:100%;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;background:var(--cloth);border:1px solid #cab997;box-shadow:0 20px 80px #20180836;border-radius:24px;padding:30px}.panel>.eyebrow{color:var(--red);font-size:9px}.panel h2{font:48px/.96 Georgia,serif;letter-spacing:-1.7px;margin:16px 0}.panel h2 em{color:var(--red);font-weight:400}.panel p{font-size:13px;line-height:1.6;margin:14px 0;color:#5b513f}.primary,.secondary{width:100%;min-height:50px;display:flex;align-items:center;justify-content:space-between;text-align:left;padding:12px 17px;border-radius:10px;font-size:14px;font-weight:650}.primary{background:var(--red);color:#fff8e9;box-shadow:0 4px 0 #84341f;margin:16px 0}.primary>span{font-size:22px;font-weight:400}.secondary{border:1px solid var(--edge);background:transparent;margin:10px 0;justify-content:center}.settings{border-block:1px solid var(--edge);padding:5px 0;margin:20px 0 8px}.settings label{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:46px;font-size:12px}.settings small{display:block;font-size:9px;color:var(--muted)}.settings input{appearance:none;flex:0 0 44px;width:44px;height:26px;background:#c9bfa9;border-radius:20px;position:relative;margin:5px 0;cursor:pointer}.settings input:after{content:"";position:absolute;width:18px;height:18px;left:4px;top:4px;border-radius:50%;background:#fff9ed}.settings input:checked{background:var(--blue)}.settings input:checked:after{left:22px}.panel-links{display:flex;justify-content:space-between;align-items:center}.wide{width:100%;text-align:center}.exit-link{display:block;font-size:11px;text-align:center;padding:12px;margin-top:10px}.small,.panel p.small{font-size:10px;line-height:1.6}.final-score{display:block;font:64px/1 Georgia,serif;letter-spacing:-2px;font-variant-numeric:tabular-nums}.result-grid{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--edge);padding:16px 0;margin:22px 0;gap:6px;text-align:center}.result-grid strong{display:block;font:28px Georgia,serif}.result-grid span{font-size:10px;color:var(--muted)}.next-game{display:grid;gap:4px;border-top:1px solid var(--edge);margin-top:15px;padding-top:8px}.next-game a{font-size:11px;min-height:44px;display:flex;align-items:center;justify-content:center}
[data-fabric="rose"]{--cloth:#fbf0e8;--paper:#f0e4d8}[data-fabric="blue"]{--cloth:#f1f3ec;--paper:#e7eadd}[data-low="true"] .thread-time strong{color:var(--red)}[data-state="resolved"] .knots{color:var(--blue)}[data-reduced="true"] *{animation:none!important;transition:none!important}
@media(min-width:800px) and (min-height:700px){.game-shell{padding-top:22px;padding-bottom:16px;gap:16px}.wordmark h1{font-size:33px}.dashboard{min-height:83px}.stage-label,.stage-caption{font-size:9px}.console{min-height:108px}.thread-time .eyebrow{font-size:10px}.thread-time p{font-size:12px}.footnote>span{font-size:10px}}
@media(max-width:370px){.game-shell{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right));gap:6px}.wordmark h1{font-size:23px}.wordmark>span{font-size:7px;letter-spacing:1.2px}.masthead{gap:4px}.tools{gap:2px}.score>strong{font-size:40px}.pattern>b{font-size:14px}.dashboard{gap:7px;min-height:64px}.knots{flex-basis:47px}.pattern{padding-left:7px}.stage-label,.stage-caption{font-size:7px;letter-spacing:.6px}.welcome p{font-size:26px}.console{gap:10px}.spool{flex-basis:24px}.hint-button{flex-basis:76px}.thread-time .eyebrow{font-size:7px;letter-spacing:.5px}.panel{padding:23px}}
@media(max-height:620px) and (orientation:portrait){.game-shell{gap:5px;padding-top:max(6px,env(safe-area-inset-top));padding-bottom:max(5px,env(safe-area-inset-bottom))}.masthead{padding-bottom:5px}.dashboard{min-height:58px}.score>strong{font-size:38px}.console{min-height:76px}.footnote{min-height:30px}.welcome{bottom:12%}.welcome p{font-size:24px}.welcome>.eyebrow{display:none}.stage-label{top:17px}.stage-caption{bottom:15px}.panel h2{font-size:40px}}
@media(orientation:landscape) and (max-height:650px){.game-shell{max-width:1150px;grid-template-columns:minmax(220px,.7fr) minmax(280px,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;gap:8px 20px;padding: max(8px,env(safe-area-inset-top)) max(15px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(15px,env(safe-area-inset-left))}.masthead{grid-column:1;grid-row:1;gap:4px;padding-bottom:6px}.wordmark h1{font-size:23px}.wordmark>span{font-size:7px;letter-spacing:1px}.masthead .back{display:none}.tools{gap:3px}.dashboard{grid-column:1;grid-row:2;align-self:center;min-height:62px;gap:8px}.pattern>b{font-size:15px}.pattern>.eyebrow{font-size:8px}.score>strong{font-size:39px}.knots{flex-basis:42px}.knots strong{font-size:32px}.stage{grid-column:2;grid-row:1/5}.console{grid-column:1;grid-row:3;gap:10px;min-height:79px}.spool{display:none}.footnote{grid-column:1;grid-row:4}.footnote>span{font-size:7px;letter-spacing:0}.welcome p{font-size:26px}.welcome>.eyebrow{display:none}.panel{width:min(100%,560px);padding:24px}.stage-label,.stage-caption{font-size:7px;letter-spacing:.8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}

@media(orientation:landscape) and (max-width:580px){.game-shell{grid-template-columns:minmax(170px,.65fr) minmax(0,1fr);gap:6px 10px;padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}.wordmark h1{font-size:21px}.wordmark>span{font-size:6px}.tools .icon{width:44px;flex-basis:44px;height:44px}.score>strong{font-size:33px}.pattern{padding-left:5px}.pattern>b{font-size:12px}.knots{flex-basis:30px}.knots>span{font-size:6px}.stage-label span:first-child{font-size:6px}.stage-label span:last-child{display:none}.console{gap:5px}.hint-button{flex-basis:67px}.thread-time .eyebrow{font-size:6px}.welcome p{font-size:22px}.footnote>span{font-size:6px}}

/* Short viewports keep a full-size board; the lesson becomes a quiet caption. */
.stage[data-compact="true"] .welcome{bottom:34px}
.stage[data-compact="true"] .welcome>.eyebrow{display:none}
.stage[data-compact="true"] .welcome p{font:14px/1.15 Georgia,serif;margin:0}
.stage[data-compact="true"] .welcome br{display:none}
.stage[data-compact="true"] .welcome em:before{content:" "}
.stage[data-compact="true"] .guide b{top:14px;left:-8px;transform:translateX(-100%);font-size:7px;letter-spacing:.5px}
@media(max-height:540px) and (orientation:portrait){.footnote{display:none}.console{min-height:72px}.game-shell{grid-template-rows:auto auto minmax(0,1fr) auto}}

[data-long-score="true"] .score>strong{font-size:26px;letter-spacing:-1px}[data-long-score="true"] .final-score{font-size:40px}