*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--font-mono);-webkit-font-smoothing:antialiased;margin:0;font-size:13px;line-height:1.55}:focus{outline:none}:focus-visible{outline:1px solid var(--accent);outline-offset:1px}code{font-family:var(--font-mono);background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:1px 5px;font-size:12px}::-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}}.page{max-width:980px;margin:0 auto;padding:40px 24px 72px}.head{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:8px;padding-bottom:26px;display:flex}.head-main{flex:380px}.title{font-family:var(--font-pixel);letter-spacing:-.5px;color:var(--accent);text-shadow:0 0 14px #ffb00080;margin:0 0 14px;font-size:22px;line-height:1.5;animation:3.2s ease-in-out infinite alternate title-pulse}@keyframes title-pulse{0%{text-shadow:0 0 12px #ffb00066}to{text-shadow:0 0 20px #ffb0009e}}.sub{color:var(--muted);max-width:62ch;margin:0}.version-pick{flex-direction:column;gap:6px;display:flex}.version-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:11px}.section{margin-top:40px}.section-head{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 16px;font-size:12px;font-weight:400}.section-head:before{content:">";color:var(--accent);margin-right:8px}.row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.stack{flex-direction:column;gap:12px;display:flex}.lede{color:var(--text);max-width:72ch;margin:0 0 14px}.code-wrap{position:relative}.code{background:var(--panel);border:1px solid var(--border);font-family:var(--font-mono);color:var(--text);border-radius:9px;margin:0;padding:14px 16px;font-size:12.5px;line-height:1.7;overflow-x:auto}.code code{font-size:inherit;background:0 0;border:none;padding:0}.copy-btn{background:var(--panel-2);color:var(--muted);border:1px solid var(--border);font-family:var(--font-mono);cursor:pointer;border-radius:6px;padding:4px 10px;font-size:11px;transition:color .12s,border-color .12s;position:absolute;top:10px;right:10px}.copy-btn:hover{color:var(--text);border-color:var(--accent-dim)}.ref{border-collapse:collapse;width:100%;font-size:12.5px}.ref th{text-align:left;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);border-bottom:1px solid var(--border);padding:0 12px 8px;font-size:10px;font-weight:400}.ref td{border-bottom:1px solid var(--border);vertical-align:top;padding:8px 12px}.ref-name{white-space:nowrap}.ref-name code{color:var(--accent);background:0 0;border:none;padding:0}.ref-chip{border:1px solid var(--border);vertical-align:-1px;border-radius:3px;width:12px;height:12px;margin-right:8px;display:inline-block}.ref-val{color:var(--muted);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;max-width:300px}.ref-desc{color:var(--muted)}.swatches{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;display:grid}.swatch{background:var(--panel);border:1px solid var(--border);border-radius:8px;align-items:center;gap:10px;padding:8px 10px;display:flex}.swatch-chip{border:1px solid var(--border);border-radius:5px;flex-shrink:0;width:26px;height:26px}.swatch-name{color:var(--text)}.swatch-hex{color:var(--muted);font-variant-numeric:tabular-nums;text-transform:uppercase;margin-left:auto;font-size:11px}.type-pixel{font-family:var(--font-pixel);color:var(--accent);text-shadow:0 0 10px #ffb00066;margin:0;font-size:14px;line-height:1.6}.type-body{max-width:70ch;margin:0}.type-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0}.type-num{font-variant-numeric:tabular-nums;color:var(--text);margin:0}.btn{background:var(--panel-2);color:var(--text);border:1px solid var(--border);font-family:var(--font-mono);cursor:pointer;border-radius:8px;padding:7px 12px;font-size:13px;transition:background .12s,border-color .12s,color .12s}.btn:hover:not(:disabled){border-color:var(--accent-dim)}.btn:disabled{opacity:.45;cursor:not-allowed}.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)}.btn-icon{background:var(--panel-2);color:var(--muted);border:1px solid var(--border);cursor:pointer;border-radius:8px;width:34px;height:34px;transition:color .12s,border-color .12s}.btn-icon:hover{color:var(--accent);border-color:var(--accent-dim)}.add-rule{border:1px dashed var(--border);width:100%;color:var(--muted);font-family:var(--font-mono);cursor:pointer;background:0 0;border-radius:6px;margin-top:12px;padding:8px;font-size:13px;transition:color .12s,border-color .12s;display:block}.add-rule:hover{color:var(--text);border-color:var(--accent)}.input,.select{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::placeholder{color:var(--muted)}.input:focus,.select:focus{border-color:var(--accent)}.slider{accent-color:var(--accent)}.hint{color:var(--muted);margin:12px 0 0;font-size:12px}.chip{background:var(--bg);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:4px 11px;font-size:11px;transition:border-color .12s,color .12s}.chip.on{border-color:var(--accent);color:var(--accent);font-weight:700}.badge{letter-spacing:.06em;border:1px solid var(--border);color:var(--muted);text-transform:uppercase;border-radius:999px;padding:2px 7px;font-size:10px;font-weight:700;display:inline-block}.badge-live{border-color:var(--accent);color:var(--accent)}.badge-featured{border-color:var(--accent);background:var(--accent);color:#000}.badge-wip{border-color:var(--warn);color:var(--warn)}.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;display:grid}.card{background:var(--panel-2);border:1px solid var(--border);border-radius:9px;padding:14px;transition:border-color .12s,box-shadow .12s}.card:hover{border-color:var(--accent-dim)}.card.clickable{cursor:pointer}.card.clickable:hover{border-color:var(--accent);box-shadow:0 0 0 1px #ffb00026,0 0 22px #ffb0000f}.card-title{color:var(--text);margin:0 0 6px;font-size:15px;font-weight:700}.card-desc{color:var(--muted);margin:0;font-size:12.5px}.radbox{background:var(--panel-2);border:1px solid var(--border);width:64px;height:64px;color:var(--muted);font-variant-numeric:tabular-nums;place-items:center;font-size:11px;display:grid}.radbox.pill{width:96px}.notice{border-radius:6px;padding:10px 14px;font-size:12.5px}.notice.warn{color:#ffae85;border:1px solid var(--warn);background:#ff6a2b17}.notice.error{color:var(--danger);background:#ff6b6b14;border:1px solid #ff6b6b66}.scroll-demo{background:var(--panel);border:1px solid var(--border);border-radius:9px;max-height:120px;padding:12px 14px;overflow-y:auto}.scroll-demo p{color:var(--muted);margin:0 0 10px}.foot{border-top:1px solid var(--border);color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:48px;padding-top:22px;font-size:12px;display:flex}.muted{color:var(--muted)}@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}