.btn{--h:40px;isolation:isolate;height:var(--h);border-radius:var(--r-pill);letter-spacing:-.005em;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:transform .18s var(--ease-out), box-shadow .32s var(--ease-out), background-color .24s var(--ease-out), color .24s, filter .24s;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-size:14px;font-weight:550;display:inline-flex;position:relative;overflow:hidden}.btn svg{flex:none;width:17px;height:17px}.btn-sm{--h:32px;gap:6px;padding:0 13px;font-size:13px}.btn-sm svg{width:15px;height:15px}.btn-lg{--h:54px;gap:10px;padding:0 26px;font-size:15.5px}.btn-lg svg{width:19px;height:19px}.btn-block{width:100%}.btn:active:not(:disabled){transition-duration:80ms;transform:scale(.965)}.btn:disabled{opacity:.5}.btn-primary{color:var(--on-brand);background:linear-gradient(135deg in oklab, color-mix(in oklab, var(--a1) 88%, white), var(--a1) 45%, var(--a2));box-shadow:inset 0 1px 0 #ffffff80, inset 0 -1px 0 #00000038, 0 0 0 1px color-mix(in oklab, var(--a1) 55%, black), 0 10px 28px -10px color-mix(in oklab, var(--a1) 85%, transparent), 0 1px 2px #00000059}.btn-primary:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(120% 90% at 30% 0,#ffffff59,#0000 55%);position:absolute;inset:0}.btn-primary:after{content:"";pointer-events:none;transition:transform .9s var(--ease-out);background:linear-gradient(110deg,#0000 30%,#ffffff8c 48%,#ffffff1a 56%,#0000 70%);position:absolute;inset:0;transform:translate(-130%)}.btn-primary:hover:not(:disabled){filter:saturate(1.12)brightness(1.04);box-shadow:inset 0 1px 0 #ffffff8c, inset 0 -1px 0 #00000038, 0 0 0 1px color-mix(in oklab, var(--a1) 55%, black), 0 14px 40px -10px color-mix(in oklab, var(--a1) 95%, transparent), 0 0 60px -12px color-mix(in oklab, var(--a2) 70%, transparent), 0 1px 2px #00000059}.btn-primary:hover:not(:disabled):after{transform:translate(130%)}.btn-glass{color:var(--ink);background:linear-gradient(180deg, var(--glass-2), var(--glass));-webkit-backdrop-filter:blur(16px)saturate(160%);backdrop-filter:blur(16px)saturate(160%);box-shadow:inset 0 1px 0 var(--hi), inset 0 0 0 1px var(--line), var(--shadow-sm)}.btn-glass:hover:not(:disabled){background:linear-gradient(180deg, color-mix(in oklab, var(--glass-2) 100%, var(--ink) 4%), var(--glass-2));box-shadow:inset 0 1px 0 var(--hi), inset 0 0 0 1px var(--line-2), var(--shadow-md)}.btn-soft{color:var(--a1-text);background:color-mix(in oklab, var(--a1) 14%, transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--a1) 26%, transparent)}.btn-soft:hover:not(:disabled){background:color-mix(in oklab, var(--a1) 22%, transparent)}.btn-ghost{color:var(--ink-2);background:0 0}.btn-ghost:hover:not(:disabled){color:var(--ink);background:var(--glass)}.btn-danger{color:#fff;background:linear-gradient(#f0506e,#d7263d);box-shadow:inset 0 1px #ffffff59,0 0 0 1px #a71d31,0 10px 24px -10px #f0506eb3}.btn-spin{border:2px solid;border-right-color:#0000;border-radius:50%;width:15px;height:15px;animation:.7s linear infinite spin}.ibtn{--s:38px;width:var(--s);height:var(--s);color:var(--ink-2);transition:color .2s, background-color .2s, transform .16s var(--ease-out), box-shadow .24s;border-radius:50%;flex:none;place-items:center;display:inline-grid;position:relative}.ibtn svg{width:18px;height:18px}.ibtn-sm{--s:30px}.ibtn-sm svg{width:16px;height:16px}.ibtn-lg{--s:46px}.ibtn-lg svg{width:20px;height:20px}.ibtn:hover{color:var(--ink);background:var(--glass-2)}.ibtn:active{transform:scale(.92)}.ibtn.is-active{color:var(--a1-text);background:color-mix(in oklab, var(--a1) 16%, transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--a1) 30%, transparent)}.ibtn-glass{background:linear-gradient(180deg, var(--glass-2), var(--glass));-webkit-backdrop-filter:blur(14px)saturate(160%);backdrop-filter:blur(14px)saturate(160%);box-shadow:inset 0 1px 0 var(--hi), inset 0 0 0 1px var(--line)}[data-tip]:after{content:attr(data-tip);z-index:var(--z-popover);white-space:nowrap;color:var(--ink);background:color-mix(in oklab, var(--surface) 92%, black);box-shadow:inset 0 0 0 1px var(--line-2), var(--shadow-md);opacity:0;transition:opacity .14s, transform .18s var(--ease-out);pointer-events:none;border-radius:8px;padding:5px 9px;font-size:12px;font-weight:500;line-height:1.2;position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%,-4px)scale(.96)}[data-tip][data-tip-pos=top]:after{top:auto;bottom:calc(100% + 8px);transform:translate(-50%,4px)scale(.96)}@media (hover:hover){[data-tip]:hover:after{opacity:1;transition-delay:.35s;transform:translate(-50%)scale(1)}}.seg{border-radius:var(--r-pill);background:color-mix(in oklab, var(--ink) 5%, transparent);box-shadow:inset 0 0 0 1px var(--line);scrollbar-width:none;gap:2px;max-width:100%;padding:4px;display:inline-flex;overflow-x:auto}.seg::-webkit-scrollbar{display:none}.seg-opt{border-radius:var(--r-pill);height:34px;color:var(--ink-2);white-space:nowrap;padding:0 14px;font-size:13.5px;font-weight:520;transition:color .2s;position:relative}.seg-sm .seg-opt{height:28px;padding:0 11px;font-size:12.5px}.seg-opt:hover,.seg-opt.is-on{color:var(--ink)}.seg-inner{z-index:1;align-items:center;gap:7px;display:inline-flex;position:relative}.seg-inner svg{width:15px;height:15px}.seg-pill{border-radius:inherit;background:linear-gradient(180deg, color-mix(in oklab, var(--ink) 13%, transparent), color-mix(in oklab, var(--ink) 8%, transparent));box-shadow:inset 0 1px 0 var(--hi), inset 0 0 0 1px var(--line-2), 0 2px 8px -2px rgba(var(--shade), .5);position:absolute;inset:0}.switch-row{cursor:pointer;justify-content:space-between;align-items:center;gap:16px;display:flex}.switch-text{gap:2px;display:grid}.switch-label{font-size:14px;font-weight:520}.switch-hint{color:var(--ink-3);font-size:12.5px}.switch{background:color-mix(in oklab, var(--ink) 14%, transparent);width:42px;height:25px;transition:background .26s var(--ease-out);border-radius:99px;flex:none;position:relative;box-shadow:inset 0 1px 2px #0000004d}.switch.is-on{background:linear-gradient(135deg in oklab, var(--a1), var(--a2));box-shadow:inset 0 1px 1px #ffffff40, 0 0 16px -4px color-mix(in oklab, var(--a1) 80%, transparent)}.switch-knob{width:19px;height:19px;transition:transform .34s var(--ease-spring);background:#fff;border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #00000059,inset 0 -1px #00000014}.switch.is-on .switch-knob{transform:translate(17px)}[dir=rtl] .switch-knob{left:auto;right:3px}[dir=rtl] .switch.is-on .switch-knob{transform:translate(-17px)}.chip{border-radius:var(--r-pill);height:24px;color:var(--ink-2);background:color-mix(in oklab, var(--ink) 6%, transparent);box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap;align-items:center;gap:6px;padding:0 10px;font-size:12px;font-weight:520;display:inline-flex}.chip svg{width:13px;height:13px}.chip-accent{color:var(--a1-text);background:color-mix(in oklab, var(--a1) 13%, transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--a1) 28%, transparent)}.chip-ok{color:#5ee6a8;background:#5ee6a81a;box-shadow:inset 0 0 0 1px #5ee6a840}.chip-warn{color:#ffc26b;background:#ffc26b1a;box-shadow:inset 0 0 0 1px #ffc26b40}html.light .chip-ok{color:#0f7a4a}html.light .chip-warn{color:#9a5b00}.kbd{min-width:20px;height:20px;font-family:var(--font-mono);color:var(--ink-2);background:color-mix(in oklab, var(--ink) 7%, transparent);box-shadow:inset 0 -1px 0 var(--line-2), inset 0 0 0 1px var(--line);border-radius:6px;place-items:center;padding:0 5px;font-size:11px;display:inline-grid}.spinner{border:2px solid color-mix(in oklab, var(--ink) 18%, transparent);border-top-color:var(--a1);border-radius:50%;animation:.7s linear infinite spin;display:inline-block}.field{gap:8px;display:grid}.field-label{color:var(--ink-2);font-size:13px;font-weight:560}.input{border-radius:var(--r-md);width:100%;height:44px;color:var(--ink);background:color-mix(in oklab, var(--ink) 5%, transparent);box-shadow:inset 0 0 0 1px var(--line);border:0;outline:none;padding:0 14px;transition:box-shadow .2s}.input:focus{box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--a1) 70%, transparent), 0 0 0 4px color-mix(in oklab, var(--a1) 18%, transparent)}.input::placeholder{color:var(--ink-3)}textarea.input{resize:none;height:auto;min-height:44px;padding:11px 14px;line-height:1.5}
