@import "https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&display=swap";:root{--color-bg:#0f0f0f;--color-surface:#171717;--color-border:#2a2a2a;--color-text:#e5e5e5;--color-muted:#737373;--text-label:.75rem;--text-ui:.875rem;--font-mono:"Space Mono", ui-monospace, monospace}[data-theme=light]{--color-bg:#f4ead8;--color-surface:#ece0c8;--color-border:#c8b898;--color-text:#2a1a0a;--color-muted:#7a6040}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background:0 0;justify-content:center;align-items:center;width:100%;height:100%;display:flex;overflow:hidden}html.abcs-dev body{background:var(--color-bg)}.abcs-dev-toggle{z-index:9999;border:1px solid var(--color-border);cursor:pointer;font-family:var(--font-mono);color:var(--color-muted);letter-spacing:.06em;background:0 0;border-radius:4px;padding:4px 8px;font-size:11px;transition:color .15s,border-color .15s;position:fixed;top:12px;left:12px}.abcs-dev-toggle:hover{color:var(--color-text);border-color:var(--color-text)}.abcs-frame{aspect-ratio:1;width:min(100vw,100vh,1080px);font-family:var(--font-mono);color:var(--color-text);background:0 0;position:relative;overflow:hidden}.abcs-frame canvas{display:block;width:100%!important;height:100%!important}.abcs-label{pointer-events:none;font-family:var(--font-mono);letter-spacing:.06em;line-height:1;position:absolute}.abcs-label--index{font-size:var(--text-label);color:var(--color-muted);font-variant-numeric:tabular-nums;font-weight:700;top:24px;right:24px}.abcs-label--technique{writing-mode:vertical-rl;font-size:var(--text-label);text-transform:lowercase;color:var(--color-text);font-weight:400;top:50%;left:24px;transform:translateY(-50%)rotate(180deg)}.abcs-label--bottom{pointer-events:none;flex-direction:column;gap:6px;display:flex;position:absolute;bottom:24px;left:24px}.abcs-label__font{font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.06em;text-transform:uppercase;color:var(--color-text);font-weight:700}.abcs-label__url{font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.04em;color:var(--color-muted);pointer-events:all;font-weight:400;text-decoration:none}.abcs-label__url:hover{color:var(--color-text)}.abcs-controls{z-index:10;border-top:1px solid var(--color-border);background:#0f0f0fe0;flex-direction:column;gap:6px;padding:8px 20px 12px;display:flex;position:absolute;bottom:0;left:0;right:0}[data-theme=light] .abcs-controls{background:#f4ead8eb}.abcs-controls__header{font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.1em;text-transform:uppercase;color:var(--color-muted);font-weight:700;line-height:1}.abcs-controls__row{grid-template-columns:72px 1fr 40px;align-items:center;gap:10px;display:grid}.abcs-controls__key{font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.06em;text-transform:uppercase;color:var(--color-text);font-weight:400;line-height:1}.abcs-controls__val{font-family:var(--font-mono);font-size:var(--text-label);color:var(--color-muted);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1}.abcs-controls__slider{appearance:none;cursor:pointer;background:0 0;border:none;outline:none;width:100%;height:16px}.abcs-controls__slider::-webkit-slider-runnable-track{border-radius:2px;height:3px}.abcs-controls__slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--color-text);border-radius:50%;width:11px;height:11px;margin-top:-4px;transition:transform .1s}.abcs-controls__slider:hover::-webkit-slider-thumb{transform:scale(1.35)}.abcs-controls__slider::-moz-range-track{border-radius:2px;height:3px}.abcs-controls__slider::-moz-range-thumb{background:var(--color-text);border:none;border-radius:50%;width:11px;height:11px}.abcs-controls__slider--hue::-webkit-slider-runnable-track{background:linear-gradient(90deg,red,#ff8000,#ff0,#80ff00,#0f0,#00ff80,#0ff,#0080ff,#00f,#8000ff,#f0f,#ff0080,red)}.abcs-controls__slider--hue::-moz-range-track{background:linear-gradient(90deg,red,#ff8000,#ff0,#80ff00,#0f0,#00ff80,#0ff,#0080ff,#00f,#8000ff,#f0f,#ff0080,red)}.abcs-controls__slider--intensity::-webkit-slider-runnable-track{background:linear-gradient(to right, #111, var(--color-text))}.abcs-controls__slider--intensity::-moz-range-track{background:linear-gradient(to right, #111, var(--color-text))}