@property --g1{syntax:"<color>";inherits:true;initial-value:#ff3d00}@property --g2{syntax:"<color>";inherits:true;initial-value:#ff8a00}@property --g3{syntax:"<color>";inherits:true;initial-value:#ffd60a}@property --paper{syntax:"<color>";inherits:true;initial-value:#0b0b0c}:root{--surface:#0a0a0b;--chrome:#15151a;--chrome-2:#101013;--ink:#f4f1ea;--muted:#97948b;--line:#f4f1ea1a;--line-2:#f4f1ea38;--accent:#d9ff3d;--bar-h:58px;--mono:"JetBrains Mono", ui-monospace, monospace;--sans:"Instrument Sans", ui-sans-serif, system-ui, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%}body{background:var(--surface);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0}body:after{content:"";z-index:200;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.bar{z-index:30;height:var(--bar-h);background:var(--chrome);border-bottom:1px solid #ffffff12;align-items:center;gap:20px;padding:0 18px;transition:box-shadow .2s;display:flex;position:sticky;top:0;box-shadow:inset 0 1px #ffffff0b}body.is-scrolled .bar{box-shadow:inset 0 1px #ffffff0b,0 14px 34px -14px #000000e6}.brand{letter-spacing:-.035em;color:var(--ink);white-space:nowrap;font-size:15px;font-weight:600;text-decoration:none}.brand em{letter-spacing:-.02em;color:var(--muted);font-family:Instrument Serif,Georgia,serif;font-style:italic;font-weight:400}.field{align-items:center;gap:10px;min-width:0;display:flex}.field label{font:500 9px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}.field input{field-sizing:content;min-width:6ch;max-width:34vw;color:var(--ink);font:500 21px/1.1 var(--sans);letter-spacing:-.02em;background:0 0;border:0;border-bottom:1px solid #0000;padding:6px 0;transition:border-color .18s}.field input:focus{border-bottom-color:var(--accent);outline:0}.letter-out{background:var(--ink);width:30px;height:30px;color:var(--surface);font:700 15px/1 var(--sans);letter-spacing:-.04em;-webkit-user-select:none;user-select:none;border-radius:9px;place-items:center;display:grid}.seg{border:1px solid var(--line);border-radius:10px;gap:2px;padding:3px;display:flex}.seg button{color:var(--muted);font:500 11px/1 var(--sans);letter-spacing:.01em;cursor:pointer;background:0 0;border:0;border-radius:7px;padding:6px 12px;transition:color .15s,background .15s}.seg button:hover{color:var(--ink)}.seg button.is-on{background:var(--ink);color:var(--surface)}.roll{background:var(--accent);color:#0b0b0c;font:600 13px/1 var(--sans);letter-spacing:-.01em;cursor:pointer;border:0;border-radius:10px;align-items:center;gap:10px;margin-left:0;padding:9px 16px;transition:transform .12s,filter .18s;display:flex}.roll:hover{filter:brightness(1.08)}.roll:active{transform:scale(.97)}.roll kbd{font:500 9px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;background:#0b0b0c24;border-radius:5px;padding:4px 5px}.controls{top:var(--bar-h);z-index:25;background:var(--chrome-2);border-bottom:1px solid #000;flex-wrap:wrap;align-items:center;gap:6px;padding:7px 14px;display:flex;position:sticky;box-shadow:inset 0 1px #ffffff08}.controls::-webkit-scrollbar{display:none}.controls .row{flex-wrap:wrap;align-items:center;gap:6px;width:100%;display:flex}.controls .row+.row{margin-top:1px}.group{background:#ffffff07;border:1px solid #ffffff0d;border-radius:10px;flex:none;align-items:center;gap:3px;padding:3px 7px 3px 8px;transition:border-color .15s,background .15s;display:flex}.group:hover{border-color:#ffffff17}.group .lab{font:500 9px/1 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:#7d7a72;border-right:1px solid #ffffff12;margin-right:5px;padding-right:7px}.chips{gap:4px;display:flex}.chip{cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;place-items:center;min-width:27px;height:27px;padding:0;transition:border-color .14s,background .14s,opacity .14s;display:grid}.chip:hover{border-color:var(--line-2)}.chip.is-on{border-color:var(--ink);background:color-mix(in srgb, var(--ink) 8%, transparent)}.chip.toggle{width:auto;font:500 10px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:0 8px}.chip.toggle.is-on{color:var(--ink)}.dice{color:var(--muted);font-size:13px;font-style:normal;line-height:1}.chip.is-on .dice{color:var(--ink)}.shp{width:20px;height:20px;color:var(--muted);transition:color .14s;position:relative}.shp:before{content:"";background:currentColor;position:absolute;inset:7%}.chip:hover .shp,.chip.is-on .shp{color:var(--ink)}.shp[data-shape=circle]:before{border-radius:50%}.shp[data-shape=squircle]:before{corner-shape:squircle;border-radius:34%}.shp[data-shape=rounded]:before{border-radius:17%}.shp[data-shape=square]:before{border-radius:4%}.shp[data-shape=arch]:before{border-radius:50% 50% 9% 9%/46% 46% 6% 6%}.shp[data-shape=hex]:before{clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);border-radius:0}.shp[data-shape=none]:before{background:0 0;border:1.5px solid;border-radius:3px;inset:4%}.zoom{gap:6px}.zoom input[type=range]{width:104px;height:26px;accent-color:var(--ink);cursor:ew-resize;touch-action:none;background:0 0;margin:0}.zoom output{min-width:3ch;font:500 10px/1 var(--mono);letter-spacing:.04em;color:var(--muted);text-align:right}.zoom-step{border:1px solid var(--line);width:22px;height:22px;color:var(--muted);font:500 13px/1 var(--mono);cursor:pointer;background:0 0;border-radius:7px;place-items:center;transition:color .14s,border-color .14s;display:grid}.zoom-step:hover{color:var(--ink);border-color:var(--line-2)}.size-chip{height:26px;font:500 10px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;align-items:center;gap:3px;padding:0 7px;display:flex}.size-chip:hover{border-color:var(--line-2)}.size-chip.is-on{color:var(--ink);border-color:var(--ink)}.fillbar{border-radius:4px;width:13px;height:13px}.fillbar.grad{background:linear-gradient(135deg,#ff3d00,#ffd60a)}.fillbar.solid{background:#ff3d00}.knock{background:var(--muted);width:13px;height:13px;box-shadow:inset 0 0 0 2px var(--surface);border-radius:50%;transition:background .14s}.chip.is-on .knock{background:var(--ink)}.knock.solid{box-shadow:none}.pal-dot{background:linear-gradient(135deg, var(--g1), var(--g2) 55%, var(--g3));border-radius:50%;width:14px;height:14px}.paper-dot{background:var(--swatch);width:14px;height:14px;box-shadow:inset 0 0 0 1px var(--line-2);border-radius:50%}.wall{--paper:#0b0b0c;--paper-ink:#f4f1ea;--tile-min:152px;--ratio:1;grid-template-columns:repeat(auto-fill, minmax(var(--tile-min), 1fr));min-height:calc(100vh - var(--bar-h) - 45px);background:color-mix(in oklab, var(--paper) 76%, var(--paper-ink));opacity:0;gap:1px;padding-bottom:84px;transition:--paper .55s,background-color .55s;display:grid}.wall.is-ready{opacity:1;transition:--paper .55s,background-color .55s,opacity .5s}.tile{aspect-ratio:var(--ratio,1);background:var(--paper);transition:--g1 .6s,--g2 .6s,--g3 .6s,--paper .55s,background .55s;transition-delay:calc(var(--i,0) * 4ms);outline:0;flex-direction:column;display:flex;position:relative;container-type:inline-size}.tile.is-hidden{display:none}.tile.is-out{animation:.26s forwards out}@keyframes out{to{opacity:0;filter:blur(2px);transform:scale(.9)}}.mark{flex:auto;place-items:center;width:100%;display:grid;position:relative;container-type:size}.mark:before{content:"";background-image:linear-gradient(var(--ang,145deg), var(--g1), var(--g2) 58%, var(--g3));border-radius:var(--r,50%);clip-path:var(--clip,none);transition:border-radius .32s,clip-path .32s;position:absolute;inset:11%}.glyph{z-index:2;font-family:var(--font,var(--sans));font-weight:var(--fw,400);font-size:var(--fs,62cqw);letter-spacing:-.01em;color:var(--tile-ink,#fff);text-align:center;text-box:trim-both cap alphabetic;width:max-content;max-width:none;line-height:1;position:relative}@supports not (text-box:trim-both cap alphabetic){.glyph{line-height:.88;transform:translateY(-1.5%)}}:root[data-knock=on] .glyph{color:var(--paper)}:root[data-shape=none] .mark:before{display:none}:root[data-shape=none] .glyph,:root[data-shape=none][data-knock=on] .glyph{color:#0000;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(var(--ang,145deg), var(--g1), var(--g2) 58%, var(--g3))}:root[data-shape=none] .glyph{--fs:72cqw}:root[data-fill=solid] .mark:before,:root[data-fill=solid][data-shape=none] .glyph{background-image:none;background-color:var(--g1)}:root[data-shape=circle] .mark:before{--r:50%}:root[data-shape=squircle] .mark:before{--r:34%;corner-shape:squircle}:root[data-shape=rounded] .mark:before{--r:17%}:root[data-shape=square] .mark:before{--r:4%}:root[data-shape=arch] .mark:before{--r:50% 50% 9% 9% / 46% 46% 6% 6%}:root[data-shape=hex] .mark:before{--r:0;--clip:polygon(50% 0, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%)}:root[data-mode=word] .mark:before{inset:6%}:root[data-mode=word] .glyph{--fs-word:min(24cqw, calc(160cqw / var(--wlen,6)));font-size:calc(var(--fs-word) * var(--fit,1));letter-spacing:-.02em;white-space:nowrap;text-box:normal;line-height:.95}:root[data-mode=both] .tile{flex-direction:row;justify-content:center;align-items:center;gap:5%}:root[data-mode=both] .mark{aspect-ratio:1;flex:0 0 40%;width:auto}:root[data-mode=both] .word{text-align:left;flex:0 auto;min-width:0;padding:0}.word{font-family:var(--font,var(--sans));font-weight:var(--fw,400);font-size:calc(min(9cqw, calc(130cqw / var(--wlen,6))) * var(--fit,1));letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;text-align:center;width:max-content;color:var(--paper-ink,#fff);align-self:center;padding:0 5% 12%;line-height:1;display:none}:root[data-mode=both] .word{display:block}.name{z-index:3;max-width:80%;font:500 9px/1.2 var(--mono);letter-spacing:.02em;color:#fff;mix-blend-mode:difference;opacity:0;pointer-events:none;transition:opacity .16s;position:absolute;top:7px;left:9px}.tile:hover .name,.tile:focus-within .name{opacity:.85}.tools{z-index:4;opacity:0;gap:4px;transition:opacity .16s,transform .16s;display:flex;position:absolute;bottom:7px;right:7px;transform:translateY(3px)}.tile:hover .tools,.tile:focus-within .tools{opacity:1;transform:none}.tools button{background:color-mix(in srgb, var(--paper) 68%, transparent);width:23px;height:23px;color:var(--paper-ink);font:500 12px/1 var(--mono);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:0;border-radius:6px;place-items:center;transition:background .14s,color .14s;display:grid}.tools button:hover{background:var(--paper-ink);color:var(--paper)}.tools .fav:hover{background:var(--accent);color:#0b0b0c}.tools .kill:hover{color:#fff;background:#ff3b30}.tile.is-fav .tools .fav{background:var(--accent);color:#0b0b0c}.stats{font:500 10px/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted);white-space:nowrap;background:#ffffff07;border:1px solid #ffffff0d;border-radius:10px;align-items:center;gap:2px;margin-left:auto;padding:3px 4px 3px 10px;display:flex}.count{color:var(--ink);padding-right:8px}.hud-btn{color:var(--muted);font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:pointer;background:0 0;border:0;border-radius:8px;padding:6px 8px;transition:background .14s,color .14s}.hud-btn:hover{background:color-mix(in srgb, var(--ink) 10%, transparent);color:var(--ink)}.hud-btn span{color:var(--ink)}.hint{font:500 10px/1 var(--mono);letter-spacing:.04em;color:#6f6c65;white-space:nowrap;margin-left:auto;transition:opacity .4s}.hint kbd{border:1px solid var(--line-2);font:inherit;color:var(--ink);border-radius:4px;padding:2px 4px}.hint.is-gone{opacity:0;pointer-events:none}.scrim{z-index:50;opacity:0;pointer-events:none;background:#0000008c;transition:opacity .22s;position:fixed;inset:0}.scrim.is-on{opacity:1;pointer-events:auto}.drawer{z-index:60;background:var(--surface);border-left:1px solid var(--line);flex-direction:column;width:min(400px,92vw);transition:transform .28s cubic-bezier(.2,.8,.2,1);display:flex;position:fixed;top:0;bottom:0;right:0;transform:translate(101%)}.drawer.is-open{transform:none}.drawer>header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:16px 18px;display:flex}.drawer h2{font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0}.drawer .x{color:var(--muted);font:500 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;background:0 0;border:0}.drawer .x:hover{color:var(--ink)}.drawer-body{flex-direction:column;gap:1px;padding:8px;display:flex;overflow-y:auto}.item{color:var(--ink);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:9px;align-items:center;gap:10px;padding:9px 10px;transition:background .14s;display:flex}.item:hover{background:color-mix(in srgb, var(--ink) 8%, transparent)}.item .preview{background:var(--g1,#222);width:34px;height:34px;color:var(--paper,#0b0b0c);border-radius:9px;flex:none;place-items:center;font-size:19px;line-height:1;display:grid;overflow:hidden}.item .fname{min-width:0;font:500 12px/1.3 var(--sans);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.item .act{font:500 9px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.filter-grid{flex-wrap:wrap;gap:6px;padding:4px 8px 12px;display:flex}.filter-chip{border:1px solid var(--line-2);width:auto;height:30px;font:500 11px/1 var(--sans);letter-spacing:0;text-transform:none;color:var(--ink);justify-content:center;align-items:center;gap:7px;padding:0 11px;display:inline-flex}.filter-chip small{font:500 9px/1 var(--mono);color:var(--muted)}.filter-chip.is-on small{color:color-mix(in srgb, var(--ink) 60%, transparent)}.empty{text-align:center;font:400 12px/1.5 var(--sans);color:var(--muted);padding:26px 12px}@media (width<=880px){.bar{gap:12px;padding:0 12px}.brand em{display:none}.field input{max-width:26vw;font-size:17px}.roll kbd,.hint{display:none}.wall{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}}.kit{z-index:70;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;pointer-events:none;background:#000000bd;place-items:center;padding:24px;transition:opacity .22s;display:grid;position:fixed;inset:0}.kit.is-open{opacity:1;pointer-events:auto}.kit-panel{background:var(--chrome);border:1px solid #ffffff17;border-radius:18px;flex-direction:column;gap:0;width:min(1080px,100%);max-height:100%;transition:transform .24s cubic-bezier(.2,.9,.2,1);display:flex;overflow:auto;transform:translateY(8px)scale(.99);box-shadow:0 40px 120px -30px #000}.kit.is-open .kit-panel{transform:none}.kit-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:flex-start;gap:20px;padding:20px 22px 14px;display:flex}.kit-eyebrow{font:500 9px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:7px;display:block}.kit-head h2{font:500 26px/1 var(--sans);letter-spacing:-.03em;margin:0}.kit-head p{font:500 11px/1 var(--mono);letter-spacing:.04em;color:var(--muted);margin:6px 0 0}.kit-close{color:var(--muted);font:500 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:0 0;border:0}.kit-close:hover{color:var(--ink)}.kit-body{background:var(--line);grid-template-columns:minmax(0,1fr) 300px;gap:1px;display:grid}.kit-hero{background:var(--paper,#0b0b0c);flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:30px;display:flex}.kit-slot-lg{place-items:center;display:grid}.kit-side{background:var(--chrome);flex-direction:column;gap:10px;padding:16px;display:flex}.kit-scale{border:1px solid var(--line);border-radius:12px;flex-direction:column;gap:9px;padding:12px 14px;display:flex}.kit-scale.light{background:#f2ede3;border-color:#ddd6c8}.kit-scale.dark{background:#0b0b0c}.kit-scale.lock{background:var(--paper,#0b0b0c);border-color:#ffffff14}.kit-slots{align-items:center;gap:16px;display:flex}.kit-cap{font:500 9px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#8a877f}.kit-scale.light .kit-cap{color:#8b8478}.kit-scale.dark .kit-cap{color:#6f6c65}.kit-lockup{align-items:center;gap:12px;display:flex}.kit-foot{border-top:1px solid var(--line);align-items:center;gap:8px;padding:14px 18px;display:flex}.kit-note{font:500 10px/1 var(--mono);letter-spacing:.04em;color:#6f6c65;margin-right:auto}.kit-btn{border:1px solid var(--line-2);color:var(--ink);font:500 11px/1 var(--sans);cursor:pointer;background:0 0;border-radius:9px;padding:9px 14px;transition:background .14s,border-color .14s}.kit-btn:hover{border-color:var(--ink)}.kit-btn.primary{background:var(--accent);border-color:var(--accent);color:#0b0b0c;font-weight:600}.kit-mark{flex:none}@media (width<=900px){.kit-body{grid-template-columns:1fr}.kit-side{flex-flow:wrap}}@keyframes kit-in{0%{opacity:0}to{opacity:1}}.kit.is-open{animation:.18s both kit-in}