:root{color-scheme:dark;--ink:#f7edda;--muted:#b5c8c9;--gold:#edce90;--line:#ffffff20;--rose:#ef9baf;--tide:#7ed9cb;--sun:#f4c977;--moon:#b5a5ef}*{box-sizing:border-box}body{margin:0;background:#102e3c;color:var(--ink);font:15px/1.55 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}.scenery{position:fixed;inset:0;background:linear-gradient(90deg,#0b243ac9,#0c283a80,#0b243ab8),url('atelier.webp') center/cover;z-index:-1}.app{max-width:1240px;margin:auto;padding:30px 42px 20px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.brand{display:flex;align-items:center;gap:18px}.brandmark{font:62px/1 Georgia;color:var(--gold);transform:rotate(-18deg)}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.2px;color:var(--gold);margin:0 0 7px}h1{font:42px/.95 Georgia,serif;letter-spacing:-1px;margin:0}h1 span{display:block;font:12px/1.5 -apple-system,sans-serif;letter-spacing:3.5px;text-transform:uppercase;margin-top:10px;color:var(--muted)}button{border:1px solid var(--line);border-radius:9px;color:var(--ink);background:#183e4de8;font:inherit;font-size:13px;padding:10px 14px;cursor:pointer;transition:background .15s,transform .15s}button:hover{background:#2b5261}button:active{transform:translateY(1px)}button:focus-visible,a:focus-visible{outline:3px solid #ffe1a0;outline-offset:3px}button:disabled{opacity:.35;cursor:default}.top-actions{display:flex;gap:9px}#levels{display:flex;gap:8px;align-items:center;margin:0 0 18px}#levels button{width:40px;height:40px;padding:0;border-radius:50%;font:15px Georgia}#levels button.active{border-color:var(--gold);background:#e6c88d;color:#153747;box-shadow:0 0 25px #e6c88d22}#levels button.complete:after{content:'·';color:var(--gold);position:absolute;margin:13px 0 0 -6px}#levels button.active.complete:after{color:#153747}.workshop{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(330px,1fr);gap:22px}.loom-panel,.contract,.controls{background:linear-gradient(135deg,#163e4aee,#0d2939ed);border:1px solid #e9d7a32c;border-radius:18px;box-shadow:0 16px 50px #00131e33}.loom-panel{overflow:hidden}.panel-heading{display:flex;align-items:center;justify-content:space-between;padding:22px 26px 0}.panel-heading h2{font:26px Georgia;margin:0}.pill{border:1px solid var(--line);border-radius:30px;padding:6px 12px;font-size:11px;color:var(--muted)}#loom{width:100%;max-height:595px;aspect-ratio:640/590}#loom svg{display:block;width:100%;height:100%}.loom-caption{text-align:center;font:italic 13px Georgia;color:#bdc8c4;padding:0 15px 18px}aside{display:flex;flex-direction:column;gap:16px}.contract,.controls{padding:23px 24px}.contract h2{font:26px Georgia;margin:5px 0 10px}.intro{font-size:13px;line-height:1.65;color:var(--muted);margin-bottom:18px}.intro strong{color:var(--ink)}#target{display:flex;gap:8px;justify-content:center;background:#09233380;border:1px solid var(--line);border-radius:12px;padding:8px;margin-bottom:17px}.charm{width:42px;height:42px;object-fit:contain}.target-item{text-align:center;flex:1;min-width:0}.target-item span{display:block;font-size:10px;letter-spacing:1px;text-transform:uppercase}#quotas{display:grid;grid-template-columns:1fr 1fr;gap:8px}.quota{border:1px solid #ffffff12;border-radius:10px;display:flex;align-items:center;gap:8px;padding:9px;background:#ffffff03}.quota img{width:32px;height:32px;object-fit:contain}.quota strong{font-size:12px;display:block}.quota .numbers{font-size:11px;color:var(--muted)}.quota.done{border-color:#8cdbc850;background:#70c6b20d}.beads{display:flex;gap:4px;margin-top:3px;min-height:9px}.bead{width:7px;height:7px;border:1px solid currentColor;border-radius:50%;opacity:.5}.bead.filled{background:currentColor;opacity:1}.controls .eyebrow{font-size:9px;letter-spacing:1.6px}#moves{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}.move{padding:10px 6px;font-size:12px;white-space:nowrap;min-height:43px}.move kbd{font-size:9px;color:#d4caae;margin-right:5px;border:1px solid #ffffff25;border-radius:3px;padding:1px 3px}.move.hinted{outline:2px solid var(--gold);box-shadow:0 0 22px #f5cd6f22}.key-note{font-size:10px;color:var(--muted);margin:12px 0}.tools{display:flex;gap:7px}.tools button{flex:1;font-size:12px;padding:9px 5px}#message{font-size:12px;color:var(--muted);min-height:36px;margin:12px 0 0}#message.error{color:#ffc2c3}#win{margin-top:14px;padding:18px;background:#e3c08113;border:1px solid #e4cf8d66;border-radius:12px}#win h3{font:26px Georgia;margin:4px 0}#win p{font-size:12px;color:var(--muted)}#next,.primary{background:var(--gold);color:#143444;font-weight:600}footer{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#bdcfce;padding-top:20px;gap:12px}footer button{border:0;background:transparent;padding:0;font-size:11px;color:var(--gold)}dialog{max-width:530px;width:calc(100% - 32px);background:#143847;color:var(--ink);border:1px solid #cdbb8766;border-radius:18px;padding:32px;box-shadow:0 25px 90px #0008}dialog::backdrop{background:#03141dcc;backdrop-filter:blur(6px)}dialog h2{font:30px Georgia}dialog p{font-size:14px;color:#c8d7d5}dialog a{color:var(--gold)}.close{position:absolute;right:14px;top:12px;padding:2px 10px;font-size:23px;border:0;background:transparent}svg text{font-family:-apple-system,sans-serif}svg .thread{stroke-linecap:round;fill:none}svg .ribbon-edge{stroke:#071d2a;stroke-width:32}svg .ribbon-color{stroke-width:24}svg .ribbon-shine{stroke:#fff;stroke-width:3;opacity:.22}svg .ghost{stroke:#9cb9ba;stroke-width:1;stroke-dasharray:2 9;opacity:.18}svg .pin{fill:#d9c189;stroke:#203c49;stroke-width:2}@media(min-width:1500px){.app{padding-top:45px}}@media(max-width:820px){.app{padding:24px}.workshop{grid-template-columns:minmax(0,1.2fr) minmax(300px,1fr);gap:14px}.contract,.controls{padding:18px}.panel-heading{padding:20px 18px 0}.panel-heading h2{font-size:22px}}@media(max-width:690px){.app{padding:20px 14px}header{gap:10px}.brand{gap:9px}.brandmark{font-size:43px}h1{font-size:32px}h1 span{font-size:9px;letter-spacing:2px}.top-actions{flex-direction:column;gap:5px}.top-actions button{font-size:10px;padding:6px 10px}#levels{gap:6px;justify-content:space-between}#levels button{width:32px;height:32px;font-size:13px}.workshop{display:flex;flex-direction:column;gap:14px}.loom-panel{order:1}aside{display:contents}.contract{order:0;padding:17px}.contract h2{font-size:22px;display:inline}.intro{font-size:12px;margin:8px 0}#target{float:right;width:48%;padding:5px;margin:0 0 5px 10px;gap:0}.charm{width:33px;height:33px}.target-item span{font-size:8px}#quotas{gap:5px}.quota{padding:6px}.quota img{width:27px;height:27px}#loom{max-height:430px;aspect-ratio:640/550}.controls{order:2;padding:18px}.move{min-height:47px;font-size:13px}#message{min-height:20px}.loom-caption{padding-bottom:15px}footer{font-size:9px}footer span:nth-child(2){display:none}.panel-heading{padding:17px 18px 0}.panel-heading h2{font-size:24px}.pill{font-size:10px}}