/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.macro-overview[data-v-f9a187e3] {
  grid-template-rows: auto 1fr;
  display: grid;
  position: relative;
}
.macro-overview[data-v-f9a187e3]:after {
  top: calc(var(--spacing, .25rem) * 0);
  background-color: var(--color-slate-600, oklch(.446 .043 257.281));
  --tw-content: "";
  content: var(--tw-content);
  width: 1px;
  height: 100%;
  position: absolute;
  left: 100%;
}
.macro-overview .macro-overview__list[data-v-f9a187e3] {
  align-content: flex-start;
  gap: calc(var(--spacing, .25rem) * 1);
  display: grid;
}
.macro-overview .macro-item[data-v-f9a187e3] {
  align-items: center;
  display: flex;
}
.macro-overview .macro-item button[data-v-f9a187e3] {
  width: 100%;
}
@property --tw-content {
  syntax: "*";
  inherits: false;
  initial-value: "";
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
kbd {
  height: calc(var(--spacing, .25rem) * 9);
  align-items: center;
  gap: calc(var(--spacing, .25rem) * 2);
  border-radius: var(--radius-md, .375rem);
  border-style: var(--tw-border-style);
  border-width: 1px;
  border-color: var(--color-slate-500, oklch(.554 .046 257.417));
  background-color: var(--color-slate-700, oklch(.372 .044 257.287));
  padding-block: calc(var(--spacing, .25rem) * 1);
  padding-right: calc(var(--spacing, .25rem) * 2);
  padding-left: calc(var(--spacing, .25rem) * 4);
  font-family: var(--font-mono, "Fira Code", monospace);
  font-size: var(--text-lg, 1.125rem);
  line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
  --tw-font-weight: var(--font-weight-bold, 700);
  font-weight: var(--font-weight-bold, 700);
  white-space: nowrap;
  color: var(--color-white, #fff);
  text-transform: uppercase;
  --tw-shadow-color: var(--color-slate-500, oklch(.554 .046 257.417));
  transition-property: all;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
  transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
  box-shadow: 0 .2rem 0 .2rem var(--tw-shadow-color);
  display: flex;
}
kbd:has(sup) {
  padding-left: calc(var(--spacing, .25rem) * 2);
}
kbd sup {
  margin-top: calc(var(--spacing, .25rem) * 1);
  font-size: var(--text-xs, .75rem);
  line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));
  --tw-font-weight: var(--font-weight-light, 300);
  font-weight: var(--font-weight-light, 300);
  color: var(--color-slate-200, oklch(.929 .013 255.508));
}
kbd span.dir {
  padding-left: calc(var(--spacing, .25rem) * 1);
  color: var(--color-slate-200, oklch(.929 .013 255.508));
}
kbd.empty {
  cursor: pointer;
  border-color: var(--color-sky-300, oklch(.828 .111 230.318));
  background-color: color-mix(in oklab, var(--color-sky-400, oklch(.746 .16 232.661)) 50%, transparent);
  padding-right: calc(var(--spacing, .25rem) * 3);
  padding-left: calc(var(--spacing, .25rem) * 3);
  --tw-tracking: var(--tracking-widest, .1em);
  letter-spacing: var(--tracking-widest, .1em);
  --tw-shadow-color: var(--color-sky-600, oklch(.588 .158 241.966));
}
kbd.insert {
  cursor: pointer;
  border-color: var(--color-yellow-300, oklch(.905 .182 98.111));
  background-color: color-mix(in oklab, var(--color-yellow-500, oklch(.795 .184 86.047)) 50%, transparent);
  --tw-shadow-color: var(--color-yellow-600, oklch(.681 .162 75.834));
}
:has(kdb):not(.edit) kbd {
  pointer-events: none;
  cursor: default;
}
.edit kbd {
  pointer-events: auto;
  cursor: pointer;
}
.edit kbd:hover, .edit kbd.active {
  border-color: var(--color-sky-400, oklch(.746 .16 232.661));
  background-color: var(--color-sky-900, oklch(.391 .09 240.876));
  --tw-shadow-color: var(--color-sky-700, oklch(.5 .134 242.749));
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
span.delay[data-v-05e04cbb] {
  cursor: default;
  border-radius: var(--radius-sm, .25rem);
  border-style: var(--tw-border-style);
  border-width: 1px;
  border-color: var(--color-slate-400, oklch(.704 .04 256.788));
  background-color: var(--color-slate-500, oklch(.554 .046 257.417));
  padding-inline: calc(var(--spacing, .25rem) * 2);
  padding-block: calc(var(--spacing, .25rem) * 1);
  font-family: var(--font-sans, "Roboto", sans-serif);
  font-size: var(--text-sm, .875rem);
  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));
  --tw-font-weight: var(--font-weight-semibold, 600);
  font-weight: var(--font-weight-semibold, 600);
  color: var(--color-slate-950, oklch(.129 .042 264.695));
  align-items: center;
  display: flex;
}
span.delay.preset[data-v-05e04cbb] {
  border-color: color-mix(in oklab, var(--color-amber-300, oklch(.879 .169 91.605)) 80%, transparent);
  background-color: color-mix(in oklab, var(--color-amber-100, oklch(.962 .059 95.617)) 60%, transparent);
  color: var(--color-amber-400, oklch(.828 .189 84.429));
}
span.delay i[data-v-05e04cbb] {
  padding-left: calc(var(--spacing, .25rem) * 1);
  --tw-font-weight: var(--font-weight-normal, 400);
  font-weight: var(--font-weight-normal, 400);
  opacity: .8;
  font-style: normal;
}
.edit span.delay[data-v-05e04cbb] {
  cursor: pointer;
}
.edit span.delay[data-v-05e04cbb]:hover, .edit span.delay.active[data-v-05e04cbb] {
  border-color: var(--color-lime-500, oklch(.768 .233 130.85));
  background-color: var(--color-lime-700, oklch(.532 .157 131.589));
  color: var(--color-lime-200, oklch(.938 .127 124.321));
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.macro-recorder__output[data-v-33cbf1af] {
  top: calc(var(--spacing, .25rem) * 0);
  left: calc(var(--spacing, .25rem) * 0);
  align-items: center;
  row-gap: calc(var(--spacing, .25rem) * 4);
  height: fit-content;
  padding: calc(var(--spacing, .25rem) * 4);
  flex-wrap: wrap;
  display: flex;
  position: absolute;
}
hr.spacer[data-v-33cbf1af]:last-of-type {
  display: none;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.recorder-input__container[data-v-9a99c4ac], .macro-recorder__input[data-v-9a99c4ac] {
  inset: calc(var(--spacing, .25rem) * 0);
  opacity: 0;
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
}
:is(.recorder-input__container, .macro-recorder__input).record[data-v-9a99c4ac] {
  display: block;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.context-menu {
  position: relative;
}
.context-menu .context-menu__content {
  pointer-events: none;
  z-index: 50;
  margin-top: calc(var(--spacing, .25rem) * 2);
  --tw-translate-y: -100%;
  min-width: 100%;
  translate: var(--tw-translate-x) var(--tw-translate-y);
  border-radius: var(--radius-md, .375rem);
  border-style: var(--tw-border-style);
  border-width: 1px;
  border-color: color-mix(in oklab, var(--color-white, #fff) 50%, transparent);
  background-color: color-mix(in oklab, var(--color-slate-100, oklch(.968 .007 247.896)) 60%, transparent);
  color: var(--color-slate-800, oklch(.279 .041 260.031));
  opacity: 0;
  --tw-backdrop-blur: blur(var(--blur-3xl, 64px));
  -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
  backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
  transition-property: all;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
  transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
  display: grid;
  position: absolute;
  top: 100%;
}
.context-menu .context-menu__content.open {
  pointer-events: auto;
  --tw-translate-y: calc(var(--spacing, .25rem) * 0);
  translate: var(--tw-translate-x) var(--tw-translate-y);
  opacity: 1;
}
.context-menu ul {
  color: var(--color-slate-800, oklch(.279 .041 260.031));
}
:where(.context-menu ul > :not(:last-child)) {
  --tw-divide-y-reverse: 0;
  border-bottom-style: var(--tw-border-style);
  border-top-style: var(--tw-border-style);
  border-top-width: calc(1px * var(--tw-divide-y-reverse));
  border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
  border-color: var(--color-slate-300, oklch(.869 .022 252.894));
}
.context-menu ul li {
  cursor: pointer;
  align-items: center;
  gap: calc(var(--spacing, .25rem) * 2);
  padding: calc(var(--spacing, .25rem) * 2);
  display: flex;
}
@media (hover: hover) {
.context-menu ul li:hover {
    background-color: color-mix(in oklab, var(--color-black, #000) 10%, transparent);
}
}
.context-menu ul li svg {
  width: calc(var(--spacing, .25rem) * 5);
  height: calc(var(--spacing, .25rem) * 5);
}
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-backdrop-blur {
  syntax: "*";
  inherits: false
}
@property --tw-backdrop-brightness {
  syntax: "*";
  inherits: false
}
@property --tw-backdrop-contrast {
  syntax: "*";
  inherits: false
}
@property --tw-backdrop-grayscale {
  syntax: "*";
  inherits: false
}
@property --tw-backdrop-hue-rotate {
  syntax: "*";
  inherits: false
}
@property --tw-backdrop-invert {
  syntax: "*";
  inherits: false
}
@property --tw-backdrop-opacity {
  syntax: "*";
  inherits: false
}
@property --tw-backdrop-saturate {
  syntax: "*";
  inherits: false
}
@property --tw-backdrop-sepia {
  syntax: "*";
  inherits: false
}
@property --tw-divide-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */

/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
button.selected[data-v-601167b6] {
  background-color: var(--color-sky-500, oklch(.685 .169 237.323));
  --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  --tw-ring-color: var(--color-sky-500, oklch(.685 .169 237.323));
  --tw-ring-offset-width: 1px;
  --tw-ring-offset-shadow: var(--tw-ring-inset, ) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */

/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */

/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.insert-output[data-v-d2aab140] {
  margin-bottom: calc(var(--spacing, .25rem) * 4);
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
}
.insert-key__direction[data-v-d2aab140] {
  margin-top: calc(var(--spacing, .25rem) * 6);
  justify-content: center;
  gap: calc(var(--spacing, .25rem) * 2);
  display: flex;
}
button.selected[data-v-d2aab140] {
  background-color: var(--color-sky-500, oklch(.685 .169 237.323));
  --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  --tw-ring-color: var(--color-sky-500, oklch(.685 .169 237.323));
  --tw-ring-offset-width: 1px;
  --tw-ring-offset-shadow: var(--tw-ring-inset, ) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.macro-edit__dialogs[data-v-bf9e32be] {
  flex-grow: 1;
  justify-content: flex-end;
  display: flex;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.macro-recorder__header[data-v-19251359] {
  gap: calc(var(--spacing, .25rem) * 4);
  width: 100%;
  display: grid;
}
.macro-recorder__header .edit__buttons[data-v-19251359] {
  justify-content: space-between;
  gap: calc(var(--spacing, .25rem) * 2);
  width: 100%;
  display: flex;
}
.macro-recorder__header > div[data-v-19251359] {
  align-items: flex-end;
  gap: calc(var(--spacing, .25rem) * 2);
  display: flex;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */

/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.macro-recorder__footer[data-v-fec5e8b6] {
  justify-content: space-between;
  gap: calc(var(--spacing, .25rem) * 2);
  display: flex;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.macro-recorder {
  height: 100%;
}
.recorder-interface {
  gap: calc(var(--spacing, .25rem) * 4);
  height: 100%;
  transition-property: grid-template-rows;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
  transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
  grid-template-rows: auto 1fr auto;
  display: grid;
}
.recorder-interface__container {
  border-radius: var(--radius-lg, .5rem);
  border-style: var(--tw-border-style);
  border-width: 1px;
  border-color: var(--color-slate-600, oklch(.446 .043 257.281));
  background-color: color-mix(in oklab, var(--color-slate-950, oklch(.129 .042 264.695)) 50%, transparent);
  width: 100%;
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
  transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
  position: relative;
  overflow: auto;
}
.recorder-interface__container.record {
  border-color: var(--color-rose-300, oklch(.81 .117 11.638));
  background-color: color-mix(in oklab, var(--color-rose-400, oklch(.712 .194 13.428)) 10%, transparent);
}
.recorder-interface__container.edit {
  border-color: var(--color-sky-300, oklch(.828 .111 230.318));
  background-color: color-mix(in oklab, var(--color-sky-900, oklch(.391 .09 240.876)) 10%, transparent);
}
#macro-name {
  border-color: #0000;
  border-bottom-color: var(--color-slate-300, oklch(.869 .022 252.894));
  width: 100%;
  padding-block: calc(var(--spacing, .25rem) * 0);
  font-size: var(--text-lg, 1.125rem);
  line-height: var(--tw-leading, var(--text-lg--line-height, calc(1.75 / 1.125)));
  outline-style: var(--tw-outline-style);
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(.4, 0, .2, 1)));
  transition-duration: var(--tw-duration, var(--default-transition-duration, .15s));
  background-color: #0000;
  border-radius: 0;
  outline-width: 0;
}
#macro-name:focus {
  border-color: #0000;
  border-bottom-color: var(--color-sky-400, oklch(.746 .16 232.661));
  background-color: color-mix(in oklab, var(--color-sky-400, oklch(.746 .16 232.661)) 10%, transparent);
}
.disabled {
  pointer-events: none;
  cursor: not-allowed;
  opacity: .5;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
/*! tailwindcss v4.0.9 | MIT License | https://tailwindcss.com */
.macro-panel__content[data-v-c7be9772] {
  gap: calc(var(--spacing, .25rem) * 6);
  padding-top: calc(var(--spacing, .25rem) * 2);
  grid-template-columns: 25ch 1fr;
  display: grid;
}