@font-face{font-family:NaN Gothic UI Mono;src:url(/fonts/NaNGothicUIMono-ExtraLight.woff2)format("woff2");font-weight:200 300;font-style:normal;font-display:swap}@font-face{font-family:NaN Gothic UI Mono;src:url(/fonts/NaNGothicUIMono-Regular.woff2)format("woff2");font-weight:400 500;font-style:normal;font-display:swap}@font-face{font-family:NaN Gothic UI Mono;src:url(/fonts/NaNGothicUIMono-Bold.woff2)format("woff2");font-weight:600 900;font-style:normal;font-display:swap}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#121210;--surface:#1c1b18;--text:#efe9e2;--quiet:#a49b92;--line:#2f2c28;--accent:#fdda24;--accent-text:#121210;--handle:#fdda24;--rest:#4a4640;--radius:.5rem;--track:0em;--track-wide:.08em;text-transform:lowercase;font-family:NaN Gothic UI Mono,ui-monospace,monospace;font-size:100%;font-weight:200}button,select{text-transform:inherit}input[type=text],textarea{text-transform:none;font-family:inherit}.button.primary{font-weight:400}.toggle label,.check{white-space:nowrap}:where(.button,.tab,label,legend,h1,h2,h3,figcaption,select){letter-spacing:var(--track);transition:letter-spacing .25s}:is(.button,.tab,label,legend,h1,h2,h3,figcaption,select):hover,:is(.button,.tab):focus-visible,.is-wide{letter-spacing:var(--track-wide)}@media (prefers-reduced-motion:reduce){:where(.button,.tab,label,legend,h1,h2,h3,figcaption,select){transition:none}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;line-height:1.4}.bar{border-bottom:1px solid var(--line);background:var(--surface);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 1rem;display:flex}h1{color:var(--accent);letter-spacing:.01em;margin:0;font-size:1.125rem;font-weight:700}.tagline{color:var(--quiet);margin:.1rem 0 0;font-size:.8125rem}h2{letter-spacing:.04em;color:var(--quiet);margin:0 0 .5rem;font-size:.8125rem;font-weight:400}.bar-actions,.row{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.button{font:inherit;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--text);cursor:pointer;justify-content:center;align-items:center;padding:.45rem .85rem;font-size:.9375rem;display:inline-flex}.button:hover{border-color:var(--accent)}.button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.button.small{padding:.35rem .65rem;font-size:.8125rem}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}main{grid-template-columns:18rem minmax(0,1fr);align-items:start;gap:1rem;padding:1rem;display:grid}main.empty .controls,main.empty .pane,main.empty .workspace,main:not(.empty) .intro{display:none}.intro{text-align:center;border:2px dashed var(--line);border-radius:1rem;grid-column:1/-1;padding:6rem 1rem;font-size:1.0625rem}.quiet,.hint{color:var(--quiet)}.hint{margin:0 0 .5rem;font-size:.8125rem}.controls{grid-template-columns:minmax(0,1fr);gap:.75rem;min-width:0;display:grid}fieldset{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);gap:.6rem;min-width:0;margin:0;padding:.75rem;display:grid}legend{padding:0 .25rem;font-size:.875rem;font-weight:400}.slider{gap:.2rem;font-size:.8125rem;display:grid}.slider>span:not(.hand-range){justify-content:space-between;display:flex}.slider output{color:var(--accent)}input[type=range]{width:100%;accent-color:var(--accent)}.hi{fill:currentColor;vertical-align:-.2em;flex:none;width:1.15em;height:1.15em}.button .hi,.tab .hi{margin-right:.35em}.hand-range{--p:0;--knob:.2rem;--knob-height:1.5rem;cursor:pointer;height:1.6rem;display:block;position:relative}.hr-line{left:calc(var(--knob) / 2);right:calc(var(--knob) / 2);height:.5rem;width:calc(100% - var(--knob));pointer-events:none;position:absolute;top:50%;overflow:visible;transform:translateY(-50%)}.hr-rest{fill:var(--rest);clip-path:inset(0 0 0 calc(var(--p) * 100%))}.hr-done{fill:var(--accent);clip-path:inset(0 calc((1 - var(--p)) * 100%) 0 0)}.hr-thumb{top:50%;left:calc(var(--p) * (100% - var(--knob)));width:var(--knob);height:var(--knob-height);fill:var(--accent);filter:drop-shadow(.08rem 0 0 var(--surface)) drop-shadow(-.08rem 0 0 var(--surface));transform:translateY(-50%) rotate(calc((var(--p) - .5) * 14deg));pointer-events:none;transition:scale .12s;position:absolute}.hand-range:hover .hr-thumb{scale:1.12}.hand-range:focus-within .hr-thumb{filter:drop-shadow(.08rem 0 0 var(--surface)) drop-shadow(-.08rem 0 0 var(--surface)) drop-shadow(0 0 .2rem var(--accent));scale:1.2}.hand-range input[type=range]{opacity:0;cursor:pointer;appearance:none;width:100%;height:100%;margin:0;position:absolute;inset:0}.hand-range input[type=range]::-webkit-slider-thumb{appearance:none;width:var(--knob);height:var(--knob-height)}.hand-range input[type=range]::-moz-range-thumb{width:var(--knob);height:var(--knob-height);border:0}.intro-mark{width:4rem;height:4rem;color:var(--accent);margin-bottom:.5rem}.drop span{justify-items:center;gap:.5rem;display:grid}.drop-mark{width:4rem;height:4rem;color:var(--accent)}.check,.swatch{align-items:center;gap:.35rem;font-size:.8125rem;display:inline-flex}.check input{accent-color:var(--accent)}input[type=color]{border:1px solid var(--line);background:0 0;border-radius:.25rem;width:2rem;height:1.5rem;padding:0}.stats{color:var(--quiet);min-height:1rem;margin:0;font-size:.75rem}.pane{min-width:0;position:sticky;top:1rem}.pane-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.5rem;display:flex}.toggle{flex-wrap:wrap;gap:.25rem .75rem;font-size:.8125rem;display:flex}.toggle input{accent-color:var(--accent)}.stage{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);place-items:center;display:grid;position:relative;overflow:hidden}[hidden]{display:none!important}.stage canvas{width:auto;max-width:100%;height:auto;max-height:75vh;display:block}#vector-view{width:100%}#vector-view svg{width:100%;height:auto;max-height:75vh;display:block}.stage{grid-template-columns:minmax(0,1fr)}.stage>*{grid-area:1/1}#photo-stage{touch-action:none}#handles{overflow:visible}#handles polygon{fill:color-mix(in srgb, var(--handle) 12%, transparent);stroke:var(--handle);vector-effect:non-scaling-stroke;stroke-width:2px}#handles circle{fill:var(--surface);stroke:var(--handle);stroke-width:3px;vector-effect:non-scaling-stroke;cursor:grab}#handles circle:focus-visible{fill:var(--handle);outline:none}.checker{background-color:#fff;background-image:conic-gradient(#ebe6df 25%, transparent 0 50%, #ebe6df 0 75%, transparent 0);background-size:1.25rem 1.25rem}.drop{border:3px dashed var(--accent);background:color-mix(in srgb, var(--bg) 85%, transparent);pointer-events:none;border-radius:1rem;place-items:center;font-size:1.5rem;display:grid;position:fixed;inset:.75rem}.drop[hidden]{display:none}@media (width<=48rem){main{grid-template-columns:1fr}.pane{position:static}.controls{order:3}}.tabs{flex-wrap:wrap;gap:.25rem;margin-left:1rem;margin-right:auto;display:flex}.tab{font:inherit;border-radius:var(--radius);color:var(--quiet);cursor:pointer;background:0 0;border:1px solid #0000;padding:.35rem .8rem;font-size:.9375rem}.tab[aria-pressed=true]{color:var(--text);border-color:var(--line);background:var(--bg)}.tab:disabled{opacity:.45;cursor:not-allowed}main.icon-app,main.texture-app,main.font-app{grid-template-columns:18rem minmax(0,1fr)}.field{gap:.2rem;font-size:.8125rem;display:grid}select{font:inherit}input[type=text],select{border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:.375rem;min-width:0;padding:.3rem .45rem;font-size:.875rem}.style-pick{flex:100%}.multi{flex-wrap:wrap;gap:.35rem .75rem;display:flex}.icon-preview{gap:1rem;min-width:0;display:grid}.icon-preview .pane{position:static}h3{opacity:.7;margin:0 0 .5rem;font-size:.75rem;font-weight:400}.sizes{gap:.5rem;display:grid}.size-row{border-radius:var(--radius);border:1px solid var(--line);flex-wrap:wrap;align-items:end;gap:1rem;padding:.75rem;display:flex}.size-row figure{justify-items:center;gap:.25rem;margin:0;display:grid}.size-row figcaption{opacity:.75;font-size:.6875rem}.pixelated{image-rendering:pixelated}.apple{border-radius:22%}.tab-mock{background:color-mix(in srgb, currentColor 10%, transparent);white-space:nowrap;text-overflow:ellipsis;border-radius:.5rem .5rem 0 0;align-self:center;align-items:center;gap:.4rem;max-width:12rem;padding:.4rem .75rem;font-size:.75rem;display:flex;overflow:hidden}.family{grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:.75rem;display:grid}.family-panel{border-radius:var(--radius);border:1px solid var(--line);padding:.75rem}.family-panel.light{color:#3b3632;background:#f3f1ec}.family-panel.dark{color:#d8d2ca;background:#202022}.family-grid{align-items:center;gap:.5rem;display:grid}.family-grid .head{opacity:.7;text-align:center;font-size:.6875rem}.family-grid .head:nth-child(n){overflow-wrap:anywhere}.tile svg{width:100%;height:auto;display:block}@media (width<=48rem){main.icon-app,main.texture-app,main.font-app{grid-template-columns:1fr}main.icon-app .controls,main.texture-app .controls,main.font-app .controls{order:2}.tabs{margin-left:0}}.sheet-state{gap:.2rem;display:grid}.size-slider{align-items:center;gap:.5rem;width:12rem;display:flex}.size-slider .hand-range{flex:1}.font-sample{resize:vertical;border:1px solid var(--line);border-radius:var(--radius);color:#1d1a24;background:#fbfaf6;width:100%;min-height:12rem;padding:.75rem 1rem;font-size:56px;line-height:1.25}.glyphs{grid-template-columns:repeat(auto-fill,minmax(3.5rem,1fr));gap:.35rem;display:grid}.glyph{border:1px solid var(--line);color:#1d1a24;background:#fbfaf6;border-radius:.375rem;justify-items:center;margin:0;padding:.25rem;display:grid}.glyph.composite{background:#f1efe8;border-style:dashed}.glyph svg{fill:currentColor;width:100%;height:3.25rem}.glyph .baseline{stroke:#a9c2da;stroke-width:6px}.glyph figcaption{color:#6b645e;font-size:.6875rem}.small{font-size:.8125rem}.site-footer{color:var(--quiet);flex-wrap:wrap;gap:.5rem 1.25rem;padding:1.5rem 1rem 2rem;font-size:.8125rem;display:flex}.site-footer a,.link,.privacy-notice a{color:var(--quiet);text-underline-offset:.2em;text-decoration:underline}.site-footer a:hover,.link:hover,.privacy-notice a:hover{color:var(--accent)}.link{font:inherit;cursor:pointer;background:0 0;border:0;padding:0}.privacy-notice{z-index:20;border:1px solid var(--accent);border-radius:var(--radius);background:var(--surface);max-width:34rem;margin-inline:auto;padding:1rem 1.1rem;font-size:.875rem;position:fixed;bottom:1rem;left:1rem;right:1rem;box-shadow:0 .5rem 2rem #00000080}.privacy-notice p{margin:0 0 .6rem}.privacy-notice strong{color:var(--accent);font-weight:400}.privacy-notice .row{margin-top:.75rem}.privacy-notice[hidden]{display:none}.home{color:inherit;text-decoration:none}.policy{text-transform:none;max-width:44rem;margin:0 auto;padding:1.5rem 1rem 3rem;line-height:1.6;display:block}.policy h2{color:var(--accent);letter-spacing:.02em;margin:2rem 0 .5rem;font-size:1rem}.policy strong{color:var(--accent);font-weight:400}.policy ul{padding-left:1.2rem}.policy li+li{margin-top:.4rem}.storage{border-collapse:collapse;width:100%;margin:.75rem 0;font-size:.8125rem}.storage th,.storage td{text-align:left;vertical-align:top;border-bottom:1px solid var(--line);padding:.45rem .6rem .45rem 0}.storage th{color:var(--quiet);font-weight:400}.storage .key{text-transform:none;word-break:break-all;color:var(--accent)}.todo{color:#ff2fb4}.workspace{gap:.75rem;min-width:0;display:grid;container-type:inline-size}.result-wrap{position:relative}.result-wrap #result-stage{min-height:16rem}.result-wrap #result-stage canvas,.result-wrap #vector-view svg{max-height:52vh}.photo-inset{z-index:2;gap:.3rem;width:min(30%,13rem);transition:width .25s;display:grid;position:absolute;top:.6rem;left:.6rem}.photo-inset.big{width:min(92%,40rem)}.photo-inset .stage{border-color:var(--accent);box-shadow:0 .4rem 1.4rem #0000008c}.inset-size{font:inherit;border:1px solid var(--line);background:var(--surface);color:var(--quiet);cursor:pointer;border-radius:.375rem;justify-self:start;padding:.15rem .5rem;font-size:.75rem}.inset-size:hover{color:var(--accent)}.globe-arc{grid-template-columns:repeat(2,minmax(0,1fr));justify-items:center;gap:1.25rem .5rem;padding:.5rem 0 1rem;display:grid}@container (width>=40rem){.globe-arc{grid-template-columns:repeat(4,minmax(0,1fr));padding-bottom:3rem}.globe-arc>.globe-pair:nth-child(2),.globe-arc>.globe-pair:nth-child(3){translate:0 2rem}}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.globe-pair{justify-items:center;gap:.4rem;width:100%;max-width:10rem;display:grid}.globe-title{color:var(--text);margin:0;font-size:.875rem;font-weight:400}.globe-ball{aspect-ratio:1;width:min(7.5rem,70%);position:relative}.globe{cursor:grab;touch-action:none;width:100%;height:100%;display:block;overflow:visible}.globe-pair.dragging .globe{cursor:grabbing}.globe,.globe:focus,.globe:focus-visible{-webkit-tap-highlight-color:transparent;outline:none}.globe-pair{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.globe:focus-visible .globe-rim{stroke:var(--accent)}.globe-body{fill:var(--surface)}.globe-grid,.globe-rim{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.globe-grid{stroke:#8f877c;stroke-width:1px;opacity:.75}.globe-rim{stroke:var(--text);stroke-width:1.3px}.globe-rim-2{stroke-width:.8px;opacity:.45}.globe-handle{color:var(--accent);pointer-events:none}.globe-handle use{transform-box:fill-box;transform-origin:50%;transform:scale(1.6)}.globe-val{color:var(--accent);pointer-events:none;font-size:.8125rem;position:absolute;right:-1rem}.globe-val-y{top:-.2rem}.globe-val-x{bottom:-.2rem}.globe-names{color:var(--quiet);text-align:left;justify-self:stretch;gap:.1rem;margin:0;padding:0;font-size:.75rem;list-style:none;display:grid}.globe-names span{color:var(--text)}.pieces{gap:.4rem;padding:.2rem 0 .4rem;display:flex;overflow-x:auto}.piece,.set-tile{border:1px solid var(--line);cursor:pointer;background:#f3f1ec;border-radius:.375rem;flex:none;place-items:center;padding:.3rem;display:grid;position:relative}.piece{width:5rem;height:5rem}.piece canvas{max-width:100%;max-height:100%}.piece[aria-selected=true],.set-tile[aria-selected=true]{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.piece span,.set-num{color:#6b645e;font-size:.6875rem;position:absolute;top:.15rem;left:.3rem}.icon-set{grid-template-columns:repeat(auto-fill,minmax(4.5rem,1fr));gap:.4rem;display:grid}.set-tile{aspect-ratio:1}.set-tile svg{width:100%;height:auto}.set-wait{color:#a49b92}.font-checks{color:var(--quiet);gap:.35rem;margin:0;padding-left:1.1rem;font-size:.8125rem;display:grid}.check-chars{color:var(--accent);text-transform:none;letter-spacing:.08em}.check.accent{color:var(--accent)}