:root{--bg:#f6f5f2;--surface:#fff;--surface-2:#f0efeb;--text:#1b1c1f;--muted:#6b6d74;--line:#0000001a;--accent:#c8324a;--accent-ink:#fff;--blue:#2a6de8;--ok:#1e9d5a;--warn:#b45309;--glass:#ffffffd1;--shadow:0 6px 24px #00000024;--r:14px;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#121315;--surface:#1c1d21;--surface-2:#26282d;--text:#ececee;--muted:#9a9ca3;--line:#ffffff1f;--glass:#1e1f23d1;--shadow:0 6px 24px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#121315;--surface:#1c1d21;--surface-2:#26282d;--text:#ececee;--muted:#9a9ca3;--line:#ffffff1f;--glass:#1e1f23d1;--shadow:0 6px 24px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);height:100%;color:var(--text);overscroll-behavior:none;margin:0}body{-webkit-text-size-adjust:100%;font:16px/1.4 -apple-system,BlinkMacSystemFont,SF Pro Text,system-ui,Segoe UI,Roboto,sans-serif}#app{height:100%}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}a{color:var(--blue)}h1{margin:0;font-size:19px;font-weight:700}h2{margin:0;font-size:17px}h3{font-size:15px}small,.small{font-size:13px}.muted{color:var(--muted)}.ellip{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.grow{flex:1;min-width:0}.row{align-items:center;display:flex}.gap{gap:10px}.gap-s{gap:6px}.wrap{flex-wrap:wrap}.left{text-align:left}.pad{padding:16px}.warn{background:color-mix(in srgb, var(--warn) 14%, transparent);border-radius:10px;margin:0;padding:10px 12px;font-size:14px}.screen{flex-direction:column;height:100%;display:flex;overflow:hidden}.screen.center{justify-content:center;align-items:center}.bar{padding:calc(var(--safe-t) + 8px) calc(var(--safe-r) + 12px) 8px calc(var(--safe-l) + 12px);background:var(--bg);border-bottom:1px solid var(--line);flex:none;align-items:center;gap:8px;min-height:52px;display:flex}.brand{letter-spacing:-.02em;font-weight:800}.mode-chip{text-transform:capitalize;background:var(--surface-2);color:var(--muted);border-radius:99px;padding:2px 8px;font-size:12px}.content{padding:12px calc(var(--safe-r) + 16px) calc(var(--safe-b) + 96px) calc(var(--safe-l) + 16px);-webkit-overflow-scrolling:touch;flex:1;overflow-y:auto}.content.narrow{width:100%;max-width:720px;margin:0 auto}.section{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:22px 0 8px;font-size:13px;font-weight:700}.icon-btn{border-radius:12px;flex:none;place-items:center;width:44px;height:44px;display:inline-grid}.icon-btn:active{background:var(--surface-2)}.btn{background:var(--surface-2);border-radius:12px;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:0 16px;font-weight:600;display:inline-flex}.btn.primary{background:var(--accent);color:var(--accent-ink)}.btn.ghost{border:1px solid var(--line);background:0 0}.btn.small{min-height:36px;padding:0 12px;font-size:14px}.btn.block{width:100%;margin-top:10px}.btn:disabled{opacity:.45}.btn:active:not(:disabled){filter:brightness(.94)}.chip{background:var(--surface-2);border-radius:99px;align-items:center;gap:6px;min-height:34px;padding:6px 12px;font-size:14px;display:inline-flex}.chip.on{background:var(--text);color:var(--bg)}.input{border:1px solid var(--line);background:var(--surface);width:100%;min-height:44px;color:var(--text);font:inherit;border-radius:12px;padding:10px 12px;font-size:16px}.lbl{font-size:14px;font-weight:600;display:block}.field{gap:6px;display:grid}.form{grid-auto-rows:max-content;align-content:start;gap:14px;display:grid}.form>*{min-width:0}.swatch{border-radius:6px;flex:none;place-items:center;font-weight:700;line-height:1;display:inline-grid;box-shadow:inset 0 0 0 1px #0000002e}.seg{background:var(--surface-2);border-radius:12px;flex:none;gap:2px;min-height:44px;padding:3px;display:flex;overflow-x:auto}.seg button{white-space:nowrap;min-height:38px;color:var(--muted);border-radius:9px;flex:1;padding:0 10px;font-size:14px;font-weight:600}.seg button.on{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #00000026}.seg.small button{min-height:32px;font-size:13px}.toggle-row{justify-content:space-between;align-items:center;gap:12px;min-height:44px;display:flex}.toggle-row small{display:block}.toggle-row input{appearance:none;background:var(--surface-2);width:50px;height:30px;box-shadow:inset 0 0 0 1px var(--line);border-radius:99px;flex:none;transition:background .15s;position:relative}.toggle-row input:after{content:"";background:#fff;border-radius:50%;width:24px;height:24px;transition:transform .15s;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #0000004d}.toggle-row input:checked{background:var(--ok)}.toggle-row input:checked:after{transform:translate(20px)}.stepper{gap:6px;display:grid}.stepper-ctl{background:var(--surface-2);border-radius:12px;align-items:center;width:max-content;height:44px;display:inline-flex}.stepper-ctl button{place-items:center;width:44px;height:44px;display:grid}.stepper-ctl input{text-align:center;width:64px;color:var(--text);font:inherit;-moz-appearance:textfield;background:0 0;border:0;font-size:16px;font-weight:700}.stepper-ctl input::-webkit-inner-spin-button{display:none}.suffix{color:var(--muted);margin-right:4px;font-size:13px}.filters{flex:none;gap:8px;padding:10px 16px;display:flex;overflow-x:auto}.cards{padding:4px calc(var(--safe-r) + 16px) calc(var(--safe-b) + 100px) calc(var(--safe-l) + 16px);grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;display:grid;overflow-y:auto}.card{background:var(--surface);border-radius:var(--r);text-align:left;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 1px 2px #0000000f}.thumb{aspect-ratio:1;background:var(--surface-2);place-items:center;padding:10px;display:grid}.thumb img{max-width:100%;max-height:100%;image-rendering:pixelated;border-radius:4px}.card-body{gap:4px;padding:10px 12px 12px;display:grid}.bar-track{background:var(--surface-2);border-radius:3px;height:5px;margin-top:4px;overflow:hidden}.bar-fill{background:var(--ok);height:100%}.fab{right:calc(var(--safe-r) + 20px);bottom:calc(var(--safe-b) + 24px);background:var(--accent);color:#fff;width:60px;height:60px;box-shadow:var(--shadow);border-radius:50%;place-items:center;display:grid;position:fixed}.empty{gap:12px;max-width:560px;margin:0 auto;padding:24px 16px;display:grid}.demo-list{gap:8px;display:grid}.demo{text-align:left;background:var(--surface);border-radius:12px;gap:2px;padding:12px 14px;display:grid}.row-btn{text-align:left;border-bottom:1px solid var(--line);width:100%;color:inherit;align-items:center;gap:12px;min-height:56px;padding:12px 6px;text-decoration:none;display:flex}.row-ic{background:var(--surface-2);border-radius:10px;flex:none;place-items:center;width:40px;height:40px;display:grid}.row-tx{flex:1;gap:2px;min-width:0;display:grid}.screen.chart{background:#000;flex-direction:row}.chart-host{flex:1;height:100%;position:relative;overflow:hidden}.chart-canvas{display:block;position:absolute;inset:0}.glass{background:var(--glass);-webkit-backdrop-filter:blur(16px)saturate(1.4);backdrop-filter:blur(16px)saturate(1.4);box-shadow:var(--shadow)}.topbar{top:calc(var(--safe-t) + 6px);left:calc(var(--safe-l) + 8px);right:calc(var(--safe-r) + 8px);align-items:center;gap:8px;transition:opacity .2s,transform .2s;display:flex;position:absolute}.topbar .icon-btn{border-radius:50%}.pill{border-radius:22px;align-items:center;gap:8px;min-width:0;height:44px;padding:0 14px;font-size:15px;display:inline-flex}.pill .name{max-width:34vw;font-weight:600}.pill .pct{color:var(--ok);font-weight:800}.pill.cur{margin-left:auto;font-weight:700}.pill.cur small{color:var(--muted);font-weight:600}.toolbar{left:50%;bottom:calc(var(--safe-b) + 10px);border-radius:22px;gap:2px;padding:6px;transition:opacity .2s,transform .2s;display:flex;position:absolute;transform:translate(-50%)}.toolbar button{width:64px;height:54px;color:var(--text);border-radius:16px;align-content:center;place-items:center;gap:2px;font-size:11px;font-weight:600;display:grid}.toolbar button.on{background:var(--ok);color:#fff}.toolbar button:active{background:var(--surface-2)}.hidden{opacity:0;pointer-events:none}.toolbar.hidden{transform:translate(-50%,20px)}.topbar.hidden{transform:translateY(-20px)}.undo-float{right:calc(var(--safe-r) + 10px);top:calc(var(--safe-t) + 60px);gap:8px;display:grid;position:absolute}.undo-float .icon-btn{border-radius:50%}.pal-swipe{right:calc(var(--safe-r) + 10px);bottom:calc(var(--safe-b) + 84px);gap:8px;display:flex;position:absolute}.pal-swipe .icon-btn{border-radius:50%}.minimap{left:calc(var(--safe-l) + 10px);bottom:calc(var(--safe-b) + 84px);width:120px;box-shadow:var(--shadow);background:#fff;border-radius:8px;position:absolute}.guide{left:calc(var(--safe-l) + 8px);right:calc(var(--safe-r) + 8px);bottom:calc(var(--safe-b) + 82px);border-radius:18px;align-items:center;gap:8px;max-width:560px;margin:0 auto;padding:10px 10px 10px 14px;display:flex;position:absolute}.guide-tx{flex:1;gap:2px;min-width:0;font-size:14px;display:grid}.guide-btns{align-items:center;gap:2px;display:flex}.focus-nav{left:50%;bottom:calc(var(--safe-b) + 84px);border-radius:22px;align-items:center;gap:4px;padding:2px 6px;font-size:14px;font-weight:600;display:flex;position:absolute;transform:translate(-50%)}.palette{gap:4px;display:grid}.pal-row{border-radius:12px}.pal-row.on{background:color-mix(in srgb, var(--blue) 12%, transparent)}.pal-row.complete{opacity:.5}.pal-main{text-align:left;align-items:center;gap:12px;width:100%;min-height:52px;padding:8px;display:flex}.pal-tx{flex:1;min-width:0;display:grid}.pal-n{text-align:right;display:grid}.pal-row .btn{margin:0 8px 8px 50px}.sheet-wrap{z-index:20;background:#00000047;justify-content:center;align-items:flex-end;animation:.15s fade;display:flex;position:fixed;inset:0}.sheet{background:var(--surface);width:100%;max-width:640px;max-height:78vh;box-shadow:var(--shadow);padding-bottom:var(--safe-b);border-radius:20px 20px 0 0;flex-direction:column;animation:.2s ease-out up;display:flex}.sheet.tall{height:86vh;max-height:86vh}.sheet-head{touch-action:none;flex:none;padding:6px 8px 0 16px}.grabber{background:var(--line);border-radius:3px;width:40px;height:5px;margin:2px auto 6px}.sheet-title-row{align-items:center;gap:8px;display:flex}.sheet-title-row h2{flex:1}.sheet-body{-webkit-overflow-scrolling:touch;flex:1;padding:4px 16px 20px;overflow-y:auto}@keyframes up{0%{opacity:.4;transform:translateY(40px)}}@keyframes fade{0%{opacity:0}}.menu{display:grid}.menu button{text-align:left;border-bottom:1px solid var(--line);align-items:center;gap:14px;min-height:52px;padding:0 4px;display:flex}.menu button.danger{color:#d33}.stats{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.stats div{background:var(--surface-2);text-align:center;border-radius:12px;gap:2px;padding:10px;display:grid}.stats b{font-size:17px}.stats small{color:var(--muted);font-size:12px}.picker{gap:10px;display:grid}.picker-list{gap:2px;display:grid}.picker-item{text-align:left;border-radius:10px;align-items:center;gap:10px;min-height:44px;padding:8px 4px;display:flex}.picker-item b{min-width:46px}.picker-item.hl{background:color-mix(in srgb, var(--ok) 14%, transparent)}.toast{left:50%;top:calc(var(--safe-t) + 60px);color:#fff;z-index:40;max-width:calc(100vw - 32px);box-shadow:var(--shadow);background:#222;border-radius:14px;align-items:center;gap:12px;padding:10px 16px;font-size:14px;animation:.2s fade;display:flex;position:fixed;transform:translate(-50%)}.toast button{color:#7cf;font-weight:700}.busy{z-index:30;color:#fff;text-align:center;background:#00000073;align-content:center;place-items:center;gap:12px;padding:24px;display:grid;position:fixed;inset:0}.spinner{border:3px solid #8080804d;border-top-color:var(--accent);border-radius:50%;width:34px;height:34px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.split{flex-direction:column;flex:1;min-height:0;display:flex}.split>.quad,.split>.preview{flex:1;min-height:0}.panel{padding:12px calc(var(--safe-r) + 16px) calc(var(--safe-b) + 16px) calc(var(--safe-l) + 16px);background:var(--surface);border-top:1px solid var(--line);flex:none;gap:10px;display:grid}.panel.scroll{max-height:52vh;overflow-y:auto}.preview{background:var(--surface-2);align-content:start;place-items:center;gap:8px;padding:8px;display:grid;overflow:auto}.preview canvas{border-radius:8px;max-width:100%}.quad{touch-action:none;background:#111;position:relative}.quad canvas{display:block}.loupe{width:120px;height:120px;box-shadow:var(--shadow);pointer-events:none;border:3px solid #fff;border-radius:50%;position:absolute}.quad-hint{color:#fff;text-align:center;pointer-events:none;background:#0000008c;border-radius:10px;padding:8px 12px;font-size:13px;position:absolute;bottom:12px;left:12px;right:12px}.fab-sw{border-radius:50%;width:36px;height:36px;box-shadow:inset 0 0 0 1px #00000040}.fab-sw.on{outline:3px solid var(--blue);outline-offset:2px}.page-row{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:10px 0;display:flex}.page-row img{object-fit:cover;border-radius:8px;width:64px;height:64px}.cluster-grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;margin:12px 0;display:grid}.cluster{background:var(--surface);border-radius:12px;justify-items:center;gap:4px;padding:8px;font-size:14px;display:grid}.crop{image-rendering:pixelated;box-shadow:inset 0 0 0 1px var(--line);background:#fff;border-radius:6px}.thread-table{display:grid}.thread-row{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:8px 0;display:flex}.thread-row.owned{opacity:.55}.skeins{text-align:right;min-width:28px;font-size:18px}.own{color:var(--muted);align-items:center;gap:4px;font-size:13px;display:flex}.facts{gap:4px;margin:0;padding-left:18px;display:grid}.modes{gap:8px;display:grid}.mode{text-align:left;background:var(--surface);border:2px solid #0000;border-radius:14px;gap:2px;padding:12px 14px;display:grid}.mode.on{border-color:var(--accent)}.mode small{color:var(--muted)}.stash{flex-wrap:wrap;gap:6px;display:flex}.nudge{gap:6px;display:grid}.nudge .icon-btn{background:var(--surface-2);font-size:18px}.dot{border:2px solid #e1202d;border-radius:2px;width:10px;height:10px;display:inline-block}.dot.half-only{border-color:#f0a000}.help p,.help li{line-height:1.55}.anim{background:#fbfaf6;border-radius:12px;margin:10px auto;display:block}.anim .draw{stroke-dasharray:80;stroke-dashoffset:80px;animation:6s infinite draw}@keyframes draw{0%{stroke-dashoffset:80px}15%,94%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:0;opacity:0}}.anim .pop{transform-origin:30px 30px;animation:2.5s infinite pop}@keyframes pop{0%{transform:scale(0)}30%,90%{transform:scale(1)}to{opacity:0;transform:scale(1)}}@media (min-width:760px){.split{flex-direction:row}.split>.panel{border-top:0;border-left:1px solid var(--line);align-content:start;width:380px;max-height:none;overflow-y:auto}.sheet-wrap{align-items:center}.sheet{border-radius:20px;max-height:80vh}.sheet.tall{height:80vh}.pill .name{max-width:300px}.cards{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.toolbar button{width:76px}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}.sel-bar{left:calc(var(--safe-l) + 8px);right:calc(var(--safe-r) + 8px);bottom:calc(var(--safe-b) + 82px);z-index:5;border-radius:18px;flex-wrap:wrap;align-items:center;gap:8px;max-width:520px;margin:0 auto;padding:8px 10px;display:flex;position:absolute}.sel-n{margin-right:auto;padding-left:4px;font-size:14px;font-weight:700}.chart-host,.chart-host *,.minimap,.quad,.quad *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.focus-nav .fn-pos{white-space:nowrap;padding:0 4px}.focus-nav{white-space:nowrap}