.icon-button{--tn:var(--color-accent-strong,var(--accent));--tn-h:oklch(from var(--tn) calc(l * .92) c h);--tn-a:oklch(from var(--tn) calc(l * .86) c h);--tn-s:var(--accent-soft);--tn-m:color-mix(in oklab, var(--accent) 22%, transparent);--tn-e:var(--color-accent-text,var(--accent));--tn-b:var(--accent-line);--tn-on:var(--on-accent);--s:28px;--ico:13px;--r:var(--r-md);width:var(--s);height:var(--s);min-width:var(--s);min-height:var(--s);border-radius:var(--r);color:var(--fg-dim);cursor:pointer;box-shadow:none;transition:background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);background:0 0;border:1px solid #0000;flex:none;place-items:center;padding:0;display:inline-grid;position:relative}.icon-button>svg{width:var(--ico);height:var(--ico);display:block}.icon-button[data-size="2xs"],.icon-button[data-size=xs]{--s:22px;--ico:11px;--r:var(--r-sm)}.icon-button[data-size=sm]{--s:25px;--ico:11px;--r:var(--r-sm)}.icon-button[data-size=md]{--s:28px;--ico:13px;--r:var(--r-md)}.icon-button[data-size=lg]{--s:34px;--ico:16px;--r:var(--r-md)}.icon-button[data-size=xl]{--s:42px;--ico:18px;--r:var(--r-lg)}.icon-button[data-shape=circle]{--r:var(--r-pill);border-radius:var(--r-pill)}.icon-button[data-shape=square]{--r:var(--r-xs);border-radius:var(--r-xs)}.icon-button:hover{background:var(--bg-3);color:var(--fg)}.icon-button:active{transform:translateY(.5px)}.icon-button:focus-visible{border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft);outline:none}.icon-button[disabled]:not([aria-busy=true]){opacity:.45;cursor:not-allowed;pointer-events:none}.icon-button[aria-busy=true],.icon-button[disabled][aria-busy=true]{opacity:1;cursor:progress;pointer-events:none}.icon-button[aria-busy=true] .spinner{color:currentColor}.icon-button[aria-pressed=true]{background:var(--tn-s);border-color:var(--tn-b);color:var(--tn-e)}.icon-button[data-v=solid]{background:var(--tn);color:var(--tn-on);box-shadow:var(--shadow-control)}.icon-button[data-v=solid]:hover{background:var(--tn-h);color:var(--tn-on);box-shadow:var(--shadow-control-hover)}.icon-button[data-v=solid]:active{background:var(--tn-a);color:var(--tn-on);box-shadow:var(--shadow-control)}[data-theme=dark] .icon-button[data-v=solid]{box-shadow:var(--shadow-control-dark)}[data-theme=vscode] .icon-button[data-v=solid],[data-theme=vscode] .icon-button[data-v=solid]:hover{box-shadow:none}.icon-button[data-v=soft]{background:var(--tn-s);color:var(--tn-e)}.icon-button[data-v=soft]:hover{background:var(--tn-m);color:var(--tn-e)}.icon-button[data-v=outline]{border-color:var(--tn-b);color:var(--tn-e)}.icon-button[data-v=outline]:hover{background:var(--tn-s);border-color:var(--tn);color:var(--tn-e)}html[data-theme=dark] .icon-button[data-v=soft],html[data-theme=dark] .icon-button[data-v=outline]{color:var(--accent)}html[data-theme=vscode] .icon-button[data-v=soft],html[data-theme=vscode] .icon-button[data-v=outline]{color:var(--color-accent-text,var(--tn-e))}.icon-button[data-v=light]{background:var(--bg-2);border-color:var(--line);color:var(--fg)}.icon-button[data-v=light]:hover{background:var(--bg-3)}.icon-button[data-v=danger]{color:var(--red)}.icon-button[data-v=danger]:hover{background:var(--del-bg);color:var(--red)}html[data-theme=vscode] .icon-button[data-v=danger],html[data-theme=vscode] .icon-button[data-v=danger]:hover{color:color-mix(in oklab, var(--red) 65%, var(--fg))}.icon-button[data-state=done]{color:var(--green)}.icon-button[data-spin]>svg{animation:.7s linear infinite icon-button-spin}.icon-button-badge{border-radius:var(--r-pill);background:var(--red);min-width:13px;height:13px;color:var(--on-accent);font-family:var(--mono);box-shadow:0 0 0 1.5px var(--bg-1);place-items:center;padding:0 3px;font-size:9.5px;display:grid;position:absolute;top:1px;right:1px}.icon-button-dot{background:var(--tn);width:6px;height:6px;box-shadow:0 0 0 1.5px var(--bg-1);border-radius:50%;position:absolute;top:3px;right:3px}@keyframes icon-button-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.icon-button{transition-duration:1ms}.icon-button:hover,.icon-button:active{transform:none}.icon-button[data-spin]>svg{animation:none}}
