:root,[data-theme=light]{--c-bg: #f1f1ee;--c-surface: #ffffff;--c-surface-2: #f7f7f4;--c-surface-3: #ecece7;--c-line: #dedcd5;--c-line-strong: #c6c3b9;--c-ink: #18191c;--c-ink-2: #55585f;--c-ink-3: #8a8d94;--c-accent: #cf4318;--c-accent-ink: #ffffff;--c-accent-soft: rgba(207, 67, 24, .1);--c-accent-line: rgba(207, 67, 24, .35);--c-ok: #1f7a46;--c-warn: #9a6a00;--c-err: #b8322a;--c-shadow: 0 1px 2px rgba(20, 20, 18, .06), 0 8px 24px rgba(20, 20, 18, .1);--c-grid: rgba(24, 25, 28, .055);color-scheme:light}[data-theme=dark]{--c-bg: #0d0e10;--c-surface: #17181b;--c-surface-2: #1d1f23;--c-surface-3: #26282d;--c-line: #2c2f35;--c-line-strong: #3d4148;--c-ink: #eceef1;--c-ink-2: #a6acb5;--c-ink-3: #757b84;--c-accent: #ff6a33;--c-accent-ink: #1a0d06;--c-accent-soft: rgba(255, 106, 51, .14);--c-accent-line: rgba(255, 106, 51, .4);--c-ok: #46b878;--c-warn: #e0a83a;--c-err: #ff6b5e;--c-shadow: 0 1px 2px rgba(0, 0, 0, .5), 0 12px 32px rgba(0, 0, 0, .45);--c-grid: rgba(236, 238, 241, .05);color-scheme:dark}:root{--t-micro: .6875rem;--t-small: .75rem;--t-base: .8125rem;--t-body: .9375rem;--t-lg: 1.1875rem;--t-xl: 1.5625rem;--f-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--f-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--s-1: .25rem;--s-2: .5rem;--s-3: .75rem;--s-4: 1rem;--s-5: 1.5rem;--s-6: 2rem;--r-sm: 4px;--r-md: 6px;--r-lg: 10px;--panel-left: 296px;--panel-right: 344px;--topbar-h: 52px}*,*:before,*:after{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--c-bg);color:var(--c-ink);font-family:var(--f-sans);font-size:var(--t-base);line-height:1.45;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overscroll-behavior:none}h1,h2,h3,p,ul,ol,figure{margin:0;padding:0}ul,ol{list-style:none}button,input,select,textarea{font:inherit;color:inherit}svg.icon{display:block;flex:none}:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px;border-radius:var(--r-sm)}:focus:not(:focus-visible){outline:none}[hidden]{display:none!important}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.app{display:grid;grid-template-rows:var(--topbar-h) 1fr auto;height:100dvh;overflow:hidden}.sitefoot{display:flex;flex-wrap:wrap;gap:2px var(--s-4);padding:6px var(--s-3);border-top:1px solid var(--c-line);background:var(--c-surface)}.sitefoot-line{margin:0;color:var(--c-ink-2);font-size:11px;line-height:1.45}.sitefoot-line strong{color:var(--c-ink);font-weight:600}.sitefoot-credit{color:var(--c-ink-2)}.sitefoot a{color:inherit;text-decoration:underline;text-underline-offset:2px}.sitefoot a:hover{color:var(--c-ink)}.topbar{position:relative;display:flex;align-items:center;gap:var(--s-3);padding:0 var(--s-3);background:var(--c-surface);border-bottom:1px solid var(--c-line)}.brand{display:flex;align-items:center;gap:var(--s-2);min-width:0}.brand-mark{height:26px;aspect-ratio:542 / 617;flex:none;background-color:var(--c-ink);-webkit-mask:url(/emoji-clicker-generator/brand/mark-small.svg) no-repeat center / contain;mask:url(/emoji-clicker-generator/brand/mark-small.svg) no-repeat center / contain}.brand-text{display:flex;flex-direction:column;min-width:0}.brand-name{font-size:var(--t-body);font-weight:650;letter-spacing:-.011em;line-height:1.15}.brand-sub{font-size:var(--t-micro);color:var(--c-ink-3);letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-actions{display:flex;align-items:center;gap:var(--s-1);margin-left:auto}.progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;overflow:hidden;pointer-events:none}.progress[data-busy=true]:after{content:"";position:absolute;inset-block:0;width:32%;background:var(--c-accent);animation:sweep 1.1s cubic-bezier(.4,0,.2,1) infinite}@keyframes sweep{0%{transform:translate(-110%)}to{transform:translate(420%)}}.workspace{position:relative;display:grid;grid-template-columns:var(--panel-left) minmax(0,1fr) var(--panel-right);min-height:0}.panel-host{min-height:0;overflow-y:auto;overscroll-behavior:contain;background:var(--c-surface);scrollbar-width:thin}.panel-host-left{border-right:1px solid var(--c-line)}.panel-host-right{border-left:1px solid var(--c-line)}.stage{position:relative;min-width:0;min-height:0;background-color:var(--c-bg);background-image:radial-gradient(var(--c-grid) 1px,transparent 1px);background-size:24px 24px;background-position:center}.viewer-host{position:absolute;inset:0}.viewer-host canvas{display:block;width:100%;height:100%;touch-action:none}.scrim{display:none}.panel{display:flex;flex-direction:column}.panel-section{border-bottom:1px solid var(--c-line)}.section-head{display:flex;align-items:center;gap:var(--s-2);width:100%;min-height:40px;padding:0 var(--s-3);background:none;border:0;color:var(--c-ink-2);cursor:pointer;text-align:left}.section-head:hover{color:var(--c-ink);background:var(--c-surface-2)}.section-title{flex:1;font-size:var(--t-micro);font-weight:650;letter-spacing:.09em;text-transform:uppercase}.section-badge{display:inline-flex;align-items:center;gap:4px;padding:1px 6px;border-radius:999px;background:var(--c-surface-3);color:var(--c-ink-2);font-family:var(--f-mono);font-size:10px;letter-spacing:.02em}.section-badge:has(.section-badge-art){padding:2px 4px}.section-badge-art{display:block;width:14px;height:14px;object-fit:contain;flex:none}.section-chevron{width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);transition:transform .12s ease}.panel-section[data-open=false] .section-chevron{transform:rotate(-45deg) translate(-1px,1px)}.section-body{padding:var(--s-1) var(--s-3) var(--s-3);display:flex;flex-direction:column}.divider{height:1px;margin:var(--s-2) 0;background:var(--c-line)}.hint{margin:var(--s-1) 0 var(--s-2);color:var(--c-ink-3);font-size:var(--t-small);line-height:1.5}.field{display:flex;flex-direction:column;gap:var(--s-1);padding:7px 0}.field[data-disabled=true],.segmented[data-disabled=true]{opacity:.45;pointer-events:none}.field-head{display:flex;align-items:center;gap:var(--s-1);min-height:20px}.field-label{flex:1;color:var(--c-ink-2);font-size:var(--t-small);font-weight:500;letter-spacing:.005em}.field-value{display:flex;align-items:center;gap:3px}.field-readout{font-family:var(--f-mono);font-size:var(--t-micro);color:var(--c-ink-3);letter-spacing:-.01em}.unit{font-family:var(--f-mono);font-size:var(--t-micro);color:var(--c-ink-3)}.num{width:62px;height:24px;padding:0 5px;background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:var(--r-sm);font-family:var(--f-mono);font-size:var(--t-small);text-align:right;letter-spacing:-.02em;-moz-appearance:textfield}.num::-webkit-outer-spin-button,.num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.num:hover{border-color:var(--c-line-strong)}.num:focus{border-color:var(--c-accent);background:var(--c-surface)}.num-standalone{width:100%;min-width:0;text-align:center}.text-input{height:32px;padding:0 var(--s-2);background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:var(--r-sm);font-size:var(--t-base)}.text-input:hover{border-color:var(--c-line-strong)}.text-input:focus{border-color:var(--c-accent);background:var(--c-surface);outline:none;box-shadow:0 0 0 3px var(--c-accent-soft)}.range{--fill: 0%;width:100%;height:18px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer}.range::-webkit-slider-runnable-track{height:4px;border-radius:999px;background:linear-gradient(to right,var(--c-accent) var(--fill),var(--c-surface-3) var(--fill))}.range::-moz-range-track{height:4px;border-radius:999px;background:linear-gradient(to right,var(--c-accent) var(--fill),var(--c-surface-3) var(--fill))}.range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:15px;height:15px;margin-top:-5.5px;border-radius:50%;background:var(--c-surface);border:1.5px solid var(--c-ink-2);box-shadow:0 1px 2px #0000002e;transition:border-color .1s ease,transform .1s ease}.range::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:var(--c-surface);border:1.5px solid var(--c-ink-2);box-shadow:0 1px 2px #0000002e}.range:hover::-webkit-slider-thumb,.range:focus-visible::-webkit-slider-thumb{border-color:var(--c-accent)}.range:hover::-moz-range-thumb,.range:focus-visible::-moz-range-thumb{border-color:var(--c-accent)}.range:active::-webkit-slider-thumb{transform:scale(1.08)}.range:disabled{cursor:default}.segmented{display:flex;gap:2px;padding:2px;background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:var(--r-md)}.segmented-wrap{flex-wrap:wrap}.segment{display:flex;align-items:center;justify-content:center;gap:5px;flex:1 1 auto;min-width:0;min-height:28px;padding:0 var(--s-2);background:none;border:0;border-radius:var(--r-sm);color:var(--c-ink-2);font-size:var(--t-small);font-weight:500;white-space:nowrap;cursor:pointer}.segmented-wrap .segment{flex:1 0 30%}.segment:hover{color:var(--c-ink);background:var(--c-surface-3)}.segment[aria-checked=true]{background:var(--c-surface);color:var(--c-ink);box-shadow:0 0 0 1px var(--c-accent-line),0 1px 1px #00000014}[data-theme=dark] .segment[aria-checked=true]{background:var(--c-surface-3)}.segment[aria-checked=true] .icon{color:var(--c-accent)}.segment:disabled{opacity:.4;cursor:default}.segment-icon{flex:0 0 auto;padding:0 var(--s-2)}.level-picker .segment{font-family:var(--f-mono);min-width:24px;padding:0 4px}.field-toggle{flex-direction:row;align-items:center;gap:var(--s-2)}.field-toggle .field-head{flex:1}.switch{position:relative;flex:none;width:38px;height:22px;padding:0;border:1px solid var(--c-line-strong);border-radius:999px;background:var(--c-surface-3);cursor:pointer;transition:background .12s ease,border-color .12s ease}.switch-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--c-surface);box-shadow:0 1px 2px #00000040;transition:transform .13s cubic-bezier(.4,0,.2,1)}.field-toggle[data-on=true] .switch{background:var(--c-accent);border-color:var(--c-accent)}.field-toggle[data-on=true] .switch-thumb{transform:translate(16px)}.help{display:grid;place-items:center;width:15px;height:15px;padding:0;border:1px solid var(--c-line-strong);border-radius:50%;background:none;color:var(--c-ink-3);cursor:help;flex:none}.help:hover{color:var(--c-accent);border-color:var(--c-accent)}.help-glyph{font-size:9px;font-weight:700;line-height:1}.tooltip{position:fixed;z-index:60;max-width:258px;padding:var(--s-2) 10px;background:var(--c-ink);color:var(--c-bg);border-radius:var(--r-md);font-size:var(--t-small);line-height:1.4;box-shadow:var(--c-shadow);opacity:0;visibility:hidden;pointer-events:none;transition:opacity 90ms ease}.tooltip[data-open=true]{opacity:1;visibility:visible}.popover{position:fixed;z-index:70;padding:var(--s-3);background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);box-shadow:var(--c-shadow)}.popover-title{margin-bottom:var(--s-2);font-size:var(--t-micro);font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink-3)}.swatch-pop{width:214px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;padding:0 11px;background:var(--c-surface);border:1px solid var(--c-line-strong);border-radius:var(--r-md);color:var(--c-ink);font-size:var(--t-small);font-weight:550;white-space:nowrap;cursor:pointer;transition:background .1s ease,border-color .1s ease}.btn:hover:not(:disabled){background:var(--c-surface-2);border-color:var(--c-ink-3)}.btn:active:not(:disabled){background:var(--c-surface-3)}.btn:disabled{opacity:.4;cursor:default}.btn-primary{background:var(--c-accent);border-color:var(--c-accent);color:var(--c-accent-ink)}.btn-primary:hover:not(:disabled){background:color-mix(in srgb,var(--c-accent) 88%,black);border-color:color-mix(in srgb,var(--c-accent) 88%,black)}.btn-ghost{background:none;border-color:transparent;color:var(--c-ink-2)}.btn-ghost:hover:not(:disabled){background:var(--c-surface-2);border-color:var(--c-line);color:var(--c-ink)}.btn-danger{color:var(--c-err);border-color:var(--c-line-strong)}.btn-icon{width:34px;min-height:34px;padding:0}.button-row{display:flex;flex-wrap:wrap;gap:var(--s-2);padding:var(--s-1) 0}.button-row .btn{flex:1 1 auto}.history-row .btn{flex:1 1 0}.swatch-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.swatch{--swatch: #888;position:relative;aspect-ratio:1;min-height:26px;padding:0;border:1px solid rgba(0,0,0,.18);border-radius:var(--r-sm);background:var(--swatch);cursor:pointer}.swatch[data-dark=true]{border-color:#ffffff29}.swatch:hover{transform:scale(1.06)}.swatch[aria-checked=true]{box-shadow:0 0 0 2px var(--c-surface),0 0 0 3.5px var(--c-accent)}.swatch[aria-checked=true]:after{content:"";position:absolute;left:50%;top:46%;width:5px;height:9px;border:2px solid rgba(0,0,0,.72);border-top:0;border-left:0;transform:translate(-50%,-50%) rotate(42deg)}.swatch[aria-checked=true][data-dark=true]:after{border-color:#ffffffe6}.swatch-trigger{width:30px;height:30px;min-height:30px;aspect-ratio:auto;flex:none}.color-custom{display:flex;align-items:center;gap:var(--s-2);margin-top:var(--s-2)}.color-custom-label{font-size:var(--t-small);color:var(--c-ink-2)}.color-input{width:34px;height:26px;padding:0;border:1px solid var(--c-line-strong);border-radius:var(--r-sm);background:none;cursor:pointer}.color-input::-webkit-color-swatch-wrapper{padding:2px}.color-input::-webkit-color-swatch{border:none;border-radius:2px}.color-readout{margin-left:auto;font-family:var(--f-mono);font-size:var(--t-micro);color:var(--c-ink-3)}.source-tabs{margin-bottom:var(--s-2)}.source-pane{display:flex;flex-direction:column;gap:var(--s-1)}.sample-row{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-1);padding-top:var(--s-2)}.sample-label{font-size:var(--t-micro);text-transform:uppercase;letter-spacing:.08em;color:var(--c-ink-3);margin-right:var(--s-1)}.sample-row .btn{min-height:26px;padding:0 8px;font-size:var(--t-micro);flex:0 0 auto}.icon-picker{display:flex;flex-direction:column;gap:var(--s-2)}.icon-search{height:30px}.icon-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;max-height:232px;overflow-y:auto;padding:2px;scrollbar-width:thin}.icon-cell{display:grid;place-items:center;aspect-ratio:1;padding:0;background:var(--c-surface-2);border:1px solid transparent;border-radius:var(--r-md);color:var(--c-ink-2);cursor:pointer}.icon-cell:hover{background:var(--c-surface-3);color:var(--c-ink)}.icon-cell[aria-checked=true]{background:var(--c-accent-soft);border-color:var(--c-accent-line);color:var(--c-accent)}.emoji-art{display:block;width:100%;height:100%;object-fit:contain;min-width:0;min-height:0}.emoji-cell{position:relative;padding:4px}.emoji-cell .emoji-art{width:24px;height:24px}.emoji-cell-mini .emoji-art{width:22px;height:22px}.emoji-count{position:absolute;right:2px;bottom:1px;font-family:var(--f-mono);font-size:9px;line-height:1;color:var(--c-ink-3);pointer-events:none}.emoji-cell[aria-checked=true] .emoji-count{color:var(--c-accent)}.emoji-current{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--s-2);padding:var(--s-2);background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:var(--r-md)}.emoji-current-art{width:40px;height:40px;flex:0 0 auto}.emoji-current-text{display:flex;flex-direction:column;gap:2px;min-width:0}.emoji-current-name{font-size:var(--t-small);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.emoji-current-meta{white-space:normal;overflow-wrap:anywhere}.emoji-groups{display:flex;flex-direction:column;gap:var(--s-1)}.emoji-recent{gap:4px;padding-top:0}.emoji-result-label{margin:0}.emoji-grid{grid-template-columns:repeat(7,1fr);max-height:208px}.emoji-empty,.emoji-message,.emoji-notice{margin:0}.emoji-notice{padding:var(--s-2);background:var(--c-surface-2);border:1px solid var(--c-line);border-left:3px solid var(--c-accent);border-radius:var(--r-md);color:var(--c-ink-2)}.emoji-custom-row{display:flex;align-items:center;gap:var(--s-1)}.emoji-input{flex:1 1 auto;min-width:0}.emoji-proposal-art,.emoji-proposal .emoji-art{width:28px;height:28px}.emoji-proposal{display:flex;align-items:center;gap:var(--s-1);flex:0 0 auto}.emoji-proposal-name{font-size:var(--t-micro);color:var(--c-ink-3);max-width:12ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-list{display:flex;flex-direction:column;gap:var(--s-2)}.layer{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-2);align-items:center;padding:var(--s-2);background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:var(--r-md)}.layer-info{display:flex;flex-direction:column;gap:3px;min-width:0}.layer-name{font-size:var(--t-small);font-weight:600}.layer-meta{display:flex;align-items:center;gap:5px;font-family:var(--f-mono);font-size:10px;color:var(--c-ink-3)}.source-chip{--swatch: #888;width:9px;height:9px;border-radius:2px;background:var(--swatch);border:1px solid rgba(0,0,0,.2);flex:none}.source-chip[data-dark=true]{border-color:#ffffff40}.coverage{display:block;height:3px;border-radius:999px;background:var(--c-surface-3);overflow:hidden}.coverage-fill{display:block;height:100%;background:var(--c-ink-3)}.layer .level-picker{grid-column:1 / -1}.field-row .row-controls{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:4px}.row-tag{font-family:var(--f-mono);font-size:10px;color:var(--c-ink-3)}.placement-list{display:flex;flex-direction:column}.trace-preview{position:relative;display:grid;place-items:center;border:1px solid var(--c-line);border-radius:var(--r-md);background-color:var(--c-surface-2);background-image:radial-gradient(var(--c-grid) 1px,transparent 1px);background-size:12px 12px;overflow:hidden}.trace-canvas{display:block;width:100%}.trace-empty{position:absolute;font-size:var(--t-small);color:var(--c-ink-3)}.status-line{display:flex;align-items:center;gap:var(--s-2);padding:var(--s-2) 0;font-size:var(--t-small)}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--c-ink-3);flex:none}.status-line[data-tone=busy] .status-dot{background:var(--c-accent);animation:pulse 1s ease-in-out infinite}.status-line[data-tone=ok] .status-dot{background:var(--c-ok)}.status-line[data-tone=error] .status-dot{background:var(--c-err)}.status-line[data-tone=error] .status-text{color:var(--c-err)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.status-text{color:var(--c-ink-2);overflow-wrap:anywhere}.stats{display:grid;gap:2px}.stat{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-2);padding:3px 0;border-bottom:1px dotted var(--c-line);font-size:var(--t-small)}.stat-key{color:var(--c-ink-3)}.stat-value{font-family:var(--f-mono);font-size:var(--t-small);letter-spacing:-.02em}.warning-block{margin-top:var(--s-2)}.warning-title{font-size:var(--t-micro);font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--c-warn);margin-bottom:var(--s-1)}.warnings{display:flex;flex-direction:column;gap:var(--s-1)}.warning{padding:5px var(--s-2);border-left:2px solid var(--c-warn);background:var(--c-surface-2);border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:var(--t-small);color:var(--c-ink-2);line-height:1.4}.guide{width:min(520px,calc(100vw - 2rem));padding:var(--s-5);border:1px solid var(--c-line);border-radius:var(--r-lg);background:var(--c-surface);color:var(--c-ink);box-shadow:var(--c-shadow)}.guide::backdrop{background:#0a0a0c80;backdrop-filter:blur(2px)}.guide-head{display:flex;align-items:flex-start;gap:var(--s-3);margin-bottom:var(--s-4)}.guide-title{flex:1;font-size:var(--t-lg);font-weight:650;letter-spacing:-.015em}.guide-steps{display:flex;flex-direction:column;gap:var(--s-4)}.guide-step{display:flex;gap:var(--s-3)}.guide-step-index{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:var(--c-accent-soft);border:1px solid var(--c-accent-line);color:var(--c-accent);font-family:var(--f-mono);font-size:var(--t-small);font-weight:600}.guide-step-title{font-size:var(--t-base);font-weight:650;margin-bottom:2px}.guide-step-body{font-size:var(--t-base);color:var(--c-ink-2);line-height:1.5}.guide-note{margin-top:var(--s-4);padding-top:var(--s-3);border-top:1px solid var(--c-line);font-size:var(--t-small);color:var(--c-ink-3)}.guide-foot{display:flex;align-items:center;gap:var(--s-3);margin-top:var(--s-4)}.checkbox{display:flex;align-items:center;gap:var(--s-2);margin-right:auto;font-size:var(--t-small);color:var(--c-ink-2);cursor:pointer}.checkbox input{width:15px;height:15px;accent-color:var(--c-accent);cursor:pointer}.drawer-toggle{display:none}@media(max-width:899px){.workspace{grid-template-columns:minmax(0,1fr)}.drawer-toggle{display:inline-flex}.brand-sub{display:none}.panel-host{position:absolute;inset-block:0;z-index:30;width:min(360px,88vw);box-shadow:var(--c-shadow);transition:transform .18s cubic-bezier(.4,0,.2,1)}.panel-host-left{left:0;transform:translate(-101%)}.panel-host-right{right:0;transform:translate(101%)}.app[data-drawer=left] .panel-host-left,.app[data-drawer=right] .panel-host-right{transform:none}.scrim{display:block;position:absolute;inset:0;z-index:20;background:#0a0a0c66;opacity:0;pointer-events:none;transition:opacity .16s ease}.app:not([data-drawer=none]) .scrim{opacity:1;pointer-events:auto}}@media(pointer:coarse){.btn,.segment{min-height:38px}.num{height:32px}.swatch{min-height:32px}.icon-grid{grid-template-columns:repeat(5,1fr)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.field-dpad .field-head{margin-bottom:var(--s-1)}.dpad-body{display:flex;align-items:center;gap:var(--s-3)}.dpad{display:grid;grid-template-columns:repeat(3,26px);grid-template-rows:repeat(3,26px);gap:2px;padding:2px;flex:none;background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:var(--r-md)}.dpad[data-disabled=true]{opacity:.45;pointer-events:none}.dpad-key{display:grid;place-items:center;padding:0;background:none;border:0;border-radius:var(--r-sm);color:var(--c-ink-2);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.dpad-key:hover{background:var(--c-surface-3);color:var(--c-ink)}.dpad-key[data-active=true]{background:var(--c-accent-soft);color:var(--c-accent);box-shadow:inset 0 0 0 1px var(--c-accent-line)}.dpad-key[data-blocked=true]{color:var(--c-warn)}.dpad-up{grid-area:1 / 2}.dpad-left{grid-area:2 / 1}.dpad-hub{grid-area:2 / 2;display:grid;place-items:center}.dpad-hub:after{content:"";width:4px;height:4px;border-radius:50%;background:var(--c-ink-3)}.dpad-right{grid-area:2 / 3}.dpad-down{grid-area:3 / 2}.dpad-readout{display:grid;grid-template-columns:auto 72px auto;align-items:center;justify-content:start;gap:3px var(--s-1);flex:0 1 auto;min-width:0}.dpad-readout .num-standalone{text-align:right}.dpad-readout .row-tag{width:9px}.dpad-note{margin-top:var(--s-1);color:var(--c-warn);font-size:var(--t-small);line-height:1.4}.dpad-note:empty{display:none}.dpad-actions{display:flex;align-items:center;gap:var(--s-2);margin-top:var(--s-2)}.dpad-auto{display:inline-flex}.spinpad{display:grid;grid-template-columns:repeat(2,26px);grid-template-rows:26px;gap:2px;padding:2px;flex:none;background:var(--c-surface-2);border:1px solid var(--c-line);border-radius:var(--r-md)}.spinpad[data-disabled=true]{opacity:.45;pointer-events:none}.spinpad-key{display:grid;place-items:center;padding:0;background:none;border:0;border-radius:var(--r-sm);color:var(--c-ink-2);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.spinpad-key:hover{background:var(--c-surface-3);color:var(--c-ink)}.spinpad-key[data-active=true]{background:var(--c-accent-soft);color:var(--c-accent);box-shadow:inset 0 0 0 1px var(--c-accent-line)}.spinpad-key[data-blocked=true]{color:var(--c-warn)}.spinpad-anticlockwise{grid-area:1 / 1}.spinpad-clockwise{grid-area:1 / 2}.toast-host{position:absolute;left:0;right:0;bottom:var(--s-4);z-index:50;display:flex;justify-content:center;padding:0 var(--s-3);pointer-events:none}.toast-host[hidden]{display:none}.toast{pointer-events:auto;display:flex;align-items:flex-start;gap:var(--s-2);width:min(560px,100%);padding:var(--s-2) var(--s-2) var(--s-2) var(--s-3);background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);box-shadow:var(--c-shadow);opacity:0;transform:translateY(10px);transition:opacity .16s ease-out,transform .18s cubic-bezier(.4,0,.2,1)}.toast-host[data-state=shown] .toast{opacity:1;transform:none}.toast-host[data-state=fading] .toast{opacity:0;transform:none;transition:opacity .7s ease}.toast-icon{display:flex;align-items:center;height:18px;color:var(--c-warn);flex:none}.toast-body{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:var(--s-1)}.toast-title{font-size:var(--t-micro);font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--c-warn)}.toast-lines{display:flex;flex-direction:column;gap:var(--s-1);max-height:min(38vh,264px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}.toast-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px var(--s-2);padding:5px var(--s-2);border-left:2px solid var(--c-warn);background:var(--c-surface-2);border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:var(--t-small);line-height:1.4;color:var(--c-ink-2)}.toast-setting{font-weight:600;color:var(--c-ink)}.toast-change{display:inline-flex;align-items:baseline;gap:var(--s-1);white-space:nowrap;font-family:var(--f-mono);font-size:var(--t-small);font-variant-numeric:tabular-nums}.toast-from{color:var(--c-ink-3);text-decoration:line-through;text-decoration-thickness:1px}.toast-arrow{color:var(--c-ink-3)}.toast-to{color:var(--c-ink);font-weight:650}.toast-reason{flex:1 1 14rem;min-width:0;margin-left:var(--s-1);color:var(--c-ink-2)}.toast-close{flex:none;align-self:flex-start}@media(max-width:899px){.toast-host{bottom:var(--s-2);padding:0 var(--s-2)}.toast{width:100%;pointer-events:none}.toast-close,.toast-host[data-scrollable=true] .toast-lines{pointer-events:auto}.toast-lines{max-height:min(44vh,220px)}}@media(prefers-reduced-motion:reduce){.toast{transform:none;transition:none}.toast-host[data-state=entering] .toast{opacity:1}.toast-host[data-state=fading] .toast{opacity:0;transition:none}}