/* [next]/internal/font/google/inter_95e75430.module.css [app-client] (css) */
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7W0Q5n_wU-s.7b98b85e.woff2") format("woff2");
  unicode-range: U+460-52F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7W0Q5n_wU-s.p.51d01951.woff2") format("woff2");
  unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7W0Q5n_wU-s.e91c5657.woff2") format("woff2");
  unicode-range: U+1F??;
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7W0Q5n_wU-s.1e9d3edc.woff2") format("woff2");
  unicode-range: U+370-377, U+37A-37F, U+384-38A, U+38C, U+38E-3A1, U+3A3-3FF;
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7W0Q5n_wU-s.569fab99.woff2") format("woff2");
  unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7W0Q5n_wU-s.99c7dd4e.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7W0Q5nw-s.p.0faac26c.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Inter Fallback;
  src: local(Arial);
  ascent-override: 90.44%;
  descent-override: 22.52%;
  line-gap-override: 0.0%;
  size-adjust: 107.12%;
}

.inter_95e75430-module__X87BZW__className {
  font-family: Inter, Inter Fallback;
  font-style: normal;
}

.inter_95e75430-module__X87BZW__variable {
  --font-inter: "Inter", "Inter Fallback";
}


/* [project]/src/styles/globals.css [app-client] (css) */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-translate-x: 0;
      --tw-translate-y: 0;
      --tw-translate-z: 0;
      --tw-scale-x: 1;
      --tw-scale-y: 1;
      --tw-scale-z: 1;
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-scroll-snap-strictness: proximity;
      --tw-space-y-reverse: 0;
      --tw-border-style: solid;
      --tw-gradient-position: initial;
      --tw-gradient-from: #0000;
      --tw-gradient-via: #0000;
      --tw-gradient-to: #0000;
      --tw-gradient-stops: initial;
      --tw-gradient-via-stops: initial;
      --tw-gradient-from-position: 0%;
      --tw-gradient-via-position: 50%;
      --tw-gradient-to-position: 100%;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-backdrop-blur: initial;
      --tw-backdrop-brightness: initial;
      --tw-backdrop-contrast: initial;
      --tw-backdrop-grayscale: initial;
      --tw-backdrop-hue-rotate: initial;
      --tw-backdrop-invert: initial;
      --tw-backdrop-opacity: initial;
      --tw-backdrop-saturate: initial;
      --tw-backdrop-sepia: initial;
      --tw-duration: initial;
      --tw-ease: initial;
    }
  }
}

@layer theme {
  :root, :host {
    --font-sans: var(--tn-font-display);
    --font-mono: var(--tn-font-mono);
    --color-red-600: oklch(57.7% .245 27.325);
    --color-cyan-300: oklch(86.5% .127 207.078);
    --color-cyan-400: oklch(78.9% .154 211.53);
    --color-blue-500: oklch(62.3% .214 259.815);
    --color-gray-200: oklch(92.8% .006 264.531);
    --color-gray-400: oklch(70.7% .022 261.325);
    --color-zinc-400: oklch(70.5% .015 286.067);
    --color-neutral-400: oklch(70.8% 0 0);
    --color-black: #000;
    --color-white: #fff;
    --spacing: .25rem;
    --container-xs: 20rem;
    --container-sm: 24rem;
    --container-md: 28rem;
    --container-lg: 32rem;
    --container-3xl: 48rem;
    --text-xs: .75rem;
    --text-xs--line-height: calc(1 / .75);
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25 / .875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --tracking-tight: -.025em;
    --tracking-wide: .025em;
    --tracking-wider: .05em;
    --tracking-widest: .1em;
    --radius-xs: .125rem;
    --radius-sm: var(--tn-radius-sm);
    --radius-md: var(--tn-radius-md);
    --radius-lg: var(--tn-radius-lg);
    --radius-xl: .75rem;
    --ease-in: cubic-bezier(.4, 0, 1, 1);
    --ease-out: cubic-bezier(0, 0, .2, 1);
    --ease-in-out: cubic-bezier(.4, 0, .2, 1);
    --animate-spin: spin 1s linear infinite;
    --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --radius: var(--tn-radius-md);
    --color-bg: var(--tn-bg);
    --color-bg-surface: var(--tn-bg-surface);
    --color-bg-surface-2: var(--tn-bg-surface-2);
    --color-bg-elevated: var(--tn-bg-elevated);
    --color-fg: var(--tn-fg);
    --color-fg-secondary: var(--tn-fg-secondary);
    --color-fg-muted: var(--tn-fg-muted);
    --color-cyan: var(--tn-cyan);
    --color-cyan-dim: var(--tn-cyan-dim);
    --color-violet: var(--tn-violet);
    --color-violet-dim: var(--tn-violet-dim);
    --color-pink: var(--tn-pink);
    --color-blue: var(--tn-blue);
    --color-green: var(--tn-green);
    --color-yellow: var(--tn-yellow);
    --color-orange: var(--tn-orange);
    --color-red: var(--tn-red);
    --color-border-subtle: var(--tn-border-subtle);
    --color-border-strong: var(--tn-border-strong);
    --color-success: var(--tn-success);
    --color-warning: var(--tn-warning);
    --color-danger: var(--tn-danger);
    --color-q1: var(--tn-q1);
    --color-background: var(--tn-bg);
    --color-foreground: var(--tn-fg);
    --color-card: var(--tn-bg-elevated);
    --color-card-foreground: var(--tn-fg);
    --color-popover: var(--tn-bg-elevated);
    --color-popover-foreground: var(--tn-fg);
    --color-primary: var(--tn-cyan);
    --color-primary-foreground: var(--tn-bg);
    --color-secondary: var(--tn-violet);
    --color-secondary-foreground: var(--tn-bg);
    --color-muted: var(--tn-bg-elevated);
    --color-muted-foreground: var(--tn-fg-muted);
    --color-accent: var(--tn-pink);
    --color-accent-foreground: var(--tn-bg);
    --color-destructive: var(--tn-danger);
    --color-destructive-foreground: var(--tn-fg);
    --color-border: var(--tn-border-subtle);
    --color-input: var(--tn-border-subtle);
    --color-ring: var(--tn-cyan);
  }
}

@layer base {
  *, :after, :before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  html, :host {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }

  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }

  abbr:where([title]) {
    text-decoration: underline dotted;
  }

  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }

  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }

  b, strong {
    font-weight: bolder;
  }

  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }

  small {
    font-size: 80%;
  }

  sub, sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative;
  }

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }

  :-moz-focusring {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

  ol, ul, menu {
    list-style: none;
  }

  img, svg, video, canvas, audio, iframe, embed, object {
    vertical-align: middle;
    display: block;
  }

  img, video {
    max-width: 100%;
    height: auto;
  }

  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }

  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }

  ::file-selector-button {
    margin-inline-end: 4px;
  }

  ::placeholder {
    opacity: 1;
  }

  @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentColor;
    }

    @supports (color: color-mix(in lab, red, red)) {
      ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }

  textarea {
    resize: vertical;
  }

  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }

  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }

  ::-webkit-datetime-edit {
    display: inline-flex;
  }

  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }

  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }

  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }

  :-moz-ui-invalid {
    box-shadow: none;
  }

  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }

  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }

  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}

@layer components;

@layer utilities {
  .\@container\/card-header {
    container: card-header / inline-size;
  }

  .\@container {
    container-type: inline-size;
  }

  .pointer-events-none {
    pointer-events: none;
  }

  .collapse {
    visibility: collapse;
  }

  .invisible {
    visibility: hidden;
  }

  .visible {
    visibility: visible;
  }

  .sr-only {
    clip-path: inset(50%);
    white-space: nowrap;
    border-width: 0;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    position: absolute;
    overflow: hidden;
  }

  .absolute {
    position: absolute;
  }

  .fixed {
    position: fixed;
  }

  .relative {
    position: relative;
  }

  .static {
    position: static;
  }

  .sticky {
    position: sticky;
  }

  .inset-0 {
    inset: calc(var(--spacing) * 0);
  }

  .inset-1 {
    inset: calc(var(--spacing) * 1);
  }

  .inset-x-0 {
    inset-inline: calc(var(--spacing) * 0);
  }

  .inset-y-0 {
    inset-block: calc(var(--spacing) * 0);
  }

  .start {
    inset-inline-start: var(--spacing);
  }

  .end {
    inset-inline-end: var(--spacing);
  }

  .top-0 {
    top: calc(var(--spacing) * 0);
  }

  .top-1 {
    top: calc(var(--spacing) * 1);
  }

  .top-1\/2 {
    top: 50%;
  }

  .top-3 {
    top: calc(var(--spacing) * 3);
  }

  .top-4 {
    top: calc(var(--spacing) * 4);
  }

  .top-5 {
    top: calc(var(--spacing) * 5);
  }

  .top-10 {
    top: calc(var(--spacing) * 10);
  }

  .top-20 {
    top: calc(var(--spacing) * 20);
  }

  .top-\[50\%\] {
    top: 50%;
  }

  .right-0 {
    right: calc(var(--spacing) * 0);
  }

  .right-2 {
    right: calc(var(--spacing) * 2);
  }

  .right-3 {
    right: calc(var(--spacing) * 3);
  }

  .right-4 {
    right: calc(var(--spacing) * 4);
  }

  .bottom-0 {
    bottom: calc(var(--spacing) * 0);
  }

  .left-0 {
    left: calc(var(--spacing) * 0);
  }

  .left-1\/2 {
    left: 50%;
  }

  .left-2 {
    left: calc(var(--spacing) * 2);
  }

  .left-\[50\%\] {
    left: 50%;
  }

  .isolate {
    isolation: isolate;
  }

  .z-10 {
    z-index: 10;
  }

  .z-20 {
    z-index: 20;
  }

  .z-30 {
    z-index: 30;
  }

  .z-50 {
    z-index: 50;
  }

  .order-first {
    order: -9999;
  }

  .order-last {
    order: 9999;
  }

  .col-2 {
    grid-column: 2;
  }

  .col-start-2 {
    grid-column-start: 2;
  }

  .row-span-2 {
    grid-row: span 2 / span 2;
  }

  .row-start-1 {
    grid-row-start: 1;
  }

  .container {
    width: 100%;
  }

  @media (width >= 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (width >= 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (width >= 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (width >= 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (width >= 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .-mx-1 {
    margin-inline: calc(var(--spacing) * -1);
  }

  .mx-auto {
    margin-inline: auto;
  }

  .my-1 {
    margin-block: calc(var(--spacing) * 1);
  }

  .mt-0\.5 {
    margin-top: calc(var(--spacing) * .5);
  }

  .mt-1 {
    margin-top: calc(var(--spacing) * 1);
  }

  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }

  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }

  .mt-4 {
    margin-top: calc(var(--spacing) * 4);
  }

  .mt-auto {
    margin-top: auto;
  }

  .mb-1 {
    margin-bottom: calc(var(--spacing) * 1);
  }

  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }

  .mb-4 {
    margin-bottom: calc(var(--spacing) * 4);
  }

  .mb-6 {
    margin-bottom: calc(var(--spacing) * 6);
  }

  .-ml-1 {
    margin-left: calc(var(--spacing) * -1);
  }

  .ml-1 {
    margin-left: calc(var(--spacing) * 1);
  }

  .ml-3 {
    margin-left: calc(var(--spacing) * 3);
  }

  .ml-4 {
    margin-left: calc(var(--spacing) * 4);
  }

  .ml-5 {
    margin-left: calc(var(--spacing) * 5);
  }

  .ml-auto {
    margin-left: auto;
  }

  .\!flex {
    display: flex !important;
  }

  .block {
    display: block;
  }

  .contents {
    display: contents;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

  .inline-block {
    display: inline-block;
  }

  .inline-flex {
    display: inline-flex;
  }

  .inline-grid {
    display: inline-grid;
  }

  .inline-table {
    display: inline-table;
  }

  .list-item {
    display: list-item;
  }

  .table {
    display: table;
  }

  .table-row {
    display: table-row;
  }

  .field-sizing-content {
    field-sizing: content;
  }

  .aspect-square {
    aspect-ratio: 1;
  }

  .size-\(--cell-size\) {
    width: var(--cell-size);
    height: var(--cell-size);
  }

  .size-2 {
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
  }

  .size-2\.5 {
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
  }

  .size-3\.5 {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }

  .size-4 {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .size-6 {
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
  }

  .size-7 {
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
  }

  .size-8 {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }

  .size-9 {
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
  }

  .size-16 {
    width: calc(var(--spacing) * 16);
    height: calc(var(--spacing) * 16);
  }

  .size-auto {
    width: auto;
    height: auto;
  }

  .size-full {
    width: 100%;
    height: 100%;
  }

  .h-\(--cell-size\) {
    height: var(--cell-size);
  }

  .h-1 {
    height: calc(var(--spacing) * 1);
  }

  .h-2 {
    height: calc(var(--spacing) * 2);
  }

  .h-2\.5 {
    height: calc(var(--spacing) * 2.5);
  }

  .h-3 {
    height: calc(var(--spacing) * 3);
  }

  .h-4 {
    height: calc(var(--spacing) * 4);
  }

  .h-6 {
    height: calc(var(--spacing) * 6);
  }

  .h-7 {
    height: calc(var(--spacing) * 7);
  }

  .h-8 {
    height: calc(var(--spacing) * 8);
  }

  .h-9 {
    height: calc(var(--spacing) * 9);
  }

  .h-10 {
    height: calc(var(--spacing) * 10);
  }

  .h-11 {
    height: calc(var(--spacing) * 11);
  }

  .h-12 {
    height: calc(var(--spacing) * 12);
  }

  .h-14 {
    height: calc(var(--spacing) * 14);
  }

  .h-\[72px\] {
    height: 72px;
  }

  .h-\[80vh\] {
    height: 80vh;
  }

  .h-\[88vh\] {
    height: 88vh;
  }

  .h-\[calc\(--spacing\(5\.5\)\)\] {
    height: calc(calc(var(--spacing) * 5.5));
  }

  .h-\[calc\(100\%-1px\)\] {
    height: calc(100% - 1px);
  }

  .h-\[calc\(100vh-128px\)\] {
    height: calc(100vh - 128px);
  }

  .h-\[var\(--radix-select-trigger-height\)\] {
    height: var(--radix-select-trigger-height);
  }

  .h-auto {
    height: auto;
  }

  .h-fit {
    height: fit-content;
  }

  .h-full {
    height: 100%;
  }

  .h-px {
    height: 1px;
  }

  .h-screen {
    height: 100vh;
  }

  .max-h-\(--radix-context-menu-content-available-height\) {
    max-height: var(--radix-context-menu-content-available-height);
  }

  .max-h-\(--radix-dropdown-menu-content-available-height\) {
    max-height: var(--radix-dropdown-menu-content-available-height);
  }

  .max-h-\(--radix-select-content-available-height\) {
    max-height: var(--radix-select-content-available-height);
  }

  .max-h-96 {
    max-height: calc(var(--spacing) * 96);
  }

  .max-h-\[300px\] {
    max-height: 300px;
  }

  .max-h-\[min\(calc\(--spacing\(96\)---spacing\(9\)\)\,calc\(var\(--available-height\)---spacing\(9\)\)\)\] {
    max-height: min(calc(calc(var(--spacing) * 96)  - calc(var(--spacing) * 9)), calc(var(--available-height)  - calc(var(--spacing) * 9)));
  }

  .min-h-9 {
    min-height: calc(var(--spacing) * 9);
  }

  .min-h-16 {
    min-height: calc(var(--spacing) * 16);
  }

  .min-h-screen {
    min-height: 100vh;
  }

  .\!w-\[360px\] {
    width: 360px !important;
  }

  .w-\(--anchor-width\) {
    width: var(--anchor-width);
  }

  .w-\(--cell-size\) {
    width: var(--cell-size);
  }

  .w-\(--radix-popover-trigger-width\) {
    width: var(--radix-popover-trigger-width);
  }

  .w-2\.5 {
    width: calc(var(--spacing) * 2.5);
  }

  .w-3\/4 {
    width: 75%;
  }

  .w-4 {
    width: calc(var(--spacing) * 4);
  }

  .w-6 {
    width: calc(var(--spacing) * 6);
  }

  .w-7 {
    width: calc(var(--spacing) * 7);
  }

  .w-10 {
    width: calc(var(--spacing) * 10);
  }

  .w-11 {
    width: calc(var(--spacing) * 11);
  }

  .w-14 {
    width: calc(var(--spacing) * 14);
  }

  .w-32 {
    width: calc(var(--spacing) * 32);
  }

  .w-56 {
    width: calc(var(--spacing) * 56);
  }

  .w-64 {
    width: calc(var(--spacing) * 64);
  }

  .w-72 {
    width: calc(var(--spacing) * 72);
  }

  .w-80 {
    width: calc(var(--spacing) * 80);
  }

  .w-\[260px\] {
    width: 260px;
  }

  .w-\[300px\] {
    width: 300px;
  }

  .w-\[320px\] {
    width: 320px;
  }

  .w-\[360px\] {
    width: 360px;
  }

  .w-auto {
    width: auto;
  }

  .w-fit {
    width: fit-content;
  }

  .w-full {
    width: 100%;
  }

  .\!max-w-\[360px\] {
    max-width: 360px !important;
  }

  .max-w-\(--available-width\) {
    max-width: var(--available-width);
  }

  .max-w-3xl {
    max-width: var(--container-3xl);
  }

  .max-w-\[1300px\] {
    max-width: 1300px;
  }

  .max-w-\[calc\(100\%-2rem\)\] {
    max-width: calc(100% - 2rem);
  }

  .max-w-full {
    max-width: 100%;
  }

  .max-w-lg {
    max-width: var(--container-lg);
  }

  .max-w-md {
    max-width: var(--container-md);
  }

  .max-w-none {
    max-width: none;
  }

  .max-w-screen {
    max-width: 100vw;
  }

  .min-w-\(--cell-size\) {
    min-width: var(--cell-size);
  }

  .min-w-0 {
    min-width: calc(var(--spacing) * 0);
  }

  .min-w-6 {
    min-width: calc(var(--spacing) * 6);
  }

  .min-w-8 {
    min-width: calc(var(--spacing) * 8);
  }

  .min-w-9 {
    min-width: calc(var(--spacing) * 9);
  }

  .min-w-10 {
    min-width: calc(var(--spacing) * 10);
  }

  .min-w-16 {
    min-width: calc(var(--spacing) * 16);
  }

  .min-w-\[8rem\] {
    min-width: 8rem;
  }

  .min-w-\[220px\] {
    min-width: 220px;
  }

  .min-w-\[calc\(var\(--anchor-width\)\+--spacing\(7\)\)\] {
    min-width: calc(var(--anchor-width)  + calc(var(--spacing) * 7));
  }

  .min-w-\[var\(--radix-select-trigger-width\)\] {
    min-width: var(--radix-select-trigger-width);
  }

  .flex-1 {
    flex: 1;
  }

  .flex-shrink {
    flex-shrink: 1;
  }

  .flex-shrink-0 {
    flex-shrink: 0;
  }

  .shrink {
    flex-shrink: 1;
  }

  .shrink-0 {
    flex-shrink: 0;
  }

  .grow {
    flex-grow: 1;
  }

  .border-collapse {
    border-collapse: collapse;
  }

  .origin-\(--radix-context-menu-content-transform-origin\) {
    transform-origin: var(--radix-context-menu-content-transform-origin);
  }

  .origin-\(--radix-dropdown-menu-content-transform-origin\) {
    transform-origin: var(--radix-dropdown-menu-content-transform-origin);
  }

  .origin-\(--radix-popover-content-transform-origin\) {
    transform-origin: var(--radix-popover-content-transform-origin);
  }

  .origin-\(--radix-select-content-transform-origin\) {
    transform-origin: var(--radix-select-content-transform-origin);
  }

  .origin-\(--radix-tooltip-content-transform-origin\) {
    transform-origin: var(--radix-tooltip-content-transform-origin);
  }

  .origin-\(--transform-origin\) {
    transform-origin: var(--transform-origin);
  }

  .-translate-x-1\/2 {
    --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-x-\[-50\%\] {
    --tw-translate-x: -50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .-translate-y-1\/2 {
    --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-y-\[-50\%\] {
    --tw-translate-y: -50%;
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .translate-y-\[calc\(-50\%_-_2px\)\] {
    --tw-translate-y: calc(-50% - 2px);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .scale-105 {
    --tw-scale-x: 105%;
    --tw-scale-y: 105%;
    --tw-scale-z: 105%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
  }

  .rotate-45 {
    rotate: 45deg;
  }

  .transform {
    transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
  }

  .animate-pulse {
    animation: var(--animate-pulse);
  }

  .animate-spin {
    animation: var(--animate-spin);
  }

  .cursor-default {
    cursor: default;
  }

  .cursor-grab {
    cursor: grab;
  }

  .cursor-not-allowed {
    cursor: not-allowed;
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .cursor-text {
    cursor: text;
  }

  .touch-none {
    touch-action: none;
  }

  .resize {
    resize: both;
  }

  .resize-none {
    resize: none;
  }

  .snap-x {
    scroll-snap-type: x var(--tw-scroll-snap-strictness);
  }

  .scroll-my-1 {
    scroll-margin-block: calc(var(--spacing) * 1);
  }

  .scroll-py-1 {
    scroll-padding-block: calc(var(--spacing) * 1);
  }

  .auto-rows-min {
    grid-auto-rows: min-content;
  }

  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .grid-cols-\[24px_1fr_60px_120px_80px_80px_120px_32px\] {
    grid-template-columns: 24px 1fr 60px 120px 80px 80px 120px 32px;
  }

  .grid-cols-\[44px_72px_minmax\(88px\,1fr\)_72px_44px\] {
    grid-template-columns: 44px 72px minmax(88px, 1fr) 72px 44px;
  }

  .grid-rows-\[1fr_1fr_auto\] {
    grid-template-rows: 1fr 1fr auto;
  }

  .grid-rows-\[auto_1fr\] {
    grid-template-rows: auto 1fr;
  }

  .grid-rows-\[auto_auto\] {
    grid-template-rows: auto auto;
  }

  .\!flex-col {
    flex-direction: column !important;
  }

  .flex-col {
    flex-direction: column;
  }

  .flex-col-reverse {
    flex-direction: column-reverse;
  }

  .flex-row {
    flex-direction: row;
  }

  .flex-nowrap {
    flex-wrap: nowrap;
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .place-content-center {
    place-content: center;
  }

  .place-items-center {
    place-items: center;
  }

  .items-center {
    align-items: center;
  }

  .items-start {
    align-items: flex-start;
  }

  .justify-between {
    justify-content: space-between;
  }

  .justify-center {
    justify-content: center;
  }

  .justify-start {
    justify-content: flex-start;
  }

  .gap-0\.5 {
    gap: calc(var(--spacing) * .5);
  }

  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }

  .gap-1\.5 {
    gap: calc(var(--spacing) * 1.5);
  }

  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }

  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }

  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }

  .gap-6 {
    gap: calc(var(--spacing) * 6);
  }

  .gap-8 {
    gap: calc(var(--spacing) * 8);
  }

  :where(.space-y-1 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-1\.5 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-2 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-3 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
  }

  :where(.space-y-4 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
    margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
  }

  .self-start {
    align-self: flex-start;
  }

  .justify-self-end {
    justify-self: flex-end;
  }

  .truncate {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }

  .overflow-auto {
    overflow: auto;
  }

  .overflow-hidden {
    overflow: hidden;
  }

  .overflow-x-hidden {
    overflow-x: hidden;
  }

  .overflow-y-auto {
    overflow-y: auto;
  }

  .rounded {
    border-radius: var(--radius);
  }

  .rounded-\[2px\] {
    border-radius: 2px;
  }

  .rounded-\[4px\] {
    border-radius: 4px;
  }

  .rounded-\[calc\(var\(--radius\)-5px\)\] {
    border-radius: calc(var(--radius)  - 5px);
  }

  .rounded-\[inherit\] {
    border-radius: inherit;
  }

  .rounded-full {
    border-radius: 3.40282e38px;
  }

  .rounded-lg {
    border-radius: var(--radius-lg);
  }

  .rounded-md {
    border-radius: var(--radius-md);
  }

  .rounded-none {
    border-radius: 0;
  }

  .rounded-sm {
    border-radius: var(--radius-sm);
  }

  .rounded-xl {
    border-radius: var(--radius-xl);
  }

  .rounded-xs {
    border-radius: var(--radius-xs);
  }

  .rounded-l-md {
    border-top-left-radius: var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
  }

  .rounded-r-md {
    border-top-right-radius: var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
  }

  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  .border-2 {
    border-style: var(--tw-border-style);
    border-width: 2px;
  }

  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }

  .border-r {
    border-right-style: var(--tw-border-style);
    border-right-width: 1px;
  }

  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }

  .border-l {
    border-left-style: var(--tw-border-style);
    border-left-width: 1px;
  }

  .border-dashed {
    --tw-border-style: dashed;
    border-style: dashed;
  }

  .border-none {
    --tw-border-style: none;
    border-style: none;
  }

  .border-solid {
    --tw-border-style: solid;
    border-style: solid;
  }

  .border-\[--border-strong\] {
    border-color: --border-strong;
  }

  .border-\[--border-subtle\] {
    border-color: --border-subtle;
  }

  .border-\[color\:var\(--accent-cyan\)\]\/40 {
    border-color: var(--accent-cyan);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-\[color\:var\(--accent-cyan\)\]\/40 {
      border-color: color-mix(in oklab, var(--accent-cyan) 40%, transparent);
    }
  }

  .border-\[color\:var\(--border\)\] {
    border-color: var(--border);
  }

  .border-\[color\:var\(--danger\)\] {
    border-color: var(--danger);
  }

  .border-bg-elevated {
    border-color: var(--color-bg-elevated);
  }

  .border-border {
    border-color: var(--color-border);
  }

  .border-border-subtle {
    border-color: var(--color-border-subtle);
  }

  .border-foreground {
    border-color: var(--color-foreground);
  }

  .border-gray-200 {
    border-color: var(--color-gray-200);
  }

  .border-input {
    border-color: var(--color-input);
  }

  .border-pink {
    border-color: var(--color-pink);
  }

  .border-success {
    border-color: var(--color-success);
  }

  .border-success\/40 {
    border-color: var(--color-success);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-success\/40 {
      border-color: color-mix(in oklab, var(--color-success) 40%, transparent);
    }
  }

  .border-transparent {
    border-color: #0000;
  }

  .border-violet {
    border-color: var(--color-violet);
  }

  .border-t-transparent {
    border-top-color: #0000;
  }

  .border-l-transparent {
    border-left-color: #0000;
  }

  .bg-\[--bg-base\] {
    background-color: --bg-base;
  }

  .bg-\[--bg-surface\] {
    background-color: --bg-surface;
  }

  .bg-\[color\:var\(--accent-cyan\)\]\/5 {
    background-color: var(--accent-cyan);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-\[color\:var\(--accent-cyan\)\]\/5 {
      background-color: color-mix(in oklab, var(--accent-cyan) 5%, transparent);
    }
  }

  .bg-\[color\:var\(--danger\)\]\/15 {
    background-color: var(--danger);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-\[color\:var\(--danger\)\]\/15 {
      background-color: color-mix(in oklab, var(--danger) 15%, transparent);
    }
  }

  .bg-\[hsl\(var\(--bg-base\)\)\] {
    background-color: hsl(var(--bg-base));
  }

  .bg-accent {
    background-color: var(--color-accent);
  }

  .bg-background {
    background-color: var(--color-background);
  }

  .bg-bg {
    background-color: var(--color-bg);
  }

  .bg-bg-elevated {
    background-color: var(--color-bg-elevated);
  }

  .bg-bg-surface {
    background-color: var(--color-bg-surface);
  }

  .bg-black\/50 {
    background-color: #00000080;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-black\/50 {
      background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
    }
  }

  .bg-blue-500 {
    background-color: var(--color-blue-500);
  }

  .bg-border {
    background-color: var(--color-border);
  }

  .bg-card {
    background-color: var(--color-card);
  }

  .bg-cyan {
    background-color: var(--color-cyan);
  }

  .bg-danger\/30 {
    background-color: var(--color-danger);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-danger\/30 {
      background-color: color-mix(in oklab, var(--color-danger) 30%, transparent);
    }
  }

  .bg-destructive {
    background-color: var(--color-destructive);
  }

  .bg-foreground {
    background-color: var(--color-foreground);
  }

  .bg-input {
    background-color: var(--color-input);
  }

  .bg-muted {
    background-color: var(--color-muted);
  }

  .bg-neutral-400 {
    background-color: var(--color-neutral-400);
  }

  .bg-pink {
    background-color: var(--color-pink);
  }

  .bg-popover {
    background-color: var(--color-popover);
  }

  .bg-primary {
    background-color: var(--color-primary);
  }

  .bg-secondary {
    background-color: var(--color-secondary);
  }

  .bg-success {
    background-color: var(--color-success);
  }

  .bg-success\/10 {
    background-color: var(--color-success);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-success\/10 {
      background-color: color-mix(in oklab, var(--color-success) 10%, transparent);
    }
  }

  .bg-success\/20 {
    background-color: var(--color-success);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-success\/20 {
      background-color: color-mix(in oklab, var(--color-success) 20%, transparent);
    }
  }

  .bg-transparent {
    background-color: #0000;
  }

  .bg-violet {
    background-color: var(--color-violet);
  }

  .bg-warning\/30 {
    background-color: var(--color-warning);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .bg-warning\/30 {
      background-color: color-mix(in oklab, var(--color-warning) 30%, transparent);
    }
  }

  .bg-gradient-to-r {
    --tw-gradient-position: to right in oklab;
    background-image: linear-gradient(var(--tw-gradient-stops));
  }

  .from-\[--accent-cyan\] {
    --tw-gradient-from: --accent-cyan;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .to-\[--accent-violet\] {
    --tw-gradient-to: --accent-violet;
    --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
  }

  .bg-clip-padding {
    background-clip: padding-box;
  }

  .fill-current {
    fill: currentColor;
  }

  .fill-foreground {
    fill: var(--color-foreground);
  }

  .fill-primary {
    fill: var(--color-primary);
  }

  .p-0 {
    padding: calc(var(--spacing) * 0);
  }

  .p-1 {
    padding: calc(var(--spacing) * 1);
  }

  .p-2 {
    padding: calc(var(--spacing) * 2);
  }

  .p-3 {
    padding: calc(var(--spacing) * 3);
  }

  .p-4 {
    padding: calc(var(--spacing) * 4);
  }

  .p-5 {
    padding: calc(var(--spacing) * 5);
  }

  .p-6 {
    padding: calc(var(--spacing) * 6);
  }

  .p-7 {
    padding: calc(var(--spacing) * 7);
  }

  .p-8 {
    padding: calc(var(--spacing) * 8);
  }

  .p-\[3px\] {
    padding: 3px;
  }

  .p-px {
    padding: 1px;
  }

  .px-\(--cell-size\) {
    padding-inline: var(--cell-size);
  }

  .px-1\.5 {
    padding-inline: calc(var(--spacing) * 1.5);
  }

  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }

  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }

  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }

  .px-4 {
    padding-inline: calc(var(--spacing) * 4);
  }

  .px-5 {
    padding-inline: calc(var(--spacing) * 5);
  }

  .px-6 {
    padding-inline: calc(var(--spacing) * 6);
  }

  .px-8 {
    padding-inline: calc(var(--spacing) * 8);
  }

  .py-0\.5 {
    padding-block: calc(var(--spacing) * .5);
  }

  .py-1 {
    padding-block: calc(var(--spacing) * 1);
  }

  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }

  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }

  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }

  .py-4 {
    padding-block: calc(var(--spacing) * 4);
  }

  .py-6 {
    padding-block: calc(var(--spacing) * 6);
  }

  .pt-0 {
    padding-top: calc(var(--spacing) * 0);
  }

  .pt-2 {
    padding-top: calc(var(--spacing) * 2);
  }

  .pt-3 {
    padding-top: calc(var(--spacing) * 3);
  }

  .pt-4 {
    padding-top: calc(var(--spacing) * 4);
  }

  .pr-1 {
    padding-right: calc(var(--spacing) * 1);
  }

  .pr-2 {
    padding-right: calc(var(--spacing) * 2);
  }

  .pr-3 {
    padding-right: calc(var(--spacing) * 3);
  }

  .pr-8 {
    padding-right: calc(var(--spacing) * 8);
  }

  .pb-2 {
    padding-bottom: calc(var(--spacing) * 2);
  }

  .pb-3 {
    padding-bottom: calc(var(--spacing) * 3);
  }

  .pl-2 {
    padding-left: calc(var(--spacing) * 2);
  }

  .pl-3 {
    padding-left: calc(var(--spacing) * 3);
  }

  .pl-8 {
    padding-left: calc(var(--spacing) * 8);
  }

  .text-center {
    text-align: center;
  }

  .text-left {
    text-align: left;
  }

  .indent-1 {
    text-indent: calc(var(--spacing) * 1);
  }

  .indent-2 {
    text-indent: calc(var(--spacing) * 2);
  }

  .align-baseline {
    vertical-align: baseline;
  }

  .font-mono {
    font-family: var(--font-mono);
  }

  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }

  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }

  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }

  .text-lg\! {
    font-size: var(--text-lg) !important;
    line-height: var(--tw-leading, var(--text-lg--line-height)) !important;
  }

  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .text-xl {
    font-size: var(--text-xl);
    line-height: var(--tw-leading, var(--text-xl--line-height));
  }

  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .text-\[0\.8rem\] {
    font-size: .8rem;
  }

  .text-\[12px\] {
    font-size: 12px;
  }

  .text-\[13px\] {
    font-size: 13px;
  }

  .text-\[14px\] {
    font-size: 14px;
  }

  .text-\[18px\] {
    font-size: 18px;
  }

  .leading-none {
    --tw-leading: 1;
    line-height: 1;
  }

  .font-bold {
    --tw-font-weight: var(--font-weight-bold);
    font-weight: var(--font-weight-bold);
  }

  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .font-normal {
    --tw-font-weight: var(--font-weight-normal);
    font-weight: var(--font-weight-normal);
  }

  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }

  .tracking-tight {
    --tw-tracking: var(--tracking-tight);
    letter-spacing: var(--tracking-tight);
  }

  .tracking-wide {
    --tw-tracking: var(--tracking-wide);
    letter-spacing: var(--tracking-wide);
  }

  .tracking-wider {
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
  }

  .tracking-widest {
    --tw-tracking: var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
  }

  .text-balance {
    text-wrap: balance;
  }

  .break-all {
    word-break: break-all;
  }

  .whitespace-nowrap {
    white-space: nowrap;
  }

  .whitespace-pre-wrap {
    white-space: pre-wrap;
  }

  .text-\[--text-primary\] {
    color: --text-primary;
  }

  .text-\[color\:var\(--danger\)\] {
    color: var(--danger);
  }

  .text-\[color\:var\(--danger\,\#f87171\)\] {
    color: var(--danger, #f87171);
  }

  .text-accent-foreground {
    color: var(--color-accent-foreground);
  }

  .text-background {
    color: var(--color-background);
  }

  .text-bg {
    color: var(--color-bg);
  }

  .text-blue-500 {
    color: var(--color-blue-500);
  }

  .text-card-foreground {
    color: var(--color-card-foreground);
  }

  .text-current {
    color: currentColor;
  }

  .text-cyan {
    color: var(--color-cyan);
  }

  .text-cyan-300 {
    color: var(--color-cyan-300);
  }

  .text-cyan-400 {
    color: var(--color-cyan-400);
  }

  .text-danger {
    color: var(--color-danger);
  }

  .text-destructive {
    color: var(--color-destructive);
  }

  .text-destructive-foreground {
    color: var(--color-destructive-foreground);
  }

  .text-fg {
    color: var(--color-fg);
  }

  .text-fg-muted {
    color: var(--color-fg-muted);
  }

  .text-foreground {
    color: var(--color-foreground);
  }

  .text-gray-400 {
    color: var(--color-gray-400);
  }

  .text-muted {
    color: var(--color-muted);
  }

  .text-muted-foreground {
    color: var(--color-muted-foreground);
  }

  .text-pink {
    color: var(--color-pink);
  }

  .text-popover-foreground {
    color: var(--color-popover-foreground);
  }

  .text-primary {
    color: var(--color-primary);
  }

  .text-primary-foreground {
    color: var(--color-primary-foreground);
  }

  .text-red-600 {
    color: var(--color-red-600);
  }

  .text-secondary {
    color: var(--color-secondary);
  }

  .text-secondary-foreground {
    color: var(--color-secondary-foreground);
  }

  .text-success {
    color: var(--color-success);
  }

  .text-violet {
    color: var(--color-violet);
  }

  .text-warning {
    color: var(--color-warning);
  }

  .text-white {
    color: var(--color-white);
  }

  .text-zinc-400 {
    color: var(--color-zinc-400);
  }

  .lowercase {
    text-transform: lowercase;
  }

  .uppercase {
    text-transform: uppercase;
  }

  .italic {
    font-style: italic;
  }

  .ordinal {
    --tw-ordinal: ordinal;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
  }

  .tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
  }

  .line-through {
    text-decoration-line: line-through;
  }

  .underline {
    text-decoration-line: underline;
  }

  .underline-offset-4 {
    text-underline-offset: 4px;
  }

  .accent-cyan {
    accent-color: var(--color-cyan);
  }

  .accent-cyan-dim {
    accent-color: var(--color-cyan-dim);
  }

  .accent-pink {
    accent-color: var(--color-pink);
  }

  .accent-success {
    accent-color: var(--color-success);
  }

  .accent-violet {
    accent-color: var(--color-violet);
  }

  .accent-violet-dim {
    accent-color: var(--color-violet-dim);
  }

  .opacity-0 {
    opacity: 0;
  }

  .opacity-40 {
    opacity: .4;
  }

  .opacity-50 {
    opacity: .5;
  }

  .opacity-60 {
    opacity: .6;
  }

  .opacity-70 {
    opacity: .7;
  }

  .opacity-80 {
    opacity: .8;
  }

  .opacity-100 {
    opacity: 1;
  }

  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-lg {
    --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-md {
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-none {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-sm {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-xs {
    --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .ring {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + 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);
  }

  .ring-0 {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + 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);
  }

  .ring-1 {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + 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);
  }

  .shadow-card {
    --tw-shadow-color: var(--color-card);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-card {
      --tw-shadow-color: color-mix(in oklab, var(--color-card) var(--tw-shadow-alpha), transparent);
    }
  }

  .ring-\[color\:var\(--danger\)\] {
    --tw-ring-color: var(--danger);
  }

  .ring-bg {
    --tw-ring-color: var(--color-bg);
  }

  .ring-cyan {
    --tw-ring-color: var(--color-cyan);
  }

  .ring-foreground\/10 {
    --tw-ring-color: var(--color-foreground);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .ring-foreground\/10 {
      --tw-ring-color: color-mix(in oklab, var(--color-foreground) 10%, transparent);
    }
  }

  .ring-ring {
    --tw-ring-color: var(--color-ring);
  }

  .ring-offset-background {
    --tw-ring-offset-color: var(--color-background);
  }

  .outline-hidden {
    --tw-outline-style: none;
    outline-style: none;
  }

  @media (forced-colors: active) {
    .outline-hidden {
      outline-offset: 2px;
      outline: 2px solid #0000;
    }
  }

  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }

  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .drop-shadow {
    --tw-drop-shadow-size: drop-shadow(0 1px 2px var(--tw-drop-shadow-color, #0000001a)) drop-shadow(0 1px 1px var(--tw-drop-shadow-color, #0000000f));
    --tw-drop-shadow: drop-shadow(0 1px 2px #0000001a) drop-shadow(0 1px 1px #0000000f);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .grayscale {
    --tw-grayscale: grayscale(100%);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .invert {
    --tw-invert: invert(100%);
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .filter {
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .backdrop-blur {
    --tw-backdrop-blur: blur(8px);
    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 {
    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 {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-\[color\,box-shadow\] {
    transition-property: color, box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-all {
    transition-property: all;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-colors {
    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));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-opacity {
    transition-property: opacity;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-shadow {
    transition-property: box-shadow;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-transform {
    transition-property: transform, translate, scale, rotate;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .transition-none {
    transition-property: none;
  }

  .duration-100 {
    --tw-duration: .1s;
    transition-duration: .1s;
  }

  .duration-200 {
    --tw-duration: .2s;
    transition-duration: .2s;
  }

  .duration-\[220ms\] {
    --tw-duration: .22s;
    transition-duration: .22s;
  }

  .ease-in {
    --tw-ease: var(--ease-in);
    transition-timing-function: var(--ease-in);
  }

  .ease-in-out {
    --tw-ease: var(--ease-in-out);
    transition-timing-function: var(--ease-in-out);
  }

  .ease-out {
    --tw-ease: var(--ease-out);
    transition-timing-function: var(--ease-out);
  }

  .outline-none {
    --tw-outline-style: none;
    outline-style: none;
  }

  .select-all {
    -webkit-user-select: all;
    user-select: all;
  }

  .select-none {
    -webkit-user-select: none;
    user-select: none;
  }

  .\[--cell-size\:--spacing\(8\)\] {
    --cell-size: calc(var(--spacing) * 8);
  }

  .group-has-data-\[slot\=combobox-clear\]\/input-group\:hidden:is(:where(.group\/input-group):has([data-slot="combobox-clear"]) *) {
    display: none;
  }

  .group-has-\[\>input\]\/input-group\:pt-2\.5:is(:where(.group\/input-group):has( > input) *) {
    padding-top: calc(var(--spacing) * 2.5);
  }

  .group-has-\[\>input\]\/input-group\:pb-2\.5:is(:where(.group\/input-group):has( > input) *) {
    padding-bottom: calc(var(--spacing) * 2.5);
  }

  .group-data-empty\/combobox-content\:flex:is(:where(.group\/combobox-content)[data-empty] *) {
    display: flex;
  }

  .group-data-\[disabled\=true\]\:pointer-events-none:is(:where(.group)[data-disabled="true"] *) {
    pointer-events: none;
  }

  .group-data-\[disabled\=true\]\:opacity-50:is(:where(.group)[data-disabled="true"] *) {
    opacity: .5;
  }

  .group-data-\[disabled\=true\]\/input-group\:opacity-50:is(:where(.group\/input-group)[data-disabled="true"] *) {
    opacity: .5;
  }

  .group-data-\[focused\=true\]\/day\:relative:is(:where(.group\/day)[data-focused="true"] *) {
    position: relative;
  }

  .group-data-\[focused\=true\]\/day\:z-10:is(:where(.group\/day)[data-focused="true"] *) {
    z-index: 10;
  }

  .group-data-\[focused\=true\]\/day\:border-ring:is(:where(.group\/day)[data-focused="true"] *) {
    border-color: var(--color-ring);
  }

  .group-data-\[focused\=true\]\/day\:ring-\[3px\]:is(:where(.group\/day)[data-focused="true"] *) {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + 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);
  }

  .group-data-\[focused\=true\]\/day\:ring-ring\/50:is(:where(.group\/day)[data-focused="true"] *) {
    --tw-ring-color: var(--color-ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .group-data-\[focused\=true\]\/day\:ring-ring\/50:is(:where(.group\/day)[data-focused="true"] *) {
      --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
    }
  }

  .group-data-\[size\=default\]\/switch\:size-4:is(:where(.group\/switch)[data-size="default"] *) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .group-data-\[size\=sm\]\/alert-dialog-content\:grid:is(:where(.group\/alert-dialog-content)[data-size="sm"] *) {
    display: grid;
  }

  .group-data-\[size\=sm\]\/alert-dialog-content\:grid-cols-2:is(:where(.group\/alert-dialog-content)[data-size="sm"] *) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .group-data-\[size\=sm\]\/switch\:size-3:is(:where(.group\/switch)[data-size="sm"] *) {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled ~ *) {
    cursor: not-allowed;
  }

  .peer-disabled\:opacity-50:is(:where(.peer):disabled ~ *) {
    opacity: .5;
  }

  .selection\:bg-primary ::selection, .selection\:bg-primary::selection {
    background-color: var(--color-primary);
  }

  .selection\:text-primary-foreground ::selection, .selection\:text-primary-foreground::selection {
    color: var(--color-primary-foreground);
  }

  .file\:inline-flex::file-selector-button {
    display: inline-flex;
  }

  .file\:h-7::file-selector-button {
    height: calc(var(--spacing) * 7);
  }

  .file\:border-0::file-selector-button {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  .file\:bg-transparent::file-selector-button {
    background-color: #0000;
  }

  .file\:text-sm::file-selector-button {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }

  .file\:font-medium::file-selector-button {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .file\:text-foreground::file-selector-button {
    color: var(--color-foreground);
  }

  .placeholder\:text-muted-foreground::placeholder {
    color: var(--color-muted-foreground);
  }

  .focus-within\:border-ring:focus-within {
    border-color: var(--color-ring);
  }

  .focus-within\:ring-\[3px\]:focus-within {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + 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);
  }

  .focus-within\:ring-ring\/50:focus-within {
    --tw-ring-color: var(--color-ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .focus-within\:ring-ring\/50:focus-within {
      --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
    }
  }

  @media (hover: hover) {
    .hover\:bg-accent:hover {
      background-color: var(--color-accent);
    }
  }

  @media (hover: hover) {
    .hover\:bg-bg-elevated:hover {
      background-color: var(--color-bg-elevated);
    }
  }

  @media (hover: hover) {
    .hover\:bg-destructive\/90:hover {
      background-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-destructive\/90:hover {
        background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
      }
    }
  }

  @media (hover: hover) {
    .hover\:bg-muted:hover {
      background-color: var(--color-muted);
    }
  }

  @media (hover: hover) {
    .hover\:bg-primary\/90:hover {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-primary\/90:hover {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  @media (hover: hover) {
    .hover\:bg-secondary\/80:hover {
      background-color: var(--color-secondary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .hover\:bg-secondary\/80:hover {
        background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
      }
    }
  }

  @media (hover: hover) {
    .hover\:bg-transparent:hover {
      background-color: #0000;
    }
  }

  @media (hover: hover) {
    .hover\:text-accent-foreground:hover {
      color: var(--color-accent-foreground);
    }
  }

  @media (hover: hover) {
    .hover\:text-cyan:hover {
      color: var(--color-cyan);
    }
  }

  @media (hover: hover) {
    .hover\:text-fg:hover {
      color: var(--color-fg);
    }
  }

  @media (hover: hover) {
    .hover\:text-muted-foreground:hover {
      color: var(--color-muted-foreground);
    }
  }

  @media (hover: hover) {
    .hover\:text-primary:hover {
      color: var(--color-primary);
    }
  }

  @media (hover: hover) {
    .hover\:underline:hover {
      text-decoration-line: underline;
    }
  }

  @media (hover: hover) {
    .hover\:opacity-90:hover {
      opacity: .9;
    }
  }

  @media (hover: hover) {
    .hover\:opacity-100:hover {
      opacity: 1;
    }
  }

  .focus\:bg-accent:focus {
    background-color: var(--color-accent);
  }

  .focus\:text-accent-foreground:focus {
    color: var(--color-accent-foreground);
  }

  .focus\:ring-2:focus {
    --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);
  }

  .focus\:ring-ring:focus {
    --tw-ring-color: var(--color-ring);
  }

  .focus\:ring-offset-2:focus {
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset, ) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  }

  .focus\:outline-hidden:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  @media (forced-colors: active) {
    .focus\:outline-hidden:focus {
      outline-offset: 2px;
      outline: 2px solid #0000;
    }
  }

  .focus-visible\:border-ring:focus-visible {
    border-color: var(--color-ring);
  }

  .focus-visible\:ring-0:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + 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);
  }

  .focus-visible\:ring-2:focus-visible {
    --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);
  }

  .focus-visible\:ring-\[3px\]:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + 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);
  }

  .focus-visible\:ring-destructive\/20:focus-visible {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .focus-visible\:ring-destructive\/20:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  .focus-visible\:ring-ring:focus-visible {
    --tw-ring-color: var(--color-ring);
  }

  .focus-visible\:ring-ring\/50:focus-visible {
    --tw-ring-color: var(--color-ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .focus-visible\:ring-ring\/50:focus-visible {
      --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
    }
  }

  .focus-visible\:ring-offset-2:focus-visible {
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset, ) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  }

  .focus-visible\:outline-1:focus-visible {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }

  .focus-visible\:outline-ring:focus-visible {
    outline-color: var(--color-ring);
  }

  .focus-visible\:outline-none:focus-visible {
    --tw-outline-style: none;
    outline-style: none;
  }

  .disabled\:pointer-events-none:disabled {
    pointer-events: none;
  }

  .disabled\:cursor-not-allowed:disabled {
    cursor: not-allowed;
  }

  .disabled\:opacity-50:disabled {
    opacity: .5;
  }

  .has-focus\:border-ring:has(:focus) {
    border-color: var(--color-ring);
  }

  .has-focus\:ring-\[3px\]:has(:focus) {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + 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);
  }

  .has-focus\:ring-ring\/50:has(:focus) {
    --tw-ring-color: var(--color-ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .has-focus\:ring-ring\/50:has(:focus) {
      --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
    }
  }

  .has-disabled\:pointer-events-none:has(:disabled) {
    pointer-events: none;
  }

  .has-disabled\:cursor-not-allowed:has(:disabled) {
    cursor: not-allowed;
  }

  .has-disabled\:opacity-50:has(:disabled) {
    opacity: .5;
  }

  .has-aria-invalid\:border-destructive:has([aria-invalid="true"]) {
    border-color: var(--color-destructive);
  }

  .has-aria-invalid\:ring-\[3px\]:has([aria-invalid="true"]) {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + 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);
  }

  .has-aria-invalid\:ring-destructive\/20:has([aria-invalid="true"]) {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .has-aria-invalid\:ring-destructive\/20:has([aria-invalid="true"]) {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  .has-data-\[slot\=alert-dialog-media\]\:grid-rows-\[auto_auto_1fr\]:has([data-slot="alert-dialog-media"]) {
    grid-template-rows: auto auto 1fr;
  }

  .has-data-\[slot\=alert-dialog-media\]\:gap-x-6:has([data-slot="alert-dialog-media"]) {
    column-gap: calc(var(--spacing) * 6);
  }

  .has-data-\[slot\=card-action\]\:grid-cols-\[1fr_auto\]:has([data-slot="card-action"]) {
    grid-template-columns: 1fr auto;
  }

  .has-data-\[slot\=combobox-chip\]\:px-1\.5:has([data-slot="combobox-chip"]) {
    padding-inline: calc(var(--spacing) * 1.5);
  }

  .has-data-\[slot\=combobox-chip-remove\]\:pr-0:has([data-slot="combobox-chip-remove"]) {
    padding-right: calc(var(--spacing) * 0);
  }

  .has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:border-ring:has([data-slot="input-group-control"]:focus-visible) {
    border-color: var(--color-ring);
  }

  .has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:ring-\[3px\]:has([data-slot="input-group-control"]:focus-visible) {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(3px + 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);
  }

  .has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:ring-ring\/50:has([data-slot="input-group-control"]:focus-visible) {
    --tw-ring-color: var(--color-ring);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .has-\[\[data-slot\=input-group-control\]\:focus-visible\]\:ring-ring\/50:has([data-slot="input-group-control"]:focus-visible) {
      --tw-ring-color: color-mix(in oklab, var(--color-ring) 50%, transparent);
    }
  }

  .has-\[\[data-slot\]\[aria-invalid\=true\]\]\:border-destructive:has([data-slot][aria-invalid="true"]) {
    border-color: var(--color-destructive);
  }

  .has-\[\[data-slot\]\[aria-invalid\=true\]\]\:ring-destructive\/20:has([data-slot][aria-invalid="true"]) {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .has-\[\[data-slot\]\[aria-invalid\=true\]\]\:ring-destructive\/20:has([data-slot][aria-invalid="true"]) {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  .has-\[\>\[data-align\=block-end\]\]\:h-auto:has( > [data-align="block-end"]) {
    height: auto;
  }

  .has-\[\>\[data-align\=block-end\]\]\:flex-col:has( > [data-align="block-end"]) {
    flex-direction: column;
  }

  .has-\[\>\[data-align\=block-start\]\]\:h-auto:has( > [data-align="block-start"]) {
    height: auto;
  }

  .has-\[\>\[data-align\=block-start\]\]\:flex-col:has( > [data-align="block-start"]) {
    flex-direction: column;
  }

  .has-\[\>button\]\:mr-\[-0\.45rem\]:has( > button) {
    margin-right: -.45rem;
  }

  .has-\[\>button\]\:ml-\[-0\.45rem\]:has( > button) {
    margin-left: -.45rem;
  }

  .has-\[\>kbd\]\:mr-\[-0\.35rem\]:has( > kbd) {
    margin-right: -.35rem;
  }

  .has-\[\>kbd\]\:ml-\[-0\.35rem\]:has( > kbd) {
    margin-left: -.35rem;
  }

  .has-\[\>svg\]\:p-0:has( > svg) {
    padding: calc(var(--spacing) * 0);
  }

  .has-\[\>svg\]\:px-2:has( > svg) {
    padding-inline: calc(var(--spacing) * 2);
  }

  .has-\[\>svg\]\:px-2\.5:has( > svg) {
    padding-inline: calc(var(--spacing) * 2.5);
  }

  .has-\[\>svg\]\:px-3:has( > svg) {
    padding-inline: calc(var(--spacing) * 3);
  }

  .has-\[\>svg\]\:px-4:has( > svg) {
    padding-inline: calc(var(--spacing) * 4);
  }

  .has-\[\>textarea\]\:h-auto:has( > textarea) {
    height: auto;
  }

  .aria-disabled\:opacity-50[aria-disabled="true"] {
    opacity: .5;
  }

  .aria-invalid\:border-destructive[aria-invalid="true"] {
    border-color: var(--color-destructive);
  }

  .aria-invalid\:ring-destructive\/20[aria-invalid="true"] {
    --tw-ring-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .aria-invalid\:ring-destructive\/20[aria-invalid="true"] {
      --tw-ring-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
    }
  }

  .aria-selected\:bg-accent[aria-selected="true"] {
    background-color: var(--color-accent);
  }

  .aria-selected\:text-accent-foreground[aria-selected="true"] {
    color: var(--color-accent-foreground);
  }

  .aria-selected\:text-muted-foreground[aria-selected="true"] {
    color: var(--color-muted-foreground);
  }

  .data-empty\:p-0[data-empty] {
    padding: calc(var(--spacing) * 0);
  }

  .data-highlighted\:bg-accent[data-highlighted] {
    background-color: var(--color-accent);
  }

  .data-highlighted\:text-accent-foreground[data-highlighted] {
    color: var(--color-accent-foreground);
  }

  .data-pressed\:bg-transparent[data-pressed] {
    background-color: #0000;
  }

  .data-\[chips\=true\]\:min-w-\(--anchor-width\)[data-chips="true"] {
    min-width: var(--anchor-width);
  }

  .data-\[disabled\]\:pointer-events-none[data-disabled] {
    pointer-events: none;
  }

  .data-\[disabled\]\:opacity-50[data-disabled] {
    opacity: .5;
  }

  .data-\[disabled\=true\]\:pointer-events-none[data-disabled="true"] {
    pointer-events: none;
  }

  .data-\[disabled\=true\]\:opacity-50[data-disabled="true"] {
    opacity: .5;
  }

  .data-\[error\=true\]\:text-destructive[data-error="true"] {
    color: var(--color-destructive);
  }

  .data-\[inset\]\:pl-8[data-inset] {
    padding-left: calc(var(--spacing) * 8);
  }

  .data-\[orientation\=horizontal\]\:h-px[data-orientation="horizontal"] {
    height: 1px;
  }

  .data-\[orientation\=horizontal\]\:w-full[data-orientation="horizontal"] {
    width: 100%;
  }

  .data-\[orientation\=vertical\]\:h-full[data-orientation="vertical"] {
    height: 100%;
  }

  .data-\[orientation\=vertical\]\:w-px[data-orientation="vertical"] {
    width: 1px;
  }

  .data-\[placeholder\]\:text-muted-foreground[data-placeholder] {
    color: var(--color-muted-foreground);
  }

  .data-\[range-end\=true\]\:rounded-md[data-range-end="true"] {
    border-radius: var(--radius-md);
  }

  .data-\[range-end\=true\]\:rounded-r-md[data-range-end="true"] {
    border-top-right-radius: var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
  }

  .data-\[range-end\=true\]\:bg-primary[data-range-end="true"] {
    background-color: var(--color-primary);
  }

  .data-\[range-end\=true\]\:text-primary-foreground[data-range-end="true"] {
    color: var(--color-primary-foreground);
  }

  .data-\[range-middle\=true\]\:rounded-none[data-range-middle="true"] {
    border-radius: 0;
  }

  .data-\[range-middle\=true\]\:bg-accent[data-range-middle="true"] {
    background-color: var(--color-accent);
  }

  .data-\[range-middle\=true\]\:text-accent-foreground[data-range-middle="true"] {
    color: var(--color-accent-foreground);
  }

  .data-\[range-start\=true\]\:rounded-md[data-range-start="true"] {
    border-radius: var(--radius-md);
  }

  .data-\[range-start\=true\]\:rounded-l-md[data-range-start="true"] {
    border-top-left-radius: var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
  }

  .data-\[range-start\=true\]\:bg-primary[data-range-start="true"] {
    background-color: var(--color-primary);
  }

  .data-\[range-start\=true\]\:text-primary-foreground[data-range-start="true"] {
    color: var(--color-primary-foreground);
  }

  .data-\[selected-single\=true\]\:bg-primary[data-selected-single="true"] {
    background-color: var(--color-primary);
  }

  .data-\[selected-single\=true\]\:text-primary-foreground[data-selected-single="true"] {
    color: var(--color-primary-foreground);
  }

  .data-\[selected\=true\]\:rounded-none[data-selected="true"] {
    border-radius: 0;
  }

  .data-\[selected\=true\]\:bg-accent[data-selected="true"] {
    background-color: var(--color-accent);
  }

  .data-\[selected\=true\]\:text-accent-foreground[data-selected="true"] {
    color: var(--color-accent-foreground);
  }

  .data-\[side\=bottom\]\:translate-y-1[data-side="bottom"] {
    --tw-translate-y: calc(var(--spacing) * 1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .data-\[side\=left\]\:-translate-x-1[data-side="left"] {
    --tw-translate-x: calc(var(--spacing) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .data-\[side\=right\]\:translate-x-1[data-side="right"] {
    --tw-translate-x: calc(var(--spacing) * 1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .data-\[side\=top\]\:-translate-y-1[data-side="top"] {
    --tw-translate-y: calc(var(--spacing) * -1);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .data-\[size\=default\]\:h-9[data-size="default"] {
    height: calc(var(--spacing) * 9);
  }

  .data-\[size\=default\]\:h-\[1\.15rem\][data-size="default"] {
    height: 1.15rem;
  }

  .data-\[size\=default\]\:w-8[data-size="default"] {
    width: calc(var(--spacing) * 8);
  }

  .data-\[size\=sm\]\:h-3\.5[data-size="sm"] {
    height: calc(var(--spacing) * 3.5);
  }

  .data-\[size\=sm\]\:h-8[data-size="sm"] {
    height: calc(var(--spacing) * 8);
  }

  .data-\[size\=sm\]\:w-6[data-size="sm"] {
    width: calc(var(--spacing) * 6);
  }

  .data-\[size\=sm\]\:max-w-xs[data-size="sm"] {
    max-width: var(--container-xs);
  }

  :is(.\*\*\:data-\[slot\=command-input-wrapper\]\:h-12 *)[data-slot="command-input-wrapper"] {
    height: calc(var(--spacing) * 12);
  }

  :is(.\*\:data-\[slot\=input-group\]\:m-1 > *)[data-slot="input-group"] {
    margin: calc(var(--spacing) * 1);
  }

  :is(.\*\:data-\[slot\=input-group\]\:mb-0 > *)[data-slot="input-group"] {
    margin-bottom: calc(var(--spacing) * 0);
  }

  :is(.\*\:data-\[slot\=input-group\]\:h-8 > *)[data-slot="input-group"] {
    height: calc(var(--spacing) * 8);
  }

  :is(.\*\:data-\[slot\=input-group\]\:border-input\/30 > *)[data-slot="input-group"] {
    border-color: var(--color-input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :is(.\*\:data-\[slot\=input-group\]\:border-input\/30 > *)[data-slot="input-group"] {
      border-color: color-mix(in oklab, var(--color-input) 30%, transparent);
    }
  }

  :is(.\*\:data-\[slot\=input-group\]\:bg-input\/30 > *)[data-slot="input-group"] {
    background-color: var(--color-input);
  }

  @supports (color: color-mix(in lab, red, red)) {
    :is(.\*\:data-\[slot\=input-group\]\:bg-input\/30 > *)[data-slot="input-group"] {
      background-color: color-mix(in oklab, var(--color-input) 30%, transparent);
    }
  }

  :is(.\*\:data-\[slot\=input-group\]\:shadow-none > *)[data-slot="input-group"] {
    --tw-shadow: 0 0 #0000;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  :is(.\*\:data-\[slot\=select-value\]\:line-clamp-1 > *)[data-slot="select-value"] {
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
  }

  :is(.\*\:data-\[slot\=select-value\]\:flex > *)[data-slot="select-value"] {
    display: flex;
  }

  :is(.\*\:data-\[slot\=select-value\]\:items-center > *)[data-slot="select-value"] {
    align-items: center;
  }

  :is(.\*\:data-\[slot\=select-value\]\:gap-2 > *)[data-slot="select-value"] {
    gap: calc(var(--spacing) * 2);
  }

  .data-\[state\=active\]\:bg-background[data-state="active"] {
    background-color: var(--color-background);
  }

  .data-\[state\=active\]\:shadow-sm[data-state="active"] {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .data-\[state\=checked\]\:translate-x-\[calc\(100\%-2px\)\][data-state="checked"] {
    --tw-translate-x: calc(100% - 2px);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .data-\[state\=checked\]\:border-primary[data-state="checked"] {
    border-color: var(--color-primary);
  }

  .data-\[state\=checked\]\:bg-primary[data-state="checked"] {
    background-color: var(--color-primary);
  }

  .data-\[state\=checked\]\:text-primary-foreground[data-state="checked"] {
    color: var(--color-primary-foreground);
  }

  .data-\[state\=closed\]\:text-accent-foreground[data-state="closed"] {
    color: var(--color-accent-foreground);
  }

  .data-\[state\=closed\]\:duration-300[data-state="closed"] {
    --tw-duration: .3s;
    transition-duration: .3s;
  }

  .data-\[state\=on\]\:bg-accent[data-state="on"] {
    background-color: var(--color-accent);
  }

  .data-\[state\=on\]\:text-accent-foreground[data-state="on"] {
    color: var(--color-accent-foreground);
  }

  .data-\[state\=open\]\:bg-accent[data-state="open"] {
    background-color: var(--color-accent);
  }

  .data-\[state\=open\]\:bg-secondary[data-state="open"] {
    background-color: var(--color-secondary);
  }

  .data-\[state\=open\]\:text-accent-foreground[data-state="open"] {
    color: var(--color-accent-foreground);
  }

  .data-\[state\=open\]\:text-muted-foreground[data-state="open"] {
    color: var(--color-muted-foreground);
  }

  .data-\[state\=open\]\:duration-500[data-state="open"] {
    --tw-duration: .5s;
    transition-duration: .5s;
  }

  .data-\[state\=unchecked\]\:translate-x-0[data-state="unchecked"] {
    --tw-translate-x: calc(var(--spacing) * 0);
    translate: var(--tw-translate-x) var(--tw-translate-y);
  }

  .data-\[state\=unchecked\]\:bg-input[data-state="unchecked"] {
    background-color: var(--color-input);
  }

  .data-\[variant\=destructive\]\:text-destructive[data-variant="destructive"] {
    color: var(--color-destructive);
  }

  @media (hover: hover) {
    .data-\[variant\=destructive\]\:hover\:bg-destructive\/10[data-variant="destructive"]:hover {
      background-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .data-\[variant\=destructive\]\:hover\:bg-destructive\/10[data-variant="destructive"]:hover {
        background-color: color-mix(in oklab, var(--color-destructive) 10%, transparent);
      }
    }
  }

  @media (hover: hover) {
    .data-\[variant\=destructive\]\:hover\:text-destructive[data-variant="destructive"]:hover {
      color: var(--color-destructive);
    }
  }

  .data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant="destructive"]:focus {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant="destructive"]:focus {
      background-color: color-mix(in oklab, var(--color-destructive) 10%, transparent);
    }
  }

  .data-\[variant\=destructive\]\:focus\:text-destructive[data-variant="destructive"]:focus {
    color: var(--color-destructive);
  }

  .data-\[variant\=destructive\]\:aria-selected\:bg-destructive\/10[data-variant="destructive"][aria-selected="true"] {
    background-color: var(--color-destructive);
  }

  @supports (color: color-mix(in lab, red, red)) {
    .data-\[variant\=destructive\]\:aria-selected\:bg-destructive\/10[data-variant="destructive"][aria-selected="true"] {
      background-color: color-mix(in oklab, var(--color-destructive) 10%, transparent);
    }
  }

  .data-\[variant\=destructive\]\:aria-selected\:text-destructive[data-variant="destructive"][aria-selected="true"] {
    color: var(--color-destructive);
  }

  @media (prefers-reduced-motion: reduce) {
    .motion-reduce\:transition-none {
      transition-property: none;
    }
  }

  @media (width >= 40rem) {
    .sm\:max-w-\[480px\] {
      max-width: 480px;
    }
  }

  @media (width >= 40rem) {
    .sm\:max-w-lg {
      max-width: var(--container-lg);
    }
  }

  @media (width >= 40rem) {
    .sm\:max-w-sm {
      max-width: var(--container-sm);
    }
  }

  @media (width >= 40rem) {
    .sm\:flex-row {
      flex-direction: row;
    }
  }

  @media (width >= 40rem) {
    .sm\:justify-end {
      justify-content: flex-end;
    }
  }

  @media (width >= 40rem) {
    .sm\:text-left {
      text-align: left;
    }
  }

  @media (width >= 40rem) {
    .sm\:group-data-\[size\=default\]\/alert-dialog-content\:row-span-2:is(:where(.group\/alert-dialog-content)[data-size="default"] *) {
      grid-row: span 2 / span 2;
    }
  }

  @media (width >= 40rem) {
    .sm\:group-data-\[size\=default\]\/alert-dialog-content\:place-items-start:is(:where(.group\/alert-dialog-content)[data-size="default"] *) {
      place-items: start;
    }
  }

  @media (width >= 40rem) {
    .sm\:group-data-\[size\=default\]\/alert-dialog-content\:text-left:is(:where(.group\/alert-dialog-content)[data-size="default"] *) {
      text-align: left;
    }
  }

  @media (width >= 40rem) {
    .sm\:group-data-\[size\=default\]\/alert-dialog-content\:group-has-data-\[slot\=alert-dialog-media\]\/alert-dialog-content\:col-start-2:is(:where(.group\/alert-dialog-content)[data-size="default"] *):is(:where(.group\/alert-dialog-content):has([data-slot="alert-dialog-media"]) *) {
      grid-column-start: 2;
    }
  }

  @media (width >= 40rem) {
    .sm\:group-data-\[size\=default\]\/alert-dialog-content\:has-data-\[slot\=alert-dialog-media\]\:grid-rows-\[auto_1fr\]:is(:where(.group\/alert-dialog-content)[data-size="default"] *):has([data-slot="alert-dialog-media"]) {
      grid-template-rows: auto 1fr;
    }
  }

  @media (width >= 40rem) {
    .data-\[size\=default\]\:sm\:max-w-lg[data-size="default"] {
      max-width: var(--container-lg);
    }
  }

  @media (width >= 48rem) {
    .md\:flex-row {
      flex-direction: row;
    }
  }

  @media (width >= 48rem) {
    .md\:text-sm {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  }

  @media (width >= 64rem) {
    .lg\:block {
      display: block;
    }
  }

  @media (width >= 64rem) {
    .lg\:flex {
      display: flex;
    }
  }

  @media (width >= 64rem) {
    .lg\:hidden {
      display: none;
    }
  }

  @media (width >= 64rem) {
    .lg\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @container (width < 768px) {
    .\@max-\[768px\]\:grid-cols-1 {
      grid-template-columns: repeat(1, minmax(0, 1fr));
    }
  }

  @container (width < 768px) {
    .\@max-\[768px\]\:grid-rows-none {
      grid-template-rows: none;
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:border-input {
      border-color: var(--color-input);
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:bg-destructive\/60 {
      background-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:bg-destructive\/60 {
        background-color: color-mix(in oklab, var(--color-destructive) 60%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:bg-input\/30 {
      background-color: var(--color-input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:bg-input\/30 {
        background-color: color-mix(in oklab, var(--color-input) 30%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:bg-transparent {
      background-color: #0000;
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:text-muted-foreground {
      color: var(--color-muted-foreground);
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .dark\:hover\:bg-accent\/50:hover {
        background-color: var(--color-accent);
      }

      @supports (color: color-mix(in lab, red, red)) {
        .dark\:hover\:bg-accent\/50:hover {
          background-color: color-mix(in oklab, var(--color-accent) 50%, transparent);
        }
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .dark\:hover\:bg-input\/50:hover {
        background-color: var(--color-input);
      }

      @supports (color: color-mix(in lab, red, red)) {
        .dark\:hover\:bg-input\/50:hover {
          background-color: color-mix(in oklab, var(--color-input) 50%, transparent);
        }
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .dark\:hover\:text-accent-foreground:hover {
        color: var(--color-accent-foreground);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:focus-visible\:ring-destructive\/40:focus-visible {
      --tw-ring-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:focus-visible\:ring-destructive\/40:focus-visible {
        --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:has-aria-invalid\:border-destructive\/50:has([aria-invalid="true"]) {
      border-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:has-aria-invalid\:border-destructive\/50:has([aria-invalid="true"]) {
        border-color: color-mix(in oklab, var(--color-destructive) 50%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:has-aria-invalid\:ring-destructive\/40:has([aria-invalid="true"]) {
      --tw-ring-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:has-aria-invalid\:ring-destructive\/40:has([aria-invalid="true"]) {
        --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:has-\[\[data-slot\]\[aria-invalid\=true\]\]\:ring-destructive\/40:has([data-slot][aria-invalid="true"]) {
      --tw-ring-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:has-\[\[data-slot\]\[aria-invalid\=true\]\]\:ring-destructive\/40:has([data-slot][aria-invalid="true"]) {
        --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:aria-invalid\:ring-destructive\/40[aria-invalid="true"] {
      --tw-ring-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:aria-invalid\:ring-destructive\/40[aria-invalid="true"] {
        --tw-ring-color: color-mix(in oklab, var(--color-destructive) 40%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[state\=active\]\:border-input[data-state="active"] {
      border-color: var(--color-input);
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[state\=active\]\:bg-input\/30[data-state="active"] {
      background-color: var(--color-input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:data-\[state\=active\]\:bg-input\/30[data-state="active"] {
        background-color: color-mix(in oklab, var(--color-input) 30%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[state\=active\]\:text-foreground[data-state="active"] {
      color: var(--color-foreground);
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[state\=checked\]\:bg-primary[data-state="checked"] {
      background-color: var(--color-primary);
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[state\=checked\]\:bg-primary-foreground[data-state="checked"] {
      background-color: var(--color-primary-foreground);
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[state\=unchecked\]\:bg-foreground[data-state="unchecked"] {
      background-color: var(--color-foreground);
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[state\=unchecked\]\:bg-input\/80[data-state="unchecked"] {
      background-color: var(--color-input);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:data-\[state\=unchecked\]\:bg-input\/80[data-state="unchecked"] {
        background-color: color-mix(in oklab, var(--color-input) 80%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    @media (hover: hover) {
      .dark\:data-\[variant\=destructive\]\:hover\:bg-destructive\/20[data-variant="destructive"]:hover {
        background-color: var(--color-destructive);
      }

      @supports (color: color-mix(in lab, red, red)) {
        .dark\:data-\[variant\=destructive\]\:hover\:bg-destructive\/20[data-variant="destructive"]:hover {
          background-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
        }
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20[data-variant="destructive"]:focus {
      background-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20[data-variant="destructive"]:focus {
        background-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[variant\=destructive\]\:aria-selected\:bg-destructive\/20[data-variant="destructive"][aria-selected="true"] {
      background-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      .dark\:data-\[variant\=destructive\]\:aria-selected\:bg-destructive\/20[data-variant="destructive"][aria-selected="true"] {
        background-color: color-mix(in oklab, var(--color-destructive) 20%, transparent);
      }
    }
  }

  @media (pointer: coarse) {
    .pointer-coarse\:size-5 {
      width: calc(var(--spacing) * 5);
      height: calc(var(--spacing) * 5);
    }
  }

  @media (pointer: coarse) {
    .pointer-coarse\:px-3 {
      padding-inline: calc(var(--spacing) * 3);
    }
  }

  @media (pointer: coarse) {
    .pointer-coarse\:py-2 {
      padding-block: calc(var(--spacing) * 2);
    }
  }

  @media (pointer: coarse) {
    .pointer-coarse\:text-sm {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  }

  .\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading] {
    padding-inline: calc(var(--spacing) * 2);
  }

  .\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading] {
    padding-block: calc(var(--spacing) * 1.5);
  }

  .\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading] {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading] {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }

  .\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground [cmdk-group-heading] {
    color: var(--color-muted-foreground);
  }

  .\[\&_\[cmdk-group\]\]\:px-2 [cmdk-group] {
    padding-inline: calc(var(--spacing) * 2);
  }

  .\[\&_\[cmdk-group\]\:not\(\[hidden\]\)_\~\[cmdk-group\]\]\:pt-0 [cmdk-group]:not([hidden]) ~ [cmdk-group] {
    padding-top: calc(var(--spacing) * 0);
  }

  .\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg {
    height: calc(var(--spacing) * 5);
  }

  .\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg {
    width: calc(var(--spacing) * 5);
  }

  .\[\&_\[cmdk-input\]\]\:h-12 [cmdk-input] {
    height: calc(var(--spacing) * 12);
  }

  .\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item] {
    padding-inline: calc(var(--spacing) * 2);
  }

  .\[\&_\[cmdk-item\]\]\:py-3 [cmdk-item] {
    padding-block: calc(var(--spacing) * 3);
  }

  .\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg {
    height: calc(var(--spacing) * 5);
  }

  .\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg {
    width: calc(var(--spacing) * 5);
  }

  .\[\&_svg\]\:pointer-events-none svg {
    pointer-events: none;
  }

  .\[\&_svg\]\:shrink-0 svg {
    flex-shrink: 0;
  }

  .\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*="size-"]) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground svg:not([class*="text-"]) {
    color: var(--color-muted-foreground);
  }

  .\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-4 svg:not([class*="size-"]) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .\[\&_svg\:not\(\[class\*\=text-\]\)\]\:text-muted-foreground svg:not([class*="text-"]) {
    color: var(--color-muted-foreground);
  }

  .\[\&\:first-child\[data-selected\=true\]_button\]\:rounded-l-md:first-child[data-selected="true"] button {
    border-top-left-radius: var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
  }

  .\[\.border-b\]\:pb-3.border-b {
    padding-bottom: calc(var(--spacing) * 3);
  }

  .\[\.border-b\]\:pb-6.border-b {
    padding-bottom: calc(var(--spacing) * 6);
  }

  .\[\.border-t\]\:pt-3.border-t {
    padding-top: calc(var(--spacing) * 3);
  }

  .\[\.border-t\]\:pt-6.border-t {
    padding-top: calc(var(--spacing) * 6);
  }

  :is(.rtl\:\*\*\:\[\.rdp-button\\_next\>svg\]\:rotate-180:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) *):is(.rdp-button_next > svg) {
    rotate: 180deg;
  }

  :is(.rtl\:\*\*\:\[\.rdp-button\\_previous\>svg\]\:rotate-180:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) *):is(.rdp-button_previous > svg) {
    rotate: 180deg;
  }

  :is(.\*\:\[span\]\:last\:flex > *):is(span):last-child {
    display: flex;
  }

  :is(.\*\:\[span\]\:last\:items-center > *):is(span):last-child {
    align-items: center;
  }

  :is(.\*\:\[span\]\:last\:gap-2 > *):is(span):last-child {
    gap: calc(var(--spacing) * 2);
  }

  :is(.data-\[variant\=destructive\]\:\*\:\[svg\]\:\!text-destructive[data-variant="destructive"] > *):is(svg) {
    color: var(--color-destructive) !important;
  }

  :is(.data-\[variant\=destructive\]\:\*\:\[svg\]\:text-destructive\![data-variant="destructive"] > *):is(svg) {
    color: var(--color-destructive) !important;
  }

  :is(.\*\:\[svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-8 > *):is(svg:not([class*="size-"])) {
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
  }

  .\[\&\:last-child\[data-selected\=true\]_button\]\:rounded-r-md:last-child[data-selected="true"] button {
    border-top-right-radius: var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
  }

  .\[\&\:nth-child\(2\)\[data-selected\=true\]_button\]\:rounded-l-md:nth-child(2)[data-selected="true"] button {
    border-top-left-radius: var(--radius-md);
    border-bottom-left-radius: var(--radius-md);
  }

  .has-\[\>\[data-align\=block-end\]\]\:\[\&\>input\]\:pt-3:has( > [data-align="block-end"]) > input {
    padding-top: calc(var(--spacing) * 3);
  }

  .has-\[\>\[data-align\=block-start\]\]\:\[\&\>input\]\:pb-3:has( > [data-align="block-start"]) > input {
    padding-bottom: calc(var(--spacing) * 3);
  }

  .has-\[\>\[data-align\=inline-end\]\]\:\[\&\>input\]\:pr-2:has( > [data-align="inline-end"]) > input {
    padding-right: calc(var(--spacing) * 2);
  }

  .has-\[\>\[data-align\=inline-start\]\]\:\[\&\>input\]\:pl-2:has( > [data-align="inline-start"]) > input {
    padding-left: calc(var(--spacing) * 2);
  }

  .\[\&\>kbd\]\:rounded-\[calc\(var\(--radius\)-5px\)\] > kbd {
    border-radius: calc(var(--radius)  - 5px);
  }

  .\[\&\>span\]\:text-xs > span {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }

  .\[\&\>span\]\:opacity-70 > span {
    opacity: .7;
  }

  .\[\&\>svg\]\:pointer-events-none > svg {
    pointer-events: none;
  }

  .\[\&\>svg\]\:size-3 > svg {
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
  }

  .\[\&\>svg\]\:size-3\.5 > svg {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }

  .\[\&\>svg\]\:text-muted-foreground > svg {
    color: var(--color-muted-foreground);
  }

  .\[\&\>svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-3\.5 > svg:not([class*="size-"]) {
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
  }

  .\[\&\>svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 > svg:not([class*="size-"]) {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  [data-slot="card-content"] .\[\[data-slot\=card-content\]_\&\]\:bg-transparent {
    background-color: #0000;
  }

  [data-slot="popover-content"] .\[\[data-slot\=popover-content\]_\&\]\:bg-transparent {
    background-color: #0000;
  }

  @media (hover: hover) {
    a.\[a\&\]\:hover\:bg-accent:hover {
      background-color: var(--color-accent);
    }
  }

  @media (hover: hover) {
    a.\[a\&\]\:hover\:bg-destructive\/90:hover {
      background-color: var(--color-destructive);
    }

    @supports (color: color-mix(in lab, red, red)) {
      a.\[a\&\]\:hover\:bg-destructive\/90:hover {
        background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
      }
    }
  }

  @media (hover: hover) {
    a.\[a\&\]\:hover\:bg-primary\/90:hover {
      background-color: var(--color-primary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      a.\[a\&\]\:hover\:bg-primary\/90:hover {
        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
      }
    }
  }

  @media (hover: hover) {
    a.\[a\&\]\:hover\:bg-secondary\/90:hover {
      background-color: var(--color-secondary);
    }

    @supports (color: color-mix(in lab, red, red)) {
      a.\[a\&\]\:hover\:bg-secondary\/90:hover {
        background-color: color-mix(in oklab, var(--color-secondary) 90%, transparent);
      }
    }
  }

  @media (hover: hover) {
    a.\[a\&\]\:hover\:text-accent-foreground:hover {
      color: var(--color-accent-foreground);
    }
  }

  @media (hover: hover) {
    a.\[a\&\]\:hover\:underline:hover {
      text-decoration-line: underline;
    }
  }
}

:root {
  --tn-bg: #0a0e27;
  --tn-bg-surface: #161a35;
  --tn-bg-surface-2: #1e2342;
  --tn-bg-elevated: #252a4d;
  --tn-fg: #e2e8f0;
  --tn-fg-secondary: #94a3b8;
  --tn-fg-muted: #64748b;
  --tn-cyan: #7dd3fc;
  --tn-cyan-dim: #0ea5e9;
  --tn-violet: #a78bfa;
  --tn-violet-dim: #7c3aed;
  --tn-pink: #f472b6;
  --tn-border-subtle: #2a2f4a;
  --tn-border-strong: #3a4068;
  --tn-success: #4ade80;
  --tn-warning: #fbbf24;
  --tn-danger: #f87171;
  --tn-blue: var(--tn-cyan-dim);
  --tn-green: var(--tn-success);
  --tn-yellow: var(--tn-warning);
  --tn-orange: var(--tn-warning);
  --tn-red: var(--tn-danger);
  --tn-q1: #f87171;
  --tn-q2: #fbbf24;
  --tn-q3: #7dd3fc;
  --tn-q4: #4ade80;
  --tn-q5: #a78bfa;
  --tn-radius-sm: 8px;
  --tn-radius-md: 12px;
  --tn-radius-lg: 16px;
  --tn-space-xs: 8px;
  --tn-space-sm: 12px;
  --tn-space-md: 16px;
  --tn-space-lg: 24px;
  --tn-space-xl: 32px;
  --tn-font-display: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --tn-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --bg-base: var(--tn-bg);
  --bg-surface: var(--tn-bg-surface);
  --bg-surface-2: var(--tn-bg-surface-2);
  --bg-elevated: var(--tn-bg-elevated);
  --text-primary: var(--tn-fg);
  --text-secondary: var(--tn-fg-secondary);
  --text-muted: var(--tn-fg-muted);
  --accent-cyan: var(--tn-cyan);
  --accent-cyan-dim: var(--tn-cyan-dim);
  --accent-violet: var(--tn-violet);
  --accent-violet-dim: var(--tn-violet-dim);
  --accent-pink: var(--tn-pink);
  --accent-violet-fg: var(--tn-violet);
  --border-subtle: var(--tn-border-subtle);
  --border-strong: var(--tn-border-strong);
  --success: var(--tn-success);
  --warning: var(--tn-warning);
  --danger: var(--tn-danger);
  --font-sans: var(--tn-font-display);
  --font-mono: var(--tn-font-mono);
}

:root[data-theme="light"] {
  --tn-bg: #f5f6f8;
  --tn-bg-surface: #fff;
  --tn-bg-surface-2: #eef0f4;
  --tn-bg-elevated: #e3e6ec;
  --tn-fg: #1a1f3a;
  --tn-fg-secondary: #4a5167;
  --tn-fg-muted: #6c7086;
  --tn-cyan: #0284c7;
  --tn-cyan-dim: #0369a1;
  --tn-violet: #7c3aed;
  --tn-violet-dim: #5b21b6;
  --tn-pink: #db2777;
  --tn-border-subtle: #d6d8de;
  --tn-border-strong: #b8bcc7;
  --tn-success: #16a34a;
  --tn-warning: #ca8a04;
  --tn-danger: #dc2626;
  --tn-q1: #dc2626;
  --tn-q2: #ca8a04;
  --tn-q3: #0284c7;
  --tn-q4: #16a34a;
  --tn-q5: #7c3aed;
}

:root[data-theme="solarized-dark"] {
  --tn-bg: #002b36;
  --tn-bg-surface: #073642;
  --tn-bg-surface-2: #0d4754;
  --tn-bg-elevated: #155566;
  --tn-fg: #eee8d5;
  --tn-fg-secondary: #93a1a1;
  --tn-fg-muted: #657b83;
  --tn-cyan: #2aa198;
  --tn-cyan-dim: #268bd2;
  --tn-violet: #6c71c4;
  --tn-violet-dim: #5b5fb0;
  --tn-pink: #d33682;
  --tn-border-subtle: #0f4856;
  --tn-border-strong: #1d6b7f;
  --tn-success: #859900;
  --tn-warning: #b58900;
  --tn-danger: #dc322f;
  --tn-q1: #dc322f;
  --tn-q2: #b58900;
  --tn-q3: #268bd2;
  --tn-q4: #859900;
  --tn-q5: #6c71c4;
}

:root[data-theme="catppuccin-mocha"] {
  --tn-bg: #1e1e2e;
  --tn-bg-surface: #181825;
  --tn-bg-surface-2: #313244;
  --tn-bg-elevated: #45475a;
  --tn-fg: #cdd6f4;
  --tn-fg-secondary: #bac2de;
  --tn-fg-muted: #a6adc8;
  --tn-cyan: #89dceb;
  --tn-cyan-dim: #74c7ec;
  --tn-violet: #cba6f7;
  --tn-violet-dim: #b4befe;
  --tn-pink: #f5c2e7;
  --tn-border-subtle: #313244;
  --tn-border-strong: #45475a;
  --tn-success: #a6e3a1;
  --tn-warning: #f9e2af;
  --tn-danger: #f38ba8;
  --tn-q1: #f38ba8;
  --tn-q2: #f9e2af;
  --tn-q3: #89dceb;
  --tn-q4: #a6e3a1;
  --tn-q5: #cba6f7;
}

:root[data-accent="cyan-violet"], :root:not([data-accent]) {
  --accent-primary: var(--tn-cyan, #7dd3fc);
  --accent-secondary: var(--tn-violet, #a78bfa);
}

:root[data-accent="violet-pink"] {
  --accent-primary: var(--tn-violet, #a78bfa);
  --accent-secondary: var(--tn-pink, #f472b6);
}

:root[data-accent="pink-amber"] {
  --accent-primary: var(--tn-pink, #f472b6);
  --accent-secondary: var(--tn-warning, #fbbf24);
}

:root[data-accent="green-cyan"] {
  --accent-primary: var(--tn-success, #4ade80);
  --accent-secondary: var(--tn-cyan, #7dd3fc);
}

:root {
  --density-row-pad: 14px;
  --density-section-pad: 24px;
}

:root[data-density="compact"] {
  --density-row-pad: 8px;
  --density-section-pad: 16px;
}

:root[data-density="comfort"] {
  --density-row-pad: 14px;
  --density-section-pad: 24px;
}

:root[data-density="cozy"] {
  --density-row-pad: 18px;
  --density-section-pad: 32px;
}

:root[data-animations="off"] *, :root[data-animations="off"] :before, :root[data-animations="off"] :after {
  transition-duration: .001ms !important;
  animation-duration: .001ms !important;
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}

.money-page, .money-grid {
  grid-template-columns: repeat(12, 1fr);
  gap: 16px;
  padding: 16px;
  display: grid;
  container-type: inline-size;
}

.money-page > *, .money-grid > * {
  grid-column: 1 / -1;
}

.money-row-7-5 {
  grid-column: 1 / -1;
  grid-template-columns: 7fr 5fr;
  gap: 16px;
  display: grid;
}

@container (width <= 900px) {
  .money-row-7-5 {
    grid-template-columns: 1fr;
  }
}

.transaction-composer, .composer-sticky, [data-testid="transaction-composer"] {
  z-index: 20;
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 8px;
  gap: 8px;
  padding: 12px 14px;
  display: grid;
  position: sticky;
  top: 56px;
}

.composer-segment-tabs, .tx-composer-tabs {
  gap: 4px;
  display: flex;
}

.composer-segment-tabs [role="tab"], .tx-composer-tab {
  letter-spacing: .04em;
  color: var(--tn-fg-muted);
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 4px;
  padding: 4px 10px;
  font-size: 12px;
}

.composer-segment-tabs [role="tab"][aria-selected="true"], .composer-segment-tabs [data-state="active"], .tx-composer-tab[aria-selected="true"] {
  color: var(--tn-cyan);
  background: var(--tn-bg-elevated);
  border-color: var(--tn-cyan-dim);
}

.composer-amount-wrap {
  background: var(--tn-bg-elevated);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 6px;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  display: flex;
}

.composer-amount-wrap input, .tx-composer input[type="text"]:not([class*="chip"]) {
  color: var(--tn-fg);
  background: none;
  border: none;
  outline: none;
  flex: 1;
  font-size: 16px;
}

.composer-chips-row {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  display: flex;
}

.composer-chip {
  background: var(--tn-bg-elevated);
  border: 1px solid var(--tn-border-subtle);
  color: var(--tn-fg-secondary);
  cursor: pointer;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 12px;
}

.composer-chip:hover {
  border-color: var(--tn-cyan-dim);
}

.composer-note, .tx-composer textarea {
  background: var(--tn-bg-elevated);
  border: 1px solid var(--tn-border-subtle);
  color: var(--tn-fg);
  resize: vertical;
  border-radius: 4px;
  min-height: 36px;
  padding: 6px 8px;
  font-size: 13px;
}

.composer-save {
  background: var(--tn-cyan-dim);
  color: var(--tn-bg);
  letter-spacing: .06em;
  cursor: pointer;
  border: none;
  border-radius: 4px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 700;
}

.composer-save:hover {
  background: var(--tn-cyan);
}

.composer-error {
  color: var(--tn-red);
  font-size: 12px;
}

.composer-kbd {
  color: var(--tn-fg-muted);
  letter-spacing: .06em;
  font-size: 11px;
}

.kpi-cards-row, [aria-label="KPI cards"] {
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  display: grid;
}

@container (width <= 900px) {
  .kpi-cards-row, [aria-label="KPI cards"] {
    grid-template-columns: repeat(2, 1fr);
  }
}

.kpi-card {
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 8px;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  display: flex;
}

.kpi-title {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--tn-fg-muted);
  font-size: 11px;
}

.kpi-hero {
  color: var(--tn-fg);
  margin: 0;
  font-size: 26px;
  font-weight: 700;
}

.kpi-suffix {
  color: var(--tn-fg-secondary);
  margin-left: 2px;
  font-size: 16px;
}

.kpi-sub {
  letter-spacing: .06em;
  color: var(--tn-fg-muted);
  margin: 0;
  font-size: 11px;
}

.todays-biggest-mover, .cost-of-live-block, .upcoming-recurring-block, .project-pnl-block, .recent-transactions, [data-testid="upcoming-recurring-block"], [data-testid="project-pnl-block"], [data-testid="cost-of-live-block"] {
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 8px;
  flex-direction: column;
  gap: 10px;
  padding: 14px 16px;
  display: flex;
}

.cost-of-live-block h3, .project-pnl-block h3, .recent-transactions h3, .todays-biggest-mover h3, .upcoming-recurring-block h3 {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tn-fg-secondary);
  margin: 0;
  font-size: 13px;
}

.income-vs-expenses-chart-container, [data-testid="income-vs-expenses-chart"] {
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 8px;
  height: 280px;
  padding: 12px;
  position: relative;
}

.income-vs-expenses-chart-container svg.recharts-surface {
  overflow: visible;
}

.cost-of-live-header {
  justify-content: space-between;
  align-items: baseline;
  display: flex;
}

.cost-of-live-empty-chips {
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.cost-of-live-empty-chips button, .cost-of-live-empty-chip {
  background: var(--tn-bg-elevated);
  border: 1px solid var(--tn-border-subtle);
  color: var(--tn-cyan);
  cursor: pointer;
  border-radius: 4px;
  padding: 6px 10px;
  font-size: 12px;
}

.cost-of-live-empty-chips button:hover, .cost-of-live-empty-chip:hover {
  border-color: var(--tn-cyan-dim);
}

.cost-of-live-row {
  background: var(--tn-bg-elevated);
  border-radius: 4px;
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px;
  display: flex;
}

.cost-of-live-pill {
  letter-spacing: .06em;
  text-transform: uppercase;
  border-radius: 3px;
  padding: 2px 6px;
  font-size: 11px;
}

.cost-of-live-pill[data-status="PAID"] {
  background: var(--tn-green);
  color: var(--tn-bg);
}

.cost-of-live-pill[data-status="DUE_TODAY"] {
  background: var(--tn-orange);
  color: var(--tn-bg);
}

.cost-of-live-pill[data-status="OVERDUE"] {
  background: var(--tn-red);
  color: var(--tn-bg);
}

.cost-of-live-pill[data-status="UPCOMING"] {
  background: var(--tn-bg-elevated);
  color: var(--tn-fg-secondary);
}

.cost-of-live-pill[data-status="SKIPPED"] {
  background: var(--tn-bg-elevated);
  color: var(--tn-fg-muted);
}

.project-pnl-block ul, .project-pnl-list {
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.project-pnl-block li, .project-pnl-row {
  border-radius: 4px;
  justify-content: space-between;
  align-items: center;
  padding: 6px 10px;
  display: flex;
}

.project-pnl-block li:hover, .project-pnl-row:hover {
  background: var(--tn-bg-elevated);
}

.project-pnl-block a {
  color: var(--tn-fg);
  flex: 1;
  text-decoration: none;
}

.project-pnl-block a:hover {
  color: var(--tn-cyan);
}

.recent-transactions header, .recent-transactions-header {
  justify-content: space-between;
  align-items: baseline;
  display: flex;
}

.recent-transactions a {
  color: var(--tn-cyan);
  font-size: 12px;
  text-decoration: none;
}

.recent-transactions ul {
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.recent-transactions li {
  border-radius: 4px;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  padding: 6px 10px;
  font-size: 13px;
  display: grid;
}

.recent-transactions li:hover {
  background: var(--tn-bg-elevated);
}

.accounts-sidebar {
  flex-direction: column;
  gap: 12px;
  padding: 8px;
  display: flex;
}

.account-group {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.account-group-header {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--tn-fg-muted);
  padding: 4px 6px;
  font-size: 11px;
}

.account-list-item {
  border: 1px solid var(--tn-border-subtle);
  background: var(--tn-bg-surface);
  cursor: pointer;
  color: var(--tn-fg);
  border-radius: 6px;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  text-decoration: none;
  display: flex;
}

.account-list-item:hover, .account-list-item[data-selected="true"] {
  border-color: var(--tn-cyan-dim);
}

.account-dot {
  background: var(--tn-cyan);
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.account-name {
  flex: 1;
  font-size: 13px;
}

.account-balance {
  font-variant-numeric: tabular-nums;
  font-size: 13px;
}

.account-balance-num {
  color: var(--tn-fg);
}

.account-balance-ccy {
  color: var(--tn-fg-muted);
  margin-left: 4px;
  font-size: 11px;
}

.account-kind-pill {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tn-fg-muted);
  font-size: 10px;
}

.reconcile-banner {
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 8px;
  flex-direction: column;
  gap: 10px;
  padding: 14px 16px;
  display: flex;
}

.reconcile-banner input {
  background: var(--tn-bg-elevated);
  border: 1px solid var(--tn-border-subtle);
  color: var(--tn-fg);
  font-variant-numeric: tabular-nums;
  border-radius: 4px;
  padding: 6px 10px;
}

.reconcile-banner button {
  background: var(--tn-cyan-dim);
  color: var(--tn-bg);
  cursor: pointer;
  border: none;
  border-radius: 4px;
  padding: 6px 14px;
  font-weight: 700;
}

.reconcile-banner button:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.recurring-rules-sidebar {
  flex-direction: column;
  gap: 6px;
  padding: 8px;
  display: flex;
}

.recurring-rule-item {
  border: 1px solid var(--tn-border-subtle);
  cursor: pointer;
  border-radius: 6px;
  flex-direction: column;
  gap: 2px;
  padding: 8px 10px;
  display: flex;
}

.recurring-rule-item:hover, .recurring-rule-item[data-selected="true"] {
  border-color: var(--tn-cyan-dim);
}

.rule-builder {
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 16px;
  padding: 18px 20px;
  display: grid;
}

.rule-builder-title {
  color: var(--tn-fg);
  letter-spacing: -.01em;
  grid-column: 1 / -1;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}

.rule-builder-segment-tabs {
  background: var(--tn-bg-base);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 999px;
  grid-column: 1 / -1;
  gap: 2px;
  width: max-content;
  padding: 3px;
  display: inline-flex;
}

.rule-builder-segment {
  letter-spacing: .06em;
  color: var(--tn-fg-muted);
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  padding: 6px 16px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 700;
  transition: background .14s, color .14s;
}

.rule-builder-segment.is-active {
  background: var(--tn-bg-elevated);
  color: var(--tn-fg);
}

.rule-builder-segment.is-active[aria-selected="true"]:first-child {
  color: var(--tn-success, #4ade80);
  background: #4ade8029;
}

.rule-builder-segment.is-active[aria-selected="true"]:last-child {
  color: var(--tn-danger, #f87171);
  background: #f8717129;
}

.rule-builder-field {
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.rule-builder-field-label {
  letter-spacing: .1em;
  color: var(--tn-fg-muted);
  text-transform: uppercase;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.rule-builder label {
  color: var(--tn-fg);
  text-transform: none;
  letter-spacing: 0;
  font-size: 13px;
}

.rule-builder input, .rule-builder select {
  background: var(--tn-bg-base);
  border: 1px solid var(--tn-border-subtle);
  color: var(--tn-fg);
  box-sizing: border-box;
  border-radius: 7px;
  outline: none;
  width: 100%;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 13px;
  transition: border-color .12s, box-shadow .12s;
}

.rule-builder input:focus, .rule-builder select:focus {
  border-color: var(--tn-cyan, #7dd3fc);
  box-shadow: 0 0 0 1px #7dd3fc33;
}

.rule-builder input[type="number"] {
  font-variant-numeric: tabular-nums;
}

.rule-builder input[type="date"] {
  color-scheme: dark;
}

.rule-builder-advanced-toggle {
  letter-spacing: .06em;
  color: var(--tn-fg-muted);
  cursor: pointer;
  grid-column: 1 / -1;
  align-items: center;
  gap: 8px;
  margin-top: 2px;
  font-family: JetBrains Mono, monospace;
  font-size: 10.5px;
  display: inline-flex;
}

.rule-builder-advanced-toggle input[type="checkbox"] {
  cursor: pointer;
  width: 14px;
  height: 14px;
  accent-color: var(--tn-cyan, #7dd3fc);
  margin: 0;
}

.rule-builder-save {
  background: linear-gradient(135deg, var(--tn-cyan, #7dd3fc), var(--tn-violet, #a78bfa));
  color: var(--tn-bg, #0a0e27);
  letter-spacing: .06em;
  cursor: pointer;
  border: 0;
  border-radius: 8px;
  grid-column: 1 / -1;
  margin-top: 4px;
  padding: 10px 16px;
  font-family: JetBrains Mono, monospace;
  font-size: 12px;
  font-weight: 700;
  transition: transform .1s, box-shadow .14s, filter .12s;
  box-shadow: 0 4px 14px #7dd3fc38;
}

.rule-builder-save:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px #7dd3fc52;
}

.rule-builder-save:disabled {
  opacity: .6;
  cursor: not-allowed;
}

.rule-builder-error {
  color: var(--tn-danger, #f87171);
  grid-column: 1 / -1;
  margin: 0;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.csv-wizard {
  flex-direction: column;
  gap: 16px;
  max-width: 900px;
  margin: 0 auto;
  padding: 16px;
  display: flex;
}

.csv-stepper {
  gap: 8px;
  display: flex;
}

.csv-stepper-item {
  border-bottom: 2px solid var(--tn-border-subtle);
  color: var(--tn-fg-muted);
  flex: 1;
  padding: 8px 10px;
  font-size: 12px;
}

.csv-stepper-item[data-active="true"] {
  border-bottom-color: var(--tn-cyan);
  color: var(--tn-cyan);
}

.csv-wizard-header {
  flex-direction: column;
  gap: 12px;
  display: flex;
}

.csv-wizard-stepper {
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.csv-wizard-stepper li {
  border-bottom: 2px solid var(--tn-border-subtle);
  color: var(--tn-fg-muted);
  flex: 1;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  font-size: 12px;
  display: flex;
  position: relative;
}

.csv-wizard-stepper li + li:before {
  content: "→";
  color: var(--tn-fg-muted);
  opacity: .5;
  font-size: 10px;
  position: absolute;
  top: 50%;
  left: -8px;
  transform: translateY(-50%);
}

.csv-stepper-num {
  background: var(--tn-bg-elevated, #ffffff14);
  border-radius: 50%;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  font-size: 11px;
  font-weight: 600;
  display: inline-flex;
}

.csv-stepper-label {
  letter-spacing: .04em;
  text-transform: uppercase;
}

.csv-wizard-stepper li.is-active {
  border-bottom-color: var(--tn-cyan);
  color: var(--tn-cyan);
}

.csv-wizard-stepper li.is-active .csv-stepper-num {
  background: var(--tn-cyan);
  color: var(--tn-bg-base, #0a0e14);
}

.csv-wizard-stepper li.is-done {
  border-bottom-color: var(--success);
  color: var(--success);
}

.csv-wizard-stepper li.is-done .csv-stepper-num {
  background: var(--success);
  color: var(--tn-bg-base, #0a0e14);
}

.csv-step {
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 8px;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  display: flex;
}

.csv-field {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.csv-field-label {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--tn-fg-muted);
  font-size: 11px;
}

.csv-field input, .csv-field select {
  background: var(--tn-bg-elevated);
  border: 1px solid var(--tn-border-subtle);
  color: var(--tn-fg);
  border-radius: 4px;
  padding: 6px 10px;
}

.csv-preview-table, .csv-full-table {
  border-collapse: collapse;
  width: 100%;
  font-size: 12px;
}

.csv-preview-table th, .csv-preview-table td, .csv-full-table th, .csv-full-table td {
  border: 1px solid var(--tn-border-subtle);
  text-align: left;
  padding: 4px 8px;
}

.csv-preview-table th, .csv-full-table th {
  background: var(--tn-bg-elevated);
  color: var(--tn-fg-secondary);
  font-weight: 700;
}

.csv-dup-chip {
  background: var(--tn-orange);
  color: var(--tn-bg);
  letter-spacing: .06em;
  border-radius: 3px;
  padding: 2px 6px;
  font-size: 10px;
}

.csv-bulk-actions {
  gap: 8px;
  display: flex;
}

.csv-btn-primary {
  background: var(--tn-cyan-dim);
  color: var(--tn-bg);
  cursor: pointer;
  border: none;
  border-radius: 4px;
  padding: 6px 14px;
  font-weight: 700;
}

.csv-btn-secondary {
  background: var(--tn-bg-elevated);
  color: var(--tn-fg);
  border: 1px solid var(--tn-border-subtle);
  cursor: pointer;
  border-radius: 4px;
  padding: 6px 14px;
}

.csv-error {
  color: var(--tn-red);
  font-size: 12px;
}

.transactions-list {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.transaction-row {
  border-radius: 4px;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  display: grid;
}

.transaction-row:hover {
  background: var(--tn-bg-elevated);
}

.transaction-filters-chips {
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 0;
  display: flex;
}

.capital-stub-block--live .capital-stub-cta--live {
  opacity: 1;
  cursor: pointer;
}

.capital-sparkline {
  width: 100%;
  height: 40px;
}

.bell-dropdown {
  position: relative;
}

.bell-dropdown-panel {
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  z-index: 30;
  border-radius: 8px;
  min-width: 280px;
  padding: 12px;
  position: absolute;
  top: 100%;
  right: 0;
}

.block-skeleton, .chart-skeleton {
  background: var(--tn-bg-surface);
  border: 1px solid var(--tn-border-subtle);
  border-radius: 8px;
  height: 120px;
  animation: 1.4s ease-in-out infinite finance-skeleton-pulse;
}

.chart-skeleton {
  height: 280px;
}

@keyframes finance-skeleton-pulse {
  0%, 100% {
    opacity: .6;
  }

  50% {
    opacity: .9;
  }
}

.transactions-page {
  flex-direction: column;
  gap: 12px;
  padding: 16px 0;
  display: flex;
}

.transactions-page h1 {
  color: var(--text-primary);
  letter-spacing: -.01em;
  margin: 0;
  font-size: 22px;
  font-weight: 700;
}

.transactions-header {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.transactions-modal-body .tx-filters-chips, .transactions-page .tx-filters-chips, .tx-filters-chips {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 0 12px;
  display: flex;
}

.tx-filter-segment {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  gap: 2px;
  padding: 3px;
  display: inline-flex;
}

.tx-filter-segment .tx-filter-chip {
  letter-spacing: .06em;
  color: var(--text-muted);
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  padding: 5px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 10.5px;
  transition: background .12s, color .12s;
}

.tx-filter-segment .tx-filter-chip[aria-pressed="true"], .tx-filter-segment .tx-filter-chip.is-active {
  color: var(--accent-cyan);
  background: #7dd3fc29;
  font-weight: 700;
}

.tx-filter-search, .tx-filter-account, .tx-filter-date {
  background: var(--bg-base);
  border: 1px solid var(--border-subtle);
  color: var(--text-primary);
  color-scheme: dark;
  border-radius: 8px;
  outline: none;
  padding: 7px 10px;
  font-family: inherit;
  font-size: 13px;
  transition: border-color .12s, box-shadow .12s;
}

.tx-filter-search {
  flex: 220px;
  min-width: 220px;
}

.tx-filter-account, .tx-filter-date {
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  min-width: 140px;
}

.tx-filter-search:focus, .tx-filter-account:focus, .tx-filter-date:focus {
  border-color: var(--accent-cyan);
  box-shadow: 0 0 0 1px #7dd3fc33;
}

.tx-filter-date-sep {
  color: var(--text-muted);
  font-family: JetBrains Mono, monospace;
  font-size: 12px;
}

.tx-list-empty {
  text-align: center;
  color: var(--text-muted);
  background: var(--bg-surface);
  border: 1px dashed var(--border-subtle);
  border-radius: 10px;
  padding: 32px 16px;
  font-size: 13px;
}

.tx-list {
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.tx-list-bulk-bar {
  color: var(--accent-cyan);
  background: #7dd3fc14;
  border: 1px solid #7dd3fc40;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  padding: 8px 14px;
  font-size: 12px;
  display: flex;
}

.tx-list-bulk-bar button {
  color: var(--accent-cyan);
  cursor: pointer;
  background: none;
  border: 1px solid #7dd3fc4d;
  border-radius: 6px;
  padding: 4px 10px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.tx-list-rows {
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.tx-list-li {
  border-radius: 8px;
  grid-template-columns: 28px 1fr;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  transition: background .1s;
  display: grid;
}

.tx-list-li:hover {
  background: var(--bg-elevated);
}

.tx-list-li[data-selected] {
  background: #7dd3fc1a;
}

.tx-list-checkbox {
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.tx-list-checkbox input[type="checkbox"] {
  width: 14px;
  height: 14px;
  accent-color: var(--accent-cyan);
  cursor: pointer;
}

.tx-list-sentinel {
  color: var(--text-muted);
  text-align: center;
  padding: 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.tx-row {
  background: var(--bg-base);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  grid-template-columns: 32px 1fr auto;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 8px 12px;
  display: grid;
}

.tx-row-icon-circle {
  background: currentColor;
  border: 1px solid;
  border-radius: 9px;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .tx-row-icon-circle {
    background: color-mix(in srgb, currentColor 12%, transparent);
    border: 1px solid color-mix(in srgb, currentColor 30%, transparent);
  }
}

.tx-row-meta {
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.tx-row-meta-1 {
  color: var(--text-primary);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 500;
  overflow: hidden;
}

.tx-row-meta-2 {
  letter-spacing: .04em;
  color: var(--text-muted);
  font-family: JetBrains Mono, monospace;
  font-size: 10.5px;
}

.tx-row-amount {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-family: JetBrains Mono, monospace;
  font-size: 13px;
  font-weight: 700;
}

[data-page="money"] {
  --bg-base: var(--tn-bg);
  --bg-surface: var(--tn-bg-surface);
  --bg-surface-2: var(--tn-bg-surface-2);
  --bg-elevated: var(--tn-bg-elevated);
  --border-subtle: var(--tn-border-subtle);
  --border-strong: var(--tn-border-strong);
  --text-primary: var(--tn-fg);
  --text-secondary: var(--tn-fg-secondary);
  --text-muted: var(--tn-fg-muted);
  --accent-cyan: var(--tn-cyan);
  --accent-cyan-dim: var(--tn-cyan-dim);
  --accent-violet: var(--tn-violet);
  --accent-violet-dim: var(--tn-violet-dim);
  --accent-pink: var(--tn-pink);
  --success: var(--tn-success);
  --warning: var(--tn-warning);
  --danger: var(--tn-danger);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-full: 9999px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;
  --glow-cyan: 0 0 12px #7dd3fc40;
  --glow-violet: 0 0 12px #a78bfa40;
  --glow-danger: 0 0 12px #f871714d;
  background: var(--bg-base);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  line-height: 1.5;
}

[data-page="money"] .t-heading {
  font-size: 26px;
  font-weight: 700;
  line-height: 1.2;
}

[data-page="money"] .t-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
}

[data-page="money"] .t-body {
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

[data-page="money"] .t-body-s {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
}

[data-page="money"] .t-body-s-bold {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
}

[data-page="money"] .t-mono-l {
  font-family: JetBrains Mono, ui-monospace, SF Mono, Menlo, monospace;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
}

[data-page="money"] .t-mono-m {
  letter-spacing: .08em;
  font-family: JetBrains Mono, ui-monospace, SF Mono, Menlo, monospace;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.3;
}

[data-page="money"] .t-mono-s {
  letter-spacing: .08em;
  font-family: JetBrains Mono, ui-monospace, SF Mono, Menlo, monospace;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.2;
}

[data-page="money"] .muted {
  color: var(--text-muted);
}

[data-page="money"] .secondary {
  color: var(--text-secondary);
}

@keyframes m2-pop-in {
  from {
    opacity: 0;
    transform: translateY(-6px)scale(.97);
  }

  to {
    opacity: 1;
    transform: translateY(0)scale(1);
  }
}

@keyframes pending-reject-slide-in {
  from {
    opacity: 0;
    transform: translateX(8px)scale(.94);
  }

  to {
    opacity: 1;
    transform: translateX(0)scale(1);
  }
}

.dash-frame:has([data-money-composer-host="true"]) .dash-greeting {
  z-index: 10;
  background: var(--bg-base);
  height: auto;
  min-height: 64px;
  position: sticky;
  top: 0;
}

.dash-frame:has([data-money-composer-host="true"]) .dash-greeting .greet {
  gap: 4px;
}

.money-composer-panel, [data-page="money"] .money-composer-panel {
  margin: 0 0 12px;
  display: none !important;
}

.money-composer-panel[data-open="true"], [data-page="money"] .money-composer-panel[data-open="true"] {
  background: var(--bg-base);
  border-bottom: 1px solid var(--border-subtle);
  padding-bottom: 10px;
  top: var(--money-topbar-h, 80px) !important;
  z-index: 9 !important;
  display: block !important;
  position: sticky !important;
}

.money-composer-panel-inner {
  padding: 10px 0 0;
  position: relative;
}

.money-composer-panel-close {
  border: 1px solid var(--border-subtle);
  background: var(--bg-surface);
  width: 26px;
  height: 26px;
  color: var(--text-muted);
  cursor: pointer;
  z-index: 2;
  border-radius: 7px;
  justify-content: center;
  align-items: center;
  transition: background .14s, color .14s, border-color .14s;
  display: inline-flex;
  position: absolute;
  top: 14px;
  right: 8px;
}

.money-composer-panel-close:hover {
  background: var(--bg-elevated);
  color: var(--text-primary);
  border-color: var(--accent-cyan);
}

.money-composer-panel .fin-composer {
  margin: 0;
  padding-right: 44px;
  position: relative;
  top: auto;
}

[data-page="money"] .fin-hero-card-link {
  cursor: pointer;
  transition: border-color .14s, transform .1s, box-shadow .14s;
}

[data-page="money"] .fin-hero-card-link:hover {
  border-color: #7dd3fc73;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px #7dd3fc2e;
}

[data-page="money"] .fin-chips {
  overflow-y: visible;
}

[data-page="money"] .fin-composer {
  position: relative;
  overflow: visible;
}

[data-page="money"] .fin-chip {
  cursor: pointer;
  user-select: none;
  gap: 7px;
  min-height: 32px;
  padding: 0 12px;
}

[data-page="money"] .fin-chip:hover {
  background: var(--bg-elevated);
  border-color: var(--accent-cyan);
}

[data-page="money"] .fin-chip[aria-expanded="true"] {
  background: var(--bg-elevated);
  border-color: var(--accent-cyan);
  box-shadow: 0 0 0 1px #7dd3fc2e, 0 0 12px #7dd3fc1f;
}

[data-page="money"] .fin-chip .ic {
  opacity: .9;
  flex-shrink: 0;
  align-items: center;
  display: inline-flex;
}

[data-page="money"] .fin-chip:hover .ic, [data-page="money"] .fin-chip[aria-expanded="true"] .ic {
  opacity: 1;
}

[data-page="money"] .fin-chip.note {
  cursor: text;
  background: var(--bg-surface);
  flex: 0 200px;
  min-width: 140px;
  max-width: 260px;
  padding: 0 12px;
}

[data-page="money"] .fin-chip.note .ic, [data-page="money"] .fin-chip.note svg {
  color: var(--text-muted);
}

[data-page="money"] .fin-chip.note input {
  color: var(--text-primary);
  background: none;
  border: 0;
  outline: none;
  flex: 1;
  width: 100%;
  min-width: 0;
  padding: 0;
  font-family: inherit;
  font-size: 11px;
  line-height: 1;
}

[data-page="money"] .fin-chip.note input::placeholder {
  color: var(--text-muted);
}

[data-page="money"] .fin-chip.note:focus-within {
  border-color: var(--accent-cyan);
  background: var(--bg-elevated);
}

[data-page="money"] .fin-chip.note:focus-within .ic, [data-page="money"] .fin-chip.note:focus-within svg {
  color: var(--accent-cyan);
}

[data-page="money"] .fin-amount {
  transition: border-color .12s, box-shadow .12s;
}

[data-page="money"] .fin-amount:focus-within {
  border-color: var(--accent-cyan);
  box-shadow: 0 0 0 1px #7dd3fc33;
}

[data-page="money"] .fin-type-seg button {
  transition: background .14s, color .14s, box-shadow .14s;
}

[data-page="money"] .fin-type-seg button:not(.active):hover {
  color: var(--text-primary);
  background: #7dd3fc14;
}

[data-page="money"] .fin-type-seg button.active.expense {
  box-shadow: inset 0 0 0 1px #f871714d;
}

[data-page="money"] .fin-type-seg button.active.income {
  box-shadow: inset 0 0 0 1px #4ade804d;
}

[data-page="money"] .fin-type-seg button.active.transfer {
  box-shadow: inset 0 0 0 1px #a78bfa4d;
}

[data-page="money"] .fin-save {
  transition: transform .12s, box-shadow .18s, filter .12s;
}

[data-page="money"] .fin-save:hover:not(:disabled) {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px #7dd3fc47;
}

[data-page="money"] .fin-save:disabled {
  opacity: .6;
  cursor: not-allowed;
}

[data-page="money"] .fin-composer-close {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  width: 32px;
  height: 32px;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  transition: color .12s, background .12s, border-color .12s;
  display: inline-flex;
}

[data-page="money"] .fin-composer-close:hover {
  color: var(--accent-cyan);
  border-color: var(--accent-cyan);
  background: var(--bg-surface);
}

.sidebar-detail-page {
  grid-template-columns: 320px 1fr;
  gap: 16px;
  min-height: calc(100vh - 96px);
  padding: 16px;
  display: grid;
}

.detail-panel {
  background: var(--tn-bg-surface-2, #1e2342);
  border: 1px solid var(--tn-border-subtle, #2a2f4a);
  border-radius: 12px;
  padding: 22px;
  overflow-y: auto;
}

.recurring-sidebar {
  background: var(--tn-bg-surface, #161a35);
  border: 1px solid var(--tn-border-subtle, #2a2f4a);
  border-radius: 12px;
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.recurring-sidebar--empty, .recurring-sidebar--loading {
  color: var(--tn-fg-muted, #64748b);
  padding: 20px;
}

.recurring-sidebar ul {
  flex: 1;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
}

.recurring-sidebar li {
  border-bottom: 1px solid var(--tn-border-subtle, #2a2f4a);
}

.recurring-sidebar a, .recurring-sidebar [role="link"] {
  color: var(--tn-fg, #e2e8f0);
  cursor: pointer;
  border-left: 2px solid #0000;
  grid-template-columns: 8px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  text-decoration: none;
  display: grid;
}

.recurring-sidebar a:hover, .recurring-sidebar a[data-selected="true"], .recurring-sidebar [role="link"][data-selected="true"] {
  background: var(--tn-bg-elevated, #252a4d);
  border-left-color: var(--tn-cyan, #7dd3fc);
}

.recurring-cta {
  border-top: 1px dashed var(--tn-border-subtle, #2a2f4a);
  color: var(--tn-cyan, #7dd3fc);
  cursor: pointer;
  padding: 12px 14px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  text-decoration: none;
  display: block;
}

.cost-of-live-block, .cost-of-live-empty {
  background: var(--tn-bg-surface, #161a35);
  border: 1px solid var(--tn-border-subtle, #2a2f4a);
  border-radius: 12px;
  padding: 18px 20px;
}

.cost-of-live-header, .cost-of-live-empty-header {
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
  display: flex;
}

.cost-of-live-header-titles {
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.cost-of-live-title {
  letter-spacing: -.01em;
  color: var(--tn-fg, #e2e8f0);
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  display: inline-flex;
}

.cost-of-live-title > svg {
  color: var(--tn-cyan, #7dd3fc);
}

.cost-of-live-sub-meta {
  color: var(--tn-fg-muted, #64748b);
  letter-spacing: .1em;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.cost-of-live-progress {
  flex-shrink: 0;
  align-items: center;
  gap: 10px;
  min-width: 160px;
  display: flex;
}

.cost-of-live-progress-track {
  background: #7dd3fc1a;
  border-radius: 999px;
  width: 140px;
  height: 6px;
  position: relative;
  overflow: hidden;
}

.cost-of-live-progress-fill {
  background: linear-gradient(90deg, var(--tn-cyan, #7dd3fc), var(--tn-violet, #a78bfa));
  border-radius: 999px;
  transition: width .3s;
  position: absolute;
  inset: 0 auto 0 0;
  box-shadow: 0 0 8px #7dd3fc66;
}

.cost-of-live-progress-label {
  color: var(--tn-cyan, #7dd3fc);
  letter-spacing: .04em;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 700;
}

.cost-of-live-add-btn {
  height: 30px;
  color: var(--tn-cyan, #7dd3fc);
  letter-spacing: .04em;
  cursor: pointer;
  background: #7dd3fc1a;
  border: 1px solid #7dd3fc59;
  border-radius: 8px;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 700;
  transition: background .12s, border-color .12s, transform .1s;
  display: inline-flex;
}

.cost-of-live-add-btn:hover {
  background: #7dd3fc2e;
  border-color: #7dd3fc8c;
  transform: translateY(-1px);
}

.tx-detail-btn {
  cursor: pointer;
  border-radius: 7px;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 7px 14px;
  font-size: 12px;
  font-weight: 600;
  transition: background .12s, border-color .12s, transform .1s;
  display: inline-flex;
}

.tx-detail-btn.primary {
  background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
  color: var(--bg-base);
  border: 0;
  box-shadow: 0 4px 12px #7dd3fc38;
}

.tx-detail-btn.primary:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px #7dd3fc52;
}

.tx-detail-btn.ghost {
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  background: none;
}

.tx-detail-btn.ghost:hover:not(:disabled) {
  border-color: var(--accent-cyan);
  color: var(--text-primary);
}

.tx-detail-btn.danger-ghost {
  color: var(--danger);
  background: none;
  border: 1px solid #f871714d;
}

.tx-detail-btn.danger-ghost:hover:not(:disabled) {
  border-color: var(--danger);
  background: #f871711a;
}

.tx-detail-btn.danger {
  background: var(--danger);
  color: #fff;
  border: 0;
}

.tx-detail-btn:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.income-chart-toolbar {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 4px;
  padding: 10px 12px 6px;
  display: flex;
}

.income-chart-title {
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 600;
}

.income-chart-toggle {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  padding: 2px;
  display: inline-flex;
}

.income-chart-toggle-btn {
  color: var(--text-muted);
  letter-spacing: .04em;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  padding: 4px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 10.5px;
  transition: background .14s, color .14s;
}

.income-chart-toggle-btn[data-active="true"] {
  color: var(--accent-cyan);
  background: #7dd3fc29;
  font-weight: 700;
}

.income-chart-toggle-btn:hover:not([data-active="true"]) {
  color: var(--text-primary);
}

.cost-of-live-empty-hint {
  color: var(--tn-fg-secondary, #94a3b8);
  margin: 0 0 14px;
  font-size: 13px;
  line-height: 1.6;
}

.cost-of-live-empty-chips {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 4px;
  display: grid;
}

@media (width <= 720px) {
  .cost-of-live-empty-chips {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.cost-of-live-empty-chip {
  background: var(--tn-bg-base, #0a0e27);
  border: 1px solid var(--tn-border-subtle, #2a2f4a);
  color: var(--tn-fg, #e2e8f0);
  cursor: pointer;
  text-align: left;
  border-radius: 10px;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  font-size: 12.5px;
  font-weight: 500;
  transition: transform .12s, box-shadow .14s, border-color .14s, background .14s;
  display: inline-flex;
}

.cost-of-live-empty-chip:hover {
  border-color: var(--tn-cyan, #7dd3fc);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px #7dd3fc26;
}

.cost-of-live-empty-chip:disabled {
  opacity: .6;
  cursor: not-allowed;
}

.cost-of-live-empty-chip[data-active="true"] {
  box-shadow: 0 4px 14px #7dd3fc2e;
}

.cost-of-live-empty-chip-icon {
  border: 1px solid #0000;
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  display: inline-flex;
}

.cost-of-live-empty-chip-label {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.cost-of-live-empty-form-header, .col-create-form-header {
  letter-spacing: .06em;
  border: 1px solid #0000;
  border-radius: 8px;
  grid-column: 1 / -1;
  align-self: start;
  align-items: center;
  gap: 8px;
  width: max-content;
  margin-bottom: 2px;
  padding: 6px 10px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  display: inline-flex;
}

.cost-of-live-empty-form, .col-create-form {
  background: var(--tn-bg-base, #0a0e27);
  border: 1px solid var(--tn-border-subtle, #2a2f4a);
  border-radius: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
  padding: 14px;
  display: grid;
}

.col-create-form--inline {
  margin-top: 14px;
}

.col-create-form--modal {
  background: none;
  border: 0;
  padding: 0;
}

.cost-of-live-empty-field, .col-create-field {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.cost-of-live-empty-field > span, .col-create-field > span {
  color: var(--tn-fg-muted, #64748b);
  letter-spacing: .1em;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.cost-of-live-empty-field input, .cost-of-live-empty-field select, .col-create-field input, .col-create-field select {
  background: var(--tn-bg-surface, #161a35);
  border: 1px solid var(--tn-border-subtle, #2a2f4a);
  color: var(--tn-fg, #e2e8f0);
  border-radius: 7px;
  outline: none;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 13px;
  transition: border-color .12s;
}

.cost-of-live-empty-field input:focus, .cost-of-live-empty-field select:focus, .col-create-field input:focus, .col-create-field select:focus {
  border-color: var(--tn-cyan, #7dd3fc);
}

.cost-of-live-empty-form-actions, .col-create-form-actions {
  grid-column: 1 / -1;
  gap: 8px;
  margin-top: 4px;
  display: flex;
}

.cost-of-live-action {
  letter-spacing: .04em;
  cursor: pointer;
  border-radius: 6px;
  padding: 8px 14px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 700;
  transition: all .12s;
}

.cost-of-live-action.mark-paid {
  background: var(--tn-cyan, #7dd3fc);
  color: var(--tn-bg, #0a0e27);
  border: 1px solid var(--tn-cyan, #7dd3fc);
}

.cost-of-live-action.skip {
  color: var(--tn-fg-secondary, #94a3b8);
  border: 1px solid var(--tn-border-subtle, #2a2f4a);
  background: none;
}

.cost-of-live-action:hover {
  filter: brightness(1.1);
}

.cost-of-live-action:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.cost-of-live-actions {
  gap: 6px;
  display: flex;
}

.cost-of-live-name-block {
  flex-direction: column;
  flex: 1;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.cost-of-live-name {
  color: var(--tn-fg, #e2e8f0);
  font-size: 13px;
}

.cost-of-live-meta {
  color: var(--tn-fg-muted, #64748b);
  letter-spacing: .06em;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.cost-of-live-amount {
  color: var(--tn-fg, #e2e8f0);
  font-family: JetBrains Mono, monospace;
  font-size: 13px;
  font-weight: 700;
}

.cost-of-live-error {
  color: var(--tn-danger, #f87171);
  grid-column: 1 / -1;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.cost-of-live-body {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.cost-of-live-row {
  background: var(--tn-bg-base, #0a0e27);
  border: 1px solid var(--tn-border-subtle, #2a2f4a);
  border-radius: 10px;
  grid-template-columns: 36px auto 1fr auto auto;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  transition: border-color .12s, transform .12s;
  display: grid;
}

.cost-of-live-row:hover {
  border-color: #7dd3fc4d;
}

.cost-of-live-icon-badge {
  border: 1px solid #0000;
  border-radius: 9px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: inline-flex;
}

.cost-of-live-pill {
  letter-spacing: .08em;
  white-space: nowrap;
  border: 1px solid #0000;
  border-radius: 999px;
  padding: 3px 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 9.5px;
  font-weight: 700;
}

.cost-of-live-pill[data-status="PAID"] {
  color: var(--tn-success, #4ade80);
  background: #4ade8024;
  border-color: #4ade804d;
}

.cost-of-live-pill[data-status="OVERDUE"] {
  color: var(--tn-danger, #f87171);
  background: #f8717124;
  border-color: #f871714d;
}

.cost-of-live-pill[data-status="DUE_TODAY"] {
  color: var(--tn-cyan, #7dd3fc);
  background: #7dd3fc24;
  border-color: #7dd3fc4d;
}

.cost-of-live-pill[data-status="DUE_N"] {
  color: var(--tn-yellow, #fbbf24);
  background: #fbbf2424;
  border-color: #fbbf244d;
}

.cost-of-live-pill[data-status="UPCOMING"], .cost-of-live-pill[data-status="SKIPPED"] {
  color: var(--tn-fg-muted, #94a3b8);
  background: #94a3b81a;
  border-color: #94a3b833;
}

.cost-of-live-undo-toast {
  color: var(--tn-fg, #e2e8f0);
  background: #7dd3fc14;
  border: 1px solid #7dd3fc40;
  border-radius: 8px;
  grid-column: 1 / -1;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  padding: 8px 12px;
  font-size: 12px;
  display: flex;
}

.cost-of-live-undo-button {
  border: 1px solid var(--tn-cyan, #7dd3fc);
  color: var(--tn-cyan, #7dd3fc);
  cursor: pointer;
  background: none;
  border-radius: 6px;
  padding: 3px 10px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 700;
}

.m2-pop input:focus {
  box-shadow: 0 0 0 1px #7dd3fc2e;
  border-color: var(--tn-cyan, #7dd3fc) !important;
}

@scope ([data-page="money"]) {
  :scope {
    font-family: Inter, system-ui, sans-serif;
  }

  .shell {
    background: var(--bg-base);
    grid-template-rows: 1fr;
    display: grid;
    position: fixed;
    inset: 48px 0 0;
  }

  .shell.matrix {
    grid-template-columns: 80px 1fr;
  }

  .shell.today {
    grid-template-columns: 80px 280px 1fr;
  }

  .shell.dash, .shell.money, .shell.habits, .shell.gym, .shell.notes, .shell.timer, .shell.settings {
    grid-template-columns: 80px 1fr;
  }

  .rail {
    background: var(--bg-surface);
    border-right: 1px solid var(--border-subtle);
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 14px 0;
    display: flex;
  }

  .rail .logo {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: #0a0e27;
    border-radius: 10px;
    place-items: center;
    width: 40px;
    height: 40px;
    margin-bottom: 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 18px;
    font-weight: 800;
    display: grid;
    box-shadow: 0 0 16px #7dd3fc4d;
  }

  .rail .item {
    width: 48px;
    height: 48px;
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 10px;
    place-items: center;
    font-size: 18px;
    transition: all .12s;
    display: grid;
    position: relative;
  }

  .rail .item:hover {
    background: var(--bg-elevated);
    color: var(--text-primary);
  }

  .rail .item.active {
    color: var(--accent-cyan);
    background: #7dd3fc1a;
    box-shadow: 0 0 12px #7dd3fc40;
  }

  .rail .item.active:before {
    content: "";
    background: var(--accent-cyan);
    border-radius: 0 2px 2px 0;
    width: 3px;
    height: 24px;
    position: absolute;
    left: -4px;
  }

  .rail .item .badge {
    background: var(--accent-pink);
    color: #0a0e27;
    text-align: center;
    border-radius: 9999px;
    min-width: 14px;
    padding: 1px 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    font-weight: 700;
    position: absolute;
    top: 4px;
    right: 4px;
    box-shadow: 0 0 6px #f472b666;
  }

  .rail .grow {
    flex: 1;
  }

  .rail .avatar {
    background: linear-gradient(135deg, var(--accent-pink), var(--accent-violet));
    color: #fff;
    cursor: pointer;
    border-radius: 50%;
    place-items: center;
    width: 36px;
    height: 36px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 700;
    display: grid;
  }

  .content {
    flex-direction: column;
    height: 100%;
    min-height: 0;
    display: flex;
    overflow: hidden;
  }

  .content > .topbar {
    flex: none;
  }

  .content > .today-body {
    flex: auto;
    min-height: 0;
  }

  .topbar {
    border-bottom: 1px solid var(--border-subtle);
    background: var(--bg-base);
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 14px 24px;
    display: flex;
  }

  .greeting {
    flex-direction: column;
    gap: 2px;
    display: flex;
  }

  .greeting .crumb {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-transform: uppercase;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .greeting .ttl {
    font-size: 18px;
    font-weight: 800;
  }

  .greeting .ttl .name {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: #0000;
    -webkit-background-clip: text;
    background-clip: text;
  }

  .greeting .meta {
    color: var(--text-muted);
    letter-spacing: .04em;
    margin-left: 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 400;
  }

  .topbar .right {
    align-items: center;
    gap: 10px;
    display: flex;
  }

  .qa-pill {
    border: 1px solid var(--accent-cyan);
    border-radius: var(--radius-sm);
    color: var(--accent-cyan);
    cursor: pointer;
    box-shadow: var(--glow-cyan);
    letter-spacing: .06em;
    background: linear-gradient(135deg, #7dd3fc26, #a78bfa1a);
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 700;
    display: flex;
  }

  .qa-pill .plus-glyph {
    background: var(--accent-cyan);
    width: 16px;
    height: 16px;
    color: var(--bg-base);
    border-radius: 4px;
    place-items: center;
    font-size: 12px;
    font-weight: 800;
    display: grid;
  }

  .qa-pill kbd {
    background: var(--bg-elevated);
    border: 1px solid var(--border-strong);
    color: var(--text-secondary);
    border-radius: 3px;
    padding: 1px 6px;
    font-size: 10px;
    font-weight: 500;
  }

  .cmdk-pill {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    min-width: 220px;
    padding: 7px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    display: flex;
  }

  .cmdk-pill:hover {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
  }

  .cmdk-pill .left-grp {
    align-items: center;
    gap: 8px;
    display: flex;
  }

  .cmdk-pill kbd {
    background: var(--bg-elevated);
    border: 1px solid var(--border-strong);
    border-radius: 3px;
    padding: 1px 6px;
    font-size: 10px;
  }

  .bell-btn {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    width: 36px;
    height: 36px;
    color: var(--text-secondary);
    cursor: pointer;
    border-radius: 50%;
    place-items: center;
    font-size: 14px;
    display: grid;
    position: relative;
  }

  .bell-btn:hover {
    border-color: var(--border-strong);
    color: var(--text-primary);
  }

  .bell-btn .b-badge {
    background: var(--danger);
    color: #fff;
    border: 2px solid var(--bg-base);
    border-radius: 50%;
    place-items: center;
    width: 16px;
    height: 16px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    font-weight: 700;
    display: grid;
    position: absolute;
    top: -2px;
    right: -2px;
  }

  .avatar-pill {
    background: linear-gradient(135deg, var(--accent-pink), var(--accent-violet));
    color: #fff;
    cursor: pointer;
    border-radius: 50%;
    place-items: center;
    width: 36px;
    height: 36px;
    font-family: JetBrains Mono, monospace;
    font-size: 13px;
    font-weight: 700;
    display: grid;
  }

  .matrix-area {
    flex-direction: column;
    gap: 12px;
    padding: 12px 16px 16px;
    display: flex;
    overflow-y: auto;
  }

  .matrix-area > .matrix {
    flex: 1 1 0;
    grid-template-rows: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    min-height: 0;
    display: grid;
  }

  .matrix-area > .matrix .zone {
    min-height: 0;
    overflow: hidden;
  }

  .matrix-area > .matrix .zone .zone-body {
    overflow-y: auto;
  }

  .zone {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    flex-direction: column;
    padding: 14px 14px 10px;
    display: flex;
    overflow: hidden;
  }

  .zone-head {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    display: flex;
  }

  .zone-title {
    letter-spacing: .1em;
    text-transform: uppercase;
    align-items: center;
    gap: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    display: flex;
  }

  .zone-title .dot {
    border-radius: 50%;
    width: 8px;
    height: 8px;
  }

  .zone-q1 .dot {
    background: var(--danger);
  }

  .zone-q2 .dot {
    background: var(--warning);
  }

  .zone-q3 .dot {
    background: var(--accent-cyan);
  }

  .zone-q4 .dot {
    background: var(--success);
  }

  .zone-count {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .zone-actions {
    gap: 2px;
    margin-left: 8px;
    display: flex;
  }

  .zone-actions button {
    color: var(--text-muted);
    cursor: pointer;
    background: none;
    border: 1px solid #0000;
    border-radius: 4px;
    place-items: center;
    width: 22px;
    height: 22px;
    font-size: 13px;
    line-height: 1;
    transition: all .12s;
    display: grid;
  }

  .zone-actions button:hover {
    background: var(--bg-elevated);
    color: var(--text-primary);
    border-color: var(--border-strong);
  }

  .zone-head .right-grp {
    align-items: center;
    gap: 0;
    display: flex;
  }

  .zone-body {
    flex-direction: column;
    flex: 1;
    gap: 4px;
    min-height: 0;
    padding-right: 4px;
    display: flex;
    overflow-y: auto;
  }

  .folder {
    flex-direction: column;
    display: flex;
  }

  .folder + .folder {
    margin-top: 6px;
  }

  .folder-head {
    cursor: pointer;
    user-select: none;
    align-items: center;
    gap: 8px;
    padding: 5px 4px;
    transition: color .12s;
    display: flex;
  }

  .folder-head:hover {
    background: var(--bg-base);
    border-radius: 4px;
  }

  .folder-head .chevron {
    width: 10px;
    color: var(--text-muted);
    font-size: 10px;
    line-height: 1;
    transition: transform .16s;
    display: inline-block;
  }

  .folder.collapsed .chevron {
    transform: rotate(-90deg);
  }

  .folder-head .f-name {
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 700;
  }

  .folder-head .f-name.project {
    color: var(--accent-pink);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
  }

  .folder-head .f-name.completed {
    color: var(--text-muted);
    letter-spacing: .06em;
    text-transform: uppercase;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 500;
  }

  .folder-head .f-count {
    color: var(--text-muted);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .folder-body {
    flex-direction: column;
    gap: 3px;
    display: flex;
  }

  .folder.collapsed .folder-body {
    display: none;
  }

  .tc {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    cursor: pointer;
    align-items: center;
    gap: 10px;
    min-height: 28px;
    padding: 5px 10px;
    transition: all .12s;
    display: flex;
    overflow: hidden;
  }

  .tc:hover {
    border-color: var(--border-strong);
    background: var(--bg-elevated);
  }

  .tc .check {
    border: 1.5px solid var(--border-strong);
    border-radius: 4px;
    flex-shrink: 0;
    width: 14px;
    height: 14px;
  }

  .tc.p1 .check {
    border-color: var(--danger);
  }

  .tc.p2 .check {
    border-color: var(--warning);
  }

  .tc.p3 .check {
    border-color: var(--accent-cyan);
  }

  .tc.p4 .check {
    border-color: var(--success);
  }

  .tc .title {
    min-width: 0;
    color: var(--text-primary);
    white-space: nowrap;
    text-overflow: ellipsis;
    flex: 1;
    font-size: 13px;
    line-height: 1.35;
    overflow: hidden;
  }

  .tc .meta {
    color: var(--text-muted);
    letter-spacing: .04em;
    flex-shrink: 0;
    align-items: center;
    gap: 5px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: inline-flex;
  }

  .tc .meta .due-soon {
    color: var(--warning);
  }

  .tc .meta .overdue {
    color: var(--danger);
  }

  .folder-body .tc {
    border: none;
    border-bottom: 1px solid var(--border-subtle);
    background: none;
    border-radius: 0;
    min-height: 32px;
    padding: 7px 4px 7px 22px;
  }

  .folder-body .tc:last-child {
    border-bottom: none;
  }

  .folder-body .tc:hover {
    background: var(--bg-elevated);
    border-bottom-color: var(--border-strong);
  }

  .tc.completed {
    opacity: .5;
  }

  .tc.completed .check {
    background: var(--success);
    border-color: var(--success);
    color: var(--bg-base);
    place-items: center;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    display: grid;
  }

  .tc.completed .check:before {
    content: "✓";
  }

  .tc.completed .title {
    color: var(--text-muted);
    text-decoration: line-through;
  }

  .tag {
    letter-spacing: .03em;
    white-space: nowrap;
    border-radius: 9999px;
    align-items: center;
    padding: 2px 9px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.3;
    display: inline-flex;
  }

  .tag[data-c="cyan"] {
    color: var(--accent-cyan);
    background: #7dd3fc26;
  }

  .tag[data-c="violet"] {
    color: var(--accent-violet);
    background: #a78bfa2e;
  }

  .tag[data-c="pink"] {
    color: var(--accent-pink);
    background: #f472b62e;
  }

  .tag[data-c="warning"] {
    color: var(--warning);
    background: #fbbf2426;
  }

  .tag[data-c="success"] {
    color: var(--success);
    background: #4ade8026;
  }

  .tag[data-c="danger"] {
    color: var(--danger);
    background: #f871712e;
  }

  .tag[data-c="muted"] {
    background: var(--bg-elevated);
    color: var(--text-secondary);
  }

  .waiting-strip {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    flex-shrink: 0;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    display: flex;
    overflow-x: auto;
  }

  .waiting-strip .ws-label {
    color: var(--accent-violet);
    letter-spacing: .1em;
    text-transform: uppercase;
    flex-shrink: 0;
    align-items: center;
    gap: 6px;
    margin-right: 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .waiting-strip .ws-label .pause-icon {
    background: var(--accent-violet);
    border-radius: 2px;
    width: 8px;
    height: 8px;
  }

  .ws-card {
    background: var(--bg-surface-2);
    border-radius: var(--radius-sm);
    cursor: pointer;
    border: 1px solid #a78bfa33;
    flex-shrink: 0;
    width: 220px;
    padding: 8px 10px;
  }

  .ws-card .title {
    font-size: 12px;
    line-height: 1.35;
  }

  .ws-card .meta {
    color: var(--text-muted);
    letter-spacing: .04em;
    margin-top: 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .ws-card .meta .since {
    color: var(--accent-violet);
  }

  .ws-card .meta .id {
    color: var(--text-secondary);
  }

  .sidebar {
    background: var(--bg-surface);
    border-right: 1px solid var(--border-subtle);
    flex-direction: column;
    display: flex;
    overflow: hidden;
  }

  .sidebar-h {
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px 8px;
    display: flex;
  }

  .sidebar-h .title {
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .sidebar-body {
    flex: 1;
    padding: 0 8px 16px;
    overflow-y: auto;
  }

  .nav-section {
    margin-top: 12px;
  }

  .nav-section-label {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-transform: uppercase;
    cursor: pointer;
    user-select: none;
    align-items: center;
    gap: 6px;
    padding: 8px 8px 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .nav-section-label:before {
    content: "▾";
    color: var(--text-muted);
    font-size: 8px;
    transition: transform .16s;
    display: inline-block;
  }

  .nav-section.collapsed .nav-section-label:before {
    transform: rotate(-90deg);
  }

  .nav-section.collapsed .section-content {
    display: none;
  }

  .nav-row {
    cursor: pointer;
    border-radius: 8px;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    transition: all .1s;
    display: flex;
  }

  .nav-row:hover {
    background: var(--bg-elevated);
  }

  .nav-row.active {
    color: var(--accent-cyan);
    background: #7dd3fc1a;
  }

  .nav-row .ico {
    width: 18px;
    height: 18px;
    color: var(--text-secondary);
    place-items: center;
    font-family: JetBrains Mono, monospace;
    font-size: 13px;
    display: grid;
  }

  .nav-row.active .ico {
    color: var(--accent-cyan);
  }

  .nav-row .name {
    color: var(--text-primary);
    flex: 1;
    font-size: 13px;
    font-weight: 600;
  }

  .nav-row.active .name {
    color: var(--accent-cyan);
  }

  .nav-row .count {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .nav-row.active .count {
    color: var(--accent-cyan);
  }

  .nav-row.list-row .ico {
    color: var(--text-muted);
    width: 12px;
    font-size: 9px;
  }

  .nav-row.list-row .dot {
    border-radius: 50%;
    flex-shrink: 0;
    width: 8px;
    height: 8px;
  }

  .nav-row.list-row .name {
    font-size: 13px;
    font-weight: 500;
  }

  .tag-row {
    cursor: pointer;
    border-radius: 6px;
    align-items: center;
    gap: 10px;
    padding: 6px 10px;
    transition: all .1s;
    display: flex;
  }

  .tag-row:hover {
    background: var(--bg-elevated);
  }

  .tag-row .ico {
    width: 16px;
    color: var(--text-muted);
    font-size: 11px;
  }

  .tag-row .name {
    color: var(--text-primary);
    flex: 1;
    font-size: 13px;
  }

  .tag-row .dot {
    border-radius: 50%;
    width: 8px;
    height: 8px;
  }

  .tag-row .count {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .sidebar-bottom {
    border-top: 1px solid var(--border-subtle);
    padding: 8px;
  }

  .today-body {
    flex-direction: column;
    flex: 1;
    gap: 24px;
    padding: 16px 24px 24px;
    display: flex;
    overflow-y: auto;
  }

  .qa-inline {
    background: var(--bg-surface-2);
    border: 1px dashed var(--border-strong);
    color: var(--text-muted);
    cursor: text;
    border-radius: 10px;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 12px 16px;
    font-size: 13px;
    transition: all .12s;
    display: flex;
  }

  .qa-inline:hover {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
  }

  .qa-inline .plus {
    color: var(--accent-cyan);
    font-size: 14px;
    font-weight: 700;
  }

  .qa-inline kbd {
    background: var(--bg-elevated);
    border: 1px solid var(--border-strong);
    color: var(--text-secondary);
    border-radius: 3px;
    padding: 1px 5px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .section {
    flex-direction: column;
    display: flex;
  }

  .section-h {
    cursor: pointer;
    user-select: none;
    align-items: center;
    gap: 10px;
    padding: 4px 4px 8px;
    display: flex;
  }

  .section-h .chev {
    color: var(--text-muted);
    font-size: 10px;
    transition: transform .16s;
  }

  .section.collapsed .chev {
    transform: rotate(-90deg);
  }

  .section-h .name {
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 700;
  }

  .section-h .name.overdue {
    color: var(--danger);
  }

  .section-h .name.today {
    color: var(--accent-cyan);
  }

  .section-h .name.completed {
    color: var(--text-muted);
  }

  .section-h .count {
    color: var(--text-muted);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .section-h .actions {
    gap: 8px;
    margin-left: auto;
    display: flex;
  }

  .section-h .actions a {
    color: var(--accent-cyan);
    letter-spacing: .04em;
    cursor: pointer;
    font-family: JetBrains Mono, monospace;
    font-size: 12px;
  }

  .section-h .actions a:hover {
    text-decoration: underline;
  }

  .section.collapsed .section-body {
    display: none;
  }

  .tr {
    border-bottom: 1px solid var(--border-subtle);
    cursor: pointer;
    align-items: center;
    gap: 10px;
    min-height: 34px;
    padding: 6px 4px;
    transition: background .1s;
    display: flex;
  }

  .tr:hover {
    background: var(--bg-elevated);
    border-bottom-color: var(--border-strong);
  }

  .tr:last-child {
    border-bottom: none;
  }

  .tr .check {
    border: 1.5px solid var(--border-strong);
    border-radius: 4px;
    flex-shrink: 0;
    place-items: center;
    width: 16px;
    height: 16px;
    display: grid;
  }

  .tr.p1 .check {
    border-color: var(--danger);
  }

  .tr.p2 .check {
    border-color: var(--warning);
  }

  .tr.p3 .check {
    border-color: var(--accent-cyan);
  }

  .tr.p4 .check {
    border-color: var(--success);
  }

  .tr.completed .check {
    background: var(--success);
    border-color: var(--success);
    color: var(--bg-base);
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
  }

  .tr.completed .check:before {
    content: "✓";
  }

  .tr.completed {
    opacity: .55;
  }

  .tr.completed .title {
    color: var(--text-muted);
    text-decoration: line-through;
  }

  .tr .body {
    flex: 1;
    align-items: center;
    gap: 8px;
    min-width: 0;
    display: flex;
  }

  .tr .row1 {
    flex: 1;
    align-items: center;
    gap: 8px;
    min-width: 0;
    display: flex;
    overflow: hidden;
  }

  .tr .title {
    color: var(--text-primary);
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    font-size: 13.5px;
    line-height: 1.4;
    overflow: hidden;
  }

  .tr .row2 {
    flex-shrink: 0;
    align-items: center;
    gap: 4px;
    display: inline-flex;
  }

  .tr .meta-right {
    flex-shrink: 0;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    display: flex;
  }

  .tr .list-tag {
    color: var(--text-secondary);
    background: var(--bg-elevated);
    border-radius: 4px;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: inline-flex;
  }

  .tr .list-tag .dot {
    border-radius: 50%;
    width: 6px;
    height: 6px;
  }

  .tr .due {
    color: var(--text-muted);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .tr .due.overdue {
    color: var(--danger);
  }

  .tr .due.today {
    color: var(--accent-cyan);
    font-weight: 700;
  }

  .dash-content {
    background: var(--bg-base);
    padding: 16px 24px 96px;
    overflow-y: auto;
  }

  .dash-frame {
    max-width: 1840px;
    margin: 0 auto;
    padding: 0;
  }

  .dash-greeting {
    border-bottom: 1px solid var(--border-subtle);
    grid-template-columns: 1fr auto auto auto;
    align-items: center;
    gap: 12px;
    height: 64px;
    margin-bottom: 16px;
    padding: 0 0 16px;
    display: grid;
  }

  .dash-greeting .greet {
    flex-direction: column;
    gap: 2px;
    display: flex;
  }

  .dash-greeting .greet .crumb {
    color: var(--text-muted);
    letter-spacing: .08em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .dash-greeting .greet .ttl {
    font-size: 16px;
    font-weight: 700;
  }

  .dash-greeting .greet .ttl .name {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: #0000;
    -webkit-background-clip: text;
    background-clip: text;
  }

  .dash-greeting .search {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    color: var(--text-muted);
    align-items: center;
    gap: 10px;
    margin-left: 60px;
    padding: 8px 14px;
    display: flex;
  }

  .dash-greeting .search:hover {
    border-color: var(--border-strong);
    color: var(--text-primary);
  }

  .dash-greeting .search .icon {
    font-size: 12px;
  }

  .dash-greeting .search input {
    color: var(--text-primary);
    background: none;
    border: none;
    outline: none;
    flex: 1;
    font-family: Inter, sans-serif;
    font-size: 13px;
  }

  .dash-greeting .search .kbd {
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    letter-spacing: .04em;
    border-radius: 3px;
    padding: 1px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .dash-greeting .icon-btn {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    width: 32px;
    height: 32px;
    color: var(--text-muted);
    cursor: pointer;
    place-items: center;
    display: grid;
    position: relative;
  }

  .dash-greeting .icon-btn .b-badge {
    background: var(--danger);
    color: #fff;
    border: 2px solid var(--bg-base);
    border-radius: 50%;
    place-items: center;
    width: 14px;
    height: 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    font-weight: 700;
    display: grid;
    position: absolute;
    top: -4px;
    right: -4px;
  }

  .dash-greeting .quick-add {
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: var(--bg-base);
    cursor: pointer;
    box-shadow: var(--glow-cyan);
    border: none;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    font-size: 12px;
    font-weight: 700;
    display: flex;
  }

  .dash-greeting .quick-add .plus {
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
  }

  .dash-greeting .quick-add .kbd {
    background: #0a0e2726;
    border: 1px solid #0a0e274d;
    border-radius: 3px;
    padding: 1px 5px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .day-strip {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    margin-bottom: 16px;
    padding: 16px 22px 14px;
  }

  .day-head {
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
    margin-bottom: 14px;
    display: flex;
  }

  .day-head .day-label {
    color: var(--text-muted);
    letter-spacing: .1em;
    align-items: center;
    gap: 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .day-head .day-label .ti {
    width: 14px;
    height: 14px;
    color: var(--accent-cyan);
    background: #7dd3fc33;
    border-radius: 3px;
    place-items: center;
    font-size: 9px;
    font-weight: 700;
    display: inline-grid;
  }

  .day-head .now-time {
    color: var(--accent-pink);
    font-variant-numeric: tabular-nums;
    text-shadow: 0 0 8px #f472b666;
    letter-spacing: .04em;
    margin-left: 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 13px;
    font-weight: 500;
  }

  .day-head .focus-stat {
    align-items: baseline;
    gap: 6px;
    margin-left: auto;
    font-family: JetBrains Mono, monospace;
    display: flex;
  }

  .day-head .focus-stat .num {
    color: var(--accent-cyan);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
    font-size: 16px;
    font-weight: 500;
  }

  .day-head .focus-stat .target {
    color: var(--text-muted);
    letter-spacing: .04em;
    font-size: 11px;
  }

  .log-past-btn {
    border-radius: var(--radius-sm);
    color: var(--accent-cyan);
    letter-spacing: .06em;
    cursor: pointer;
    background: #7dd3fc14;
    border: 1px solid #7dd3fc4d;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    font-weight: 500;
    transition: all .15s;
    display: flex;
  }

  .log-past-btn:hover {
    border-color: var(--accent-cyan);
    background: #7dd3fc26;
    box-shadow: 0 0 12px #7dd3fc4d;
  }

  .log-past-btn .plus {
    font-size: 12px;
    font-weight: 700;
  }

  .timeline-wrap {
    background: var(--bg-base);
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-subtle);
    height: 28px;
    position: relative;
    overflow: visible;
  }

  .timeline-wrap .zone-sleep-pre, .timeline-wrap .zone-rest-post {
    pointer-events: none;
    background: repeating-linear-gradient(90deg, #0000004d 0 8px, #00000080 8px 9px);
    position: absolute;
    top: 0;
    bottom: 0;
  }

  .timeline-wrap .zone-sleep-pre {
    width: 29.17%;
    left: 0;
  }

  .timeline-wrap .zone-rest-post {
    left: 91.67%;
    right: 0;
  }

  .timeline-wrap .zone-tag {
    color: #94a3b880;
    letter-spacing: .1em;
    pointer-events: none;
    font-family: JetBrains Mono, monospace;
    font-size: 8px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  .timeline-wrap .zone-tag.sleep {
    left: 8px;
  }

  .timeline-wrap .zone-tag.rest {
    right: 8px;
  }

  .timeline-wrap .seg {
    cursor: pointer;
    transition: filter .15s;
    position: absolute;
    top: 0;
    bottom: 0;
  }

  .timeline-wrap .seg:hover {
    filter: brightness(1.25);
  }

  .timeline-wrap .seg.cyber {
    background: linear-gradient(180deg, var(--accent-cyan), var(--accent-cyan-dim));
    box-shadow: 0 0 8px #7dd3fc4d;
  }

  .timeline-wrap .seg.client {
    background: linear-gradient(180deg, var(--accent-violet), var(--accent-violet-dim));
    box-shadow: 0 0 8px #a78bfa4d;
  }

  .timeline-wrap .seg.read {
    background: linear-gradient(180deg, var(--warning), #d97706);
    box-shadow: 0 0 8px #fbbf244d;
  }

  .timeline-wrap .seg.side {
    background: linear-gradient(180deg, var(--success), #16a34a);
    box-shadow: 0 0 8px #4ade804d;
  }

  .timeline-wrap .future {
    pointer-events: none;
    background: repeating-linear-gradient(45deg, #0000 0 4px, #2a2f4a80 4px 5px);
    position: absolute;
    top: 0;
    bottom: 0;
  }

  .timeline-wrap .now-marker {
    background: var(--accent-pink);
    z-index: 10;
    pointer-events: none;
    border-radius: 1px;
    width: 2px;
    position: absolute;
    top: -6px;
    bottom: -8px;
    box-shadow: 0 0 10px #f472b68c, 0 0 4px #f472b6b3;
  }

  .timeline-wrap .now-marker:before {
    content: "";
    background: var(--accent-pink);
    border-radius: 50%;
    width: 6px;
    height: 6px;
    position: absolute;
    top: -3px;
    left: -2px;
    box-shadow: 0 0 5px #f472b699;
  }

  .timeline-wrap .now-marker:after {
    content: "";
    background: var(--accent-pink);
    border-radius: 50%;
    width: 6px;
    height: 6px;
    position: absolute;
    bottom: -3px;
    left: -2px;
    box-shadow: 0 0 5px #f472b699;
  }

  .timeline-wrap .seg .tip {
    background: var(--bg-elevated);
    border: 1px solid var(--accent-cyan);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    letter-spacing: .04em;
    z-index: 20;
    padding: 5px 9px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    transition: opacity .15s;
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 0 12px #7dd3fc33, 0 4px 12px #0006;
  }

  .timeline-wrap .seg:hover .tip {
    opacity: 1;
  }

  .timeline-wrap .seg .tip .accent {
    color: var(--accent-cyan);
  }

  .day-hour-scale {
    color: var(--text-muted);
    letter-spacing: .08em;
    font-variant-numeric: tabular-nums;
    justify-content: space-between;
    margin-top: 14px;
    padding: 0 1px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: flex;
    position: relative;
  }

  .day-hour-scale .now-tick {
    color: var(--accent-pink);
    text-shadow: 0 0 6px #f472b666;
    background: var(--bg-surface-2);
    border-radius: 2px;
    padding: 0 4px;
    font-weight: 700;
    position: absolute;
    transform: translateX(-50%);
  }

  .day-foot {
    border-top: 1px solid var(--border-subtle);
    color: var(--text-muted);
    letter-spacing: .04em;
    align-items: center;
    gap: 24px;
    margin-top: 12px;
    padding-top: 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    display: flex;
  }

  .day-foot .kpi {
    align-items: baseline;
    gap: 6px;
    display: flex;
  }

  .day-foot .kpi .v {
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    font-weight: 500;
  }

  .day-foot .kpi .v.cy {
    color: var(--accent-cyan);
  }

  .day-foot .kpi .v.pk {
    color: var(--accent-pink);
  }

  .day-foot .legend-dots {
    gap: 10px;
    margin-left: auto;
    display: flex;
  }

  .day-foot .legend-dots .l-item {
    align-items: center;
    gap: 4px;
    font-size: 9px;
    display: flex;
  }

  .day-foot .legend-dots .swatch {
    border-radius: 2px;
    width: 8px;
    height: 8px;
  }

  .grid {
    grid-template-columns: 2fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
    display: grid;
  }

  .bottom-grid {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
    display: grid;
  }

  .wins-strip {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
    padding: 10px 18px;
    display: flex;
    box-shadow: 0 0 16px #7dd3fc0d;
  }

  .wins-strip .wins-label {
    color: var(--text-muted);
    letter-spacing: .1em;
    flex-shrink: 0;
    align-items: center;
    gap: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .wins-strip .wins-label .ti {
    width: 14px;
    height: 14px;
    color: var(--accent-pink);
    background: #f472b633;
    border-radius: 3px;
    place-items: center;
    font-size: 9px;
    font-weight: 700;
    display: inline-grid;
  }

  .wins-strip .wins-list {
    flex-wrap: wrap;
    flex: 1;
    gap: 14px;
    display: flex;
  }

  .wins-strip .win-chip {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    letter-spacing: .04em;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    transition: all .15s;
    display: flex;
  }

  .wins-strip .win-chip .v {
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    font-weight: 700;
  }

  .wins-strip .win-chip .lbl {
    color: var(--text-secondary);
  }

  .wins-strip .win-chip.tasks .v {
    color: var(--accent-cyan);
  }

  .wins-strip .win-chip.habits .v {
    color: var(--accent-violet);
  }

  .wins-strip .win-chip.pr .v {
    color: var(--accent-pink);
  }

  .wins-strip .win-chip.focus .v {
    color: var(--success);
  }

  .wins-strip .win-chip.sessions .v {
    color: var(--text-primary);
  }

  .wins-strip .win-chip.fresh {
    border-color: var(--accent-cyan);
    animation: 2s ease-out freshPulse;
    box-shadow: 0 0 10px #7dd3fc4d;
  }

  @keyframes freshPulse {
    0% {
      box-shadow: 0 0 #7dd3fc80;
    }

    100% {
      box-shadow: 0 0 10px #7dd3fc4d;
    }
  }

  .wins-strip .ts-tail {
    color: var(--text-muted);
    letter-spacing: .04em;
    margin-left: auto;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .card-019 {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    flex-direction: column;
    gap: 16px;
    padding: 20px 22px;
    display: flex;
    box-shadow: 0 1px #ffffff05, 0 8px 24px #0003;
  }

  .card-head {
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 4px;
    display: flex;
  }

  .card-title-block {
    flex-direction: column;
    gap: 4px;
    display: flex;
  }

  .card-title-mono {
    color: var(--text-muted);
    letter-spacing: .1em;
    align-items: center;
    gap: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .card-title-mono .ti {
    border-radius: 3px;
    place-items: center;
    width: 14px;
    height: 14px;
    font-size: 9px;
    font-weight: 700;
    display: inline-grid;
  }

  .card-title-big {
    letter-spacing: -.01em;
    font-size: 22px;
    font-weight: 700;
  }

  .card-title-h {
    letter-spacing: -.01em;
    font-size: 15px;
    font-weight: 700;
  }

  .time-tabs {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    gap: 4px;
    padding: 2px;
    display: flex;
  }

  .time-tabs button {
    color: var(--text-muted);
    letter-spacing: .08em;
    cursor: pointer;
    background: none;
    border: 0;
    border-radius: 4px;
    padding: 4px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .time-tabs button.active {
    background: var(--bg-surface);
    color: var(--accent-cyan);
  }

  .time-chart-wrap {
    flex: 1;
    grid-template-columns: 36px 1fr;
    gap: 12px;
    display: grid;
  }

  .time-y-axis {
    height: 244px;
    color: var(--text-muted);
    letter-spacing: .04em;
    flex-direction: column-reverse;
    justify-content: space-between;
    padding-bottom: 22px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: flex;
  }

  .time-y-axis .ytick {
    text-align: right;
    line-height: 1;
    transform: translateY(50%);
  }

  .time-y-axis .ytick:first-child, .time-y-axis .ytick:last-child {
    transform: translateY(0);
  }

  .time-chart {
    background: linear-gradient(to top, transparent 22px, var(--border-subtle) 22px, var(--border-subtle) 23px, transparent 23px), repeating-linear-gradient(to top, transparent 22px, transparent calc(22px + 55.5px), #2a2f4a66 calc(22px + 55.5px), #2a2f4a66 calc(22px + 55.5px + 1px));
    align-items: flex-end;
    gap: 6px;
    height: 244px;
    display: flex;
  }

  .day-col {
    flex-direction: column;
    flex: 1;
    align-items: center;
    gap: 8px;
    height: 100%;
    display: flex;
  }

  .bar-stack {
    border-radius: 3px;
    flex-direction: column;
    flex: 1;
    justify-content: flex-end;
    width: 100%;
    min-height: 0;
    display: flex;
    overflow: hidden;
  }

  .bar-stack .seg019 {
    width: 100%;
  }

  .day-col .day-label {
    color: var(--text-muted);
    letter-spacing: .08em;
    height: 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .time-legend-019 {
    border-top: 1px solid var(--border-subtle);
    color: var(--text-muted);
    letter-spacing: .04em;
    flex-wrap: wrap;
    gap: 14px;
    padding-top: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .time-legend-019 .swatch {
    vertical-align: middle;
    border-radius: 2px;
    width: 8px;
    height: 8px;
    margin-right: 4px;
    display: inline-block;
  }

  .pri-edit-btn {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    width: 32px;
    height: 32px;
    color: var(--text-secondary);
    cursor: pointer;
    place-items: center;
    font-size: 12px;
    display: grid;
  }

  .pri-edit-btn:hover {
    border-color: var(--border-strong);
    color: var(--text-primary);
  }

  .priorities-list {
    flex-direction: column;
    gap: 8px;
    display: flex;
  }

  .pri-item {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    cursor: pointer;
    grid-template-columns: 36px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 8px 14px 8px 8px;
    transition: all .15s;
    display: grid;
  }

  .pri-item:hover {
    border-color: var(--border-strong);
    background: var(--bg-elevated);
  }

  .pri-num {
    font-variant-numeric: tabular-nums;
    border-style: solid;
    border-width: 1.5px;
    border-radius: 8px;
    place-items: center;
    width: 36px;
    height: 36px;
    font-family: JetBrains Mono, monospace;
    font-size: 12px;
    font-weight: 700;
    display: grid;
  }

  .pri-num.c01 {
    color: var(--danger);
    background: #f871711a;
    border-color: #f8717166;
  }

  .pri-num.c02 {
    color: var(--warning);
    background: #fbbf241a;
    border-color: #fbbf2466;
  }

  .pri-num.c03 {
    color: var(--accent-cyan);
    background: #7dd3fc1a;
    border-color: #7dd3fc66;
  }

  .pri-num.c04 {
    color: var(--accent-violet);
    background: #a78bfa1a;
    border-color: #a78bfa66;
  }

  .pri-num.c05 {
    color: var(--accent-pink);
    background: #f472b61a;
    border-color: #f472b666;
  }

  .pri-info {
    min-width: 0;
    display: flex;
  }

  .pri-info .pname {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
  }

  .pri-right {
    align-items: baseline;
    gap: 8px;
    display: flex;
  }

  .pri-right .hrs {
    color: var(--accent-cyan);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
    font-family: JetBrains Mono, monospace;
    font-size: 15px;
    font-weight: 500;
  }

  .pri-right .hrs.muted {
    color: var(--text-muted);
  }

  .pri-right .when {
    color: var(--text-muted);
    letter-spacing: .02em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .cap-big {
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
    margin-top: 2px;
    font-family: Inter, sans-serif;
    font-size: 30px;
    font-weight: 700;
  }

  .cap-big .currency {
    color: var(--text-muted);
    margin-right: 4px;
    font-weight: 500;
  }

  .cap-big .cents {
    color: var(--text-muted);
    font-size: .75em;
    font-weight: 500;
  }

  .expected-pill {
    background: var(--bg-elevated);
    color: var(--text-muted);
    letter-spacing: .08em;
    border-radius: 3px;
    padding: 2px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .cap-row {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    display: grid;
  }

  .cap-kpi {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    display: flex;
  }

  .cap-kpi .lbl {
    color: var(--text-muted);
    letter-spacing: .1em;
    align-items: center;
    gap: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: flex;
  }

  .cap-kpi .lbl .arr {
    font-size: 10px;
  }

  .cap-kpi .val {
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
    font-family: Inter, sans-serif;
    font-size: 18px;
    font-weight: 700;
  }

  .cap-kpi .val .currency {
    opacity: .7;
    margin-right: 2px;
    font-weight: 500;
  }

  .cap-kpi.up .val, .cap-kpi.up .lbl .arr {
    color: var(--success);
  }

  .cap-kpi.down .val, .cap-kpi.down .lbl .arr {
    color: var(--danger);
  }

  .cap-kpi .delta {
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .cap-kpi.up .delta {
    color: var(--success);
  }

  .cap-kpi.down .delta {
    color: var(--danger);
  }

  .col-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 12px 14px;
  }

  .col-head {
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 8px;
    display: flex;
  }

  .col-head .label {
    color: var(--text-muted);
    letter-spacing: .1em;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .col-head .total {
    color: var(--accent-pink);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
    font-family: Inter, sans-serif;
    font-size: 18px;
    font-weight: 700;
  }

  .col-progress {
    background: var(--bg-base);
    border-radius: 2px;
    height: 4px;
    margin-bottom: 6px;
    overflow: hidden;
  }

  .col-progress .fill {
    background: linear-gradient(90deg, var(--accent-pink), var(--accent-violet));
    width: 64%;
    height: 100%;
  }

  .col-foot {
    color: var(--text-muted);
    letter-spacing: .08em;
    justify-content: space-between;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: flex;
  }

  .pl-list {
    flex-direction: column;
    gap: 6px;
    padding-top: 4px;
    display: flex;
  }

  .pl-section-head {
    color: var(--text-muted);
    letter-spacing: .1em;
    border-bottom: 1px solid var(--border-subtle);
    justify-content: space-between;
    align-items: center;
    padding-bottom: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: flex;
  }

  .pl-section-head .col-l {
    align-items: center;
    gap: 10px;
    display: flex;
  }

  .pl-section-head .col-r {
    gap: 16px;
    display: flex;
  }

  .pl-toggle {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    gap: 2px;
    padding: 2px;
    display: flex;
  }

  .pl-toggle button {
    color: var(--text-muted);
    letter-spacing: .08em;
    cursor: pointer;
    background: none;
    border: 0;
    border-radius: 3px;
    padding: 4px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .pl-toggle button.active {
    background: var(--bg-surface);
    color: var(--accent-cyan);
  }

  .pl-list[data-range="month"] .pval[data-r="all"], .pl-list[data-range="all"] .pval[data-r="month"] {
    display: none;
  }

  .pl-row {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    grid-template-columns: 8px 1fr auto auto;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    display: grid;
  }

  .pl-row .dot {
    border-radius: 50%;
    flex-shrink: 0;
    width: 8px;
    height: 8px;
  }

  .pl-row .pname {
    color: var(--text-primary);
    white-space: nowrap;
    text-overflow: ellipsis;
    font-family: Inter, sans-serif;
    font-size: 13px;
    font-weight: 500;
    overflow: hidden;
  }

  .pl-row .pval {
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
    text-align: right;
    min-width: 68px;
    font-family: Inter, sans-serif;
    font-size: 13px;
    font-weight: 600;
  }

  .pl-row .pval .currency {
    opacity: .5;
    margin-right: 1px;
    font-size: .85em;
    font-weight: 500;
  }

  .pl-row .pval.income {
    color: var(--success);
  }

  .pl-row .pval.expense {
    color: var(--danger);
  }

  .pl-row .pval.zero {
    color: var(--text-muted);
    font-weight: 400;
  }

  .urg-list {
    flex-direction: column;
    gap: 8px;
    display: flex;
  }

  .urg-task {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    display: flex;
  }

  .urg-task:hover {
    border-color: var(--border-strong);
  }

  .urg-task .pf {
    border-radius: 2px;
    flex-shrink: 0;
    align-self: stretch;
    width: 3px;
  }

  .urg-task .pf.p1 {
    background: var(--danger);
  }

  .urg-task .pf.p2 {
    background: var(--warning);
  }

  .urg-task .check-019 {
    border: 1.5px solid var(--text-muted);
    border-radius: 4px;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin-top: 1px;
  }

  .urg-task .body {
    flex: 1;
    min-width: 0;
  }

  .urg-task .ttitle {
    margin-bottom: 4px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
  }

  .urg-task .tmeta {
    color: var(--text-secondary);
    align-items: center;
    gap: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .urg-task .proj {
    color: var(--accent-cyan);
  }

  .urg-task .due {
    color: var(--warning);
  }

  .urg-task .due.late {
    color: var(--danger);
  }

  .urg-task .timer-pill {
    color: var(--danger);
    letter-spacing: .04em;
    background: #f871711a;
    border: 1px solid #f871714d;
    border-radius: 3px;
    align-items: center;
    gap: 4px;
    margin-left: auto;
    padding: 2px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: flex;
  }

  .urg-task .timer-pill .dotpulse {
    background: var(--danger);
    border-radius: 50%;
    width: 6px;
    height: 6px;
    animation: 1s ease-in-out infinite pulseRed;
  }

  @keyframes pulseRed {
    0%, 100% {
      opacity: 1;
    }

    50% {
      opacity: .4;
    }
  }

  .habits-done-pill {
    background: var(--bg-elevated);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    letter-spacing: .04em;
    padding: 4px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .habits-done-pill .total {
    color: var(--text-primary);
    font-weight: 700;
  }

  .habits-done-pill .of {
    color: var(--text-muted);
    margin: 0 4px;
  }

  .habit-list {
    flex-direction: column;
    gap: 8px;
    display: flex;
  }

  .habit-row {
    background: var(--bg-surface);
    border: 1.5px solid var(--border-subtle);
    border-radius: var(--radius-md);
    cursor: pointer;
    grid-template-columns: 36px 1fr 28px;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    transition: all .15s;
    display: grid;
  }

  .habit-row:hover {
    border-color: var(--border-strong);
  }

  .habit-row.done {
    border-color: var(--accent-cyan);
    box-shadow: 0 0 0 1px #7dd3fc33, 0 0 12px #7dd3fc26;
  }

  .habit-row .hcheck {
    border: 1.5px solid var(--border-strong);
    cursor: pointer;
    width: 28px;
    height: 28px;
    color: var(--bg-base);
    background: none;
    border-radius: 6px;
    place-items: center;
    transition: all .15s;
    display: grid;
  }

  .habit-row .hcheck:after {
    content: "✓";
    opacity: 0;
    font-size: 14px;
    font-weight: 700;
    transition: opacity .15s;
  }

  .habit-row.done .hcheck {
    background: var(--accent-cyan);
    border-color: var(--accent-cyan);
    box-shadow: 0 0 8px #7dd3fc66;
  }

  .habit-row.done .hcheck:after {
    opacity: 1;
  }

  .habit-info {
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    display: flex;
  }

  .habit-info .hname {
    color: var(--text-primary);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
  }

  .habit-info .hstreak {
    color: var(--text-muted);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .habit-row.done .habit-info .hstreak {
    color: var(--accent-cyan);
  }

  .habit-info .hstreak .accent {
    color: var(--accent-cyan);
    font-weight: 500;
  }

  .habit-row .hicon {
    background: var(--bg-elevated);
    border: 1px solid var(--border-strong);
    color: #fff;
    border-radius: 8px;
    flex-shrink: 0;
    place-items: center;
    width: 36px;
    height: 36px;
    transition: all .15s;
    display: grid;
  }

  .habit-row .hicon svg {
    stroke-width: 2.25px;
    filter: drop-shadow(0 0 4px #ffffff4d);
    width: 18px;
    height: 18px;
  }

  .habit-row.done .hicon {
    border-color: var(--accent-cyan);
    background: #7dd3fc26;
    box-shadow: 0 0 12px #7dd3fc4d;
  }

  .habit-row.done .hicon svg {
    filter: drop-shadow(0 0 6px #7dd3fcb3) drop-shadow(0 0 2px #ffffff80);
  }

  .habit-info .week-dots {
    gap: 8px;
    margin-top: 8px;
    display: flex;
  }

  .habit-info .week-dots .wd {
    background: var(--bg-base);
    border: 1.5px solid var(--border-strong);
    border-radius: 50%;
    width: 12px;
    height: 12px;
    transition: all .15s;
  }

  .habit-info .week-dots .wd.done {
    background: var(--accent-cyan);
    border-color: var(--accent-cyan);
    box-shadow: 0 0 8px #7dd3fc80;
  }

  .habit-info .week-dots .wd.skip {
    border: 1.5px dashed var(--accent-violet);
    background: none;
  }

  .habit-info .week-dots .wd.today {
    box-shadow: 0 0 0 2px var(--accent-cyan);
  }

  .habit-info .week-dots .wd.today.done {
    box-shadow: 0 0 0 2px var(--accent-cyan), 0 0 10px #7dd3fc99;
  }

  .ft-pill {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    z-index: 30;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    display: flex;
    position: fixed;
    bottom: 16px;
    right: 16px;
    box-shadow: 0 6px 20px #0006;
  }

  .ft-pill .red-dot {
    background: var(--accent-violet);
    border-radius: 50%;
    width: 6px;
    height: 6px;
    animation: 1.6s infinite pulseV;
  }

  @keyframes pulseV {
    0%, 100% {
      opacity: 1;
      transform: scale(1);
    }

    50% {
      opacity: .5;
      transform: scale(1.3);
    }
  }

  .ft-pill .digits {
    color: var(--accent-cyan);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 14px;
    font-weight: 700;
  }

  .ft-pill .task-tag {
    color: var(--text-muted);
    border-left: 1px solid var(--border-strong);
    letter-spacing: .04em;
    padding-left: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .variant {
    display: none;
  }

  .variant.active {
    display: block;
  }

  .variant-hint {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    color: var(--text-muted);
    z-index: 90;
    letter-spacing: .06em;
    border-radius: 0 0 8px 8px;
    padding: 4px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    position: fixed;
    top: 50px;
    left: 50%;
    transform: translateX(-50%);
  }

  .src-foot {
    color: var(--text-muted);
    border: 1px solid var(--border-subtle);
    letter-spacing: .04em;
    z-index: 30;
    background: #0a0e27d9;
    border-radius: 6px;
    max-width: 360px;
    padding: 6px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    line-height: 1.5;
    position: fixed;
    bottom: 16px;
    left: 16px;
  }

  .src-foot strong {
    color: var(--accent-cyan);
  }

  @keyframes slideUp {
    from {
      opacity: 0;
      transform: translateY(20px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes slideDown {
    from {
      opacity: 0;
      transform: translateY(-20px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  @keyframes fadeIn {
    from {
      opacity: 0;
    }

    to {
      opacity: 1;
    }
  }

  @keyframes shake {
    0%, 100% {
      transform: translateX(0);
    }

    25% {
      transform: translateX(-3px);
    }

    75% {
      transform: translateX(3px);
    }
  }

  @keyframes pulseDot {
    0%, 100% {
      opacity: 1;
      transform: scale(1);
    }

    50% {
      opacity: .5;
      transform: scale(1.3);
    }
  }

  @keyframes lift {
    from {
      transform: translateY(0);
    }

    to {
      transform: translateY(-2px);
    }
  }

  @keyframes glowPulse {
    0%, 100% {
      box-shadow: 0 0 6px #f472b666;
    }

    50% {
      box-shadow: 0 0 12px #f472b6b3;
    }
  }

  .tc, .tr {
    position: relative;
  }

  .row-actions {
    background: linear-gradient(90deg, transparent 0%, var(--bg-elevated) 30%);
    opacity: 0;
    pointer-events: none;
    border-radius: 6px;
    gap: 2px;
    padding: 2px 4px 2px 18px;
    transition: opacity .14s, transform .14s;
    display: flex;
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%)translateX(6px);
  }

  .tc:hover .row-actions, .tr:hover .row-actions {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(-50%)translateX(0);
  }

  .row-actions button {
    width: 22px;
    height: 22px;
    color: var(--text-muted);
    cursor: pointer;
    background: none;
    border: 1px solid #0000;
    border-radius: 4px;
    place-items: center;
    padding: 0;
    font-size: 11px;
    transition: all .1s;
    display: grid;
  }

  .row-actions button:hover {
    background: var(--bg-base);
    color: var(--accent-cyan);
    border-color: var(--accent-cyan);
  }

  .subtask-pill {
    color: var(--accent-violet);
    letter-spacing: .04em;
    background: #a78bfa26;
    border: 1px solid #a78bfa59;
    border-radius: 9999px;
    align-items: center;
    gap: 3px;
    padding: 1px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    line-height: 1;
    display: inline-flex;
  }

  .recur-badge {
    color: var(--accent-cyan);
    opacity: .85;
    align-items: center;
    padding: 0 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    line-height: 1;
    display: inline-flex;
  }

  .wake-badge {
    color: var(--success);
    letter-spacing: .04em;
    background: #4ade8026;
    border: 1px solid #4ade8066;
    border-radius: 4px;
    align-items: center;
    padding: 1px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: inline-flex;
  }

  .pending-dot {
    background: var(--danger);
    width: 6px;
    height: 6px;
    box-shadow: 0 0 6px var(--danger);
    border-radius: 50%;
    margin-right: 4px;
    animation: 1.4s infinite pulseDot;
    display: inline-block;
  }

  .dnd-ghost {
    background: var(--bg-surface-2);
    border: 1px solid var(--accent-cyan);
    border-radius: var(--radius-sm);
    box-shadow: 0 8px 28px #7dd3fc4d, var(--glow-cyan);
    z-index: 80;
    pointer-events: none;
    width: 280px;
    padding: 8px 12px;
    animation: .18s ease-out fadeIn;
    position: absolute;
    transform: rotate(-2deg);
  }

  .dnd-ghost .title {
    font-size: 13px;
  }

  .dnd-ghost .ghost-meta {
    color: var(--text-muted);
    margin-top: 3px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .zone.drop-target {
    border-color: var(--accent-cyan);
    box-shadow: var(--glow-cyan), 0 0 0 1px #7dd3fc26;
  }

  .zone.drop-target .zone-title .drop-hint {
    color: var(--accent-cyan);
    margin-left: 6px;
  }

  .tc.dragging-source {
    opacity: .25;
  }

  .toast-stack {
    z-index: 40;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    display: flex;
    position: fixed;
    bottom: 70px;
    right: 16px;
  }

  .toast-saved {
    backdrop-filter: blur(8px);
    color: var(--success);
    border-radius: var(--radius-sm);
    letter-spacing: .04em;
    background: #0a0e27d9;
    border: 1px solid #4ade8066;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    animation: .2s ease-out slideUp;
    display: inline-flex;
    box-shadow: 0 4px 12px #0006;
  }

  .toast-saved:before {
    content: "✓";
    font-weight: 700;
  }

  .toast-failure {
    backdrop-filter: blur(8px);
    border: 1px solid #f871718c;
    border-left: 3px solid var(--danger);
    border-radius: var(--radius-sm);
    background: #0a0e27f2;
    width: 320px;
    padding: 10px 14px;
    animation: .22s ease-out slideUp;
    box-shadow: 0 6px 20px #00000080;
  }

  .toast-failure .tf-head {
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
    display: flex;
  }

  .toast-failure .tf-dot {
    background: var(--danger);
    border-radius: 50%;
    width: 6px;
    height: 6px;
    animation: 1.4s infinite pulseDot;
  }

  .toast-failure .tf-title {
    color: var(--danger);
    letter-spacing: .06em;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 700;
  }

  .toast-failure .tf-body {
    color: var(--text-secondary);
    margin-bottom: 6px;
    font-size: 12px;
    line-height: 1.4;
  }

  .toast-failure .tf-actions {
    gap: 6px;
    display: flex;
  }

  .toast-failure .tf-btn {
    border: 1px solid var(--danger);
    color: var(--danger);
    cursor: pointer;
    background: #f8717126;
    border-radius: 4px;
    padding: 3px 9px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .toast-failure .tf-btn.muted {
    border-color: var(--border-strong);
    color: var(--text-secondary);
    background: none;
  }

  .bell-btn {
    transition: transform .12s, border-color .12s;
  }

  .bell-btn:hover {
    transform: scale(1.06);
  }

  .bell-btn .b-badge, .icon-btn .b-badge {
    animation: 2s ease-in-out infinite glowPulse;
  }

  .qa-inline.editing {
    background: var(--bg-surface);
    border: 1px solid var(--accent-cyan);
    box-shadow: 0 0 0 3px #7dd3fc14, var(--glow-cyan);
  }

  .qa-inline .nl-text {
    color: var(--text-primary);
    flex-wrap: wrap;
    flex: 1;
    align-items: baseline;
    gap: 4px;
    display: inline-flex;
  }

  .qa-inline .nl-text .nl-cursor {
    background: var(--accent-cyan);
    vertical-align: middle;
    width: 1.5px;
    height: 14px;
    margin-left: 2px;
    animation: 1s step-end infinite blinkCaret;
    display: inline-block;
  }

  @keyframes blinkCaret {
    0%, 49% {
      opacity: 1;
    }

    50%, 100% {
      opacity: 0;
    }
  }

  .qa-inline .parsed {
    border-radius: 9999px;
    align-items: center;
    gap: 3px;
    padding: 1px 7px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 500;
    display: inline-flex;
  }

  .qa-inline .parsed.proj {
    color: var(--accent-pink);
    background: #f472b62e;
  }

  .qa-inline .parsed.due {
    color: var(--accent-cyan);
    background: #7dd3fc2e;
  }

  .qa-inline .parsed.tag {
    color: var(--accent-violet);
    background: #a78bfa2e;
  }

  .qa-inline .parsed.priority {
    color: var(--danger);
    background: #f871712e;
  }

  .outbox-banner {
    backdrop-filter: blur(6px);
    z-index: 25;
    background: linear-gradient(135deg, #f8717129, #f8717114);
    border-bottom: 1px solid #f8717173;
    align-items: center;
    gap: 12px;
    padding: 8px 16px;
    animation: .22s ease-out slideDown;
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  .outbox-banner.show {
    display: flex;
  }

  .outbox-banner .ob-dot {
    background: var(--danger);
    width: 8px;
    height: 8px;
    box-shadow: 0 0 8px var(--danger);
    border-radius: 50%;
    animation: 1.4s infinite pulseDot;
  }

  .outbox-banner .ob-text {
    color: var(--danger);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .outbox-banner .ob-actions {
    gap: 6px;
    margin-left: auto;
    display: flex;
  }

  .outbox-banner .ob-btn {
    border: 1px solid var(--danger);
    color: var(--danger);
    cursor: pointer;
    letter-spacing: .06em;
    background: #f871712e;
    border-radius: 4px;
    padding: 3px 9px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .outbox-banner .ob-btn.muted {
    color: var(--text-secondary);
    background: none;
    border-color: #f8717166;
  }

  .timeline-wrap .seg.demo-show .tip {
    opacity: 1;
  }

  .save-status {
    color: var(--success);
    letter-spacing: .04em;
    align-items: center;
    gap: 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: inline-flex;
  }

  .save-status:before {
    content: "";
    background: var(--success);
    width: 6px;
    height: 6px;
    box-shadow: 0 0 4px var(--success);
    border-radius: 50%;
  }

  .folder-head .f-actions {
    opacity: 0;
    gap: 2px;
    margin-left: auto;
    transition: opacity .12s;
    display: flex;
  }

  .folder-head:hover .f-actions {
    opacity: 1;
  }

  .folder-head .f-actions button {
    width: 18px;
    height: 18px;
    color: var(--text-muted);
    cursor: pointer;
    background: none;
    border: none;
    border-radius: 3px;
    place-items: center;
    font-size: 11px;
    line-height: 1;
    display: grid;
  }

  .folder-head .f-actions button:hover {
    background: var(--bg-elevated);
    color: var(--accent-cyan);
  }

  .selection-bar {
    border-bottom: 1px solid var(--accent-cyan);
    backdrop-filter: blur(8px);
    z-index: 5;
    background: #0a0e27f2;
    justify-content: space-between;
    align-items: center;
    padding: 14px 24px;
    display: none;
    position: absolute;
    inset: 0;
    box-shadow: 0 1px #7dd3fc66;
  }

  .selection-bar.show {
    display: flex;
  }

  .selection-bar .counter {
    color: var(--accent-cyan);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 13px;
    font-weight: 700;
  }

  .selection-bar .counter .num {
    color: var(--text-primary);
    background: #7dd3fc26;
    border: 1px solid #7dd3fc66;
    border-radius: 9999px;
    margin-right: 8px;
    padding: 2px 8px;
  }

  .selection-bar .actions {
    gap: 8px;
    display: flex;
  }

  .selection-bar .sb-btn {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    letter-spacing: .04em;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: inline-flex;
  }

  .selection-bar .sb-btn:hover {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
  }

  .selection-bar .sb-btn kbd {
    background: var(--bg-elevated);
    border: 1px solid var(--border-strong);
    color: var(--text-muted);
    border-radius: 3px;
    padding: 0 4px;
    font-size: 9px;
  }

  .selection-bar .sb-btn.danger:hover {
    border-color: var(--danger);
    color: var(--danger);
  }

  .tc.selected, .tr.selected {
    box-shadow: inset 3px 0 0 var(--accent-cyan);
    background: #7dd3fc14;
  }

  .tc.selected .check, .tr.selected .check {
    border-color: var(--accent-cyan);
    color: var(--bg-base);
    background: #7dd3fc66;
    place-items: center;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    display: grid;
  }

  .tc.selected .check:before, .tr.selected .check:before {
    content: "✓";
  }

  .pane-sidebar {
    background: var(--bg-surface);
    border-right: 1px solid var(--border-subtle);
    flex-direction: column;
    width: 280px;
    display: flex;
    overflow: hidden;
  }

  .pane-sidebar .ps-h {
    color: var(--text-muted);
    letter-spacing: .1em;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .pane-sidebar .ps-h .add {
    border: 1px solid var(--border-strong);
    color: var(--text-secondary);
    cursor: pointer;
    background: none;
    border-radius: 4px;
    padding: 0 6px;
    font-size: 12px;
  }

  .pane-sidebar .ps-h .add:hover {
    color: var(--accent-cyan);
    border-color: var(--accent-cyan);
  }

  .pane-sidebar .ps-body {
    flex: 1;
    padding: 4px 8px 16px;
    overflow-y: auto;
  }

  .pane-sidebar .ps-group {
    color: var(--text-muted);
    letter-spacing: .1em;
    padding: 12px 8px 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .pane-sidebar .ps-row {
    border-radius: var(--radius-sm);
    cursor: pointer;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    font-size: 13px;
    transition: background .12s;
    display: grid;
  }

  .pane-sidebar .ps-row:hover {
    background: var(--bg-elevated);
  }

  .pane-sidebar .ps-row.active {
    border-left: 2px solid var(--accent-cyan);
    background: #7dd3fc1a;
    padding-left: 8px;
  }

  .pane-sidebar .ps-row .ic {
    text-align: center;
    width: 18px;
    font-size: 14px;
  }

  .pane-sidebar .ps-row .nm {
    color: var(--text-primary);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .pane-sidebar .ps-row .ct {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .pane-sidebar .ps-row.active .ct {
    color: var(--accent-cyan);
  }

  .pane-detail {
    background: var(--bg-base);
    flex: 1;
    padding: 24px 32px;
    overflow-y: auto;
  }

  .pane-detail .pd-h {
    justify-content: space-between;
    align-items: flex-start;
    gap: 24px;
    margin-bottom: 24px;
    display: flex;
  }

  .pane-detail .pd-h .pd-title {
    letter-spacing: -.01em;
    font-size: 24px;
    font-weight: 700;
  }

  .pane-detail .pd-h .pd-sub {
    color: var(--text-muted);
    letter-spacing: .04em;
    margin-top: 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .pane-detail .pd-card {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    margin-bottom: 16px;
    padding: 18px 20px;
  }

  .pane-detail .pd-card h3 {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .money-content {
    background: var(--bg-base);
    flex-direction: column;
    flex: 1;
    display: flex;
    overflow: hidden;
  }

  .money-scroll {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 16px 96px;
    overflow-y: auto;
  }

  .money-content > .topbar {
    box-sizing: border-box;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding-left: 16px;
    padding-right: 16px;
  }

  .fin-composer {
    z-index: 10;
    backdrop-filter: blur(10px);
    border-radius: var(--radius-md);
    background: #141a38eb;
    border: 1px solid #7dd3fc2e;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    margin: 8px 0 12px;
    padding: 8px 12px;
    display: flex;
    position: sticky;
    top: 0;
    overflow: hidden;
    box-shadow: inset 0 1px #ffffff0a, 0 4px 16px #0a0e2766;
  }

  .money-content .fin-composer:before {
    content: "+ NEW TRANSACTION";
    background: var(--bg-base);
    color: var(--accent-cyan);
    letter-spacing: .1em;
    z-index: 1;
    border: 1px solid #7dd3fc4d;
    border-radius: 3px;
    padding: 1px 7px;
    font-family: JetBrains Mono, monospace;
    font-size: 8.5px;
    font-weight: 700;
    position: absolute;
    top: -7px;
    left: 14px;
  }

  .fin-type-seg {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: 9999px;
    flex-shrink: 0;
    align-items: center;
    height: 32px;
    padding: 2px;
    display: inline-flex;
  }

  .fin-type-seg button {
    height: 26px;
    color: var(--text-muted);
    letter-spacing: .06em;
    cursor: pointer;
    background: none;
    border: 0;
    border-radius: 9999px;
    align-items: center;
    padding: 0 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    transition: all .12s;
    display: inline-flex;
  }

  .fin-type-seg button.active.expense {
    color: var(--danger);
    background: #f871712e;
  }

  .fin-type-seg button.active.income {
    color: var(--success);
    background: #4ade802e;
  }

  .fin-type-seg button.active.transfer {
    color: var(--accent-violet);
    background: #a78bfa2e;
  }

  .fin-amount {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    flex-shrink: 0;
    align-items: center;
    gap: 4px;
    width: 110px;
    height: 32px;
    padding: 0 10px;
    display: inline-flex;
  }

  .fin-amount .ccy {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .fin-amount input {
    min-width: 0;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.01em;
    background: none;
    border: 0;
    outline: none;
    flex: 1;
    width: 100%;
    font-size: 16px;
    font-weight: 700;
  }

  .fin-amount.expense input {
    color: var(--danger);
  }

  .fin-amount.income input {
    color: var(--success);
  }

  .fin-chips {
    scrollbar-width: none;
    flex: 1;
    gap: 5px;
    min-width: 0;
    display: flex;
    overflow-x: auto;
  }

  .fin-chips::-webkit-scrollbar {
    display: none;
  }

  .fin-chip {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    height: 28px;
    color: var(--text-primary);
    cursor: pointer;
    white-space: nowrap;
    border-radius: 9999px;
    flex-shrink: 0;
    align-items: center;
    gap: 5px;
    padding: 0 10px;
    font-size: 11px;
    transition: all .12s;
    display: inline-flex;
  }

  .fin-chip:hover {
    border-color: var(--border-strong);
  }

  .fin-chip .dot {
    border-radius: 50%;
    flex-shrink: 0;
    width: 6px;
    height: 6px;
  }

  .fin-chip .ic {
    font-size: 10px;
  }

  .fin-chip.account {
    color: var(--accent-cyan);
    border-color: #7dd3fc4d;
  }

  .fin-chip.project {
    color: var(--accent-pink);
    border-color: #f472b64d;
  }

  .fin-chip.tag {
    color: var(--accent-violet);
    border-color: #a78bfa4d;
  }

  .fin-chip.cat {
    color: var(--warning);
    border-color: #fbbf244d;
  }

  .fin-chip.date {
    color: var(--text-secondary);
  }

  .fin-chip .caret {
    color: var(--text-muted);
    opacity: .6;
    font-size: 8px;
  }

  .fin-expand {
    color: var(--text-muted);
    letter-spacing: .06em;
    cursor: pointer;
    white-space: nowrap;
    background: none;
    border: 0;
    flex-shrink: 0;
    height: 28px;
    padding: 0 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .fin-expand:hover {
    color: var(--accent-cyan);
  }

  .fin-save {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: var(--bg-base);
    border-radius: var(--radius-sm);
    cursor: pointer;
    height: 32px;
    box-shadow: var(--glow-cyan);
    border: 0;
    flex-shrink: 0;
    align-items: center;
    gap: 5px;
    padding: 0 14px;
    font-size: 11px;
    font-weight: 700;
    display: inline-flex;
  }

  .fin-hero {
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 10px;
    margin-bottom: 12px;
    display: grid;
  }

  .fin-hero-card {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    display: flex;
  }

  .fin-hero-card .lbl {
    color: var(--text-muted);
    letter-spacing: .1em;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .fin-hero-card .val {
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary);
    font-size: 22px;
    font-weight: 700;
  }

  .fin-hero-card .delta {
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .fin-hero-card.up .delta, .fin-hero-card.up .val {
    color: var(--success);
  }

  .fin-hero-card.down .delta, .fin-hero-card.down .val {
    color: var(--danger);
  }

  .fin-hero-card .currency-toggle {
    color: var(--text-muted);
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    cursor: pointer;
    border-radius: 9999px;
    margin-left: auto;
    padding: 2px 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .fin-hero-card .currency-toggle.active {
    color: var(--accent-cyan);
    border-color: var(--accent-cyan);
  }

  .anomaly-banner {
    border-radius: var(--radius-md);
    background: #f472b61a;
    border: 1px solid #f472b666;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding: 10px 16px;
    display: flex;
  }

  .anomaly-banner .ic {
    color: var(--accent-pink);
    font-size: 14px;
  }

  .anomaly-banner .body {
    color: var(--text-primary);
    flex: 1;
    font-size: 13px;
  }

  .anomaly-banner .body .accent {
    color: var(--accent-pink);
    font-weight: 700;
  }

  .anomaly-banner .actions {
    gap: 6px;
    display: flex;
  }

  .anomaly-banner .ab-btn {
    border: 1px solid var(--accent-pink);
    color: var(--accent-pink);
    cursor: pointer;
    letter-spacing: .04em;
    background: none;
    border-radius: 4px;
    padding: 4px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .anomaly-banner .ab-btn.muted {
    color: var(--text-secondary);
    background: none;
    border-color: #f472b64d;
  }

  .fin-row {
    grid-template-columns: 1.2fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
    display: grid;
  }

  .bill-list {
    flex-direction: column;
    gap: 6px;
    display: flex;
    position: relative;
  }

  .bill-row {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    grid-template-columns: 28px 1fr auto auto;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    display: grid;
  }

  .bill-row .icon {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: 7px;
    place-items: center;
    width: 28px;
    height: 28px;
    font-size: 13px;
    display: grid;
  }

  .bill-row .info {
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    display: flex;
  }

  .bill-row .info .nm {
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.25;
  }

  .bill-row .info .meta {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 9.5px;
    line-height: 1.2;
  }

  .bill-row .amt {
    color: var(--danger);
    font-variant-numeric: tabular-nums;
    font-family: Inter, sans-serif;
    font-size: 13px;
    font-weight: 700;
  }

  .bill-row .when {
    color: var(--text-muted);
    background: var(--bg-elevated);
    letter-spacing: .02em;
    border-radius: 3px;
    padding: 1px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9.5px;
  }

  .bill-row .when.soon {
    color: var(--warning);
    background: #fbbf2414;
    border: 1px solid #fbbf244d;
  }

  .bill-row .when.today {
    color: var(--danger);
    background: #f871711a;
    border: 1px solid #f8717166;
  }

  .bill-list--compact[data-expanded="0"] .bill-row--peek {
    max-height: 22px;
    position: relative;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(#000 0% 30%, #0000 100%);
    mask-image: linear-gradient(#000 0% 30%, #0000 100%);
  }

  .bill-list__expand {
    background: var(--bg-elevated);
    border: 1px solid var(--accent-cyan);
    color: var(--accent-cyan);
    letter-spacing: .06em;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    white-space: nowrap;
    z-index: 3;
    border-radius: 999px;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    font-weight: 700;
    transition: opacity .14s, transform .14s;
    display: inline-flex;
    position: absolute;
    bottom: 4px;
    left: 50%;
    transform: translate(-50%, 6px);
    box-shadow: 0 4px 14px #7dd3fc38;
  }

  .bill-list--compact:hover .bill-list__expand, .bill-list--compact:focus-within .bill-list__expand {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, -2px);
  }

  .bill-list__collapse {
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    letter-spacing: .06em;
    cursor: pointer;
    background: none;
    border-radius: 999px;
    align-self: center;
    align-items: center;
    gap: 5px;
    margin-top: 8px;
    padding: 4px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    transition: color .12s, border-color .12s;
    display: inline-flex;
  }

  .bill-list__collapse:hover {
    color: var(--accent-cyan);
    border-color: var(--accent-cyan);
  }

  .habits-content {
    flex: 1;
    display: flex;
    overflow: hidden;
  }

  .habit-sidebar-row {
    border-radius: var(--radius-sm);
    cursor: pointer;
    grid-template-columns: 28px 1fr auto;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
    padding: 10px 12px;
    display: grid;
  }

  .habit-sidebar-row:hover {
    background: var(--bg-elevated);
  }

  .habit-sidebar-row.active {
    border-left: 2px solid var(--accent-cyan);
    background: #7dd3fc1a;
    padding-left: 10px;
  }

  .habit-sidebar-row .hsi {
    background: var(--bg-elevated);
    border: 1px solid var(--border-strong);
    color: #fff;
    border-radius: 6px;
    place-items: center;
    width: 28px;
    height: 28px;
    display: grid;
  }

  .habit-sidebar-row.done .hsi {
    border-color: var(--accent-cyan);
    background: #7dd3fc2e;
  }

  .habit-sidebar-row .hsi svg {
    stroke-width: 2.25px;
    width: 14px;
    height: 14px;
  }

  .habit-sidebar-row .nm {
    font-size: 13px;
  }

  .habit-sidebar-row .strk {
    color: var(--accent-cyan);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .habit-sidebar-row .strk.zero {
    color: var(--text-muted);
  }

  .habit-detail-h {
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
    display: flex;
  }

  .habit-detail-h .ic-big {
    border: 1.5px solid var(--accent-cyan);
    color: #fff;
    background: #7dd3fc26;
    border-radius: 12px;
    place-items: center;
    width: 56px;
    height: 56px;
    display: grid;
    box-shadow: 0 0 16px #7dd3fc4d;
  }

  .habit-detail-h .ic-big svg {
    stroke-width: 2.25px;
    filter: drop-shadow(0 0 6px #7dd3fc99);
    width: 28px;
    height: 28px;
  }

  .habit-detail-h .info {
    flex: 1;
  }

  .habit-detail-h .info .nm {
    letter-spacing: -.01em;
    font-size: 22px;
    font-weight: 700;
  }

  .habit-detail-h .info .sub {
    color: var(--text-muted);
    margin-top: 2px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .habit-detail-h .actions {
    gap: 6px;
    display: flex;
  }

  .habit-detail-h .actions .btn {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    letter-spacing: .06em;
    padding: 6px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .habit-detail-h .actions .btn:hover {
    color: var(--accent-cyan);
    border-color: var(--accent-cyan);
  }

  .habit-detail-h .actions .btn.danger:hover {
    color: var(--danger);
    border-color: var(--danger);
  }

  .stat-grid {
    grid-template-columns: repeat(4, minmax(160px, 200px));
    justify-content: start;
    gap: 10px;
    margin-bottom: 20px;
    display: grid;
  }

  .pane-detail .pd-card {
    max-width: 720px;
  }

  .six-state-days {
    color: var(--text-muted);
    letter-spacing: .08em;
    text-align: center;
    grid-template-columns: repeat(7, 52px);
    justify-content: start;
    gap: 6px;
    margin-top: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 9.5px;
    display: grid;
  }

  .six-state-days .today-day {
    color: var(--accent-cyan);
    font-weight: 700;
  }

  .heatmap-days {
    max-width: 320px;
    color: var(--text-muted);
    letter-spacing: .06em;
    text-align: center;
    grid-template-columns: repeat(7, minmax(0, 38px));
    gap: 6px;
    margin-top: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: grid;
  }

  .heatmap-days .today-label {
    color: var(--accent-cyan);
  }

  .stat-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    display: flex;
  }

  .stat-card .lbl {
    color: var(--text-muted);
    letter-spacing: .1em;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .stat-card .val {
    letter-spacing: -.01em;
    font-variant-numeric: tabular-nums;
    font-size: 24px;
    font-weight: 700;
  }

  .stat-card.cy .val {
    color: var(--accent-cyan);
  }

  .stat-card.violet .val {
    color: var(--accent-violet);
  }

  .stat-card.success .val {
    color: var(--success);
  }

  .stat-card.warn .val {
    color: var(--warning);
  }

  .heatmap-90 {
    grid-template-rows: repeat(7, 13px);
    grid-template-columns: repeat(13, 1fr);
    grid-auto-flow: column;
    gap: 3px;
    max-width: 100%;
    display: grid;
  }

  .heatmap-90 .hm-cell {
    background: var(--bg-elevated);
    aspect-ratio: 1;
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: 4px;
    width: 100%;
    height: 13px;
  }

  .heatmap-90 .hm-cell.l1 {
    background: #7dd3fc4d;
  }

  .heatmap-90 .hm-cell.l2 {
    background: #7dd3fc8c;
  }

  .heatmap-90 .hm-cell.l3 {
    background: #7dd3fcd9;
    box-shadow: 0 0 4px #7dd3fc4d;
  }

  .heatmap-90 .hm-cell.done {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    border-color: #0000;
    box-shadow: 0 0 6px #7dd3fc4d;
  }

  .heatmap-90 .hm-cell.miss {
    background: #f8717133;
    border-color: #f8717166;
    position: relative;
  }

  .heatmap-90 .hm-cell.miss:after {
    content: "✕";
    color: var(--danger);
    place-items: center;
    font-size: 8px;
    display: grid;
    position: absolute;
    inset: 0;
  }

  .heatmap-90 .hm-cell.skip {
    background: repeating-linear-gradient(45deg, #fbbf2433 0 3px, #0000 3px 6px);
    border-color: #fbbf244d;
  }

  .heatmap-90 .hm-cell.partial {
    background: linear-gradient(to right, var(--accent-cyan) 0%, var(--accent-cyan) 50%, var(--bg-surface) 50%, var(--bg-surface) 100%);
  }

  .heatmap-90 .hm-cell.future {
    border-style: dashed;
    border-color: var(--border-strong);
    background: none;
  }

  .heatmap-90 .hm-cell.today {
    box-shadow: 0 0 0 2px var(--accent-cyan);
  }

  .pgrid-row {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    grid-template-columns: 36px 160px 1fr;
    align-items: center;
    gap: 12px;
    margin-bottom: 6px;
    padding: 8px 12px;
    display: grid;
  }

  .pgrid-row .ic {
    background: var(--bg-elevated);
    border: 1px solid var(--border-strong);
    color: #fff;
    border-radius: 8px;
    place-items: center;
    width: 36px;
    height: 36px;
    display: grid;
  }

  .pgrid-row .ic svg {
    stroke-width: 2.25px;
    width: 16px;
    height: 16px;
  }

  .pgrid-row.done .ic {
    border-color: var(--accent-cyan);
    background: #7dd3fc2e;
    box-shadow: 0 0 10px #7dd3fc40;
  }

  .pgrid-row.done .ic svg {
    filter: drop-shadow(0 0 4px #7dd3fc99);
  }

  .pgrid-row .nm {
    font-size: 13px;
    font-weight: 700;
  }

  .pgrid-row .strk {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .pgrid-row.done .strk {
    color: var(--accent-cyan);
  }

  .pgrid-bar {
    background: var(--bg-base);
    border-radius: 6px;
    height: 22px;
    position: relative;
    overflow: hidden;
  }

  .pgrid-bar .fill {
    background: linear-gradient(90deg, var(--accent-cyan), var(--accent-violet));
    border-radius: 6px;
    height: 100%;
    box-shadow: 0 0 8px #7dd3fc4d;
  }

  .pgrid-bar .ticks {
    pointer-events: none;
    grid-template-columns: repeat(7, 1fr);
    display: grid;
    position: absolute;
    inset: 0;
  }

  .pgrid-bar .ticks span {
    border-right: 1px solid #ffffff14;
  }

  .pgrid-bar .ticks span:last-child {
    border-right: 0;
  }

  .pgrid-bar .label-overlay {
    color: #fff;
    letter-spacing: .06em;
    text-shadow: 0 0 4px #0009;
    justify-content: center;
    align-items: center;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    font-weight: 700;
    display: flex;
    position: absolute;
    inset: 0;
  }

  .six-state {
    grid-template-columns: repeat(7, 52px);
    justify-content: start;
    gap: 6px;
    display: grid;
  }

  .six-state .scell {
    aspect-ratio: 1;
    background: var(--bg-surface);
    border: 1.5px solid var(--border-strong);
    cursor: pointer;
    color: var(--text-secondary);
    border-radius: 6px;
    place-items: center;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    transition: all .12s;
    display: grid;
    position: relative;
    overflow: hidden;
  }

  .six-state .scell.done {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: #fff;
    border-color: #0000;
    box-shadow: 0 0 8px #7dd3fc4d;
  }

  .six-state .scell.done:before {
    content: "✓";
  }

  .six-state .scell.today-pending {
    border-color: var(--accent-cyan);
    animation: 2s ease-in-out infinite glowPulse;
  }

  .six-state .scell.today-pending:before {
    content: "?";
    color: var(--accent-cyan);
  }

  .six-state .scell.miss {
    border-color: var(--danger);
    color: var(--danger);
    background: #f8717126;
  }

  .six-state .scell.miss:before {
    content: "✕";
  }

  .six-state .scell.skip {
    color: var(--warning);
    background: repeating-linear-gradient(45deg, #fbbf2433 0 4px, #0000 4px 8px);
    border-color: #fbbf2466;
  }

  .six-state .scell.skip:before {
    content: "↺";
  }

  .six-state .scell.partial {
    background: linear-gradient(to right, #7dd3fc66 0%, #7dd3fc66 75%, var(--bg-surface) 75%, var(--bg-surface) 100%);
    color: var(--accent-cyan);
  }

  .six-state .scell.partial:before {
    content: "75%";
    font-size: 9px;
  }

  .six-state .scell.future {
    border-style: dashed;
    border-color: var(--border-subtle);
    background: none;
  }

  .field-row {
    border-bottom: 1px solid var(--border-subtle);
    grid-template-columns: 140px 1fr;
    align-items: center;
    gap: 16px;
    padding: 10px 0;
    display: grid;
  }

  .field-row:last-child {
    border-bottom: 0;
  }

  .field-row .lbl {
    color: var(--text-muted);
    letter-spacing: .06em;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .field-row .input {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    padding: 6px 10px;
    font-size: 13px;
  }

  .field-row .seg {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    gap: 2px;
    padding: 2px;
    display: inline-flex;
  }

  .field-row .seg button {
    color: var(--text-muted);
    cursor: pointer;
    letter-spacing: .06em;
    background: none;
    border: 0;
    border-radius: 3px;
    padding: 4px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .field-row .seg button.active {
    background: var(--bg-surface);
    color: var(--accent-cyan);
  }

  .field-row .dow {
    gap: 4px;
    display: inline-flex;
  }

  .field-row .dow span {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    width: 28px;
    height: 28px;
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 6px;
    place-items: center;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: grid;
  }

  .field-row .dow span.active {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
    background: #7dd3fc2e;
  }

  .gym-content {
    background: var(--bg-base);
    flex-direction: column;
    flex: 1;
    display: flex;
    overflow: hidden;
  }

  .gym-scroll {
    padding: 0 24px 96px;
    overflow-y: auto;
  }

  .active-session-banner {
    background: linear-gradient(90deg, #f472b61a, #a78bfa1a);
    border-bottom: 1px solid #f472b64d;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
    padding: 12px 18px;
    display: flex;
  }

  .active-session-banner .as-label {
    color: var(--accent-pink);
    letter-spacing: .1em;
    align-items: center;
    gap: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .active-session-banner .as-label .pulse {
    background: var(--accent-pink);
    border-radius: 50%;
    width: 8px;
    height: 8px;
    animation: 1.4s infinite pulseDot;
  }

  .active-session-banner .as-stats {
    gap: 18px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    display: flex;
  }

  .active-session-banner .as-stats .v {
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    margin-right: 4px;
    font-size: 14px;
    font-weight: 700;
  }

  .active-session-banner .end-btn {
    color: var(--accent-pink);
    border-radius: var(--radius-md);
    cursor: pointer;
    letter-spacing: .06em;
    background: none;
    border: 1px solid #f472b666;
    margin-left: auto;
    padding: 6px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .ex-tabs {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    gap: 4px;
    margin-bottom: 16px;
    padding: 4px;
    display: flex;
    overflow-x: auto;
  }

  .ex-tabs button {
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    white-space: nowrap;
    background: none;
    border: 0;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    font-size: 12px;
    display: flex;
  }

  .ex-tabs button.active {
    background: var(--bg-surface);
    color: var(--accent-cyan);
    box-shadow: 0 0 0 1px #7dd3fc4d;
  }

  .ex-tabs button .pr {
    color: var(--accent-pink);
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    font-weight: 700;
  }

  .ex-tabs button.done {
    color: var(--success);
  }

  .ex-tabs button.done:before {
    content: "✓ ";
  }

  .gym-row {
    grid-template-columns: 1.4fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
    display: grid;
  }

  .logger-card {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 22px 24px;
  }

  .logger-card .lc-title {
    color: var(--text-muted);
    letter-spacing: .1em;
    margin-bottom: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .logger-card .lc-name {
    letter-spacing: -.01em;
    margin-bottom: 18px;
    font-size: 22px;
    font-weight: 700;
  }

  .weight-input {
    justify-content: center;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
    display: flex;
  }

  .weight-input button {
    background: var(--bg-elevated);
    border: 1px solid var(--border-strong);
    width: 44px;
    height: 44px;
    color: var(--text-primary);
    cursor: pointer;
    border-radius: 50%;
    place-items: center;
    font-size: 18px;
    display: grid;
  }

  .weight-input button:hover {
    color: var(--accent-cyan);
    border-color: var(--accent-cyan);
  }

  .weight-input .val {
    color: var(--accent-cyan);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.03em;
    text-shadow: 0 0 24px #7dd3fc4d;
    text-align: center;
    min-width: 140px;
    font-size: 64px;
    font-weight: 800;
  }

  .weight-input .unit {
    color: var(--text-muted);
    align-self: flex-end;
    margin-top: 18px;
    font-family: JetBrains Mono, monospace;
    font-size: 14px;
  }

  .reps-row {
    margin-bottom: 18px;
  }

  .reps-row .lbl {
    color: var(--text-muted);
    letter-spacing: .1em;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .reps-row .lbl .v {
    color: var(--accent-cyan);
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 700;
  }

  .reps-slider {
    grid-template-columns: repeat(12, 1fr);
    gap: 4px;
    display: grid;
  }

  .reps-slider button {
    aspect-ratio: 1;
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .reps-slider button.active {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
    background: #7dd3fc2e;
    box-shadow: 0 0 8px #7dd3fc4d;
  }

  .log-btn {
    background: linear-gradient(135deg, var(--accent-pink), var(--accent-violet));
    color: #fff;
    border-radius: var(--radius-md);
    cursor: pointer;
    letter-spacing: .04em;
    border: 0;
    width: 100%;
    padding: 14px;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 0 16px #f472b64d;
  }

  .progression-card {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 18px 20px;
  }

  .progression-card .h {
    color: var(--text-muted);
    letter-spacing: .1em;
    margin-bottom: 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .prog-target {
    border-radius: var(--radius-md);
    background: #4ade801a;
    border: 1px solid #4ade804d;
    margin-bottom: 14px;
    padding: 14px;
  }

  .prog-target .lbl {
    color: var(--success);
    letter-spacing: .1em;
    margin-bottom: 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .prog-target .vv {
    color: var(--success);
    font-variant-numeric: tabular-nums;
    font-size: 20px;
    font-weight: 700;
  }

  .prog-list {
    flex-direction: column;
    gap: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    display: flex;
  }

  .prog-list .pl-row {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: 4px;
    justify-content: space-between;
    padding: 6px 10px;
    display: flex;
  }

  .prog-list .pl-row .session-when {
    color: var(--text-muted);
  }

  .prog-list .pl-row .vol {
    color: var(--text-primary);
    font-weight: 700;
  }

  .prog-list .pl-row.pr {
    background: #f472b61a;
    border-color: #f472b64d;
  }

  .prog-list .pl-row.pr .session-when {
    color: var(--accent-pink);
  }

  .trend-heat {
    grid-template-columns: repeat(12, 1fr);
    gap: 3px;
    margin-top: 12px;
    display: grid;
  }

  .trend-heat .tc-cell {
    aspect-ratio: 1;
    background: var(--bg-surface);
    border-radius: 3px;
  }

  .trend-heat .tc-cell.l1 {
    background: #7dd3fc33;
  }

  .trend-heat .tc-cell.l2 {
    background: #7dd3fc66;
  }

  .trend-heat .tc-cell.l3 {
    background: #7dd3fca6;
  }

  .trend-heat .tc-cell.l4 {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
  }

  .sets-log {
    flex-wrap: wrap;
    gap: 6px;
    display: flex;
  }

  .sets-log .set-pill {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    border-radius: 9999px;
    padding: 4px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .sets-log .set-pill.pr {
    border-color: var(--accent-pink);
    color: var(--accent-pink);
    background: #f472b61a;
    box-shadow: 0 0 6px #f472b64d;
  }

  .routine-shell {
    grid-template-columns: 360px 1fr;
    gap: 16px;
    height: calc(100% - 32px);
    display: grid;
  }

  .ex-library {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    flex-direction: column;
    gap: 12px;
    padding: 16px;
    display: flex;
    overflow: hidden;
  }

  .ex-library .h {
    color: var(--text-muted);
    letter-spacing: .1em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .ex-library .filters {
    flex-wrap: wrap;
    gap: 4px;
    display: flex;
  }

  .ex-library .filters .f-chip {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 9999px;
    padding: 3px 9px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .ex-library .filters .f-chip.active {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
    background: #7dd3fc2e;
  }

  .ex-list {
    flex-direction: column;
    flex: 1;
    gap: 4px;
    display: flex;
    overflow-y: auto;
  }

  .ex-item {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    cursor: grab;
    border-radius: 6px;
    grid-template-columns: 16px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    font-size: 12px;
    display: grid;
  }

  .ex-item:hover {
    border-color: var(--border-strong);
  }

  .ex-item .grip {
    color: var(--text-muted);
    font-size: 12px;
    line-height: 1;
  }

  .ex-item .nm {
    flex-direction: column;
    gap: 2px;
    display: flex;
  }

  .ex-item .nm .muscle {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .ex-item .check-mark {
    color: var(--success);
    font-weight: 700;
  }

  .routine-canvas {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 18px 20px;
    overflow-y: auto;
  }

  .ex-table {
    border-collapse: collapse;
    width: 100%;
    margin-top: 12px;
  }

  .ex-table thead th {
    text-align: left;
    color: var(--text-muted);
    letter-spacing: .1em;
    border-bottom: 1px solid var(--border-subtle);
    padding: 6px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .ex-table tbody tr {
    border-bottom: 1px solid var(--border-subtle);
  }

  .ex-table tbody tr:hover {
    background: var(--bg-base);
  }

  .ex-table td {
    padding: 10px;
    font-size: 13px;
  }

  .ex-table td.grip {
    color: var(--text-muted);
    cursor: grab;
    width: 16px;
  }

  .ex-table td .ex-name {
    font-weight: 700;
  }

  .ex-table td .ex-muscle {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: block;
  }

  .ex-table td .pr-tag {
    color: var(--accent-pink);
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .notes-content {
    flex: 1;
    display: flex;
    overflow: hidden;
  }

  .notes-tree {
    background: var(--bg-surface);
    border-right: 1px solid var(--border-subtle);
    flex-direction: column;
    width: 280px;
    display: flex;
    overflow: hidden;
  }

  .notes-tree .nt-h {
    color: var(--text-muted);
    letter-spacing: .1em;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .notes-tree .nt-search {
    padding: 0 10px 8px;
  }

  .notes-tree .nt-search input {
    background: var(--bg-base);
    border: 1px solid var(--border-subtle);
    width: 100%;
    color: var(--text-primary);
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 12px;
  }

  .notes-tree .nt-body {
    flex: 1;
    padding: 4px 8px 16px;
    overflow-y: auto;
  }

  .nt-section {
    color: var(--text-muted);
    letter-spacing: .1em;
    padding: 8px 8px 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .nt-row {
    cursor: pointer;
    border-radius: 4px;
    grid-template-columns: 10px 16px 1fr auto;
    align-items: center;
    gap: 6px;
    padding: 4px 6px;
    font-size: 13px;
    display: grid;
  }

  .nt-row:hover {
    background: var(--bg-elevated);
  }

  .nt-row.active {
    color: var(--accent-cyan);
    background: #7dd3fc1a;
  }

  .nt-row .chev {
    color: var(--text-muted);
    font-size: 9px;
    line-height: 1;
  }

  .nt-row .em {
    font-size: 12px;
    line-height: 1;
  }

  .nt-row .nm {
    color: var(--text-primary);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .nt-row.active .nm {
    color: var(--accent-cyan);
  }

  .nt-row .ct {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .nt-row.indent-1 {
    padding-left: 22px;
  }

  .nt-row.indent-2 {
    padding-left: 38px;
  }

  .note-editor {
    background: var(--bg-base);
    flex: 1;
    padding: 0;
    overflow-y: auto;
  }

  .note-cover {
    background: linear-gradient(135deg, #a78bfa4d, #f472b633, #7dd3fc1a);
    height: 200px;
    position: relative;
  }

  .note-cover:before {
    content: "";
    background: radial-gradient(circle at 20% 30%, #7dd3fc33, #0000 40%), radial-gradient(circle at 70% 60%, #f472b633, #0000 40%);
    position: absolute;
    inset: 0;
  }

  .note-frame {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 32px 96px;
    position: relative;
  }

  .note-emoji {
    background: var(--bg-base);
    border: 1px solid var(--border-subtle);
    border-radius: 16px;
    place-items: center;
    width: 96px;
    height: 96px;
    margin-top: -48px;
    font-size: 64px;
    line-height: 1;
    display: grid;
    box-shadow: 0 8px 24px #0006;
  }

  .note-title {
    letter-spacing: -.02em;
    margin-top: 24px;
    font-size: 40px;
    font-weight: 800;
    line-height: 1.1;
  }

  .note-meta {
    color: var(--text-muted);
    gap: 16px;
    margin-top: 12px;
    margin-bottom: 32px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    display: flex;
  }

  .note-meta .nm-row {
    align-items: center;
    gap: 6px;
    display: flex;
  }

  .note-meta .lbl {
    color: var(--text-muted);
  }

  .note-meta .v {
    color: var(--text-secondary);
  }

  .note-meta .v.cyan {
    color: var(--accent-cyan);
  }

  .note-meta .v.pink {
    color: var(--accent-pink);
  }

  .note-meta .v.violet {
    color: var(--accent-violet);
  }

  .blk-h1 {
    letter-spacing: -.01em;
    margin: 28px 0 12px;
    font-size: 28px;
    font-weight: 700;
  }

  .blk-h2 {
    margin: 22px 0 10px;
    font-size: 22px;
    font-weight: 700;
  }

  .blk-h3 {
    margin: 18px 0 8px;
    font-size: 18px;
    font-weight: 700;
  }

  .blk-p {
    color: var(--text-primary);
    margin: 8px 0;
    font-size: 15px;
    line-height: 1.6;
  }

  .blk-p .mention {
    color: var(--accent-cyan);
    background: #7dd3fc26;
    border-radius: 4px;
    padding: 1px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 13px;
  }

  .blk-p .mention.proj {
    color: var(--accent-pink);
    background: #f472b626;
  }

  .blk-p .mention.tag {
    color: var(--accent-violet);
    background: #a78bfa26;
  }

  .blk-todo {
    align-items: flex-start;
    gap: 10px;
    padding: 5px 0;
    display: flex;
  }

  .blk-todo .ck {
    border: 1.5px solid var(--border-strong);
    border-radius: 4px;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin-top: 2px;
  }

  .blk-todo.done .ck {
    background: var(--accent-cyan);
    border-color: var(--accent-cyan);
    color: var(--bg-base);
    place-items: center;
    font-weight: 700;
    display: grid;
  }

  .blk-todo.done .ck:before {
    content: "✓";
    font-size: 11px;
  }

  .blk-todo.done .text {
    color: var(--text-muted);
    text-decoration: line-through;
  }

  .blk-bullet {
    padding: 4px 0 4px 24px;
    font-size: 15px;
    line-height: 1.6;
    position: relative;
  }

  .blk-bullet:before {
    content: "•";
    color: var(--text-muted);
    font-weight: 700;
    position: absolute;
    left: 8px;
  }

  .blk-callout {
    border-left: 3px solid var(--accent-cyan);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    background: #7dd3fc14;
    gap: 12px;
    margin: 12px 0;
    padding: 12px 14px;
    display: flex;
  }

  .blk-callout.warn {
    border-color: var(--warning);
    background: #fbbf2414;
  }

  .blk-callout.danger {
    border-color: var(--danger);
    background: #f871711a;
  }

  .blk-callout .ic {
    font-size: 16px;
    line-height: 1.4;
  }

  .blk-callout .body {
    font-size: 14px;
    line-height: 1.5;
  }

  .blk-quote {
    border-left: 3px solid var(--text-muted);
    color: var(--text-secondary);
    margin: 14px 0;
    padding: 4px 0 4px 14px;
    font-size: 15px;
    font-style: italic;
    line-height: 1.6;
  }

  .blk-divider {
    background: var(--border-subtle);
    height: 1px;
    margin: 24px 0;
  }

  .blk-code {
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    background: #0a0e27b3;
    margin: 12px 0;
    padding: 12px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 12px;
    line-height: 1.5;
    overflow-x: auto;
  }

  .blk-code .kw {
    color: var(--accent-pink);
  }

  .blk-code .str {
    color: var(--success);
  }

  .blk-code .com {
    color: var(--text-muted);
    font-style: italic;
  }

  .blk-code .fn {
    color: var(--accent-violet);
  }

  .blk-code .num {
    color: var(--warning);
  }

  .slash-menu {
    background: var(--bg-elevated);
    border: 1px solid var(--accent-cyan);
    border-radius: var(--radius-md);
    width: 280px;
    box-shadow: 0 12px 32px #00000080, var(--glow-cyan);
    z-index: 30;
    padding: 6px;
    position: absolute;
  }

  .slash-menu .sh-h {
    color: var(--text-muted);
    letter-spacing: .1em;
    padding: 6px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .slash-menu .sh-row {
    cursor: pointer;
    border-radius: 4px;
    grid-template-columns: 28px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    display: grid;
  }

  .slash-menu .sh-row:hover, .slash-menu .sh-row.active {
    background: #7dd3fc1f;
  }

  .slash-menu .sh-row .ic {
    text-align: center;
    font-size: 14px;
  }

  .slash-menu .sh-row .nm {
    font-size: 13px;
    font-weight: 700;
  }

  .slash-menu .sh-row .desc {
    color: var(--text-muted);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    font-weight: 400;
    display: block;
  }

  .slash-menu .sh-row .kbd {
    color: var(--text-muted);
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: 3px;
    padding: 1px 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .timer-content {
    background: var(--bg-base);
    flex-direction: column;
    flex: 1;
    display: flex;
    overflow: hidden;
  }

  .timer-scroll {
    padding: 0 24px 96px;
    overflow-y: auto;
  }

  .timer-kpi-row {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 14px;
    margin-bottom: 18px;
    display: grid;
  }

  .timer-kpi {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    flex-direction: column;
    gap: 6px;
    padding: 16px 18px;
    display: flex;
  }

  .timer-kpi .lbl {
    color: var(--text-muted);
    letter-spacing: .1em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .timer-kpi .val {
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
    font-size: 28px;
    font-weight: 700;
  }

  .timer-kpi.cy .val {
    color: var(--accent-cyan);
  }

  .timer-kpi.pk .val {
    color: var(--accent-pink);
  }

  .timer-kpi.violet .val {
    color: var(--accent-violet);
  }

  .timer-kpi.success .val {
    color: var(--success);
  }

  .timer-kpi .sub {
    color: var(--text-muted);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .day-block {
    margin-bottom: 24px;
  }

  .day-block .day-h {
    color: var(--text-muted);
    letter-spacing: .1em;
    justify-content: space-between;
    padding: 12px 0 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    display: flex;
  }

  .day-block .day-h .day-total {
    color: var(--accent-cyan);
    font-weight: 700;
  }

  .session-row {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    grid-template-columns: 64px 1fr auto auto;
    align-items: center;
    gap: 14px;
    margin-bottom: 6px;
    padding: 10px 14px;
    display: grid;
  }

  .session-row:hover {
    border-color: var(--border-strong);
  }

  .session-row .start-end {
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .session-row .info .nm {
    font-size: 13px;
    font-weight: 700;
  }

  .session-row .info .meta {
    color: var(--text-muted);
    margin-top: 2px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .mode-pill {
    letter-spacing: .06em;
    border: 1px solid;
    border-radius: 9999px;
    padding: 2px 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .mode-pill.pomodoro {
    color: var(--accent-violet);
    background: #a78bfa1a;
    border-color: #a78bfa66;
  }

  .mode-pill.free {
    color: var(--accent-cyan);
    background: #7dd3fc1a;
    border-color: #7dd3fc66;
  }

  .mode-pill.countdown {
    color: var(--accent-pink);
    background: #f472b61a;
    border-color: #f472b666;
  }

  .session-row .dur {
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    font-family: JetBrains Mono, monospace;
    font-size: 13px;
    font-weight: 700;
  }

  .timer-expanded {
    background: var(--bg-elevated);
    border: 1px solid var(--accent-pink);
    border-radius: var(--radius-md);
    z-index: 50;
    width: 320px;
    padding: 12px 16px;
    display: none;
    position: fixed;
    bottom: 16px;
    right: 16px;
    box-shadow: 0 8px 28px #f472b633, 0 0 0 1px #f472b64d;
  }

  .timer-expanded.show {
    display: block;
  }

  .timer-expanded .te-tabs {
    background: var(--bg-base);
    border: 1px solid var(--border-subtle);
    border-radius: 9999px;
    gap: 2px;
    margin-bottom: 10px;
    padding: 2px;
    display: flex;
  }

  .timer-expanded .te-tabs button {
    color: var(--text-muted);
    letter-spacing: .06em;
    cursor: pointer;
    background: none;
    border: 0;
    border-radius: 9999px;
    flex: 1;
    padding: 5px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .timer-expanded .te-tabs button.active {
    background: var(--bg-surface-2);
    color: var(--accent-pink);
  }

  .timer-expanded .te-clock {
    text-align: center;
    color: var(--accent-pink);
    font-variant-numeric: tabular-nums;
    text-shadow: 0 0 12px #f472b666;
    letter-spacing: .04em;
    margin-bottom: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 36px;
    font-weight: 700;
  }

  .timer-expanded .te-task {
    text-align: center;
    color: var(--text-muted);
    letter-spacing: .06em;
    margin-bottom: 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .timer-expanded .te-actions {
    gap: 6px;
    display: flex;
  }

  .timer-expanded .te-actions button {
    background: var(--bg-base);
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    cursor: pointer;
    letter-spacing: .04em;
    flex: 1;
    padding: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .timer-expanded .te-actions button.stop {
    color: var(--accent-pink);
    border-color: #f472b666;
  }

  .settings-content {
    flex: 1;
    display: flex;
    overflow: hidden;
  }

  .settings-sidebar {
    background: var(--bg-surface);
    border-right: 1px solid var(--border-subtle);
    flex-shrink: 0;
    width: 240px;
    padding: 18px 0;
    overflow-y: auto;
  }

  .settings-sidebar .ss-group {
    color: var(--text-muted);
    letter-spacing: .1em;
    padding: 14px 18px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .settings-sidebar .ss-row {
    cursor: pointer;
    color: var(--text-secondary);
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    font-size: 13px;
    display: flex;
  }

  .settings-sidebar .ss-row:hover {
    background: var(--bg-elevated);
    color: var(--text-primary);
  }

  .settings-sidebar .ss-row.active {
    color: var(--accent-cyan);
    border-left: 2px solid var(--accent-cyan);
    background: #7dd3fc1a;
    padding-left: 16px;
  }

  .settings-sidebar .ss-row .ic {
    text-align: center;
    width: 16px;
  }

  .settings-main {
    flex: 1;
    padding: 24px 32px;
    overflow-y: auto;
  }

  .settings-main .sm-h {
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 24px;
    display: flex;
  }

  .settings-main .sm-h .sm-title {
    letter-spacing: -.01em;
    font-size: 26px;
    font-weight: 700;
  }

  .settings-main .sm-h .sm-sub {
    color: var(--text-muted);
    margin-top: 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .settings-card {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    margin-bottom: 16px;
    padding: 20px 24px;
  }

  .settings-card h3 {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .toggle-pill {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    cursor: pointer;
    border-radius: 9999px;
    padding: 2px;
    display: inline-flex;
  }

  .toggle-pill .th {
    color: var(--text-muted);
    letter-spacing: .06em;
    border-radius: 9999px;
    padding: 4px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .toggle-pill.on .th.on {
    color: var(--success);
    background: #4ade802e;
  }

  .toggle-pill.on .th.off {
    color: var(--text-muted);
  }

  .env-locked-badge {
    color: var(--accent-violet);
    letter-spacing: .06em;
    background: #a78bfa26;
    border: 1px solid #a78bfa66;
    border-radius: 3px;
    margin-left: 8px;
    padding: 1px 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .danger-zone {
    border-color: #f8717166;
  }

  .danger-zone h3 {
    color: var(--danger);
  }

  .danger-btn {
    border: 1px solid var(--danger);
    color: var(--danger);
    border-radius: var(--radius-sm);
    cursor: pointer;
    letter-spacing: .06em;
    background: #f871711a;
    padding: 6px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  [id^="a-"]:empty, [id^="b-"]:empty, [id^="c-"]:empty, [id^="d-"]:empty, [id^="e-"]:empty, [id^="f-"]:empty, [id^="gym-"]:empty, [id^="money-"]:empty {
    display: none !important;
  }

  :target {
    scroll-margin-top: 100px;
  }

  .sub-tabs {
    z-index: 80;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--border-subtle);
    scrollbar-width: none;
    background: #0a0e27eb;
    align-items: center;
    gap: 4px;
    height: 36px;
    padding: 0 24px 0 104px;
    display: flex;
    position: fixed;
    top: 48px;
    left: 0;
    right: 0;
    overflow-x: auto;
  }

  .sub-tabs::-webkit-scrollbar {
    display: none;
  }

  .sub-tab {
    color: var(--text-muted);
    letter-spacing: .08em;
    border-radius: var(--radius-sm);
    cursor: pointer;
    white-space: nowrap;
    background: none;
    border: 0;
    border-bottom: 2px solid #0000;
    margin-bottom: -1px;
    padding: 8px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 10.5px;
    text-decoration: none;
    transition: all .12s;
  }

  .sub-tab:hover {
    color: var(--text-secondary);
    background: var(--bg-elevated);
  }

  .sub-tab.active {
    color: var(--accent-cyan);
    border-bottom-color: var(--accent-cyan);
    background: #7dd3fc0f;
  }

  .sub-tab .badge {
    background: var(--bg-elevated);
    color: var(--text-muted);
    border-radius: 9999px;
    margin-left: 6px;
    padding: 1px 6px;
    font-size: 9px;
  }

  .sub-tab.active .badge {
    color: var(--accent-cyan);
    background: #7dd3fc33;
  }

  .shell.with-subs {
    top: 84px;
  }

  .panel-showcase {
    border-top: 2px dashed var(--border-subtle);
    margin-top: 32px;
    padding-top: 24px;
  }

  .panel-showcase h2 {
    color: var(--text-muted);
    letter-spacing: .12em;
    margin-bottom: 16px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .panel-row {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
    display: grid;
  }

  .panel-card {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    padding: 18px 20px;
    position: relative;
  }

  .panel-card .pc-h {
    border-bottom: 1px solid var(--border-subtle);
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 14px;
    padding-bottom: 12px;
    display: flex;
  }

  .panel-card .pc-h .pc-ttl {
    color: var(--accent-cyan);
    letter-spacing: .1em;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 700;
  }

  .panel-card .pc-h .pc-src {
    color: var(--text-muted);
    letter-spacing: .06em;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .panel-card .pc-stage {
    background: var(--bg-base);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    min-height: 220px;
    padding: 14px;
    position: relative;
    overflow: hidden;
  }

  .panel-card .pc-foot {
    color: var(--text-muted);
    letter-spacing: .04em;
    margin-top: 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    line-height: 1.6;
  }

  .scell {
    aspect-ratio: 1;
    background: var(--bg-surface);
    border: 1.5px solid var(--border-strong);
    cursor: pointer;
    color: var(--text-secondary);
    border-radius: 6px;
    place-items: center;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    transition: all .12s;
    display: grid;
    position: relative;
    overflow: hidden;
  }

  .scell.done {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: #fff;
    border-color: #0000;
    box-shadow: 0 0 8px #7dd3fc4d;
  }

  .scell.done:before {
    content: "✓";
  }

  .scell.today-pending {
    border-color: var(--accent-cyan);
    animation: 2s ease-in-out infinite glowPulse;
  }

  .scell.today-pending:before {
    content: "?";
    color: var(--accent-cyan);
  }

  .scell.miss {
    border-color: var(--danger);
    color: var(--danger);
    background: #f8717126;
  }

  .scell.miss:before {
    content: "✕";
  }

  .scell.skip {
    color: var(--warning);
    background: repeating-linear-gradient(45deg, #fbbf2433 0 4px, #0000 4px 8px);
    border-color: #fbbf2466;
  }

  .scell.skip:before {
    content: "↺";
  }

  .scell.partial {
    background: linear-gradient(to right, #7dd3fc66 0%, #7dd3fc66 75%, var(--bg-surface) 75%, var(--bg-surface) 100%);
    color: var(--accent-cyan);
  }

  .phone-stage {
    flex-wrap: wrap;
    justify-content: center;
    gap: 28px;
    padding: 32px 24px;
    display: flex;
  }

  .phone-frame {
    background: var(--bg-base);
    border: 10px solid #0a0e27;
    border-radius: 44px;
    flex-direction: column;
    flex-shrink: 0;
    width: 375px;
    height: 812px;
    display: flex;
    position: relative;
    overflow: hidden;
    box-shadow: 0 0 0 2px #2a2f4a, 0 30px 80px #0000008c, 0 0 60px #7dd3fc1a;
  }

  .phone-frame .notch {
    z-index: 5;
    background: #0a0e27;
    border-radius: 0 0 18px 18px;
    width: 130px;
    height: 28px;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }

  .phone-frame .status-bar {
    color: var(--text-primary);
    justify-content: space-between;
    align-items: center;
    padding: 12px 28px 4px;
    font-family: Inter, sans-serif;
    font-size: 13px;
    font-weight: 600;
    display: flex;
  }

  .phone-frame .screen {
    background: var(--bg-base);
    flex: 1;
    padding: 0;
    overflow-y: auto;
  }

  .phone-frame .home-indicator {
    background: var(--text-secondary);
    opacity: .4;
    border-radius: 9999px;
    width: 132px;
    height: 4px;
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translateX(-50%);
  }

  .phone-label {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-align: center;
    margin-bottom: 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .phone-label .nm {
    color: var(--accent-cyan);
    font-weight: 700;
  }

  .m-gym-fs {
    flex-direction: column;
    gap: 22px;
    padding: 18px 18px 24px;
    display: flex;
  }

  .m-gym-fs .ex-meta {
    color: var(--text-muted);
    letter-spacing: .12em;
    text-transform: uppercase;
    font-family: JetBrains Mono, monospace;
    font-size: 9.5px;
  }

  .m-gym-fs .ex-name {
    letter-spacing: -.01em;
    color: var(--text-primary);
    margin-top: 4px;
    font-size: 22px;
    font-weight: 700;
  }

  .m-gym-fs .stepper {
    justify-content: center;
    align-items: center;
    gap: 16px;
    padding: 18px 0 6px;
    display: flex;
  }

  .m-gym-fs .stepper button {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    width: 44px;
    height: 44px;
    color: var(--text-secondary);
    cursor: pointer;
    border-radius: 50%;
    place-items: center;
    font-size: 22px;
    font-weight: 600;
    display: grid;
  }

  .m-gym-fs .stepper button:hover {
    color: var(--accent-cyan);
    border-color: var(--accent-cyan);
    box-shadow: 0 0 12px #7dd3fc4d;
  }

  .m-gym-fs .stepper .weight-val {
    font-variant-numeric: tabular-nums;
    color: var(--accent-cyan);
    letter-spacing: -.02em;
    text-shadow: 0 0 24px #7dd3fc73;
    align-items: baseline;
    gap: 4px;
    font-size: 56px;
    font-weight: 700;
    display: flex;
  }

  .m-gym-fs .stepper .weight-val .unit {
    color: var(--text-muted);
    letter-spacing: 0;
    font-size: 14px;
    font-weight: 500;
  }

  .m-gym-fs .reps-block {
    flex-direction: column;
    gap: 8px;
    display: flex;
  }

  .m-gym-fs .reps-block .h {
    color: var(--text-muted);
    letter-spacing: .12em;
    text-transform: uppercase;
    justify-content: space-between;
    align-items: baseline;
    font-family: JetBrains Mono, monospace;
    font-size: 9.5px;
    display: flex;
  }

  .m-gym-fs .reps-block .h .v {
    color: var(--accent-cyan);
    text-transform: none;
    letter-spacing: 0;
    font-size: 13px;
    font-weight: 700;
  }

  .m-gym-fs .reps-grid {
    grid-template-columns: repeat(6, 1fr);
    gap: 6px;
    display: grid;
  }

  .m-gym-fs .reps-grid button {
    aspect-ratio: 1;
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    cursor: pointer;
    font-family: JetBrains Mono, monospace;
    font-size: 13px;
    font-weight: 500;
  }

  .m-gym-fs .reps-grid button.active {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
    background: #7dd3fc1a;
    box-shadow: 0 0 10px #7dd3fc33;
  }

  .m-gym-fs .custom-reps {
    background: var(--bg-surface);
    border: 1px dashed #a78bfa4d;
    border-radius: 6px;
    grid-template-columns: 18px 1fr auto;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    padding: 5px 7px;
    transition: all .12s;
    display: grid;
  }

  .m-gym-fs .custom-reps:focus-within {
    border-style: solid;
    border-color: var(--accent-violet);
    box-shadow: 0 0 0 2px #a78bfa1f;
  }

  .m-gym-fs .custom-reps .ic {
    width: 18px;
    height: 18px;
    color: var(--accent-violet);
    background: #a78bfa1a;
    border-radius: 4px;
    place-items: center;
    display: grid;
  }

  .m-gym-fs .custom-reps .ic svg {
    stroke-width: 2px;
    width: 10px;
    height: 10px;
  }

  .m-gym-fs .custom-reps input {
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
    background: none;
    border: 0;
    outline: none;
    width: 100%;
    padding: 0;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 700;
  }

  .m-gym-fs .custom-reps input::placeholder {
    color: var(--text-muted);
    opacity: .7;
    font-size: 10px;
    font-weight: 500;
  }

  .m-gym-fs .custom-reps .submit {
    border: 1px solid var(--accent-violet);
    height: 18px;
    color: var(--accent-violet);
    cursor: pointer;
    letter-spacing: .04em;
    background: #a78bfa26;
    border-radius: 4px;
    padding: 0 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    font-weight: 700;
  }

  .m-gym-fs .custom-reps .submit:hover {
    background: #a78bfa40;
  }

  .m-gym-fs .log-pill {
    background: linear-gradient(135deg, var(--accent-pink), var(--accent-violet));
    color: #fff;
    letter-spacing: .06em;
    cursor: pointer;
    text-transform: uppercase;
    border: 0;
    border-radius: 14px;
    width: 100%;
    padding: 16px;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 8px 28px #f472b659;
  }

  .m-gym-fs .sets-list {
    flex-direction: column;
    gap: 8px;
    display: flex;
  }

  .m-gym-fs .sets-list .h {
    color: var(--text-muted);
    letter-spacing: .12em;
    text-transform: uppercase;
    justify-content: space-between;
    align-items: baseline;
    font-family: JetBrains Mono, monospace;
    font-size: 9.5px;
    display: flex;
  }

  .m-gym-fs .sets-list .pills {
    flex-wrap: wrap;
    gap: 6px;
    display: flex;
  }

  .m-gym-fs .sets-list .pill {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    letter-spacing: .04em;
    border-radius: 9999px;
    align-items: center;
    padding: 7px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10.5px;
    display: inline-flex;
  }

  .m-gym-fs .sets-list .pill.pr {
    border-color: var(--accent-pink);
    color: var(--accent-pink);
    background: #f472b61a;
    font-weight: 700;
  }

  .m-topbar {
    border-bottom: 1px solid var(--border-subtle);
    align-items: center;
    gap: 10px;
    padding: 10px 18px 14px;
    display: flex;
  }

  .m-topbar .back {
    width: 32px;
    height: 32px;
    color: var(--text-secondary);
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: 9999px;
    place-items: center;
    font-size: 14px;
    display: grid;
  }

  .m-topbar .ttl {
    letter-spacing: -.01em;
    flex: 1;
    font-size: 16px;
    font-weight: 700;
  }

  .m-topbar .meta {
    color: var(--text-muted);
    letter-spacing: .1em;
    margin-top: 1px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    font-weight: 500;
    display: block;
  }

  .timer-content > .topbar, .timer-content > .timer-scroll {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }

  .h2-content {
    background: var(--bg-base);
    flex-direction: column;
    flex: 1;
    display: flex;
    overflow: hidden;
  }

  .h2-scroll {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    padding: 24px 32px 96px;
    overflow-y: auto;
  }

  .h2-page-h {
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 16px;
    display: flex;
  }

  .h2-page-h .ttl {
    letter-spacing: -.01em;
    font-size: 22px;
    font-weight: 700;
  }

  .h2-page-h .ttl .meta {
    color: var(--text-muted);
    letter-spacing: .06em;
    margin-left: 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 500;
  }

  .h2-page-h .actions {
    gap: 8px;
    display: flex;
  }

  .h2-page-h .btn-add {
    color: var(--accent-cyan);
    border-radius: var(--radius-sm);
    letter-spacing: .06em;
    cursor: pointer;
    background: linear-gradient(135deg, #7dd3fc2e, #a78bfa2e);
    border: 1px solid #7dd3fc66;
    padding: 7px 14px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    font-weight: 700;
  }

  .h2-page-h .btn-add:hover {
    box-shadow: 0 0 12px #7dd3fc4d;
  }

  .h2-grid-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    overflow: hidden;
  }

  .h2-grid-h {
    border-bottom: 1px solid var(--border-subtle);
    background: var(--bg-surface-2);
    grid-template-columns: 220px repeat(7, 1fr) 64px;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    display: grid;
  }

  .h2-grid-h .day {
    text-align: center;
    color: var(--text-muted);
    letter-spacing: .06em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .h2-grid-h .day .dn {
    color: var(--text-secondary);
    margin-bottom: 2px;
    font-size: 11px;
    font-weight: 700;
    display: block;
  }

  .h2-grid-h .day.today .dn, .h2-grid-h .day.today {
    color: var(--accent-cyan);
  }

  .h2-grid-h .col-streak {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-transform: uppercase;
    text-align: right;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .h2-row {
    cursor: pointer;
    border-bottom: 1px solid #2a2f4a80;
    grid-template-columns: 220px repeat(7, 1fr) 64px;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    transition: background .1s;
    display: grid;
  }

  .h2-row:last-child {
    border-bottom: 0;
  }

  .h2-row:hover {
    background: #7dd3fc0a;
  }

  .h2-row.expanded {
    background: #7dd3fc0f;
    border-bottom-color: #7dd3fc4d;
  }

  .h2-row .lbl {
    align-items: center;
    gap: 10px;
    min-width: 0;
    display: flex;
  }

  .h2-row .ic-pill {
    border: 1px solid var(--border-subtle);
    width: 28px;
    height: 28px;
    color: var(--text-secondary);
    background: #ffffff0d;
    border-radius: 6px;
    flex-shrink: 0;
    place-items: center;
    display: grid;
  }

  .h2-row .ic-pill svg {
    stroke-width: 2.25px;
    width: 15px;
    height: 15px;
  }

  .h2-row.expanded .ic-pill, .h2-row .ic-pill.done {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
    background: #7dd3fc26;
    box-shadow: 0 0 6px #7dd3fc40;
  }

  .h2-row .nm {
    color: var(--text-primary);
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 13px;
    overflow: hidden;
  }

  .h2-row .freq {
    color: var(--text-muted);
    letter-spacing: .05em;
    margin-top: 1px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: block;
  }

  .h2-row .pcell {
    background: var(--bg-base);
    border: 1px solid var(--border-subtle);
    height: 28px;
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 5px;
    place-items: center;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    transition: all .1s;
    display: grid;
  }

  .h2-row .pcell:hover {
    border-color: var(--border-strong);
  }

  .h2-row .pcell.done {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: #0a0e27;
    border-color: #0000;
    font-weight: 700;
    box-shadow: 0 0 6px #7dd3fc4d;
  }

  .h2-row .pcell.done:before {
    content: "✓";
    font-size: 12px;
  }

  .h2-row .pcell.miss {
    color: var(--danger);
    background: #f871711a;
    border-color: #f871714d;
  }

  .h2-row .pcell.miss:before {
    content: "✕";
    font-weight: 700;
  }

  .h2-row .pcell.skip {
    color: var(--warning);
    background: repeating-linear-gradient(45deg, #fbbf241a 0 4px, #0000 4px 8px);
    border-color: #fbbf2447;
  }

  .h2-row .pcell.skip:before {
    content: "↺";
    font-size: 11px;
  }

  .h2-row .pcell.partial {
    background: linear-gradient(to right, #7dd3fc73 var(--pct, 50%), var(--bg-elevated) var(--pct, 50%));
    color: var(--text-primary);
    border-color: #7dd3fc4d;
    font-weight: 700;
  }

  .h2-row .pcell.partial:before {
    content: attr(data-pct);
  }

  .h2-row .pcell.future {
    border-style: dashed;
    border-color: var(--border-subtle);
    cursor: default;
    color: #0000;
    background: none;
  }

  .h2-row .pcell.future:before {
    content: "·";
    color: var(--text-muted);
  }

  .h2-row .pcell.today {
    box-shadow: 0 0 0 1.5px var(--accent-cyan);
  }

  .h2-row .pcell.today.pending {
    background: var(--bg-base);
    border: 1px solid var(--accent-cyan);
    color: var(--accent-cyan);
    animation: 2s ease-in-out infinite glowPulse;
  }

  .h2-row .pcell.today.pending:before {
    content: "?";
    font-weight: 700;
  }

  .h2-row .strk {
    text-align: right;
    color: var(--accent-cyan);
    font-variant-numeric: tabular-nums;
    font-family: JetBrains Mono, monospace;
    font-size: 12px;
    font-weight: 700;
  }

  .h2-row .strk.zero {
    color: var(--text-muted);
    font-weight: 500;
  }

  .h2-row .strk.broken {
    color: var(--text-muted);
    text-decoration: line-through;
  }

  .h2-row .strk .unit {
    color: var(--text-muted);
    font-size: 10px;
    font-weight: 500;
  }

  .h2-detail {
    background: var(--bg-surface);
    border: 1px solid #7dd3fc4d;
    border-radius: 12px;
    margin-top: 16px;
    padding: 18px 20px 20px;
    position: relative;
    box-shadow: 0 8px 24px #0a0e274d;
  }

  .h2-detail:before {
    content: "";
    background: var(--bg-surface);
    border-top: 1px solid #7dd3fc4d;
    border-left: 1px solid #7dd3fc4d;
    width: 12px;
    height: 12px;
    position: absolute;
    top: -7px;
    left: 80px;
    transform: rotate(45deg);
  }

  .h2-detail-h {
    border-bottom: 1px solid var(--border-subtle);
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
    padding-bottom: 14px;
    display: flex;
  }

  .h2-detail-h .ic-big {
    border: 1.5px solid var(--accent-cyan);
    width: 44px;
    height: 44px;
    color: var(--accent-cyan);
    background: linear-gradient(135deg, #7dd3fc2e, #a78bfa2e);
    border-radius: 10px;
    flex-shrink: 0;
    place-items: center;
    display: grid;
    box-shadow: 0 0 14px #7dd3fc33;
  }

  .h2-detail-h .ic-big svg {
    stroke-width: 2.25px;
    width: 22px;
    height: 22px;
  }

  .h2-detail-h .info {
    flex: 1;
    min-width: 0;
  }

  .h2-detail-h .nm {
    letter-spacing: -.01em;
    font-size: 18px;
    font-weight: 700;
  }

  .h2-detail-h .sub {
    color: var(--text-muted);
    margin-top: 2px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .h2-detail-h .acts {
    gap: 6px;
    display: flex;
  }

  .h2-detail-h .acts .btn {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    border-radius: var(--radius-sm);
    letter-spacing: .06em;
    cursor: pointer;
    padding: 6px 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .h2-detail-h .acts .btn:hover {
    color: var(--accent-cyan);
    border-color: var(--accent-cyan);
  }

  .h2-detail-h .acts .btn.danger:hover {
    color: var(--danger);
    border-color: var(--danger);
  }

  .h2-detail-h .close-x {
    color: var(--text-muted);
    cursor: pointer;
    background: none;
    border: 0;
    padding: 4px 8px;
    font-size: 16px;
  }

  .h2-detail-h .close-x:hover {
    color: var(--text-primary);
  }

  .h2-stats {
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 14px;
    display: grid;
  }

  .h2-stats .card {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    padding: 10px 12px;
  }

  .h2-stats .card .lbl {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 4px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .h2-stats .card .val {
    letter-spacing: -.01em;
    font-variant-numeric: tabular-nums;
    font-size: 22px;
    font-weight: 700;
  }

  .h2-stats .card .val .u {
    color: var(--text-muted);
    margin-left: 2px;
    font-size: 12px;
    font-weight: 500;
  }

  .h2-stats .card.cy .val {
    color: var(--accent-cyan);
  }

  .h2-stats .card.violet .val {
    color: var(--accent-violet);
  }

  .h2-stats .card.success .val {
    color: var(--success);
  }

  .h2-stats .card.warn .val {
    color: var(--warning);
  }

  .h2-subcard {
    background: var(--bg-surface-2);
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    margin-bottom: 12px;
    padding: 14px 16px;
  }

  .h2-subcard .h-row {
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 10px;
    display: flex;
  }

  .h2-subcard h4 {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin: 0;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    font-weight: 500;
  }

  .h2-subcard .h-meta {
    color: var(--text-muted);
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .h2-week {
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
    max-width: 480px;
    display: grid;
  }

  .h2-week .scell {
    aspect-ratio: 1;
    background: var(--bg-base);
    border: 1.5px solid var(--border-strong);
    cursor: pointer;
    color: var(--text-secondary);
    border-radius: 6px;
    place-items: center;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
    transition: all .12s;
    display: grid;
  }

  .h2-week .scell.done {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: #fff;
    border-color: #0000;
    box-shadow: 0 0 8px #7dd3fc4d;
  }

  .h2-week .scell.done:before {
    content: "✓";
  }

  .h2-week .scell.today-pending {
    border-color: var(--accent-cyan);
    animation: 2s ease-in-out infinite glowPulse;
  }

  .h2-week .scell.today-pending:before {
    content: "?";
    color: var(--accent-cyan);
  }

  .h2-week .scell.miss {
    border-color: var(--danger);
    color: var(--danger);
    background: #f8717126;
  }

  .h2-week .scell.miss:before {
    content: "✕";
  }

  .h2-week .scell.skip {
    color: var(--warning);
    background: repeating-linear-gradient(45deg, #fbbf2433 0 4px, #0000 4px 8px);
    border-color: #fbbf2466;
  }

  .h2-week .scell.skip:before {
    content: "↺";
  }

  .h2-week .scell.partial {
    background: linear-gradient(to right, #7dd3fc66 75%, var(--bg-surface) 75%);
    color: var(--accent-cyan);
  }

  .h2-week .scell.partial:before {
    content: "75%";
    font-size: 9px;
  }

  .h2-week .scell.future {
    border-style: dashed;
    border-color: var(--border-subtle);
    background: none;
  }

  .h2-week-days {
    max-width: 480px;
    color: var(--text-muted);
    text-align: center;
    letter-spacing: .04em;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
    margin-top: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    display: grid;
  }

  .h2-week-days .today-d {
    color: var(--accent-cyan);
    font-weight: 700;
  }

  .h2-heatmap {
    grid-template-columns: repeat(13, 1fr);
    gap: 3px;
    max-width: 540px;
    display: grid;
  }

  .h2-heatmap > div {
    grid-column: span 1;
    grid-template-rows: repeat(7, 1fr);
    gap: 3px;
    display: grid;
  }

  .h2-heatmap .cell {
    aspect-ratio: 1;
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: 2px;
  }

  .h2-heatmap .cell.l1 {
    background: #7dd3fc4d;
    border-color: #0000;
  }

  .h2-heatmap .cell.l2 {
    background: #7dd3fc8c;
    border-color: #0000;
  }

  .h2-heatmap .cell.l3 {
    background: #7dd3fcd9;
    border-color: #0000;
    box-shadow: 0 0 3px #7dd3fc4d;
  }

  .h2-heatmap .cell.miss {
    background: #f8717166;
    border-color: #0000;
  }

  .h2-heatmap .cell.skip {
    background: repeating-linear-gradient(45deg, #fbbf2466 0 2px, #0000 2px 4px);
    border-color: #fbbf244d;
  }

  .h2-heatmap .cell.future {
    background: none;
    border-style: dashed;
  }

  .h2-heatmap .cell.today {
    box-shadow: 0 0 0 1.5px var(--accent-cyan);
  }

  .h2-form {
    background: #7dd3fc0a;
    border: 1px dashed #7dd3fc66;
    border-radius: 12px;
    margin-top: 14px;
    padding: 14px 16px;
  }

  .h2-form .form-h {
    color: var(--accent-cyan);
    letter-spacing: .1em;
    text-transform: uppercase;
    margin-bottom: 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .h2-form .row {
    grid-template-columns: 36px 1fr 200px auto auto;
    align-items: center;
    gap: 10px;
    display: grid;
  }

  .h2-form .ic-slot {
    background: var(--bg-elevated);
    border: 1.5px dashed var(--border-strong);
    width: 36px;
    height: 36px;
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 8px;
    place-items: center;
    transition: all .12s;
    display: grid;
  }

  .h2-form .ic-slot.set {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
    background: #7dd3fc26;
    border-style: solid;
    box-shadow: 0 0 6px #7dd3fc33;
  }

  .h2-form .ic-slot svg {
    stroke-width: 2.25px;
    width: 18px;
    height: 18px;
  }

  .h2-form .input {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    width: 100%;
    padding: 7px 11px;
    font-family: Inter, system-ui, sans-serif;
    font-size: 13px;
  }

  .h2-form .input:focus {
    border-color: var(--accent-cyan);
    outline: none;
    box-shadow: 0 0 0 2px #7dd3fc26;
  }

  .h2-form .dow {
    gap: 3px;
    display: inline-flex;
  }

  .h2-form .dow span {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    width: 26px;
    height: 26px;
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 5px;
    place-items: center;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: grid;
  }

  .h2-form .dow span.active {
    border-color: var(--accent-cyan);
    color: var(--accent-cyan);
    background: #7dd3fc2e;
  }

  .h2-form .btn-cancel {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    color: var(--text-muted);
    border-radius: var(--radius-sm);
    letter-spacing: .06em;
    cursor: pointer;
    padding: 7px 12px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .h2-form .btn-cancel:hover {
    color: var(--text-primary);
    border-color: var(--border-strong);
  }

  .h2-form .btn-save {
    background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
    color: #0a0e27;
    border-radius: var(--radius-sm);
    cursor: pointer;
    border: 0;
    padding: 7px 14px;
    font-family: Inter, system-ui, sans-serif;
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 0 12px #7dd3fc4d;
  }

  .h2-form .row-extras {
    color: var(--text-muted);
    border-top: 1px solid #ffffff0d;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    padding-top: 10px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
    display: flex;
  }

  .h2-form .row-extras .seg {
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: 5px;
    gap: 2px;
    padding: 2px;
    display: inline-flex;
  }

  .h2-form .row-extras .seg button {
    color: var(--text-muted);
    cursor: pointer;
    letter-spacing: .05em;
    background: none;
    border: 0;
    border-radius: 3px;
    padding: 4px 9px;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .h2-form .row-extras .seg button.active {
    background: var(--bg-surface);
    color: var(--accent-cyan);
  }

  .h2-form .row-extras .field-mini {
    align-items: center;
    gap: 6px;
    display: inline-flex;
  }

  .h2-form .row-extras .field-mini input {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    color: var(--text-primary);
    border-radius: 4px;
    width: 76px;
    padding: 4px 8px;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .h2-icons {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    margin-top: 24px;
    padding: 16px 18px;
  }

  .h2-icons .head {
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 4px;
    display: flex;
  }

  .h2-icons .head .ttl {
    color: var(--text-secondary);
    letter-spacing: .08em;
    text-transform: uppercase;
    font-family: JetBrains Mono, monospace;
    font-size: 11px;
  }

  .h2-icons .head .ttl .cnt {
    color: var(--accent-cyan);
    margin-left: 4px;
  }

  .h2-icons .head .meta {
    color: var(--text-muted);
    letter-spacing: .04em;
    font-family: JetBrains Mono, monospace;
    font-size: 10px;
  }

  .h2-icons .sect {
    margin-top: 14px;
  }

  .h2-icons .sect-h {
    color: var(--text-muted);
    letter-spacing: .1em;
    text-transform: uppercase;
    border-bottom: 1px dashed var(--border-subtle);
    margin-bottom: 8px;
    padding-bottom: 6px;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
  }

  .h2-icons .ig {
    grid-template-columns: repeat(auto-fill, minmax(64px, 1fr));
    gap: 8px;
    display: grid;
  }

  .h2-icons .icell {
    background: var(--bg-base);
    border: 1px solid var(--border-subtle);
    cursor: pointer;
    border-radius: 8px;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 6px 8px;
    transition: all .12s;
    display: flex;
  }

  .h2-icons .icell:hover {
    border-color: var(--accent-cyan);
    background: #7dd3fc0f;
    box-shadow: 0 0 8px #7dd3fc26;
  }

  .h2-icons .icell .pill {
    width: 32px;
    height: 32px;
    color: var(--text-primary);
    place-items: center;
    display: grid;
  }

  .h2-icons .icell .pill svg {
    stroke-width: 2.25px;
    width: 18px;
    height: 18px;
  }

  .h2-icons .icell .lbl {
    color: var(--text-muted);
    letter-spacing: .04em;
    text-align: center;
    font-family: JetBrains Mono, monospace;
    font-size: 9px;
    line-height: 1.2;
  }

  .h2-icons .icell:hover .pill {
    color: var(--accent-cyan);
  }

  .h2-icons .icell:hover .lbl {
    color: var(--text-secondary);
  }
}

.money-mark {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  white-space: nowrap;
  border-radius: 9999px;
  align-items: center;
  gap: 6px;
  padding: 1px 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  line-height: 1.4;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .money-mark {
    background: color-mix(in srgb, var(--bg-elevated) 80%, transparent);
  }
}

.money-mark[data-bucket="0"] {
  color: #d97777;
  border-color: #d977774d;
}

.money-mark[data-bucket="1"] {
  color: #d4a437;
  border-color: #d4a4374d;
}

.money-mark[data-bucket="2"] {
  color: #7dd3fc;
  border-color: #7dd3fc4d;
}

.money-mark[data-bucket="3"] {
  color: #6ee7b7;
  border-color: #6ee7b74d;
}

.money-mark .prob {
  color: var(--text-muted);
}

.difficulty-battery {
  vertical-align: -1px;
  display: inline-block;
}

.exp-time {
  color: var(--text-muted);
  margin-left: 4px;
  font-family: JetBrains Mono, monospace;
  font-size: 12px;
}

.diff-label {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-left: 2px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
  font-weight: 700;
}

.diff-label[data-difficulty="quick"] {
  color: #6ee7b7;
}

.diff-label[data-difficulty="medium"] {
  color: #7dd3fc;
}

.diff-label[data-difficulty="hard"] {
  color: #d4a437;
}

.diff-label[data-difficulty="raid"] {
  color: #d97777;
}

.diff-pill {
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
  background: var(--text-muted);
  border: 1px solid var(--text-muted);
  color: var(--text-muted);
  border-radius: 9999px;
  align-items: center;
  gap: 5px;
  padding: 2px 7px;
  font-family: JetBrains Mono, monospace;
  font-size: 9.5px;
  font-weight: 700;
  line-height: 1.2;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .diff-pill {
    background: color-mix(in srgb, var(--text-muted) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--text-muted) 35%, transparent);
  }
}

.diff-pill .diff-dot {
  background: currentColor;
  border-radius: 50%;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
}

.diff-pill[data-difficulty="quick"] {
  color: #6ee7b7;
  background: #6ee7b724;
  border-color: #6ee7b759;
}

.diff-pill[data-difficulty="medium"] {
  color: #7dd3fc;
  background: #7dd3fc24;
  border-color: #7dd3fc59;
}

.diff-pill[data-difficulty="hard"] {
  color: #d4a437;
  background: #d4a43724;
  border-color: #d4a43759;
}

.diff-pill[data-difficulty="raid"] {
  color: #d97777;
  background: #d9777729;
  border-color: #d9777773;
  font-size: 10px;
  font-weight: 800;
}

.battery-time-pair {
  align-items: center;
  gap: 5px;
  display: inline-flex;
}

.tr .row2 {
  padding-right: 72px;
}

body .tasksv2-shell .tr[data-board-card="1"] .row2, body .tasksv2-shell .tasksv2-shell .tr[data-board-card="1"] .row2 {
  padding-right: 0 !important;
}

.qa-time-num-input::-webkit-inner-spin-button, .qa-time-num-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.tr .row2 .battery-time-pair, .tr .row2 .money-mark {
  margin-left: auto;
}

.tr .row2 .battery-time-pair ~ .money-mark {
  margin-left: 0;
}

.hit-rate-pie {
  vertical-align: -2px;
  display: inline-block;
}

.money-pipeline {
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 0 16px 16px;
  display: grid;
}

.bucket-column {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  flex-direction: column;
  gap: 4px;
  min-height: 200px;
  padding: 8px;
  transition: background .16s, border-color .16s, box-shadow .16s;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-column {
    background: color-mix(in srgb, var(--bg-elevated) 60%, transparent);
  }
}

.bucket-column[data-over="true"][data-bucket="0"] {
  background: var(--bg-elevated);
  border-color: #d97777;
  box-shadow: inset 0 0 0 1px #d9777766, 0 0 24px -8px #d9777780;
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-column[data-over="true"][data-bucket="0"] {
    border-color: color-mix(in srgb, #d97777 60%, var(--border-subtle));
    background: color-mix(in srgb, var(--bg-elevated) 55%, #d977771f);
  }
}

.bucket-column[data-over="true"][data-bucket="1"] {
  background: var(--bg-elevated);
  border-color: #d4a437;
  box-shadow: inset 0 0 0 1px #d4a43766, 0 0 24px -8px #d4a43780;
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-column[data-over="true"][data-bucket="1"] {
    border-color: color-mix(in srgb, #d4a437 60%, var(--border-subtle));
    background: color-mix(in srgb, var(--bg-elevated) 55%, #d4a4371f);
  }
}

.bucket-column[data-over="true"][data-bucket="2"] {
  background: var(--bg-elevated);
  border-color: #7dd3fc;
  box-shadow: inset 0 0 0 1px #7dd3fc66, 0 0 24px -8px #7dd3fc80;
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-column[data-over="true"][data-bucket="2"] {
    border-color: color-mix(in srgb, #7dd3fc 60%, var(--border-subtle));
    background: color-mix(in srgb, var(--bg-elevated) 55%, #7dd3fc1f);
  }
}

.bucket-column[data-over="true"][data-bucket="3"] {
  background: var(--bg-elevated);
  border-color: #6ee7b7;
  box-shadow: inset 0 0 0 1px #6ee7b766, 0 0 24px -8px #6ee7b780;
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-column[data-over="true"][data-bucket="3"] {
    border-color: color-mix(in srgb, #6ee7b7 60%, var(--border-subtle));
    background: color-mix(in srgb, var(--bg-elevated) 55%, #6ee7b71f);
  }
}

.bucket-header {
  border-bottom: 1px solid var(--border-subtle);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  padding: 4px 6px 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  display: flex;
}

.bucket-header[data-bucket="0"] {
  color: #d97777;
  border-bottom-color: #d977774d;
}

.bucket-header[data-bucket="1"] {
  color: #d4a437;
  border-bottom-color: #d4a4374d;
}

.bucket-header[data-bucket="2"] {
  color: #7dd3fc;
  border-bottom-color: #7dd3fc4d;
}

.bucket-header[data-bucket="3"] {
  color: #6ee7b7;
  border-bottom-color: #6ee7b74d;
}

.bucket-header .bucket-count {
  color: var(--text-muted);
  font-size: 10px;
}

.bucket-header .bucket-sum {
  color: var(--text-secondary);
  margin-left: auto;
  font-size: 10px;
}

.bucket-card {
  background: var(--bg-base);
  border: 1px solid var(--border-subtle);
  cursor: grab;
  color: var(--text-primary);
  will-change: transform;
  border-radius: 6px;
  outline: none;
  flex-direction: column;
  gap: 4px;
  padding: 6px 8px;
  font-size: 12px;
  transition: transform .14s cubic-bezier(.2, .7, .3, 1), border-color .14s, background .14s, box-shadow .14s;
  display: flex;
  position: relative;
  transform: translateY(0);
}

.bucket-card:hover {
  border-color: var(--accent-cyan, #7dd3fc);
  background: var(--bg-base);
  transform: translateY(-2px);
  box-shadow: 0 8px 20px -10px #0000008c;
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-card:hover {
    border-color: color-mix(in srgb, var(--accent-cyan, #7dd3fc) 55%, var(--border-subtle));
    background: color-mix(in srgb, var(--bg-base) 92%, var(--accent-cyan, #7dd3fc) 5%);
  }
}

.bucket-card:focus-visible {
  border-color: var(--accent-cyan, #7dd3fc);
  box-shadow: 0 0 0 2px var(--accent-cyan, #7dd3fc);
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-card:focus-visible {
    border-color: color-mix(in srgb, var(--accent-cyan, #7dd3fc) 70%, transparent);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent-cyan, #7dd3fc) 35%, transparent);
  }
}

.bucket-card:active {
  cursor: grabbing;
}

.bucket-card[data-dragging="true"] {
  opacity: .25;
  box-shadow: none;
  pointer-events: none;
  transform: translateY(0)scale(.98);
}

.bucket-card-overlay {
  cursor: grabbing;
  border-color: var(--accent-cyan, #7dd3fc);
  box-shadow: 0 20px 40px -14px #000000a6, 0 0 0 1px var(--accent-cyan, #7dd3fc);
  transition: none;
  transform: rotate(2.5deg)scale(1.03);
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-card-overlay {
    border-color: color-mix(in srgb, var(--accent-cyan, #7dd3fc) 70%, var(--border-subtle));
    box-shadow: 0 20px 40px -14px #000000a6, 0 0 0 1px color-mix(in srgb, var(--accent-cyan, #7dd3fc) 30%, transparent);
  }
}

.bucket-card-overlay:hover {
  transform: rotate(2.5deg)scale(1.03);
}

.bucket-card .bucket-card-title {
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.3;
}

.bucket-card .bucket-card-meta {
  color: var(--text-muted);
  align-items: center;
  gap: 6px;
  font-size: 11px;
  display: flex;
}

.bucket-card .bucket-card-open-hint {
  color: var(--text-muted);
  opacity: 0;
  margin-left: auto;
  font-size: 11px;
  transition: opacity .14s, transform .14s;
  transform: translateX(-3px);
}

.bucket-card:hover .bucket-card-open-hint, .bucket-card:focus-visible .bucket-card-open-hint {
  opacity: .85;
  transform: translateX(0);
}

.bucket-drop-slot {
  border: 1px dashed var(--accent-cyan, #7dd3fc);
  background: var(--accent-cyan, #7dd3fc);
  border-radius: 6px;
  height: 38px;
  margin-top: 2px;
  animation: 1.1s ease-in-out infinite pipeline-drop-slot-pulse;
}

@supports (color: color-mix(in lab, red, red)) {
  .bucket-drop-slot {
    border: 1px dashed color-mix(in srgb, var(--accent-cyan, #7dd3fc) 55%, transparent);
    background: color-mix(in srgb, var(--accent-cyan, #7dd3fc) 8%, transparent);
  }
}

.bucket-drop-slot[data-bucket="0"] {
  background: #d977771a;
  border-color: #d9777799;
}

.bucket-drop-slot[data-bucket="1"] {
  background: #d4a4371a;
  border-color: #d4a43799;
}

.bucket-drop-slot[data-bucket="2"] {
  background: #7dd3fc1a;
  border-color: #7dd3fc99;
}

.bucket-drop-slot[data-bucket="3"] {
  background: #6ee7b71a;
  border-color: #6ee7b799;
}

@keyframes pipeline-drop-slot-pulse {
  0%, 100% {
    opacity: .55;
  }

  50% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bucket-card, .bucket-column, .bucket-card-overlay, .bucket-card .bucket-card-open-hint {
    transition: none;
  }

  .bucket-card:hover {
    transform: none;
  }

  .bucket-drop-slot {
    animation: none;
  }
}

.pipeline-header {
  color: var(--text-secondary);
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  font-family: JetBrains Mono, monospace;
  font-size: 12px;
  display: flex;
}

.pipeline-header .pipeline-total {
  color: var(--text-primary);
  font-weight: 600;
}

.complete-money-modal {
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 14px;
  width: 520px;
  max-width: 95vw;
  overflow: hidden;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 0 !important;
  display: flex !important;
}

.complete-money-modal__header {
  border-bottom: 1px solid var(--border-subtle);
  align-items: baseline;
  gap: 10px;
  padding: 14px 18px;
  display: flex;
}

.complete-money-modal__tag {
  letter-spacing: .12em;
  background: var(--accent-cyan);
  color: var(--accent-cyan);
  text-transform: uppercase;
  border-radius: 999px;
  padding: 2px 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 9.5px;
  font-weight: 700;
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__tag {
    background: color-mix(in srgb, var(--accent-cyan) 18%, transparent);
  }
}

.complete-money-modal__title {
  color: var(--text-primary);
  font-size: 16px;
  font-weight: 700;
}

.complete-money-modal__body {
  padding: 16px 18px 18px;
}

.complete-money-modal__footer {
  border-top: 1px solid var(--border-subtle);
  background: var(--bg-base);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 12px 18px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__footer {
    background: color-mix(in srgb, var(--bg-base) 60%, transparent);
  }
}

.complete-money-modal__hint {
  color: var(--text-muted);
  flex: 1;
  font-size: 11px;
}

.complete-money-modal__task {
  background: var(--bg-surface-2);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 8px 10px;
  display: flex;
}

.complete-money-modal__task-title {
  color: var(--text-primary);
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  font-size: 13px;
  overflow: hidden;
}

.complete-money-modal__toggle-state {
  align-items: center;
  gap: 6px;
  margin-bottom: 12px;
  display: flex;
}

.complete-money-modal__state-btn {
  letter-spacing: .06em;
  background: var(--bg-surface-2);
  border: 1px solid var(--border-subtle);
  color: var(--text-muted);
  cursor: pointer;
  border-radius: 6px;
  padding: 4px 10px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.complete-money-modal__state-btn[data-active="true"] {
  color: var(--accent-cyan);
  border-color: var(--accent-cyan);
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__state-btn[data-active="true"] {
    border-color: color-mix(in srgb, var(--accent-cyan) 50%, transparent);
  }
}

.complete-money-modal__state-btn[data-active="true"][data-flow-target="reject"] {
  color: var(--danger);
  border-color: var(--danger);
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__state-btn[data-active="true"][data-flow-target="reject"] {
    border-color: color-mix(in srgb, var(--danger) 50%, transparent);
  }
}

.complete-money-modal[data-flow="reject"] .compare-block {
  display: none !important;
}

.complete-money-modal[data-flow="reject"] .complete-money-modal__confirm-fields, .complete-money-modal[data-flow="confirm"] .complete-money-modal__reject-fields {
  display: none;
}

.complete-money-modal__dest-radio {
  gap: 8px;
  margin-bottom: 12px;
  display: flex;
}

.complete-money-modal__dest-opt {
  background: var(--bg-surface-2);
  border: 1px solid var(--border-subtle);
  cursor: pointer;
  text-align: left;
  border-radius: 8px;
  flex: 1;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
}

.complete-money-modal__radio-dot {
  border: 1.5px solid var(--text-muted);
  border-radius: 50%;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  margin-top: 1px;
  position: relative;
}

.complete-money-modal__dest-opt[data-checked="true"] {
  border-color: var(--accent-cyan);
  background: var(--accent-cyan);
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__dest-opt[data-checked="true"] {
    background: color-mix(in srgb, var(--accent-cyan) 8%, transparent);
  }
}

.complete-money-modal__dest-opt[data-checked="true"] .complete-money-modal__radio-dot {
  border-color: var(--accent-cyan);
}

.complete-money-modal__dest-opt[data-checked="true"] .complete-money-modal__radio-dot:after {
  content: "";
  background: var(--accent-cyan);
  border-radius: 50%;
  position: absolute;
  inset: 3px;
}

.complete-money-modal__dest-info {
  flex-direction: column;
  gap: 2px;
  display: flex;
}

.complete-money-modal__dest-title {
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 700;
}

.complete-money-modal__dest-opt[data-checked="true"] .complete-money-modal__dest-title {
  color: var(--accent-cyan);
}

.complete-money-modal__dest-sub {
  color: var(--text-muted);
  letter-spacing: .04em;
  font-family: JetBrains Mono, monospace;
  font-size: 9.5px;
}

.complete-money-modal[data-dest="balance"] .complete-money-modal__upcoming-extras, .complete-money-modal[data-dest="upcoming"] .complete-money-modal__balance-preview {
  display: none;
}

.complete-money-modal__grp {
  flex-direction: column;
  gap: 5px;
  margin-bottom: 12px;
  display: flex;
}

.complete-money-modal__lbl-mono {
  letter-spacing: .1em;
  color: var(--text-muted);
  text-transform: uppercase;
  font-family: JetBrains Mono, monospace;
  font-size: 9.5px;
}

.complete-money-modal__fld {
  background: var(--bg-surface-2);
  border: 1px solid var(--border-subtle);
  height: 34px;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  font-family: JetBrains Mono, monospace;
  font-size: 14px;
  display: flex;
}

.complete-money-modal__fld.tall {
  align-items: flex-start;
  height: auto;
  min-height: 56px;
  padding: 8px 10px;
}

.complete-money-modal__fld input, .complete-money-modal__fld select {
  color: inherit;
  font: inherit;
  background: none;
  border: 0;
  outline: 0;
  flex: 1;
  min-width: 0;
}

.complete-money-modal__fld textarea {
  color: inherit;
  resize: vertical;
  background: none;
  border: 0;
  outline: 0;
  width: 100%;
  min-height: 44px;
  font-family: Inter, sans-serif;
  font-size: 13px;
}

.complete-money-modal__fld .cur {
  color: var(--text-muted);
  font-size: 12px;
}

.complete-money-modal__balance-preview {
  background: var(--success);
  border: 1px solid var(--success);
  color: var(--text-secondary);
  letter-spacing: .03em;
  border-radius: 8px;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  padding: 10px 14px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  line-height: 1.5;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__balance-preview {
    background: color-mix(in srgb, var(--success) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--success) 25%, transparent);
  }
}

.complete-money-modal__balance-preview .ico {
  font-size: 18px;
}

.complete-money-modal__balance-preview b {
  color: var(--text-primary);
}

.complete-money-modal__upcoming-extras {
  background: var(--accent-violet);
  border: 1px solid var(--accent-violet);
  border-radius: 8px;
  margin-bottom: 12px;
  padding: 12px 14px;
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__upcoming-extras {
    background: color-mix(in srgb, var(--accent-violet) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-violet) 30%, transparent);
  }
}

.complete-money-modal__upcoming-extras .head {
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  display: flex;
}

.complete-money-modal__upcoming-extras .head .ttl-row {
  color: var(--accent-violet);
  letter-spacing: .06em;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 700;
}

.upcoming-form-grid {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  display: grid;
}

.upcoming-form-grid .complete-money-modal__grp {
  margin-bottom: 0;
}

.upcoming-form-grid .complete-money-modal__fld {
  border-color: var(--accent-violet);
}

@supports (color: color-mix(in lab, red, red)) {
  .upcoming-form-grid .complete-money-modal__fld {
    border-color: color-mix(in srgb, var(--accent-violet) 30%, transparent);
  }
}

.compare-block {
  background: var(--bg-surface-2);
  border: 1px dashed var(--border-subtle);
  border-radius: 10px;
  align-items: stretch;
  gap: 8px;
  margin-bottom: 12px;
  padding: 10px 12px;
  display: flex;
}

.compare-cell {
  flex: 1;
}

.compare-cell .l-mono {
  color: var(--text-muted);
  letter-spacing: .1em;
  text-transform: uppercase;
  font-family: JetBrains Mono, monospace;
  font-size: 9.5px;
}

.compare-cell .num {
  font-variant-numeric: tabular-nums;
  font-family: JetBrains Mono, monospace;
  font-size: 18px;
  font-weight: 700;
}

.compare-cell .num.expected {
  color: var(--accent-cyan);
}

.compare-cell .num.actual, .compare-delta--positive {
  color: var(--success);
}

.compare-delta--negative {
  color: var(--danger);
}

.compare-delta--zero {
  color: var(--text-muted);
}

.reject-seg-control {
  background: var(--bg-surface-2);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  gap: 0;
  padding: 2px;
  display: inline-flex;
}

.reject-seg-btn {
  color: var(--text-muted);
  cursor: pointer;
  letter-spacing: .04em;
  background: none;
  border: 0;
  border-radius: 6px;
  padding: 6px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.reject-seg-btn[data-selected="true"] {
  background: var(--bg-elevated);
  color: var(--accent-cyan);
}

.complete-money-modal__btn {
  border: 1px solid var(--border-subtle);
  background: var(--bg-surface-2);
  height: 36px;
  color: var(--text-primary);
  letter-spacing: .06em;
  cursor: pointer;
  border-radius: 8px;
  padding: 0 14px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 700;
}

.complete-money-modal__btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.complete-money-modal__btn--primary {
  background: var(--success);
  border-color: var(--success);
  color: var(--success);
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__btn--primary {
    background: color-mix(in srgb, var(--success) 18%, transparent);
    border-color: color-mix(in srgb, var(--success) 50%, transparent);
  }
}

.complete-money-modal__btn--primary:hover:not(:disabled) {
  background: var(--success);
}

@supports (color: color-mix(in lab, red, red)) {
  .complete-money-modal__btn--primary:hover:not(:disabled) {
    background: color-mix(in srgb, var(--success) 28%, transparent);
  }
}

.complete-money-modal__btn--ghost {
  background: none;
}

.recurring-fld-grp {
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  display: flex;
}

.recurring-fld-lbl {
  letter-spacing: .1em;
  color: var(--text-muted);
  text-transform: uppercase;
  font-family: JetBrains Mono, monospace;
  font-size: 9.5px;
}

.recurring-fld {
  background: var(--bg-surface-2);
  border: 1px solid var(--border-subtle);
  height: 34px;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  font-family: JetBrains Mono, monospace;
  font-size: 14px;
  transition: border-color .12s;
  display: flex;
}

.recurring-fld:focus-within {
  border-color: var(--accent-cyan);
}

.recurring-fld.tall {
  align-items: flex-start;
  height: auto;
  min-height: 56px;
  padding: 8px 10px;
}

.recurring-fld input, .recurring-fld select {
  color: inherit;
  font: inherit;
  color-scheme: dark;
  background: none;
  border: 0;
  outline: 0;
  flex: 1;
  min-width: 0;
}

.recurring-fld textarea {
  color: inherit;
  resize: vertical;
  background: none;
  border: 0;
  outline: 0;
  width: 100%;
  min-height: 44px;
  font-family: Inter, sans-serif;
  font-size: 13px;
}

.recurring-fld .recurring-fld__icon {
  color: var(--text-muted);
  flex-shrink: 0;
  align-items: center;
  display: inline-flex;
}

.recurring-fld .recurring-fld__suffix {
  color: var(--text-muted);
  flex-shrink: 0;
  font-size: 12px;
}

.notes-app {
  box-sizing: border-box;
  width: calc(100dvw - 104px);
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
  container: app / inline-size;
}

@media (width <= 767px) {
  .notes-app {
    width: calc(100dvw - 48px);
  }
}

.notes-editor-frame {
  min-width: 0;
  container: note / inline-size;
}

.mobile-sidebar-trigger {
  display: none;
}

.notes-app .desktop-sidebar {
  display: block;
}

.notes-app .mobile-sidebar-trigger, .notes-app .mobile-fab {
  display: none;
}

.notes-app .right-rail {
  display: block;
}

@container app (width <= 1279px) {
  .notes-app .right-rail, .notes-app .note-editor-rail-slot {
    display: none;
  }
}

@container app (width <= 1023px) {
  .notes-app .desktop-sidebar {
    display: none;
  }

  .notes-app .mobile-sidebar-trigger {
    display: inline-flex;
  }
}

@container app (width <= 760px) {
  .notes-app .mobile-fab {
    display: flex;
  }

  .notes-app .note-cover-band {
    height: 120px !important;
  }

  .notes-app .note-body {
    max-width: 100% !important;
    padding: 24px 20px 48px !important;
  }

  .notes-app .note-block-handles, .notes-app [data-bn-block-side-menu], .notes-app .bn-side-menu, .notes-app .note-meta-tags-desktop {
    display: none;
  }

  .notes-app .note-meta-tags-mobile-chip {
    display: inline-flex;
  }
}

.notes-app .note-meta-tags-desktop {
  display: inline-flex;
}

.notes-app .note-meta-tags-mobile-chip {
  display: none;
}

@container app (width <= 480px) {
  .notes-app .cover-hover-actions {
    opacity: 1;
    margin-top: 8px;
    position: static;
  }
}

@container note (width <= 600px) {
  .notes-app pre, .notes-app code {
    overflow-x: auto;
  }
}

.notes-sidebar {
  background: var(--bg-surface);
  border-right: 1px solid var(--border-subtle);
  font-family: var(--font-inter), "SF Pro Text", "Segoe UI", system-ui, sans-serif;
  font-feature-settings: "cv11", "ss03", "ss01";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: -.005em;
  flex-direction: column;
  display: flex;
}

.notes-app .notes-sidebar.desktop-sidebar {
  top: 80px;
  left: calc(var(--rail-width, 80px)  + 24px);
  z-index: 30;
  flex-direction: column;
  width: 240px;
  height: calc(100vh - 80px);
  transition: left .22s, transform .22s;
  display: flex;
  position: fixed;
  overflow: hidden;
}

.notes-app .notes-sidebar.desktop-sidebar[data-sidebar-collapsed="true"] {
  transform: translateX(calc(-100% - var(--rail-width, 80px)  - 24px));
  pointer-events: none;
}

.notes-app .notes-sidebar.desktop-sidebar[data-resizing="true"], .notes-app:has(.notes-sidebar[data-resizing="true"]) > .notes-editor-frame, .notes-app:has(.notes-sidebar[data-resizing="true"]) > main:not([data-testid="mobile-sidebar-sheet"]), .notes-app:has(.notes-sidebar[data-resizing="true"]) > [data-testid="note-editor-page"], .notes-app:has(.notes-sidebar[data-resizing="true"]) .notes-sidebar-toggle {
  transition: none;
}

.notes-sidebar-resize-handle {
  cursor: col-resize;
  z-index: 32;
  background: none;
  width: 6px;
  height: 100%;
  transition: background .12s;
  position: absolute;
  top: 0;
  right: -3px;
}

.notes-sidebar-resize-handle:after {
  content: "";
  background: #7dd3fc00;
  border-radius: 2px;
  width: 2px;
  transition: background .12s;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 2px;
}

.notes-sidebar-resize-handle:hover:after, .notes-sidebar.desktop-sidebar[data-resizing="true"] .notes-sidebar-resize-handle:after {
  background: #7dd3fc8c;
}

.notes-sidebar-toggle {
  top: 92px;
  left: calc(var(--rail-width, 80px)  + 24px + var(--notes-sidebar-width, 240px)  - 14px);
  z-index: 31;
  border: 1px solid var(--border-subtle);
  background: var(--bg-surface);
  width: 24px;
  height: 36px;
  color: var(--text-secondary);
  cursor: pointer;
  opacity: 0;
  border-left: 0;
  border-radius: 0 6px 6px 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  transition: left .22s, background .12s, color .12s;
  display: inline-flex;
  position: fixed;
}

.notes-app:hover .notes-sidebar-toggle, .notes-sidebar-toggle[data-sidebar-collapsed="true"], .notes-sidebar-toggle:focus-visible, .notes-sidebar-toggle:hover {
  opacity: 1;
}

.notes-sidebar-toggle:hover {
  background: var(--bg-elevated);
  color: var(--text-primary);
}

.notes-sidebar-toggle[data-sidebar-collapsed="true"] {
  left: calc(var(--rail-width, 80px)  + 8px);
  border-radius: 0 6px 6px 0;
}

.notes-app > .notes-editor-frame, .notes-app > main:not([data-testid="mobile-sidebar-sheet"]), .notes-app > [data-testid="note-editor-page"] {
  margin-left: var(--notes-sidebar-width, 240px);
  transition: margin-left .22s;
}

.notes-app[data-sidebar-collapsed="true"] > .notes-editor-frame, .notes-app[data-sidebar-collapsed="true"] > main:not([data-testid="mobile-sidebar-sheet"]), .notes-app[data-sidebar-collapsed="true"] > [data-testid="note-editor-page"], .notes-app:has(.notes-sidebar[data-sidebar-collapsed="true"]) > .notes-editor-frame, .notes-app:has(.notes-sidebar[data-sidebar-collapsed="true"]) > main:not([data-testid="mobile-sidebar-sheet"]), .notes-app:has(.notes-sidebar[data-sidebar-collapsed="true"]) > [data-testid="note-editor-page"] {
  margin-left: 0;
}

.notes-sidebar-header, .notes-sidebar-footer {
  flex-shrink: 0;
}

.notes-sidebar-scroll {
  scrollbar-width: thin;
  scrollbar-color: #7dd3fc47 transparent;
  flex: 1 1 0;
  min-height: 0;
  overflow: hidden auto;
}

.notes-sidebar-scroll::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.notes-sidebar-scroll::-webkit-scrollbar-track {
  background: none;
}

.notes-sidebar-scroll::-webkit-scrollbar-thumb {
  background: #7dd3fc38 padding-box padding-box;
  border: 2px solid #0000;
  border-radius: 8px;
}

.notes-sidebar-scroll::-webkit-scrollbar-thumb:hover {
  background: #7dd3fc66 padding-box padding-box;
}

.notes-sidebar-header {
  border-bottom: 1px solid var(--border-subtle);
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  display: flex;
}

.notes-sidebar-header__row {
  align-items: center;
  gap: 8px;
  display: flex;
}

.notes-sidebar-header__create {
  cursor: pointer;
  background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
  width: 28px;
  height: 28px;
  color: var(--bg-base);
  border: none;
  border-radius: 6px;
  flex: none;
  justify-content: center;
  align-items: center;
  transition: opacity .12s, box-shadow .22s;
  display: inline-flex;
}

.notes-sidebar-header__create:hover {
  box-shadow: 0 0 12px #7dd3fc6b;
}

.notes-sidebar-header__create:disabled {
  opacity: .4;
  cursor: not-allowed;
  box-shadow: none;
}

.workspace-switcher__trigger {
  border: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  color: var(--text-primary);
  cursor: pointer;
  border-radius: 6px;
  flex: auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 6px 8px;
  font-family: inherit;
  font-size: 14px;
  transition: background .12s, border-color .12s;
  display: inline-flex;
}

.workspace-switcher__trigger:hover {
  background: var(--bg-surface-2, var(--bg-elevated));
  border-color: var(--border-strong, var(--border-subtle));
}

.workspace-switcher__emoji {
  flex: none;
  font-size: 14px;
  line-height: 1;
}

.workspace-switcher__name {
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  flex: auto;
  font-weight: 500;
  overflow: hidden;
}

.workspace-switcher__chevron {
  color: var(--text-muted);
  flex: none;
}

.workspace-switcher__popover {
  background: var(--bg-surface-2, var(--bg-surface));
  border: 1px solid var(--border-strong, var(--border-subtle));
  z-index: 50;
  border-radius: 8px;
  box-shadow: 0 16px 48px #00000080;
}

.workspace-switcher__item, .workspace-switcher__create {
  color: var(--text-primary);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 6px 8px;
  font-family: inherit;
  font-size: 14px;
  display: flex;
}

.workspace-switcher__item:hover, .workspace-switcher__create:hover {
  background: var(--bg-elevated);
}

.workspace-switcher__item.is-active {
  background: var(--bg-elevated);
  box-shadow: inset 2px 0 0 var(--accent-cyan);
}

.workspace-switcher__create {
  color: var(--accent-cyan);
  font-weight: 500;
}

.notes-tree-filter {
  border: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  border-radius: 6px;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  transition: border-color .12s;
  display: flex;
}

.notes-tree-filter:focus-within {
  border-color: var(--accent-cyan);
}

.notes-tree-filter__icon {
  color: var(--text-muted);
  flex: none;
}

.notes-tree-filter__input {
  color: var(--text-primary);
  background: none;
  border: none;
  outline: none;
  flex: auto;
  min-width: 0;
  font-family: inherit;
  font-size: 13px;
}

.notes-tree-filter__input::placeholder {
  color: var(--text-muted);
}

.notes-sidebar-section {
  flex-direction: column;
  padding: 8px 0;
  display: flex;
}

.notes-sidebar-section__header {
  letter-spacing: .01em;
  text-transform: none;
  color: var(--text-muted);
  z-index: 2;
  background: var(--bg-surface);
  margin: 0;
  padding: 8px 12px 6px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 500;
  position: sticky;
  top: 0;
}

.notes-sidebar-section__header--toggle {
  cursor: pointer;
  width: 100%;
  color: inherit;
  text-align: left;
  background: none;
  border: none;
  align-items: center;
  gap: 4px;
  transition: color 80ms;
  display: inline-flex;
}

.notes-sidebar-section__header--toggle:hover {
  color: var(--text-secondary);
}

.notes-sidebar-section__chevron {
  width: 14px;
  height: 14px;
  color: var(--text-muted);
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.notes-sidebar-section__title {
  font: inherit;
  line-height: 1.2;
}

.notes-sidebar-section__list {
  flex-direction: column;
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.notes-sidebar-section__list > li {
  list-style: none;
}

.notes-sidebar-empty {
  font-family: var(--font-mono, monospace);
  color: var(--text-muted);
  margin: 0;
  padding: 8px 16px;
  font-size: 12px;
}

.notes-sidebar__trash-slot {
  border-top: 1px solid var(--border-subtle);
  margin-top: auto;
  padding: 8px 0;
}

.tree-node {
  min-height: 28px;
  color: var(--text-primary);
  cursor: pointer;
  border-radius: 0;
  grid-template-columns: 16px 1fr auto auto;
  align-items: center;
  gap: 8px;
  padding: 4px 12px 4px 0;
  font-family: inherit;
  text-decoration: none;
  transition: background 80ms;
  display: grid;
  position: relative;
}

.tree-node:hover {
  background: #7dd3fc0a;
}

.tree-node.is-active {
  background: var(--bg-elevated);
  box-shadow: inset 2px 0 0 var(--accent-cyan);
}

.tree-node--trash {
  opacity: .6;
  font-family: var(--font-mono, monospace);
  color: var(--text-muted);
  border-radius: 6px;
  margin: 0 8px;
  font-size: 12px;
}

.tree-node--trash:hover {
  opacity: 1;
  background: #f871710f;
}

.tree-node__icon {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: inline-flex;
  position: relative;
}

.tree-node__icon-emoji {
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  font-size: 14px;
  line-height: 1;
  transition: opacity .1s;
  display: inline-flex;
}

.tree-node__icon-chevron {
  width: 16px;
  height: 16px;
  color: var(--text-secondary);
  cursor: pointer;
  opacity: 0;
  background: none;
  border: none;
  border-radius: 3px;
  justify-content: center;
  align-items: center;
  padding: 0;
  transition: opacity .1s, transform .12s, background .12s;
  display: inline-flex;
  position: absolute;
  inset: 0;
}

.tree-node__icon-chevron.is-expanded {
  transform: rotate(90deg);
}

.tree-node:hover .tree-node__icon-emoji, .tree-node[data-expanded="true"] .tree-node__icon-emoji {
  opacity: 0;
}

.tree-node:hover .tree-node__icon-chevron, .tree-node[data-expanded="true"] .tree-node__icon-chevron {
  opacity: 1;
}

.tree-node__icon-chevron:hover {
  background: var(--bg-elevated);
  color: var(--text-primary);
}

.tree-node__label {
  color: inherit;
  white-space: nowrap;
  text-overflow: ellipsis;
  min-width: 0;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 450;
  line-height: 1.4;
  text-decoration: none;
  overflow: hidden;
}

.tree-node__label:hover {
  color: var(--text-primary);
}

.tree-node__count {
  font-family: var(--font-mono, monospace);
  color: var(--text-muted);
  padding: 0 4px;
  font-size: 12px;
}

.tree-node__count--placeholder {
  width: 12px;
  padding: 0;
}

.tree-node__mark {
  color: var(--text-primary);
  background: #7dd3fc3d;
  border-radius: 2px;
  padding: 0 2px;
}

.tree-node__actions {
  opacity: 0;
  align-items: center;
  gap: 2px;
  transition: opacity .12s;
  display: inline-flex;
}

.tree-node:hover .tree-node__actions {
  opacity: 1;
}

.tree-node__action {
  width: 20px;
  height: 20px;
  color: var(--text-muted);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 3px;
  justify-content: center;
  align-items: center;
  padding: 0;
  transition: background 80ms, color 80ms;
  display: inline-flex;
}

.tree-node__action:hover {
  background: var(--bg-elevated);
  color: var(--text-primary);
}

.tree-node__trash-icon {
  color: var(--text-muted);
}

.tree-node--trash:hover .tree-node__trash-icon {
  color: var(--danger);
}

.note-properties {
  grid-template-columns: 16px 110px minmax(160px, auto);
  gap: 2px 12px;
  margin: 8px 0 0;
  padding: 4px 0;
  display: inline-grid;
}

.note-properties__row {
  display: contents;
}

.note-properties__icon {
  justify-content: center;
  align-self: center;
  align-items: center;
  min-height: 32px;
  display: inline-flex;
}

.note-properties__label {
  text-align: left;
  align-self: center;
  align-items: center;
  min-height: 32px;
  display: inline-flex;
}

.note-properties__cell {
  flex-wrap: wrap;
  align-self: center;
  align-items: center;
  gap: 4px;
  min-height: 32px;
  display: inline-flex;
}

.note-properties__icon {
  color: #e2e8f080;
  text-align: center;
  user-select: none;
  font-size: 14px;
}

.note-properties__label {
  font-family: var(--font-sans);
  color: #e2e8f080;
  font-size: 14px;
  font-weight: 400;
}

.note-properties__cell {
  font-family: var(--font-sans);
  color: #e2e8f080;
  min-width: 0;
  font-size: 14px;
}

.note-properties__value {
  color: #e2e8f080;
}

.note-backlinks-inline {
  border-top: 1px solid var(--border-subtle);
  margin-top: 48px;
  padding-top: 24px;
}

.note-backlinks-inline__header {
  font-family: var(--font-sans);
  color: #e2e8f0b3;
  text-transform: none;
  letter-spacing: 0;
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 600;
}

.notes-sidebar-footer {
  border-top: 1px solid var(--border-subtle);
  flex-direction: column;
  gap: 1px;
  margin-top: auto;
  padding: 8px 0;
  display: flex;
}

.notes-sidebar-footer__item {
  font-family: var(--font-sans);
  color: #e2e8f099;
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 4px;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 6px 12px;
  font-size: 14px;
  text-decoration: none;
  transition: background 80ms, color 80ms;
  display: flex;
}

.notes-sidebar-footer__item:hover {
  color: var(--text-primary);
  background: #ffffff0d;
}

.notes-sidebar-footer__item-icon {
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  display: inline-flex;
}

.gym-session-mobile {
  background: var(--bg, #1a1b26);
  min-height: 100vh;
  color: var(--text-primary, #c0caf5);
  flex-direction: column;
  display: flex;
}

.gym-session-mobile__top-bar {
  z-index: 25;
  background: var(--bg-elevated, #1f2335);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border, #7dd3fc1f);
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  height: 72px;
  padding: 8px 16px 8px 80px;
  display: grid;
  position: sticky;
  top: 0;
}

.gym-session-mobile__top-bar-center {
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.gym-session-mobile__routine-name {
  font-family: var(--font-sans, Inter, ui-sans-serif, system-ui);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  overflow: hidden;
}

.gym-session-mobile__top-bar-meta {
  font-family: var(--font-mono, ui-monospace, "JetBrains Mono", monospace);
  color: var(--text-secondary, #a9b1d6);
  font-size: 12px;
  font-weight: 400;
}

.gym-session-mobile__top-bar-actions {
  gap: 4px;
  display: flex;
}

.gym-session-mobile__icon-btn {
  width: 44px;
  height: 44px;
  color: var(--text-primary, #c0caf5);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.gym-session-mobile__icon-btn:hover:not(:disabled) {
  background: var(--bg-hover, #7dd3fc14);
}

.gym-session-mobile__icon-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.gym-session-mobile__progress-bar {
  background: var(--accent-cyan, #7dd3fc);
  height: 4px;
  transition: width .28s cubic-bezier(.32, .72, 0, 1);
  position: absolute;
  bottom: 0;
  left: 0;
}

.gym-session-mobile__rest-badge {
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  padding: 0;
  display: inline-flex;
  position: absolute;
  top: 12px;
  left: 12px;
}

.gym-session-mobile__rest-badge-ring {
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  display: inline-flex;
}

.gym-session-mobile__rest-badge-face {
  background: var(--bg-elevated, #1f2335);
  width: 48px;
  height: 48px;
  color: var(--text-primary, #c0caf5);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.gym-session-mobile__rest-badge-text {
  font-family: var(--font-mono, ui-monospace, "JetBrains Mono", monospace);
  font-size: 18px;
  font-weight: 700;
}

.gym-session-mobile__rest-badge--paused {
  opacity: .6;
}

@keyframes gym-session-mobile__rest-complete-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 var(--accent-cyan, #7dd3fc);
  }

  50% {
    box-shadow: 0 0 0 8px var(--accent-pink, #f472b6);
  }
}

.gym-session-mobile__rest-badge--complete .gym-session-mobile__rest-badge-ring {
  animation: .22s ease-in-out infinite gym-session-mobile__rest-complete-pulse;
}

@media (prefers-reduced-motion: reduce) {
  .gym-session-mobile__rest-badge--complete .gym-session-mobile__rest-badge-ring {
    animation: none;
  }
}

.gym-session-mobile__paused-banner {
  z-index: 30;
  background: var(--bg-elevated, #1f2335);
  color: var(--accent-cyan, #7dd3fc);
  border: 1px solid #7dd3fc4d;
  border-radius: 9999px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  position: fixed;
  top: 84px;
  left: 50%;
  transform: translateX(-50%);
}

.gym-session-mobile__body {
  flex-direction: column;
  flex: 1;
  gap: 12px;
  padding: 16px;
  display: flex;
  overflow-y: auto;
}

.gym-session-mobile__body--paused {
  opacity: .6;
  pointer-events: none;
}

.gym-session-mobile__empty {
  text-align: center;
  color: var(--text-secondary, #a9b1d6);
  padding: 32px;
}

.gym-session-mobile__notif-prompt {
  background: #7dd3fc1a;
  border-bottom: 1px solid #7dd3fc4d;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  display: flex;
}

.gym-session-mobile__notif-prompt-text {
  flex: 1;
  font-size: 14px;
}

.gym-session-mobile__notif-prompt-actions {
  gap: 4px;
  display: flex;
}

.gym-session-mobile__inter-card {
  background: #7dd3fc1a;
  border: 1px solid #7dd3fc33;
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  font-size: 13px;
  display: flex;
}

.gym-session-mobile__inter-card-check {
  color: var(--success, #4ade80);
  font-weight: 700;
}

.gym-session-mobile__inter-card-meta {
  color: var(--text-secondary, #a9b1d6);
}

.gym-session-mobile__exercise-card {
  background: var(--bg-elevated, #1f2335);
  border: 1px solid var(--border, #7dd3fc1f);
  border-radius: 12px;
  padding: 16px;
}

.gym-session-mobile__exercise-card--done {
  opacity: .7;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  display: flex;
}

.gym-session-mobile__exercise-done-check {
  color: var(--success, #4ade80);
  font-size: 16px;
  font-weight: 700;
}

.gym-session-mobile__exercise-card--peeked {
  opacity: .6;
  padding: 12px 16px;
}

.gym-session-mobile__exercise-card--active {
  border-color: var(--accent-cyan, #7dd3fc);
  flex-direction: column;
  gap: 12px;
  display: flex;
  box-shadow: 0 0 0 1px #7dd3fc33;
}

.gym-session-mobile__exercise-header {
  align-items: center;
  gap: 8px;
  display: flex;
}

.gym-session-mobile__exercise-muscle {
  font-size: 14px;
  line-height: 1;
}

.gym-session-mobile__exercise-name {
  font-family: var(--font-sans, Inter, ui-sans-serif, system-ui);
  flex: 1;
  font-size: 16px;
  font-weight: 700;
}

.gym-session-mobile__exercise-meta, .gym-session-mobile__exercise-rest {
  font-family: var(--font-mono, ui-monospace, "JetBrains Mono", monospace);
  color: var(--text-secondary, #a9b1d6);
  font-size: 12px;
}

.gym-session-mobile__set-rows {
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.gym-session-mobile__set-row {
  grid-template-columns: 44px 72px minmax(88px, 1fr) 72px 44px;
  align-items: center;
  gap: 8px;
  display: grid;
}

.gym-session-mobile__set-badge {
  cursor: pointer;
  border: 1px solid #0000;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
}

.gym-session-mobile__set-badge:disabled {
  cursor: default;
  opacity: .7;
}

.gym-session-mobile__set-badge--normal {
  color: var(--accent-cyan, #7dd3fc);
  background: #7dd3fc4d;
}

.gym-session-mobile__set-badge--warm {
  color: var(--warning, #fbbf24);
  background: #fbbf244d;
}

.gym-session-mobile__set-badge--drop {
  color: var(--accent-pink, #f472b6);
  background: #f472b64d;
}

.gym-session-mobile__set-badge--fail {
  color: var(--danger, #f87171);
  background: #f871714d;
}

.gym-session-mobile__set-prev {
  font-family: var(--font-mono, ui-monospace, "JetBrains Mono", monospace);
  color: var(--text-secondary, #a9b1d6);
  font-size: 12px;
}

.gym-session-mobile__set-weight, .gym-session-mobile__set-reps {
  min-height: 44px;
}

.gym-session-mobile__set-check {
  border: 2px solid var(--border, #7dd3fc33);
  width: 44px;
  height: 44px;
  color: var(--text-primary, #c0caf5);
  cursor: pointer;
  background: none;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  display: inline-flex;
}

.gym-session-mobile__set-check:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.gym-session-mobile__set-check--committed {
  border-color: var(--success, #4ade80);
  color: var(--success, #4ade80);
  background: #4ade8033;
}

.gym-session-mobile__set-type-popover {
  width: 280px;
  padding: 4px;
}

.gym-session-mobile__set-type-list {
  flex-direction: column;
  display: flex;
}

.gym-session-mobile__set-type-item {
  text-align: left;
  cursor: pointer;
  color: var(--text-primary, #c0caf5);
  background: none;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  display: flex;
}

.gym-session-mobile__set-type-item:hover:not(:disabled) {
  background: var(--bg-hover, #7dd3fc14);
}

.gym-session-mobile__set-type-badge {
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
}

.gym-session-mobile__set-type-text {
  flex-direction: column;
  flex: 1;
  gap: 2px;
  display: flex;
}

.gym-session-mobile__set-type-label {
  font-size: 14px;
  font-weight: 500;
}

.gym-session-mobile__set-type-desc {
  color: var(--text-secondary, #a9b1d6);
  font-size: 12px;
}

.gym-session-mobile__set-type-check {
  color: var(--accent-cyan, #7dd3fc);
}

.gym-session-mobile__chip-bar {
  flex-wrap: wrap;
  gap: 8px;
  display: flex;
}

.gym-session-mobile__chip {
  font-family: var(--font-mono, ui-monospace, "JetBrains Mono", monospace);
  border: 1px solid var(--border, #7dd3fc33);
  color: var(--text-primary, #c0caf5);
  cursor: pointer;
  background: none;
  border-radius: 9999px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 500;
}

.gym-session-mobile__chip:hover:not(:disabled) {
  background: var(--bg-hover, #7dd3fc14);
}

.gym-session-mobile__chip--dashed {
  border-style: dashed;
}

.gym-session-mobile__chip--disabled, .gym-session-mobile__chip:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.gym-session-mobile__ad-hoc-sheet {
  flex-direction: column;
  height: 80vh;
  padding: 0;
  display: flex;
}

.gym-session-mobile__ad-hoc-command {
  flex-direction: column;
  flex: 1;
  display: flex;
}

.gym-session-mobile__ad-hoc-loading {
  color: var(--text-secondary, #a9b1d6);
  text-align: center;
  padding: 16px;
}

.gym-session-mobile__ad-hoc-item {
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  display: flex;
}

.gym-session-mobile__ad-hoc-item-name {
  flex: 1;
}

.gym-session-mobile__muscle-pill {
  text-transform: lowercase;
  border-radius: 9999px;
  align-items: center;
  padding: 2px 8px;
  font-size: 11px;
  font-weight: 500;
  display: inline-flex;
}

.gym-session-mobile__rest-sheet {
  padding: 32px;
}

.gym-session-mobile__rest-sheet-body {
  flex-direction: column;
  align-items: center;
  gap: 24px;
  display: flex;
}

.gym-session-mobile__rest-sheet-countdown {
  font-family: var(--font-mono, ui-monospace, "JetBrains Mono", monospace);
  color: var(--accent-cyan, #7dd3fc);
  font-size: 64px;
  font-weight: 700;
}

.gym-session-mobile__rest-sheet-status {
  color: var(--text-secondary, #a9b1d6);
  font-size: 14px;
}

.gym-session-mobile__rest-sheet-controls {
  gap: 16px;
  display: flex;
}

.gym-session-mobile__rest-sheet-skip {
  margin-top: 16px;
}

.gym-session-mobile__finish-sticky {
  z-index: 20;
  background: linear-gradient(135deg, var(--accent-cyan, #7dd3fc), var(--accent-violet, #a78bfa));
  width: 100%;
  height: 72px;
  color: var(--bg, #1a1b26);
  cursor: pointer;
  text-transform: uppercase;
  border: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 8px 16px;
  display: flex;
  position: sticky;
  bottom: 0;
}

.gym-session-mobile__finish-sticky:disabled {
  opacity: .6;
  cursor: not-allowed;
}

.gym-session-mobile__finish-label {
  font-family: var(--font-sans, Inter, ui-sans-serif, system-ui);
  letter-spacing: .05em;
  font-size: 14px;
  font-weight: 700;
}

.gym-session-mobile__finish-meta {
  font-family: var(--font-mono, ui-monospace, "JetBrains Mono", monospace);
  opacity: .85;
  font-size: 12px;
  font-weight: 400;
}

.sr-only {
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.gym-session-desktop {
  background: var(--bg, #1a1b26);
  min-height: 100vh;
  color: var(--text-primary, #c0caf5);
  display: flex;
  position: relative;
}

.gym-session-desktop__routine-pane {
  border-right: 1px solid var(--border, #7dd3fc1f);
  background: var(--bg-elevated, #1f2335);
  flex-direction: column;
  flex-shrink: 0;
  width: 320px;
  height: 100vh;
  display: flex;
  position: sticky;
  top: 0;
  overflow: hidden;
}

.gym-session-desktop__routine-pane-header {
  border-bottom: 1px solid var(--border-subtle, #7dd3fc0f);
  flex-direction: column;
  gap: 4px;
  padding: 16px 20px 12px;
  display: flex;
}

.gym-session-desktop__routine-pane-title {
  font-family: var(--font-sans, Inter);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted, #64748b);
  font-size: 14px;
  font-weight: 700;
}

.gym-session-desktop__routine-pane-name {
  font-family: var(--font-sans, Inter);
  color: var(--text-primary, #c0caf5);
  font-size: 18px;
  font-weight: 700;
}

.gym-session-desktop__routine-pane-list {
  flex: 1;
  margin: 0;
  padding: 8px 0;
  list-style: none;
  overflow-y: auto;
}

.gym-session-desktop__routine-pane-item {
  cursor: default;
  border-left: 2px solid #0000;
  grid-template-columns: 24px 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  transition: background .18s cubic-bezier(.32, .72, 0, 1);
  display: grid;
}

.gym-session-desktop__routine-pane-item[data-active="true"] {
  border-left-color: var(--accent-cyan, #7dd3fc);
  background: #7dd3fc14;
}

.gym-session-desktop__routine-pane-item[data-status="done"] {
  color: var(--text-secondary, #94a3b8);
}

.gym-session-desktop__routine-pane-item[data-status="upcoming"] {
  opacity: .6;
}

.gym-session-desktop__routine-pane-item-status {
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  display: inline-flex;
}

.gym-session-desktop__routine-pane-item-status[data-status="done"] {
  color: var(--success, #4ade80);
}

.gym-session-desktop__routine-pane-item-status[data-status="ad-hoc"] {
  color: var(--accent-pink, #f472b6);
}

.gym-session-desktop__routine-pane-item-name {
  font-family: var(--font-sans, Inter);
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-size: 14px;
  font-weight: 500;
  overflow: hidden;
}

.gym-session-desktop__routine-pane-item-count {
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-muted, #64748b);
  font-variant-numeric: tabular-nums;
  font-size: 11px;
  font-weight: 700;
}

.gym-session-desktop__routine-pane-footer {
  border-top: 1px solid var(--border-subtle, #7dd3fc0f);
  flex-direction: column;
  gap: 8px;
  padding: 12px 16px;
  display: flex;
}

.gym-session-desktop__routine-pane-footer button {
  height: 36px;
  color: var(--text-secondary, #94a3b8);
  font-family: var(--font-sans, Inter);
  border: 1px solid var(--border-subtle, #7dd3fc1f);
  cursor: pointer;
  background: none;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 600;
  transition: background .18s;
  display: flex;
}

.gym-session-desktop__routine-pane-footer button:hover:not(:disabled) {
  color: var(--accent-cyan, #7dd3fc);
  background: #7dd3fc0f;
}

.gym-session-desktop__routine-pane-footer button[data-variant="danger"]:hover:not(:disabled) {
  color: var(--danger, #f87171);
  border-color: #f871714d;
}

.gym-session-desktop__routine-pane-footer button:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.gym-session-desktop__paused-banner {
  z-index: 30;
  color: var(--danger, #f87171);
  font-family: var(--font-sans, Inter);
  text-align: center;
  background: #f871711f;
  border-bottom: 1px solid #f871714d;
  border-radius: 0 0 8px 8px;
  margin: 0 32px;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 700;
  position: sticky;
  top: 0;
}

.gym-session-desktop__detail-pane {
  flex: 1;
  grid-template-columns: 1fr 1fr;
  align-content: start;
  gap: 24px;
  padding: 32px;
  display: grid;
  overflow-y: auto;
}

.gym-session-desktop__detail-pane[data-paused="true"] {
  opacity: .6;
  pointer-events: none;
}

.gym-session-desktop__detail-col {
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  display: flex;
}

.gym-session-desktop__detail-header {
  flex-direction: column;
  grid-column: 1 / -1;
  gap: 4px;
  display: flex;
}

.gym-session-desktop__detail-exercise-name {
  font-family: var(--font-sans, Inter);
  color: var(--text-primary, #c0caf5);
  font-size: 24px;
  font-weight: 700;
}

.gym-session-desktop__detail-exercise-meta {
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-muted, #64748b);
  font-size: 12px;
  font-weight: 400;
}

@media (width <= 1023px) {
  .gym-session-desktop__detail-pane {
    grid-template-columns: 1fr;
  }
}

.gym-session-desktop__big-weight {
  background: var(--bg-surface, #161a35);
  border-radius: 12px;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  display: flex;
}

.gym-session-desktop__big-weight-label {
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-muted, #64748b);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 12px;
  font-weight: 700;
}

.gym-session-desktop__big-weight-row {
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  gap: 8px;
  height: 64px;
  display: grid;
}

.gym-session-desktop__big-weight-btn {
  width: 44px;
  height: 44px;
  color: var(--text-secondary, #94a3b8);
  border: 1px solid var(--border-subtle, #7dd3fc1a);
  cursor: pointer;
  background: none;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  transition: background .18s;
  display: flex;
}

.gym-session-desktop__big-weight-btn:hover:not(:disabled) {
  background: var(--bg-elevated, #252a4d);
  color: var(--accent-cyan, #7dd3fc);
}

.gym-session-desktop__big-weight-btn:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.gym-session-desktop__big-weight-field {
  font-family: var(--font-mono, ui-monospace);
  color: var(--accent-cyan, #7dd3fc);
  text-align: right;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
  background: none;
  border: none;
  outline: none;
  width: 100%;
  padding: 0;
  font-size: 56px;
  font-weight: 700;
  line-height: 1;
}

.gym-session-desktop__big-weight-field::-webkit-outer-spin-button, .gym-session-desktop__big-weight-field::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.gym-session-desktop__big-weight-step-meta {
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-muted, #64748b);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 400;
}

.gym-session-desktop__reps-grid {
  grid-template-columns: repeat(12, 1fr);
  gap: 4px;
  height: 44px;
  display: grid;
}

.gym-session-desktop__reps-cell {
  background: var(--bg-elevated, #252a4d);
  color: var(--text-secondary, #94a3b8);
  font-family: var(--font-mono, ui-monospace);
  cursor: pointer;
  border: 1px solid #0000;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 700;
  transition: background .18s cubic-bezier(.32, .72, 0, 1), color .18s, transform .18s;
}

.gym-session-desktop__reps-cell:hover {
  color: var(--accent-cyan, #7dd3fc);
  background: #7dd3fc2e;
}

.gym-session-desktop__reps-cell[data-current="true"] {
  background: linear-gradient(135deg, var(--accent-cyan, #7dd3fc) 0%, var(--accent-violet, #a78bfa) 100%);
  color: var(--bg, #1a1b26);
  font-weight: 700;
}

.gym-session-desktop__reps-cell[data-target="true"] {
  border-style: dashed;
  border-color: var(--accent-cyan, #7dd3fc);
}

.gym-session-desktop__log-btn {
  background: linear-gradient(135deg, var(--accent-pink, #f472b6) 0%, var(--accent-violet, #a78bfa) 100%);
  width: 100%;
  height: 56px;
  color: var(--bg, #1a1b26);
  font-family: var(--font-sans, Inter);
  text-transform: uppercase;
  letter-spacing: .08em;
  cursor: pointer;
  border: none;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 700;
  transition: transform .18s cubic-bezier(.32, .72, 0, 1);
  display: flex;
}

.gym-session-desktop__log-btn:hover:not(:disabled) {
  transform: translateY(-1px);
}

.gym-session-desktop__log-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.gym-session-desktop__log-btn-label {
  text-align: left;
  font-variant-numeric: tabular-nums;
  flex: 1;
}

.gym-session-desktop__log-btn-kbd {
  font-family: var(--font-mono, ui-monospace);
  opacity: .6;
  border: 1px solid;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 12px;
  font-weight: 700;
}

.gym-session-desktop__sets-row {
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  height: 60px;
  display: grid;
}

.gym-session-desktop__sets-row-cell {
  background: var(--bg-elevated, #252a4d);
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-secondary, #94a3b8);
  text-transform: uppercase;
  letter-spacing: .04em;
  border-radius: 8px;
  flex-direction: column;
  gap: 2px;
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 700;
  display: flex;
}

.gym-session-desktop__sets-row-cell[data-state="done"] {
  color: var(--success, #4ade80);
}

.gym-session-desktop__sets-row-cell[data-state="now"] {
  box-shadow: 0 0 0 2px var(--accent-cyan, #7dd3fc), 0 0 16px #7dd3fc4d;
  color: var(--accent-cyan, #7dd3fc);
}

.gym-session-desktop__sets-row-cell[data-state="next"] {
  border: 1px dashed var(--border, #7dd3fc2e);
  background: none;
}

.gym-session-desktop__sets-row-cell[data-state="warm"] {
  color: var(--warning, #fbbf24);
}

.gym-session-desktop__sets-row-meta {
  color: var(--text-muted, #64748b);
  text-transform: none;
  letter-spacing: 0;
  font-size: 10px;
  font-weight: 400;
}

.gym-session-desktop__coach-card {
  background: var(--bg-elevated, #252a4d);
  border-radius: 12px;
  flex-direction: column;
  gap: 8px;
  padding: 16px 20px;
  animation: .22s cubic-bezier(.32, .72, 0, 1) coach-card-in;
  display: flex;
}

@keyframes coach-card-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.gym-session-desktop__coach-card-header {
  align-items: center;
  gap: 8px;
  display: flex;
}

.gym-session-desktop__coach-card-label {
  font-family: var(--font-sans, Inter);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 14px;
  font-weight: 700;
}

.gym-session-desktop__coach-card-reasoning {
  font-family: var(--font-sans, Inter);
  color: var(--text-secondary, #94a3b8);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
}

.gym-session-desktop__e1rm-label {
  align-items: baseline;
  gap: 8px;
  display: inline-flex;
}

.gym-session-desktop__e1rm-label-value {
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-primary, #c0caf5);
  font-variant-numeric: tabular-nums;
  font-size: 14px;
  font-weight: 700;
}

.gym-session-desktop__e1rm-label-meta {
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-muted, #64748b);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 11px;
  font-weight: 400;
}

.gym-session-desktop__pr-badge {
  background: linear-gradient(90deg, var(--accent-pink, #f472b6) 0%, var(--accent-cyan, #7dd3fc) 100%);
  color: var(--bg, #1a1b26);
  font-family: var(--font-mono, ui-monospace);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-variant-numeric: tabular-nums;
  border-radius: 9999px;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
}

.gym-session-desktop__pr-badge--mini {
  padding: 2px 6px;
  font-size: 10px;
}

.gym-session-desktop__progression {
  background: var(--bg-surface, #161a35);
  border-radius: 12px;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  display: flex;
}

.gym-session-desktop__progression-header {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  display: flex;
}

.gym-session-desktop__progression-title {
  font-family: var(--font-sans, Inter);
  color: var(--text-primary, #c0caf5);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 14px;
  font-weight: 700;
}

.gym-session-desktop__progression-chart {
  width: 100%;
  height: 80px;
}

.gym-session-desktop__delta {
  font-family: var(--font-mono, ui-monospace);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 700;
}

.gym-session-desktop__delta--up {
  color: var(--accent-cyan, #7dd3fc);
}

.gym-session-desktop__delta--down {
  color: var(--warning, #fbbf24);
}

.gym-session-desktop__delta--neutral {
  color: var(--text-muted, #64748b);
}

.gym-session-desktop__history-table {
  width: 100%;
  font-family: var(--font-mono, ui-monospace);
  font-variant-numeric: tabular-nums;
  border-collapse: collapse;
  font-size: 12px;
}

.gym-session-desktop__history-table th {
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-muted, #64748b);
  text-align: left;
  border-bottom: 1px solid var(--border-subtle, #7dd3fc14);
  padding: 8px 12px;
  font-size: 10px;
  font-weight: 700;
}

.gym-session-desktop__history-table td {
  border-bottom: 1px solid var(--border-subtle, #7dd3fc0a);
  color: var(--text-primary, #c0caf5);
  padding: 8px 12px;
}

.gym-session-desktop__history-table tr[data-today="true"] td {
  background: #7dd3fc0f;
}

.gym-session-desktop__history-table tr[data-today="true"] td:first-child {
  border-left: 2px solid var(--accent-cyan, #7dd3fc);
}

.gym-session-desktop__history-pr-medal {
  color: var(--accent-pink, #f472b6);
}

.gym-session-desktop__heatmap {
  background: var(--bg-surface, #161a35);
  border-radius: 12px;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  display: flex;
}

.gym-session-desktop__heatmap-header {
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  display: flex;
}

.gym-session-desktop__heatmap-title {
  font-family: var(--font-sans, Inter);
  color: var(--text-primary, #c0caf5);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 14px;
  font-weight: 700;
}

.gym-session-desktop__heatmap-legend {
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-muted, #64748b);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 400;
}

.gym-session-desktop__heatmap-grid {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.gym-session-desktop__heatmap-row {
  grid-template-columns: repeat(13, 1fr);
  gap: 4px;
  display: grid;
}

.gym-session-desktop__heatmap-cell {
  aspect-ratio: 1;
  border-radius: 2px;
  min-height: 14px;
  transition: transform .22s cubic-bezier(.32, .72, 0, 1);
}

.gym-session-desktop__heatmap-cell:hover {
  transform: scale(1.15);
}

.gym-session-desktop__rest-widget {
  z-index: 25;
  background: var(--bg-surface, #161a35);
  border: 1px solid var(--border, #7dd3fc1f);
  border-radius: 9999px;
  align-items: center;
  gap: 0;
  padding: 4px;
  transition: bottom .22s cubic-bezier(.32, .72, 0, 1), border-radius .22s cubic-bezier(.32, .72, 0, 1), padding .22s cubic-bezier(.32, .72, 0, 1);
  display: flex;
  position: fixed;
  right: 24px;
}

.gym-session-desktop__rest-widget[data-expanded="true"] {
  border-radius: 30px;
  gap: 12px;
  padding: 4px 16px 4px 4px;
}

.gym-session-desktop__rest-ring {
  border-radius: 9999px;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 60px;
  display: flex;
}

.gym-session-desktop__rest-core {
  background: var(--bg, #1a1b26);
  width: 52px;
  height: 52px;
  font-family: var(--font-mono, ui-monospace);
  color: var(--accent-cyan, #7dd3fc);
  font-variant-numeric: tabular-nums;
  border-radius: 9999px;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  font-weight: 700;
  display: flex;
}

.gym-session-desktop__rest-widget[data-state="paused"] {
  opacity: .6;
}

.gym-session-desktop__rest-widget[data-state="complete"] .gym-session-desktop__rest-ring {
  animation: .22s cubic-bezier(.32, .72, 0, 1) infinite alternate rest-complete-pulse;
}

@keyframes rest-complete-pulse {
  from {
    box-shadow: 0 0 #7dd3fc00;
  }

  to {
    box-shadow: 0 0 0 8px #f472b680;
  }
}

.gym-session-desktop__rest-panel {
  flex-direction: column;
  gap: 4px;
  width: 200px;
  display: flex;
}

.gym-session-desktop__rest-panel-meta {
  font-family: var(--font-mono, ui-monospace);
  color: var(--text-secondary, #94a3b8);
  font-size: 11px;
  font-weight: 400;
}

.gym-session-desktop__rest-panel-controls {
  gap: 6px;
  display: flex;
}

.gym-session-desktop__rest-panel-controls button {
  background: var(--bg-elevated, #252a4d);
  color: var(--text-primary, #c0caf5);
  font-family: var(--font-mono, ui-monospace);
  cursor: pointer;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: 2px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 700;
  transition: background .18s;
  display: flex;
}

.gym-session-desktop__rest-panel-controls button:hover:not(:disabled) {
  color: var(--accent-cyan, #7dd3fc);
  background: #7dd3fc26;
}

.gym-session-desktop__rest-panel-controls button:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.gym-session-desktop__notif-prompt {
  background: var(--bg-elevated, #252a4d);
  border-left: 3px solid var(--accent-cyan, #7dd3fc);
  border-radius: 8px;
  grid-column: 1 / -1;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 12px 16px;
  display: flex;
}

.gym-session-desktop__notif-prompt-text {
  font-family: var(--font-sans, Inter);
  color: var(--text-primary, #c0caf5);
  font-size: 13px;
}

.gym-session-desktop__notif-prompt-actions {
  gap: 8px;
  display: flex;
}

.gym-session-desktop__pr-row {
  flex-wrap: wrap;
  grid-column: 1 / -1;
  gap: 8px;
  display: flex;
}

.gym-session-desktop__adhoc-sheet {
  flex-direction: column;
  gap: 12px;
  display: flex;
}

.gym-session-desktop__adhoc-loading, .gym-session-desktop__adhoc-empty {
  text-align: center;
  color: var(--text-muted, #64748b);
  font-family: var(--font-mono, ui-monospace);
  padding: 16px;
  font-size: 12px;
}

.gym-session-desktop__adhoc-item {
  align-items: center;
  gap: 12px;
  display: flex;
}

.gym-session-desktop__adhoc-muscle-pill {
  font-family: var(--font-mono, ui-monospace);
  text-transform: uppercase;
  letter-spacing: .04em;
  border-radius: 9999px;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 700;
  display: inline-flex;
}

.settings-subpane {
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  margin-bottom: 24px;
  padding: 8px 24px 20px;
  position: relative;
  box-shadow: 0 1px #0003;
}

.settings-subpane:before {
  content: "";
  -webkit-mask-composite: xor;
  pointer-events: none;
  background: linear-gradient(#7dd3fc1a, #0000 40%);
  border-radius: 14px;
  padding: 1px;
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
  -webkit-mask-position: 0 0, 0 0;
  -webkit-mask-size: auto, auto;
  -webkit-mask-repeat: repeat, repeat;
  -webkit-mask-clip: content-box, border-box;
  -webkit-mask-origin: content-box, border-box;
  mask-composite: exclude;
  mask-mode: match-source, match-source;
}

.settings-subpane-header {
  border-bottom: 1px solid var(--border-subtle);
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 8px;
  padding: 16px 0 14px;
  display: flex;
}

.settings-subpane-icon {
  width: 36px;
  height: 36px;
  color: var(--accent-cyan, #7dd3fc);
  background: linear-gradient(135deg, #7dd3fc2e, #a78bfa1f);
  border-radius: 10px;
  flex-shrink: 0;
  place-items: center;
  display: grid;
  box-shadow: inset 0 0 0 1px #7dd3fc47, 0 0 14px -4px #7dd3fc59;
}

.settings-subpane-icon svg {
  filter: drop-shadow(0 0 4px #7dd3fc66);
}

.settings-subpane-text {
  flex: 1;
  min-width: 0;
}

.settings-subpane-title {
  color: var(--text-primary);
  letter-spacing: .01em;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  display: flex;
}

.settings-subpane-title .tag-pill.schema-only {
  background: var(--bg-elevated);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  border-radius: 4px;
  padding: 2px 7px;
  font-family: JetBrains Mono, ui-monospace, monospace;
  font-size: 9.5px;
  font-weight: 700;
}

.settings-subpane-desc {
  color: var(--text-muted);
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.5;
}

.settings-subpane-body {
  flex-direction: column;
  display: flex;
}

.settings-nav button[data-active="true"] {
  position: relative;
  color: var(--accent-cyan, #7dd3fc) !important;
  background: linear-gradient(90deg, #7dd3fc24, #7dd3fc05 80%) !important;
  border: 1px solid #7dd3fc59 !important;
  font-weight: 600 !important;
  box-shadow: 0 0 0 1px #7dd3fc0f, 0 4px 16px -8px #7dd3fc73 !important;
}

.settings-nav button[data-active="true"]:before {
  content: "";
  background: var(--accent-cyan, #7dd3fc);
  width: 12px;
  height: 2px;
  box-shadow: 0 0 8px var(--accent-cyan, #7dd3fc), 0 0 16px #7dd3fc80;
  border-radius: 1px;
  position: absolute;
  top: 50%;
  left: -18px;
  transform: translateY(-50%);
}

.settings-nav button[data-active="false"], .settings-nav button:not([data-active]) {
  position: relative;
}

.settings-nav button[data-active="false"]:before, .settings-nav button:not([data-active]):before {
  content: "";
  background: var(--border-subtle);
  width: 6px;
  height: 1px;
  transition: all .16s;
  position: absolute;
  top: 50%;
  left: -14px;
  transform: translateY(-50%);
}

.settings-nav button[data-active="false"]:hover:before, .settings-nav button:not([data-active]):hover:before {
  background: var(--text-muted);
  width: 9px;
}

.settings-nav button:not([data-active="true"]):hover {
  background: var(--bg-elevated) !important;
  color: var(--text-primary) !important;
}

:root {
  --bg-base: var(--tn-bg);
  --bg-surface: var(--tn-bg-surface);
  --bg-surface-2: var(--tn-bg-surface-2);
  --bg-elevated: var(--tn-bg-elevated);
  --text-primary: var(--tn-fg);
  --text-secondary: var(--tn-fg-secondary);
  --text-muted: var(--tn-fg-muted);
  --accent-cyan: var(--tn-cyan);
  --accent-cyan-dim: var(--tn-cyan-dim);
  --accent-violet: var(--tn-violet);
  --accent-violet-dim: var(--tn-violet-dim);
  --accent-pink: var(--tn-pink);
  --border-subtle: var(--tn-border-subtle);
  --border-strong: var(--tn-border-strong);
  --success: var(--tn-success);
  --warning: var(--tn-warning);
  --danger: var(--tn-danger);
}

html, body {
  background: var(--color-bg);
  color: var(--color-fg);
}

body .unified-picker, body .unified-picker .picker-calendar, body .unified-picker [data-slot="calendar"], body .unified-picker .rdp-root, body .unified-picker .rdp {
  --cell-size: 20px !important;
  --rdp-cell-size: 20px !important;
}

body .unified-picker {
  width: 200px !important;
  min-width: 200px !important;
  max-width: 200px !important;
  padding: 4px !important;
}

body .unified-picker .picker-calendar {
  padding: 2px !important;
}

body .unified-picker [data-slot="calendar"] {
  width: 192px !important;
  max-width: 192px !important;
  padding: 0 !important;
}

body .unified-picker [data-slot="calendar"] table {
  border-collapse: collapse !important;
  width: 100% !important;
}

body .unified-picker [role="gridcell"], body .unified-picker .rdp-day {
  position: relative;
  border-radius: 5px !important;
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  padding: 0 !important;
  font-family: JetBrains Mono, monospace !important;
  font-size: 10px !important;
  line-height: 1 !important;
}

body .unified-picker [role="gridcell"] button, body .unified-picker .rdp-day_button {
  aspect-ratio: auto !important;
  border-radius: 5px !important;
  width: 100% !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  font-family: JetBrains Mono, monospace !important;
  font-size: 10px !important;
  line-height: 1 !important;
}

body .unified-picker [role="gridcell"] button {
  color: inherit !important;
  cursor: pointer !important;
  background: none !important;
  border: none !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
}

body .unified-picker [role="gridcell"][data-today="true"] button:after, body .unified-picker [role="gridcell"][data-today] button:after {
  width: 2px !important;
  height: 2px !important;
  bottom: 1px !important;
}

body .unified-picker [role="grid"] [role="row"] {
  width: 100% !important;
  height: 22px !important;
  margin-top: 1px !important;
  display: flex !important;
}

body .unified-picker [data-slot="calendar"] .rdp-month {
  gap: 2px !important;
}

body .unified-picker [data-slot="calendar"] .rdp-weekdays {
  font-size: 8px !important;
}

body .unified-picker [data-slot="calendar"] .rdp-weekday {
  text-align: center !important;
  height: 14px !important;
  color: var(--text-muted) !important;
  font-size: 8px !important;
  font-weight: 600 !important;
  line-height: 14px !important;
}

body .unified-picker [data-slot="calendar"] .rdp-month_caption, body .unified-picker [data-slot="calendar"] .rdp-caption_label {
  height: 20px !important;
  padding: 0 !important;
  font-size: 11px !important;
}

body .unified-picker [data-slot="calendar"] .rdp-nav button {
  width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
}

body .unified-picker .picker-presets {
  padding: 0 !important;
}

body .unified-picker .picker-preset-row {
  gap: 8px !important;
  min-height: 26px !important;
  padding: 4px 10px !important;
  font-size: 11px !important;
}

body .unified-picker .picker-preset-row .ic {
  width: 12px !important;
  height: 12px !important;
}

body .unified-picker .picker-preset-row .when {
  font-size: 9px !important;
}

body .unified-picker .picker-divider {
  margin: 2px 0 !important;
}

body .unified-picker .picker-footer {
  padding: 2px !important;
  font-size: 10px !important;
}

body .unified-picker .picker-tab {
  height: 26px !important;
  padding: 4px 8px !important;
  font-size: 10px !important;
}

body .unified-picker {
  --color-accent: var(--bg-elevated);
  --color-accent-foreground: var(--text-primary);
}

.bn-suggestion-menu {
  --color-accent: #7dd3fc29;
  --color-accent-foreground: var(--text-primary);
}

body .unified-picker [data-slot="calendar"] .rdp-month_caption {
  letter-spacing: 0 !important;
  height: 24px !important;
  color: var(--text-primary) !important;
  text-align: left !important;
  justify-content: flex-start !important;
  align-items: center !important;
  padding: 0 6px !important;
  font-family: Inter, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: flex !important;
  position: relative !important;
}

body .unified-picker [data-slot="calendar"] .rdp-caption_label {
  color: var(--text-primary) !important;
  text-align: left !important;
  padding: 0 !important;
  font-family: Inter, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

body .unified-picker [data-slot="calendar"] .rdp-nav {
  z-index: 2 !important;
  pointer-events: auto !important;
  gap: 4px !important;
  width: auto !important;
  height: 24px !important;
  display: flex !important;
  position: absolute !important;
  inset: 0 4px auto auto !important;
}

body .unified-picker [data-slot="calendar"] .rdp-nav button {
  width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  color: var(--text-secondary) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  background: none !important;
  border: none !important;
  border-radius: 6px !important;
  place-items: center !important;
  transition: color .12s, background .12s !important;
  display: grid !important;
}

body .unified-picker [data-slot="calendar"] .rdp-nav button:hover {
  color: var(--text-primary) !important;
  background: var(--bg-elevated) !important;
}

body .unified-picker [data-slot="calendar"] .rdp-nav svg {
  width: 14px !important;
  height: 14px !important;
}

body .unified-picker [data-slot="calendar"] .rdp-weekdays {
  margin-top: 4px !important;
  margin-bottom: 2px !important;
  display: flex !important;
}

body .unified-picker [data-slot="calendar"] .rdp-weekday {
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  height: 16px !important;
  color: var(--text-muted) !important;
  text-align: center !important;
  flex: 1 !important;
  font-family: JetBrains Mono, monospace !important;
  font-size: 9px !important;
  font-weight: 600 !important;
  line-height: 16px !important;
}

body .unified-picker [role="gridcell"], body .unified-picker [role="gridcell"] button, body .unified-picker .rdp-day, body .unified-picker .rdp-day_button {
  border-radius: 6px !important;
}

body .unified-picker [role="gridcell"] button {
  color: var(--text-primary) !important;
}

body .unified-picker [role="gridcell"] button:not(:disabled):hover {
  background: var(--bg-elevated) !important;
  color: var(--text-primary) !important;
}

body .unified-picker [role="gridcell"][data-today], body .unified-picker [role="gridcell"][data-today="true"], body .unified-picker .rdp-day_today, body .unified-picker .rdp-today {
  background: none !important;
}

body .unified-picker [role="gridcell"][data-today] button, body .unified-picker [role="gridcell"][data-today="true"] button, body .unified-picker .rdp-day_today button, body .unified-picker .rdp-today button {
  color: var(--danger) !important;
  box-shadow: none !important;
  background: none !important;
  font-weight: 700 !important;
}

body .unified-picker [role="gridcell"][data-today] button:after, body .unified-picker [role="gridcell"][data-today="true"] button:after {
  display: none !important;
}

body .unified-picker [role="gridcell"][data-selected="true"] button {
  background: var(--accent-cyan) !important;
  color: var(--bg-base) !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}

body .unified-picker [role="gridcell"][data-today][data-selected="true"] button, body .unified-picker [role="gridcell"][data-today="true"][data-selected="true"] button {
  background: var(--accent-cyan) !important;
  color: var(--bg-base) !important;
}

body .unified-picker [role="gridcell"][data-outside="true"] button {
  color: var(--text-muted) !important;
  opacity: .4 !important;
}

body .unified-picker .picker-presets {
  flex-direction: column !important;
  gap: 0 !important;
  padding: 4px !important;
  display: flex !important;
}

body .unified-picker .picker-preset-row {
  text-align: left !important;
  cursor: pointer !important;
  background: none !important;
  border: none !important;
  border-radius: 6px !important;
  grid-template-columns: 18px 1fr auto !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 7px 10px !important;
  transition: background .12s !important;
  display: grid !important;
}

body .unified-picker .picker-preset-row:hover {
  background: var(--bg-elevated) !important;
}

body .unified-picker .picker-preset-row .ic {
  place-items: center !important;
  width: 18px !important;
  height: 18px !important;
  font-size: 14px !important;
  line-height: 1 !important;
  display: grid !important;
}

body .unified-picker .picker-preset-row .lbl {
  color: var(--text-primary) !important;
  font-family: Inter, sans-serif !important;
  font-size: 13px !important;
}

body .unified-picker .picker-preset-row .when {
  color: var(--text-muted) !important;
  letter-spacing: .04em !important;
  font-family: JetBrains Mono, monospace !important;
  font-size: 10px !important;
  font-weight: 500 !important;
}

body .unified-picker .picker-divider {
  background: var(--border-subtle) !important;
  height: 1px !important;
  margin: 4px 8px !important;
}

body .unified-picker .picker-footer {
  border-top: 1px solid var(--border-subtle) !important;
}

body .unified-picker .picker-tab {
  color: var(--text-muted) !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  background: none !important;
  border: none !important;
  border-bottom: 2px solid #0000 !important;
  border-radius: 0 !important;
  font-family: JetBrains Mono, monospace !important;
  transition: all .12s !important;
}

body .unified-picker .picker-tab:hover {
  color: var(--text-secondary) !important;
}

body .unified-picker .picker-tab.active {
  color: var(--accent-cyan) !important;
  border-bottom-color: var(--accent-cyan) !important;
}

body .unified-picker .picker-header, body .unified-picker > :first-child {
  padding: 6px 8px !important;
}

.unified-picker .picker-footer {
  gap: 6px;
  padding: 4px 6px;
  font-size: 10px;
}

.unified-picker .picker-tab {
  padding: 4px 10px;
  font-size: 11px;
}

.unified-picker .picker-time {
  padding: 4px 6px;
  font-size: 11px;
}

.unified-picker [role="gridcell"][data-outside="true"], .unified-picker [role="gridcell"][data-outside="true"] button {
  color: var(--text-muted);
}

.unified-picker [role="gridcell"][data-today="true"] button, .unified-picker [role="gridcell"][data-today] button {
  background: var(--danger);
  color: #fff;
  font-weight: 700;
}

.unified-picker [role="gridcell"][data-today="true"] button:after, .unified-picker [role="gridcell"][data-today] button:after {
  content: "";
  background: #fff;
  border-radius: 50%;
  width: 3px;
  height: 3px;
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
}

.unified-picker [role="gridcell"][data-selected="true"] button, .unified-picker [role="gridcell"][data-selected="true"][data-today] button {
  background: var(--accent-cyan);
  color: var(--bg-base);
  font-weight: 700;
}

.unified-picker [role="gridcell"] button:hover {
  background: var(--bg-elevated);
}

.unified-picker [role="gridcell"][data-selected="true"] button:hover {
  background: var(--accent-cyan);
}

.unified-picker [role="gridcell"][data-today] button:hover {
  background: var(--danger);
}

.unified-picker .picker-preset-row:hover {
  background: var(--bg-elevated);
}

.unified-picker .picker-tab[disabled] {
  cursor: not-allowed;
}

.tc.dragging-source {
  opacity: .25;
}

.outbox-banner {
  z-index: 50;
  color: var(--danger);
  background: #f871711a;
  border: 1px solid #f8717159;
  border-radius: 12px;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  padding: 10px 16px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  animation: .22s ease-out bannerSlide;
  display: flex;
  position: sticky;
  top: 0;
}

@keyframes bannerSlide {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.outbox-banner .btn {
  background: var(--bg-base);
  border: 1px solid var(--border-subtle);
  cursor: pointer;
  color: var(--text-primary);
  letter-spacing: .04em;
  border-radius: 4px;
  padding: 4px 10px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.outbox-banner .btn:hover {
  border-color: var(--border-strong);
}

.outbox-banner .btn.primary {
  background: var(--accent-cyan);
  color: var(--bg-base);
  border-color: var(--accent-cyan);
  font-weight: 700;
}

.pending-fail-dot {
  background: var(--danger);
  pointer-events: none;
  border-radius: 50%;
  width: 8px;
  height: 8px;
  animation: 1s ease-in-out infinite pulseDot;
  position: absolute;
  top: 8px;
  right: 8px;
  box-shadow: 0 0 8px #f8717180;
}

@keyframes pulseDot {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: .5;
    transform: scale(.85);
  }
}

.commit-tick {
  z-index: 200;
  color: var(--success);
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: 0;
  pointer-events: none;
  backdrop-filter: blur(8px);
  background: #4ade801a;
  border: 1px solid #4ade8073;
  border-radius: 12px;
  align-items: center;
  gap: 8px;
  padding: 8px 14px 8px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 500;
  transition: opacity .18s, transform .22s cubic-bezier(.2, .8, .2, 1), box-shadow .22s;
  display: flex;
  position: fixed;
  bottom: 20px;
  left: 20px;
  transform: translateY(10px)scale(.96);
}

.commit-tick.show {
  opacity: 1;
  transform: translateY(0)scale(1);
  box-shadow: 0 0 16px #4ade8059, 0 4px 16px #0000004d;
}

.tc.selected {
  background: #7dd3fc1a;
  border-color: #7dd3fc4d;
}

.tc.selected .chk {
  background: var(--accent-cyan);
  border-color: var(--accent-cyan);
  color: var(--bg-base);
}

.tc.last-selected {
  box-shadow: inset 2px 0 0 var(--accent-cyan);
}

.tc.selected .hover-actions {
  display: none;
}

.ctx {
  background: var(--bg-surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md, 12px);
  min-width: 220px;
  padding: 6px;
  box-shadow: 0 16px 40px #000000b3;
}

.ctx-item {
  border-radius: var(--radius-sm, 4px);
  cursor: pointer;
  color: var(--text-primary);
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  font-size: 13px;
  display: flex;
}

.ctx-item:hover, .ctx-item:focus, .ctx-item[data-state="open"] {
  background: var(--bg-elevated);
  outline: none;
}

.ctx-item[aria-disabled="true"], .ctx-item[data-disabled] {
  opacity: .5;
  cursor: not-allowed;
}

.ctx-item.danger {
  color: var(--danger);
}

.ctx-item .ic {
  width: 18px;
  color: var(--text-muted);
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.ctx-item .kbd {
  color: var(--text-muted);
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  padding: 1px 5px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
  font-weight: 500;
}

.ctx-divider {
  background: var(--border-subtle);
  height: 1px;
  margin: 4px 6px;
}

.input-shell {
  background: var(--bg-surface);
  border: 1.5px solid var(--border-subtle);
  cursor: text;
  border-radius: 12px;
  min-height: 54px;
  padding: 14px 16px;
  transition: border-color .15s, box-shadow .15s;
  position: relative;
}

.input-shell:focus-within {
  border-color: var(--accent-cyan);
  box-shadow: 0 0 12px #7dd3fc40;
}

.nl-input {
  color: #0000;
  width: 100%;
  caret-color: var(--text-primary);
  z-index: 2;
  background: none;
  border: none;
  outline: none;
  font-family: Inter, sans-serif;
  font-size: 15px;
  position: relative;
}

.nl-input::placeholder {
  color: var(--text-muted);
  opacity: .7;
}

.input-shell .overlay {
  pointer-events: none;
  color: var(--text-primary);
  white-space: pre-wrap;
  z-index: 1;
  font-family: Inter, sans-serif;
  font-size: 15px;
  line-height: 1.4;
  position: absolute;
  inset: 14px 16px;
}

.ovr-due {
  color: var(--warning);
  background: #fbbf241f;
  border-radius: 3px;
  padding: 1px 0;
}

.ovr-proj {
  color: var(--accent-cyan);
  background: #7dd3fc1f;
  border-radius: 3px;
  padding: 1px 0;
}

.ovr-pri {
  border-radius: 3px;
  padding: 1px 0;
  font-weight: 700;
}

.ovr-pri-1 {
  color: var(--danger);
  background: #f8717124;
}

.ovr-pri-2 {
  color: var(--warning);
  background: #fbbf2424;
}

.ovr-pri-3 {
  color: var(--accent-cyan);
  background: #7dd3fc24;
}

.ovr-pri-4 {
  color: var(--text-muted);
  background: #94a3b824;
}

.ovr-tag {
  color: var(--accent-violet);
  background: #a78bfa2e;
  border-radius: 3px;
  padding: 1px 0;
}

.ovr-quad {
  text-transform: uppercase;
  border-radius: 3px;
  padding: 1px 0;
  font-weight: 700;
}

.ovr-quad-1 {
  color: var(--danger);
  background: #f8717124;
}

.ovr-quad-2 {
  color: var(--warning);
  background: #fbbf2424;
}

.ovr-quad-3 {
  color: var(--accent-cyan);
  background: #7dd3fc24;
}

.ovr-quad-4 {
  color: var(--success);
  background: #4ade8024;
}

.ovr-quad-w {
  color: var(--accent-violet);
  background: #a78bfa29;
}

.nl-autocomplete {
  background: var(--bg-surface);
  border: 1px solid var(--border-strong);
  z-index: 60;
  border-radius: 10px;
  flex-direction: column;
  gap: 1px;
  max-height: 280px;
  padding: 6px;
  display: flex;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  overflow-y: auto;
  box-shadow: 0 16px 40px #000000b3;
}

.nl-autocomplete-head {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 4px 10px 6px;
  font-family: JetBrains Mono, monospace;
  font-size: 9px;
}

.nl-autocomplete-row {
  width: 100%;
  color: var(--text-primary);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  font-family: Inter, sans-serif;
  font-size: 13px;
  display: flex;
}

.nl-autocomplete-row:hover, .nl-autocomplete-row[data-active="true"] {
  background: var(--bg-elevated);
}

.nl-autocomplete-dot {
  border-radius: 50%;
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  display: inline-block;
}

.nl-autocomplete-plus {
  border: 1px dashed var(--accent-cyan);
  width: 18px;
  height: 18px;
  color: var(--accent-cyan);
  border-radius: 4px;
  flex-shrink: 0;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
  display: grid;
}

.nl-autocomplete-name {
  color: var(--accent-cyan);
  flex-shrink: 0;
  font-family: JetBrains Mono, monospace;
  font-size: 12px;
}

.nl-autocomplete-create .nl-autocomplete-name {
  color: var(--text-primary);
  font-family: Inter, sans-serif;
  font-size: 13px;
}

.nl-autocomplete-meta {
  color: var(--text-muted);
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-left: auto;
  font-family: Inter, sans-serif;
  font-size: 12px;
  overflow: hidden;
}

.nl-autocomplete-empty {
  color: var(--text-muted);
  letter-spacing: .04em;
  padding: 10px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.ovr-plain {
  color: var(--text-primary);
}

.nl-unknown-project-pill {
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  display: flex;
}

.nl-unknown-project-chip {
  border: 1px dashed var(--warning);
  color: var(--warning);
  border-radius: 6px;
  padding: 2px 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 500;
}

.nl-unknown-project-hint {
  color: var(--text-muted);
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.qa-pill {
  border: 1px solid var(--accent-cyan);
  color: var(--accent-cyan);
  cursor: pointer;
  letter-spacing: .06em;
  background: linear-gradient(135deg, #7dd3fc26, #a78bfa1a);
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  padding: 7px 14px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 700;
  transition: box-shadow .18s, transform .18s;
  display: flex;
}

.qa-pill:hover {
  transform: translateY(-1px);
  box-shadow: 0 0 16px #7dd3fc59;
}

.qa-pill .plus-glyph {
  background: var(--accent-cyan);
  width: 16px;
  height: 16px;
  color: var(--bg-base);
  border-radius: 4px;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
  display: grid;
}

.qa-pill .kbd {
  opacity: .7;
  border: 1px solid #7dd3fc4d;
  border-radius: 3px;
  padding: 1px 4px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
  font-weight: 500;
}

.cmdk-pill {
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  cursor: pointer;
  letter-spacing: .04em;
  border-radius: 8px;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 500;
  transition: border-color .18s;
  display: flex;
}

.cmdk-pill:hover {
  border-color: var(--border-strong);
  color: var(--text-primary);
}

.qa-modal {
  background: var(--bg-surface-2);
  border: 1px solid var(--border-strong);
  border-radius: 16px;
  flex-direction: column;
  gap: 16px;
  width: calc(100vw - 64px);
  max-width: 640px;
  padding: 24px;
  display: flex !important;
  top: 96px !important;
  translate: -50% !important;
}

.qa-modal-header {
  justify-content: space-between;
  align-items: baseline;
  display: flex;
}

.qa-modal-title {
  color: var(--text-primary);
  letter-spacing: .02em;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-weight: 700;
}

.qa-modal-esc {
  color: var(--text-muted);
  letter-spacing: .04em;
  text-transform: uppercase;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.qa-modal-quadrants {
  flex-wrap: wrap;
  gap: 8px;
  display: flex;
}

.qa-modal-quadrant-pill {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  cursor: pointer;
  color: var(--text-secondary);
  border-radius: 8px;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 500;
  transition: border-color .15s, background .15s, color .15s;
  display: flex;
}

.qa-modal-quadrant-pill[data-selected="true"] {
  border-color: var(--accent-cyan);
  color: var(--accent-cyan);
  background: #7dd3fc1a;
}

.qa-modal-due-row {
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  display: flex;
}

.qa-modal-due-label {
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.qa-modal-footer {
  border-top: 1px solid var(--border-subtle);
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding-top: 16px;
  display: flex;
}

.qa-modal-hint {
  color: var(--text-muted);
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.qa-modal-submit {
  border: 1px solid var(--accent-cyan);
  color: var(--accent-cyan);
  letter-spacing: .04em;
  cursor: pointer;
  background: linear-gradient(135deg, #7dd3fc26, #a78bfa1a);
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  font-family: JetBrains Mono, monospace;
  font-size: 12px;
  font-weight: 700;
  transition: all .15s;
  display: inline-flex;
  box-shadow: 0 0 12px #7dd3fc33;
}

.qa-modal-submit:hover:not(:disabled) {
  background: linear-gradient(135deg, #7dd3fc40, #a78bfa26);
  box-shadow: 0 0 18px #7dd3fc59;
}

.qa-modal-submit:disabled {
  opacity: .4;
  cursor: not-allowed;
  box-shadow: none;
}

.qa-modal-submit kbd {
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  color: var(--text-secondary);
  border-radius: 3px;
  padding: 1px 5px;
  font-size: 10px;
  font-weight: 500;
}

.qa-modal.qa-modal-todoist {
  background: var(--bg-surface-2);
  border-radius: 12px;
  max-width: 560px;
  overflow: visible;
  gap: 0 !important;
  padding: 0 !important;
}

.qa-modal-todoist .qa-todoist-body {
  padding: 18px 20px 12px;
}

.qa-modal-todoist .input-shell {
  box-shadow: none !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  min-height: 28px !important;
  padding: 0 !important;
}

.qa-modal-todoist .input-shell:focus-within {
  box-shadow: none !important;
  border: none !important;
}

.qa-modal-todoist .nl-input {
  letter-spacing: -.01em !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

.qa-modal-todoist .input-shell .overlay {
  letter-spacing: -.01em !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  inset: 0 !important;
}

.qa-modal-todoist .qa-todoist-toolbar {
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
  display: flex;
}

.qa-tool-btn {
  border: 1px solid var(--border-strong);
  color: var(--text-secondary);
  cursor: pointer;
  background: none;
  border-radius: 6px;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  font-family: Inter, sans-serif;
  font-size: 12px;
  transition: all .12s;
  display: inline-flex;
}

.qa-tool-btn:hover {
  border-color: var(--text-secondary);
  color: var(--text-primary);
  background: var(--bg-elevated);
}

.qa-tool-btn.is-active {
  border-color: var(--accent-cyan);
  color: var(--accent-cyan);
  background: #7dd3fc14;
  animation: .32s cubic-bezier(.34, 1.56, .64, 1) qaToolActivate;
}

@keyframes qaToolActivate {
  0% {
    transform: scale(1);
    box-shadow: 0 0 #7dd3fc00;
  }

  40% {
    transform: scale(1.1);
    box-shadow: 0 0 0 4px #7dd3fc66;
  }

  70% {
    transform: scale(.97);
    box-shadow: 0 0 0 8px #7dd3fc1a;
  }

  100% {
    transform: scale(1);
    box-shadow: 0 0 #7dd3fc00;
  }
}

.qa-tool-cluster {
  align-items: stretch;
  gap: 0;
  display: inline-flex;
}

.qa-tool-cluster .qa-tool-btn.is-active {
  border-right: none;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.qa-tool-clear {
  border: 1px solid var(--accent-cyan);
  width: 24px;
  color: var(--accent-cyan);
  cursor: pointer;
  background: #7dd3fc14;
  border-left: none;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  justify-content: center;
  align-items: center;
  transition: background .12s;
  display: inline-flex;
}

.qa-tool-clear:hover {
  background: #7dd3fc2e;
}

.qa-tool-badge {
  height: 14px;
  color: var(--success);
  letter-spacing: .06em;
  text-transform: uppercase;
  background: #4ade802e;
  border-radius: 3px;
  align-items: center;
  margin-left: 2px;
  padding: 0 5px;
  font-family: JetBrains Mono, monospace;
  font-size: 9px;
  font-weight: 700;
  display: inline-flex;
}

.qa-modal-todoist .qa-todoist-footer {
  border-top: 1px solid var(--border-subtle);
  background: var(--bg-surface);
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 20px;
  display: flex;
}

.qa-project-pill {
  color: var(--text-secondary);
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 6px;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  font-family: Inter, sans-serif;
  font-size: 13px;
  transition: background .12s;
  display: inline-flex;
}

.qa-project-pill:hover {
  background: var(--bg-elevated);
  color: var(--text-primary);
}

.qa-project-pill .qa-project-dot {
  border-radius: 50%;
  width: 8px;
  height: 8px;
  display: inline-block;
}

.qa-project-pill .qa-project-name {
  font-weight: 600;
}

.qa-project-pill .qa-project-name-empty {
  color: var(--text-muted);
}

.qa-project-pill .qa-project-caret {
  color: var(--text-muted);
  margin-left: 2px;
  font-size: 10px;
}

[data-slot="dialog-overlay"]:has( + .timer-setup-modal) {
  backdrop-filter: none !important;
  background: #00000005 !important;
}

.timer-setup-modal {
  text-align: center;
  border-radius: 14px;
  flex-direction: column;
  gap: 16px;
  width: calc(100vw - 64px);
  max-width: 480px;
  padding: 22px 22px 18px;
  position: fixed;
  box-shadow: 0 0 0 1px #7dd3fc40, 0 24px 64px #000000a6, 0 0 32px #7dd3fc2e;
  background: var(--bg-elevated) !important;
  border: 1px solid var(--accent-cyan) !important;
  display: flex !important;
  top: 96px !important;
  translate: -50% !important;
}

.timer-setup-modal .ts-header {
  position: relative;
  text-align: center !important;
  display: block !important;
}

.timer-setup-modal .ts-title {
  color: var(--text-primary);
  letter-spacing: .06em;
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 700;
  display: block;
  text-align: center !important;
}

.timer-setup-modal .ts-esc {
  color: var(--text-muted);
  letter-spacing: .04em;
  text-transform: uppercase;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
  position: absolute;
  top: 4px;
  right: 0;
}

.timer-setup-modal .ts-task-title {
  color: var(--text-primary);
  background: var(--bg-surface-2);
  border: 1px solid var(--border-subtle);
  text-align: center;
  letter-spacing: .01em;
  border-radius: 8px;
  padding: 10px 12px;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 700;
}

.timer-setup-modal .ts-modes {
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  display: grid;
}

.timer-setup-modal .ts-mode-card {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  cursor: pointer;
  text-align: center;
  border-radius: 10px;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 10px;
  transition: all .15s;
  display: flex;
}

.timer-setup-modal .ts-mode-card:hover {
  border-color: var(--text-secondary);
  color: var(--text-primary);
}

.timer-setup-modal .ts-mode-card[data-selected="true"] {
  border-color: var(--accent-cyan);
  color: var(--accent-cyan);
  background: #7dd3fc14;
  box-shadow: 0 0 12px #7dd3fc33;
}

.timer-setup-modal .ts-mode-card[data-mode="countdown"][data-selected="true"] {
  border-color: var(--accent-violet);
  color: var(--accent-violet);
  background: #a78bfa14;
  box-shadow: 0 0 12px #a78bfa33;
}

.timer-setup-modal .ts-mode-icon {
  width: 32px;
  height: 32px;
  color: inherit;
  background: #7dd3fc1a;
  border-radius: 50%;
  place-items: center;
  display: grid;
}

.timer-setup-modal .ts-mode-card[data-mode="pomodoro"] .ts-mode-icon {
  color: var(--accent-pink);
  background: #f472b61f;
}

.timer-setup-modal .ts-mode-card[data-mode="countdown"] .ts-mode-icon {
  color: var(--accent-violet);
  background: #a78bfa1f;
}

.timer-setup-modal .ts-mode-card[data-selected="true"] .ts-mode-icon {
  box-shadow: 0 0 8px;
}

.timer-setup-modal .ts-mode-label {
  font-family: Inter, sans-serif;
  font-size: 13px;
  font-weight: 700;
}

.timer-setup-modal .ts-mode-hint {
  color: var(--text-muted);
  letter-spacing: 0;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
  font-weight: 400;
  line-height: 1.4;
}

.timer-setup-modal .ts-error {
  color: var(--danger);
  background: #f871711a;
  border: 1px solid #f8717166;
  border-radius: 8px;
  padding: 8px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.timer-setup-modal .ts-footer {
  border-top: 1px solid var(--border-subtle);
  justify-content: center;
  gap: 10px;
  padding-top: 8px;
  display: flex;
}

.timer-setup-modal .ts-btn-cancel, .timer-setup-modal .ts-btn-start {
  cursor: pointer;
  border-radius: 8px;
  align-items: center;
  gap: 6px;
  padding: 9px 18px;
  font-family: Inter, sans-serif;
  font-size: 13px;
  font-weight: 700;
  transition: all .12s;
  display: inline-flex;
}

.timer-setup-modal .ts-btn-cancel {
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  color: var(--text-secondary);
}

.timer-setup-modal .ts-btn-cancel:hover:not(:disabled) {
  color: var(--text-primary);
  border-color: var(--text-secondary);
}

.timer-setup-modal .ts-btn-start {
  background: linear-gradient(135deg, var(--accent-cyan), var(--accent-violet));
  border: 1px solid var(--accent-cyan);
  color: var(--bg-base);
  box-shadow: 0 0 16px #7dd3fc4d;
}

.timer-setup-modal .ts-btn-start:hover:not(:disabled) {
  box-shadow: 0 0 24px #7dd3fc80;
}

.timer-setup-modal .ts-btn-start:disabled, .timer-setup-modal .ts-btn-cancel:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.qa-modal-todoist .qa-quadrant-pill-trigger {
  margin-left: 24px;
}

.qa-todoist-actions {
  gap: 8px;
  display: flex;
}

.qa-btn-cancel, .qa-btn-add {
  cursor: pointer;
  border-radius: 6px;
  padding: 8px 16px;
  font-family: Inter, sans-serif;
  font-size: 13px;
  font-weight: 600;
  transition: all .12s;
}

.qa-btn-cancel {
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  color: var(--text-secondary);
}

.qa-btn-cancel:hover:not(:disabled) {
  color: var(--text-primary);
  border-color: var(--text-secondary);
}

.qa-btn-add {
  background: var(--accent-cyan);
  border: 1px solid var(--accent-cyan);
  color: var(--bg-base);
  box-shadow: 0 0 12px #7dd3fc40;
}

.qa-btn-add:hover:not(:disabled) {
  box-shadow: 0 0 18px #7dd3fc73;
}

.qa-btn-add:disabled, .qa-btn-cancel:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.qa-priority-popover {
  background: var(--bg-surface);
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  min-width: 160px;
  padding: 4px;
  box-shadow: 0 16px 40px #000000b3;
}

.qa-priority-row {
  width: 100%;
  color: var(--text-primary);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  font-family: Inter, sans-serif;
  font-size: 13px;
  display: flex;
}

.qa-priority-row:hover {
  background: var(--bg-elevated);
}

.qa-priority-row[data-selected="true"] {
  color: var(--accent-cyan);
}

.qa-project-popover {
  background: var(--bg-surface);
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  flex-direction: column;
  gap: 4px;
  width: 280px;
  max-height: 360px;
  padding: 6px;
  display: flex;
  box-shadow: 0 16px 40px #000000b3;
}

.qa-project-search {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  width: 100%;
  color: var(--text-primary);
  border-radius: 6px;
  outline: none;
  padding: 7px 10px;
  font-family: Inter, sans-serif;
  font-size: 13px;
}

.qa-project-search:focus {
  border-color: var(--accent-cyan);
}

.qa-project-list {
  flex-direction: column;
  gap: 1px;
  max-height: 280px;
  display: flex;
  overflow-y: auto;
}

.qa-project-row {
  width: 100%;
  color: var(--text-primary);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  font-family: Inter, sans-serif;
  font-size: 13px;
  display: flex;
}

.qa-project-row:hover {
  background: var(--bg-elevated);
}

.qa-project-row[data-selected="true"] {
  color: var(--accent-cyan);
}

.qa-project-row .qa-project-dot {
  border-radius: 50%;
  width: 10px;
  height: 10px;
  display: inline-block;
}

.qa-project-row-name {
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 1;
  overflow: hidden;
}

.qa-project-empty {
  text-align: center;
  color: var(--text-muted);
  padding: 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.qa-project-row-create {
  border-top: 1px dashed var(--border-subtle);
  margin-top: 4px;
  padding-top: 9px !important;
}

.qa-project-row-create .qa-project-plus {
  border: 1px dashed var(--accent-cyan);
  width: 18px;
  height: 18px;
  color: var(--accent-cyan);
  border-radius: 4px;
  flex-shrink: 0;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
  display: grid;
}

.qa-project-row-create .qa-project-row-meta {
  color: var(--text-muted);
  margin-left: auto;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.shortcuts-modal {
  background: var(--bg-surface-2);
  border: 1px solid var(--border-strong);
  border-radius: 16px;
  width: calc(100vw - 64px);
  max-width: 880px;
  padding: 32px;
}

.shortcuts-modal-title {
  color: var(--text-primary);
  letter-spacing: .02em;
  margin-bottom: 24px;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-weight: 700;
}

.shortcuts-grid {
  grid-template-columns: 1fr 1fr;
  gap: 24px 32px;
  display: grid;
}

.shortcuts-row {
  border-bottom: 1px solid var(--border-subtle);
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 6px 0;
  display: flex;
}

.shortcuts-row .shortcut-label {
  color: var(--text-primary);
  font-family: Inter, sans-serif;
  font-size: 13px;
}

.shortcuts-row .shortcut-kbd {
  color: var(--accent-cyan);
  letter-spacing: .04em;
  white-space: nowrap;
  background: #7dd3fc14;
  border: 1px solid #7dd3fc4d;
  border-radius: 4px;
  padding: 2px 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 500;
}

[data-slot="dialog-overlay"], [data-radix-dialog-overlay] {
  -webkit-backdrop-filter: blur(8px);
  background: #0a0e27d9 !important;
}

@keyframes modalIn {
  from {
    opacity: 0;
    transform: translateX(-50%)scale(.96)translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateX(-50%)scale(1)translateY(0);
  }
}

.modal-overlay {
  animation: .22s cubic-bezier(.2, .8, .2, 1) modalIn;
}

.subt {
  border-bottom: 1px solid var(--border-subtle);
  align-items: center;
  gap: 10px;
  min-height: 24px;
  padding: 5px 8px 5px 28px;
  font-size: 12.5px;
  display: flex;
  position: relative;
}

.subt:before {
  content: "";
  background: #7dd3fc4d;
  width: 12px;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 12px;
}

.subt .chk {
  border-radius: 3px;
  width: 14px;
  height: 14px;
}

.subt .title.done {
  opacity: .45;
  text-decoration: line-through;
}

.inline-add {
  border: 1px solid var(--accent-cyan);
  border-radius: var(--radius-sm);
  background: #7dd3fc0f;
  align-items: center;
  gap: 10px;
  margin: 0 8px;
  padding: 8px;
  display: flex;
  box-shadow: 0 0 12px #7dd3fc33;
}

.sidebar-project-row:hover {
  background: var(--bg-surface);
  border-radius: var(--radius-sm);
}

@keyframes strikethrough {
  from {
    background-size: 0% 1px;
  }

  to {
    background-size: 100% 1px;
  }
}

@keyframes collapseRow {
  from {
    opacity: 1;
    border-bottom-width: 1px;
    max-height: 80px;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  to {
    opacity: 0;
    border-bottom-width: 0;
    max-height: 0;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
}

.tc.task-complete-anim .title, .subt.task-complete-anim .title {
  color: var(--text-muted);
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0;
  background-repeat: no-repeat;
  background-size: 0% 1px;
  animation: .3s forwards strikethrough;
}

.tc.task-complete-anim, .subt.task-complete-anim {
  animation: .2s .3s forwards collapseRow;
  overflow: hidden;
}

.topbar-shell {
  transition: all .18s;
}

.topbar-shell.selection {
  border-bottom-color: var(--accent-cyan);
  box-shadow: inset 0 -2px 0 var(--accent-cyan);
  background: linear-gradient(#7dd3fc14, #7dd3fc08);
}

.topbar-shell.selection .qa-pill, .topbar-shell.selection .cmdk-pill {
  display: none;
}

.selection-mode-topbar {
  flex: 1;
  align-items: center;
  gap: 12px;
  min-width: 0;
  display: flex;
}

.selection-mode-topbar .selection-counter {
  color: var(--accent-cyan);
  letter-spacing: .04em;
  white-space: nowrap;
  font-family: JetBrains Mono, monospace;
  font-size: 12px;
  font-weight: 600;
}

.selection-mode-topbar .selection-counter .count {
  font-weight: 700;
}

.selection-mode-topbar .selection-counter .spread {
  color: var(--text-muted);
  margin-left: 6px;
  font-weight: 500;
}

.selection-mode-topbar .actions {
  scrollbar-width: none;
  flex-wrap: nowrap;
  flex: 1;
  justify-content: flex-end;
  align-items: center;
  gap: 6px;
  display: flex;
  overflow-x: auto;
}

.selection-mode-topbar .actions::-webkit-scrollbar {
  display: none;
}

.ts-btn {
  border: 1px solid var(--border-subtle);
  color: var(--text-primary);
  border-radius: var(--radius-sm, 6px);
  white-space: nowrap;
  cursor: pointer;
  background: none;
  align-items: center;
  gap: 5px;
  padding: 6px 11px;
  font-family: JetBrains Mono, monospace;
  font-size: 12px;
  font-weight: 500;
  transition: border-color .14s, color .14s, background .14s;
  display: inline-flex;
}

.ts-btn:hover:not(:disabled) {
  border-color: var(--accent-cyan);
  color: var(--accent-cyan);
}

.ts-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.ts-btn.danger {
  color: var(--danger);
}

.ts-btn.danger:hover:not(:disabled) {
  border-color: var(--danger);
  color: var(--danger);
}

.kbd-mini {
  color: var(--text-muted);
  border: 1px solid var(--border-subtle);
  border-radius: 3px;
  margin-left: 6px;
  padding: 1px 4px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
  font-weight: 500;
}

.ts-btn:hover .kbd-mini {
  color: inherit;
  border-color: currentColor;
}

@media (width <= 768px) {
  .selection-mode-topbar {
    gap: 8px;
  }

  .selection-mode-topbar .selection-counter .spread {
    display: none;
  }
}

.floating-timer {
  z-index: 40;
  font-family: Inter, sans-serif;
  position: fixed;
  bottom: 16px;
  right: 16px;
}

.floating-timer-collapsed {
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  cursor: pointer;
  min-width: 132px;
  color: var(--text-primary);
  border-radius: 999px;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  transition: border-color .18s, box-shadow .18s;
  display: inline-flex;
  box-shadow: 0 8px 24px #00000059;
}

.floating-timer-collapsed:hover {
  border-color: var(--accent-cyan);
  box-shadow: 0 0 16px #7dd3fc40, 0 8px 24px #0006;
}

.floating-timer-collapsed .pulse-dot {
  background: var(--accent-cyan);
  border-radius: 50%;
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  animation: 1.4s ease-in-out infinite ftPulse;
  box-shadow: 0 0 8px #7dd3fc99;
}

@keyframes ftPulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: .55;
    transform: scale(.85);
  }
}

.floating-timer-collapsed .ft-title {
  color: var(--text-primary);
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 80px;
  font-family: Inter, sans-serif;
  font-size: 12px;
  font-weight: 500;
  overflow: hidden;
}

.floating-timer .elapsed {
  letter-spacing: .04em;
  color: var(--accent-cyan);
  font-family: JetBrains Mono, monospace;
  font-size: 12.5px;
  font-weight: 600;
}

.floating-timer .elapsed.elapsed-large {
  letter-spacing: .05em;
  font-size: 28px;
  font-weight: 700;
}

.floating-timer-expanded {
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  flex-direction: column;
  gap: 12px;
  width: 320px;
  padding: 14px 16px;
  display: flex;
  box-shadow: 0 16px 40px #00000080;
}

.floating-timer-expanded .ft-header {
  align-items: center;
  gap: 8px;
  display: flex;
}

.floating-timer-expanded .ft-title {
  color: var(--text-primary);
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 1;
  font-family: Inter, sans-serif;
  font-size: 13px;
  font-weight: 500;
  overflow: hidden;
}

.floating-timer-expanded .ft-collapse-btn {
  color: var(--text-muted);
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 12px;
  line-height: 1;
}

.floating-timer-expanded .ft-collapse-btn:hover {
  color: var(--accent-cyan);
  border-color: var(--border-subtle);
}

.floating-timer-expanded .ft-elapsed-row {
  justify-content: center;
  align-items: baseline;
  padding: 4px 0;
  display: flex;
}

.floating-timer-expanded .ft-actions {
  gap: 8px;
  display: flex;
}

.floating-timer-expanded .ft-btn {
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  color: var(--text-primary);
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  border-radius: 6px;
  flex: 1;
  padding: 8px 12px;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 600;
  transition: border-color .14s, color .14s, background .14s;
}

.floating-timer-expanded .ft-btn:hover:not(:disabled) {
  border-color: var(--accent-cyan);
  color: var(--accent-cyan);
}

.floating-timer-expanded .ft-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.floating-timer-expanded .ft-btn-danger {
  border-color: var(--danger);
  color: var(--danger);
}

.floating-timer-expanded .ft-btn-danger:hover:not(:disabled) {
  background: #f871711f;
}

.mode-pill {
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
  border: 1px solid;
  border-radius: 999px;
  padding: 2px 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
  font-weight: 600;
}

.mode-pill.free {
  color: var(--accent-cyan);
  background: #7dd3fc1f;
  border-color: #7dd3fc4d;
}

.mode-pill.pomodoro {
  color: var(--accent-violet);
  background: #a78bfa1f;
  border-color: #a78bfa4d;
}

.mode-pill.paused {
  color: var(--warning);
  background: #f59e0b1f;
  border-color: #f59e0b4d;
}

.floating-timer-collapsed .pulse-dot.is-paused {
  background: var(--text-muted);
  box-shadow: none;
  opacity: .7;
  animation: none;
}

.floating-timer-expanded .ft-btn.ft-btn-primary {
  border-color: var(--accent-cyan);
  color: var(--accent-cyan);
}

.floating-timer-expanded .ft-btn.ft-btn-primary:hover:not(:disabled) {
  background: #7dd3fc1f;
}

.pomo-phase {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.pomo-phase-row {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  display: flex;
}

.pomo-remaining {
  color: var(--text-muted);
  letter-spacing: .04em;
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
  font-weight: 500;
}

.pomo-bar {
  background: var(--bg-surface);
  border-radius: 2px;
  height: 4px;
  overflow: hidden;
}

.pomo-bar-fill {
  width: 0%;
  height: 100%;
  transition: width .4s linear;
}

.pomo-bar-fill[data-phase="work"] {
  background: var(--accent-cyan);
}

.pomo-bar-fill[data-phase="break"] {
  background: var(--accent-violet);
}

.floating-timer-idle {
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  width: 44px;
  height: 44px;
  color: var(--text-secondary);
  cursor: pointer;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  padding: 0;
  transition: color .16s, border-color .16s, box-shadow .16s;
  display: inline-flex;
  box-shadow: 0 2px 8px #00000059;
}

.floating-timer-idle:hover, .floating-timer-idle:focus-visible, .floating-timer-idle.is-open {
  color: var(--accent-cyan);
  border-color: var(--accent-cyan);
  box-shadow: var(--glow-cyan);
  outline: none;
}

.ft-launch-pop {
  background: var(--bg-surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  width: 360px;
  box-shadow: 0 18px 44px #0000009e, 0 0 0 1px var(--accent-cyan);
  flex-direction: column;
  max-height: 80vh;
  display: flex;
  position: absolute;
  bottom: 56px;
  right: 0;
  overflow: hidden auto;
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-launch-pop {
    box-shadow: 0 18px 44px #0000009e, 0 0 0 1px color-mix(in srgb, var(--accent-cyan) 12%, transparent);
  }
}

.ft-launch-modes {
  border-bottom: 1px solid var(--border-subtle);
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 14px 14px 10px;
  display: grid;
}

.ft-mode-tile-wrap {
  display: flex;
  position: relative;
}

.ft-mode-tile-wrap > .ft-mode-tile {
  flex: 1;
}

.ft-mode-tile {
  background: var(--bg-surface-2);
  border: 1px solid var(--border-subtle);
  cursor: pointer;
  color: var(--text-secondary);
  border-radius: 8px;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 10px 8px;
  font-family: Inter, system-ui, sans-serif;
  transition: all .12s;
  display: flex;
  position: relative;
}

.ft-mode-tile:hover {
  border-color: var(--border-strong);
  color: var(--text-primary);
}

.ft-mode-tile.is-active.free {
  background: var(--accent-cyan);
  border-color: var(--accent-cyan);
  color: var(--accent-cyan);
  box-shadow: 0 0 0 1px var(--accent-cyan);
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-mode-tile.is-active.free {
    background: color-mix(in srgb, var(--accent-cyan) 14%, var(--bg-surface-2));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent-cyan) 30%, transparent);
  }
}

.ft-mode-tile.is-active.pomo {
  background: var(--accent-violet);
  border-color: var(--accent-violet);
  color: var(--accent-violet);
  box-shadow: 0 0 0 1px var(--accent-violet);
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-mode-tile.is-active.pomo {
    background: color-mix(in srgb, var(--accent-violet) 14%, var(--bg-surface-2));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent-violet) 30%, transparent);
  }
}

.ft-mode-tile .label {
  letter-spacing: .04em;
  font-size: 11.5px;
  font-weight: 700;
}

.ft-mode-tile .hint {
  color: var(--text-muted);
  letter-spacing: .04em;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.ft-mode-tile.is-active .hint {
  color: inherit;
  opacity: .85;
}

.ft-mode-gear {
  width: 22px;
  height: 22px;
  color: var(--accent-violet);
  cursor: pointer;
  opacity: .7;
  z-index: 2;
  background: none;
  border: none;
  border-radius: 4px;
  justify-content: center;
  align-items: center;
  padding: 0;
  transition: opacity .12s, background .12s;
  display: inline-flex;
  position: absolute;
  top: 4px;
  right: 4px;
}

.ft-mode-gear:hover, .ft-mode-gear:focus-visible {
  opacity: 1;
  background: var(--accent-violet);
  outline: none;
}

@supports (color: color-mix(in lab, red, red)) {
  :is(.ft-mode-gear:hover, .ft-mode-gear:focus-visible) {
    background: color-mix(in srgb, var(--accent-violet) 18%, transparent);
  }
}

.ft-pomo-cfg-pop {
  background: var(--bg-surface);
  border: 1px solid var(--accent-violet);
  border-radius: var(--radius-md);
  box-shadow: 0 18px 44px #000000b3, 0 0 0 1px var(--accent-violet);
  z-index: 1000;
  cursor: default;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-pomo-cfg-pop {
    box-shadow: 0 18px 44px #000000b3, 0 0 0 1px color-mix(in srgb, var(--accent-violet) 24%, transparent);
  }
}

.ft-pomo-cfg-input-row {
  justify-content: flex-end;
  margin-top: -2px;
  display: flex;
}

.ft-pomo-cfg-row {
  color: var(--text-secondary);
  align-items: center;
  gap: 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 11.5px;
  display: flex;
}

.ft-pomo-cfg-row .lbl {
  color: var(--text-muted);
  letter-spacing: .1em;
  text-transform: uppercase;
  min-width: 40px;
  font-size: 10px;
}

.ft-pomo-cfg-presets {
  align-items: center;
  gap: 4px;
  display: flex;
}

.ft-pomo-cfg-presets .preset {
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  cursor: pointer;
  border-radius: 999px;
  padding: 3px 8px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
  font-weight: 600;
  transition: all .12s;
}

.ft-pomo-cfg-presets .preset:hover {
  border-color: var(--accent-violet);
  color: var(--accent-violet);
}

.ft-pomo-cfg-presets .preset.is-active {
  background: var(--accent-violet);
  border-color: var(--accent-violet);
  color: var(--accent-violet);
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-pomo-cfg-presets .preset.is-active {
    background: color-mix(in srgb, var(--accent-violet) 18%, transparent);
  }
}

.ft-pomo-cfg-stepper {
  background: var(--bg-elevated);
  border: 1px solid var(--accent-violet);
  border-radius: 6px;
  align-items: stretch;
  gap: 4px;
  height: 30px;
  padding: 2px 6px 2px 8px;
  display: inline-flex;
}

.ft-pomo-cfg-stepper input {
  width: 38px;
  color: var(--accent-violet);
  text-align: center;
  -moz-appearance: textfield;
  background: none;
  border: none;
  outline: none;
  padding: 0;
  font-family: JetBrains Mono, monospace;
  font-size: 14px;
  font-weight: 700;
}

.ft-pomo-cfg-stepper input::-webkit-outer-spin-button, .ft-pomo-cfg-stepper input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.ft-pomo-cfg-stepper .ft-pomo-cfg-spinners {
  flex-direction: column;
  justify-content: center;
  gap: 1px;
  display: flex;
}

.ft-pomo-cfg-stepper .spinner-btn {
  width: 18px;
  height: 11px;
  color: var(--accent-violet);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 3px;
  justify-content: center;
  align-items: center;
  padding: 0;
  transition: background .1s, color .1s;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-pomo-cfg-stepper .spinner-btn {
    color: color-mix(in srgb, var(--accent-violet) 70%, transparent);
  }
}

.ft-pomo-cfg-stepper .spinner-btn:hover {
  background: var(--accent-violet);
  color: var(--accent-violet);
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-pomo-cfg-stepper .spinner-btn:hover {
    background: color-mix(in srgb, var(--accent-violet) 18%, transparent);
  }
}

.ft-pomo-cfg-stepper .spinner-btn:active {
  background: var(--accent-violet);
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-pomo-cfg-stepper .spinner-btn:active {
    background: color-mix(in srgb, var(--accent-violet) 26%, transparent);
  }
}

.ft-pomo-cfg-stepper .suffix {
  color: var(--text-muted);
  letter-spacing: .04em;
  align-self: center;
  padding-right: 2px;
  font-family: JetBrains Mono, monospace;
  font-size: 10.5px;
}

.ft-pomo-cfg-saved {
  color: var(--text-muted);
  align-items: center;
  gap: 5px;
  font-size: 9.5px;
  font-style: italic;
  display: flex;
}

.ft-pomo-cfg-saved:before {
  content: "✓";
  color: var(--success);
  font-style: normal;
  font-weight: 800;
}

.ft-anon-row {
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-surface-2);
  padding: 12px 14px;
}

.ft-anon-btn {
  background: var(--bg-elevated);
  border: 1px dashed var(--accent-cyan);
  width: 100%;
  color: var(--accent-cyan);
  cursor: pointer;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  font-family: Inter, system-ui, sans-serif;
  font-size: 13px;
  font-weight: 700;
  transition: background .12s;
  display: flex;
}

.ft-anon-btn:hover:not(:disabled) {
  background: var(--accent-cyan);
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-anon-btn:hover:not(:disabled) {
    background: color-mix(in srgb, var(--accent-cyan) 10%, var(--bg-elevated));
  }
}

.ft-anon-btn:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.ft-anon-btn.ft-anon-violet {
  border-color: var(--accent-violet);
  color: var(--accent-violet);
}

.ft-anon-btn.ft-anon-violet:hover:not(:disabled) {
  background: var(--accent-violet);
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-anon-btn.ft-anon-violet:hover:not(:disabled) {
    background: color-mix(in srgb, var(--accent-violet) 10%, var(--bg-elevated));
  }
}

.ft-anon-btn .sub {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 500;
}

.ft-launch-toggle {
  border: none;
  border-top: 1px solid var(--border-subtle);
  width: 100%;
  color: var(--text-secondary);
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  text-align: left;
  background: none;
  align-items: center;
  gap: 9px;
  padding: 11px 14px;
  font-family: JetBrains Mono, monospace;
  font-size: 10.5px;
  transition: background .12s, color .12s;
  display: flex;
}

.ft-launch-toggle:hover {
  background: var(--bg-surface-2);
  color: var(--text-primary);
}

.ft-launch-toggle.is-open {
  color: var(--accent-cyan);
  background: var(--accent-cyan);
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-launch-toggle.is-open {
    background: color-mix(in srgb, var(--accent-cyan) 8%, var(--bg-surface-2));
  }
}

.ft-launch-toggle .arr {
  font-size: 11px;
  transition: transform .2s;
}

.ft-launch-toggle.is-open .arr {
  transform: rotate(90deg);
}

.ft-launch-toggle .count {
  color: var(--text-muted);
  background: var(--bg-surface-2);
  border-radius: 999px;
  margin-left: auto;
  padding: 1px 6px;
  font-size: 9.5px;
}

.ft-launch-toggle.is-open .count {
  background: var(--bg-elevated);
}

.ft-launch-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ft-launch-empty {
  text-align: center;
  color: var(--text-muted);
  padding: 14px;
  font-size: 11.5px;
  font-style: italic;
}

.ft-launch-row {
  width: 100%;
  color: var(--text-primary);
  text-align: left;
  cursor: pointer;
  background: none;
  border: none;
  border-left: 2px solid #0000;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  font-family: Inter, system-ui, sans-serif;
  font-size: 13px;
  transition: background .12s, border-color .12s;
  display: flex;
}

.ft-launch-row:hover:not(:disabled), .ft-launch-row:focus-visible:not(:disabled) {
  background: var(--bg-surface-2);
  border-left-color: var(--accent-cyan);
  outline: none;
}

.ft-launch-row:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.ft-launch-dot {
  border-radius: 50%;
  flex: 0 0 9px;
  width: 9px;
  height: 9px;
}

.ft-launch-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  overflow: hidden;
}

.ft-launch-badge {
  letter-spacing: .08em;
  text-transform: uppercase;
  background: var(--accent-violet);
  color: var(--accent-violet);
  border-radius: 4px;
  padding: 1px 5px;
  font-family: JetBrains Mono, monospace;
  font-size: 9px;
}

@supports (color: color-mix(in lab, red, red)) {
  .ft-launch-badge {
    background: color-mix(in srgb, var(--accent-violet) 16%, transparent);
  }
}

.ft-launch-total {
  color: var(--text-secondary);
  font-family: JetBrains Mono, monospace;
  font-size: 11px;
}

.floating-timer-expanded .ft-total-mini {
  background: var(--bg-surface-2);
  border-bottom: 1px solid var(--border-subtle);
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  font-family: JetBrains Mono, monospace;
  display: flex;
}

.floating-timer-expanded .ft-total-lbl {
  color: var(--text-muted);
  letter-spacing: .1em;
  text-transform: uppercase;
  font-size: 9.5px;
}

.floating-timer-expanded .ft-total-val {
  color: var(--accent-cyan);
  letter-spacing: .02em;
  margin-left: auto;
  font-size: 12px;
  font-weight: 700;
}

.floating-timer-expanded .ft-elapsed-sub {
  color: var(--text-muted);
  letter-spacing: .12em;
  text-transform: uppercase;
  text-align: center;
  margin-top: 4px;
  font-family: JetBrains Mono, monospace;
  font-size: 9.5px;
  font-weight: 600;
  display: block;
}

.floating-timer-expanded .ft-recent-toggle {
  border: none;
  border-top: 1px solid var(--border-subtle);
  width: 100%;
  color: var(--accent-cyan);
  cursor: pointer;
  background: none;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  font-family: Inter, system-ui, sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  transition: background .12s;
  display: flex;
}

.floating-timer-expanded .ft-recent-toggle:hover:not(:disabled) {
  background: var(--bg-surface-2);
}

.floating-timer-expanded .ft-recent-toggle:disabled {
  color: var(--text-muted);
  cursor: not-allowed;
}

.floating-timer-expanded .ft-recent-toggle.is-open {
  background: var(--accent-cyan);
}

@supports (color: color-mix(in lab, red, red)) {
  .floating-timer-expanded .ft-recent-toggle.is-open {
    background: color-mix(in srgb, var(--accent-cyan) 10%, var(--bg-surface-2));
  }
}

.floating-timer-expanded .ft-recent-arr {
  font-size: 11px;
}

.floating-timer-expanded .ft-recent-count {
  color: var(--text-muted);
  letter-spacing: .06em;
  margin-left: 4px;
  font-family: JetBrains Mono, monospace;
  font-size: 10px;
}

.floating-timer-expanded .ft-recent-list {
  border-top: 1px solid var(--border-subtle);
  max-height: 220px;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
}

.floating-timer-expanded .ft-recent-row {
  width: 100%;
  color: var(--text-primary);
  text-align: left;
  cursor: pointer;
  background: none;
  border: none;
  border-left: 2px solid #0000;
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  font-family: Inter, system-ui, sans-serif;
  font-size: 12.5px;
  transition: background .12s, border-color .12s;
  display: flex;
}

.floating-timer-expanded .ft-recent-row:hover:not(:disabled), .floating-timer-expanded .ft-recent-row:focus-visible:not(:disabled) {
  background: var(--bg-surface-2);
  border-left-color: var(--accent-cyan);
  outline: none;
}

.floating-timer-expanded .ft-recent-row:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.floating-timer-expanded .ft-recent-dot {
  border-radius: 50%;
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
}

.floating-timer-expanded .ft-recent-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  overflow: hidden;
}

.floating-timer-expanded .ft-recent-badge {
  letter-spacing: .08em;
  text-transform: uppercase;
  background: var(--accent-violet);
  color: var(--accent-violet);
  border-radius: 4px;
  padding: 1px 5px;
  font-family: JetBrains Mono, monospace;
  font-size: 9px;
}

@supports (color: color-mix(in lab, red, red)) {
  .floating-timer-expanded .ft-recent-badge {
    background: color-mix(in srgb, var(--accent-violet) 16%, transparent);
  }
}

.floating-timer-expanded .ft-recent-total {
  color: var(--text-secondary);
  font-family: JetBrains Mono, monospace;
  font-size: 10.5px;
}

.topbar-tabs-wrap {
  flex: 1;
  justify-content: center;
  align-items: center;
  min-width: 0;
  display: flex;
}

.topbar-tabs {
  scrollbar-width: none;
  flex-wrap: nowrap;
  align-items: center;
  gap: 2px;
  min-width: 0;
  display: inline-flex;
  overflow-x: auto;
}

.topbar-tabs::-webkit-scrollbar {
  display: none;
}

.topbar-tab-pill {
  color: var(--text-secondary);
  font-family: var(--font-sans);
  white-space: nowrap;
  cursor: pointer;
  border-bottom: 2px solid #0000;
  border-radius: 6px;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-size: 14px;
  font-weight: 400;
  text-decoration: none;
  transition: background 80ms, color 80ms, border-color 80ms;
  display: inline-flex;
}

.topbar-tab-pill:hover {
  background: var(--bg-elevated);
  color: var(--text-primary);
}

.topbar-tab-pill[data-active="true"] {
  color: var(--accent-cyan);
  border-bottom-color: var(--accent-cyan);
  font-weight: 700;
}

.topbar-tab-key {
  font-family: var(--font-mono);
  text-transform: uppercase;
  color: var(--text-muted);
  letter-spacing: .04em;
  background: var(--bg-elevated);
  border-radius: 3px;
  padding: 1px 5px;
  font-size: 11px;
}

.topbar-tab-pill[data-active="true"] .topbar-tab-key {
  color: var(--accent-cyan);
  background: #7dd3fc29;
}

.topbar-tab-sep {
  color: var(--text-muted);
  font-family: var(--font-mono);
  font-size: 11px;
}

.topbar-tab-label {
  font-size: 14px;
  line-height: 1;
}

@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-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-scroll-snap-strictness {
  syntax: "*";
  inherits: false;
  initial-value: proximity;
}

@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-gradient-position {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-via {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #0000;
}

@property --tw-gradient-stops {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-via-stops {
  syntax: "*";
  inherits: false
}

@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%;
}

@property --tw-gradient-via-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 50%;
}

@property --tw-gradient-to-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-leading {
  syntax: "*";
  inherits: false
}

@property --tw-font-weight {
  syntax: "*";
  inherits: false
}

@property --tw-tracking {
  syntax: "*";
  inherits: false
}

@property --tw-ordinal {
  syntax: "*";
  inherits: false
}

@property --tw-slashed-zero {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-figure {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@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-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}

@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-duration {
  syntax: "*";
  inherits: false
}

@property --tw-ease {
  syntax: "*";
  inherits: false
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}


/*# sourceMappingURL=%5Broot-of-the-server%5D__669af12c._.css.map*/