.tone-light{--bg:#f4f4f5;--bg-2:#ececee;--surface:#fff;--surface-hover:#fafafa;--elevated:#f7f7f8;--void:#f1f1f3;--fg:#0d0d0f;--fg-2:#5e5e66;--fg-3:#8e8e96;--ink:#161618;--ink-fg:#fff;--hover:#0000000b;--hover-strong:#00000014;--line:#00000012;--line-strong:#0000001f;--edge:#ffffffe6;--glass-fill:#fff9;--shadow-card:0 1px 2px #0000000a, 0 8px 24px -12px #0000001f;--shadow-float:0 1px 2px #0000000f, 0 18px 40px -16px #00000038;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.tone-dark{--bg:#08080a;--bg-2:#0e0e11;--surface:#121215;--surface-hover:#16161a;--elevated:#1a1a1e;--void:#0a0a0c;--fg:#f2f2f3;--fg-2:#a0a0a8;--fg-3:#6b6b73;--ink:#f2f2f3;--ink-fg:#0a0a0c;--hover:#ffffff0f;--hover-strong:#ffffff1a;--line:#ffffff12;--line-strong:#ffffff1f;--edge:#ffffff0f;--glass-fill:#16161a9e;--shadow-card:0 1px 2px #00000080, 0 12px 32px -16px #000000b3;--shadow-float:0 1px 2px #00000080, 0 24px 56px -20px #000000d9;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.tone-light,.tone-dark{--ondai-bg:var(--bg);--ondai-surface:var(--surface);--ondai-elevated:var(--elevated);--ondai-text:var(--fg);--ondai-text-secondary:var(--fg-2);--ondai-text-tertiary:var(--fg-3);--ondai-hairline:var(--line);--ondai-hairline-strong:var(--line-strong);color:var(--fg)}:root,.tone-light{--ui-thumb:var(--surface);--ui-thumb-ring:var(--line);--ui-track:var(--hover)}.dark,.tone-dark{--ui-thumb:var(--hover-strong);--ui-thumb-ring:var(--line-strong);--ui-track:#ffffff0a}.ui-ind{pointer-events:none;position:absolute;top:0;left:0}.ui-ind[data-animate=true]{transition:transform .42s var(--ease-out), width .42s var(--ease-out), height .42s var(--ease-out), opacity .2s}@media (prefers-reduced-motion:reduce){.ui-ind[data-animate=true]{transition:none}}.seg{border-radius:var(--r-md);background:var(--ui-track);max-width:100%;box-shadow:inset 0 0 0 1px var(--line);isolation:isolate;flex-wrap:wrap;gap:2px;padding:3px;display:inline-flex;position:relative}.seg-thumb{z-index:0;border-radius:calc(var(--r-md) - 3px);background:var(--ui-thumb);box-shadow:inset 0 0 0 1px var(--ui-thumb-ring), 0 1px 2px #0000000f, 0 2px 6px -2px #00000014}.seg-item{z-index:1;border-radius:calc(var(--r-md) - 3px);height:28px;color:var(--fg-2);white-space:nowrap;padding-inline:11px;font-size:13px;font-weight:500;transition:color .2s;position:relative}.seg-item:hover,.seg-item[aria-checked=true]{color:var(--fg)}.seg[data-size=sm] .seg-item{height:26px;padding-inline:9px;font-size:12.5px}.ui-switch{background:var(--hover-strong);width:36px;height:22px;box-shadow:inset 0 0 0 1px var(--line);border-radius:8px;flex:none;transition:background-color .2s;position:relative}.ui-switch:after{content:"";background:var(--surface);width:16px;height:16px;transition:transform .3s var(--ease-out);border-radius:5px;position:absolute;top:3px;left:3px;box-shadow:0 1px 2px #0003}.dark .ui-switch:after{background:var(--fg-2)}.ui-switch[aria-checked=true]{background:var(--ink)}.ui-switch[aria-checked=true]:after{background:var(--ink-fg);transform:translate(14px)}.ui-range{appearance:none;cursor:pointer;background:0 0;height:22px}.ui-range::-webkit-slider-runnable-track{background:linear-gradient(var(--ink), var(--ink)) 0 / var(--fill,50%) 100% no-repeat, var(--hover-strong);border-radius:2px;height:4px}.ui-range::-moz-range-track{background:var(--hover-strong);border-radius:2px;height:4px}.ui-range::-moz-range-progress{background:var(--ink);border-radius:2px;height:4px}.ui-range::-webkit-slider-thumb{-webkit-appearance:none;background:var(--surface);width:14px;height:14px;box-shadow:inset 0 0 0 1px var(--line-strong), 0 1px 3px #0003;border-radius:4px;margin-top:-5px}.ui-range::-moz-range-thumb{background:var(--surface);width:14px;height:14px;box-shadow:inset 0 0 0 1px var(--line-strong), 0 1px 3px #0003;border:0;border-radius:4px}.ui-card{border-radius:var(--r-card);background:var(--surface);min-width:0;box-shadow:inset 0 0 0 1px var(--line), var(--shadow-card);position:relative}.ui-input{border-radius:var(--r-btn);background:var(--surface);width:100%;height:36px;box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--fg);padding-inline:12px;font-size:13.5px;transition:box-shadow .2s}.ui-input::placeholder{color:var(--fg-3)}.ui-input:focus{box-shadow:inset 0 0 0 1px var(--fg-3), 0 0 0 3px var(--hover-strong);outline:none}.ui-icon-btn{border-radius:var(--r-btn);width:32px;height:32px;color:var(--fg-2);justify-content:center;align-items:center;transition:color .15s,background-color .15s;display:inline-flex}.ui-icon-btn:hover{color:var(--fg);background:var(--hover)}.ui-kbd{background:var(--hover);height:20px;box-shadow:inset 0 0 0 1px var(--line);font-family:var(--font-mono);color:var(--fg-3);border-radius:5px;align-items:center;padding-inline:6px;font-size:11px;display:inline-flex}.ui-title{letter-spacing:-.03em;text-wrap:balance;font-size:clamp(34px,4.2vw,52px);font-weight:560;line-height:1.05}.ui-sub{color:var(--fg-2);text-wrap:pretty;font-size:16px;line-height:1.5}@media (min-width:640px){.ui-sub{font-size:17px}}@media (pointer:coarse){.seg-item,.seg[data-size=sm] .seg-item{height:36px}.prose figure button,.prose :is(h2,h3,h4)>button{min-width:36px;min-height:36px}}
