:root{--bg:#000;--panel-2:#000;--panel:#0b0b0a;--border:#2b2925;--text:#ece7da;--muted:#8b8574;--accent:#ffb000;--accent-dim:#cc8a00;--warn:#ff6a2b;--grid:#16150f;--grid-strong:#262319;--ground:#3a362e;--font-pixel:"Press Start 2P", ui-monospace, monospace;--font-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--radius:6px;--gap:clamp(10px, 2vw, 20px);--trace-1:#48c9b0;--trace-2:#f0785a;--trace-3:#5bb8ff;--trace-4:#a98cf0;--trace-5:#93c95b;--trace-6:#e86fa0}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#app{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font-mono);margin:0;font-size:13px;line-height:1.45;overflow:hidden}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-dim)}button{font-family:var(--font-mono);cursor:pointer}:focus{outline:none}:focus-visible{outline:1px solid var(--accent);outline-offset:1px}.btn{background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:7px 12px;font-size:13px;transition:background .12s,border-color .12s,color .12s}.btn:hover{border-color:var(--accent-dim)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#000;font-weight:600}.btn.primary:hover{background:var(--accent-dim);border-color:var(--accent-dim)}.icon-btn{background:var(--panel-2);width:26px;height:26px;color:var(--muted);border:1px solid var(--border);border-radius:5px;justify-content:center;align-items:center;font-size:15px;line-height:1;transition:color .12s,border-color .12s;display:inline-flex}.icon-btn:hover{color:var(--text);border-color:var(--accent-dim)}input[type=text]{background:var(--panel-2);color:var(--text);border:1px solid var(--border);font-family:var(--font-mono);border-radius:4px;padding:6px 8px;font-size:13px}input[type=text]:focus{border-color:var(--accent)}.chip{background:var(--bg);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:4px 11px;font-size:11px;transition:color .12s,border-color .12s}.chip:hover{color:var(--text)}.chip.on{border-color:var(--accent);color:var(--accent);font-weight:700}::-webkit-scrollbar{width:14px;height:14px}::-webkit-scrollbar-track{background:0 0;margin:8px 0}::-webkit-scrollbar-thumb{background:#3a362e padding-box padding-box;border:4px solid #0000;border-radius:999px}::-webkit-scrollbar-thumb:hover{background:#ffb00073 padding-box padding-box}@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:#3a362e transparent}}body.booting #app{opacity:0}body.booted #app{opacity:1;transition:opacity .4s ease-out}.fatal{color:#ff9b9b;font-family:var(--font-mono);white-space:pre-wrap;padding:24px}@keyframes screen-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes fade-in{0%{opacity:0}}.home,.compare{animation:.22s ease-out both screen-in}.stage__scene,.count__scene{animation:.2s ease-out fade-in}@media (prefers-reduced-motion:reduce){body.booted #app{transition:none}*{animation:none!important}}.home{height:100%;padding:var(--gap);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:22px;display:flex}.home__title{font-family:var(--font-pixel);letter-spacing:-.5px;color:var(--accent);text-shadow:0 0 14px #ffb00080;margin:0;font-size:clamp(20px,5vw,34px);animation:2.6s ease-in-out infinite alternate title-glow}@keyframes title-glow{0%{text-shadow:0 0 10px #ffb00059}to{text-shadow:0 0 20px #ffb000a6}}.home__tagline{color:var(--muted);margin:-10px 0 0}.home__pickers{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.home__vs{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:12px}.picker{width:200px;position:relative}.picker__input{width:100%}.picker__list{z-index:20;background:var(--panel);border:1px solid var(--border);opacity:0;transform-origin:top;pointer-events:none;border-radius:6px;max-height:240px;transition:opacity .14s,transform .14s cubic-bezier(.2,.8,.2,1);position:absolute;top:calc(100% + 4px);left:0;right:0;overflow-y:auto;transform:translateY(-6px)scale(.98);box-shadow:0 12px 40px #0009}.picker__list.is-open{opacity:1;pointer-events:auto;transform:none}.picker__row{border:0;border-bottom:1px solid var(--border);width:100%;color:var(--text);text-align:left;background:0 0;justify-content:space-between;align-items:center;padding:7px 10px;font-size:13px;display:flex}.picker__row:last-child{border-bottom:0}.picker__row:hover{background:var(--panel-2);color:var(--accent)}.picker__cat{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:11px}.home__popular{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 14px;max-width:640px;font-size:12px;display:flex}.home__popular-label{color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.home__popular-link{color:var(--text)}.home__popular-link:hover{color:var(--accent)}.home__surprise{margin-top:4px}.compare{flex-direction:column;height:100%;display:flex;overflow:hidden}.compare__body{flex:1;min-height:0;display:flex}.compare__main{min-width:0;padding:var(--gap);flex-direction:column;flex:1;gap:10px;display:flex}.compare__stage{flex:1;min-height:0}.compare__header{z-index:5;flex-wrap:wrap;align-items:center;gap:14px;display:flex;position:relative}.compare__home{font-family:var(--font-pixel);color:var(--accent);text-shadow:0 0 10px #ffb00066;letter-spacing:-.5px;white-space:nowrap;font-size:12px}.compare__pickers{align-items:center;gap:8px;display:flex}.compare__pickers .picker{width:170px}.stage{background:var(--bg);border:1px solid var(--border);cursor:crosshair;-webkit-user-select:none;user-select:none;touch-action:none;background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-size:32px 32px;border-radius:16px;width:100%;height:100%;position:relative;overflow:hidden}.stage.is-panning{cursor:grabbing}.stage--spatial{--grid-major:64px;--grid-minor:0px;--grid-ox:0px;--grid-oy:0px;background-image:linear-gradient(var(--grid-strong) 1px, transparent 1px), linear-gradient(90deg, var(--grid-strong) 1px, transparent 1px), linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-size:var(--grid-major) var(--grid-major), var(--grid-major) var(--grid-major), var(--grid-minor) var(--grid-minor), var(--grid-minor) var(--grid-minor);background-position:var(--grid-ox) var(--grid-oy), var(--grid-ox) var(--grid-oy), var(--grid-ox) var(--grid-oy), var(--grid-ox) var(--grid-oy)}.stage__scene{transform-origin:0 0;will-change:transform;position:absolute;inset:0}.stage__ground{background:var(--ground);height:1px;position:absolute;left:0;right:0;box-shadow:0 0 6px #3a362e99}.stage__item{pointer-events:none;position:absolute;inset:0}.stage__silhouette{--flip:1;--hatch-scale:1;background-color:var(--hue);-webkit-mask:var(--src) no-repeat center / 100% 100%;-webkit-mask:var(--src) no-repeat center / 100% 100%;mask:var(--src) no-repeat center / 100% 100%;filter:drop-shadow(0 0 7px color-mix(in srgb, var(--hue) 32%, transparent));transform-origin:bottom;transform:scaleX(var(--flip)) scale(var(--hatch-scale));transition:opacity .25s,transform .25s;position:absolute}.is-marker .stage__silhouette{opacity:0;--hatch-scale:.55}.is-silhouette .stage__silhouette{opacity:1;--hatch-scale:1}.stage__marker{flex-direction:column;align-items:center;transition:opacity .25s;display:flex;position:absolute;transform:translate(-50%,-100%)}.is-silhouette .stage__marker{opacity:0}.stage__marker-label{color:var(--hue);white-space:nowrap;text-shadow:0 0 6px color-mix(in srgb, var(--hue) 40%, transparent);margin-bottom:3px;font-size:11px}.stage__marker-leader{background:var(--hue);opacity:.55;width:1px;height:24px}.stage__marker-dot{background:var(--hue);width:8px;height:8px;box-shadow:0 0 8px var(--hue);border-radius:50%;margin-top:-4px}.stage__measure{opacity:.85;transition:opacity .25s;position:absolute}.is-marker .stage__measure{opacity:0}.stage__measure.is-horizontal{border-top:1px dashed var(--hue)}.stage__measure.is-vertical{border-left:1px dashed var(--hue)}.stage__measure-label{color:var(--hue);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:11px;position:absolute}.stage__measure.is-horizontal .stage__measure-label{top:3px;left:50%;transform:translate(-50%)}.stage__measure.is-vertical .stage__measure-label{top:50%;left:-6px;transform:translate(-100%,-50%)}.stage__caption{color:var(--hue);white-space:nowrap;opacity:.85;font-size:11px;position:absolute;transform:translate(-50%)}.stage--count{cursor:default;justify-content:center;align-items:center;display:flex}.count__scene{transform-origin:50%;flex-direction:column;align-items:center;gap:18px;padding:24px;display:flex}.count__glyph{background-color:var(--hue);-webkit-mask:var(--src) no-repeat center / 100% 100%;-webkit-mask:var(--src) no-repeat center / 100% 100%;mask:var(--src) no-repeat center / 100% 100%;filter:drop-shadow(0 0 6px color-mix(in srgb, var(--hue) 32%, transparent))}.count__hero{flex-direction:column;align-items:center;gap:6px;display:flex}.count__hero-name{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:12px}.count__tiles{flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:10px;max-width:70%;display:flex}.count__label{color:var(--hue);font-variant-numeric:tabular-nums;text-shadow:0 0 10px color-mix(in srgb, var(--hue) 40%, transparent);font-size:20px}.count__n{font-weight:700}.sidebar{background:var(--panel);border-left:1px solid var(--border);scrollbar-gutter:stable;width:380px;padding:var(--gap);flex-direction:column;flex-shrink:0;gap:12px;display:flex;overflow-y:auto}.sidebar__cta{border:1px dashed var(--warn);color:#ffae85;text-align:left;background:#ff6a2b17;border-radius:6px;width:100%;padding:9px 10px;font-size:12px;transition:background .12s,border-color .12s}.sidebar__cta:hover{border-color:var(--accent);color:var(--text)}.panel{background:var(--panel-2);border:1px solid var(--border);border-radius:9px;padding:10px 12px}.panel__head{text-transform:uppercase;letter-spacing:.06em;color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:7px;margin:0;font-size:12px;display:flex}.panel__head:before{content:">";color:var(--accent);transition:transform .15s;display:inline-block}.panel.collapsed .panel__head:before{transform:rotate(90deg)}.panel__body{flex-direction:column;gap:5px;margin-top:8px;display:flex}.panel.collapsed .panel__body{display:none}.fact{justify-content:space-between;font-size:12px;display:flex}.fact__k{color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.fact__v{color:var(--text);font-variant-numeric:tabular-nums}.fact__desc{color:var(--muted);margin-top:4px;font-size:12px;line-height:1.5}.fact__src{margin-top:4px;font-size:12px}.equiv{align-items:baseline;gap:8px;font-size:13px;display:flex}.equiv__n{color:var(--accent);font-variant-numeric:tabular-nums;font-weight:700}.equiv__unit{color:var(--text)}.equiv__note{color:var(--muted);margin-top:6px;font-size:11px;line-height:1.5}.controlbar{padding:10px var(--gap);border-top:1px solid var(--border);background:var(--panel);flex-wrap:wrap;align-items:center;gap:10px;display:flex}.controlbar__group{align-items:center;gap:8px;display:flex}.controlbar__camera{gap:6px;margin-left:6px;display:flex}.controlbar__stats{flex-wrap:wrap;gap:6px 20px;margin-left:auto;display:flex}.stat{align-items:baseline;gap:10px;display:flex}.stat__name{color:var(--hue);font-size:12px;font-weight:600}.stat__num{font-variant-numeric:tabular-nums;align-items:baseline;gap:4px;display:inline-flex}.stat__tag{color:var(--muted);font-size:10px}.stat__num-value{color:var(--hue);font-size:13px}