:root{color-scheme:dark;--bg:#10192e;--panel:#17233b;--ink:#f7f2e9;--muted:#aebad0;--gold:#f6d997;--mint:#8de0d0;--line:#31415d;--lavender:#bcb4fb;font-family:"Yu Gothic UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-width:280px;background:radial-gradient(ellipse at 80% 25%,#29315755,transparent 53%),radial-gradient(ellipse at 10% 85%,#23424433,transparent 55%),var(--bg);color:var(--ink)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.4}button,a,summary{outline-offset:5px}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--gold)}button{color:inherit}a{color:inherit;text-decoration:none}button:hover:not(:disabled){filter:brightness(1.12)}[hidden]{display:none!important}h1,h2,p{margin-top:0}.sky-grain{position:fixed;inset:0;pointer-events:none;opacity:.28;background-image:radial-gradient(circle,#a3b3d0 1px,transparent 1.5px),radial-gradient(circle,#a3b3d0 1px,transparent 1.5px);background-size:131px 137px,211px 193px;background-position:20px 38px,71px 84px}.app{position:relative;max-width:1240px;padding:0 48px;margin:auto}.site-header{height:105px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #aebad018;gap:12px}.brand{display:flex;align-items:center;gap:11px;font-size:15px;font-weight:700;letter-spacing:.08em}.brand-mark{font-size:43px;color:var(--gold);font-weight:400;line-height:1}.brand small{display:block;font-size:8px;letter-spacing:.25em;color:var(--muted);margin-top:6px;font-weight:500}.header-actions{display:flex;align-items:center;gap:24px}.collection-count{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.icon-button{border:1px solid #72829e55;border-radius:24px;background:#1b284144;min-height:40px;padding:8px 15px;font-size:11px}.home{min-height:520px;display:grid;grid-template-columns:1fr 1.06fr;align-items:center;gap:15px;padding:24px 0 20px}.eyebrow{font-size:10px;letter-spacing:.17em;color:var(--gold);font-weight:600;line-height:1.8}.eyebrow span{display:inline-block;width:18px;height:1px;background:var(--gold);vertical-align:middle;margin-right:10px}.home h1{font-size:clamp(36px,4.1vw,53px);line-height:1.55;letter-spacing:.025em;font-weight:500;margin-bottom:18px}.home h1 em{font-style:normal;color:var(--gold)}.intro{font-size:13px;color:var(--muted);line-height:2.15;letter-spacing:.07em;margin-bottom:20px}.home-tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:23px}.home-tags span{font-size:10px;border:1px solid #aebad030;border-radius:3px;padding:5px 8px;color:#ccd3e0}.primary{border:0;border-radius:8px;background:var(--gold);color:#273044;min-height:49px;padding:12px 24px;font-size:13px;letter-spacing:.04em;font-weight:700;box-shadow:0 5px 28px #eecf7812}.home .primary{display:flex;align-items:center;justify-content:space-between;width:256px}.primary span{font-size:21px;font-weight:400}.text-button{border:0;background:transparent;color:var(--muted);font-size:12px;min-height:44px;padding:11px 0}.home .text-button{width:256px;text-align:center;margin-top:5px}.home .text-button span{margin-left:10px}.home-footnote{font-size:10px;color:#8797b1;margin:15px 0 0;line-height:1.8}.hero-art{position:relative;width:100%;aspect-ratio:1;max-width:535px;justify-self:end}.hero-constellation{position:absolute;inset:0;width:100%;height:100%}.ghost-chart{color:#53638355}.hero-glow{opacity:.7;animation:breathe 5s ease-in-out infinite}.orbit{position:absolute;border:1px solid #9facc519;border-radius:50%;inset:5%}.orbit-two{inset:2%;border-style:dashed;border-color:#9facc510}.sky-label{position:absolute;left:0;right:0;text-align:center;font-size:8px;letter-spacing:.22em;color:#8b9ab4}.label-top{top:1%}.art-caption{position:absolute;bottom:0;left:10%;right:10%;display:flex;align-items:center;gap:14px;background:#1c294099;border:1px solid #6a7b9b33;border-radius:9px;padding:14px 18px;font-size:11px;backdrop-filter:blur(12px)}.art-caption small{display:block;font-size:7px;letter-spacing:.16em;margin-top:7px;color:var(--muted)}.tiny-spark{font-size:28px;color:var(--gold)}.caption-number{font-size:27px;font-weight:300;color:var(--gold);margin-left:auto}.site-footer{min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #aebad018;font-size:9px;color:#8393af;letter-spacing:.07em}.site-footer>span:first-child{letter-spacing:.18em;font-size:8px}.site-footer a{min-height:44px;display:flex;align-items:center}.play{padding:30px 0;display:grid;grid-template-columns:300px minmax(0,1fr);gap:55px;align-items:center;min-height:570px}.back{margin-bottom:14px;font-size:11px}.play h1,.collection h1{font-size:29px;font-weight:500;letter-spacing:.06em;margin-bottom:12px}.level-note{color:var(--muted);font-size:12px;line-height:1.9;min-height:45px;white-space:pre-line}.stitch-counter{display:flex;gap:9px;align-items:baseline;margin-top:24px;font-size:11px;color:var(--muted)}.stitch-counter strong{font-size:34px;font-weight:400;color:var(--gold)}#completion-label{margin-left:auto;font-size:10px}.progress-track{height:3px;background:var(--line);margin:8px 0 20px;border-radius:4px;overflow:hidden}#progress-fill{width:0;height:100%;background:var(--gold);transition:width .3s}.status{font-size:12px;line-height:1.85;min-height:67px;color:var(--mint);padding:12px 14px;background:#8de0d008;border-left:2px solid #8de0d05a;margin-bottom:18px}.tools{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tools button{min-height:43px;border:1px solid #7787a444;background:#1e2c4577;border-radius:7px;font-size:11px}.tools button:last-child{grid-column:1/-1;background:transparent;border:0;color:var(--muted);min-height:34px}.rules{margin-top:15px;color:var(--muted);font-size:11px;line-height:1.9}.rules summary{cursor:pointer;min-height:34px}.rules p{margin-bottom:9px}.board-panel{position:relative;max-width:590px;width:100%;margin:auto;background:radial-gradient(ellipse at center,#29365266,transparent 65%),#15213a;border:1px solid #8496b333;border-radius:18px;padding:0 20px;box-shadow:0 24px 64px #0002}.board-top,.board-bottom{height:48px;display:flex;align-items:center;justify-content:space-between;font-size:8px;letter-spacing:.13em;color:#93a3be}.board-bottom{border-top:1px solid #aebad014;font-size:10px;letter-spacing:.05em}.board-dots{color:var(--gold);letter-spacing:.2em}.board{position:relative;aspect-ratio:1;width:100%;touch-action:manipulation;user-select:none;-webkit-user-select:none;background-image:radial-gradient(circle,#7585a733 1px,transparent 1.5px);background-size:25px 25px}.board:before,.board:after{content:"";position:absolute;border:1px solid #8496b31c;border-radius:50%;inset:3%;pointer-events:none}.board:after{inset:21%;border-style:dashed}#threads,#stars{position:absolute;inset:0;width:100%;height:100%}#threads{overflow:visible;z-index:1;pointer-events:none}.thread{stroke:#8394b3;stroke-width:.65;stroke-linecap:round;opacity:.65;transition:stroke .15s}.thread.lit{stroke:var(--gold);opacity:1;stroke-width:.95;filter:drop-shadow(0 0 1.2px #f6d99799)}.thread.hinted{stroke:var(--mint);stroke-width:1.2;stroke-dasharray:2 2;opacity:1}#stars{z-index:2}.star{position:absolute;width:44px;height:44px;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;border:0;background:transparent;padding:0;border-radius:50%;color:#c9d3e7}.star:before{content:"";position:absolute;width:15px;height:15px;background:#17253c;border:1px solid #b6c3da;border-radius:50%;transition:background .2s,box-shadow .2s}.star:after{content:"";position:absolute;width:5px;height:5px;background:#d6e0f3;border-radius:50%}.star .star-label{position:absolute;top:36px;font-size:8px;font-weight:600;letter-spacing:.04em;color:#a7b5cd;pointer-events:none}.star.visited:before{background:#ddc180;border-color:var(--gold);box-shadow:0 0 16px #f6d99740}.star.visited:after{background:#fff1c9}.star.current:before{width:25px;height:25px;background:#f6d99716;border-color:var(--gold);box-shadow:0 0 20px #f6d99760}.star.current:after{width:12px;height:12px;border-radius:1px;background:var(--gold);transform:rotate(45deg)}.star.available:not(.current):before{border-color:var(--mint);box-shadow:0 0 0 4px #8de0d00d}.star.hinted:before{border-color:var(--mint);box-shadow:0 0 0 7px #8de0d024,0 0 25px #8de0d060;animation:breathe 1.5s infinite}.star:disabled{opacity:1}.board-panel.solved .thread{stroke:var(--gold)}.board-panel.solved .star:before{box-shadow:0 0 21px #f6d99777}.clear-card{position:relative;margin:0 -20px;padding:20px 24px 17px;border-top:1px solid #f6d99744;background:linear-gradient(120deg,#293653,#1b3040);border-radius:0 0 18px 18px;animation:appear .35s ease-out}.clear-card .eyebrow{font-size:8px;margin-bottom:6px}.clear-card h2{font-size:21px;font-weight:500;margin-bottom:8px}.clear-card p:not(.eyebrow){font-size:11px;color:#c3ccde;line-height:1.9;margin-bottom:12px}.clear-actions{display:flex;align-items:center;gap:20px}.clear-actions .primary{font-size:12px;min-height:43px;padding:10px 20px}.clear-actions .text-button{font-size:10px}.collection{padding:28px 0 36px;min-height:550px}.collection>.eyebrow{margin-top:8px}.collection>p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.8}.collection-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:25px}.work-card{background:#19263f;border:1px solid #8394b333;border-radius:12px;text-align:left;padding:14px;position:relative;min-width:0}.work-card svg{display:block;width:100%;height:112px;opacity:.4}.work-card.completed{border-color:#f6d99755}.work-card.completed svg{opacity:1}.work-card.locked{opacity:.45}.work-card .work-number{font-size:9px;color:var(--muted)}.work-card strong{display:block;font-size:12px;font-weight:500;margin:7px 0}.work-card .work-status{font-size:9px;color:var(--mint)}.collection .save-note{font-size:10px;margin:23px 0 0}.noscript{padding:24px;background:#3c2931}.board-crosshair{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#8496b312,#8496b312) center/1px 100% no-repeat,linear-gradient(#8496b312,#8496b312) center/100% 1px no-repeat}
h1[tabindex="-1"]:focus{outline:none}.cover .site-header{border:0}.cover .header-actions,.cover .intro,.cover .home .primary,.cover .home .text-button,.cover .home-footnote,.cover .site-footer,.cover .art-caption,.cover .sky-label{display:none}.cover .home{min-height:520px}.cover .home h1{font-size:76px;line-height:1.4;letter-spacing:.09em;margin-bottom:28px}.cover .home .eyebrow{font-size:12px;margin-bottom:26px}.cover .home-tags span{border:0;font-size:13px;padding:0 15px 0 0;color:var(--muted)}.cover .hero-art{max-width:550px}.cover .brand{font-size:14px}
@keyframes breathe{50%{opacity:.45}}@keyframes appear{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1050px) and (max-height:760px){.app{padding:0 48px}.site-header{height:82px}.home{min-height:525px;padding:19px 0}.hero-art{max-width:500px}.site-footer{min-height:55px}.play{padding:22px 0;gap:60px;grid-template-columns:310px minmax(0,1fr)}.board-panel{max-width:480px}.board-top,.board-bottom{height:35px}}
@media(max-width:900px){.app{padding:0 28px}.site-header{height:86px}.home h1{font-size:36px}.home{min-height:560px;gap:0}.hero-art{margin-left:-10px;width:106%}.home-footnote{max-width:260px}.art-caption{left:6%;right:6%;padding:11px;font-size:9px}.play{grid-template-columns:240px minmax(0,1fr);gap:25px;min-height:660px}.play h1{font-size:25px}.board-panel{padding:0 12px}.clear-card{margin:0 -12px}.collection-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:650px){.app{padding:0 20px}.site-header{height:76px}.brand{font-size:12px;gap:7px}.brand-mark{font-size:34px}.brand small{font-size:6px;margin-top:4px}.header-actions{gap:9px}.icon-button{padding:6px 11px;font-size:10px;min-height:36px}.collection-count{font-size:9px}.home{display:flex;flex-direction:column;padding:30px 0 22px;gap:10px;min-height:0}.home-copy{width:100%;text-align:center}.eyebrow{font-size:9px}.home h1{font-size:35px;line-height:1.5;margin-bottom:14px}.intro{font-size:12px;line-height:1.95;margin-bottom:15px}.home-tags{justify-content:center;gap:6px;margin-bottom:19px}.home-tags span{font-size:9px}.home .primary{width:min(100%,290px);margin:auto;min-height:49px}.home .text-button{margin-top:6px}.home-footnote{max-width:none;margin:7px 0 0;font-size:9px}.hero-art{width:100%;max-width:350px;margin:0;align-self:center}.art-caption{left:9%;right:9%;padding:11px 13px;font-size:9px}.art-caption small{font-size:6px}.caption-number{font-size:23px}.site-footer{flex-wrap:wrap;justify-content:center;gap:0 18px;font-size:8px;padding:13px 0}.site-footer>span:nth-child(2){display:none}.site-footer a{min-height:25px}.play{display:flex;flex-direction:column;gap:12px;align-items:stretch;min-height:0;padding:12px 0 23px}.play-info{display:contents}.back{align-self:flex-start;margin:0;min-height:36px}.play-info>.eyebrow{margin:0;font-size:9px}.play h1{font-size:25px;margin:0}.level-note{font-size:11px;min-height:0;line-height:1.7;margin:0}.stitch-counter{margin-top:0;gap:7px}.stitch-counter strong{font-size:25px}.progress-track{margin:-6px 0 0;height:2px}.status{order:3;min-height:0;margin:0;font-size:11px;padding:10px 12px}.tools{order:4;grid-template-columns:1fr 1fr 1fr;gap:6px}.tools button{font-size:10px;min-height:43px}.tools button:last-child{grid-column:auto;border:1px solid #7787a444;min-height:43px}.rules{order:5;margin-top:0;font-size:10px}.board-panel{order:2;padding:0 13px;border-radius:12px}.board-top,.board-bottom{height:32px;font-size:8px}.board-bottom{font-size:9px}.board{max-width:420px;margin:auto}.clear-card{margin:0 -13px;padding:15px 17px;border-radius:0 0 12px 12px}.clear-card h2{font-size:20px}.clear-actions{gap:13px}.clear-actions .primary{font-size:11px;padding:9px 16px}.collection{padding-top:13px}.collection h1{font-size:27px}.collection-grid{grid-template-columns:repeat(2,1fr);gap:10px;margin-top:20px}.work-card{padding:10px}.work-card svg{height:105px}.work-card strong{font-size:11px}.star .star-label{top:35px;font-size:7px}}
@media(max-width:360px){.app{padding:0 14px}.collection-count{display:none}.home h1{font-size:32px}.star{width:42px;height:42px}.tools button{font-size:9px}.board-panel{padding:0 9px}.clear-card{margin:0 -9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
