:root{color-scheme:dark;accent-color:#f26522;--primary: #f26522;--primary-hover: #fa8c46;--surface: #202020;--surface-alt: #191919;--text-muted: #a8a29e;--background-body: #0d0d0d;--background: var(--surface);--background-alt: var(--surface-alt);--text-main: #e6e6f0;--text-bright: #fffeff;--links: var(--primary);--focus: rgba(242, 101, 34, .6);--border: #333333;--button-base: var(--primary);--button-hover: var(--primary-hover);--form-text: #e6e6f0;--form-placeholder: #6f6f78;--selection: rgba(242, 101, 34, .4);--code: #f6b88a;--scrollbar-thumb: #333333;--scrollbar-thumb-hover: #444444;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 2rem;--space-xl: 4rem;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.25rem;--text-xl: 1.75rem;--radius: 8px;--shadow: 0 2px 8px rgba(0, 0, 0, .2)}[hidden]{display:none!important}mark{background-color:#f7b27a;color:#1a1a1a}meter::-webkit-meter-bar{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius)}meter::-webkit-meter-optimum-value,meter::-webkit-meter-suboptimum-value,meter::-webkit-meter-even-less-good-value{background:var(--primary)}meter::-moz-meter-bar{background:var(--primary)}button,input,select,textarea{border-radius:var(--radius);transition:border-color .15s ease,box-shadow .15s ease,background-color .15s ease}button{font-weight:600}pre{border-radius:var(--radius)}code,kbd{border-radius:5px}progress,meter{border-radius:999px}progress::-webkit-progress-bar{background:var(--surface-alt);border-radius:999px}progress::-webkit-progress-value{background:var(--primary);border-radius:999px}progress::-moz-progress-bar{background:var(--primary)}meter::-webkit-meter-bar,meter::-webkit-meter-optimum-value{border-radius:999px}h1,h2{letter-spacing:-.02em}.lang-picker{position:fixed;top:var(--space-sm);right:var(--space-sm);z-index:10}.lang-picker select{margin:0;padding:2px var(--space-sm);background:#000;color:#fff;border:1px solid #888;border-radius:var(--radius);font-size:.75rem;line-height:1.5;text-align:center;text-align-last:center;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:none;transition:border-color .2s}.lang-picker select option{text-align:center}.lang-picker select:hover,.lang-picker select:focus{border-color:#fff}html{color-scheme:light}html,body{background:#fff;color:#1d1d1f;min-height:100%;overflow-x:hidden}body{margin:0;padding:0;box-sizing:border-box;max-width:none}h1{color:#1d1d1f;margin-top:0}main{max-width:1160px;min-height:100vh;margin:0 auto;box-sizing:border-box;padding:var(--space-md) var(--space-md) var(--space-lg);display:flex;flex-direction:column;justify-content:center}.layout{display:flex;flex-wrap:wrap;align-items:flex-start;gap:24px;margin-top:20px}.layout .panel{flex:1 1 460px;margin-top:0}.layout .usage{flex:1 1 380px;margin-top:0}.lede{color:#555;font-size:1.02rem;line-height:1.45;margin:.6em 0}.lede code,.usage p code{background:#f0f0f2;color:#c0392b;padding:1px 6px;border-radius:5px}.panel{background:#f7f7f8;border:1px solid #e6e6e9;border-radius:12px;padding:18px 26px 20px;margin-top:20px;color:#1d1d1f;box-shadow:0 1px 3px #0000000f}.panel strong{color:#1d1d1f}.panel>p:first-child{margin-top:0}.controls{display:grid;grid-template-columns:max-content 1fr 5ch;align-items:center;gap:8px 18px;margin-top:12px}.controls .lbl{font-size:.92rem;color:#3a3a3c;white-space:nowrap}.controls input[type=range]{width:100%;margin:0;accent-color:#e1251b}.controls input[type=color]{width:46px;height:28px;padding:0;border:1px solid #ccc;border-radius:6px;background:none;justify-self:start;cursor:pointer}.controls .val{font-variant-numeric:tabular-nums;color:#e1251b;text-align:right;font-size:.9rem}.buttons{margin-top:16px;display:flex;gap:10px}.buttons button{margin:0;background:#e1251b;color:#fff;border:none;padding:10px 18px;border-radius:8px;cursor:pointer;font-size:.95rem}.buttons button:hover{background:#c01f15}.buttons button.active{background:#1d1d1f}.buttons button.active:hover{background:#000}.usage{margin-top:18px;background:transparent;border:0;padding:0}.usage h2{color:#1d1d1f;font-weight:600;font-size:1.05rem;margin:0 0 10px}.usage pre{background:#1d1d1f;color:#e8e8e8;padding:16px 18px;border-radius:12px;overflow-x:auto;font-size:.82rem;margin:0}.usage pre code{background:none;color:inherit;padding:0}.controls input[type=checkbox]{width:18px;height:18px;margin:0;justify-self:start;accent-color:#e1251b;cursor:pointer}.target-layer{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9998}.target-layer .marker{position:absolute;line-height:0;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}@media(max-width:600px){main{padding:var(--space-sm);justify-content:flex-start;padding-top:var(--space-md)}h1{font-size:1.5rem}.lede,.usage{display:none}.panel{padding:14px 16px 16px;margin-top:14px;border-radius:10px}.panel>p:first-child{font-size:.9rem}.controls{gap:9px 12px;margin-top:10px;grid-template-columns:max-content 1fr 4ch}.controls .lbl,.controls .val{font-size:.82rem}.buttons{margin-top:14px;flex-wrap:wrap}.buttons button{flex:1 1 auto;padding:11px 14px;font-size:.9rem}}@media(max-height:560px){.lede,.usage{display:none}main{justify-content:flex-start;padding-top:var(--space-sm)}.panel{margin-top:10px;padding:12px 16px 14px}.controls{gap:7px 12px;margin-top:8px}.buttons{margin-top:10px}}