@font-face{font-family:Albert Sans;src:url(/webfonts/albert-sans-latin.woff2) format("woff2");font-weight:300 900;font-display:swap}:root{--aida: #fbfcfd;--weave: #d9dee8;--ink: #23233f;--ink-2: #4f5274;--pink: #ff2e8c;--pink-deep: #c4005f;--pink-wash: rgba(255, 46, 140, .22);--yellow: #faec1e;--wood: #c99a62;--wood-dark: #8f6237;--mist: #e9ecf3;--white: #ffffff;--danger: #b3122f;--radius-s: 6px;--radius-m: 14px;--focus: 0 0 0 3px var(--white), 0 0 0 6px var(--ink);--measure: 66ch;color-scheme:light}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;font-family:Albert Sans,system-ui,-apple-system,Segoe UI,sans-serif;font-size:1.0625rem;line-height:1.55;color:var(--ink);background-color:var(--aida);background-image:radial-gradient(circle,var(--weave) 0 1.1px,transparent 1.5px);background-size:9px 9px}img,svg{max-width:100%}a{color:var(--ink);text-decoration-color:var(--pink);text-decoration-thickness:2px;text-underline-offset:3px}a:hover{background:linear-gradient(transparent 55%,var(--pink-wash) 55%)}:focus-visible{outline:none;box-shadow:var(--focus);border-radius:4px}h1,h2,h3{line-height:1.15;letter-spacing:-.01em}h2{font-size:clamp(1.6rem,1.2rem + 1.6vw,2.3rem);font-weight:800;margin:0 0 .6em}h3{font-size:1.2rem;font-weight:700;margin:0 0 .35em}p{margin:0 0 .9em}.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--white);padding:8px 14px;border-radius:var(--radius-s);z-index:50}.skip:focus{left:8px}.fine{font-size:.9rem;color:var(--ink-2)}.btn{display:inline-flex;align-items:center;gap:.4em;min-height:48px;padding:.6em 1.2em;border:2px solid var(--ink);border-radius:999px;background:var(--white);color:var(--ink);font:inherit;font-weight:700;text-decoration:none;cursor:pointer}.btn:hover{background:var(--mist)}.btn.primary{background:var(--ink);color:var(--white)}.btn.primary:hover{background:#34345a}.btn.small{min-height:40px;padding:.35em 1em;font-size:.95rem}.btn.danger{border-color:var(--danger);color:var(--danger)}.btn:disabled{opacity:.5;cursor:not-allowed}.link-btn{border:0;background:none;padding:.3em 0;font:inherit;font-weight:600;color:var(--ink);text-decoration:underline;text-decoration-color:var(--pink);text-decoration-thickness:2px;text-underline-offset:3px;cursor:pointer}.link-btn.danger{color:var(--danger);text-decoration-color:var(--danger)}.top{display:flex;align-items:center;gap:1.5rem;padding:14px clamp(16px,4vw,48px);max-width:1240px;margin:0 auto}.brand{display:inline-flex;align-items:center;gap:10px;font-weight:800;font-size:1.3rem;text-decoration:none;letter-spacing:-.02em}.brand svg{width:34px;height:34px}.brand:hover{background:none}.top nav{display:flex;gap:1.4rem;margin-left:auto}.top nav a{text-decoration:none;font-weight:600}.top-link{margin-left:auto;font-weight:600}@media(max-width:760px){.top nav{display:none}.top .btn{margin-left:auto}}.foot{margin-top:5rem;background:var(--ink);color:#e4e6f2;padding:3rem clamp(16px,4vw,48px) 2rem}.foot a{color:var(--white)}.foot-cols{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1.3fr 1fr;gap:2.5rem}.foot ul{list-style:none;padding:0;margin:0}.foot li{margin-bottom:.5em}.foot-name{font-weight:800;font-size:1.25rem}.foot-h{font-weight:700;color:var(--white)}.legal{max-width:1140px;margin:2.5rem auto 0;font-size:.85rem;color:#b8bbd3}@media(max-width:820px){.foot-cols{grid-template-columns:1fr}}.hero{max-width:1100px;margin:0 auto;padding:clamp(24px,5vw,64px) clamp(16px,4vw,48px) 2rem;text-align:center}.hero-stitch{position:relative;width:min(100%,980px);margin:0 auto}.hero-stitch svg{display:block;width:100%;height:auto}.swipe{position:absolute;left:4%;top:10%;height:36%;width:0;background:var(--pink);opacity:.32;mix-blend-mode:multiply;border-radius:6px 14px 10px 4px;transform:rotate(-1.2deg);animation:swipe 1.1s .5s cubic-bezier(.6,0,.3,1) forwards}@keyframes swipe{to{width:92%}}@media(prefers-reduced-motion:reduce){.swipe{animation:none;width:92%}}.lede{max-width:58ch;margin:1.6rem auto 1.4rem;font-size:clamp(1.1rem,1rem + .4vw,1.3rem)}.hero-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.hero-fine{margin-top:1rem;color:var(--ink-2);font-size:.95rem}.hoop-section{max-width:1040px;margin:3rem auto;padding:0 clamp(16px,4vw,48px);display:grid;grid-template-columns:minmax(260px,440px) 1fr;gap:clamp(24px,5vw,64px);align-items:center}.hoop-frame{position:relative;aspect-ratio:1;border-radius:50%;padding:7%;background:radial-gradient(circle at 35% 30%,#f0c48f,var(--wood) 55%,var(--wood-dark));box-shadow:inset 0 0 0 6px #00000014,0 18px 40px -18px #23233f73}.hoop-ring{position:absolute;inset:3.2%;border-radius:50%;border:3px solid rgba(255,255,255,.35);pointer-events:none}.hoop-frame:after{content:"";position:absolute;top:-14px;left:50%;width:34px;height:22px;transform:translate(-50%);border-radius:6px;background:linear-gradient(#9aa0ad,#5d6372)}#hoop-demo{width:100%;height:100%;border-radius:50%;display:block;background:var(--aida);touch-action:none;cursor:crosshair;box-shadow:inset 0 0 0 2px #0000001f}.hoop-count{font-weight:700;font-size:1.2rem}@media(max-width:760px){.hoop-section{grid-template-columns:1fr}.hoop-frame{width:min(100%,360px);margin:0 auto}}.reads,.devices,.steps,.price,.faq{max-width:1100px;margin:5rem auto 0;padding:0 clamp(16px,4vw,48px)}.reads-cols{display:grid;grid-template-columns:1.1fr 1fr;gap:2.5rem;align-items:start}.sheet{background:var(--white);border:2px dashed var(--ink);border-radius:var(--radius-m);padding:1.6rem 1.8rem;max-width:var(--measure)}.sheet p:last-child{margin:0}.reads-list{margin:0;padding:0;list-style:none}.reads-list li{position:relative;padding:0 0 .9em 2.2rem}.reads-list li:before{content:"";position:absolute;left:0;top:.25em;width:1.1rem;height:1.1rem;background:linear-gradient(45deg,transparent 42%,var(--pink) 42% 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--pink) 42% 58%,transparent 58%)}.reads-not{margin-top:1.5rem;max-width:var(--measure)}@media(max-width:820px){.reads-cols{grid-template-columns:1fr}}.swatches{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.sw{position:relative;display:flex;flex-direction:column;gap:.4rem;padding:1.3rem 1.2rem 1.2rem;min-height:200px;border-radius:4px 4px 10px 10px;background-image:radial-gradient(circle,rgba(0,0,0,.13) 0 1px,transparent 1.4px);background-size:7px 7px;-webkit-mask:linear-gradient(#000 0 0) top / 100% calc(100% - 8px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom / 14px 8px repeat-x;mask:linear-gradient(#000 0 0) top / 100% calc(100% - 8px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom / 14px 8px repeat-x}.sw strong{font-size:1.15rem}.sw span{flex:1}.sw a{font-weight:700;padding-bottom:8px}.sw-1{background-color:#cfe3f5}.sw-2{background-color:#fde6a9}.sw-3{background-color:#f6d0e3}.sw-4{background-color:#d4ecd2}.devices-note{margin-top:1.4rem}@media(max-width:900px){.swatches{grid-template-columns:repeat(2,1fr)}}@media(max-width:480px){.swatches{grid-template-columns:1fr}.sw{min-height:0}}.skeins{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.skeins li{position:relative;padding:1.2rem 0 0;border-top:10px solid var(--pink);border-radius:2px}.skeins li:nth-child(2){border-top-color:#3a7d44}.skeins li:nth-child(3){border-top-color:#2f5aa8}.band{position:absolute;top:-26px;left:0;min-width:56px;padding:6px 10px;background:var(--white);border:2px solid var(--ink);border-radius:3px;font-weight:800;font-size:1.15rem;text-align:center;font-variant-numeric:tabular-nums}@media(max-width:820px){.skeins{grid-template-columns:1fr;gap:44px}}.tags{display:flex;gap:32px;flex-wrap:wrap;align-items:flex-start}.tag{position:relative;width:min(100%,330px);padding:2.6rem 1.8rem 1.8rem;background:var(--white);border:2px solid var(--ink);border-radius:10px;clip-path:polygon(22% 0,78% 0,100% 12%,100% 100%,0 100%,0 12%)}.tag-main{background:var(--yellow);transform:rotate(1.5deg)}.tag-hole{position:absolute;top:12px;left:50%;width:16px;height:16px;margin-left:-8px;border-radius:50%;border:2px solid var(--ink);background:var(--aida)}.tag-price{font-size:2.6rem;font-weight:800;margin:0 0 .4rem;letter-spacing:-.02em}.faq details,.guide details{max-width:76ch;border-bottom:2px dashed var(--weave);padding:.9rem 0}.faq summary,.guide summary{cursor:pointer;font-weight:700;font-size:1.1rem}.faq details p,.guide details p{margin:.6rem 0 0}.guide{max-width:1100px;margin:0 auto;padding:2rem clamp(16px,4vw,48px) 0;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:3rem}.guide-head,.guide-body{grid-column:1}.guide-head h1{font-size:clamp(2rem,1.4rem + 2.4vw,3.1rem);font-weight:800;margin:0 0 .6rem;max-width:22ch}.answer{font-size:1.2rem;max-width:var(--measure);background:var(--white);border-left:8px solid var(--pink);padding:1rem 1.2rem;border-radius:0 var(--radius-s) var(--radius-s) 0}.checked{color:var(--ink-2);font-size:.9rem}.guide-body{max-width:var(--measure)}.guide-body h2{font-size:1.55rem;margin-top:2.2rem}.guide-body li{margin-bottom:.45em}.guide-cta{grid-column:2;grid-row:1 / span 2;align-self:start;position:sticky;top:20px;background:var(--white);border:2px dashed var(--ink);border-radius:var(--radius-m);padding:1.3rem;display:flex;flex-direction:column;gap:10px}.guide-more{grid-column:1}.guide-more h2{font-size:1.3rem;margin-top:2rem}.table-wrap{overflow-x:auto;margin:1rem 0}.compare{border-collapse:collapse;min-width:560px;width:100%;background:var(--white)}.compare caption{text-align:left;font-weight:700;padding-bottom:.5rem}.compare th,.compare td{border:1px solid var(--weave);padding:.55rem .7rem;text-align:left;vertical-align:top}.compare thead th:nth-child(2),.compare td:nth-child(2){background:#fff1f8}.sources{font-size:.95rem}@media(max-width:900px){.guide{grid-template-columns:minmax(0,1fr);gap:1.5rem}.guide-cta{grid-column:1;grid-row:auto;position:static}}.plain{max-width:760px;margin:0 auto;padding:2.5rem clamp(16px,4vw,48px) 0}.plain h1{font-size:2.4rem;font-weight:800}body.app{min-height:100dvh}body.app .top{max-width:none;padding:10px 16px;border-bottom:2px solid var(--ink);background:var(--white)}.app-main{min-height:calc(100dvh - 60px)}.app-loading{padding:2rem;text-align:center}.library{max-width:980px;margin:0 auto;padding:1.5rem clamp(16px,4vw,40px) 3rem}.lib-head{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}.lib-head h1{margin:0;font-size:2rem;font-weight:800}.pro-chip{margin-left:auto;border:2px solid var(--ink);background:var(--yellow);color:var(--ink);border-radius:999px;padding:.4em 1em;min-height:44px;font:inherit;font-weight:700;cursor:pointer}.pro-chip.on{background:var(--white)}.notice{background:var(--white);border-left:6px solid var(--pink);padding:.8rem 1rem;border-radius:0 var(--radius-s) var(--radius-s) 0}.drop{display:grid;grid-template-columns:170px 1fr;gap:1.8rem;align-items:center;background:var(--white);border:2px dashed var(--ink);border-radius:var(--radius-m);padding:1.5rem}.drop.over{background:#fff1f8;border-color:var(--pink-deep)}.drop h2{font-size:1.6rem;margin-bottom:.3rem}.hoop{width:150px;aspect-ratio:1;border-radius:50%;border:12px solid var(--wood);box-shadow:inset 0 0 0 3px var(--wood-dark),0 0 0 3px var(--wood-dark);background-color:var(--aida);background-image:linear-gradient(45deg,transparent 44%,var(--pink) 44% 56%,transparent 56%),linear-gradient(-45deg,transparent 44%,var(--pink) 44% 56%,transparent 56%),radial-gradient(circle,var(--weave) 0 1px,transparent 1.4px);background-size:34px 34px,34px 34px,8px 8px;background-position:center,center,0 0;background-repeat:no-repeat,no-repeat,repeat}.drop-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:.8rem}@media(max-width:600px){.drop{grid-template-columns:1fr;text-align:left}.hoop{width:96px;border-width:8px}}.busy{display:flex;align-items:center;gap:.7rem;font-weight:600;margin-top:1rem}.needle{width:28px;height:28px;border-radius:50%;border:4px solid var(--weave);border-top-color:var(--pink);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.needle{animation:none}}.failure{margin-top:1.2rem;background:var(--white);border:2px solid var(--danger);border-radius:var(--radius-m);padding:1.2rem 1.4rem}.failure h2{font-size:1.3rem;color:var(--danger)}.chart-list{list-style:none;padding:0;margin:1.5rem 0 0;display:grid;gap:12px}.chart-card{display:flex;align-items:center;gap:.8rem;background:var(--white);border:2px solid var(--ink);border-radius:var(--radius-m);padding:10px 16px 10px 10px}.chart-open{flex:1;display:flex;gap:1rem;align-items:center;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer;padding:4px;border-radius:10px}.chart-open img,.thumb-blank{width:96px;height:96px;object-fit:contain;image-rendering:pixelated;background:var(--aida);border-radius:8px;border:1px solid var(--weave);flex:none}.chart-meta{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.chart-title{font-weight:800;font-size:1.15rem}.chart-size,.chart-pct{color:var(--ink-2);font-size:.95rem}.floss-progress{position:relative;height:12px;border-radius:99px;background:var(--mist);overflow:hidden;min-width:120px}.floss-progress span{position:absolute;inset:0 auto 0 0;border-radius:99px;background:repeating-linear-gradient(-60deg,var(--pink) 0 5px,#ff6fb0 5px 8px)}.floss-progress.small{height:8px;max-width:260px}.empty{margin-top:1.5rem;color:var(--ink-2)}.lib-extra{margin-top:3rem;max-width:var(--measure)}.lib-extra h2{font-size:1.35rem}.dialog{border:2px solid var(--ink);border-radius:var(--radius-m);padding:1.4rem 1.6rem;max-width:min(520px,calc(100vw - 32px));color:var(--ink);background:var(--white)}.dialog::backdrop{background:#23233f73}.dialog-head{display:flex;align-items:start;gap:1rem}.dialog-head h2{font-size:1.4rem;flex:1}.key-entry{margin-top:1rem}.key-entry summary{cursor:pointer;font-weight:700}.key-entry label{display:flex;flex-direction:column;gap:4px;margin:.8rem 0 .4rem;font-weight:600}.key-entry input{font:inherit;padding:.55em .7em;border:2px solid var(--ink);border-radius:var(--radius-s);min-height:44px}.viewer{-webkit-user-select:none;user-select:none;display:flex;flex-direction:column;height:calc(100dvh - 60px)}.viewer-bar{display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--white);border-bottom:1px solid var(--weave)}.viewer-title{min-width:0;flex:1}.viewer-title h1{margin:0;font-size:1.15rem;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.viewer-sub{margin:0;font-size:.9rem;color:var(--ink-2)}.viewer-bar .floss-progress{width:min(30vw,260px)}.import-notes{background:#fffbe0;padding:.4rem 1rem;border-bottom:1px solid var(--weave);font-size:.95rem}.import-notes summary{cursor:pointer;font-weight:700}.save-error{margin:0;background:#ffe6eb;padding:.5rem 1rem;color:var(--danger);font-weight:600}.stage{position:relative;flex:1;min-height:200px}.chart-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;display:block;cursor:crosshair}.chart-canvas:focus-visible{box-shadow:inset 0 0 0 3px var(--ink);border-radius:0}.zoom-tools{position:absolute;right:12px;top:28px;display:flex;flex-direction:column;gap:8px}.tool{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:2px solid var(--ink);border-radius:12px;background:var(--white);color:var(--ink);font:inherit;font-weight:700;font-size:1.2rem;cursor:pointer;padding:0 10px}.tool:disabled{opacity:.4;cursor:not-allowed}.tool svg,.seg svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.tool.back{border-color:transparent}.drawer{background:var(--white);border-top:2px solid var(--ink);max-height:46dvh;display:flex;flex-direction:column}.toolbar{display:flex;align-items:center;gap:8px;padding:8px 12px;flex-wrap:wrap}.seg{display:inline-flex;border:2px solid var(--ink);border-radius:12px;overflow:hidden}.seg button{min-height:40px;display:inline-flex;align-items:center;gap:6px;border:0;background:var(--white);color:var(--ink);font:inherit;font-weight:700;padding:0 12px;cursor:pointer}.seg button+button{border-left:2px solid var(--ink)}.seg button[aria-pressed=true]{background:var(--ink);color:var(--white)}.markers{display:inline-flex;gap:6px}.marker{width:40px;height:40px;border-radius:50%;border:2px solid var(--ink);cursor:pointer}.marker[aria-pressed=true]{box-shadow:0 0 0 3px var(--white),0 0 0 5px var(--ink)}.marker-pink{background:#ff7ab6}.marker-yellow{background:#f7e94a}.marker-green{background:#7fe3a5}.drawer-toggle{margin-left:auto;font-size:1rem}.threads{overflow-y:auto;padding:0 12px 12px}.thread-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}.thread{width:100%;display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:auto auto;gap:2px 10px;align-items:center;border:2px solid var(--weave);border-radius:12px;background:var(--white);color:var(--ink);font:inherit;text-align:left;padding:8px 10px;cursor:pointer}.thread[aria-pressed=true]{border-color:var(--ink);background:#fff1f8}.thread .swatch{grid-row:1 / span 2}.thread-name{font-weight:700;font-size:.95rem;line-height:1.2}.thread-left{font-size:.85rem;color:var(--ink-2);white-space:nowrap}.thread-bar{grid-column:2 / span 2;height:5px;background:var(--mist);border-radius:9px;overflow:hidden;position:relative}.thread-bar span{position:absolute;inset:0 auto 0 0;border-radius:9px}.swatch{position:relative;display:inline-block;border-radius:6px;overflow:hidden;border:1px solid rgba(35,35,63,.35);background:var(--white);flex:none}.swatch-colour{position:absolute;inset:0 50% 0 0}.swatch img{position:absolute;inset:0 0 0 50%;width:50%;height:100%;object-fit:cover}.swatch-sym{position:absolute;inset:0 0 0 50%;display:grid;place-items:center;font-weight:800;font-size:.75rem}@media(min-width:1100px){.viewer{display:grid;grid-template-columns:1fr 340px;grid-template-rows:auto auto auto minmax(0,1fr);grid-template-areas:"bar bar" "notes notes" "err err" "stage drawer"}.viewer-bar{grid-area:bar}.import-notes{grid-area:notes}.save-error{grid-area:err}.stage{grid-area:stage}.drawer{grid-area:drawer;max-height:none;border-top:0;border-left:2px solid var(--ink);min-height:0}.thread-list{grid-template-columns:1fr}.drawer-toggle{display:none}}