:root[data-surface=editor] :is(.tk-btn--default,.tk-btn--outline,.tk-btn--secondary,.tk-btn--destructive,.tk-select-trigger){--kd: 3px;--kf: var(--key-face);--ke: var(--key-edge);--key-rest: 0 var(--kd) 0 var(--ke), 0 0 0 1px var(--key-ring), 0 calc(var(--kd) + 4px) 10px -6px var(--key-shadow), inset 0 1px 0 var(--key-highlight), inset 0 -1px 0 var(--key-bottom);--key-up: 0 calc(var(--kd) + 1px) 0 var(--ke), 0 0 0 1px var(--key-ring), 0 calc(var(--kd) + 6px) 12px -6px var(--key-shadow), inset 0 1px 0 var(--key-highlight), inset 0 -1px 0 var(--key-bottom);--key-down: 0 0 0 var(--ke), 0 0 0 1px var(--key-ring), var(--key-press-inset);--key-latched: 0 1px 0 var(--ke), 0 0 0 1px var(--key-ring), var(--key-press-inset);--grain-o: var(--grain-key);position:relative;isolation:isolate;border-color:transparent;background-color:var(--kf);background-image:linear-gradient(to bottom,var(--key-sheen),transparent 70%);box-shadow:var(--key-rest);transform:translateY(0);transition:transform var(--dur-key-out) var(--ease-spring),box-shadow var(--dur-key-out) var(--ease-spring),background-color var(--dur-press) var(--ease-press),color var(--dur-press) var(--ease-press);-webkit-tap-highlight-color:transparent}:root[data-surface=editor] :is(.tk-btn--default,.tk-btn--outline,.tk-btn--secondary,.tk-btn--destructive,.tk-select-trigger):hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--key-up)}:root[data-surface=editor] :is(.tk-btn--default,.tk-btn--outline,.tk-btn--secondary,.tk-btn--destructive,.tk-select-trigger):is([aria-pressed=true],[aria-expanded=true],[data-state=open],[data-state=on]):not(:disabled){transform:translateY(calc(var(--kd) - 1px));box-shadow:var(--key-latched);transition-duration:90ms,90ms,var(--dur-press),var(--dur-press)}:root[data-surface=editor] :is(.tk-btn--default,.tk-btn--outline,.tk-btn--secondary,.tk-btn--destructive,.tk-select-trigger):active:not(:disabled){transform:translateY(var(--kd));box-shadow:var(--key-down);transition-duration:var(--dur-key-in);transition-timing-function:ease-out}:root[data-surface=editor] :is(.tk-btn--default,.tk-btn--outline,.tk-btn--secondary,.tk-btn--destructive,.tk-select-trigger,.tk-tab):after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background-image:var(--grain);background-size:256px 256px;opacity:var(--grain-o, var(--grain-key));pointer-events:none}:root[data-surface=editor] :is(.tk-btn--default,.tk-btn--destructive){--grain-o: var(--grain-dark)}:root[data-surface=editor] .tk-tab{--grain-o: var(--grain-key);position:relative;isolation:isolate}:root[data-surface=editor] .tk-tab[data-state=active]{--grain-o: var(--grain-dark)}:root[data-surface=editor] .tk-btn--default{--kf: var(--sig-fill);--ke: var(--key-primary-edge);--key-highlight: rgb(255 255 255 / .28);color:#fff}:root[data-surface=editor] .tk-btn--default:hover:not(:disabled){--kf: color-mix(in srgb, var(--sig-fill) 88%, white)}:root[data-surface=editor] .tk-btn--destructive{--kf: var(--destructive);--ke: color-mix(in srgb, var(--destructive) 58%, #000);--key-highlight: rgb(255 255 255 / .25);color:#fff}:root[data-surface=editor] .tk-btn--destructive:hover:not(:disabled){--kf: color-mix(in srgb, var(--destructive) 88%, white)}:root[data-surface=editor] :is(.tk-btn--outline,.tk-btn--secondary){color:var(--text-primary)}:root[data-surface=editor] :is(.tk-btn--outline,.tk-btn--secondary):is([aria-pressed=true],[data-state=on]){--kf: color-mix(in srgb, var(--sig-fill) 9%, var(--key-face));color:var(--sig-bright)}:root[data-surface=editor] .tk-btn--sm{--kd: 2px}:root[data-surface=editor] .tk-btn--ghost{transform:translateY(0);transition:transform var(--dur-key-out) var(--ease-spring),box-shadow var(--dur-key-out) var(--ease-spring),background-color var(--dur-press) var(--ease-press),color var(--dur-press) var(--ease-press)}:root[data-surface=editor] .tk-btn--ghost:is([aria-pressed=true],[aria-expanded=true],[data-state=open],[data-state=on]){box-shadow:inset 0 1px 3px var(--key-inset)}:root[data-surface=editor] .tk-btn--ghost:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 1px 3px var(--key-inset);transition-duration:var(--dur-key-in);transition-timing-function:ease-out}:root[data-surface=editor] .tk-select-trigger{color:var(--text-primary)}:root[data-surface=editor] .tk-select-trigger>svg{color:var(--meta);opacity:1}:root[data-surface=editor] .tk-switch{width:40px;height:22px;padding:0;border:0;border-radius:11px;background:var(--key-tray);box-shadow:var(--key-tray-shadow);transition:background-color var(--dur-press) var(--ease-press)}:root[data-surface=editor] .tk-switch[data-state=checked]{background:var(--sig-fill);box-shadow:inset 0 2px 3px #00000040}:root[data-surface=editor] .tk-switch-thumb{position:relative;width:20px;height:16px;border-radius:8px;background:var(--key-face);box-shadow:0 2px 0 var(--key-edge),0 0 0 1px var(--key-ring),0 3px 5px -2px var(--key-shadow);translate:none;transform:translate(2px,-1px);transition:transform var(--dur-key-out) var(--ease-spring)}:root[data-surface=editor] .tk-switch-thumb:after{content:"";position:absolute;inset:4px 6px;border-radius:1px;background:repeating-linear-gradient(90deg,var(--key-edge) 0 1.5px,transparent 1.5px 3.5px)}:root[data-surface=editor] .tk-switch-thumb[data-state=checked]{transform:translate(18px,-1px)}:root[data-surface=editor] .tk-slider-track{height:8px;border-radius:4px;background:var(--key-tray);box-shadow:var(--key-tray-shadow)}:root[data-surface=editor] .tk-slider-range{background:var(--sig-fill);box-shadow:inset 0 1px 1px #0003}:root[data-surface=editor] .tk-slider-thumb{position:relative;width:18px;height:18px;border:0;border-radius:50%;background:var(--key-face);background-image:linear-gradient(to bottom,var(--key-sheen),transparent 70%);box-shadow:0 2px 0 var(--key-edge),0 0 0 1px var(--key-ring),0 4px 8px -4px var(--key-shadow),inset 0 1px 0 var(--key-highlight);cursor:grab;transform:translateY(-1px);transition:transform var(--dur-key-out) var(--ease-spring),box-shadow var(--dur-key-out) var(--ease-spring)}:root[data-surface=editor] .tk-slider-thumb:after{content:"";position:absolute;top:5px;left:50%;width:2px;height:8px;margin-left:-1px;border-radius:1px;background:var(--sig-bright)}:root[data-surface=editor] .tk-slider:active .tk-slider-thumb{cursor:grabbing;transform:translateY(0);box-shadow:0 1px 0 var(--key-edge),0 0 0 1px var(--key-ring),0 2px 4px -2px var(--key-shadow),inset 0 1px 0 var(--key-highlight);transition-duration:var(--dur-key-in);transition-timing-function:ease-out}:root[data-surface=editor] .tk-tabs{gap:3px;height:auto;padding:3px;border-radius:9999px;background:transparent;box-shadow:inset 0 0 0 1px var(--field-border)}:root[data-surface=editor] .tk-tab{--kd: 2px;height:26px;border-radius:9999px;background:var(--key-face);color:var(--text-secondary);font-weight:600;box-shadow:0 var(--kd) 0 var(--key-edge),0 0 0 1px var(--key-ring),inset 0 1px 0 var(--key-highlight),inset 0 -1px 0 var(--key-bottom);transform:translateY(-1px);transition:transform var(--dur-key-out) var(--ease-spring),box-shadow var(--dur-key-out) var(--ease-spring),background-color var(--dur-press) var(--ease-press),color var(--dur-press) var(--ease-press)}:root[data-surface=editor] .tk-tab:hover{color:var(--text-primary);transform:translateY(-2px);box-shadow:0 calc(var(--kd) + 1px) 0 var(--key-edge),0 0 0 1px var(--key-ring),inset 0 1px 0 var(--key-highlight),inset 0 -1px 0 var(--key-bottom)}:root[data-surface=editor] .tk-tab:is([data-state=active],:active){transform:translateY(var(--kd));box-shadow:0 0 0 1px var(--key-ring),var(--key-press-inset);transition-duration:70ms,70ms,var(--dur-press),var(--dur-press)}:root[data-surface=editor] .tk-tab[data-state=active]{background:var(--sig-fill);color:#fff;box-shadow:0 0 0 1px var(--key-primary-edge),inset 0 2px 3px #00000040}:root[data-surface=editor] :is(.tk-btn,.tk-select-trigger,.tk-switch,.tk-slider-thumb,.tk-tab):focus-visible{outline:2px solid var(--sig-bright);outline-offset:2px}
