/* [next]/internal/font/google/geist_deef94d5.module.css [app-client] (css) */
@font-face {
  font-family: Geist;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/fef07dbb0973bf53-s.3p2_lha1f2xer.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: Geist;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/8a480f0b521d4e75-s.1qq4vpdcun5oj.woff2") format("woff2");
  unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}

@font-face {
  font-family: Geist;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/53b9e256198e5412-s.390ncx5urfkfu.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: Geist;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/7178b3e590c64307-s.21jp631_3pja2.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: Geist;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/caa3a2e1cccd8315-s.p.0wgildi0cnwt9.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: Geist Fallback;
  src: local(Arial);
  ascent-override: 95.94%;
  descent-override: 28.16%;
  line-gap-override: 0.0%;
  size-adjust: 104.76%;
}

.geist_deef94d5-module__Sms4YG__className {
  font-family: Geist, Geist Fallback;
  font-style: normal;
}

.geist_deef94d5-module__Sms4YG__variable {
  --font-geist-sans: "Geist", "Geist Fallback";
}

/* [next]/internal/font/google/geist_mono_1bf8cbf6.module.css [app-client] (css) */
@font-face {
  font-family: Geist Mono;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/5ce348bf30bf5439-s.31988l_ccedte.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: Geist Mono;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/4fa387ec64143e14-s.2tuy5pz7dlieh.woff2") format("woff2");
  unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}

@font-face {
  font-family: Geist Mono;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/6306c77e7c8268e4-s.2dbetqa9o8jxf.woff2") format("woff2");
  unicode-range: U+2000-2001, U+2004-2008, U+200A, U+23B8-23BD, U+2500-259F;
}

@font-face {
  font-family: Geist Mono;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/7d817b4c03b0c5f1-s.1uyisp29ctx0d.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: Geist Mono;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/bbc41e54d2fcbd21-s.1rgnod-3esatf.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: Geist Mono;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/797e433ab948586e-s.p.0r6juujl39pe6.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: Geist Mono Fallback;
  src: local(Arial);
  ascent-override: 74.67%;
  descent-override: 21.92%;
  line-gap-override: 0.0%;
  size-adjust: 134.59%;
}

.geist_mono_1bf8cbf6-module__FlyLvG__className {
  font-family: Geist Mono, Geist Mono Fallback;
  font-style: normal;
}

.geist_mono_1bf8cbf6-module__FlyLvG__variable {
  --font-geist-mono: "Geist Mono", "Geist Mono Fallback";
}

/* [project]/src/app/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-space-y-reverse: 0;
      --tw-border-style: solid;
      --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;
      --tw-contain-size: initial;
      --tw-contain-layout: initial;
      --tw-contain-paint: initial;
      --tw-contain-style: initial;
      --tw-space-x-reverse: 0;
    }
  }
}

:root {
  --studio-type-meta: 12px;
  --studio-type-body: 13px;
  --studio-type-title: 14px;
  --studio-type-pane: 16px;
  --studio-type-page: 20px;
  --studio-type-hero: 24px;
  --studio-leading-meta: 16px;
  --studio-leading-body: 20px;
  --studio-leading-title: 20px;
  --studio-leading-pane: 24px;
  --studio-leading-page: 28px;
  --studio-w-regular: 400;
  --studio-w-medium: 500;
  --studio-w-semibold: 600;
  --studio-space-1: 4px;
  --studio-space-2: 8px;
  --studio-space-3: 12px;
  --studio-space-4: 16px;
  --studio-space-5: 24px;
  --studio-space-6: 32px;
  --studio-space-7: 48px;
  --studio-space-pane-x: 16px;
  --studio-space-rail-x: 8px;
  --studio-space-stack: 12px;
  --studio-radius-chip: 4px;
  --studio-radius-control: 10px;
  --studio-radius-panel: 8px;
  --studio-radius-overlay: 12px;
  --studio-radius-round: 999px;
  --studio-h-icon: 28px;
  --studio-h-close: 28px;
  --studio-h-control: 32px;
  --studio-h-head: 36px;
  --studio-h-row: 36px;
  --cursor-head-h: 36px;
  --cursor-section-h: 36px;
  --studio-h-composer: 44px;
  --studio-z-base: 0;
  --studio-z-sticky: 10;
  --studio-z-rail: 20;
  --studio-z-drawer: 30;
  --studio-z-dropdown: 40;
  --studio-z-overlay: 50;
  --studio-z-sheet: 60;
  --studio-z-dialog: 70;
  --studio-z-toast: 80;
  --studio-z-tooltip: 90;
  --studio-dur-fast: .12s;
  --studio-dur-overlay: .18s;
  --studio-ease: cubic-bezier(.22, 1, .36, 1);
  --studio-fs-2xs: var(--studio-type-meta);
  --studio-fs-xs: var(--studio-type-meta);
  --studio-fs-sm: var(--studio-type-meta);
  --studio-fs-md: var(--studio-type-title);
  --studio-fs-lg: var(--studio-type-pane);
  --studio-fs-xl: var(--studio-type-pane);
  --studio-fs-2xl: var(--studio-type-page);
  --studio-fs-3xl: var(--studio-type-hero);
  --studio-w-strong: var(--studio-w-semibold);
  --studio-w-bold: var(--studio-w-semibold);
  --studio-r-xs: var(--studio-radius-chip);
  --studio-r-sm: var(--studio-radius-control);
  --studio-r-md: var(--studio-radius-panel);
  --studio-r-lg: var(--studio-radius-panel);
  --studio-r-xl: var(--studio-radius-overlay);
  --studio-r-2xl: var(--studio-radius-overlay);
  --studio-r-3xl: var(--studio-radius-overlay);
  --studio-r-4xl: var(--studio-radius-overlay);
  --studio-r-pill: var(--studio-radius-round);
  --studio-control-h: var(--studio-h-control);
  --studio-search-h: var(--studio-h-control);
  --studio-chip-h: 26px;
  --studio-chip-pad-x: var(--studio-space-2);
  --studio-chip-fs: var(--studio-type-meta);
  --studio-chip-icon: 12px;
  --studio-chip-count-h: 16px;
  --studio-chip-count-fs: var(--studio-type-meta);
  --studio-pane-title-size: var(--studio-type-pane);
  --studio-section-title-size: var(--studio-type-title);
  --studio-thread-title-size: var(--studio-type-title);
  --studio-label-size: var(--studio-type-title);
  --studio-label-weight: var(--studio-w-medium);
  --studio-input-radius: var(--studio-radius-control);
  --studio-chrome-radius: var(--studio-radius-panel);
  --studio-save-radius: var(--studio-radius-control);
  --studio-save-weight: var(--studio-w-medium);
}

@layer theme {
  :root, :host {
    --font-mono: var(--font-geist-mono, ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    "Liberation Mono",
    monospace);
    --color-red-400: #ff6568;
    --color-amber-400: #fcbb00;
    --color-green-500: #00c758;
    --color-green-600: #00a544;
    --color-emerald-400: #00d294;
    --color-sky-400: #00bcfe;
    --color-blue-500: #3080ff;
    --color-slate-900: #0f172b;
    --color-black: #000;
    --color-white: #fff;
    --spacing: .25rem;
    --container-sm: 24rem;
    --container-lg: 32rem;
    --container-2xl: 42rem;
    --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-medium: 500;
    --font-weight-semibold: 600;
    --tracking-tight: -.025em;
    --tracking-wide: .025em;
    --tracking-widest: .1em;
    --leading-snug: 1.375;
    --leading-relaxed: 1.625;
    --radius-2xl: 1rem;
    --radius-3xl: 1.5rem;
    --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;
    --blur-xs: 4px;
    --blur-sm: 8px;
    --blur-2xl: 40px;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-geist-sans), ui-sans-serif, system-ui, sans-serif;
    --default-mono-font-family: var(--font-geist-mono, ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    "Liberation Mono",
    monospace);
    --color-mos-composer: var(--mos-composer);
    --color-cursor-bg: var(--mos-bg);
    --color-cursor-sidebar: var(--mos-sidebar);
    --color-cursor-editor: var(--mos-panel);
    --color-cursor-chat: var(--mos-bg);
    --color-cursor-border: var(--mos-border);
    --color-cursor-border-soft: var(--mos-border-soft);
    --color-cursor-border-subtle: var(--mos-border-subtle);
    --color-cursor-muted: var(--mos-muted);
    --color-cursor-text: var(--mos-text);
    --color-cursor-text-soft: var(--mos-text-soft);
    --color-cursor-hover: var(--mos-hover);
    --color-cursor-active: var(--mos-active);
    --color-cursor-accent: var(--mos-accent);
    --color-cursor-composer: var(--mos-composer);
    --color-input: var(--input);
  }

  @supports (color: lab(0% 0 0)) {
    :root, :host {
      --color-red-400: lab(63.7053% 60.745 31.3109);
      --color-amber-400: lab(80.1641% 16.6016 99.2089);
      --color-green-500: lab(70.5521% -66.5147 45.8073);
      --color-green-600: lab(59.0978% -58.6621 41.2579);
      --color-emerald-400: lab(75.0771% -60.7313 19.4147);
      --color-sky-400: lab(70.687% -23.6078 -45.9483);
      --color-blue-500: lab(54.1736% 13.3369 -74.6839);
      --color-slate-900: lab(7.78673% 1.82345 -15.0537);
    }
  }
}

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

  ::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]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }

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

  a {
    color: inherit;
    -webkit-text-decoration: 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 {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  ::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 {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-year-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-month-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-day-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-hour-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-minute-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-second-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-millisecond-field {
    padding-block: 0;
  }

  ::-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"]) {
    appearance: button;
  }

  ::file-selector-button {
    appearance: button;
  }

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

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

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

@layer components;

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

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

  .\!visible {
    visibility: visible !important;
  }

  .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: 0;
  }

  .inset-y-0 {
    inset-block: 0;
  }

  .top-0 {
    top: 0;
  }

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

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

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

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

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

  .right-0 {
    right: 0;
  }

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

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

  .bottom-0 {
    bottom: 0;
  }

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

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

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

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

  .left-0 {
    left: 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-50 {
    z-index: 50;
  }

  .container {
    width: 100%;
  }

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

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

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

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

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

  .m-0 {
    margin: 0;
  }

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

  .m-auto {
    margin: auto;
  }

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

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

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

  .-my-2\.5 {
    margin-block: calc(var(--spacing) * -2.5);
  }

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

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

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

  .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-5 {
    margin-top: calc(var(--spacing) * 5);
  }

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

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

  .mr-1 {
    margin-right: var(--spacing);
  }

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

  .mb-0 {
    margin-bottom: 0;
  }

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

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

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

  .mb-3\.5 {
    margin-bottom: calc(var(--spacing) * 3.5);
  }

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

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

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

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

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

  .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;
  }

  .table {
    display: table;
  }

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

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

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

  .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-5 {
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
  }

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

  .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-\[40\%\] {
    width: 40%;
    height: 40%;
  }

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

  .h-0 {
    height: 0;
  }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  .h-\[var\(--studio-h-control\,32px\)\] {
    height: var(--studio-h-control, 32px);
  }

  .h-\[var\(--studio-h-row\,36px\)\] {
    height: var(--studio-h-row, 36px);
  }

  .h-dvh {
    height: 100dvh;
  }

  .h-full {
    height: 100%;
  }

  .h-px {
    height: 1px;
  }

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

  .max-h-0 {
    max-height: 0;
  }

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

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

  .max-h-dvh {
    max-height: 100dvh;
  }

  .min-h-0 {
    min-height: 0;
  }

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

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

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

  .w-0 {
    width: 0;
  }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  .w-full {
    width: 100%;
  }

  .w-px {
    width: 1px;
  }

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

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

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

  .max-w-\[80\%\] {
    max-width: 80%;
  }

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

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

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

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

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

  .min-w-0 {
    min-width: 0;
  }

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

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

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

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

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

  .flex-1 {
    flex: 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-dropdown-menu-content-transform-origin\) {
    transform-origin: var(--radix-dropdown-menu-content-transform-origin);
  }

  .origin-\[--radix-popover-content-transform-origin\] {
    transform-origin: --radix-popover-content-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);
  }

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

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

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

  .scale-\[60\%\] {
    scale: 60%;
  }

  .scale-\[80\%\] {
    scale: 80%;
  }

  .rotate-180 {
    rotate: 180deg;
  }

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

  .transform-gpu {
    transform: translateZ(0) 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-pointer {
    cursor: pointer;
  }

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

  .resize {
    resize: both;
  }

  .resize-none {
    resize: none;
  }

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

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

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

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

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

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

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

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

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

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

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

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

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

  .gap-0 {
    gap: 0;
  }

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

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

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

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

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

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

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

  :where(.space-y-1 > :not(:last-child)) {
    --tw-space-y-reverse: 0;
    margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
    margin-block-end: calc(var(--spacing) * 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-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-stretch {
    align-self: stretch;
  }

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

  .overflow-auto {
    overflow: auto;
  }

  .overflow-hidden {
    overflow: hidden;
  }

  .overflow-visible {
    overflow: visible;
  }

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

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

  .rounded {
    border-radius: .25rem;
  }

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

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

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

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

  .rounded-\[var\(--studio-radius-control\,6px\)\] {
    border-radius: var(--studio-radius-control, 6px);
  }

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

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

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

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

  .rounded-xl {
    border-radius: calc(var(--radius) + 4px);
  }

  .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-2 {
    border-top-style: var(--tw-border-style);
    border-top-width: 2px;
  }

  .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-dotted {
    --tw-border-style: dotted;
    border-style: dotted;
  }

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

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

  .border-current\/15 {
    border-color: currentColor;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .border-current\/15 {
      border-color: color-mix(in oklab, currentcolor 15%, transparent);
    }
  }

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

  .border-cursor-border-soft {
    border-color: var(--mos-border-soft);
  }

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

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

  .border-mos-accent\/30 {
    border-color: var(--mos-accent);
  }

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

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

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

  .border-mos-error\/25 {
    border-color: var(--mos-error);
  }

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

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

  .border-muted-foreground\/20 {
    border-color: var(--muted-foreground);
  }

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

  .border-slate-900\/15 {
    border-color: #0f172b26;
  }

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

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

  .border-white\/15 {
    border-color: #ffffff26;
  }

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

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

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

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

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

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

  .bg-black\/40 {
    background-color: #0006;
  }

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

  .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-black\/80 {
    background-color: #000c;
  }

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

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

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

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

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

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

  .bg-cursor-editor {
    background-color: var(--mos-panel);
  }

  .bg-cursor-hover\/40 {
    background-color: var(--mos-hover);
  }

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

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

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

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

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

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

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

  .bg-mos-accent\/85 {
    background-color: var(--mos-accent);
  }

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

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

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

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

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

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

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

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

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

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

  .bg-mos-surface\/95 {
    background-color: var(--mos-surface);
  }

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

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

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

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

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

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

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

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

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

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

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

  .bg-slate-900\/5 {
    background-color: #0f172b0d;
  }

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

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

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

  .bg-white\/\[0\.03\] {
    background-color: #ffffff08;
  }

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

  .\[mask-image\:linear-gradient\(to_right\,transparent\,black_10px\,black_calc\(100\%-10px\)\,transparent\)\] {
    -webkit-mask-image: linear-gradient(to right, #0000, #000 10px calc(100% - 10px), #0000);
    mask-image: linear-gradient(to right, #0000, #000 10px calc(100% - 10px), #0000);
  }

  .bg-\[length\:250\%_100\%\,auto\] {
    background-size: 250% 100%, auto;
  }

  .bg-clip-text {
    -webkit-background-clip: text;
    background-clip: text;
  }

  .\[background-repeat\:no-repeat\,padding-box\] {
    background-repeat: no-repeat,padding-box;
  }

  .fill-current {
    fill: currentColor;
  }

  .p-0 {
    padding: 0;
  }

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

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

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

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

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

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

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

  .\!px-0 {
    padding-inline: 0 !important;
  }

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

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

  .px-1 {
    padding-inline: var(--spacing);
  }

  .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-3\.5 {
    padding-inline: calc(var(--spacing) * 3.5);
  }

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

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

  .\!py-1 {
    padding-block: var(--spacing) !important;
  }

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

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

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

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

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

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

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

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

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

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

  .pt-0 {
    padding-top: 0;
  }

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

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

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

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

  .pb-\[max\(2rem\,env\(safe-area-inset-bottom\)\)\] {
    padding-bottom: max(2rem, env(safe-area-inset-bottom));
  }

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

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

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

  .font-mono {
    font-family: var(--font-geist-mono, ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    "Liberation Mono",
    monospace);
  }

  .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-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-\[10px\] {
    font-size: 10px;
  }

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

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

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

  .text-\[length\:var\(--studio-type-body\,13px\)\] {
    font-size: var(--studio-type-body, 13px);
  }

  .text-\[length\:var\(--studio-type-title\,14px\)\] {
    font-size: var(--studio-type-title, 14px);
  }

  .leading-5 {
    --tw-leading: calc(var(--spacing) * 5);
    line-height: calc(var(--spacing) * 5);
  }

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

  .leading-relaxed {
    --tw-leading: var(--leading-relaxed);
    line-height: var(--leading-relaxed);
  }

  .leading-snug {
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
  }

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

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

  .tracking-\[0\.06em\] {
    --tw-tracking: .06em;
    letter-spacing: .06em;
  }

  .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-widest {
    --tw-tracking: var(--tracking-widest);
    letter-spacing: var(--tracking-widest);
  }

  .break-words {
    overflow-wrap: break-word;
  }

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

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

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

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

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

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

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

  .text-cursor-text {
    color: var(--mos-text);
  }

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

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

  .text-emerald-400\/90 {
    color: #00d294e6;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-emerald-400\/90 {
      color: color-mix(in oklab, var(--color-emerald-400) 90%, transparent);
    }
  }

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

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

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

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

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

  .text-inherit {
    color: inherit;
  }

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

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

  .text-mos-error {
    color: var(--mos-error);
  }

  .text-mos-faint {
    color: var(--mos-faint);
  }

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

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

  .text-mos-text-bright {
    color: var(--mos-text-bright);
  }

  .text-mos-text-soft {
    color: var(--mos-text-soft);
  }

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

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

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

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

  .text-red-400\/90 {
    color: #ff6568e6;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-red-400\/90 {
      color: color-mix(in oklab, var(--color-red-400) 90%, transparent);
    }
  }

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

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

  .text-slate-900\/45 {
    color: #0f172b73;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-slate-900\/45 {
      color: color-mix(in oklab, var(--color-slate-900) 45%, transparent);
    }
  }

  .text-slate-900\/55 {
    color: #0f172b8c;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-slate-900\/55 {
      color: color-mix(in oklab, var(--color-slate-900) 55%, transparent);
    }
  }

  .text-slate-900\/70 {
    color: #0f172bb3;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .text-slate-900\/70 {
      color: color-mix(in oklab, var(--color-slate-900) 70%, transparent);
    }
  }

  .text-transparent {
    color: #0000;
  }

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

  .capitalize {
    text-transform: capitalize;
  }

  .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;
  }

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

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

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

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

  .antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

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

  .opacity-0 {
    opacity: 0;
  }

  .opacity-20 {
    opacity: .2;
  }

  .opacity-50 {
    opacity: .5;
  }

  .opacity-60 {
    opacity: .6;
  }

  .opacity-70 {
    opacity: .7;
  }

  .opacity-80 {
    opacity: .8;
  }

  .opacity-85 {
    opacity: .85;
  }

  .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-\[0_0_8px_color-mix\(in_srgb\,var\(--mos-accent\)_12\%\,transparent\)\] {
    --tw-shadow: 0 0 8px var(--tw-shadow-color, var(--mos-accent));
  }

  @supports (color: color-mix(in lab, red, red)) {
    .shadow-\[0_0_8px_color-mix\(in_srgb\,var\(--mos-accent\)_12\%\,transparent\)\] {
      --tw-shadow: 0 0 8px var(--tw-shadow-color, color-mix(in srgb,var(--mos-accent) 12%,transparent));
    }
  }

  .shadow-\[0_0_8px_color-mix\(in_srgb\,var\(--mos-accent\)_12\%\,transparent\)\] {
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[0_20px_48px_rgba\(0\,0\,0\,0\.4\)\] {
    --tw-shadow: 0 20px 48px var(--tw-shadow-color, #0006);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[0_24px_80px_rgba\(0\,0\,0\,0\.34\)\] {
    --tw-shadow: 0 24px 80px var(--tw-shadow-color, #00000057);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .shadow-\[inset_0_0_0_1px_var\(--color-input\)\,0_1px_2px_0_rgba\(0\,0\,0\,0\.05\)\] {
    --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, var(--color-input)), 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);
  }

  .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, .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);
  }

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

  .ring-offset-background {
    --tw-ring-offset-color: var(--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, );
  }

  .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);
    -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
  }

  .backdrop-blur-2xl {
    --tw-backdrop-blur: blur(var(--blur-2xl));
    -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
  }

  .backdrop-blur-sm {
    --tw-backdrop-blur: blur(var(--blur-sm));
    -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
  }

  .backdrop-blur-xs {
    --tw-backdrop-blur: blur(var(--blur-xs));
    -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
    backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
  }

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

  .transition {
    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-\[opacity\,transform\,width\] {
    transition-property: opacity, transform, width;
    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-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;
  }

  .delay-50 {
    transition-delay: 50ms;
  }

  .duration-150 {
    --tw-duration: .15s;
    transition-duration: .15s;
  }

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

  .duration-300 {
    --tw-duration: .3s;
    transition-duration: .3s;
  }

  .ease-\[cubic-bezier\(0\.22\,1\,0\.36\,1\)\] {
    --tw-ease: cubic-bezier(.22,1,.36,1);
    transition-timing-function: cubic-bezier(.22, 1, .36, 1);
  }

  .ease-\[cubic-bezier\(0\.34\,1\.56\,0\.64\,1\)\] {
    --tw-ease: cubic-bezier(.34,1.56,.64,1);
    transition-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  .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);
  }

  .contain-size {
    --tw-contain-size: size;
    contain: var(--tw-contain-size, ) var(--tw-contain-layout, ) var(--tw-contain-paint, ) var(--tw-contain-style, );
  }

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

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

  .\[--base-color\:var\(--muted-foreground\)\] {
    --base-color: var(--muted-foreground);
  }

  .\[--shimmer-bg\:linear-gradient\(90deg\,transparent_calc\(50\%-var\(--spread\)\)\,var\(--shimmer-color\)\,transparent_calc\(50\%\+var\(--spread\)\)\)\] {
    --shimmer-bg: linear-gradient(90deg,transparent calc(50% - var(--spread)),var(--shimmer-color),transparent calc(50% + var(--spread)));
  }

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

  @media (hover: hover) {
    .group-hover\/player\:opacity-100:is(:where(.group\/player):hover *) {
      opacity: 1;
    }
  }

  .group-\[\.is-assistant\]\:bg-secondary:is(:where(.group).is-assistant *) {
    background-color: var(--secondary);
  }

  .group-\[\.is-assistant\]\:text-foreground:is(:where(.group).is-assistant *) {
    color: var(--foreground);
  }

  .group-\[\.is-user\]\:max-w-\[80\%\]:is(:where(.group).is-user *) {
    max-width: 80%;
  }

  .group-\[\.is-user\]\:bg-primary:is(:where(.group).is-user *) {
    background-color: var(--primary);
  }

  .group-\[\.is-user\]\:bg-secondary:is(:where(.group).is-user *) {
    background-color: var(--secondary);
  }

  .group-\[\.is-user\]\:px-4:is(:where(.group).is-user *) {
    padding-inline: calc(var(--spacing) * 4);
  }

  .group-\[\.is-user\]\:py-3:is(:where(.group).is-user *) {
    padding-block: calc(var(--spacing) * 3);
  }

  .group-\[\.is-user\]\:text-foreground:is(:where(.group).is-user *) {
    color: var(--foreground);
  }

  .group-\[\.is-user\]\:text-primary-foreground:is(:where(.group).is-user *) {
    color: var(--primary-foreground);
  }

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

  @media (hover: hover) {
    .hover\:scale-110:hover {
      --tw-scale-x: 110%;
      --tw-scale-y: 110%;
      --tw-scale-z: 110%;
      scale: var(--tw-scale-x) var(--tw-scale-y);
    }
  }

  @media (hover: hover) {
    .hover\:border-cursor-accent\/50:hover {
      border-color: var(--mos-accent);
    }

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

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

  @media (hover: hover) {
    .hover\:bg-black\/50:hover {
      background-color: #00000080;
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  .focus\:border-cursor-accent:focus {
    border-color: var(--mos-accent);
  }

  .focus\:border-mos-accent\/50:focus {
    border-color: var(--mos-accent);
  }

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

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

  .focus\:text-accent-foreground:focus {
    color: var(--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(--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-none:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

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

  .focus-visible\:opacity-100:focus-visible {
    opacity: 1;
  }

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

  .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(--destructive);
  }

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

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

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

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

  .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-40:disabled {
    opacity: .4;
  }

  .disabled\:opacity-45:disabled {
    opacity: .45;
  }

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

  .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);
  }

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

  .aria-invalid\:ring-destructive\/20[aria-invalid="true"] {
    --tw-ring-color: var(--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(--destructive) 20%, transparent);
    }
  }

  .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-\[highlighted\=true\]\:bg-primary[data-highlighted="true"] {
    background-color: var(--primary);
  }

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

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

  .data-\[orientation\=vertical\]\:min-h-44[data-orientation="vertical"] {
    min-height: calc(var(--spacing) * 44);
  }

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

  .data-\[orientation\=vertical\]\:flex-col[data-orientation="vertical"] {
    flex-direction: column;
  }

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

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

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

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

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

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

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

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

  .data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant="destructive"]:focus {
    background-color: var(--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(--destructive) 10%, transparent);
    }
  }

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

  @media (min-width: 40rem) {
    .sm\:w-48 {
      width: calc(var(--spacing) * 48);
    }
  }

  @media (min-width: 40rem) {
    .sm\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

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

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

  @media (min-width: 40rem) {
    :where(.sm\:space-x-2 > :not(:last-child)) {
      --tw-space-x-reverse: 0;
      margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
      margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
    }
  }

  @media (min-width: 40rem) {
    .sm\:rounded-lg {
      border-radius: var(--radius);
    }
  }

  @media (min-width: 40rem) {
    .sm\:p-7 {
      padding: calc(var(--spacing) * 7);
    }
  }

  @media (min-width: 40rem) {
    .sm\:px-5 {
      padding-inline: calc(var(--spacing) * 5);
    }
  }

  @media (min-width: 40rem) {
    .sm\:px-6 {
      padding-inline: calc(var(--spacing) * 6);
    }
  }

  @media (min-width: 40rem) {
    .sm\:px-7 {
      padding-inline: calc(var(--spacing) * 7);
    }
  }

  @media (min-width: 40rem) {
    .sm\:py-8 {
      padding-block: calc(var(--spacing) * 8);
    }
  }

  @media (min-width: 40rem) {
    .sm\:py-10 {
      padding-block: calc(var(--spacing) * 10);
    }
  }

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

  @media (min-width: 40rem) {
    .sm\:text-sm {
      font-size: var(--text-sm);
      line-height: var(--tw-leading, var(--text-sm--line-height));
    }
  }

  @media (min-width: 48rem) {
    .md\:h-10 {
      height: calc(var(--spacing) * 10);
    }
  }

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

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

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

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

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

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

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

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

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

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

  @media (prefers-color-scheme: dark) {
    .dark\:opacity-\[0\.1\] {
      opacity: .1;
    }
  }

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

  @media (prefers-color-scheme: dark) {
    .dark\:\[--shimmer-color\:var\(--foreground\)\] {
      --shimmer-color: var(--foreground);
    }
  }

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

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

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

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

  @media (prefers-color-scheme: dark) {
    .dark\:focus-visible\:ring-destructive\/40:focus-visible {
      --tw-ring-color: var(--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(--destructive) 40%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:aria-invalid\:ring-destructive\/40[aria-invalid="true"] {
      --tw-ring-color: var(--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(--destructive) 40%, transparent);
      }
    }
  }

  @media (prefers-color-scheme: dark) {
    .dark\:data-\[variant\=destructive\]\:focus\:bg-destructive\/20[data-variant="destructive"]:focus {
      background-color: var(--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(--destructive) 20%, transparent);
      }
    }
  }

  .\[\&_\[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(--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: 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\]\:size-4 svg {
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
  }

  .\[\&_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(--muted-foreground);
  }

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

  .\[\&\>\*\:first-child\]\:mt-0 > :first-child {
    margin-top: 0;
  }

  .\[\&\>\*\:last-child\]\:mb-0 > :last-child {
    margin-bottom: 0;
  }

  .\[\&\>div\]\:transition-none > div {
    transition-property: none;
  }
}

html::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar-track {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar-thumb {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar-corner {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar-button {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

:is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage) {
  overscroll-behavior-y: contain;
  touch-action: pan-y;
  min-height: 0;
  scrollbar-width: thin !important;
  scrollbar-color: var(--color-cursor-muted, var(--mos-muted)) transparent !important;
}

@supports (color: color-mix(in lab, red, red)) {
  :is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage) {
    scrollbar-color: color-mix(in srgb, var(--color-cursor-muted, var(--mos-muted)) 34%, transparent) transparent !important;
  }
}

:is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage)::-webkit-scrollbar-thumb {
  border: 2px solid #0000;
  border-radius: 999px;
  min-height: 28px;
  background: var(--color-cursor-muted, var(--mos-muted)) padding-box !important;
  display: block !important;
}

@supports (color: color-mix(in lab, red, red)) {
  :is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage)::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--color-cursor-muted, var(--mos-muted)) 34%, transparent) padding-box !important;
  }
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-body::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-conversations::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-list-host .studio-dm-conversations::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-search-results::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-body::-webkit-scrollbar-thumb {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-conversations::-webkit-scrollbar-thumb {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.chat, .mos-chat {
  --chat-text-size: 14px;
  --chat-text-leading: 1.65;
  --chat-ui-size: 13px;
  --chat-ui-leading: 1.45;
  --chat-text-color: var(--mos-text, var(--text, #d4d4d4));
  --chat-text-muted: var(--mos-muted, var(--text-muted, #8a8a8a));
  --chat-text-faint: var(--mos-faint, var(--text-faint, #666));
  --chat-sheen-base: var(--mos-muted, var(--text-muted, #8a8a8a));
  --chat-sheen-highlight: var(--mos-text-bright, var(--text, #e8e8e8));
  --font-body: var(--font-geist-sans), ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: var(--font-geist-mono), ui-monospace, "SF Mono", Menlo, monospace;
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizelegibility;
}

.chat .md-prose, .mos-chat .md-prose, .chat .flow-text, .mos-chat .flow-text {
  font-size: var(--chat-text-size);
  line-height: var(--chat-text-leading);
  letter-spacing: -.006em;
  color: var(--chat-text-color, var(--text, #d4d4d4));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 400;
}

.chat .md-prose > :first-child, .mos-chat .md-prose > :first-child {
  margin-top: 0;
}

.chat .md-prose > :last-child, .mos-chat .md-prose > :last-child {
  margin-bottom: 0;
}

.chat .md-prose h1, .chat .md-prose h2, .chat .md-prose h3, .chat .md-prose h4, .mos-chat .md-prose h1, .mos-chat .md-prose h2, .mos-chat .md-prose h3, .mos-chat .md-prose h4 {
  font-family: var(--font-body);
  letter-spacing: -.012em;
  color: var(--chat-text-color, var(--mos-text-bright, var(--text)));
  font-weight: 600;
  line-height: 1.35;
}

.chat .md-prose h1, .mos-chat .md-prose h1 {
  margin: 1.1em 0 .45em;
  font-size: 1.14em;
}

.chat .md-prose h2, .mos-chat .md-prose h2 {
  margin: 1em 0 .4em;
  font-size: 1.08em;
}

.chat .md-prose h3, .mos-chat .md-prose h3 {
  color: var(--chat-text-color, var(--mos-text, var(--text)));
  margin: .95em 0 .35em;
  font-size: 1.02em;
}

.chat .md-prose h4, .mos-chat .md-prose h4 {
  color: var(--chat-text-muted, var(--mos-muted, var(--text-muted)));
  margin: .85em 0 .3em;
  font-size: .98em;
}

.chat .md-prose p, .mos-chat .md-prose p {
  margin: .55em 0;
}

.chat .md-prose p + ul, .chat .md-prose p + ol, .mos-chat .md-prose p + ul, .mos-chat .md-prose p + ol {
  margin-top: .35em;
}

.chat .md-prose ul, .chat .md-prose ol, .mos-chat .md-prose ul, .mos-chat .md-prose ol {
  margin: .5em 0;
}

.chat .md-prose ul > li:before, .mos-chat .md-prose ul > li:before {
  background: var(--chat-text-muted, var(--mos-muted, var(--text-muted)));
  opacity: .7;
  width: 4px;
  height: 4px;
  top: .62em;
}

.chat .md-prose strong, .mos-chat .md-prose strong {
  color: var(--chat-text-color, var(--mos-text-bright, var(--text)));
  font-weight: 600;
}

.chat .md-prose code, .mos-chat .md-prose code {
  font-size: .9em;
  font-family: var(--font-mono);
}

.chat .md-prose pre code, .mos-chat .md-prose pre code {
  font-size: 13px;
  line-height: 1.55;
}

.chat .flow-planning-text, .mos-chat .flow-planning-text, .chat .flow-status-line, .mos-chat .flow-status-line, .chat .flow-tool-bar, .mos-chat .flow-tool-bar {
  font-size: var(--chat-ui-size);
  line-height: var(--chat-ui-leading);
  letter-spacing: -.004em;
  font-weight: 400;
}

.chat .flow-tool-bar, .mos-chat .flow-tool-bar {
  color: var(--chat-text-muted, var(--mos-muted, var(--text-muted)));
}

.chat .flow-tool-bar.is-live, .mos-chat .flow-tool-bar.is-live {
  color: var(--chat-text-color, var(--mos-text, var(--text)));
}

.mos-md, .md-prose {
  --mos-text: var(--chat-text-color, var(--text, #d8d8d8));
  --mos-muted: var(--chat-text-muted, var(--text-muted, #9a9a9a));
  --mos-accent: var(--accent, #facc62);
  --mos-font: var(--font-body, var(--font-geist-sans), ui-sans-serif, system-ui, sans-serif);
  --mos-mono: var(--font-mono, var(--font-geist-mono), ui-monospace, monospace);
  font-family: var(--mos-font);
  font-size: var(--chat-text-size, 15px);
  line-height: var(--chat-text-leading, 1.68);
  letter-spacing: -.008em;
  color: var(--mos-text);
  word-wrap: break-word;
  overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 400;
}

.mos-md > :first-child, .md-prose > :first-child {
  margin-top: 0;
}

.mos-md > :last-child, .md-prose > :last-child {
  margin-bottom: 0;
}

.mos-md h1, .mos-md h2, .mos-md h3, .mos-md h4, .md-prose h1, .md-prose h2, .md-prose h3, .md-prose h4 {
  font-family: var(--mos-font);
  letter-spacing: -.018em;
  color: var(--mos-text);
  font-weight: 600;
  line-height: 1.32;
}

.mos-md h1, .md-prose h1 {
  margin: 1.15em 0 .42em;
  font-size: 1.12em;
}

.mos-md h2, .md-prose h2 {
  margin: 1.05em 0 .38em;
  font-size: 1.06em;
}

.mos-md h3, .md-prose h3 {
  color: var(--mos-text);
  margin: .95em 0 .34em;
  font-size: 1em;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-md h3, .md-prose h3 {
    color: color-mix(in srgb, var(--mos-text) 88%, var(--mos-accent));
  }
}

.mos-md h4, .md-prose h4 {
  color: var(--mos-muted);
  margin: .85em 0 .3em;
  font-size: .96em;
}

.mos-md p, .md-prose p {
  margin: .62em 0;
}

.mos-md p + ul, .mos-md p + ol, .md-prose p + ul, .md-prose p + ol {
  margin-top: .32em;
}

.mos-md ul, .mos-md ol, .md-prose ul, .md-prose ol {
  margin: .58em 0;
  padding-left: 0;
}

.mos-md ul, .md-prose ul {
  list-style: none;
}

.mos-md ul > li, .md-prose ul > li {
  margin: .38em 0;
  padding-left: 1.15em;
  position: relative;
}

.mos-md ul > li:before, .md-prose ul > li:before {
  content: "";
  background: var(--mos-accent);
  opacity: .72;
  border-radius: 50%;
  width: 5px;
  height: 5px;
  position: absolute;
  top: .68em;
  left: .15em;
}

.mos-md ol, .md-prose ol {
  padding-left: 1.35em;
}

.mos-md ol > li, .md-prose ol > li {
  margin: .38em 0;
  padding-left: .12em;
}

.mos-md li > p, .md-prose li > p {
  margin: .22em 0;
}

.mos-md li.mos-task, .md-prose li.mos-task {
  padding-left: 0;
  list-style: none;
}

.mos-md li.mos-task:before, .md-prose li.mos-task:before {
  display: none;
}

.mos-md input[type="checkbox"], .md-prose input[type="checkbox"] {
  vertical-align: -.15em;
  accent-color: var(--mos-accent);
  margin: 0 .5em 0 0;
}

.mos-md hr, .md-prose hr {
  background: linear-gradient(90deg, transparent, var(--mos-text), transparent);
  border: none;
  height: 1px;
  margin: 1.1em 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-md hr, .md-prose hr {
    background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--mos-text) 18%, transparent), transparent);
  }
}

.mos-md strong, .md-prose strong {
  color: var(--mos-text);
  font-weight: 600;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-md strong, .md-prose strong {
    color: color-mix(in srgb, var(--mos-text) 96%, white);
  }
}

.mos-md em, .md-prose em {
  color: var(--mos-muted);
  font-style: italic;
}

.mos-md code, .md-prose code {
  font-family: var(--mos-mono);
  background: var(--mos-text);
  font-size: .86em;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-md code, .md-prose code {
    background: color-mix(in srgb, var(--mos-text) 7%, transparent);
  }
}

.mos-md code, .md-prose code {
  border: 1px solid var(--mos-border-soft, var(--border));
  border-radius: 6px;
  padding: .12em .38em;
}

.mos-code, .code-shell {
  border: 1px solid var(--mos-border, var(--border));
  background: var(--mos-panel, var(--surface));
  border-radius: 10px;
  margin: .82em 0;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-code, .code-shell {
    background: color-mix(in srgb, var(--mos-panel, var(--surface)) 88%, var(--mos-bg, var(--bg)));
  }
}

.mos-code, .code-shell {
  box-shadow: none;
}

.mos-code-bar, .code-shell-head {
  border-bottom: 1px solid var(--mos-border-soft, var(--border));
  background: var(--mos-panel, var(--surface));
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-code-bar, .code-shell-head {
    background: color-mix(in srgb, var(--mos-panel, var(--surface)) 72%, var(--mos-bg, var(--bg)));
  }
}

.mos-code-lang, .code-lang {
  font-family: var(--mos-mono);
  text-transform: lowercase;
  letter-spacing: .05em;
  color: var(--mos-muted);
  font-size: .68rem;
  font-weight: 500;
}

.mos-code-body, .mos-md pre, .md-prose pre, .mos-md .code-block, .md-prose .code-block {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  background: none;
  border: none;
  border-radius: 0;
  margin: 0;
  padding: 12px 14px;
  overflow-x: auto;
}

.mos-code-body code, .mos-md pre code, .md-prose pre code {
  font-family: var(--mos-mono);
  white-space: pre;
  background: none;
  border: none;
  padding: 0;
  font-size: .8125rem;
  line-height: 1.55;
}

.mos-md a, .md-prose a {
  color: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-md a, .md-prose a {
    color: color-mix(in srgb, var(--mos-accent) 78%, #7eb8ff);
  }
}

.mos-md a, .md-prose a {
  border-bottom: 1px solid var(--mos-accent);
  text-decoration: none;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-md a, .md-prose a {
    border-bottom: 1px solid color-mix(in srgb, var(--mos-accent) 32%, transparent);
  }
}

.mos-md a:active, .md-prose a:active {
  opacity: .85;
}

.mos-md blockquote, .md-prose blockquote {
  border-left: 3px solid var(--mos-accent);
  margin: .78em 0;
  padding: .55em 0 .55em .95em;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-md blockquote, .md-prose blockquote {
    border-left: 3px solid color-mix(in srgb, var(--mos-accent) 45%, transparent);
  }
}

.mos-md blockquote, .md-prose blockquote {
  color: var(--mos-muted);
}

.mos-md blockquote p, .md-prose blockquote p {
  margin: .28em 0;
}

.mos-md img, .md-prose img {
  border-radius: 12px;
  max-width: 100%;
  height: auto;
  margin: .72em 0;
  display: block;
}

.mos-table-wrap, .md-table-wrap {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
  border: 1px solid var(--mos-border, var(--border));
  background: none;
  border-radius: 8px;
  width: 100%;
  max-width: 100%;
  max-height: none;
  margin: .78em 0;
  overflow: auto visible;
}

.mos-md table, .md-prose table {
  border-collapse: collapse;
  width: max-content;
  min-width: 100%;
  font-size: .8125rem;
  line-height: 1.48;
}

.mos-md thead th, .md-prose thead th {
  z-index: 1;
  text-align: left;
  color: var(--mos-text);
  background: none;
  font-size: .875rem;
  font-weight: 600;
  position: sticky;
  top: 0;
}

.mos-md th, .mos-md td, .md-prose th, .md-prose td {
  border-bottom: 1px solid var(--mos-border-soft, var(--border));
  border-right: 1px solid var(--mos-border-soft, var(--border));
  vertical-align: top;
  background: none;
  padding: 8px 12px;
}

.mos-md th:last-child, .mos-md td:last-child, .md-prose th:last-child, .md-prose td:last-child {
  border-right: none;
}

.mos-md tbody tr:last-child td, .md-prose tbody tr:last-child td {
  border-bottom: none;
}

.mos-md.stream-plain, .md-prose.stream-plain {
  white-space: normal;
}

.mos-md.stream-plain p, .md-prose.stream-plain p {
  white-space: pre-wrap;
  margin: 0;
}

@keyframes chat-typing-wave {
  0%, 60%, 100% {
    opacity: .35;
    transform: translateY(0)scale(.85);
  }

  30% {
    opacity: 1;
    transform: translateY(-6px)scale(1);
  }
}

@keyframes chat-blink {
  50% {
    opacity: 0;
  }
}

@keyframes chat-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes chat-tool-pulse {
  0%, 100% {
    box-shadow: 0 0 #facc6200;
  }

  50% {
    box-shadow: 0 0 0 3px #facc621f;
  }
}

@keyframes chat-await-shimmer {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(200%);
  }
}

@keyframes chat-pulse-await-border {
  0%, 100% {
    border-color: #facc6259;
  }

  50% {
    border-color: #facc62a6;
  }
}

@keyframes chat-msg-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes chat-status-in {
  from {
    opacity: 0;
    transform: translateY(-2px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes typing-wave {
  0%, 60%, 100% {
    opacity: .35;
    transform: translateY(0)scale(.85);
  }

  30% {
    opacity: 1;
    transform: translateY(-6px)scale(1);
  }
}

@keyframes blink {
  50% {
    opacity: 0;
  }
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes tool-pulse {
  0%, 100% {
    box-shadow: 0 0 #facc6200;
  }

  50% {
    box-shadow: 0 0 0 3px #facc621f;
  }
}

@keyframes await-shimmer {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(200%);
  }
}

@keyframes pulse-await-border {
  0%, 100% {
    border-color: #facc6259;
  }

  50% {
    border-color: #facc62a6;
  }
}

@keyframes mic-record-pulse {
  0%, 100% {
    box-shadow: 0 0 #f8717133;
  }

  50% {
    box-shadow: 0 0 0 3px #f8717100;
  }
}

@keyframes mic-record-ring {
  0% {
    opacity: .55;
    transform: scale(1);
  }

  75%, 100% {
    opacity: 0;
    transform: scale(1.45);
  }
}

@keyframes mic-composer-glow {
  0%, 100% {
    border-top-color: #f8717142;
    box-shadow: inset 0 1px #f871710f;
  }

  50% {
    border-top-color: #f871717a;
    box-shadow: inset 0 1px #f8717124;
  }
}

@keyframes mic-transcribe-ring {
  to {
    transform: rotate(360deg);
  }
}

@keyframes chat-sheen-slide {
  0% {
    background-position: 150%;
  }

  100% {
    background-position: -50%;
  }
}

@keyframes planning-shimmer-slide {
  0% {
    background-position: 150%;
  }

  100% {
    background-position: -50%;
  }
}

.chat .chat-sheen-text, .mos-chat .chat-sheen-text {
  background: linear-gradient(90deg, var(--chat-sheen-base, #8a8a8a) 0%, var(--chat-sheen-base, #8a8a8a) 38%, var(--chat-sheen-highlight, #e4e4e4) 50%, var(--chat-sheen-base, #8a8a8a) 62%, var(--chat-sheen-base, #8a8a8a) 100%);
  -webkit-text-fill-color: transparent;
  color: #0000;
  background-size: 250% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  animation: 2s linear infinite chat-sheen-slide;
  display: inline;
}

.chat .chat-sheen-text--subtle, .mos-chat .chat-sheen-text--subtle {
  background: linear-gradient(90deg, var(--chat-sheen-base, #8a8a8a) 0%, var(--chat-sheen-base, #8a8a8a) 42%, #e4e4e4d1 50%, var(--chat-sheen-base, #8a8a8a) 58%, var(--chat-sheen-base, #8a8a8a) 100%);
  background-size: 250% 100%;
  animation-duration: 2.2s;
}

@keyframes chat-tool-bar-breathe {
  0%, 100% {
    box-shadow: none;
    border-color: #ffffff14;
  }

  50% {
    box-shadow: none;
    border-color: #ffffff24;
  }
}

@keyframes chat-tool-icon-pulse {
  0%, 100% {
    opacity: .62;
    transform: scale(1);
  }

  50% {
    opacity: 1;
    transform: scale(1.08);
  }
}

@keyframes flow-status-chev-pulse {
  0%, 100% {
    opacity: .35;
    transform: translateX(0);
  }

  50% {
    opacity: .85;
    transform: translateX(2px);
  }
}

.chat .flow-planning, .mos-chat .flow-planning {
  align-items: center;
  margin-top: 6px;
  padding: 1px 0 2px;
  display: inline-flex;
}

.chat .flow-planning--tight, .mos-chat .flow-planning--tight {
  margin-top: 4px;
}

.chat .flow-planning-text, .mos-chat .flow-planning-text {
  letter-spacing: -.004em;
}

.chat .flow-planning-text--live, .mos-chat .flow-planning-text--live {
  color: #0000;
  -webkit-text-fill-color: transparent;
  background: linear-gradient(90deg, var(--chat-sheen-base, #8a8a8a) 0%, var(--chat-sheen-base, #8a8a8a) 38%, var(--chat-sheen-highlight, #e8e8e8) 50%, var(--chat-sheen-base, #8a8a8a) 62%, var(--chat-sheen-base, #8a8a8a) 100%);
  background-size: 250% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  animation: 2s linear infinite planning-shimmer-slide;
  display: inline;
}

@media (prefers-reduced-motion: reduce) {
  .chat .flow-planning-text--live, .mos-chat .flow-planning-text--live {
    color: var(--chat-text-muted, #8a8a8a);
    -webkit-text-fill-color: var(--chat-text-muted, #8a8a8a);
    background: none;
    animation: none;
  }
}

.chat .flow-tool-bar.is-live, .mos-chat .flow-tool-bar.is-live {
  animation: 2.6s ease-in-out infinite chat-tool-bar-breathe !important;
}

.chat .flow-tool-bar-icon--live, .mos-chat .flow-tool-bar-icon--live {
  animation: 1.7s ease-in-out infinite chat-tool-icon-pulse;
}

.chat .flow-tool-bar-chev--live, .mos-chat .flow-tool-bar-chev--live {
  animation: 1.4s ease-in-out infinite flow-status-chev-pulse;
}

.chat .flow-status-line.is-active, .mos-chat .flow-status-line.is-active {
  animation: .2s ease-out chat-msg-in;
}

.chat .flow-status-line.is-live, .mos-chat .flow-status-line.is-live {
  position: relative;
}

.chat .flow-status-chev, .mos-chat .flow-status-chev {
  animation: 1.5s ease-in-out infinite flow-status-chev-pulse;
}

.chat .flow-status-line.is-planning, .mos-chat .flow-status-line.is-planning {
  color: var(--text-muted);
  font-size: .8125rem;
}

.chat-spin svg, .mos-animate-spin svg, .icon-inline.chat-spin svg {
  transform-origin: center;
  animation: .85s linear infinite chat-spin !important;
}

.chat .typing-dots span, .mos-chat .typing-dots span {
  will-change: transform, opacity;
  animation: 1.4s ease-in-out infinite chat-typing-wave !important;
}

.chat .typing-dots span:nth-child(2), .mos-chat .typing-dots span:nth-child(2) {
  animation-delay: .2s !important;
}

.chat .typing-dots span:nth-child(3), .mos-chat .typing-dots span:nth-child(3) {
  animation-delay: .4s !important;
}

.chat .stream-cursor, .mos-chat .stream-cursor {
  animation: .8s step-end infinite chat-blink !important;
}

.chat .agent-wait, .mos-chat .agent-wait {
  animation: .22s ease-out chat-msg-in;
}

.chat .flow-status, .mos-chat .flow-status {
  animation: .2s ease-out chat-status-in;
}

.chat .msg-assistant.streaming-live, .mos-chat .msg-assistant.streaming-live {
  animation: .28s ease-out chat-msg-in;
}

.mos-chat .flow-tool-card.is-live, .chat .flow-tool-card.is-live {
  animation: 1.2s ease-in-out infinite tool-pulse !important;
}

.mos-chat .flow-tool-group.is-live, .chat .flow-tool-group.is-live {
  animation: 1.4s ease-in-out infinite tool-pulse !important;
}

.mos-chat .flow-tool-card.is-live .flow-tool-icon-spin svg, .mos-chat .flow-tool-icon-spin svg, .chat .flow-tool-icon-spin svg {
  transform-origin: center;
  animation: .9s linear infinite spin !important;
}

.mos-chat .flow-tool-await-bar:after, .chat .flow-tool-await-bar:after {
  animation: 1.2s ease-in-out infinite await-shimmer !important;
}

.mos-chat .flow-question.is-pending, .chat .flow-question.is-pending {
  animation: 2.4s ease-in-out infinite pulse-await-border !important;
}

@media (prefers-reduced-motion: reduce) {
  .chat *, .mos-chat * {
    scroll-behavior: auto !important;
  }

  .chat .typing-dots span, .mos-chat .typing-dots span, .chat .stream-cursor, .mos-chat .stream-cursor, .chat-spin svg, .mos-animate-spin svg, .mos-chat .flow-tool-icon-spin svg, .chat .flow-tool-icon-spin svg, .mos-chat .flow-tool-card.is-live, .chat .flow-tool-card.is-live, .mos-chat .flow-tool-group.is-live, .chat .flow-tool-group.is-live, .mos-chat .flow-tool-await-bar:after, .chat .flow-tool-await-bar:after, .mos-chat .flow-question.is-pending, .chat .flow-question.is-pending, .mos-chat .flow-planning-text--live, .chat .flow-planning-text--live, .mos-chat .chat-sheen-text, .chat .chat-sheen-text, .mos-chat .flow-tool-bar.is-live, .chat .flow-tool-bar.is-live, .mos-chat .flow-tool-bar-icon--live, .chat .flow-tool-bar-icon--live, .mos-chat .flow-tool-bar-chev--live, .chat .flow-tool-bar-chev--live, .mos-chat .flow-status-chev, .chat .flow-status-chev {
    animation: none !important;
    transform: none !important;
  }

  .mos-chat .flow-planning-text--live, .chat .flow-planning-text--live, .mos-chat .chat-sheen-text, .chat .chat-sheen-text {
    color: var(--chat-text-muted, #8a8a8a) !important;
    -webkit-text-fill-color: var(--chat-text-muted, #8a8a8a) !important;
    background: none !important;
  }

  .mos-chat .flow-tool-await-bar:after, .chat .flow-tool-await-bar:after {
    display: none !important;
  }
}

.mos-tooltip {
  z-index: 100000;
  max-width: min(300px, 100vw - 20px);
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  letter-spacing: .01em;
  color: var(--mos-text-bright);
  text-align: center;
  white-space: pre-wrap;
  word-break: break-word;
  pointer-events: none;
  opacity: 0;
  background: var(--mos-surface);
  border-radius: 10px;
  padding: 7px 11px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  transition: opacity .16s, transform .16s cubic-bezier(.22, 1, .36, 1);
  position: fixed;
  transform: translateY(5px)scale(.985);
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-tooltip {
    background: color-mix(in srgb, var(--mos-surface) 70%, transparent);
  }
}

.mos-tooltip {
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
  border: 1px solid var(--mos-border);
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-tooltip {
    border: 1px solid color-mix(in srgb, var(--mos-border) 65%, #ffffff24);
  }
}

.mos-tooltip {
  box-shadow: 0 10px 40px #00000061, inset 0 0 0 1px #ffffff0d;
}

.mos-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0)scale(1);
}

.mos-tooltip.is-below {
  transform: translateY(-5px)scale(.985);
}

.mos-tooltip.is-below.is-visible {
  transform: translateY(0)scale(1);
}

[data-appearance="light"] .mos-tooltip {
  color: #18181b;
  background: #ffffffd1;
  border-color: #d4d4d453;
  box-shadow: 0 10px 36px #0f172a1f, inset 0 0 0 1px #ffffffa6;
}

@media (prefers-reduced-motion: reduce) {
  .mos-tooltip {
    transition: opacity 10ms linear;
    transform: none;
  }

  .mos-tooltip.is-visible, .mos-tooltip.is-below.is-visible {
    transform: none;
  }
}

*, :before, :after {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  scrollbar-gutter: auto !important;
}

html::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar-track {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar-thumb {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar-corner {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

::-webkit-scrollbar-button {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

:is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage) {
  overscroll-behavior-y: contain;
  touch-action: pan-y;
  min-height: 0;
  scrollbar-width: thin !important;
  scrollbar-color: var(--color-cursor-muted, var(--mos-muted)) transparent !important;
}

@supports (color: color-mix(in lab, red, red)) {
  :is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage) {
    scrollbar-color: color-mix(in srgb, var(--color-cursor-muted, var(--mos-muted)) 34%, transparent) transparent !important;
  }
}

:is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage)::-webkit-scrollbar {
  width: 7px !important;
  height: 7px !important;
  display: block !important;
}

:is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage)::-webkit-scrollbar-track {
  background: none !important;
  display: block !important;
}

:is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage)::-webkit-scrollbar-thumb {
  border: 2px solid #0000;
  border-radius: 999px;
  min-height: 28px;
  background: var(--color-cursor-muted, var(--mos-muted)) padding-box !important;
  display: block !important;
}

@supports (color: color-mix(in lab, red, red)) {
  :is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-settings-workspace-body, .studio-chrome-rail-body, .cursor-explorer-body, .cursor-settings-body, .studio-site-preview-stage)::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--color-cursor-muted, var(--mos-muted)) 34%, transparent) padding-box !important;
  }
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-body, .studio-polish.is-studio-mobile .studio-dm-conversations, .studio-polish.is-studio-mobile .studio-dm-list-host .studio-dm-conversations, .studio-polish.is-studio-mobile .studio-dm-search-results {
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-body::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-conversations::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-list-host .studio-dm-conversations::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-search-results::-webkit-scrollbar {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-body::-webkit-scrollbar-thumb {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-conversations::-webkit-scrollbar-thumb {
  background: none !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

* {
  box-sizing: border-box;
}

.cursor-resize {
  background: var(--color-cursor-border-soft);
  width: 1px;
  cursor: var(--studio-cursor-resize-x, ew-resize);
  transition: background .12s;
}

.cursor-resize:hover, .cursor-resize[data-resize-handle-active] {
  background: #3a3a3a;
  width: 2px;
}

.cursor-resize-v {
  background: var(--color-cursor-border);
  width: 100%;
  height: 1px;
  cursor: var(--studio-cursor-resize-y, ns-resize);
  flex-shrink: 0;
  transition: background .12s;
}

.cursor-resize-v:hover, .cursor-resize-v[data-resize-handle-active] {
  background: #3a3a3a;
  height: 2px;
}

[data-panel-group] {
  min-width: 0;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

[data-panel] {
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

[data-panel] > * {
  flex: 1;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

:root {
  --cursor-head-h: 36px;
  --cursor-section-h: 36px;
  --cursor-accent: var(--mos-accent);
  --cursor-accent-hover: var(--mos-accent-hover);
  --cursor-accent-dim: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --cursor-accent-dim: color-mix(in srgb, var(--mos-accent) 14%, transparent);
  }
}

:root {
  --cursor-accent-border: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --cursor-accent-border: color-mix(in srgb, var(--mos-accent) 28%, transparent);
  }
}

:root {
  --cursor-on-accent: #fff;
  --color-cursor-on-accent: var(--cursor-on-accent);
  --cursor-ease: .14s ease;
  --cursor-surface: var(--mos-surface);
  --cursor-surface-raised: var(--mos-surface);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --cursor-surface-raised: color-mix(in srgb, var(--mos-surface) 92%, var(--mos-bg));
  }
}

:root {
  --cursor-surface-overlay: var(--mos-hover);
  --cursor-surface-input: var(--mos-panel);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --cursor-surface-input: color-mix(in srgb, var(--mos-panel) 88%, var(--mos-bg));
  }
}

:root {
  --cursor-border-subtle: var(--mos-border-subtle, var(--mos-border-soft));
  --cursor-border-focus: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --cursor-border-focus: color-mix(in srgb, var(--mos-accent) 38%, var(--mos-border-subtle, var(--mos-border-soft)));
  }
}

:root {
  --desk-folder-edge: var(--color-cursor-border-soft, var(--mos-border-soft));
  --cursor-shadow-pop: 0 8px 28px #0000007a;
  --cursor-shadow-menu: 0 0 1px #0006, 0 0 8px #00000047;
  --cursor-radius-xs: var(--studio-r-xs, 4px);
  --cursor-radius-sm: var(--studio-r-sm, 6px);
  --cursor-radius-md: var(--studio-r-md, 8px);
  --cursor-radius-lg: var(--studio-r-lg, 10px);
  --cursor-radius-xl: var(--studio-r-xl, 12px);
  --cursor-radius-2xl: var(--studio-r-2xl, 14px);
  --cursor-radius-3xl: var(--studio-r-3xl, 16px);
  --cursor-radius-4xl: var(--studio-r-4xl, 18px);
  --cursor-radius-pill: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  --cursor-radius-capsule: var(--studio-r-pill, 999px);
  --cursor-composer-radius: var(--desk-composer-radius, var(--studio-r-3xl, 16px));
  --cursor-radius: var(--cursor-radius-lg);
  --desk-text-2xs: var(--studio-type-meta, 12px);
  --desk-text-xs: var(--studio-type-meta, 12px);
  --desk-text-sm: var(--studio-type-meta, 12px);
  --desk-text-ui: var(--studio-type-body, 13px);
  --desk-text-base: var(--studio-type-pane, 16px);
  --desk-text-lg: var(--studio-fs-xl, 18px);
  --desk-fm-label-size: 11px;
  --desk-fm-tile-radius: 24px;
  --desk-w-medium: var(--studio-w-medium, 500);
  --desk-w-semibold: var(--studio-w-semibold, 600);
  --desk-w-strong: var(--studio-w-strong, 650);
  --desk-w-bold: var(--studio-w-bold, 700);
  --desk-leading: 1.65;
  --desk-leading-tight: 1.45;
  --desk-composer-max: 680px;
  --desk-chat-thread-max: var(--desk-composer-max);
  --cursor-unified-tab-width: 172px;
}

[data-appearance="light"] {
  --cursor-shadow-pop: 0 8px 24px #0000001f;
  --cursor-shadow-menu: 0 0 1px #00000014, 0 0 8px #0000001a;
}

.cursor-panel-head {
  min-height: var(--cursor-head-h);
  height: var(--cursor-head-h);
  border-bottom: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-sidebar);
  box-sizing: border-box;
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  display: flex;
}

.studio-polish .cursor-workspace-head.cursor-panel-head {
  border: 0 !important;
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft)) !important;
}

.cursor-panel-head-tools {
  z-index: 260;
  isolation: auto;
  pointer-events: auto;
  flex-shrink: 0;
  align-items: center;
  gap: 2px;
  margin-left: auto;
  display: flex;
  position: relative;
}

.cursor-icon-btn-sm {
  width: var(--studio-h-icon, 28px);
  height: var(--studio-h-icon, 28px);
  min-width: var(--studio-h-icon, 28px);
  min-height: var(--studio-h-icon, 28px);
  border-radius: var(--studio-radius-control, 6px);
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
  padding: 0;
  line-height: 0;
  display: inline-flex;
}

.cursor-icon-btn-sm svg {
  flex-shrink: 0;
  display: block;
}

.cursor-bottom-pane {
  height: 100%;
  min-height: 0;
}

.cursor-bottom-pane.hidden {
  display: none !important;
}

.cursor-sidebar-head {
  gap: 2px;
  padding: 0 6px 0 8px;
}

.cursor-project-btn {
  border-radius: var(--cursor-radius-md, var(--studio-r-md, 8px));
  min-width: 0;
  color: var(--color-cursor-muted);
  font-size: var(--studio-fs-md, 14px);
  letter-spacing: .01em;
  cursor: pointer;
  text-align: left;
  transition: background var(--cursor-ease), color var(--cursor-ease);
  background: none;
  border: none;
  flex: 1;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  font-weight: 600;
  display: flex;
}

.cursor-project-btn:hover {
  background: var(--color-cursor-hover);
  color: var(--color-cursor-text);
}

.cursor-icon-btn {
  width: var(--studio-h-icon, 28px);
  height: var(--studio-h-icon, 28px);
  border-radius: var(--studio-radius-control, 6px);
  color: var(--color-cursor-muted);
  cursor: pointer;
  transition: background var(--cursor-ease), color var(--cursor-ease);
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  justify-content: center;
  align-items: center;
  display: flex;
}

.studio-panel-close, .cursor-icon-btn.studio-panel-close, .cursor-icon-btn-sm.studio-panel-close {
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px)) !important;
}

.studio-panel-close:hover, .studio-panel-close:active, .studio-panel-close:focus-visible, .cursor-icon-btn.studio-panel-close:hover, .cursor-icon-btn.studio-panel-close:active, .cursor-icon-btn.studio-panel-close:focus-visible, .cursor-icon-btn-sm.studio-panel-close:hover, .cursor-icon-btn-sm.studio-panel-close:active, .cursor-icon-btn-sm.studio-panel-close:focus-visible {
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px)) !important;
}

.studio-panel-close svg, .cursor-icon-btn.studio-panel-close svg, .cursor-icon-btn-sm.studio-panel-close svg {
  width: 18px;
  height: 18px;
}

.icon-inline {
  vertical-align: middle;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: inline-flex;
}

.icon-inline, .icon-inline svg {
  pointer-events: none;
}

.cursor-icon-btn:hover:not(:disabled), .cursor-icon-btn:active:not(:disabled) {
  background: var(--color-cursor-hover);
  color: var(--color-cursor-text);
  border-radius: var(--studio-radius-control, 6px);
}

.cursor-icon-btn:focus-visible {
  outline: 2px solid var(--cursor-accent-border);
  outline-offset: 1px;
}

.cursor-icon-btn.active {
  background: var(--cursor-accent-dim);
  color: var(--cursor-accent);
  border-radius: var(--studio-radius-control, 6px);
}

.cursor-icon-btn:disabled {
  opacity: .35;
  cursor: default;
}

.finance-buckets-panel {
  min-height: 0;
  color: var(--color-cursor-text);
  background: var(--color-cursor-bg);
  flex: 1;
  padding: 18px;
  overflow: auto;
}

.finance-buckets-hero {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-xl);
  background: var(--cursor-surface);
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  display: flex;
}

.finance-kicker, .finance-section-head span, .finance-glance-card span, .finance-bucket-meta, .finance-event-row {
  color: var(--color-cursor-muted);
  font-size: 12px;
}

.finance-kicker {
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 0 0 6px;
}

.finance-buckets-hero h2 {
  margin: 0 0 6px;
  font-size: 20px;
  font-weight: 650;
}

.finance-buckets-hero p {
  max-width: 760px;
  color: var(--color-cursor-muted);
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}

.finance-toolbar {
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  display: flex;
}

.finance-toolbar .finance-input {
  width: auto;
  min-width: 112px;
}

.finance-glance-grid, .finance-actions-grid, .finance-bucket-grid {
  gap: 12px;
  display: grid;
}

.finance-glance-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 12px;
}

.finance-glance-card, .finance-bucket-card, .finance-form-card, .finance-empty {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-lg);
  background: var(--cursor-surface-raised);
}

.finance-glance-card {
  padding: 14px;
}

.finance-glance-card strong {
  margin-top: 6px;
  font-size: 20px;
  font-weight: 700;
  display: block;
}

.finance-glance-card.is-total strong, .finance-bucket-amount {
  color: var(--cursor-accent);
}

.finance-section {
  margin-top: 16px;
}

.finance-section-head {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
  display: flex;
}

.finance-section-head h3, .finance-form-card h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 650;
}

.finance-bucket-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.finance-bucket-card, .finance-form-card, .finance-empty {
  padding: 14px;
}

.finance-bucket-card-head {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  display: flex;
}

.finance-bucket-card-head strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.finance-bucket-card-head span {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.finance-bucket-amount {
  margin-top: 12px;
  font-size: 24px;
  font-weight: 700;
}

.finance-bucket-meta {
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  display: flex;
}

.finance-actions-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 16px;
}

.finance-form-card {
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.finance-row {
  gap: 8px;
  display: flex;
}

.finance-input {
  border: 1px solid var(--color-cursor-border);
  border-radius: var(--cursor-radius-sm);
  background: var(--cursor-surface-input);
  width: 100%;
  min-width: 0;
  color: var(--color-cursor-text);
  font: inherit;
  outline: none;
  padding: 8px 9px;
  font-size: 13px;
}

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

.finance-primary {
  border: 1px solid var(--cursor-accent-border);
  border-radius: var(--cursor-radius-sm);
  background: var(--cursor-accent-dim);
  min-height: 32px;
  color: var(--cursor-accent);
  cursor: pointer;
  justify-content: center;
  align-items: center;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 650;
  display: inline-flex;
}

.finance-primary:disabled {
  opacity: .45;
  cursor: default;
}

.finance-error {
  border-radius: var(--cursor-radius-md);
  color: #fca5a5;
  background: #f871711a;
  border: 1px solid #f8717173;
  margin-top: 12px;
  padding: 10px 12px;
  font-size: 13px;
}

.finance-events {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-lg);
  overflow: hidden;
}

.finance-event-row {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) auto;
  gap: 10px;
  padding: 9px 12px;
  display: grid;
}

.finance-event-row:last-child {
  border-bottom: 0;
}

.finance-event-row strong {
  color: var(--color-cursor-text);
}

.finance-event-row strong.is-negative {
  color: #fca5a5;
}

@media (max-width: 900px) {
  .finance-buckets-panel {
    padding: 12px;
  }

  .finance-glance-grid, .finance-actions-grid {
    grid-template-columns: 1fr;
  }

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

.cursor-settings-sheet {
  background: var(--color-cursor-hover);
  padding: 10px 12px 12px;
}

.cursor-settings-label {
  color: var(--color-cursor-muted);
  margin-bottom: 6px;
  font-size: 11px;
  display: block;
}

select.cursor-select {
  border-radius: var(--cursor-radius-sm);
  border: 1px solid var(--color-cursor-border);
  background: var(--cursor-surface-input);
  width: 100%;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-ui);
  outline: none;
  padding: 6px 8px;
  font-family: inherit;
}

select.cursor-select:focus {
  border-color: var(--cursor-border-focus);
}

.cursor-settings-meta {
  margin-top: 8px;
  font-size: 11px;
}

.cursor-settings-signout {
  border: 1px solid var(--color-cursor-border);
  width: 100%;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border-radius: 6px;
  margin-top: 10px;
  padding: 6px;
  font-size: 12px;
}

.cursor-settings-signout:hover {
  color: var(--color-cursor-text);
  border-color: #444;
}

.cursor-tree-up {
  width: 100%;
  color: var(--color-cursor-muted);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  align-items: center;
  gap: 4px;
  padding: 4px 12px;
  font-size: 12px;
  display: flex;
}

.cursor-tree-up:hover {
  color: var(--color-cursor-text);
}

.cursor-tree-row {
  border-radius: var(--cursor-radius-sm);
  width: calc(100% - 8px);
  color: var(--color-cursor-text);
  font-size: var(--desk-text-ui);
  cursor: pointer;
  text-align: left;
  transition: background var(--cursor-ease);
  background: none;
  border: none;
  align-items: center;
  gap: 6px;
  margin: 0 4px;
  padding: 3px 8px 3px 12px;
  display: flex;
}

@media (hover: hover) {
  .cursor-tree-row:hover {
    background: var(--color-cursor-hover);
  }
}

.cursor-tree-empty {
  color: var(--color-cursor-muted);
  padding: 12px 16px;
  font-size: 12px;
}

.cursor-sidebar-actions {
  align-items: center;
  gap: 2px;
  display: flex;
}

.desk-explorer-create-bar {
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 10px 8px;
  display: flex;
}

.desk-explorer-create-btn {
  border-radius: var(--cursor-radius-sm);
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-overlay-subtle);
  color: var(--color-cursor-text);
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: 11px;
  line-height: 1.2;
  display: inline-flex;
}

.desk-explorer-create-btn:hover {
  background: var(--color-cursor-hover);
  border-color: var(--color-cursor-border);
}

.desk-explorer-view-menu {
  position: relative;
}

.desk-explorer-view-dropdown {
  z-index: 40;
  min-width: 156px;
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
}

.cursor-tree-empty-area {
  min-height: 120px;
}

.cursor-icon-btn.active {
  color: var(--color-cursor-fg, #ececec);
  background: var(--cursor-overlay-hover);
  border-radius: 999px;
}

.cursor-tree-mode {
  gap: 4px;
  padding: 4px 8px 6px;
  display: flex;
}

.cursor-tree-mode-btn {
  color: var(--color-cursor-muted);
  border: 1px solid #0000;
  border-radius: 999px;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  font-size: 11px;
  display: inline-flex;
}

.cursor-tree-mode-btn.active {
  color: var(--color-cursor-text);
  border-color: var(--color-cursor-border);
  background: var(--cursor-overlay-subtle);
}

.cursor-explorer-title {
  cursor: default;
  pointer-events: none;
}

.cursor-explorer-panel {
  background: var(--mos-bg);
  min-height: 0;
  position: relative;
  overflow: hidden;
}

.cursor-explorer-body {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.desk-file-tree-scroll {
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  flex: 1 1 0;
  min-height: 0;
  overflow: hidden auto;
}

.cursor-file-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(100%, clamp(112px, 9.5vw, 152px)), 1fr));
  grid-auto-rows: auto;
  align-items: start;
  gap: 8px;
  padding: 8px 10px 14px;
  display: grid;
}

.desk-file-tree-window-spacer {
  pointer-events: none;
  grid-column: 1 / -1;
}

.desk-file-list {
  gap: 2px;
  padding: 8px 8px 10px;
  display: grid;
}

.desk-file-grid-item {
  border-radius: var(--cursor-radius-sm);
  height: auto;
  min-height: 0;
  color: var(--color-cursor-text);
  cursor: pointer;
  text-align: center;
  transition: background var(--cursor-ease), border-color var(--cursor-ease), box-shadow var(--cursor-ease);
  background: none;
  border: 1px solid #0000;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 0;
  padding: 0;
  font-size: 11px;
  line-height: 1.25;
  display: flex;
  overflow: visible;
}

@media (hover: hover) {
  .desk-file-grid-item:hover {
    background: var(--color-cursor-hover);
    border-color: var(--color-cursor-accent, var(--cursor-accent));
  }

  @supports (color: color-mix(in lab, red, red)) {
    .desk-file-grid-item:hover {
      border-color: color-mix(in srgb, var(--color-cursor-accent, var(--cursor-accent)) 58%, transparent);
    }
  }

  .desk-file-grid-item:hover {
    box-shadow: 0 3px 10px #00000024;
  }
}

.desk-file-preview-grid {
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
  grid-auto-rows: auto;
  align-items: start;
  gap: 10px;
  padding: 10px 12px 16px;
  display: grid;
}

.desk-file-preview-item {
  border: 1px solid var(--color-cursor-border-soft);
  height: auto;
  min-height: 0;
  color: var(--color-cursor-text);
  cursor: pointer;
  transition: border-color var(--cursor-ease), background var(--cursor-ease), box-shadow var(--cursor-ease);
  background: none;
  border-radius: 10px;
  flex-direction: column;
  align-items: stretch;
  padding: 0;
  display: flex;
  overflow: visible;
}

.desk-file-preview-item:hover {
  border-color: var(--color-cursor-accent, var(--cursor-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-preview-item:hover {
    border-color: color-mix(in srgb, var(--color-cursor-accent, var(--cursor-accent)) 58%, transparent);
  }
}

.desk-file-preview-item:hover {
  background: var(--color-cursor-hover);
  box-shadow: 0 3px 10px #00000024;
}

.desk-file-thumb {
  flex-direction: column;
  align-items: stretch;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 0;
  display: flex;
}

.desk-file-thumb-visual {
  background: var(--mos-text-bright, #fff);
  flex: none;
  width: 100%;
  position: relative;
  overflow: clip;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-visual {
    background: color-mix(in srgb, var(--mos-text-bright, #fff) 3.5%, var(--mos-bg, var(--color-cursor-bg)));
  }
}

.desk-file-thumb-visual:has(.desk-file-thumb-image) {
  background: var(--desk-transparency-bg);
  box-shadow: inset 0 0 0 1px var(--desk-transparency-border);
}

.desk-file-thumb-badge {
  z-index: 2;
  color: #ffffffc7;
  pointer-events: none;
  background: none;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0;
}

.desk-file-thumb-reaction {
  z-index: 6;
  box-sizing: border-box;
  aspect-ratio: 1;
  pointer-events: auto;
  cursor: pointer;
  background: var(--mos-plate, #fff);
  border: 0;
  border-radius: 50%;
  place-items: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  padding: 0;
  font-size: 13px;
  line-height: 1;
  display: grid;
  position: absolute;
  top: 5px;
  right: 5px;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-reaction {
    background: color-mix(in srgb, var(--mos-plate, #fff) 88%, transparent);
  }
}

.desk-file-thumb-reaction {
  box-shadow: 0 0 0 1px var(--color-cursor-border, #0000001f), 0 2px 6px #0000001f;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-reaction {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-cursor-border, #0000001f) 70%, transparent), 0 2px 6px #0000001f;
  }
}

.desk-file-thumb-reaction:hover {
  transform: scale(1.08);
}

.desk-file-thumb-shared {
  z-index: 6;
  box-sizing: border-box;
  pointer-events: none;
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted);
  background: var(--mos-plate, #fff);
  border-radius: 50%;
  place-items: center;
  display: grid;
  position: absolute;
  top: 5px;
  left: 5px;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-shared {
    background: color-mix(in srgb, var(--mos-plate, #fff) 88%, transparent);
  }
}

.desk-file-thumb-shared {
  box-shadow: 0 0 0 1px var(--color-cursor-border, #0000001f), 0 2px 6px #0000001f;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-shared {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-cursor-border, #0000001f) 70%, transparent), 0 2px 6px #0000001f;
  }
}

.desk-file-thumb-shared .icon-inline {
  display: flex;
}

[data-appearance="dark"] .desk-file-thumb-shared, :root:not([data-appearance="light"]) .desk-file-thumb-shared {
  background: var(--mos-plate, #1a2333);
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="dark"] .desk-file-thumb-shared, :root:not([data-appearance="light"]) .desk-file-thumb-shared {
    background: color-mix(in srgb, var(--mos-plate, #1a2333) 90%, transparent);
  }
}

[data-appearance="dark"] .desk-file-thumb-shared, :root:not([data-appearance="light"]) .desk-file-thumb-shared {
  box-shadow: 0 0 0 1px #ffffff24, 0 2px 8px #00000059;
}

[data-appearance="dark"] .desk-file-thumb-reaction, :root:not([data-appearance="light"]) .desk-file-thumb-reaction {
  background: var(--mos-plate, #1a2333);
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="dark"] .desk-file-thumb-reaction, :root:not([data-appearance="light"]) .desk-file-thumb-reaction {
    background: color-mix(in srgb, var(--mos-plate, #1a2333) 90%, transparent);
  }
}

[data-appearance="dark"] .desk-file-thumb-reaction, :root:not([data-appearance="light"]) .desk-file-thumb-reaction {
  box-shadow: 0 0 0 1px #ffffff24, 0 2px 8px #00000059;
}

.desk-file-thumb-badge .icon-inline {
  opacity: .82;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: flex;
}

.desk-file-thumb-badge svg {
  stroke-width: 2.1px;
  filter: drop-shadow(0 1px 3px #0000006b);
  width: 22px;
  height: 22px;
  display: block;
}

.desk-file-thumb-badge svg:has( > polygon:only-child) {
  stroke-width: 2.85px;
}

.desk-file-thumb--grid .desk-file-thumb-visual, .desk-file-thumb--preview .desk-file-thumb-visual {
  aspect-ratio: 1;
}

.desk-file-thumb-image, .desk-file-thumb-video, .desk-file-thumb-iframe, .desk-file-thumb-text-wrap, .desk-file-thumb-text, .desk-file-thumb-fallback, .desk-file-thumb-studio, .desk-file-thumb-folder, .desk-file-thumb-audio, .desk-file-thumb-loading {
  width: 100%;
  height: 100%;
}

.desk-file-thumb-studio {
  box-shadow: none;
  background: none;
  border-radius: 0;
  place-items: center;
  display: grid;
}

.desk-file-thumb-studio img {
  object-fit: contain;
  width: 92%;
  height: auto;
  max-height: 94%;
  display: block;
}

.desk-file-thumb-image, .desk-file-thumb-video {
  object-fit: cover;
  object-position: center;
  background: none;
  border: none;
  display: block;
}

.cursor-explorer-panel .desk-file-thumb-visual :is(img, video, .desk-file-thumb-image, .desk-file-thumb-video, .desk-file-thumb-hi, .desk-file-thumb-lqip) {
  object-position: center;
  object-fit: cover !important;
}

.desk-file-thumb-progressive {
  background: var(--mos-text-bright, #fff);
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-progressive {
    background: color-mix(in srgb, var(--mos-text-bright, #fff) 5%, var(--mos-bg, var(--color-cursor-bg)));
  }
}

.desk-file-thumb-skeleton {
  z-index: 0;
  background: var(--mos-text-bright, #fff);
  position: absolute;
  inset: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-skeleton {
    background: color-mix(in srgb, var(--mos-text-bright, #fff) 6%, transparent);
  }
}

.desk-file-thumb-skeleton {
  animation: 1.8s ease-in-out infinite desk-thumb-breathe;
}

.desk-file-thumb-skeleton--logo {
  z-index: 2;
  background: var(--mos-text-bright, #fff);
  place-items: center;
  display: grid;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-skeleton--logo {
    background: color-mix(in srgb, var(--mos-text-bright, #fff) 5%, transparent);
  }
}

.desk-file-thumb-skeleton--logo {
  animation: none;
  overflow: visible;
}

.desk-file-thumb-skeleton--logo .media-load-frame-wave, .desk-file-thumb-skeleton--logo .media-load-frame-wave.is-ring {
  width: var(--logo-loader-ring, 44px);
  height: var(--logo-loader-ring, 44px);
  position: relative;
  inset: auto;
  overflow: visible;
}

.desk-file-thumb-skeleton--logo .logo-loader {
  overflow: visible;
}

.desk-file-thumb-video-wrap {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
}

.desk-folder-video {
  z-index: 5;
  flex: auto;
  width: 100%;
  height: 100%;
  min-height: 0;
  position: relative;
  overflow: visible;
}

.desk-folder-video > .desk-file-thumb-progressive, .desk-folder-video > video {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.desk-folder-video.has-poster > video:not(.is-live) {
  opacity: 0;
  pointer-events: none;
}

.desk-folder-video-play {
  top: var(--desk-thumb-badge-inset, 6px);
  bottom: auto;
  right: auto;
  left: var(--desk-thumb-badge-inset, 6px);
  z-index: 5;
  color: #fffffff5;
  width: 20px;
  height: 20px;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  cursor: pointer;
  background: #0000007a;
  border: none;
  border-radius: 999px;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
  position: absolute;
  transform: none;
}

.desk-folder-video-play svg {
  display: block;
}

.desk-folder-video-play:hover {
  background: #0000008f;
}

[data-appearance="light"] .desk-folder-video-play, [data-appearance="light"] .desk-folder-video-play:hover {
  color: #0f1218e0;
  background: #fffffff0;
  box-shadow: 0 0 0 1px #0f121814, 0 1px 3px #0000002e;
}

.desk-folder-video-hover-line {
  z-index: 4;
  background: var(--cursor-accent);
  width: 1px;
  margin: 0;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-folder-video-hover-line {
    background: color-mix(in srgb, var(--cursor-accent) 52%, transparent);
  }
}

.desk-folder-video-hover-line {
  opacity: 0;
  pointer-events: none;
  will-change: transform;
}

.desk-folder-video-hover-time {
  z-index: 6;
  background: var(--mos-plate);
  color: var(--mos-text, var(--color-cursor-text));
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  border-radius: 4px;
  padding: 1px 5px;
  font-size: 10px;
  line-height: 1.2;
  position: absolute;
  bottom: 10px;
  transform: translateX(-50%);
}

.desk-folder-video-scrub {
  z-index: 7;
  box-sizing: border-box;
  cursor: pointer;
  touch-action: pan-y;
  pointer-events: none;
  align-items: flex-end;
  height: 16px;
  padding: 0;
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.desk-folder-video.is-live .desk-folder-video-scrub {
  pointer-events: auto;
  touch-action: none;
  display: flex;
}

.desk-folder-video-scrub-track {
  background: var(--mos-text);
  border-radius: 0;
  width: 100%;
  height: 2px;
  display: block;
  position: relative;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-folder-video-scrub-track {
    background: color-mix(in srgb, var(--mos-text) 28%, transparent);
  }
}

.desk-folder-video-scrub-track {
  pointer-events: none;
}

.desk-folder-video-scrub-fill {
  background: var(--cursor-accent);
  border-radius: 0;
  height: 100%;
  display: block;
}

.desk-file-thumb-video-wrap video {
  opacity: 0;
  transition: opacity .18s;
}

.desk-file-thumb-video-wrap.is-ready video {
  opacity: 1;
}

.desk-file-thumb-visual.is-video-portrait {
  background: var(--mos-page, var(--mos-bg, var(--color-cursor-bg))) !important;
  box-shadow: inset 0 0 0 1px var(--color-cursor-border-soft) !important;
}

.desk-file-thumb-visual.is-video-portrait .desk-file-thumb-video, .desk-file-thumb-visual.is-video-portrait .desk-file-thumb-video-wrap video, .desk-file-thumb-visual.is-video-portrait .desk-file-thumb-progressive img, .desk-file-thumb-visual.is-video-portrait .desk-file-thumb-hi, .desk-file-thumb-visual.is-video-portrait .desk-file-thumb-lqip {
  object-fit: contain !important;
  object-position: center !important;
}

@keyframes desk-thumb-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes desk-thumb-breathe {
  0%, 100% {
    opacity: .55;
  }

  50% {
    opacity: .9;
  }
}

@keyframes desk-thumb-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.desk-file-thumb-lqip {
  z-index: 1;
  object-fit: cover;
  filter: blur(12px);
  pointer-events: none;
  opacity: .92;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  transform: scale(1.08);
}

.desk-file-thumb-hi {
  z-index: 2;
  object-fit: cover;
  opacity: 0;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
}

.desk-file-thumb-hi.is-loaded {
  opacity: 1;
}

.desk-file-thumb-progressive.is-ready .desk-file-thumb-skeleton {
  opacity: .35;
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  .desk-file-thumb-skeleton {
    animation: none;
  }
}

.desk-folder-peek-card-media .desk-file-thumb-progressive {
  position: absolute;
  inset: 0;
}

.desk-folder-peek-card-media .desk-file-thumb-hi, .desk-folder-peek-card-media .desk-file-thumb-lqip {
  object-fit: cover;
}

.desk-file-thumb-iframe {
  object-fit: cover;
  pointer-events: none;
  background: #111;
  border: none;
  display: block;
}

.desk-file-thumb-fallback, .desk-file-thumb-folder, .desk-file-thumb-audio, .desk-file-thumb-loading {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.desk-file-thumb-audio {
  background: var(--mos-text-bright, #fff);
  position: relative;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-audio {
    background: color-mix(in srgb, var(--mos-text-bright, #fff) 5%, var(--mos-bg, var(--color-cursor-bg)));
  }
}

:not([data-appearance="light"]) .desk-file-thumb-audio {
  background: var(--mos-text-bright, #fff);
}

@supports (color: color-mix(in lab, red, red)) {
  :not([data-appearance="light"]) .desk-file-thumb-audio {
    background: color-mix(in srgb, var(--mos-text-bright, #fff) 6%, var(--mos-panel));
  }
}

[data-appearance="light"] .desk-file-thumb-audio {
  background: var(--mos-plate);
}

.desk-file-thumb-audio--orb {
  overflow: visible;
  background: none !important;
}

.desk-file-thumb-audio--orb, .desk-file-thumb-audio--orb * {
  animation: none !important;
}

.desk-file-thumb-audio-orb.studio-orb-play, .desk-file-thumb-audio-orb.studio-orb-play.is-md {
  width: 56px;
  height: 56px;
}

.desk-file-thumb--preview .desk-file-thumb-audio-orb.studio-orb-play, .desk-file-thumb--preview .desk-file-thumb-audio-orb.studio-orb-play.is-md {
  width: 96px;
  height: 96px;
}

.desk-file-thumb-audio--peek {
  place-items: center;
  display: grid;
  background: none !important;
}

.desk-file-thumb-audio--peek .desk-file-thumb-audio-orb.studio-orb-play, .desk-file-thumb-audio--peek .desk-file-thumb-audio-orb.studio-orb-play.is-md {
  width: 78%;
  max-width: 44px;
  height: 78%;
  max-height: 44px;
}

.desk-file-thumb-audio-wave {
  justify-content: center;
  align-items: center;
  gap: 2px;
  display: flex;
  position: absolute;
  inset: 14% 10%;
}

.desk-file-thumb-audio-wave > span {
  background: linear-gradient(180deg, var(--mos-text-bright, #fff) 0%, var(--mos-text-bright, #fff) 55%, var(--mos-text-bright, #fff) 100%);
  border-radius: 999px;
  flex: 1 1 0;
  min-width: 2px;
  max-width: 4px;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-audio-wave > span {
    background: linear-gradient(180deg, color-mix(in srgb, var(--mos-text-bright, #fff) 72%, transparent) 0%, color-mix(in srgb, var(--mos-text-bright, #fff) 42%, transparent) 55%, color-mix(in srgb, var(--mos-text-bright, #fff) 22%, transparent) 100%);
  }
}

.desk-file-thumb-audio-wave > span {
  opacity: .88;
}

[data-appearance="light"] .desk-file-thumb-audio-wave > span {
  background: linear-gradient(180deg, var(--mos-text) 0%, var(--mos-text) 100%);
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .desk-file-thumb-audio-wave > span {
    background: linear-gradient(180deg, color-mix(in srgb, var(--mos-text) 48%, transparent) 0%, color-mix(in srgb, var(--mos-text) 28%, transparent) 100%);
  }
}

[data-appearance="light"] .desk-file-thumb-audio-wave > span {
  opacity: .78;
}

.desk-file-thumb-audio--peek .desk-file-thumb-audio-wave {
  gap: 1.5px;
  inset: 18% 12%;
}

.desk-file-thumb-audio--peek .desk-file-thumb-audio-wave > span {
  min-width: 1.5px;
  max-width: 3px;
}

.desk-folder-peek-card-media > .desk-file-thumb-audio {
  width: 100%;
  height: 100%;
}

.desk-file-thumb-folder--peek {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
  overflow: visible;
}

.desk-folder-peek-stack {
  aspect-ratio: 1;
  pointer-events: none;
  flex: none;
  width: 64%;
  position: relative;
}

.desk-folder-peek-card {
  border: 1px solid var(--desk-folder-edge, var(--color-cursor-border-soft, var(--mos-border-soft)));
  background: var(--mos-panel);
  box-shadow: none;
  transform-origin: 50%;
  border-radius: 8px;
  flex-direction: column;
  display: flex;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

:not([data-appearance="light"]) .desk-folder-peek-card {
  background: var(--mos-panel);
}

[data-appearance="light"] .desk-folder-peek-card {
  background: var(--mos-plate);
  box-shadow: none;
}

.desk-folder-peek-card-media {
  flex: auto;
  height: 100%;
  min-height: 0;
  position: relative;
  overflow: hidden;
}

.desk-folder-peek-card img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.desk-folder-peek-icon {
  background: var(--mos-bg);
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

:not([data-appearance="light"]) .desk-folder-peek-icon {
  background: var(--mos-text-bright, #fff);
}

@supports (color: color-mix(in lab, red, red)) {
  :not([data-appearance="light"]) .desk-folder-peek-icon {
    background: color-mix(in srgb, var(--mos-text-bright, #fff) 4%, var(--mos-bg));
  }
}

.desk-folder-peek-label {
  box-sizing: border-box;
  width: fit-content;
  max-width: 100%;
  box-shadow: none;
  color: var(--mos-text-soft, var(--color-cursor-muted));
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  font-size: var(--desk-fm-label-size, 11px);
  font-weight: var(--desk-w-semibold, 600);
  letter-spacing: -.01em;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: background-color var(--cursor-ease, .12s ease), border-radius var(--cursor-ease, .12s ease), box-shadow var(--cursor-ease, .12s ease);
  background-color: #0000;
  border: none;
  flex: none;
  align-self: center;
  margin-left: auto;
  margin-right: auto;
  padding: 3px 6px;
  line-height: 1.25;
  display: block;
  overflow: hidden;
}

[data-appearance="light"] .desk-folder-peek-label {
  color: var(--color-cursor-text);
  box-shadow: none;
  background-color: #0000;
}

.desk-folder-peek-card--element .desk-folder-peek-label, [data-appearance="light"] .desk-folder-peek-card--element .desk-folder-peek-label {
  background-color: #0000;
}

.desk-file-thumb-peek-label {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  box-shadow: none;
  color: var(--mos-text-soft, var(--color-cursor-muted));
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  font-size: var(--desk-fm-label-size, 11px);
  font-weight: var(--desk-w-semibold, 600);
  letter-spacing: -.01em;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: background-color var(--cursor-ease, .12s ease), border-radius var(--cursor-ease, .12s ease), box-shadow var(--cursor-ease, .12s ease);
  background-color: #0000;
  border: none;
  flex: none;
  align-self: stretch;
  margin: 0;
  padding: 3px 7px;
  line-height: 1.25;
  display: block;
  overflow: hidden;
}

.desk-file-thumb-peek-label.is-renameable {
  cursor: inherit;
}

@media (hover: hover) and (pointer: fine) {
  .desk-file-thumb-peek-label.is-renameable {
    cursor: text;
  }
}

.desk-file-tree-scroll :is(.desk-file-thumb-peek-label, .desk-file-thumb-title, .desk-file-thumb-label, .desk-file-list-name) {
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.desk-file-thumb-rename-input, .desk-file-list-rename-input {
  box-sizing: border-box;
  background: var(--mos-page, var(--color-cursor-bg));
  width: 100%;
  min-width: 0;
  color: var(--color-cursor-text);
  text-align: center;
  height: auto;
  min-height: 0;
  box-shadow: none;
  z-index: 4;
  border: none;
  border-radius: 0;
  outline: none;
  margin: 0;
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.15;
  display: block;
}

.desk-file-thumb-rename-input--below {
  text-align: left;
  margin-top: 4px;
  font-size: 12px;
}

.desk-file-list-rename-input {
  text-align: left;
  border-radius: 4px;
  flex: auto;
  padding: 2px 6px;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
}

.desk-file-list-name .truncate.is-renameable {
  cursor: inherit;
}

@media (hover: hover) and (pointer: fine) {
  .desk-file-list-name .truncate.is-renameable {
    cursor: text;
  }
}

.desk-file-thumb-peek-wrap .desk-file-thumb-peek-label, .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input {
  z-index: 4;
  box-sizing: border-box;
  appearance: none;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  font-size: var(--desk-fm-label-size, 11px);
  font-weight: var(--desk-w-semibold, 600);
  letter-spacing: -.01em;
  height: auto;
  min-height: 0;
  color: var(--mos-text-soft, var(--color-cursor-muted));
  text-align: center;
  border: none;
  border-radius: 999px;
  flex: none;
  align-self: stretch;
  margin: 0;
  padding: 3px 7px;
  line-height: 1.25;
  position: relative;
}

.desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input, .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input:focus {
  background: var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input, .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input:focus {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 9%, transparent);
  }
}

.desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input, .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input:focus {
  box-shadow: none;
  border: none;
  outline: none;
}

.desk-file-grid-item:is(:hover, :focus-visible, :focus-within, .is-selected, .is-drag-over, [aria-selected="true"]) .desk-file-thumb-peek-wrap:after, .desk-file-preview-item:is(:hover, :focus-visible, :focus-within, .is-selected, .is-drag-over, [aria-selected="true"]) .desk-file-thumb-peek-wrap:after {
  content: "";
  z-index: calc(var(--studio-z-base) + 8);
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0 0 2px var(--cursor-accent, var(--mos-accent, #22c55e));
  display: block;
  position: absolute;
  inset: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-grid-item:is(:hover, :focus-visible, :focus-within, .is-selected, .is-drag-over, [aria-selected="true"]) .desk-file-thumb-peek-wrap:after, .desk-file-preview-item:is(:hover, :focus-visible, :focus-within, .is-selected, .is-drag-over, [aria-selected="true"]) .desk-file-thumb-peek-wrap:after {
    box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--cursor-accent, var(--mos-accent, #22c55e)) 90%, transparent);
  }
}

.desk-file-grid-item:focus-within .desk-file-thumb-peek-wrap, .desk-file-preview-item:focus-within .desk-file-thumb-peek-wrap {
  border-radius: var(--desk-peek-tile-radius, 24px);
}

[data-appearance="light"] .desk-file-thumb-peek-label {
  color: var(--color-cursor-text);
  box-shadow: none;
  background-color: #0000;
}

[data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input, [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input:focus {
  background: var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input, [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input:focus {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 7%, transparent);
  }
}

[data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input, [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-rename-input:focus {
  box-shadow: none;
}

.desk-file-thumb-peek-wrap--element .desk-file-thumb-peek-label, [data-appearance="light"] .desk-file-thumb-peek-wrap--element .desk-file-thumb-peek-label {
  background-color: #0000;
}

.desk-file-thumb-peek-wrap {
  --desk-peek-label-band: calc(1 * (var(--desk-fm-label-size, 11px) * 1.25) + 6px);
  --desk-peek-tile-radius: var(--desk-fm-tile-radius, 24px);
  --desk-thumb-badge-inset: 5px;
  border-radius: var(--desk-peek-tile-radius, 24px);
  background: var(--studio-grid-folder-tile-bg, var(--mos-plate));
  width: 100%;
  height: 100%;
  min-height: 0;
  box-shadow: none;
  flex-direction: column;
  display: flex;
  position: relative;
  overflow: clip;
}

.desk-file-thumb-peek-wrap:after {
  display: none;
}

[data-appearance="light"] .desk-file-thumb-peek-wrap {
  background: var(--studio-grid-folder-tile-bg, var(--mos-plate));
}

[data-appearance="light"] .desk-file-thumb-peek-wrap--element {
  background: var(--mos-plate);
}

.desk-file-thumb-peek-wrap--studio {
  background: none;
}

.desk-file-thumb-peek-wrap--studio:after {
  display: none;
}

[data-appearance="light"] .desk-file-thumb-peek-wrap--studio {
  background: none;
}

.desk-file-thumb-peek-wrap .desk-file-thumb-progressive {
  flex: auto;
  align-self: stretch;
  width: 100%;
  height: 100%;
  min-height: 0;
  position: relative;
  overflow: hidden;
}

.desk-file-thumb-peek-wrap .desk-file-thumb-image, .desk-file-thumb-peek-wrap .desk-file-thumb-video, .desk-file-thumb-peek-wrap .desk-file-thumb-hi, .desk-file-thumb-peek-wrap .desk-file-thumb-lqip {
  object-fit: cover;
  object-position: center;
  flex: auto;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.desk-file-thumb-peek-wrap > .desk-file-thumb-fallback, .desk-file-thumb-peek-wrap > .desk-file-thumb-studio, .desk-file-thumb-peek-wrap > .desk-file-thumb-audio, .desk-file-thumb-peek-wrap > .desk-file-thumb-text-wrap, .desk-file-thumb-peek-wrap > .desk-file-thumb-loading, .desk-file-thumb-peek-wrap > .desk-file-thumb-iframe, .desk-file-thumb-peek-wrap > .desk-file-thumb-video-wrap, .desk-file-thumb-peek-wrap > .desk-folder-video, .desk-file-thumb-peek-wrap > .desk-file-thumb-progressive {
  flex: auto;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: clip;
}

.desk-file-thumb-peek-wrap .desk-file-thumb-peek-label {
  z-index: 4;
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  font-size: var(--desk-fm-label-size, 11px);
  font-weight: var(--desk-w-semibold, 600);
  letter-spacing: -.01em;
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: none;
  padding: 3px 7px;
  line-height: 1.25;
  display: block;
  position: relative;
  overflow: hidden;
}

.desk-file-thumb-title {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  font-size: var(--desk-fm-label-size, 11px);
  background: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 3px 7px;
  line-height: 1;
  display: flex;
}

:is(.desk-file-thumb-title:hover, .desk-file-thumb-peek-wrap .desk-file-thumb-title:has(.desk-file-thumb-rename-input)) {
  background: var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  :is(.desk-file-thumb-title:hover, .desk-file-thumb-peek-wrap .desk-file-thumb-title:has(.desk-file-thumb-rename-input)) {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 9%, transparent);
  }
}

:is([data-appearance="light"] .desk-file-thumb-title:hover, [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-title:has(.desk-file-thumb-rename-input)) {
  background: var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  :is([data-appearance="light"] .desk-file-thumb-title:hover, [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-title:has(.desk-file-thumb-rename-input)) {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 7%, transparent);
  }
}

.desk-file-thumb-title-icon {
  width: 1em;
  height: 1em;
  color: var(--mos-text-soft, var(--color-cursor-muted));
  pointer-events: none;
  flex: none;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: inline-flex;
}

.desk-file-thumb-title-icon svg {
  width: 1em;
  height: 1em;
  display: block;
}

.desk-file-thumb-peek-wrap .desk-file-thumb-title .desk-file-thumb-peek-label, .desk-file-thumb-peek-wrap .desk-file-thumb-title .desk-file-thumb-peek-label:hover, .desk-file-thumb-peek-wrap .desk-file-thumb-title .desk-file-thumb-rename-input, .desk-file-thumb-peek-wrap .desk-file-thumb-title .desk-file-thumb-rename-input:focus {
  width: auto;
  min-width: 0;
  max-width: calc(100% - 1.4em);
  box-shadow: none;
  background: none;
  border-radius: 0;
  flex: 0 auto;
  align-self: center;
  margin: 0;
  padding: 0;
  line-height: 1;
}

.desk-file-thumb-peek-wrap .desk-file-thumb-badge {
  inset: var(--desk-thumb-badge-inset, 6px) auto auto var(--desk-thumb-badge-inset, 6px);
  z-index: 3;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
}

.desk-file-thumb-peek-wrap--folder .desk-file-thumb-folder, .desk-file-thumb-peek-wrap--folder .desk-file-thumb-folder--peek {
  flex: auto;
  width: 100%;
  min-height: 0;
}

.desk-file-thumb-peek-wrap--folder .desk-file-thumb-folder--peek {
  overflow: visible;
}

.desk-file-thumb-peek-wrap--folder .desk-file-thumb-folder:not(.desk-file-thumb-folder--peek) svg {
  opacity: .72;
}

.desk-folder-peek-stack[data-count="1"] .desk-folder-peek-card--0 {
  z-index: 1;
  transform: rotate(0)translate(0)scale(.92);
}

.desk-folder-peek-stack[data-count="2"] .desk-folder-peek-card--0 {
  z-index: 1;
  transform: rotate(-13deg)translate(-20%, 2%)scale(.84);
}

.desk-folder-peek-stack[data-count="2"] .desk-folder-peek-card--1 {
  z-index: 2;
  transform: rotate(13deg)translate(20%, -2%)scale(.9);
}

.desk-folder-peek-stack[data-count="3"] .desk-folder-peek-card--0 {
  z-index: 1;
  transform: rotate(-15deg)translate(-26%, 5%)scale(.8);
}

.desk-folder-peek-stack[data-count="3"] .desk-folder-peek-card--1 {
  z-index: 2;
  transform: rotate(14deg)translate(26%, 3%)scale(.84);
}

.desk-folder-peek-stack[data-count="3"] .desk-folder-peek-card--2 {
  z-index: 3;
  transform: rotate(-1deg)translate(0, -10%)scale(.92);
}

.desk-folder-peek-stack[data-count="4"] .desk-folder-peek-card--0 {
  z-index: 1;
  transform: rotate(-6deg)translate(-22%, -18%)scale(.5);
}

.desk-folder-peek-stack[data-count="4"] .desk-folder-peek-card--1 {
  z-index: 2;
  transform: rotate(5deg)translate(22%, -18%)scale(.5);
}

.desk-folder-peek-stack[data-count="4"] .desk-folder-peek-card--2 {
  z-index: 3;
  transform: rotate(-4deg)translate(-22%, 20%)scale(.5);
}

.desk-folder-peek-stack[data-count="4"] .desk-folder-peek-card--3 {
  z-index: 4;
  transform: rotate(4deg)translate(22%, 20%)scale(.5);
}

.desk-file-thumb-post-mosaic {
  background: var(--mos-bg, #111);
  flex: auto;
  align-self: stretch;
  gap: 2px;
  width: 100%;
  height: 100%;
  min-height: 0;
  display: grid;
  overflow: hidden;
}

.desk-file-thumb-post-mosaic[data-count="1"] {
  grid-template: 1fr / 1fr;
}

.desk-file-thumb-post-mosaic[data-count="2"] {
  grid-template: 1fr / 1fr 1fr;
}

.desk-file-thumb-post-mosaic[data-count="3"] {
  grid-template: 1fr 1fr / 1fr 1fr;
}

.desk-file-thumb-post-mosaic[data-count="3"] .desk-file-thumb-post-cell--0 {
  grid-row: 1 / span 2;
}

.desk-file-thumb-post-mosaic[data-count="4"] {
  grid-template: 1fr 1fr / 1fr 1fr;
}

.desk-file-thumb-post-cell {
  background: var(--mos-text-bright, #fff);
  min-width: 0;
  min-height: 0;
  position: relative;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-post-cell {
    background: color-mix(in srgb, var(--mos-text-bright, #fff) 4%, var(--mos-bg));
  }
}

.desk-file-thumb-post-cell .desk-file-thumb-progressive, .desk-file-thumb-post-cell .desk-file-thumb-audio, .desk-file-thumb-post-cell .desk-file-thumb-video-wrap, .desk-file-thumb-post-cell .desk-folder-peek-icon {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.desk-file-thumb-post-cell .desk-file-thumb-video {
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.desk-file-thumb-peek-wrap--post {
  background: none;
}

.desk-file-thumb-loading {
  background: linear-gradient(90deg, #0000, #ffffff0f, #0000);
  animation: 1.2s infinite desk-file-shimmer;
}

@keyframes desk-file-shimmer {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(100%);
  }
}

.desk-file-thumb-text-wrap, .desk-file-thumb-text {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  color: var(--color-cursor-muted);
  white-space: pre-wrap;
  word-break: break-word;
  text-align: left;
  margin: 0;
  padding: 10px;
  font-size: 10px;
  line-height: 1.35;
  overflow: hidden;
}

.desk-file-thumb-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  width: auto;
  min-width: 0;
  max-width: 100%;
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  font-size: var(--desk-fm-label-size, 11px);
  font-weight: var(--desk-w-semibold, 600);
  letter-spacing: -.01em;
  box-sizing: border-box;
  border-radius: var(--cursor-radius-md, var(--studio-r-md, 8px));
  flex: none;
  align-self: center;
  padding: 3px 7px;
  line-height: 1.25;
  display: block;
  overflow: hidden;
}

.desk-file-thumb-label:hover {
  background: var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-label:hover {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 14%, transparent);
  }
}

.desk-file-thumb-label:hover {
  border-radius: 999px;
}

.desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, .desk-folder-peek-label:hover {
  background: var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, .desk-folder-peek-label:hover {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 9%, transparent);
  }
}

.desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, .desk-folder-peek-label:hover {
  box-shadow: none;
  border-radius: 999px;
}

[data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, [data-appearance="light"] .desk-folder-peek-label:hover {
  background: var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .desk-file-thumb-peek-wrap .desk-file-thumb-peek-label:hover, [data-appearance="light"] .desk-folder-peek-label:hover {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 7%, transparent);
  }
}

.desk-file-list-head, .desk-file-list-row {
  grid-template-columns: minmax(0, 1fr) 108px;
  align-items: center;
  gap: 10px;
  display: grid;
}

.desk-file-list.is-detail .desk-file-list-head, .desk-file-list.is-detail .desk-file-list-row {
  grid-template-columns: minmax(0, 1fr) minmax(96px, 128px) minmax(64px, 80px) minmax(88px, 140px);
  gap: 12px;
}

.desk-file-list-head {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  border-bottom: 1px solid var(--color-cursor-border-soft);
  padding: 3px 8px 5px;
  font-size: 10px;
  font-weight: 600;
}

.desk-file-list-head-date, .desk-file-list-head-size, .desk-file-list-head-kind, .desk-file-list-col-date, .desk-file-list-col-size, .desk-file-list-col-kind {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.desk-file-list-col-date, .desk-file-list-col-size, .desk-file-list-col-kind {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-muted);
  justify-self: end;
  font-size: 12px;
  line-height: 1.25;
  overflow: hidden;
}

@media (max-width: 900px) {
  .desk-file-list.is-detail .desk-file-list-head, .desk-file-list.is-detail .desk-file-list-row {
    grid-template-columns: minmax(0, 1fr) minmax(84px, 110px) minmax(56px, 72px) minmax(72px, 110px);
    gap: 8px;
  }
}

.desk-file-entry-icon--pinned {
  color: var(--color-cursor-accent, #6b8afd);
}

.desk-file-entry-icon--system {
  color: var(--color-cursor-muted, #64748b);
}

.desk-file-entry-icon--system svg {
  stroke-width: 1.5px;
}

.desk-file-entry-icon--folder {
  color: #d97706;
}

.desk-file-entry-icon--doc {
  color: var(--cursor-accent, #4f6ef7);
}

.desk-file-entry-icon--image {
  color: #0891b2;
}

.desk-file-entry-icon--video {
  color: #db2777;
}

.desk-file-entry-icon--audio {
  color: #7c3aed;
}

.desk-file-entry-icon--site {
  color: #059669;
}

.desk-file-entry-icon--file {
  color: #64748b;
}

[data-appearance="dark"] .desk-file-entry-icon--folder, :root:not([data-appearance="light"]) .desk-file-entry-icon--folder {
  color: #fbbf24;
}

[data-appearance="dark"] .desk-file-entry-icon--doc, :root:not([data-appearance="light"]) .desk-file-entry-icon--doc {
  color: var(--cursor-accent, #93a9ff);
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="dark"] .desk-file-entry-icon--doc, :root:not([data-appearance="light"]) .desk-file-entry-icon--doc {
    color: color-mix(in srgb, var(--cursor-accent, #93a9ff) 92%, #fff);
  }
}

[data-appearance="dark"] .desk-file-entry-icon--image, :root:not([data-appearance="light"]) .desk-file-entry-icon--image {
  color: #22d3ee;
}

[data-appearance="dark"] .desk-file-entry-icon--video, :root:not([data-appearance="light"]) .desk-file-entry-icon--video {
  color: #f472b6;
}

[data-appearance="dark"] .desk-file-entry-icon--audio, :root:not([data-appearance="light"]) .desk-file-entry-icon--audio {
  color: #c4b5fd;
}

[data-appearance="dark"] .desk-file-entry-icon--site, :root:not([data-appearance="light"]) .desk-file-entry-icon--site {
  color: #34d399;
}

[data-appearance="dark"] .desk-file-entry-icon--file, :root:not([data-appearance="light"]) .desk-file-entry-icon--file {
  color: #94a3b8;
}

.desk-file-list-name > .icon-inline {
  border-radius: var(--studio-r-md, 8px);
  background: currentColor;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 22px;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-list-name > .icon-inline {
    background: color-mix(in srgb, currentColor 14%, transparent);
  }
}

.desk-file-list-row.is-folder-pinned {
  background: var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-list-row.is-folder-pinned {
    background: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 6%, transparent);
  }
}

.desk-file-list-row.is-folder-pinned:hover {
  background: var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-list-row.is-folder-pinned:hover {
    background: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 11%, var(--color-cursor-hover, #ffffff0f));
  }
}

.desk-file-grid-item.is-folder-pinned, .desk-file-preview-item.is-folder-pinned {
  background: var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-grid-item.is-folder-pinned, .desk-file-preview-item.is-folder-pinned {
    background: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 5%, var(--color-cursor-hover, #ffffff0a));
  }
}

.desk-file-list-head-meta {
  text-align: right;
}

.desk-file-list-row {
  border-radius: var(--cursor-radius-sm);
  width: 100%;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-ui);
  cursor: pointer;
  text-align: left;
  transition: background var(--cursor-ease), border-color var(--cursor-ease), box-shadow var(--cursor-ease);
  background: none;
  border: 1px solid #0000;
  margin: 0;
  padding: 6px 8px;
}

@media (hover: hover) {
  .desk-file-list-row:hover {
    background: var(--color-cursor-hover);
    border-color: var(--color-cursor-accent, var(--cursor-accent));
  }

  @supports (color: color-mix(in lab, red, red)) {
    .desk-file-list-row:hover {
      border-color: color-mix(in srgb, var(--color-cursor-accent, var(--cursor-accent)) 58%, transparent);
    }
  }

  .desk-file-list-row:hover {
    box-shadow: 0 2px 8px #0000001f;
  }
}

.desk-file-list-row.is-parent-row {
  border: 1px solid var(--color-cursor-border-soft);
  margin-top: 4px;
  margin-bottom: 6px;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-list-row.is-parent-row {
    border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 70%, transparent);
  }
}

.desk-file-list-row.is-parent-row {
  background: var(--color-cursor-hover);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-list-row.is-parent-row {
    background: color-mix(in srgb, var(--color-cursor-hover) 56%, transparent);
  }
}

.desk-file-drag-native-ghost {
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
  position: fixed;
  top: -1000px;
  left: -1000px;
}

.desk-file-drag-preview {
  z-index: 2147483647;
  box-sizing: border-box;
  pointer-events: none;
  opacity: .96;
  -webkit-backdrop-filter: none;
  color: var(--color-cursor-text);
  transform-origin: 0 0;
  transition: width .44s cubic-bezier(.18, 1.32, .32, 1), height .44s cubic-bezier(.18, 1.32, .32, 1), opacity .28s, border-radius .44s cubic-bezier(.18, 1.32, .32, 1);
  top: 0;
  left: 0;
  box-shadow: 0 18px 44px #0000005c, 0 6px 16px #00000038;
  border: 1px solid var(--color-cursor-border) !important;
  background: var(--mos-plate) !important;
  position: fixed !important;
  overflow: hidden !important;
}

.desk-file-drag-preview-count {
  z-index: 2;
  background: var(--cursor-accent);
  min-width: 22px;
  height: 22px;
  color: var(--cursor-on-accent);
  pointer-events: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 6px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  position: absolute;
  top: 6px;
  right: 6px;
  box-shadow: 0 2px 8px #00000047;
}

.desk-file-drag-preview.desk-file-drag-preview--media {
  background: var(--mos-plate) !important;
  border: none !important;
}

.desk-file-drag-preview.desk-file-drag-preview--media img {
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
  border: none;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0;
}

.desk-file-drag-preview.is-shrunk {
  border-radius: 14px !important;
}

.desk-file-drag-preview .desk-file-list-name, .desk-file-drag-preview .desk-file-list-meta, .desk-file-drag-preview .desk-file-thumb-label, .desk-file-drag-preview .truncate {
  min-width: 0;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}

.desk-file-drag-preview .desk-file-list-meta {
  opacity: .76;
}

.desk-file-drag-preview.desk-file-grid-item, .desk-file-drag-preview.desk-file-preview-item {
  min-height: 0 !important;
}

.desk-file-drag-preview.is-shrunk.desk-file-grid-item, .desk-file-drag-preview.is-shrunk.desk-file-preview-item, .desk-file-drag-preview.is-shrunk.desk-file-list-row {
  flex-direction: row;
  grid-template-columns: none;
  align-items: center;
  gap: 8px;
  display: flex;
  padding: 8px 10px !important;
}

.desk-file-drag-preview.is-shrunk .desk-file-list-name {
  flex: auto;
}

.desk-file-drag-preview.is-shrunk .desk-file-thumb {
  display: contents;
}

.desk-file-drag-preview.is-shrunk .desk-file-thumb-visual {
  border-radius: 10px;
  flex: 0 0 34px !important;
  width: 34px !important;
  height: 34px !important;
}

.desk-file-drag-preview.is-shrunk .desk-file-thumb-label {
  flex: auto;
  width: auto;
  min-height: auto;
  max-height: none;
  padding: 0;
  display: block;
}

.desk-file-drag-preview.is-shrunk .desk-file-list-meta {
  display: none;
}

.desk-file-list-name {
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.desk-file-list-meta {
  color: var(--color-cursor-muted);
  text-align: right;
  white-space: nowrap;
  text-overflow: ellipsis;
  justify-self: end;
  font-size: 11px;
  overflow: hidden;
}

.desk-file-search-divider {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  border-top: 1px solid var(--color-cursor-border);
  grid-column: 1 / -1;
  padding: 8px 12px 4px;
  font-size: 10px;
  font-weight: 600;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-search-divider {
    border-top: 1px solid color-mix(in srgb, var(--color-cursor-border) 70%, transparent);
  }
}

.desk-file-search-truncated, .desk-file-search-busy {
  color: var(--color-cursor-muted);
  text-align: center;
  padding: 8px 12px 12px;
  font-size: 11px;
}

.desk-file-skeleton {
  padding-top: 2px;
}

.desk-file-skeleton-row {
  pointer-events: none;
}

.desk-file-skeleton-icon, .desk-file-skeleton-line, .desk-file-skeleton-meta {
  background: linear-gradient(90deg, var(--color-cursor-border-soft), var(--cursor-accent), var(--color-cursor-border-soft));
  border-radius: 999px;
  display: inline-block;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-skeleton-icon, .desk-file-skeleton-line, .desk-file-skeleton-meta {
    background: linear-gradient(90deg, color-mix(in srgb, var(--color-cursor-border-soft) 58%, transparent), color-mix(in srgb, var(--cursor-accent) 14%, transparent), color-mix(in srgb, var(--color-cursor-border-soft) 58%, transparent));
  }
}

.desk-file-skeleton-icon, .desk-file-skeleton-line, .desk-file-skeleton-meta {
  background-size: 220% 100%;
  animation: 1.15s ease-in-out infinite desk-file-skeleton-shimmer;
}

.desk-file-skeleton-icon {
  width: 16px;
  height: 16px;
}

.desk-file-skeleton-line {
  max-width: 190px;
  height: 10px;
}

.desk-file-skeleton-meta {
  justify-self: end;
  width: 54px;
  height: 9px;
}

@keyframes desk-file-skeleton-shimmer {
  0% {
    opacity: .52;
    background-position: 120% 0;
  }

  50% {
    opacity: .92;
  }

  100% {
    opacity: .52;
    background-position: -120% 0;
  }
}

.cursor-file-grid .desk-file-search-divider, .desk-file-preview-grid .desk-file-search-divider {
  width: 100%;
}

.desk-explorer-fullscreen {
  z-index: 420;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  box-sizing: border-box;
  background: #0000008c;
  padding: 12px;
  position: fixed;
  inset: 0;
}

.desk-explorer-fullscreen-inner {
  border: 1px solid var(--color-cursor-border);
  border-radius: 12px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  box-shadow: 0 24px 80px #00000073;
}

.desk-explorer-panel--fullscreen {
  background: var(--mos-bg);
}

.desk-explorer-collapsed-rail {
  background: var(--color-cursor-sidebar);
  border-right: 1px solid var(--color-cursor-border);
  justify-content: center;
  align-items: flex-start;
  height: 100%;
  padding-top: 10px;
  display: flex;
}

.desk-explorer-toast {
  z-index: 5;
  background: var(--color-cursor-surface-raised, #2a2a2a);
  border: 1px solid var(--color-cursor-border);
  color: var(--color-cursor-text);
  pointer-events: none;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 8px 24px #00000040;
}

.desk-mobile-explorer-tools {
  border-bottom: 1px solid var(--color-cursor-border);
}

.cursor-git-panel {
  padding-bottom: 8px;
}

.cursor-git-head {
  border-bottom: 1px solid var(--color-cursor-border);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px 10px 6px;
  display: flex;
}

.cursor-git-branch {
  align-items: center;
  gap: 6px;
  min-width: 0;
  font-size: 12px;
  display: flex;
}

.cursor-git-sync {
  shrink: 0;
  gap: 2px;
  display: flex;
}

.cursor-git-link {
  color: var(--color-cursor-muted);
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  font-size: 12px;
  display: flex;
}

.cursor-git-link:hover {
  color: var(--color-cursor-text);
}

.cursor-git-error {
  color: #f87171;
  margin: 6px 10px;
  font-size: 11px;
}

.cursor-git-commit {
  border-bottom: 1px solid var(--color-cursor-border);
  padding: 8px 10px;
}

.cursor-git-message {
  resize: vertical;
  border: 1px solid var(--color-cursor-border);
  background: var(--cursor-surface-input, var(--mos-panel));
  width: 100%;
  min-height: 64px;
  color: var(--color-cursor-text);
  border-radius: 8px;
  padding: 8px;
  font-size: 12px;
}

.cursor-git-commit-actions {
  justify-content: flex-end;
  gap: 6px;
  margin-top: 6px;
  display: flex;
}

.cursor-git-section-head {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--color-cursor-muted);
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px 4px;
  font-size: 11px;
  display: flex;
}

.cursor-git-link-btn {
  text-transform: none;
  letter-spacing: 0;
  color: #7dd3fc;
  font-size: 11px;
}

.cursor-git-list {
  padding: 0 4px 8px;
}

.cursor-git-row {
  border-radius: 6px;
  align-items: center;
  gap: 4px;
  padding: 2px 4px;
  display: flex;
}

.cursor-git-row:hover {
  background: #ffffff0a;
}

.cursor-git-file {
  text-align: left;
  flex: 1;
  align-items: center;
  gap: 6px;
  min-width: 0;
  font-size: 12px;
  display: flex;
}

.cursor-git-status {
  shrink: 0;
  width: 14px;
  color: var(--color-cursor-muted);
  font-size: 10px;
}

.cursor-git-row-actions {
  opacity: 0;
  gap: 2px;
  display: flex;
}

.cursor-git-row:hover .cursor-git-row-actions {
  opacity: 1;
}

.cursor-git-empty {
  color: var(--color-cursor-muted);
  padding: 6px 8px;
  font-size: 11px;
}

.cursor-icon-btn.sm {
  width: 24px;
  height: 24px;
}

.cursor-discover-overlay {
  z-index: 80;
  justify-content: center;
  align-items: flex-end;
  display: flex;
  position: fixed;
  inset: 0;
}

.cursor-discover-backdrop {
  background: #0000008c;
  position: absolute;
  inset: 0;
}

.cursor-discover-sheet {
  background: var(--color-cursor-sidebar, #181818);
  border: 1px solid var(--color-cursor-border);
  border-radius: 14px 14px 0 0;
  flex-direction: column;
  width: min(480px, 100%);
  max-height: 70vh;
  display: flex;
  position: relative;
}

.cursor-discover-head {
  border-bottom: 1px solid var(--color-cursor-border);
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  display: flex;
}

.cursor-discover-head h2 {
  font-size: 14px;
  font-weight: 600;
}

.cursor-discover-body {
  padding: 8px;
  overflow-y: auto;
}

.cursor-discover-hint {
  color: var(--color-cursor-muted);
  padding: 12px;
  font-size: 12px;
}

.cursor-discover-row {
  text-align: left;
  border-radius: 10px;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px;
  display: flex;
}

.cursor-discover-row:hover {
  background: var(--cursor-overlay-subtle);
}

.cursor-discover-meta {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  display: flex;
}

.cursor-discover-title {
  font-size: 13px;
  font-weight: 500;
}

.cursor-discover-path {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.pill-btn.primary {
  color: #7dd3fc;
  background: #7dd3fc26;
}

.cursor-editor-tabs {
  align-items: stretch;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.cursor-tab-scroll {
  flex: 1;
  align-items: stretch;
  min-width: 0;
  display: flex;
  overflow: auto hidden;
}

.cursor-editor-tab-tools {
  border-left: 1px solid var(--color-cursor-border);
  align-items: center;
  gap: 2px;
  padding: 0 4px;
  display: flex;
}

.cursor-tab-placeholder {
  height: var(--cursor-head-h);
  align-items: center;
  display: flex;
}

.cursor-tab {
  height: var(--cursor-head-h);
  color: var(--color-cursor-muted);
  border: none;
  border-right: 1px solid var(--color-cursor-border);
  cursor: pointer;
  background: none;
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 200px;
  padding: 0 8px 0 12px;
  font-size: 12px;
  display: flex;
}

.cursor-tab:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-muted);
}

.cursor-tab.active {
  color: var(--color-cursor-text);
  background: var(--color-cursor-editor);
}

.cursor-tab-close {
  width: var(--studio-h-close, 28px);
  height: var(--studio-h-close, 28px);
  opacity: 1;
  color: var(--color-cursor-muted);
  transition: background var(--cursor-ease), opacity var(--cursor-ease), color var(--cursor-ease);
  z-index: 2;
  touch-action: manipulation;
  pointer-events: auto;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  margin: 0 -2px;
  padding: 0;
  display: flex;
  position: relative;
}

.cursor-tab-close .icon-inline {
  pointer-events: none;
}

.cursor-tab:hover .cursor-tab-close, .cursor-tab.active .cursor-tab-close {
  opacity: 1;
}

.cursor-tab-close:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.cursor-editor-code {
  height: 100%;
  color: var(--color-cursor-text);
  background: var(--color-cursor-editor);
  margin: 0;
  padding: 16px;
  font-family: ui-monospace, JetBrains Mono, SF Mono, monospace;
  font-size: 12px;
  line-height: 1.55;
  overflow: auto;
}

.cursor-editor-textarea {
  color: var(--color-cursor-text);
  background: var(--color-cursor-editor);
  font-family: ui-monospace, JetBrains Mono, SF Mono, monospace;
  font-size: 12px;
  line-height: 1.55;
}

.cursor-tab.is-dirty .truncate {
  font-style: italic;
}

.cursor-editor-md {
  color: var(--color-cursor-text);
  line-height: 1.6;
}

.cursor-doc-editor {
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-sidebar)));
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.cursor-doc-toolbar {
  min-height: var(--cursor-head-h);
  height: var(--cursor-head-h);
  border-bottom: 1px solid var(--color-cursor-border);
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-sidebar)));
  box-sizing: border-box;
  flex-shrink: 0;
  align-items: center;
  gap: 2px;
  padding: 0 8px;
  display: flex;
}

.cursor-doc-toolbar.has-name {
  border-bottom-color: var(--color-cursor-border-soft);
  grid-template-columns: 1fr auto 1fr;
  gap: 8px;
  display: grid;
}

.cursor-doc-toolbar-left {
  justify-self: start;
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.cursor-doc-toolbar-center {
  justify-content: center;
  justify-self: center;
  align-items: center;
  gap: 2px;
  display: flex;
}

.cursor-doc-toolbar-right {
  justify-content: flex-end;
  justify-self: end;
  align-items: center;
  display: flex;
}

.cursor-doc-tool {
  width: 24px;
  height: 24px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.cursor-doc-tool:hover, .cursor-doc-tool.active {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.cursor-doc-tool-divider {
  background: var(--color-cursor-border-soft);
  width: 1px;
  height: 18px;
  margin: 0 4px;
}

.cursor-doc-scroll {
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-sidebar)));
  flex: 1;
  min-height: 0;
  padding: 20px 24px 32px;
  overflow-y: auto;
}

.cursor-doc-page {
  max-width: 720px;
  min-height: calc(100% - 24px);
  color: var(--color-cursor-text);
  box-shadow: none;
  background: none;
  border-radius: 0;
  outline: none;
  margin: 0 auto;
  padding: 8px 0 32px;
  font-size: 14px;
  line-height: 1.65;
}

.cursor-doc-page.mos-md, .cursor-doc-page.md-prose {
  --mos-text: var(--color-cursor-text);
  --mos-muted: var(--color-cursor-muted);
  --mos-accent: var(--color-cursor-accent, var(--cursor-accent));
  color: var(--color-cursor-text);
}

.cursor-doc-page:focus {
  box-shadow: none;
}

.cursor-html-doc-editor .cursor-html-preview-scroll {
  background: var(--color-cursor-editor);
  flex-direction: column;
  flex: 1;
  min-height: 0;
  padding: 16px 20px 24px;
  display: flex;
  overflow: hidden;
}

.cursor-html-doc-preview {
  border: 1px solid var(--color-cursor-border);
  background: var(--mos-panel);
  border-radius: 8px;
  flex: 1;
  width: 100%;
  min-height: 0;
}

.cursor-html-source-pane {
  flex-direction: column;
  flex: 1;
  min-height: 0;
  display: flex;
}

.cursor-doc-page h1 {
  margin: 0 0 .75rem;
  font-size: 1.85rem;
  font-weight: 700;
  line-height: 1.2;
}

.cursor-doc-page h2 {
  margin: 1.25rem 0 .5rem;
  font-size: 1.35rem;
  font-weight: 600;
}

.cursor-doc-page h3 {
  margin: 1rem 0 .35rem;
  font-size: 1.1rem;
  font-weight: 600;
}

.cursor-doc-page p {
  margin: 0 0 .85rem;
}

.cursor-doc-page ul, .cursor-doc-page ol {
  margin: 0 0 .85rem 1.25rem;
  padding: 0;
}

.cursor-doc-page blockquote {
  border-left: 3px solid var(--color-cursor-border);
  color: var(--color-cursor-muted);
  margin: 0 0 .85rem;
  padding-left: 1rem;
}

.cursor-doc-page a {
  color: var(--color-cursor-accent, #facc62);
  text-decoration: underline;
}

.cursor-doc-page code {
  background: var(--cursor-overlay-hover);
  border-radius: 4px;
  padding: .1em .35em;
  font-family: ui-monospace, monospace;
  font-size: .9em;
}

.cursor-doc-page .mos-code, .cursor-doc-page .code-shell {
  background: var(--mos-page, var(--mos-panel));
  box-shadow: 0 0 0 1px var(--mos-ink, #111), 0 1px 2px var(--mos-ink, #111), 0 8px 20px var(--mos-ink, #111);
  border: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-doc-page .mos-code, .cursor-doc-page .code-shell {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--mos-ink, #111) 5%, transparent), 0 1px 2px color-mix(in srgb, var(--mos-ink, #111) 3%, transparent), 0 8px 20px color-mix(in srgb, var(--mos-ink, #111) 5%, transparent);
  }
}

.cursor-doc-page .mos-code-bar, .cursor-doc-page .code-shell-head {
  background: var(--mos-page, var(--mos-panel));
  border-bottom: 1px solid var(--mos-ink, #111);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-doc-page .mos-code-bar, .cursor-doc-page .code-shell-head {
    border-bottom: 1px solid color-mix(in srgb, var(--mos-ink, #111) 5%, transparent);
  }
}

.cursor-doc-page pre {
  color: var(--color-cursor-text);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  background: none;
  border: 0;
  border-radius: 8px;
  margin: 0 0 .85rem;
  padding: 12px 14px;
  overflow-x: hidden;
}

.cursor-doc-page .mos-code pre, .cursor-doc-page .code-shell pre {
  background: none;
  border-radius: 0;
  margin: 0;
}

.cursor-doc-page .mos-code .mos-code-body, .cursor-doc-page .mos-code pre, .cursor-doc-page .code-shell .mos-code-body, .cursor-doc-page .code-shell pre {
  overscroll-behavior: auto;
  -webkit-overflow-scrolling: touch;
  max-height: min(320px, 40vh);
  overflow: hidden;
}

.cursor-doc-page .mos-code.is-clipped:not(.is-scroll-active) .mos-code-body, .cursor-doc-page .mos-code.is-clipped:not(.is-scroll-active) pre, .cursor-doc-page .code-shell.is-clipped:not(.is-scroll-active) .mos-code-body, .cursor-doc-page .code-shell.is-clipped:not(.is-scroll-active) pre {
  -webkit-mask-image: linear-gradient(#000 0% 78%, #0000 100%);
  mask-image: linear-gradient(#000 0% 78%, #0000 100%);
}

.cursor-doc-page .mos-code.is-scroll-active, .cursor-doc-page .code-shell.is-scroll-active {
  box-shadow: 0 0 0 1px var(--mos-accent, #5b8def), 0 1px 2px var(--mos-ink, #111), 0 8px 20px var(--mos-ink, #111);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-doc-page .mos-code.is-scroll-active, .cursor-doc-page .code-shell.is-scroll-active {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--mos-accent, #5b8def) 22%, transparent), 0 1px 2px color-mix(in srgb, var(--mos-ink, #111) 3%, transparent), 0 8px 20px color-mix(in srgb, var(--mos-ink, #111) 5%, transparent);
  }
}

.cursor-doc-page .mos-code.is-scroll-active .mos-code-body, .cursor-doc-page .mos-code.is-scroll-active pre, .cursor-doc-page .code-shell.is-scroll-active .mos-code-body, .cursor-doc-page .code-shell.is-scroll-active pre {
  overscroll-behavior-y: contain;
  overflow-y: auto;
  -webkit-mask-image: none;
  mask-image: none;
}

.cursor-doc-page pre code, .cursor-doc-page .mos-code-body code {
  color: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  background: none;
  padding: 0;
}

.cursor-doc-page .md-table-wrap, .cursor-doc-page .mos-table-wrap, .cursor-plan-body .md-table-wrap, .cursor-plan-body .mos-table-wrap {
  border: 1px solid var(--mos-border, var(--border));
  background: none;
  border-radius: 8px;
  margin: .85em 0;
  overflow-x: auto;
}

.cursor-doc-page table, .cursor-plan-body table {
  border-collapse: collapse;
  width: max-content;
  min-width: 100%;
  font-size: .8125rem;
}

.cursor-doc-page thead th, .cursor-plan-body thead th {
  text-align: left;
  color: var(--color-cursor-text);
  background: none;
  font-size: .875rem;
  font-weight: 600;
}

.cursor-doc-page th, .cursor-doc-page td, .cursor-plan-body th, .cursor-plan-body td {
  border-bottom: 1px solid var(--mos-border-soft, var(--border));
  border-right: 1px solid var(--mos-border-soft, var(--border));
  vertical-align: top;
  background: none;
  padding: 8px 12px;
}

.cursor-doc-page th:last-child, .cursor-doc-page td:last-child, .cursor-plan-body th:last-child, .cursor-plan-body td:last-child {
  border-right: none;
}

.cursor-doc-page tbody tr:last-child td, .cursor-plan-body tbody tr:last-child td {
  border-bottom: none;
}

.cursor-bottom-panel {
  background: var(--mos-bg);
  border-top: 1px solid var(--color-cursor-border);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.cursor-bottom-head {
  padding: 0 4px 0 0;
}

.cursor-bottom-tabs {
  min-width: 0;
  height: var(--cursor-head-h);
  flex: 1;
  align-items: stretch;
  display: flex;
}

.cursor-bottom-tabs-scroll {
  gap: 0;
  padding-right: 0;
}

.cursor-bottom-tabs-scroll .cursor-tab-scroll {
  flex: 1;
  min-width: 0;
}

.cursor-term-tab {
  max-width: 160px;
  font-size: 11px;
}

.cursor-term-tab.active {
  background: var(--color-cursor-bg, var(--mos-bg));
  border-top: 2px solid var(--cursor-accent);
  margin-top: -1px;
}

.cursor-bottom-tab-fixed {
  flex-shrink: 0;
}

.cursor-term-new {
  border-left: 1px solid var(--color-cursor-border);
  border-radius: 0;
  flex-shrink: 0;
  margin: 0 2px;
}

.cursor-bottom-tab {
  height: var(--cursor-head-h);
  border: none;
  border-right: 1px solid var(--color-cursor-border);
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  font-size: 11px;
  display: inline-flex;
}

.cursor-bottom-tab.active {
  color: var(--color-cursor-text);
  background: var(--color-cursor-bg, var(--mos-bg));
  border-top: 2px solid var(--cursor-accent);
  margin-top: -1px;
}

.cursor-bottom-body {
  flex: 1;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.cursor-gateway-logs-compact {
  border: none;
  border-radius: 0;
  height: 100%;
  max-height: none;
  margin: 0;
}

.cursor-shell-terminal {
  background: var(--color-cursor-bg, var(--mos-bg));
}

.cursor-xterm-host {
  min-height: 0;
  padding: 4px 6px 6px;
  position: relative;
}

.cursor-xterm-host .xterm {
  height: 100%;
}

.cursor-xterm-host .xterm-viewport {
  background-color: #0000 !important;
  overflow-y: auto !important;
}

.cursor-xterm-host .xterm-bg-236 {
  background-color: #303030 !important;
}

.cursor-xterm-host .xterm-bg-237 {
  background-color: #3a3a3a !important;
}

.cursor-xterm-host .xterm-bg-238 {
  background-color: #444 !important;
}

.cursor-xterm-host .xterm-bg-0 {
  background-color: #181921 !important;
}

.cursor-xterm-host .xterm-bg-1 {
  background-color: #f85149 !important;
}

.cursor-xterm-host .xterm-bg-2 {
  background-color: #3fb950 !important;
}

.cursor-xterm-host .xterm-bg-4 {
  background-color: #79c0ff !important;
}

.cursor-xterm-host .xterm-bg-8 {
  background-color: #6b6d7b !important;
}

.cursor-xterm-host .xterm-screen {
  z-index: 1;
  position: relative;
}

.cursor-xterm-host .xterm-helper-textarea {
  opacity: 0 !important;
  z-index: -1 !important;
  left: -9999em !important;
}

.cursor-history-column {
  background: var(--color-cursor-sidebar);
  border-left: 1px solid var(--color-cursor-border);
}

.cursor-history-head {
  padding: 0 6px 0 10px;
}

.cursor-history-title {
  min-width: 0;
  color: var(--color-cursor-text);
  flex: 1;
  font-size: 12px;
  font-weight: 600;
}

.cursor-history-pane {
  background: var(--color-cursor-chat);
}

.cursor-history-search {
  min-height: var(--cursor-head-h);
  height: var(--cursor-head-h);
  padding: 0 8px;
}

.cursor-panel-search {
  min-height: var(--studio-search-h, 36px);
  height: var(--studio-search-h, 36px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--mos-plate, var(--color-cursor-sidebar));
  border: none;
  align-items: center;
  gap: 8px;
  margin: 2px 8px;
  padding: 0 10px;
  display: flex;
}

.cursor-panel-search-input {
  width: 100%;
  min-width: 0;
  height: 100%;
  color: var(--color-cursor-text);
  font-size: var(--studio-fs-md, 14px);
  box-shadow: none;
  appearance: none;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  flex: 1;
  margin: 0;
  padding: 0;
  font-weight: 500;
  line-height: 1;
}

.cursor-panel-search-input::placeholder {
  color: var(--color-cursor-muted);
  opacity: 1;
  line-height: 1;
}

.cursor-panel-search-input:focus, .cursor-panel-search-input:focus-visible {
  box-shadow: none;
  outline: none;
}

.cursor-panel-search-input::-webkit-search-decoration {
  appearance: none;
}

.cursor-panel-search-input::-webkit-search-cancel-button {
  appearance: none;
}

.cursor-panel-search-start {
  flex-shrink: 0;
  align-items: center;
  display: inline-flex;
  position: relative;
}

.cursor-panel-search-end {
  border-left: none;
  flex-shrink: 0;
  align-self: center;
  align-items: center;
  gap: 0;
  margin-left: 2px;
  padding-left: 8px;
  display: inline-flex;
}

.cursor-panel-search-end:before {
  content: "";
  background: var(--color-cursor-border);
  flex-shrink: 0;
  width: 1px;
  height: 14px;
  margin-right: 8px;
  display: block;
}

.cursor-panel-search-end .studio-composer-circle-btn, .cursor-panel-search-end .cursor-icon-btn {
  flex: 0 0 24px;
  box-sizing: border-box !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
}

.cursor-panel-search-end .studio-composer-circle-btn svg, .cursor-panel-search-end .cursor-icon-btn svg {
  width: 12px !important;
  height: 12px !important;
}

.desk-explorer-type-filter {
  align-items: center;
  gap: 2px;
  height: 100%;
  display: inline-flex;
  position: relative;
}

.desk-explorer-type-filter-trigger {
  height: 100%;
  color: var(--color-cursor-muted);
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 0;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0 2px 0 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  display: inline-flex;
}

.desk-explorer-type-filter-trigger:hover, .desk-explorer-type-filter-trigger.is-open, .desk-explorer-type-filter-trigger.is-active {
  color: var(--color-cursor-text);
  background: none;
}

.desk-explorer-type-filter-clear {
  width: 18px;
  height: 18px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 4px;
  place-items: center;
  margin: 0;
  padding: 0;
  display: inline-grid;
}

.desk-explorer-type-filter-clear:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-muted);
}

.desk-explorer-type-filter-menu {
  z-index: 40;
  min-width: 148px;
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
}

.cursor-chat-head {
  background: var(--color-cursor-sidebar);
  gap: 0;
  padding: 0 8px 0 0;
}

.cursor-chat-title {
  min-width: 0;
  height: 26px;
  color: var(--color-cursor-text);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  flex: 1;
  align-items: center;
  gap: 8px;
  padding: 0 6px;
  font-size: 12px;
  font-weight: 500;
  display: flex;
}

.cursor-chat-title:hover {
  background: var(--color-cursor-hover);
}

.cursor-stop-btn {
  color: #f0a0a0;
  cursor: pointer;
  background: #2a1515;
  border: 1px solid #4a2020;
  border-radius: 6px;
  padding: 3px 10px;
  font-size: 11px;
}

.cursor-stop-btn:hover {
  background: #3a1a1a;
}

.cursor-history-overlay {
  z-index: 20;
  background: var(--color-cursor-chat);
  flex-direction: column;
  display: flex;
  position: absolute;
  inset: 0;
}

.cursor-history-row {
  border: none;
  border-bottom: 1px solid var(--color-cursor-border-soft);
  width: 100%;
  color: var(--color-cursor-text);
  text-align: left;
  cursor: pointer;
  transition: background var(--cursor-ease);
  background: none;
  padding: 9px 12px;
}

.cursor-history-row:hover, .cursor-history-row.active {
  background: var(--color-cursor-hover);
}

.cursor-history-row.active {
  border-left: 2px solid var(--cursor-accent);
  padding-left: 10px;
}

.cursor-history-close {
  border: none;
  border-top: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-hover);
  color: var(--color-cursor-muted);
  cursor: pointer;
  padding: 10px;
  font-size: 12px;
}

.cursor-chat-thread {
  flex: 1;
  min-height: 0;
  overflow: hidden auto;
}

.cursor-cross-banner {
  border-bottom: 1px solid var(--color-cursor-border);
  background: var(--cursor-accent-dim);
  flex-shrink: 0;
  padding: 5px 10px;
}

.cursor-cross-chips {
  gap: 6px;
  display: flex;
  overflow-x: auto;
}

.cursor-cross-chip {
  border: 1px solid var(--cursor-accent-border);
  background: var(--cursor-accent-dim);
  color: var(--cursor-accent);
  cursor: pointer;
  transition: background var(--cursor-ease);
  border-radius: 999px;
  flex-shrink: 0;
  align-items: center;
  gap: 5px;
  padding: 4px 9px;
  font-size: 11px;
  font-weight: 500;
  display: inline-flex;
}

.cursor-cross-chip:hover {
  background: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-cross-chip:hover {
    background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
  }
}

.cursor-chat-empty {
  text-align: center;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 100%;
  min-height: 120px;
  padding: 24px;
  display: flex;
}

.cursor-agent-panel {
  background: var(--color-cursor-chat);
  min-width: 0;
  height: 100%;
  min-height: 0;
  font-family: var(--font-cursor);
  font-size: var(--desk-text-ui);
  flex-direction: column;
  display: flex;
  position: relative;
}

.cursor-agent-body {
  flex-direction: column;
  flex: 1;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.cursor-chat-thread-outer {
  flex-direction: column;
  flex: 1;
  align-items: center;
  width: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.cursor-composer-shell {
  flex-direction: column;
  flex-shrink: 0;
  align-items: center;
  width: 100%;
  min-width: 0;
  padding: 0;
  display: flex;
}

.cursor-composer-shell-inline {
  width: 100%;
  max-width: min(var(--desk-composer-max), 94vw);
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
}

.cursor-composer-shell-inline > .cursor-composer {
  width: 100%;
  max-width: none;
}

.cursor-composer-shell > .cursor-composer {
  width: min(var(--desk-composer-max), 94vw);
  max-width: 100%;
}

.cursor-composer-shell > .cursor-composer-suggestions {
  width: min(var(--desk-composer-max), 94vw);
  align-self: center;
  max-width: 100%;
}

@media (min-width: 900px) {
  .cursor-chat-thread.mos-chat {
    width: 100%;
    max-width: min(var(--desk-composer-max), 94vw);
    margin-left: auto;
    margin-right: auto;
  }
}

.cursor-composer {
  padding: 2px 10px max(12px, env(safe-area-inset-bottom, 12px));
  background: var(--color-cursor-chat);
  z-index: 20;
  flex-shrink: 0;
  position: relative;
}

.cursor-composer-box {
  border: 1px solid var(--cursor-border-subtle);
  border-radius: var(--cursor-composer-radius);
  background: var(--mos-surface);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-box {
    background: color-mix(in srgb, var(--mos-surface) 88%, var(--mos-bg));
  }
}

.cursor-composer-box {
  transition: border-color var(--cursor-ease), box-shadow var(--cursor-ease), background var(--cursor-ease);
  box-shadow: none;
  overflow: visible;
}

.cursor-composer-box:focus-within {
  border-color: var(--cursor-border-focus);
  background: var(--mos-surface);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-box:focus-within {
    background: color-mix(in srgb, var(--mos-surface) 94%, var(--mos-bg));
  }
}

.cursor-composer-box:focus-within {
  box-shadow: 0 0 0 2px var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-box:focus-within {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--mos-accent) 18%, transparent);
  }
}

.cursor-composer-box.is-streaming {
  border-color: var(--cursor-accent-border);
  box-shadow: 0 0 0 1px var(--cursor-accent-dim) inset;
}

.cursor-composer-box.is-awaiting {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-box.is-awaiting {
    border-color: color-mix(in srgb, var(--cursor-accent) 45%, transparent);
  }
}

.cursor-composer-meta {
  color: var(--color-cursor-muted);
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  padding: 6px 12px 0;
  font-size: 11px;
  display: flex;
}

.cursor-composer-meta-item {
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.cursor-composer-meta-item.is-awaiting {
  color: var(--cursor-accent);
}

.cursor-composer-textarea {
  resize: none;
  width: 100%;
  min-height: 24px;
  max-height: 168px;
  color: var(--color-cursor-text);
  font-family: inherit;
  font-size: var(--desk-text-ui);
  line-height: var(--desk-leading-tight);
  background: none;
  border: none;
  outline: none;
  padding: 10px 12px 4px;
  display: block;
  overflow-y: auto;
}

.cursor-composer-textarea::placeholder {
  color: var(--mos-text-bright, #fff);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-textarea::placeholder {
    color: color-mix(in srgb, var(--mos-text-bright, #fff) 22%, transparent);
  }
}

.cursor-composer-textarea::placeholder {
  font-size: var(--desk-text-sm);
  opacity: 1;
}

.cursor-composer-mention-editor {
  white-space: pre-wrap;
  word-break: break-word;
  line-height: var(--desk-leading-tight);
  position: relative;
}

.cursor-composer-mention-editor:empty:before {
  content: attr(data-placeholder);
  color: var(--mos-text-bright, #fff);
  -webkit-text-fill-color: var(--mos-text-bright, #fff);
  opacity: .38;
  font-size: var(--desk-text-sm);
  font-weight: 500;
  line-height: inherit;
  pointer-events: none;
  white-space: pre-wrap;
  position: absolute;
  inset: 0;
}

.cursor-composer-mention-editor:has( > br:only-child):before {
  content: attr(data-placeholder);
  color: var(--mos-text-bright, #fff);
  -webkit-text-fill-color: var(--mos-text-bright, #fff);
  opacity: .38;
  font-size: var(--desk-text-sm);
  font-weight: 500;
  line-height: inherit;
  pointer-events: none;
  white-space: pre-wrap;
  position: absolute;
  inset: 0;
}

.cursor-composer-mention-editor:has( > br:first-child:last-child):before {
  content: attr(data-placeholder);
  color: var(--mos-text-bright, #fff);
  -webkit-text-fill-color: var(--mos-text-bright, #fff);
  opacity: .38;
  font-size: var(--desk-text-sm);
  font-weight: 500;
  line-height: inherit;
  pointer-events: none;
  white-space: pre-wrap;
  position: absolute;
  inset: 0;
}

.composer-inline-mention {
  border: 1px solid var(--color-cursor-accent, #6b8afd);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 2px;
  min-height: 19px;
  margin: 0 2px;
  padding: 0 4px;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention {
    border: 1px solid color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 30%, var(--color-cursor-border-soft));
  }
}

.composer-inline-mention {
  background: linear-gradient(180deg, var(--color-cursor-accent, #6b8afd), transparent 72%), var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention {
    background: linear-gradient(180deg, color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 22%, transparent), transparent 72%), color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 14%, var(--color-cursor-hover));
  }
}

.composer-inline-mention {
  color: var(--color-cursor-text-bright);
  white-space: nowrap;
  vertical-align: -.22em;
  box-sizing: border-box;
  box-shadow: inset 0 1px 0 var(--mos-text-bright), 0 0 0 1px var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention {
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright) 12%, transparent), 0 0 0 1px color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 6%, transparent);
  }
}

.composer-inline-mention--with-icon {
  max-width: min(240px, 68vw);
  height: 19px;
  font-size: 11px;
  line-height: 1;
}

.composer-inline-mention-icon {
  opacity: .92;
  width: 10px;
  height: 10px;
  color: var(--color-cursor-accent, #6b8afd);
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention-icon {
    color: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 74%, var(--color-cursor-text-bright));
  }
}

.composer-inline-mention--with-icon .composer-inline-mention-icon svg {
  width: 10px;
  height: 10px;
  display: block;
}

.composer-inline-mention::selection, .composer-inline-mention ::selection {
  background: var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention::selection, .composer-inline-mention ::selection {
    background: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 58%, var(--color-cursor-hover));
  }
}

.composer-inline-mention::selection, .composer-inline-mention ::selection {
  color: var(--color-cursor-text-bright);
  text-shadow: none;
}

.composer-inline-mention-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  align-items: center;
  min-width: 0;
  height: 100%;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.composer-inline-mention--image {
  vertical-align: middle;
  background: var(--color-cursor-hover);
  border: 1px solid var(--color-cursor-border);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin: 0 2px;
  padding: 0;
  display: inline-flex;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention--image {
    border: 1px solid color-mix(in srgb, var(--color-cursor-border) 80%, transparent);
  }
}

.composer-inline-mention--image {
  box-shadow: 0 0 0 1px var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention--image {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--mos-accent) 12%, transparent);
  }
}

.composer-inline-mention--image {
  -webkit-user-select: none;
  user-select: none;
}

.composer-inline-mention--image img {
  object-fit: cover;
  pointer-events: none;
  width: 100%;
  height: 100%;
  display: block;
}

.composer-inline-mention--clickable {
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}

.composer-inline-mention--clickable:hover {
  border-color: var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention--clickable:hover {
    border-color: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 56%, var(--color-cursor-border));
  }
}

.composer-inline-mention--clickable:hover {
  filter: brightness(1.08);
  box-shadow: inset 0 1px 0 var(--mos-text-bright), 0 0 14px var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention--clickable:hover {
    box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright) 14%, transparent), 0 0 14px color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 18%, transparent);
  }
}

.composer-inline-mention--context {
  text-overflow: ellipsis;
  max-width: min(240px, 68vw);
  overflow: hidden;
}

.composer-inline-mention--context.composer-inline-mention--with-icon {
  display: inline-flex;
}

.composer-inline-mention--image.composer-inline-mention--clickable:hover {
  filter: none;
  border-color: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention--image.composer-inline-mention--clickable:hover {
    border-color: color-mix(in srgb, var(--mos-accent) 40%, var(--color-cursor-border));
  }
}

.composer-inline-mention--image.is-loading {
  background: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-inline-mention--image.is-loading {
    background: color-mix(in srgb, var(--mos-accent) 10%, var(--color-cursor-hover));
  }
}

.composer-inline-mention--image.is-loading {
  animation: 1.2s ease-in-out infinite composer-image-mention-shimmer;
}

@keyframes composer-image-mention-shimmer {
  0%, 100% {
    opacity: .55;
  }

  50% {
    opacity: 1;
  }
}

.msg-user-text--inline {
  white-space: pre-wrap;
  word-break: break-word;
  display: block;
}

.msg-user-text--inline .msg-inline-mention {
  background: var(--color-cursor-accent, #6b8afd);
  border-radius: 999px;
  margin: 0 2px;
}

@supports (color: color-mix(in lab, red, red)) {
  .msg-user-text--inline .msg-inline-mention {
    background: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 14%, var(--color-cursor-hover));
  }
}

.msg-user-text--inline .msg-inline-mention {
  white-space: nowrap;
  vertical-align: middle;
  color: inherit;
  cursor: pointer;
  box-sizing: border-box;
  border: none;
  font-family: inherit;
}

.msg-inline-mention--with-icon {
  justify-content: center;
  align-items: center;
  gap: 3px;
  max-width: min(240px, 68vw);
  height: 20px;
  padding: 0 6px;
  font-size: 11px;
  line-height: 1;
  display: inline-flex;
}

.msg-inline-mention-icon {
  opacity: .92;
  width: 11px;
  height: 11px;
  color: var(--color-cursor-muted);
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: inline-flex;
}

.msg-inline-mention-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  line-height: 1;
  overflow: hidden;
}

.msg-user-text--inline .msg-inline-mention:hover {
  background: var(--color-cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .msg-user-text--inline .msg-inline-mention:hover {
    background: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 22%, var(--color-cursor-hover));
  }
}

.msg-inline-mention--context {
  max-width: min(240px, 68vw);
}

.msg-inline-mention--context.msg-inline-mention--with-icon {
  display: inline-flex;
}

.msg-inline-image {
  border: 1px solid var(--color-cursor-border);
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin: 0 2px;
  padding: 0;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .msg-inline-image {
    border: 1px solid color-mix(in srgb, var(--color-cursor-border) 85%, transparent);
  }
}

.msg-inline-image {
  vertical-align: middle;
  background: var(--color-cursor-hover);
  box-shadow: 0 0 0 1px var(--mos-accent);
  border-radius: 50%;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .msg-inline-image {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--mos-accent) 12%, transparent);
  }
}

.msg-inline-image {
  cursor: pointer;
}

.msg-inline-image:hover {
  border-color: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .msg-inline-image:hover {
    border-color: color-mix(in srgb, var(--mos-accent) 35%, var(--color-cursor-border));
  }
}

.msg-inline-image-img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.msg-inline-image-fallback {
  color: var(--color-cursor-muted);
  justify-content: center;
  align-items: center;
  display: flex;
}

.cursor-composer-toolbar {
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 4px 8px 8px;
  display: flex;
}

.cursor-composer-mobile-menu {
  flex-shrink: 0;
}

.cursor-composer-sophie-wrap {
  --sophie-face-accent: var(--cursor-accent);
  flex-shrink: 1;
  align-items: center;
  min-width: 0;
  display: inline-flex;
  position: relative;
}

.cursor-composer-sophie-face {
  border: 1px solid var(--sophie-face-accent);
  align-items: center;
  gap: 6px;
  max-width: 132px;
  padding: 3px 8px 3px 4px;
  display: inline-flex;
  position: relative;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-face {
    border: 1px solid color-mix(in srgb, var(--sophie-face-accent) 24%, transparent);
  }
}

.cursor-composer-sophie-face {
  border-radius: var(--cursor-radius-pill);
  background: var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-face {
    background: color-mix(in srgb, var(--sophie-face-accent) 8%, transparent);
  }
}

.cursor-composer-sophie-face {
  color: var(--color-cursor-text);
  cursor: pointer;
  min-width: 0;
  transition: border-color var(--cursor-ease), background var(--cursor-ease), transform var(--cursor-ease);
  font-size: 12px;
  line-height: 1;
}

.cursor-composer-sophie-face:hover, .cursor-composer-sophie-face.is-open {
  border-color: var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-face:hover, .cursor-composer-sophie-face.is-open {
    border-color: color-mix(in srgb, var(--sophie-face-accent) 46%, transparent);
  }
}

.cursor-composer-sophie-face:hover, .cursor-composer-sophie-face.is-open {
  background: var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-face:hover, .cursor-composer-sophie-face.is-open {
    background: color-mix(in srgb, var(--sophie-face-accent) 14%, transparent);
  }
}

.cursor-composer-sophie-face:active {
  transform: translateY(1px);
}

.cursor-composer-sophie-face:focus-visible {
  outline: 2px solid var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-face:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--sophie-face-accent) 42%, transparent);
  }
}

.cursor-composer-sophie-face:focus-visible {
  outline-offset: 2px;
}

.cursor-composer-sophie-emoji {
  background: var(--sophie-face-accent);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 22px;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-emoji {
    background: color-mix(in srgb, var(--sophie-face-accent) 18%, transparent);
  }
}

.cursor-composer-sophie-emoji {
  border: 1px solid var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-emoji {
    border: 1px solid color-mix(in srgb, var(--sophie-face-accent) 36%, transparent);
  }
}

.cursor-composer-sophie-emoji {
  box-shadow: 0 0 18px var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-emoji {
    box-shadow: 0 0 18px color-mix(in srgb, var(--sophie-face-accent) 18%, transparent);
  }
}

.cursor-composer-sophie-emoji {
  flex: 0 0 22px;
  line-height: 1;
}

.cursor-composer-sophie-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--color-cursor-muted);
  font-size: 11px;
  overflow: hidden;
}

.cursor-composer-sophie-spark {
  background: var(--sophie-face-accent);
  width: 5px;
  height: 5px;
  box-shadow: 0 0 12px var(--sophie-face-accent);
  opacity: .8;
  border-radius: 50%;
  flex: 0 0 5px;
}

.cursor-composer-sophie-panel {
  z-index: 360;
  border: 1px solid var(--sophie-face-accent);
  width: min(286px, 100vw - 28px);
  padding: 12px;
  position: absolute;
  bottom: calc(100% + 10px);
  right: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-panel {
    border: 1px solid color-mix(in srgb, var(--sophie-face-accent) 32%, var(--color-cursor-border));
  }
}

.cursor-composer-sophie-panel {
  border-radius: var(--cursor-radius-xl);
  background: radial-gradient(circle at 18px 18px, var(--sophie-face-accent), transparent 112px), var(--color-cursor-sidebar);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-panel {
    background: radial-gradient(circle at 18px 18px, color-mix(in srgb, var(--sophie-face-accent) 20%, transparent), transparent 112px), color-mix(in srgb, var(--color-cursor-sidebar) 94%, var(--mos-bg));
  }
}

.cursor-composer-sophie-panel {
  box-shadow: var(--cursor-shadow-pop);
  color: var(--color-cursor-text);
}

.cursor-composer-sophie-panel:after {
  content: "";
  border-right: 1px solid var(--sophie-face-accent);
  width: 10px;
  height: 10px;
  position: absolute;
  bottom: -6px;
  right: 22px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-panel:after {
    border-right: 1px solid color-mix(in srgb, var(--sophie-face-accent) 32%, var(--color-cursor-border));
  }
}

.cursor-composer-sophie-panel:after {
  border-bottom: 1px solid var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-panel:after {
    border-bottom: 1px solid color-mix(in srgb, var(--sophie-face-accent) 32%, var(--color-cursor-border));
  }
}

.cursor-composer-sophie-panel:after {
  background: var(--color-cursor-sidebar);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-panel:after {
    background: color-mix(in srgb, var(--color-cursor-sidebar) 94%, var(--mos-bg));
  }
}

.cursor-composer-sophie-panel:after {
  transform: rotate(45deg);
}

.cursor-composer-sophie-panel-head {
  align-items: center;
  gap: 9px;
  display: flex;
}

.cursor-composer-sophie-panel-face {
  background: var(--sophie-face-accent);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 34px;
  height: 34px;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-panel-face {
    background: color-mix(in srgb, var(--sophie-face-accent) 18%, transparent);
  }
}

.cursor-composer-sophie-panel-face {
  border: 1px solid var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-panel-face {
    border: 1px solid color-mix(in srgb, var(--sophie-face-accent) 42%, transparent);
  }
}

.cursor-composer-sophie-panel-face {
  font-size: 16px;
}

.cursor-composer-sophie-panel-title, .cursor-composer-sophie-panel-sub {
  display: block;
}

.cursor-composer-sophie-panel-title {
  font-size: 12px;
  font-weight: 700;
}

.cursor-composer-sophie-panel-sub {
  color: var(--color-cursor-muted);
  margin-top: 3px;
  font-size: 11px;
}

.cursor-composer-sophie-panel-mood, .cursor-composer-sophie-panel-note {
  color: var(--color-cursor-muted);
  margin: 10px 0 0;
  font-size: 12px;
  line-height: 1.45;
}

.cursor-composer-sophie-panel-note {
  color: var(--color-cursor-muted);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-panel-note {
    color: color-mix(in srgb, var(--color-cursor-muted) 80%, var(--sophie-face-accent));
  }
}

.cursor-composer-sophie-actions {
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
  display: flex;
}

.cursor-composer-sophie-action {
  border: 1px solid var(--color-cursor-border);
  border-radius: var(--cursor-radius-pill);
  background: var(--color-cursor-hover);
  min-height: 28px;
  padding: 5px 8px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-action {
    background: color-mix(in srgb, var(--color-cursor-hover) 74%, transparent);
  }
}

.cursor-composer-sophie-action {
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  font-size: 11px;
}

.cursor-composer-sophie-action:hover:not(:disabled) {
  border-color: var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-action:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--sophie-face-accent) 44%, var(--color-cursor-border));
  }
}

.cursor-composer-sophie-action:hover:not(:disabled) {
  background: var(--sophie-face-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-sophie-action:hover:not(:disabled) {
    background: color-mix(in srgb, var(--sophie-face-accent) 12%, var(--color-cursor-hover));
  }
}

.cursor-composer-sophie-action.is-primary {
  color: var(--color-cursor-bg);
  background: var(--sophie-face-accent);
  border-color: #0000;
  font-weight: 700;
}

.cursor-composer-sophie-action:disabled {
  opacity: .6;
  cursor: default;
}

.cursor-composer-mobile-outside {
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  display: flex;
}

.cursor-composer-mobile-outside-btn {
  border: 1px solid var(--color-cursor-border);
  border-radius: 50%;
  width: 36px;
  height: 36px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-mobile-outside-btn {
    border: 1px solid color-mix(in srgb, var(--color-cursor-border) 85%, transparent);
  }
}

.cursor-composer-mobile-outside-btn {
  background: var(--cursor-overlay-subtle);
}

.cursor-composer-mobile-outside-btn.cursor-composer-submit {
  margin-left: 0;
}

.composer-mobile-menu-panel {
  flex-direction: column;
  max-height: min(78dvh, 640px);
  display: flex;
}

.composer-mobile-menu-scroll {
  -webkit-overflow-scrolling: touch;
  padding: 0 0 8px;
  overflow-y: auto;
}

.composer-mobile-menu-section {
  padding: 8px 12px 4px;
}

.composer-mobile-menu-label {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  margin: 0 0 8px;
  padding: 0 4px;
  font-size: 11px;
  font-weight: 600;
}

.composer-mobile-menu-pills {
  flex-wrap: wrap;
  gap: 8px;
  display: flex;
}

.composer-mobile-menu-pill {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-overlay-subtle);
  min-height: 36px;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-sm);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  display: inline-flex;
}

.composer-mobile-menu-pill.is-active {
  color: var(--cursor-accent);
  border-color: var(--cursor-accent-border);
  background: var(--cursor-accent-dim);
}

.composer-mobile-menu-search {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md);
  background: var(--cursor-overlay-subtle);
  width: 100%;
  color: var(--color-cursor-text);
  margin: 0 0 8px;
  padding: 10px 12px;
  font-size: 16px;
}

.composer-mobile-menu-search:focus, .composer-mobile-menu-search:focus-visible {
  border-color: var(--color-cursor-border-soft);
  box-shadow: none;
  outline: none;
}

input[type="search"]:focus, input[type="search"]:focus-visible {
  box-shadow: none;
  outline: none;
}

.composer-mobile-menu-row {
  border: none;
  border-bottom: 1px solid var(--color-cursor-border-soft);
  width: 100%;
  min-height: 44px;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-base);
  text-align: left;
  cursor: pointer;
  background: none;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  display: flex;
}

.composer-mobile-menu-row.is-active {
  color: var(--cursor-accent);
  background: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .composer-mobile-menu-row.is-active {
    background: color-mix(in srgb, var(--cursor-accent) 8%, transparent);
  }
}

.composer-mobile-menu-row.is-muted {
  color: var(--color-cursor-muted);
  font-size: var(--desk-text-sm);
}

.composer-mobile-menu-row-main {
  flex-direction: column;
  flex: 1;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.composer-mobile-menu-row-title {
  font-weight: 500;
}

.composer-mobile-menu-row-sub {
  font-size: var(--desk-text-sm);
  color: var(--color-cursor-muted);
}

.composer-mobile-menu-row-icon {
  color: var(--color-cursor-muted);
  flex-shrink: 0;
}

.composer-mobile-menu-check {
  color: var(--cursor-accent);
  flex-shrink: 0;
  margin-left: auto;
  font-size: 14px;
}

.composer-mobile-menu-tool {
  border-radius: var(--cursor-radius-md);
  background: var(--cursor-overlay-subtle);
  border-bottom: none;
  width: calc(100% - 16px);
  margin: 0 8px 4px;
}

@media (min-width: 900px) {
  .desk-mobile-sheet-panel.composer-mobile-menu-panel {
    max-width: 420px;
  }

  .composer-mobile-menu-search {
    font-size: 14px;
  }
}

.desk-context-ring-btn {
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  padding: 0;
}

.desk-context-ring-btn:disabled {
  opacity: .72;
  cursor: default;
}

.desk-context-ring-btn.is-compacting {
  width: 28px;
  min-width: 28px;
  padding: 0;
}

.desk-context-ring-graphic {
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: flex;
}

.desk-context-ring-graphic svg {
  display: block;
}

.desk-context-ring-track {
  stroke: var(--color-cursor-muted);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-context-ring-track {
    stroke: color-mix(in srgb, var(--color-cursor-muted) 28%, transparent);
  }
}

.desk-context-ring-fill {
  stroke: var(--color-cursor-accent, #6ea8fe);
  stroke-linecap: round;
  transition: stroke-dashoffset .25s, stroke .2s;
}

.desk-context-ring-btn.is-warn .desk-context-ring-fill {
  stroke: #e6a23c;
}

.desk-context-ring-btn.is-critical .desk-context-ring-fill {
  stroke: #f56c6c;
}

.desk-context-ring-btn.is-critical:not(.is-compacting) {
  animation: 1.6s ease-in-out infinite desk-context-ring-pulse;
}

.desk-context-ring-pct {
  display: none !important;
}

@keyframes desk-context-ring-pulse {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: .72;
  }
}

.cursor-toolbar-pill {
  border-radius: var(--cursor-radius-sm);
  min-height: 22px;
  color: var(--color-cursor-muted);
  font-size: var(--desk-text-sm);
  cursor: pointer;
  white-space: nowrap;
  max-width: 132px;
  transition: background var(--cursor-ease), color var(--cursor-ease);
  background: none;
  border: none;
  flex: none;
  align-items: center;
  gap: 3px;
  padding: 2px 8px;
  font-weight: 500;
  line-height: 1.2;
  display: inline-flex;
}

.cursor-toolbar-pill:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.cursor-toolbar-pill .cursor-pill-label {
  text-overflow: ellipsis;
  overflow: hidden;
}

.cursor-toolbar-pill.muted {
  color: var(--color-cursor-muted);
}

.cursor-infinity {
  opacity: .85;
  font-size: 14px;
  line-height: 1;
}

.cursor-toolbar-icon {
  border-radius: var(--cursor-radius-sm);
  width: 28px;
  height: 28px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  transition: background var(--cursor-ease), color var(--cursor-ease);
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.cursor-toolbar-icon:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.cursor-toolbar-icon.cursor-composer-submit {
  background: var(--cursor-overlay-subtle);
  color: #ffffff40;
  border: none;
  border-radius: 50%;
  width: 28px;
  height: 28px;
  margin-left: 2px;
}

.cursor-toolbar-icon.cursor-composer-submit:not(:disabled) {
  background: var(--cursor-accent);
  color: var(--cursor-on-accent, #fff);
}

.cursor-toolbar-icon.cursor-composer-submit:not(:disabled):hover {
  background: var(--cursor-accent-hover);
  color: var(--cursor-on-accent, #fff);
}

.cursor-toolbar-icon.cursor-composer-submit:disabled {
  opacity: 1;
  cursor: default;
}

.cursor-toolbar-icon.cursor-composer-submit.is-stop:not(:disabled) {
  background: var(--cursor-accent);
  color: var(--cursor-on-accent, #fff);
}

.cursor-toolbar-icon.cursor-composer-submit.is-stop:not(:disabled):hover {
  background: var(--cursor-accent-hover);
  color: var(--cursor-on-accent, #fff);
}

.cursor-toolbar-icon.cursor-composer-mobile-menu {
  background: var(--cursor-overlay-subtle);
  color: #ffffff40;
  border: none;
  border-radius: 50%;
  width: 28px;
  height: 28px;
}

.cursor-toolbar-icon.cursor-composer-mobile-menu:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.cursor-toolbar-icon.cursor-composer-mobile-menu.active {
  color: var(--cursor-accent);
  background: var(--cursor-accent-dim);
}

.cursor-composer-popover {
  z-index: 10000;
  background: var(--cursor-surface-overlay);
  border: 1px solid var(--cursor-border-subtle);
  border-radius: var(--cursor-radius-lg);
  min-width: 160px;
  max-width: min(320px, 100vw - 16px);
  box-shadow: var(--cursor-shadow-pop);
  padding: 5px;
  position: fixed;
}

.cursor-composer-popover.wide {
  flex-direction: column;
  min-width: 280px;
  max-height: min(420px, 50vh);
  display: flex;
  overflow: hidden;
}

.cursor-popover-search {
  border-radius: var(--cursor-radius-sm);
  background: var(--cursor-surface-input);
  width: 100%;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-sm);
  transition: border-color var(--cursor-ease);
  border: 1px solid #0000;
  outline: none;
  margin-bottom: 4px;
  padding: 7px 9px;
  font-family: inherit;
}

.cursor-popover-search:focus, .cursor-popover-search:focus-visible {
  box-shadow: none;
  border-color: #0000;
  outline: none;
}

.cursor-popover-search::placeholder {
  color: #666;
}

.cursor-popover-auto {
  border-radius: var(--cursor-radius-sm);
  width: 100%;
  color: var(--color-cursor-text);
  text-align: left;
  cursor: pointer;
  transition: background var(--cursor-ease);
  background: none;
  border: none;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 4px;
  padding: 9px 28px 9px 9px;
  display: flex;
  position: relative;
}

.cursor-popover-auto:hover, .cursor-popover-auto.active {
  background: var(--cursor-overlay-hover);
}

.cursor-popover-auto-label {
  width: 100%;
  font-size: 13px;
  font-weight: 500;
}

.cursor-popover-auto-desc {
  color: var(--color-cursor-muted);
  width: 100%;
  font-size: 11px;
}

.cursor-popover-auto .cursor-popover-check {
  margin-left: 0;
  position: absolute;
  top: 10px;
  right: 10px;
}

.cursor-popover-models {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}

.cursor-popover-item {
  border-radius: var(--cursor-radius-sm);
  width: 100%;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-sm);
  text-align: left;
  cursor: pointer;
  transition: background var(--cursor-ease);
  background: none;
  border: none;
  justify-content: space-between;
  align-items: center;
  padding: 7px 9px;
  font-family: inherit;
  display: flex;
}

.cursor-popover-item:hover, .cursor-popover-item.active {
  background: var(--cursor-overlay-hover);
}

.cursor-popover-item.muted {
  color: var(--color-cursor-muted);
  border-top: 1px solid var(--cursor-border-subtle);
  margin-top: 4px;
  padding-top: 9px;
}

.cursor-popover-check {
  color: var(--cursor-accent);
  font-size: var(--desk-text-sm);
  margin-left: 8px;
}

.cursor-ref-search {
  border-radius: var(--cursor-radius-sm);
  background: var(--cursor-surface-input);
  width: 100%;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-sm);
  border: 1px solid #0000;
  outline: none;
  margin-bottom: 6px;
  padding: 7px 9px;
  font-family: inherit;
}

.cursor-ref-search:focus, .cursor-ref-search:focus-visible {
  box-shadow: none;
  border-color: #0000;
  outline: none;
}

.sr-only {
  clip: rect(0, 0, 0, 0);
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.cursor-badge-await {
  color: #f0c040;
  background: #2a2210;
  border-radius: 4px;
  flex-shrink: 0;
  margin-left: 6px;
  padding: 2px 6px;
  font-size: 10px;
}

.cursor-attach-chips {
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 0 8px;
  display: flex;
}

.cursor-attach-chip {
  border-radius: var(--cursor-radius-sm);
  border: 1px solid var(--cursor-border-subtle);
  background: var(--cursor-surface);
  max-width: min(240px, 100%);
  color: var(--color-cursor-muted);
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  font-size: 11px;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.cursor-attach-chip.is-uploading {
  padding-bottom: 6px;
}

.cursor-attach-chip.is-error {
  border-color: #ff606073;
}

.cursor-attach-chip-thumb {
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}

.cursor-attach-chip-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.cursor-attach-chip-progress {
  background: var(--cursor-overlay-hover);
  height: 2px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.cursor-attach-chip-progress > span {
  background: var(--cursor-accent);
  height: 100%;
  transition: width .12s linear;
  display: block;
}

.cursor-attach-chip button {
  color: inherit;
  cursor: pointer;
  background: none;
  border: none;
  flex-shrink: 0;
  padding: 0;
  display: flex;
}

.cursor-attach-tiles {
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 0 8px;
  display: flex;
}

.cursor-composer > .cursor-attach-tiles {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  box-sizing: border-box;
  flex-wrap: nowrap;
  width: 100%;
  min-width: 0;
  padding: 0 10px 8px;
  overflow: auto hidden;
}

.cursor-composer > .cursor-attach-tiles::-webkit-scrollbar {
  display: none;
}

.msg-user-body .cursor-attach-tiles {
  justify-content: flex-start;
  padding: 0 0 10px;
}

.cursor-attach-tile {
  flex-shrink: 0;
  position: relative;
}

.cursor-attach-tile.is-square {
  width: 44px;
  height: 44px;
}

.cursor-attach-tile.is-video {
  width: 72px;
  height: 40px;
}

.cursor-attach-tile.is-tag {
  max-width: min(220px, 100%);
}

.cursor-attach-tile-open {
  border: 1px solid var(--cursor-border-subtle);
  background: var(--cursor-surface);
  color: var(--color-cursor-text);
  cursor: pointer;
  transition: background var(--cursor-ease), border-color var(--cursor-ease);
  font: inherit;
  align-items: center;
  gap: 6px;
  padding: 0;
  display: flex;
}

.cursor-attach-tile.is-square .cursor-attach-tile-open {
  background: var(--desk-transparency-bg);
  width: 44px;
  height: 44px;
  box-shadow: inset 0 0 0 1px var(--desk-transparency-border);
  border-radius: 8px;
  justify-content: center;
  overflow: hidden;
}

.cursor-attach-tile.is-square .cursor-attach-tile-open:hover {
  background: var(--desk-transparency-bg);
}

.cursor-attach-tile.is-video .cursor-attach-tile-open {
  border-radius: 8px;
  justify-content: center;
  width: 72px;
  height: 40px;
  overflow: hidden;
}

.cursor-attach-tile.is-video .cursor-attach-tile-img {
  object-fit: cover;
}

.cursor-attach-tile.is-tag .cursor-attach-tile-open {
  border-radius: var(--cursor-radius-sm);
  max-width: 100%;
  min-height: 32px;
  padding: 4px 8px 4px 6px;
  font-size: 11px;
}

.cursor-attach-tile-open:hover {
  background: var(--color-cursor-hover);
  border-color: var(--color-cursor-border);
}

.cursor-attach-tile-img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.cursor-attach-tile-fallback {
  width: 100%;
  height: 100%;
  color: var(--color-cursor-muted);
  background: var(--cursor-overlay-subtle);
  justify-content: center;
  align-items: center;
  display: flex;
}

.cursor-attach-tile-icon {
  color: var(--color-cursor-muted);
  flex-shrink: 0;
  display: flex;
}

.cursor-attach-tile-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text);
  overflow: hidden;
}

.cursor-attach-tile-badge {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  background: var(--cursor-overlay-subtle);
  border-radius: 4px;
  flex-shrink: 0;
  padding: 1px 4px;
  font-size: 10px;
}

.cursor-attach-tile-remove {
  border: 1px solid var(--cursor-border-subtle);
  background: var(--color-cursor-sidebar);
  width: 18px;
  height: 18px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: flex;
  position: absolute;
  top: -4px;
  right: -4px;
}

.cursor-attach-tile-remove:hover {
  color: var(--color-cursor-text);
  background: var(--color-cursor-hover);
}

.cursor-attach-preview-folder {
  flex: 1;
  min-height: 0;
  padding: 8px 4px;
  overflow: auto;
}

.cursor-attach-preview-folder-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cursor-attach-preview-folder-row {
  color: var(--color-cursor-text);
  border-radius: 6px;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  font-size: 13px;
  display: flex;
}

.cursor-attach-preview-folder-row:hover {
  background: var(--cursor-overlay-muted);
}

.cursor-attach-tile.is-uploading .cursor-attach-tile-open {
  opacity: .85;
}

.cursor-attach-tile.is-error .cursor-attach-tile-open {
  border-color: #ff606073;
}

.cursor-attach-tile-progress {
  background: var(--cursor-overlay-hover);
  border-radius: 0 0 8px 8px;
  height: 2px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}

.cursor-attach-tile-progress > span {
  background: var(--cursor-accent);
  height: 100%;
  display: block;
}

.cursor-attach-preview-dock {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-composer-radius);
  background: var(--mos-surface);
  flex-direction: column;
  width: 100%;
  max-height: min(38vh, 320px);
  margin-bottom: 8px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-attach-preview-dock {
    background: color-mix(in srgb, var(--mos-surface) 88%, var(--mos-bg));
  }
}

.cursor-attach-preview-dock {
  overflow: hidden;
  box-shadow: 0 8px 28px #00000024;
}

.cursor-attach-preview-dock .cursor-attach-preview-head {
  height: 36px;
  min-height: 36px;
}

.cursor-attach-preview-dock .cursor-attach-preview-body {
  max-height: min(32vh, 280px);
}

.cursor-attach-preview-overlay {
  z-index: 340;
  pointer-events: auto;
  justify-content: center;
  align-items: center;
  padding: 24px 16px;
  display: flex;
  position: fixed;
  inset: 0;
}

.cursor-attach-preview-backdrop {
  cursor: pointer;
  background: #0000009e;
  border: none;
  position: absolute;
  inset: 0;
}

.cursor-attach-preview-panel {
  z-index: 2;
  width: min(var(--desk-composer-max), 100%);
  max-height: min(calc(100dvh - var(--desk-mobile-head-h, 44px) - var(--desk-mobile-tab-h, 56px) - 48px), 720px);
  border: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  border-radius: 12px;
  flex-direction: column;
  display: flex;
  position: relative;
  overflow: hidden;
  box-shadow: 0 24px 64px #00000073;
}

.cursor-attach-preview-head {
  border-bottom: 1px solid var(--color-cursor-border-soft);
}

.cursor-attach-preview-title {
  flex: 1;
  min-width: 0;
  font-size: 13px;
  font-weight: 500;
}

.cursor-attach-preview-body {
  background: var(--color-cursor-chat, var(--color-cursor-bg));
  flex-direction: column;
  flex: 1;
  min-height: 0;
  display: flex;
  overflow: auto;
}

.cursor-attach-preview-loading, .cursor-attach-preview-fallback, .cursor-attach-preview-media, .cursor-attach-preview-audio {
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: 12px;
  min-height: 0;
  padding: 24px;
  display: flex;
}

.cursor-attach-preview-media.desk-media-player-embed {
  flex: 0 auto;
  width: 100%;
  padding: 12px 16px 16px;
}

.cursor-attach-preview-media {
  padding: 0;
  overflow: hidden;
}

.cursor-attach-preview-image, .cursor-attach-preview-video {
  object-fit: contain;
  border-radius: 8px;
  max-width: 100%;
  max-height: min(70vh, 720px);
}

.cursor-attach-preview-dock:has(.cursor-attach-preview-image) {
  background: var(--studio-composer-glass, var(--mos-surface));
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-attach-preview-dock:has(.cursor-attach-preview-image) {
    background: var(--studio-composer-glass, color-mix(in srgb, var(--mos-surface) 34%, transparent));
  }
}

.cursor-attach-preview-dock:has(.cursor-attach-preview-image) {
  border: 1px solid var(--color-cursor-border-soft);
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(8px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(8px));
}

[data-appearance="light"] .cursor-attach-preview-dock:has(.cursor-attach-preview-image) {
  background: var(--studio-composer-glass, var(--mos-bg));
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .cursor-attach-preview-dock:has(.cursor-attach-preview-image) {
    background: var(--studio-composer-glass, color-mix(in srgb, var(--mos-bg) 34%, transparent));
  }
}

.cursor-attach-preview-dock:has(.cursor-attach-preview-image) .cursor-attach-preview-head {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-sidebar) !important;
}

.cursor-attach-preview-dock:has(.cursor-attach-preview-image) .cursor-attach-preview-title {
  color: var(--color-cursor-text);
}

.cursor-attach-preview-dock:has(.cursor-attach-preview-image) .cursor-attach-preview-body {
  background: var(--color-cursor-bg);
}

.cursor-attach-preview-dock:has(.cursor-attach-preview-image) .cursor-attach-preview-media {
  background: var(--color-cursor-bg);
  padding: 0;
}

:is([data-appearance="light"] .cursor-attach-preview-dock:has(.cursor-attach-preview-image) .cursor-attach-preview-body, [data-appearance="light"] .cursor-attach-preview-dock:has(.cursor-attach-preview-image) .cursor-attach-preview-media) {
  background: var(--mos-panel);
}

.cursor-attach-preview-dock:has(.cursor-attach-preview-image) .cursor-attach-preview-image {
  background: var(--desk-transparency-bg);
  width: 100%;
  max-width: 100%;
  box-shadow: inset 0 0 0 1px var(--desk-transparency-border);
  border-radius: 0;
  display: block;
}

.cursor-attach-preview-iframe {
  background: var(--mos-panel);
  border: 0;
  flex: 1;
  width: 100%;
  min-height: min(70vh, 720px);
}

.cursor-attach-preview-pre, .cursor-attach-preview-textarea {
  width: 100%;
  min-height: min(60vh, 640px);
  color: var(--color-cursor-text);
  font-family: var(--font-mono, ui-monospace, monospace);
  white-space: pre-wrap;
  resize: none;
  background: none;
  border: none;
  flex: 1;
  margin: 0;
  padding: 16px 18px;
  font-size: 12px;
  line-height: 1.5;
  overflow: auto;
}

.cursor-attach-preview-textarea:focus {
  outline: none;
}

.cursor-attach-preview-file-icon {
  color: var(--color-cursor-muted);
}

.cursor-attach-preview-file-name {
  text-align: center;
  font-size: 14px;
  font-weight: 500;
}

.cursor-attach-preview-actions {
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  display: flex;
}

.cursor-attach-preview-link {
  color: #7eb6ff;
  font-size: 13px;
  text-decoration: none;
}

.cursor-attach-preview-link:hover {
  text-decoration: underline;
}

.cursor-composer-box.is-drop-target {
  border-style: solid !important;
  border-color: var(--cursor-accent, #6b8afd) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-box.is-drop-target {
    border-color: color-mix(in srgb, var(--cursor-accent, #6b8afd) 48%, var(--studio-composer-glass-border, #ffffff24)) !important;
  }
}

.cursor-composer-box.is-drop-target {
  background: var(--studio-composer-glass, #07111f82) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-box.is-drop-target {
    background: color-mix(in srgb, var(--studio-composer-glass, #07111f82) 86%, var(--cursor-accent, #6b8afd) 14%) !important;
  }
}

.cursor-composer-box.is-drop-target {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
  box-shadow: 0 16px 40px #00000052, 0 0 0 1.5px var(--cursor-accent, #6b8afd), 0 8px 28px var(--cursor-accent, #6b8afd), inset 0 1px 0 #ffffff1a;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer-box.is-drop-target {
    box-shadow: 0 16px 40px #00000052, 0 0 0 1.5px color-mix(in srgb, var(--cursor-accent, #6b8afd) 42%, transparent), 0 8px 28px color-mix(in srgb, var(--cursor-accent, #6b8afd) 18%, transparent), inset 0 1px 0 #ffffff1a;
  }
}

.cursor-explorer-panel.is-drop-target {
  background: var(--studio-composer-glass-muted, #07111f70);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-explorer-panel.is-drop-target {
    background: color-mix(in srgb, var(--studio-composer-glass-muted, #07111f70) 92%, var(--cursor-accent, #6b8afd) 8%);
  }
}

.cursor-explorer-panel.is-drop-target {
  box-shadow: inset 0 0 0 1px var(--studio-composer-glass-border, #ffffff1a);
}

.studio-files-drop-zone {
  position: relative;
}

.studio-files-drop-zone.is-drop-target {
  box-shadow: inset 0 0 0 1px var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-files-drop-zone.is-drop-target {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent) 55%, transparent);
  }
}

.studio-files-drop-zone.is-drop-target {
  background: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-files-drop-zone.is-drop-target {
    background: color-mix(in srgb, var(--cursor-accent) 5%, var(--mos-page));
  }
}

.studio-files-drop-zone.is-drop-target:after {
  content: "Drop to upload";
  z-index: 12;
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  color: var(--color-cursor-text);
  box-shadow: var(--cursor-shadow-menu);
  pointer-events: none;
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 600;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.desk-file-grid-item, .desk-file-preview-item, .desk-file-list-row {
  position: relative;
}

.desk-file-selection-check {
  z-index: 4;
  width: 17px;
  height: 17px;
  color: var(--mos-page);
  background: var(--mos-plate-strong);
  border-radius: 5px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: absolute;
  top: 6px;
  right: 6px;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-selection-check {
    background: color-mix(in srgb, var(--mos-plate-strong) 88%, transparent);
  }
}

.desk-file-selection-check {
  box-shadow: inset 0 0 0 1px var(--color-cursor-border-soft);
}

.desk-file-list-row .desk-file-selection-check {
  top: 50%;
  transform: translateY(-50%);
}

.desk-file-selection-check.is-selected {
  background: var(--cursor-accent);
  box-shadow: none;
}

.studio-file-select-toggle, .studio-file-selection-bar button, .studio-file-transfer button {
  cursor: pointer;
}

.studio-file-selection-bar button, .studio-file-transfer button {
  color: var(--color-cursor-text);
  border: 0;
}

.studio-file-select-toggle {
  flex: none;
  justify-content: center;
  gap: 0;
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  margin: 0;
  padding: 0;
  box-shadow: none !important;
}

.studio-file-select-toggle:hover, .studio-file-select-toggle:active, .studio-file-select-toggle.is-active, .studio-file-select-toggle:focus-visible {
  box-shadow: none !important;
}

.studio-file-inline-tools {
  justify-content: flex-end;
  align-items: center;
  gap: 4px;
  padding: 4px 8px 2px;
  display: flex;
}

.studio-file-selection-bar {
  min-height: var(--cursor-head-h, 36px);
  border-top: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate);
  color: var(--color-cursor-muted);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 8px 6px 10px;
  font-size: 10px;
  display: flex;
}

.studio-file-selection-bar > div {
  align-items: center;
  gap: 5px;
  display: flex;
}

.studio-file-selection-bar button {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate-strong);
  align-items: center;
  gap: 5px;
  min-height: 25px;
  padding: 0 8px;
  font-size: 10px;
  font-weight: 600;
  display: inline-flex;
}

.studio-file-selection-bar button:hover {
  background: var(--mos-active);
}

.studio-file-selection-bar button.is-primary {
  background: var(--cursor-accent);
  color: var(--cursor-on-accent, #fff);
}

.studio-file-selection-bar button:disabled {
  opacity: .46;
  cursor: not-allowed;
}

.studio-file-selection-bar button.studio-file-selection-action.is-danger {
  color: var(--color-cursor-danger, #e5484d);
}

.studio-file-tree-scroll.is-marquee-active {
  -webkit-user-select: none;
  user-select: none;
}

.desk-file-marquee {
  z-index: 40;
  pointer-events: none;
  border: 1px solid var(--cursor-accent, #00c2c7);
  position: fixed;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-marquee {
    border: 1px solid color-mix(in srgb, var(--cursor-accent, #00c2c7) 80%, #fff);
  }
}

.desk-file-marquee {
  background: var(--cursor-accent, #00c2c7);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-marquee {
    background: color-mix(in srgb, var(--cursor-accent, #00c2c7) 18%, transparent);
  }
}

.desk-file-marquee {
  box-sizing: border-box;
  border-radius: 4px;
}

.studio-file-transfer-layer {
  z-index: 120;
  pointer-events: none;
  position: fixed;
  inset: 0;
}

.studio-file-transfer-tray {
  border-top: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate);
  flex-direction: column;
  gap: 3px;
  max-height: 88px;
  padding: 4px;
  display: flex;
  overflow-y: auto;
}

.studio-file-transfer-tray.is-floating {
  z-index: 120;
  pointer-events: auto;
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  flex: none;
  width: min(240px, 100vw - 24px);
  height: max-content;
  max-height: 88px;
  position: absolute;
  bottom: 12px;
  right: 12px;
  box-shadow: 0 8px 20px #00000024;
}

.studio-polish.is-studio-mobile .studio-file-transfer-layer .studio-file-transfer-tray.is-floating {
  bottom: calc(12px + var(--studio-mobile-bottom-nav-height, 56px) + var(--studio-keyboard-inset, 0px));
  width: min(240px, 100vw - 20px);
  right: 10px;
}

body:has(.studio-polish.is-studio-mobile) .studio-file-transfer-tray.is-floating {
  bottom: calc(12px + var(--studio-mobile-bottom-nav-height, 56px) + var(--studio-keyboard-inset, 0px));
  width: min(240px, 100vw - 20px);
  right: 10px;
}

.studio-file-transfer {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate-strong);
  align-items: center;
  gap: 5px;
  height: 28px;
  min-height: 28px;
  padding: 0 4px 0 6px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-file-transfer-progress {
  background: var(--cursor-accent);
  width: 0;
  position: absolute;
  inset: 0 auto 0 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-file-transfer-progress {
    background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  }
}

.studio-file-transfer-progress {
  pointer-events: none;
  transition: width .16s ease-out;
}

.studio-file-transfer-progress.is-indeterminate {
  width: 34%;
  animation: 1.15s ease-in-out infinite desk-download-indeterminate;
}

.studio-file-transfer-icon, .studio-file-transfer-label, .studio-file-transfer-bytes, .studio-file-transfer button {
  z-index: 1;
  position: relative;
}

.studio-file-transfer-icon {
  color: var(--cursor-accent);
  display: inline-flex;
}

.studio-file-transfer-label {
  min-width: 0;
  color: var(--color-cursor-text);
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  font-size: 10px;
  font-weight: 550;
  overflow: hidden;
}

.studio-file-transfer-bytes {
  color: var(--color-cursor-muted);
  flex: none;
  font-size: 9px;
}

.studio-file-transfer button {
  background: none;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  width: 21px;
  height: 21px;
  padding: 0;
  display: inline-flex;
}

.studio-file-transfer button:hover {
  background: var(--mos-hover);
}

.studio-file-transfer.is-done .studio-file-transfer-icon {
  color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-file-transfer.is-done .studio-file-transfer-icon {
    color: color-mix(in srgb, var(--cursor-accent) 54%, #22c55e);
  }
}

.studio-file-transfer.is-error .studio-file-transfer-icon, .studio-file-transfer.is-error .studio-file-transfer-label {
  color: #ef7d7d;
}

.studio-file-transfer-spinner {
  animation: .85s linear infinite studio-file-transfer-spin;
}

@keyframes studio-file-transfer-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-file-transfer-spinner, .studio-file-transfer-progress.is-indeterminate {
    animation: none;
  }
}

.desk-file-list-row.is-drag-over {
  border: 1px solid var(--cursor-accent, #6b8afd) !important;
  border-radius: 10px !important;
  outline: none !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-list-row.is-drag-over {
    border: 1px solid color-mix(in srgb, var(--cursor-accent, #6b8afd) 55%, transparent) !important;
  }
}

.desk-file-list-row.is-drag-over {
  background: var(--cursor-accent, #6b8afd) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-list-row.is-drag-over {
    background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 16%, var(--mos-plate, var(--color-cursor-sidebar, transparent))) !important;
  }
}

.desk-file-list-row.is-drag-over {
  box-shadow: 0 0 0 1px var(--cursor-accent, #6b8afd), inset 0 0 0 1px var(--cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-list-row.is-drag-over {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent, #6b8afd) 28%, transparent), inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, #6b8afd) 18%, transparent);
  }
}

.desk-file-grid-item.is-drag-over, .desk-file-preview-item.is-drag-over {
  box-shadow: none !important;
  background: none !important;
  border: none !important;
  outline: none !important;
}

.desk-file-grid-item.is-drag-over .desk-file-thumb-visual, .desk-file-preview-item.is-drag-over .desk-file-thumb-visual {
  border: 1px solid var(--cursor-accent, #6b8afd) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-grid-item.is-drag-over .desk-file-thumb-visual, .desk-file-preview-item.is-drag-over .desk-file-thumb-visual {
    border: 1px solid color-mix(in srgb, var(--cursor-accent, #6b8afd) 60%, transparent) !important;
  }
}

.desk-file-grid-item.is-drag-over .desk-file-thumb-visual, .desk-file-preview-item.is-drag-over .desk-file-thumb-visual {
  background: var(--cursor-accent, #6b8afd) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-grid-item.is-drag-over .desk-file-thumb-visual, .desk-file-preview-item.is-drag-over .desk-file-thumb-visual {
    background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 18%, var(--mos-plate, transparent)) !important;
  }
}

.desk-file-grid-item.is-drag-over .desk-file-thumb-visual, .desk-file-preview-item.is-drag-over .desk-file-thumb-visual {
  box-shadow: 0 0 0 2px var(--cursor-accent, #6b8afd), 0 10px 24px var(--cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-grid-item.is-drag-over .desk-file-thumb-visual, .desk-file-preview-item.is-drag-over .desk-file-thumb-visual {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--cursor-accent, #6b8afd) 35%, transparent), 0 10px 24px color-mix(in srgb, var(--cursor-accent, #6b8afd) 18%, transparent);
  }
}

.desk-file-breadcrumbs-chip.is-drag-over {
  border: 1px solid var(--cursor-accent, #6b8afd) !important;
  outline: none !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-breadcrumbs-chip.is-drag-over {
    border: 1px solid color-mix(in srgb, var(--cursor-accent, #6b8afd) 55%, transparent) !important;
  }
}

.desk-file-breadcrumbs-chip.is-drag-over {
  background: var(--cursor-accent, #6b8afd) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-breadcrumbs-chip.is-drag-over {
    background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 18%, transparent) !important;
  }
}

.desk-file-breadcrumbs-chip.is-drag-over {
  box-shadow: 0 0 0 1px var(--cursor-accent, #6b8afd);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-file-breadcrumbs-chip.is-drag-over {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent, #6b8afd) 30%, transparent);
  }
}

.desk-explorer-dialog-backdrop {
  z-index: 600;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  background: #0000008c;
  justify-content: center;
  align-items: center;
  padding: 16px;
  display: flex;
  position: fixed;
  inset: 0;
}

.desk-explorer-dialog {
  border: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  width: min(420px, 100%);
  max-height: min(90vh, 640px);
  box-shadow: var(--cursor-shadow-pop, 0 16px 48px #00000073);
  border-radius: 12px;
  padding: 16px;
  position: relative;
  overflow: auto;
}

.desk-explorer-dialog-head {
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
  display: flex;
}

.desk-explorer-dialog-head h2 {
  color: var(--color-cursor-text);
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}

.desk-explorer-dialog-sub, .desk-explorer-dialog-message, .desk-explorer-dialog-detail {
  color: var(--color-cursor-text);
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.45;
}

.desk-explorer-dialog-sub, .desk-explorer-dialog-detail {
  color: var(--color-cursor-muted);
}

.desk-explorer-dialog-close {
  width: 36px;
  height: 36px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.desk-explorer-dialog-close svg {
  width: 18px;
  height: 18px;
}

.desk-explorer-dialog-close:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.desk-explorer-dialog-label {
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  margin-bottom: 6px;
  font-size: 11px;
  font-weight: 600;
  display: block;
}

.desk-explorer-dialog-hint {
  color: var(--color-cursor-muted);
  margin: 0 0 12px;
  font-size: 12px;
  line-height: 1.45;
}

.desk-explorer-dialog-field {
  margin-bottom: 12px;
  display: block;
}

.desk-explorer-dialog-field input, .desk-explorer-dialog-field textarea {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-bg, #111);
  width: 100%;
  color: var(--color-cursor-text);
  resize: vertical;
  border-radius: 8px;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 13px;
}

.desk-explorer-dialog-types {
  margin-bottom: 12px;
}

.desk-explorer-dialog-type-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  display: grid;
}

.desk-explorer-dialog-type {
  border: 1px solid var(--color-cursor-border-soft);
  color: var(--color-cursor-text);
  text-align: left;
  cursor: pointer;
  background: none;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 12px;
}

.desk-explorer-dialog-type.is-active, .desk-explorer-dialog-type:hover {
  border-color: var(--cursor-accent, #3b82f6);
  background: var(--cursor-accent, #3b82f6);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-explorer-dialog-type.is-active, .desk-explorer-dialog-type:hover {
    background: color-mix(in srgb, var(--cursor-accent, #3b82f6) 10%, transparent);
  }
}

.desk-explorer-dialog-error {
  color: #f08080;
  margin: 0 0 12px;
  font-size: 12px;
}

.desk-explorer-dialog-actions {
  justify-content: flex-end;
  gap: 8px;
  margin-top: 4px;
  display: flex;
}

.desk-explorer-dialog-btn {
  border: 1px solid var(--color-cursor-border-soft);
  color: var(--color-cursor-text);
  cursor: pointer;
  background: none;
  border-radius: 999px;
  padding: 7px 14px;
  font-size: 12px;
  font-weight: 500;
}

.desk-explorer-dialog-btn:hover {
  background: var(--cursor-overlay-hover);
}

.desk-explorer-dialog-btn.is-primary {
  border-color: var(--cursor-accent, #3b82f6);
  background: var(--cursor-accent, #3b82f6);
  color: var(--cursor-on-accent, #fff);
}

.desk-explorer-dialog-btn.is-danger {
  color: #fff;
  background: #d23c3c;
  border-color: #a73030;
}

.desk-explorer-dialog-btn:disabled {
  opacity: .6;
  cursor: not-allowed;
}

.desk-explorer-pins {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px 6px;
  display: flex;
}

.desk-explorer-pins-head {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 600;
  display: flex;
}

.desk-explorer-pins-icon {
  opacity: .85;
}

.desk-explorer-pins-list {
  flex-direction: column;
  gap: 2px;
  display: flex;
}

.desk-explorer-pin-row {
  align-items: center;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.desk-explorer-pin-btn {
  min-width: 0;
  color: var(--color-cursor-text);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 8px;
  flex: auto;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.2;
  display: flex;
}

.desk-explorer-pin-btn:hover {
  background: var(--cursor-overlay-hover);
}

.desk-explorer-pin-unpin {
  width: 24px;
  height: 24px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.desk-explorer-pin-unpin:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.desk-file-list-pin {
  color: var(--cursor-accent, #3b82f6);
  opacity: .9;
}

.cursor-explorer-uploads {
  border-top: 1px solid var(--color-cursor-border-soft);
  flex-direction: column;
  gap: 8px;
  max-height: min(40vh, 280px);
  padding: 8px 10px 10px;
  display: flex;
  overflow: auto;
}

.cursor-explorer-upload-summary {
  color: var(--color-cursor-muted);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 2px 2px;
  font-size: 11px;
  font-weight: 600;
  display: flex;
}

.cursor-explorer-upload-row {
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.desk-upload-pill {
  flex: auto;
  min-width: 0;
}

.desk-upload-pill-track {
  background: var(--color-cursor-text);
  border-radius: 999px;
  min-height: 34px;
  position: relative;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-upload-pill-track {
    background: color-mix(in srgb, var(--color-cursor-text) 7%, transparent);
  }
}

.desk-upload-pill-track {
  border: 1px solid var(--color-cursor-border-soft);
}

.desk-upload-pill-fill {
  background: var(--cursor-accent, #3b82f6);
  border-radius: 999px;
  width: 0;
  transition: width .16s ease-out;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.desk-upload-pill-text {
  z-index: 1;
  color: #f4f4f5;
  text-shadow: 0 1px 2px #00000073;
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: auto;
  min-width: 0;
  padding: 8px 0 8px 14px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.25;
  display: block;
  position: relative;
  overflow: hidden;
}

.desk-upload-pill-content {
  z-index: 1;
  align-items: center;
  gap: 4px;
  min-height: 34px;
  padding-right: 6px;
  display: flex;
  position: relative;
}

.desk-upload-pill-actions {
  flex-shrink: 0;
  align-items: center;
  gap: 4px;
  display: flex;
}

.desk-upload-pill-btn {
  color: #f4f4f5;
  cursor: pointer;
  background: #00000047;
  border: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 5px 9px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
}

.desk-upload-pill-btn:hover {
  background: #0000006b;
}

.desk-upload-pill-btn.is-primary {
  color: #fff;
  background: #00000059;
}

.desk-upload-pill-dismiss {
  width: 26px;
  height: 26px;
  padding: 0;
}

.desk-upload-pill--done .desk-upload-pill-fill {
  background: var(--cursor-accent, #3b82f6);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-upload-pill--done .desk-upload-pill-fill {
    background: color-mix(in srgb, var(--cursor-accent, #3b82f6) 70%, #22c55e);
  }
}

.desk-upload-pill--error .desk-upload-pill-track {
  border-color: #f08080;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-upload-pill--error .desk-upload-pill-track {
    border-color: color-mix(in srgb, #f08080 35%, var(--color-cursor-border-soft));
  }
}

.desk-upload-pill--error .desk-upload-pill-fill {
  opacity: .72;
  background: #bd3232;
}

.desk-upload-pill--queued .desk-upload-pill-text, .desk-upload-pill--error .desk-upload-pill-text {
  color: var(--color-cursor-text);
  text-shadow: none;
}

.desk-upload-pill-fill.is-indeterminate {
  width: 35%;
  animation: 1.15s ease-in-out infinite desk-download-indeterminate;
}

@keyframes desk-download-indeterminate {
  0% {
    left: -38%;
  }

  100% {
    left: 100%;
  }
}

.cursor-ref-picker {
  border: 1px solid var(--cursor-border-subtle);
  margin: 0 0 8px;
  padding: 4px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-ref-picker {
    border: 1px solid color-mix(in srgb, var(--cursor-border-subtle) 80%, transparent);
  }
}

.cursor-ref-picker {
  border-radius: var(--cursor-radius-lg);
  background: var(--cursor-surface);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-ref-picker {
    background: color-mix(in srgb, var(--cursor-surface) 92%, var(--color-cursor-bg));
  }
}

.cursor-ref-picker {
  flex-direction: column;
  max-height: 200px;
  display: flex;
  overflow: hidden;
  box-shadow: 0 8px 24px #0000002e;
}

.cursor-ref-picker-head {
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
  padding: 4px 8px 6px;
  display: flex;
}

.cursor-ref-picker-hint {
  color: var(--color-cursor-muted);
  font-size: 12px;
}

.cursor-ref-picker-title {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  font-size: 10px;
  font-weight: 600;
}

.cursor-ref-picker-query {
  color: var(--color-cursor-text);
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-size: 12px;
  overflow: hidden;
}

.cursor-ref-picker-loading {
  color: var(--color-cursor-muted);
  letter-spacing: .12em;
  margin-left: auto;
  font-size: 12px;
}

.cursor-ref-scope-chip {
  background: var(--color-cursor-hover);
  color: var(--color-cursor-text);
  cursor: pointer;
  border: none;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
}

.cursor-ref-scope-label {
  color: var(--color-cursor-text);
  font-size: 11px;
  font-weight: 600;
}

.cursor-ref-list {
  flex: 1;
  overflow-y: auto;
}

.cursor-ref-row {
  width: 100%;
  color: var(--color-cursor-text);
  cursor: pointer;
  text-align: left;
  border-radius: var(--cursor-radius-sm);
  transition: background var(--cursor-ease);
  background: none;
  border: none;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  font-size: 13px;
  display: flex;
}

.cursor-ref-row-icon {
  color: var(--color-cursor-muted);
  opacity: .85;
  flex-shrink: 0;
}

.cursor-ref-row.is-highlighted, .cursor-ref-row:hover {
  background: var(--color-cursor-hover);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-ref-row.is-highlighted, .cursor-ref-row:hover {
    background: color-mix(in srgb, var(--color-cursor-hover) 88%, transparent);
  }
}

.cursor-ref-row-main {
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.cursor-ref-row-name {
  max-width: 100%;
  font-size: 13px;
  line-height: 1.25;
}

.cursor-ref-row-sub {
  color: var(--color-cursor-muted);
  opacity: .92;
  max-width: 100%;
  font-size: 11px;
  line-height: 1.25;
}

.cursor-ref-group-label {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  padding: 4px 8px 2px;
  font-size: 10px;
  font-weight: 600;
}

.cursor-ref-group + .cursor-ref-group {
  border-top: 1px solid var(--cursor-border-subtle);
  margin-top: 2px;
  padding-top: 2px;
}

.cursor-ref-empty {
  color: var(--color-cursor-muted);
  margin: 0;
  padding: 8px 10px;
  font-size: 11px;
}

.cursor-dropdown, .cursor-tab-context-menu, .desk-explorer-view-dropdown, .desk-explorer-type-filter-menu {
  background: var(--mos-page);
  flex-direction: column;
  gap: 1px;
  width: max-content;
  min-width: 140px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-dropdown, .cursor-tab-context-menu, .desk-explorer-view-dropdown, .desk-explorer-type-filter-menu {
    background: color-mix(in srgb, var(--mos-page) 42%, var(--mos-plate, var(--mos-bg)));
  }
}

.cursor-dropdown, .cursor-tab-context-menu, .desk-explorer-view-dropdown, .desk-explorer-type-filter-menu {
  border-radius: var(--cursor-radius-md);
  box-shadow: var(--cursor-shadow-menu, var(--cursor-shadow-pop));
  border: none;
  padding: 6px;
  overflow: visible;
}

.cursor-dropdown {
  z-index: 60;
  max-width: min(280px, 90vw);
  margin-bottom: 4px;
  position: absolute;
  bottom: 100%;
  left: 0;
}

.cursor-dropdown.cursor-dropdown-down {
  margin-bottom: 0;
  top: calc(100% + 4px);
  bottom: auto;
}

.cursor-dropdown.is-end {
  left: auto;
  right: 0;
}

.cursor-dropdown.is-start {
  left: 0;
  right: auto;
}

.cursor-dropdown.is-portal {
  z-index: 240;
  margin: 0;
  position: fixed;
  inset: 0 auto auto 0;
  overflow: hidden auto;
}

.cursor-dropdown.is-portal.is-end, .cursor-dropdown.is-portal.is-start {
  left: 0;
  right: auto;
}

.cursor-dropdown-wide {
  min-width: 180px;
  max-height: 200px;
  overflow-y: auto;
}

.cursor-select-menu {
  background: none;
  border: 0;
  flex: none;
  align-items: center;
  width: auto;
  padding: 0;
  display: inline-flex;
  position: relative;
  overflow: visible;
}

.cursor-select-menu .cursor-select-trigger {
  background: var(--mos-text);
  border: none;
  border-radius: 999px;
  justify-content: flex-start;
  align-items: center;
  gap: 5px;
  min-width: 0;
  max-width: none;
  height: 26px;
  margin: 0;
  padding: 0 7px 0 10px;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-select-menu .cursor-select-trigger {
    background: color-mix(in srgb, var(--mos-text) 7%, transparent);
  }
}

.cursor-select-menu .cursor-select-trigger {
  color: var(--color-cursor-text);
  white-space: nowrap;
  cursor: pointer;
  transition: background var(--cursor-ease), color var(--cursor-ease);
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}

.cursor-select-menu .cursor-select-trigger:hover, .cursor-select-menu.is-open .cursor-select-trigger {
  background: var(--mos-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-select-menu .cursor-select-trigger:hover, .cursor-select-menu.is-open .cursor-select-trigger {
    background: color-mix(in srgb, var(--mos-text) 11%, transparent);
  }
}

.cursor-select-menu .cursor-select-trigger:hover, .cursor-select-menu.is-open .cursor-select-trigger {
  color: var(--color-cursor-text);
}

.cursor-select-menu .cursor-select-trigger:disabled {
  opacity: .5;
  cursor: default;
}

.cursor-select-leading, .cursor-dropdown-item-icon {
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted);
  flex: none;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: inline-flex;
}

.cursor-select-leading.is-good, .cursor-dropdown-item-icon.is-good {
  color: var(--mos-success, #22c55e);
}

.cursor-select-leading.is-warn, .cursor-dropdown-item-icon.is-warn {
  color: var(--mos-warning, #f59e0b);
}

.cursor-select-leading.is-bad, .cursor-dropdown-item-icon.is-bad {
  color: var(--mos-danger, #ef4444);
}

.cursor-select-leading.is-info, .cursor-dropdown-item-icon.is-info {
  color: var(--cursor-accent, #3b82f6);
}

.cursor-select-leading.is-muted, .cursor-dropdown-item-icon.is-muted {
  color: var(--color-cursor-muted);
}

.cursor-select-leading svg, .cursor-dropdown-item-icon svg, .cursor-dropdown-item > svg, .cursor-dropdown-item .icon-inline svg {
  stroke-width: 2.1px;
  width: 14px;
  height: 14px;
  display: block;
}

.cursor-select-label {
  text-overflow: clip;
  flex: 0 auto;
  align-items: center;
  min-width: 0;
  height: 100%;
  line-height: 1;
  display: inline-flex;
  overflow: visible;
}

.cursor-select-detail, .cursor-dropdown-item-detail {
  color: var(--color-cursor-muted);
  letter-spacing: .04em;
  flex: none;
  margin-left: auto;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
}

.cursor-select-arrow {
  stroke-width: 2.25px;
  width: 12px;
  height: 12px;
  color: var(--color-cursor-muted);
  flex: none;
  display: block;
}

.cursor-select-menu.is-open .cursor-select-arrow {
  color: var(--color-cursor-text);
}

.cursor-select-menu .cursor-dropdown {
  z-index: 80;
}

.cursor-select-menu.is-field {
  width: 100%;
}

.cursor-select-menu.is-field .cursor-select-trigger {
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: none;
  height: 34px;
  padding: 0 8px 0 12px;
  font-size: 13px;
  line-height: 1;
}

.cursor-select-menu.is-field .cursor-select-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  overflow: hidden;
}

.cursor-select-menu.is-field .cursor-dropdown {
  width: 100%;
  min-width: 100%;
  max-width: none;
}

.cursor-dropdown-item {
  width: 100%;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-sm);
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  transition: background var(--cursor-ease);
  background: none;
  border: none;
  border-radius: 999px;
  align-items: center;
  gap: 7px;
  padding: 5px 8px;
  font-family: inherit;
  font-weight: 500;
  line-height: 1.25;
  display: flex;
}

.cursor-dropdown-item-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  min-width: 0;
  overflow: hidden;
}

.cursor-dropdown-item > span:last-child:not(.cursor-dropdown-item-detail) {
  text-overflow: clip;
  white-space: nowrap;
  flex: 0 auto;
  min-width: 0;
  overflow: visible;
}

.cursor-dropdown-item:hover, .cursor-dropdown-item.active {
  background: var(--mos-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-dropdown-item:hover, .cursor-dropdown-item.active {
    background: color-mix(in srgb, var(--mos-text) 8%, transparent);
  }
}

.cursor-dropdown-item.muted {
  color: var(--color-cursor-muted);
  border-top: 1px solid var(--color-cursor-border);
  margin-top: 4px;
  padding-top: 8px;
}

.cursor-table-wrap, .studio-admin-table-wrap {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  border-radius: var(--cursor-radius-lg, 10px);
  background: var(--mos-plate, var(--mos-bg, var(--cursor-surface-raised)));
  min-height: 0;
  overflow: auto;
}

.cursor-table, .studio-admin-table {
  border-collapse: collapse;
  width: 100%;
  min-width: 760px;
  color: var(--color-cursor-text);
  font-size: 12px;
}

.cursor-table th, .cursor-table td, .studio-admin-table th, .studio-admin-table td {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  text-align: left;
  vertical-align: middle;
  padding: 11px 12px;
}

.cursor-table th, .studio-admin-table th {
  color: var(--color-cursor-muted);
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 650;
}

.cursor-table tbody tr, .studio-admin-table tbody tr {
  cursor: pointer;
}

.cursor-table tbody tr:hover, .cursor-table tbody tr.is-selected, .studio-admin-table tbody tr:hover, .studio-admin-table tbody tr.is-selected {
  background: var(--color-cursor-hover, var(--mos-hover));
}

.cursor-table tbody tr:last-child td, .studio-admin-table tbody tr:last-child td {
  border-bottom: 0;
}

.cursor-table td strong, .studio-admin-table td strong {
  color: var(--color-cursor-text-bright, var(--color-cursor-text));
  font-weight: 700;
  display: block;
}

.cursor-table td span, .studio-admin-table td span {
  color: var(--color-cursor-muted);
  margin-top: 2px;
  font-size: 11px;
  display: block;
}

.cursor-table a, .studio-admin-table a {
  color: var(--cursor-accent);
  font-weight: 700;
  text-decoration: none;
}

.cursor-table-empty {
  text-align: center;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  min-height: 200px;
  padding: 40px 24px;
  display: flex;
}

.cursor-table-empty-icon {
  width: 44px;
  height: 44px;
  color: var(--color-cursor-muted);
  background: var(--mos-plate-strong, var(--color-cursor-hover));
  box-shadow: inset 0 0 0 1px var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
  display: inline-flex;
}

.cursor-table-empty-icon svg {
  stroke-width: 1.6px;
  width: 20px;
  height: 20px;
}

.cursor-table-empty-title {
  color: var(--color-cursor-text);
  margin: 0;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.3;
}

.cursor-table-empty-hint {
  max-width: 280px;
  color: var(--color-cursor-muted);
  margin: 2px 0 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
}

.cursor-table-empty-action {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  display: flex;
}

.cursor-table-loading {
  min-height: 120px;
  color: var(--color-cursor-muted);
  justify-content: center;
  align-items: center;
  padding: 20px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.cursor-table-loading-label {
  opacity: .85;
}

.cursor-composer-modes {
  align-items: center;
  gap: 4px;
  display: flex;
  position: relative;
}

.cursor-chat-menu {
  z-index: 25;
  background: var(--cursor-surface-overlay);
  border: 1px solid var(--cursor-border-subtle);
  border-radius: var(--cursor-radius-md);
  min-width: 128px;
  box-shadow: var(--cursor-shadow-pop);
  padding: 4px;
  position: absolute;
  top: 100%;
  right: 8px;
}

.cursor-chat-menu button {
  width: 100%;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-sm);
  text-align: left;
  cursor: pointer;
  border-radius: var(--cursor-radius-sm);
  transition: background var(--cursor-ease);
  background: none;
  border: none;
  align-items: center;
  gap: 6px;
  padding: 7px 9px;
  font-family: inherit;
  display: flex;
}

.cursor-chat-menu button:hover {
  background: var(--color-cursor-hover);
}

.cursor-chat-menu button.danger {
  color: #f0a0a0;
}

.cursor-settings-overlay {
  z-index: 320;
  pointer-events: auto;
  justify-content: flex-end;
  display: flex;
  position: fixed;
  inset: 0;
}

.cursor-settings-backdrop {
  z-index: 0;
  cursor: pointer;
  pointer-events: auto;
  background: #00000080;
  border: none;
  position: absolute;
  inset: 0;
}

.cursor-settings-panel {
  background: var(--color-cursor-sidebar);
  border-left: 1px solid var(--color-cursor-border);
  z-index: 2;
  pointer-events: auto;
  width: min(420px, 92vw);
  height: 100%;
  font-family: var(--font-cursor);
  flex-direction: column;
  display: flex;
  position: relative;
}

.cursor-settings-head {
  padding: 0 8px 0 12px;
}

.cursor-settings-head .cursor-panel-head-tools .cursor-icon-btn {
  width: 32px;
  height: 32px;
}

.cursor-settings-tabs {
  border-bottom: 1px solid var(--color-cursor-border);
  gap: 2px;
  padding: 8px 10px;
  display: flex;
  overflow-x: auto;
}

.cursor-settings-tab {
  border-radius: var(--cursor-radius-sm);
  color: var(--color-cursor-muted);
  font-size: var(--desk-text-sm);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--cursor-ease), color var(--cursor-ease);
  background: none;
  border: none;
  padding: 5px 10px;
  font-family: inherit;
}

.cursor-settings-tab.active {
  background: var(--color-cursor-hover);
  color: var(--color-cursor-text);
}

.cursor-settings-body {
  flex: 1;
  padding: 12px 14px 24px;
  overflow-y: auto;
}

.cursor-settings-section {
  margin-bottom: 20px;
}

.cursor-settings-section h3 {
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--color-cursor-muted);
  margin: 0 0 10px;
  font-size: 11px;
  font-weight: 600;
}

.cursor-seg {
  gap: 4px;
  display: flex;
}

.cursor-seg button {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm);
  color: var(--color-cursor-muted);
  font-size: var(--desk-text-sm);
  cursor: pointer;
  text-transform: capitalize;
  transition: background var(--cursor-ease), border-color var(--cursor-ease), color var(--cursor-ease);
  background: none;
  flex: 1;
  padding: 7px;
  font-family: inherit;
}

.cursor-seg button.active {
  background: var(--color-cursor-hover);
  color: var(--color-cursor-text);
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-seg button.active {
    border-color: color-mix(in srgb, var(--cursor-accent) 24%, var(--color-cursor-border-soft));
  }
}

.cursor-sidebar-brand {
  letter-spacing: .02em;
  cursor: default;
  pointer-events: none;
  gap: 7px;
}

.cursor-sidebar-brand-logo {
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  display: flex;
}

.cursor-sidebar-brand-text {
  align-items: center;
  gap: 5px;
  min-width: 0;
  display: flex;
}

.cursor-sidebar-brand-os {
  color: var(--color-cursor-text);
  flex-shrink: 0;
  font-weight: 600;
}

.cursor-sidebar-brand-sep {
  color: var(--color-cursor-muted);
  opacity: .7;
  flex-shrink: 0;
  font-weight: 400;
}

.cursor-sidebar-brand-user {
  min-width: 0;
  color: var(--color-cursor-muted);
  letter-spacing: 0;
  align-items: center;
  gap: 4px;
  font-weight: 500;
  display: inline-flex;
}

.cursor-sidebar-brand-user-icon {
  border-radius: var(--cursor-radius-pill);
  background: var(--cursor-overlay-subtle);
  width: 16px;
  height: 16px;
  color: var(--color-cursor-muted);
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;
}

.cursor-sidebar-brand-user-name {
  min-width: 0;
}

.cursor-theme-grid {
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: 6px;
  display: grid;
}

.theme-chip {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm);
  color: var(--color-cursor-muted);
  font-size: var(--desk-text-sm);
  cursor: pointer;
  text-align: left;
  transition: background var(--cursor-ease), border-color var(--cursor-ease), color var(--cursor-ease);
  background: none;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  font-family: inherit;
  display: flex;
}

.theme-chip:hover {
  background: var(--color-cursor-hover);
  color: var(--color-cursor-text);
  border-color: var(--color-cursor-border-subtle, var(--color-cursor-border-soft));
}

.theme-chip.active {
  background: var(--cursor-accent-dim);
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .theme-chip.active {
    border-color: color-mix(in srgb, var(--cursor-accent) 22%, transparent);
  }
}

.theme-chip.active {
  color: var(--color-cursor-text);
}

.theme-chip-swatch {
  border-radius: 999px;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  box-shadow: inset 0 0 0 1px #0000002e;
}

.theme-chip-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.cursor-theme-grid.is-compact {
  grid-template-columns: repeat(auto-fill, minmax(34px, 1fr));
  gap: 8px;
}

.theme-chip.theme-chip-swatch-only {
  border-radius: 999px;
  justify-content: center;
  min-height: 34px;
  padding: 6px;
}

.theme-chip.theme-chip-swatch-only .theme-chip-swatch {
  width: 18px;
  height: 18px;
}

.studio-appearance-mode-group {
  justify-content: center;
  display: flex;
}

.studio-appearance-mode-switcher {
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: auto;
  max-width: 100%;
  display: inline-flex;
}

.studio-appearance-mode-pill {
  border: 1px solid var(--studio-composer-glass-border, var(--color-cursor-border-soft));
  background: var(--studio-composer-glass-muted, var(--mos-surface));
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  height: 30px;
  min-height: 30px;
  padding: 0 14px;
  display: inline-flex;
  position: relative;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-appearance-mode-pill {
    background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-surface) 64%, transparent));
  }
}

.studio-appearance-mode-pill {
  color: var(--color-cursor-text-bright);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-appearance-mode-pill {
    color: color-mix(in srgb, var(--color-cursor-text-bright) 76%, transparent);
  }
}

.studio-appearance-mode-pill {
  cursor: pointer;
  transition: border-color var(--cursor-ease), color var(--cursor-ease), background var(--cursor-ease);
  font-family: inherit;
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
}

.studio-appearance-mode-pill:hover {
  color: var(--color-cursor-text-bright);
}

.studio-appearance-mode-pill.is-active {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-appearance-mode-pill.is-active {
    border-color: color-mix(in srgb, var(--cursor-accent) 40%, transparent);
  }
}

.studio-appearance-mode-pill.is-active {
  background: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-appearance-mode-pill.is-active {
    background: color-mix(in srgb, var(--cursor-accent) 14%, var(--mos-surface));
  }
}

.studio-appearance-mode-pill.is-active {
  color: var(--color-cursor-text-bright);
}

.studio-appearance-mode-pill svg, .studio-appearance-mode-pill .icon-inline {
  flex: none;
  width: 12px;
  height: 12px;
}

.studio-palette-list {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
  min-width: 0;
  display: grid;
}

.studio-palette-pill {
  background: var(--p-accent, var(--cursor-accent));
  color: #fff;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
  width: 100%;
  min-width: 0;
  min-height: 28px;
  transition: box-shadow var(--cursor-ease), filter var(--cursor-ease);
  border: 1px solid #0000;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 10px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.studio-palette-pill:hover {
  filter: brightness(1.06);
}

.studio-palette-pill.is-active {
  box-shadow: 0 0 0 2px var(--mos-plate, var(--mos-panel)), 0 0 0 4px var(--p-accent, var(--cursor-accent));
}

.cursor-mcp-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cursor-mcp-row {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  font-size: 13px;
  display: flex;
}

.cursor-mcp-toggle {
  border-radius: var(--cursor-radius-sm);
  border: 1px solid var(--cursor-border-subtle);
  color: var(--color-cursor-text);
  cursor: pointer;
  transition: background var(--cursor-ease), border-color var(--cursor-ease);
  background: none;
  padding: 3px 9px;
  font-family: inherit;
  font-size: 11px;
}

.cursor-session-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cursor-session-row {
  border: none;
  border-bottom: 1px solid var(--color-cursor-border-soft);
  width: 100%;
  color: var(--color-cursor-text);
  cursor: pointer;
  text-align: left;
  background: none;
  flex-direction: column;
  align-items: flex-start;
  padding: 10px 0;
  font-size: 13px;
  display: flex;
}

.cursor-session-row:hover {
  color: #fff;
}

.cursor-settings-action {
  border-radius: var(--cursor-radius-md);
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-surface);
  width: 100%;
  padding: 9px 10px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-settings-action {
    background: color-mix(in srgb, var(--mos-surface) 72%, var(--mos-bg));
  }
}

.cursor-settings-action {
  color: var(--color-cursor-text);
  font-size: var(--desk-text-ui);
  cursor: pointer;
  transition: background var(--cursor-ease), border-color var(--cursor-ease);
  font-family: inherit;
}

.cursor-settings-action:hover {
  border-color: var(--color-cursor-border-subtle, var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
}

.cursor-settings-action.muted {
  color: var(--color-cursor-muted);
  background: none;
}

.cursor-input {
  width: 100%;
  min-width: 0;
  min-height: var(--studio-control-h, 40px);
  border-radius: var(--studio-input-radius, var(--cursor-radius-xl));
  background: var(--cursor-accent, var(--mos-accent));
  border: none;
  padding: 8px 12px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-input {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 9%, transparent);
  }
}

.cursor-input {
  box-shadow: 0 0 0 1.5px var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-input {
    box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 72%, transparent);
  }
}

.cursor-input {
  color: var(--color-cursor-text);
  font: inherit;
  font-size: var(--studio-fs-md, var(--desk-text-ui, 14px));
  font-weight: var(--desk-w-medium, 500);
  outline: none;
  line-height: 1.45;
}

.cursor-input::placeholder {
  color: var(--color-cursor-muted);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-input::placeholder {
    color: color-mix(in srgb, var(--color-cursor-muted) 82%, transparent);
  }
}

.cursor-input:hover:not(:disabled), .cursor-input:focus, .cursor-input:focus-visible {
  background: var(--cursor-accent, var(--mos-accent));
  border: none;
  outline: none;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-input:hover:not(:disabled), .cursor-input:focus, .cursor-input:focus-visible {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 9%, transparent);
  }
}

.cursor-input:hover:not(:disabled), .cursor-input:focus, .cursor-input:focus-visible {
  box-shadow: 0 0 0 1.5px var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-input:hover:not(:disabled), .cursor-input:focus, .cursor-input:focus-visible {
    box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 72%, transparent);
  }
}

[data-appearance="light"] .cursor-input, [data-appearance="light"] .cursor-input:hover:not(:disabled), [data-appearance="light"] .cursor-input:focus, [data-appearance="light"] .cursor-input:focus-visible {
  background: var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .cursor-input, [data-appearance="light"] .cursor-input:hover:not(:disabled), [data-appearance="light"] .cursor-input:focus, [data-appearance="light"] .cursor-input:focus-visible {
    background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 7%, transparent);
  }
}

[data-appearance="light"] .cursor-input, [data-appearance="light"] .cursor-input:hover:not(:disabled), [data-appearance="light"] .cursor-input:focus, [data-appearance="light"] .cursor-input:focus-visible {
  box-shadow: 0 0 0 1.5px var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .cursor-input, [data-appearance="light"] .cursor-input:hover:not(:disabled), [data-appearance="light"] .cursor-input:focus, [data-appearance="light"] .cursor-input:focus-visible {
    box-shadow: 0 0 0 1.5px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 65%, transparent);
  }
}

.cursor-input:disabled {
  opacity: .6;
  cursor: not-allowed;
}

textarea.cursor-input {
  resize: vertical;
}

.cursor-input:-webkit-autofill {
  caret-color: var(--color-cursor-text-bright, var(--color-cursor-text));
  filter: none;
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  transition: background-color 99999s ease-out;
  -webkit-text-fill-color: var(--color-cursor-text-bright, var(--color-cursor-text)) !important;
  border-color: var(--color-cursor-border-soft) !important;
  background-color: var(--mos-bg, #05080f) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset !important;
  box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset !important;
  background-image: none !important;
}

.cursor-input:-webkit-autofill:hover {
  caret-color: var(--color-cursor-text-bright, var(--color-cursor-text));
  filter: none;
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  transition: background-color 99999s ease-out;
  -webkit-text-fill-color: var(--color-cursor-text-bright, var(--color-cursor-text)) !important;
  border-color: var(--color-cursor-border-soft) !important;
  background-color: var(--mos-bg, #05080f) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset !important;
  box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset !important;
  background-image: none !important;
}

.cursor-input:-webkit-autofill:focus {
  caret-color: var(--color-cursor-text-bright, var(--color-cursor-text));
  filter: none;
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  transition: background-color 99999s ease-out;
  -webkit-text-fill-color: var(--color-cursor-text-bright, var(--color-cursor-text)) !important;
  border-color: var(--color-cursor-border-soft) !important;
  background-color: var(--mos-bg, #05080f) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset !important;
  box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset !important;
  background-image: none !important;
}

.cursor-input:-webkit-autofill:active {
  caret-color: var(--color-cursor-text-bright, var(--color-cursor-text));
  filter: none;
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  transition: background-color 99999s ease-out;
  -webkit-text-fill-color: var(--color-cursor-text-bright, var(--color-cursor-text)) !important;
  border-color: var(--color-cursor-border-soft) !important;
  background-color: var(--mos-bg, #05080f) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset !important;
  box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset !important;
  background-image: none !important;
}

.cursor-input:-webkit-autofill:focus {
  border-color: var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-input:-webkit-autofill:focus {
    border-color: color-mix(in srgb, var(--cursor-accent) 40%, var(--color-cursor-border-soft)) !important;
  }
}

.cursor-input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset, 0 0 0 2px var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset, 0 0 0 2px color-mix(in srgb, var(--cursor-accent) 16%, transparent) !important;
  }
}

.cursor-input:-webkit-autofill:focus {
  box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset, 0 0 0 2px var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-input:-webkit-autofill:focus {
    box-shadow: 0 0 0 1000px var(--mos-bg, #05080f) inset, 0 0 0 2px color-mix(in srgb, var(--cursor-accent) 16%, transparent) !important;
  }
}

[data-appearance="light"] .cursor-input:-webkit-autofill {
  caret-color: var(--color-cursor-text);
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  -webkit-text-fill-color: var(--color-cursor-text) !important;
  background-color: var(--mos-panel) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--mos-panel) inset !important;
  box-shadow: 0 0 0 1000px var(--mos-panel) inset !important;
}

[data-appearance="light"] .cursor-input:-webkit-autofill:hover {
  caret-color: var(--color-cursor-text);
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  -webkit-text-fill-color: var(--color-cursor-text) !important;
  background-color: var(--mos-panel) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--mos-panel) inset !important;
  box-shadow: 0 0 0 1000px var(--mos-panel) inset !important;
}

[data-appearance="light"] .cursor-input:-webkit-autofill:focus {
  caret-color: var(--color-cursor-text);
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  -webkit-text-fill-color: var(--color-cursor-text) !important;
  background-color: var(--mos-panel) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--mos-panel) inset !important;
  box-shadow: 0 0 0 1000px var(--mos-panel) inset !important;
}

[data-appearance="light"] .cursor-input:-webkit-autofill:active {
  caret-color: var(--color-cursor-text);
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  -webkit-text-fill-color: var(--color-cursor-text) !important;
  background-color: var(--mos-panel) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--mos-panel) inset !important;
  box-shadow: 0 0 0 1000px var(--mos-panel) inset !important;
}

[data-appearance="light"] .cursor-input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--mos-panel) inset, 0 0 0 2px var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .cursor-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--mos-panel) inset, 0 0 0 2px color-mix(in srgb, var(--cursor-accent) 16%, transparent) !important;
  }
}

[data-appearance="light"] .cursor-input:-webkit-autofill:focus {
  box-shadow: 0 0 0 1000px var(--mos-panel) inset, 0 0 0 2px var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .cursor-input:-webkit-autofill:focus {
    box-shadow: 0 0 0 1000px var(--mos-panel) inset, 0 0 0 2px color-mix(in srgb, var(--cursor-accent) 16%, transparent) !important;
  }
}

.cursor-chat-thread-outer > .chat-todos-dock {
  flex-shrink: 0;
}

.cursor-chat-thread-outer > .cursor-chat-thread.mos-chat {
  flex: 1;
  min-height: 0;
}

.cursor-chat-empty.thread-empty {
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-height: 0;
  padding: 24px 16px;
}

.cursor-chat-empty.thread-empty.cursor-chat-empty-logo-only {
  gap: 0;
  padding: 24px 16px 16px;
}

.cursor-composer-suggestions {
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 0 10px 6px;
  display: flex;
  overflow: auto hidden;
}

.cursor-composer-suggestions::-webkit-scrollbar {
  display: none;
}

.cursor-composer-suggestions .suggestion-chip {
  white-space: nowrap;
  border-radius: 6px;
  flex-shrink: 0;
  margin: 0;
  padding: 3px 9px;
  font-size: 11px;
  line-height: 1.35;
}

.empty-state-icon {
  color: var(--color-cursor-muted);
  opacity: .5;
  margin-bottom: 4px;
}

.empty-state-title {
  color: var(--color-cursor-text);
  margin: 0;
  font-size: 14px;
  font-weight: 500;
}

.empty-state-hint {
  color: var(--color-cursor-muted);
  max-width: 280px;
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
}

.suggestion-chips {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex-wrap: nowrap;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
  min-width: 0;
  max-width: min(100%, 360px);
  margin-top: 12px;
  padding: 0 2px;
  display: flex;
  overflow: auto hidden;
}

.suggestion-chips::-webkit-scrollbar {
  display: none;
}

.suggestion-chip {
  border: 1px solid var(--color-cursor-border);
  color: var(--color-cursor-text);
  cursor: pointer;
  transition: background var(--cursor-ease), border-color var(--cursor-ease), color var(--cursor-ease);
  white-space: nowrap;
  background: #ffffff0a;
  border-radius: 999px;
  flex-shrink: 0;
  padding: 6px 12px;
  font-size: 12px;
}

.suggestion-chip:hover {
  border-color: var(--cursor-accent-border);
  background: var(--cursor-accent-dim);
  color: var(--cursor-accent);
}

.cursor-live-dot {
  background: var(--cursor-accent);
  border-radius: 50%;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  animation: 1.4s ease-in-out infinite cursor-live-pulse;
}

.cursor-live-dot.is-streaming {
  background: #6b8afd;
  animation: 1.2s ease-in-out infinite cursor-live-pulse;
}

.cursor-live-dot.is-awaiting, .cursor-live-dot.is-awaiting-input, .cursor-live-dot.is-awaiting-question {
  background: #fbbf24;
  animation: .95s ease-in-out infinite cursor-await-pulse;
}

.cursor-live-dot.is-awaiting-plan {
  background: #a78bfa;
  animation: 1.05s ease-in-out infinite cursor-await-pulse;
}

.cursor-live-dot.is-error {
  background: #f87171;
  animation: none;
}

@keyframes cursor-live-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }

  50% {
    opacity: .55;
    transform: scale(.88);
  }
}

@keyframes cursor-await-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
    box-shadow: 0 0 #fbbf2473;
  }

  50% {
    opacity: .85;
    transform: scale(1.08);
    box-shadow: 0 0 0 4px #fbbf2400;
  }
}

.cursor-unified-tab.is-streaming:not(.is-active), .cursor-agent-chat-tab.is-streaming:not(.is-active) {
  color: #6b8afd;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab.is-streaming:not(.is-active), .cursor-agent-chat-tab.is-streaming:not(.is-active) {
    color: color-mix(in srgb, #6b8afd 72%, var(--color-cursor-text));
  }
}

.cursor-unified-tab.is-streaming:not(.is-active), .cursor-agent-chat-tab.is-streaming:not(.is-active) {
  background: #6b8afd17;
  box-shadow: inset 3px 0 #6b8afd;
}

.cursor-unified-tab.is-awaiting-question:not(.is-active), .cursor-unified-tab.is-awaiting-input:not(.is-active), .cursor-agent-chat-tab.is-awaiting-question:not(.is-active), .cursor-agent-chat-tab.is-awaiting-input:not(.is-active) {
  color: #fbbf24;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab.is-awaiting-question:not(.is-active), .cursor-unified-tab.is-awaiting-input:not(.is-active), .cursor-agent-chat-tab.is-awaiting-question:not(.is-active), .cursor-agent-chat-tab.is-awaiting-input:not(.is-active) {
    color: color-mix(in srgb, #fbbf24 78%, var(--color-cursor-text));
  }
}

.cursor-unified-tab.is-awaiting-question:not(.is-active), .cursor-unified-tab.is-awaiting-input:not(.is-active), .cursor-agent-chat-tab.is-awaiting-question:not(.is-active), .cursor-agent-chat-tab.is-awaiting-input:not(.is-active) {
  background: #fbbf241c;
  box-shadow: inset 3px 0 #fbbf24;
}

.cursor-unified-tab.is-awaiting-plan:not(.is-active), .cursor-agent-chat-tab.is-awaiting-plan:not(.is-active) {
  color: #a78bfa;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab.is-awaiting-plan:not(.is-active), .cursor-agent-chat-tab.is-awaiting-plan:not(.is-active) {
    color: color-mix(in srgb, #a78bfa 78%, var(--color-cursor-text));
  }
}

.cursor-unified-tab.is-awaiting-plan:not(.is-active), .cursor-agent-chat-tab.is-awaiting-plan:not(.is-active) {
  background: #a78bfa1c;
  box-shadow: inset 3px 0 #a78bfa;
}

.cursor-unified-tab.is-error:not(.is-active), .cursor-agent-chat-tab.is-error:not(.is-active) {
  color: #f87171;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab.is-error:not(.is-active), .cursor-agent-chat-tab.is-error:not(.is-active) {
    color: color-mix(in srgb, #f87171 78%, var(--color-cursor-text));
  }
}

.cursor-unified-tab.is-error:not(.is-active), .cursor-agent-chat-tab.is-error:not(.is-active) {
  background: #f871711a;
  box-shadow: inset 3px 0 #f87171;
}

.cursor-unified-tab.is-streaming.is-active, .cursor-unified-tab.is-awaiting.is-active, .cursor-agent-chat-tab.is-streaming.is-active, .cursor-agent-chat-tab.is-awaiting.is-active {
  box-shadow: inset 0 -2px 0 var(--cursor-accent);
}

.cursor-unified-tab.is-awaiting-question.is-active, .cursor-unified-tab.is-awaiting-input.is-active, .cursor-agent-chat-tab.is-awaiting-question.is-active, .cursor-agent-chat-tab.is-awaiting-input.is-active {
  box-shadow: inset 0 -2px #fbbf24;
}

.cursor-unified-tab.is-awaiting-plan.is-active, .cursor-agent-chat-tab.is-awaiting-plan.is-active {
  box-shadow: inset 0 -2px #a78bfa;
}

.cursor-unified-tab.is-error.is-active, .cursor-agent-chat-tab.is-error.is-active {
  box-shadow: inset 0 -2px #f87171;
}

.cursor-editor-welcome {
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  padding: 32px;
  display: flex;
}

.cursor-editor-shortcuts {
  color: var(--color-cursor-muted);
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 16px;
  margin-top: 16px;
  font-size: 11px;
  display: flex;
}

.cursor-editor-shortcuts kbd {
  border: 1px solid var(--color-cursor-border);
  color: var(--color-cursor-text);
  background: #ffffff0a;
  border-radius: 4px;
  margin: 0 1px;
  padding: 1px 5px;
  font-family: ui-monospace, monospace;
  font-size: 10px;
  display: inline-block;
}

.cursor-queue-hint, .cursor-awaiting-hint {
  display: none;
}

.cursor-composer .cursor-queue-hint {
  color: var(--cursor-accent);
  opacity: .85;
  margin: 0 2px 6px;
  padding: 0;
  font-size: 11px;
  display: block;
}

.cursor-queue-panel {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md);
  background: var(--color-cursor-surface);
  margin: 0 12px 8px;
  overflow: hidden;
}

.cursor-queue-header {
  width: 100%;
  color: var(--color-cursor-muted);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 500;
  display: flex;
}

.cursor-queue-header:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-muted);
}

.cursor-queue-chev {
  transition: transform var(--cursor-ease);
}

.cursor-queue-panel:not(.is-open) .cursor-queue-chev {
  transform: rotate(-90deg);
}

.cursor-queue-list {
  border-top: 1px solid var(--color-cursor-border-soft);
  margin: 0;
  padding: 0 0 4px;
  list-style: none;
}

.cursor-queue-item {
  color: var(--color-cursor-text);
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 12px;
  font-size: 12px;
  display: flex;
}

.cursor-queue-item + .cursor-queue-item {
  border-top: 1px solid #ffffff0a;
}

.cursor-queue-dot {
  border: 1px solid var(--color-cursor-muted);
  opacity: .6;
  border-radius: 50%;
  flex-shrink: 0;
  width: 6px;
  height: 6px;
}

.cursor-queue-text {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.cursor-queue-edit {
  border: 1px solid var(--color-cursor-border);
  border-radius: var(--cursor-radius-sm);
  background: var(--color-cursor-bg);
  min-width: 0;
  color: var(--color-cursor-text);
  font-size: 12px;
  font-family: var(--font-cursor);
  flex: 1;
  padding: 2px 6px;
}

.cursor-queue-actions {
  opacity: 0;
  transition: opacity var(--cursor-ease);
  flex-shrink: 0;
  align-items: center;
  gap: 2px;
  display: flex;
}

.cursor-queue-item:hover .cursor-queue-actions, .cursor-queue-item:focus-within .cursor-queue-actions {
  opacity: 1;
}

.cursor-queue-actions button {
  border-radius: var(--cursor-radius-sm);
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: none;
  justify-content: center;
  align-items: center;
  display: flex;
}

.cursor-queue-actions button:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.cursor-composer.is-awaiting .cursor-composer-box {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-composer.is-awaiting .cursor-composer-box {
    border-color: color-mix(in srgb, var(--cursor-accent) 45%, transparent);
  }
}

.cursor-composer-box.is-streaming {
  border-color: var(--cursor-accent-border);
}

.cursor-composer-box.is-recording {
  border-color: #f8717152;
  animation: 1.8s ease-in-out infinite mic-composer-glow;
}

.cursor-composer-box.is-transcribing {
  border-color: var(--cursor-accent-border);
  box-shadow: 0 0 0 1px var(--cursor-accent-dim) inset;
}

.cursor-toolbar-icon.active, .cursor-toolbar-icon.is-recording, .cursor-toolbar-icon.is-transcribing {
  position: relative;
}

.cursor-toolbar-icon.is-speak-on {
  color: var(--cursor-accent);
  background: var(--cursor-accent-dim);
}

.cursor-speak-transport {
  border-radius: var(--cursor-radius-sm);
  background: var(--cursor-overlay-subtle);
  border: 1px solid var(--cursor-accent-border);
  flex-shrink: 0;
  align-items: center;
  gap: 1px;
  padding: 1px;
  display: inline-flex;
}

.cursor-speak-transport-btn {
  border-radius: calc(var(--cursor-radius-sm) - 4px);
  width: 26px;
  height: 26px;
  color: var(--cursor-accent);
  cursor: pointer;
  transition: background var(--cursor-ease), color var(--cursor-ease);
  background: none;
  border: none;
  justify-content: center;
  align-items: center;
  display: flex;
}

.cursor-speak-transport-btn:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.cursor-speak-transport-btn.is-stop {
  color: var(--color-cursor-muted);
}

.cursor-speak-transport-btn.is-stop:hover {
  color: #f87171;
  background: #f871711a;
}

.cursor-toolbar-icon.is-recording {
  color: #f87171;
  background: #f871711a;
  animation: 1.6s ease-in-out infinite mic-record-pulse;
}

.cursor-toolbar-icon.is-recording:after {
  content: "";
  border-radius: inherit;
  pointer-events: none;
  border: 1px solid #f8717180;
  animation: 1.6s ease-out infinite mic-record-ring;
  position: absolute;
  inset: 1px;
}

.cursor-toolbar-icon.is-transcribing {
  color: var(--cursor-accent);
  background: var(--cursor-accent-dim);
  pointer-events: none;
}

.cursor-toolbar-icon.is-transcribing:after {
  content: "";
  border: 1.5px solid var(--cursor-accent);
  position: absolute;
  inset: 5px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-toolbar-icon.is-transcribing:after {
    border: 1.5px solid color-mix(in srgb, var(--cursor-accent) 22%, transparent);
  }
}

.cursor-toolbar-icon.is-transcribing:after {
  border-top-color: var(--cursor-accent);
  pointer-events: none;
  border-radius: 50%;
  animation: .65s linear infinite mic-transcribe-ring;
}

.cursor-toolbar-icon.is-transcribing .icon-inline svg {
  opacity: .28;
}

@media (prefers-reduced-motion: reduce) {
  .cursor-composer-box.is-recording {
    border-color: #f8717166;
    animation: none;
  }

  .cursor-toolbar-icon.is-recording, .cursor-toolbar-icon.is-recording:after {
    animation: none;
  }

  .cursor-toolbar-icon.is-recording {
    box-shadow: 0 0 0 2px #f871714d;
  }
}

.cursor-popover-item {
  gap: 8px;
}

.cursor-popover-item .cursor-popover-check {
  margin-left: auto;
}

.cursor-seg button {
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.cursor-thread-activity {
  color: var(--color-cursor-muted);
  border-bottom: 1px solid var(--color-cursor-border-soft);
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 4px 12px 6px;
  font-size: 11px;
  display: flex;
}

.cursor-plan-overlay {
  z-index: 10001;
}

.cursor-plan-panel {
  flex-direction: column;
  width: min(520px, 94vw);
  height: 100%;
  max-height: 100dvh;
  display: flex;
}

.cursor-plan-head {
  border-bottom: 1px solid var(--color-cursor-border);
  padding: 0 8px 0 12px;
}

.cursor-plan-head-main {
  flex: 1;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.cursor-plan-head-icon {
  background: rgba(var(--accent-rgb, 99, 102, 241), .14);
  width: 28px;
  height: 28px;
  color: var(--mos-accent, var(--accent));
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  margin-top: 1px;
  display: inline-flex;
}

.cursor-plan-title {
  color: var(--color-cursor-text, var(--text));
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
}

.cursor-plan-sub {
  color: var(--color-cursor-muted, var(--text-muted));
  margin: 2px 0 0;
  font-size: 11px;
}

.cursor-plan-body {
  font-size: var(--desk-text-base);
  line-height: var(--desk-leading);
  flex: 1;
  padding: 16px 18px 20px;
  overflow-y: auto;
}

.cursor-plan-foot {
  border-top: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  gap: 8px;
  padding: 12px 14px;
  display: flex;
}

.cursor-plan-btn {
  border-radius: var(--cursor-radius-sm, 8px);
  min-height: 36px;
  font-family: var(--font-cursor);
  font-size: var(--desk-text-ui, 13px);
  cursor: pointer;
  border: 1px solid var(--color-cursor-border);
  flex: 1;
  font-weight: 500;
  transition: background .15s, border-color .15s, opacity .15s;
}

.cursor-plan-btn.ghost {
  color: var(--color-cursor-text, var(--text));
  background: none;
}

.cursor-plan-btn.ghost:hover {
  background: #ffffff0a;
}

.cursor-plan-btn.primary {
  background: var(--mos-accent, var(--accent));
  color: #fff;
  border-color: #0000;
}

.cursor-plan-btn.primary:hover:not(:disabled) {
  filter: brightness(1.06);
}

.cursor-plan-btn:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.cursor-chat-thread.mos-chat .flow-plan.cursor-card {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-sm, 10px);
  background: #ffffff05;
  overflow: hidden;
}

.cursor-chat-thread.mos-chat .flow-plan.is-pending {
  border-color: rgba(var(--accent-rgb, 99, 102, 241), .35);
}

.cursor-chat-thread.mos-chat .flow-plan-banner {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: rgba(var(--accent-rgb, 99, 102, 241), .06);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  display: flex;
}

.cursor-chat-thread.mos-chat .flow-card-banner-title {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
}

.cursor-chat-thread.mos-chat .flow-card-banner-sub {
  color: var(--text-muted);
  margin: 2px 0 0;
  font-size: 11px;
}

.cursor-chat-thread.mos-chat .flow-plan-actions {
  gap: 8px;
  padding: 10px 12px 12px;
  display: flex;
}

.cursor-chat-thread.mos-chat .flow-plan-actions .btn {
  border-radius: 8px;
  flex: 1;
  min-height: 34px;
  font-size: 12px;
  font-weight: 500;
}

.cursor-chat-thread.mos-chat .flow-plan-actions .btn.ghost {
  border: 1px solid var(--color-cursor-border, var(--border));
  color: var(--text);
  background: none;
}

.cursor-chat-thread.mos-chat .flow-plan-actions .btn.primary {
  background: var(--mos-accent, var(--accent));
  color: #fff;
  border-color: #0000;
}

.cursor-settings-tab {
  align-items: center;
  gap: 5px;
  display: inline-flex;
}

.cursor-settings-tab-label {
  font-size: 11px;
}

.cursor-access-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cursor-access-row {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  display: flex;
}

.cursor-gateway-logs {
  background: var(--color-cursor-bg, var(--mos-bg));
  border: 1px solid var(--color-cursor-border);
  border-radius: 8px;
  max-height: 240px;
  padding: 8px 10px;
  font-family: ui-monospace, SF Mono, Menlo, monospace;
  font-size: 10px;
  line-height: 1.45;
  overflow-y: auto;
}

.cursor-gateway-logs-compact {
  max-height: min(60vh, 480px);
}

.cursor-terminal-sheet {
  width: min(var(--desk-composer-max), 94vw);
}

.cursor-terminal-body {
  flex-direction: column;
  flex: 1;
  min-height: 0;
  padding: 12px 14px 16px;
  display: flex;
  overflow: hidden;
}

.cursor-terminal-body .cursor-gateway-logs {
  flex: 1;
  max-height: none;
}

.desk-mobile-shell {
  min-height: 100dvh;
  padding-top: env(safe-area-inset-top, 0px);
  --desk-mobile-chrome-bottom: calc(var(--desk-mobile-tab-h) + env(safe-area-inset-bottom, 0px));
}

.desk-mobile-header {
  min-height: var(--desk-mobile-head-h);
  height: var(--desk-mobile-head-h);
  padding: 0 max(var(--desk-mobile-inset-x), env(safe-area-inset-right, 0px)) 0 max(var(--desk-mobile-inset-x), env(safe-area-inset-left, 0px));
  border-bottom: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  z-index: 30;
  flex-shrink: 0;
  align-items: center;
  gap: 0;
  display: flex;
}

.desk-mobile-header-back {
  flex-shrink: 0;
}

.desk-mobile-header-title-wrap {
  text-align: left;
  flex: 1;
  min-width: 0;
  padding: 0 8px 0 4px;
}

.desk-mobile-header-end {
  flex-shrink: 0;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.desk-mobile-header-actions {
  align-items: center;
  gap: 0;
  display: flex;
}

.desk-mobile-header-title {
  color: var(--color-cursor-text);
  font-size: 14px;
  font-weight: 600;
  line-height: var(--desk-mobile-head-h);
  display: block;
}

.desk-mobile-header-btn {
  width: var(--desk-mobile-head-h);
  height: var(--desk-mobile-head-h);
  border-radius: var(--cursor-radius-md);
  color: var(--color-cursor-muted);
  cursor: pointer;
  transition: background var(--cursor-ease), color var(--cursor-ease);
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: none;
  justify-content: center;
  align-items: center;
  display: flex;
}

.desk-mobile-header-btn:hover, .desk-mobile-header-btn.is-active {
  background: var(--cursor-accent-dim);
  color: var(--cursor-accent);
}

.desk-mobile-main {
  overscroll-behavior: contain;
  flex: 1;
  min-height: 0;
  position: relative;
  overflow: hidden;
}

.desk-mobile-pane {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  min-height: 0;
  transition: opacity .22s var(--desk-mobile-pane-ease), transform .22s var(--desk-mobile-pane-ease), visibility .22s;
  flex-direction: column;
  display: flex;
  position: absolute;
  inset: 0;
  transform: translateX(10px);
}

.desk-mobile-pane.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 1;
  transform: translateX(0);
}

.desk-mobile-shell[data-mobile-tab="1"] .desk-mobile-pane.is-active {
  transform: translateX(0);
}

.desk-mobile-editor {
  height: 100%;
  min-height: 0;
}

.desk-mobile-editor-pane {
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.desk-mobile-editor-pane.has-terminal {
  flex: 55%;
  min-height: 120px;
}

.desk-mobile-terminal-pane {
  border-top: 1px solid var(--color-cursor-border);
  flex: 0 0 min(42vh, 320px);
  min-height: 160px;
  max-height: 45vh;
  overflow: hidden;
}

.desk-mobile-editor-tabs {
  min-height: var(--desk-mobile-head-h);
  height: var(--desk-mobile-head-h);
  padding: 0 max(var(--desk-mobile-inset-x), env(safe-area-inset-right, 0px)) 0 max(4px, env(safe-area-inset-left, 0px));
  border-bottom: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
}

.desk-mobile-editor-tabs .cursor-tab {
  height: calc(var(--desk-mobile-head-h) - 8px);
  border-radius: var(--cursor-radius-sm);
  max-width: min(44vw, 180px);
  font-size: 12px;
}

.desk-mobile-editor-tabs .cursor-editor-tab-tools {
  padding-right: 2px;
}

.desk-mobile-tabbar {
  min-height: var(--desk-mobile-tab-h);
  height: var(--desk-mobile-tab-h);
  border-top: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  padding: 0 max(4px, env(safe-area-inset-left, 0px)) env(safe-area-inset-bottom, 0px) max(4px, env(safe-area-inset-right, 0px));
  z-index: 30;
  flex-shrink: 0;
  align-items: stretch;
  display: flex;
}

.desk-mobile-tab {
  min-height: var(--desk-mobile-tab-h);
  color: var(--color-cursor-muted);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color var(--cursor-ease), background var(--cursor-ease);
  background: none;
  border: none;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: 2px;
  padding: 4px 4px 6px;
  font-family: inherit;
  display: flex;
  position: relative;
}

.desk-mobile-tab-indicator {
  height: 2px;
  transition: background var(--cursor-ease);
  background: none;
  border-radius: 0 0 4px 4px;
  position: absolute;
  top: 0;
  left: 18%;
  right: 18%;
}

.desk-mobile-tab-icon {
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 22px;
  height: 22px;
  line-height: 0;
  display: flex;
}

.desk-mobile-tab-icon .icon-inline {
  justify-content: center;
  align-items: center;
  display: flex;
}

.desk-mobile-tab-label {
  letter-spacing: .01em;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
  display: block;
  overflow: hidden;
}

.desk-mobile-tab:hover {
  background: var(--cursor-overlay-hover);
}

.desk-mobile-tab.is-active {
  color: var(--cursor-accent);
}

.desk-mobile-tab.is-active .desk-mobile-tab-indicator {
  background: var(--cursor-accent);
}

.desk-mobile-tab.is-active .desk-mobile-tab-label {
  font-weight: 600;
}

.desk-file-breadcrumbs {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-sidebar);
  align-items: stretch;
  min-height: 0;
  display: flex;
}

.desk-file-breadcrumbs-back {
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  color: var(--color-cursor-text);
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  z-index: 2;
  pointer-events: auto;
  background: none;
  border: none;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-self: center;
  align-items: center;
  margin-left: 4px;
  padding: 0;
  display: inline-flex;
  position: relative;
}

.desk-file-breadcrumbs-back:hover, .desk-file-breadcrumbs-back:focus-visible {
  background: var(--mos-hover, var(--color-cursor-hover));
  outline: none;
}

.desk-file-breadcrumbs-track {
  scroll-behavior: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex: 1;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
  padding: 4px 10px;
  display: flex;
  overflow: auto hidden;
}

.desk-file-breadcrumbs-track::-webkit-scrollbar {
  display: none;
}

.desk-file-breadcrumbs-segment {
  flex-shrink: 0;
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.desk-file-breadcrumbs-sep {
  color: var(--color-cursor-muted);
  opacity: .65;
  width: 12px;
  height: 12px;
}

.desk-file-breadcrumbs-chip {
  height: 24px;
  min-height: 24px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  white-space: nowrap;
  background: none;
  border: none;
  border-radius: 999px;
  align-items: center;
  padding: 0 10px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.desk-file-breadcrumbs-chip.is-current {
  color: var(--color-cursor-text);
  background: var(--color-cursor-hover);
}

.desk-file-breadcrumbs-chip:hover {
  color: var(--color-cursor-text);
}

.desk-mobile-sheet {
  z-index: 360;
  pointer-events: auto;
  justify-content: center;
  align-items: flex-end;
  display: flex;
  position: fixed;
  inset: 0;
}

.desk-mobile-sheet-backdrop {
  cursor: pointer;
  background: #00000073;
  border: none;
  position: absolute;
  inset: 0;
}

.desk-mobile-sheet-panel {
  z-index: 2;
  width: 100%;
  max-width: 520px;
  padding: 0 var(--studio-sheet-inline-pad, 12px) calc(10px + env(safe-area-inset-bottom, 0px));
  margin: 0 auto;
  animation: .22s ease-out desk-mobile-sheet-in;
  position: relative;
}

.desk-mobile-sheet-handle {
  z-index: 2;
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  flex: none;
  justify-content: center;
  align-items: center;
  min-height: 28px;
  padding: 12px 0 8px;
  display: flex;
  position: relative;
}

.desk-mobile-sheet-handle:active {
  cursor: grabbing;
}

.desk-mobile-sheet-panel.is-dragging {
  transition: none !important;
}

.desk-mobile-sheet-grab {
  background: var(--mos-text, var(--color-cursor-text));
  border-radius: 999px;
  width: 44px;
  height: 5px;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-mobile-sheet-grab {
    background: color-mix(in srgb, var(--mos-text, var(--color-cursor-text)) 40%, transparent);
  }
}

.desk-mobile-sheet-grab {
  pointer-events: none;
}

@keyframes desk-mobile-sheet-in {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.desk-mobile-sheet-head {
  padding: 12px var(--studio-sheet-inline-pad, 12px) 8px;
  background: var(--color-cursor-sidebar);
  border: 1px solid var(--color-cursor-border);
  border-bottom: none;
  border-radius: 14px 14px 0 0;
}

.desk-mobile-sheet-title {
  color: var(--color-cursor-text);
  font-size: 14px;
  font-weight: 600;
  display: block;
}

.desk-mobile-sheet-sub {
  color: var(--color-cursor-muted);
  margin-top: 2px;
  font-size: 11px;
  display: block;
}

.desk-mobile-sheet-actions {
  border: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  border-radius: 14px;
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.desk-mobile-sheet-head + .desk-mobile-sheet-actions {
  border-top: none;
  border-radius: 0 0 14px 14px;
}

.desk-mobile-sheet-action {
  border: none;
  border-bottom: 1px solid var(--color-cursor-border-soft);
  width: 100%;
  color: var(--color-cursor-text);
  text-align: left;
  cursor: pointer;
  background: none;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  font-family: inherit;
  font-size: 14px;
  display: flex;
}

.desk-mobile-sheet-action:last-child {
  border-bottom: none;
}

.desk-mobile-sheet-action.is-destructive {
  color: var(--mos-error, #f85149);
}

.desk-mobile-sheet-action-icon {
  color: var(--color-cursor-muted);
}

.desk-mobile-sheet-cancel {
  border: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  width: 100%;
  color: var(--color-cursor-text);
  cursor: pointer;
  border-radius: 14px;
  margin-top: 8px;
  padding: 14px 16px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
}

@media (max-width: 899px) {
  .cursor-agent-panel, .cursor-agent-body, .cursor-chat-thread-outer {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .cursor-agent-panel, .cursor-explorer-panel {
    height: 100%;
    min-height: 0;
  }

  .cursor-agent-body {
    flex-direction: column;
    height: 100%;
    min-height: 0;
    display: flex;
  }

  .cursor-composer-shell {
    flex-shrink: 0;
  }

  .cursor-composer-shell > .cursor-composer {
    width: 100%;
    max-width: 100%;
  }

  .cursor-composer-shell > .cursor-composer-suggestions {
    width: 100%;
    max-width: 100%;
    padding-left: var(--desk-mobile-inset-x);
    padding-right: var(--desk-mobile-inset-x);
    scroll-padding-inline: var(--desk-mobile-inset-x);
    align-self: stretch;
  }

  .cursor-composer > .cursor-attach-tiles {
    padding-left: var(--desk-mobile-inset-x);
    padding-right: var(--desk-mobile-inset-x);
    scroll-padding-inline: var(--desk-mobile-inset-x);
  }

  .desk-mobile-shell:not(.desk-mobile-shell--keyboard) .cursor-composer.is-mobile {
    padding: var(--desk-mobile-inset-y) var(--desk-mobile-inset-x) 8px;
  }

  .desk-mobile-shell:not(.desk-mobile-shell--keyboard) .cursor-composer {
    padding: var(--desk-mobile-inset-y) var(--desk-mobile-inset-x) 10px;
  }

  .desk-mobile-shell--keyboard .cursor-composer.is-mobile {
    padding: 6px var(--desk-mobile-inset-x) max(8px, env(safe-area-inset-bottom, 8px));
  }

  .desk-mobile-shell--keyboard .cursor-composer {
    padding: var(--desk-mobile-inset-y) var(--desk-mobile-inset-x) max(10px, env(safe-area-inset-bottom, 10px));
  }

  .cursor-live-status, .cursor-queue-strip, .cursor-queued-messages {
    max-width: 100%;
    margin-left: var(--desk-mobile-inset-x);
    margin-right: var(--desk-mobile-inset-x);
  }

  .cursor-composer-textarea {
    font-size: 16px;
  }

  .cursor-composer.is-mobile .cursor-composer-textarea, .cursor-composer.is-mobile .cursor-composer-mention-editor {
    min-height: 40px;
    max-height: 140px;
    padding: 8px 10px 2px;
    font-size: 16px;
    line-height: 1.35;
  }

  .cursor-composer.is-mobile .cursor-composer-mention-editor:empty:before {
    opacity: .38;
    color: var(--mos-text-bright, #fff);
    -webkit-text-fill-color: var(--mos-text-bright, #fff);
    font-size: 14px;
  }

  .cursor-composer.is-mobile .cursor-composer-mention-editor:has( > br:only-child):before {
    opacity: .38;
    color: var(--mos-text-bright, #fff);
    -webkit-text-fill-color: var(--mos-text-bright, #fff);
    font-size: 14px;
  }

  .cursor-composer.is-mobile .cursor-composer-mention-editor:has( > br:first-child:last-child):before {
    opacity: .38;
    color: var(--mos-text-bright, #fff);
    -webkit-text-fill-color: var(--mos-text-bright, #fff);
    font-size: 14px;
  }

  .cursor-composer-textarea, .cursor-composer-mention-editor {
    min-height: 72px;
  }

  .cursor-composer-toolbar {
    gap: 4px;
    padding: 6px 8px 8px;
  }

  .cursor-composer-toolbar.is-mobile {
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 4px 8px 8px;
    display: flex;
  }

  .cursor-composer-toolbar.is-mobile .cursor-toolbar-icon {
    border-radius: 50%;
    width: 36px;
    height: 36px;
  }

  .cursor-composer-toolbar.is-mobile .cursor-composer-sophie-wrap {
    max-width: min(118px, 30vw);
  }

  .cursor-composer-toolbar.is-mobile .cursor-composer-sophie-face {
    justify-content: flex-start;
    max-width: 100%;
    padding: 3px 7px 3px 4px;
  }

  .cursor-composer-toolbar.is-mobile .cursor-composer-sophie-spark {
    display: none;
  }

  .cursor-composer-toolbar.is-mobile .cursor-composer-sophie-panel {
    left: 12px;
    right: 12px;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 86px);
    width: auto;
    max-width: none;
    position: fixed;
  }

  .cursor-composer-toolbar.is-mobile .cursor-composer-sophie-panel:after {
    display: none;
  }

  .cursor-toolbar-icon {
    border-radius: var(--cursor-radius-md);
    width: 44px;
    height: 44px;
  }

  .cursor-toolbar-icon.cursor-composer-submit {
    width: 44px;
    height: 44px;
  }

  .cursor-toolbar-icon.cursor-composer-mobile-menu {
    width: 36px;
    height: 36px;
  }

  .cursor-toolbar-pill {
    min-height: 36px;
    font-size: var(--desk-text-base);
    padding: 6px 10px;
  }

  .cursor-file-grid {
    padding: var(--desk-mobile-inset-y) var(--desk-mobile-inset-x) 20px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: auto;
    gap: 8px;
  }

  .desk-file-grid-item {
    min-height: 0;
    font-size: 12px;
  }

  .desk-file-breadcrumbs-track {
    padding: 4px var(--desk-mobile-inset-x);
  }

  .cursor-explorer-toolbar, .desk-explorer-create-bar {
    padding-left: var(--desk-mobile-inset-x);
    padding-right: var(--desk-mobile-inset-x);
  }

  .desk-file-thumb--grid .desk-file-thumb-visual, .desk-file-thumb--preview .desk-file-thumb-visual {
    aspect-ratio: 1;
  }

  .cursor-tree-mode {
    gap: 6px;
    padding: 6px 10px 8px;
  }

  .cursor-tree-mode-btn {
    min-height: 36px;
    padding: 6px 12px;
    font-size: 12px;
  }

  .cursor-tree-mode-btn .icon-inline svg {
    width: 14px;
    height: 14px;
  }

  .desk-mobile-tab-label {
    font-size: 11px;
  }

  .desk-mobile-tab-icon {
    width: 24px;
    height: 24px;
  }

  .cursor-tree-row {
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .cursor-tree-row.is-long-press, .cursor-file-grid-item.is-long-press {
    background: var(--color-cursor-hover);
  }

  .cursor-history-row {
    min-height: 44px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .cursor-settings-panel {
    width: min(100vw, 420px);
  }

  .cursor-history-overlay {
    z-index: 1;
    flex: 1;
    min-height: 0;
    position: relative;
    inset: auto;
  }

  .cursor-attach-preview-overlay {
    padding: calc(var(--desk-mobile-head-h) + 12px) 12px calc(var(--desk-mobile-tab-h) + 16px);
  }

  .cursor-attach-preview-panel {
    width: 100%;
    max-height: min(calc(100dvh - var(--desk-mobile-head-h) - var(--desk-mobile-tab-h) - 48px), 560px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .desk-mobile-pane {
    transition: none;
    transform: none;
  }
}

.desk-status-strip {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  z-index: 40;
  background: #0c0c0eeb;
  flex-shrink: 0;
}

.desk-status-row {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
  font-size: 12px;
  display: flex;
}

.desk-status-offline {
  color: #fca5a5;
  background: #ef44441a;
}

.desk-status-reconnect {
  color: #fbbf24;
  background: #fbbf241a;
}

.desk-status-update {
  background: var(--cursor-accent-dim);
  color: var(--color-cursor-text);
}

.desk-status-session-end {
  color: var(--color-cursor-text);
  background: #a855f71a;
}

.desk-status-update-ver {
  color: var(--cursor-accent);
  font-weight: 700;
}

.desk-status-update-hint {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.desk-status-btn {
  border: 1px solid var(--color-cursor-border);
  color: var(--color-cursor-text);
  cursor: pointer;
  background: none;
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 11px;
}

.desk-status-btn:hover {
  background: var(--cursor-overlay-hover);
}

.desk-status-btn-primary {
  border-color: var(--cursor-accent-border);
  color: var(--cursor-accent);
}

.cursor-live-status {
  width: 100%;
  max-width: min(var(--desk-composer-max), 94vw);
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-accent-dim);
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  min-height: 0;
  margin: 0 auto 6px;
  padding: 4px 10px;
  display: flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-live-status {
    background: color-mix(in srgb, var(--cursor-accent-dim) 55%, transparent);
  }
}

.cursor-live-status {
  letter-spacing: -.01em;
  color: var(--cursor-accent);
  box-sizing: border-box;
  text-align: center;
  isolation: isolate;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.25;
  position: relative;
}

.cursor-live-status-icon, .cursor-live-status-label {
  z-index: 1;
  position: relative;
}

.cursor-live-status-icon {
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: inline-flex;
}

.cursor-live-status-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  line-height: 1.25;
  overflow: hidden;
}

.cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
  color: var(--cursor-accent);
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
    border-color: color-mix(in srgb, var(--cursor-accent) 38%, transparent);
  }
}

.cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
  background: var(--cursor-accent-dim);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
    background: color-mix(in srgb, var(--cursor-accent-dim) 72%, transparent);
  }
}

.cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
  box-shadow: 0 0 0 1px var(--cursor-accent), 0 0 14px var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent) 14%, transparent), 0 0 14px color-mix(in srgb, var(--cursor-accent) 10%, transparent);
  }
}

.cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
  animation: 2.8s ease-in-out infinite live-pill-glow-pulse;
  overflow: hidden;
}

.cursor-live-status--planning:before, .cursor-live-status--tool:before, .cursor-live-status--working:before, .cursor-live-status--research:before, .cursor-live-status--editing:before, .cursor-live-status--terminal:before, .cursor-live-status--creating:before, .cursor-live-status--subagent:before {
  content: "";
  border-radius: inherit;
  background: linear-gradient(105deg, transparent 0%, var(--cursor-accent) 48%, transparent 96%);
  position: absolute;
  inset: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-live-status--planning:before, .cursor-live-status--tool:before, .cursor-live-status--working:before, .cursor-live-status--research:before, .cursor-live-status--editing:before, .cursor-live-status--terminal:before, .cursor-live-status--creating:before, .cursor-live-status--subagent:before {
    background: linear-gradient(105deg, transparent 0%, color-mix(in srgb, var(--cursor-accent) 22%, transparent) 48%, transparent 96%);
  }
}

.cursor-live-status--planning:before, .cursor-live-status--tool:before, .cursor-live-status--working:before, .cursor-live-status--research:before, .cursor-live-status--editing:before, .cursor-live-status--terminal:before, .cursor-live-status--creating:before, .cursor-live-status--subagent:before {
  opacity: .45;
  z-index: 0;
  pointer-events: none;
  background-size: 220% 100%;
  animation: 2.6s ease-in-out infinite live-pill-shimmer-sweep;
}

.cursor-live-status--planning:after, .cursor-live-status--tool:after, .cursor-live-status--working:after, .cursor-live-status--research:after, .cursor-live-status--editing:after, .cursor-live-status--terminal:after, .cursor-live-status--creating:after, .cursor-live-status--subagent:after {
  content: none;
}

@keyframes live-pill-shimmer-sweep {
  0%, 100% {
    opacity: .3;
    background-position: 120% 0;
  }

  50% {
    opacity: .55;
    background-position: -20% 0;
  }
}

@keyframes live-pill-glow-pulse {
  0%, 100% {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent) 12%, transparent), 0 0 6px color-mix(in srgb, var(--cursor-accent) 8%, transparent);
  }

  50% {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent) 28%, transparent), 0 0 16px color-mix(in srgb, var(--cursor-accent) 22%, transparent);
  }
}

.cursor-live-status--planning .cursor-live-status-label {
  color: var(--cursor-accent);
}

@media (prefers-reduced-motion: reduce) {
  .cursor-live-status--planning .cursor-live-status-label {
    color: var(--cursor-accent);
    -webkit-text-fill-color: var(--cursor-accent);
    background: none;
    animation: none;
  }

  .cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
    border-color: var(--cursor-accent-border);
    background: var(--cursor-accent-dim);
    animation: none;
  }

  @supports (color: color-mix(in lab, red, red)) {
    .cursor-live-status--planning, .cursor-live-status--tool, .cursor-live-status--working, .cursor-live-status--research, .cursor-live-status--editing, .cursor-live-status--terminal, .cursor-live-status--creating, .cursor-live-status--subagent {
      background: color-mix(in srgb, var(--cursor-accent-dim) 88%, transparent);
    }
  }

  .cursor-live-status--planning:before, .cursor-live-status--tool:before, .cursor-live-status--working:before, .cursor-live-status--research:before, .cursor-live-status--editing:before, .cursor-live-status--terminal:before, .cursor-live-status--creating:before, .cursor-live-status--subagent:before, .cursor-live-status--planning:after, .cursor-live-status--tool:after, .cursor-live-status--working:after, .cursor-live-status--research:after, .cursor-live-status--editing:after, .cursor-live-status--terminal:after, .cursor-live-status--creating:after, .cursor-live-status--subagent:after, .cursor-live-status--waiting:before, .cursor-live-status--waiting:after {
    content: none;
    animation: none;
  }

  .cursor-live-status--waiting {
    background: #fbbf2414;
    border-color: #fbbf2459;
    animation: none;
  }
}

.cursor-live-status--waiting {
  color: #fbbf24;
  background: #fbbf241a;
  border-color: #fbbf2466;
  animation: 2.6s ease-in-out infinite live-pill-waiting-glow;
  box-shadow: 0 0 0 1px #fbbf241f;
}

.cursor-live-status--waiting:before {
  content: "";
  border-radius: inherit;
  opacity: .5;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(105deg, #0000 0%, #fbbf2447 50%, #0000 100%) 0 0 / 220% 100%;
  animation: 2.8s ease-in-out infinite live-pill-shimmer-sweep;
  position: absolute;
  inset: 0;
}

.cursor-live-status--waiting:after {
  content: none;
}

@keyframes live-pill-waiting-glow {
  0%, 100% {
    filter: drop-shadow(0 0 2px #fbbf2426);
  }

  50% {
    filter: drop-shadow(0 0 12px #fbbf2461);
  }
}

.cursor-live-dots {
  align-items: center;
  gap: 3px;
  display: inline-flex;
}

.cursor-live-dots span {
  opacity: .55;
  background: currentColor;
  border-radius: 50%;
  width: 3px;
  height: 3px;
  animation: 1.2s ease-in-out infinite live-dot-pulse;
}

.cursor-live-dots span:nth-child(2) {
  animation-delay: .15s;
}

.cursor-live-dots span:nth-child(3) {
  animation-delay: .3s;
}

@keyframes live-dot-pulse {
  0%, 100% {
    opacity: .35;
    transform: translateY(0);
  }

  50% {
    opacity: 1;
    transform: translateY(-1px);
  }
}

.cursor-queued-strip {
  max-width: min(var(--desk-composer-max), 94vw);
  border-radius: var(--cursor-radius-md);
  color: #94a3b8;
  background: #94a3b81a;
  border: 1px solid #94a3b840;
  align-items: center;
  gap: 8px;
  margin: 0 auto 8px;
  padding: 6px 10px;
  font-size: 11px;
  display: flex;
}

.cursor-queued-strip-text {
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex: 1;
  min-width: 0;
  overflow: auto hidden;
}

.cursor-queued-strip-text::-webkit-scrollbar {
  display: none;
}

.cursor-queued-strip-clear {
  color: var(--cursor-accent);
  cursor: pointer;
  background: none;
  border: none;
  padding: 2px 6px;
  font-size: 11px;
  font-weight: 600;
}

.cursor-multitask-hint, .cursor-queue-expand {
  max-width: min(var(--desk-composer-max), 94vw);
  box-sizing: border-box;
  width: 100%;
  color: var(--color-cursor-muted);
  margin: 0 auto 6px;
  padding: 0 10px;
  font-size: 11px;
}

.cursor-queue-expand {
  color: var(--cursor-accent);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  padding: 0 10px;
}

.cursor-subagent-tabs {
  border-bottom: 1px solid var(--color-cursor-border);
  scrollbar-width: none;
  flex-shrink: 0;
  align-items: stretch;
  gap: 0;
  padding: 0;
  display: flex;
  overflow-x: auto;
}

.cursor-subagent-tabs::-webkit-scrollbar {
  display: none;
}

.cursor-subagent-tab {
  border: none;
  border-right: 1px solid var(--color-cursor-border);
  min-width: 0;
  max-width: 180px;
  height: 32px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  white-space: nowrap;
  background: none;
  border-radius: 0;
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  padding: 0 8px 0 10px;
  font-size: 11px;
  display: inline-flex;
}

.cursor-subagent-tab:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-muted);
}

.cursor-subagent-tab .cursor-tab-close, .cursor-subagent-tab:hover .cursor-tab-close, .cursor-subagent-tab.is-active .cursor-tab-close {
  opacity: 1;
}

.cursor-subagent-tab.is-active {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-subtle);
}

.cursor-subagent-tab.is-live .cursor-live-dot {
  width: 6px;
  height: 6px;
}

.msg-assistant-row {
  align-items: flex-start;
  gap: 6px;
  display: flex;
  position: relative;
}

.msg-assistant-chrome {
  position: relative;
}

.msg-copy-menu--floating {
  z-index: 12000;
  border: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-surface-elevated, #1a1a1f);
  border-radius: 8px;
  min-width: 168px;
  padding: 4px;
  position: fixed;
  box-shadow: 0 8px 24px #00000059;
}

.msg-assistant-actions {
  display: none;
}

.msg-copy-menu-item {
  width: 100%;
  color: var(--color-cursor-text);
  cursor: pointer;
  text-align: left;
  background: none;
  border: none;
  border-radius: 6px;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  padding: 6px 8px;
  font-size: 12px;
  display: flex;
}

.msg-copy-menu-item:hover {
  background: var(--cursor-overlay-hover);
}

.msg-copy-menu-hint {
  color: var(--color-cursor-muted);
  font-size: 10px;
}

.msg-speak-btn {
  border: 1px solid var(--color-cursor-border-soft);
  width: 28px;
  height: 28px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: #00000059;
  border-radius: 6px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  margin-top: 2px;
  display: inline-flex;
}

.msg-speak-btn:hover, .msg-speak-btn.active {
  color: var(--color-cursor-text);
  border-color: var(--color-cursor-border);
}

.msg-copy-btn {
  border: 1px solid var(--color-cursor-border-soft);
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: #00000059;
  border-radius: 6px;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  font-size: 10px;
  display: inline-flex;
}

.msg-copy-btn:hover {
  color: var(--color-cursor-text);
  border-color: var(--color-cursor-border);
}

.msg-copy-label {
  font-size: 10px;
}

.msg-user-actions {
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  display: flex;
}

.msg-queue-remove {
  background: var(--cursor-overlay-hover);
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border: none;
  border-radius: 4px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.msg-queue-remove:hover {
  color: var(--color-cursor-text);
}

.cursor-code-editor {
  background: var(--color-cursor-editor);
  width: 100%;
  height: 100%;
  min-height: 0;
  display: flex;
}

.cursor-code-editor.cursor-code-editor--sidebar-surface {
  background: var(--color-cursor-sidebar);
}

.cursor-code-stack {
  flex: 1;
  width: 100%;
  min-width: 0;
  min-height: 0;
  position: relative;
}

.cursor-code-highlight, .cursor-code-input {
  resize: none;
  font-family: var(--font-mono, ui-monospace, monospace);
  tab-size: 2;
  white-space: pre;
  border: none;
  outline: none;
  margin: 0;
  padding: 16px 12px;
  font-size: 13px;
  line-height: 1.625;
  position: absolute;
  inset: 0;
  overflow: auto;
}

.cursor-code-highlight {
  pointer-events: none;
  color: var(--color-cursor-text);
  background: none;
}

.cursor-code-highlight code {
  font: inherit;
}

.cursor-code-input {
  color: #0000;
  caret-color: var(--color-cursor-accent, #facc62);
  background: none;
}

.cursor-code-highlight .tok-keyword {
  color: #c792ea;
}

.cursor-code-highlight .tok-string {
  color: #c3e88d;
}

.cursor-code-highlight .tok-number {
  color: #f78c6c;
}

.cursor-code-highlight .tok-comment {
  color: var(--color-cursor-muted);
}

.cursor-code-highlight .tok-json {
  color: #82aaff;
}

.cursor-term-selection-bar {
  z-index: 20;
  border: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-composer, #21222c);
  border-radius: 8px;
  align-items: center;
  height: 30px;
  padding: 0 3px;
  display: inline-flex;
  position: absolute;
  box-shadow: 0 8px 24px #00000047;
}

.cursor-term-selection-btn {
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 6px;
  align-items: center;
  gap: 5px;
  padding: 4px 8px;
  font-size: 11px;
  display: inline-flex;
}

.cursor-term-selection-btn:hover {
  background: var(--cursor-overlay-hover);
  color: var(--color-cursor-text);
}

.cursor-term-selection-divider {
  background: var(--color-cursor-border-soft);
  width: 1px;
  height: 16px;
}

.cursor-term-copied-toast {
  z-index: 21;
  color: var(--color-cursor-muted);
  font-size: 11px;
  position: absolute;
  bottom: 12px;
  right: 12px;
}

.cursor-git-review-bar {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  padding: 8px 10px;
}

.cursor-git-review-btn {
  border: 1px solid var(--color-cursor-border);
  background: var(--cursor-overlay-muted);
  width: 100%;
  color: var(--color-cursor-text);
  cursor: pointer;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  font-size: 12px;
  display: inline-flex;
}

.cursor-git-review-btn:hover:not(:disabled) {
  background: var(--cursor-overlay-hover);
}

.cursor-git-review-btn:disabled {
  opacity: .6;
  cursor: default;
}

.mos-mindmap-tree, .mos-mindmap-tree ul {
  margin: 0;
  padding-left: 1rem;
  list-style: none;
}

.mos-mindmap-tree > li {
  margin: .35rem 0;
}

.mos-mindmap-label {
  background: var(--cursor-overlay-hover);
  border: 1px solid var(--color-cursor-border-soft, #ffffff14);
  border-radius: 999px;
  padding: .2rem .55rem;
  font-size: .82rem;
  display: inline-block;
}

.mos-math-body {
  padding: 14px 16px;
  overflow-x: auto;
}

.mos-code-actions {
  align-items: center;
  gap: 6px;
  margin-left: auto;
  display: inline-flex;
}

.mos-code-copy {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-overlay-subtle);
  color: var(--color-cursor-muted);
  cursor: pointer;
  border-radius: 6px;
  padding: 2px 8px;
  font-size: 10px;
}

.mos-code-copy:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-hover);
}

.mos-mermaid {
  background: var(--mos-text, var(--text));
  padding: 16px;
  overflow-x: auto;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-mermaid {
    background: color-mix(in srgb, var(--mos-text, var(--text)) 3%, transparent);
  }
}

.mos-mermaid svg {
  max-width: 100%;
  height: auto;
}

.cursor-agent-chat-tabs {
  scrollbar-width: none;
  flex: 1;
  align-items: stretch;
  gap: 0;
  min-width: 0;
  margin: 0;
  padding: 0;
  display: flex;
  overflow: auto hidden;
}

.cursor-agent-chat-tabs::-webkit-scrollbar {
  display: none;
}

.cursor-agent-chat-tab {
  height: var(--cursor-head-h);
  border: none;
  border-right: 1px solid var(--color-cursor-border);
  min-width: 0;
  max-width: 200px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border-radius: 0;
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  padding: 0 8px 0 10px;
  font-size: 12px;
  display: inline-flex;
}

.cursor-agent-chat-tab:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-muted);
}

.cursor-agent-chat-tab .cursor-tab-close, .cursor-agent-chat-tab:hover .cursor-tab-close, .cursor-agent-chat-tab.is-active .cursor-tab-close {
  opacity: 1;
}

.cursor-agent-chat-tab.is-active {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-subtle);
}

.cursor-agent-chat-tab.is-live {
  color: var(--color-cursor-text);
}

.cursor-agent-chat-tab-new {
  width: var(--cursor-head-h);
  max-width: none;
  color: var(--color-cursor-muted);
  flex-shrink: 0;
  justify-content: center;
  padding: 0;
}

.cursor-agent-chat-tab-new:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-muted);
}

.cursor-workspace-head {
  z-index: 240;
  isolation: auto;
  gap: 0;
  padding: 0 8px;
  position: relative;
}

.cursor-workspace-tools {
  z-index: 260;
  position: relative;
}

.cursor-unified-tabs {
  flex: 1;
  align-items: center;
  gap: 4px;
  min-width: 0;
  padding: 0;
  display: flex;
  position: relative;
  overflow: visible;
}

.cursor-unified-tabs-scroll {
  scrollbar-width: none;
  flex: auto;
  justify-content: flex-start;
  align-items: center;
  gap: 4px;
  min-width: 0;
  padding: 0;
  display: flex;
  overflow: auto hidden;
  -webkit-mask-image: none;
  mask-image: none;
}

.cursor-h-scroll-fade {
  --cursor-h-scroll-fade-pad: 12px;
  --cursor-h-scroll-fade-gap: 4px;
  -webkit-mask-image: none;
  mask-image: none;
}

.cursor-h-scroll-fade:before, .cursor-h-scroll-fade:after {
  content: "";
  flex: 0 0 var(--cursor-h-scroll-fade-pad);
  width: var(--cursor-h-scroll-fade-pad);
  min-width: var(--cursor-h-scroll-fade-pad);
  pointer-events: none;
  height: 1px;
}

.cursor-h-scroll-fade:before {
  margin-inline-end: calc(var(--cursor-h-scroll-fade-gap) * -1);
}

.cursor-h-scroll-fade:after {
  margin-inline-start: calc(var(--cursor-h-scroll-fade-gap) * -1);
}

.cursor-h-scroll-fade[data-scroll-fade="right"] {
  -webkit-mask-image: linear-gradient(90deg, #000 0 calc(100% - 28px), #0000 100%);
  mask-image: linear-gradient(90deg, #000 0 calc(100% - 28px), #0000 100%);
}

.cursor-h-scroll-fade[data-scroll-fade="left"] {
  -webkit-mask-image: linear-gradient(90deg, #0000 0, #000 28px 100%);
  mask-image: linear-gradient(90deg, #0000 0, #000 28px 100%);
}

.cursor-h-scroll-fade[data-scroll-fade="both"] {
  -webkit-mask-image: linear-gradient(90deg, #0000 0, #000 28px calc(100% - 28px), #0000 100%);
  mask-image: linear-gradient(90deg, #0000 0, #000 28px calc(100% - 28px), #0000 100%);
}

.cursor-unified-tabs.is-dragging-strip {
  cursor: grabbing;
  -webkit-user-select: none;
  user-select: none;
}

.cursor-unified-tabs.is-dragging-strip .cursor-unified-tab:not(.cursor-unified-tab-new) {
  will-change: transform;
  backface-visibility: hidden;
  transition: transform .14s cubic-bezier(.22, 1, .36, 1), border-color .12s, background .12s, opacity .1s;
}

.cursor-unified-tabs.is-settling-strip .cursor-unified-tab:not(.cursor-unified-tab-new) {
  transition: transform .16s cubic-bezier(.22, 1, .36, 1);
}

.cursor-unified-tab-placeholder {
  width: var(--cursor-unified-tab-width, 168px);
  min-width: var(--cursor-unified-tab-width, 168px);
  max-width: var(--cursor-unified-tab-width, 168px);
  height: var(--cursor-head-h);
  border: 1px solid var(--color-cursor-accent, #6b8afd);
  flex-shrink: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab-placeholder {
    border: 1px solid color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 18%, transparent);
  }
}

.cursor-unified-tab-placeholder {
  background: var(--color-cursor-accent, #6b8afd);
  border-radius: 12px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab-placeholder {
    background: color-mix(in srgb, var(--color-cursor-accent, #6b8afd) 7%, transparent);
  }
}

.cursor-unified-tab-placeholder {
  opacity: .68;
  pointer-events: none;
  transition: opacity .22s, background .26s, border-color .26s;
}

.cursor-unified-tabs.is-dragging-strip .cursor-unified-tab-placeholder {
  opacity: .46;
}

.cursor-unified-tabs.is-settling-strip .cursor-unified-tab-placeholder {
  opacity: .72;
  transition: opacity .22s;
}

.cursor-unified-tab.is-drag-source {
  opacity: .35;
  pointer-events: none;
}

.cursor-unified-tab-ghost {
  z-index: 5000;
  border: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  color: var(--color-cursor-text);
  pointer-events: none;
  will-change: transform;
  backface-visibility: hidden;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 0 4px 0 10px;
  font-size: 12px;
  display: inline-flex;
  position: fixed;
  top: 0;
  left: 0;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  box-shadow: 0 6px 20px #00000059;
}

.cursor-unified-tab-ghost.is-settling {
  transition: transform .16s cubic-bezier(.22, 1, .36, 1);
}

.cursor-unified-tab[draggable="true"]:not(.is-drag-source) {
  cursor: grab;
  touch-action: none;
}

.cursor-composer.is-drag-over .cursor-composer-box {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
  box-shadow: 0 16px 40px #00000052, 0 6px 16px #0003, inset 0 1px #ffffff14;
  border-style: solid !important;
  border-color: var(--studio-composer-glass-border, #ffffff24) !important;
  background: var(--studio-composer-glass, #07111f82) !important;
  outline: none !important;
}

.cursor-unified-tabs-scroll::-webkit-scrollbar {
  display: none;
}

.cursor-unified-tabs::-webkit-scrollbar {
  display: none;
}

.cursor-unified-tab {
  height: var(--cursor-head-h);
  width: var(--cursor-unified-tab-width, 168px);
  min-width: var(--cursor-unified-tab-width, 168px);
  max-width: var(--cursor-unified-tab-width, 168px);
  background: none;
  border: 0;
  align-items: center;
  gap: 6px;
  padding: 0 2px 0 6px;
  display: inline-flex;
  position: relative;
}

.cursor-unified-tab-preview {
  background: var(--color-cursor-panel);
  border: 0;
  border-radius: 6px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab-preview {
    background: color-mix(in srgb, var(--color-cursor-panel) 72%, transparent);
  }
}

.cursor-unified-tab-logo {
  border: 1px solid var(--color-cursor-border-soft, var(--cursor-border-subtle));
  box-sizing: border-box;
  background: none;
  border-radius: 999px;
  place-items: center;
  width: 24px;
  height: 24px;
  display: inline-grid;
  overflow: visible;
}

.cursor-unified-tab-logo img {
  object-fit: contain;
  width: 14px;
  height: 14px;
  display: block;
}

.cursor-unified-tab-preview.is-audio {
  background: none;
  border-radius: 999px;
  width: 20px;
  height: 20px;
  overflow: visible;
}

.cursor-unified-tab-preview.is-audio .cursor-unified-tab-audio-orb.studio-orb-play, .cursor-unified-tab-preview.is-audio .studio-orb-play, .cursor-unified-tab-preview.is-audio .studio-orb-play.is-md {
  width: 20px;
  height: 20px;
}

.cursor-unified-tab-preview.is-audio .studio-orb-frame {
  padding: 1px;
}

.cursor-unified-tab.has-preview .cursor-unified-tab-label {
  max-width: 7.5rem;
}

.cursor-unified-tab-preview img, .cursor-unified-tab-preview video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.cursor-unified-tab-preview-overlay {
  z-index: 1;
  color: #fff;
  pointer-events: none;
  background: none;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0;
}

.cursor-unified-tab-preview-overlay .icon-inline {
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: flex;
}

.cursor-unified-tab-preview-overlay svg {
  stroke-width: 2.6px;
  color: #fff;
  filter: drop-shadow(0 0 .35px #000000e6);
  width: 11px;
  height: 11px;
  display: block;
}

.cursor-unified-tab-preview-overlay svg:has( > polygon:only-child) {
  stroke-width: 2.95px;
}

.cursor-unified-tab-preview-overlay svg:has(path) {
  stroke-width: 2.7px;
  width: 11px;
  height: 11px;
}

.cursor-unified-tabs.is-dragging-strip .cursor-unified-tab:not(.cursor-unified-tab-new) {
  touch-action: none;
}

.cursor-unified-tab .cursor-tab-close {
  cursor: pointer;
  touch-action: manipulation;
  z-index: 5;
  background: var(--mos-text, var(--color-cursor-text));
  border: none;
  flex-shrink: 0;
  position: relative;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab .cursor-tab-close {
    background: color-mix(in srgb, var(--mos-text, var(--color-cursor-text)) 8%, transparent);
  }
}

.cursor-unified-tab .cursor-tab-close {
  width: var(--studio-h-close, 28px);
  height: var(--studio-h-close, 28px);
  opacity: 1;
  pointer-events: auto;
  color: var(--mos-text, var(--color-cursor-text));
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
}

.cursor-tab-context-menu {
  z-index: 500;
  min-width: 168px;
  position: fixed;
}

.cursor-tab-context-item {
  width: 100%;
  color: var(--color-cursor-text);
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 999px;
  align-items: center;
  gap: 7px;
  padding: 5px 8px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
  display: flex;
}

.cursor-tab-context-item-label {
  flex: auto;
  min-width: 0;
}

.cursor-tab-context-caret {
  width: 12px;
  height: 12px;
  color: var(--color-cursor-muted);
  flex: none;
  margin-left: 8px;
}

.cursor-tab-context-item.has-submenu:hover .cursor-tab-context-caret, .cursor-tab-context-item.is-active .cursor-tab-context-caret {
  color: var(--color-cursor-text);
}

.cursor-tab-context-item > svg, .cursor-tab-context-item .icon-inline svg {
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted);
  flex: none;
}

.cursor-tab-context-item:hover {
  background: var(--mos-plate-strong, var(--mos-raised));
}

.cursor-tab-context-item:hover > svg, .cursor-tab-context-item.is-active > svg {
  color: var(--color-cursor-text);
}

.cursor-tab-context-item.is-active {
  background: var(--mos-plate-strong, var(--mos-raised));
}

.cursor-tab-context-item:disabled {
  opacity: .4;
  cursor: default;
  pointer-events: none;
}

.cursor-tab-context-item.is-danger {
  color: #f08080;
}

.cursor-tab-context-item.is-danger:hover {
  background: #ef4444;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-tab-context-item.is-danger:hover {
    background: color-mix(in srgb, #ef4444 12%, var(--cursor-overlay-hover));
  }
}

.cursor-tab-context-sep {
  background: var(--color-cursor-border);
  height: 1px;
  margin: 4px 6px;
}

.desk-explorer-context-menu, .desk-explorer-context-submenu, .desk-explorer-delete-confirm {
  z-index: 650;
}

.desk-explorer-context-submenu {
  z-index: 651;
  background: var(--mos-plate, var(--mos-bg));
}

.desk-explorer-context-submenu .cursor-tab-context-sep {
  display: none;
}

.desk-explorer-context-submenu.is-emoji-grid {
  min-width: 0;
  padding: 6px;
}

.desk-explorer-react-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2px;
  width: 148px;
  display: grid;
}

.desk-explorer-react-emoji {
  appearance: none;
  box-sizing: border-box;
  aspect-ratio: 1;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 50%;
  place-items: center;
  width: 100%;
  min-height: 0;
  padding: 0;
  font-size: 18px;
  line-height: 1;
  display: grid;
}

.desk-explorer-react-emoji:hover, .desk-explorer-react-emoji.is-active {
  background: none;
  transform: scale(1.12);
}

.desk-explorer-react-clear {
  appearance: none;
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  grid-column: 1 / -1;
  padding: 4px 2px 0;
  font-size: 11px;
  font-weight: 650;
}

.desk-explorer-context-submenu.is-share-recipients {
  min-width: 180px;
  max-width: 220px;
  padding: 6px;
}

.desk-explorer-share-recipients {
  gap: 4px;
  display: grid;
}

.desk-explorer-share-recipients-empty {
  color: var(--color-cursor-muted);
  margin: 0;
  padding: 6px 8px;
  font-size: 11px;
}

.desk-explorer-share-recipient {
  color: var(--color-cursor-text);
  border-radius: 6px;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 4px 6px;
  font-size: 12px;
  display: flex;
}

.desk-explorer-share-unshare {
  appearance: none;
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 2px 4px;
  font-size: 11px;
  font-weight: 650;
}

.desk-explorer-share-unshare:hover {
  color: #f08080;
}

.desk-explorer-delete-confirm {
  z-index: 650;
  border: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-surface-raised, var(--color-cursor-sidebar));
  border-radius: 8px;
  min-width: 200px;
  max-width: 240px;
  padding: 8px;
  position: fixed;
  box-shadow: 0 12px 40px #00000073;
}

.desk-explorer-delete-confirm-title {
  color: var(--color-cursor-text);
  margin: 0 0 4px;
  padding: 0 6px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
}

.desk-explorer-delete-confirm-name {
  color: var(--color-cursor-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0 0 6px;
  padding: 0 6px;
  font-size: 11px;
  overflow: hidden;
}

.desk-explorer-delete-confirm-hint {
  color: var(--color-cursor-muted);
  margin: 0 0 8px;
  padding: 0 6px;
  font-size: 10px;
  line-height: 1.35;
}

.desk-explorer-delete-confirm-error {
  color: #f08080;
  margin: 0 0 8px;
  padding: 0 6px;
  font-size: 11px;
}

.desk-explorer-delete-confirm-actions {
  gap: 4px;
  padding-top: 2px;
  display: flex;
}

.desk-explorer-delete-btn {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-text);
  border-radius: 6px;
  flex: 1;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-explorer-delete-btn {
    background: color-mix(in srgb, var(--color-cursor-text) 8%, transparent);
  }
}

.desk-explorer-delete-btn {
  color: var(--color-cursor-text);
  cursor: pointer;
  padding: 6px 8px;
  font-family: inherit;
  font-size: 12px;
}

.desk-explorer-delete-btn:hover {
  background: var(--cursor-overlay-hover);
}

.desk-explorer-delete-btn.is-danger {
  border-color: #ef4444;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-explorer-delete-btn.is-danger {
    border-color: color-mix(in srgb, #ef4444 55%, var(--color-cursor-border-soft));
  }
}

.desk-explorer-delete-btn.is-danger {
  color: #f08080;
  background: #ef444438;
}

.desk-explorer-delete-btn.is-danger:hover {
  background: #ef444452;
}

.desk-explorer-delete-btn:disabled {
  opacity: .5;
  cursor: default;
}

.desk-file-csv-wrap {
  padding: 8px;
}

.desk-file-csv {
  border-collapse: collapse;
  width: 100%;
  font-size: 12px;
}

.desk-file-csv th, .desk-file-csv td {
  border: 1px solid var(--color-cursor-border-soft);
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: top;
  background: none;
  max-width: 240px;
  padding: 6px 10px;
  overflow: hidden;
}

.desk-file-csv th {
  color: var(--color-cursor-text);
  font-size: .875rem;
  font-weight: 600;
}

.desk-file-csv td {
  color: var(--color-cursor-text-soft, var(--color-cursor-text));
}

.cursor-unified-tab:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-muted);
}

.cursor-unified-tab .cursor-tab-close, .cursor-unified-tab:hover .cursor-tab-close, .cursor-unified-tab.is-active .cursor-tab-close {
  opacity: 1;
}

.cursor-unified-tab.is-active {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-subtle);
}

.cursor-unified-tab.is-live {
  color: var(--color-cursor-text);
}

.cursor-unified-tab-label {
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: auto;
  min-width: 0;
  overflow: hidden;
  -webkit-mask-image: none;
  mask-image: none;
}

.cursor-unified-tab.is-renaming {
  z-index: 40;
}

.cursor-unified-tab-rename {
  border: 1px solid var(--mos-accent, #38bdf8);
  flex: auto;
  min-width: 0;
  height: 20px;
  margin: 0;
  padding: 0 4px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab-rename {
    border: 1px solid color-mix(in srgb, var(--mos-accent, #38bdf8) 55%, var(--color-cursor-border));
  }
}

.cursor-unified-tab-rename {
  background: var(--mos-bg, #0b1220);
  border-radius: 4px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab-rename {
    background: color-mix(in srgb, var(--mos-bg, #0b1220) 88%, transparent);
  }
}

.cursor-unified-tab-rename {
  color: var(--color-cursor-text);
  font: inherit;
  box-shadow: 0 0 0 1px var(--mos-accent, #38bdf8);
  outline: none;
  font-size: 12px;
  line-height: 18px;
}

@supports (color: color-mix(in lab, red, red)) {
  .cursor-unified-tab-rename {
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--mos-accent, #38bdf8) 22%, transparent);
  }
}

.cursor-unified-tab-rename:disabled {
  opacity: .7;
}

[data-appearance="light"] .cursor-unified-tab-rename {
  background: var(--mos-panel);
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .cursor-unified-tab-rename {
    background: color-mix(in srgb, var(--mos-panel) 92%, var(--mos-bg));
  }
}

.cursor-unified-tab-menu-hint {
  opacity: .55;
  flex: none;
}

.cursor-unified-tab.is-active .cursor-unified-tab-menu-hint {
  opacity: .8;
}

.studio-feed-mode-menu {
  z-index: 5000;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-sidebar);
  border-radius: 10px;
  gap: 2px;
  min-width: 132px;
  padding: 4px;
  display: grid;
  position: fixed;
  transform: none;
  box-shadow: 0 8px 24px #00000047, 0 2px 6px #0000002e;
}

.studio-feed-mode-menu button {
  color: var(--color-cursor-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 8px;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 650;
}

.studio-feed-mode-menu button:hover {
  background: var(--cursor-overlay-subtle);
}

.studio-feed-mode-menu button.is-selected {
  background: var(--cursor-overlay-subtle);
  font-weight: 700;
}

.cursor-unified-tab.cursor-unified-tab-new {
  width: var(--cursor-head-h);
  min-width: var(--cursor-head-h);
  max-width: var(--cursor-head-h);
  height: var(--cursor-head-h);
  min-height: var(--cursor-head-h);
  aspect-ratio: 1;
  color: var(--color-cursor-muted);
  cursor: pointer;
  touch-action: manipulation;
  z-index: 2;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  position: relative;
  overflow: visible;
}

.cursor-unified-tab-new.is-strip-new-during-drag {
  pointer-events: none;
  transition: transform .14s cubic-bezier(.22, 1, .36, 1);
}

.cursor-unified-tabs.is-settling-strip .cursor-unified-tab-new {
  pointer-events: auto;
}

.cursor-unified-tab-new:hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-muted);
}

.desk-workspace-pane {
  min-height: 0;
}

.desk-workspace-pane > .cursor-agent-panel, .desk-workspace-pane > .h-full, .desk-workspace-empty, .cursor-agent-panel-unified {
  flex: 1;
  min-height: 0;
}

.cursor-ref-scope-bar {
  align-items: center;
  gap: 8px;
  padding: 6px 8px 0;
  display: flex;
}

.cursor-ref-scope-chip {
  border: 1px solid var(--color-cursor-border);
  color: var(--color-cursor-text);
  cursor: pointer;
  background: #ffffff0a;
  border-radius: 999px;
  padding: 2px 8px;
  font-size: 11px;
}

.cursor-ref-scope-label {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.cursor-submit-revert-popover {
  z-index: 9999;
  border: 1px solid var(--color-cursor-border);
  background: var(--mos-panel);
  opacity: 1;
  isolation: isolate;
  border-radius: 10px;
  flex-direction: column;
  gap: 2px;
  padding: 6px;
  display: flex;
  position: fixed;
  box-shadow: 0 0 0 1px #0000000a, 0 8px 24px #0000003d, 0 24px 48px #0000002e;
}

.cursor-submit-revert-popover-item {
  background: var(--mos-panel);
  color: var(--color-cursor-text);
  text-align: left;
  cursor: pointer;
  transition: background var(--cursor-ease);
  border: none;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 13px;
}

.cursor-submit-revert-popover-item:hover {
  background: var(--mos-hover);
}

.cursor-submit-revert-popover-title {
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  margin: 0;
  padding: 6px 10px 4px;
  font-size: 11px;
  font-weight: 600;
}

.cursor-submit-revert-popover-primary {
  background: var(--cursor-accent, #3b82f6);
  color: var(--cursor-on-accent, #fff);
  cursor: pointer;
  text-align: left;
  transition: filter var(--cursor-ease);
  border: none;
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 600;
}

.cursor-submit-revert-popover-primary:hover {
  filter: brightness(1.05);
}

.cursor-submit-revert-hint {
  color: var(--color-cursor-muted);
  margin-left: 6px;
  font-size: 11px;
}

.cursor-composer-embedded {
  background: none;
  border: none;
  width: 100%;
  padding: 0;
}

.cursor-composer-inline .cursor-composer-box {
  width: 100%;
}

.msg-inline-edit {
  width: 100%;
  max-width: min(var(--desk-composer-max), 94vw);
  align-self: center;
  margin-left: auto;
  margin-right: auto;
}

.cursor-chat-thread.mos-chat .msg-inline-edit .cursor-composer-embedded {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 900px) {
  .cursor-chat-thread.mos-chat .msg-inline-edit.cursor-turn-user, .cursor-chat-thread.mos-chat .msg-inline-edit.cursor-turn-inline-edit, .cursor-chat-thread.mos-chat .cursor-turn-inline-edit {
    width: 100%;
    max-width: min(var(--desk-composer-max), 94vw);
    align-self: center;
    margin-left: auto;
    margin-right: auto;
  }
}

.msg-edit-btn {
  background: var(--cursor-overlay-hover);
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border: none;
  border-radius: 4px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.msg-edit-btn:hover {
  color: var(--color-cursor-text);
}

.msg-resend-btn {
  background: var(--cursor-overlay-hover);
  min-width: 22px;
  height: 22px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border: none;
  border-radius: 4px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0 6px;
  font-size: 11px;
  display: inline-flex;
}

.msg-resend-btn:hover {
  color: var(--color-cursor-text);
  background: #ffffff1a;
}

.msg-branch-switcher {
  color: var(--color-cursor-muted);
  background: #ffffff0a;
  border: 1px solid #ffffff14;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  padding: 2px 6px;
  font-size: 11px;
  display: inline-flex;
}

.msg-branch-btn {
  width: 20px;
  height: 20px;
  color: inherit;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 4px;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.msg-branch-btn:disabled {
  opacity: .35;
  cursor: default;
}

.msg-branch-btn:not(:disabled):hover {
  color: var(--color-cursor-text);
  background: var(--cursor-overlay-hover);
}

.msg-branch-label {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.msg-assistant-actions {
  opacity: 0;
  justify-content: flex-start;
  margin-top: 4px;
  transition: opacity .15s;
  display: flex;
}

.msg-assistant:hover .msg-assistant-actions, .msg-assistant:focus-within .msg-assistant-actions {
  opacity: 1;
}

.msg-inline-edit .cursor-composer-box {
  width: 100%;
}

.cursor-inline-edit-actions {
  gap: 8px;
  padding: 0 8px 8px;
  display: flex;
}

:root {
  --desk-transparency-bg: var(--mos-bg, var(--color-cursor-bg, #050608));
  --desk-transparency-border: var(--mos-text-bright, #fff);
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --desk-transparency-border: color-mix(in srgb,
    var(--mos-text-bright, #fff) 16%,
    transparent);
  }
}

:root {
  --desk-transparency-grid: var(--desk-transparency-bg);
}

[data-appearance="light"] {
  --desk-transparency-bg: var(--mos-bg, var(--color-cursor-bg));
  --desk-transparency-border: var(--mos-text, #1b1f24);
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] {
    --desk-transparency-border: color-mix(in srgb,
    var(--mos-text, #1b1f24) 12%,
    transparent);
  }
}

.desk-transparency-grid {
  box-shadow: inset 0 0 0 1px var(--desk-transparency-border);
  background: var(--desk-transparency-bg) !important;
}

.desk-image-viewer {
  background: var(--color-cursor-bg);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.desk-image-viewer-toolbar {
  min-height: var(--cursor-head-h);
  height: var(--cursor-head-h);
  border-bottom: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-sidebar);
  flex-shrink: 0;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
  padding: 0 14px 0 8px;
  display: grid;
}

.desk-image-viewer-toolbar-left {
  justify-self: start;
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.desk-image-viewer-name {
  min-width: 0;
  color: var(--color-cursor-text);
  font-size: 13px;
  font-weight: 500;
}

.desk-image-viewer-toolbar-center {
  justify-content: center;
  justify-self: center;
  align-items: center;
  gap: 4px;
  display: flex;
}

.desk-image-viewer-toolbar-right {
  justify-content: flex-end;
  justify-self: end;
  align-items: center;
  gap: 4px;
  padding-right: 2px;
  display: flex;
}

.desk-image-viewer-status {
  color: var(--color-cursor-muted);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 11px;
  overflow: hidden;
}

.desk-image-viewer-scale-btn {
  border-radius: var(--cursor-radius-sm);
  min-width: 3rem;
  height: 22px;
  color: var(--color-cursor-muted);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0 6px;
  font-size: 12px;
}

.desk-image-viewer-scale-btn:hover {
  background: var(--color-cursor-hover);
  color: var(--color-cursor-text);
}

.desk-image-viewer-scale-input {
  border: 1px solid var(--color-cursor-border);
  border-radius: var(--cursor-radius-sm);
  background: var(--color-cursor-bg);
  width: 3.25rem;
  height: 22px;
  color: var(--color-cursor-text);
  text-align: center;
  font-variant-numeric: tabular-nums;
  padding: 0 4px;
  font-size: 12px;
}

.desk-image-viewer-scale-input:focus {
  border-color: var(--color-cursor-accent, #6b8afd);
  outline: none;
}

.desk-image-viewer-toolbar .cursor-icon-btn {
  width: 26px;
  min-width: 26px;
  height: 26px;
  padding: 0;
}

.desk-image-viewer-stage {
  touch-action: none;
  flex: 1;
  justify-content: center;
  align-items: center;
  min-height: 0;
  padding: 16px;
  display: flex;
  overflow: hidden;
}

.desk-image-viewer-stage.is-pannable {
  cursor: grab;
  touch-action: none;
}

.desk-image-viewer-stage.is-pannable:active {
  cursor: grabbing;
}

.desk-image-viewer-img {
  object-fit: contain;
  transform-origin: center;
  will-change: transform;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  background: var(--desk-transparency-bg);
  max-width: 100%;
  max-height: 100%;
  box-shadow: inset 0 0 0 1px var(--desk-transparency-border);
  transition: opacity .2s;
}

.desk-media-toolbar {
  min-height: var(--cursor-head-h);
  height: var(--cursor-head-h);
  border-bottom: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  display: flex;
}

.desk-media-toolbar-name {
  color: var(--color-cursor-text);
  flex: 1;
  min-width: 0;
  font-size: 12px;
}

.desk-media-toolbar-hint {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.desk-file-media-stack {
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.desk-file-media-fill {
  height: 100%;
}

.desk-file-media-body {
  background: #000;
  flex: 1;
  justify-content: center;
  align-items: center;
  min-height: 0;
  padding: 16px;
  display: flex;
}

.desk-file-media-audio {
  background: var(--color-cursor-bg);
}

.desk-file-media-fit {
  width: 100%;
  max-width: 100%;
  max-height: 100%;
}

.desk-file-media-frame {
  background: var(--mos-panel);
  border: 0;
  flex: 1;
  width: 100%;
  min-height: 0;
}

.desk-file-media video {
  background: #000;
}

.desk-media-player {
  background: var(--color-cursor-editor, #0d0e12);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.desk-media-player-controls {
  border-top: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  flex-direction: column;
  flex-shrink: 0;
  display: flex;
}

.desk-media-player-toolbar {
  min-height: var(--cursor-head-h);
  flex-wrap: wrap;
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  display: flex;
}

.desk-media-player-toolbar-left {
  flex: auto;
  align-items: center;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.desk-media-player-toolbar-right {
  flex: auto;
  justify-content: flex-end;
  align-items: center;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.desk-media-player-toolbar .cursor-icon-btn {
  flex-shrink: 0;
  width: 26px;
  min-width: 26px;
  height: 26px;
  padding: 0;
}

.desk-media-player-play .icon-inline {
  margin-left: 1px;
}

.desk-media-player-name {
  color: var(--color-cursor-muted);
  max-width: min(180px, 28vw);
  margin-right: 4px;
  font-size: 11px;
}

.desk-media-player-time {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-muted);
  white-space: nowrap;
  margin-left: 2px;
  font-size: 11px;
}

.desk-media-player-time-sep {
  opacity: .65;
  margin: 0 3px;
}

.desk-media-player-volume {
  width: 72px;
  height: 4px;
  accent-color: var(--color-cursor-accent, #6b8afd);
  cursor: pointer;
  flex-shrink: 0;
  margin: 0;
}

.desk-media-player-scrub {
  background: var(--color-cursor-sidebar);
  flex-shrink: 0;
  padding: 8px 12px 4px;
}

.desk-media-player-scrub-track {
  align-items: center;
  height: 14px;
  display: flex;
  position: relative;
}

.desk-media-player-scrub-track:before {
  content: "";
  background: var(--color-cursor-border);
  border-radius: 999px;
  height: 4px;
  position: absolute;
  left: 0;
  right: 0;
}

.desk-media-player-scrub-track:after {
  content: "";
  width: var(--desk-media-progress, 0%);
  background: var(--color-cursor-accent, #6b8afd);
  pointer-events: none;
  border-radius: 999px;
  height: 4px;
  position: absolute;
  left: 0;
}

.desk-media-player-scrub-input {
  z-index: 1;
  appearance: none;
  cursor: pointer;
  background: none;
  width: 100%;
  height: 14px;
  margin: 0;
  position: relative;
}

.desk-media-player-scrub-input::-webkit-slider-runnable-track {
  background: none;
  height: 4px;
}

.desk-media-player-scrub-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  background: var(--color-cursor-text);
  border: 2px solid var(--color-cursor-sidebar);
  width: 12px;
  height: 12px;
  box-shadow: 0 0 0 1px var(--color-cursor-border);
  border-radius: 50%;
  margin-top: -4px;
}

.desk-media-player-scrub-input::-moz-range-track {
  background: none;
  height: 4px;
}

.desk-media-player-scrub-input::-moz-range-thumb {
  background: var(--color-cursor-text);
  border: 2px solid var(--color-cursor-sidebar);
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.desk-media-player-stage {
  cursor: pointer;
  background: #0d0e12;
  flex: auto;
  justify-content: center;
  align-items: center;
  min-height: 0;
  display: flex;
  position: relative;
  overflow: hidden;
}

.desk-media-player-video {
  object-fit: contain;
  background: #000;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  display: block;
}

.desk-media-player-overlay-play {
  background: var(--color-cursor-bg);
  border: none;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  margin: auto;
  display: flex;
  position: absolute;
  inset: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-media-player-overlay-play {
    background: color-mix(in srgb, var(--color-cursor-bg) 82%, transparent);
  }
}

.desk-media-player-overlay-play {
  color: var(--color-cursor-text);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  cursor: pointer;
  pointer-events: auto;
  box-shadow: 0 4px 24px #00000059;
}

.desk-media-player-overlay-play:hover {
  background: var(--color-cursor-hover);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-media-player-overlay-play:hover {
    background: color-mix(in srgb, var(--color-cursor-hover) 70%, transparent);
  }
}

.desk-media-player-buffering {
  pointer-events: none;
  background: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.desk-media-player-buffering.is-error {
  color: var(--color-cursor-text);
  background: #00000040;
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-media-player-buffering.is-error {
    color: color-mix(in srgb, var(--color-cursor-text) 88%, transparent);
  }
}

.desk-media-player-buffering.is-error {
  font-size: 12px;
}

.desk-media-player-buffering .media-load-frame-wave {
  position: absolute;
  inset: 0;
}

.desk-media-player-audio-body {
  background: var(--color-cursor-bg);
  flex-direction: column;
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 16px;
  min-height: 0;
  padding: 24px;
  display: flex;
}

.desk-media-player-audio-art {
  background: var(--color-cursor-sidebar);
  border: 1px solid var(--color-cursor-border-soft);
  width: 88px;
  height: 88px;
  color: var(--color-cursor-muted);
  border-radius: 16px;
  justify-content: center;
  align-items: center;
  display: flex;
}

.desk-media-player-audio-el {
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
  position: absolute;
}

.desk-media-player--audio .desk-media-player-audio-body {
  position: relative;
}

.desk-media-player--studio-preview {
  background: var(--color-cursor-bg);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.desk-media-player--studio-preview .desk-media-player-stage {
  flex: 1;
  min-height: 0;
}

.desk-media-player--studio-preview .desk-image-viewer-toolbar-center {
  justify-content: center;
  align-items: center;
  gap: 4px;
  display: flex;
}

.desk-media-player--studio-preview .desk-image-viewer-toolbar-right {
  justify-content: flex-end;
  align-items: center;
  gap: 4px;
  display: flex;
}

.desk-media-player--studio-preview .desk-media-player-controls {
  flex-shrink: 0;
}

.desk-media-player-embed {
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 12px 16px 16px;
}

.desk-media-player-embed .desk-media-player {
  border-radius: var(--cursor-radius-sm);
  border: 1px solid var(--color-cursor-border-soft);
  flex: none;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: min(82vh, 720px);
  overflow: hidden;
}

.desk-media-player-embed .desk-media-player-stage {
  flex: none;
  width: 100%;
  min-height: 0;
}

.desk-media-player-embed .desk-media-player--portrait {
  width: min(100%, max(220px, calc(min(72vh, 620px) * var(--desk-media-aspect, .5625))));
  margin: 0 auto;
}

.desk-media-player-embed .desk-media-player--portrait .desk-media-player-stage {
  width: 100%;
  aspect-ratio: var(--desk-media-aspect, 9 / 16);
  flex: none;
  max-height: min(72vh, 620px);
}

.desk-media-player-embed .desk-media-player--landscape .desk-media-player-stage {
  width: 100%;
  aspect-ratio: var(--desk-media-aspect, 16 / 9);
  flex: none;
  max-height: min(52vh, 420px);
}

.desk-media-player-embed .desk-media-player--landscape {
  max-width: min(100%, 920px);
  margin: 0 auto;
}

.desk-media-player-embed .desk-media-player-audio-body {
  flex: none;
  min-height: 160px;
  padding: 16px;
}

.desk-archive-viewer {
  background: var(--color-cursor-editor, #0d0e12);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.desk-archive-viewer--unsupported {
  max-width: 32rem;
  padding: 24px;
}

.desk-archive-unsupported-icon {
  color: var(--color-cursor-muted);
  margin-bottom: 8px;
}

.desk-archive-toolbar {
  min-height: var(--cursor-head-h);
  height: var(--cursor-head-h);
  border-bottom: 1px solid var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 0 10px;
  display: flex;
}

.desk-archive-toolbar-left {
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.desk-archive-toolbar-name {
  color: var(--color-cursor-text);
  font-size: 13px;
}

.desk-archive-toolbar-meta {
  color: var(--color-cursor-muted);
  white-space: nowrap;
  font-size: 11px;
}

.desk-archive-toolbar-actions {
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  display: flex;
}

.desk-archive-action {
  color: var(--color-cursor-text);
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm);
  background: var(--color-cursor-bg);
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  font-size: 12px;
  display: inline-flex;
}

.desk-archive-action:hover:not(:disabled) {
  border-color: var(--color-cursor-border);
  background: var(--color-cursor-sidebar);
}

.desk-archive-action:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.desk-archive-breadcrumbs {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  flex-wrap: wrap;
  flex-shrink: 0;
  align-items: center;
  gap: 2px;
  padding: 6px 10px;
  display: flex;
}

.desk-archive-breadcrumbs-segment {
  align-items: center;
  gap: 2px;
  max-width: 100%;
  display: inline-flex;
}

.desk-archive-breadcrumbs-sep {
  color: var(--color-cursor-muted);
  flex-shrink: 0;
}

.desk-archive-breadcrumbs-chip {
  color: var(--color-cursor-muted);
  border-radius: var(--cursor-radius-sm);
  padding: 2px 6px;
  font-size: 12px;
}

.desk-archive-breadcrumbs-chip:hover {
  color: var(--color-cursor-text);
  background: var(--color-cursor-sidebar);
}

.desk-archive-breadcrumbs-chip.is-current {
  color: var(--color-cursor-text);
}

.desk-archive-body {
  flex: 1;
  grid-template-columns: minmax(200px, 38%) minmax(0, 1fr);
  min-height: 0;
  display: grid;
}

@media (max-width: 899px) {
  .desk-archive-body {
    grid-template-rows: minmax(140px, 40%) minmax(0, 1fr);
    grid-template-columns: 1fr;
  }
}

.desk-archive-list-wrap {
  border-right: 1px solid var(--color-cursor-border-soft);
  min-height: 0;
  overflow: auto;
}

@media (max-width: 899px) {
  .desk-archive-list-wrap {
    border-right: 0;
    border-bottom: 1px solid var(--color-cursor-border-soft);
  }
}

.desk-archive-list {
  margin: 0;
  padding: 4px;
  list-style: none;
}

.desk-archive-entry {
  text-align: left;
  border-radius: var(--cursor-radius-sm);
  width: 100%;
  color: var(--color-cursor-text);
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  font-size: 13px;
  display: flex;
}

.desk-archive-entry:hover {
  background: var(--color-cursor-sidebar);
}

.desk-archive-entry.is-selected {
  background: var(--color-cursor-accent, #3b82f6);
}

@supports (color: color-mix(in lab, red, red)) {
  .desk-archive-entry.is-selected {
    background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 18%, transparent);
  }
}

.desk-archive-entry.is-parent {
  color: var(--color-cursor-muted);
}

.desk-archive-entry-name {
  flex: 1;
  min-width: 0;
}

.desk-archive-entry-size {
  color: var(--color-cursor-muted);
  flex-shrink: 0;
  font-size: 11px;
}

.desk-archive-empty {
  color: var(--color-cursor-muted);
  padding: 12px;
  font-size: 12px;
}

.desk-archive-detail {
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.desk-archive-detail-head {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  flex-shrink: 0;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 12px;
  display: flex;
}

.desk-archive-detail-title {
  color: var(--color-cursor-text);
  font-size: 13px;
}

.desk-archive-detail-meta {
  color: var(--color-cursor-muted);
  margin-top: 2px;
  font-size: 11px;
}

.desk-archive-detail-actions {
  flex-shrink: 0;
  gap: 6px;
  display: flex;
}

.desk-archive-detail-preview {
  flex: 1;
  min-height: 0;
  padding: 8px;
  overflow: auto;
}

.desk-archive-detail-empty {
  color: var(--color-cursor-muted);
  padding: 24px 16px;
  font-size: 13px;
}

.desk-archive-preview-text {
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--color-cursor-sidebar);
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm);
  max-height: 100%;
  margin: 0;
  padding: 12px;
  font-size: 12px;
  line-height: 1.5;
  overflow: auto;
}

.desk-archive-preview-muted {
  color: var(--color-cursor-muted);
  padding: 12px;
  font-size: 12px;
}

.desk-archive-preview-media {
  height: 100%;
  min-height: 200px;
}

.desk-archive-state {
  color: var(--color-cursor-muted);
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 32px 16px;
  font-size: 13px;
  display: flex;
}

.desk-archive-state--error {
  color: #f87171;
  flex-direction: column;
}

.desk-archive-status {
  color: var(--color-cursor-muted);
  border-top: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-sidebar);
  flex-shrink: 0;
  padding: 6px 10px;
  font-size: 11px;
}

.desk-archive-spin {
  animation: .8s linear infinite desk-spin;
}

.desk-archive-path {
  color: var(--color-cursor-text);
  font-size: 11px;
}

.desk-archive-entry .rotate-180 {
  transform: rotate(180deg);
}

.cursor-chat-history-fold {
  border: 1px dashed var(--color-cursor-border);
  width: 100%;
  color: var(--color-cursor-muted);
  text-align: center;
  cursor: pointer;
  background: none;
  border-radius: 8px;
  margin: 8px 0 16px;
  padding: 8px 12px;
  font-size: 12px;
  display: block;
}

.cursor-chat-history-fold:hover {
  color: var(--color-cursor-text);
  border-color: var(--cursor-accent-border);
}

.studio-mobile-bottom-nav {
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  isolation: auto !important;
  contain: none !important;
  background: none !important;
  border: 0 !important;
}

.studio-polish:has(.studio-cn-book-bar) .studio-mobile-bottom-nav {
  box-shadow: none !important;
  border-top-color: #0000 !important;
}

.studio-polish .cursor-panel-head, .studio-polish .cursor-workspace-head {
  background: var(--mos-bg, var(--color-cursor-bg, #05080f)) !important;
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft)) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  isolation: auto !important;
  contain: none !important;
  transform: none !important;
}

[data-appearance="light"] .studio-mobile-bottom-nav {
  background: none !important;
  border: 0 !important;
}

[data-appearance="light"] .studio-polish:has(.studio-cn-book-bar) .studio-mobile-bottom-nav {
  box-shadow: none !important;
  border-top-color: #0000 !important;
}

[data-appearance="light"] .studio-polish .cursor-panel-head, [data-appearance="light"] .studio-polish .cursor-workspace-head {
  background: var(--mos-panel) !important;
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft)) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.studio-polish :where(.cursor-explorer-panel) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: none !important;
}

.studio-polish :where(.cursor-icon-btn, .cursor-icon-btn-sm) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: none !important;
  border-radius: 999px !important;
}

.studio-polish .studio-credit-pill:hover:not(:disabled) {
  box-shadow: none;
  transform: none;
}

.studio-polish .studio-composer .studio-pill-btn {
  background: var(--studio-composer-glass-muted, var(--color-mos-composer, #07111f)) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-composer .studio-pill-btn {
    background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--color-mos-composer, #07111f) 44%, transparent)) !important;
  }
}

.studio-polish .studio-composer .studio-pill-btn {
  border-color: var(--studio-composer-glass-border, #ffffff1c);
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
}

.studio-polish .studio-composer .cursor-composer-box {
  background: var(--studio-composer-glass, var(--color-mos-composer, #07111f)) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-composer .cursor-composer-box {
    background: var(--studio-composer-glass, color-mix(in srgb, var(--color-mos-composer, #07111f) 58%, transparent)) !important;
  }
}

.studio-polish .studio-composer .cursor-composer-box {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
  box-shadow: var(--studio-composer-glass-shadow, 0 20px 48px #00000061, inset 0 1px 0 #ffffff14);
  border: 0 #0000 !important;
}

.studio-polish .studio-composer-options-panel {
  background: var(--studio-composer-glass-strong, var(--studio-composer-glass, var(--color-mos-composer, #07111f))) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-composer-options-panel {
    background: var(--studio-composer-glass-strong, var(--studio-composer-glass, color-mix(in srgb, var(--color-mos-composer, #07111f) 88%, transparent))) !important;
  }
}

.studio-polish .studio-composer-options-panel {
  border-color: var(--studio-composer-glass-border, #ffffff24) !important;
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px)) !important;
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px)) !important;
  filter: none !important;
  isolation: auto !important;
  box-shadow: var(--studio-composer-glass-shadow, 0 20px 48px #00000061, inset 0 1px 0 #ffffff14) !important;
  transform: none !important;
}

.studio-polish .studio-composer-options-panel.is-overlay {
  transform: none !important;
}

.studio-polish .studio-mobile-app-menu-sheet {
  filter: none !important;
  isolation: auto !important;
  transform: none !important;
}

.studio-polish .studio-composer-options-panel .studio-preset-grid-panel {
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  isolation: auto !important;
  filter: none !important;
  background: none !important;
  border: 0 !important;
  animation: none !important;
  transform: none !important;
}

.studio-polish .studio-mode-row {
  z-index: 0;
  position: relative;
  overflow: hidden;
  color: var(--color-cursor-text-bright, #f4f6fb) !important;
  background: none !important;
  border: 1px solid #0000 !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-mode-row {
    color: color-mix(in srgb, var(--color-cursor-text-bright, #f4f6fb) 48%, transparent) !important;
  }
}

.studio-polish .studio-mode-row {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: none !important;
}

.studio-polish .studio-mode-row > * {
  z-index: 1;
  position: relative;
}

.studio-polish .studio-mode-row:hover {
  background: var(--color-cursor-fg, #fff) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-mode-row:hover {
    background: color-mix(in srgb, var(--color-cursor-fg, #fff) 8%, transparent) !important;
  }
}

.studio-polish .studio-mode-row:hover {
  color: var(--color-cursor-text-bright, #f4f6fb) !important;
  border-color: #0000 !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-mode-row:hover {
    color: color-mix(in srgb, var(--color-cursor-text-bright, #f4f6fb) 78%, transparent) !important;
  }
}

.studio-polish .studio-mode-row.is-active {
  background: radial-gradient(circle at 18% 0%, var(--cursor-accent-hover), transparent 46%), linear-gradient(180deg, var(--cursor-accent-hover) 0%, var(--cursor-accent) 46%, var(--cursor-accent) 100%), linear-gradient(180deg, #0a101c 0%, #05080f 100%) !important;
  border-color: #0000 !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-mode-row.is-active {
    background: radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--cursor-accent-hover) 22%, transparent), transparent 46%), linear-gradient(180deg, color-mix(in srgb, var(--cursor-accent-hover) 34%, transparent) 0%, color-mix(in srgb, var(--cursor-accent) 22%, transparent) 46%, color-mix(in srgb, var(--cursor-accent) 12%, #000 28%) 100%), linear-gradient(180deg, #0a101c 0%, #05080f 100%) !important;
  }
}

.studio-polish .studio-mode-row.is-active {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  color: #fff !important;
  box-shadow: inset 0 1px 0 #ffffff1a, inset 0 -2px 0 #00000047, 0 0 14px var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-mode-row.is-active {
    box-shadow: inset 0 1px 0 #ffffff1a, inset 0 -2px 0 #00000047, 0 0 14px color-mix(in srgb, var(--cursor-accent) 12%, transparent) !important;
  }
}

.studio-polish .studio-mode-row.is-active:before {
  z-index: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(180deg, var(--cursor-accent-hover) 0%, var(--cursor-accent) 38%, var(--cursor-accent) 68%, transparent 100%);
  padding: 1px;
  position: absolute;
  inset: 0;
  content: "" !important;
  display: block !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-mode-row.is-active:before {
    background: linear-gradient(180deg, color-mix(in srgb, var(--cursor-accent-hover) 88%, #fff 10%) 0%, color-mix(in srgb, var(--cursor-accent) 58%, transparent) 38%, color-mix(in srgb, var(--cursor-accent) 22%, transparent) 68%, transparent 100%);
  }
}

.studio-polish .studio-mode-row.is-active:before {
  -webkit-mask-composite: xor;
  -webkit-mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 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;
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  -webkit-mask-source-type: auto, auto;
  mask-mode: match-source, match-source;
  box-shadow: none !important;
}

.studio-polish .studio-mode-row.is-active svg, .studio-polish .studio-mode-row.is-active svg * {
  color: #fff !important;
  stroke: #fff !important;
  fill: none !important;
  filter: none !important;
  opacity: 1 !important;
}

[data-appearance="light"] .studio-polish .studio-mode-row {
  color: var(--color-cursor-text, #0f172a) !important;
  background: none !important;
  border-color: #0000 !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .studio-polish .studio-mode-row {
    color: color-mix(in srgb, var(--color-cursor-text, #0f172a) 52%, transparent) !important;
  }
}

[data-appearance="light"] .studio-polish .studio-mode-row:hover {
  color: var(--color-cursor-text, #0f172a) !important;
  background: #0000000d !important;
  border-color: #0000 !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .studio-polish .studio-mode-row:hover {
    color: color-mix(in srgb, var(--color-cursor-text, #0f172a) 78%, transparent) !important;
  }
}

[data-appearance="light"] .studio-polish .studio-mode-row.is-active {
  background: radial-gradient(circle at 18% 0%, var(--cursor-accent-hover), transparent 46%), linear-gradient(180deg, var(--cursor-accent-hover) 0%, var(--cursor-accent) 46%, var(--cursor-accent) 100%), linear-gradient(180deg, #1a2230 0%, #101722 100%) !important;
  border-color: #0000 !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .studio-polish .studio-mode-row.is-active {
    background: radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--cursor-accent-hover) 24%, transparent), transparent 46%), linear-gradient(180deg, color-mix(in srgb, var(--cursor-accent-hover) 42%, transparent) 0%, color-mix(in srgb, var(--cursor-accent) 28%, transparent) 46%, color-mix(in srgb, var(--cursor-accent) 16%, #000 18%) 100%), linear-gradient(180deg, #1a2230 0%, #101722 100%) !important;
  }
}

[data-appearance="light"] .studio-polish .studio-mode-row.is-active {
  color: #fff !important;
  box-shadow: inset 0 1px 0 #ffffff1f, inset 0 -2px 0 #00000038, 0 0 14px var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .studio-polish .studio-mode-row.is-active {
    box-shadow: inset 0 1px 0 #ffffff1f, inset 0 -2px 0 #00000038, 0 0 14px color-mix(in srgb, var(--cursor-accent) 14%, transparent) !important;
  }
}

.studio-polish .studio-generate-btn:not(:disabled) {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.studio-dropdown-menu.is-fixed, .studio-add-menu {
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

.studio-settings-menu.is-fixed {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.studio-asset-preview-actions {
  justify-content: flex-end;
  gap: .5rem;
  padding: .65rem .85rem 0;
  display: flex;
}

.studio-asset-preview .desk-image-viewer-toolbar, .studio-asset-preview .desk-media-player--studio-preview .desk-image-viewer-toolbar {
  background: var(--color-cursor-bg) !important;
  -webkit-backdrop-filter: none !important;
}

[data-appearance="light"] .studio-asset-preview .desk-image-viewer-toolbar, [data-appearance="light"] .studio-asset-preview .desk-media-player--studio-preview .desk-image-viewer-toolbar {
  background: var(--mos-panel) !important;
}

.studio-empty-copy {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.studio-polish .studio-chat-bubble {
  border-color: var(--studio-composer-glass-border, #ffffff1c) !important;
  background: var(--studio-composer-glass-strong, var(--studio-composer-glass, var(--color-mos-composer, #07111f))) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-chat-bubble {
    background: var(--studio-composer-glass-strong, var(--studio-composer-glass, color-mix(in srgb, var(--color-mos-composer, #07111f) 88%, transparent))) !important;
  }
}

.studio-polish .studio-chat-bubble {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: var(--studio-composer-glass-shadow, 0 20px 48px #00000061, inset 0 1px 0 #ffffff14) !important;
}

.studio-polish .studio-chat-bubble.is-user {
  border-color: var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-chat-bubble.is-user {
    border-color: color-mix(in srgb, var(--cursor-accent) 42%, transparent) !important;
  }
}

.studio-polish .studio-chat-bubble.is-user {
  background: linear-gradient(145deg, var(--cursor-accent) 0%, var(--cursor-accent) 48%, var(--cursor-accent-hover, var(--cursor-accent)) 100%) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-chat-bubble.is-user {
    background: linear-gradient(145deg, color-mix(in srgb, var(--cursor-accent) 72%, #fff 8%) 0%, color-mix(in srgb, var(--cursor-accent) 58%, transparent) 48%, color-mix(in srgb, var(--cursor-accent-hover, var(--cursor-accent)) 46%, #07111f 18%) 100%) !important;
  }
}

.studio-polish .studio-chat-bubble.is-user {
  box-shadow: 0 14px 32px var(--cursor-accent), inset 0 1px 0 #ffffff2e !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-chat-bubble.is-user {
    box-shadow: 0 14px 32px color-mix(in srgb, var(--cursor-accent) 22%, transparent), inset 0 1px 0 #ffffff2e !important;
  }
}

.studio-polish .studio-chat-bubble.is-user {
  color: var(--cursor-accent-fg, var(--mos-accent-fg, #fff));
}

[data-appearance="light"] .studio-polish .studio-chat-bubble.is-user {
  border-color: var(--cursor-accent) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .studio-polish .studio-chat-bubble.is-user {
    border-color: color-mix(in srgb, var(--cursor-accent) 38%, transparent) !important;
  }
}

[data-appearance="light"] .studio-polish .studio-chat-bubble.is-user {
  background: linear-gradient(145deg, var(--cursor-accent) 0%, var(--cursor-accent) 52%, var(--cursor-accent-hover, var(--cursor-accent)) 100%) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .studio-polish .studio-chat-bubble.is-user {
    background: linear-gradient(145deg, color-mix(in srgb, var(--cursor-accent) 78%, #fff 10%) 0%, color-mix(in srgb, var(--cursor-accent) 62%, transparent) 52%, color-mix(in srgb, var(--cursor-accent-hover, var(--cursor-accent)) 54%, #fff 12%) 100%) !important;
  }
}

.studio-polish .studio-chat-bubble.is-system, .studio-polish .studio-chat-bubble.is-assistant {
  background: var(--studio-composer-glass-strong, var(--studio-composer-glass, #05080fe6)) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

[data-appearance="light"] .studio-polish .studio-chat-bubble.is-system, [data-appearance="light"] .studio-polish .studio-chat-bubble.is-assistant {
  background: var(--studio-composer-glass, var(--mos-panel)) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  [data-appearance="light"] .studio-polish .studio-chat-bubble.is-system, [data-appearance="light"] .studio-polish .studio-chat-bubble.is-assistant {
    background: var(--studio-composer-glass, color-mix(in srgb, var(--mos-panel) 70%, transparent)) !important;
  }
}

.studio-polish .studio-chat-bubble.is-thinking {
  padding-block: 12px 14px;
}

.studio-polish .studio-chat-bubble.is-result {
  width: fit-content !important;
  max-width: min(100%, var(--studio-chat-bubble-max, 90%)) !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.studio-polish .studio-chat-result-card.is-image-result .studio-chat-result-media.media-load-frame {
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  background: none !important;
}

.studio-polish .studio-chat-result-card.is-image-result {
  border: 1px solid var(--studio-composer-glass-border, #ffffff29) !important;
  background: var(--studio-composer-glass, #05080f8c) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-chat-result-card.is-image-result {
    background: color-mix(in srgb, var(--studio-composer-glass, #05080f8c) 55%, transparent) !important;
  }
}

.studio-polish .studio-chat-result-card.is-image-result {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(160%) blur(12px)) !important;
  box-shadow: 0 8px 22px #00000038, inset 0 1px #ffffff1a !important;
}

.studio-polish .studio-chat-result-stack.has-footer .studio-chat-result-card.is-image-result {
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
}

.studio-assist-thinking {
  align-items: center;
  gap: 12px;
  min-height: 36px;
  display: flex;
}

.studio-assist-thinking.is-pencil-only {
  justify-content: flex-start;
  min-height: 32px;
}

.studio-assist-thinking-icon {
  width: 40px;
  height: 40px;
  color: var(--cursor-accent, #7dd3fc);
  flex: none;
  place-items: center;
  display: grid;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-thinking-icon {
    color: color-mix(in srgb, var(--cursor-accent, #7dd3fc) 82%, var(--color-cursor-text, #f4f7fb));
  }
}

.studio-assist-thinking-icon {
  opacity: .92;
}

.studio-assist-thinking-icon svg {
  width: 34px;
  height: 34px;
  overflow: visible;
}

.studio-assist-pencil {
  transform-origin: 34px 14px;
  animation: .9s ease-in-out infinite studio-assist-pencil-scribble;
}

.studio-assist-scribble path {
  stroke-dasharray: 18;
  stroke-dashoffset: 18px;
  opacity: .35;
}

.studio-assist-scribble-a {
  animation: .9s ease-in-out infinite studio-assist-scribble-draw;
}

.studio-assist-scribble-b {
  animation: .9s ease-in-out .12s infinite studio-assist-scribble-draw;
}

.studio-assist-scribble-c {
  animation: .9s ease-in-out .24s infinite studio-assist-scribble-draw;
}

.studio-assist-thinking-copy {
  align-items: baseline;
  gap: 6px;
  min-width: 0;
  display: inline-flex;
}

.studio-assist-thinking-label {
  color: var(--color-cursor-muted, #93a4b8);
  letter-spacing: .01em;
  font-size: 13px;
  font-weight: 600;
}

.studio-assist-thinking-dots {
  align-items: center;
  gap: 3px;
  margin-left: 1px;
  display: inline-flex;
}

.studio-assist-thinking-dots i {
  width: 3px;
  height: 3px;
  color: var(--color-cursor-muted, #93a4b8);
  opacity: .35;
  background: currentColor;
  border-radius: 999px;
  animation: 1.05s ease-in-out infinite studio-assist-dot-bounce;
}

.studio-assist-thinking-dots i:nth-child(2) {
  animation-delay: .14s;
}

.studio-assist-thinking-dots i:nth-child(3) {
  animation-delay: .28s;
}

@keyframes studio-assist-pencil-scribble {
  0%, 100% {
    transform: rotate(-8deg)translate(0);
  }

  25% {
    transform: rotate(6deg)translate(1px, 1px);
  }

  50% {
    transform: rotate(-4deg)translate(-1px, 1.5px);
  }

  75% {
    transform: rotate(7deg)translate(1.5px, .5px);
  }
}

@keyframes studio-assist-scribble-draw {
  0%, 100% {
    stroke-dashoffset: 18px;
    opacity: .2;
  }

  40%, 70% {
    stroke-dashoffset: 0;
    opacity: .7;
  }
}

@keyframes studio-assist-dot-bounce {
  0%, 80%, 100% {
    opacity: .3;
    transform: translateY(0);
  }

  40% {
    opacity: .95;
    transform: translateY(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-assist-pencil, .studio-assist-scribble path, .studio-assist-thinking-dots i {
    animation: none;
  }

  .studio-assist-scribble path {
    stroke-dashoffset: 0;
    opacity: .45;
  }
}

.studio-composer-toolbar-left {
  flex-wrap: wrap;
  flex: none;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: inline-flex;
}

.studio-composer-toolbar-left .studio-video-type-picker {
  scrollbar-width: none;
  flex-wrap: nowrap;
  max-width: min(100%, 220px);
  overflow-x: auto;
}

.studio-composer-toolbar-left .studio-video-type-picker::-webkit-scrollbar {
  display: none;
}

.studio-composer-toolbar-left .studio-video-type-chip {
  white-space: nowrap;
  border-color: var(--studio-composer-glass-border, #ffffff24);
  background: var(--studio-composer-glass-muted, var(--color-mos-composer, #07111f));
  flex: none;
  padding: .15rem .5rem;
  font-size: 10px;
  font-weight: 650;
  line-height: 1.2;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-composer-toolbar-left .studio-video-type-chip {
    background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--color-mos-composer, #07111f) 44%, transparent));
  }
}

.studio-composer-toolbar-left .studio-video-type-chip {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
}

.studio-composer-toolbar-left .studio-video-type-chip.is-active {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-composer-toolbar-left .studio-video-type-chip.is-active {
    border-color: color-mix(in srgb, var(--cursor-accent) 48%, var(--color-cursor-border-soft));
  }
}

.studio-composer-toolbar-left .studio-video-type-chip.is-active {
  background: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-composer-toolbar-left .studio-video-type-chip.is-active {
    background: color-mix(in srgb, var(--cursor-accent) 16%, var(--studio-composer-glass-muted));
  }
}

.studio-composer-toolbar-left .studio-video-type-chip.is-active {
  color: var(--color-cursor-text-bright);
}

.studio-composer-circle-btn.studio-assist-circle-btn {
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  padding: 0;
}

.studio-composer-toolbar .studio-assist-circle-btn svg {
  stroke-width: 2.25px !important;
  width: 14px !important;
  height: 14px !important;
}

.studio-polish.is-studio-mobile .studio-composer-toolbar .studio-composer-circle-btn, .studio-polish.is-studio-mobile .studio-composer-toolbar .studio-pill-btn.studio-preset-trigger, .studio-polish.is-studio-mobile .studio-composer-toolbar .studio-upload-trigger {
  width: 26px;
  min-width: 26px;
  height: 26px;
  min-height: 26px;
}

.studio-polish.is-studio-mobile .studio-composer-toolbar .studio-composer-circle-btn.studio-composer-send-btn {
  width: auto;
  min-width: 26px;
}

.studio-polish.is-studio-mobile .studio-composer-toolbar .studio-assist-circle-btn svg, .studio-polish.is-studio-mobile .studio-composer-toolbar .studio-composer-circle-btn > svg, .studio-polish.is-studio-mobile .studio-composer-toolbar .studio-preset-trigger > svg {
  stroke-width: 2.2px !important;
  width: 12px !important;
  height: 12px !important;
}

.studio-composer-circle-btn.studio-assist-circle-btn.is-on, .studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-composer-circle-btn.studio-assist-circle-btn.is-on, .studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--cursor-accent) 48%, var(--color-cursor-border-soft));
  }
}

.studio-composer-circle-btn.studio-assist-circle-btn.is-on, .studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
  background: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-composer-circle-btn.studio-assist-circle-btn.is-on, .studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
    background: color-mix(in srgb, var(--cursor-accent) 16%, var(--studio-composer-glass-muted));
  }
}

.studio-composer-circle-btn.studio-assist-circle-btn.is-on, .studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
  color: var(--color-cursor-text-bright);
}

.studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--cursor-accent) 62%, var(--color-cursor-border-soft));
  }
}

.studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
  background: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-composer-circle-btn.studio-assist-circle-btn.is-on:hover:not(:disabled) {
    background: color-mix(in srgb, var(--cursor-accent) 24%, var(--studio-composer-glass-muted));
  }
}

.studio-assist-video-type-card {
  align-content: start;
  gap: .45rem;
  display: grid;
}

.studio-video-type-picker {
  flex-wrap: wrap;
  gap: .35rem;
  display: inline-flex;
}

.studio-video-type-chip {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-video-type-chip {
    background: color-mix(in srgb, var(--color-cursor-text) 5%, transparent);
  }
}

.studio-video-type-chip {
  color: inherit;
  cursor: pointer;
  border-radius: 999px;
  padding: .2rem .65rem;
  font-size: .7rem;
}

.studio-video-type-chip.is-active {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-video-type-chip.is-active {
    border-color: color-mix(in srgb, var(--cursor-accent) 40%, var(--color-cursor-border));
  }
}

.studio-video-type-chip.is-active {
  background: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-video-type-chip.is-active {
    background: color-mix(in srgb, var(--color-cursor-text) 10%, transparent);
  }
}

.studio-assist-card {
  border: 1px solid var(--studio-composer-glass-border, #ffffff1f);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-card {
    border: 1px solid color-mix(in srgb, var(--studio-composer-glass-border, #ffffff1f) 72%, transparent);
  }
}

.studio-assist-card {
  background: var(--studio-composer-glass-strong, var(--studio-composer-glass, #05080fe6));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-radius: 1rem;
  gap: .55rem;
  padding: .7rem .75rem;
  display: grid;
  box-shadow: inset 0 1px #ffffff0b;
}

.studio-assist-review-card.is-expired {
  opacity: .78;
  gap: .35rem;
  padding: .6rem .7rem;
}

.studio-assist-review-title {
  letter-spacing: -.01em;
  color: var(--color-cursor-text, #fff);
  align-items: flex-start;
  gap: .4rem;
  margin: 0;
  font-size: .88rem;
  font-weight: 500;
  line-height: 1.35;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-title {
    color: color-mix(in srgb, var(--color-cursor-text, #fff) 84%, transparent);
  }
}

.studio-assist-review-title > span:last-child {
  min-width: 0;
}

.studio-assist-review-mode-icon {
  width: 1.55rem;
  height: 1.55rem;
  color: inherit;
  opacity: .72;
  background: none;
  border: 0;
  flex: none;
  place-items: center;
  display: inline-grid;
}

.studio-assist-review-mode-icon svg {
  width: 1.3rem;
  height: 1.3rem;
}

.studio-assist-review-actions {
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  width: 100%;
  display: grid;
}

.studio-assist-review-half-btn {
  width: 100%;
  min-width: 0;
  min-height: 1.9rem;
  font: inherit;
  cursor: pointer;
  border-radius: .65rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .05rem;
  padding: .28rem .55rem;
  transition: border-color .16s, box-shadow .18s, background .16s;
  display: inline-flex;
}

.studio-assist-review-half-label {
  justify-content: center;
  align-items: center;
  gap: .28rem;
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.1;
  display: inline-flex;
}

.studio-assist-review-half-cost {
  opacity: .9;
  font-size: .62rem;
  font-weight: 600;
  line-height: 1.1;
}

.studio-assist-review-half-chevron {
  opacity: .72;
  flex: none;
  width: .85rem;
  height: .85rem;
  transition: transform .18s;
}

.studio-assist-review-half-chevron.is-open {
  transform: rotate(180deg);
}

.studio-assist-review-half-btn.is-review {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-half-btn.is-review {
    background: color-mix(in srgb, var(--color-cursor-text) 6%, transparent);
  }
}

.studio-assist-review-half-btn.is-review {
  box-shadow: none;
  color: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-half-btn.is-review {
    color: color-mix(in srgb, var(--color-cursor-text) 88%, transparent);
  }
}

.studio-assist-review-half-btn.is-review {
  transform: none;
}

.studio-assist-review-half-btn.is-review:hover:not(:disabled) {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-half-btn.is-review:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--cursor-accent) 28%, var(--color-cursor-border));
  }
}

.studio-assist-review-half-btn.is-review:hover:not(:disabled) {
  background: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-half-btn.is-review:hover:not(:disabled) {
    background: color-mix(in srgb, var(--color-cursor-text) 10%, transparent);
  }
}

.studio-assist-review-half-btn.is-review:hover:not(:disabled) {
  color: var(--color-cursor-text-bright);
  box-shadow: none;
  transform: none;
}

.studio-assist-review-half-btn.is-review:active:not(:disabled) {
  transform: scale(.98);
}

.studio-assist-review-half-btn.is-review:focus-visible {
  outline: 2px solid var(--color-cursor-text, #fff);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-half-btn.is-review:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--color-cursor-text, #fff) 40%, transparent);
  }
}

.studio-assist-review-half-btn.is-review:focus-visible {
  outline-offset: 2px;
}

.studio-assist-review-half-btn.is-generate {
  border-radius: .65rem;
  width: 100%;
  min-height: 1.9rem;
  padding: .28rem .55rem;
  flex-direction: column !important;
  gap: .05rem !important;
}

.studio-assist-review-half-btn.is-generate.is-status {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-half-btn.is-generate.is-status {
    background: color-mix(in srgb, var(--color-cursor-text) 6%, transparent);
  }
}

.studio-assist-review-half-btn.is-generate.is-status {
  box-shadow: none;
  color: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-half-btn.is-generate.is-status {
    color: color-mix(in srgb, var(--color-cursor-text) 72%, transparent);
  }
}

.studio-assist-review-half-btn.is-generate.is-status {
  cursor: default;
  opacity: 1;
  transform: none;
}

.studio-assist-review-details {
  gap: .65rem;
  padding-top: .15rem;
  display: grid;
}

.studio-assist-review-details[hidden] {
  display: none;
}

.studio-assist-review-detail-title {
  color: var(--color-cursor-text, #fff);
  margin: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-detail-title {
    color: color-mix(in srgb, var(--color-cursor-text, #fff) 72%, transparent);
  }
}

.studio-assist-review-detail-title {
  font-size: .74rem;
  font-weight: 500;
  line-height: 1.4;
}

.studio-assist-ref-circles {
  flex-wrap: wrap;
  gap: .4rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-assist-ref-circle {
  appearance: none;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-text);
  border-radius: 999px;
  flex: 0 0 2.35rem;
  width: 2.35rem;
  height: 2.35rem;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-ref-circle {
    background: color-mix(in srgb, var(--color-cursor-text) 6%, transparent);
  }
}

.studio-assist-ref-circle {
  font: inherit;
  color: var(--color-cursor-muted);
  cursor: default;
  place-items: center;
  font-size: .75rem;
  font-weight: 700;
  display: grid;
}

.studio-assist-ref-circle.is-openable {
  cursor: pointer;
}

.studio-assist-ref-circle.is-openable:hover {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-ref-circle.is-openable:hover {
    border-color: color-mix(in srgb, var(--cursor-accent) 32%, var(--color-cursor-border));
  }
}

.studio-assist-ref-circle:disabled {
  cursor: default;
  opacity: 1;
}

.studio-assist-ref-circle img {
  object-fit: cover;
  pointer-events: none;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-assist-style-pill, .studio-assist-ref-fallback-text {
  opacity: .8;
  margin: .15rem 0 0;
  font-size: .78rem;
}

.studio-assist-settings-chips {
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem;
  display: flex;
}

.studio-assist-settings-chips .studio-assist-setting-select {
  flex: none;
  display: inline-flex;
}

.studio-assist-settings-chips .studio-assist-setting-select.is-disabled {
  opacity: .72;
}

.studio-assist-settings-chips .studio-assist-setting-select .studio-inline-setting-trigger {
  max-width: none;
}

.studio-assist-setting-chip {
  border: 1px solid var(--studio-composer-glass-border, #fff);
  border-radius: 999px;
  align-items: center;
  gap: .3rem;
  padding: .2rem .44rem;
  display: inline-flex;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-setting-chip {
    border: 1px solid color-mix(in srgb, var(--studio-composer-glass-border, #fff) 55%, transparent);
  }
}

.studio-assist-setting-chip {
  opacity: .76;
  background: #ffffff06;
  font-size: .7rem;
}

.studio-assist-setting-chip em {
  letter-spacing: 0;
  text-transform: none;
  opacity: .46;
  font-size: .62rem;
  font-style: normal;
}

.studio-assist-review-footer {
  border-top: 0;
  gap: .35rem;
  padding-top: 0;
  display: grid;
}

.studio-assist-review-card.is-expired .studio-assist-review-footer {
  padding-top: 0;
}

.studio-chip-drag-ghost {
  z-index: 99999;
  pointer-events: none;
  box-sizing: border-box;
  background: #0b1220c7;
  border: 1px solid #ffffff38;
  border-radius: 14px;
  position: fixed;
  top: 0;
  left: -9999px;
  overflow: hidden;
  box-shadow: 0 12px 28px #00000073;
}

.studio-chip-drag-ghost.is-media {
  width: 72px;
  height: 72px;
}

.studio-chip-drag-ghost.is-media img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-chip-drag-ghost.is-file {
  align-items: center;
  max-width: 180px;
  min-height: 36px;
  padding: .35rem .65rem;
  display: inline-flex;
}

.studio-chip-drag-ghost-label {
  color: #f4f7fb;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
}

.studio-assist-card-lead, .studio-assist-credits, .studio-assist-locked-note {
  opacity: .58;
  margin: 0;
  font-size: .76rem;
  line-height: 1.45;
}

.studio-assist-card-actions {
  width: 100%;
  display: block;
}

.studio-assist-primary-btn, .studio-assist-secondary-btn {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-primary-btn, .studio-assist-secondary-btn {
    background: color-mix(in srgb, var(--color-cursor-text) 6%, transparent);
  }
}

.studio-assist-primary-btn, .studio-assist-secondary-btn {
  color: inherit;
  cursor: pointer;
  border-radius: .65rem;
  padding: .4rem .7rem;
  font-size: .8rem;
}

.studio-assist-primary-btn {
  background: var(--color-cursor-text);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-primary-btn {
    background: color-mix(in srgb, var(--color-cursor-text) 12%, transparent);
  }
}

.studio-assist-primary-btn {
  border-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-primary-btn {
    border-color: color-mix(in srgb, var(--cursor-accent) 28%, var(--color-cursor-border));
  }
}

.studio-assist-generate-btn {
  background: linear-gradient(180deg, var(--cursor-accent-hover) 0%, var(--cursor-accent) 46%, var(--cursor-accent) 100%);
  border-radius: .75rem;
  width: 100%;
  min-height: 2.6rem;
  padding: .45rem .8rem;
  flex-direction: row !important;
  gap: .45rem !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn {
    background: linear-gradient(180deg, color-mix(in srgb, var(--cursor-accent-hover) 90%, #fff 6%) 0%, color-mix(in srgb, var(--cursor-accent) 90%, transparent) 46%, color-mix(in srgb, var(--cursor-accent) 70%, #000 24%) 100%);
  }
}

.studio-assist-generate-btn {
  border-color: var(--cursor-accent-hover);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn {
    border-color: color-mix(in srgb, var(--cursor-accent-hover) 52%, var(--cursor-accent) 48%);
  }
}

.studio-assist-generate-btn {
  border-bottom-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn {
    border-bottom-color: color-mix(in srgb, var(--cursor-accent) 62%, #000 28%);
  }
}

.studio-assist-generate-btn {
  box-shadow: inset 0 -2px 0 #00000038, 0 2px 3px #00000038, 0 4px 10px var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn {
    box-shadow: inset 0 -2px 0 #00000038, 0 2px 3px #00000038, 0 4px 10px color-mix(in srgb, var(--cursor-accent) 18%, transparent);
  }
}

.studio-assist-generate-btn {
  color: #fff;
  transition: border-color .16s, box-shadow .18s, background .16s;
}

.studio-assist-review-actions .studio-assist-review-half-btn.is-generate {
  border-radius: .65rem;
  height: auto;
  min-height: 1.9rem;
  max-height: none;
  padding: .28rem .55rem;
  flex-direction: column !important;
  gap: .05rem !important;
}

.studio-assist-review-actions .studio-assist-review-half-btn.is-generate.is-status {
  background: var(--color-cursor-text) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-actions .studio-assist-review-half-btn.is-generate.is-status {
    background: color-mix(in srgb, var(--color-cursor-text) 5%, transparent) !important;
  }
}

.studio-assist-review-actions .studio-assist-review-half-btn.is-generate.is-status {
  border: 1px solid var(--color-cursor-border, var(--mos-border)) !important;
  border-bottom-color: var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  box-shadow: none !important;
  color: var(--color-cursor-text) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-review-actions .studio-assist-review-half-btn.is-generate.is-status {
    color: color-mix(in srgb, var(--color-cursor-text) 72%, transparent) !important;
  }
}

.studio-assist-generate-btn:hover:not(:disabled) {
  border-color: var(--cursor-accent-hover);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--cursor-accent-hover) 58%, var(--cursor-accent) 42%);
  }
}

.studio-assist-generate-btn:hover:not(:disabled) {
  border-bottom-color: var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn:hover:not(:disabled) {
    border-bottom-color: color-mix(in srgb, var(--cursor-accent) 64%, #000 26%);
  }
}

.studio-assist-generate-btn:hover:not(:disabled) {
  background: linear-gradient(180deg, var(--cursor-accent-hover) 0%, var(--cursor-accent) 46%, var(--cursor-accent) 100%);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn:hover:not(:disabled) {
    background: linear-gradient(180deg, color-mix(in srgb, var(--cursor-accent-hover) 92%, #fff 6%) 0%, color-mix(in srgb, var(--cursor-accent) 92%, transparent) 46%, color-mix(in srgb, var(--cursor-accent) 72%, #000 22%) 100%);
  }
}

.studio-assist-generate-btn:hover:not(:disabled) {
  box-shadow: inset 0 -2px 0 #00000038, 0 2px 4px #0000003d, 0 5px 12px var(--cursor-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn:hover:not(:disabled) {
    box-shadow: inset 0 -2px 0 #00000038, 0 2px 4px #0000003d, 0 5px 12px color-mix(in srgb, var(--cursor-accent) 18%, transparent);
  }
}

.studio-assist-generate-btn:focus-visible {
  outline: 2px solid var(--cursor-accent-hover);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-generate-btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--cursor-accent-hover) 70%, #fff 30%);
  }
}

.studio-assist-generate-btn:focus-visible {
  outline-offset: 2px;
}

.studio-assist-generate-label, .studio-assist-generate-cost {
  line-height: 1.1;
  display: block;
}

.studio-assist-approval-card {
  max-width: 34rem;
}

.studio-assist-approval-heading {
  align-items: flex-start;
  gap: .65rem;
  display: flex;
}

.studio-assist-approval-heading h3 {
  margin: .15rem 0 0;
  font-size: .95rem;
  font-weight: 650;
}

.studio-assist-approval-icon {
  color: #f59e0b;
  background: #f59e0b1a;
  border: 1px solid #f59e0b59;
  border-radius: .6rem;
  flex: none;
  place-items: center;
  width: 2rem;
  height: 2rem;
  display: grid;
}

.studio-assist-approval-summary, .studio-assist-approval-cost, .studio-assist-approval-status {
  color: var(--cursor-muted);
  margin: 0;
  font-size: .82rem;
  line-height: 1.45;
}

.studio-assist-approval-actions {
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: .55rem;
  display: grid;
}

.studio-assist-approval-actions button {
  border-radius: .7rem;
  justify-content: center;
  align-items: center;
  gap: .4rem;
  min-height: 2.6rem;
  display: inline-flex;
}

.studio-assist-approval-status.is-completed {
  color: #22c55e;
}

.studio-assist-approval-status.is-failed, .studio-assist-approval-status.is-denied {
  color: var(--cursor-danger, #ef4444);
}

.studio-assist-generate-label {
  font-size: .82rem;
  font-weight: 700;
}

.studio-assist-generate-cost {
  opacity: .9;
  margin-top: .2rem;
  font-size: .68rem;
  font-weight: 650;
}

.studio-assist-secondary-btn {
  opacity: .9;
}

.studio-assist-card-error {
  color: #fecaca;
  gap: .2rem;
  margin: 0 0 .55rem;
  font-size: .8rem;
  line-height: 1.35;
  display: grid;
}

.studio-assist-card-error strong {
  color: #fecaca;
  font-weight: 600;
}

.studio-assist-card-error p {
  color: #fecacae0;
  margin: 0;
  font-weight: 400;
}

.studio-assist-review-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
  gap: .65rem;
  margin: 0;
  display: grid;
}

.studio-assist-review-summary {
  gap: .55rem;
  margin: 0;
  display: grid;
}

.studio-assist-review-summary > div {
  grid-template-columns: minmax(0, 1fr);
  gap: .12rem;
  display: grid;
}

.studio-assist-review-summary dt {
  letter-spacing: 0;
  text-transform: none;
  opacity: .44;
  font-size: .64rem;
  font-weight: 500;
}

.studio-assist-review-summary dd {
  opacity: .82;
  margin: 0;
  font-size: .76rem;
  font-weight: 400;
  line-height: 1.4;
}

.studio-assist-review-section {
  gap: .25rem;
  padding-top: 0;
  display: grid;
}

.studio-assist-review-grid dt {
  letter-spacing: .04em;
  text-transform: uppercase;
  opacity: .7;
  align-items: center;
  gap: .4rem;
  font-size: .7rem;
  display: flex;
}

.studio-assist-review-grid dd {
  margin: .15rem 0 0;
  font-size: .875rem;
}

.studio-assist-field-mark {
  text-transform: none;
  letter-spacing: 0;
  opacity: .85;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  border-radius: 999px;
  padding: .05rem .4rem;
  font-size: .65rem;
}

.studio-assist-field-mark.is-inferred {
  opacity: .7;
}

.studio-assist-section-label {
  text-transform: uppercase;
  letter-spacing: .04em;
  opacity: .7;
  margin: 0 0 .35rem;
  font-size: .75rem;
}

.studio-assist-beats ol, .studio-assist-notes ul {
  margin: 0;
  padding-left: 1.1rem;
  font-size: .82rem;
  line-height: 1.4;
}

.studio-assist-notes {
  color: var(--color-cursor-text, #fff);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-notes {
    color: color-mix(in srgb, var(--color-cursor-text, #fff) 72%, transparent);
  }
}

.studio-assist-notes.is-warn {
  color: var(--color-cursor-text, #fff);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-assist-notes.is-warn {
    color: color-mix(in srgb, var(--color-cursor-text, #fff) 72%, transparent);
  }
}

.studio-assist-compiled pre {
  white-space: pre-wrap;
  max-height: 12rem;
  margin: .4rem 0 0;
  font-size: .75rem;
  overflow: auto;
}

.studio-polish .studio-preset-grid-panel {
  background: var(--studio-composer-glass-strong, var(--color-mos-composer, #07111f)) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-preset-grid-panel {
    background: var(--studio-composer-glass-strong, color-mix(in srgb, var(--color-mos-composer, #07111f) 48%, transparent)) !important;
  }
}

.studio-polish .studio-preset-grid-panel {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(14px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(14px));
  border-color: var(--studio-composer-glass-border, #ffffff1c) !important;
  box-shadow: var(--studio-composer-glass-shadow, 0 20px 48px #00000061, inset 0 1px 0 #ffffff14) !important;
}

.studio-polish .studio-preset-grid-card {
  background: var(--studio-composer-glass-muted, var(--color-mos-composer, #07111f)) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-preset-grid-card {
    background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--color-mos-composer, #07111f) 34%, transparent)) !important;
  }
}

.studio-polish .studio-preset-grid-card {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(140%) blur(10px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(140%) blur(10px));
  border-color: var(--studio-composer-glass-border, #ffffff1c) !important;
}

.studio-polish .studio-preset-grid-card:hover, .studio-polish .studio-preset-grid-card.is-active {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(12px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(12px));
}

.studio-polish .studio-preset-trigger {
  background: var(--studio-composer-glass-muted, var(--color-mos-composer, #07111f)) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-preset-trigger {
    background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--color-mos-composer, #07111f) 40%, transparent)) !important;
  }
}

.studio-polish .studio-preset-trigger {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(10px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(10px));
  border-color: var(--studio-composer-glass-border, #ffffff1c) !important;
}

.studio-polish .studio-preset-grid-close {
  background: var(--studio-composer-glass-muted, var(--color-mos-composer, #07111f)) !important;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-preset-grid-close {
    background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--color-mos-composer, #07111f) 36%, transparent)) !important;
  }
}

.studio-polish .studio-preset-grid-close {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(140%) blur(8px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(140%) blur(8px));
}

.studio-polish .studio-empty-logo-blur {
  z-index: 0;
  background: var(--color-mos-composer, #07111f);
  border: 0;
  border-radius: 999px;
  position: absolute;
  inset: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-polish .studio-empty-logo-blur {
    background: color-mix(in srgb, var(--color-mos-composer, #07111f) 78%, transparent);
  }
}

.studio-polish .studio-empty-logo-blur {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  pointer-events: none;
  box-shadow: 0 20px 46px #00000070, 0 8px 20px #00000052, 0 2px 6px #00000038;
}

[data-appearance="light"] .studio-polish .studio-empty-logo-blur {
  box-shadow: 0 6px 16px #00000014;
}

.studio-chat-row {
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: stretch;
  column-gap: .65rem;
  width: 100%;
  min-width: 0;
  display: grid;
}

.studio-chat-row.is-avatarless {
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-chat-row.is-avatarless.is-user {
  justify-content: flex-end;
}

.studio-chat-row.is-avatarless.is-assistant {
  justify-content: flex-start;
}

.studio-chat-row.is-avatarless .studio-chat-row-body {
  width: auto;
  max-width: var(--studio-chat-bubble-max, 90%);
  min-width: 0;
}

.studio-chat-row.is-avatarless .studio-chat-row-body:has(.studio-assist-card) {
  max-width: var(--studio-chat-bubble-max, 90%);
  width: min(100%, var(--studio-chat-bubble-max, 90%));
}

.studio-chat-row.is-avatarless .studio-chat-bubble {
  width: fit-content;
  max-width: 100%;
}

.studio-chat-row.is-user {
  grid-template-columns: minmax(0, 1fr) 34px;
}

.studio-chat-row.is-user .studio-chat-row-avatar {
  order: 2;
}

.studio-chat-row.is-user .studio-chat-row-body {
  order: 1;
}

.studio-chat-row-avatar {
  --studio-chat-rail: #ffffff38;
  --studio-chat-rail-w: 1.5px;
  --studio-chat-rail-curve: 12px;
  flex-direction: column;
  align-self: stretch;
  align-items: center;
  padding-top: 0;
  line-height: 0;
  display: flex;
  position: relative;
}

[data-appearance="light"] .studio-chat-row-avatar {
  --studio-chat-rail: #fff6;
}

.studio-chat-row-avatar:after {
  content: "";
  width: var(--studio-chat-rail-w);
  height: max(.35rem, calc(70% - 34px - var(--studio-chat-rail-curve) + 1px));
  background: var(--studio-chat-rail);
  pointer-events: none;
  border-radius: 999px 999px 0 0;
  flex: none;
  margin-top: -1px;
}

.studio-chat-row-avatar:before {
  content: "";
  top: calc(70% - var(--studio-chat-rail-curve));
  left: calc(50% - (var(--studio-chat-rail-w) / 2));
  width: calc(50% + .65rem + 2px);
  height: var(--studio-chat-rail-curve);
  box-sizing: border-box;
  border-left: var(--studio-chat-rail-w) solid var(--studio-chat-rail);
  border-bottom: var(--studio-chat-rail-w) solid var(--studio-chat-rail);
  border-bottom-left-radius: var(--studio-chat-rail-curve);
  pointer-events: none;
  position: absolute;
}

.studio-chat-row.is-user .studio-chat-row-avatar:before {
  left: auto;
  right: calc(50% - (var(--studio-chat-rail-w) / 2));
  border-left: none;
  border-right: var(--studio-chat-rail-w) solid var(--studio-chat-rail);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: var(--studio-chat-rail-curve);
}

.studio-chat-row.is-inline {
  align-items: center;
}

.studio-chat-row.is-inline .studio-chat-row-avatar {
  align-self: center;
}

.studio-chat-row.is-inline .studio-chat-row-avatar:after {
  display: none;
}

.studio-chat-row.is-inline .studio-chat-row-avatar:before {
  width: calc(.65rem + 3px);
  height: var(--studio-chat-rail-w);
  background: var(--studio-chat-rail);
  border: none;
  border-radius: 999px;
  top: 50%;
  left: calc(100% - 1px);
  transform: translateY(-50%);
}

.studio-chat-row.is-inline.is-user .studio-chat-row-avatar:before {
  background: var(--studio-chat-rail);
  border: none;
  left: auto;
  right: calc(100% - 1px);
  transform: translateY(-50%);
}

.studio-chat-row-body {
  width: 100%;
  min-width: 0;
}

.studio-chat-avatar {
  flex: none;
  width: 34px;
  height: 34px;
  display: inline-flex;
}

.studio-chat-avatar-glass {
  border-radius: 999px;
  place-items: center;
  width: 34px;
  height: 34px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.studio-chat-avatar-blur {
  z-index: 0;
  border: 1px solid var(--studio-composer-glass-border, #ffffff24);
  background: var(--color-mos-composer, #07111f);
  border-radius: 999px;
  position: absolute;
  inset: 0;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-chat-avatar-blur {
    background: color-mix(in srgb, var(--color-mos-composer, #07111f) 18%, transparent);
  }
}

.studio-chat-avatar-blur {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(6px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(6px));
  pointer-events: none;
  box-shadow: 0 8px 18px #00000057, 0 2px 6px #00000038, inset 0 1px #ffffff1a;
}

.studio-chat-avatar-glass img {
  z-index: 1;
  object-fit: contain;
  opacity: .88;
  filter: drop-shadow(0 2px 4px #0000002e);
  pointer-events: none;
  width: 22px;
  height: 22px;
  position: relative;
  transform: translate(-.5px, 1px);
}

[data-appearance="light"] .studio-chat-avatar-blur {
  box-shadow: 0 4px 10px #00000014, inset 0 1px #fff6;
}

[data-appearance="light"] .studio-chat-avatar-glass img {
  opacity: .72;
  filter: none;
}

.studio-chat-avatar-initials {
  border: 1px solid var(--studio-composer-glass-border, #ffffff29);
  background: var(--studio-composer-glass-strong, #0c1524);
  border-radius: 999px;
  place-items: center;
  width: 34px;
  height: 34px;
  display: grid;
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-chat-avatar-initials {
    background: color-mix(in srgb, var(--studio-composer-glass-strong, #0c1524) 72%, transparent);
  }
}

.studio-chat-avatar-initials {
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(6px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(6px));
  color: var(--color-cursor-text, #f4f7fb);
  letter-spacing: .04em;
  -webkit-user-select: none;
  user-select: none;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 8px 16px #00000047, inset 0 1px #ffffff1a;
}

[data-appearance="light"] .studio-chat-avatar-initials {
  color: var(--color-cursor-text, #122033);
  box-shadow: 0 3px 8px #00000014, inset 0 1px #ffffff73;
}

.studio-polish .studio-composer .cursor-composer-mention-editor {
  position: relative;
}

.studio-polish .studio-composer .cursor-composer-mention-editor:empty:before, .studio-polish .studio-composer .cursor-composer-box:focus-within .cursor-composer-mention-editor:empty:before {
  white-space: pre-wrap;
  content: attr(data-placeholder) !important;
  color: var(--color-cursor-text-bright, #fff) !important;
  -webkit-text-fill-color: var(--color-cursor-text-bright, #fff) !important;
  opacity: .38 !important;
  pointer-events: none !important;
  position: absolute !important;
  inset: 0 !important;
}

.studio-polish .studio-composer .cursor-composer-mention-editor:has( > br:only-child):before {
  white-space: pre-wrap;
  content: attr(data-placeholder) !important;
  color: var(--color-cursor-text-bright, #fff) !important;
  -webkit-text-fill-color: var(--color-cursor-text-bright, #fff) !important;
  opacity: .38 !important;
  pointer-events: none !important;
  position: absolute !important;
  inset: 0 !important;
}

.studio-polish .studio-composer .cursor-composer-mention-editor:has( > br:first-child:last-child):before {
  white-space: pre-wrap;
  content: attr(data-placeholder) !important;
  color: var(--color-cursor-text-bright, #fff) !important;
  -webkit-text-fill-color: var(--color-cursor-text-bright, #fff) !important;
  opacity: .38 !important;
  pointer-events: none !important;
  position: absolute !important;
  inset: 0 !important;
}

.studio-polish .studio-composer .cursor-composer-box:focus-within .cursor-composer-mention-editor:has( > br:only-child):before {
  white-space: pre-wrap;
  content: attr(data-placeholder) !important;
  color: var(--color-cursor-text-bright, #fff) !important;
  -webkit-text-fill-color: var(--color-cursor-text-bright, #fff) !important;
  opacity: .38 !important;
  pointer-events: none !important;
  position: absolute !important;
  inset: 0 !important;
}

.studio-polish .studio-composer .cursor-composer-box:focus-within .cursor-composer-mention-editor:has( > br:first-child:last-child):before {
  white-space: pre-wrap;
  content: attr(data-placeholder) !important;
  color: var(--color-cursor-text-bright, #fff) !important;
  -webkit-text-fill-color: var(--color-cursor-text-bright, #fff) !important;
  opacity: .38 !important;
  pointer-events: none !important;
  position: absolute !important;
  inset: 0 !important;
}

.studio-polish .studio-composer .cursor-composer-box.is-recording .cursor-composer-mention-editor[data-listening="append"]:after, .studio-polish .studio-composer .cursor-composer-box.is-transcribing .cursor-composer-mention-editor[data-listening="append"]:after {
  content: attr(data-listening-label);
  color: var(--color-cursor-text-bright, #fff);
  -webkit-text-fill-color: var(--color-cursor-text-bright, #fff);
  opacity: .38;
  pointer-events: none;
  white-space: pre-wrap;
  font-weight: 500;
}

[data-appearance="light"] .studio-polish .studio-composer .cursor-composer-mention-editor:empty:before, [data-appearance="light"] .studio-polish .studio-composer .cursor-composer-box:focus-within .cursor-composer-mention-editor:empty:before {
  color: var(--color-cursor-text, #0f172a) !important;
  -webkit-text-fill-color: var(--color-cursor-text, #0f172a) !important;
  opacity: .4 !important;
}

[data-appearance="light"] .studio-polish .studio-composer .cursor-composer-mention-editor:has( > br:only-child):before {
  color: var(--color-cursor-text, #0f172a) !important;
  -webkit-text-fill-color: var(--color-cursor-text, #0f172a) !important;
  opacity: .4 !important;
}

[data-appearance="light"] .studio-polish .studio-composer .cursor-composer-mention-editor:has( > br:first-child:last-child):before {
  color: var(--color-cursor-text, #0f172a) !important;
  -webkit-text-fill-color: var(--color-cursor-text, #0f172a) !important;
  opacity: .4 !important;
}

[data-appearance="light"] .studio-polish .studio-composer .cursor-composer-box:focus-within .cursor-composer-mention-editor:has( > br:only-child):before {
  color: var(--color-cursor-text, #0f172a) !important;
  -webkit-text-fill-color: var(--color-cursor-text, #0f172a) !important;
  opacity: .4 !important;
}

[data-appearance="light"] .studio-polish .studio-composer .cursor-composer-box:focus-within .cursor-composer-mention-editor:has( > br:first-child:last-child):before {
  color: var(--color-cursor-text, #0f172a) !important;
  -webkit-text-fill-color: var(--color-cursor-text, #0f172a) !important;
  opacity: .4 !important;
}

[data-appearance="light"] .studio-polish .studio-composer .cursor-composer-box.is-recording .cursor-composer-mention-editor[data-listening="append"]:after, [data-appearance="light"] .studio-polish .studio-composer .cursor-composer-box.is-transcribing .cursor-composer-mention-editor[data-listening="append"]:after {
  color: var(--color-cursor-text, #0f172a);
  -webkit-text-fill-color: var(--color-cursor-text, #0f172a);
  opacity: .4;
}

.studio-settings-status {
  color: var(--cursor-accent);
}

@media (hover: hover) {
  [data-appearance="light"] .suggestion-chip:hover {
    border-color: var(--cursor-accent-border);
    color: var(--color-cursor-text);
    background: #00000012;
  }

  [data-appearance="light"] .cursor-icon-btn:hover:not(:disabled), [data-appearance="light"] .cursor-toolbar-icon:hover {
    color: var(--color-cursor-text);
    background: #00000014;
  }

  [data-appearance="light"] .desk-mobile-tab:hover {
    background: #00000012;
  }

  [data-appearance="light"] .cursor-tab:hover, [data-appearance="light"] .cursor-agent-chat-tab:hover {
    background: #0000000f;
  }

  [data-appearance="light"] .cursor-submit-revert-popover {
    background: var(--mos-surface);
    box-shadow: 0 4px 6px #0000000f, 0 16px 36px #00000024;
  }

  [data-appearance="light"] .cursor-submit-revert-popover-item:hover {
    background: #00000012;
  }
}

[data-appearance="light"] .cursor-submit-revert-popover {
  background: var(--mos-surface);
  border-color: var(--color-cursor-border);
}

:root {
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  --mos-bg: #111;
  --mos-sidebar: #0e0e0e;
  --mos-panel: #191919;
  --mos-composer: #141414;
  --mos-surface: #222;
  --mos-border: #ffffff1a;
  --mos-border-soft: #ffffff0f;
  --mos-border-subtle: #ffffff14;
  --mos-text: #eee;
  --mos-text-soft: #eeeeeeeb;
  --mos-text-bright: #eee;
  --mos-muted: #eeeeee9e;
  --mos-faint: #eeeeee73;
  --mos-accent: #25da67;
  --mos-accent-hover: #4ae07f;
  --mos-accent-fg: #0a2a14;
  --mos-secondary: #283d2e;
  --mos-hover: #2a2a2a;
  --mos-active: #333;
  --mos-success: #25da67;
  --mos-error: #e25050;
  --mos-ai-glow: none;
  --mos-ai-glow-strong: none;
  --cursor-sidebar: var(--mos-sidebar);
  --cursor-overlay-subtle: #ffffff0d;
  --cursor-overlay-hover: #ffffff14;
  --cursor-overlay-muted: #ffffff08;
  --font-onest: var(--font-geist-sans);
  --font-bricolage: var(--font-geist-sans);
  --font-jetbrains: var(--font-geist-mono);
  --font-cursor: var(--font-geist-sans), ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --desk-composer-max: 680px;
  --desk-chat-thread-max: var(--desk-composer-max);
  --desk-mobile-head-h: 44px;
  --desk-mobile-tab-h: 56px;
  --desk-mobile-inset-x: 12px;
  --desk-mobile-inset-y: 8px;
  --desk-mobile-pane-ease: cubic-bezier(.22, 1, .36, 1);
  --desk-composer-radius: 16px;
  --desk-gap-chat-turn: 18px;
  --studio-focus-ring: inset 0 0 0 1px var(--cursor-accent, var(--mos-accent));
}

@supports (color: color-mix(in lab, red, red)) {
  :root {
    --studio-focus-ring: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 55%, transparent);
  }
}

:root {
  --background: var(--mos-bg);
  --foreground: var(--mos-text);
  --card: var(--mos-panel);
  --card-foreground: var(--mos-text);
  --popover: var(--mos-panel);
  --popover-foreground: var(--mos-text);
  --primary: var(--mos-accent);
  --primary-foreground: var(--mos-accent-fg, #fff);
  --secondary: var(--mos-secondary, var(--mos-hover));
  --secondary-foreground: var(--mos-text);
  --muted: var(--mos-surface);
  --muted-foreground: var(--mos-muted);
  --accent: var(--mos-hover);
  --accent-foreground: var(--mos-text);
  --destructive: var(--mos-error);
  --border: var(--mos-border);
  --input: var(--mos-border);
  --ring: var(--mos-accent);
  --radius: var(--studio-r-xl);
}

[data-appearance="light"] {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  --primary-foreground: var(--mos-accent-fg, #fff);
}

html, body {
  overscroll-behavior: none;
  scroll-behavior: auto;
  touch-action: pan-x pan-y;
  -webkit-tap-highlight-color: transparent;
  background: var(--mos-bg);
  height: 100%;
  color: var(--mos-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizelegibility;
  font-feature-settings: "rlig" 1, "calt" 1;
  letter-spacing: -.011em;
  margin: 0;
  font-size: 14px;
  overflow: hidden;
}

@media (pointer: coarse) {
  html, body {
    overscroll-behavior: none;
    text-rendering: auto;
  }
}

body {
  font-family: var(--font-geist-sans), ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 400;
}

a, button, [role="button"], input, select, textarea, label, summary {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

::selection {
  background: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  ::selection {
    background: color-mix(in srgb, var(--mos-accent) 44%, var(--mos-hover));
  }
}

::selection {
  color: var(--mos-text-bright);
  text-shadow: none;
}

::-moz-selection {
  background: var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  ::-moz-selection {
    background: color-mix(in srgb, var(--mos-accent) 44%, var(--mos-hover));
  }
}

::-moz-selection {
  color: var(--mos-text-bright);
  text-shadow: none;
}

.mos-toast {
  animation: .2s ease-out mos-toast-in;
}

@keyframes mos-toast-in {
  from {
    opacity: 0;
    transform: translate(-50%, 8px);
  }

  to {
    opacity: 1;
    transform: translate(-50%);
  }
}

[data-sonner-toaster] {
  --normal-bg: var(--mos-plate, var(--mos-panel, #0a1018));
  --normal-border: var(--color-cursor-border-soft, var(--mos-border-soft, #94a3b81a));
  --normal-text: var(--color-cursor-text-bright, var(--mos-text-bright, #fff));
  --success-bg: var(--normal-bg);
  --success-border: var(--normal-border);
  --success-text: var(--normal-text);
  --error-bg: var(--normal-bg);
  --error-border: var(--normal-border);
  --error-text: var(--normal-text);
  --info-bg: var(--normal-bg);
  --info-border: var(--normal-border);
  --info-text: var(--normal-text);
  --warning-bg: var(--normal-bg);
  --warning-border: var(--normal-border);
  --warning-text: var(--normal-text);
  --toast-status: var(--cursor-accent, var(--mos-accent, #22c55e));
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  pointer-events: none;
  z-index: 2147483000 !important;
  width: auto !important;
}

[data-sonner-toaster][data-x-position="right"] {
  left: auto !important;
  right: 14px !important;
}

[data-sonner-toaster][data-x-position="center"] {
  transform: translateX(-50%);
  width: min(360px, 100vw - 24px) !important;
  left: 50% !important;
  right: auto !important;
}

[data-sonner-toaster][data-y-position="bottom"] {
  bottom: var(--offset-bottom, var(--mobile-offset-bottom, 0px)) !important;
}

[data-sonner-toaster][data-y-position="top"] {
  top: var(--offset-top, var(--mobile-offset-top, 0px)) !important;
}

[data-sonner-toaster] [data-sonner-toast] {
  pointer-events: auto;
  -webkit-backdrop-filter: none;
  min-height: 40px;
  position: relative;
  overflow: hidden;
  border-radius: var(--studio-r-xl, 12px) !important;
  border: 1px solid var(--normal-border) !important;
  background: var(--normal-bg) !important;
  width: min(300px, 100vw - 28px) !important;
  max-width: min(300px, 100vw - 28px) !important;
  color: var(--normal-text) !important;
  font-size: var(--studio-fs-md, 14px) !important;
  align-items: flex-start !important;
  gap: 0 !important;
  padding: 10px 14px 10px 16px !important;
  line-height: 1.35 !important;
  box-shadow: 0 10px 28px #00000057, 0 2px 8px #0000002e !important;
}

[data-sonner-toaster] [data-sonner-toast]:before {
  content: "";
  background: var(--toast-status);
  opacity: .9;
  border-radius: 0 3px 3px 0;
  width: 3px;
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 0;
}

[data-sonner-toaster][data-x-position="center"] [data-sonner-toast] {
  margin-inline: auto;
  width: 100% !important;
  max-width: 100% !important;
}

[data-sonner-toaster] [data-icon], [data-sonner-toaster] [data-close-button], .studio-sonner-close {
  display: none !important;
}

.studio-sonner-toast {
  --border-radius: var(--studio-r-xl, 12px);
}

.studio-sonner-title {
  font-size: var(--studio-fs-md, 14px) !important;
  font-weight: var(--studio-w-semibold, 600) !important;
  letter-spacing: -.01em !important;
  color: inherit !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

.studio-sonner-description {
  font-size: var(--studio-fs-sm, 12px) !important;
  font-weight: var(--studio-w-medium, 500) !important;
  opacity: .7 !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  margin: 2px 0 0 !important;
  line-height: 1.35 !important;
}

.studio-sonner-success {
  --toast-status: var(--cursor-accent, var(--mos-success, #22c55e));
}

.studio-sonner-info {
  --toast-status: var(--cursor-accent, #7dd3fc);
}

@supports (color: color-mix(in lab, red, red)) {
  .studio-sonner-info {
    --toast-status: color-mix(in srgb, var(--cursor-accent, #7dd3fc) 70%, #93c5fd);
  }
}

.studio-sonner-error {
  --toast-status: var(--mos-error, #f87171);
}

.studio-sonner-warning {
  --toast-status: #eab308;
}

[data-appearance="light"] [data-sonner-toaster] {
  --normal-bg: var(--mos-plate, var(--mos-panel));
  --normal-border: var(--color-cursor-border-soft, #0f172a1a);
  --normal-text: var(--color-cursor-text-bright, #0f172a);
  --success-bg: var(--normal-bg);
  --success-border: var(--normal-border);
  --success-text: var(--normal-text);
  --error-bg: var(--normal-bg);
  --error-border: var(--normal-border);
  --error-text: var(--normal-text);
  --info-bg: var(--normal-bg);
  --info-border: var(--normal-border);
  --info-text: var(--normal-text);
  --warning-bg: var(--normal-bg);
  --warning-border: var(--normal-border);
  --warning-text: var(--normal-text);
}

[data-appearance="light"] [data-sonner-toaster] [data-sonner-toast] {
  box-shadow: 0 10px 24px #0000001f, 0 2px 6px #0000000f !important;
}

@media (max-width: 899px) {
  [data-sonner-toaster] {
    --studio-toast-top: var(--studio-mobile-top-chrome, 48px);
  }

  [data-sonner-toaster][data-y-position="top"] {
    top: var(--mobile-offset-top, var(--offset-top, 0px)) !important;
  }

  [data-sonner-toaster][data-x-position="center"] {
    left: max(12px, env(safe-area-inset-left, 0px)) !important;
    right: max(12px, env(safe-area-inset-right, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
  }

  [data-sonner-toaster] [data-sonner-toast] {
    min-height: 42px;
    border-radius: var(--studio-r-2xl, 14px) !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 16px 12px 18px !important;
    box-shadow: 0 12px 28px #00000052, 0 2px 8px #00000029 !important;
  }

  .studio-sonner-title {
    font-size: var(--studio-fs-lg, 16px) !important;
  }

  .studio-sonner-description {
    font-size: var(--studio-fs-sm, 12px) !important;
  }
}

@media (min-width: 900px) {
  [data-sonner-toaster] {
    --studio-toast-top: 52px;
  }
}

@keyframes mos-brand-halo-outer {
  0%, 100% {
    opacity: .32;
    transform: scale(.9);
  }

  50% {
    opacity: .72;
    transform: scale(1.05);
  }
}

@keyframes mos-brand-halo-inner {
  0%, 100% {
    opacity: .2;
    transform: scale(.95);
  }

  50% {
    opacity: .5;
    transform: scale(1.02);
  }
}

@keyframes mos-brand-logo-breathe {
  0%, 100% {
    filter: drop-shadow(0 0 10px color-mix(in srgb, var(--mos-accent) 16%, transparent))
      drop-shadow(0 2px 14px #00000059)
      brightness(1);
    transform: scale(1);
  }

  50% {
    filter: drop-shadow(0 0 22px color-mix(in srgb, var(--mos-accent) 34%, transparent))
      drop-shadow(0 4px 20px #0006)
      brightness(1.05);
    transform: scale(1.012);
  }
}

@keyframes mos-slim-progress {
  0% {
    transform: translateX(-130%);
  }

  100% {
    transform: translateX(330%);
  }
}

.mos-brand-mark--ambient:before, .mos-brand-mark--ambient:after {
  content: "";
  pointer-events: none;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
}

.mos-brand-mark--ambient:before {
  background: radial-gradient(circle,
    var(--mos-accent) 0%,
    var(--mos-accent) 42%,
    transparent 72%);
  width: 118%;
  height: 118%;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-brand-mark--ambient:before {
    background: radial-gradient(circle,
    color-mix(in srgb, var(--mos-accent) 28%, transparent) 0%,
    color-mix(in srgb, var(--mos-accent) 8%, transparent) 42%,
    transparent 72%);
  }
}

.mos-brand-mark--ambient:before {
  filter: blur(10px);
  animation: 3.8s cubic-bezier(.45, 0, .55, 1) infinite mos-brand-halo-outer;
}

.mos-brand-mark--ambient:after {
  background: radial-gradient(circle,
    var(--mos-accent) 0%,
    transparent 68%);
  width: 72%;
  height: 72%;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-brand-mark--ambient:after {
    background: radial-gradient(circle,
    color-mix(in srgb, var(--mos-accent) 22%, transparent) 0%,
    transparent 68%);
  }
}

.mos-brand-mark--ambient:after {
  filter: blur(4px);
  animation: 3.8s cubic-bezier(.45, 0, .55, 1) .55s infinite mos-brand-halo-inner;
}

.mos-brand-logo--breathe {
  animation: 3.8s cubic-bezier(.45, 0, .55, 1) infinite mos-brand-logo-breathe;
}

@media (prefers-reduced-motion: reduce) {
  .mos-brand-mark--ambient:before, .mos-brand-mark--ambient:after, .mos-brand-logo--breathe {
    animation: none;
  }

  .mos-brand-mark--ambient:before {
    opacity: .45;
    transform: scale(1);
  }

  .mos-brand-mark--ambient:after {
    opacity: .28;
    transform: scale(1);
  }

  .mos-brand-logo--breathe {
    filter: drop-shadow(0 0 14px var(--mos-accent));
  }

  @supports (color: color-mix(in lab, red, red)) {
    .mos-brand-logo--breathe {
      filter: drop-shadow(0 0 14px color-mix(in srgb, var(--mos-accent) 22%, transparent));
    }
  }
}

.mos-slim-progress-track {
  box-shadow: inset 0 0 0 1px var(--mos-accent);
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-slim-progress-track {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--mos-accent) 12%, transparent);
  }
}

.mos-slim-progress {
  box-shadow: 0 0 10px var(--mos-accent);
  animation: 1.15s ease-in-out infinite mos-slim-progress;
}

@supports (color: color-mix(in lab, red, red)) {
  .mos-slim-progress {
    box-shadow: 0 0 10px color-mix(in srgb, var(--mos-accent) 35%, transparent);
  }
}

.mos-brand-logo {
  opacity: 0;
  transition: opacity .22s ease-out;
}

.mos-brand-logo.is-loaded {
  opacity: 1;
}

[data-appearance="light"] .mos-brand-logo {
  filter: invert();
}

.cursor-sidebar-brand-logo-img {
  object-fit: contain;
  width: 16px;
  height: 16px;
  display: block;
}

.ys-boot-overlay {
  z-index: 2147483000;
  background: var(--mos-panel);
  position: fixed;
  inset: 0;
}

.ys-boot {
  box-sizing: border-box;
  background: var(--mos-panel);
  color: #0f172a;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 100dvh;
  margin: 0;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.ys-boot-overlay .ys-boot {
  height: auto;
  min-height: 0;
  position: absolute;
  inset: 0;
}

.ys-boot-stack {
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
  width: max-content;
  max-width: calc(100vw - 48px);
  padding: 0 24px;
  display: flex;
}

.ys-updating-overlay {
  z-index: 5;
  box-sizing: border-box;
  background: var(--mos-page);
  color: var(--mos-text, #12141a);
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  justify-content: center;
  align-items: center;
  padding: 32px 24px;
  display: flex;
  position: absolute;
  inset: 0;
}

.ys-updating-card {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  max-width: 22rem;
  display: flex;
}

.ys-updating-mark {
  object-fit: contain;
  width: 48px;
  height: 48px;
  display: none;
}

html:not([data-appearance="dark"]) .ys-updating-mark--on-light, html[data-appearance="light"] .ys-updating-mark--on-light {
  filter: invert();
  display: block;
}

html[data-appearance="dark"] .ys-updating-mark--on-dark {
  display: block;
}

html[data-appearance="dark"] .ys-updating-mark--on-light {
  display: none;
}

.ys-updating-card h1 {
  letter-spacing: -.02em;
  color: var(--mos-text, #12141a);
  margin: 8px 0 0;
  font-size: 1.125rem;
  font-weight: 650;
  line-height: 1.3;
}

.ys-updating-card p {
  color: var(--mos-text-soft, var(--mos-text, #12141a));
  margin: 0;
  font-size: .9375rem;
  font-weight: 500;
  line-height: 1.45;
}

@supports (color: color-mix(in lab, red, red)) {
  .ys-updating-card p {
    color: var(--mos-text-soft, color-mix(in srgb, var(--mos-text, #12141a) 68%, transparent));
  }
}

.ys-updating-bar {
  background: var(--mos-plate-strong);
  border-radius: 999px;
  width: 100%;
  max-width: 220px;
  height: 8px;
  margin-top: 2px;
  overflow: hidden;
}

.ys-updating-bar-fill {
  background: var(--mos-accent, #c9a227);
  border-radius: 999px;
  width: 38%;
  height: 100%;
  animation: 1.7s ease-in-out infinite ys-updating-bar-slide;
  display: block;
}

@keyframes ys-updating-bar-slide {
  0% {
    transform: translateX(-130%);
  }

  100% {
    transform: translateX(360%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .ys-updating-bar-fill {
    width: 42%;
    animation: none;
  }
}

.ys-ptr {
  top: env(safe-area-inset-top, 0px);
  z-index: 2147482500;
  pointer-events: none;
  justify-content: center;
  display: flex;
  position: fixed;
  left: 0;
  right: 0;
}

.ys-ptr-puck {
  will-change: transform, opacity;
  background: #fff;
  border: 0;
  border-radius: 999px;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-top: -44px;
  padding: 0;
  transition: opacity .12s;
  display: grid;
  box-shadow: 0 6px 18px #0000002e, 0 1px 4px #0000001a;
}

.ys-ptr-puck.is-pulling {
  transition: none;
}

.ys-ptr-mark {
  object-fit: contain;
  filter: invert();
  will-change: transform;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  animation: none;
  display: block;
}

.ys-ptr-puck.is-refreshing .ys-ptr-mark {
  animation: .75s linear infinite ys-ptr-spin;
}

@keyframes ys-ptr-spin {
  from {
    transform: rotate(var(--ys-ptr-spin, 0deg));
  }

  to {
    transform: rotate(calc(var(--ys-ptr-spin, 0deg) + 360deg));
  }
}

:where(input, textarea, select, button, [role="button"], [role="dialog"]):focus, :where(input, textarea, select, button, [role="button"], [role="dialog"]):focus-visible {
  outline: none;
}

@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-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@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
}

@property --tw-contain-size {
  syntax: "*";
  inherits: false
}

@property --tw-contain-layout {
  syntax: "*";
  inherits: false
}

@property --tw-contain-paint {
  syntax: "*";
  inherits: false
}

@property --tw-contain-style {
  syntax: "*";
  inherits: false
}

@property --tw-space-x-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}

/* [project]/src/studio/components/admin-studio-ops-settings.css [app-client] (css) */
.studio-ops-settings {
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 16px;
}

.studio-ops-settings-card {
  width: 100%;
  max-width: 360px;
}

.studio-ops-settings-card .studio-chrome-settings-row.is-rich:last-child {
  border-bottom: 0;
}

/* [project]/src/studio/components/admin-studio-ops.css [app-client] (css) */
.studio-admin-body.is-ops-fill {
  flex: 1 1 0;
  min-height: 0;
  padding: 0;
  display: block;
  position: relative;
  overflow: hidden;
}

.studio-admin-ops-fill {
  background: var(--mos-page, var(--mos-panel));
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  display: flex;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-admin-ops-fill > .studio-ops-shell {
  flex-direction: column;
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-shell.has-peer {
  flex-direction: row;
  align-items: stretch;
}

.studio-ops-main-col {
  flex-direction: column;
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-main-col > .studio-ops-subhead {
  flex: none;
}

.studio-ops-main-col > .studio-ops-main-body {
  flex-direction: column;
  flex: 1 1 0;
  min-height: 0;
  padding: 0;
  display: flex;
  overflow: auto;
}

.studio-ops-main-col > .studio-ops-main-body.is-ops-chats {
  overflow: hidden;
}

.studio-ops-chats {
  flex: 1 1 0;
  grid-template-columns: minmax(0, 1fr);
  min-height: 0;
  display: grid;
  position: relative;
  overflow: hidden;
}

.studio-ops-chats.is-rail-layout, .studio-ops-chats.is-rail-layout.has-selected {
  grid-template-columns: minmax(0, 1fr);
}

.studio-ops-rail-sidebar {
  flex: auto;
  min-height: 0;
}

.studio-ops-rail-sidebar .cursor-panel-search {
  align-items: center;
  gap: 10px;
  padding-right: 8px;
}

.studio-ops-rail-sidebar .cursor-panel-search-end {
  flex-shrink: 0;
  justify-content: center;
  align-self: center;
  align-items: center;
  height: 100%;
  margin-left: 2px;
  padding-left: 10px;
  display: inline-flex;
}

.studio-ops-rail-sidebar .cursor-panel-search-end:before {
  height: 14px;
  margin-right: 10px;
}

.studio-ops-start-end {
  justify-content: center;
  align-items: center;
  height: 100%;
  display: inline-flex;
}

.studio-ops-start-end .desk-explorer-type-filter-trigger {
  white-space: nowrap;
  align-items: center;
  gap: 5px;
  height: 100%;
  line-height: 1;
  display: inline-flex;
}

.studio-ops-start-form--docked.studio-ops-start-card {
  border: 1px solid
    color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  background: color-mix(in srgb,
    var(--mos-surface, var(--mos-plate)) 58%,
    transparent);
  box-shadow: inset 0 1px 0
      color-mix(in srgb, var(--mos-text-bright, #fff) 7%, transparent),
    0 1px 2px #00000014;
  border-radius: 18px;
  flex-direction: column;
  flex: none;
  gap: 8px;
  margin: 10px 8px 8px;
  padding: 12px 12px 10px;
  display: flex;
}

[data-appearance="light"] .studio-ops-start-form--docked.studio-ops-start-card {
  box-shadow: inset 0 1px #ffffffb8, 0 1px 2px #0f172a0d, 0 3px 8px #0f172a0a;
}

.studio-ops-start-form {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.studio-ops-start-form input, .studio-ops-start-form textarea {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--color-cursor-border));
  background: var(--mos-page, var(--mos-panel));
  width: 100%;
  color: inherit;
  font: inherit;
  resize: vertical;
  border-radius: 8px;
  padding: 7px 10px;
  font-size: 12px;
}

.studio-ops-start-hint {
  color: var(--color-cursor-muted, #888);
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
}

.studio-ops-start-send {
  border: 1px solid
    color-mix(in srgb,
      var(--cursor-accent, #22c55e) 45%,
      var(--color-cursor-border-soft));
  background: color-mix(in srgb,
    var(--cursor-accent, #22c55e) 14%,
    var(--mos-page, var(--mos-panel)));
  color: inherit;
  cursor: pointer;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.studio-ops-start-send:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.studio-ops-rail-list {
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 8px;
  list-style: none;
  display: flex;
}

.studio-ops-rail-list > li {
  margin: 0;
}

.studio-ops-chat-card {
  border: 1px solid var(--color-cursor-border-soft, var(--color-cursor-border));
  background: var(--mos-page, var(--mos-panel));
  width: 100%;
  min-width: 0;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  border-radius: 12px;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 10px;
  display: flex;
}

.studio-ops-chat-card:hover {
  background: color-mix(in srgb,
    var(--cursor-accent) 6%,
    var(--mos-page, var(--mos-panel)));
  border-color: color-mix(in srgb,
    var(--cursor-accent) 28%,
    var(--color-cursor-border-soft));
}

.studio-ops-chat-card.is-active {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 55%,
    var(--color-cursor-border));
  background: color-mix(in srgb,
    var(--cursor-accent) 10%,
    var(--mos-page, var(--mos-panel)));
  box-shadow: 0 0 0 1px
    color-mix(in srgb, var(--cursor-accent) 18%, transparent);
}

.studio-ops-chat-card-avatar .studio-profile-avatar.is-md {
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
}

.studio-ops-chat-card-avatar .studio-profile-avatar.is-md .studio-profile-avatar-fallback {
  font-size: 11px;
}

.studio-ops-chat-card-body {
  flex-direction: column;
  flex: auto;
  gap: 3px;
  min-width: 0;
  display: flex;
}

.studio-ops-chat-card-top {
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-ops-chat-card-top strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.25;
  overflow: hidden;
}

.studio-ops-chat-card-top time {
  color: var(--color-cursor-muted);
  font-variant-numeric: tabular-nums;
  flex: none;
  font-size: 10.5px;
  line-height: 1.2;
}

.studio-ops-chat-card-chips {
  flex-wrap: wrap;
  gap: 3px;
  min-width: 0;
  display: flex;
}

.studio-ops-tag {
  white-space: nowrap;
  color: #fff;
  background: #64748b;
  border-radius: 999px;
  align-items: center;
  gap: 2px;
  max-width: 100%;
  height: 15px;
  padding: 0 6px;
  font-size: 9px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-ops-tag > span {
  text-overflow: ellipsis;
  overflow: hidden;
}

.studio-ops-tag.is-sophie {
  background: #7c3aed;
}

.studio-ops-tag.is-working {
  background: #6d28d9;
}

.studio-ops-tag.is-typing {
  background: #0284c7;
  gap: 4px;
}

.studio-ops-typing-dots {
  flex: none;
  align-items: center;
  gap: 2px;
  display: inline-flex;
}

.studio-ops-typing-dots > i {
  background: currentColor;
  border-radius: 999px;
  width: 3px;
  height: 3px;
  animation: 1s ease-in-out infinite studio-ops-typing-bounce;
  display: block;
}

.studio-ops-typing-dots > i:nth-child(2) {
  animation-delay: .15s;
}

.studio-ops-typing-dots > i:nth-child(3) {
  animation-delay: .3s;
}

@keyframes studio-ops-typing-bounce {
  0%, 60%, 100% {
    opacity: .35;
    transform: translateY(0);
  }

  30% {
    opacity: 1;
    transform: translateY(-1.5px);
  }
}

.studio-ops-tag.is-agent {
  background: #15803d;
}

.studio-ops-tag.is-human {
  background: #dc2626;
}

.studio-ops-tag.is-watch {
  background: #475569;
}

.studio-ops-tag.is-new {
  background: #0e7490;
}

.studio-ops-tag.is-intake {
  background: #0369a1;
}

.studio-ops-tag.is-inbound {
  background: #0284c7;
}

.studio-ops-tag.is-outbound {
  background: #4f46e5;
}

.studio-ops-tag.is-signup {
  background: #2563eb;
}

.studio-ops-tag.is-verified {
  background: #0d9488;
}

.studio-ops-tag.is-awaiting_payment, .studio-ops-tag.is-await {
  background: #c2410c;
}

.studio-ops-tag.is-waiting_client {
  color: #fff7ed;
  background: #b45309;
}

.studio-ops-tag.is-paid {
  background: #047857;
}

.studio-ops-tag.is-course_unlocked {
  background: #0f766e;
}

.studio-ops-tag.is-topped_up {
  background: #059669;
}

.studio-ops-tag.is-done {
  background: #4d7c0f;
}

.studio-ops-tag.is-cold {
  background: #64748b;
}

.studio-ops-tag.is-hot {
  background: #e11d48;
}

.studio-ops-tag.is-escalated {
  background: #dc2626;
}

.studio-ops-tag.is-approval {
  background: #b45309;
}

.studio-ops-tag.is-owner {
  background: #1d4ed8;
}

.studio-ops-tag.is-friends {
  background: #0d9488;
}

.studio-ops-tag.is-neutral {
  color: #0f172a;
  background: #94a3b8;
}

.studio-ops-chat-card-preview {
  min-width: 0;
  color: var(--color-cursor-muted);
  align-items: center;
  gap: 6px;
  font-size: 12px;
  line-height: 1.3;
  display: flex;
}

.studio-ops-chat-card-preview > span:first-child {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-ops-chat-card-dot {
  background: var(--cursor-accent);
  border-radius: 999px;
  flex: none;
  width: 7px;
  height: 7px;
}

.studio-ops-chat-card-followup {
  color: var(--color-cursor-muted);
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-top: 2px;
  font-size: 11px;
  line-height: 1.3;
  display: block;
  overflow: hidden;
}

.studio-ops-chat-card-avatar {
  flex: none;
  position: relative;
}

.studio-ops-avatar-wrap {
  flex: none;
  display: inline-flex;
  position: relative;
}

.studio-ops-presence-dot {
  border: 2px solid var(--mos-page, var(--mos-panel));
  background: var(--mos-success, #22c55e);
  border-radius: 999px;
  width: 9px;
  height: 9px;
  position: absolute;
  bottom: -1px;
  right: -1px;
}

.studio-ops-presence-dot.is-typing {
  background: var(--mos-warning, #f59e0b);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--mos-warning, #f59e0b) 40%, transparent);
}

.studio-ops-presence-dot.is-online {
  background: var(--mos-success, #22c55e);
}

.studio-ops-unanswered {
  background: var(--mos-danger, #dc2626);
  min-width: 16px;
  height: 16px;
  color: var(--cursor-on-accent);
  text-align: center;
  border: 2px solid var(--mos-page, var(--mos-panel));
  border-radius: 999px;
  padding: 0 4px;
  font-size: 9px;
  font-weight: 700;
  line-height: 16px;
  position: absolute;
  top: -4px;
  right: -4px;
}

.studio-ops-filter-pills {
  --cursor-h-scroll-fade-pad: 2px;
  --cursor-h-scroll-fade-gap: 0px;
  box-sizing: border-box;
  scrollbar-width: none;
  -ms-overflow-style: none;
  border-bottom: 1px solid
    var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  min-height: 36px;
  padding: 7px 6px 7px 2px;
  display: flex;
  overflow: auto hidden;
}

.studio-ops-filter-pills::-webkit-scrollbar {
  display: none;
}

.studio-ops-filter-pill {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-raised, var(--mos-surface));
  height: 22px;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  white-space: nowrap;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 4px;
  padding: 0 8px;
  font-size: 10.5px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-ops-filter-pill em {
  color: var(--color-cursor-muted);
  font-style: normal;
}

.studio-ops-filter-pill.is-active {
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 46%,
    var(--mos-border));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 12%,
    var(--cursor-surface-raised, var(--mos-surface)));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-ops-filter-pill.is-active em {
  color: inherit;
  opacity: .72;
}

.studio-ops-kill-banner {
  background: color-mix(in srgb, var(--mos-danger, #dc2626) 16%, var(--mos-page));
  color: var(--mos-danger, #991b1b);
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 600;
}

.studio-ops-babysit-bar, .studio-ops-editor, .studio-ops-board {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
}

.studio-ops-babysit-toggle {
  align-items: center;
  gap: 8px;
  font-size: 12px;
  display: flex;
}

.studio-ops-babysit-draft, .studio-ops-board-list, .studio-ops-activity-list, .studio-ops-media-list {
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-ops-babysit-draft p, .studio-ops-activity-list p {
  white-space: pre-wrap;
  margin: 0;
  font-size: 12px;
}

.studio-ops-babysit-actions, .studio-ops-approval-row {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  display: flex;
}

.studio-ops-board-head {
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.studio-ops-board-list button, .studio-ops-approval-row > button {
  text-align: left;
  width: 100%;
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 6px 0;
  display: flex;
}

.studio-ops-editor textarea, .studio-ops-editor input {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page);
  width: 100%;
  color: inherit;
  font: inherit;
  border-radius: 8px;
  padding: 8px;
  font-size: 12px;
}

.studio-ops-chat-main-peer .studio-ops-avatar-wrap.is-head .studio-profile-avatar.is-md {
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
}

.studio-ops-chat-main-peer .studio-ops-avatar-wrap.is-head .studio-profile-avatar.is-md .studio-profile-avatar-fallback {
  font-size: 11px;
}

.studio-ops-chat-main-peer .studio-profile-avatar.is-sm {
  width: 22px;
  min-width: 22px;
  height: 22px;
  min-height: 22px;
}

.studio-ops-chat-main-peer-copy {
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-chat-main-peer-title {
  white-space: nowrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-wa-thread {
  flex-direction: column;
  flex: 1 1 0;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-wa-thread .cs-ops-thread-scroll {
  flex: 1 1 0;
  min-height: 0;
  padding: 12px 14px 8px;
  overflow: hidden auto;
}

.studio-ops-wa-thread .cs-ops-thread-messages {
  align-content: start;
  gap: 3px;
  width: 100%;
  min-height: 100%;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-composer {
  border-top: 1px solid var(--color-cursor-border);
  flex: none;
}

.studio-ops-wa-text {
  white-space: pre-wrap;
  word-break: break-word;
  margin: 0;
}

.studio-ops-chat-main {
  flex-direction: column;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-chat-main-peer {
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-ops-chat-main-peer strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.2;
  overflow: hidden;
}

.studio-ops-chat-main-peer-title .studio-ops-chat-head-action {
  flex: none;
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  padding: 0;
}

.studio-ops-peer-payment {
  color: var(--color-cursor-muted);
  flex: none;
  font-size: 10px;
}

.studio-ops-chat-rail, .studio-ops-chat-main, .studio-ops-chat-peer {
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-ops-chat-rail {
  border-right: 1px solid var(--color-cursor-border);
  background: var(--mos-page);
}

.studio-ops-chat-rail-toolbar {
  border-bottom: 1px solid var(--color-cursor-border);
  flex: none;
  padding: 8px;
}

.studio-ops-chat-rail-toolbar .cursor-panel-search {
  width: 100%;
}

.studio-ops-chat-filter .desk-explorer-type-filter-trigger {
  max-width: 120px;
}

.studio-ops-chat-list {
  flex: auto;
  margin: 0;
  padding: 6px;
  list-style: none;
  overflow: auto;
}

.studio-ops-chat-row {
  text-align: left;
  width: 100%;
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 8px;
  flex-direction: column;
  gap: 4px;
  padding: 10px 10px 9px;
  display: flex;
}

.studio-ops-chat-row:hover {
  background: var(--mos-hover);
}

.studio-ops-chat-row.is-active {
  background: var(--mos-active);
}

.studio-ops-chat-row-top {
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  display: flex;
}

.studio-ops-chat-row-top strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 650;
  overflow: hidden;
}

.studio-ops-chat-row-top time, .studio-ops-chat-row-meta {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.studio-ops-chat-row-meta {
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  display: flex;
}

.studio-ops-chat-row-tags {
  flex-wrap: wrap;
  gap: 4px;
  display: flex;
}

.studio-ops-chip, .studio-ops-chip-btn {
  background: var(--mos-plate-strong);
  height: 20px;
  color: var(--color-cursor-text);
  border: 0;
  border-radius: 999px;
  align-items: center;
  padding: 0 7px;
  font-size: 10px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-ops-chip.is-wait, .studio-ops-pay-row.is-wait .studio-ops-chip {
  background: color-mix(in srgb, var(--mos-warning, #c2410c) 22%, var(--mos-plate));
  color: var(--mos-warning, #c2410c);
}

.studio-ops-chip.is-ok, .studio-ops-pay-row.is-ok .studio-ops-chip {
  background: color-mix(in srgb, var(--mos-success, #15803d) 20%, var(--mos-plate));
  color: var(--mos-success, #15803d);
}

.studio-ops-chip.is-bad, .studio-ops-pay-row.is-bad .studio-ops-chip {
  background: color-mix(in srgb, var(--mos-danger, #dc2626) 18%, var(--mos-plate));
  color: var(--mos-danger, #dc2626);
}

.studio-ops-chip-btn {
  cursor: pointer;
  background: var(--mos-plate);
  height: 24px;
  padding: 0 9px;
  font-size: 11px;
}

.studio-ops-chip-btn:hover {
  background: var(--mos-plate-strong);
}

.studio-ops-chip-btn.is-on {
  background: color-mix(in srgb, var(--cursor-accent) 22%, var(--mos-plate));
  color: var(--color-cursor-text-bright);
}

.studio-ops-empty-card {
  color: var(--color-cursor-muted);
  text-align: center;
  flex-direction: column;
  gap: 4px;
  padding: 18px 14px;
  display: flex;
}

.studio-ops-empty-card strong {
  color: var(--color-cursor-text);
  font-size: 13px;
}

.studio-ops-empty-card span {
  font-size: 12px;
}

.studio-ops-empty-card.is-center {
  margin: auto;
}

.studio-ops-chat-main {
  background: var(--mos-page);
}

.studio-ops-chat-main-head {
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid
    var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-panel, var(--mos-page));
  flex: none;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  display: flex;
}

.studio-ops-chat-main-head strong {
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.2;
  display: block;
}

.studio-ops-chat-main-head .studio-muted {
  font-size: 10.5px;
}

.studio-ops-chat-main-actions {
  flex-wrap: nowrap;
  flex: none;
  gap: 6px;
  display: flex;
}

.studio-ops-chat-main-actions .studio-ops-chat-head-action {
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  padding: 0;
}

.studio-ops-chat-main-actions .studio-ops-chat-head-action.is-on {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb,
    var(--cursor-accent) 16%,
    var(--mos-plate-strong));
  color: var(--color-cursor-text-bright);
}

.studio-ops-chat-main-actions .studio-ops-chat-head-action.is-human {
  border-color: color-mix(in srgb,
    var(--mos-danger, #dc2626) 42%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--mos-danger, #dc2626) 12%, var(--mos-plate-strong));
  color: var(--mos-danger, #dc2626);
}

.studio-ops-activity {
  flex: auto;
  padding: 12px 14px;
  overflow: auto;
}

.studio-ops-activity-list {
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-ops-activity-list li {
  align-items: flex-start;
  gap: 10px;
  display: flex;
}

.studio-ops-activity-list p {
  margin: 0;
  font-size: 13px;
}

.studio-ops-activity-list time {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.studio-ops-shell > .studio-ops-chat-peer {
  border-left: 1px solid var(--color-cursor-border);
  background: var(--mos-page);
  flex-direction: column;
  flex: 0 0 clamp(260px, 28vw, 320px);
  align-self: stretch;
  width: clamp(260px, 28vw, 320px);
  min-width: 0;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-chat-peer-scroll {
  flex-direction: column;
  flex: 1 1 0;
  gap: 6px;
  min-height: 0;
  padding: 8px;
  display: flex;
  overflow: hidden auto;
}

.studio-ops-chat-peer-scroll .studio-ops-editor, .studio-ops-chat-peer-scroll .studio-ops-babysit-bar, .studio-ops-chat-peer-scroll .studio-ops-board {
  border-bottom: 0;
  gap: 8px;
  padding: 0;
}

.studio-ops-label-list {
  width: 100%;
}

.studio-ops-action-tabs {
  min-width: 0;
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid
    var(--color-cursor-border-soft, var(--color-cursor-border));
  background: var(--mos-page, var(--mos-panel));
  scrollbar-width: none;
  flex: none;
  align-items: center;
  gap: 4px;
  padding: 0 8px;
  display: flex;
  overflow: auto hidden;
}

.studio-ops-action-tabs::-webkit-scrollbar {
  display: none;
}

.studio-ops-action-tab {
  height: 24px;
  color: var(--color-cursor-muted);
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 999px;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  transition: color .16s, border-color .16s, background .16s;
  display: inline-flex;
}

.studio-ops-action-tab:hover {
  color: var(--color-cursor-text-bright);
}

.studio-ops-action-tab.is-active {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 42%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
  color: var(--color-cursor-text-bright);
}

.studio-ops-action-tab:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent) 42%, transparent);
  outline-offset: -2px;
}

.studio-ops-action-tab > span {
  background: color-mix(in srgb, var(--cursor-accent) 18%, var(--mos-plate));
  min-width: 15px;
  height: 15px;
  color: var(--color-cursor-text);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 4px;
  font-size: 9px;
  font-weight: 700;
  display: inline-flex;
}

.studio-ops-agent-item {
  background: var(--mos-plate);
  border-radius: 8px;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
  display: flex;
}

.studio-ops-agent-item-body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--color-cursor-text);
  margin: 0;
  font-size: 12.5px;
  line-height: 1.4;
}

.studio-ops-peer-hint {
  margin: 0;
  font-size: 12px;
}

.studio-ops-empty-state {
  text-align: center;
  min-height: 140px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: auto;
  align-content: start;
  justify-items: center;
  gap: 6px;
  padding: 28px 16px 20px;
  display: grid;
}

.studio-ops-empty-state svg {
  opacity: .55;
  width: 26px;
  height: 26px;
  margin-bottom: 2px;
}

.studio-ops-empty-state strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
}

.studio-ops-empty-state p {
  max-width: 16.5rem;
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
}

.studio-ops-board .studio-ops-empty-state {
  min-height: 180px;
  padding-top: 40px;
}

.studio-ops-references-board {
  gap: 16px;
  padding: 12px 14px 18px;
  overflow: auto;
}

.studio-ops-references-head {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px 14px;
  display: flex;
}

.studio-ops-references-head strong {
  font-size: 13px;
  font-weight: 650;
  display: block;
}

.studio-ops-references-head p {
  max-width: 36rem;
  color: var(--color-cursor-muted);
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 1.45;
}

.studio-ops-references-search {
  flex: 0 240px;
  min-width: min(100%, 220px);
}

.studio-ops-references-section h3 {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  margin: 0 0 8px;
  font-size: 11px;
  font-weight: 650;
}

.studio-ops-references-list {
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-ops-reference-card {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--mos-bg));
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
}

.studio-ops-reference-card-head {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px 10px;
  display: flex;
}

.studio-ops-reference-card-head strong {
  font-size: 12.5px;
  font-weight: 650;
}

.studio-ops-reference-tags {
  flex-wrap: wrap;
  gap: 4px;
  display: flex;
}

.studio-ops-reference-tags span {
  background: var(--mos-plate-strong, var(--mos-hover));
  color: var(--color-cursor-muted);
  border-radius: 999px;
  padding: 2px 6px;
  font-size: 10px;
}

.studio-ops-reference-body {
  font: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
}

.studio-ops-reference-copy {
  align-self: flex-start;
  align-items: center;
  gap: 6px;
  display: inline-flex;
}

.studio-ops-readout {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--mos-bg));
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
}

.studio-ops-readout strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 12.5px;
  font-weight: 650;
}

.studio-ops-readout p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
}

.studio-ops-notes-stack {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.studio-ops-memory-list {
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-ops-memory-card {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--mos-bg));
  padding: 10px 12px;
}

.studio-ops-memory-card-head {
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
  margin-bottom: 6px;
  display: flex;
}

.studio-ops-memory-card-head strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 12.5px;
  font-weight: 650;
}

.studio-ops-memory-card-head span {
  color: var(--color-cursor-text-muted, var(--mos-muted));
  font-size: 11px;
}

.studio-ops-memory-pin {
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 10px;
}

.studio-ops-memory-card p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
}

.studio-ops-followup-card {
  background: var(--mos-plate);
  border-radius: 8px;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  display: flex;
}

.studio-ops-followup-card strong {
  font-size: 12.5px;
}

.studio-ops-pay-list {
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-ops-pay-row {
  background: var(--mos-plate);
  border-radius: 8px;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 10px;
  display: flex;
}

.studio-ops-pay-row strong {
  font-size: 12.5px;
}

.studio-ops-pay-row .studio-muted {
  font-size: 11px;
}

@media (max-width: 980px) {
  .studio-ops-shell.has-peer > .studio-ops-chat-peer {
    z-index: 4;
    flex-basis: min(320px, 92vw);
    width: min(320px, 92vw);
    position: absolute;
    inset: 0 0 0 auto;
    box-shadow: -8px 0 24px #0000002e;
  }
}

.studio-ops-empty {
  color: var(--color-cursor-muted);
  text-align: center;
  margin: 24px 0 0;
  font-size: 13px;
  font-weight: 500;
}

.studio-ops-tab-count {
  background: color-mix(in srgb, var(--cursor-accent) 22%, transparent);
  min-width: 16px;
  height: 16px;
  color: var(--color-cursor-text-bright);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  margin-left: 4px;
  padding: 0 5px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
}

.studio-ops-rail-sidebar {
  background: var(--mos-page);
  position: relative;
}

.studio-ops-rail-sidebar .studio-dm-sidebar-chrome {
  background: var(--mos-page);
  flex: none;
}

.studio-ops-rail-sidebar .cursor-panel-search-end {
  gap: 2px;
}

.studio-ops-inbox-tabs {
  min-height: var(--cursor-head-h, 36px);
  padding-inline: 6px;
  overflow-x: auto;
}

.studio-ops-inbox-tabs .studio-admin-head-tab {
  flex: none;
}

.studio-ops-chat-card-wrap {
  min-width: 0;
  align-items: stretch;
  padding-inline-start: calc(var(--studio-ops-tree-depth, 0) * 14px);
  display: flex;
  position: relative;
}

.studio-ops-chat-card-wrap.is-nested:before {
  content: "";
  border-inline-start: 1px solid var(--color-cursor-border-soft);
  border-block-end: 1px solid var(--color-cursor-border-soft);
  pointer-events: none;
  border-end-start-radius: 6px;
  width: 8px;
  position: absolute;
  inset-block: -3px 50%;
  inset-inline-start: calc((var(--studio-ops-tree-depth) * 14px) - 7px);
}

.studio-ops-chat-card-wrap .studio-ops-chat-card {
  background: color-mix(in srgb, var(--mos-surface) 58%, transparent);
  border-radius: 16px;
  flex: auto;
  min-width: 0;
}

.studio-ops-tree-toggle {
  width: 18px;
  min-width: 18px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  padding: 0;
}

.studio-ops-tree-toggle:hover {
  background: var(--mos-hover);
  color: var(--color-cursor-text);
}

.studio-ops-kind-chip {
  background: var(--mos-plate-strong);
  height: 15px;
  color: var(--color-cursor-muted);
  border-radius: 999px;
  align-items: center;
  gap: 3px;
  padding: 0 6px;
  font-size: 9px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-ops-kind-chip.is-community, .studio-ops-kind-chip.is-subgroup {
  color: var(--cursor-accent);
}

.studio-ops-create-sheet {
  z-index: 12;
  background: var(--mos-page);
  flex-direction: column;
  min-height: 0;
  display: flex;
  position: absolute;
  inset: 0;
}

.studio-ops-create-tabs {
  flex: 0 0 var(--cursor-head-h, 36px);
  padding-inline: 6px;
  overflow-x: auto;
}

.studio-ops-create-tabs svg {
  width: 13px;
  height: 13px;
}

.studio-ops-create-body {
  flex: 1 1 0;
  min-height: 0;
  padding: 12px;
  overflow-y: auto;
}

.studio-ops-create-body .studio-chrome-settings-card {
  gap: 12px;
  padding: 12px;
  display: grid;
}

.studio-ops-create-hint, .studio-ops-details-empty, .studio-ops-invite-link {
  color: var(--color-cursor-muted);
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
}

.studio-ops-details {
  background: var(--mos-page);
  flex-direction: column;
  flex: 1 1 0;
  min-height: 0;
  display: flex;
}

.studio-ops-details-head .cursor-panel-head-tools {
  gap: 2px;
}

.studio-ops-details-head > .studio-admin-head-tabs {
  min-width: 0;
  overflow-x: auto;
}

.studio-ops-details-scroll {
  flex-direction: column;
  flex: 1 1 0;
  gap: 10px;
  min-height: 0;
  padding: 10px;
  display: flex;
  position: relative;
  overflow-y: auto;
}

.studio-ops-details-identity {
  align-items: center;
  gap: 10px;
  padding: 2px 4px 4px;
  display: flex;
}

.studio-ops-details-identity > div {
  gap: 2px;
  min-width: 0;
  display: grid;
}

.studio-ops-details-identity strong, .studio-ops-details-identity span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-ops-details-identity strong {
  font-size: 13px;
}

.studio-ops-details-identity span {
  color: var(--color-cursor-muted);
  text-transform: capitalize;
  font-size: 11px;
}

.studio-ops-details-form, .studio-ops-details-add {
  gap: 10px;
  padding: 10px;
  display: grid;
}

.studio-ops-details-add {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.studio-ops-participant-list, .studio-ops-subgroup-list {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.studio-ops-participant, .studio-ops-subgroup-list > div {
  background: var(--mos-plate);
  border-radius: 12px;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 40px;
  padding: 6px 8px;
  display: flex;
}

.studio-ops-participant > span {
  flex: auto;
  min-width: 0;
  display: grid;
}

.studio-ops-participant strong, .studio-ops-participant em {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-ops-participant strong {
  font-size: 12px;
  font-style: normal;
}

.studio-ops-participant em, .studio-ops-participant small, .studio-ops-subgroup-list span {
  color: var(--color-cursor-muted);
  font-size: 10px;
  font-style: normal;
}

.studio-ops-participant-actions, .studio-ops-inline-actions {
  flex: none;
  align-items: center;
  gap: 3px;
  display: inline-flex;
}

.studio-ops-invite-link {
  overflow-wrap: anywhere;
  padding: 0 10px 10px;
}

.studio-ops-subgroup-list > div {
  justify-content: space-between;
}

.studio-ops-details-loading {
  background: color-mix(in srgb, var(--mos-page) 82%, transparent);
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.studio-ops-details-loading svg {
  width: 20px;
  height: 20px;
}

.studio-ops-mobile-back {
  display: none;
}

.studio-ops-peer-mobile-close {
  margin-inline-start: auto;
  display: none;
}

@media (max-width: 980px) {
  .studio-ops-mobile-back, .studio-ops-peer-mobile-close {
    display: inline-flex;
  }

  .studio-ops-shell.has-peer > .studio-ops-chat-peer {
    z-index: 80;
    background: var(--mos-plate);
    width: 100%;
    max-width: none;
    height: min(78dvh, 46rem);
    box-shadow: var(--studio-mobile-sheet-shadow);
    border: 0;
    border-radius: 18px 18px 0 0;
    flex-basis: auto;
    position: fixed;
    inset: auto 0 0;
  }

  .studio-ops-shell.has-peer > .studio-ops-chat-peer:before {
    content: "";
    background: color-mix(in srgb, var(--mos-text) 40%, transparent);
    border-radius: 999px;
    flex: none;
    align-self: center;
    width: 44px;
    height: 5px;
    margin: 7px 0 3px;
    display: block;
  }

  .studio-ops-chat-peer .studio-ops-details, .studio-ops-chat-peer .studio-ops-action-tabs, .studio-ops-chat-peer .studio-ops-chat-peer-scroll {
    background: var(--mos-plate);
  }
}

@media (max-width: 760px) {
  .studio-ops-main-col > .studio-ops-subhead {
    display: none;
  }

  .studio-ops-details-add {
    grid-template-columns: 1fr;
  }
}

/* [project]/src/studio/components/admin-studio-ops-thread.css [app-client] (css) */
.studio-ops-wa-thread {
  background: var(--mos-page, var(--color-cursor-bg));
  flex-direction: column;
  flex: 1 1 0;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-wa-thread .cs-ops-thread-scroll {
  overscroll-behavior: contain;
  scrollbar-width: none;
  flex: 1 1 0;
  min-height: 0;
  padding: 12px 16px 10px;
  overflow: hidden auto;
}

.studio-ops-thread-stale {
  margin: 0 0 8px;
  font-size: 11px;
}

.studio-ops-thread-older {
  justify-content: center;
  padding: 2px 0 10px;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-thread-scroll::-webkit-scrollbar {
  display: none;
}

.studio-ops-wa-thread .cs-ops-thread-messages {
  align-content: start;
  gap: 3px;
  width: 100%;
  min-height: 100%;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-thread-empty {
  text-align: center;
  min-height: 100%;
  color: var(--color-cursor-muted, var(--mos-muted));
  place-content: center;
  gap: 6px;
  padding: 24px;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-thread-empty p {
  margin: 0;
  font-size: 13px;
}

.studio-ops-wa-thread .cs-ops-day-sep {
  pointer-events: none;
  justify-content: center;
  align-items: center;
  margin: 10px 0 6px;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-day-sep span {
  background: var(--mos-plate, var(--mos-panel));
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-2xs, 10px);
  letter-spacing: .03em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 3px 10px;
  font-weight: 650;
  line-height: 1.3;
}

.studio-ops-wa-thread .cs-ops-bubble-row {
  justify-content: flex-start;
  align-items: flex-end;
  gap: 6px;
  width: 100%;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-bubble-row.is-mine {
  justify-content: flex-end;
}

.studio-ops-wa-thread .cs-ops-bubble-row.is-ops-focus .cs-ops-bubble {
  outline: 2px solid var(--cursor-accent);
  outline-offset: 2px;
}

.studio-ops-wa-thread .studio-ops-participant-avatar {
  width: 26px;
  min-width: 26px;
  height: 26px;
  min-height: 26px;
  margin-bottom: 2px;
}

.studio-ops-wa-thread .studio-ops-participant-avatar .studio-profile-avatar-fallback {
  font-size: 9px;
}

.studio-ops-wa-thread .cs-ops-bubble {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: 14px;
  background: var(--mos-plate, var(--mos-panel));
  max-width: min(72%, 42rem);
  color: var(--color-cursor-text, var(--mos-text));
  border-end-start-radius: 5px;
  align-items: flex-end;
  gap: 8px;
  padding: 7px 10px;
  display: inline-flex;
  position: relative;
}

.studio-ops-wa-thread .cs-ops-bubble-row.is-mine .cs-ops-bubble {
  border-radius: 14px;
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 26%,
    var(--color-cursor-border-soft, var(--mos-border-soft)));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 16%,
    var(--mos-plate, var(--mos-panel)));
  border-end-end-radius: 5px;
}

.studio-ops-wa-thread .cs-ops-bubble-body {
  flex-direction: column;
  flex: auto;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-bubble p, .studio-ops-wa-thread .studio-ops-wa-text {
  min-width: 0;
  color: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
}

.studio-ops-wa-thread .studio-ops-wa-text code {
  background: color-mix(in srgb, currentColor 8%, transparent);
  border-radius: 4px;
  padding: 1px 4px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .92em;
}

.studio-ops-wa-thread .cs-ops-bubble-foot {
  flex: none;
  align-self: flex-end;
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.studio-ops-wa-thread .cs-ops-bubble-meta {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  flex: none;
  align-items: center;
  padding: 0 2px 1px;
  font-size: 9.5px;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
}

.studio-ops-wa-thread .cs-ops-wa-quote {
  background: color-mix(in srgb, currentColor 8%, transparent);
  border-radius: 8px;
  align-items: stretch;
  gap: 6px;
  max-width: 100%;
  margin: 0 0 2px;
  padding: 4px 6px;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-wa-quote-bar {
  background: var(--cursor-accent, var(--mos-accent));
  border-radius: 2px;
  flex: none;
  width: 3px;
}

.studio-ops-wa-thread .cs-ops-bubble-sender {
  color: var(--cursor-accent, var(--mos-accent));
  margin: 0 0 2px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.2;
}

.studio-ops-wa-thread .cs-ops-wa-quote-who {
  opacity: .95;
  margin: 0 0 1px;
  font-size: 11px;
  font-weight: 650;
  display: block;
}

.studio-ops-wa-thread .cs-ops-wa-quote-text {
  color: inherit;
  opacity: .85;
  white-space: pre-wrap;
  word-break: break-word;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  font-size: 12px;
  line-height: 1.35;
  display: -webkit-box;
  overflow: hidden;
}

.studio-ops-tag.is-group {
  color: var(--cursor-accent, var(--mos-accent));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 14%,
    transparent);
}

.studio-ops-wa-thread .cs-ops-bubble.is-media {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  max-width: min(78%, 20rem);
  padding: 4px;
}

.studio-ops-wa-thread .cs-ops-bubble.is-media .cs-ops-bubble-body > p {
  padding-inline: 6px;
}

.studio-ops-wa-thread .cs-ops-bubble.is-sticker {
  background: none;
  border-color: #0000;
  max-width: min(46%, 9rem);
  padding: 2px;
}

.studio-ops-wa-thread .cs-ops-media-link {
  cursor: zoom-in;
  background: none;
  border: 0;
  border-radius: 10px;
  margin: 0;
  padding: 0;
  display: block;
  overflow: hidden;
}

.studio-ops-wa-thread .cs-ops-media-img, .studio-ops-wa-thread .cs-ops-media-video {
  background: color-mix(in srgb, var(--color-cursor-muted) 12%, transparent);
  object-fit: cover;
  border-radius: 10px;
  width: 100%;
  max-height: 280px;
  display: block;
}

.studio-ops-wa-thread .cs-ops-media-video {
  object-fit: contain;
  background: #0b0b0b;
}

.studio-ops-wa-thread .cs-ops-bubble.is-sticker .cs-ops-media-img {
  object-fit: contain;
  background: none;
  max-height: 140px;
}

.studio-ops-wa-thread .cs-ops-bubble.is-audio {
  max-width: min(92%, 22rem);
  padding: 8px 10px 6px;
}

.studio-ops-wa-thread .cs-ops-audio-wrap {
  min-width: 200px;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-audio {
  width: 100%;
  min-width: 190px;
  height: 32px;
}

.studio-ops-wa-thread .cs-ops-media-missing {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  padding: 4px 8px;
  font-size: 12px;
  font-style: italic;
}

.studio-ops-wa-thread .cs-ops-doc-link, .studio-ops-wa-thread .cs-ops-loc-link {
  min-width: 0;
  color: inherit;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-doc-icon {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 16%, transparent);
  width: 28px;
  height: 28px;
  color: var(--cursor-accent, var(--mos-accent));
  border-radius: 8px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-ops-wa-thread .cs-ops-doc-meta, .studio-ops-wa-thread .cs-ops-contact, .studio-ops-wa-thread .cs-ops-loc-link {
  gap: 2px;
  min-width: 0;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-doc-meta strong, .studio-ops-wa-thread .cs-ops-contact strong, .studio-ops-wa-thread .cs-ops-loc-link strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12.5px;
  font-weight: 650;
  overflow: hidden;
}

.studio-ops-wa-thread .cs-ops-doc-meta em, .studio-ops-wa-thread .cs-ops-contact em, .studio-ops-wa-thread .cs-ops-loc-link em {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
  font-style: normal;
  overflow: hidden;
}

.studio-ops-wa-thread .cs-ops-bubble.has-reactions {
  margin-bottom: 10px;
}

.studio-ops-wa-thread .cs-ops-bubble-reactions {
  z-index: 1;
  inset-inline-start: 8px;
  flex-wrap: wrap;
  gap: 2px;
  max-width: calc(100% - 16px);
  display: flex;
  position: absolute;
  bottom: -11px;
}

.studio-ops-wa-thread .cs-ops-bubble-row.is-mine .cs-ops-bubble-reactions {
  justify-content: flex-end;
  inset-inline: auto 8px;
}

.studio-ops-wa-thread .cs-ops-bubble-reaction {
  border: 1px solid color-mix(in srgb, var(--color-cursor-text) 14%, transparent);
  background: var(--mos-page, var(--color-cursor-bg));
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  font-size: 12px;
  line-height: 1;
  display: inline-flex;
  box-shadow: 0 1px 2px #0000001f;
}

.studio-ops-wa-thread .cs-ops-bubble-row.is-system {
  justify-content: center;
}

.studio-ops-wa-thread .cs-ops-bubble.is-system {
  background: none;
  border-color: #0000;
  max-width: min(90%, 28rem);
  padding: 2px 8px;
}

.studio-ops-wa-thread .cs-ops-bubble.is-system p {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-align: center;
  font-size: 11px;
  font-style: italic;
}

.studio-ops-wa-thread .cs-ops-bubble.is-interactive {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  width: min(86%, 24rem);
  max-width: min(86%, 24rem);
  padding: 6px;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-interactive {
  gap: 6px;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-interactive-kicker {
  color: var(--color-cursor-muted, var(--mos-muted));
  letter-spacing: .05em;
  text-transform: uppercase;
  font-size: 9px;
  font-weight: 700;
}

.studio-ops-wa-thread .cs-ops-interactive-title {
  font-size: 13px;
  line-height: 1.35;
}

.studio-ops-wa-thread .cs-ops-interactive-header, .studio-ops-wa-thread .cs-ops-interactive-card > img {
  background: color-mix(in srgb, var(--color-cursor-text) 6%, transparent);
  object-fit: cover;
  border-radius: 10px;
  width: 100%;
  max-height: 160px;
  display: block;
}

.studio-ops-wa-thread .cs-ops-interactive-cards {
  grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
  gap: 8px;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-interactive-card {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: color-mix(in srgb, var(--mos-page) 70%, transparent);
  border-radius: 10px;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  display: flex;
  overflow: hidden;
}

.studio-ops-wa-thread .cs-ops-interactive-card > img {
  aspect-ratio: 1.15;
  border-radius: 0;
}

.studio-ops-wa-thread .cs-ops-interactive-card-copy {
  gap: 3px;
  padding: 3px 7px;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-interactive-card-copy strong {
  font-size: 12px;
}

.studio-ops-wa-thread .cs-ops-interactive-card-copy em, .studio-ops-wa-thread .cs-ops-interactive-footer {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 10px;
  font-style: normal;
}

.studio-ops-wa-thread .cs-ops-interactive-list {
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-interactive-list li {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: 8px;
  gap: 1px;
  padding: 6px 8px;
  font-size: 12px;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-interactive-list em {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 10px;
  font-style: normal;
}

.studio-ops-wa-thread .cs-ops-interactive-btns {
  gap: 4px;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-interactive-btn {
  border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  color: var(--cursor-accent, var(--mos-accent));
  text-align: center;
  padding: 6px 8px;
  font-size: 11px;
  font-weight: 650;
  display: block;
}

.studio-ops-wa-thread .cs-ops-composer {
  z-index: 2;
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-panel, var(--mos-page));
  flex-direction: column;
  flex: none;
  align-items: stretch;
  padding: 8px 12px 10px;
  display: flex;
  position: relative;
}

.studio-ops-status-attach {
  min-height: 28px;
  color: var(--color-cursor-text, var(--mos-text));
  align-items: center;
  gap: 6px;
  margin: 0 0 6px;
  font-size: 12px;
  display: flex;
}

.studio-ops-compose-context {
  border-inline-start: 3px solid var(--cursor-accent);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0 0 6px;
  padding: 5px 7px 5px 9px;
  display: flex;
}

.studio-ops-compose-context > span {
  flex: auto;
  gap: 1px;
  min-width: 0;
  display: grid;
}

.studio-ops-compose-context strong, .studio-ops-compose-context em {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-ops-compose-context strong {
  font-size: 11px;
}

.studio-ops-compose-context em {
  color: var(--color-cursor-muted);
  font-size: 10px;
  font-style: normal;
}

.studio-ops-status-attach span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-ops-poll-compose {
  gap: 6px;
  margin: 0 0 8px;
  display: grid;
}

.studio-ops-poll-option {
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.studio-ops-poll-option .cs-ops-composer-input {
  flex: auto;
}

.studio-ops-wa-thread .cs-ops-composer-row {
  align-items: flex-end;
  gap: 8px;
  width: 100%;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-composer-input {
  resize: none;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-input, var(--mos-surface));
  min-width: 0;
  min-height: 32px;
  max-height: 120px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  scrollbar-width: none;
  border-radius: 16px;
  outline: none;
  flex: auto;
  padding: 7px 12px;
  font-size: 13px;
  line-height: 1.4;
}

.studio-ops-wa-thread .cs-ops-composer-input:focus-visible {
  border-color: var(--cursor-border-focus, var(--cursor-accent, var(--mos-accent)));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 14%, transparent);
}

.studio-ops-wa-thread .cs-ops-composer-send {
  background: var(--cursor-accent, var(--mos-accent));
  color: #fff;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  transition: filter .12s;
  display: inline-flex;
}

.studio-ops-wa-thread .cs-ops-composer-send svg {
  color: #fff;
  stroke: #fff;
}

.studio-ops-wa-thread .cs-ops-composer-send:hover:not(:disabled) {
  filter: brightness(1.06);
}

.studio-ops-wa-thread .cs-ops-composer-send:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 58%, transparent);
  outline-offset: 2px;
}

.studio-ops-wa-thread .cs-ops-composer-send:disabled {
  cursor: default;
  opacity: .5;
}

@media (max-width: 760px) {
  .studio-ops-wa-thread .cs-ops-thread-scroll {
    padding-inline: 10px;
  }

  .studio-ops-wa-thread .cs-ops-bubble {
    max-width: 88%;
  }

  .studio-ops-wa-thread .cs-ops-bubble.is-media, .studio-ops-wa-thread .cs-ops-bubble.is-interactive {
    max-width: 92%;
  }
}

.studio-ops-wa-thread .cs-ops-audio-wrap {
  flex-direction: column;
  gap: 6px;
  min-width: 12rem;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-vn {
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-vn-orb {
  border: 1px solid color-mix(in srgb, var(--cursor-accent, #22c55e) 35%, transparent);
  background: color-mix(in srgb, var(--cursor-accent, #22c55e) 16%, transparent);
  width: 36px;
  height: 36px;
  color: var(--mos-text-bright, var(--color-cursor-text));
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  place-items: center;
  padding: 0;
  display: grid;
}

.studio-ops-wa-thread .cs-ops-vn-orb.is-playing {
  background: color-mix(in srgb, var(--cursor-accent, #22c55e) 28%, transparent);
}

.studio-ops-wa-thread .cs-ops-vn-wave {
  flex: auto;
  align-items: center;
  gap: 2px;
  min-width: 0;
  height: 28px;
  display: flex;
}

.studio-ops-wa-thread .cs-ops-vn-bar {
  background: color-mix(in srgb, var(--mos-text-bright, #fff) 72%, transparent);
  border-radius: 2px;
  flex: 1 1 0;
  min-width: 2px;
  max-width: 4px;
}

.studio-ops-wa-thread .cs-ops-bubble-row:not(.is-mine) .cs-ops-vn-bar {
  background: color-mix(in srgb, var(--color-cursor-text) 55%, transparent);
}

.studio-ops-wa-thread .cs-ops-vn-time {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-muted);
  text-align: right;
  flex: none;
  min-width: 2.4em;
  font-size: 11px;
}

.studio-ops-wa-thread .cs-ops-vn-transcript {
  color: color-mix(in srgb, var(--color-cursor-text) 88%, transparent);
  white-space: pre-wrap;
  margin: 0;
  padding: 2px 2px 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-ops-wa-thread .cs-ops-bubble {
  position: relative;
}

.studio-ops-wa-thread .studio-ops-react-strip {
  z-index: 3;
  top: -14px;
  background: var(--mos-plate, var(--mos-panel));
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  border-radius: 999px;
  gap: 2px;
  padding: 2px;
  display: none;
  position: absolute;
  inset-inline-end: 6px;
  box-shadow: 0 4px 14px #00000029;
}

.studio-ops-wa-thread .cs-ops-bubble-row:hover .studio-ops-react-strip, .studio-ops-wa-thread .cs-ops-bubble-row:focus-within .studio-ops-react-strip {
  display: inline-flex;
}

.studio-ops-wa-thread .studio-ops-react-btn {
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  width: 24px;
  height: 24px;
  padding: 0;
  font-size: 13px;
  line-height: 1;
}

.studio-ops-wa-thread .studio-ops-react-btn svg {
  width: 13px;
  height: 13px;
  margin: auto;
}

.studio-ops-wa-thread .studio-ops-react-btn.is-danger {
  color: var(--mos-danger, #dc2626);
}

.studio-ops-wa-thread .studio-ops-react-btn:hover, .studio-ops-wa-thread .studio-ops-react-btn.is-active {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 16%, transparent);
}

.studio-ops-wa-thread .studio-ops-react-btn:disabled {
  opacity: .5;
  cursor: default;
}

/* [project]/src/studio/components/agent/agent-steps.css [app-client] (css) */
.studio-agent-turn {
  flex-direction: column;
  gap: 14px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-agent-turn-activity {
  box-sizing: border-box;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
}

.studio-agent-turn-steps {
  box-sizing: border-box;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 2px 0;
  padding: 0 0 0 4px;
  display: flex;
}

.studio-agent-worked {
  width: auto;
  max-width: 100%;
  color: var(--color-cursor-text-soft, var(--mos-text-soft, var(--color-cursor-text)));
  font: inherit;
  font-size: var(--desk-text-xs, 11px);
  letter-spacing: -.01em;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  gap: 4px;
  margin: 2px 0;
  padding: 0 0 0 4px;
  font-weight: 450;
  line-height: 1.3;
  display: inline-flex;
}

.studio-agent-worked:hover, .studio-agent-worked.is-open {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-agent-worked svg {
  flex: none;
  transition: transform .12s;
  display: block;
}

.studio-agent-worked.is-open svg {
  transform: rotate(180deg);
}

.studio-agent-worked-label {
  min-width: 0;
}

.studio-chat-bubble.is-assistant.is-progress {
  opacity: .92;
}

.studio-agent-turn-media > .studio-agent-step.is-thinking, .studio-agent-turn-media > .studio-agent-thinking {
  width: 100%;
  margin: 6px 0 2px;
}

.studio-agent-step {
  flex-flow: wrap;
  align-items: center;
  gap: 4px 8px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
}

.studio-agent-step-btn {
  width: auto;
  min-width: 0;
  max-width: 100%;
  color: var(--color-cursor-text-soft, var(--mos-text-soft, var(--color-cursor-text)));
  font: inherit;
  text-align: left;
  cursor: default;
  background: none;
  border: 0;
  border-radius: 0;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 450;
  line-height: 1;
  display: inline-flex;
}

.studio-agent-step-btn:not(:disabled) {
  cursor: pointer;
}

.studio-agent-step-btn:not(:disabled):hover {
  color: var(--mos-ink, var(--color-cursor-text));
}

.studio-agent-step.is-live .studio-agent-step-btn {
  color: var(--mos-ink, var(--color-cursor-text));
  opacity: .9;
}

.studio-agent-step.is-error .studio-agent-step-btn {
  color: color-mix(in srgb, #a33 72%, var(--mos-ink));
}

.studio-agent-step-icon {
  opacity: .88;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  line-height: 0;
  display: inline-flex;
}

.studio-agent-step-icon svg {
  flex: none;
  width: 13px;
  height: 13px;
  display: block;
}

.studio-agent-step-icon .animate-spin {
  transform-origin: center;
}

.studio-agent-step.is-error .studio-agent-step-icon {
  opacity: 1;
}

.studio-agent-step-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  align-items: center;
  min-width: 0;
  height: 14px;
  line-height: 14px;
  display: inline-flex;
  overflow: hidden;
}

.studio-agent-step-subtitle {
  min-width: 0;
  max-width: 14rem;
  height: 18px;
  color: var(--color-cursor-text-secondary, var(--mos-ink-muted));
  text-overflow: ellipsis;
  white-space: nowrap;
  align-items: center;
  padding: 0 6px;
  font-size: 11px;
  line-height: 18px;
  display: inline-flex;
  overflow: hidden;
}

.studio-agent-step-subtitle.is-error {
  color: var(--cursor-danger, #e5484d);
}

.studio-agent-step-tags {
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  min-width: 0;
  max-width: min(100%, 22rem);
  display: inline-flex;
}

.studio-agent-step-tag {
  background: var(--mos-plate-strong, var(--mos-plate));
  max-width: 100%;
  height: 20px;
  color: var(--color-cursor-text, var(--mos-ink));
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  align-items: center;
  gap: 4px;
  padding: 0 7px;
  font-size: 11px;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.studio-agent-step-tag:hover, .studio-agent-step-tag:focus-visible {
  background: color-mix(in srgb, var(--cursor-accent) 16%, var(--mos-plate-strong, var(--mos-plate)));
  color: var(--color-cursor-text-bright, var(--mos-ink));
  outline: none;
}

.studio-agent-step-tag-verb {
  opacity: .72;
  flex: none;
  font-weight: 500;
}

.studio-agent-step-tag-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-weight: 550;
  overflow: hidden;
}

.studio-agent-step-tag.is-document .studio-agent-step-tag-verb, .studio-agent-step-tag.is-asset .studio-agent-step-tag-verb, .studio-agent-step-tag.is-folder .studio-agent-step-tag-verb {
  letter-spacing: .01em;
}

.studio-agent-step-details {
  flex: 100%;
  min-width: 0;
  max-width: min(100%, 28rem);
  padding: 6px 0 2px;
}

.studio-agent-step-details pre {
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--mos-plate, var(--mos-panel));
  border: 1px solid color-mix(in srgb, var(--mos-ink) 10%, transparent);
  max-height: 160px;
  color: var(--mos-ink, var(--color-cursor-text));
  border-radius: 8px;
  margin: 0;
  padding: 6px 8px;
  font-size: 11px;
  line-height: 1.4;
  overflow-x: auto;
}

.studio-agent-step-approval-actions {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  display: flex;
}

.studio-agent-approval-card-wrap {
  flex-direction: column;
  flex: 100%;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-agent-approval-card {
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 11%, transparent);
  background: linear-gradient(180deg,
      color-mix(in srgb, var(--cursor-accent, #7cff6b) 9%, transparent),
      transparent 42%),
    color-mix(in srgb, var(--mos-plate, var(--mos-panel, #fff)) 94%, transparent);
  box-sizing: border-box;
  border-radius: 16px;
  width: 100%;
  max-width: min(100%, 31rem);
  margin-left: 10px;
  padding: 10px 11px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 2px #0000001a, 0 8px 24px #0000001a, inset 0 1px #ffffff61;
}

.studio-agent-approval-card:before {
  content: "";
  background: linear-gradient(180deg,
    var(--cursor-accent, #7cff6b),
    color-mix(in srgb, var(--cursor-accent, #7cff6b) 20%, transparent));
  width: 3px;
  position: absolute;
  inset: 0 auto 0 0;
}

.studio-agent-approval-card-head {
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 8px;
  display: flex;
}

.studio-agent-approval-card-head-main {
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.studio-agent-approval-card-head-copy {
  min-width: 0;
}

.studio-agent-approval-card-icon {
  background: linear-gradient(180deg, #ffffff52, transparent),
    color-mix(in srgb, var(--cursor-accent, #7cff6b) 16%, transparent);
  border: 1px solid color-mix(in srgb, var(--cursor-accent, #7cff6b) 24%, transparent);
  width: 30px;
  height: 30px;
  color: color-mix(in srgb, var(--mos-ink, var(--color-cursor-text)) 88%, transparent);
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-agent-approval-card-kicker, .studio-agent-approval-card-title, .studio-agent-approval-card-status, .studio-agent-approval-card-summary, .studio-agent-approval-card-cost {
  margin: 0;
}

.studio-agent-approval-card-kicker {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--mos-ink, var(--color-cursor-text)) 48%, transparent);
  margin-bottom: 2px;
  font-size: 10px;
  font-weight: 700;
}

.studio-agent-approval-card-title {
  color: var(--mos-ink, var(--color-cursor-text));
  font-size: 13px;
  font-weight: 650;
  line-height: 1.2;
}

.studio-agent-approval-card-status {
  color: color-mix(in srgb, var(--mos-ink, var(--color-cursor-text)) 72%, transparent);
  background: color-mix(in srgb, var(--mos-ink, #111) 6%, transparent);
  white-space: nowrap;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 600;
}

.studio-agent-approval-card-summary {
  color: color-mix(in srgb, var(--mos-ink, var(--color-cursor-text)) 82%, transparent);
  font-size: 12px;
  line-height: 1.5;
}

.studio-agent-approval-card-cost {
  color: var(--mos-ink, var(--color-cursor-text));
  margin-top: 8px;
  font-size: 12px;
  font-weight: 600;
}

.studio-agent-approval-card .studio-agent-step-approval-actions {
  margin-top: 8px;
}

.studio-agent-approval-post-preview {
  background: color-mix(in srgb, var(--mos-ink, #111) 4%, transparent);
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 8%, transparent);
  border-radius: 14px;
  margin-top: 9px;
  overflow: hidden;
}

.studio-agent-approval-post-preview-head {
  align-items: center;
  gap: 9px;
  padding: 9px 10px 8px;
  display: flex;
}

.studio-agent-approval-post-avatar {
  background: radial-gradient(circle at 30% 30%, #ffffff73, transparent 52%),
    linear-gradient(135deg, color-mix(in srgb, var(--cursor-accent, #7cff6b) 42%, transparent), color-mix(in srgb, var(--mos-ink, #111) 16%, transparent));
  border-radius: 999px;
  flex: none;
  width: 26px;
  height: 26px;
  box-shadow: inset 0 1px #ffffff40;
}

.studio-agent-approval-post-name, .studio-agent-approval-post-meta {
  margin: 0;
}

.studio-agent-approval-post-name {
  color: var(--mos-ink, var(--color-cursor-text));
  font-size: 11px;
  font-weight: 650;
}

.studio-agent-approval-post-meta {
  color: color-mix(in srgb, var(--mos-ink, var(--color-cursor-text)) 58%, transparent);
  margin-top: 1px;
  font-size: 10px;
}

.studio-agent-approval-post-media-wrap {
  border-top: 1px solid color-mix(in srgb, var(--mos-ink, #111) 7%, transparent);
  background: #000;
}

.studio-agent-approval-post-media {
  aspect-ratio: 1;
  object-fit: cover;
  width: 100%;
  display: block;
}

.studio-agent-live-progress {
  color: var(--color-cursor-text-soft, var(--mos-text-soft, var(--color-cursor-text)));
  box-sizing: border-box;
  background: none;
  border: 0;
  border-radius: 0;
  align-self: flex-start;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  margin: 2px 0;
  padding: 0 0 0 4px;
  font-size: 12px;
  line-height: 1;
  display: inline-flex;
}

.studio-agent-live-progress .studio-agent-step-icon {
  opacity: .9;
}

.studio-agent-live-progress .studio-agent-meta {
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: .9;
  min-width: 0;
  height: 14px;
  margin: 0;
  font-size: 12px;
  line-height: 14px;
  overflow: hidden;
}

.studio-agent-turn-media {
  box-sizing: border-box;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  margin: 4px 0 2px;
  padding: 0 2px;
  display: flex;
}

.studio-agent-media-card {
  flex-direction: column;
  gap: 6px;
  width: 100%;
  min-width: 0;
  max-width: min(420px, 100%);
  display: flex;
}

button.studio-agent-media-card {
  appearance: none;
  text-align: left;
  font: inherit;
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
}

button.studio-agent-media-card.is-openable:hover .studio-agent-media-frame {
  outline: 2px solid color-mix(in srgb, var(--mos-accent, #0a7) 55%, transparent);
  outline-offset: 2px;
}

.studio-agent-media-open {
  appearance: none;
  font: inherit;
  color: var(--mos-accent, #0a7);
  cursor: pointer;
  text-underline-offset: 2px;
  background: none;
  border: 0;
  align-self: flex-start;
  margin: 0;
  padding: 0;
  font-size: 12px;
  text-decoration: underline;
}

.studio-agent-media-card.is-pending {
  aspect-ratio: var(--agent-gen-aspect, 16 / 9);
  background: color-mix(in srgb, var(--mos-ink, #111) 6%, transparent);
  border-radius: 10px;
  max-height: 360px;
  overflow: hidden;
}

.studio-agent-media-card.is-pending.is-audio {
  aspect-ratio: auto;
  background: none;
  width: 100%;
  max-width: 280px;
  max-height: none;
  overflow: visible;
}

.studio-agent-media-card.is-video, .studio-agent-media-card.is-image {
  aspect-ratio: var(--agent-gen-aspect, 16 / 9);
  background: color-mix(in srgb, var(--mos-ink, #111) 6%, transparent);
  border-radius: 10px;
  width: min(100%, 420px);
  max-height: 360px;
  overflow: hidden;
}

.studio-agent-media-card.is-image {
  aspect-ratio: var(--agent-gen-aspect, 1 / 1);
  width: min(100%, 320px);
}

.studio-agent-media-card.is-image.is-openable {
  appearance: none;
  cursor: pointer;
  border: 0;
  padding: 0;
  display: block;
}

.studio-agent-media-card.is-image.is-openable:disabled {
  cursor: default;
}

.studio-agent-media-pending-plate {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  min-height: 120px;
  display: flex;
  position: relative;
}

.studio-agent-media-frame {
  object-fit: cover;
  background: color-mix(in srgb, var(--mos-ink, #111) 6%, transparent);
  border-radius: 10px;
  width: 100%;
  height: 100%;
  max-height: none;
  display: block;
}

.studio-agent-media-card.is-audio {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  width: 100%;
  max-width: 280px;
  display: flex;
}

.studio-agent-media-card.is-audio .studio-chat-audio-player {
  width: 100%;
  min-width: 0;
}

.studio-agent-todo-card {
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 12%, transparent);
  background: color-mix(in srgb, var(--mos-surface, #fff) 92%, var(--mos-ink, #111));
  border-radius: 12px;
  max-width: 420px;
  margin: 8px 0 4px;
  padding: 12px 14px;
}

.studio-agent-todo-kicker, .studio-agent-ask-kicker {
  letter-spacing: .04em;
  text-transform: uppercase;
  opacity: .55;
  margin: 0;
  font-size: 11px;
}

.studio-agent-todo-goal {
  margin: 4px 0 8px;
  font-size: 13px;
  font-weight: 600;
}

.studio-agent-todo-list {
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-agent-todo-list li {
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  line-height: 1.35;
  display: flex;
}

.studio-agent-todo-list li.is-done {
  opacity: .55;
  text-decoration: line-through;
}

.studio-agent-todo-list li.is-doing {
  font-weight: 600;
}

.studio-agent-todo-mark {
  opacity: .7;
  flex: none;
  width: 1em;
}

.studio-agent-ask-card {
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 12%, transparent);
  background: var(--mos-panel);
  box-sizing: border-box;
  border-radius: 10px;
  align-self: stretch;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 1px 2px #0000001f, 0 3px 10px #0000001a;
}

[data-appearance="light"] .studio-agent-ask-card {
  background: var(--mos-panel);
  border: 1px solid #0000001a;
}

[data-appearance="dark"] .studio-agent-ask-card {
  background: var(--mos-panel, var(--mos-plate, #1a1a1e));
}

.studio-agent-ask-head {
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  display: flex;
}

.studio-agent-ask-tabs {
  box-sizing: border-box;
  width: 100%;
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  border-top: 1px solid color-mix(in srgb, var(--mos-ink, #111) 12%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--mos-ink, #111) 12%, transparent);
  scrollbar-width: none;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0 10px;
  display: flex;
  overflow-x: auto;
}

.studio-agent-ask-tabs:first-child {
  border-top: 0;
}

.studio-agent-ask-tabs::-webkit-scrollbar {
  display: none;
}

.studio-agent-ask-tab {
  appearance: none;
  white-space: nowrap;
  font: inherit;
  letter-spacing: .01em;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 3px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 650;
  transition: background .12s, color .12s;
  display: inline-flex;
  overflow: hidden;
}

.studio-agent-ask-tab-index {
  font-variant-numeric: tabular-nums;
}

.studio-agent-ask-tab:hover:not(:disabled):not(.is-active) {
  color: var(--color-cursor-text, var(--mos-ink));
  background: color-mix(in srgb, var(--mos-ink, #111) 6%, transparent);
}

.studio-agent-ask-tab:hover:not(:disabled).is-active {
  background: color-mix(in srgb, var(--mos-ink, #111) 12%, transparent);
}

.studio-agent-ask-tab:disabled {
  cursor: default;
  opacity: .5;
}

.studio-agent-ask-tab.is-answered {
  color: var(--cursor-accent);
}

.studio-agent-ask-tab.is-active {
  color: var(--color-cursor-text, var(--mos-ink));
  background: color-mix(in srgb, var(--mos-ink, #111) 8%, transparent);
}

.studio-agent-ask-tab.is-active.is-answered {
  color: var(--cursor-accent);
  background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
}

.studio-agent-ask-progress {
  opacity: .55;
  font-variant-numeric: tabular-nums;
  margin: 0;
  font-size: 11px;
}

.studio-agent-ask-intro {
  opacity: .72;
  margin: 0;
  padding: 10px 10px 8px;
  font-size: 12px;
  line-height: 1.35;
}

.studio-agent-ask-body {
  padding: 10px 10px 0;
}

.studio-agent-ask-prompt {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.3;
}

.studio-agent-ask-options {
  flex-direction: column;
  gap: 5px;
  display: flex;
}

.studio-agent-ask-option {
  appearance: none;
  box-sizing: border-box;
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 16%, transparent);
  text-align: left;
  width: 100%;
  font: inherit;
  white-space: normal;
  cursor: pointer;
  color: inherit;
  background: none;
  border-radius: 8px;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 9px;
  font-size: 12px;
  line-height: 1.3;
  display: flex;
}

.studio-agent-ask-option.is-selected .studio-agent-ask-option-letter {
  color: var(--cursor-on-accent);
  background: var(--cursor-accent);
}

.studio-agent-ask-option-letter {
  letter-spacing: .02em;
  width: 18px;
  height: 18px;
  color: var(--color-cursor-muted, var(--mos-muted));
  background: color-mix(in srgb, var(--mos-ink, #111) 8%, transparent);
  border-radius: 999px;
  flex: none;
  place-items: center;
  margin-top: 1px;
  font-size: 11px;
  font-weight: 750;
  line-height: 1;
  display: grid;
}

.studio-agent-ask-option-label {
  white-space: normal;
  overflow-wrap: anywhere;
  flex: auto;
  min-width: 0;
}

.studio-agent-ask-option-check {
  color: var(--cursor-accent);
  flex: none;
  margin-top: 2px;
}

.studio-agent-ask-option:hover:not(:disabled) {
  background: color-mix(in srgb, var(--mos-ink, #111) 4%, transparent);
}

.studio-agent-ask-option.is-selected {
  border-color: color-mix(in srgb, var(--cursor-accent) 72%, transparent);
  background: color-mix(in srgb, var(--cursor-accent) 14%, var(--mos-plate, transparent));
  font-weight: 600;
}

.studio-agent-ask-option.is-primary {
  background: color-mix(in srgb, var(--mos-ink, #111) 88%, transparent);
  color: var(--mos-surface, #fff);
  border-color: #0000;
}

.studio-agent-ask-option.is-muted {
  opacity: .8;
  cursor: text;
  border-style: dashed;
}

.studio-agent-ask-custom {
  box-sizing: border-box;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0;
  display: flex;
}

.studio-agent-ask-custom input {
  box-sizing: border-box;
  width: auto;
  min-width: 0;
  color: inherit;
  font: inherit;
  font-size: 12px;
  font-weight: inherit;
  appearance: none;
  border-radius: 0;
  flex: auto;
  margin: 0;
  padding: 0;
  line-height: 1.3;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  outline: none !important;
}

.studio-agent-ask-custom input::placeholder {
  color: var(--color-cursor-muted, var(--mos-muted));
  opacity: .9;
}

.studio-agent-ask-custom input:focus, .studio-agent-ask-custom input:focus-visible {
  box-shadow: none !important;
  border: 0 !important;
  outline: none !important;
}

.studio-agent-ask-custom.is-selected {
  opacity: 1;
}

.studio-agent-ask-nav {
  box-sizing: border-box;
  width: 100%;
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  border-top: 1px solid color-mix(in srgb, var(--mos-ink, #111) 12%, transparent);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin: 8px 0 0;
  padding: 0 10px;
  display: flex;
}

.studio-agent-ask-nav-btn {
  appearance: none;
  color: var(--color-cursor-muted, var(--mos-muted));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  gap: 2px;
  padding: 2px 0;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-agent-ask-nav-btn:disabled {
  opacity: .35;
  cursor: default;
}

.studio-agent-ask-nav-btn.is-next {
  color: var(--color-cursor-text, var(--mos-ink));
}

.studio-agent-ask-summary {
  margin: 0;
  padding: 0 10px 10px 28px;
  font-size: 13px;
}

.studio-agent-ask-card.is-done {
  opacity: 1;
  width: 100%;
  max-width: 100%;
  padding: 0;
  overflow: hidden;
}

.studio-agent-ask-done-hero {
  background: radial-gradient(circle at 92% 8%,
      color-mix(in srgb, var(--cursor-accent, #7cff6b) 24%, transparent),
      transparent 54%),
    radial-gradient(circle at 6% 100%,
      color-mix(in srgb, var(--cursor-accent, #7cff6b) 10%, transparent),
      transparent 46%),
    var(--mos-plate, var(--cursor-surface, #fff));
  padding: 12px 14px;
  position: relative;
  overflow: hidden;
}

.studio-agent-ask-done-watermark {
  width: 88px;
  height: 88px;
  color: var(--cursor-accent, #7cff6b);
  opacity: .2;
  pointer-events: none;
  z-index: 0;
  position: absolute;
  top: 50%;
  right: -10px;
  transform: translateY(-48%)rotate(-8deg);
}

.studio-agent-ask-done-copy {
  z-index: 1;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  padding-right: 52px;
  display: flex;
  position: relative;
}

.studio-agent-ask-done-kicker {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--mos-ink, #111) 48%, transparent);
  margin: 0;
  font-size: 10px;
  font-weight: 700;
}

.studio-agent-ask-done-list {
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-agent-ask-done-list li {
  border: 1px solid color-mix(in srgb, var(--cursor-accent) 28%, var(--color-cursor-border-soft, transparent));
  background: color-mix(in srgb, var(--cursor-accent) 8%, var(--mos-plate, transparent));
  border-radius: 10px;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
  padding: 8px 10px;
  display: flex;
}

.studio-agent-ask-done-check {
  color: var(--cursor-accent);
  flex: none;
  margin-top: 2px;
}

.studio-agent-ask-done-copyline {
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.studio-agent-ask-done-prompt {
  color: var(--color-cursor-muted, var(--mos-muted));
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-size: 11px;
  font-weight: 550;
  line-height: 1.35;
  display: -webkit-box;
  overflow: hidden;
}

.studio-agent-ask-done-value {
  color: var(--color-cursor-text-bright, var(--mos-ink));
  overflow-wrap: anywhere;
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1.35;
}

.studio-agent-ask-card.is-done .studio-agent-ask-kicker {
  margin: 0 0 6px;
}

.studio-agent-ask-card.is-done .studio-agent-ask-summary {
  padding: 0 0 0 18px;
}

.studio-agent-media-caption {
  color: color-mix(in srgb, var(--mos-ink, var(--color-cursor-text)) 62%, transparent);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  line-height: 1.3;
  overflow: hidden;
}

.studio-agent-tool-board {
  background: var(--mos-plate, var(--color-cursor-bg-elevated, transparent));
  border-radius: 10px;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  margin: 2px 0 4px;
  display: flex;
  overflow: hidden;
}

.studio-agent-tool-board-head {
  width: 100%;
  min-height: 28px;
  color: var(--mos-text, var(--color-cursor-text));
  font: inherit;
  font-size: var(--desk-text-xs, 11px);
  letter-spacing: -.01em;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  font-weight: 500;
  display: flex;
}

.studio-agent-tool-board-head:hover {
  background: var(--mos-plate-strong, var(--color-cursor-bg-hover, #7f7f7f14));
}

.studio-agent-tool-board-head-main {
  flex: auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.studio-agent-tool-board-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 0 auto;
  min-width: 0;
  overflow: hidden;
}

.studio-agent-tool-board-query {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  flex: auto;
  font-weight: 400;
  overflow: hidden;
}

.studio-agent-tool-board-count {
  background: var(--mos-plate-strong, #7f7f7f1f);
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  border-radius: 999px;
  flex: none;
  padding: 1px 6px;
  font-size: 10px;
  font-weight: 500;
  line-height: 1.4;
}

.studio-agent-tool-board-chevron {
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  flex: none;
  transition: transform .12s;
}

.studio-agent-tool-board-chevron.is-open {
  transform: rotate(180deg);
}

.studio-agent-tool-board-body {
  border-top: 1px solid var(--mos-hairline, var(--color-cursor-border, #7f7f7f2e));
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.studio-agent-tool-board-search {
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  border-bottom: 1px solid var(--mos-hairline, var(--color-cursor-border, #7f7f7f1f));
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  display: flex;
}

.studio-agent-tool-board-search input {
  min-width: 0;
  color: var(--mos-text, var(--color-cursor-text));
  font: inherit;
  font-size: var(--desk-text-xs, 11px);
  background: none;
  border: 0;
  outline: none;
  flex: auto;
}

.studio-agent-tool-board-search input::placeholder {
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  opacity: .7;
}

.studio-agent-tool-board-list {
  flex-direction: column;
  gap: 2px;
  max-height: 220px;
  margin: 0;
  padding: 4px;
  list-style: none;
  display: flex;
  overflow-y: auto;
}

.studio-agent-tool-board-row {
  width: 100%;
  min-height: 32px;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  padding: 5px 8px;
  display: flex;
}

.studio-agent-tool-board-row:hover:not(:disabled) {
  background: var(--mos-plate-strong, #7f7f7f1a);
}

.studio-agent-tool-board-row:disabled {
  cursor: default;
  opacity: .72;
}

.studio-agent-tool-board-icon {
  border-radius: var(--studio-r-md, 8px);
  background: var(--mos-plate-strong, #7f7f7f1a);
  width: 24px;
  height: 24px;
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  flex: none;
  justify-content: center;
  align-items: center;
  display: flex;
}

.studio-agent-tool-board-icon.is-folder {
  color: #b45309;
  background: #f59e0b29;
}

.studio-agent-tool-board-icon.is-document {
  background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 14%, transparent);
  color: var(--cursor-accent, #4f6ef7);
}

.studio-agent-tool-board-icon.is-asset {
  color: #475569;
  background: #64748b24;
}

.studio-agent-tool-board-icon.is-site {
  color: #047857;
  background: #10b98124;
}

.studio-agent-tool-board-icon.is-person {
  color: #6d28d9;
  background: #8b5cf624;
}

.studio-agent-tool-board-icon.is-element {
  color: #be185d;
  background: #ec489924;
}

[data-appearance="dark"] .studio-agent-tool-board-icon.is-folder, :root:not([data-appearance="light"]) .studio-agent-tool-board-icon.is-folder {
  color: #fbbf24;
  background: #f59e0b38;
}

[data-appearance="dark"] .studio-agent-tool-board-icon.is-document, :root:not([data-appearance="light"]) .studio-agent-tool-board-icon.is-document {
  background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 22%, transparent);
  color: color-mix(in srgb, var(--cursor-accent, #93a9ff) 90%, #fff);
}

[data-appearance="dark"] .studio-agent-tool-board-icon.is-asset, :root:not([data-appearance="light"]) .studio-agent-tool-board-icon.is-asset {
  color: #cbd5e1;
  background: #94a3b82e;
}

[data-appearance="dark"] .studio-agent-tool-board-icon.is-site, :root:not([data-appearance="light"]) .studio-agent-tool-board-icon.is-site {
  color: #34d399;
  background: #10b98138;
}

[data-appearance="dark"] .studio-agent-tool-board-icon.is-person, :root:not([data-appearance="light"]) .studio-agent-tool-board-icon.is-person {
  color: #c4b5fd;
  background: #8b5cf638;
}

[data-appearance="dark"] .studio-agent-tool-board-icon.is-element, :root:not([data-appearance="light"]) .studio-agent-tool-board-icon.is-element {
  color: #f9a8d4;
  background: #ec489938;
}

.studio-agent-tool-board-row-text {
  flex-direction: column;
  flex: auto;
  gap: 1px;
  min-width: 0;
  display: flex;
}

.studio-agent-tool-board-row-title {
  font-size: var(--desk-text-xs, 12px);
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--mos-text, var(--color-cursor-text));
  font-weight: 500;
  overflow: hidden;
}

.studio-agent-tool-board-row-sub {
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  font-size: 10px;
  line-height: 1.3;
  overflow: hidden;
}

.studio-agent-tool-board-empty {
  text-align: center;
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  padding: 12px 8px;
  font-size: 11px;
  font-style: italic;
}

.studio-agent-tool-board-trunc {
  color: var(--mos-text-soft, var(--color-cursor-text-soft));
  margin: 0;
  padding: 4px 10px 8px;
  font-size: 10px;
  line-height: 1.35;
}

.studio-dm-agent-tool-boards {
  box-sizing: border-box;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  min-width: 0;
  padding: 0 4px 6px;
  display: flex;
}

.studio-agent-step-stack {
  flex-direction: column;
  gap: 4px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-agent-ask-answer {
  box-sizing: border-box;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  margin-top: 8px;
  display: flex;
}

.studio-agent-ask-chips {
  flex-wrap: wrap;
  gap: 4px;
  width: 100%;
  display: flex;
}

.studio-agent-ask-chip {
  background: var(--mos-plate-strong, var(--color-cursor-bg-secondary));
  border-radius: 999px;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 3px 4px 3px 8px;
  font-size: 11px;
  line-height: 1.25;
  display: inline-flex;
}

.studio-agent-ask-chip-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-agent-ask-chip-remove {
  appearance: none;
  width: 18px;
  height: 18px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  place-items: center;
  display: grid;
}

.studio-agent-ask-chip-remove:hover {
  background: color-mix(in srgb, var(--mos-ink, #111) 10%, transparent);
}

.studio-agent-ask-answerbar {
  box-sizing: border-box;
  align-items: center;
  gap: 6px;
  width: 100%;
  display: flex;
}

.studio-agent-ask-answerbar input {
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 14%, transparent);
  min-width: 0;
  height: 32px;
  color: inherit;
  font: inherit;
  background: none;
  border-radius: 999px;
  outline: none;
  flex: auto;
  margin: 0;
  padding: 0 12px;
  font-size: 12px;
}

.studio-agent-ask-answerbar input::placeholder {
  color: var(--color-cursor-muted, var(--mos-muted));
  opacity: .9;
}

.studio-agent-ask-answerbar input:focus-visible {
  border-color: var(--cursor-accent, var(--mos-accent));
}

.studio-agent-ask-circlebtn {
  appearance: none;
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 14%, transparent);
  width: 32px;
  height: 32px;
  color: var(--color-cursor-text, var(--mos-ink));
  cursor: pointer;
  background: none;
  border-radius: 999px;
  flex: none;
  place-items: center;
  display: grid;
}

.studio-agent-ask-circlebtn:hover:not(:disabled) {
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
}

.studio-agent-ask-circlebtn:disabled {
  opacity: .35;
  cursor: default;
}

.studio-agent-ask-circlebtn.is-recording {
  color: #e5484d;
  background: #e5484d2e;
  border-color: #0000;
}

.studio-agent-ask-circlebtn.is-send {
  background: var(--cursor-accent, var(--mos-accent));
  color: var(--cursor-on-accent, #fff);
  border-color: #0000;
}

.studio-agent-ask-hint {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 11px;
}

.studio-agent-ask-hint.is-recording {
  color: #e5484d;
}

.studio-agent-ask-hint.is-error {
  color: var(--color-cursor-danger, #e5484d);
}

.studio-agent-task-pill-row {
  flex-direction: column;
  gap: 4px;
  width: 100%;
  min-width: 0;
  margin: 0 0 6px;
  display: flex;
}

.studio-agent-task-meter {
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate);
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  min-height: 32px;
  box-shadow: none;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-agent-task-meter-fill {
  background: color-mix(in srgb, var(--cursor-accent) 22%, var(--mos-plate));
  pointer-events: none;
  width: 0;
  transition: width .28s linear;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.studio-agent-task-meter-edge {
  pointer-events: none;
  background: linear-gradient(to bottom right,
    transparent 0 calc(50% - 1px),
    color-mix(in srgb, var(--cursor-accent) 22%, var(--mos-plate-strong)) calc(50% - 1px) 50%,
    transparent 50%);
  width: 10px;
  position: absolute;
  top: -1px;
  bottom: -1px;
  right: 0;
}

.studio-agent-task-meter-label {
  z-index: 1;
  width: 100%;
  min-width: 0;
  color: var(--mos-text);
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 0 12px 0 14px;
  font-size: .8125rem;
  line-height: 1.35;
  display: flex;
  position: relative;
}

.studio-agent-task-meter-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-weight: 600;
  overflow: hidden;
}

.studio-agent-task-meter-meta {
  color: color-mix(in srgb, var(--mos-text) 58%, transparent);
  font-variant-numeric: tabular-nums;
  flex: none;
  align-items: center;
  gap: 6px;
  font-size: .75rem;
  font-weight: 550;
  display: inline-flex;
}

.studio-agent-task-meter-pct {
  text-align: right;
  min-width: 34px;
}

.studio-agent-task-meter-planning {
  font-style: italic;
}

.studio-agent-task-meter-spin {
  animation: 1.1s linear infinite studio-agent-task-spin;
}

@keyframes studio-agent-task-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-agent-task-meter-fill {
    transition: none;
  }

  .studio-agent-task-meter-spin {
    animation: none;
  }
}

.studio-agent-task-pill-details {
  min-width: 0;
}

.studio-agent-task-pill-list {
  flex-direction: column;
  gap: 3px;
  margin: 2px 0 0;
  padding: 0 4px 0 14px;
  list-style: none;
  display: flex;
}

.studio-agent-task-pill-list li {
  min-width: 0;
  color: color-mix(in srgb, var(--mos-text) 62%, transparent);
  align-items: flex-start;
  gap: 7px;
  font-size: .75rem;
  line-height: 1.4;
  display: flex;
}

.studio-agent-task-pill-check {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate);
  border-radius: 4px;
  flex: none;
  place-items: center;
  width: 13px;
  height: 13px;
  margin-top: 2px;
  line-height: 0;
  display: inline-grid;
}

.studio-agent-task-pill-check.is-done {
  border-color: color-mix(in srgb, var(--cursor-accent) 55%, transparent);
  background: color-mix(in srgb, var(--cursor-accent) 22%, var(--mos-plate));
  color: var(--cursor-on-accent);
}

.studio-agent-task-pill-check.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, transparent);
}

.studio-agent-task-pill-step-text {
  overflow-wrap: anywhere;
  min-width: 0;
}

.studio-agent-task-pill-list li[data-status="done"] .studio-agent-task-pill-step-text {
  color: color-mix(in srgb, var(--mos-text) 42%, transparent);
  text-decoration: line-through;
}

/* [project]/src/studio/components/credit-balance-ring.css [app-client] (css) */
.studio-credit-balance-ring {
  box-sizing: border-box;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  line-height: 0;
  display: inline-flex;
  position: relative;
}

.studio-credit-balance-ring-svg {
  pointer-events: none;
  z-index: 1;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  overflow: visible;
  transform: rotate(-90deg);
}

.studio-credit-balance-ring > .studio-settings-trigger, .studio-credit-balance-ring > .studio-composer-circle-btn {
  width: var(--studio-h-icon, 28px);
  min-width: var(--studio-h-icon, 28px);
  max-width: var(--studio-h-icon, 28px);
  height: var(--studio-h-icon, 28px);
  min-height: var(--studio-h-icon, 28px);
  max-height: var(--studio-h-icon, 28px);
  box-sizing: border-box;
  box-shadow: none !important;
  border-color: #0000 !important;
  border-radius: 999px !important;
}

.studio-polish:not(.is-studio-mobile) .studio-credit-balance-ring > .studio-settings-trigger, .studio-polish:not(.is-studio-mobile) .cursor-workspace-tools .studio-credit-balance-ring > .studio-settings-trigger, .studio-polish.is-studio-mobile .studio-mobile-nav-tools .studio-credit-balance-ring > .studio-settings-trigger, .studio-polish.is-studio-mobile .cursor-workspace-tools .studio-credit-balance-ring > .studio-settings-trigger {
  width: var(--studio-h-icon, 28px) !important;
  min-width: var(--studio-h-icon, 28px) !important;
  max-width: var(--studio-h-icon, 28px) !important;
  height: var(--studio-h-icon, 28px) !important;
  min-height: var(--studio-h-icon, 28px) !important;
  max-height: var(--studio-h-icon, 28px) !important;
  border-radius: 999px !important;
}

.studio-credit-balance-ring-track {
  fill: none;
  stroke: color-mix(in srgb, var(--color-cursor-muted, var(--mos-muted)) 42%, transparent);
  stroke-linecap: butt;
}

.studio-credit-balance-ring-arc, .studio-credit-balance-ring-arc path {
  fill: none;
  stroke: var(--cursor-accent);
  stroke-linecap: butt;
  stroke-linejoin: miter;
  shape-rendering: geometricprecision;
}

.studio-credit-balance-ring-cap {
  fill: var(--cursor-accent);
  stroke: none;
}

[data-appearance="light"] .studio-credit-balance-ring-track {
  stroke: #12141a1f;
}

[data-appearance="dark"] .studio-credit-balance-ring-track {
  stroke: #f2f2f429;
}

.studio-credit-balance-ring.is-chip {
  width: 18px;
  height: 18px;
  padding: 0;
}

.studio-balance-chip {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: radial-gradient(circle at 88% 0%,
      color-mix(in srgb, var(--cursor-accent) 22%, transparent),
      transparent 52%),
    radial-gradient(circle at 8% 100%,
      color-mix(in srgb, var(--cursor-accent) 10%, transparent),
      transparent 44%),
    var(--mos-plate, var(--cursor-surface, var(--mos-panel)));
  width: auto;
  color: var(--color-cursor-text, var(--mos-text));
  border-radius: 12px;
  flex-direction: column;
  flex: none;
  gap: 8px;
  margin: 0;
  padding: 12px 14px;
  display: flex;
  position: relative;
  overflow: visible;
}

.studio-balance-chip-head {
  z-index: 1;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
  position: relative;
}

.studio-balance-chip-title {
  letter-spacing: .06em;
  text-transform: uppercase;
  min-width: 0;
  color: var(--color-cursor-muted, var(--color-cursor-text-secondary, var(--mos-muted)));
  flex: auto;
  font-size: 10px;
  font-weight: 650;
}

.studio-balance-chip-topup {
  border: 1px solid color-mix(in srgb, var(--cursor-accent) 34%, var(--color-cursor-border-soft, var(--mos-border-soft)));
  background: color-mix(in srgb, var(--cursor-accent) 14%, var(--mos-page, var(--color-cursor-panel)));
  height: 26px;
  min-height: 26px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  padding: 0 12px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
}

.studio-balance-chip-topup:hover {
  background: color-mix(in srgb, var(--cursor-accent) 22%, var(--mos-page, var(--color-cursor-panel)));
}

.studio-balance-chip-rows {
  z-index: 1;
  flex-direction: column;
  gap: 6px;
  display: flex;
  position: relative;
}

.studio-balance-chip-row {
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  min-width: 0;
  display: flex;
}

.studio-balance-chip-row span {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 12px;
  font-weight: 500;
}

.studio-balance-chip-row strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  text-align: right;
  font-size: 12px;
  font-weight: 700;
}

.studio-balance-chip-row.is-remaining strong {
  letter-spacing: -.02em;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.05;
}

.studio-mobile-app-menu-scroll:has(.studio-balance-chip) {
  --studio-menu-edge: 16px;
  --studio-menu-balance-mask-h: 8px;
  --studio-menu-balance-gap: 14px;
}

.studio-mobile-app-menu-scroll .studio-balance-chip {
  z-index: 3;
  margin: 8px var(--studio-menu-edge, 16px) 1px;
  flex-shrink: 0;
  width: auto;
  position: relative;
  overflow: visible;
}

.studio-mobile-app-menu-scroll .studio-balance-chip:after {
  content: "";
  left: calc(-1 * var(--studio-menu-edge, 16px));
  right: calc(-1 * var(--studio-menu-edge, 16px));
  height: var(--studio-menu-balance-mask-h, 8px);
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(to bottom,
    color-mix(in srgb, var(--mos-plate) 65%, transparent) 0%,
    transparent 100%);
  position: absolute;
  top: calc(100% + 1px);
}

.studio-mobile-app-menu-sheet.is-desktop-popover .studio-mobile-app-menu-scroll:has(.studio-balance-chip) {
  --studio-menu-edge: 0px;
}

.studio-mobile-app-menu-sheet.is-desktop-popover .studio-balance-chip {
  z-index: 3;
  background: radial-gradient(circle at 88% 0%,
      color-mix(in srgb, var(--cursor-accent) 22%, transparent),
      transparent 52%),
    radial-gradient(circle at 8% 100%,
      color-mix(in srgb, var(--cursor-accent) 10%, transparent),
      transparent 44%),
    var(--mos-plate, var(--cursor-surface, var(--mos-panel)));
  flex-shrink: 0;
  margin: 0;
  position: sticky;
  top: 0;
}

.studio-mobile-app-menu-sheet.is-desktop-popover .studio-balance-chip:after {
  left: 0;
  right: 0;
}

.studio-mobile-app-menu-scroll:has(.studio-balance-chip):before {
  content: none;
  display: none;
}

.studio-mobile-app-menu-scroll:has(.studio-balance-chip) .studio-mobile-app-menu-body.is-app-grid {
  padding: var(--studio-menu-balance-gap, 8px)
    var(--studio-menu-edge, 16px)
    20px;
  flex: auto;
  min-height: 0;
  overflow-y: auto;
}

.studio-mobile-app-menu-sheet.is-desktop-popover .studio-mobile-app-menu-scroll:has(.studio-balance-chip) .studio-mobile-app-menu-body.is-app-grid {
  padding: var(--studio-menu-balance-gap, 8px) 0 20px;
}

/* [project]/src/studio/components/file-reaction-picker.css [app-client] (css) */
.studio-file-reaction-backdrop {
  z-index: 84;
  cursor: pointer;
  background: #00000047;
  border: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  inset: 0;
}

.studio-file-reaction-menu {
  z-index: 720;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  padding: 8px;
  display: flex;
}

.studio-file-reaction-menu .desk-explorer-react-clear {
  width: 100%;
}

.studio-mobile-app-menu-sheet.studio-file-reaction-sheet {
  z-index: 85;
  max-height: min(34vh, 260px);
}

.studio-file-reaction-sheet-body {
  flex-direction: column;
  gap: 8px;
  padding: 2px 14px 16px;
  display: flex;
}

.studio-file-reaction-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  width: 100%;
  max-width: 240px;
  margin: 0 auto;
  display: grid;
}

.studio-file-reaction-emoji {
  appearance: none;
  box-sizing: border-box;
  aspect-ratio: 1;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 50%;
  place-items: center;
  width: 100%;
  min-height: 0;
  font-size: 22px;
  line-height: 1;
  display: grid;
}

.studio-file-reaction-emoji:hover, .studio-file-reaction-emoji.is-active {
  background: none;
  transform: scale(1.12);
}

.studio-file-reaction-clear {
  appearance: none;
  color: color-mix(in srgb, var(--color-cursor-text, #0f172a) 62%, transparent);
  cursor: pointer;
  text-align: center;
  background: none;
  border: 0;
  padding: 4px 4px 0;
  font-size: 12px;
  font-weight: 600;
}

[data-appearance="dark"] .studio-file-reaction-clear, :root:not([data-appearance="light"]) .studio-file-reaction-clear {
  color: #ffffff9e;
}

/* [project]/src/studio/components/generation-status-phrase.css [app-client] (css) */
.studio-gen-status-phrase {
  text-align: center;
  min-width: 9em;
  max-width: 100%;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: .02em;
  will-change: opacity, transform;
  transition: opacity .2s, transform .2s, filter .2s;
  display: inline-block;
}

.studio-gen-status-phrase.is-in {
  opacity: 1;
  filter: blur();
  transform: translateY(0);
}

.studio-gen-status-phrase.is-out {
  opacity: 0;
  filter: blur(2px);
  transform: translateY(3px);
}

@media (prefers-reduced-motion: reduce) {
  .studio-gen-status-phrase {
    transition: none;
    filter: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* [project]/src/studio/components/logo-loader.css [app-client] (css) */
.logo-loader {
  --logo-loader-ring: 56px;
  --logo-loader-mark: 34px;
  --logo-loader-shadow-tight: 0 0 6px #0000001a;
  --logo-loader-shadow-wide: 0 0 22px #00000029,
    0 0 10px #00000017;
  width: var(--logo-loader-ring);
  height: var(--logo-loader-ring);
  background: none;
  border-radius: 999px;
  flex-shrink: 0;
  place-items: center;
  display: grid;
  position: relative;
  overflow: visible;
}

.logo-loader[data-size="sm"] {
  --logo-loader-ring: 40px;
  --logo-loader-mark: 24px;
}

.logo-loader[data-size="md"] {
  --logo-loader-ring: 44px;
  --logo-loader-mark: 28px;
}

.logo-loader[data-size="lg"] {
  --logo-loader-ring: 56px;
  --logo-loader-mark: 34px;
}

.logo-loader-breathe {
  background: none;
  border-radius: 999px;
  place-items: center;
  width: 100%;
  height: 100%;
  animation: 2.6s ease-in-out infinite logo-loader-breathe-scale;
  display: grid;
  position: relative;
  overflow: visible;
}

.logo-loader-aura {
  box-shadow: var(--logo-loader-shadow-wide);
  opacity: .32;
  will-change: transform, opacity;
  background: none;
  border-radius: 50%;
  animation: 2.6s ease-in-out infinite logo-loader-breathe-aura;
  position: absolute;
  inset: 0;
}

.logo-loader-glass {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: color-mix(in srgb, var(--color-cursor-text) 10%, transparent);
  clip-path: circle(50%);
  box-shadow: none;
  opacity: .38;
  pointer-events: none;
  border-radius: 50%;
  animation: 2.6s ease-in-out infinite logo-loader-breathe-fade;
  position: absolute;
  inset: 0;
}

.logo-loader[data-variant="bare"] .logo-loader-glass {
  display: none;
}

.logo-loader[data-variant="bare"] .logo-loader-breathe {
  animation: none;
}

.logo-loader[data-variant="bare"] .logo-loader-aura {
  animation: 2.6s ease-in-out infinite logo-loader-breathe-aura;
}

.logo-loader[data-variant="bare"] .logo-loader-spin {
  animation: 5.5s linear infinite logo-loader-spin, 2.6s ease-in-out infinite logo-loader-breathe-scale;
}

.logo-loader[data-variant="bare"] .logo-loader-mark {
  animation: 2.6s ease-in-out infinite logo-loader-breathe-fade;
}

.logo-loader[data-variant="still"] .logo-loader-breathe, .logo-loader[data-variant="still"] .logo-loader-spin {
  animation: none;
  transform: none;
}

.logo-loader[data-variant="still"] .logo-loader-aura {
  opacity: .7;
  animation: none;
  transform: none;
}

.logo-loader[data-variant="still"] .logo-loader-glass, .logo-loader[data-variant="still"] .logo-loader-mark {
  will-change: auto;
  animation: none;
}

.logo-loader[data-variant="still"] .logo-loader-mark {
  opacity: 1;
}

.logo-loader[data-variant="still"] .logo-loader-spin {
  z-index: 2;
}

.logo-loader-spin {
  z-index: 1;
  width: var(--logo-loader-mark);
  height: var(--logo-loader-mark);
  background: none;
  border-radius: 999px;
  place-items: center;
  animation: 5.5s linear infinite logo-loader-spin;
  display: grid;
  position: relative;
}

.logo-loader-mark {
  width: var(--logo-loader-mark);
  height: var(--logo-loader-mark);
  object-fit: contain;
  opacity: .9;
  filter: drop-shadow(0 0 5px #0000001f);
  background: none;
  animation: 2.6s ease-in-out infinite logo-loader-breathe-fade;
  display: block;
}

@keyframes logo-loader-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes logo-loader-breathe-scale {
  0%, 100% {
    transform: scale(.84);
  }

  50% {
    transform: scale(1);
  }
}

@keyframes logo-loader-breathe-fade {
  0%, 100% {
    opacity: .38;
  }

  50% {
    opacity: 1;
  }
}

@keyframes logo-loader-breathe-aura {
  0%, 100% {
    opacity: .32;
    transform: scale(.96);
  }

  50% {
    opacity: .7;
    transform: scale(1.04);
  }
}

[data-appearance="light"] .logo-loader, .logo-loader[data-appearance="light"] {
  --logo-loader-shadow-tight: 0 0 5px #00000012;
  --logo-loader-shadow-wide: 0 0 20px #0000001f,
    0 0 8px #00000012;
}

[data-appearance="light"] .logo-loader-glass, .logo-loader[data-appearance="light"] .logo-loader-glass {
  background: #ffffff6b;
  border-color: #1b1f241f;
}

[data-appearance="dark"] .logo-loader, .logo-loader[data-appearance="dark"] {
  --logo-loader-shadow-tight: 0 0 6px #0000001f;
  --logo-loader-shadow-wide: 0 0 24px #00000038,
    0 0 10px #0000001f;
}

[data-appearance="dark"] .logo-loader-glass, .logo-loader[data-appearance="dark"] .logo-loader-glass {
  background: #07111f3d;
  border-color: #ffffff24;
}

[data-appearance="light"] .logo-loader-mark, .logo-loader[data-appearance="light"] .logo-loader-mark {
  opacity: .82;
  filter: invert() drop-shadow(0 0 4px #00000014);
}

@media (prefers-reduced-motion: reduce) {
  .logo-loader-spin, .logo-loader-breathe, .logo-loader-aura, .logo-loader-glass, .logo-loader-mark, .logo-loader[data-variant="bare"] .logo-loader-spin, .logo-loader[data-variant="bare"] .logo-loader-mark, .logo-loader[data-variant="bare"] .logo-loader-aura, .logo-loader[data-variant="still"] .logo-loader-spin, .logo-loader[data-variant="still"] .logo-loader-mark, .logo-loader[data-variant="still"] .logo-loader-aura {
    animation: none;
  }

  .logo-loader-breathe, .logo-loader[data-variant="bare"] .logo-loader-spin, .logo-loader-aura {
    transform: none;
  }

  .logo-loader-aura {
    opacity: .55;
  }

  .logo-loader-glass, .logo-loader-mark {
    opacity: .82;
  }
}

/* [project]/src/studio/components/marketplace-offers-pane.css [app-client] (css) */
.marketplace-job-grid {
  grid-template-columns: repeat(auto-fill, minmax(272px, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.marketplace-job-card {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-lg, 10px);
  background: var(--mos-plate, var(--cursor-surface));
  width: 100%;
  height: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  align-content: start;
  gap: 10px;
  padding: 14px;
  transition: background .14s, border-color .14s;
  display: grid;
}

.marketplace-job-card:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 32%,
    var(--color-cursor-border));
  background: var(--mos-hover, var(--color-cursor-hover));
}

.marketplace-job-card-top {
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.marketplace-job-card-title {
  font-size: var(--desk-text-base, 14px);
  overflow-wrap: anywhere;
  color: var(--color-cursor-text-bright, var(--mos-text));
  margin: 0;
  font-weight: 650;
  line-height: 1.3;
}

.marketplace-job-card-sub {
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted);
  overflow-wrap: anywhere;
  margin: 2px 0 0;
  font-weight: 600;
}

.marketplace-job-card-price {
  font-size: var(--desk-text-ui, 13px);
  white-space: nowrap;
  color: var(--color-cursor-text-bright, var(--mos-text));
  flex-direction: column;
  flex: none;
  align-items: flex-end;
  font-weight: 700;
  line-height: 1.15;
  display: inline-flex;
}

.marketplace-job-card-price > em {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}

.studio-admin-panel .public-offers-card:focus-visible {
  box-shadow: var(--studio-focus-ring, 0 0 0 3px color-mix(in srgb, var(--cursor-accent) 16%, transparent));
  outline: none;
}

.marketplace-offer-card-link {
  color: var(--cursor-accent, var(--mos-accent));
  text-decoration: none;
}

.marketplace-offer-card-link:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 40%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 10%, transparent);
}

.marketplace-job-card-meta {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  display: flex;
}

.marketplace-job-chip {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  color: var(--color-cursor-muted);
  font-size: var(--desk-text-xs, 11px);
  white-space: nowrap;
  align-items: center;
  gap: 5px;
  padding: 4px 9px;
  font-weight: 650;
  line-height: 1.2;
  display: inline-flex;
}

.marketplace-job-chip svg {
  flex: none;
  width: 12px;
  height: 12px;
}

.studio-admin-head-tab {
  gap: 6px;
}

span.studio-admin-head-tab, .studio-admin-head-tab:disabled {
  cursor: default;
}

.marketplace-offers-head-action {
  flex: none;
  align-items: center;
  margin-left: auto;
  padding-left: 8px;
  display: flex;
}

.marketplace-offers-summary {
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  margin: 0 -4px;
  padding: 0 4px 2px;
  display: flex;
  overflow: auto hidden;
}

.marketplace-offers-summary::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.marketplace-offers-summary-chip {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate, var(--cursor-surface));
  white-space: nowrap;
  flex: none;
  align-items: baseline;
  gap: 8px;
  padding: 8px 14px;
  display: inline-flex;
}

.marketplace-offers-summary-value {
  color: var(--color-cursor-text-bright);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}

.marketplace-offers-summary-label {
  color: var(--color-cursor-muted);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
}

.marketplace-offers-bar-action {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--cursor-surface-raised);
  height: 26px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 650;
  transition: border-color .16s, background .16s;
  display: inline-flex;
}

.marketplace-offers-bar-action:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 40%,
    var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
}

.marketplace-offers-bar-note {
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 600;
}

.marketplace-offers-table-empty {
  padding: 14px 12px;
}

.marketplace-offers-link {
  margin: 0 0 12px;
  font-size: 12px;
}

.marketplace-offers-link a {
  color: var(--cursor-accent);
  font-weight: 650;
  text-decoration: none;
}

.marketplace-offers-public-link {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  min-height: 30px;
  color: var(--color-cursor-text-bright);
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
  transition: border-color .16s, background .16s;
  display: flex;
}

.marketplace-offers-public-link > svg {
  width: 13px;
  height: 13px;
  color: var(--color-cursor-muted);
  stroke-width: 1.75px;
  flex: none;
}

.marketplace-offers-public-link-url {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  flex: auto;
  min-width: 0;
  overflow: hidden;
}

.marketplace-offers-public-link-cta {
  color: var(--cursor-accent);
  flex: none;
  font-weight: 700;
}

a.marketplace-offers-public-link:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 40%,
    var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
}

.marketplace-offers-public-link.is-idle {
  color: var(--color-cursor-muted);
  background: none;
  font-weight: 600;
}

.marketplace-field {
  gap: 4px;
  min-width: 0;
  display: grid;
}

.marketplace-field-label {
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 650;
}

.marketplace-field-hint {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.marketplace-offers-hint {
  border: 1px dashed var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm, 6px);
  min-height: 32px;
  color: var(--color-cursor-muted);
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 600;
  display: flex;
}

.marketplace-offers-hint > svg {
  stroke-width: 1.75px;
  flex: none;
  width: 13px;
  height: 13px;
}

.marketplace-offers-footer {
  border-top: 1px solid var(--color-cursor-border-soft);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  display: flex;
}

.marketplace-offers-footer-note {
  min-width: 0;
  color: var(--color-cursor-muted);
  margin: 0;
  font-size: 11px;
  font-weight: 600;
}

.marketplace-offers-footer .marketplace-offers-actions {
  margin-top: 0;
}

.marketplace-offers-stars {
  color: var(--color-cursor-muted);
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  display: flex;
}

.marketplace-offers-stars .is-filled, .marketplace-offers-stars button.is-filled {
  color: var(--cursor-accent);
}

.marketplace-offers-stars.is-interactive button {
  border-radius: var(--cursor-radius-sm, 6px);
  width: 28px;
  height: 28px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.marketplace-offers-stars.is-interactive button:hover, .marketplace-offers-stars.is-interactive button.is-filled {
  color: var(--cursor-accent);
  background: color-mix(in srgb, var(--cursor-accent) 10%, transparent);
}

.marketplace-offers-review-body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 10px 0 0;
  font-size: 13px;
  line-height: 1.5;
}

.marketplace-offers-packages {
  gap: 12px;
  display: grid;
}

.marketplace-offers-pkg-empty {
  justify-items: start;
  gap: 12px;
  display: grid;
}

.marketplace-offers-pkg-tabs {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.marketplace-offers-pkg-tab {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--cursor-surface-raised);
  min-width: 0;
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  text-align: left;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 650;
  transition: border-color .16s, background .16s, color .16s;
  display: inline-flex;
}

.marketplace-offers-pkg-tab strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
}

.marketplace-offers-pkg-tab span {
  font-variant-numeric: tabular-nums;
  color: inherit;
  font-size: 11px;
  font-weight: 600;
}

.marketplace-offers-pkg-tab:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 36%,
    var(--color-cursor-border-soft));
  color: var(--color-cursor-text, var(--mos-text));
  background: var(--color-cursor-hover);
}

.marketplace-offers-pkg-tab.is-active {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 12%, transparent);
  color: var(--color-cursor-text, var(--mos-text));
}

.marketplace-offers-pkg-tab.is-add {
  flex-direction: row;
  align-self: stretch;
  align-items: center;
  gap: 6px;
}

.marketplace-offers-pkg-panel {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-lg, 10px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  gap: 8px;
  padding: 12px;
  display: grid;
}

.marketplace-offers-package-head {
  align-items: center;
  gap: 8px;
  display: flex;
}

.marketplace-offers-package-head > :first-child {
  flex: auto;
  min-width: 0;
}

.marketplace-offers-media {
  gap: 14px;
  display: grid;
}

.marketplace-media-slot {
  border: 1px dashed var(--color-cursor-border);
  border-radius: var(--cursor-radius-md, 8px);
  background: color-mix(in srgb, var(--mos-surface) 40%, transparent);
  min-height: 96px;
  color: var(--color-cursor-muted);
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 12px;
  transition: border-color .16s, background .16s;
  display: flex;
}

.marketplace-media-slot.is-tile {
  height: 100%;
  min-height: 0;
  padding: 8px;
}

.marketplace-media-slot.is-drop-target, .marketplace-media-banner.is-drop-target {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border));
  background: color-mix(in srgb, var(--cursor-accent) 10%, transparent);
  color: var(--color-cursor-text-bright);
}

.marketplace-media-slot-icon {
  stroke-width: 1.5px;
  width: 18px;
  height: 18px;
}

.marketplace-media-slot-hint {
  font-size: 11px;
  font-weight: 600;
}

.marketplace-media-pick-btn {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  min-height: 28px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  cursor: pointer;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.marketplace-media-pick-btn > svg {
  stroke-width: 1.75px;
  width: 13px;
  height: 13px;
}

.marketplace-media-banner {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: color-mix(in srgb, var(--mos-text-bright, #fff) 4%, transparent);
  position: relative;
  overflow: hidden;
}

.marketplace-media-banner > img, .marketplace-media-banner-blank {
  object-fit: cover;
  width: 100%;
  height: 140px;
  display: block;
}

.marketplace-media-banner-bar {
  border-top: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  min-height: 30px;
  color: var(--color-cursor-text-bright);
  align-items: center;
  gap: 8px;
  padding: 0 6px 0 10px;
  font-size: 11px;
  font-weight: 600;
  display: flex;
}

.marketplace-media-banner-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  min-width: 0;
  overflow: hidden;
}

.marketplace-media-mini-btn {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-pill, 999px);
  color: inherit;
  font: inherit;
  cursor: pointer;
  background: none;
  flex: none;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 650;
}

.marketplace-media-remove {
  border-radius: var(--cursor-radius-pill, 999px);
  width: 20px;
  height: 20px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
  justify-content: center;
  align-items: center;
  transition: color .16s, background .16s;
  display: inline-flex;
}

.marketplace-media-remove > svg {
  stroke-width: 2px;
  width: 12px;
  height: 12px;
}

.marketplace-media-remove:hover {
  color: var(--mos-danger, #f87171);
  background: color-mix(in srgb, var(--mos-danger, #f87171) 12%, transparent);
}

.marketplace-media-gallery {
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 8px;
  display: grid;
}

.marketplace-media-tile {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 10px);
  color: var(--color-cursor-muted);
  background: none;
  gap: 4px;
  padding: 6px;
  font-size: 10px;
  display: grid;
  position: relative;
}

.marketplace-media-tile > img, .marketplace-media-tile-blank, .marketplace-media-tile .marketplace-media-tile-video, .marketplace-media-tile .desk-file-thumb-video-wrap {
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: var(--cursor-radius-sm, 6px);
  border: 1px solid var(--color-cursor-border-soft);
  background: color-mix(in srgb, var(--mos-text-bright, #fff) 4%, transparent);
  width: 100%;
  height: auto;
  display: block;
}

.marketplace-media-tile .desk-file-thumb-video-wrap {
  position: relative;
  overflow: hidden;
}

.marketplace-media-tile .desk-file-thumb-video-wrap.is-portrait video, .marketplace-media-tile .desk-file-thumb-video-wrap video {
  object-fit: contain;
  background: var(--mos-page, var(--mos-bg));
}

.marketplace-media-tile-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.marketplace-media-remove.is-overlay {
  background: color-mix(in srgb, var(--mos-page) 78%, transparent);
  color: var(--color-cursor-text-bright);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  position: absolute;
  top: 9px;
  right: 9px;
}

.marketplace-offers-media-label {
  color: var(--color-cursor-muted);
  align-items: center;
  gap: 6px;
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 650;
  display: flex;
}

.marketplace-offers-actions {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  display: flex;
}

.marketplace-offers-actions button {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--cursor-surface-raised);
  color: var(--color-cursor-text-bright);
  font: inherit;
  cursor: pointer;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 650;
  transition: border-color .16s, background .16s;
  display: inline-flex;
}

.marketplace-offers-actions button:hover:not(:disabled) {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 40%,
    var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
}

.marketplace-offers-actions button.is-primary {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 42%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
}

.marketplace-offers-actions button.is-danger {
  color: color-mix(in srgb,
    var(--mos-danger, #f87171) 82%,
    var(--color-cursor-text-bright));
}

.marketplace-offers-actions button.is-danger:hover:not(:disabled) {
  border-color: color-mix(in srgb,
    var(--mos-danger, #f87171) 44%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--mos-danger, #f87171) 12%, transparent);
}

.marketplace-offers-actions button:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.marketplace-offers-timeline {
  gap: 8px;
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.marketplace-offers-timeline li {
  border-left: 2px solid
    color-mix(in srgb,
      var(--cursor-accent) 34%,
      var(--color-cursor-border-soft));
  gap: 2px;
  padding: 2px 0 2px 10px;
  display: grid;
}

.marketplace-offers-timeline strong {
  color: var(--color-cursor-text-bright);
  text-transform: capitalize;
  font-size: 12px;
  font-weight: 650;
}

.marketplace-offers-timeline span, .marketplace-offers-timeline time {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.marketplace-offers-deliverables {
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.marketplace-offers-deliverables li {
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.marketplace-offers-deliverables img, .marketplace-offers-thumb {
  border-radius: var(--cursor-radius-sm, 6px);
  border: 1px solid var(--color-cursor-border-soft);
  background: color-mix(in srgb, var(--mos-text-bright, #fff) 4%, transparent);
  object-fit: cover;
  flex: none;
  width: 44px;
  height: 44px;
}

.marketplace-offers-deliverables a, .marketplace-offers-deliverables > li > div > span {
  color: var(--color-cursor-text-bright);
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
}

.marketplace-offers-deliverables a {
  color: var(--cursor-accent);
}

.marketplace-offers-deliverables p {
  color: var(--color-cursor-muted);
  margin: 2px 0 0;
  font-size: 11px;
}

.marketplace-offers-asset-grid {
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 8px;
  margin-bottom: 12px;
  display: grid;
}

.marketplace-offers-asset-grid button {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 10px);
  color: var(--color-cursor-muted);
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  gap: 4px;
  padding: 6px;
  font-size: 10px;
  transition: border-color .16s, background .16s;
  display: grid;
}

.marketplace-offers-asset-grid button.is-selected {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
  color: var(--color-cursor-text-bright);
}

.marketplace-offers-asset-grid button img, .marketplace-offers-asset-grid button .marketplace-offers-thumb {
  border-radius: var(--cursor-radius-sm, 6px);
  width: 100%;
  height: 64px;
}

.marketplace-offers-asset-grid button > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.marketplace-apply-pane {
  background: var(--mos-bg, var(--color-cursor-bg, #05080f));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  isolation: isolate;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 0;
  display: flex;
}

[data-appearance="light"] .marketplace-apply-pane {
  background: var(--mos-panel);
}

.marketplace-apply-head {
  height: var(--cursor-head-h);
  min-height: var(--cursor-head-h);
  border-bottom: 1px solid
    var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: none;
  align-items: center;
  padding: 0 12px;
  display: flex;
}

.marketplace-apply-steps {
  height: var(--cursor-head-h);
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  align-items: center;
  gap: 6px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  overflow: auto hidden;
}

.marketplace-apply-steps::-webkit-scrollbar {
  display: none;
}

.marketplace-apply-steps li {
  flex: none;
}

.marketplace-apply-step {
  min-height: 24px;
  color: var(--color-cursor-muted);
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 600;
  transition: color .16s, border-color .16s, background .16s;
  display: inline-flex;
}

.marketplace-apply-step:disabled {
  cursor: default;
  opacity: .55;
}

.marketplace-apply-step:not(:disabled):hover {
  color: var(--color-cursor-text-bright);
}

.marketplace-apply-steps li.is-current .marketplace-apply-step {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 42%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
  color: var(--color-cursor-text-bright);
  opacity: 1;
}

.marketplace-apply-step-dot {
  opacity: .55;
  background: currentColor;
  border-radius: 50%;
  width: 5px;
  height: 5px;
}

.marketplace-apply-steps li.is-done .marketplace-apply-step {
  color: color-mix(in srgb,
    var(--cursor-accent) 70%,
    var(--color-cursor-text-bright));
  opacity: 1;
}

.marketplace-apply-steps li.is-done .marketplace-apply-step svg {
  width: 12px;
  height: 12px;
  color: var(--cursor-accent);
}

.marketplace-apply-body {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  padding: 20px 16px 28px;
  display: flex;
  overflow-y: auto;
}

.marketplace-apply-stage {
  flex-direction: column;
  align-items: center;
  gap: 18px;
  width: min(100%, 420px);
  margin: auto;
  display: flex;
}

.marketplace-apply-intro {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 100%;
  display: flex;
}

.marketplace-apply-intro-icon {
  width: 30px;
  height: 30px;
  color: color-mix(in srgb,
    var(--cursor-accent) 80%,
    var(--color-cursor-text-bright));
  stroke-width: 1.75px;
  margin-bottom: 4px;
}

.marketplace-apply-intro h2 {
  color: var(--color-cursor-text-bright);
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
}

.marketplace-apply-intro p {
  color: var(--color-cursor-muted);
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
}

.marketplace-apply-options {
  flex-direction: column;
  gap: 12px;
  width: 100%;
  display: flex;
}

.marketplace-entity-visuals {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  width: 100%;
  display: grid;
}

.marketplace-entity-visuals button {
  aspect-ratio: 1;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-surface-raised);
  width: 100%;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-align: center;
  border-radius: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 12px 10px;
  transition: border-color .16s, background .16s;
  display: flex;
}

[data-appearance="light"] .marketplace-entity-visuals button {
  background: var(--mos-bg);
}

.marketplace-entity-visuals button:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 35%,
    var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
}

[data-appearance="light"] .marketplace-entity-visuals button:hover {
  background: color-mix(in srgb,
    var(--cursor-accent) 6%,
    var(--mos-bg));
}

.marketplace-entity-visuals button.is-active {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb,
    var(--cursor-accent) 14%,
    var(--cursor-surface-raised));
}

[data-appearance="light"] .marketplace-entity-visuals button.is-active {
  background: color-mix(in srgb,
    var(--cursor-accent) 14%,
    var(--mos-bg));
}

.marketplace-entity-visual-icon {
  width: 36px;
  height: 36px;
  color: color-mix(in srgb,
    var(--cursor-accent) 80%,
    var(--color-cursor-text-bright));
  stroke-width: 1.75px;
}

.marketplace-entity-visuals button.is-active .marketplace-entity-visual-icon {
  color: var(--cursor-accent);
}

.marketplace-entity-visuals button strong {
  color: var(--color-cursor-text-bright);
  font-size: 14px;
  font-weight: 650;
}

.marketplace-entity-visuals button > strong + span {
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 500;
}

.marketplace-choice-field {
  flex-direction: column;
  gap: 8px;
  width: 100%;
  display: flex;
}

.marketplace-choice-field-label {
  color: var(--color-cursor-muted);
  font-size: 12px;
  font-weight: 600;
}

.marketplace-choice-grid {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  width: 100%;
  display: grid;
}

.marketplace-choice-grid.is-one {
  grid-template-columns: 1fr;
}

.marketplace-choice-grid.is-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.marketplace-choice-grid.is-4 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.marketplace-choice-card {
  aspect-ratio: 1;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-surface-raised);
  width: 100%;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-align: center;
  border-radius: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 12px 10px;
  transition: border-color .16s, background .16s;
  display: flex;
  position: relative;
}

[data-appearance="light"] .marketplace-choice-card {
  background: var(--mos-bg);
}

.marketplace-choice-card:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 35%,
    var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
}

[data-appearance="light"] .marketplace-choice-card:hover {
  background: color-mix(in srgb,
    var(--cursor-accent) 6%,
    var(--mos-bg));
}

.marketplace-choice-card.is-active {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb,
    var(--cursor-accent) 14%,
    var(--cursor-surface-raised));
}

[data-appearance="light"] .marketplace-choice-card.is-active {
  background: color-mix(in srgb,
    var(--cursor-accent) 14%,
    var(--mos-bg));
}

.marketplace-choice-card-icon {
  color: color-mix(in srgb,
    var(--cursor-accent) 80%,
    var(--color-cursor-text-bright));
  justify-content: center;
  align-items: center;
  margin-bottom: 2px;
  display: inline-flex;
  position: relative;
}

.marketplace-choice-card-icon svg {
  stroke-width: 1.75px;
  width: 28px;
  height: 28px;
}

.marketplace-choice-card.is-active .marketplace-choice-card-icon {
  color: var(--cursor-accent);
}

.marketplace-choice-card-check {
  background: var(--cursor-accent);
  color: var(--mos-bg, #05080f);
  stroke-width: 2.5px;
  border-radius: 999px;
  padding: 2px;
  position: absolute;
  top: -6px;
  right: -10px;
  width: 14px !important;
  height: 14px !important;
}

.marketplace-choice-card strong {
  color: var(--color-cursor-text-bright);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.2;
}

.marketplace-choice-card > strong + span {
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.3;
}

.marketplace-choice-field.is-error .marketplace-choice-card.is-active {
  border-color: color-mix(in srgb,
    var(--marketplace-status-warn, #f59e0b) 52%,
    var(--color-cursor-border-soft));
}

@media (max-width: 420px) {
  .marketplace-choice-grid.is-3 {
    grid-template-columns: 1fr 1fr;
  }
}

.marketplace-profile-fields {
  flex-direction: column;
  gap: 10px;
  width: 100%;
  display: flex;
}

.marketplace-field-wrap {
  flex-direction: column;
  gap: 4px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.marketplace-optional-row {
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  width: 100%;
  display: grid;
}

.marketplace-volume-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 24px;
  align-items: center;
  gap: 8px;
  width: 100%;
  display: grid;
}

.marketplace-icon-input {
  border-radius: var(--cursor-radius-md, 10px);
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-surface-raised);
  width: 100%;
  min-width: 0;
  min-height: 40px;
  color: var(--color-cursor-text);
  cursor: text;
  box-sizing: border-box;
  transition: border-color var(--cursor-ease, .16s ease),
    background var(--cursor-ease, .16s ease),
    box-shadow var(--cursor-ease, .16s ease);
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  display: flex;
  position: relative;
}

.studio-chrome-field .marketplace-icon-input {
  margin: 0;
}

[data-appearance="light"] .marketplace-icon-input {
  background: var(--mos-bg);
}

.marketplace-icon-input.is-multiline {
  align-items: flex-start;
  padding-top: 10px;
  padding-bottom: 10px;
}

.marketplace-icon-input:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 26%,
    var(--color-cursor-border-soft));
}

.marketplace-icon-input:focus-within {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 40%,
    var(--color-cursor-border-soft));
  box-shadow: 0 0 0 2px
    color-mix(in srgb, var(--cursor-accent) 16%, transparent);
}

.marketplace-icon-input-glyph {
  width: 15px;
  height: 15px;
  color: var(--color-cursor-muted);
  stroke-width: 1.75px;
  flex: none;
}

.marketplace-icon-input:focus-within .marketplace-icon-input-glyph {
  color: color-mix(in srgb,
    var(--cursor-accent) 70%,
    var(--color-cursor-text-bright));
}

.marketplace-icon-input-field {
  width: 100%;
  min-width: 0;
  color: var(--color-cursor-text-bright);
  font: inherit;
  font-size: var(--desk-text-ui, 13px);
  background: none;
  border: 0;
  outline: none;
  flex: auto;
  padding: 0;
  line-height: 1.45;
}

.marketplace-icon-input.is-multiline .marketplace-icon-input-field {
  resize: vertical;
  min-height: 68px;
}

.marketplace-icon-input-field::placeholder {
  color: var(--color-cursor-muted);
  opacity: 1;
}

.marketplace-icon-input-field:-webkit-autofill {
  -webkit-text-fill-color: var(--color-cursor-text-bright);
  -webkit-box-shadow: 0 0 0 1000px var(--cursor-surface-raised) inset;
  caret-color: var(--color-cursor-text-bright);
  transition: background-color 100000s ease-in-out;
}

.marketplace-icon-input-field:-webkit-autofill:hover {
  -webkit-text-fill-color: var(--color-cursor-text-bright);
  -webkit-box-shadow: 0 0 0 1000px var(--cursor-surface-raised) inset;
  caret-color: var(--color-cursor-text-bright);
  transition: background-color 100000s ease-in-out;
}

.marketplace-icon-input-field:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--color-cursor-text-bright);
  -webkit-box-shadow: 0 0 0 1000px var(--cursor-surface-raised) inset;
  caret-color: var(--color-cursor-text-bright);
  transition: background-color 100000s ease-in-out;
}

[data-appearance="light"] .marketplace-icon-input-field:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--mos-bg) inset;
}

[data-appearance="light"] .marketplace-icon-input-field:-webkit-autofill:hover {
  -webkit-box-shadow: 0 0 0 1000px var(--mos-bg) inset;
}

[data-appearance="light"] .marketplace-icon-input-field:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--mos-bg) inset;
}

.marketplace-field-wrap.is-error .marketplace-icon-input {
  border-color: color-mix(in srgb,
    var(--marketplace-status-warn, #f59e0b) 52%,
    var(--color-cursor-border-soft));
}

.marketplace-field-error {
  color: color-mix(in srgb, var(--mos-danger, #f87171) 88%, var(--color-cursor-text));
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.35;
}

.marketplace-doc-grid {
  grid-template-columns: 1fr;
  gap: 10px;
  width: 100%;
  display: grid;
}

@media (min-width: 520px) {
  .marketplace-doc-grid:not(.marketplace-doc-grid-single) {
    grid-template-columns: 1fr 1fr;
  }
}

.marketplace-doc-card-wrap {
  flex-direction: column;
  gap: 6px;
  width: 100%;
  display: flex;
}

.marketplace-doc-card {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-surface-raised);
  cursor: pointer;
  text-align: center;
  border-radius: 16px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-height: 140px;
  padding: 18px 12px;
  transition: border-color .16s, background .16s;
  display: flex;
  position: relative;
}

[data-appearance="light"] .marketplace-doc-card {
  background: var(--mos-bg);
}

.marketplace-doc-card:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 35%,
    var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
}

[data-appearance="light"] .marketplace-doc-card:hover {
  background: color-mix(in srgb,
    var(--cursor-accent) 6%,
    var(--mos-bg));
}

.marketplace-doc-card.is-ready {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb,
    var(--cursor-accent) 14%,
    var(--cursor-surface-raised));
}

[data-appearance="light"] .marketplace-doc-card.is-ready {
  background: color-mix(in srgb,
    var(--cursor-accent) 14%,
    var(--mos-bg));
}

.marketplace-doc-card.is-uploading {
  opacity: .72;
  pointer-events: none;
}

.marketplace-doc-card-wrap.is-error .marketplace-doc-card {
  border-color: color-mix(in srgb,
    var(--marketplace-status-warn, #f59e0b) 52%,
    var(--color-cursor-border-soft));
}

.marketplace-doc-card-glyph {
  color: color-mix(in srgb,
    var(--cursor-accent) 80%,
    var(--color-cursor-text-bright));
  justify-content: center;
  align-items: center;
  margin-bottom: 4px;
  display: inline-flex;
}

.marketplace-doc-card-glyph svg {
  stroke-width: 1.75px;
  width: 28px;
  height: 28px;
}

.marketplace-doc-card.is-ready .marketplace-doc-card-glyph {
  color: var(--cursor-accent);
}

.marketplace-doc-card-title {
  color: var(--color-cursor-text-bright);
  font-size: 13px;
  font-weight: 650;
}

.marketplace-doc-card-tip, .marketplace-doc-card-status {
  max-width: 100%;
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
}

.marketplace-doc-card-status {
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 2px;
  overflow: hidden;
}

.marketplace-doc-card-clear {
  color: var(--color-cursor-muted);
  font: inherit;
  text-underline-offset: 2px;
  cursor: pointer;
  background: none;
  border: 0;
  align-self: center;
  padding: 0;
  font-size: 11px;
  font-weight: 600;
  text-decoration: underline;
}

.marketplace-doc-card-clear:hover {
  color: color-mix(in srgb,
    var(--marketplace-status-warn, #f59e0b) 75%,
    var(--color-cursor-text-bright));
}

.marketplace-file-input-hidden {
  opacity: 0;
  cursor: pointer;
  position: absolute;
  inset: 0;
}

.marketplace-identity-flow {
  flex-direction: column;
  gap: 12px;
  width: 100%;
  display: flex;
}

.marketplace-identity-picked, .marketplace-identity-done {
  width: 100%;
  min-height: 32px;
  color: var(--color-cursor-text-bright);
  align-items: center;
  gap: 8px;
  padding: 0 2px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
}

.marketplace-identity-done {
  color: color-mix(in srgb,
    var(--cursor-accent) 70%,
    var(--color-cursor-text-bright));
}

.marketplace-identity-done svg {
  color: var(--cursor-accent);
  flex-shrink: 0;
}

.marketplace-identity-sides {
  color: var(--color-cursor-muted);
  font-size: 12px;
  font-weight: 500;
}

.marketplace-identity-change {
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  margin-left: auto;
  padding: 0;
  font-size: 12px;
  font-weight: 600;
}

.marketplace-identity-change:hover {
  color: var(--color-cursor-text-bright);
}

.marketplace-review-stack {
  flex-direction: column;
  gap: 14px;
  width: 100%;
  display: flex;
}

.marketplace-review-checklist {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-surface-raised);
  border-radius: 14px;
  flex-direction: column;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  overflow: hidden;
}

[data-appearance="light"] .marketplace-review-checklist {
  background: var(--mos-bg);
}

.marketplace-review-checklist li {
  border-bottom: 1px solid
    var(--studio-chrome-divider, var(--color-cursor-border-soft));
}

.marketplace-review-checklist li:last-child {
  border-bottom: 0;
}

.marketplace-review-checklist li button {
  width: 100%;
  min-height: 40px;
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  text-align: left;
  background: none;
  border: 0;
  border-radius: 0;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.marketplace-review-checklist li button:hover {
  background: color-mix(in srgb, var(--cursor-accent) 8%, transparent);
}

.marketplace-review-checklist li button > span:first-child {
  min-width: 0;
  color: var(--color-cursor-text-bright);
  align-items: center;
  gap: 8px;
  display: inline-flex;
}

.marketplace-review-checklist li button > span:last-child {
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 600;
}

.marketplace-review-checklist li.is-ok button svg {
  color: var(--cursor-accent);
}

.marketplace-review-checklist li.is-missing button > span:last-child {
  color: color-mix(in srgb,
    var(--marketplace-status-warn, #f59e0b) 80%,
    var(--color-cursor-text));
}

.marketplace-review-list {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-surface-raised);
  border-radius: 14px;
  flex-direction: column;
  width: 100%;
  margin: 0;
  display: flex;
  overflow: hidden;
}

[data-appearance="light"] .marketplace-review-list {
  background: var(--mos-bg);
}

.marketplace-review-row {
  border-bottom: 1px solid
    var(--studio-chrome-divider, var(--color-cursor-border-soft));
  grid-template-columns: minmax(96px, 34%) minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  display: grid;
}

.marketplace-review-row:last-child {
  border-bottom: 0;
}

.marketplace-review-row dt {
  color: var(--color-cursor-muted);
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  display: inline-flex;
}

.marketplace-review-row dt svg {
  color: var(--color-cursor-muted);
  flex: none;
}

.marketplace-review-row dd {
  min-width: 0;
  color: var(--color-cursor-text-bright);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.marketplace-review-row dd > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.marketplace-review-edit {
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
  padding: 0;
  font-size: 11px;
  font-weight: 600;
}

.marketplace-review-edit:hover {
  color: var(--color-cursor-text-bright);
}

.marketplace-draft-cue {
  border: 1px solid
    color-mix(in srgb, var(--color-cursor-border-soft) 75%, transparent);
  background: var(--cursor-surface-raised);
  width: 100%;
  color: var(--color-cursor-muted);
  border-radius: 12px;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px 12px;
  margin: 0;
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 500;
  display: flex;
}

[data-appearance="light"] .marketplace-draft-cue {
  background: var(--mos-bg);
}

.marketplace-draft-cue p {
  margin: 0;
}

.marketplace-draft-cue-actions {
  align-items: center;
  gap: 10px;
  display: inline-flex;
}

.marketplace-draft-cue button {
  color: var(--color-cursor-text-bright);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  font-size: 11px;
  font-weight: 650;
}

.marketplace-draft-cue button:hover {
  color: var(--cursor-accent);
}

.marketplace-apply-nav {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin-top: 2px;
  display: flex;
}

.marketplace-apply-nav .marketplace-nav-spacer {
  flex: auto;
}

.marketplace-apply-nav button {
  border: 1px solid var(--color-cursor-border-soft);
  min-height: 34px;
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  background: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 600;
  transition: border-color .16s, background .16s, color .16s;
  display: inline-flex;
}

.marketplace-apply-nav button:hover:not(:disabled) {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 35%,
    var(--color-cursor-border-soft));
  color: var(--color-cursor-text-bright);
}

.marketplace-apply-nav button:disabled {
  opacity: .55;
  cursor: default;
}

.marketplace-apply-nav button.is-primary {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 34%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  color: var(--color-cursor-text-bright);
  font-weight: var(--studio-save-weight, 700);
  margin-left: auto;
}

.marketplace-apply-nav button.is-primary:hover:not(:disabled) {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 22%, transparent);
  color: var(--color-cursor-text-bright);
}

.marketplace-apply-nav button:disabled {
  cursor: not-allowed;
}

.marketplace-apply-nav button svg {
  width: 14px;
  height: 14px;
}

.marketplace-apply-pane .marketplace-apply-step:focus-visible, .marketplace-apply-pane .marketplace-choice-card:focus-visible, .marketplace-apply-pane .marketplace-doc-card:focus-within, .marketplace-apply-pane .marketplace-entity-visuals button:focus-visible, .marketplace-apply-pane .marketplace-apply-nav button:focus-visible, .marketplace-apply-pane .marketplace-review-checklist li button:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent) 55%, transparent);
  outline-offset: 2px;
}

@media (max-width: 640px) {
  .marketplace-optional-row {
    grid-template-columns: 1fr;
  }

  .marketplace-volume-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 24px;
  }

  .marketplace-review-row {
    grid-template-columns: 1fr;
    gap: 2px;
  }
}

.marketplace-status-chip {
  border: 1px solid
    color-mix(in srgb,
      var(--cursor-accent) 34%,
      var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 12%, transparent);
  min-height: 22px;
  color: var(--color-cursor-text-bright);
  text-transform: capitalize;
  border-radius: 999px;
  align-items: center;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 600;
  display: inline-flex;
}

.marketplace-status-chip.is-good {
  border-color: color-mix(in srgb,
    var(--mos-success, #22c55e) 42%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--mos-success, #22c55e) 14%, transparent);
}

.marketplace-status-chip.is-bad {
  border-color: color-mix(in srgb,
    var(--mos-danger, #ef4444) 42%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 14%, transparent);
}

.marketplace-status-empty {
  color: var(--color-cursor-muted);
  margin: 0;
  font-size: 12px;
  font-weight: 500;
}

.marketplace-status-actions {
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  display: flex;
}

.marketplace-status-cancel {
  border: 1px solid var(--color-cursor-border-soft);
  min-height: 34px;
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  background: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
}

.marketplace-status-cancel:hover:not(:disabled) {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 35%,
    var(--color-cursor-border-soft));
  color: var(--color-cursor-text-bright);
}

.marketplace-status-cancel:disabled {
  opacity: .55;
  cursor: default;
}

.marketplace-status-cancel svg {
  width: 14px;
  height: 14px;
}

/* [project]/src/studio/components/media-load-frame.css [app-client] (css) */
.media-load-frame {
  background: none;
  display: block;
  position: relative;
  overflow: hidden;
}

.media-load-frame.ratio-fill {
  width: 100%;
  height: 100%;
}

.media-load-frame.ratio-square:not(.is-ready), .media-load-frame.ratio-image:not(.is-ready) {
  aspect-ratio: 1;
  width: 100%;
}

.media-load-frame.ratio-video:not(.is-ready) {
  aspect-ratio: 16 / 9;
  width: 100%;
}

.media-load-frame.ratio-video-portrait:not(.is-ready) {
  aspect-ratio: 9 / 16;
  width: min(100%, 420px);
  max-height: 100%;
}

.media-load-frame.has-custom-aspect:not(.is-ready) {
  aspect-ratio: var(--media-load-aspect, 1 / 1);
  width: auto;
  max-width: 100%;
  height: auto;
}

.media-load-frame.is-ready.ratio-square, .media-load-frame.is-ready.ratio-image, .media-load-frame.is-ready.ratio-video, .media-load-frame.is-ready.ratio-video-portrait {
  aspect-ratio: auto;
  background: none;
  width: 100%;
  height: auto;
  max-height: 100%;
}

.media-load-frame.ratio-fill.is-ready {
  width: 100%;
  height: 100%;
}

.media-load-frame-placeholder {
  z-index: 1;
  pointer-events: none;
  background: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.media-load-frame-wave {
  pointer-events: none;
  background: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
  overflow: visible;
}

.media-load-frame-wave.is-ring {
  width: var(--logo-loader-ring, 56px);
  height: var(--logo-loader-ring, 56px);
  position: relative;
  inset: auto;
}

.media-load-frame-failure {
  z-index: 1;
  color: #ffffffad;
  letter-spacing: .02em;
  text-align: center;
  background: #00000052;
  place-items: center;
  padding: 12px;
  font-size: 11px;
  font-weight: 650;
  display: grid;
  position: absolute;
  inset: 0;
}

.media-load-frame img, .media-load-frame video {
  object-fit: cover;
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity .18s;
  display: block;
}

.media-load-frame.is-ready img, .media-load-frame.is-ready video {
  opacity: 1;
}

.media-load-frame.is-ready:not(.ratio-fill) img, .media-load-frame.is-ready:not(.ratio-fill) video {
  object-fit: contain;
  height: auto;
  max-height: 100%;
}

@media (prefers-reduced-motion: reduce) {
  .media-load-frame img, .media-load-frame video {
    transition: none;
  }
}

/* [project]/src/studio/components/post-compose-tab.css [app-client] (css) */
.post-compose {
  --pc-ink: var(--color-cursor-text-bright, var(--color-cursor-text, #f4f1ea));
  --pc-muted: var(--color-cursor-muted, color-mix(in srgb, var(--pc-ink) 58%, transparent));
  --pc-line: var(--color-cursor-border-soft, #ffffff24);
  --pc-line-strong: var(--color-cursor-border, #ffffff2e);
  --pc-panel: var(--mos-panel, #0f172a);
  --pc-bg: var(--mos-bg, #020617);
  --pc-surface: var(--mos-surface, #111c2f);
  --pc-input: color-mix(in srgb, var(--pc-panel) 88%, var(--pc-bg));
  --pc-hover: var(--color-cursor-hover, color-mix(in srgb, var(--pc-ink) 8%, transparent));
  --pc-accent: var(--cursor-accent, var(--color-cursor-accent, #d8ff3e));
  --pc-accent-dim: var(--cursor-accent-dim, color-mix(in srgb, var(--pc-accent) 14%, transparent));
  --pc-accent-border: var(--cursor-accent-border, color-mix(in srgb, var(--pc-accent) 28%, transparent));
  --pc-radius: var(--cursor-radius-xl, 12px);
  --pc-radius-sm: var(--cursor-radius-sm, 6px);
  --pc-shadow: 0 1px 2px #00000038,
    0 3px 8px #00000024;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  color: var(--pc-ink);
  background: var(--pc-bg);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  isolation: isolate;
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  flex-direction: column;
  display: flex;
}

[data-appearance="light"] .post-compose {
  --pc-ink: var(--color-cursor-text, #1b1f24);
  --pc-muted: var(--color-cursor-muted, #1b1f2494);
  --pc-line: var(--color-cursor-border-soft, #1b1f241f);
  --pc-line-strong: var(--color-cursor-border, #1b1f242e);
  --pc-hover: var(--color-cursor-hover, #1b1f240f);
  --pc-panel: var(--mos-panel);
  --pc-bg: var(--mos-bg);
  --pc-surface: var(--mos-panel);
  --pc-shadow: 0 1px 2px #00000014,
    0 3px 8px #0000000d;
  background: var(--pc-bg);
}

.post-compose-toolbar {
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--pc-line);
  background: var(--mos-panel, var(--pc-surface));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  flex-shrink: 0;
  align-items: center;
  gap: 10px;
  padding: 0 8px 0 10px;
  display: flex;
  overflow: visible;
}

.post-compose-toolbar-title {
  display: none;
}

.post-compose-toolbar-actions {
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  display: flex;
}

.post-compose-body {
  box-sizing: border-box;
  flex: auto;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 28%);
  justify-content: stretch;
  align-items: stretch;
  gap: 0;
  width: 100%;
  min-height: 0;
  padding: 0;
  display: grid;
  overflow: hidden;
}

.post-compose-body.is-stack {
  grid-template-rows: minmax(220px, 52%) minmax(0, 1fr);
  grid-template-columns: 1fr;
}

@media (max-width: 860px) {
  .post-compose-body {
    grid-template-rows: minmax(220px, 52%) minmax(0, 1fr);
    grid-template-columns: 1fr;
  }
}

.post-compose-mock {
  background: var(--mos-page, var(--pc-bg));
  grid-template-rows: minmax(0, 1fr) auto;
  place-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  padding: 8px 10px;
  display: grid;
  container-type: size;
}

.post-compose-mock.has-trim {
  grid-template-rows: minmax(0, 1fr) auto auto;
}

.post-compose-mock.has-trim .post-compose-trim {
  grid-row: 2;
}

.post-compose-mock.has-trim .post-compose-media-strip {
  grid-row: 3;
}

.post-compose-mock.has-trim .post-compose-mock-slide:not(.is-empty):not(.is-audio) {
  width: min(100cqi, calc((100cqh - 160px) * var(--pc-aw) / var(--pc-ah)));
  max-height: calc(100cqh - 160px);
}

.post-compose-mock:has(.post-compose-mock-slide.is-audio) {
  min-height: 17.5rem;
}

.post-compose-mock-slide {
  --pc-aw: 16;
  --pc-ah: 9;
  width: min(100cqi, calc((100cqh - 66px) * var(--pc-aw) / var(--pc-ah)));
  max-width: 100%;
  min-height: 0;
  max-height: calc(100cqh - 66px);
  aspect-ratio: var(--pc-aw) / var(--pc-ah);
  border: 1px solid var(--pc-line);
  background: var(--mos-page, var(--pc-bg));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  height: auto;
  box-shadow: var(--pc-shadow);
  border-radius: 16px;
  flex: 0 auto;
  grid-row: 1;
  position: relative;
  overflow: hidden;
}

.post-compose-mock-slide.is-audio {
  aspect-ratio: auto;
  width: min(100%, 13.5rem);
  max-width: 13.5rem;
  height: auto;
  min-height: 13.75rem;
  max-height: none;
  box-shadow: none;
  background: none;
  border: 0;
  border-radius: 0;
  align-self: center;
  overflow: visible;
}

.post-compose-mock-slide.is-audio .post-compose-mock-media {
  height: auto;
  min-height: 13.75rem;
  position: relative;
  inset: auto;
}

.post-compose-mock-slide.is-empty {
  aspect-ratio: auto;
  border: 2px dashed var(--color-cursor-border, var(--pc-line-strong));
  width: 100%;
  height: 100%;
  max-height: none;
  box-shadow: none;
  background: none;
  flex: auto;
  place-self: stretch stretch;
}

@supports not (aspect-ratio: 9 / 16) {
  .post-compose-mock-slide:not(.is-empty) {
    width: 100%;
    height: auto;
  }
}

.post-compose-mock-media {
  z-index: 0;
  background: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.post-compose-mock-media .media-load-frame, .post-compose-mock-frame {
  background: none;
  place-items: center;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  display: grid;
  overflow: visible;
}

.post-compose-mock-frame.media-load-frame img, .post-compose-mock-frame.media-load-frame video, .post-compose-mock-media img, .post-compose-mock-media video {
  object-fit: contain;
  object-position: center;
  background: none;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  display: block;
}

.post-compose-mock-frame.media-load-frame video {
  opacity: 1;
  transition: none;
}

.post-compose-preview-empty {
  height: 100%;
  min-height: 220px;
  color: var(--pc-muted);
  background: none;
  place-items: center;
  font-size: 13px;
  display: grid;
}

.post-compose-form {
  width: 100%;
  min-width: 0;
  max-width: none;
  height: auto;
  min-height: 0;
  box-shadow: none;
  background: none;
  border: 0;
  border-radius: 0;
  flex-direction: column;
  flex: auto;
  justify-self: stretch;
  gap: 0;
  padding: 0;
  display: flex;
  overflow: hidden;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

[data-appearance="light"] .post-compose-form {
  background: none;
}

@media (max-width: 860px) {
  .post-compose-form {
    justify-self: stretch;
    max-width: none;
  }
}

.post-compose-side {
  background: var(--mos-panel, var(--pc-panel));
  border-left: 1px solid var(--pc-line);
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.post-compose-body.is-stack .post-compose-side {
  border-left: 0;
  border-top: 1px solid var(--pc-line);
}

.post-compose-field {
  flex-direction: column;
  flex: auto;
  gap: 0;
  min-height: 0;
  display: flex;
  position: relative;
  overflow: visible;
}

.post-compose-caption, .post-compose-input {
  width: 100%;
  height: 100%;
  min-height: 0;
  color: var(--pc-ink);
  font: inherit;
  resize: none;
  box-shadow: none;
  white-space: pre-wrap;
  word-break: break-word;
  background: none;
  border: 0;
  border-radius: 0;
  outline: none;
  flex: auto;
  padding: 14px;
  font-size: 14px;
  line-height: 1.55;
  overflow: auto;
}

.post-compose-caption[contenteditable="true"] {
  cursor: text;
}

.post-compose-caption.is-empty:before {
  content: attr(data-placeholder);
  color: color-mix(in srgb, var(--pc-muted) 78%, transparent);
  pointer-events: none;
}

.post-compose-caption::placeholder, .post-compose-input::placeholder {
  color: color-mix(in srgb, var(--pc-muted) 78%, transparent);
}

.post-compose-caption:focus, .post-compose-input:focus {
  box-shadow: none;
  border: 0;
  outline: none;
}

.post-compose-inline-chip {
  vertical-align: middle;
  background: var(--mos-plate-strong, var(--mos-plate, var(--color-cursor-sidebar)));
  max-width: min(200px, 70%);
  height: 1.35em;
  color: inherit;
  letter-spacing: .01em;
  white-space: nowrap;
  -webkit-user-select: none;
  user-select: none;
  box-sizing: border-box;
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0 5px;
  font-size: .82em;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.post-compose-inline-chip.is-hash {
  vertical-align: middle;
  align-items: center;
  gap: 3px;
  padding: 0 5px 0 4px;
}

.post-compose-inline-chip.is-hash .post-compose-inline-chip-tag {
  margin-left: 2px;
}

.post-compose-inline-chip.is-mention {
  vertical-align: middle;
  align-items: center;
  gap: 3px;
  padding: 0 5px 0 2px;
}

.profile-post-caption .post-compose-inline-chip {
  vertical-align: middle;
  height: 1.15em;
  text-shadow: none;
  background: var(--mos-plate-strong, var(--mos-plate, var(--color-cursor-sidebar)));
  color: inherit;
  border: 0;
  margin: 0;
  padding: 0 .22em;
  font-size: .88em;
}

.profile-post-caption .post-compose-inline-chip.is-hash, .profile-post-caption .post-compose-inline-chip.is-mention {
  vertical-align: middle;
  align-items: center;
  gap: 2px;
  padding: 0 .22em 0 .06em;
}

.profile-post-caption .post-compose-inline-chip.is-hash {
  margin-left: 2px;
  padding: 0 .22em 0 2px;
}

.profile-post-caption .post-compose-inline-chip .post-compose-inline-chip-avatar, .profile-post-caption .post-compose-inline-chip-tag {
  flex-shrink: 0;
  align-self: center;
  width: .85em;
  height: .85em;
}

.profile-post-caption .post-compose-inline-chip .post-compose-inline-chip-label {
  color: inherit;
}

.caption-chip-text {
  min-width: 0;
}

.caption-chip-gap {
  font-size: inherit;
  letter-spacing: 0;
}

.caption-chip-text .post-compose-inline-chip + .post-compose-inline-chip {
  margin-left: .2em;
}

.post-compose-inline-chip.is-menu {
  pointer-events: none;
  max-width: 100%;
  height: 1.45em;
}

.post-compose-inline-chip-avatar {
  vertical-align: middle;
  width: 1em;
  height: 1em;
  box-shadow: none;
  background-color: #0000;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  border-radius: 50%;
  flex-shrink: 0;
  align-self: center;
  place-items: center;
  display: inline-grid;
  overflow: hidden;
}

.post-compose-inline-chip-tag {
  width: 1em;
  height: 1em;
  color: inherit;
  flex-shrink: 0;
  align-self: center;
  place-items: center;
  display: inline-grid;
}

.post-compose-inline-chip-tag svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.post-compose-inline-chip-avatar img {
  object-fit: cover;
  vertical-align: middle;
  width: 100%;
  height: 100%;
  display: block;
}

.post-compose-inline-chip-label {
  text-overflow: ellipsis;
  align-items: center;
  min-width: 0;
  height: 1em;
  font-size: 1em;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.post-compose-inline-chip.is-hash .post-compose-inline-chip-label, .post-compose-inline-chip.is-mention .post-compose-inline-chip-label {
  font-size: 1em;
  font-weight: 600;
}

.post-compose-chip-ghost {
  color: color-mix(in srgb, var(--pc-muted) 72%, transparent);
  font-weight: 500;
}

.post-compose-suggest-hint {
  color: color-mix(in srgb, var(--pc-muted) 85%, var(--pc-accent));
}

.post-compose-suggest {
  z-index: 8;
  border: 1px solid var(--pc-line-strong);
  background: var(--pc-panel);
  width: min(300px, 100% - 16px);
  max-height: 240px;
  color: var(--pc-ink);
  border-radius: 10px;
  margin: 0;
  padding: 4px;
  list-style: none;
  position: absolute;
  overflow: auto;
  box-shadow: 0 1px 2px #00000038, 0 4px 10px #00000029;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

[data-appearance="light"] .post-compose-suggest {
  background: var(--pc-surface);
  box-shadow: 0 1px 2px #00000014, 0 3px 8px #0000000f;
}

.post-compose-suggest button {
  width: 100%;
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-align: left;
  transition: background var(--cursor-ease, .14s ease);
  background: none;
  border: 0;
  border-radius: 8px;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 6px 8px;
  font-size: 13px;
  display: flex;
}

.post-compose-suggest button:hover, .post-compose-suggest button:focus-visible, .post-compose-suggest button.is-active {
  background: var(--pc-hover);
  outline: none;
}

.post-compose-suggest-meta {
  color: var(--pc-muted);
  flex-shrink: 0;
  font-size: 11px;
}

.post-compose-btn {
  height: calc(var(--cursor-head-h, 36px) - 10px);
  border-radius: var(--cursor-radius-pill, 999px);
  border: 1px solid var(--pc-line-strong);
  color: var(--pc-ink);
  font: inherit;
  cursor: pointer;
  transition: background var(--cursor-ease, .14s ease),
    border-color var(--cursor-ease, .14s ease),
    color var(--cursor-ease, .14s ease);
  background: none;
  align-items: center;
  gap: 6px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.post-compose-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.post-compose-btn.is-primary {
  background: var(--pc-accent);
  border-color: color-mix(in srgb, var(--pc-accent) 70%, transparent);
  color: var(--color-cursor-on-accent, #fff);
}

.post-compose-btn.is-primary:hover:not(:disabled) {
  background: var(--cursor-accent-hover, var(--pc-accent));
}

.post-compose-btn.is-ghost:hover:not(:disabled) {
  background: var(--pc-hover);
  border-color: var(--pc-line-strong);
}

.post-compose-spin {
  width: 14px;
  height: 14px;
  animation: .8s linear infinite post-compose-spin;
}

@keyframes post-compose-spin {
  to {
    transform: rotate(360deg);
  }
}

.post-compose-media-empty {
  width: 100%;
  height: 100%;
  color: var(--pc-ink);
  cursor: pointer;
  text-align: center;
  background: none;
  border: 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 24px;
  display: flex;
}

.post-compose-media-empty-title {
  font-size: 15px;
  font-weight: 600;
}

.post-compose-media-empty-copy {
  max-width: 16rem;
  color: var(--pc-muted);
  font-size: 12px;
  line-height: 1.4;
}

.post-compose.is-drop-target .post-compose-mock, .post-compose.is-touch-drop-hover .post-compose-mock, .post-compose-mock.is-drop-target, .post-compose-mock.is-touch-drop-hover {
  outline: 2px solid color-mix(in srgb, var(--pc-accent) 72%, transparent);
  outline-offset: 3px;
}

body.is-touch-file-drag .post-compose[data-drop-target="composer"] {
  pointer-events: auto !important;
}

body.is-touch-file-drag .post-compose[data-drop-target="composer"] .post-compose-mock {
  outline: 1.5px dashed color-mix(in srgb, var(--pc-accent) 38%, transparent);
  outline-offset: 3px;
}

body.is-touch-file-drag .post-compose.is-drop-target .post-compose-mock, body.is-touch-file-drag .post-compose.is-touch-drop-hover .post-compose-mock {
  outline: 2px solid color-mix(in srgb, var(--pc-accent) 72%, transparent);
  outline-offset: 2px;
}

.post-compose-media-choice {
  z-index: 4;
  border: 1px solid var(--pc-line);
  background: var(--pc-panel);
  min-width: 11rem;
  box-shadow: var(--pc-shadow);
  border-radius: 12px;
  flex-direction: column;
  gap: 6px;
  padding: 8px;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.post-compose-media-choice button {
  width: 100%;
  color: var(--pc-ink);
  cursor: pointer;
  font: inherit;
  background: none;
  border: 0;
  border-radius: 8px;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px 10px;
  font-size: 13px;
  display: flex;
}

.post-compose-media-choice button:hover {
  background: var(--pc-hover);
}

.post-compose-media-choice svg {
  width: 15px;
  height: 15px;
}

.post-compose-media-nav {
  border: 1px solid var(--pc-line);
  background: var(--pc-surface);
  width: 28px;
  height: 28px;
  color: var(--pc-ink);
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.post-compose-media-nav:hover {
  background: var(--pc-hover);
}

.post-compose-media-nav svg {
  width: 16px;
  height: 16px;
}

.post-compose-audio-stage {
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 13.75rem;
  padding: 0;
  display: flex;
}

.post-compose-audio-stage .studio-chat-audio-player, .post-compose-audio-stage .studio-chat-audio-player.is-pane, .post-compose-audio-stage .studio-chat-audio-player.is-pane.is-compact, .post-compose-audio-stage .studio-chat-audio-pane, [data-appearance="light"] .post-compose-audio-stage .studio-chat-audio-player, [data-appearance="light"] .post-compose-audio-stage .studio-chat-audio-player.is-pane, [data-appearance="light"] .post-compose-audio-stage .studio-chat-audio-pane {
  width: min(100%, 13.5rem);
  max-width: 13.5rem;
  height: auto;
  min-height: 0;
  margin: 0;
  min-width: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.post-compose-audio-stage .studio-chat-audio-player.is-pane, .post-compose-audio-stage .studio-chat-audio-player.is-pane.is-compact {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  display: flex;
}

.post-compose-audio-stage .studio-chat-audio-orb-hero {
  flex: none;
  margin: 0;
}

.post-compose-audio-stage .studio-chat-audio-meta {
  flex: none;
  justify-content: center;
  width: 100%;
}

.post-compose-audio-stage .studio-chat-audio-row.is-wave-fill {
  flex: none;
  align-self: center;
  width: min(100%, 9.5rem);
  height: 40px;
  min-height: 40px;
}

.post-compose-audio-stage .studio-chat-audio-wave, .post-compose-audio-stage .studio-chat-audio-player.is-pane .studio-chat-audio-wave {
  width: 100%;
  min-height: 40px;
  height: 40px !important;
}

.post-compose-audio-stage .studio-orb-play, .post-compose-audio-stage .studio-orb-play.is-md, .post-compose-audio-stage .studio-orb-play.is-lg {
  width: 104px !important;
  min-width: 104px !important;
  max-width: 104px !important;
  height: 104px !important;
  min-height: 104px !important;
  max-height: 104px !important;
}

.post-compose-media-strip {
  flex-shrink: 0;
  grid-row: 2;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 56px;
  padding: 0 2px 2px;
  display: flex;
}

.post-compose-media-chips {
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
  overflow-x: auto;
}

.post-compose-media-thumb {
  border: 1px solid var(--pc-line);
  background: var(--pc-surface);
  width: 52px;
  height: 52px;
  color: var(--pc-muted);
  cursor: pointer;
  border-radius: 10px;
  flex: 0 0 52px;
  margin: 0;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.post-compose-media-thumb.is-current {
  border-color: var(--pc-accent);
}

.post-compose-media-thumb.is-add {
  place-items: center;
  display: grid;
}

.post-compose-media-thumb img, .post-compose-media-thumb video {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.post-compose-media-thumb.is-audio {
  place-items: center;
  padding: 5px;
  display: grid;
}

.post-compose-media-thumb.is-audio .post-compose-audio-orb.studio-orb-play, .post-compose-media-thumb.is-audio .studio-orb-play {
  width: 100%;
  height: 100%;
}

.post-compose-media-thumb.is-audio .studio-orb-frame {
  padding: 1px;
}

.post-compose-media-thumb:not(.is-audio) svg, .post-compose-media-thumb.is-add svg {
  width: 18px;
  height: 18px;
}

.post-compose-media-thumb-remove {
  z-index: 2;
  color: #fff;
  background: #000000b8;
  border-radius: 999px;
  place-items: center;
  width: 16px;
  height: 16px;
  display: grid;
  position: absolute;
  top: 2px;
  right: 2px;
}

.post-compose-media-thumb-remove svg {
  width: 10px;
  height: 10px;
}

.post-compose-voice {
  border-top: 1px solid var(--pc-line);
  flex: none;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 8px;
  display: flex;
}

.post-compose-voice-rec {
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.post-compose-voice-rec-meta {
  color: var(--pc-muted);
  font-variant-numeric: tabular-nums;
  flex: none;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  display: inline-flex;
}

.post-compose-voice-rec-dot {
  background: var(--mos-danger, #f87171);
  border-radius: 999px;
  width: 8px;
  height: 8px;
}

.post-compose-voice-rec-dot.is-live {
  animation: 1.1s ease-in-out infinite post-compose-voice-pulse;
}

@keyframes post-compose-voice-pulse {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: .35;
  }
}

.post-compose-voice-rec-wave {
  flex: auto;
  min-width: 0;
}

.post-compose-voice-preview {
  flex: auto;
  width: 100%;
  min-width: 0;
  position: relative;
}

.post-compose-voice-preview .studio-chat-audio-player {
  width: 100%;
}

.post-compose-voice-remove {
  color: #fff;
  cursor: pointer;
  background: #000000b8;
  border: 0;
  border-radius: 999px;
  place-items: center;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  display: grid;
  position: absolute;
  top: -6px;
  right: -2px;
}

.post-compose-voice-remove svg {
  width: 12px;
  height: 12px;
}

.post-compose-type-row {
  background: none;
  border: 0;
  align-items: center;
  gap: 4px;
  min-width: 0;
  padding: 0;
  display: flex;
  overflow: visible;
}

.post-compose-type-chip {
  min-height: 24px;
  color: var(--pc-muted);
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 600;
  transition: color .16s, border-color .16s, background .16s;
  display: inline-flex;
}

.post-compose-type-chip svg {
  flex-shrink: 0;
  width: 12px;
  height: 12px;
}

.post-compose-type-chip:hover {
  color: var(--pc-ink);
}

.post-compose-type-chip.is-active {
  border-color: color-mix(in srgb, var(--pc-accent) 42%, var(--pc-line));
  background: color-mix(in srgb, var(--pc-accent) 14%, transparent);
  color: var(--pc-ink);
}

.post-compose-type-chip:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pc-accent) 70%, transparent);
  outline-offset: 2px;
}

.post-compose-value-empty {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  padding: 24px 16px;
  display: flex;
}

.post-compose-value-empty-mark {
  background: var(--mos-plate-strong, var(--pc-surface));
  width: 44px;
  height: 44px;
  color: var(--pc-ink);
  border-radius: 999px;
  place-items: center;
  display: grid;
}

.post-compose-value-empty-mark svg {
  width: 18px;
  height: 18px;
}

.post-compose-value-empty-title {
  font-size: 15px;
  font-weight: 600;
}

.post-compose-value-empty-copy {
  max-width: 18rem;
  color: var(--pc-muted);
  font-size: 12px;
  line-height: 1.4;
}

.post-compose-value-empty .post-compose-record {
  justify-content: center;
}

.post-compose-save-stage, .post-compose-save-overlay, .studio-screen-share-save {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: min(22rem, 100%);
  display: flex;
}

.post-compose-save-overlay {
  z-index: 2;
  background: color-mix(in srgb, var(--mos-page) 78%, transparent);
  width: 100%;
  color: var(--pc-ink);
  padding: 20px 16px;
  position: absolute;
  inset: 0;
}

.post-compose-save-label {
  max-width: 18rem;
  color: var(--pc-ink);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
}

.post-compose-save-track {
  background: var(--mos-plate-strong, var(--pc-surface));
  border-radius: 999px;
  width: min(16rem, 70%);
  height: 6px;
  display: block;
  overflow: hidden;
}

.post-compose-save-fill {
  border-radius: inherit;
  background: var(--pc-accent, var(--mos-accent));
  height: 100%;
  transition: width .2s;
  display: block;
}

.post-compose-save-fill.is-pulse {
  width: 36%;
  animation: 1.15s ease-in-out infinite post-compose-save-indet;
}

@keyframes post-compose-save-indet {
  0% {
    transform: translateX(-120%);
  }

  100% {
    transform: translateX(280%);
  }
}

.studio-screen-share-pill.is-saving {
  max-width: min(280px, 100vw - 24px);
  padding: 8px 10px;
}

.studio-screen-share-pill.is-saving .studio-screen-share-save {
  gap: 6px;
  width: 100%;
}

.studio-screen-share-pill.is-saving .post-compose-save-label {
  font-size: 12px;
  font-weight: 550;
}

.studio-screen-share-pill.is-saving .post-compose-save-track {
  width: 100%;
}

.post-compose-answer-banner, .post-compose-help {
  border-bottom: 1px solid var(--pc-line);
  color: var(--pc-muted);
  background: none;
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  font-size: 12px;
  display: flex;
}

.post-compose-answer-banner {
  color: var(--pc-ink);
  font-weight: 600;
}

.post-compose-answer-banner svg {
  color: var(--pc-muted);
  flex-shrink: 0;
}

.post-compose-help {
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
}

.post-compose-help-price {
  font-variant-numeric: tabular-nums;
  color: var(--pc-muted);
  margin: 0;
  font-size: 12px;
  font-weight: 550;
}

.post-compose-help-error {
  width: 100%;
  color: var(--color-cursor-danger, #e11d48);
  margin: 0;
  font-size: 12px;
}

.post-compose-record {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  display: flex;
}

.post-compose-record-mic {
  border: 1px solid var(--pc-line-strong);
  width: 28px;
  height: 28px;
  color: var(--pc-muted);
  cursor: pointer;
  background: none;
  border-radius: 999px;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.post-compose-record-mic.is-on {
  color: var(--pc-ink);
  background: var(--mos-plate-strong, var(--pc-surface));
}

.post-compose-record-mic:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.post-compose-record-mic:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pc-accent) 70%, transparent);
  outline-offset: 2px;
}

.post-compose-record-live {
  background: var(--mos-danger, #f87171);
  border-radius: 999px;
  width: 8px;
  height: 8px;
  animation: 1.1s ease-in-out infinite post-compose-voice-pulse;
}

.post-compose-record-hint {
  width: 100%;
  color: var(--pc-muted);
  margin: 0;
  font-size: 12px;
}

.studio-screen-share-layer {
  z-index: 122;
  pointer-events: none;
  position: fixed;
  inset: 0;
}

.studio-screen-share-pill {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  width: max-content;
  max-width: min(240px, 100vw - 24px);
  height: max-content;
  color: var(--color-cursor-text);
  font-variant-numeric: tabular-nums;
  pointer-events: auto;
  --pc-ink: var(--color-cursor-text, var(--color-cursor-text-bright));
  --pc-muted: var(--color-cursor-muted, color-mix(in srgb, var(--pc-ink) 58%, transparent));
  --pc-line-strong: var(--color-cursor-border, var(--mos-border));
  --pc-hover: var(--mos-hover, var(--mos-plate-strong));
  --pc-accent: var(--cursor-accent, var(--color-cursor-accent));
  --pc-surface: var(--mos-plate-strong);
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 6px 8px 6px 10px;
  font-size: 12px;
  font-weight: 550;
  display: flex;
  position: absolute;
  bottom: 12px;
  right: 12px;
  box-shadow: 0 10px 28px #00000029;
}

.studio-screen-share-pill.is-controls {
  gap: 4px;
  max-width: min(420px, 100vw - 24px);
  padding: 4px;
}

.studio-screen-share-pill.is-controls .post-compose-record {
  flex-wrap: nowrap;
  gap: 4px;
}

.studio-screen-share-pill.is-controls .post-compose-btn {
  border: 0;
  height: 28px;
  padding: 0 8px;
}

.studio-screen-share-pill.is-controls .post-compose-btn.is-ghost {
  background: var(--mos-plate-strong, var(--pc-surface));
}

.studio-screen-share-pill-close {
  width: 28px;
  height: 28px;
  color: var(--color-cursor-muted, var(--pc-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.studio-screen-share-pill-close:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
  color: var(--color-cursor-text);
}

.studio-screen-share-pill-close:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pc-accent, var(--mos-accent)) 70%, transparent);
  outline-offset: 2px;
}

body:has(.studio-polish.is-studio-mobile) .studio-screen-share-pill {
  bottom: calc(12px + var(--studio-mobile-bottom-nav-height, 56px) + var(--studio-keyboard-inset, 0px));
  right: 10px;
}

.studio-screen-share-pill-label {
  white-space: nowrap;
}

.studio-screen-share-pill-stop {
  background: var(--mos-plate-strong);
  color: inherit;
  font: inherit;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 4px 8px;
  display: inline-flex;
}

.studio-screen-share-pill-stop:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
}

.studio-screen-share-pill-stop:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pc-accent, var(--mos-accent)) 70%, transparent);
  outline-offset: 2px;
}

.post-compose-trim {
  flex-direction: column;
  gap: 8px;
  width: min(100%, 36rem);
  padding: 16px 16px 0;
  display: flex;
  overflow: visible;
}

.post-compose-trim-meta {
  font-variant-numeric: tabular-nums;
  color: var(--pc-muted);
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 550;
  display: flex;
}

.post-compose-trim-title {
  color: var(--pc-ink);
}

.post-compose-trim-time {
  margin-left: auto;
}

.post-compose-trim-play {
  background: var(--mos-plate-strong, var(--pc-surface));
  width: 28px;
  height: 28px;
  color: var(--pc-ink);
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.post-compose-trim-play:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
}

.post-compose-trim-play:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pc-accent) 70%, transparent);
  outline-offset: 2px;
}

.post-compose-trim-film {
  cursor: pointer;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  background: none;
  height: 56px;
  position: relative;
  overflow: visible;
}

.post-compose-trim-body {
  border-radius: var(--pc-trim-r-l, 10px) var(--pc-trim-r-r, 10px)
    var(--pc-trim-r-r, 10px) var(--pc-trim-r-l, 10px);
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.post-compose-trim-frames {
  border-radius: inherit;
  background: var(--mos-plate-strong, var(--pc-surface));
  width: 100%;
  height: 100%;
  display: flex;
  overflow: hidden;
}

.post-compose-trim-frames img, .post-compose-trim-frame-slot {
  object-fit: cover;
  pointer-events: none;
  flex: 1 1 0;
  width: 0;
  height: 100%;
}

.post-compose-trim-frame-slot {
  background: color-mix(in srgb, var(--mos-plate) 70%, var(--pc-ink) 6%);
}

.post-compose-trim-frame-slot:nth-child(odd) {
  background: var(--mos-plate, var(--pc-surface));
}

.post-compose-trim-veil {
  z-index: 1;
  pointer-events: none;
  background: #00000094;
  position: absolute;
  top: 0;
  bottom: 0;
}

.post-compose-trim-veil.is-left {
  left: 0;
}

.post-compose-trim-veil.is-right {
  right: 0;
}

.post-compose-trim-window {
  z-index: 2;
  border: 2px solid var(--pc-accent, var(--mos-accent));
  box-sizing: border-box;
  cursor: grab;
  border-radius: 0;
  position: absolute;
  top: 0;
  bottom: 0;
}

.post-compose-trim-window:active {
  cursor: grabbing;
}

.post-compose-trim-handle {
  z-index: 4;
  background: var(--pc-accent, var(--mos-accent));
  cursor: ew-resize;
  touch-action: none;
  border: 0;
  width: 8px;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  bottom: 0;
}

.post-compose-trim-handle.is-start {
  border-radius: 8px 0 0 8px;
  transform: translateX(-100%);
}

.post-compose-trim-handle.is-end {
  border-radius: 0 8px 8px 0;
}

.post-compose-trim-handle:after {
  content: "";
  background: var(--mos-page, var(--pc-bg));
  pointer-events: none;
  border-radius: 999px;
  width: 2px;
  height: 14px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.post-compose-trim-handle:focus-visible {
  outline: 2px solid var(--pc-ink);
  outline-offset: 2px;
}

.post-compose-trim-playhead {
  z-index: 8;
  pointer-events: none;
  cursor: default;
  touch-action: none;
  background: none;
  border: 0;
  width: 16px;
  margin-left: -8px;
  padding: 0;
  position: absolute;
  top: -16px;
  bottom: 0;
}

.post-compose-trim-playhead-grip {
  pointer-events: auto;
  cursor: ew-resize;
  touch-action: none;
  height: 18px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.post-compose-trim-playhead:after {
  content: "";
  background: var(--pc-ink, #000);
  pointer-events: none;
  width: 1px;
  margin: 0 auto;
  position: absolute;
  inset: 14px 0 0;
}

.post-compose-trim-playhead:before {
  content: "";
  pointer-events: none;
  z-index: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='16' viewBox='0 0 11 16' fill='none'%3E%3Cpath d='M2.6 1.15H8.4A1.7 1.7 0 0 1 10.1 2.85v6.55L6.05 13.85a.7.7 0 0 1-.9 0L0.9 9.4V2.85A1.7 1.7 0 0 1 2.6 1.15Z' fill='%23f5f5f5' stroke='%23000000' stroke-width='1.85' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E") center / 11px 16px no-repeat;
  width: 11px;
  height: 16px;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.post-compose-trim-playhead.is-scrubbing:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='16' viewBox='0 0 11 16' fill='none'%3E%3Cpath d='M2.6 1.15H8.4A1.7 1.7 0 0 1 10.1 2.85v6.55L6.05 13.85a.7.7 0 0 1-.9 0L0.9 9.4V2.85A1.7 1.7 0 0 1 2.6 1.15Z' fill='%23000000' stroke='%23000000' stroke-width='1.85' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E");
}

.post-compose-trim-playhead-grip:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pc-accent) 70%, transparent);
  outline-offset: 2px;
}

.post-compose-preview-play {
  z-index: 1;
  width: auto;
  height: auto;
  color: var(--pc-ink);
  cursor: pointer;
  pointer-events: auto;
  background: none;
  border: 0;
  border-radius: 0;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
  position: absolute;
  inset: 0;
}

.post-compose-preview-play-mark {
  background: var(--mos-plate-strong, var(--pc-surface));
  pointer-events: none;
  border-radius: 999px;
  place-items: center;
  width: 48px;
  height: 48px;
  display: grid;
}

.post-compose-preview-play.is-playing .post-compose-preview-play-mark {
  opacity: 0;
}

.post-compose-preview-play:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--pc-accent) 70%, transparent);
  outline-offset: -4px;
}

/* [project]/src/studio/components/profile-post-viewer.css [app-client] (css) */
.profile-post-viewer-host {
  box-sizing: border-box;
  background: none;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 0;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-polish.is-studio-mobile .profile-post-viewer-host {
  padding-top: var(--studio-mobile-head-clear, 56px);
  padding-bottom: calc(env(safe-area-inset-bottom, 0px) + var(--studio-mobile-nav-height, 44px));
}

.profile-post-viewer-layout {
  box-sizing: border-box;
  align-items: stretch;
  width: 100%;
  height: 100%;
  min-height: 0;
  display: flex;
  position: relative;
}

.profile-post-viewer-layout .profile-post-viewer {
  flex: auto;
  width: auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
}

@media (min-width: 900px) {
  .profile-post-viewer-layout {
    gap: 0;
    padding: 0;
  }

  .profile-post-viewer-layout .profile-post-viewer {
    background: var(--mos-page, var(--mos-bg, #050608));
    height: 100%;
    box-shadow: none;
    border: 0;
    border-radius: 0;
    align-self: stretch;
    overflow: hidden;
  }

  [data-appearance="light"] .profile-post-viewer-layout .profile-post-viewer {
    background: var(--mos-page, var(--mos-page));
    box-shadow: none;
    border: 0;
  }
}

.profile-post-viewer {
  color: #f4f1ea;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  isolation: auto;
  background: none;
  width: 100%;
  height: 100%;
  min-height: 0;
  position: relative;
  overflow: hidden;
}

.profile-post-viewer.is-watch-layout {
  touch-action: pan-y;
}

.profile-post-viewer-blur {
  z-index: 0;
  pointer-events: none;
  background: var(--mos-page, var(--mos-bg, #050608));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  position: absolute;
  inset: 0;
}

[data-appearance="light"] .profile-post-viewer {
  background: var(--mos-page, var(--mos-page));
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-post-viewer-blur {
  background: var(--mos-page, var(--mos-page));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.profile-post-viewer.is-loading, .profile-post-viewer.is-empty {
  text-align: center;
  color: #f4f1ea9e;
  touch-action: auto;
  place-content: center;
  gap: 12px;
  display: grid;
}

.profile-post-viewer.is-loading > :not(.profile-post-viewer-blur), .profile-post-viewer.is-empty > :not(.profile-post-viewer-blur) {
  z-index: 1;
  position: relative;
}

.profile-post-viewer.is-empty button {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: color-mix(in srgb, var(--mos-panel, #07111f) 50%, transparent);
  color: inherit;
  font: inherit;
  cursor: pointer;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 650;
}

.profile-post-track {
  z-index: 1;
  will-change: transform;
  position: absolute;
  inset: 0;
}

.profile-post-nav-rail {
  z-index: 7;
  pointer-events: auto;
  touch-action: manipulation;
  display: none;
  position: absolute;
}

@media (min-width: 900px) {
  .profile-post-nav-rail {
    display: flex;
  }
}

.profile-post-nav-rail.is-vertical {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 56px;
  padding: 12px 0;
  top: 0;
  bottom: 0;
  left: 0;
}

.profile-post-nav-rail.is-horizontal {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
  height: 52px;
  padding: 0 72px 10px;
  bottom: 0;
  left: 0;
  right: 0;
}

.profile-post-nav-btn {
  color: #fff;
  opacity: .18;
  cursor: pointer;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  background: #050608b8;
  border: 1px solid #ffffff24;
  border-radius: 50%;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  transition: opacity .18s, background-color .18s, border-color .18s, transform .16s;
  display: inline-grid;
  box-shadow: 0 4px 12px #0000002e;
}

.profile-post-nav-btn svg {
  width: 18px;
  height: 18px;
}

.profile-post-nav-rail:hover .profile-post-nav-btn:not(:disabled), .profile-post-nav-btn:focus-visible:not(:disabled) {
  opacity: .92;
  background: #05060885;
  border-color: #ffffff47;
}

.profile-post-nav-btn:hover:not(:disabled) {
  transform: scale(1.06);
}

.profile-post-nav-btn:disabled {
  opacity: .08;
  cursor: default;
}

.profile-post-nav-rail:hover .profile-post-nav-btn:disabled {
  opacity: .22;
}

[data-appearance="light"] .profile-post-nav-btn {
  color: #1b1f24;
  background: #ffffff6b;
  border-color: #1b1f241a;
}

[data-appearance="light"] .profile-post-nav-rail:hover .profile-post-nav-btn:not(:disabled), [data-appearance="light"] .profile-post-nav-btn:focus-visible:not(:disabled) {
  background: #ffffffd1;
  border-color: #1b1f2429;
}

.profile-post-like-burst {
  z-index: 5;
  pointer-events: none;
  color: #f5c400;
  place-items: center;
  animation: .7s ease-out forwards profile-post-like-burst;
  display: grid;
  position: absolute;
  inset: 0;
}

.profile-post-like-burst svg {
  filter: drop-shadow(0 8px 24px #00000059);
  width: 88px;
  height: 88px;
}

@keyframes profile-post-like-burst {
  0% {
    opacity: 0;
    transform: scale(.4);
  }

  25% {
    opacity: 1;
    transform: scale(1.15);
  }

  55% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(1.05);
  }
}

.profile-post-slide {
  isolation: isolate;
  background: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.profile-post-slide:after {
  content: "";
  z-index: 6;
  pointer-events: none;
  box-shadow: none;
  border: 0 solid #ffffff2e;
  position: absolute;
  inset: 0;
}

.profile-post-slide.is-y.is-prev:after {
  box-shadow: inset 0 -1px 0 var(--color-cursor-border-soft);
  border-bottom-width: 1px;
}

.profile-post-slide.is-y.is-next:after {
  box-shadow: inset 0 1px 0 var(--color-cursor-border-soft);
  border-top-width: 1px;
}

[data-appearance="light"] .profile-post-slide {
  background: var(--mos-page, var(--mos-page));
}

[data-appearance="light"] .profile-post-slide:after {
  border-color: var(--mos-plate, var(--mos-plate));
}

[data-appearance="light"] .profile-post-slide.is-y.is-prev:after {
  box-shadow: inset 0 -1px 0 var(--mos-plate, var(--mos-plate));
}

[data-appearance="light"] .profile-post-slide.is-y.is-next:after {
  box-shadow: inset 0 1px 0 var(--mos-plate, var(--mos-plate));
}

.profile-post-slide.is-y.is-prev {
  transform: translate3d(0, -100%, 0);
}

.profile-post-slide.is-y.is-next {
  transform: translate3d(0, 100%, 0);
}

.profile-post-slide.is-x.is-prev {
  transform: translate3d(-100%, 0, 0);
}

.profile-post-slide.is-x.is-next {
  transform: translate3d(100%, 0, 0);
}

.profile-post-slide.is-idle {
  opacity: 0;
  pointer-events: none;
  z-index: 0;
  content-visibility: auto;
  contain-intrinsic-size: auto 80dvh;
  transform: translate3d(0, 0, 0);
}

.profile-post-slide-glass {
  z-index: 0;
  pointer-events: none;
  background: var(--mos-page, var(--mos-bg, #050608));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  position: absolute;
  inset: 0;
}

.profile-post-slide-glass:after {
  content: "";
  pointer-events: none;
  background: none;
  height: min(46%, 280px);
  position: absolute;
  inset: auto 0 0;
}

[data-appearance="dark"] .profile-post-slide-glass:after {
  background: linear-gradient(180deg,
    transparent 0%,
    color-mix(in srgb, var(--mos-page, #050608) 42%, transparent) 38%,
    color-mix(in srgb, var(--mos-page, #050608) 78%, transparent) 72%,
    color-mix(in srgb, var(--mos-page, #050608) 92%, transparent) 100%);
}

[data-appearance="light"] .profile-post-slide-glass {
  background: var(--mos-page, var(--mos-page));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

[data-appearance="light"] .profile-post-slide-glass:after {
  background: none;
}

[data-appearance="light"] .profile-post-slide-media {
  background: var(--mos-page, var(--mos-page));
}

.profile-post-slide-media {
  z-index: 1;
  background: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.profile-post-slide-media img, .profile-post-slide-media video {
  object-fit: contain;
  object-position: center;
  pointer-events: none;
  background: none;
  width: 100%;
  height: 100%;
}

.profile-post-audio-stage {
  box-sizing: border-box;
  pointer-events: auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 13.75rem;
  padding: 0;
  display: flex;
}

.profile-post-audio-stage .studio-chat-audio-player, .profile-post-audio-stage .studio-chat-audio-player.is-pane, .profile-post-audio-stage .studio-chat-audio-player.is-pane.is-compact, .profile-post-audio-stage .studio-chat-audio-pane, [data-appearance="light"] .profile-post-audio-stage .studio-chat-audio-player, [data-appearance="light"] .profile-post-audio-stage .studio-chat-audio-player.is-pane, [data-appearance="light"] .profile-post-audio-stage .studio-chat-audio-pane {
  box-sizing: border-box;
  width: min(100%, 13.5rem);
  max-width: 13.5rem;
  height: auto;
  min-height: 0;
  margin: 0;
  min-width: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.profile-post-audio-stage .studio-chat-audio-player.is-pane, .profile-post-audio-stage .studio-chat-audio-player.is-pane.is-compact {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  display: flex;
}

.profile-post-audio-stage .studio-chat-audio-orb-hero {
  flex: none;
  margin: 0;
}

.profile-post-audio-stage .studio-chat-audio-row.is-wave-fill {
  flex: none;
  align-self: stretch;
  width: 100%;
  height: 40px;
  min-height: 40px;
}

.profile-post-audio-stage .studio-chat-audio-wave, .profile-post-audio-stage .studio-chat-audio-player.is-pane .studio-chat-audio-wave {
  width: 100%;
  min-height: 40px;
  height: 40px !important;
}

.profile-post-audio-stage .studio-orb-play, .profile-post-audio-stage .studio-orb-play.is-md, .profile-post-audio-stage .studio-orb-play.is-lg {
  width: 104px !important;
  min-width: 104px !important;
  max-width: 104px !important;
  height: 104px !important;
  min-height: 104px !important;
  max-height: 104px !important;
}

.profile-post-watch-frame.is-audio .profile-post-slide-media {
  background: var(--mos-page, var(--mos-page));
}

.profile-post-media-strip {
  pointer-events: auto;
  touch-action: manipulation;
  flex: none;
  grid-row: 2;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  padding: 0 2px;
  display: flex;
}

.profile-post-media-chips {
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
  overflow-x: auto;
}

.profile-post-media-nav {
  border: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-page, var(--mos-panel, var(--mos-page)));
  width: 28px;
  height: 28px;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.profile-post-media-nav:hover {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.profile-post-media-nav svg {
  width: 16px;
  height: 16px;
}

.profile-post-media-thumb {
  border: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-panel, var(--mos-page));
  width: 44px;
  height: 44px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border-radius: 10px;
  flex: 0 0 44px;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.profile-post-media-thumb.is-current {
  border-color: var(--cursor-accent, var(--color-cursor-accent));
}

.profile-post-media-thumb.is-audio {
  place-items: center;
  padding: 5px;
  display: grid;
}

.profile-post-media-thumb.is-audio .profile-post-audio-orb.studio-orb-play, .profile-post-media-thumb.is-audio .studio-orb-play {
  width: 100%;
  height: 100%;
}

.profile-post-media-thumb.is-audio .studio-orb-frame {
  padding: 1px;
}

.profile-post-media-thumb img, .profile-post-media-thumb video {
  object-fit: cover;
  pointer-events: none;
  width: 100%;
  height: 100%;
}

.profile-post-media-thumb svg {
  width: 18px;
  height: 18px;
}

.profile-post-slide-frame {
  background: none;
  border-radius: 0;
  place-items: center;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  display: grid;
}

.profile-post-tiktok-player {
  background: #050608;
  border: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.profile-post-tiktok-fallback {
  background: #050608;
  width: 100%;
  height: 100%;
  position: relative;
}

.profile-post-tiktok-fallback img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.profile-post-tiktok-fallback-card {
  z-index: 1;
  background: color-mix(in srgb, var(--mos-page, #0b0d12) 55%, transparent);
  color: #fff;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 20px;
  display: flex;
  position: absolute;
  inset: 0;
}

.profile-post-tiktok-fallback-card p {
  margin: 0;
  font-size: 14px;
  font-weight: 650;
}

.profile-post-slide-frame.media-load-frame:not(.is-ready), .profile-post-slide-frame .media-load-frame-placeholder, .profile-post-slide-frame .media-load-frame-wave {
  overflow: visible;
}

.profile-post-slide-frame.media-load-frame.is-ready {
  background: none;
}

.profile-post-slide-frame.media-load-frame img, .profile-post-slide-frame.media-load-frame video {
  object-fit: contain;
  object-position: center;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
}

.profile-post-slide-loading {
  color: #ffffff8c;
  background: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.profile-post-viewer-load-wave.media-load-frame-wave {
  width: var(--logo-loader-ring, 56px);
  height: var(--logo-loader-ring, 56px);
  position: relative;
  inset: auto;
}

.profile-post-video-chrome {
  z-index: 3;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  background: linear-gradient(to top,
    var(--color-cursor-border-soft) 0%,
    transparent 42%,
    transparent 58%,
    var(--color-cursor-border-soft) 100%);
  place-items: center;
  transition: opacity .18s, visibility .18s;
  display: grid;
  position: absolute;
  inset: 0;
}

.profile-post-video-chrome.is-visible {
  opacity: 1;
  visibility: visible;
}

.profile-post-video-play {
  pointer-events: none;
  color: #fff;
  cursor: pointer;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  width: auto;
  height: auto;
  box-shadow: none;
  filter: drop-shadow(0 2px 4px #0000008c) drop-shadow(0 8px 24px #00000073);
  background: none;
  border: 0;
  border-radius: 0;
  place-items: center;
  margin: 0;
  padding: 0;
  transition: transform .16s, opacity .16s;
  display: grid;
  transform: scale(.94);
}

.profile-post-video-chrome.is-visible .profile-post-video-play {
  pointer-events: auto;
  transform: scale(1);
}

.profile-post-video-play:hover {
  background: none;
  transform: scale(1.06);
}

.profile-post-video-play:focus-visible {
  outline-offset: 6px;
  border-radius: 8px;
  outline: 2px solid #ffffff8c;
}

.profile-post-video-play svg {
  width: 56px;
  height: 56px;
  margin-left: 3px;
}

.profile-post-video-play[aria-label="Pause"] svg {
  margin-left: 0;
}

.profile-post-video-play:has(svg.lucide-pause) svg {
  margin-left: 0;
}

.profile-post-video-bar {
  pointer-events: none;
  width: auto;
  padding: 10px 12px max(18px, calc(12px + env(safe-area-inset-bottom, 0px)));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: none;
  background: none;
  border: 0;
  border-radius: 0;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  display: grid;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.profile-post-video-chrome.is-visible .profile-post-video-bar {
  pointer-events: auto;
}

.profile-post-video-time {
  font-variant-numeric: tabular-nums;
  color: #fff;
  white-space: nowrap;
  filter: drop-shadow(0 1px 2px #000000bf) drop-shadow(0 2px 8px #0006);
  min-width: 2.4em;
  font-size: 11px;
  font-weight: 650;
}

.profile-post-video-time:last-child {
  text-align: right;
}

.profile-post-video-scrub {
  filter: drop-shadow(0 1px 2px #0000008c);
  align-items: center;
  height: 18px;
  display: flex;
  position: relative;
}

.profile-post-video-scrub:before {
  content: "";
  background: #ffffff47;
  border-radius: 999px;
  height: 3px;
  position: absolute;
  left: 0;
  right: 0;
}

.profile-post-video-scrub:after {
  content: "";
  width: var(--pp-video-progress, 0%);
  background: var(--mos-plate);
  pointer-events: none;
  border-radius: 999px;
  height: 3px;
  position: absolute;
  left: 0;
}

.profile-post-video-scrub-input {
  z-index: 1;
  appearance: none;
  cursor: pointer;
  background: none;
  width: 100%;
  height: 18px;
  margin: 0;
  position: relative;
}

.profile-post-video-scrub-input::-webkit-slider-runnable-track {
  background: none;
  height: 3px;
}

.profile-post-video-scrub-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  background: var(--mos-plate);
  width: 14px;
  height: 14px;
  box-shadow: 0 1px 6px var(--color-cursor-border-soft);
  border: 0;
  border-radius: 50%;
  margin-top: -5.5px;
}

.profile-post-video-scrub-input::-moz-range-track {
  background: none;
  border: 0;
  height: 3px;
}

.profile-post-video-scrub-input::-moz-range-thumb {
  background: var(--mos-plate);
  width: 14px;
  height: 14px;
  box-shadow: 0 1px 6px var(--color-cursor-border-soft);
  border: 0;
  border-radius: 50%;
}

@media (prefers-reduced-motion: reduce) {
  .profile-post-video-chrome, .profile-post-video-play {
    transition: none;
  }
}

.profile-post-rail {
  right: max(8px, env(safe-area-inset-right, 0px));
  z-index: 4;
  pointer-events: none;
  justify-items: center;
  gap: 12px;
  display: grid;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.profile-post-caption {
  z-index: 4;
  left: max(12px, env(safe-area-inset-left, 0px));
  right: max(72px, env(safe-area-inset-right, 0px));
  bottom: max(18px, env(safe-area-inset-bottom, 0px));
  pointer-events: auto;
  max-width: min(420px, 78%);
  color: var(--color-cursor-text-bright, var(--mos-text));
  text-shadow: none;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  display: flex;
  position: absolute;
}

[data-appearance="dark"] .profile-post-caption:not(.is-page) {
  text-shadow: 0 1px 1px #000000a6, 0 2px 8px #00000073;
}

[data-appearance="light"] .profile-post-caption:not(.is-page) {
  text-shadow: 0 1px 1px #fffc, 0 2px 8px #ffffff59;
}

.profile-post-caption.is-tappable {
  cursor: pointer;
}

.profile-post-caption.is-draggable {
  cursor: grab;
}

.profile-post-caption.is-draggable:active {
  cursor: grabbing;
}

.profile-post-caption.is-tappable:focus-visible {
  outline: 2px solid color-mix(in srgb, currentColor 45%, transparent);
  outline-offset: 4px;
  border-radius: 6px;
}

.profile-post-caption-user {
  color: inherit;
  font: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
  background: none;
  border: 0;
  align-self: flex-start;
  min-width: 0;
  max-width: 100%;
  padding: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
}

.profile-post-caption-text {
  color: inherit;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  text-overflow: ellipsis;
  pointer-events: none;
  -webkit-box-orient: vertical;
  min-width: 0;
  max-width: 100%;
  max-height: 3.1em;
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.55;
  display: -webkit-box;
  overflow: hidden;
}

.profile-post-caption-text .caption-chip-text {
  display: inline;
}

.profile-post-caption-voice {
  pointer-events: auto;
  flex: none;
  width: 100%;
  min-width: 0;
  margin: 8px 0 10px;
}

.profile-post-caption-voice .studio-chat-audio-player, .profile-post-caption-voice .studio-chat-audio-player.is-compact {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.profile-post-caption-text .post-compose-inline-chip {
  pointer-events: none;
}

.profile-post-caption-tags {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.profile-post-caption-tag {
  font-size: inherit;
  color: inherit;
  font-weight: 650;
}

.profile-post-caption-tags .profile-post-caption-tag {
  font-size: 12px;
}

.profile-post-caption-mention {
  color: inherit;
  font: inherit;
  cursor: pointer;
  text-shadow: inherit;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  font-weight: 700;
  display: inline;
}

.profile-post-caption-mention.is-plain {
  cursor: default;
  color: inherit;
  font-weight: 650;
}

@media (min-width: 900px) {
  .profile-post-caption {
    bottom: 28px;
    left: 20px;
  }
}

.profile-post-rail-avatar, .profile-post-rail-btn {
  pointer-events: auto;
}

.profile-post-rail-avatar-wrap {
  justify-items: center;
  padding-bottom: 8px;
  display: grid;
  position: relative;
}

.profile-post-rail-follow {
  color: #fff;
  cursor: pointer;
  pointer-events: auto;
  background: #ff3b5c;
  border: 0;
  border-radius: 50%;
  place-items: center;
  width: 16px;
  height: 16px;
  padding: 0;
  transition: background-color .16s, color .16s;
  display: grid;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  box-shadow: 0 1px 2px #00000080, 0 3px 8px #00000059;
}

.profile-post-rail-follow svg {
  width: 10px;
  height: 10px;
}

.profile-post-rail-follow .profile-post-rail-spin {
  filter: none;
  width: 10px;
  height: 10px;
}

.profile-post-rail-follow.is-following {
  color: #9df2b0;
  background: #4c535e;
}

.profile-post-rail-follow:disabled {
  opacity: .75;
  cursor: default;
}

.profile-post-rail-avatar {
  filter: drop-shadow(0 1px 1px #00000080) drop-shadow(0 3px 8px #0006);
}

.profile-post-rail-btn {
  color: #fff;
  min-width: 0;
  font: inherit;
  cursor: pointer;
  text-shadow: 0 1px 1px #000000a6, 0 2px 8px #00000073;
  background: none;
  border: 0;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 2px 0;
  font-size: 10px;
  font-weight: 700;
  display: inline-flex;
  overflow: visible;
}

.profile-post-rail-btn svg, .profile-post-rail-spin {
  filter: drop-shadow(0 1px 1px #0009) drop-shadow(0 2px 6px #00000073);
  width: 22px;
  height: 22px;
  overflow: visible;
}

.profile-post-rail-btn .profile-post-rail-share {
  filter: drop-shadow(0 1px 1px #0009) drop-shadow(0 2px 6px #00000073);
  width: 24px;
  height: 24px;
}

.profile-post-rail-spin {
  animation: .7s linear infinite profile-post-rail-spin;
}

@keyframes profile-post-rail-spin {
  to {
    transform: rotate(360deg);
  }
}

.profile-post-rail-btn.is-liked {
  color: #fff;
}

.profile-post-rail-btn.is-liked svg, .profile-post-rail-btn.is-liked:hover svg {
  filter: drop-shadow(0 1px #9a7200) drop-shadow(0 2px 5px #00000080);
  color: #f5c400 !important;
}

.profile-post-rail-btn.is-saved {
  color: #fff;
}

.profile-post-rail-btn.is-saved svg, .profile-post-rail-btn.is-saved:hover svg {
  filter: drop-shadow(0 1px #a87400) drop-shadow(0 2px 5px #00000080);
  color: #ffc53d !important;
}

.profile-post-rail-btn span {
  color: #fff;
}

[data-appearance="light"] .profile-post-rail .profile-post-rail-btn {
  color: var(--color-cursor-text-bright, #0f172a);
  text-shadow: none;
}

[data-appearance="light"] .profile-post-rail .profile-post-rail-btn svg, [data-appearance="light"] .profile-post-rail .profile-post-rail-btn .profile-post-rail-share, [data-appearance="light"] .profile-post-rail .profile-post-rail-spin {
  filter: none;
}

[data-appearance="light"] .profile-post-rail .profile-post-rail-btn span {
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-post-rail .profile-post-rail-avatar {
  filter: drop-shadow(0 1px 1px #ffffffa6) drop-shadow(0 2px 6px #0f172a2e);
}

[data-appearance="light"] .profile-post-rail .profile-post-rail-btn.is-liked {
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-post-rail .profile-post-rail-btn.is-liked svg, [data-appearance="light"] .profile-post-rail .profile-post-rail-btn.is-liked:hover svg {
  filter: none;
  color: #d97706 !important;
}

[data-appearance="light"] .profile-post-rail .profile-post-rail-btn.is-saved {
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-post-rail .profile-post-rail-btn.is-saved svg, [data-appearance="light"] .profile-post-rail .profile-post-rail-btn.is-saved:hover svg {
  filter: none;
  color: #ca8a04 !important;
}

@media (min-width: 900px) {
  .profile-post-rail {
    right: 14px;
  }
}

.profile-post-watch-stack {
  touch-action: pan-y;
  flex-direction: column;
  flex: auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.profile-post-viewer-layout.is-watch-layout .profile-post-viewer {
  touch-action: pan-y;
  flex: auto;
  height: auto;
  min-height: 0;
  overflow: hidden;
}

.profile-post-slide.is-watch {
  background: var(--mos-page, var(--mos-page));
  flex-direction: column;
  place-items: stretch stretch;
  display: flex;
  overflow: hidden;
}

.profile-post-slide.is-watch:after {
  content: none;
}

.profile-post-slide.is-watch > .profile-post-slide-split {
  flex: auto;
  height: 100%;
  min-height: 0;
}

.profile-post-slide-split {
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 0;
  display: flex;
}

.profile-post-feed-h {
  flex: auto;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
}

.profile-post-watch-panel, .profile-post-comments-panel {
  min-width: 0;
  min-height: 0;
}

.profile-post-comments-panel {
  min-width: 240px;
}

.profile-post-slide-split.is-static .profile-post-media-panel {
  flex: 68 1 0;
}

.profile-post-slide-split.is-static .profile-post-caption-panel {
  flex: 32 1 0;
}

.profile-post-slide-split.is-static .profile-post-feed-resize {
  pointer-events: none;
}

.profile-post-media-panel, .profile-post-caption-panel {
  min-height: 0;
  overflow: hidden;
}

.profile-post-media-panel {
  flex-direction: column;
  display: flex;
}

.profile-post-media-panel .profile-post-watch-player {
  z-index: 0;
  flex: auto;
  height: 100%;
  min-height: 0;
}

.profile-post-caption-panel {
  flex-direction: column;
  display: flex;
}

.profile-post-caption-panel .profile-post-caption-scroll {
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: auto;
  height: 100%;
  min-height: 0;
  max-height: none;
}

.cursor-resize-v.profile-post-feed-resize {
  z-index: 20;
  touch-action: none;
  pointer-events: auto;
  width: 100%;
  cursor: var(--studio-cursor-resize-y, ns-resize);
  border: 0;
  flex: 0 0 12px;
  margin-block: -6px;
  padding: 0;
  position: relative;
  height: 12px !important;
  box-shadow: none !important;
  background: none !important;
}

.cursor-resize-v.profile-post-feed-resize:before, .cursor-resize-v.profile-post-feed-resize:after {
  content: none;
}

.cursor-resize-v.profile-post-feed-resize:hover, .cursor-resize-v.profile-post-feed-resize[data-resize-handle-active] {
  height: 12px !important;
  box-shadow: none !important;
  background: none !important;
}

.profile-post-watch-player {
  box-sizing: border-box;
  background: var(--mos-page, var(--mos-page));
  z-index: 1;
  touch-action: pan-x;
  flex: auto;
  grid-template-rows: minmax(0, 1fr);
  place-items: center;
  gap: 10px;
  width: 100%;
  min-height: 0;
  padding: 8px 10px;
  display: grid;
  overflow: hidden;
  container-type: size;
}

.profile-post-watch-player:has(.profile-post-media-strip) {
  grid-template-rows: minmax(0, 1fr) auto;
}

.profile-post-watch-frame {
  --post-aw: 16;
  --post-ah: 9;
  min-height: 0;
  width: min(100cqi, calc(100cqh * var(--post-aw) / var(--post-ah)));
  max-height: 100cqh;
  aspect-ratio: var(--post-aw) / var(--post-ah);
  filter: drop-shadow(0 1px 2px #0f121814);
  background: #0b0d12;
  border: 0;
  border-radius: 10px;
  flex: 0 auto;
  margin-inline: auto;
  position: relative;
  overflow: hidden;
}

.profile-post-tiktok-mark {
  z-index: 6;
  color: #fff;
  cursor: pointer;
  pointer-events: auto;
  filter: drop-shadow(0 1px 2px #000000a6);
  background: none;
  border: 0;
  border-radius: 999px;
  place-items: center;
  width: 22px;
  height: 22px;
  padding: 0;
  display: grid;
  position: absolute;
  top: 8px;
  right: 8px;
}

button.profile-post-tiktok-mark:hover, button.profile-post-tiktok-mark:focus-visible {
  background: #00000059;
}

button.profile-post-tiktok-mark:focus-visible {
  outline: 2px solid var(--cursor-accent, #c8f04d);
  outline-offset: 2px;
}

.profile-post-tiktok-mark svg {
  width: 16px;
  height: 16px;
}

.profile-post-watch-player:has(.profile-post-media-strip) .profile-post-watch-frame {
  width: min(100cqi, calc((100cqh - 56px) * var(--post-aw) / var(--post-ah)));
  max-height: calc(100cqh - 56px);
}

.profile-post-help-lock {
  z-index: 8;
  background: color-mix(in srgb, var(--mos-page, #0b0d12) 62%, transparent);
  color: var(--color-cursor-text-bright, var(--mos-text));
  text-align: center;
  pointer-events: auto;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 20px;
  display: flex;
  position: absolute;
  inset: 0;
}

.profile-post-help-lock-card {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--mos-panel));
  border-radius: 14px;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: min(100%, 16.5rem);
  padding: 16px 14px 14px;
  display: flex;
}

.profile-post-help-lock-mark {
  background: var(--mos-plate-strong, var(--mos-raised));
  width: 44px;
  height: 44px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  border-radius: 999px;
  place-items: center;
  display: grid;
}

.profile-post-help-lock-mark svg {
  width: 18px;
  height: 18px;
}

.profile-post-help-lock p {
  margin: 0;
  font-size: 14px;
  font-weight: 650;
}

.profile-post-help-lock-meta {
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 58%, transparent));
  font-size: 12px;
  font-weight: 550;
}

.profile-post-help-lock-btn {
  border: 1px solid color-mix(in srgb, var(--cursor-accent) 70%, transparent);
  background: var(--cursor-accent, var(--pc-accent));
  min-height: 28px;
  color: var(--color-cursor-on-accent, #fff);
  font: inherit;
  cursor: pointer;
  border-radius: 999px;
  margin: 0;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 650;
}

.profile-post-help-lock-btn:focus-visible {
  outline: 2px solid var(--cursor-accent);
  outline-offset: 2px;
}

.profile-post-caption-name-row {
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.profile-post-help-kind {
  background: var(--mos-plate-strong, var(--color-cursor-sidebar));
  height: 18px;
  color: var(--color-cursor-text, var(--mos-text));
  letter-spacing: .01em;
  border-radius: 999px;
  flex: none;
  align-items: center;
  padding: 0 7px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

:is(.profile-post-watch-player .profile-post-watch-frame.is-audio, .profile-post-watch-player:has(.profile-post-media-strip) .profile-post-watch-frame.is-audio) {
  aspect-ratio: auto;
  filter: none;
  background: none;
  border-radius: 0;
  flex: none;
  align-self: center;
  width: min(100%, 13.5rem);
  max-width: 13.5rem;
  height: auto;
  min-height: 13.75rem;
  max-height: none;
  overflow: visible;
}

.profile-post-watch-frame.is-audio .profile-post-slide-media, .profile-post-slide.is-watch .profile-post-watch-frame.is-audio .profile-post-slide-media {
  background: none;
  width: 100%;
  height: auto;
  min-height: 13.75rem;
  position: relative;
  inset: auto;
  overflow: visible;
}

:is(.profile-post-media-panel:has(.profile-post-audio-stage), .profile-post-watch-player:has(.profile-post-audio-stage)) {
  min-height: 13.75rem;
}

:is(.profile-post-media-panel:has(.profile-post-media-strip):has(.profile-post-audio-stage), .profile-post-watch-player:has(.profile-post-media-strip):has(.profile-post-audio-stage)) {
  min-height: 17.5rem;
}

@media (max-width: 899px) {
  .profile-post-watch-frame.is-portrait {
    max-height: min(100cqh, 52dvh);
  }
}

.profile-post-slide.is-watch .profile-post-slide-media {
  position: absolute;
  inset: 0;
}

.profile-post-caption-scroll {
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: 0 auto;
  width: 100%;
  min-height: 0;
  position: relative;
  overflow: hidden;
}

@media (max-width: 899px) {
  .profile-post-caption-scroll {
    max-height: min(28dvh, 42%);
  }
}

.profile-post-caption-scroll:before, .profile-post-caption-scroll:after {
  content: "";
  z-index: 4;
  pointer-events: none;
  height: 16px;
  position: absolute;
  left: 0;
  right: 0;
}

.profile-post-caption-scroll:before {
  background: linear-gradient(to bottom,
      var(--mos-page, var(--mos-page)) 0%,
      color-mix(in srgb, var(--mos-page, var(--mos-page)) 42%, transparent) 55%,
      transparent 100%);
  top: 0;
}

.profile-post-caption-scroll:after {
  background: linear-gradient(to top,
      var(--mos-page, var(--mos-page)) 0%,
      color-mix(in srgb, var(--mos-page, var(--mos-page)) 42%, transparent) 55%,
      transparent 100%);
  bottom: 0;
}

.profile-post-slide.is-watch .profile-post-caption.is-page {
  overscroll-behavior-y: contain;
  touch-action: pan-y;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  text-shadow: none;
  pointer-events: auto;
  -webkit-overflow-scrolling: touch;
  flex: auto;
  gap: 6px;
  padding: 8px 16px 16px;
  position: relative;
  bottom: auto;
  left: auto;
  right: auto;
  overflow: hidden auto;
}

.profile-post-caption.is-page .profile-post-caption-head {
  pointer-events: auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.profile-post-caption-actions {
  flex: none;
  align-items: center;
  gap: 6px;
  min-width: 0;
  margin-left: auto;
  display: flex;
}

.profile-post-caption-actions .profile-post-book-btn {
  color: var(--color-cursor-text-bright, var(--mos-text));
  background: none;
}

.profile-post-caption-avatar-wrap {
  flex: none;
  justify-items: center;
  display: grid;
  position: relative;
}

.profile-post-caption-avatar.studio-profile-avatar {
  width: 36px;
  height: 36px;
  box-shadow: 0 1px 2px #0f121829, inset 0 1px #ffffff1f;
}

.profile-post-caption-identity {
  flex: auto;
  gap: 1px;
  min-width: 0;
  display: grid;
}

.profile-post-follow-btn {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  height: 28px;
  min-height: 28px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  letter-spacing: .01em;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.profile-post-follow-icon {
  stroke-width: 2.25px;
  flex: none;
  width: 14px;
  height: 14px;
}

.profile-post-follow-btn.is-following {
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
  background: none;
}

.profile-post-edit-btn {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  width: 28px;
  height: 28px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  cursor: pointer;
  background: none;
  border-radius: 999px;
  flex: none;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.profile-post-edit-btn svg {
  width: 14px;
  height: 14px;
  display: block;
}

.profile-post-caption.is-page .profile-post-caption-user, .profile-post-caption.is-page .profile-post-caption-text, .profile-post-caption.is-page .profile-post-caption-tag, .profile-post-caption.is-page .profile-post-caption-mention, .profile-post-caption.is-page .profile-post-caption-mention.is-plain {
  color: inherit;
  text-shadow: none;
}

.profile-post-caption.is-page .profile-post-caption-user {
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: -.02em;
  pointer-events: auto;
  cursor: pointer;
  text-align: left;
  min-width: 0;
  font-size: 18px;
  font-weight: 750;
  overflow: hidden;
}

.profile-post-caption-identity time {
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 55%, transparent));
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-top: -1px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  overflow: hidden;
}

.profile-post-caption.is-page .profile-post-caption-text {
  white-space: pre-wrap;
  -webkit-line-clamp: unset;
  line-clamp: unset;
  min-height: 0;
  max-height: none;
  text-overflow: unset;
  pointer-events: auto;
  flex: none;
  font-size: 14px;
  line-height: 1.45;
  display: block;
  overflow: visible;
}

.profile-post-slide.is-watch .profile-post-caption.is-page.is-editing {
  touch-action: auto;
}

.profile-post-caption.is-page .profile-description-edit {
  gap: 8px;
}

.profile-post-caption.is-page .profile-description-edit-input {
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, color-mix(in srgb, var(--color-cursor-text) 5%, transparent));
  min-height: 5.5em;
  color: inherit;
  padding: 8px 10px;
}

.profile-post-caption.is-page .profile-description-edit-count {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.profile-post-caption.is-page .profile-description-edit-btn {
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
  color: inherit;
  background: none;
}

.profile-post-watch-frame .profile-post-like-burst {
  border-radius: 12px;
}

.profile-post-book-bar {
  z-index: 40;
  height: var(--studio-mobile-nav-height, 38px);
  min-height: var(--studio-mobile-nav-height, 38px);
  max-height: var(--studio-mobile-nav-height, 38px);
  border: 0;
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-bg)));
  box-sizing: border-box;
  box-shadow: none;
  filter: none;
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 10px;
  display: flex;
  overflow: hidden;
}

.profile-post-book-actions {
  flex: auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.profile-post-book-nav, .profile-post-book-end {
  display: none;
}

.profile-post-book-btn {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, var(--color-cursor-panel, var(--mos-page)));
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0;
  display: inline-flex;
  overflow: visible;
}

.profile-post-book-btn.is-labeled {
  width: auto;
  min-width: 0;
  padding: 0 8px;
}

span.profile-post-book-btn {
  cursor: default;
  pointer-events: none;
}

.profile-post-book-btn:disabled {
  opacity: .38;
  cursor: default;
}

.profile-post-book-btn.is-end {
  margin-left: auto;
}

.profile-post-book-label, .profile-post-book-count {
  letter-spacing: -.02em;
  align-items: center;
  height: 14px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
}

.profile-post-book-label {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.profile-post-book-count {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-weight: 650;
}

.profile-post-book-btn svg {
  fill: none;
  stroke-width: 2px;
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
  display: block;
  overflow: visible;
}

.profile-post-book-btn.is-liked {
  color: #d97706;
  border-color: color-mix(in srgb, #d97706 42%, var(--color-cursor-border-soft));
}

.profile-post-book-btn.is-liked svg {
  fill: currentColor;
  color: #d97706;
}

.profile-post-book-btn.is-liked .profile-post-book-label {
  color: #d97706;
}

.profile-post-book-btn.is-saved {
  color: #ca8a04;
}

.profile-post-book-btn.is-saved svg {
  fill: currentColor;
  color: #ca8a04;
}

@media (max-width: 899px) {
  .is-watch-layout .profile-post-book-bar {
    height: var(--studio-mobile-nav-height, 42px);
    min-height: var(--studio-mobile-nav-height, 42px);
    max-height: var(--studio-mobile-nav-height, 42px);
    border-top: 0;
    border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
    order: -1;
    grid-template-columns: auto 1fr auto;
    grid-template-areas: "nav actions end";
    padding: 0 8px 0 10px;
    display: grid;
  }

  .is-watch-layout .profile-post-book-nav {
    grid-area: nav;
    justify-self: start;
    align-items: center;
    gap: 4px;
    display: flex;
  }

  .is-watch-layout .profile-post-book-actions {
    flex: 0 auto;
    grid-area: actions;
    justify-content: center;
    justify-self: center;
  }

  .is-watch-layout .profile-post-book-end {
    grid-area: end;
    justify-self: end;
    align-items: center;
    display: flex;
  }

  .is-watch-layout .profile-post-book-btn {
    width: var(--studio-mobile-chrome-control, 30px);
    min-width: var(--studio-mobile-chrome-control, 30px);
    height: var(--studio-mobile-chrome-control, 30px);
    min-height: var(--studio-mobile-chrome-control, 30px);
  }

  .is-watch-layout .profile-post-book-btn.is-labeled {
    width: auto;
    min-width: 0;
    padding: 0 7px;
  }
}

.profile-comments-dock {
  display: none;
}

@media (min-width: 900px) {
  .profile-post-watch-player {
    padding: 16px 20px 8px;
  }

  .profile-post-watch-frame:not(.is-audio) {
    width: min(100cqi, calc(100cqh * var(--post-aw) / var(--post-ah)));
  }

  .profile-post-watch-player:has(.profile-post-media-strip) .profile-post-watch-frame:not(.is-audio) {
    width: min(100cqi, calc((100cqh - 56px) * var(--post-aw) / var(--post-ah)));
  }

  .profile-post-slide.is-watch .profile-post-caption.is-page {
    padding: 8px 20px 16px;
  }

  .is-watch-layout .profile-post-book-bar {
    height: var(--cursor-head-h, 36px);
    min-height: var(--cursor-head-h, 36px);
    max-height: var(--cursor-head-h, 36px);
    background: none;
    border-top: 0;
    border-bottom: 0;
    order: -1;
    grid-template-columns: 1fr auto 1fr;
    padding: 4px 8px;
    display: grid;
  }

  .is-watch-layout .profile-post-book-actions {
    flex: 0 auto;
    justify-self: start;
  }

  .is-watch-layout .profile-post-book-nav {
    justify-content: center;
    justify-self: center;
    align-items: center;
    gap: 4px;
    display: flex;
  }

  .is-watch-layout .profile-post-book-end {
    justify-content: flex-end;
    justify-self: end;
    align-items: center;
    min-width: 0;
    display: flex;
  }

  .is-watch-layout .profile-post-book-btn, .profile-comments-dock .profile-post-book-btn {
    gap: 6px;
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
  }

  .is-watch-layout .profile-post-book-btn.is-labeled, .profile-comments-dock .profile-post-book-btn.is-labeled {
    width: auto;
    min-width: 0;
    height: 36px;
    min-height: 36px;
    padding: 0 12px;
  }

  .is-watch-layout .profile-post-book-btn svg, .profile-comments-dock .profile-post-book-btn svg {
    flex-basis: 15px;
    width: 15px;
    height: 15px;
  }

  .is-watch-layout .profile-post-book-label, .is-watch-layout .profile-post-book-count, .profile-comments-dock .profile-post-book-label, .profile-comments-dock .profile-post-book-count {
    height: 12px;
  }

  .profile-comments-dock {
    z-index: 2;
    pointer-events: auto;
    width: 100%;
    min-width: 0;
    max-width: none;
    height: 100%;
    min-height: 0;
    color: var(--color-cursor-text-bright, var(--mos-text, #f4f1ea));
    border: 0;
    border-left: 1px solid var(--mos-plate, var(--color-cursor-border, var(--mos-border)));
    filter: none;
    isolation: auto;
    contain: none;
    box-shadow: none;
    border-radius: 0;
    flex-direction: column;
    flex: auto;
    align-self: stretch;
    display: flex;
    position: relative;
    top: auto;
    bottom: auto;
    right: auto;
    overflow: hidden;
    transform: none;
    background: var(--mos-panel, var(--mos-page, var(--color-cursor-sidebar, var(--mos-page)))) !important;
  }

  .profile-comments-dock:before {
    content: none;
  }

  .profile-comments-dock > :not(.profile-comments-lightbox) {
    z-index: 1;
    position: relative;
  }

  .profile-comments-dock > .profile-comments-search {
    z-index: 5;
  }

  .profile-comments-dock .profile-comments-head {
    height: var(--cursor-head-h, 36px);
    min-height: var(--cursor-head-h, 36px);
    max-height: var(--cursor-head-h, 36px);
    box-sizing: border-box;
    border-bottom: none;
    flex: none;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 1;
    overflow: hidden;
  }

  .profile-comments-dock .profile-comments-thread-avatar, .profile-comments-dock .profile-comments-thread-avatar.studio-profile-avatar {
    width: 28px;
    height: 28px;
    box-shadow: 0 1px 2px #0f121829, inset 0 1px #ffffff1f;
  }

  .profile-comments-dock .profile-comments-thread-preview strong {
    font-size: 12px;
    font-weight: 650;
    line-height: 1;
  }

  .profile-comments-dock .profile-comments-search {
    flex: none;
  }

  .profile-comments-dock .profile-comments-list {
    flex: auto;
    min-height: 0;
    padding-top: 0;
  }

  .profile-comments-dock .profile-comments-list.is-empty, .profile-comments-dock .profile-comments-list.is-loading {
    flex: auto;
    padding-top: 16px;
  }

  .profile-comments-dock .profile-comments-composer {
    background: none;
    border-top: none;
    flex: none;
    padding: 0 10px 12px;
  }
}

.profile-comments-sheet {
  top: 0;
  left: 0;
  right: 0;
  bottom: calc(var(--studio-mobile-nav-height, 44px) + env(safe-area-inset-bottom, 0px));
  z-index: 50;
  pointer-events: auto;
  align-items: end;
  display: grid;
  position: absolute !important;
}

.profile-comments-dismiss {
  cursor: pointer;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
}

.profile-comments-panel {
  pointer-events: auto;
  color: #f4f1ea;
  border: 1px solid var(--studio-composer-glass-border, var(--color-cursor-border, var(--mos-border)));
  filter: none;
  isolation: auto;
  box-shadow: var(--studio-composer-glass-shadow, 0 20px 48px #00000061,
    inset 0 1px 0 color-mix(in srgb, var(--color-cursor-text) 8%, transparent));
  background: none;
  grid-template-rows: auto minmax(0, 1fr) auto;
  display: grid;
  transform: none;
}

.profile-comments-panel.is-sheet {
  z-index: 1;
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
  width: 100%;
  max-height: min(78dvh, 720px);
  padding-bottom: 0;
  position: relative;
  overflow: hidden;
}

.profile-comments-panel.is-sheet:before {
  content: "";
  z-index: 0;
  border-radius: inherit;
  pointer-events: none;
  background: color-mix(in srgb, var(--color-mos-composer, #07111f) 68%, transparent);
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(160%) blur(12px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(160%) blur(12px));
  position: absolute;
  inset: 0;
}

.profile-comments-panel.is-sheet > :not(.profile-comments-lightbox) {
  z-index: 1;
  position: relative;
}

.profile-comments-panel.is-sheet > .profile-comments-search {
  z-index: 5;
}

.profile-comments-panel.is-sheet .profile-comments-composer {
  border-top: none;
  padding: 0 10px 10px;
}

.profile-comments-head {
  min-height: var(--cursor-head-h, 36px);
  border-bottom: 0;
  flex: none;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 10px;
  display: flex;
}

.profile-comments-head > div:not(.profile-comments-thread-head):not(.profile-comments-post-actions) {
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.profile-comments-head strong {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}

.profile-comments-head span {
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 55%, transparent));
  font-size: 12px;
  font-weight: 650;
}

.profile-comments-search {
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  z-index: 5;
  background: none;
  flex: none;
  width: 100%;
  padding: 2px 0;
  position: relative;
  overflow: visible;
}

.profile-comments-dock .profile-comments-search, .studio-cn-book-sheet.is-profile-comments .profile-comments-search {
  background: none;
  padding: 8px 8px 0;
}

.profile-comments-dock .profile-comments-search .cursor-panel-search, .studio-cn-book-sheet.is-profile-comments .profile-comments-search .cursor-panel-search {
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
}

[data-appearance="light"] .profile-comments-dock .profile-comments-search .cursor-panel-search, [data-appearance="light"] .studio-cn-book-sheet.is-profile-comments .profile-comments-search .cursor-panel-search {
  background: var(--mos-plate) !important;
}

.profile-comments-search .cursor-panel-search {
  width: auto;
}

.studio-polish .profile-comments-search .cursor-panel-search, .profile-comments-panel .profile-comments-search .cursor-panel-search, .profile-comments-dock .profile-comments-search .cursor-panel-search, .studio-cn-book-sidebar-body .profile-comments-search .cursor-panel-search, .studio-cn-book-sheet .profile-comments-search .cursor-panel-search {
  border: none;
  width: auto;
}

@media (min-width: 900px) {
  .profile-comments-dock > .profile-comments-search {
    border-top: none;
  }
}

.profile-comments-search .desk-explorer-type-filter {
  z-index: 6;
  flex: none;
  max-width: 8.5rem;
  position: relative;
}

.profile-comments-search .desk-explorer-type-filter-trigger > span {
  text-overflow: ellipsis;
  overflow: hidden;
}

[data-appearance="light"] .profile-comments-search {
  border-bottom: 0;
}

.profile-comments-close {
  width: 24px;
  height: 24px;
  color: inherit;
  cursor: pointer;
  background: #ffffff14;
  border: 0;
  border-radius: 999px;
  flex-shrink: 0;
  place-items: center;
  margin: 0;
  padding: 0;
  line-height: 0;
  display: grid;
}

.profile-comments-close svg {
  width: 14px;
  height: 14px;
  display: block;
}

.profile-comments-head-meta {
  pointer-events: none;
  flex: none;
  margin-left: auto;
}

.profile-comments-head .profile-comments-head-meta .profile-post-book-label {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.profile-comments-head .profile-comments-head-meta .profile-post-book-count {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.profile-comments-post-actions {
  flex-shrink: 0;
  align-self: center;
  align-items: center;
  gap: 2px;
  min-height: 24px;
  margin-left: auto;
  display: inline-flex;
}

.profile-comments-post-actions .profile-comments-close {
  align-self: center;
  margin-left: 2px;
}

.profile-comments-post-action {
  height: 24px;
  min-height: 24px;
  color: inherit;
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0 4px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
}

.profile-comments-post-action svg {
  width: 14px;
  height: 14px;
}

.profile-comments-post-action.is-liked {
  color: inherit;
}

.profile-comments-post-action.is-liked svg, .profile-comments-post-action.is-liked:hover svg {
  color: #f5c400 !important;
}

.profile-comments-post-action.is-saved {
  color: inherit;
}

.profile-comments-post-action.is-saved svg, .profile-comments-post-action.is-saved:hover svg {
  color: #ffc53d !important;
}

.profile-comments-post-action span {
  color: inherit;
}

.profile-comments-post-action:disabled {
  opacity: .55;
  cursor: wait;
}

.profile-comments-head.is-thread {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.profile-comments-head.is-thread .profile-comments-post-actions {
  align-self: center;
  align-items: center;
  height: 24px;
  min-height: 24px;
  margin-left: 0;
  display: inline-flex;
}

.profile-comments-head.is-thread .profile-comments-post-action, .profile-comments-head.is-thread .profile-comments-close {
  align-self: center;
  margin-top: 0;
  margin-bottom: 0;
}

.profile-comments-head.is-thread .profile-comments-close {
  width: 24px;
  height: 24px;
}

.profile-comments-thread-head {
  flex: 1;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.profile-comments-back {
  width: 24px;
  height: 24px;
  color: inherit;
  cursor: pointer;
  background: #ffffff14;
  border: 0;
  border-radius: 999px;
  flex-shrink: 0;
  place-items: center;
  margin: 0;
  display: grid;
}

.profile-comments-back svg {
  width: 14px;
  height: 14px;
}

.profile-comments-thread-avatar {
  flex-shrink: 0;
}

.profile-comment-avatar {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  box-shadow: 0 1px 2px #0f121829, inset 0 1px #ffffff1f;
}

.profile-comments-thread-preview {
  flex: 1;
  gap: 0;
  min-width: 0;
  padding: 0;
  display: grid;
  overflow: hidden;
}

.profile-comments-post-action.is-static, span.profile-post-book-btn {
  cursor: default;
  pointer-events: none;
}

.profile-comments-thread-preview strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.05;
  overflow: hidden;
}

.profile-comments-thread-preview time {
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 55%, transparent));
  margin-top: -1px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
}

.profile-comments-list {
  scrollbar-width: none;
  -ms-overflow-style: none;
  flex-direction: column;
  align-content: start;
  gap: 8px;
  min-height: 0;
  padding: 10px 14px 12px;
  display: flex;
  overflow: auto;
}

.profile-comments-list::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.profile-comments-day {
  flex: none;
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  padding: 6px 0 2px;
  display: flex;
}

.profile-comments-day span {
  background: var(--mos-plate, var(--mos-panel));
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-2xs, 10px);
  letter-spacing: .03em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 3px 10px;
  font-weight: 650;
}

.profile-comments-list.is-empty, .profile-comments-list.is-loading {
  grid-template-rows: 1fr;
  align-content: stretch;
  height: 100%;
  padding: 10px 12px 8px;
  display: grid;
}

.profile-description-body, .profile-comments-dock .profile-comments-list.profile-description-body, .profile-comments-panel.is-sheet .profile-comments-list.profile-description-body {
  padding: 14px 14px 18px;
}

.profile-description-body.is-empty, .profile-comments-dock .profile-comments-list.profile-description-body.is-empty, .profile-comments-panel.is-sheet .profile-comments-list.profile-description-body.is-empty {
  padding: 14px;
}

.profile-description-content {
  --pc-ink: var(--color-cursor-text-bright, #ffffffeb);
  --pc-muted: var(--color-cursor-muted, #ffffff94);
  --pc-line: var(--color-cursor-border, var(--mos-border));
  --pc-hover: color-mix(in srgb, var(--color-cursor-text) 8%, transparent);
  --pc-panel: var(--mos-panel, var(--color-mos-composer, #07111f));
  --pc-accent: var(--cursor-accent, var(--color-cursor-accent, #d8ff3e));
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  display: flex;
}

.profile-description-edit {
  flex-direction: column;
  gap: 10px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.profile-description-edit-input {
  width: 100%;
  min-height: 140px;
  color: inherit;
  font: inherit;
  resize: vertical;
  background: #ffffff12;
  border: 1px solid #ffffff24;
  border-radius: 12px;
  outline: none;
  margin: 0;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.45;
}

.profile-description-edit-input:focus {
  border-color: color-mix(in srgb, var(--cursor-accent, #84cc16) 55%, transparent);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--cursor-accent, #84cc16) 22%, transparent);
}

.profile-description-edit-input:disabled {
  opacity: .65;
}

.profile-description-edit-bar {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  display: flex;
}

.profile-description-edit-count {
  color: #ffffff8c;
  font-size: 12px;
  font-weight: 500;
}

.profile-description-edit-actions {
  align-items: center;
  gap: 8px;
  display: flex;
}

.profile-description-edit-btn {
  color: inherit;
  font: inherit;
  cursor: pointer;
  background: #ffffff14;
  border: 1px solid #ffffff29;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.profile-description-edit-btn.is-primary {
  border-color: color-mix(in srgb, var(--cursor-accent, #84cc16) 42%, transparent);
  background: color-mix(in srgb, var(--cursor-accent, #84cc16) 22%, transparent);
}

.profile-description-edit-btn:disabled {
  opacity: .55;
  cursor: wait;
}

.profile-description-edit-error {
  color: var(--mos-danger, #fb7185);
  margin: 0;
  font-size: 12px;
  font-weight: 550;
}

.profile-description-empty-edit {
  color: var(--cursor-accent, #84cc16);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  margin: 10px 0 0;
  padding: 0;
  font-size: 13px;
  font-weight: 650;
}

.profile-description-empty-edit:hover {
  text-decoration: underline;
}

.profile-description-user {
  color: inherit;
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  align-self: flex-start;
  padding: 0;
  font-size: 14px;
  font-weight: 700;
}

.profile-description-text {
  color: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.65;
}

.profile-description-text .post-compose-inline-chip, .profile-description-tags .post-compose-inline-chip, .profile-description-content .post-compose-inline-chip.profile-description-chip {
  vertical-align: middle;
  max-width: min(220px, 80%);
  text-shadow: none;
  color: inherit;
  cursor: default;
  margin: 0;
}

button.post-compose-inline-chip.profile-description-chip {
  appearance: none;
  letter-spacing: .01em;
  cursor: pointer;
  color: inherit;
  font-family: inherit;
  font-size: .82em;
  font-weight: 600;
  line-height: 1;
}

.profile-description-text .post-compose-inline-chip.is-hash .post-compose-inline-chip-label, .profile-description-text .post-compose-inline-chip.is-mention .post-compose-inline-chip-label, .profile-description-tags .post-compose-inline-chip.is-hash .post-compose-inline-chip-label, .profile-description-tags .post-compose-inline-chip.is-mention .post-compose-inline-chip-label {
  font-size: 1em;
  font-weight: 600;
}

.profile-description-tags .post-compose-inline-chip.is-hash {
  padding-left: 2px;
}

.profile-description-sheet-spacer {
  min-height: max(12px, env(safe-area-inset-bottom, 0px));
  flex: none;
}

.profile-comments-panel.is-sheet .profile-description-sheet-spacer {
  min-height: 12px;
}

[data-appearance="light"] .profile-description-content {
  --pc-ink: var(--color-cursor-text-bright, #0f172a);
  --pc-muted: var(--color-cursor-muted);
  --pc-line: var(--color-cursor-border, var(--mos-border));
  --pc-hover: color-mix(in srgb, var(--color-cursor-text) 7%, transparent);
  --pc-panel: var(--mos-panel, var(--mos-page));
  color: var(--pc-ink);
}

[data-appearance="light"] .profile-description-user, [data-appearance="light"] .profile-description-text, [data-appearance="light"] .profile-description-text .post-compose-inline-chip, [data-appearance="light"] .profile-description-tags .post-compose-inline-chip, [data-appearance="light"] .profile-description-content .post-compose-inline-chip.profile-description-chip {
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-description-edit-input {
  background: color-mix(in srgb, var(--color-cursor-text) 4%, var(--mos-panel, #fff));
  border-color: var(--color-cursor-border, var(--mos-border));
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-description-edit-count {
  color: #0f172a85;
}

[data-appearance="light"] .profile-description-edit-btn {
  border-color: var(--color-cursor-border, var(--mos-border));
  background: var(--mos-plate-strong, color-mix(in srgb, var(--color-cursor-text) 6%, transparent));
  color: var(--color-cursor-text-bright, #0f172a);
}

.profile-comments-list.has-parent.is-loading, .profile-comments-list.has-parent.is-replies-empty {
  flex-direction: column;
  height: 100%;
  min-height: 0;
  padding: 0;
  display: flex;
}

.profile-comments-list.has-parent.is-loading .profile-comment-parent-body, .profile-comments-list.has-parent.is-replies-empty .profile-comment-parent-body {
  flex: none;
}

.profile-comments-list.has-parent.is-loading .profile-comments-empty, .profile-comments-list.has-parent.is-replies-empty .profile-comments-empty {
  flex: auto;
  place-content: center;
  align-self: stretch;
  place-items: center;
  height: auto;
  min-height: 160px;
  padding: 28px 16px;
  display: grid;
}

.profile-comment-parent-body {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--mos-panel));
  border-radius: 8px 18px 18px;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: 8px 10px 10px;
  display: flex;
}

.profile-comment-parent-content {
  gap: 8px;
  min-width: 0;
  display: grid;
}

.profile-comment-parent-content .profile-comment-like {
  justify-self: start;
}

.profile-comment-parent-body p, .profile-comment-parent-content p {
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
}

.profile-comment-image-btn {
  cursor: zoom-in;
  background: none;
  border: 0;
  border-radius: 8px;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  margin: 2px 0 0;
  padding: 0;
  display: block;
  overflow: hidden;
}

.profile-comment-image {
  object-fit: cover;
  background: var(--color-cursor-border-soft);
  border-radius: 8px;
  width: 48px;
  height: 48px;
  margin: 0;
  display: block;
}

.profile-comments-lightbox {
  z-index: 30;
  box-sizing: border-box;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-radius: inherit;
  background: #05070cf0;
  min-width: 0;
  min-height: 0;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.profile-comments-lightbox-dismiss {
  cursor: pointer;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
}

.profile-comments-lightbox-frame {
  z-index: 1;
  pointer-events: none;
  min-width: 0;
  min-height: 0;
  position: absolute;
  inset: 52px 16px 16px;
}

.profile-comments-lightbox-image {
  object-fit: contain;
  object-position: center;
  border-radius: 10px;
  width: 100%;
  height: 100%;
  display: block;
  box-shadow: 0 16px 40px #00000073;
}

.profile-comments-lightbox-close {
  z-index: 2;
  color: #fff;
  cursor: pointer;
  background: #0a0d14d1;
  border: 0;
  border-radius: 999px;
  place-items: center;
  width: 36px;
  height: 36px;
  display: grid;
  position: absolute;
  top: 12px;
  right: 12px;
  box-shadow: inset 0 1px #ffffff14, 0 4px 14px #0006;
}

.profile-comments-empty {
  color: #ffffff94;
  text-align: center;
  place-content: center;
  align-self: stretch;
  place-items: center;
  gap: 6px;
  min-height: 100%;
  padding: 24px 16px;
  font-size: 13px;
  display: grid;
}

.profile-comments-empty.is-first {
  gap: 10px;
}

.profile-comments-empty-avatar.studio-profile-avatar {
  --spa-size: 48px;
  --spa-font: 16px;
  margin-bottom: 2px;
}

.profile-comments-empty-icon {
  opacity: .55;
  stroke-width: 1.75px;
  width: 28px;
  height: 28px;
  margin-bottom: 4px;
}

.profile-comments-empty-spin {
  opacity: .55;
  width: 18px;
  height: 18px;
  animation: .7s linear infinite profile-post-rail-spin;
}

.profile-comments-empty p {
  color: #ffffffc7;
  letter-spacing: .01em;
  margin: 0;
  font-size: 14px;
  font-weight: 650;
}

.profile-comments-empty span {
  opacity: .85;
  max-width: 18ch;
  font-size: 12px;
  line-height: 1.35;
}

[data-appearance="light"] .profile-comments-empty {
  color: #0f172a85;
}

[data-appearance="light"] .profile-comments-empty p {
  color: #0f172ac7;
}

.profile-comment-swipe-shell {
  box-sizing: border-box;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
  position: relative;
  overflow: visible;
}

.profile-comment-swipe-shell.is-mine {
  justify-content: flex-end;
}

.profile-comment-swipe-shell > .profile-comment-row {
  touch-action: pan-y;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.profile-comment-swipe-reply {
  z-index: 0;
  background: var(--mos-plate-strong, var(--mos-raised));
  width: 28px;
  height: 28px;
  color: var(--color-cursor-text, var(--mos-text));
  pointer-events: none;
  border-radius: 999px;
  place-items: center;
  margin-top: -14px;
  display: grid;
  position: absolute;
  top: 50%;
  left: 6px;
}

.profile-comment-swipe-reply svg {
  width: 14px;
  height: 14px;
}

.profile-comment-row {
  cursor: grab;
  border-bottom: 0;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
  padding: 0;
  display: flex;
}

.profile-comment-row.is-reply {
  padding-left: 16px;
}

.profile-comment-row.is-mine {
  flex-direction: row-reverse;
  justify-content: flex-start;
}

.profile-comment-row.is-mine.is-reply {
  padding-left: 0;
  padding-right: 16px;
}

.profile-comment-row.is-mine .profile-comment-body {
  align-items: flex-end;
}

.profile-comment-row:active {
  cursor: grabbing;
}

.profile-comments-thread-head[draggable="true"], .profile-description-content[draggable="true"] {
  cursor: grab;
}

.profile-comments-thread-head[draggable="true"]:active, .profile-description-content[draggable="true"]:active {
  cursor: grabbing;
}

.profile-comment-body {
  flex-direction: column;
  flex: auto;
  align-items: stretch;
  gap: 2px;
  width: 100%;
  min-width: 0;
  max-width: none;
  display: flex;
}

.profile-comment-bubble {
  box-sizing: border-box;
  background: var(--mos-plate, var(--mos-panel));
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: 8px 18px 18px;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 7px 10px 8px;
  display: flex;
}

.profile-comment-row.is-mine .profile-comment-bubble {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 16%,
    var(--mos-plate, var(--mos-panel)));
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 26%,
    var(--color-cursor-border-soft, var(--mos-border-soft)));
  border-radius: 18px 8px 18px 18px;
}

.profile-comment-meta {
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.profile-comment-meta time {
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 48%, transparent));
  white-space: nowrap;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
}

.profile-comment-bubble-copy {
  flex-wrap: wrap;
  align-items: flex-start;
  column-gap: 6px;
  min-width: 0;
  display: flex;
}

.profile-comment-bubble-copy > p {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  display: block;
}

.profile-comment-bubble-copy > .profile-comment-image-btn {
  flex: 100%;
}

.profile-comment-bubble-actions {
  flex: none;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;
  width: auto;
  margin: 0;
  display: flex;
}

.profile-comment-bubble-actions .profile-comment-like, .profile-comment-bubble-actions .profile-comment-reply {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
  color: var(--color-cursor-muted, var(--mos-muted));
  box-shadow: none;
  background: none;
  border-radius: 999px;
  gap: 5px;
  padding: 0;
  font-size: 12px;
  font-weight: 650;
}

:is(.profile-comment-bubble-actions .profile-comment-like:has(span), .profile-comment-bubble-actions .profile-comment-reply:has(span)) {
  width: auto;
  padding: 0 10px;
}

.profile-comment-bubble-actions .profile-comment-like svg, .profile-comment-bubble-actions .profile-comment-reply svg {
  stroke-width: 2px;
  fill: none;
  width: 14px;
  height: 14px;
}

.profile-comment-bubble-actions .profile-comment-like.is-liked svg {
  fill: currentColor;
}

.profile-comment-bubble-actions .profile-comment-like:hover, .profile-comment-bubble-actions .profile-comment-reply:hover {
  background: color-mix(in srgb, currentColor 8%, transparent);
  color: var(--color-cursor-text, var(--mos-text));
}

.profile-comment-bubble-actions .profile-comment-stamp {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  justify-content: center;
  align-items: center;
  width: auto;
  padding: 0 10px;
  line-height: 1;
  display: inline-flex;
}

.profile-comment-reply {
  min-width: 28px;
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 55%, transparent));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  flex-direction: row;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
}

.profile-comment-reply.is-static {
  cursor: default;
}

.profile-comment-reply:hover {
  color: var(--color-cursor-text-bright, currentColor);
}

.profile-comment-meta-text {
  flex: auto;
  gap: 1px;
  min-width: 0;
  display: grid;
}

.profile-comment-meta-top, .profile-comment-meta-sub {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.profile-comment-meta strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
}

.profile-comment-video-time {
  appearance: none;
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  height: 18px;
  min-height: 18px;
  color: var(--color-cursor-muted, var(--mos-muted));
  font: inherit;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 3px;
  margin: 0;
  padding: 0 5px 0 4px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.profile-comment-video-time svg {
  flex: none;
  width: 11px;
  height: 11px;
  display: block;
  overflow: visible;
}

.profile-comment-video-time span {
  align-items: center;
  height: 11px;
  line-height: 1;
  display: inline-flex;
  transform: translateY(1px);
}

.profile-comment-video-time:hover:not(:disabled) {
  background: color-mix(in srgb, currentColor 8%, transparent);
  color: var(--color-cursor-text, var(--mos-text));
}

.profile-comment-video-time:disabled {
  cursor: default;
  opacity: 1;
}

.profile-comment-creator-tag {
  border: 1px solid color-mix(in srgb, var(--cursor-accent, #d8ff3e) 42%, transparent);
  background: linear-gradient(180deg, color-mix(in srgb, var(--cursor-accent, #d8ff3e) 22%, transparent), transparent 72%),
    color-mix(in srgb, var(--cursor-accent, #d8ff3e) 14%, #ffffff0f);
  height: 14px;
  color: color-mix(in srgb, var(--cursor-accent, #d8ff3e) 88%, #fff);
  letter-spacing: .05em;
  text-transform: uppercase;
  border-radius: 999px;
  align-items: center;
  padding: 0 5px;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  box-shadow: inset 0 1px #ffffff1f;
}

.profile-comment-meta .profile-comment-delete {
  flex-shrink: 0;
  margin-left: auto;
}

.profile-comment-body p {
  overflow-wrap: anywhere;
  word-break: break-word;
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
}

.profile-comment-actions {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-width: 0;
  margin-top: 2px;
  display: flex;
}

.profile-comment-actions-left {
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.profile-comment-action, .profile-comment-view-replies {
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 68%, transparent));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
}

.profile-comment-view-replies:hover, .profile-comment-action:hover {
  color: var(--color-cursor-text-bright, currentColor);
}

.profile-comment-like {
  min-width: 28px;
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 55%, transparent));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  flex-direction: row;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
}

.profile-comment-like svg {
  width: 16px;
  height: 16px;
}

.profile-comment-like.is-liked {
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 55%, transparent));
}

.profile-comment-like.is-liked svg, .profile-comment-like.is-liked:hover svg {
  color: #f5c400 !important;
}

.profile-comment-like span {
  color: inherit;
}

.profile-comment-delete {
  width: 28px;
  height: 28px;
  color: var(--color-cursor-muted, color-mix(in srgb, currentColor 48%, transparent));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  flex-shrink: 0;
  place-items: center;
  display: grid;
}

.profile-comments-composer.studio-dm-composer.is-split {
  box-sizing: border-box;
  background: none;
  border-top: none;
  gap: 0;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 10px 12px;
  display: block;
}

.profile-comments-composer.is-sheet-composer {
  padding: 0 10px 12px;
}

.profile-comments-composer-box {
  background: var(--mos-page, var(--color-cursor-panel));
  -webkit-backdrop-filter: none;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 0;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent);
  border: 0;
  border-radius: 20px;
  outline: none;
  flex-direction: column;
  display: flex;
  position: relative;
  overflow: hidden;
}

.profile-comments-composer-box:focus-within {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent);
  border: 0;
  outline: none;
}

.profile-comments-composer .profile-comments-composer-box:before, .profile-comments-composer .profile-comments-composer-box:after, .profile-comments-composer .studio-dm-composer-box:before, .profile-comments-composer .studio-dm-composer-box:after {
  content: none !important;
  opacity: 0 !important;
  border: 0 !important;
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.profile-comments-composer.studio-dm-composer.is-split .studio-dm-composer-row.is-message {
  border-radius: 0;
  align-items: center;
  width: auto;
  margin: 0;
  padding: 6px 8px;
  display: flex;
  min-height: 0 !important;
  box-shadow: none !important;
  background: none !important;
}

.profile-comments-composer.studio-dm-composer.is-split .studio-dm-composer-row.is-extras {
  align-items: flex-end;
  gap: 8px;
  min-height: 0;
  padding: 4px 8px 6px;
}

.profile-comments-composer-box.is-single-line {
  border-radius: 999px;
  flex-flow: row;
  align-items: center;
  gap: 8px;
  height: 48px;
  min-height: 48px;
  padding: 4px 8px;
}

.profile-comments-composer-box.is-single-line .studio-dm-composer-row.is-message {
  width: auto;
  max-width: none;
  min-height: 0;
  box-shadow: none;
  background: none;
  border-radius: 0;
  flex: auto;
  order: 2;
  align-items: center;
  margin: 0;
  padding: 6px 8px;
}

.profile-comments-composer-box:not(.is-single-line) {
  border-radius: 16px;
  flex-direction: column;
  align-items: stretch;
}

.profile-comments-composer-box:not(.is-single-line) .studio-dm-composer-row.is-message {
  flex: auto;
  order: 1;
  align-items: flex-start;
  width: calc(100% - 16px);
  margin: 8px 8px 0;
}

.profile-comments-composer-box:not(.is-single-line) .studio-dm-composer-row.is-extras {
  order: 2;
  width: 100%;
  display: flex;
}

.profile-comments-composer-box.is-single-line .studio-dm-composer-row.is-extras {
  display: contents;
}

.profile-comments-composer-box.is-single-line .studio-dm-extras-spacer {
  display: none;
}

.profile-comments-composer-box.is-single-line .studio-dm-composer-circle:not(.cursor-composer-mic):not(.studio-composer-send-btn):not(.is-discard) {
  order: 1;
}

.profile-comments-composer-box.is-single-line .cursor-composer-mic, .profile-comments-composer-box.is-single-line .is-discard {
  order: 4;
}

.profile-comments-composer-box.is-single-line .studio-composer-send-btn {
  order: 5;
}

@media (min-width: 900px) {
  .profile-comments-composer-box {
    height: auto;
    min-height: 0;
  }

  .profile-comments-composer-box.is-single-line {
    height: 48px;
    min-height: 48px;
    max-height: 48px;
  }

  .profile-comments-composer-box.is-single-line .profile-comments-inputline textarea {
    height: 22px;
    min-height: 22px;
    max-height: 22px;
    overflow: hidden;
  }

  .profile-comments-composer-box:not(.is-single-line) .profile-comments-inputline textarea {
    height: auto;
    min-height: 44px;
    max-height: 120px;
    overflow-y: auto;
  }

  .profile-comments-composer .studio-composer-circle-btn.studio-dm-composer-circle, .profile-comments-composer .studio-composer-circle-btn.studio-composer-send-btn {
    gap: 0;
    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;
    padding: 0;
  }

  .profile-comments-composer-box > .studio-composer-resize-handle {
    display: none;
  }
}

.profile-comments-inputline {
  box-sizing: border-box;
  flex-direction: row;
  align-items: center;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 22px;
  display: flex;
  overflow: hidden;
}

.profile-comments-composer-box:not(.is-single-line) .profile-comments-inputline {
  align-items: flex-start;
  overflow: auto;
}

.profile-comments-inputline textarea, .profile-comments-inputline input {
  resize: none;
  width: 100%;
  min-height: 22px;
  max-height: 120px;
  color: inherit;
  font: inherit;
  box-shadow: none;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: none;
  border: 0;
  border-radius: 0;
  outline: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
  font-weight: 550;
  line-height: 22px;
  display: block;
  overflow: hidden;
}

.profile-comments-inputline textarea:focus, .profile-comments-inputline input:focus {
  box-shadow: none;
  border: 0;
  outline: none;
}

.profile-comments-inputline textarea::placeholder, .profile-comments-inputline input::placeholder {
  color: var(--color-cursor-muted, var(--mos-muted));
}

@media (max-width: 899px) {
  .profile-comments-inputline {
    padding: 0;
  }

  .profile-comments-inputline textarea, .profile-comments-inputline input {
    min-height: 26px;
  }

  .profile-comments-circle-btn {
    width: var(--studio-mobile-chrome-control, 34px);
    height: var(--studio-mobile-chrome-control, 34px);
  }
}

.profile-comments-inputline.is-recording {
  flex-direction: row;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  display: flex;
}

.profile-comments-rec-meta {
  flex: none;
  align-items: center;
  gap: 6px;
  display: inline-flex;
}

.profile-comments-rec-dot {
  background: var(--mos-danger, #f87171);
  opacity: .5;
  border-radius: 999px;
  width: 8px;
  height: 8px;
}

.profile-comments-rec-dot.is-live {
  opacity: 1;
  animation: 1.1s ease-in-out infinite profile-comments-rec-pulse;
}

@keyframes profile-comments-rec-pulse {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: .35;
  }
}

.profile-comments-rec-time {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 11px;
  font-weight: 700;
}

.profile-comments-rec-wave {
  flex: auto;
  min-width: 0;
}

.profile-comments-composer-toolbar {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 2px 8px 6px;
  display: flex;
}

.profile-comments-composer-box.is-single-line .profile-comments-composer-toolbar {
  display: contents;
}

.profile-comments-composer-spacer {
  flex: auto;
  min-width: 0;
}

.profile-comments-composer-toolbar .studio-composer-circle-btn.is-discard {
  color: var(--mos-danger, #f87171);
}

.profile-comment-voice {
  flex: 100%;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 4px 0 2px;
  overflow: hidden;
}

.profile-comment-voice .studio-chat-audio-player, .profile-comment-voice .studio-chat-audio-player.is-compact {
  background: none;
  border: 0;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 2px 0;
}

.profile-comment-voice .studio-chat-audio-wave, .profile-comment-voice .studio-chat-audio-player.is-compact .studio-chat-audio-wave, .profile-comment-voice .studio-chat-audio-waveform {
  min-width: 0;
  max-width: 100%;
}

.profile-comments-circle-btn {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: color-mix(in srgb, var(--color-cursor-text) 8%, transparent);
  width: 30px;
  height: 30px;
  color: var(--color-cursor-text-bright);
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
}

.profile-comments-circle-btn svg {
  width: 15px;
  height: 15px;
}

.profile-comments-circle-btn:disabled:not(.is-send) {
  opacity: .55;
  cursor: default;
}

.profile-comments-circle-btn.is-on {
  border-color: color-mix(in srgb, var(--cursor-accent, #d8ff3e) 48%, transparent);
  background: color-mix(in srgb, var(--cursor-accent, #d8ff3e) 16%, transparent);
  color: #fff;
}

.profile-comments-attach-preview {
  width: fit-content;
  margin: 10px 14px 0;
  position: relative;
}

.profile-comments-attach-preview.is-voice {
  width: calc(100% - 28px);
  max-width: 22rem;
}

.profile-comments-attach-preview.is-voice .studio-chat-audio-player {
  width: 100%;
}

.profile-comments-composer.is-sheet-composer .profile-comments-attach-preview {
  margin: 10px 14px 0;
}

.profile-comments-attach-preview img {
  object-fit: cover;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  border-radius: 8px;
  width: 40px;
  height: 40px;
  display: block;
}

.profile-comments-attach-remove {
  background: var(--color-cursor-border-soft);
  color: #fff;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  place-items: center;
  width: 22px;
  height: 22px;
  display: grid;
  position: absolute;
  top: -6px;
  right: -6px;
}

.profile-comments-circle-btn.is-send {
  border: 1px solid color-mix(in srgb, var(--cursor-accent-hover, #e8ff6a) 52%, var(--cursor-accent, #d8ff3e) 48%);
  border-bottom-color: color-mix(in srgb, var(--cursor-accent, #d8ff3e) 62%, #000 28%);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--cursor-accent-hover, #e8ff6a) 90%, #fff 6%) 0%,
    color-mix(in srgb, var(--cursor-accent, #d8ff3e) 90%, transparent) 46%,
    color-mix(in srgb, var(--cursor-accent, #d8ff3e) 70%, #000 24%) 100%);
  box-shadow: inset 0 -2px 0 var(--color-cursor-border-soft),
    0 2px 3px var(--color-cursor-border-soft),
    0 4px 10px color-mix(in srgb, var(--cursor-accent, #d8ff3e) 18%, transparent);
  color: #fff;
}

.profile-comments-circle-btn.is-send:disabled {
  opacity: .45;
  cursor: wait;
}

.profile-comments-error {
  color: #ffb4b4;
  margin: 0;
  padding: 8px 14px 0;
  font-size: 12px;
}

.profile-comments-composer.is-sheet-composer .profile-comments-error {
  padding: 8px 14px 0;
}

.profile-comments-input-row {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  display: grid;
}

.profile-comments-attach-btn {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: color-mix(in srgb, var(--color-cursor-text) 8%, transparent);
  width: 32px;
  height: 32px;
  color: var(--color-cursor-text-bright);
  cursor: pointer;
  border-radius: 999px;
  place-items: center;
  display: grid;
}

.profile-comments-attach-btn.is-on {
  border-color: color-mix(in srgb, var(--cursor-accent, #d8ff3e) 48%, transparent);
  background: color-mix(in srgb, var(--cursor-accent, #d8ff3e) 16%, transparent);
  color: #fff;
}

.profile-comments-attach-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.profile-comments-input-row .profile-comments-inputline {
  width: 100%;
  min-width: 0;
  margin: 0;
}

.profile-comments-input-row input {
  min-width: 0;
  height: 26px;
  min-height: 26px;
  color: inherit;
  font: inherit;
  box-shadow: none;
  background: none;
  border: 0;
  border-radius: 0;
  outline: none;
  padding: 0;
  font-size: 13px;
  font-weight: 550;
}

.profile-comments-input-row button {
  background: var(--cursor-accent, #d8ff3e);
  color: #fff;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  place-items: center;
  width: 32px;
  height: 32px;
  display: grid;
}

.profile-comments-input-row button:disabled {
  opacity: .45;
  cursor: wait;
}

[data-appearance="light"] .profile-comments-panel.is-sheet:before {
  background: #ffffffb8;
}

[data-appearance="light"] .profile-comments-panel {
  color: var(--color-cursor-text-bright, #0f172a);
  border-color: var(--color-cursor-border, var(--mos-border));
}

[data-appearance="light"] .profile-comments-dock {
  border-left-color: var(--mos-plate, var(--mos-plate));
  box-shadow: none;
  color: var(--color-cursor-text-bright, #0f172a) !important;
  background: var(--mos-panel, var(--color-cursor-sidebar, var(--mos-page))) !important;
}

[data-appearance="light"] .profile-comments-dock .profile-comments-composer {
  background: none;
  border-top: none;
}

[data-appearance="light"] .profile-comments-composer-box {
  background: var(--mos-surface, var(--mos-plate));
}

[data-appearance="light"] .profile-comments-dock .profile-comments-head, [data-appearance="light"] .profile-comments-head {
  border-bottom-color: var(--color-cursor-border-soft, var(--mos-border-soft));
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-comments-head strong, [data-appearance="light"] .profile-comments-thread-preview strong, [data-appearance="light"] .profile-comment-meta strong, [data-appearance="light"] .profile-comment-body p, [data-appearance="light"] .profile-comment-parent-content p {
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-comments-head span {
  color: var(--color-cursor-muted, #0f172a8c);
}

[data-appearance="light"] .profile-comments-head .profile-comments-head-meta .profile-post-book-label {
  color: var(--color-cursor-text-bright, #0f172a);
}

[data-appearance="light"] .profile-comments-inputline {
  box-shadow: none;
  background: none;
}

[data-appearance="light"] .profile-comments-input-row input {
  color: var(--color-cursor-text-bright, #0f172a);
  background: none;
  border-color: #0000;
}

[data-appearance="light"] .profile-comments-thread-preview time, [data-appearance="light"] .profile-comment-action, [data-appearance="light"] .profile-comment-view-replies, [data-appearance="light"] .profile-comment-meta time {
  color: #0f172a85;
}

[data-appearance="light"] .profile-comment-view-replies:hover, [data-appearance="light"] .profile-comment-action:hover {
  color: #0f172ad1;
}

[data-appearance="light"] .profile-comment-like, [data-appearance="light"] .profile-comment-reply {
  color: var(--color-cursor-muted, #0f172a85);
  text-shadow: none;
}

[data-appearance="light"] .profile-comment-like svg {
  filter: none;
}

[data-appearance="light"] .profile-comment-like.is-liked {
  color: #0f172a;
}

[data-appearance="light"] .profile-comment-like.is-liked svg, [data-appearance="light"] .profile-comment-like.is-liked:hover svg {
  color: #d97706 !important;
}

[data-appearance="light"] .profile-comment-like span, [data-appearance="light"] .profile-comments-post-action span {
  color: #0f172a;
}

[data-appearance="light"] .profile-comment-bubble-actions .profile-comment-like, [data-appearance="light"] .profile-comment-bubble-actions .profile-comment-reply, [data-appearance="light"] .profile-comment-bubble-actions .profile-comment-like span, [data-appearance="light"] .profile-comment-bubble-actions .profile-comment-reply span, [data-appearance="light"] .profile-comment-video-time {
  color: var(--color-cursor-muted, #0f172a85);
  background: none;
}

[data-appearance="light"] .profile-comment-row {
  border-bottom: 0;
}

[data-appearance="light"] .profile-comment-parent-body {
  background: var(--mos-plate, var(--mos-panel, var(--mos-plate)));
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
}

[data-appearance="light"] .profile-comment-creator-tag {
  border-color: color-mix(in srgb, var(--cursor-accent, #84cc16) 46%, #0f172a29);
  color: #314c19;
  background: linear-gradient(180deg, color-mix(in srgb, var(--cursor-accent, #84cc16) 18%, transparent), transparent 72%),
    color-mix(in srgb, var(--cursor-accent, #84cc16) 12%, #fff);
  box-shadow: inset 0 1px #ffffffb3;
}

[data-appearance="light"] .profile-comments-inputline textarea::placeholder, [data-appearance="light"] .profile-comments-inputline input::placeholder {
  color: #0f172a66;
}

[data-appearance="light"] .profile-comments-circle-btn {
  border-color: var(--color-cursor-border, var(--mos-border));
  background: color-mix(in srgb, var(--color-cursor-text) 5%, transparent);
  color: var(--color-cursor-text);
}

[data-appearance="light"] .profile-comments-circle-btn.is-send {
  color: var(--cursor-on-accent, #fff);
}

[data-appearance="light"] .profile-comments-attach-btn {
  border-color: var(--color-cursor-border, var(--mos-border));
  background: color-mix(in srgb, var(--color-cursor-text) 5%, transparent);
  color: var(--color-cursor-text);
}

[data-appearance="light"] .profile-comments-back, [data-appearance="light"] .profile-comments-close {
  background: #0f172a0f;
}

.profile-boost-confetti {
  z-index: 80;
  pointer-events: none;
  position: fixed;
  inset: 0;
  overflow: hidden;
}

.profile-boost-confetti-bit {
  border-radius: 1px;
  width: 7px;
  height: 10px;
  margin: -5px 0 0 -3px;
  animation: .9s ease-out forwards profile-boost-confetti-fly;
  position: absolute;
}

@keyframes profile-boost-confetti-fly {
  0% {
    opacity: 1;
    transform: translate(0)rotate(0)scale(1);
  }

  100% {
    transform: translate(var(--dx), var(--dy)) rotate(var(--rot)) scale(.55);
    opacity: 0;
  }
}

/* [project]/src/studio/components/public-offers.css [app-client] (css) */
.public-offers-route {
  background: var(--mos-page);
  height: 100dvh;
  min-height: 0;
  max-height: 100dvh;
  color: var(--color-cursor-text, var(--mos-text, #1b1f24));
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  overflow: hidden;
}

.public-offers-route.is-plain {
  overscroll-behavior: contain;
  overflow-y: auto;
}

.public-offers-shell {
  height: 100%;
  min-height: 0;
  max-height: 100%;
  display: flex;
  overflow: hidden;
}

.public-offers-rail {
  border-right: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--color-cursor-sidebar, var(--mos-sidebar, var(--mos-bg)));
  flex-direction: column;
  flex: 0 0 288px;
  width: 288px;
  min-width: 288px;
  max-width: 288px;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.public-offers-rail-head {
  z-index: 3;
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--color-cursor-sidebar, var(--mos-sidebar, var(--mos-bg)));
  box-sizing: border-box;
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  padding: 0 6px 0 8px;
  display: flex;
  position: sticky;
  top: 0;
}

.public-offers-sidebar-brand {
  border-radius: var(--cursor-radius-sm, 6px);
  min-width: 0;
  height: 100%;
  color: inherit;
  flex: 1;
  align-items: center;
  gap: 8px;
  padding: 0 4px;
  text-decoration: none;
  display: flex;
}

.public-offers-sidebar-brand:hover {
  background: var(--color-cursor-hover, var(--mos-hover));
}

.public-offers-sidebar-brand img {
  object-fit: contain;
  flex: none;
  width: 16px;
  height: 16px;
  display: block;
}

.public-offers-sidebar-brand-text {
  align-items: center;
  min-width: 0;
  min-height: 16px;
  line-height: 16px;
  display: flex;
}

.public-offers-sidebar-brand-text strong {
  font-size: var(--desk-text-sm, 12px);
  letter-spacing: -.01em;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 650;
  line-height: 16px;
  display: block;
  overflow: hidden;
}

.public-offers-rail-search {
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-sidebar, var(--mos-sidebar, var(--mos-bg)));
  cursor: text;
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  display: flex;
}

.public-offers-rail-search svg {
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.public-offers-rail-search input {
  width: 0;
  min-width: 0;
  height: 100%;
  color: inherit;
  font: inherit;
  box-shadow: none;
  box-sizing: border-box;
  appearance: none;
  background: none;
  border: 0;
  border-radius: 0;
  outline: none;
  flex: auto;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
}

.public-offers-rail-search input::placeholder {
  color: var(--color-cursor-muted, var(--mos-muted));
  opacity: 1;
}

.public-offers-rail-search input:focus, .public-offers-rail-search input:focus-visible {
  box-shadow: none;
  outline: none;
}

.public-offers-rail-search input::-webkit-search-cancel-button {
  appearance: none;
}

.public-offers-rail-body {
  overscroll-behavior: contain;
  flex-direction: column;
  flex: auto;
  gap: 10px;
  min-height: 0;
  padding: 8px 0 12px;
  display: flex;
  overflow: hidden auto;
}

.public-offers-rail-detail {
  gap: 10px;
  min-width: 0;
  padding: 0 8px;
  display: grid;
}

.public-offers-rail-detail .public-offers-panel, .public-offers-filters-body .public-offers-rail-detail .public-offers-panel {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--cursor-surface));
  padding: 10px 10px 12px;
}

.public-offers-rail-detail .public-offers-price {
  font-size: 18px;
}

.public-offers-detail-intro {
  gap: 12px;
  display: grid;
}

.public-offers-detail-intro-copy {
  gap: 6px;
  min-width: 0;
  display: grid;
}

.public-offers-detail-intro-copy h1 {
  letter-spacing: -.03em;
  overflow-wrap: anywhere;
  margin: 0;
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 700;
  line-height: 1.15;
}

.public-offers-detail-intro-copy > p {
  font-size: var(--desk-text-ui, 13px);
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  line-height: 1.5;
}

.public-offers-detail-intro-copy a {
  color: inherit;
  font-weight: 650;
  text-decoration: none;
}

.public-offers-detail-intro-copy a:hover {
  color: var(--cursor-accent);
}

.public-offers-detail-intro-meta {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.public-offers-filter-group {
  gap: 2px;
  min-width: 0;
  display: grid;
}

.public-offers-filter-head {
  border-radius: var(--cursor-radius-sm, 6px);
  width: calc(100% - 8px);
  min-height: 26px;
  font-size: var(--desk-text-2xs, 10px);
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  gap: 6px;
  margin: 0 4px;
  padding: 3px 8px;
  font-weight: 700;
  display: flex;
}

.public-offers-filter-head:hover {
  background: var(--color-cursor-hover, var(--mos-hover));
  color: var(--color-cursor-text, var(--mos-text));
}

.public-offers-filter-head span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.public-offers-filter-active {
  border-radius: var(--cursor-radius-pill, 999px);
  background: color-mix(in srgb, var(--cursor-accent) 18%, transparent);
  min-width: 16px;
  height: 16px;
  color: var(--cursor-accent);
  font-style: normal;
  font-size: var(--desk-text-2xs, 10px);
  letter-spacing: 0;
  flex: none;
  place-items: center;
  padding: 0 4px;
  font-weight: 700;
  display: inline-grid;
}

.public-offers-filter-caret {
  flex: none;
  width: 12px;
  height: 12px;
  margin-left: auto;
  transition: transform .12s;
}

.public-offers-filter-group.is-open .public-offers-filter-caret {
  transform: rotate(180deg);
}

.public-offers-filter-options {
  gap: 1px;
  min-width: 0;
  display: grid;
}

.public-offers-filter-btn {
  border-radius: var(--cursor-radius-sm, 6px);
  width: calc(100% - 8px);
  min-height: 26px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  font-size: var(--desk-text-ui, 13px);
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin: 0 4px;
  padding: 3px 8px 3px 12px;
  font-weight: 500;
  transition: background .12s;
  display: flex;
}

.public-offers-filter-btn span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.public-offers-filter-btn em {
  font-style: normal;
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.public-offers-filter-btn:hover {
  background: var(--color-cursor-hover, var(--mos-hover));
}

.public-offers-filter-btn.is-active {
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  font-weight: 650;
}

.public-offers-filter-btn.is-empty {
  opacity: .45;
}

.public-offers-show-more {
  border-radius: var(--cursor-radius-sm, 6px);
  text-align: left;
  width: calc(100% - 8px);
  min-height: 24px;
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  margin: 0 4px;
  padding: 2px 12px;
}

.public-offers-show-more:hover {
  background: var(--color-cursor-hover, var(--mos-hover));
  color: var(--color-cursor-text, var(--mos-text));
}

.public-offers-range {
  box-sizing: border-box;
  width: calc(100% - 8px);
  min-width: 0;
  color: var(--color-cursor-muted, var(--mos-muted));
  align-items: center;
  gap: 6px;
  margin: 2px 4px 4px;
  padding: 0 4px;
  display: flex;
}

.public-offers-range span {
  flex: none;
}

.public-offers-range input {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--cursor-surface-input, var(--mos-plate));
  width: 0;
  min-width: 0;
  height: 28px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  font-size: var(--desk-text-sm, 12px);
  box-sizing: border-box;
  flex: 1 1 0;
  padding: 0 8px;
  line-height: 1.25;
}

.public-offers-range input::placeholder {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.public-offers-range input:focus-visible {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, var(--color-cursor-border));
  outline: none;
}

.public-offers-presets {
  box-sizing: border-box;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  flex-wrap: nowrap;
  gap: 4px;
  width: calc(100% - 8px);
  min-width: 0;
  margin: 0 4px 4px;
  padding: 0 4px 2px;
  display: flex;
  overflow: auto hidden;
}

.public-offers-presets::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.public-offers-preset {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-pill, 999px);
  min-height: 22px;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-xs, 11px);
  white-space: nowrap;
  cursor: pointer;
  background: none;
  flex: none;
  padding: 0 8px;
}

.public-offers-preset:hover {
  background: var(--color-cursor-hover, var(--mos-hover));
  color: var(--color-cursor-text, var(--mos-text));
}

.public-offers-preset.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 32%, var(--color-cursor-border));
  background: color-mix(in srgb, var(--cursor-accent) 12%, transparent);
  color: var(--color-cursor-text, var(--mos-text));
  font-weight: 600;
}

.public-offers-rail-clear {
  align-self: stretch;
  margin: 4px 8px 0;
}

.public-offers-main {
  background: var(--mos-page);
  flex-direction: column;
  flex: auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  display: flex;
  overflow: hidden;
}

.public-offers-main-scroll {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  flex: auto;
  min-height: 0;
  overflow: hidden auto;
}

.public-offers-topbar {
  z-index: 30;
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  background: var(--mos-page);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  box-sizing: border-box;
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 10px;
  display: flex;
  position: sticky;
  top: 0;
}

.public-offers-mobile-book-nav {
  display: none;
}

.public-offers-topbar-title {
  min-width: 0;
  font-size: var(--desk-text-sm, 12px);
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: 0 auto;
  align-items: center;
  font-weight: 650;
  display: flex;
}

.public-offers-topbar-title .public-offers-sidebar-brand {
  padding: 0 2px;
}

.public-offers-topbar-mobile-brand {
  min-width: 0;
  display: none;
}

.public-offers-topbar-search {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate, var(--cursor-surface));
  cursor: text;
  flex: auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 26px;
  padding: 0 10px;
  display: none;
}

.public-offers-topbar-search svg {
  width: 13px;
  height: 13px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.public-offers-topbar-search input {
  width: 0;
  min-width: 0;
  height: 100%;
  color: inherit;
  font: inherit;
  box-sizing: border-box;
  appearance: none;
  background: none;
  border: 0;
  outline: none;
  flex: auto;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.25;
}

.public-offers-topbar-search input::placeholder {
  color: var(--color-cursor-muted, var(--mos-muted));
  opacity: 1;
}

.public-offers-topbar-search input::-webkit-search-cancel-button {
  appearance: none;
}

.public-offers-brand {
  min-width: 0;
  color: inherit;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  display: inline-flex;
}

.public-offers-brand img {
  object-fit: contain;
  width: 16px;
  height: 16px;
  display: block;
}

.public-offers-brand strong {
  font-size: var(--desk-text-ui, 13px);
  letter-spacing: -.01em;
  white-space: nowrap;
  font-weight: 650;
}

.public-offers-brand span {
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  font-weight: 600;
}

.public-offers-topbar-actions {
  flex: none;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  display: flex;
}

.public-offers-btn {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  min-height: 26px;
  color: inherit;
  font: inherit;
  font-size: var(--desk-text-sm, 12px);
  white-space: nowrap;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color .12s, border-color .12s, color .12s;
  display: inline-flex;
}

.public-offers-btn.is-icon {
  width: 26px;
  min-width: 26px;
  padding: 0;
  position: relative;
}

.public-offers-btn.is-icon.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 36%, var(--color-cursor-border));
  background: color-mix(in srgb, var(--cursor-accent) 12%, transparent);
}

.public-offers-filter-dot {
  background: var(--cursor-accent);
  width: 6px;
  height: 6px;
  box-shadow: 0 0 0 1.5px var(--mos-page);
  border-radius: 999px;
  position: absolute;
  top: 3px;
  right: 3px;
}

.public-offers-btn svg {
  flex: none;
  width: 14px;
  height: 14px;
}

.public-offers-btn:hover:not(:disabled) {
  background: var(--mos-active, var(--color-cursor-active));
}

.public-offers-btn:disabled {
  opacity: .55;
  cursor: default;
}

.public-offers-btn.is-quiet {
  color: var(--color-cursor-muted, var(--mos-muted));
  background: none;
  border-color: #0000;
}

.public-offers-btn.is-quiet:hover:not(:disabled) {
  background: var(--mos-plate, var(--color-cursor-hover));
  color: var(--color-cursor-text, var(--mos-text));
}

.public-offers-btn.is-primary {
  border-color: color-mix(in srgb, var(--cursor-accent) 34%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  color: var(--color-cursor-text, var(--mos-text));
  font-weight: 700;
}

.public-offers-btn.is-primary:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--cursor-accent) 48%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 22%, transparent);
}

.public-offers-btn.is-block {
  width: 100%;
  min-height: 34px;
}

.public-offers-filters-sheet, .public-offers-topbar-filter {
  display: none;
}

.public-offers-body {
  box-sizing: border-box;
  gap: 12px;
  width: 100%;
  margin: 0 auto;
  padding: 16px 16px 40px;
  display: grid;
}

.public-offers-body.is-narrow {
  max-width: 860px;
}

.public-offers-values {
  --cursor-h-scroll-fade-pad: 16px;
  --cursor-h-scroll-fade-gap: 8px;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  margin: 0 -16px;
  padding: 0 0 2px;
  display: flex;
  overflow: auto hidden;
}

.public-offers-values::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.public-offers-value {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate, var(--cursor-surface));
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 6px 6px;
  display: inline-flex;
}

.public-offers-value > div {
  display: contents;
}

.public-offers-value-icon {
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  width: 28px;
  height: 28px;
  box-shadow: inset 0 0 0 1px var(--color-cursor-border-soft, var(--mos-border-soft));
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
  place-items: center;
  display: grid;
}

.public-offers-value-icon svg {
  width: 14px;
  height: 14px;
}

.public-offers-value strong {
  font-size: var(--desk-text-ui, 13px);
  white-space: nowrap;
  font-weight: 650;
  line-height: 1.2;
}

.public-offers-value p {
  display: none;
}

.public-offers-results {
  gap: 12px;
  min-width: 0;
  display: grid;
}

.public-offers-hero {
  isolation: isolate;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-xl, 12px);
  background: var(--mos-plate, var(--cursor-surface));
  place-items: center;
  gap: 0;
  min-height: 220px;
  padding: 48px 28px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.public-offers-hero-bg {
  z-index: 0;
  pointer-events: none;
  opacity: .48;
  background-image: url("/branding/creative-network-banner.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(#000000eb 0%, #000000b8 42%, #00000047 78%, #0000 100%);
  mask-image: linear-gradient(#000000eb 0%, #000000b8 42%, #00000047 78%, #0000 100%);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

[data-appearance="dark"] .public-offers-hero-bg {
  opacity: .58;
}

.public-offers-hero:after {
  content: "";
  z-index: 2;
  pointer-events: none;
  background: radial-gradient(120% 90% at 50% 20%,
      color-mix(in srgb, var(--mos-page) 18%, transparent) 0%,
      color-mix(in srgb, var(--mos-plate) 72%, transparent) 58%,
      var(--mos-plate) 100%);
  position: absolute;
  inset: 0;
}

.public-offers-hero-icon {
  width: min(52vw, 220px);
  height: min(52vw, 220px);
  color: var(--cursor-accent);
  opacity: .22;
  pointer-events: none;
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)rotate(-10deg);
}

.public-offers-hero-icon svg, .public-offers-hero > svg.public-offers-hero-icon {
  width: 100%;
  height: 100%;
  display: block;
}

.public-offers-hero-copy {
  z-index: 3;
  text-align: center;
  justify-items: center;
  gap: 8px;
  min-width: 0;
  max-width: 42rem;
  display: grid;
  position: relative;
}

.public-offers-kicker {
  font-size: var(--desk-text-2xs, 10px);
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-weight: 700;
}

.public-offers-hero h1 {
  letter-spacing: -.03em;
  overflow-wrap: anywhere;
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: clamp(26px, 3.4vw, 34px);
  font-weight: 650;
  line-height: 1.15;
}

.public-offers-hero p {
  max-width: 44ch;
  font-size: var(--desk-text-ui, 13px);
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  line-height: 1.55;
}

.public-offers-chip {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-xs, 11px);
  white-space: nowrap;
  align-items: center;
  gap: 5px;
  padding: 4px 9px;
  font-weight: 650;
  line-height: 1.2;
  display: inline-flex;
}

.public-offers-chip strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-weight: 700;
}

.public-offers-chip em {
  font-style: normal;
  font-weight: 600;
}

.public-offers-chip svg {
  flex: none;
  width: 13px;
  height: 13px;
}

.public-offers-stars {
  color: var(--color-cursor-muted, var(--mos-muted));
  align-items: center;
  gap: 1px;
  display: inline-flex;
}

.public-offers-stars .is-filled {
  color: var(--cursor-accent);
}

.public-offers-reviews {
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.public-offers-review {
  border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  gap: 6px;
  padding-top: 12px;
  display: grid;
}

.public-offers-review:first-child {
  border-top: 0;
  padding-top: 0;
}

.public-offers-review-head {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.public-offers-review-head strong {
  font-size: var(--desk-text-sm, 12px);
  font-weight: 650;
}

.public-offers-review-head time {
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted, var(--mos-muted));
  margin-left: auto;
}

.public-offers-review-pkg {
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-weight: 650;
}

.public-offers-section-head {
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate, var(--cursor-surface));
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 36px;
  padding: 0 12px;
  display: flex;
}

.public-offers-section-head h2 {
  min-width: 0;
  font-size: var(--desk-text-sm, 12px);
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 0 auto;
  margin: 0;
  font-weight: 650;
  overflow: hidden;
}

.public-offers-sort {
  flex: 0 auto;
  min-width: 0;
  max-width: min(220px, 55%);
  margin-left: auto;
}

.public-offers-sort .cursor-select-menu, .public-offers-sort .cursor-select-trigger {
  max-width: 100%;
}

.public-offers-sort .cursor-select-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.public-offers-active-chips {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: -4px;
  display: flex;
}

.public-offers-active-chip {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate, var(--cursor-surface));
  min-height: 24px;
  color: var(--color-cursor-text, var(--mos-text));
  font-size: var(--desk-text-xs, 11px);
  cursor: pointer;
  align-items: center;
  gap: 5px;
  padding: 0 6px 0 10px;
  display: inline-flex;
}

.public-offers-active-chip svg {
  width: 12px;
  height: 12px;
  color: var(--color-cursor-muted, var(--mos-muted));
}

.public-offers-active-chip:hover {
  border-color: color-mix(in srgb, var(--cursor-accent) 32%, var(--color-cursor-border));
}

.public-offers-active-chip:hover svg {
  color: var(--color-cursor-text, var(--mos-text));
}

.public-offers-active-clear {
  border-radius: var(--cursor-radius-pill, 999px);
  min-height: 24px;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-xs, 11px);
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0 8px;
}

.public-offers-active-clear:hover {
  background: var(--color-cursor-hover, var(--mos-hover));
  color: var(--color-cursor-text, var(--mos-text));
}

.public-offers-grid {
  grid-template-columns: repeat(auto-fill, minmax(272px, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.public-offers-card {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-lg, 10px);
  background: var(--mos-plate, var(--cursor-surface));
  height: 100%;
  color: inherit;
  cursor: pointer;
  align-content: start;
  gap: 10px;
  padding: 14px;
  text-decoration: none;
  transition: background .14s, border-color .14s;
  display: grid;
}

@media (max-width: 899px) {
  .public-offers-card {
    content-visibility: auto;
    contain-intrinsic-size: auto 220px;
  }
}

.public-offers-card:hover {
  border-color: color-mix(in srgb, var(--cursor-accent) 32%, var(--color-cursor-border));
  background: var(--mos-hover, var(--color-cursor-hover));
}

.public-offers-card-top {
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.public-offers-card-title {
  font-size: var(--desk-text-base, 14px);
  overflow-wrap: anywhere;
  margin: 0;
  font-weight: 650;
  line-height: 1.3;
}

.public-offers-card-seller {
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted, var(--mos-muted));
  overflow-wrap: anywhere;
  margin: 2px 0 0;
  font-weight: 600;
}

.public-offers-card-price {
  font-size: var(--desk-text-ui, 13px);
  white-space: nowrap;
  flex: none;
  font-weight: 700;
}

.public-offers-card-price em {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-xs, 11px);
  margin-right: 4px;
  font-style: normal;
  font-weight: 600;
}

.public-offers-card-media {
  aspect-ratio: 16 / 8;
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: calc(var(--cursor-radius-lg, 10px) - 1px) calc(var(--cursor-radius-lg, 10px) - 1px) 0 0;
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  margin: -14px -14px 0;
  overflow: hidden;
}

.public-offers-card-media img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.public-offers-card-desc {
  -webkit-line-clamp: 3;
  line-clamp: 3;
  font-size: var(--desk-text-ui, 13px);
  color: var(--color-cursor-muted, var(--mos-muted));
  -webkit-box-orient: vertical;
  margin: 0;
  line-height: 1.5;
  display: -webkit-box;
  overflow: hidden;
}

.public-offers-card-meta {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.public-offers-state {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-lg, 10px);
  background: var(--mos-plate, var(--cursor-surface));
  text-align: center;
  place-items: center;
  gap: 8px;
  padding: 44px 16px;
  display: grid;
}

.public-offers-state-icon {
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  width: 44px;
  height: 44px;
  box-shadow: inset 0 0 0 1px var(--color-cursor-border-soft, var(--mos-border-soft));
  color: var(--color-cursor-muted, var(--mos-muted));
  place-items: center;
  display: grid;
}

.public-offers-state-icon svg {
  width: 18px;
  height: 18px;
}

.public-offers-state strong {
  font-size: var(--desk-text-ui, 13px);
  font-weight: 650;
}

.public-offers-state p {
  max-width: 44ch;
  font-size: var(--desk-text-sm, 12px);
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  line-height: 1.5;
}

.public-offers-detail {
  grid-template-columns: minmax(0, 1fr) 288px;
  align-items: start;
  gap: 12px;
  display: grid;
}

.public-offers-detail-main, .public-offers-detail-aside {
  gap: 12px;
  min-width: 0;
  display: grid;
}

.public-offers-panel {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-lg, 10px);
  background: var(--mos-plate, var(--cursor-surface));
  gap: 10px;
  padding: 16px;
  display: grid;
}

.public-offers-panel h2 {
  font-size: var(--desk-text-sm, 12px);
  margin: 0;
  font-weight: 650;
}

.public-offers-prose {
  font-size: var(--desk-text-ui, 13px);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 0;
  line-height: 1.6;
}

.public-offers-price {
  letter-spacing: -.02em;
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.1;
}

.public-offers-gallery {
  gap: 8px;
  display: grid;
}

.public-offers-gallery-stage {
  aspect-ratio: 16 / 9;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-lg, 10px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  place-items: center;
  min-height: 220px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.public-offers-gallery-stage.is-portrait {
  aspect-ratio: 9 / 16;
  background: var(--mos-page, var(--mos-plate-strong, var(--cursor-surface-raised)));
  width: min(100%, 420px);
  max-height: min(68vh, 720px);
  margin-inline: auto;
}

.public-offers-gallery-stage .public-offers-gallery-frame, .public-offers-gallery-stage .media-load-frame {
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
}

.public-offers-gallery-stage img, .public-offers-gallery-stage video {
  object-fit: contain;
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity .12s;
  display: block;
}

.public-offers-gallery-stage img.is-ready, .public-offers-gallery-stage video.is-ready {
  opacity: 1;
}

.public-offers-gallery-thumbs {
  scrollbar-width: none;
  gap: 8px;
  margin: 0 -2px;
  padding: 3px 2px 4px;
  display: flex;
  overflow-x: auto;
}

.public-offers-gallery-thumbs::-webkit-scrollbar {
  display: none;
}

.public-offers-gallery-thumbs button {
  aspect-ratio: 1;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-md, 10px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  cursor: pointer;
  box-sizing: border-box;
  flex: none;
  width: 72px;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.public-offers-gallery-thumbs button.is-active {
  border-color: var(--cursor-accent);
  box-shadow: 0 0 0 1px var(--cursor-accent);
}

.public-offers-gallery-thumbs img, .public-offers-gallery-thumbs video {
  object-fit: cover;
  border-radius: inherit;
  width: 100%;
  height: 100%;
  display: block;
}

.public-offers-gallery-thumbs video {
  object-fit: contain;
  background: var(--mos-page, var(--mos-plate-strong));
}

.public-offers-gallery-badge {
  color: #fff;
  text-shadow: 0 1px 4px #0009;
  pointer-events: none;
  place-items: center;
  font-size: 14px;
  display: grid;
  position: absolute;
  inset: 0;
}

@media (min-width: 861px) {
  .public-offers-gallery-stage:not(.is-portrait) {
    aspect-ratio: auto;
    height: min(68vh, 720px);
    min-height: min(68vh, 720px);
  }

  .public-offers-gallery-stage.is-portrait {
    width: min(100%, min(68vh, 720px) / 1.77778);
    height: min(68vh, 720px);
  }
}

.public-offers-tiers {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  display: grid;
}

.public-offers-qty {
  color: var(--color-cursor-muted);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: 12px;
  display: flex;
}

.public-offers-qty-stepper {
  align-items: center;
  gap: 2px;
  display: inline-flex;
}

.public-offers-qty-value {
  text-align: center;
  min-width: 28px;
  color: var(--color-cursor-text);
  font-variant-numeric: tabular-nums;
  font-size: 13px;
  font-weight: 650;
}

.public-offers-tier {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-md, 8px);
  color: inherit;
  font: inherit;
  text-align: center;
  cursor: pointer;
  background: none;
  gap: 2px;
  padding: 8px 6px;
  transition: border-color .16s, background .16s;
  display: grid;
}

.public-offers-tier:hover {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.public-offers-tier.is-active {
  border-color: var(--cursor-accent);
  background: color-mix(in srgb, var(--cursor-accent) 8%, transparent);
}

.public-offers-tier strong {
  font-size: var(--desk-text-sm, 12px);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 650;
  overflow: hidden;
}

.public-offers-tier span {
  font-size: var(--desk-text-ui, 13px);
  font-weight: 700;
}

.public-offers-tier-detail {
  gap: 10px;
  display: grid;
}

.public-offers-features {
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.public-offers-features li {
  font-size: var(--desk-text-ui, 13px);
  align-items: flex-start;
  gap: 8px;
  line-height: 1.45;
  display: flex;
}

.public-offers-features svg {
  width: 14px;
  height: 14px;
  color: var(--cursor-accent);
  flex: none;
  margin-top: 2px;
}

.public-offers-rows {
  gap: 8px;
  display: grid;
}

.public-offers-row {
  font-size: var(--desk-text-sm, 12px);
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  display: flex;
}

.public-offers-row dt {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
}

.public-offers-row dd {
  text-align: right;
  margin: 0;
  font-weight: 600;
}

.public-offers-note {
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  line-height: 1.5;
}

.public-offers-divider {
  background: var(--color-cursor-border-soft, var(--mos-border-soft));
  border: 0;
  height: 1px;
  margin: 0;
}

@media (max-width: 860px) {
  .public-offers-detail {
    grid-template-columns: minmax(0, 1fr);
  }

  .public-offers-shell {
    flex-direction: column;
    height: 100%;
    max-height: 100%;
  }

  .public-offers-main {
    flex: auto;
    min-height: 0;
  }

  .public-offers-mobile-book-nav {
    z-index: 40;
    min-height: calc(52px + env(safe-area-inset-bottom, 0px));
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
    background: var(--mos-bg, var(--mos-panel, var(--color-cursor-bg)));
    box-sizing: border-box;
    flex: none;
    align-items: center;
    gap: 10px;
    display: flex;
  }

  .public-offers-mobile-book-meta {
    flex: auto;
    gap: 2px;
    min-width: 0;
    display: grid;
  }

  .public-offers-mobile-book-meta strong {
    letter-spacing: -.02em;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    overflow: hidden;
  }

  .public-offers-mobile-book-meta span {
    color: var(--color-cursor-muted, var(--mos-muted));
    font-size: 11px;
    font-weight: 650;
  }

  .public-offers-mobile-book-nav .public-offers-btn {
    flex: none;
    min-height: 36px;
    padding: 0 14px;
  }

  .public-offers-rail {
    display: none !important;
  }

  .public-offers-topbar-search {
    display: flex;
  }

  .public-offers-topbar-filter {
    display: inline-flex;
  }

  .public-offers-topbar-mobile-brand {
    min-width: 0;
    display: block;
  }

  .public-offers-topbar-mobile-brand .public-offers-sidebar-brand-text, .public-offers-brand strong, .public-offers-brand span, .public-offers-btn-label {
    display: none;
  }

  .public-offers-values {
    --cursor-h-scroll-fade-pad: 12px;
    margin: 0 -12px;
    padding: 0 0 2px;
  }

  .public-offers-value {
    padding: 6px 12px 6px 6px;
  }

  .public-offers-value-icon {
    width: 26px;
    height: 26px;
  }

  .public-offers-value-icon svg {
    width: 13px;
    height: 13px;
  }

  .public-offers-value strong {
    font-size: 12px;
  }

  .public-offers-filters-sheet {
    z-index: 80;
    pointer-events: auto;
    display: block;
    position: fixed;
    inset: 0;
  }

  .public-offers-filters-backdrop {
    cursor: pointer;
    background: #0000006b;
    border: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    inset: 0;
  }

  .public-offers-filters-panel {
    top: calc(8px + env(safe-area-inset-top, 0px));
    left: 8px;
    right: 8px;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    z-index: 2;
    border: 1px solid var(--color-cursor-border, var(--mos-border));
    background: var(--color-cursor-sidebar, var(--mos-sidebar, var(--mos-bg)));
    border-radius: 18px;
    flex-direction: column;
    min-height: 0;
    animation: .22s ease-out public-offers-sheet-in;
    display: flex;
    position: absolute;
    overflow: hidden;
    box-shadow: 0 20px 48px #00000052;
  }

  @keyframes public-offers-sheet-in {
    from {
      opacity: 0;
      transform: translateY(12px);
    }

    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .public-offers-filters-head {
    min-height: var(--cursor-head-h, 36px);
    border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
    flex: none;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 8px 10px 8px 14px;
    display: flex;
  }

  .public-offers-filters-head strong {
    font-size: var(--desk-text-ui, 13px);
    letter-spacing: -.02em;
    font-weight: 700;
  }

  .public-offers-filters-body {
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    flex-direction: column;
    flex: auto;
    gap: 10px;
    min-height: 0;
    padding: 10px 4px 16px;
    display: flex;
    overflow: hidden auto;
  }

  .public-offers-filter-options {
    flex-wrap: wrap;
    gap: 6px;
    display: flex;
  }

  .public-offers-filter-btn {
    border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
    border-radius: var(--cursor-radius-pill, 999px);
    width: auto;
    min-height: 26px;
    margin: 0;
    padding: 0 10px;
  }

  .public-offers-filter-btn.is-active {
    border-color: color-mix(in srgb, var(--cursor-accent) 32%, var(--color-cursor-border));
  }

  .public-offers-filter-head {
    width: 100%;
    margin: 0;
    padding: 3px 8px;
  }

  .public-offers-show-more {
    width: auto;
    margin: 0;
    padding: 0 10px;
  }

  .public-offers-range {
    width: calc(100% - 16px);
    max-width: none;
    margin: 0 8px;
    padding: 0;
  }

  .public-offers-presets {
    width: calc(100% - 16px);
    margin: 0 8px;
    padding: 0 0 2px;
  }

  .public-offers-rail-clear {
    align-self: stretch;
    margin: 4px 8px 0;
  }
}

@media (max-width: 560px) {
  .public-offers-body {
    padding: 12px 12px 32px;
  }

  .public-offers-hero {
    align-items: center;
    min-height: 188px;
    padding: 36px 18px;
  }

  .public-offers-hero-icon {
    opacity: .12;
    width: min(56vw, 168px);
    height: min(56vw, 168px);
  }

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

/* [project]/src/studio/components/public-profile.css [app-client] (css) */
.public-profile-shell {
  --pp-ink: var(--color-cursor-text-bright, #f4f1ea);
  --pp-muted: var(--color-cursor-muted, #f4f1ea9e);
  --pp-line: var(--studio-composer-glass-border, var(--color-cursor-border, var(--mos-border)));
  --pp-accent: var(--cursor-accent, #d8ff3e);
  --pp-accent-ink: var(--cursor-on-accent, #fff);
  --pp-glass: var(--studio-composer-glass, color-mix(in srgb, var(--color-mos-composer, #07111f) 42%, transparent));
  --pp-glass-muted: var(--studio-composer-glass-muted, color-mix(in srgb, var(--color-mos-composer, #07111f) 30%, transparent));
  --pp-glass-blur: var(--studio-composer-glass-blur, saturate(150%) blur(12px));
  --pp-glass-shadow: var(--studio-composer-glass-shadow, 0 16px 36px #00000047,
    inset 0 1px 0 #ffffff0f);
  min-height: 100dvh;
  color: var(--pp-ink);
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  filter: none;
  isolation: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  background: none;
  position: relative;
  overflow: hidden;
  transform: none;
}

.public-profile-shell::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.public-profile-shell:not(.is-embedded):before {
  content: "";
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(1100px 480px at 50% -10%, #3d4a6357, transparent 70%),
    radial-gradient(900px 420px at 80% 8%, color-mix(in srgb, var(--pp-accent) 8%, transparent), transparent 60%),
    linear-gradient(180deg, #141820, #0b0d10 52%, #08090c);
  position: absolute;
  inset: 0;
}

.public-profile-blur {
  z-index: 0;
  pointer-events: none;
  filter: none;
  isolation: auto;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  background: #050608b8;
  position: absolute;
  inset: 0;
  transform: none;
}

.public-profile-shell.is-embedded {
  background: var(--mos-page, var(--mos-panel));
  height: 100%;
  min-height: 100%;
}

.public-profile-shell.is-embedded .public-profile-blur {
  background: var(--mos-page, var(--mos-panel));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

[data-appearance="light"] .public-profile-shell {
  --pp-ink: var(--color-cursor-text, #1b1f24);
  --pp-muted: var(--color-cursor-muted, #1b1f2494);
  --pp-line: #1b1f2424;
  --pp-accent-ink: var(--cursor-on-accent, #fff);
  --pp-glass: color-mix(in srgb, var(--mos-panel) 72%, transparent);
  --pp-glass-muted: color-mix(in srgb, var(--mos-panel) 58%, transparent);
  --pp-glass-shadow: 0 12px 28px #0f172a14,
    inset 0 1px 0 #ffffffa6;
}

[data-appearance="light"] .public-profile-shell:not(.is-embedded):before {
  background: radial-gradient(900px 420px at 50% -10%, color-mix(in srgb, var(--pp-accent) 10%, transparent), transparent 65%),
    linear-gradient(180deg, var(--mos-bg), color-mix(in srgb, var(--mos-bg) 70%, #d8dee6) 55%, color-mix(in srgb, var(--mos-bg) 40%, #d8dee6));
}

[data-appearance="light"] .public-profile-blur {
  background: color-mix(in srgb, var(--mos-bg) 70%, transparent);
}

[data-appearance="light"] .public-profile-shell.is-embedded .public-profile-blur {
  background: var(--mos-page, var(--mos-panel));
}

[data-appearance="light"] .public-profile-error {
  color: #b42318;
}

[data-appearance="light"] .public-profile-action.is-following {
  background: color-mix(in srgb, var(--mos-panel) 88%, transparent);
}

[data-appearance="light"] .public-profile-action.is-primary {
  background: color-mix(in srgb, var(--pp-accent) 16%, var(--mos-panel));
  color: var(--pp-ink);
}

[data-appearance="light"] .public-profile-empty-posts, [data-appearance="light"] .public-profile-loading, [data-appearance="light"] .public-profile-empty, [data-appearance="light"] .public-profile-tile-fallback {
  color: var(--pp-muted);
}

.public-profile-main {
  --pp-pad-x: 24px;
  --pp-pad-top: 28px;
  --pp-posts-gap: 1px;
  --pp-posts-pad-x: var(--pp-posts-gap);
  z-index: 1;
  width: 100%;
  max-width: none;
  max-height: 100%;
  padding: var(--pp-pad-top) var(--pp-pad-x) 40px;
  box-sizing: border-box;
  scrollbar-width: none;
  -ms-overflow-style: none;
  margin: 0;
  position: relative;
  overflow: hidden auto;
}

.public-profile-main::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.public-profile-shell.is-embedded .public-profile-main {
  --pp-pad-x: 20px;
  --pp-pad-top: 20px;
  --pp-posts-pad-x: var(--pp-posts-gap);
  height: 100%;
  padding: var(--pp-pad-top) var(--pp-pad-x) 32px;
}

.public-profile-hero {
  text-align: center;
  justify-items: center;
  gap: 6px;
  padding: 4px 4px 8px;
  display: grid;
}

.public-profile-identity, .public-profile-title-row {
  justify-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  display: grid;
}

.public-profile-titles {
  justify-items: center;
  gap: 2px;
  min-width: 0;
  display: grid;
}

.public-profile-name {
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
  margin: 0;
  font-size: clamp(20px, 3.4vw, 26px);
  font-weight: 650;
  line-height: 1.15;
}

.public-profile-handle {
  color: var(--pp-muted);
  margin: 0;
  font-size: 13px;
  font-weight: 650;
}

.public-profile-handle a {
  color: inherit;
  text-decoration: none;
}

.public-profile-handle a:hover {
  text-decoration: underline;
}

.public-profile-bio {
  color: var(--pp-ink);
  overflow-wrap: anywhere;
  max-width: 34rem;
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
}

.public-profile-stats {
  margin-inline: auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  gap: 0;
  width: min(100%, 18rem);
  margin-top: 0;
  display: grid;
}

.public-profile-stats div {
  text-align: center;
  justify-items: center;
  gap: 0;
  min-width: 0;
  display: grid;
  position: relative;
}

.public-profile-stats div:not(:last-child):after {
  content: "";
  background: color-mix(in srgb, var(--pp-ink, var(--color-cursor-text, #fff)) 14%, transparent);
  pointer-events: none;
  border-radius: 1px;
  width: 1px;
  height: 12px;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}

.public-profile-stats strong {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}

.public-profile-stats span {
  color: var(--pp-muted);
  letter-spacing: .01em;
  font-size: 10px;
  font-weight: 600;
}

.public-profile-actions {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: inline-flex;
}

.public-profile-action {
  border: 1px solid var(--pp-line);
  background: var(--pp-glass);
  min-width: 0;
  height: 28px;
  min-height: 28px;
  color: var(--pp-ink);
  font: inherit;
  letter-spacing: .01em;
  white-space: nowrap;
  cursor: pointer;
  -webkit-backdrop-filter: var(--pp-glass-blur);
  backdrop-filter: var(--pp-glass-blur);
  filter: none;
  isolation: auto;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 0 10px;
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
  transform: none;
}

.public-profile-action > span {
  align-items: center;
  line-height: 1;
  display: inline-flex;
}

.public-profile-action-icon {
  stroke-width: 2.25px;
  flex: none;
  width: 16px;
  height: 16px;
}

.public-profile-action.is-primary {
  background: color-mix(in srgb, var(--pp-accent) 20%, var(--pp-glass));
  border-color: color-mix(in srgb, var(--pp-accent) 48%, var(--pp-line));
  color: var(--pp-ink);
}

.public-profile-action.is-primary:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--pp-accent) 68%, var(--pp-line));
  background: color-mix(in srgb, var(--pp-accent) 28%, var(--pp-glass));
}

.public-profile-action:not(.is-primary):hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--pp-accent) 42%, var(--pp-line));
}

.public-profile-action.is-following {
  background: var(--pp-glass);
  border-color: var(--pp-line);
  color: var(--pp-ink);
}

.public-profile-action:disabled {
  opacity: .7;
  cursor: wait;
}

.public-profile-links {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.public-profile-links > li {
  position: relative;
}

.public-profile-links a {
  border: 1px solid var(--pp-line);
  background: var(--pp-glass);
  max-width: 100%;
  min-height: 28px;
  color: var(--pp-ink);
  -webkit-backdrop-filter: var(--pp-glass-blur);
  backdrop-filter: var(--pp-glass-blur);
  filter: none;
  isolation: auto;
  border-radius: 999px;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
  display: inline-flex;
  transform: none;
}

.public-profile-links a span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.public-profile-links a:hover {
  border-color: color-mix(in srgb, var(--pp-accent) 42%, var(--pp-line));
}

.public-profile-error {
  color: #ffb4b4;
  margin: 0;
  font-size: 13px;
}

.public-profile-posts-rule {
  width: calc(100% + (2 * var(--pp-pad-x)));
  height: 1px;
  margin: var(--pp-posts-gap) calc(-1 * var(--pp-pad-x));
  background: color-mix(in srgb, var(--pp-line) 85%, transparent);
  border: 0;
}

.public-profile-tabs-wrap {
  width: calc(100% + (2 * var(--pp-pad-x)));
  margin-inline: calc(-1 * var(--pp-pad-x));
  margin-top: var(--pp-posts-gap);
  padding: 10px var(--pp-pad-x);
  box-shadow: none;
  background: none;
  border: 0;
  justify-items: center;
  gap: 0;
  display: grid;
  position: relative;
}

.public-profile-tabs-wrap .public-profile-posts-rule {
  display: none;
}

.public-profile-tabs {
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: min(100%, 28rem);
  max-width: 100%;
  margin: 0 auto;
  padding: 0;
  display: inline-grid;
}

.public-profile-tab {
  z-index: 0;
  white-space: nowrap;
  border: 1px solid var(--studio-composer-glass-border, var(--pp-line, #ffffff24));
  background: var(--studio-composer-glass-muted, var(--pp-glass-muted, #07111f70));
  width: 100%;
  min-width: 0;
  height: 28px;
  min-height: 28px;
  color: color-mix(in srgb, var(--pp-ink) 72%, transparent);
  font: inherit;
  letter-spacing: .01em;
  text-transform: none;
  cursor: pointer;
  box-shadow: none;
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0 12px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  transition: color .16s, background .16s, border-color .16s;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.public-profile-tab > * {
  z-index: 1;
  position: relative;
}

.public-profile-tab svg {
  flex: none;
  width: 12px;
  height: 12px;
}

.public-profile-tab > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.public-profile-tab:hover {
  color: var(--pp-ink);
  border-color: color-mix(in srgb,
    var(--studio-composer-glass-border, #ffffff24) 72%,
    transparent);
  background: color-mix(in srgb,
    var(--studio-composer-glass-muted, #07111f70) 88%,
    #fff 8%);
}

.public-profile-tab.is-active {
  border: 1px solid var(--cursor-accent, var(--pp-accent, #d8ff3e));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--pp-accent, #d8ff3e)) 16%,
    var(--studio-composer-glass-muted, #07111f70));
  color: var(--color-cursor-text-bright, var(--pp-ink));
  box-shadow: none;
}

.public-profile-tab.is-active:before, .public-profile-tab.is-active:after {
  content: none;
  display: none;
}

[data-appearance="light"] .public-profile-tabs-wrap {
  background: none;
}

[data-appearance="light"] .public-profile-tab {
  background: color-mix(in srgb, var(--mos-panel) 62%, transparent);
  color: color-mix(in srgb, var(--pp-ink) 68%, transparent);
  border-color: #1b1f241a;
}

[data-appearance="light"] .public-profile-tab:hover {
  background: color-mix(in srgb, var(--mos-panel) 78%, transparent);
  color: var(--pp-ink);
}

[data-appearance="light"] .public-profile-tab.is-active {
  border: 1px solid var(--cursor-accent, var(--pp-accent, #d8ff3e));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--pp-accent, #d8ff3e)) 14%,
    var(--mos-panel));
  color: var(--pp-ink);
  box-shadow: none;
}

.public-profile-grid-section {
  margin-top: 0;
  margin-inline: calc(var(--pp-posts-pad-x) - var(--pp-pad-x));
  width: calc(100% + 2 * (var(--pp-pad-x) - var(--pp-posts-pad-x)));
}

.public-profile-tabs-wrap + .public-profile-grid-section {
  margin-top: var(--pp-posts-gap);
}

.public-profile-grid {
  align-items: flex-start;
  gap: var(--pp-posts-gap);
  width: 100%;
  display: flex;
}

.public-profile-masonry-col {
  gap: var(--pp-posts-gap);
  flex-direction: column;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
}

.public-profile-tile {
  border: 1px solid color-mix(in srgb, var(--pp-line) 70%, transparent);
  background: var(--pp-glass-muted);
  cursor: pointer;
  border-radius: 10px;
  width: 100%;
  height: auto;
  min-height: 0;
  padding: 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 1px 3px #00000014;
}

.public-profile-tile.is-media-pending {
  overflow: visible;
}

.public-profile-tile img:not(.logo-loader-mark), .public-profile-tile video {
  object-fit: contain;
  background: #00000047;
  width: 100%;
  height: auto;
  display: block;
}

.public-profile-lightbox-media img, .public-profile-lightbox-media video {
  object-fit: cover;
  background: #00000047;
  width: 100%;
  height: 100%;
  display: block;
}

.public-profile-tile .logo-loader-mark, .public-profile-loading .logo-loader-mark {
  width: var(--logo-loader-mark);
  height: var(--logo-loader-mark);
  object-fit: contain;
  background: none !important;
}

.public-profile-tile .media-load-frame {
  width: 100%;
  height: auto;
  position: relative;
  inset: auto;
}

.public-profile-tile .media-load-frame.is-ready img, .public-profile-tile .media-load-frame.is-ready video {
  object-fit: contain;
  height: auto;
  max-height: none;
}

.public-profile-tile .media-load-frame:not(.is-ready) {
  overflow: visible;
}

.public-profile-tile .media-load-frame-placeholder {
  background: none;
  overflow: visible;
}

.public-profile-tile:after {
  content: "";
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(#0000 0%, #05060873 42%, #050608d1 100%);
  height: 48%;
  position: absolute;
  inset: auto 0 0;
}

.public-profile-tile:hover:after, .public-profile-tile:focus-visible:after {
  background: linear-gradient(#0000 0%, #05060885 38%, #050608e0 100%);
}

.public-profile-tile-top {
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(#050608b8 0%, #05060847 55%, #0000 100%);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px 8px 18px;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.public-profile-tile-kind {
  z-index: 2;
  color: #fff;
  pointer-events: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  width: auto;
  height: auto;
  box-shadow: none;
  filter: drop-shadow(0 1px 2px #000000a6) drop-shadow(0 2px 8px #00000073);
  background: none;
  border: 0;
  border-radius: 0;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
  position: relative;
  bottom: auto;
  right: auto;
}

.public-profile-tile-kind-icon {
  width: 14px;
  height: 14px;
}

.public-profile-tile-kind-icon.is-play {
  width: 13px;
  height: 13px;
  margin-left: 1px;
}

.public-profile-tile-meta {
  z-index: 1;
  color: #fff;
  opacity: 1;
  pointer-events: none;
  filter: drop-shadow(0 1px 2px #000000a6);
  background: none;
  align-items: center;
  gap: 5px;
  padding: 0;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  position: relative;
  inset: auto;
}

.public-profile-tile-caption {
  z-index: 2;
  color: #fff;
  text-align: left;
  pointer-events: none;
  text-shadow: 0 1px 2px #0000008c;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  max-width: 100%;
  padding: 28px 10px 9px;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}

.public-profile-tile-username {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  display: block;
  overflow: hidden;
}

.public-profile-tile-description {
  text-overflow: ellipsis;
  color: #fff;
  white-space: nowrap;
  min-width: 0;
  max-width: 100%;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  display: block;
  overflow: hidden;
}

.public-profile-tile-meta .is-liked, .public-profile-like.is-liked {
  color: #e8b923;
  fill: currentColor;
}

.public-profile-tile-fallback, .public-profile-empty-posts, .public-profile-loading, .public-profile-empty {
  color: var(--pp-muted);
  text-align: center;
  place-items: center;
  gap: 8px;
  display: grid;
}

.public-profile-tile-fallback {
  aspect-ratio: 1;
  text-transform: uppercase;
  letter-spacing: .08em;
  width: 100%;
  min-height: 96px;
  font-size: 12px;
  font-weight: 700;
}

.public-profile-tile.is-audio {
  background: var(--mos-plate);
}

.public-profile-tile-audio {
  aspect-ratio: 1;
  background: var(--mos-plate);
  place-items: center;
  width: 100%;
  min-height: 140px;
  display: grid;
}

.public-profile-tile-audio-orb.studio-orb-play, .public-profile-tile-audio-orb.studio-orb-play.is-md {
  width: 46%;
  max-width: 96px;
  height: 46%;
  max-height: 96px;
}

.public-profile-loading, .public-profile-empty {
  z-index: 1;
  position: relative;
}

.public-profile-loading {
  background: none;
  place-content: center;
  min-height: 50dvh;
  overflow: visible;
}

.public-profile-loading.is-inline {
  min-height: 120px;
}

.public-profile-tile .media-load-frame-wave {
  background: none;
  overflow: visible;
}

.public-profile-tile .media-load-frame-wave, .public-profile-tile .media-load-frame-wave.is-ring {
  width: var(--logo-loader-ring, 44px);
  height: var(--logo-loader-ring, 44px);
  position: relative;
  inset: auto;
  overflow: visible;
}

.public-profile-tile .logo-loader, .public-profile-loading .logo-loader {
  overflow: visible;
}

.public-profile-empty {
  place-content: center;
  min-height: 70dvh;
  padding: 24px;
}

.public-profile-empty h1 {
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  color: var(--pp-ink);
  margin: 0;
  font-size: 22px;
  font-weight: 650;
}

.public-profile-empty p {
  max-width: 28rem;
  margin: 0;
}

.public-profile-empty-posts {
  border: 1px dashed var(--pp-line);
  background: var(--pp-glass);
  min-height: 120px;
  -webkit-backdrop-filter: var(--pp-glass-blur);
  backdrop-filter: var(--pp-glass-blur);
  filter: none;
  isolation: auto;
  border-radius: 12px;
  padding: 28px 12px;
  font-size: 13px;
  font-weight: 650;
  transform: none;
}

.public-profile-lightbox {
  z-index: 80;
  background: #050608b8;
  place-items: center;
  padding: 20px;
  display: grid;
  position: fixed;
  inset: 0;
}

.public-profile-lightbox-close {
  border: 1px solid var(--pp-line);
  background: var(--pp-glass);
  color: #fff;
  cursor: pointer;
  width: 40px;
  height: 40px;
  -webkit-backdrop-filter: var(--pp-glass-blur);
  backdrop-filter: var(--pp-glass-blur);
  filter: none;
  isolation: auto;
  border-radius: 999px;
  place-items: center;
  display: grid;
  position: absolute;
  top: 16px;
  right: 16px;
  transform: none;
}

.public-profile-lightbox-body {
  gap: 12px;
  width: min(1100px, 100%);
  display: grid;
}

.public-profile-lightbox-media {
  border: 1px solid var(--pp-line);
  max-height: min(70dvh, 800px);
  box-shadow: var(--pp-glass-shadow);
  background: #000;
  border-radius: 16px;
  overflow: hidden;
}

.public-profile-lightbox-media img, .public-profile-lightbox-media video {
  object-fit: contain;
  background: #000;
  max-height: min(70dvh, 800px);
}

.public-profile-lightbox-footer {
  border: 1px solid var(--pp-line);
  background: var(--pp-glass);
  color: #fff;
  -webkit-backdrop-filter: var(--pp-glass-blur);
  backdrop-filter: var(--pp-glass-blur);
  filter: none;
  isolation: auto;
  border-radius: 14px;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  display: flex;
  transform: none;
}

.public-profile-lightbox-copy {
  gap: 4px;
  min-width: 0;
  display: grid;
}

.public-profile-lightbox-copy strong {
  font-size: 13px;
  font-weight: 700;
}

.public-profile-lightbox-copy p {
  color: #ffffffc7;
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
}

.public-profile-like {
  border: 1px solid var(--pp-line);
  background: var(--pp-glass-muted);
  color: #fff;
  min-height: 34px;
  font: inherit;
  cursor: pointer;
  -webkit-backdrop-filter: var(--pp-glass-blur);
  backdrop-filter: var(--pp-glass-blur);
  filter: none;
  isolation: auto;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 700;
  display: inline-flex;
  transform: none;
}

@media (max-width: 720px) {
  .public-profile-main {
    --pp-pad-x: 12px;
    --pp-pad-top: 14px;
    --pp-posts-gap: 1px;
    --pp-posts-pad-x: var(--pp-posts-gap);
    padding: var(--pp-pad-top) var(--pp-pad-x) 28px;
  }

  .public-profile-shell.is-embedded .public-profile-main {
    --pp-pad-x: 12px;
    --pp-pad-top: 14px;
    --pp-posts-pad-x: var(--pp-posts-gap);
    padding: var(--pp-pad-top) var(--pp-pad-x) 28px;
  }

  .public-profile-hero {
    gap: 6px;
    padding-bottom: 8px;
  }

  .public-profile-identity {
    gap: 7px;
  }

  .public-profile-stats {
    width: min(100%, 16.5rem);
  }

  .public-profile-tabs {
    flex-wrap: nowrap;
    justify-content: stretch;
    gap: 4px;
    width: 100%;
    display: flex;
  }

  .public-profile-tab {
    flex: 1 1 0;
    gap: 0;
    padding: 0 6px;
    font-size: 11px;
  }

  .public-profile-tab svg {
    display: none;
  }

  .public-profile-tile {
    border-radius: 10px;
  }

  .public-profile-tile-meta {
    opacity: 1;
    padding: 0;
    font-size: 11px;
  }

  .public-profile-tile-caption {
    padding: 22px 8px 8px;
  }

  .public-profile-tile-username {
    font-size: 11px;
  }

  .public-profile-tile-description {
    font-size: 10px;
  }

  .public-profile-lightbox {
    align-items: end;
    padding: 12px;
  }

  .public-profile-lightbox-media {
    border-radius: 14px 14px 0 0;
    max-height: min(66dvh, 720px);
  }

  .public-profile-lightbox-media img, .public-profile-lightbox-media video {
    max-height: min(66dvh, 720px);
  }

  .public-profile-lightbox-footer {
    border-radius: 0 0 14px 14px;
  }
}

.public-profile-route, .public-profile-boot {
  color: #f4f1ea;
  background: #0c0f14;
  min-height: 100%;
}

.public-profile-boot {
  opacity: .72;
  place-items: center;
  padding: 48px 20px;
  font-size: 14px;
  display: grid;
}

.studio-polish.is-studio-mobile .public-profile-shell.is-embedded {
  height: 100%;
  min-height: 0;
}

.studio-polish.is-studio-mobile .public-profile-shell.is-embedded .public-profile-main {
  height: 100%;
  max-height: none;
  padding-top: calc(var(--studio-mobile-head-clear, 56px) + 10px);
  padding-bottom: calc(max(8px, env(safe-area-inset-bottom, 0px)) + var(--studio-mobile-nav-height, 44px) + 28px);
  scroll-padding-top: calc(var(--studio-mobile-head-clear, 56px) + 10px);
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

.public-profile-tile {
  content-visibility: auto;
  contain-intrinsic-size: auto 260px;
}

.public-profile-tile.is-media-pending {
  content-visibility: visible;
}

.studio-polish.is-studio-mobile .public-profile-main :is(.public-profile-tab, .public-profile-links a, .public-profile-tile *) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* [project]/src/studio/components/studio-agent.css [app-client] (css) */
.studio-agent-pane {
  background: var(--mos-page, var(--mos-bg, #121214));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  isolation: isolate;
  --mos-ink: var(--mos-text, var(--color-cursor-text));
  height: 100%;
  min-height: 0;
  color: var(--mos-ink, var(--color-cursor-text));
  flex-direction: column;
  display: flex;
  position: relative;
}

[data-appearance="light"] .studio-agent-pane {
  background: var(--mos-panel, var(--mos-page));
}

[data-appearance="dark"] .studio-agent-pane {
  background: var(--mos-page, var(--mos-bg, #121214));
}

.studio-agent-pane .studio-chat-render-area {
  flex: 1;
  min-height: 0;
  padding-bottom: 0;
}

.studio-agent-pane .studio-chat-stream {
  padding-bottom: 64px;
  scroll-padding-bottom: 64px;
}

.studio-agent-pane .studio-chat-stream-inner {
  width: 100%;
  max-width: calc(var(--studio-composer-shell-max, var(--studio-chat-column-max, min(92%, 36rem))) - 18px);
  box-sizing: border-box;
  gap: 16px;
  min-width: 0;
  margin-inline: auto;
  padding-inline: 12px;
}

.studio-agent-pane .studio-chat-stream-inner > :first-child {
  margin-top: 0;
}

.studio-agent-pane .studio-agent-turn > .studio-chat-bubble, .studio-agent-pane .studio-chat-bubble {
  width: 100%;
  max-width: 100%;
  box-shadow: none;
  align-self: stretch;
  padding: 7px 10px;
  font-size: 14px;
  line-height: 1.4;
}

.studio-agent-pane .studio-chat-bubble.is-user, [data-appearance="dark"] .studio-agent-pane .studio-chat-bubble.is-user {
  color: #fff;
  margin-left: 0;
  box-shadow: none !important;
  filter: none !important;
  border: 0 !important;
}

[data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-user {
  color: var(--color-cursor-text, var(--mos-text, #1a1a1e));
  margin-left: 0;
  box-shadow: none !important;
  filter: none !important;
  border: 0 !important;
}

.studio-agent-pane .studio-chat-bubble.is-assistant, .studio-agent-pane .studio-chat-bubble.is-system {
  background: var(--mos-plate);
  -webkit-backdrop-filter: none;
  box-shadow: none;
  color: var(--mos-ink, var(--color-cursor-text, #1a1a1e));
  border: 0;
  margin-right: 0;
  padding: 10px 12px;
}

.studio-agent-pane .studio-agent-user-bubble {
  white-space: pre-wrap;
  word-break: break-word;
  --studio-composer-chip-size: 18px;
  --studio-composer-chip-font-size: 11px;
  --studio-composer-chip-media-size: 18px;
  --studio-composer-chip-icon-size: 11px;
  line-height: 1.55;
}

.studio-agent-pane .studio-agent-user-bubble .studio-inline-tag.is-inline, .studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag {
  vertical-align: middle;
  height: var(--studio-composer-chip-size, 18px);
  min-height: var(--studio-composer-chip-size, 18px);
  cursor: default;
  max-width: min(200px, 52vw);
  font-size: var(--studio-composer-chip-font-size, 11px);
  box-sizing: border-box;
  border-radius: 999px;
  align-items: center;
  gap: 4px;
  margin: 0 3px;
  padding: 0 7px 0 5px;
  line-height: 1;
  display: inline-flex;
}

.studio-agent-pane .studio-agent-user-bubble .studio-inline-tag.is-inline {
  color: #fff;
  background: #ffffff3d;
  border: 1px solid #ffffff6b;
  box-shadow: inset 0 1px #ffffff38;
}

.studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag, [data-appearance="light"] .studio-agent-pane .studio-agent-user-bubble .studio-inline-tag.is-inline {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate);
  box-shadow: none;
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-agent-pane .studio-agent-user-bubble .studio-inline-tag--image-only, .studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag--image-only {
  width: var(--studio-composer-chip-size, 18px);
  min-width: var(--studio-composer-chip-size, 18px);
  max-width: var(--studio-composer-chip-size, 18px);
  height: var(--studio-composer-chip-size, 18px);
  box-shadow: none;
  background: none;
  border-color: #ffffff59;
  border-radius: 999px;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag--image-only, [data-appearance="light"] .studio-agent-pane .studio-agent-user-bubble .studio-inline-tag--image-only {
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
}

.studio-agent-pane .studio-agent-user-bubble .studio-inline-tag-kind, .studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag-kind {
  width: var(--studio-composer-chip-icon-size, 11px);
  height: var(--studio-composer-chip-icon-size, 11px);
  flex: none;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: inline-flex;
}

.studio-agent-pane .studio-agent-user-bubble .studio-inline-tag-kind svg, .studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag-kind svg {
  width: 11px;
  height: 11px;
  display: block;
}

.studio-agent-pane .studio-agent-user-bubble .studio-inline-tag-label, .studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  align-items: center;
  min-width: 0;
  max-width: 160px;
  height: 100%;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.studio-agent-pane .studio-agent-user-bubble .studio-inline-tag--image-only .studio-inline-tag-kind, .studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag--image-only .studio-inline-tag-kind {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.studio-agent-pane .studio-agent-user-bubble .studio-inline-tag-media, .studio-agent-pane .studio-agent-turn-attachments .studio-inline-tag-media {
  object-fit: cover;
  border-radius: 999px;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .studio-chat-text, .studio-agent-pane .studio-chat-bubble.is-assistant .studio-chat-markdown, .studio-agent-pane .studio-chat-bubble.is-assistant .studio-chat-markdown-bit, .studio-agent-pane .studio-chat-bubble.is-assistant .mos-md, .studio-agent-pane .studio-chat-bubble.is-assistant .md-prose {
  --mos-text: var(--mos-ink, var(--color-cursor-text, #1a1a1e));
  --mos-muted: color-mix(in srgb, var(--mos-ink, #1a1a1e) 58%, transparent);
  --mos-accent: var(--cursor-accent, var(--mos-accent, #3b82f6));
  color: var(--mos-text);
  letter-spacing: -.01em;
  font-size: 14px;
  line-height: 1.55;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md strong, .studio-agent-pane .studio-chat-bubble.is-assistant .md-prose strong {
  color: inherit;
  font-weight: 650;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md em, .studio-agent-pane .studio-chat-bubble.is-assistant .md-prose em {
  color: inherit;
  opacity: .88;
  font-style: italic;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md a:not(.studio-pretty-link-hit), .studio-agent-pane .studio-chat-bubble.is-assistant .md-prose a:not(.studio-pretty-link-hit), .studio-agent-pane .studio-pretty-link {
  color: var(--cursor-accent, var(--mos-accent, #2563eb));
  background: color-mix(in srgb, var(--cursor-accent, #2563eb) 12%, transparent);
  white-space: normal;
  border: 0;
  border-radius: 8px;
  padding: 1px 3px 1px 4px;
  font-weight: 600;
  text-decoration: none;
}

.studio-agent-pane .studio-pretty-link-hit {
  color: inherit;
  background: none;
  padding: 0;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md :where(p, ul, ol, pre, blockquote) {
  margin: 0 0 .65em;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md :where(p:last-child, ul:last-child, ol:last-child, pre:last-child, blockquote:last-child) {
  margin-bottom: 0;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md :where(ul, ol) {
  margin-top: .4em;
  margin-bottom: .55em;
  margin-left: 0;
  padding-left: 0;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md ul > li, .studio-agent-pane .studio-chat-bubble.is-assistant .mos-md ol > li {
  margin: .18em 0;
  padding-left: 0;
  line-height: 1.45;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md ul > li:before {
  vertical-align: .15em;
  background: color-mix(in srgb, var(--mos-ink, #1a1a1e) 45%, transparent);
  opacity: 1;
  margin-right: .4em;
  display: inline-block;
  position: static;
  top: auto;
  left: auto;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md ol {
  list-style: inside decimal;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md hr {
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--mos-ink, #111) 10%, transparent);
  margin: .7em 0;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md code, .studio-agent-pane .studio-chat-bubble.is-assistant .md-prose code {
  max-width: 100%;
  color: var(--mos-text);
  background: color-mix(in srgb, var(--mos-ink, #111) 7%, transparent);
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 10%, transparent);
  white-space: nowrap;
  text-overflow: ellipsis;
  vertical-align: baseline;
  border-radius: 999px;
  padding: .02em .38em;
  font-family: inherit;
  font-size: .8em;
  font-weight: 550;
  line-height: 1.2;
  display: inline-block;
  overflow: hidden;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-md pre code, .studio-agent-pane .studio-chat-bubble.is-assistant .md-prose pre code, .studio-agent-pane .studio-chat-bubble.is-assistant .mos-code-body code {
  font-family: var(--mos-mono, ui-monospace, monospace);
  color: inherit;
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  font-weight: 450;
}

.studio-agent-pane .studio-chat-bubble.is-assistant code, .studio-agent-pane .studio-chat-bubble.is-assistant pre {
  color: inherit;
}

.studio-agent-pane .studio-chat-bubble.is-assistant .mos-code, .studio-agent-pane .studio-chat-bubble.is-assistant .code-shell, .studio-agent-pane .studio-chat-bubble.is-assistant pre {
  background: color-mix(in srgb, var(--mos-ink, #111) 5%, transparent);
  border-color: color-mix(in srgb, var(--mos-ink, #111) 10%, transparent);
}

.studio-agent-pane .mos-code-body, .studio-agent-pane .studio-chat-bubble pre, .studio-dm-bubble .mos-code-body, .studio-dm-bubble pre, .studio-chat-bubble .mos-code-body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  max-width: 100%;
  max-height: min(320px, 40vh);
  overflow: hidden auto;
}

.studio-agent-pane .mos-code-body code, .studio-agent-pane .studio-chat-bubble pre code, .studio-dm-bubble .mos-code-body code, .studio-dm-bubble pre code, .studio-chat-bubble .mos-code-body code {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.studio-agent-pane .mos-code.is-copy .mos-code-body code, .studio-dm-bubble .mos-code.is-copy .mos-code-body code, .studio-chat-bubble .mos-code.is-copy .mos-code-body code {
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
}

[data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant, [data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-system {
  background: var(--mos-plate);
  box-shadow: none;
  color: #1a1a1e;
  border: 0;
}

[data-appearance="dark"] .studio-agent-pane .studio-chat-bubble.is-assistant, [data-appearance="dark"] .studio-agent-pane .studio-chat-bubble.is-system {
  background: var(--mos-plate);
  border: 0;
}

[data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant .studio-chat-text, [data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant .studio-chat-markdown, [data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant .studio-chat-markdown-bit, [data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant .mos-md, [data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant .md-prose {
  --mos-text: #1a1a1e;
  --mos-muted: #1a1a1e8c;
  color: #1a1a1e;
}

[data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant code, [data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant pre {
  color: #1a1a1e;
  background: var(--mos-plate-strong);
  border-color: var(--color-cursor-border-soft);
}

[data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant .mos-md code, [data-appearance="light"] .studio-agent-pane .studio-chat-bubble.is-assistant .md-prose code {
  background: var(--mos-plate-strong);
  border-color: var(--color-cursor-border-soft);
  color: #1a1a1e;
}

.studio-agent-pane .studio-chat-stream-inner.is-empty {
  justify-content: center;
  align-items: center;
}

.studio-agent-pane .studio-chat-stream-inner.is-empty > .studio-agent-empty-hero {
  flex: auto;
  justify-content: center;
  align-self: stretch;
  align-items: center;
  width: 100%;
  min-height: 100%;
  margin-top: 0;
  margin-bottom: 0;
  padding: 0;
  display: flex;
}

.studio-agent-empty-hero {
  text-align: center;
  opacity: .9;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
  max-width: none;
  display: flex;
}

.studio-agent-empty-hero .studio-empty-logo-wrap {
  margin-bottom: 0;
}

.studio-agent-empty-hero .studio-empty-logo-btn {
  transform: scale(1);
}

.studio-agent-meta {
  opacity: .7;
  margin: 0;
  font-size: .85rem;
}

.studio-agent-approval-card {
  max-width: var(--studio-chat-bubble-max, 90%);
  background: var(--mos-plate);
  border: 1px solid color-mix(in srgb, var(--mos-ink) 14%, transparent);
  border-radius: 14px;
  flex-direction: column;
  align-self: flex-start;
  gap: 8px;
  padding: 14px;
  display: flex;
}

.studio-agent-approval-actions {
  flex-wrap: wrap;
  gap: 8px;
  display: flex;
}

.studio-agent-tool-card {
  max-width: var(--studio-chat-bubble-max, 90%);
  background: color-mix(in srgb, var(--mos-plate) 88%, transparent);
  border: 1px solid color-mix(in srgb, var(--mos-ink) 10%, transparent);
  border-radius: 12px;
  align-self: flex-start;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  font-size: .92rem;
  display: flex;
}

.studio-agent-tool-card p {
  opacity: .8;
  margin: 2px 0 0;
  line-height: 1.35;
}

.studio-agent-composer-dock {
  box-sizing: border-box;
  flex: none;
  width: 100%;
  padding: 0;
  overflow: visible;
}

.studio-agent-composer-dock .studio-dm-composer.is-split {
  width: 100%;
  max-width: var(--studio-composer-shell-max, min(600px, 94vw));
  padding-inline: 20px;
  padding-bottom: max(22px, env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
  margin-inline: auto;
  overflow: visible;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-dm-composer-row.is-message {
  align-items: stretch;
}

.studio-agent-pane .studio-dm-composer.is-split .cursor-composer-mention-editor {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  max-height: 120px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  box-sizing: border-box;
  --studio-composer-line-size: 22px;
  --studio-composer-chip-size: 18px;
  --studio-composer-chip-font-size: 10px;
  --studio-composer-chip-media-size: 14px;
  --studio-composer-chip-icon-size: 7px;
  --studio-composer-chip-lift: 0px;
  background: none;
  border: 0;
  outline: none;
  flex: auto;
  margin: 0;
  padding: 0;
  font-size: 13px;
  font-weight: 550;
  line-height: 22px;
  overflow: hidden auto;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-inline-tag {
  height: var(--studio-composer-chip-size, 18px);
  min-height: var(--studio-composer-chip-size, 18px);
  margin: 0;
  margin-top: calc((var(--studio-composer-line-size) - var(--studio-composer-chip-size)) / 2 -
      var(--studio-composer-chip-lift, 0px));
  vertical-align: top;
  font-size: var(--studio-composer-chip-font-size, 10px);
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
  line-height: 1;
  display: inline-flex;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-inline-tag--image-only {
  width: var(--studio-composer-chip-size, 18px);
  min-width: var(--studio-composer-chip-size, 18px);
  max-width: var(--studio-composer-chip-size, 18px);
  height: var(--studio-composer-chip-size, 18px);
  border-radius: 999px;
  padding: 0;
  overflow: hidden;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-inline-tag-media {
  width: var(--studio-composer-chip-media-size, 14px);
  height: var(--studio-composer-chip-media-size, 14px);
  object-fit: cover;
  border-radius: 999px;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-inline-tag--image-only .studio-inline-tag-kind {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-inline-tag--image-only .studio-inline-tag-media {
  width: 100%;
  height: 100%;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-inline-tag--image-only .studio-inline-tag-overlay {
  display: none;
}

.studio-agent-pane .studio-dm-composer.is-split .cursor-composer-mention-editor:empty:before {
  content: attr(data-placeholder);
  color: var(--color-cursor-muted, var(--mos-muted));
  opacity: .7;
  pointer-events: none;
}

@media (max-width: 899px) {
  .studio-agent-pane .studio-dm-composer.is-split .cursor-composer-mention-editor {
    min-height: 26px;
  }
}

@media (min-width: 900px) {
  .studio-agent-pane .studio-dm-composer.is-split .cursor-composer-mention-editor {
    height: auto;
    min-height: 0;
    max-height: none;
  }
}

.studio-agent-pane .studio-dm-composer.is-split .studio-dm-composer-row.is-extras {
  align-items: flex-end;
  padding: 4px 8px 6px;
}

.studio-agent-pane .studio-dm-composer-box.studio-composer-resize-box {
  max-height: min(72vh, var(--studio-composer-box-max-height, 280px));
  box-shadow: 0 1px 1px color-mix(in srgb, var(--mos-text) 10%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright, var(--mos-text)) 8%, transparent);
  border: 1px solid #0000;
  flex-direction: column;
  display: flex;
  overflow: visible;
  height: auto !important;
  min-height: 0 !important;
}

.studio-agent-pane .studio-dm-composer-box.studio-composer-resize-box:focus-within {
  border-color: var(--color-cursor-border, var(--mos-border));
  box-shadow: 0 1px 1px color-mix(in srgb, var(--mos-text) 12%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright, var(--mos-text)) 10%, transparent);
}

.studio-agent-pane .studio-dm-composer-box:before, .studio-agent-pane .studio-dm-composer-box:after {
  content: none;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-dm-composer-row.is-message {
  flex: 0 auto;
}

.studio-agent-pane .studio-dm-composer.is-split .studio-dm-composer-row.is-extras {
  gap: 8px;
}

.studio-agent-composer-plus-wrap {
  z-index: 8;
  flex: none;
  position: relative;
}

.studio-agent-composer-plus-menu {
  z-index: 80;
  margin-bottom: 0;
  bottom: calc(100% + 14px);
  left: 0;
}

.studio-agent-composer-plus-menu .cursor-dropdown-item {
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line {
  border-radius: 999px;
  flex-flow: row;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 4px 8px;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line .studio-dm-composer-row.is-message {
  width: auto;
  max-width: none;
  min-height: 0;
  box-shadow: none;
  background: none;
  border-radius: 0;
  flex: auto;
  order: 2;
  align-items: center;
  margin: 0;
  padding: 6px 8px;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line .cursor-composer-mention-editor {
  min-height: 22px;
  max-height: none;
}

.studio-agent-pane .studio-dm-composer-box:not(.is-single-line) {
  border-radius: 16px;
  flex-direction: column;
  align-items: stretch;
}

.studio-agent-pane .studio-dm-composer-box:not(.is-single-line) .studio-dm-composer-row.is-message {
  width: calc(100% - 16px);
  box-shadow: none;
  flex: auto;
  order: 1;
  margin: 8px 8px 0;
}

.studio-agent-pane .studio-dm-composer-box:not(.is-single-line) .studio-dm-composer-row.is-extras {
  order: 2;
  width: 100%;
  display: flex;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line .studio-dm-composer-row.is-extras {
  display: contents;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line .studio-dm-extras-spacer {
  display: none;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line .studio-agent-composer-plus-wrap {
  order: 1;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line .studio-agent-composer-retry {
  order: 3;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line .cursor-composer-mic {
  order: 4;
}

.studio-agent-pane .studio-dm-composer-box.is-single-line .studio-composer-send-btn {
  order: 5;
}

@media (min-width: 900px) {
  .studio-agent-pane .studio-dm-composer-box {
    height: auto !important;
    min-height: 0 !important;
  }
}

.studio-agent-pane .studio-agent-user-bubble .studio-agent-attachment-strip {
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 8px;
  display: flex;
}

.studio-agent-pane .studio-agent-user-bubble .studio-agent-attachment-strip .studio-inline-tag--image-only.is-plate {
  border-radius: 8px;
  width: 72px;
  min-width: 72px;
  max-width: 72px;
  height: 72px;
}

.studio-agent-pane .studio-agent-user-bubble .studio-agent-attachment-strip .studio-inline-tag--image-only.is-plate .studio-inline-tag-media {
  border-radius: 8px;
}

.studio-agent-attachment-strip {
  padding: 0 0 8px;
}

.studio-agent-turn-attachments {
  margin: 6px 0 2px;
}

.studio-agent-attachment-chip {
  max-width: 100%;
}

.studio-agent-attachment-chip .studio-inline-tag-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 220px;
  overflow: hidden;
}

.studio-agent-attachment-chip.is-static {
  cursor: default;
}

.studio-agent-attachment-remove {
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0 0 0 4px;
  font-size: 14px;
  line-height: 1;
}

.studio-agent-primary-btn, .studio-agent-secondary-btn {
  cursor: pointer;
  font: inherit;
  color: inherit;
  background: var(--mos-plate-strong);
  border: 0;
  border-radius: 999px;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-size: 12px;
  display: inline-flex;
}

.studio-agent-primary-btn {
  background: var(--mos-ink);
  color: var(--mos-page);
}

.studio-agent-auto-toggle {
  border: 1px solid color-mix(in srgb, var(--mos-ink, #111) 10%, transparent);
  background: color-mix(in srgb, var(--mos-plate, #fff) 82%, transparent);
  height: 28px;
  color: var(--mos-ink, var(--color-cursor-text));
  cursor: pointer;
  font: inherit;
  border-radius: 999px;
  align-items: center;
  gap: 7px;
  padding: 0 8px 0 10px;
  line-height: 1;
  display: inline-flex;
}

.studio-agent-auto-toggle:disabled {
  opacity: .6;
  cursor: default;
}

.studio-agent-auto-toggle.is-on {
  border-color: color-mix(in srgb, var(--cursor-accent, #7cff6b) 45%, transparent);
  background: color-mix(in srgb, var(--cursor-accent, #7cff6b) 16%, var(--mos-plate, #fff));
}

.studio-agent-auto-toggle-label {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--mos-ink, var(--color-cursor-text)) 78%, transparent);
  font-size: 10px;
  font-weight: 700;
}

.studio-agent-auto-toggle-switch {
  background: color-mix(in srgb, var(--mos-ink, #111) 14%, transparent);
  box-sizing: border-box;
  border-radius: 999px;
  align-items: center;
  width: 28px;
  height: 16px;
  padding: 2px;
  transition: background .18s;
  display: inline-flex;
}

.studio-agent-auto-toggle-thumb {
  background: var(--mos-plate);
  width: 12px;
  height: 12px;
  box-shadow: 0 1px 2px var(--color-cursor-border-soft),
    inset 0 1px 0 #ffffffb3;
  border-radius: 999px;
  transition: transform .18s;
  transform: translateX(0);
}

.studio-agent-auto-toggle.is-on .studio-agent-auto-toggle-switch {
  background: color-mix(in srgb, var(--cursor-accent, #7cff6b) 55%, transparent);
}

.studio-agent-auto-toggle.is-on .studio-agent-auto-toggle-thumb {
  transform: translateX(12px);
}

.studio-chat-bubble.is-thinking {
  opacity: .85;
  align-items: center;
  gap: 8px;
  display: inline-flex;
}

.studio-agent-provider-status {
  font-size: var(--studio-fs-sm, 12px);
  white-space: nowrap;
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.studio-agent-provider-status.is-good {
  color: var(--mos-success);
}

.studio-agent-provider-status.is-bad {
  color: var(--mos-error);
}

.studio-agent-provider-menu {
  flex: none;
  margin: 4px 0 12px;
  overflow-x: auto;
}

.studio-agent-provider-check {
  color: var(--mos-success);
  margin-left: 4px;
}

.studio-agent-connect-form {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.studio-agent-connect-actions {
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  display: flex;
}

.studio-agent-connect-note, .studio-agent-model-more {
  font-size: var(--studio-fs-sm, 12px);
  color: var(--mos-muted);
}

.studio-agent-connect-error {
  font-size: var(--studio-fs-sm, 12px);
  color: var(--mos-error);
  margin: 0;
  line-height: 1.45;
}

.studio-agent-models-copy {
  margin: 0 0 6px;
}

.studio-agent-media-note {
  margin: 0;
  padding: 0 4px;
}

.studio-agent-lane-row {
  gap: 10px;
}

.studio-agent-lane-row .studio-chrome-settings-row-label {
  white-space: nowrap;
  flex: none;
}

.studio-agent-model-trigger {
  flex: 1 1 0;
  min-width: 0;
  max-width: 260px;
}

.studio-agent-model-provider {
  color: var(--mos-muted);
}

.studio-agent-model-popover {
  flex-direction: column;
  gap: 8px;
  width: 320px;
  display: flex;
}

.studio-agent-model-list {
  flex-direction: column;
  max-height: 320px;
  display: flex;
  overflow-y: auto;
}

.studio-agent-model-list .cursor-tab-context-item {
  justify-content: space-between;
}

.studio-agent-model-group-label {
  font-size: var(--studio-fs-xs, 11px);
  color: var(--mos-muted);
  padding: 8px 8px 4px;
  font-weight: 600;
}

.studio-settings-card-copy {
  opacity: .75;
  margin: 6px 0 0;
  font-size: .92rem;
  line-height: 1.45;
}

.studio-agent-pane.is-split {
  background: var(--mos-page, var(--mos-bg, #121214));
  overflow: hidden;
}

[data-appearance="light"] .studio-agent-pane.is-split {
  background: var(--mos-panel, var(--mos-page));
}

.studio-agent-info-panels {
  background: inherit;
  flex: auto;
  min-width: 0;
  min-height: 0;
}

.studio-agent-chat-column {
  background: var(--mos-page, var(--mos-bg, #121214));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  flex-direction: column;
  min-width: 0;
  max-width: 100%;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

[data-appearance="light"] .studio-agent-chat-column {
  background: var(--mos-panel, var(--mos-page));
}

.studio-agent-chat-head {
  z-index: 2;
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft, var(--mos-border-soft)));
  background: var(--mos-bg, var(--color-cursor-bg, #05080f));
  flex: none;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 12px;
  display: flex;
}

[data-appearance="light"] .studio-agent-chat-head {
  background: var(--mos-panel, var(--mos-page));
}

.studio-agent-chat-head-tools {
  align-items: center;
  gap: 6px;
  display: inline-flex;
}

.studio-agent-chat-head-tools .studio-composer-circle-btn.studio-agent-head-swatch, .studio-agent-chat-head .studio-composer-circle-btn.studio-agent-head-swatch {
  flex: none;
  width: var(--studio-dm-chrome-circle, 28px) !important;
  min-width: var(--studio-dm-chrome-circle, 28px) !important;
  max-width: var(--studio-dm-chrome-circle, 28px) !important;
  height: var(--studio-dm-chrome-circle, 28px) !important;
  min-height: var(--studio-dm-chrome-circle, 28px) !important;
  max-height: var(--studio-dm-chrome-circle, 28px) !important;
  box-sizing: border-box !important;
  background: color-mix(in srgb,
    var(--mos-ink, #111) 6%,
    var(--mos-page, var(--color-cursor-panel, var(--mos-page)))) !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 999px !important;
}

.studio-agent-chat-head-tools .studio-composer-circle-btn.studio-agent-head-swatch:hover, .studio-agent-chat-head .studio-composer-circle-btn.studio-agent-head-swatch:hover {
  background: var(--mos-hover, var(--color-cursor-hover)) !important;
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
  border: 0 !important;
}

.studio-agent-chat-head-tools .studio-composer-circle-btn.studio-agent-head-swatch.is-on, .studio-agent-chat-head-tools .studio-composer-circle-btn.studio-agent-head-swatch.is-on:hover {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 16%,
    var(--mos-page, var(--color-cursor-panel, var(--mos-page)))) !important;
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
  border: 0 !important;
}

.studio-agent-chat-head-tools .studio-composer-circle-btn.studio-agent-head-swatch.is-on:hover {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 24%,
    var(--studio-composer-glass-muted, var(--mos-plate-strong, var(--mos-raised)))) !important;
}

.studio-agent-chat-head-main {
  flex: auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-agent-chat-head-tools {
  flex: none;
  margin-left: auto;
}

.studio-agent-chat-title {
  appearance: none;
  color: var(--color-cursor-text, var(--mos-ink));
  font: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  cursor: text;
  background: none;
  border: 0;
  max-width: 100%;
  margin: 0;
  padding: 0;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.2;
  overflow: hidden;
}

.studio-agent-chat-title-input {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--mos-panel, #fff));
  width: 100%;
  min-width: 0;
  color: inherit;
  font: inherit;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.2;
}

.studio-agent-chat-busy {
  color: var(--color-cursor-muted, var(--mos-muted));
  align-items: center;
  display: inline-flex;
}

.studio-agent-chat-busy .studio-agent-spin, .studio-agent-spin {
  border: 1.5px solid;
  border-right-color: #0000;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  animation: .7s linear infinite studio-agent-spin;
}

@keyframes studio-agent-spin {
  to {
    transform: rotate(360deg);
  }
}

.studio-agent-chat-sidebar {
  background: var(--mos-page, var(--mos-bg, #121214));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  isolation: isolate;
  border-left: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

[data-appearance="light"] .studio-agent-chat-sidebar {
  background: var(--mos-panel, var(--mos-page));
}

.studio-agent-chat-sidebar.is-sheet {
  z-index: 40;
  background: var(--mos-plate, var(--mos-panel));
  height: min(72dvh, 520px);
  box-shadow: var(--studio-mobile-sheet-shadow, 0 -8px 28px var(--color-cursor-border-soft));
  border-top: 0;
  border-left: 0;
  border-radius: 18px 18px 0 0;
  position: absolute;
  inset: auto 0 0;
}

.studio-agent-chat-sidebar.is-sheet.is-dragging {
  transition: none !important;
}

.studio-agent-chat-sidebar .cursor-panel-head, .studio-agent-chat-sidebar-head {
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  padding: 0 var(--studio-sheet-inline-pad, 12px);
  flex: none;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-agent-chat-sidebar-head .cursor-panel-head-tools {
  flex: none;
  margin-left: auto;
}

.studio-agent-sidebar-close {
  flex: none;
  box-sizing: border-box !important;
  border-radius: 999px !important;
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  padding: 0 !important;
}

.studio-agent-chat-sidebar .studio-admin-head-tabs {
  border-bottom: 0;
  flex: none;
  align-self: stretch;
  align-items: center;
  padding: 0;
  display: flex;
}

.studio-agent-sidebar-toolbar {
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  box-sizing: border-box;
  flex: none;
  align-items: stretch;
  gap: 0;
  padding: 0 8px 0 4px;
  display: flex;
}

.studio-agent-sidebar-tabs {
  flex: none;
  min-width: 0;
  padding: 0 4px;
}

.studio-agent-sidebar-tabs.studio-admin-head-tabs {
  background: none;
  gap: 4px;
  padding: 0 2px;
}

.studio-agent-sidebar-tabs .studio-admin-head-tab {
  background: color-mix(in srgb,
    var(--mos-ink, #111) 6%,
    transparent);
  height: 24px;
  min-height: 24px;
  color: var(--color-cursor-muted, var(--mos-muted));
  padding: 0 10px;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 999px !important;
}

.studio-agent-sidebar-tabs .studio-admin-head-tab:hover {
  background: var(--mos-hover, var(--color-cursor-hover));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-agent-sidebar-tabs .studio-admin-head-tab.is-active {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 16%,
    var(--mos-page, var(--color-cursor-panel, var(--mos-page))));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-agent-sidebar-toolbar-divider {
  background: var(--color-cursor-border-soft, var(--mos-border-soft));
  flex: none;
  align-self: stretch;
  width: 1px;
  margin: 0 0 0 4px;
}

.studio-agent-sidebar-search {
  min-width: 0;
  color: var(--color-cursor-muted, var(--mos-muted));
  border: 0;
  flex: auto;
  align-items: center;
  margin: 0;
  padding: 0 0 0 8px;
  display: flex;
}

.studio-agent-sidebar-search .cursor-panel-search {
  flex: auto;
  gap: 5px;
  min-width: 0;
  height: 28px;
  min-height: 28px;
  margin: 2px 8px 2px 0;
}

.studio-agent-sidebar-search .cursor-panel-search-input {
  padding: 0;
  font-size: 11px;
  line-height: 1.2;
}

.studio-agent-chat-sidebar-body {
  overscroll-behavior: contain;
  scrollbar-width: thin;
  flex-direction: column;
  flex: auto;
  gap: 10px;
  min-height: 0;
  padding: 8px;
  display: flex;
  overflow: hidden auto;
}

.studio-agent-sidebar-stack {
  gap: 8px;
  display: grid;
}

.studio-agent-chat-sidebar .studio-agent-sidebar-card.cursor-settings-section, .studio-agent-chat-sidebar .studio-agent-sidebar-card {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 82%, transparent);
  background: var(--mos-plate);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright, #fff) 7%, transparent),
    0 1px 2px var(--color-cursor-border-soft),
    0 4px 10px var(--color-cursor-border-soft);
  border-radius: 18px;
  flex-direction: column;
  gap: 0;
  margin: 0;
  display: flex;
  overflow: hidden;
  padding: 0 !important;
}

[data-appearance="light"] .studio-agent-chat-sidebar .studio-agent-sidebar-card {
  box-shadow: inset 0 1px #ffffffb8, 0 1px 2px #0f172a0d, 0 3px 8px #0f172a0a;
}

.studio-agent-sidebar-acc-toggle {
  width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 12px 14px;
  display: flex;
}

.studio-agent-sidebar-acc-toggle:hover {
  background: color-mix(in srgb, var(--mos-text-bright, #111) 3%, transparent);
}

.studio-agent-chat-sidebar .studio-settings-card-title {
  color: var(--color-cursor-text-bright, var(--mos-ink));
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 0;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  display: inline-flex;
}

.studio-agent-sidebar-acc-meta {
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.studio-agent-sidebar-acc-count {
  font-variant-numeric: tabular-nums;
}

.studio-agent-sidebar-acc-chevron {
  color: var(--color-cursor-muted, var(--mos-muted));
  transition: transform .16s;
  display: inline-flex;
}

.studio-agent-sidebar-acc-chevron.is-open {
  transform: rotate(180deg);
}

.studio-agent-sidebar-card-body {
  border-top: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 72%, transparent);
  min-width: 0;
}

.studio-agent-chat-sidebar .studio-settings-empty {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  padding: 10px 14px 12px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-agent-sidebar-summary {
  overflow: hidden;
}

.studio-agent-sidebar-summary-hero {
  background: radial-gradient(circle at 88% 0%,
      color-mix(in srgb, var(--cursor-accent, #7cff6b) 22%, transparent),
      transparent 52%),
    radial-gradient(circle at 8% 100%,
      color-mix(in srgb, var(--cursor-accent, #7cff6b) 10%, transparent),
      transparent 44%),
    var(--mos-plate, var(--cursor-surface, #fff));
  padding: 10px;
  position: relative;
  overflow: hidden;
}

.studio-agent-sidebar-summary-watermark {
  width: 96px;
  height: 96px;
  color: var(--cursor-accent, #7cff6b);
  opacity: .18;
  pointer-events: none;
  z-index: 0;
  position: absolute;
  top: 50%;
  right: -18px;
  transform: translateY(-48%)rotate(-10deg);
}

.studio-agent-sidebar-stat-grid {
  z-index: 1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  display: grid;
  position: relative;
}

.studio-agent-sidebar-stat {
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 70%, transparent);
  background: color-mix(in srgb, var(--mos-bg, var(--mos-page)) 42%, transparent);
  border-radius: 12px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2px;
  min-width: 0;
  min-height: 64px;
  padding: 8px 6px;
  display: flex;
  box-shadow: inset 0 1px #ffffff8c;
}

[data-appearance="dark"] .studio-agent-sidebar-stat {
  background: color-mix(in srgb, var(--mos-bg, #05080f) 38%, transparent);
  box-shadow: inset 0 1px #ffffff0f;
}

.studio-agent-sidebar-stat > svg {
  width: 12px;
  height: 12px;
  color: var(--color-cursor-muted, var(--mos-muted));
  margin-bottom: 1px;
}

.studio-agent-sidebar-stat > strong {
  color: var(--color-cursor-text-bright, var(--mos-ink));
  text-overflow: ellipsis;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.02em;
  max-width: 100%;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.15;
  overflow: hidden;
}

.studio-agent-sidebar-stat > span {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 9px;
  font-weight: 700;
}

.studio-agent-todo-accordions {
  flex-direction: column;
  gap: 0;
  display: flex;
}

.studio-agent-todo-acc {
  background: none;
  border: 0;
  border-radius: 0;
  overflow: visible;
}

.studio-agent-todo-acc + .studio-agent-todo-acc {
  border-top: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 88%, transparent);
}

.studio-agent-todo-acc > summary {
  cursor: pointer;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  margin: 0;
  padding: 10px 14px;
  font-size: 12px;
  font-weight: 650;
  list-style: none;
  transition: background .14s;
  display: flex;
}

.studio-agent-todo-acc > summary:hover {
  background: color-mix(in srgb, var(--mos-ink, #111) 4%, transparent);
}

.studio-agent-todo-acc > summary::-webkit-details-marker {
  display: none;
}

.studio-agent-todo-acc-title {
  -webkit-line-clamp: 2;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-ink));
  -webkit-box-orient: vertical;
  flex: auto;
  line-height: 1.3;
  display: -webkit-box;
  overflow: hidden;
}

.studio-agent-todo-acc-meta {
  flex: none;
  align-items: center;
  gap: 4px;
  padding-top: 1px;
  display: inline-flex;
}

.studio-agent-todo-badge {
  background: color-mix(in srgb, var(--mos-ink, #111) 6%, transparent);
  min-width: 20px;
  height: 16px;
  color: var(--color-cursor-muted, var(--mos-muted));
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 2px;
  padding: 0 5px;
  font-size: 9px;
  font-weight: 700;
  display: inline-flex;
}

.studio-agent-todo-badge.is-done {
  color: var(--color-cursor-text, var(--mos-ink));
}

.studio-agent-todo-acc .studio-agent-todo-list {
  border-top: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 88%, transparent);
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-agent-todo-acc .studio-agent-todo-list li {
  border-bottom: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 88%, transparent);
  color: var(--color-cursor-text, var(--mos-ink));
  align-items: flex-start;
  gap: 8px;
  padding: 8px 14px;
  font-size: 11.5px;
  line-height: 1.35;
  display: flex;
}

.studio-agent-todo-acc .studio-agent-todo-list li:last-child {
  border-bottom: 0;
}

.studio-agent-todo-check {
  border: 1.5px solid color-mix(in srgb, var(--mos-ink, #111) 28%, transparent);
  color: #fff;
  box-sizing: border-box;
  border-radius: 3px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 14px;
  height: 14px;
  margin-top: 1px;
  display: inline-flex;
}

.studio-agent-todo-check.is-done {
  background: color-mix(in srgb, var(--mos-ink, #111) 88%, transparent);
  border-color: #0000;
}

.studio-agent-todo-check.is-doing {
  border-color: color-mix(in srgb, var(--mos-ink, #111) 45%, transparent);
}

.studio-agent-todo-step-text {
  flex: auto;
  min-width: 0;
}

.studio-agent-todo-acc .studio-agent-todo-list li.is-done {
  opacity: .55;
}

.studio-agent-todo-acc .studio-agent-todo-list li.is-done .studio-agent-todo-step-text {
  text-decoration: line-through;
}

.studio-agent-turn-cost-list {
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-agent-turn-cost-list li {
  border-bottom: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 88%, transparent);
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px;
  padding: 10px 14px;
  display: grid;
}

.studio-agent-turn-cost-list li.is-search-hit {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.studio-agent-turn-cost-list li:last-child {
  border-bottom: 0;
}

.studio-agent-turn-cost-msg, .studio-agent-turn-cost-list li.is-search-hit p {
  color: var(--color-cursor-text, var(--mos-ink));
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: 0;
  font-size: 11.5px;
  line-height: 1.35;
  display: -webkit-box;
  overflow: hidden;
}

.studio-agent-turn-cost-meta {
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  padding-top: 1px;
  font-size: 10px;
  font-weight: 650;
}

.studio-agent-search-role {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 9px;
  font-weight: 700;
}

.studio-agent-media-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 10px 14px 12px;
  list-style: none;
  display: grid;
}

.studio-agent-media-tile {
  aspect-ratio: 1;
  border-radius: var(--cursor-radius-md, 8px);
  border: 1px solid var(--color-cursor-border, var(--mos-border-soft));
  background: color-mix(in srgb, var(--mos-ink, #111) 6%, transparent);
  cursor: default;
  position: relative;
  overflow: hidden;
}

.studio-agent-media-tile-img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-agent-media-tile-img.is-empty {
  background: color-mix(in srgb, var(--mos-ink, #111) 8%, transparent);
}

.studio-agent-media-tile-overlay {
  background: linear-gradient(to top,
    var(--color-cursor-border-soft),
    var(--color-cursor-border-soft) 55%,
    transparent);
  color: #fff;
  pointer-events: none;
  flex-direction: column;
  gap: 1px;
  padding: 18px 7px 6px;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.studio-agent-media-tile-overlay strong, .studio-agent-media-tile-overlay span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-agent-media-tile-overlay strong {
  font-size: 10.5px;
  font-weight: 650;
  line-height: 1.2;
}

.studio-agent-media-tile-overlay span {
  letter-spacing: .03em;
  text-transform: uppercase;
  opacity: .82;
  font-size: 9px;
  font-weight: 650;
}

.studio-agent-search-field {
  display: none;
}

.studio-site-agent-rail {
  flex: auto;
  height: 100%;
  min-height: 0;
}

.studio-site-agent-rail .studio-chrome-rail-body.is-chat {
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.studio-site-agent-rail .studio-dm-sidebar, .studio-site-agent-rail .studio-dm-pane {
  flex: auto;
  height: 100%;
  min-height: 0;
}

.studio-site-agent-rail .studio-chrome-rail-body.is-history {
  overflow: auto;
}

.studio-site-agent-rail-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  max-width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: default;
  background: none;
  border: 0;
  padding: 0;
  overflow: hidden;
}

.studio-site-agent-rail .cursor-icon-btn.is-on {
  background: var(--mos-plate-strong);
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-site-agent-history {
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  padding: 8px;
  display: flex;
}

.studio-site-agent-history .studio-history-item {
  padding: 10px 12px;
}

.studio-agent-pane.is-rail {
  --studio-composer-shell-max: 100%;
  --studio-chat-column-max: 100%;
  background: var(--mos-page, var(--mos-bg));
  height: 100%;
  min-height: 0;
}

.studio-agent-pane.is-rail .studio-agent-chat-column {
  height: 100%;
  min-height: 0;
}

.studio-agent-pane.is-rail .studio-chat-stream {
  padding-bottom: 24px;
}

.studio-agent-pane.is-rail .studio-agent-composer-dock .studio-dm-composer.is-split {
  padding-inline: 0;
  max-width: 100%;
  padding-bottom: 0;
}

.studio-agent-pane.is-rail .studio-dm-composer-box {
  box-shadow: none;
  border-radius: 0;
}

.studio-agent-pane.is-rail .studio-dm-composer-box:before, .studio-agent-pane.is-rail .studio-dm-composer-box:after {
  content: none;
}

.studio-agent-pane.is-rail .studio-agent-empty-hero {
  transform: scale(.88);
}

.studio-chrome-settings-card-body > .studio-agent-connect-form {
  padding: 0 10px 12px;
}

.studio-chrome-settings-card-body > .studio-agent-models-copy {
  padding: 10px 10px 0;
}

/* [project]/src/studio/components/studio-asset-picker.css [app-client] (css) */
.studio-asset-picker-crumbs {
  z-index: 1;
  background: var(--mos-page, var(--mos-panel));
  align-items: center;
  gap: 8px;
  min-height: 32px;
  margin-bottom: 8px;
  padding-top: 2px;
  display: flex;
  position: sticky;
  top: 0;
}

.studio-asset-picker-back {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  max-width: 40%;
  color: var(--color-cursor-text-bright);
  font: inherit;
  cursor: pointer;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: none;
  align-items: center;
  gap: 2px;
  padding: 3px 10px 3px 6px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
  overflow: hidden;
}

.studio-asset-picker-back > svg {
  stroke-width: 2px;
  flex: none;
  width: 13px;
  height: 13px;
}

.studio-asset-picker-here {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright);
  flex: auto;
  font-size: 12px;
  font-weight: 650;
  overflow: hidden;
}

.studio-asset-picker-count {
  color: var(--color-cursor-muted);
  font-variant-numeric: tabular-nums;
  flex: none;
  font-size: 11px;
  font-weight: 650;
}

.studio-asset-picker-folders {
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
  margin-bottom: 10px;
  display: grid;
}

.studio-asset-picker-folder {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--cursor-surface-raised));
  min-height: 36px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  text-align: left;
  cursor: pointer;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.studio-asset-picker-folder > svg {
  stroke-width: 1.75px;
  width: 15px;
  height: 15px;
  color: var(--color-cursor-muted);
  flex: none;
}

.studio-asset-picker-folder > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-asset-picker-folder-row {
  align-items: stretch;
  gap: 6px;
  display: flex;
}

.studio-asset-picker-folder-row .studio-asset-picker-folder {
  flex: auto;
  min-width: 0;
}

.studio-asset-picker-folder-chevron {
  stroke-width: 2px;
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted);
  opacity: .7;
  flex: none;
  margin-left: auto;
}

.studio-asset-picker-folder-select {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--cursor-surface-raised));
  width: 36px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-asset-picker-folder-row.is-selected .studio-asset-picker-folder-select, .studio-asset-picker-folder-select[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--color-cursor-accent, #6c8cff) 55%, transparent);
  background: color-mix(in srgb, var(--color-cursor-accent, #6c8cff) 18%, transparent);
  color: var(--color-cursor-text-bright);
}

.studio-asset-picker-folder-select > svg {
  stroke-width: 2.25px;
  width: 14px;
  height: 14px;
}

.studio-asset-picker-list {
  gap: 6px;
  margin-bottom: 10px;
  display: grid;
}

.studio-asset-picker-list-item {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--cursor-surface-raised));
  min-height: 36px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  text-align: left;
  cursor: pointer;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.studio-asset-picker-list-item > svg {
  stroke-width: 1.75px;
  width: 15px;
  height: 15px;
  color: var(--color-cursor-muted);
  flex: none;
}

.studio-asset-picker-list-item > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-asset-picker-list-item.is-selected {
  border-color: color-mix(in srgb, var(--color-cursor-accent, #6c8cff) 55%, transparent);
  background: color-mix(in srgb, var(--color-cursor-accent, #6c8cff) 14%, transparent);
}

.studio-asset-picker-grid {
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 8px;
  display: grid;
}

.studio-asset-picker-grid button {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 10px);
  color: var(--color-cursor-muted);
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  gap: 4px;
  padding: 6px;
  font-size: 10px;
  transition: border-color .16s, background .16s, color .16s;
  display: grid;
}

.studio-asset-picker-grid button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.studio-asset-picker-grid button.is-selected {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
  color: var(--color-cursor-text-bright);
}

.studio-asset-picker-grid button img, .studio-asset-picker-grid button .studio-asset-picker-thumb {
  border-radius: var(--cursor-radius-sm, 6px);
  border: 1px solid var(--color-cursor-border-soft);
  background: color-mix(in srgb, var(--mos-text-bright, #fff) 4%, transparent);
  object-fit: cover;
  width: 100%;
  height: 64px;
}

.studio-asset-picker-grid button > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-asset-picker-foot {
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--color-cursor-border-soft);
  flex-wrap: wrap;
  flex: none;
  justify-content: flex-end;
  gap: 8px;
  display: flex;
}

.studio-asset-picker-done {
  border: 1px solid
    color-mix(in srgb, var(--cursor-accent) 42%, var(--color-cursor-border-soft));
  border-radius: var(--cursor-radius-pill, 999px);
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
  min-height: 30px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  cursor: pointer;
  align-items: center;
  gap: 6px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.studio-asset-picker-done.is-secondary {
  border-color: var(--color-cursor-border-soft);
  background: none;
}

.studio-asset-picker-done:disabled {
  opacity: .45;
  cursor: default;
}

.studio-asset-picker-done > svg {
  stroke-width: 2px;
  width: 13px;
  height: 13px;
}

.studio-asset-picker-sheet.studio-mobile-app-menu-sheet {
  z-index: 130;
  min-height: 0;
  color: var(--color-cursor-text);
  flex-direction: column;
  display: flex;
  background: var(--mos-page, var(--mos-panel)) !important;
}

.studio-asset-picker-sheet .studio-mobile-app-menu-sheet-handle {
  background: var(--mos-page, var(--mos-panel)) !important;
}

.studio-asset-picker-desk-root {
  z-index: 129;
  pointer-events: none;
  place-items: center;
  padding: 16px;
  display: grid;
  position: fixed;
  inset: 0;
}

.studio-asset-picker-desk-backdrop {
  z-index: 0;
  background: color-mix(in srgb, var(--mos-page) 42%, transparent);
  cursor: pointer;
  pointer-events: auto;
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
}

.studio-asset-picker-body {
  overscroll-behavior: contain;
  background: var(--mos-plate, var(--cursor-surface));
  flex-direction: column;
  flex: auto;
  gap: 0;
  min-height: 0;
  padding: 0 8px 12px;
  display: flex;
  overflow: hidden auto;
}

.studio-asset-picker-body.studio-mobile-app-menu-body {
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  background: var(--mos-page, var(--mos-panel));
}

.studio-asset-picker-files.cursor-file-grid {
  background: none;
  flex: none;
  min-height: 0;
  padding: 4px 4px 12px;
}

.studio-asset-picker-sheet .desk-file-grid-item {
  touch-action: pan-y !important;
}

.studio-asset-picker-tile {
  min-width: 0;
  position: relative;
}

.studio-asset-picker-tile .desk-file-grid-item {
  width: 100%;
  min-width: 0;
}

.studio-asset-picker-tile.is-picked .desk-file-grid-item, .studio-asset-picker-tile .desk-file-grid-item[aria-pressed="true"] {
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent);
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, var(--cursor-accent) 28%, transparent);
}

.studio-asset-picker-tile-check {
  z-index: 2;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page);
  width: 24px;
  height: 24px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
  position: absolute;
  top: 4px;
  right: 4px;
}

.studio-asset-picker-tile-check.is-selected, .studio-asset-picker-tile-check[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--color-cursor-accent, #6c8cff) 55%, transparent);
  background: color-mix(in srgb, var(--color-cursor-accent, #6c8cff) 18%, var(--mos-page));
  color: var(--color-cursor-text-bright);
}

.studio-asset-picker-tile-check > svg {
  stroke-width: 2.25px;
  width: 12px;
  height: 12px;
}

.studio-asset-picker-action-bar.studio-asset-pick-footer {
  border-top: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page, var(--mos-panel));
  padding-bottom: max(0px, env(safe-area-inset-bottom, 0px));
}

.studio-asset-picker-desk-head {
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate, var(--cursor-surface));
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  display: flex;
}

.studio-asset-picker-desk-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright);
  flex: auto;
  margin: 0;
  font-size: 12px;
  font-weight: 650;
  overflow: hidden;
}

.studio-asset-picker-desk-dialog {
  z-index: 1;
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-xl, 12px);
  width: min(720px, 100%);
  height: min(78vh, 720px);
  min-height: 0;
  max-height: min(78vh, 720px);
  color: var(--color-cursor-text);
  box-shadow: var(--cursor-shadow-pop, 0 18px 48px #0000002e);
  pointer-events: auto;
  flex-direction: column;
  display: flex;
  position: relative;
  overflow: hidden;
  background: var(--mos-plate, var(--cursor-surface)) !important;
}

.studio-asset-picker-desk-dialog .studio-asset-picker-action-bar {
  background: var(--mos-plate, var(--cursor-surface));
}

.studio-asset-pick-chrome {
  border-top: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page, var(--color-cursor-bg));
  flex-direction: column;
  flex: none;
  min-width: 0;
  display: flex;
}

.studio-asset-pick-selected {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page, var(--color-cursor-bg));
  flex: none;
  min-width: 0;
  padding: 4px 8px;
}

.studio-asset-pick-selected-scroller {
  scrollbar-width: thin;
  align-items: center;
  gap: 4px;
  display: flex;
  overflow: auto hidden;
}

.studio-asset-pick-selected-thumb {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate, var(--cursor-surface-raised));
  width: 28px;
  height: 28px;
  color: var(--color-cursor-muted);
  border-radius: 6px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-asset-pick-selected-thumb > img, .studio-asset-pick-selected-thumb > video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-asset-pick-selected-thumb.is-tag {
  border-radius: 999px;
  justify-content: flex-start;
  gap: 4px;
  width: auto;
  max-width: 140px;
  padding: 0 8px 0 6px;
}

.studio-asset-pick-selected-glyph {
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted);
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-asset-pick-selected-glyph > svg {
  stroke-width: 1.75px;
  width: 12px;
  height: 12px;
}

.studio-asset-pick-selected-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright);
  flex: auto;
  font-size: 10px;
  font-weight: 650;
  overflow: hidden;
}

.studio-asset-pick-selected-thumb.is-tag .studio-asset-pick-selected-remove {
  flex: none;
  margin-left: 2px;
  position: static;
}

.studio-asset-pick-selected-thumb > svg {
  stroke-width: 1.75px;
  width: 14px;
  height: 14px;
}

.studio-asset-pick-selected-remove {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page);
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
  position: absolute;
  top: -2px;
  right: -2px;
}

.studio-asset-pick-selected-remove > svg {
  stroke-width: 2.5px;
  width: 9px;
  height: 9px;
}

.studio-asset-pick-selected-remove:hover {
  color: var(--color-cursor-text);
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-asset-pick-footer {
  box-sizing: border-box;
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  color: var(--color-cursor-text-bright);
  flex: none;
  align-items: center;
  gap: 4px;
  padding: 0 8px;
  display: flex;
}

.studio-asset-pick-count {
  background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 16%, transparent);
  width: 16px;
  height: 16px;
  color: var(--color-cursor-text-bright);
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  font-size: 9px;
  font-weight: 700;
  display: inline-flex;
}

.studio-asset-pick-footer-copy {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright);
  flex: auto;
  font-size: 11px;
  font-weight: 650;
  overflow: hidden;
}

.studio-asset-pick-folder-btn {
  appearance: none;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page, var(--color-cursor-panel));
  height: 24px;
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0 8px;
  font-size: 10px;
  font-weight: 650;
  display: inline-flex;
}

.studio-asset-pick-folder-btn:hover {
  color: var(--color-cursor-text);
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-asset-pick-icon-btn {
  appearance: none;
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page, var(--color-cursor-panel));
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  color: var(--color-cursor-muted);
  font: inherit;
  box-shadow: none;
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-asset-pick-icon-btn > svg {
  stroke-width: 2px;
  flex: none;
  width: 12px;
  height: 12px;
}

.studio-asset-pick-icon-btn.is-primary {
  border-color: color-mix(in srgb,
    var(--color-cursor-accent, #3b82f6) 28%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 10%, var(--mos-page));
  width: auto;
  min-width: 0;
  color: var(--color-cursor-text-bright);
  padding: 0 9px;
}

.studio-asset-pick-icon-btn:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover));
  color: var(--color-cursor-text);
}

.studio-asset-pick-icon-btn.is-primary:hover:not(:disabled) {
  background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 16%, var(--mos-page));
  color: var(--color-cursor-text-bright);
}

.studio-asset-pick-icon-btn:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.cursor-sidebar.is-asset-picking, aside.is-asset-picking {
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, var(--cursor-accent) 28%, transparent);
}

.desk-file-grid-item.is-picked, .desk-file-list-row.is-picked, .desk-file-preview-item.is-picked, .cursor-tree-row.is-picked {
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, var(--cursor-accent) 28%, transparent);
  border-color: color-mix(in srgb,
    var(--cursor-accent) 48%,
    var(--color-cursor-border-soft)) !important;
  background: color-mix(in srgb, var(--cursor-accent) 14%, transparent) !important;
}

/* [project]/src/studio/components/studio-billing.css [app-client] (css) */
.studio-billing-pane {
  background: radial-gradient(ellipse 90% 42% at 50% -8%,
      color-mix(in srgb, var(--cursor-accent) 18%, transparent),
      transparent 58%),
    var(--mos-page, var(--color-cursor-bg));
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-billing-body {
  flex: auto;
  min-height: 0;
  padding: 32px 20px 56px;
  overflow: auto;
}

.studio-billing-canvas {
  gap: 24px;
  width: min(1080px, 100%);
  margin: 0 auto;
  display: grid;
}

.studio-billing-intro {
  text-align: center;
  justify-items: center;
  gap: 10px;
  max-width: 560px;
  margin: 8px auto 0;
  display: grid;
}

.studio-billing-kicker {
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--cursor-accent);
  margin: 0;
  font-size: 10px;
  font-weight: 750;
}

.studio-billing-intro h1, .studio-billing-intro p {
  margin: 0;
}

.studio-billing-intro h1 {
  letter-spacing: -.045em;
  color: var(--color-cursor-text-bright);
  font-size: clamp(26px, 3.6vw, 36px);
  font-weight: 780;
  line-height: 1.12;
}

.studio-billing-intro p:last-child {
  max-width: 480px;
  color: var(--color-cursor-muted);
  font-size: 14px;
  line-height: 1.55;
}

.studio-billing-period {
  justify-self: center;
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.studio-billing-period button {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--cursor-surface));
  min-height: 28px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.studio-billing-period button:hover {
  color: var(--color-cursor-text-bright);
  border-color: var(--color-cursor-border, var(--mos-border));
}

.studio-billing-period button span {
  background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  color: var(--cursor-accent);
  letter-spacing: .02em;
  border-radius: 999px;
  padding: 1px 6px;
  font-size: 10px;
  font-weight: 750;
}

.studio-billing-period button.is-active {
  background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  border-color: color-mix(in srgb, var(--cursor-accent) 40%, var(--color-cursor-border-soft));
  color: var(--color-cursor-text-bright);
}

.studio-billing-period button.is-active:hover {
  border-color: color-mix(in srgb, var(--cursor-accent) 52%, var(--color-cursor-border-soft));
}

.studio-billing-period button.is-active span {
  background: color-mix(in srgb, var(--cursor-accent) 22%, transparent);
  color: var(--cursor-accent);
}

.studio-billing-current {
  border: 1px solid color-mix(in srgb, var(--cursor-accent) 32%, var(--color-cursor-border));
  background: radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--cursor-accent) 20%, transparent), transparent 48%),
    var(--mos-plate, var(--cursor-surface));
  border-radius: 16px;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 18px 22px;
  display: flex;
  box-shadow: 0 8px 22px #0000000f;
}

.studio-billing-current h2, .studio-billing-current p, .studio-billing-current strong {
  margin: 0;
}

.studio-billing-current h2 {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 700;
}

.studio-billing-current strong {
  letter-spacing: -.03em;
  margin-top: 4px;
  font-size: 20px;
  display: block;
}

.studio-billing-current p {
  color: var(--color-cursor-muted);
  margin-top: 6px;
  font-size: 13px;
}

.studio-billing-current-actions {
  flex-wrap: wrap;
  gap: 8px;
  display: flex;
}

.studio-billing-current-actions button {
  border: 1px solid var(--color-cursor-border);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  min-height: 34px;
  color: var(--color-cursor-text-bright);
  cursor: pointer;
  border-radius: 9px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 650;
}

.studio-billing-current-actions button.is-danger {
  border-color: color-mix(in srgb, var(--mos-danger, #ef4444) 40%, transparent);
  color: var(--mos-danger, #ef4444);
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 8%, transparent);
}

.studio-billing-plans {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 18px;
  padding: 8px 0 12px;
  display: grid;
}

.studio-billing-card {
  border: 1px solid var(--color-cursor-border, var(--mos-border-soft));
  background: var(--mos-plate, var(--cursor-surface));
  border-radius: 20px;
  flex-direction: column;
  gap: 16px;
  min-height: 0;
  padding: 26px 22px 22px;
  transition: transform .18s, box-shadow .18s, border-color .18s;
  display: flex;
  box-shadow: 0 1px #ffffff59, 0 12px 28px #00000014;
}

.studio-billing-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 1px #fff6, 0 16px 36px #0000001f;
}

.studio-billing-card.is-featured {
  border-color: color-mix(in srgb, var(--cursor-accent) 72%, var(--color-cursor-border));
  background: linear-gradient(180deg,
      color-mix(in srgb, var(--cursor-accent) 16%, var(--mos-plate, var(--cursor-surface))),
      var(--mos-plate, var(--cursor-surface)) 42%);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent) 28%, transparent),
    0 16px 36px color-mix(in srgb, var(--cursor-accent) 20%, transparent);
  transform: translateY(-6px);
}

.studio-billing-card.is-featured:hover {
  transform: translateY(-8px);
}

.studio-billing-card.is-current {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent) 60%, transparent);
  outline-offset: 2px;
}

.studio-billing-card-kicker {
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  display: flex;
}

.studio-billing-card-title-row {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-billing-card h3 {
  letter-spacing: -.04em;
  color: var(--color-cursor-text-bright);
  margin: 0;
  font-size: 20px;
  font-weight: 760;
}

.studio-billing-pitch {
  color: var(--color-cursor-text);
  margin: 4px 0 0;
  font-size: 13px;
}

.studio-billing-badge {
  background: var(--cursor-accent);
  color: var(--cursor-on-accent, #fff);
  letter-spacing: .06em;
  text-transform: uppercase;
  border-radius: 999px;
  flex: none;
  padding: 3px 7px;
  font-size: 9px;
  font-weight: 780;
}

.studio-billing-price-block {
  gap: 0;
  display: grid;
}

.studio-billing-price {
  letter-spacing: -.05em;
  color: var(--color-cursor-text-bright);
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 10px;
  margin: 0;
  font-size: 36px;
  font-weight: 780;
  line-height: .95;
  display: flex;
}

.studio-billing-price .studio-academy-card-compare {
  letter-spacing: -.03em;
  opacity: .72;
  font-size: .62em;
  font-weight: 700;
}

.studio-billing-price-now {
  align-items: baseline;
  gap: 4px;
  display: inline-flex;
}

.studio-billing-price-unit {
  color: var(--color-cursor-text);
  letter-spacing: -.02em;
  font-size: 14px;
  font-weight: 650;
}

.studio-billing-save {
  background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  color: var(--cursor-accent);
  letter-spacing: 0;
  border-radius: 999px;
  flex: none;
  padding: 2px 7px;
  font-size: 10px;
  font-weight: 750;
}

.studio-billing-equiv {
  color: var(--color-cursor-text);
  opacity: .72;
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
}

.studio-billing-card ul {
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.studio-billing-card li {
  color: var(--color-cursor-text);
  align-items: flex-start;
  gap: 10px;
  font-size: 13.5px;
  line-height: 1.4;
  display: flex;
}

.studio-billing-card li svg {
  width: 14px;
  height: 14px;
  color: var(--cursor-accent);
  stroke-width: 2.4px;
  flex: none;
  margin-top: 1px;
}

.studio-billing-card-cta {
  background: var(--color-cursor-text);
  min-height: 44px;
  color: var(--mos-page);
  letter-spacing: -.02em;
  cursor: pointer;
  border: 0;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 760;
  transition: transform .16s, box-shadow .16s, filter .16s;
  display: inline-flex;
  box-shadow: 0 8px 18px #00000024;
}

[data-appearance="light"] .studio-billing-card-cta:not(.is-featured-cta):not(.is-ghost) {
  background: var(--color-cursor-text);
  color: #fff;
}

.studio-billing-card-cta svg {
  width: 14px;
  height: 14px;
}

.studio-billing-card-cta:hover:not(:disabled) {
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow: 0 14px 28px #0003;
}

.studio-billing-card-cta.is-featured-cta {
  background: var(--cursor-accent);
  color: var(--cursor-on-accent, #fff);
  box-shadow: 0 12px 30px color-mix(in srgb, var(--cursor-accent) 42%, transparent);
}

.studio-billing-card-cta.is-featured-cta:hover:not(:disabled) {
  box-shadow: 0 16px 36px color-mix(in srgb, var(--cursor-accent) 52%, transparent);
}

.studio-billing-card-cta.is-ghost {
  border: 1px solid var(--color-cursor-border);
  color: var(--color-cursor-text-bright);
  box-shadow: none;
  background: none;
}

.studio-billing-card-cta:disabled {
  opacity: .58;
  cursor: default;
  filter: none;
  transform: none;
}

.studio-billing-filters {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-billing-filters button {
  border: 1px solid var(--color-cursor-border-soft);
  min-height: 28px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border-radius: 999px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 650;
}

.studio-billing-filters button.is-active {
  background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  border-color: color-mix(in srgb, var(--cursor-accent) 40%, var(--mos-border-soft));
  color: var(--color-cursor-text-bright);
}

.studio-billing-invoice-list {
  gap: 10px;
  display: grid;
}

.studio-billing-invoice {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--cursor-surface));
  border-radius: 14px;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  display: grid;
  box-shadow: 0 1px #ffffff52;
}

.studio-billing-invoice strong, .studio-billing-invoice span {
  display: block;
}

.studio-billing-invoice span {
  color: var(--color-cursor-muted);
  margin-top: 3px;
  font-size: 12px;
  line-height: 1.35;
}

.studio-billing-invoice-when {
  opacity: .78;
  font-size: 11px !important;
}

.studio-billing-invoice-meta {
  align-items: center;
  gap: 10px;
  display: flex;
}

.studio-billing-invoice-meta button {
  background: var(--cursor-accent);
  min-height: 28px;
  color: var(--cursor-on-accent, #fff);
  cursor: pointer;
  border: 0;
  border-radius: 8px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
}

.studio-billing-empty {
  color: var(--color-cursor-muted);
  font-size: 13px;
}

.studio-billing-topup {
  gap: 20px;
  width: min(440px, 100%);
  margin: 0 auto;
  display: grid;
}

@media (max-width: 860px) {
  .studio-billing-plans {
    grid-template-columns: 1fr;
    padding-top: 0;
  }

  .studio-billing-card, .studio-billing-card.is-featured, .studio-billing-card.is-featured:hover, .studio-billing-card:hover {
    transform: none;
  }

  .studio-billing-card.is-featured {
    order: -1;
  }

  .studio-billing-current {
    flex-direction: column;
    align-items: stretch;
  }
}

/* [project]/src/studio/components/studio-chat-audio-player.css [app-client] (css) */
.studio-chat-audio-player {
  box-sizing: border-box;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border, #94a3b829) 90%, transparent);
  background: color-mix(in srgb, var(--color-cursor-composer, #07111f) 55%, transparent);
  border-radius: 16px;
  width: min(100%, 360px);
  min-width: 0;
  padding: 10px 12px;
}

.studio-chat-audio-host {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.studio-chat-audio-player-host {
  width: 100%;
  min-width: 0;
}

.studio-chat-audio-player-host .studio-chat-audio-player {
  width: 100%;
  min-width: 0;
  max-width: none;
}

.studio-chat-audio-player.is-loading {
  align-items: center;
  min-height: 76px;
  display: flex;
}

.studio-chat-audio-load-body {
  flex-direction: column;
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: auto;
  min-height: 0;
  display: flex;
}

.studio-chat-audio-load-label {
  text-align: center;
  letter-spacing: .02em;
  color: color-mix(in srgb, var(--mos-text-bright, #fff) 72%, transparent);
  pointer-events: none;
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  position: static;
}

.studio-chat-audio-player.is-pane {
  background: color-mix(in srgb, var(--mos-panel, #0f172a) 80%, transparent);
  width: min(100%, 440px);
  padding: 16px;
}

.studio-chat-audio-pane {
  box-sizing: border-box;
  background: var(--color-cursor-bg);
  flex: 1;
  place-items: center;
  width: 100%;
  min-height: 0;
  padding: 24px 16px;
  display: grid;
}

.studio-chat-audio-orb-hero {
  place-items: center;
  margin-bottom: 14px;
  display: grid;
}

.studio-chat-audio-row {
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-chat-audio-row.is-wave-fill {
  flex: auto;
  align-items: center;
  min-height: 0;
}

.studio-chat-audio-head {
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin-bottom: 8px;
  display: flex;
}

.studio-chat-audio-head-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  flex: auto;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
  overflow: hidden;
}

.studio-chat-audio-head-spacer {
  flex: auto;
  min-width: 0;
}

.studio-chat-audio-head-end {
  flex: none;
  align-items: center;
  display: inline-flex;
}

.studio-chat-audio-player.is-compact {
  border-radius: 12px;
  padding: 6px 8px;
}

.studio-chat-audio-player.is-compact .studio-chat-audio-head {
  margin-bottom: 4px;
}

.studio-chat-audio-player.is-compact .studio-chat-audio-head-title {
  font-size: 11px;
}

.studio-chat-audio-player.is-compact .studio-chat-audio-row {
  gap: 6px;
}

.studio-chat-audio-player.is-compact .studio-chat-audio-wave {
  min-width: 48px;
  height: 28px;
}

.studio-chat-audio-player.is-compact .studio-chat-audio-time {
  min-width: 3.5ch;
  font-size: 10px;
}

.studio-chat-audio-player.is-compact .studio-chat-audio-foot {
  margin-top: 4px;
}

.studio-chat-audio-player.is-compact.is-loading {
  min-height: 52px;
}

.studio-chat-audio-player.is-compact.is-loading .studio-chat-audio-load-body {
  gap: 8px;
  height: auto;
  min-height: 0;
}

.studio-chat-audio-foot {
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin-top: 8px;
  display: flex;
}

.studio-chat-audio-wave {
  cursor: pointer;
  touch-action: none;
  flex: 1 1 0;
  width: 100%;
  min-width: 48px;
  height: 48px;
  position: relative;
}

.studio-chat-audio-player.is-pane .studio-chat-audio-wave {
  height: 80px;
}

.studio-chat-audio-waveform {
  width: 100%;
  min-width: 0;
  height: 100%;
  display: block;
}

.studio-chat-audio-waveform canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

.studio-chat-audio-time {
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  white-space: nowrap;
  min-width: 4.5ch;
  color: color-mix(in srgb, var(--color-cursor-text-bright, #f4f6fb) 58%, transparent);
  flex: none;
  justify-content: center;
  align-items: baseline;
  font-size: 11px;
  display: inline-flex;
}

.studio-chat-audio-time.is-elapsed {
  text-align: left;
  justify-content: flex-start;
}

.studio-chat-audio-time.is-remain {
  text-align: right;
  justify-content: flex-end;
}

.studio-chat-audio-error {
  letter-spacing: .01em;
  white-space: nowrap;
  color: color-mix(in srgb, var(--mos-danger, #f87171) 88%, transparent);
  flex: none;
  font-size: 11px;
  font-weight: 600;
}

[data-appearance="light"] .studio-chat-audio-player {
  background: var(--mos-panel);
  border-color: #0f172a14;
}

[data-appearance="light"] .studio-chat-audio-time {
  color: #0f172a8c;
}

[data-appearance="light"] .studio-chat-audio-pane {
  background: var(--mos-panel);
}

/* [project]/src/studio/components/studio-chat-video-player.css [app-client] (css) */
.studio-chat-video-player {
  background: none;
  border: 0;
  width: fit-content;
  max-width: 100%;
  display: inline-block;
  overflow: hidden;
}

.studio-chat-video-player-stage {
  background: #05070c;
  border-radius: 8px;
  width: fit-content;
  max-width: 100%;
  line-height: 0;
  display: block;
  position: relative;
  overflow: hidden;
}

.studio-chat-video-player-video {
  object-fit: contain;
  background: #05070c;
  width: auto;
  max-width: min(100%, 520px);
  height: auto;
  max-height: min(52dvh, 420px);
  display: block;
}

.studio-chat-video-player-surface {
  z-index: 2;
  appearance: none;
  border-radius: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  outline: none;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
}

.studio-chat-video-player-surface:focus-visible {
  outline-offset: -3px;
  outline: 2px solid #ffffffad;
}

.studio-chat-video-player-chrome {
  z-index: 3;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  color: #fff;
  transition: opacity .16s, visibility 0s linear .16s;
  position: absolute;
  inset: 0;
}

.studio-chat-video-player-chrome.is-visible {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.studio-chat-video-player-toggle {
  z-index: 1;
  appearance: none;
  color: #fff;
  filter: drop-shadow(0 2px 5px #000000ad);
  cursor: pointer;
  pointer-events: none;
  background: none;
  border: 0;
  border-radius: 0;
  outline: none;
  place-items: center;
  width: 64px;
  height: 64px;
  margin: auto;
  padding: 0;
  transition: transform .16s, opacity .16s;
  display: grid;
  position: absolute;
  inset: 0;
  transform: scale(.94);
}

.studio-chat-video-player-chrome.is-visible .studio-chat-video-player-toggle {
  pointer-events: auto;
  transform: scale(1);
}

.studio-chat-video-player-toggle:hover {
  transform: scale(1.06);
}

.studio-chat-video-player-toggle:focus-visible {
  outline-offset: 4px;
  border-radius: 8px;
  outline: 2px solid #ffffff9e;
}

.studio-chat-video-player-toggle:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.studio-chat-video-player-toggle svg {
  margin-left: 2px;
  display: block;
}

.studio-chat-video-player-toggle[aria-label="Pause"] svg {
  margin-left: 0;
}

.studio-chat-video-player-bar {
  z-index: 2;
  color: #fff;
  pointer-events: none;
  text-shadow: 0 1px 3px #000000c7;
  background: none;
  border: 0;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 13px 10px 9px;
  display: grid;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.studio-chat-video-player-chrome.is-visible .studio-chat-video-player-bar {
  pointer-events: auto;
}

.studio-chat-video-player-scrub {
  --chat-video-progress: 0%;
  filter: drop-shadow(0 1px 2px #00000094);
  align-items: center;
  width: 100%;
  min-width: 0;
  height: 22px;
  display: flex;
  position: relative;
}

.studio-chat-video-player-scrub:before, .studio-chat-video-player-scrub:after {
  content: "";
  pointer-events: none;
  border-radius: 999px;
  height: 3px;
  position: absolute;
  left: 0;
}

.studio-chat-video-player-scrub:before {
  background: #ffffff47;
  right: 0;
}

.studio-chat-video-player-scrub:after {
  width: var(--chat-video-progress);
  background: #fff;
}

.studio-chat-video-player-scrub input[type="range"] {
  z-index: 1;
  appearance: none;
  cursor: pointer;
  background: none;
  border: 0;
  outline: none;
  width: 100%;
  min-width: 0;
  height: 22px;
  margin: 0;
  position: relative;
}

.studio-chat-video-player-scrub input[type="range"]:focus-visible {
  filter: drop-shadow(0 0 2px #fff);
}

.studio-chat-video-player-scrub input[type="range"]::-webkit-slider-runnable-track {
  background: none;
  height: 3px;
}

.studio-chat-video-player-scrub input[type="range"]::-webkit-slider-thumb {
  appearance: none;
  background: #fff;
  border: 0;
  border-radius: 50%;
  width: 13px;
  height: 13px;
  margin-top: -5px;
  box-shadow: 0 1px 6px #0000006b;
}

.studio-chat-video-player-scrub input[type="range"]::-moz-range-track {
  background: none;
  border: 0;
  height: 3px;
}

.studio-chat-video-player-scrub input[type="range"]::-moz-range-thumb {
  background: #fff;
  border: 0;
  border-radius: 50%;
  width: 13px;
  height: 13px;
  box-shadow: 0 1px 6px #0000006b;
}

.studio-chat-video-player-time {
  color: #fff;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  text-overflow: clip;
  min-width: 3.2ch;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  overflow: hidden;
}

.studio-chat-video-player-time:last-child {
  text-align: right;
}

.studio-chat-video-player-buffering, .studio-chat-video-player-failure {
  z-index: 4;
  pointer-events: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.studio-chat-video-player-buffering {
  background: none;
  overflow: hidden;
}

.studio-chat-video-player-buffering .media-load-frame-wave {
  position: absolute;
  inset: 0;
}

.studio-chat-video-player-failure {
  color: #ffffffd1;
  letter-spacing: .02em;
  text-align: center;
  background: #0000006b;
  padding: 12px;
  font-size: 11px;
  font-weight: 650;
}

.studio-chat-video-player-failure.is-soft {
  background: #0000008c;
  border-radius: 6px;
  min-height: 26px;
  padding: 6px 8px;
  inset: auto 10px 9px;
}

.studio-chat-video-player.is-fill, .studio-chat-video-player.is-fill .studio-chat-video-player-stage {
  width: 100%;
  height: 100%;
  display: block;
}

.studio-chat-video-player.is-fill {
  position: absolute;
  inset: 0;
}

.studio-chat-video-player.is-fill .studio-chat-video-player-stage {
  border-radius: inherit;
}

.studio-chat-video-player.is-fill .studio-chat-video-player-video {
  object-fit: contain;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  position: absolute;
  inset: 0;
}

.studio-chat-video-player.is-fill .studio-chat-video-player-chrome:before {
  content: "";
  pointer-events: none;
  background: linear-gradient(to top, #0000009e 0%, #00000057 38%, #0000001f 68%, #0000 100%);
  height: 72px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.studio-chat-video-player.is-fill:hover .studio-chat-video-player-chrome {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.studio-chat-video-player.is-fill:hover .studio-chat-video-player-toggle, .studio-chat-video-player.is-fill:hover .studio-chat-video-player-bar {
  pointer-events: auto;
}

.studio-chat-video-player.is-fill .studio-chat-video-player-bar {
  text-shadow: none;
}

.studio-chat-video-player.is-fill .studio-chat-video-player-scrub {
  filter: none;
}

.studio-chat-video-player.is-fill .studio-chat-video-player-scrub input[type="range"]::-webkit-slider-thumb {
  box-shadow: none;
}

.studio-chat-video-player.is-fill .studio-chat-video-player-scrub input[type="range"]::-moz-range-thumb {
  box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
  .studio-chat-video-player-chrome, .studio-chat-video-player-toggle {
    transition: none;
  }
}

/* [project]/src/studio/components/studio-chat-actions-sheet.css [app-client] (css) */
.studio-polish.is-studio-mobile .studio-mobile-app-menu-sheet.studio-chat-actions-sheet:not(.is-desktop-popover):not(.studio-centered-sheet), .studio-polish .studio-mobile-app-menu-sheet.studio-chat-actions-sheet:not(.is-desktop-popover):not(.studio-centered-sheet) {
  background: var(--mos-page, var(--mos-panel));
  contain: layout paint;
  flex-direction: column;
  width: auto;
  min-height: 0;
  display: flex;
  position: absolute;
  left: 10px;
  right: 10px;
  overflow: hidden;
  top: var(--studio-chat-actions-top, calc(var(--studio-mobile-top-chrome, calc(44px + env(safe-area-inset-top, 0px))) + 52px)) !important;
  bottom: max(var(--studio-chat-actions-bottom, calc(var(--studio-mobile-bottom-chrome, calc(44px + env(safe-area-inset-bottom, 0px))) + 8px)),
    calc(var(--studio-keyboard-inset, 0px) + 8px)) !important;
  border-radius: 22px !important;
  height: auto !important;
  max-height: none !important;
  transform: none !important;
}

.studio-chat-actions-sheet {
  --studio-chat-actions-hit: 44px;
  --studio-chat-actions-pad: 12px;
}

.studio-mobile-sheet-backdrop:has( + .studio-chat-actions-sheet) {
  touch-action: none;
  overscroll-behavior: none;
}

.studio-chat-actions-sheet > .studio-mobile-sheet-body.studio-chat-actions-frame {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-chat-actions-top {
  height: 52px;
  min-height: 52px;
  padding: 0 var(--studio-chat-actions-pad);
  border-bottom: 1px solid color-mix(in srgb, var(--color-cursor-border, var(--mos-border-soft)) 70%, transparent);
  box-sizing: border-box;
  flex: none;
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-chat-actions-back {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate);
  width: 36px;
  height: 36px;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  border-radius: 999px;
  flex: 0 0 36px;
  justify-content: center;
  align-items: center;
  margin: 0 0 0 -4px;
  padding: 0;
  display: inline-flex;
  position: relative;
}

.studio-chat-actions-back:after {
  content: "";
  position: absolute;
  inset: -6px;
}

.studio-chat-actions-back svg {
  width: 16px;
  height: 16px;
}

.studio-chat-actions-title {
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: var(--studio-type-pane, 16px);
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: auto;
  margin: 0;
  font-weight: 650;
  line-height: 1.2;
  overflow: hidden;
}

.studio-chat-actions-scroll {
  min-height: 0;
  padding: 12px var(--studio-chat-actions-pad) 20px;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-width: none;
  box-sizing: border-box;
  flex-direction: column;
  flex: auto;
  gap: 16px;
  display: flex;
  overflow: hidden auto;
}

.studio-chat-actions-scroll::-webkit-scrollbar {
  display: none;
}

.studio-chat-actions-scroll > * {
  flex: none;
  min-width: 0;
  max-width: 100%;
}

.studio-chat-actions-scroll.is-flush {
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.studio-chat-actions-scroll.is-flush > * {
  flex: auto;
  min-height: 0;
}

.studio-chat-actions-footer {
  padding: 10px var(--studio-chat-actions-pad) 12px;
  border-top: 1px solid color-mix(in srgb, var(--color-cursor-border, var(--mos-border-soft)) 70%, transparent);
  background: var(--mos-page, var(--mos-panel));
  flex: none;
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-chat-actions-footer > * {
  flex: 1 1 0;
  min-width: 0;
}

.studio-chat-actions-footer .cursor-settings-action {
  width: 100%;
  font-size: var(--studio-type-title, 14px);
}

.studio-chat-actions-hero {
  align-items: center;
  gap: 12px;
  padding: 4px 2px 0;
  display: flex;
}

.studio-chat-actions-hero-avatar {
  flex: none;
  display: inline-flex;
}

.studio-chat-actions-hero-text {
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.studio-chat-actions-hero-text strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: var(--studio-type-page, 20px);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
}

.studio-chat-actions-hero-text span {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: var(--studio-type-body, 13px);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 550;
  overflow: hidden;
}

.studio-chat-actions-hero-text .studio-chat-actions-hero-meta {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-chat-actions-group {
  flex-direction: column;
  gap: 6px;
  margin: 0;
  display: flex;
}

.studio-chat-actions-group-label {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: var(--studio-type-meta, 12px);
  letter-spacing: .02em;
  margin: 0;
  padding: 0 6px;
  font-weight: 650;
}

.studio-chat-actions-card {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  background: var(--mos-plate);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright) 7%, transparent);
  border-radius: 18px;
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.studio-chat-actions-row {
  border: 0;
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  width: 100%;
  min-height: 56px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  text-align: left;
  cursor: pointer;
  box-sizing: border-box;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
  background: none;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 8px 12px;
  display: flex;
}

.studio-chat-actions-row:last-child {
  border-bottom: 0;
}

.studio-chat-actions-row:active:not(:disabled) {
  background: var(--mos-hover, color-mix(in srgb, var(--mos-text) 6%, transparent));
}

.studio-chat-actions-row:disabled {
  opacity: .45;
  cursor: default;
}

.studio-chat-actions-row-icon {
  background: color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  width: 32px;
  height: 32px;
  color: var(--cursor-accent, var(--color-cursor-accent));
  border-radius: 10px;
  flex: 0 0 32px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-chat-actions-row-icon svg {
  width: 16px;
  height: 16px;
}

.studio-chat-actions-row-text {
  flex-direction: column;
  flex: auto;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.studio-chat-actions-row-label {
  font-size: var(--studio-type-title, 14px);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 600;
  line-height: 1.25;
  overflow: hidden;
}

.studio-chat-actions-row-hint {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: var(--studio-type-meta, 12px);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 500;
  line-height: 1.3;
  overflow: hidden;
}

.studio-chat-actions-row-value {
  max-width: 42%;
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: var(--studio-type-body, 13px);
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 0 auto;
  font-weight: 550;
  overflow: hidden;
}

.studio-chat-actions-row-badge {
  background: var(--cursor-accent, var(--mos-accent));
  min-width: 22px;
  height: 22px;
  color: var(--cursor-on-accent, #fff);
  font-size: var(--studio-type-meta, 12px);
  box-sizing: border-box;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0 7px;
  font-weight: 700;
  display: inline-flex;
}

.studio-chat-actions-row-chevron {
  width: 16px;
  height: 16px;
  color: var(--mos-text-muted, var(--color-cursor-muted));
  flex: none;
}

.studio-chat-actions-row.is-danger, .studio-chat-actions-row.is-danger .studio-chat-actions-row-icon {
  color: var(--cursor-danger, var(--color-cursor-danger));
}

.studio-chat-actions-row.is-danger .studio-chat-actions-row-icon {
  background: color-mix(in srgb, var(--cursor-danger, #ef4444) 14%, transparent);
}

.studio-chat-actions-scroll .studio-chrome-settings-card, .studio-chat-actions-scroll .studio-chrome-settings-card-body {
  height: auto;
  min-height: 0;
  overflow: visible;
}

.studio-chat-actions-scroll .studio-chrome-settings-row {
  min-height: 52px;
  font-size: var(--studio-type-title, 14px);
  padding: 8px 12px;
}

.studio-chat-actions-scroll .studio-chrome-field {
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px 12px;
  display: flex;
}

.studio-chat-actions-scroll .studio-chrome-field + .studio-chrome-field {
  padding-top: 0;
}

.studio-chat-actions-scroll .studio-chrome-field-label {
  font-size: var(--studio-type-meta, 12px);
}

.studio-chat-actions-scroll :is(input:not([type="checkbox"]):not([type="radio"]), .studio-chrome-input) {
  min-height: var(--studio-chat-actions-hit);
  font-size: var(--studio-type-title, 14px);
  box-sizing: border-box;
  border-radius: 12px;
}

.studio-chat-actions-scroll :is(textarea, .studio-chrome-textarea) {
  min-height: 96px;
  font-size: var(--studio-type-title, 14px);
  box-sizing: border-box;
  border-radius: 12px;
}

.studio-chat-actions-scroll .cursor-select-menu {
  width: 100%;
  min-width: 0;
}

.studio-chat-actions-scroll .cursor-select-menu .cursor-select-trigger {
  width: 100%;
  min-height: var(--studio-chat-actions-hit);
  font-size: var(--studio-type-title, 14px);
  border-radius: 12px;
  padding: 0 12px;
}

.studio-chat-actions-scroll .cursor-select-arrow {
  width: 16px;
  height: 16px;
  margin-left: auto;
}

.studio-chat-actions-scroll .studio-chrome-switch {
  flex: none;
}

.studio-chat-actions-scroll .studio-admin-section-head {
  height: auto;
  min-height: var(--studio-chat-actions-hit);
}

.studio-add-menu.studio-action-menu.is-edge.studio-sheet-picker {
  min-width: min(260px, 100vw - 56px) !important;
  max-width: min(360px, 100vw - 24px) !important;
}

.studio-action-menu.is-edge.studio-sheet-picker .studio-action-menu-scroll {
  max-height: min(calc(52px + (10 * 48px) + (9 * 4px) + 8px),
    calc(100dvh - var(--studio-mobile-top-chrome, 44px) - var(--studio-mobile-bottom-chrome, 44px) - 24px));
  padding: 52px 8px 8px;
}

.studio-action-menu.is-edge.studio-sheet-picker .cursor-tab-context-item {
  border-radius: 12px;
  min-height: 48px;
  padding: 8px 28px 8px 10px;
}

.studio-action-menu.is-edge.studio-sheet-picker .cursor-tab-context-item-label {
  font-size: var(--studio-type-title, 14px);
}

.studio-action-menu.is-edge.studio-sheet-picker .studio-action-menu-title-row {
  height: 44px;
}

.studio-action-menu.is-edge.studio-sheet-picker .studio-action-menu-close {
  flex-basis: 36px;
  width: 36px;
  height: 36px;
  position: relative;
}

.studio-action-menu.is-edge.studio-sheet-picker .studio-action-menu-close:after {
  content: "";
  position: absolute;
  inset: -4px;
}

.studio-chat-actions-row.is-static {
  cursor: default;
}

.studio-chat-actions-peer .studio-dm-peer-stack {
  gap: 10px;
}

.studio-chat-actions-peer .studio-dm-peer-composer textarea {
  min-height: 88px;
}

.studio-chat-actions-peer .studio-group-info-identity {
  display: none;
}

.studio-chat-actions-peer.is-flush > .studio-group-info {
  height: auto;
}

.studio-chat-actions-peer :is(.studio-group-info-list, .studio-group-info-settings, .studio-people-pick-box-hits) {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
}

.studio-chat-actions-peer .studio-group-info-settings {
  padding: 12px var(--studio-chat-actions-pad) 20px;
  gap: 12px;
}

.studio-chat-actions-scroll .studio-chrome-icon-btn {
  width: 36px;
  height: 36px;
  position: relative;
}

.studio-chat-actions-peer .studio-people-pick-item {
  min-height: 52px;
}

.studio-chat-actions-peer .studio-people-pick-action {
  min-height: 36px;
  padding: 0 12px;
}

.studio-chat-actions-peer .studio-people-search-block {
  padding: 8px var(--studio-chat-actions-pad) 4px;
}

.studio-chat-actions-peer .studio-dm-assign-row {
  min-height: 48px;
}

.studio-chat-actions-peer .studio-dm-peer-about-actions {
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  display: grid;
}

.studio-chat-actions-sheet .cursor-settings-action {
  min-height: var(--studio-chat-actions-hit);
  box-sizing: border-box;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 8px;
  display: inline-flex;
}

.studio-chat-actions-sheet .cursor-settings-action:disabled {
  opacity: .45;
  cursor: default;
}

.studio-chat-actions-sheet .cursor-settings-action > svg {
  flex: none;
  width: 16px;
  height: 16px;
}

.studio-chat-actions-peer .studio-dm-peer-composer .cursor-settings-action, .studio-chat-actions-peer .studio-dm-peer-about-actions .cursor-settings-action {
  width: 100%;
}

.studio-chat-actions-peer .studio-people-search-block > .cursor-panel-search {
  border: none;
  width: auto;
}

.studio-chat-actions-scroll .studio-chrome-icon-btn:after {
  content: "";
  position: absolute;
  inset: -4px -2px;
}

.studio-chat-actions-scroll.is-settings-page > .studio-chrome-settings-card > .studio-chrome-settings-card-head {
  display: none;
}

/* [project]/src/studio/components/studio-confirm-overlay.css [app-client] (css) */
.studio-payment-celebration {
  z-index: 200010;
  background: color-mix(in srgb, var(--mos-page, #0b0b0f) 94%, transparent);
  -webkit-backdrop-filter: blur(14px);
  place-items: center;
  padding: 24px;
  display: grid;
  position: fixed;
  inset: 0;
}

.studio-payment-celebration-inner {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  width: min(100%, 360px);
  display: flex;
}

.studio-payment-celebration-check {
  width: 76px;
  height: 76px;
  color: var(--mos-success, #22c55e);
  filter: drop-shadow(0 8px 24px color-mix(in srgb, var(--mos-success, #22c55e) 35%, transparent));
}

.studio-payment-celebration-spin {
  width: 48px;
  height: 48px;
  color: var(--cursor-accent);
  animation: .9s linear infinite studio-payment-celebration-spin;
}

@keyframes studio-payment-celebration-spin {
  to {
    transform: rotate(360deg);
  }
}

.studio-payment-celebration-title {
  color: var(--color-cursor-text-bright, var(--mos-text));
  letter-spacing: -.02em;
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}

.studio-payment-celebration-copy {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
}

.studio-payment-celebration-actions {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
  display: flex;
}

.studio-payment-celebration-btn {
  appearance: none;
  background: var(--cursor-accent);
  min-height: 40px;
  color: var(--color-cursor-text-bright, #fff);
  font: inherit;
  cursor: pointer;
  border: 1px solid #0000;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 0 18px;
  font-size: 13px;
  font-weight: 650;
  display: inline-flex;
}

.studio-payment-celebration-btn:hover:not(:disabled) {
  filter: brightness(1.05);
}

.studio-payment-celebration-btn:focus-visible {
  outline: 2px solid var(--cursor-accent);
  outline-offset: 2px;
}

.studio-payment-celebration-btn:disabled {
  opacity: .5;
  cursor: default;
  filter: none;
}

.studio-payment-celebration-btn.is-secondary {
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate-strong, var(--mos-surface));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-payment-celebration-btn.is-danger {
  background: var(--mos-danger, #dc2626);
  color: #fff;
}

.studio-confirm-overlay-icon {
  width: 56px;
  height: 56px;
  color: var(--cursor-accent);
}

.studio-confirm-overlay-icon.is-danger {
  color: var(--mos-danger, #dc2626);
}

.studio-payment-celebration-actions .studio-payment-celebration-btn {
  min-width: 120px;
}

/* [project]/src/studio/components/studio-create-library.css [app-client] (css) */
.studio-create-library {
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-bg, #05080f)));
  min-width: 0;
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text);
  flex-direction: column;
  flex: 1 1 0;
  display: flex;
  position: relative;
}

.studio-create-library-scroll {
  touch-action: pan-y;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  min-height: 0;
  padding: 10px 12px calc(var(--studio-composer-min-height, 96px) + 88px);
  flex-direction: column;
  flex: 1 1 0;
  display: flex;
  overflow: hidden auto;
}

.studio-create-library.is-previewing .studio-create-library-scroll {
  display: none;
}

.studio-create-library-empty {
  box-sizing: border-box;
  width: 100%;
  min-height: 100%;
  color: color-mix(in srgb, var(--color-cursor-text, #e8e8e8) 58%, transparent);
  text-align: center;
  flex-direction: column;
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 24px 16px;
  display: flex;
}

.studio-create-library-empty h3 {
  letter-spacing: -.01em;
  color: var(--color-cursor-text-bright, var(--color-cursor-text, #f2f2f2));
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.studio-create-library-empty p {
  max-width: 30ch;
  color: color-mix(in srgb, var(--color-cursor-text, #e8e8e8) 72%, transparent);
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
}

.studio-create-masonry {
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  display: flex;
}

.studio-create-masonry-col {
  flex-direction: column;
  flex: 1 1 0;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.studio-create-masonry-item {
  width: 100%;
}

@media (max-width: 899px) {
  .studio-create-masonry-item, .studio-gen-tile {
    content-visibility: auto;
    contain-intrinsic-size: auto 180px;
  }
}

.studio-gen-tile {
  background: var(--studio-grid-tile-bg, color-mix(in srgb, var(--color-cursor-fg, #fff) 5%, transparent));
  text-align: left;
  width: 100%;
  color: inherit;
  cursor: default;
  -webkit-touch-callout: none;
  border: 1px solid #0000;
  border-radius: 10px;
  padding: 0;
  display: block;
  position: relative;
  overflow: hidden;
  animation: none !important;
  transform: none !important;
}

.studio-gen-tile.is-selected {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 70%, transparent);
}

.studio-gen-tile-media {
  background: color-mix(in srgb, var(--mos-bg, #000) 35%, transparent);
  width: 100%;
  min-height: 96px;
  display: block;
  position: relative;
}

.studio-gen-tile-media img, .studio-gen-tile-media video {
  vertical-align: top;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  width: 100%;
  height: auto;
  display: block;
}

.studio-gen-tile-img-wrap {
  width: 100%;
  display: block;
  position: relative;
}

.studio-gen-tile-img-wrap:not(.is-ready) {
  position: absolute;
  inset: 0;
}

.studio-gen-tile-img-wrap img, .studio-gen-tile-img-wrap video {
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
  width: 100%;
  height: auto;
  display: block;
}

.studio-gen-tile-img-wrap:not(.is-ready) img, .studio-gen-tile-img-wrap:not(.is-ready) video {
  object-fit: cover;
  opacity: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.studio-gen-tile-video {
  background: color-mix(in srgb, var(--mos-bg, #000) 40%, transparent);
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-gen-tile-video img, .studio-gen-tile-video video {
  object-fit: cover;
  vertical-align: top;
  pointer-events: none;
  -webkit-user-drag: none;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-gen-tile-video video.is-under-poster {
  opacity: 0;
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.studio-gen-tile-video.is-playing video {
  opacity: 1;
  pointer-events: none;
}

.studio-gen-tile-play-wrap {
  z-index: 4;
  pointer-events: none;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.studio-gen-tile-play {
  z-index: auto;
  cursor: pointer;
  touch-action: manipulation;
  pointer-events: auto;
  color: #fff;
  background: var(--color-cursor-border-soft);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  width: 44px;
  height: 44px;
  box-shadow: 0 2px 12px var(--color-cursor-border-soft);
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: relative;
  top: auto;
  left: auto;
  animation: none !important;
  transform: none !important;
}

.studio-gen-tile-play svg {
  fill: currentColor;
  margin-left: 2px;
  color: #fff !important;
}

.studio-gen-tile-play:hover {
  background: var(--color-cursor-border-soft);
  color: #fff;
  transform: none !important;
}

.studio-gen-tile-play:hover svg {
  color: #fff !important;
}

.studio-gen-tile-play:active, .studio-gen-tile-play.is-press-pulse, .studio-gen-tile-play.is-pressed {
  animation: none !important;
  transform: none !important;
}

[data-appearance="light"] .studio-gen-tile-play, [data-appearance="light"] .studio-gen-tile-play:hover {
  background: var(--color-cursor-border-soft);
  color: #fff;
}

[data-appearance="light"] .studio-gen-tile-play svg, [data-appearance="light"] .studio-gen-tile-play:hover svg {
  color: #fff !important;
}

.studio-gen-tile-img-skeleton {
  z-index: 1;
  pointer-events: none;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0;
}

.studio-gen-tile-media.is-square, .studio-gen-tile-media.is-audio, .studio-gen-tile.is-audio-ready .studio-gen-tile-media {
  aspect-ratio: 1;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  display: flex;
  overflow: hidden;
}

.studio-gen-tile.is-busy .studio-gen-tile-media:not(.is-audio):not(.is-audio-player), .studio-gen-tile.is-failed .studio-gen-tile-media:not(.is-audio):not(.is-audio-player) {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 96px;
  display: flex;
  overflow: hidden;
}

.studio-gen-tile-progress {
  z-index: 1;
  box-sizing: border-box;
  pointer-events: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  min-height: 96px;
  padding: 20px 16px;
  display: flex;
  position: relative;
}

.studio-gen-tile-progress-label {
  z-index: 1;
  letter-spacing: .02em;
  text-transform: lowercase;
  color: color-mix(in srgb, var(--color-cursor-fg, #e8e8e8) 72%, transparent);
  flex: none;
  font-size: 12px;
  font-weight: 600;
  position: relative;
}

.studio-gen-tile-progress .studio-gen-tile-ghost-loader, .studio-gen-tile-progress .media-load-frame-wave {
  width: var(--logo-loader-ring, 56px);
  height: var(--logo-loader-ring, 56px);
  flex: none;
  place-items: center;
  max-width: none;
  display: grid;
  position: relative !important;
  inset: auto !important;
}

.studio-gen-tile-media.is-audio-player {
  aspect-ratio: 1;
  background: none;
  width: 100%;
  height: auto;
  min-height: 0;
  padding: 0;
  display: block;
  position: relative;
  overflow: hidden;
}

[data-appearance="light"] .studio-gen-tile-media.is-audio-player {
  background: none;
}

.studio-gen-tile-audio {
  box-sizing: border-box;
  pointer-events: none;
  align-items: stretch;
  width: auto;
  min-width: 0;
  min-height: 0;
  padding: 8px 8px 10px;
  display: flex;
  position: absolute;
  inset: 0;
}

.studio-gen-tile-audio .studio-orb-play, .studio-gen-tile-audio .studio-chat-audio-wave, .studio-gen-tile-audio button {
  pointer-events: auto;
}

.studio-gen-tile-audio.is-loading {
  justify-content: center;
  align-items: center;
}

.studio-gen-tile-audio.is-loading .studio-chat-audio-player.is-loading {
  height: auto;
  min-height: 0;
  padding: 12px 8px;
}

.studio-gen-tile-audio.is-loading .studio-chat-audio-load-body {
  gap: 12px;
}

.studio-gen-tile-audio .studio-chat-audio-player, .studio-gen-tile-audio .studio-chat-audio-player.is-pane, .studio-gen-tile-audio .studio-chat-audio-player.is-pane.is-compact, .studio-gen-tile-audio .studio-chat-audio-pane, [data-appearance="light"] .studio-gen-tile-audio .studio-chat-audio-player, [data-appearance="light"] .studio-gen-tile-audio .studio-chat-audio-player.is-pane, [data-appearance="light"] .studio-gen-tile-audio .studio-chat-audio-pane {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 100%;
  min-height: 0;
  margin: 0;
  min-width: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.studio-gen-tile-audio .studio-chat-audio-pane {
  place-items: stretch stretch;
  display: flex;
}

.studio-gen-tile-audio .studio-chat-audio-player.is-pane, .studio-gen-tile-audio .studio-chat-audio-player.is-pane.is-compact {
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  gap: 0;
  padding: 4px 0 2px;
  display: flex;
}

.studio-gen-tile-audio .studio-chat-audio-orb-hero {
  flex: auto;
  place-items: center;
  min-height: 0;
  padding: 0;
  display: grid;
  margin: 0 !important;
}

.studio-gen-tile-audio .studio-chat-audio-row {
  flex: none;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-width: 0;
}

.studio-gen-tile-audio .studio-chat-audio-row.is-wave-fill {
  flex: none;
  justify-content: flex-start;
  align-items: center;
  height: 40px;
  min-height: 40px;
  display: flex;
}

.studio-gen-tile-audio .studio-chat-audio-wave {
  flex: auto;
  width: auto;
  min-width: 0;
  min-height: 40px;
  height: 40px !important;
}

.studio-gen-tile-audio .studio-chat-audio-player.is-pane .studio-chat-audio-wave {
  height: 40px !important;
}

.studio-gen-tile-audio .studio-chat-audio-waveform {
  width: 100%;
  min-width: 0;
  display: block;
  height: 100% !important;
}

.studio-gen-tile-audio .studio-chat-audio-waveform canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

.studio-gen-tile-audio .studio-chat-audio-time {
  width: auto;
  min-width: 3.6ch;
  text-align: inherit;
  justify-content: inherit;
  flex: none;
  font-size: 11px;
}

.studio-gen-tile-audio .studio-orb-play, .studio-gen-tile-audio .studio-orb-play.is-md, .studio-gen-tile-audio .studio-orb-play.is-lg {
  aspect-ratio: 1;
  filter: none;
  background: none;
  border-radius: 999px;
  flex: 0 0 104px;
  place-self: center;
  overflow: hidden;
  width: 104px !important;
  min-width: 104px !important;
  max-width: 104px !important;
  height: 104px !important;
  min-height: 104px !important;
  max-height: 104px !important;
}

@media (max-width: 899px) {
  .studio-gen-tile-audio .studio-orb-play, .studio-gen-tile-audio .studio-orb-play.is-md, .studio-gen-tile-audio .studio-orb-play.is-lg {
    flex: 0 0 56px;
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
  }
}

.studio-gen-tile-audio .studio-orb-frame, .studio-gen-tile-audio .studio-orb-well, .studio-gen-tile-audio .studio-orb-canvas, .studio-gen-tile-audio .studio-orb-fallback {
  overflow: hidden;
  border-radius: 999px !important;
}

.studio-gen-tile-audio .studio-orb-well:has(.studio-orb-canvas) .studio-orb-fallback {
  display: none;
}

.studio-gen-tile-spinner {
  opacity: .55;
  color: var(--color-cursor-muted, #8b8b8b);
}

.studio-gen-tile-stop {
  z-index: 5;
  background: var(--color-cursor-border-soft);
  color: #fff;
  cursor: pointer;
  pointer-events: auto;
  border: 1px solid #ffffff47;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  margin: 0;
  display: inline-flex;
  position: absolute;
  inset: 8px 8px auto auto;
  transform: none !important;
}

.studio-gen-tile-stop.is-static {
  pointer-events: none;
  cursor: default;
  opacity: .92;
  width: 44px;
  height: 44px;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%) !important;
}

.studio-gen-tile-stop:hover:not(.is-static):not(:disabled) {
  background: var(--color-cursor-border-soft);
}

.studio-gen-tile-stop:disabled {
  opacity: .7;
  cursor: default;
}

.studio-gen-tile.is-failed .studio-gen-tile-media {
  background: color-mix(in srgb, var(--mos-bg, #000) 28%, transparent);
}

.studio-gen-tile-audio-details {
  z-index: 3;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--color-cursor-border-soft);
  color: #fff;
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  display: inline-flex;
  position: absolute;
  top: 8px;
  right: 8px;
}

[data-appearance="light"] .studio-gen-tile-audio-details {
  border-color: var(--color-cursor-border-soft);
  color: #1a1a1a;
  box-shadow: 0 1px 3px var(--color-cursor-border-soft);
  background: #ebebeb;
}

.studio-gen-tile-badge {
  z-index: 2;
  letter-spacing: .02em;
  background: var(--color-cursor-border-soft);
  color: #fff;
  text-transform: capitalize;
  pointer-events: none;
  border-radius: 6px;
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 600;
  position: absolute;
  top: 6px;
  left: 6px;
}

.studio-gen-tile-badge.is-busy {
  background: color-mix(in srgb, var(--cursor-accent, #5b8cff) 70%, #000);
}

.studio-gen-tile-badge.is-failed {
  background: #b73a3e;
}

.studio-gen-tile-overlay {
  z-index: 3;
  background: linear-gradient(to top,
    var(--color-cursor-border-soft),
    transparent 55%);
  opacity: 0;
  pointer-events: none;
  justify-content: center;
  align-items: flex-end;
  gap: 6px;
  padding: 10px;
  transition: opacity .12s;
  display: flex;
  position: absolute;
  inset: 0;
}

.studio-gen-tile.is-overlay-open .studio-gen-tile-overlay, .studio-gen-tile:focus-visible .studio-gen-tile-overlay {
  opacity: 1;
  pointer-events: none;
}

.studio-gen-tile.is-overlay-open .studio-gen-tile-action, .studio-gen-tile:focus-visible .studio-gen-tile-action {
  pointer-events: auto;
}

@media (hover: hover) and (pointer: fine) {
  .studio-gen-tile:hover .studio-gen-tile-overlay {
    opacity: 1;
    pointer-events: none;
  }

  .studio-gen-tile:hover .studio-gen-tile-action {
    pointer-events: auto;
  }
}

.studio-gen-tile-action {
  background: var(--color-cursor-border-soft);
  color: #fff;
  cursor: pointer;
  touch-action: manipulation;
  border: 1px solid #ffffff47;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  transition: background .12s, border-color .12s;
  display: inline-flex;
  animation: none !important;
  transform: none !important;
}

.studio-gen-tile-action:hover {
  background: var(--color-cursor-border-soft);
}

[data-appearance="light"] .studio-gen-tile-action {
  border-color: var(--color-cursor-border-soft);
  color: #1a1a1a;
  box-shadow: 0 1px 4px var(--color-cursor-border-soft);
  background: #f0f0f0;
}

[data-appearance="light"] .studio-gen-tile-action:hover {
  background: var(--mos-plate);
}

.studio-create-library-more-sentinel {
  pointer-events: none;
  width: 100%;
  height: 1px;
}

.studio-create-library-more {
  justify-content: center;
  padding: 12px 0 4px;
  display: flex;
}

.studio-gen-detail {
  background: var(--mos-plate, var(--color-cursor-panel));
  border-left: 1px solid var(--color-cursor-border-soft);
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text);
  flex-direction: column;
  display: flex;
  container: gen-detail / inline-size;
}

.studio-gen-detail .cursor-panel-head, .studio-gen-detail-head {
  box-sizing: border-box;
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft);
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 4px 0 10px;
  display: flex;
}

.studio-gen-detail.is-mobile-sheet .studio-gen-detail-head {
  padding: 0 var(--studio-sheet-inline-pad, 12px);
}

.studio-gen-detail .cursor-panel-head-title, .studio-gen-detail-head h2 {
  min-width: 0;
  color: inherit;
  flex: 1;
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.25;
}

.studio-gen-detail .studio-gen-detail-close, .studio-gen-detail-head .studio-gen-detail-close {
  border-radius: 999px;
  flex-shrink: 0;
  justify-content: center;
  align-self: center;
  gap: 0;
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  padding: 0;
}

.studio-gen-detail-head .studio-gen-detail-close svg {
  width: 14px;
  height: 14px;
}

.studio-gen-detail-body {
  flex-direction: column;
  flex: 1;
  gap: 16px;
  min-height: 0;
  padding: 14px;
  display: flex;
  overflow: auto;
}

.studio-gen-detail.is-mobile-sheet .studio-gen-detail-body {
  padding: 12px var(--studio-sheet-inline-pad, 12px);
}

.studio-gen-detail-status-row {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-gen-detail-chip {
  letter-spacing: .01em;
  text-transform: capitalize;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page);
  color: var(--color-cursor-text);
  border-radius: 999px;
  align-items: center;
  padding: 3px 9px;
  font-size: 11px;
  font-weight: 560;
  display: inline-flex;
}

.studio-gen-detail-chip.is-done {
  border-color: color-mix(in srgb, var(--mos-success, #34d399) 40%, transparent);
  background: color-mix(in srgb, var(--mos-success, #059669) 8%, var(--mos-plate));
  color: var(--mos-success, #6ee7b7);
}

.studio-gen-detail-chip.is-failed, .studio-gen-detail-chip.is-error {
  border-color: color-mix(in srgb, var(--mos-danger, #f87171) 40%, transparent);
  background: color-mix(in srgb, var(--mos-danger, #dc2626) 8%, var(--mos-plate));
  color: var(--mos-danger, #fca5a5);
}

.studio-gen-detail-chip.is-running, .studio-gen-detail-chip.is-queued, .studio-gen-detail-chip.is-pending {
  background: color-mix(in srgb, #2563eb 8%, var(--mos-plate));
  color: #93c5fd;
  border-color: #60a5fa66;
}

.studio-gen-detail-section {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page);
  border-radius: 12px;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  display: flex;
}

.studio-gen-detail-label {
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 650;
  display: flex;
}

.studio-gen-detail-prompt {
  white-space: pre-wrap;
  word-break: break-word;
  overscroll-behavior: contain;
  max-height: 100cqw;
  color: var(--color-cursor-text);
  scrollbar-width: thin;
  margin: 0;
  padding-right: 2px;
  font-size: 13px;
  line-height: 1.5;
  overflow: hidden auto;
}

.studio-gen-detail-refs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  display: grid;
}

.studio-gen-detail-ref {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate);
  min-width: 0;
  color: inherit;
  text-align: left;
  cursor: pointer;
  border-radius: 10px;
  align-items: center;
  gap: 8px;
  padding: 6px;
  transition: background-color .18s, border-color .18s;
  display: flex;
}

.studio-gen-detail-ref:disabled {
  cursor: default;
  opacity: 1;
}

.studio-gen-detail-ref:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent);
  background: var(--mos-hover);
}

.studio-gen-detail-ref:disabled:hover {
  border-color: var(--color-cursor-border-soft);
  background: var(--mos-plate);
}

.studio-gen-detail-ref-thumb {
  background: var(--mos-plate-strong);
  width: 40px;
  height: 40px;
  color: var(--color-cursor-muted);
  border-radius: 8px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.studio-gen-detail-ref-thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-gen-detail-ref-meta {
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.studio-gen-detail-ref-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  color: inherit;
  font-size: 12px;
  font-weight: 560;
  line-height: 1.25;
  overflow: hidden;
}

.studio-gen-detail-ref-kind {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  font-size: 10px;
  font-weight: 550;
}

.studio-gen-detail-info-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  display: grid;
}

.studio-gen-detail-info-card {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate);
  border-radius: 10px;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  padding: 10px;
  display: flex;
}

.studio-gen-detail-info-label {
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  font-size: 10px;
  font-weight: 650;
}

.studio-gen-detail-info-value {
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--color-cursor-text);
  font-size: 12.5px;
  font-weight: 560;
  line-height: 1.3;
  overflow: hidden;
}

.studio-gen-detail-error {
  color: var(--mos-danger, #fecaca);
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 16%, transparent);
  border-radius: 8px;
  margin: 8px 0 0;
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-gen-detail-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: auto;
  padding-top: 4px;
  display: grid;
}

.studio-gen-detail-actions button, .studio-gen-detail-actions .studio-chrome-btn {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate);
  width: 100%;
  min-height: 40px;
  color: var(--color-cursor-text);
  cursor: pointer;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  gap: 7px;
  padding: 10px;
  font-size: 12px;
  font-weight: 560;
  line-height: 1;
  transition: background-color .18s, border-color .18s;
  display: inline-flex;
}

.studio-gen-detail-actions button.is-primary, .studio-gen-detail-actions .studio-chrome-btn.is-primary {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 45%, transparent);
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, transparent);
}

.studio-gen-detail-actions button:hover {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 50%, transparent);
  background: var(--mos-hover);
}

.studio-gen-detail-actions button.is-primary:hover {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 22%, var(--mos-plate));
}

.studio-gen-detail-actions button.is-danger {
  color: #ff8d8d;
}

.studio-gen-detail-copy {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate);
  min-height: 26px;
  color: var(--color-cursor-text);
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  transition: background-color .18s, border-color .18s;
  display: inline-flex;
}

.studio-gen-detail-copy:hover {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent);
  background: var(--mos-hover);
}

.studio-gen-lightbox {
  z-index: 20;
  background: color-mix(in srgb, var(--color-cursor-text) 88%, transparent);
  flex-direction: column;
  min-height: 0;
  padding: 0;
  display: flex;
  position: absolute;
  inset: 0;
}

.studio-create-library.is-previewing .studio-gen-lightbox {
  flex: 1 1 0;
  width: 100%;
  height: auto;
  min-height: 0;
  position: relative;
  inset: auto;
}

[data-appearance="light"] .studio-gen-lightbox {
  background: var(--mos-page);
}

.studio-gen-lightbox.studio-asset-preview {
  height: 100%;
}

.studio-gen-lightbox .desk-image-viewer, .studio-gen-lightbox .desk-media-player--studio-preview {
  background: none;
  flex: 1;
  height: 100%;
  min-height: 0;
}

.studio-gen-lightbox .desk-image-viewer-toolbar, .studio-gen-lightbox .desk-media-player--studio-preview .desk-image-viewer-toolbar {
  z-index: 1;
  box-sizing: border-box;
  width: 100%;
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  flex-shrink: 0;
  position: static;
}

.studio-gen-lightbox .desk-image-viewer-name {
  display: none;
}

[data-appearance="light"] .studio-gen-lightbox .desk-image-viewer, [data-appearance="light"] .studio-gen-lightbox .desk-media-player--studio-preview, [data-appearance="light"] .studio-gen-lightbox .desk-image-viewer-toolbar, [data-appearance="light"] .studio-gen-lightbox .desk-media-player--studio-preview .desk-image-viewer-toolbar, [data-appearance="light"] .studio-gen-lightbox .desk-image-viewer-stage, [data-appearance="light"] .studio-gen-lightbox .desk-media-player--studio-preview .desk-media-player-stage, [data-appearance="light"] .studio-gen-lightbox .desk-media-player--studio-preview .desk-image-viewer-stage {
  background: var(--mos-page) !important;
}

.studio-gen-lightbox .desk-image-viewer-stage, .studio-gen-lightbox .desk-media-player--studio-preview .desk-media-player-stage, .studio-gen-lightbox .desk-media-player--studio-preview .desk-image-viewer-stage {
  flex: 1;
  min-height: 0;
}

.studio-gen-lightbox-loading {
  color: var(--color-cursor-muted, #8b8b8b);
  flex: 1;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-gen-lightbox-audio {
  box-sizing: border-box;
  flex: 1 1 0;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 0;
  padding: 24px 28px 32px;
  display: flex;
}

.studio-gen-lightbox-audio .studio-chat-audio-player, .studio-gen-lightbox-audio .studio-chat-audio-player.is-pane, .studio-gen-lightbox-audio .studio-chat-audio-player.is-pane.is-compact, .studio-gen-lightbox-audio .studio-chat-audio-pane, [data-appearance="light"] .studio-gen-lightbox-audio .studio-chat-audio-player, [data-appearance="light"] .studio-gen-lightbox-audio .studio-chat-audio-player.is-pane, [data-appearance="light"] .studio-gen-lightbox-audio .studio-chat-audio-pane {
  box-sizing: border-box;
  width: min(100%, 420px);
  max-width: 420px;
  height: auto;
  min-height: 0;
  margin: 0;
  min-width: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

.studio-gen-lightbox-audio .studio-chat-audio-pane {
  place-items: stretch stretch;
  display: flex;
  background: none !important;
  padding: 0 !important;
}

.studio-gen-lightbox-audio .studio-chat-audio-player.is-pane, .studio-gen-lightbox-audio .studio-chat-audio-player.is-pane.is-compact {
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  gap: 12px;
  padding: 0;
  display: flex;
}

.studio-gen-lightbox-audio .studio-chat-audio-orb-hero {
  flex: none;
  place-items: center;
  padding: 0;
  display: grid;
  margin: 0 !important;
}

.studio-gen-lightbox-audio .studio-chat-audio-row.is-wave-fill {
  flex: none;
  align-items: stretch;
  width: 100%;
  height: 64px;
  min-height: 64px;
}

.studio-gen-lightbox-audio .studio-chat-audio-wave {
  width: 100%;
  min-width: 0;
  min-height: 64px;
  height: 64px !important;
}

.studio-gen-lightbox-audio .studio-chat-audio-player.is-pane .studio-chat-audio-wave {
  height: 64px !important;
}

.studio-gen-lightbox-audio .studio-chat-audio-waveform {
  width: 100%;
  height: 100% !important;
}

.studio-gen-lightbox-audio .studio-chat-audio-time {
  width: auto;
  font-size: 12px;
}

.studio-gen-lightbox-audio .studio-orb-play, .studio-gen-lightbox-audio .studio-orb-play.is-md, .studio-gen-lightbox-audio .studio-orb-play.is-lg {
  aspect-ratio: 1;
  filter: none;
  background: none;
  border-radius: 999px;
  flex: 0 0 140px;
  place-self: center;
  overflow: hidden;
  width: 140px !important;
  min-width: 140px !important;
  max-width: 140px !important;
  height: 140px !important;
  min-height: 140px !important;
  max-height: 140px !important;
}

.studio-gen-lightbox-audio .studio-orb-frame, .studio-gen-lightbox-audio .studio-orb-well, .studio-gen-lightbox-audio .studio-orb-canvas, .studio-gen-lightbox-audio .studio-orb-fallback {
  overflow: hidden;
  border-radius: 999px !important;
}

@media (max-width: 720px) {
  .studio-gen-detail.is-mobile-sheet {
    z-index: 70;
    background: var(--mos-plate, var(--mos-panel));
    height: min(78vh, 640px);
    box-shadow: var(--studio-mobile-sheet-shadow, 0 -12px 40px var(--color-cursor-border-soft));
    border-top: 0;
    border-left: none;
    border-radius: 18px 18px 0 0;
    position: fixed;
    inset: auto 0 0;
  }

  .studio-gen-detail.is-mobile-sheet.is-dragging {
    transition: none !important;
  }
}

/* [project]/src/studio/components/studio-creative-network-store.css [app-client] (css) */
.studio-cn-store {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-cn-store-scroll {
  flex: auto;
  min-height: 0;
  padding: 4px 8px 8px;
  overflow: auto;
}

.studio-cn-store-empty {
  text-align: center;
  color: var(--color-cursor-muted);
  padding: 28px 12px;
  font-size: 12px;
}

.studio-cn-store-list {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.studio-cn-store-card {
  background: none;
  border: none;
  min-width: 0;
  padding: 0;
  display: block;
}

.studio-cn-store-card.is-owned-drag {
  cursor: grab;
}

.studio-cn-store-card.is-owned-drag:active {
  cursor: grabbing;
}

.studio-cn-store-card .studio-chat-audio-player {
  background: var(--mos-plate, var(--cursor-surface-raised));
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
  width: 100%;
  min-width: 0;
  max-width: none;
}

.studio-cn-store-card .studio-chat-audio-head {
  overflow: hidden;
}

.studio-cn-store-card .studio-chat-audio-head-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-cn-store-buy-group {
  flex: none;
  align-items: center;
  gap: 4px;
  min-width: 0;
  max-width: 100%;
  display: inline-flex;
}

.studio-cn-store-cancel {
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  border: none;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-cn-store-cancel > svg {
  width: 12px;
  height: 12px;
}

.studio-cn-store-cancel:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.studio-cn-store-buy {
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--color-cursor-accent);
  min-width: 0;
  max-width: 9.5rem;
  height: 22px;
  min-height: 22px;
  color: var(--color-cursor-accent-contrast, #fff);
  font: inherit;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  cursor: pointer;
  border: none;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0 8px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
}

.studio-cn-store-buy > svg {
  flex: none;
  width: 11px;
  height: 11px;
}

.studio-cn-store-buy > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-cn-store-buy:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.studio-cn-store-buy.is-owned {
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  color: var(--color-cursor-muted);
}

.studio-cn-store-buy.is-confirm {
  background: var(--color-cursor-accent);
  color: var(--color-cursor-accent-contrast, #fff);
}

.studio-cn-store-spin {
  width: 11px;
  height: 11px;
  animation: .8s linear infinite studio-cn-store-spin;
}

@keyframes studio-cn-store-spin {
  to {
    transform: rotate(360deg);
  }
}

.cursor-explorer-body.is-network-store {
  position: relative;
}

/* [project]/src/studio/components/studio-creative-network.css [app-client] (css) */
.studio-cn-sidebar {
  background: var(--mos-bg, var(--color-cursor-sidebar));
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-cn-sidebar-body {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-cn-sidebar-chrome {
  z-index: 2;
  flex: none;
  padding: 0;
}

.studio-academy-body {
  --academy-md-ink: var(--color-cursor-text, var(--mos-text, #e8eaef));
  --academy-md-muted: var(--color-cursor-muted, var(--mos-muted, #94a3b8));
  --academy-md-accent: var(--cursor-accent, var(--color-cursor-accent, #5b8cff));
  --academy-md-plate: var(--mos-plate, var(--color-cursor-panel, transparent));
  color: var(--academy-md-ink);
}

[data-appearance="light"] .studio-academy-body {
  --academy-md-ink: var(--color-cursor-text, #0f172a);
  --academy-md-muted: var(--color-cursor-muted, #64748b);
}

[data-appearance="dark"] .studio-academy-body {
  --academy-md-ink: var(--color-cursor-text, #e8eaef);
  --academy-md-muted: var(--color-cursor-muted, #94a3b8);
}

.studio-academy-body .studio-academy-md, .studio-academy-body .studio-chat-markdown, .studio-academy-body .studio-chat-markdown.mos-md, .studio-academy-body .studio-chat-markdown.md-prose {
  --chat-text-color: var(--academy-md-ink);
  --chat-text-muted: var(--academy-md-muted);
  --text: var(--academy-md-ink);
  --text-muted: var(--academy-md-muted);
  --mos-text: var(--academy-md-ink);
  --mos-muted: var(--academy-md-muted);
  --mos-accent: var(--academy-md-accent);
  letter-spacing: -.01em;
  max-width: 46rem;
  font-size: 14px;
  line-height: 1.65;
  color: var(--academy-md-ink) !important;
}

.studio-academy-body .studio-academy-md :is(h1, h2, h3, h4) {
  letter-spacing: -.02em;
  padding-bottom: 0;
  font-weight: 650;
  line-height: 1.25;
  color: var(--academy-md-ink) !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  border-bottom-width: medium !important;
}

.studio-academy-body .studio-academy-md h1 {
  margin: 1.1em 0 .4em;
  font-size: 1.12em;
}

.studio-academy-body .studio-academy-md h1:first-child, .studio-academy-body .studio-academy-md h2:first-child {
  margin-top: 0;
}

.studio-academy-body .studio-academy-md h2 {
  margin: 1.2em 0 .35em;
  font-size: 1.02em;
}

.studio-academy-body .studio-academy-md h3 {
  margin: 1.05em 0 .3em;
  font-size: .98em;
  color: color-mix(in srgb, var(--academy-md-ink) 88%, var(--academy-md-muted)) !important;
}

.studio-academy-body .studio-academy-md h4 {
  text-transform: none;
  letter-spacing: -.01em;
  margin: .95em 0 .28em;
  font-size: .94em;
  color: var(--academy-md-muted) !important;
}

.studio-academy-body .studio-academy-md :is(p, li, td, th) {
  color: var(--academy-md-ink) !important;
}

.studio-academy-body .studio-academy-md p {
  margin: .7em 0;
}

.studio-academy-body .studio-academy-md strong {
  font-weight: 650;
  color: var(--academy-md-ink) !important;
}

.studio-academy-body .studio-academy-md em {
  font-style: italic;
  color: var(--academy-md-muted) !important;
}

.studio-academy-body .studio-academy-md a {
  border-bottom: 1px solid color-mix(in srgb, var(--academy-md-accent) 35%, transparent);
  font-weight: 550;
  text-decoration: none;
  color: var(--academy-md-accent) !important;
}

.studio-academy-body .studio-academy-md a:hover {
  border-bottom-color: var(--academy-md-accent);
}

.studio-academy-body .studio-academy-md ul > li:before {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--academy-md-accent) 18%, transparent);
  background: var(--academy-md-accent) !important;
  opacity: 1 !important;
}

.studio-academy-body .studio-academy-md ol {
  counter-reset: academy-md;
  padding-left: 0;
  list-style: none;
}

.studio-academy-body .studio-academy-md ol > li {
  counter-increment: academy-md;
  padding-left: 1.55em;
  position: relative;
}

.studio-academy-body .studio-academy-md ol > li:before {
  content: counter(academy-md);
  width: 1.2em;
  height: 1.2em;
  color: var(--academy-md-accent);
  background: color-mix(in srgb, var(--academy-md-accent) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--academy-md-accent) 32%, transparent);
  border-radius: 999px;
  place-items: center;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: grid;
  position: absolute;
  top: .12em;
  left: 0;
}

.studio-academy-body .studio-academy-md blockquote {
  border: 0;
  border-left: 2px solid color-mix(in srgb, var(--academy-md-accent) 45%, transparent);
  background: none;
  border-radius: 0;
  margin: .9em 0;
  padding: 0 0 0 12px;
  color: var(--academy-md-muted) !important;
}

.studio-academy-body .studio-academy-md blockquote p {
  margin: .35em 0;
  color: color-mix(in srgb, var(--academy-md-ink) 88%, var(--academy-md-muted)) !important;
}

.studio-academy-body .studio-academy-md code {
  background: color-mix(in srgb, var(--academy-md-accent) 10%, var(--academy-md-plate));
  border: 1px solid color-mix(in srgb, var(--academy-md-accent) 18%, var(--color-cursor-border-soft, transparent));
  border-radius: 6px;
  padding: .12em .4em;
  color: var(--academy-md-ink) !important;
}

.studio-academy-body .studio-academy-md hr {
  height: 1px;
  margin: 1.35em 0;
  background: linear-gradient(90deg,
    transparent,
    color-mix(in srgb, var(--academy-md-accent) 45%, transparent),
    transparent) !important;
}

.studio-academy-body.is-locked {
  border-radius: 12px;
  max-height: none;
  padding-bottom: 10px;
  position: relative;
  overflow: visible;
}

.studio-academy-checkout {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, var(--color-cursor-bg));
  box-shadow: 0 1px 0 color-mix(in srgb, var(--mos-text, #111) 4%, transparent),
    0 6px 16px color-mix(in srgb, var(--mos-text, #111) 4%, transparent);
  border-radius: 12px;
  gap: 0;
  display: grid;
  overflow: hidden;
}

.studio-academy-checkout-hero {
  background: radial-gradient(circle at 88% 0%,
      color-mix(in srgb, var(--cursor-accent) 22%, transparent),
      transparent 52%),
    radial-gradient(circle at 8% 100%,
      color-mix(in srgb, var(--cursor-accent) 10%, transparent),
      transparent 44%),
    var(--mos-plate, var(--cursor-surface));
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  gap: 0;
  padding: 10px 12px 8px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.studio-academy-checkout-hero-icon {
  width: 128px;
  height: 128px;
  color: var(--cursor-accent);
  opacity: .22;
  pointer-events: none;
  z-index: 0;
  position: absolute;
  top: 50%;
  right: -22px;
  transform: translateY(-48%)rotate(-10deg);
}

.studio-academy-checkout-hero-copy {
  z-index: 1;
  gap: 4px;
  min-width: 0;
  padding-right: 56px;
  display: grid;
  position: relative;
}

.studio-academy-checkout-kicker {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--color-cursor-text-secondary, #8a8a8a));
  margin: 0;
  font-size: 10px;
  font-weight: 650;
}

.studio-academy-checkout-amount {
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-text-bright, var(--cursor-text-bright));
  flex-flow: column;
  align-items: flex-start;
  gap: 2px;
  margin: 0;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.15;
  display: flex;
}

.studio-academy-checkout-amount .studio-academy-card-compare {
  font-size: .95em;
  font-weight: 800;
  line-height: 1.1;
}

.studio-academy-checkout-amount .studio-academy-card-now {
  font-size: 1.28em;
  line-height: 1.1;
}

.studio-academy-checkout-price-now {
  white-space: nowrap;
}

.studio-academy-checkout-price-was {
  white-space: nowrap;
  opacity: .48;
  font-size: .58em;
  font-weight: 550;
}

.studio-academy-checkout-chips {
  flex-wrap: wrap;
  gap: 5px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-academy-checkout-chips li {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: color-mix(in srgb, var(--mos-page, #fff) 72%, transparent);
  min-height: 20px;
  color: var(--color-cursor-text-secondary, #8a8a8a);
  letter-spacing: .01em;
  border-radius: 999px;
  align-items: center;
  padding: 0 7px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
}

.studio-academy-checkout-receipt {
  gap: 0;
  margin: 0;
  padding: 2px 0;
  display: grid;
}

.studio-academy-checkout-row {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 0;
  padding: 5px 12px;
  font-size: 12px;
  line-height: 1.25;
  display: grid;
}

.studio-academy-checkout-row dt {
  color: var(--color-cursor-muted, var(--color-cursor-text-secondary, #8a8a8a));
  white-space: nowrap;
  margin: 0;
  font-weight: 500;
}

.studio-academy-checkout-row dd {
  font-variant-numeric: tabular-nums;
  text-align: right;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--cursor-text-bright));
  margin: 0;
  font-weight: 650;
}

.studio-academy-checkout-row.is-muted dt, .studio-academy-checkout-row.is-muted dd {
  color: var(--color-cursor-text-secondary, #8a8a8a);
  font-weight: 500;
}

.studio-academy-checkout-row.is-discount dd {
  color: var(--mos-success, #22c55e);
  font-weight: 650;
}

.studio-academy-sale-receipt {
  margin-bottom: 10px;
}

.studio-academy-checkout-row.is-total {
  border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  min-height: 0;
  margin-top: 0;
  padding-top: 7px;
  padding-bottom: 7px;
}

.studio-academy-checkout-row.is-total dt, .studio-academy-checkout-row.is-total dd {
  color: var(--color-cursor-text-bright, var(--cursor-text-bright));
  font-weight: 700;
}

.studio-academy-checkout-note {
  color: var(--color-cursor-text-secondary, #8a8a8a);
  margin: 0;
  padding: 10px 12px 12px;
  font-size: 12px;
  line-height: 1.35;
}

.studio-academy-buy-group {
  box-sizing: border-box;
  align-items: stretch;
  gap: 6px;
  width: 100%;
  padding: 6px 12px 12px;
  display: flex;
}

.studio-academy-buy-group .public-offers-btn.is-block {
  border-radius: 999px;
  flex: auto;
  min-width: 0;
  min-height: 38px;
}

.studio-academy-buy-cancel {
  flex: none;
  align-self: center;
  border-radius: 999px !important;
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
}

.studio-academy-buy-group .public-offers-btn.is-primary.is-confirm {
  border-color: color-mix(in srgb, var(--cursor-accent) 48%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 22%, transparent);
}

.studio-academy-checkout-paywise {
  box-sizing: border-box;
  border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: color-mix(in srgb, var(--mos-plate, var(--cursor-surface)) 55%, transparent);
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  width: 100%;
  padding: 8px 12px 10px;
  display: flex;
}

.studio-academy-checkout-paywise .studio-settings-topup-pay {
  min-height: 40px;
  margin-top: 0;
  font-size: 13px;
}

.studio-academy-checkout-paywise .studio-settings-topup-pay.is-theme {
  border-color: color-mix(in srgb, var(--cursor-accent) 58%, var(--mos-text, #111) 10%);
  border-bottom-color: color-mix(in srgb, var(--cursor-accent) 42%, #000 38%);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--cursor-accent) 78%, #fff 22%) 0%,
    var(--cursor-accent) 48%,
    color-mix(in srgb, var(--cursor-accent) 68%, #000 32%) 100%);
  box-shadow: inset 0 -2px 0 #0003,
    0 2px 3px color-mix(in srgb, var(--cursor-accent) 22%, transparent),
    0 4px 10px color-mix(in srgb, var(--cursor-accent) 16%, transparent);
  color: #fff;
  text-shadow: 0 1px 2px #0000006b;
}

.studio-academy-checkout-paywise .studio-settings-topup-pay.is-theme:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--cursor-accent) 64%, #fff 8%);
  border-bottom-color: color-mix(in srgb, var(--cursor-accent) 46%, #000 36%);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--cursor-accent) 86%, #fff 14%) 0%,
    var(--cursor-accent) 48%,
    color-mix(in srgb, var(--cursor-accent) 70%, #000 30%) 100%);
  box-shadow: inset 0 -2px 0 #0000002e,
    0 2px 4px color-mix(in srgb, var(--cursor-accent) 24%, transparent),
    0 5px 12px color-mix(in srgb, var(--cursor-accent) 16%, transparent);
}

.studio-academy-checkout-paywise .studio-settings-topup-pay.is-theme:active:not(:disabled), .studio-academy-checkout-paywise .studio-settings-topup-pay.is-theme:hover:active:not(:disabled) {
  box-shadow: inset 0 2px 3px #0000003d,
    0 1px 2px color-mix(in srgb, var(--cursor-accent) 16%, transparent);
}

.studio-academy-checkout-paywise .studio-settings-topup-pay.is-theme:disabled:not(.is-loading) {
  border-color: color-mix(in srgb, var(--cursor-accent) 28%, var(--mos-border-soft));
  border-bottom-color: color-mix(in srgb, var(--cursor-accent) 22%, #000 28%);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--cursor-accent) 34%, var(--mos-plate)),
    color-mix(in srgb, var(--cursor-accent) 28%, var(--mos-plate-strong, #e0e0e6)));
  color: color-mix(in srgb, #fff 55%, var(--color-cursor-muted, #8a8a8a));
  text-shadow: none;
}

.studio-academy-checkout-paywise .studio-settings-topup-pay.is-theme.is-loading:disabled {
  border-color: color-mix(in srgb, var(--cursor-accent) 58%, var(--mos-text, #111) 10%);
  border-bottom-color: color-mix(in srgb, var(--cursor-accent) 42%, #000 38%);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--cursor-accent) 78%, #fff 22%) 0%,
    var(--cursor-accent) 48%,
    color-mix(in srgb, var(--cursor-accent) 68%, #000 32%) 100%);
  color: var(--cursor-on-accent);
}

.studio-academy-checkout-paywise .studio-settings-topup-pay:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--mos-success, #22c55e) 70%, transparent);
  outline-offset: 2px;
}

.studio-academy-checkout-paywise .studio-settings-topup-pay.is-theme:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent) 70%, transparent);
  outline-offset: 2px;
}

.studio-academy-checkout-paywise .studio-settings-topup-secure {
  margin-top: 6px;
}

@media (prefers-reduced-motion: reduce) {
  .studio-academy-checkout-paywise .studio-settings-topup-pay, .studio-academy-buy-group .public-offers-btn {
    transition: none !important;
  }
}

.studio-academy-body.is-locked .studio-academy-body-clip {
  border-radius: 12px;
  max-height: 12.5rem;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(#000 28%, #0000 92%);
  mask-image: linear-gradient(#000 28%, #0000 92%);
}

.studio-academy-lock-overlay {
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(to bottom,
    transparent 8%,
    color-mix(in srgb, var(--mos-page, var(--color-cursor-bg, #0b1220)) 55%, transparent) 48%,
    color-mix(in srgb, var(--mos-page, var(--color-cursor-bg, #0b1220)) 92%, transparent) 100%);
  place-content: end center;
  place-items: center;
  padding: 0 14px 20px;
  display: grid;
  position: absolute;
  inset: 0;
  overflow: visible;
}

.studio-academy-lock-badge {
  width: 36px;
  height: 36px;
  color: var(--color-cursor-text, var(--mos-text));
  background: color-mix(in srgb, var(--mos-plate-strong, var(--cursor-surface-2)) 88%, transparent);
  border: 1px solid color-mix(in srgb, var(--cursor-accent, #5b8cff) 28%, var(--color-cursor-border-soft, transparent));
  border-radius: 999px;
  place-items: center;
  display: grid;
  box-shadow: 0 6px 18px #00000038;
}

.studio-academy-lock-badge svg {
  width: 16px;
  height: 16px;
}

.profile-comments-locked-shell {
  z-index: 0;
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  position: relative;
  overflow: hidden;
}

.profile-comments-locked-shell.is-locked {
  flex: auto;
  overflow: visible;
}

.profile-comments-locked-shell.is-locked .profile-comments-list {
  flex: 0 auto;
  max-height: none;
  overflow: hidden;
}

.profile-comments-locked-shell.is-locked .studio-academy-lock-overlay {
  background: linear-gradient(to bottom,
    transparent 0%,
    color-mix(in srgb, var(--mos-panel, var(--mos-page, #0b1220)) 35%, transparent) 36%,
    color-mix(in srgb, var(--mos-panel, var(--mos-page, #0b1220)) 94%, transparent) 100%);
  place-content: center;
  padding: 12px 14px 16px;
  overflow: visible;
}

.profile-comment-like.is-static {
  pointer-events: none;
  cursor: default;
}

.profile-comment-view-replies.is-static {
  pointer-events: none;
  cursor: default;
  opacity: .75;
}

.studio-cn-book-sidebar-body.is-comments-fill .profile-comments-locked-shell {
  flex: auto;
  min-height: 0;
}

.studio-cn-book-sidebar-body .profile-comments-search {
  z-index: 5;
  position: relative;
}

.studio-polish .studio-cn-sidebar .cursor-panel-search, .studio-cn-sidebar .cursor-panel-search {
  border: none;
}

.studio-cn-rail-scroll {
  scrollbar-width: none;
  flex: auto;
  min-height: 0;
  padding: 8px 10px 12px;
  overflow: hidden auto;
}

.studio-cn-rail-scroll::-webkit-scrollbar {
  display: none;
}

.studio-cn-sidebar .public-offers-rail-body {
  gap: 8px;
  padding: 8px 10px 14px;
}

.studio-cn-sidebar .public-offers-filter-group {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 88%, transparent);
  background: var(--mos-plate, var(--cursor-surface));
  border-radius: 12px;
  gap: 4px;
  padding: 6px;
}

.studio-cn-sidebar .public-offers-filter-head, .studio-cn-sidebar .public-offers-filter-btn, .studio-cn-sidebar .public-offers-price-preset, .studio-cn-sidebar .public-offers-price-inputs, .studio-cn-sidebar .public-offers-rail-clear, .studio-cn-sidebar .public-offers-range, .studio-cn-sidebar .public-offers-presets, .studio-cn-sidebar .public-offers-filter-more, .studio-cn-sidebar .public-offers-show-more {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.studio-cn-sidebar .public-offers-filter-head {
  letter-spacing: .08em;
  border-radius: 8px;
  min-height: 28px;
  padding: 4px 8px;
}

.studio-cn-sidebar .public-offers-filter-options {
  gap: 3px;
  padding: 0 2px 2px;
}

.studio-cn-sidebar .public-offers-filter-btn {
  border: 1px solid #0000;
  border-radius: 8px;
  min-height: 28px;
  padding: 4px 10px;
  font-size: 12px;
}

.studio-cn-sidebar .public-offers-filter-btn:hover {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-cn-sidebar .public-offers-filter-btn.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 34%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 14%, var(--mos-plate, var(--cursor-surface)));
  font-weight: 650;
}

.studio-cn-sidebar .public-offers-range {
  width: 100%;
  margin: 2px 0 4px;
  padding: 0 2px;
}

.studio-cn-sidebar .public-offers-range input {
  background: var(--mos-page, var(--mos-panel));
  border-radius: 8px;
  height: 30px;
  box-shadow: inset 0 1px #0000000a;
}

.studio-cn-sidebar .public-offers-presets {
  gap: 5px;
  width: 100%;
  margin: 0 0 2px;
  padding: 0 2px 2px;
}

.studio-cn-sidebar .public-offers-preset {
  background: var(--mos-page, var(--mos-panel));
  min-height: 24px;
  padding: 0 10px;
}

.studio-cn-sidebar .public-offers-preset.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 38%, var(--color-cursor-border));
  background: color-mix(in srgb, var(--cursor-accent) 14%, var(--mos-page, var(--mos-panel)));
}

.studio-cn-sidebar .public-offers-rail-clear {
  border-radius: 8px;
  min-height: 30px;
  margin: 2px 0 0;
}

.studio-cn-list {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.studio-cn-list-item {
  border-radius: var(--cursor-radius-md, 8px);
  width: 100%;
  min-height: 52px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  display: flex;
}

@media (hover: hover) {
  .studio-cn-list-item:hover {
    background: var(--color-cursor-hover);
  }
}

.studio-cn-list-item.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 36%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 12%, transparent);
}

.studio-cn-list-thumb {
  background: var(--mos-plate, var(--cursor-surface));
  width: 36px;
  height: 36px;
  color: var(--color-cursor-muted);
  border-radius: 8px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: flex;
  overflow: hidden;
}

.studio-cn-list-thumb > img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-cn-list-thumb > svg {
  width: 16px;
  height: 16px;
}

.studio-cn-list-copy {
  flex: auto;
  gap: 2px;
  min-width: 0;
  display: grid;
}

.studio-cn-list-copy strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 650;
  overflow: hidden;
}

.studio-cn-list-copy span {
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--color-cursor-muted);
  font-size: 11px;
  overflow: hidden;
}

.studio-cn-list-empty {
  color: var(--color-cursor-muted);
  text-align: center;
  margin: 18px 8px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-cn-messages-block {
  border-top: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page, var(--color-cursor-bg));
  flex: none;
  padding: 8px 10px 10px;
}

.studio-cn-messages-head {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
  display: flex;
}

.studio-cn-messages-head strong {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 700;
}

.studio-cn-messages-open {
  color: var(--cursor-accent);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  font-size: 11px;
  font-weight: 650;
}

.studio-cn-messages-open:hover {
  text-decoration: underline;
}

.studio-cn-messages-row {
  border-radius: var(--cursor-radius-sm, 6px);
  width: 100%;
  min-height: 36px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  gap: 8px;
  padding: 4px 6px;
  display: flex;
}

@media (hover: hover) {
  .studio-cn-messages-row:hover {
    background: var(--color-cursor-hover);
  }
}

.studio-cn-messages-row span {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  min-width: 0;
  font-size: 12px;
  font-weight: 600;
  overflow: hidden;
}

.studio-cn-pane {
  flex-direction: column;
  flex: auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-cn-pane.is-with-right-rail {
  flex-direction: row;
  align-items: stretch;
}

.studio-cn-pane-split {
  flex: auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
}

.studio-cn-main-col {
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-cn-main-col > .studio-cn-head {
  flex: none;
}

.studio-cn-main-col > .studio-cn-body {
  flex: auto;
  min-height: 0;
}

.studio-cn-right-rail {
  background: var(--mos-panel, var(--mos-page, var(--color-cursor-bg)));
  border-left: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-cn-right-rail .studio-cn-book-sidebar {
  border-left: 0;
  height: 100%;
}

.studio-cn-head {
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-panel, var(--mos-page, var(--color-cursor-bg)));
  flex: none;
  align-items: center;
  gap: 0;
  padding: 0;
  display: flex;
}

.studio-cn-head-tabs {
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  flex: auto;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0;
  display: flex;
  overflow: auto hidden;
}

.studio-cn-head-tabs::-webkit-scrollbar {
  display: none;
}

.studio-cn-head-tab {
  min-height: 26px;
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 4px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-cn-head-tab:hover {
  color: var(--color-cursor-text-bright);
  background: var(--color-cursor-hover);
}

.studio-cn-head-tab.is-chrome-pill {
  border-color: var(--studio-mobile-chrome-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  background: var(--studio-mobile-chrome-glass-foot, var(--mos-plate, var(--mos-panel)));
  color: color-mix(in srgb, var(--color-cursor-text-bright, var(--mos-text)) 86%, transparent);
}

.studio-cn-head-tab.is-chrome-pill:hover {
  color: var(--color-cursor-text-bright, var(--mos-text));
  background: var(--color-cursor-hover);
}

.studio-polish.is-studio-mobile .studio-cn-head-tab.is-chrome-pill {
  min-height: var(--studio-mobile-chrome-control, 34px);
  height: var(--studio-mobile-chrome-control, 34px);
  padding: 0 12px;
}

.studio-polish.is-studio-mobile .studio-cn-head-tab.is-chrome-pill > svg {
  width: 15px;
  height: 15px;
}

.studio-cn-head-tab.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 36%, transparent);
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-plate));
  color: var(--color-cursor-text-bright);
}

.studio-cn-head-tab > svg {
  width: 13px;
  height: 13px;
}

.studio-cn-head-action {
  flex: none;
  align-items: center;
  padding: 0 8px 0 4px;
  display: flex;
}

.studio-cn-head-nav {
  align-items: center;
  gap: 4px;
  display: flex;
}

.studio-cn-head-nav-btn {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-cn-head-nav-btn svg {
  flex: none;
  width: 13px;
  height: 13px;
}

.studio-cn-head-nav-btn:hover:not(:disabled) {
  color: var(--color-cursor-text-bright, var(--mos-text));
  background: var(--color-cursor-hover);
}

.studio-cn-head-nav-btn:disabled {
  opacity: .38;
  cursor: default;
}

.studio-cn-seller-cta {
  border: 1px solid color-mix(in srgb, var(--cursor-accent) 40%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 12%, transparent);
  min-height: 26px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-cn-seller-cta:hover {
  background: color-mix(in srgb, var(--cursor-accent) 18%, transparent);
}

.studio-cn-body {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-cn-body.is-catalog {
  background: var(--mos-page);
}

.studio-cn-catalog.public-offers-main {
  flex: auto;
  height: 100%;
  min-height: 0;
}

.studio-cn-catalog.public-offers-main.is-academy-watch {
  touch-action: pan-y;
  flex-direction: column;
  flex: 1 1 0;
  height: auto;
  min-height: 0;
  max-height: none;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-academy-watch-track {
  z-index: 1;
  will-change: transform;
  position: absolute;
  inset: 0;
}

.studio-academy-watch-slide {
  background: var(--mos-page);
  flex-direction: column;
  min-height: 0;
  display: flex;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-academy-watch-slide.is-prev {
  transform: translate3d(-100%, 0, 0);
}

.studio-academy-watch-slide.is-next {
  transform: translate3d(100%, 0, 0);
}

.studio-academy-watch-slide.is-current {
  z-index: 1;
  transform: none;
}

.studio-academy-watch-slide:not(.is-current) {
  pointer-events: none;
}

.studio-academy-player-swipe {
  display: none;
}

.studio-polish.is-studio-mobile .studio-academy-player-swipe {
  z-index: 3;
  touch-action: pan-y;
  display: block;
  position: absolute;
  inset: 0 0 52px;
}

.studio-academy-watch-player {
  box-sizing: border-box;
  background: var(--mos-page);
  z-index: 2;
  flex: none;
  width: 100%;
  padding: 8px 10px 6px;
  overflow: visible;
}

.studio-cn-catalog.is-academy-watch .studio-academy-watch-slide > .public-offers-main-scroll {
  flex: auto;
  min-height: 0;
  position: relative;
}

.studio-cn-catalog.is-academy-watch .studio-academy-watch-slide > .public-offers-main-scroll:before {
  content: "";
  z-index: 4;
  pointer-events: none;
  background: linear-gradient(to bottom,
    var(--mos-page) 0%,
    color-mix(in srgb, var(--mos-page) 78%, transparent) 38%,
    color-mix(in srgb, var(--mos-page) 28%, transparent) 72%,
    transparent 100%);
  height: 36px;
  margin-bottom: -36px;
  display: block;
  position: sticky;
  top: 0;
}

.studio-academy-detail-top, .studio-academy-body {
  padding-left: 2px;
  padding-right: 2px;
}

.studio-polish.is-studio-mobile .studio-cn-catalog.is-academy-watch .studio-academy-detail {
  padding-top: 28px;
}

.studio-polish.is-studio-mobile .studio-cn-catalog.is-academy-watch .studio-academy-detail-top, .studio-polish.is-studio-mobile .studio-cn-catalog.is-academy-watch .studio-academy-body {
  padding-left: 16px;
  padding-right: 16px;
}

.studio-academy-pane .studio-cn-body.is-catalog > .studio-cn-catalog.public-offers-main:not(.is-academy-watch) {
  flex: 1 1 0;
  height: auto;
  min-height: 0;
  max-height: none;
}

.studio-cn-main-filters {
  gap: 8px;
  min-width: 0;
  display: grid;
}

.studio-cn-main-filters-bar {
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-cn-main-search {
  flex: auto;
  min-width: 0;
  margin: 0;
}

.studio-cn-filters-toggle {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--cursor-surface));
  width: auto;
  min-height: 28px;
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  transition: background var(--cursor-ease, .16s ease),
    border-color var(--cursor-ease, .16s ease);
  flex: none;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-cn-filters-toggle:hover {
  border-color: var(--color-cursor-border-subtle, var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
}

.studio-cn-filters-toggle > svg {
  width: 14px;
  height: 14px;
}

.studio-cn-filters-toggle > .icon-inline {
  flex: none;
  width: 14px;
  height: 14px;
  display: inline-flex;
}

.studio-cn-filters-toggle > em {
  background: color-mix(in srgb, var(--cursor-accent) 18%, transparent);
  text-align: center;
  border-radius: 999px;
  min-width: 18px;
  padding: 0 6px;
  font-size: 11px;
  font-style: normal;
}

.studio-cn-filters-toggle.is-active, .studio-cn-filters-toggle[aria-expanded="true"] {
  border-color: color-mix(in srgb, var(--cursor-accent) 36%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-plate));
}

.studio-cn-main-filters-panel {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-lg, 10px);
  background: var(--mos-plate, var(--cursor-surface));
  gap: 4px;
  padding: 10px;
  display: grid;
}

button.studio-cn-card-btn.public-offers-card {
  text-align: left;
  width: 100%;
  font: inherit;
  appearance: none;
  cursor: pointer;
}

.studio-cn-offer-detail {
  flex: auto;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  overflow: hidden;
}

.studio-cn-offer-detail.is-split, .studio-cn-offer-detail.is-mobile {
  flex-direction: column;
  display: flex;
}

.studio-cn-offer-panels {
  flex: 1 1 0;
  height: 100%;
  min-height: 0;
  max-height: 100%;
}

.studio-cn-offer-panels > [data-panel], .studio-cn-offer-main-panel, .studio-cn-book-panel {
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
  display: flex !important;
}

.studio-cn-detail-scroll {
  overscroll-behavior: contain;
  flex: 1 1 0;
  height: auto;
  min-height: 0;
  max-height: 100%;
  overflow: hidden auto;
}

.studio-cn-detail-main {
  gap: 14px;
  min-width: 0;
  display: grid;
}

.studio-cn-offer-detail .public-offers-body {
  gap: 12px;
  max-width: none;
  margin: 0;
  padding: 14px 16px 28px;
}

.studio-cn-offer-detail .public-offers-gallery-stage {
  aspect-ratio: 16 / 9;
  border-radius: var(--cursor-radius-lg, 12px);
  width: 100%;
  height: auto;
  min-height: 160px;
  max-height: none;
}

.studio-cn-offer-detail .public-offers-gallery-stage img, .studio-cn-offer-detail .public-offers-gallery-stage video {
  object-fit: cover;
}

@media (min-width: 861px) {
  .studio-cn-offer-detail .public-offers-gallery-stage {
    min-height: 200px;
  }
}

.studio-cn-offer-hero, .studio-cn-offer-section {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  background: var(--mos-plate, var(--cursor-surface));
  border-radius: 14px;
  overflow: hidden;
  box-shadow: inset 0 1px #ffffff8c, 0 1px 2px #0000000f;
}

[data-appearance="dark"] .studio-cn-offer-hero, [data-appearance="dark"] .studio-cn-offer-section {
  box-shadow: inset 0 1px #ffffff14, 0 1px 2px #0000002e;
}

.studio-cn-offer-hero-bar, .studio-cn-offer-section-bar {
  height: var(--cursor-section-h, 36px);
  min-height: var(--cursor-section-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: color-mix(in srgb, var(--mos-page, var(--mos-panel)) 55%, transparent);
  box-sizing: border-box;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  display: flex;
}

.studio-cn-offer-hero-kicker, .studio-cn-offer-section-bar h2 {
  min-width: 0;
  color: var(--color-cursor-text, var(--mos-text));
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 0;
  font-size: 12px;
  font-weight: 650;
  overflow: hidden;
}

.studio-cn-offer-hero-body, .studio-cn-offer-section-body {
  gap: 10px;
  padding: 14px 14px 12px;
  display: grid;
}

.studio-cn-offer-hero-body h1 {
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
  color: var(--color-cursor-text-bright, var(--mos-text));
  margin: 0;
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 700;
  line-height: 1.2;
}

.studio-cn-offer-hero-seller {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-cn-offer-hero-seller a {
  color: inherit;
  font-weight: 650;
  text-decoration: none;
}

.studio-cn-offer-hero-seller a:hover {
  color: var(--cursor-accent);
}

.studio-cn-offer-hero-stats {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, var(--mos-panel));
  border-radius: 10px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  margin: 2px 0 0;
  display: grid;
  overflow: hidden;
}

.studio-cn-offer-hero-stat {
  border-right: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  gap: 3px;
  min-width: 0;
  padding: 10px 12px;
  display: grid;
}

.studio-cn-offer-hero-stat:nth-child(2n) {
  border-right: 0;
}

.studio-cn-offer-hero-stat:nth-last-child(-n+2) {
  border-bottom: 0;
}

.studio-cn-offer-hero-stat dt {
  color: var(--color-cursor-muted, var(--mos-muted));
  letter-spacing: .06em;
  text-transform: uppercase;
  margin: 0;
  font-size: 10px;
  font-weight: 700;
}

.studio-cn-offer-hero-stat dd {
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  text-overflow: ellipsis;
  white-space: nowrap;
  align-items: center;
  gap: 5px;
  margin: 0;
  font-size: 13px;
  font-weight: 650;
  display: inline-flex;
  overflow: hidden;
}

.studio-cn-offer-hero-stat dd svg {
  width: 13px;
  height: 13px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.studio-cn-offer-section-body .public-offers-prose {
  font-size: 13px;
}

.studio-cn-offer-detail .public-offers-panel {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  background: var(--mos-plate, var(--cursor-surface));
  border-radius: 14px;
  gap: 10px;
  padding: 0;
  overflow: hidden;
  box-shadow: inset 0 1px #ffffff8c, 0 1px 2px #0000000f;
}

[data-appearance="dark"] .studio-cn-offer-detail .public-offers-panel {
  box-shadow: inset 0 1px #ffffff14, 0 1px 2px #0000002e;
}

.studio-cn-offer-detail .public-offers-panel > h2 {
  height: var(--cursor-section-h, 36px);
  min-height: var(--cursor-section-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: color-mix(in srgb, var(--mos-page, var(--mos-panel)) 55%, transparent);
  letter-spacing: .04em;
  text-transform: uppercase;
  align-items: center;
  margin: 0;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 650;
  display: flex;
}

.studio-cn-offer-detail .public-offers-panel > :not(h2) {
  margin-left: 14px;
  margin-right: 14px;
}

.studio-cn-offer-detail .public-offers-panel > :not(h2):last-child {
  margin-bottom: 12px;
}

.studio-cn-offer-detail .public-offers-panel > :not(h2):first-of-type {
  margin-top: 12px;
}

.studio-cn-book-panel, .studio-cn-offer-panels > [data-panel-id="studio-cn-offer-book"] {
  min-width: 240px;
}

.studio-cn-book-sidebar {
  background: var(--mos-panel, var(--mos-page, var(--color-cursor-bg)));
  border-left: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-cn-book-sidebar-head {
  min-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  color: var(--color-cursor-text-bright, var(--mos-text));
  flex: none;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 10px;
  font-size: 12px;
  font-weight: 650;
  display: flex;
}

.studio-polish aside.studio-cn-book-sidebar:has(.is-comments-fill) .studio-cn-book-sidebar-head.cursor-panel-head {
  box-sizing: border-box;
  padding-top: 0;
  padding-bottom: 0;
  line-height: 1;
  overflow: visible;
  height: var(--cursor-head-h, 36px) !important;
  min-height: var(--cursor-head-h, 36px) !important;
  max-height: var(--cursor-head-h, 36px) !important;
  border-bottom: 1px solid var(--studio-chrome-divider) !important;
}

.studio-polish aside.studio-cn-book-sidebar:has(.is-comments-fill) .studio-cn-book-sidebar-head.cursor-sidebar-head {
  box-sizing: border-box;
  padding-top: 0;
  padding-bottom: 0;
  line-height: 1;
  overflow: visible;
  height: var(--cursor-head-h, 36px) !important;
  min-height: var(--cursor-head-h, 36px) !important;
  max-height: var(--cursor-head-h, 36px) !important;
  border-bottom: 1px solid var(--studio-chrome-divider) !important;
}

[data-appearance="light"] .studio-polish aside.studio-cn-book-sidebar:has(.is-comments-fill) .studio-cn-book-sidebar-head.cursor-panel-head {
  box-sizing: border-box;
  padding-top: 0;
  padding-bottom: 0;
  line-height: 1;
  overflow: visible;
  height: var(--cursor-head-h, 36px) !important;
  min-height: var(--cursor-head-h, 36px) !important;
  max-height: var(--cursor-head-h, 36px) !important;
  border-bottom: 1px solid var(--studio-chrome-divider) !important;
}

[data-appearance="light"] .studio-polish aside.studio-cn-book-sidebar:has(.is-comments-fill) .studio-cn-book-sidebar-head.cursor-sidebar-head {
  box-sizing: border-box;
  padding-top: 0;
  padding-bottom: 0;
  line-height: 1;
  overflow: visible;
  height: var(--cursor-head-h, 36px) !important;
  min-height: var(--cursor-head-h, 36px) !important;
  max-height: var(--cursor-head-h, 36px) !important;
  border-bottom: 1px solid var(--studio-chrome-divider) !important;
}

.studio-polish aside.studio-cn-book-sidebar:has(.is-comments-fill) .profile-comments-search .cursor-panel-search {
  border: none;
}

.studio-cn-book-sidebar:has(.is-comments-fill) .profile-comments-search .cursor-panel-search {
  border: none;
}

.studio-cn-book-sidebar-head strong {
  min-width: 0;
}

.studio-cn-book-sidebar-body {
  overscroll-behavior: contain;
  scrollbar-width: none;
  flex: auto;
  min-height: 0;
  padding: 8px 0 12px;
  overflow: hidden auto;
}

.studio-cn-book-sidebar-body::-webkit-scrollbar {
  display: none;
}

.studio-cn-offer-detail.is-mobile .public-offers-mobile-book-nav.studio-cn-book-bar, .studio-academy-pane .public-offers-mobile-book-nav.studio-cn-book-bar {
  z-index: 40;
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-bg)));
  box-sizing: border-box;
  flex: none;
  align-items: center;
  gap: 8px;
  display: flex;
  overflow: visible;
  height: var(--studio-mobile-nav-height, 38px) !important;
  min-height: var(--studio-mobile-nav-height, 38px) !important;
  max-height: var(--studio-mobile-nav-height, 38px) !important;
  border: 0 !important;
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft)) !important;
  box-shadow: none !important;
  padding: 0 10px !important;
}

.studio-academy-pane .studio-cn-book-stack {
  z-index: 40;
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-bg)));
  flex-direction: column;
  flex: none;
  min-width: 0;
  display: flex;
  position: relative;
  overflow: visible;
}

.studio-cn-reaction-bar {
  height: var(--studio-mobile-nav-height, 38px);
  min-height: var(--studio-mobile-nav-height, 38px);
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: none;
  animation: .18s cubic-bezier(.16, 1, .3, 1) studio-cn-reaction-open;
  overflow: hidden;
}

.studio-cn-reaction-scroller {
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  align-items: center;
  gap: 2px;
  width: 100%;
  height: 100%;
  padding: 0 6px;
  display: flex;
  overflow: auto hidden;
}

.studio-cn-reaction-scroller::-webkit-scrollbar {
  display: none;
}

.studio-cn-reaction-emoji {
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  flex: none;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  font-size: 20px;
  line-height: 1;
  display: grid;
}

.studio-cn-reaction-emoji.is-on {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, transparent);
}

@keyframes studio-cn-reaction-open {
  from {
    opacity: 0;
    max-height: 0;
  }

  to {
    opacity: 1;
    max-height: 40px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-cn-reaction-bar {
    animation: none;
  }
}

.studio-cn-book-bar-price {
  white-space: nowrap;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  flex: auto;
  align-items: baseline;
  gap: 7px;
  font-size: 16px;
  font-weight: 750;
  line-height: 1.1;
  display: inline-flex;
  overflow: hidden;
}

.studio-cn-book-bar-price > span {
  text-overflow: ellipsis;
  min-width: 0;
  overflow: hidden;
}

button.studio-cn-book-bar-price.is-discussion {
  appearance: none;
  cursor: pointer;
  font: inherit;
  text-align: left;
  color: inherit;
  background: none;
  border: 0;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
}

button.studio-cn-book-bar-price.is-discussion.has-preview {
  align-items: stretch;
  gap: 0;
}

.studio-cn-book-bar-preview-stage {
  flex: auto;
  align-self: stretch;
  align-items: center;
  min-width: 0;
  display: grid;
  position: relative;
  overflow: hidden;
}

.studio-cn-book-bar-preview-slide {
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  min-height: 100%;
  display: flex;
}

.studio-cn-book-bar-preview-slide.is-layer {
  grid-area: 1 / 1;
}

.studio-cn-book-bar-preview-slide.is-leave {
  animation: .26s cubic-bezier(.16, 1, .3, 1) both studio-cn-preview-leave;
}

.studio-cn-book-bar-preview-slide.is-enter {
  animation: .26s cubic-bezier(.16, 1, .3, 1) both studio-cn-preview-enter;
}

@keyframes studio-cn-preview-leave {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes studio-cn-preview-enter {
  from {
    transform: translate3d(0, 100%, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-cn-book-bar-preview-slide.is-leave, .studio-cn-book-bar-preview-slide.is-enter {
    animation: none;
  }
}

.studio-cn-book-bar-preview-avatar.studio-profile-avatar {
  --spa-size: 28px;
  --spa-font: 10px;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, var(--color-cursor-panel));
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  filter: none;
  flex: none;
}

.studio-cn-book-bar-preview-avatar.studio-profile-avatar:not(:has( > .studio-profile-avatar-media)) {
  background: none;
  border-color: #0000;
}

.studio-cn-book-bar-preview-copy {
  gap: 0;
  min-width: 0;
  line-height: 1.15;
  display: grid;
}

.studio-cn-book-bar-preview-copy strong {
  text-overflow: ellipsis;
  letter-spacing: 0;
  min-width: 0;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 10px;
  font-weight: 650;
  overflow: hidden;
}

.studio-cn-book-bar-preview-copy span {
  text-overflow: ellipsis;
  letter-spacing: -.01em;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 13px;
  font-weight: 650;
  overflow: hidden;
}

.studio-cn-book-bar-price .studio-academy-card-compare, .studio-cn-book-bar-compare {
  letter-spacing: 0;
  color: var(--cursor-accent, var(--mos-accent, #5b8cff));
  text-decoration: line-through;
  text-decoration-thickness: 1.5px;
  -webkit-text-decoration-color: color-mix(in srgb,
    var(--cursor-accent, #5b8cff) 70%,
    transparent);
  text-decoration-color: color-mix(in srgb,
    var(--cursor-accent, #5b8cff) 70%,
    transparent);
  opacity: 1;
  flex: none;
  margin: 0;
  font-size: .9em;
  font-weight: 700;
}

.studio-cn-book-bar-price .studio-academy-card-now {
  letter-spacing: -.015em;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 1.12em;
  font-weight: 800;
}

.studio-cn-book-bar-actions {
  flex: none;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
  overflow: visible;
}

.studio-cn-book-bar-react-wrap {
  z-index: 2;
  flex: none;
  position: relative;
  overflow: visible;
}

.studio-academy-reaction-balloons {
  z-index: 6;
  pointer-events: none;
  width: 56px;
  height: 132px;
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  overflow: visible;
  transform: translateX(-50%);
}

.studio-academy-reaction-balloon {
  bottom: 0;
  left: var(--rx);
  will-change: transform, opacity;
  filter: drop-shadow(0 1px 2px #0f121847);
  place-items: center;
  width: 26px;
  height: 26px;
  font-size: 22px;
  line-height: 1;
  animation: 1.85s cubic-bezier(.22, .61, .36, 1) forwards studio-academy-balloon;
  display: grid;
  position: absolute;
}

.studio-academy-reaction-balloon .studio-emoji {
  width: 22px;
  height: 22px;
}

@keyframes studio-academy-balloon {
  0% {
    opacity: 0;
    transform: translate3d(-50%, 8px, 0)scale(.55);
  }

  14% {
    opacity: 1;
    transform: translate3d(-50%, 0, 0)scale(1.1);
  }

  100% {
    opacity: 0;
    transform: translate3d(calc(-50% + var(--drift, 0px)), -118px, 0) scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-academy-reaction-balloon {
    animation-duration: .65s;
    animation-timing-function: linear;
  }
}

.studio-cn-book-bar-msg, .studio-cn-book-sidebar-head .public-offers-btn.is-icon {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  padding: 0 !important;
}

.studio-cn-book-bar-msg:hover:not(:disabled), .studio-cn-book-sidebar-head .public-offers-btn.is-icon:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover)) !important;
  color: var(--color-cursor-text, var(--mos-text)) !important;
}

.studio-cn-book-bar-msg svg, .studio-cn-book-sidebar-head .public-offers-btn.is-icon svg {
  stroke-width: 2px;
  width: 14px;
  height: 14px;
  fill: none !important;
}

.studio-cn-book-bar-msg.is-with-count {
  justify-content: center !important;
  align-items: center !important;
  gap: 5px !important;
  width: auto !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 10px !important;
  display: inline-flex !important;
}

.studio-cn-book-bar-msg.is-with-count span {
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
}

.studio-cn-book-bar-msg.is-with-count svg {
  stroke-width: 2px;
  width: 14px;
  height: 14px;
  fill: none !important;
}

.studio-cn-book-bar-react-emoji {
  font-size: 14px;
  line-height: 1;
}

.studio-cn-book-bar-msg.is-reaction.is-open {
  color: var(--color-cursor-text, var(--mos-text)) !important;
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 42%,
    var(--color-cursor-border-soft, var(--mos-border-soft))) !important;
}

.studio-cn-offer-detail.is-mobile .studio-cn-book-bar .public-offers-btn, .studio-academy-pane .studio-cn-book-bar .public-offers-btn {
  min-height: 0 !important;
}

.studio-cn-book-bar-cta {
  border-radius: var(--cursor-radius-pill, 999px) !important;
  flex: none !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
}

.studio-cn-book-bar-cta svg {
  width: 13px;
  height: 13px;
}

.studio-cn-book-bar-cta .studio-wam-pay-mark {
  filter: none;
  width: auto;
  height: 10px;
}

.studio-academy-comments-meta svg {
  stroke-width: 2px;
  fill: none !important;
}

.studio-cn-book-sheet {
  z-index: 120;
  pointer-events: none;
  overscroll-behavior: none;
  position: fixed;
  inset: 0;
}

.studio-cn-book-sheet-backdrop {
  display: none;
}

.studio-cn-book-sheet-panel {
  z-index: 2;
  min-height: 0;
  height: min(var(--studio-mobile-app-menu-sheet-height, 55dvh),
    640px);
  max-height: min(var(--studio-mobile-app-menu-sheet-full, 72dvh),
    calc(100dvh - 12px - env(safe-area-inset-top, 0px)));
  pointer-events: auto;
  overscroll-behavior: none;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--mos-plate, var(--cursor-surface, var(--color-cursor-sidebar)));
  box-shadow: var(--studio-mobile-sheet-shadow, 0 -10px 32px #00000047);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  will-change: height, transform;
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
  flex-direction: column;
  transition: height .14s cubic-bezier(.22, 1, .36, 1), max-height .14s cubic-bezier(.22, 1, .36, 1), border-radius .12s;
  animation: .22s cubic-bezier(.2, 0, .2, 1) studio-cn-book-sheet-in;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}

.studio-cn-book-sheet.is-entered .studio-cn-book-sheet-panel {
  animation: none;
}

.studio-polish.is-studio-mobile .studio-cn-book-sheet.is-academy-comments .studio-cn-book-sheet-panel {
  max-height: calc(100dvh
      - var(--studio-mobile-top-chrome, calc(44px + env(safe-area-inset-top, 0px)))
      - 8px
      - ((100vw - 20px) * 9 / 16)
      - 14px);
}

.studio-cn-book-sheet.is-leaving .studio-cn-book-sheet-panel {
  pointer-events: none;
  transition: transform .22s cubic-bezier(.22, 1, .36, 1) !important;
  transform: translate3d(0, 110%, 0) !important;
}

.studio-cn-book-sheet.is-leaving .studio-cn-book-sheet-backdrop {
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s;
}

.studio-cn-book-sheet.is-full .studio-cn-book-sheet-panel {
  border-radius: 14px 14px 0 0;
}

.studio-cn-book-sheet.is-dragging .studio-cn-book-sheet-panel {
  touch-action: none;
  transition: none !important;
  animation: none !important;
}

.studio-cn-book-sheet.is-dragging .studio-cn-book-sheet-body, .studio-cn-book-sheet.is-dragging .profile-comments-list {
  touch-action: none;
  overflow: hidden;
}

.studio-cn-book-sheet.is-settling .studio-cn-book-sheet-panel {
  transition: height .14s cubic-bezier(.22, 1, .36, 1), max-height .14s cubic-bezier(.22, 1, .36, 1), transform .14s cubic-bezier(.22, 1, .36, 1), border-radius .12s;
}

.studio-cn-book-sheet.is-academy-checkout .studio-cn-book-sheet-body {
  flex: auto;
  padding-bottom: 12px;
  overflow-y: auto;
}

.studio-cn-book-sheet.is-academy-lessons .studio-cn-book-sheet-body {
  flex-direction: column;
  min-height: 0;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.studio-cn-book-sheet.is-academy-lessons .studio-cn-sidebar-body {
  background: none;
  border: 0;
  flex: auto;
  height: 100%;
  min-height: 0;
}

.studio-cn-book-sheet.is-academy-lessons .studio-cn-rail-scroll {
  flex: auto;
  min-height: 0;
}

.studio-polish.is-studio-mobile .studio-cn-book-sheet.is-profile-comments .studio-cn-book-sheet-panel {
  bottom: calc(var(--studio-mobile-nav-height, 44px) + env(safe-area-inset-bottom, 0px));
  max-height: calc(100dvh - var(--studio-mobile-head-clear, 56px) - var(--studio-mobile-nav-height, 44px) -
      env(safe-area-inset-bottom, 0px));
  padding-bottom: 8px;
}

.studio-cn-book-sheet.is-academy-comments .studio-cn-book-sheet-body, .studio-cn-book-sheet.is-profile-comments .studio-cn-book-sheet-body {
  flex-direction: column;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.studio-cn-book-sheet.is-academy-comments .profile-comments-sheet-fill, .studio-cn-book-sheet.is-profile-comments .profile-comments-sheet-fill {
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  flex-direction: column;
  flex: auto;
  display: flex;
  overflow: hidden;
}

.studio-cn-book-sheet.is-academy-comments .profile-comments-head, .studio-cn-book-sheet.is-profile-comments .profile-comments-head, .studio-cn-book-sheet.is-academy-comments .profile-comments-search, .studio-cn-book-sheet.is-profile-comments .profile-comments-search, .studio-cn-book-sheet.is-academy-comments .profile-comments-composer, .studio-cn-book-sheet.is-profile-comments .profile-comments-composer, .studio-cn-book-sheet.is-academy-comments .profile-comments-composer.is-sheet-composer, .studio-cn-book-sheet.is-profile-comments .profile-comments-composer.is-sheet-composer {
  flex: none;
}

.studio-cn-book-sheet.is-academy-comments .profile-comments-list, .studio-cn-book-sheet.is-profile-comments .profile-comments-list {
  flex: auto;
}

.studio-cn-book-sheet.is-academy-comments .profile-comments-composer, .studio-cn-book-sheet.is-profile-comments .profile-comments-composer, .studio-cn-book-sheet.is-academy-comments .profile-comments-composer.is-sheet-composer, .studio-cn-book-sheet.is-profile-comments .profile-comments-composer.is-sheet-composer {
  background: none;
  border-top: none;
  flex: none;
  padding: 0 10px 10px;
}

.studio-cn-book-sidebar-body.is-comments-fill .profile-comments-composer {
  background: none;
  padding: 0 8px 8px;
  border-top: none !important;
}

.studio-academy-lessons-sheet-btn {
  width: var(--studio-mobile-chrome-control, 34px);
  min-width: var(--studio-mobile-chrome-control, 34px);
  height: var(--studio-mobile-chrome-control, 34px);
  min-height: var(--studio-mobile-chrome-control, 34px);
  border: 1px solid var(--studio-mobile-chrome-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  background: var(--studio-mobile-chrome-glass-foot, var(--mos-plate, var(--mos-panel)));
  color: color-mix(in srgb, var(--color-cursor-text-bright, var(--mos-text)) 86%, transparent);
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-academy-lessons-sheet-btn svg {
  flex: none;
  width: 15px;
  height: 15px;
}

.studio-academy-lessons-sheet-btn:hover {
  color: var(--color-cursor-text-bright, var(--mos-text));
  background: var(--color-cursor-hover);
}

.studio-academy-lessons-sheet-btn.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 42%, var(--studio-mobile-chrome-border, var(--color-cursor-border-soft)));
  background: color-mix(in srgb, var(--cursor-accent) 14%, var(--studio-mobile-chrome-glass-foot, var(--mos-plate)));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

@keyframes studio-cn-book-sheet-in {
  from {
    opacity: .88;
    transform: translate3d(0, 16px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.studio-cn-book-sheet-handle {
  touch-action: none;
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
  flex: none;
  justify-content: center;
  align-items: center;
  min-height: 28px;
  padding: 10px 0 4px;
  display: flex;
}

.studio-cn-book-sheet.is-dragging .studio-cn-book-sheet-handle {
  cursor: grabbing;
}

.studio-cn-book-sheet-grab {
  background: color-mix(in srgb, var(--mos-text, var(--color-cursor-text, #111)) 40%, transparent);
  pointer-events: none;
  border-radius: 999px;
  width: 44px;
  height: 5px;
}

.studio-cn-book-sheet-body {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  scrollbar-width: none;
  flex: auto;
  min-width: 0;
  min-height: 0;
  padding: 2px 12px 16px;
  overflow: hidden auto;
}

.studio-cn-book-sheet-body::-webkit-scrollbar {
  display: none;
}

.studio-cn-book-sheet-body .public-offers-rail-detail {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 0;
}

.studio-cn-book-sheet .public-offers-panel > :not(h2), .studio-cn-book-sidebar .public-offers-panel > :not(h2) {
  margin-left: 14px;
  margin-right: 14px;
}

.studio-cn-book-sheet .public-offers-panel > :not(h2):first-of-type, .studio-cn-book-sidebar .public-offers-panel > :not(h2):first-of-type {
  margin-top: 12px;
}

.studio-cn-book-sheet .public-offers-panel > :not(h2):last-child, .studio-cn-book-sidebar .public-offers-panel > :not(h2):last-child {
  margin-bottom: 12px;
}

.studio-cn-book-sheet .public-offers-panel, .studio-cn-book-sidebar .public-offers-panel {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.studio-cn-book-sheet .public-offers-btn.is-block, .studio-cn-book-sidebar .public-offers-btn.is-block {
  box-sizing: border-box;
  justify-self: stretch;
  width: auto;
  max-width: none;
}

.studio-cn-book-message-row {
  font-weight: 650;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-height: 34px !important;
  padding: 0 10px !important;
}

.studio-polish:not(.is-studio-mobile) {
  --studio-academy-bar-inset: var(--studio-desktop-head-inset, 4px);
  --studio-academy-bar-top: var(--studio-desktop-head-clear, 44px);
  --studio-academy-scroll-pad: calc(var(--studio-academy-bar-top) + 36px + 4px);
}

.studio-polish.is-studio-mobile {
  --studio-academy-bar-inset: 8px;
  --studio-academy-bar-top: var(--studio-mobile-head-clear, 56px);
  --studio-academy-scroll-pad: calc(var(--studio-academy-bar-top) + 36px + 4px);
}

.studio-academy-pane {
  position: relative;
}

.studio-academy-pane .studio-cn-head, .studio-academy-pane .studio-academy-head, [data-appearance="light"] .studio-polish .studio-academy-pane .studio-cn-head, [data-appearance="light"] .studio-polish .studio-academy-pane .studio-academy-head {
  z-index: calc(var(--studio-z-base) + 8);
  left: var(--studio-academy-bar-inset, 4px);
  right: var(--studio-academy-bar-inset, 4px);
  pointer-events: none;
  border-radius: 0;
  width: auto;
  max-height: none;
  margin: 0;
  top: var(--studio-academy-bar-top, var(--studio-desktop-head-clear, 44px)) !important;
  height: auto !important;
  min-height: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  position: absolute !important;
}

.studio-academy-pane .studio-cn-head > *, .studio-academy-pane .studio-academy-head > * {
  pointer-events: auto;
}

.studio-academy-head {
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-academy-head-tabs-wrap {
  flex: none;
  min-width: 0;
}

.studio-academy-pane .studio-academy-head-tabs.studio-admin-head-tabs, [data-appearance="light"] .studio-academy-pane .studio-academy-head-tabs.studio-admin-head-tabs {
  background: var(--mos-page, #fff);
  flex: none;
  width: auto;
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  padding: 2px;
}

.studio-academy-head-back, .studio-academy-head-nav-btn, .studio-academy-pane .studio-academy-lessons-sheet-btn {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  height: 36px;
  min-height: 36px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 650;
  display: inline-flex;
}

.studio-academy-head-nav-btn, .studio-academy-pane .studio-academy-lessons-sheet-btn {
  width: 36px;
  min-width: 36px;
  padding: 0;
}

.studio-academy-head-back > svg, .studio-academy-head-nav-btn svg, .studio-academy-pane .studio-academy-lessons-sheet-btn svg {
  flex: none;
  width: 15px;
  height: 15px;
}

.studio-academy-head-tools, .studio-academy-head-nav {
  align-items: center;
  gap: 4px;
  margin-left: auto;
  display: flex;
}

.studio-academy-head-nav-btn:disabled {
  opacity: .4;
  cursor: default;
}

.studio-academy-pane > .studio-cn-body, .studio-academy-pane .studio-cn-main-col > .studio-cn-body, .studio-academy-pane .studio-cn-body.is-catalog, .studio-academy-pane .public-offers-main {
  background: none;
  padding-top: 0;
}

.studio-academy-pane .public-offers-main-scroll {
  padding-top: var(--studio-academy-scroll-pad, calc(var(--studio-desktop-head-clear, 44px) + 40px)) !important;
}

.studio-polish.is-studio-mobile .studio-academy-pane .public-offers-main-scroll {
  padding-bottom: calc(var(--studio-mobile-nav-height, 44px) + env(safe-area-inset-bottom, 0px) + 12px);
}

.studio-academy-pane .public-offers-body {
  padding: 0 var(--studio-academy-bar-inset, 4px) 40px;
  gap: 12px;
}

.studio-academy-filters {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  padding: 0 8px 16px;
  display: flex;
}

.studio-academy-right-rail .studio-chrome-settings-card, .studio-academy-right-rail .studio-chrome-settings-row, .studio-academy-filters .studio-chrome-settings-card, .studio-academy-filters .studio-chrome-settings-row {
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
}

.studio-academy-right-rail .cursor-panel-search, .studio-academy-filters > .cursor-panel-search {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  box-shadow: none;
  border-radius: 999px;
  margin: 0;
  padding: 0 14px;
}

.studio-academy-filters .cursor-select-menu {
  width: 100%;
}

.studio-polish:not(.is-studio-mobile) .studio-academy-pane .studio-academy-rail-slot, .studio-polish:not(.is-studio-mobile) .studio-academy-pane .studio-cn-right-rail, .studio-polish:not(.is-studio-mobile) .studio-academy-pane .studio-cn-book-panel, .studio-polish:not(.is-studio-mobile) .studio-academy-pane .studio-academy-comments-panel {
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-academy-pane .cursor-resize, .studio-polish:not(.is-studio-mobile) .studio-academy-pane .cursor-resize:hover, .studio-polish:not(.is-studio-mobile) .studio-academy-pane .cursor-resize[data-resize-handle-active] {
  width: 8px;
  margin: 0 -3px;
  background: none !important;
}

.studio-academy-pane aside.studio-academy-right-rail {
  margin-top: var(--studio-academy-bar-top, 40px) !important;
  height: calc(100% - var(--studio-academy-bar-top, 40px) - 4px) !important;
}

.studio-academy-pane .studio-cn-main-col {
  position: relative;
}

.studio-academy-rail-title {
  min-width: 0;
  padding: 0 4px;
  font-size: 13px;
  font-weight: 650;
  line-height: 36px;
}

.studio-academy-right-rail .studio-academy-rail-scroll {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  overflow: hidden auto;
}

.studio-academy-right-rail .studio-cn-sidebar-body, .studio-academy-right-rail .studio-cn-rail-scroll, .studio-academy-right-rail .studio-cn-book-sidebar-body {
  flex: none;
  height: auto;
  min-height: 0;
  display: block;
  overflow: visible;
}

.studio-academy-pane .public-offers-hero {
  background: #111113;
  border-color: #0000;
}

.studio-academy-pane .public-offers-hero:after {
  background: linear-gradient(#00000047 0%, #00000085 48%, #000000c7 100%);
}

.studio-academy-pane .public-offers-hero h1 {
  color: #fff;
  text-shadow: 0 1px 12px #00000073;
}

.studio-academy-pane .public-offers-hero p {
  color: #ffffffe0;
  text-shadow: 0 1px 12px #00000073;
}

.studio-academy-pane .public-offers-hero-icon {
  color: #fff;
  opacity: .16;
}

.studio-academy-card.public-offers-card {
  border-radius: 22px;
  padding: 12px;
}

.studio-academy-card-media.public-offers-card-media {
  border-radius: 16px;
  margin: 0;
}

.studio-academy-card-owned {
  color: #fff;
  background: #000000b8;
  border-color: #ffffff1f;
  top: 10px;
  left: auto;
  right: 10px;
}

/* [project]/src/studio/components/studio-dm-call.css [app-client] (css) */
.studio-dm-call-ring-overlay {
  z-index: 200001;
}

.studio-dm-call-ring-inner .studio-profile-avatar {
  width: 5.5rem;
  height: 5.5rem;
}

.studio-dm-call-ring-actions {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  width: min(100%, 320px);
  display: flex;
}

.studio-dm-call-ring-primary-row {
  gap: 10px;
  width: 100%;
  display: flex;
}

.studio-dm-call-ring-primary-row .studio-payment-celebration-btn {
  border-radius: 999px;
  flex: 1 1 0;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 3.5rem;
  min-width: 0;
  height: 3.5rem;
  margin: 0 auto;
  padding: 0;
  display: inline-flex;
}

.studio-dm-call-ring-primary-row .studio-payment-celebration-btn svg {
  width: 1.4rem;
  height: 1.4rem;
}

.studio-dm-call-ring-actions > .studio-dm-call-ring-ignore {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, #d0d5dc) 78%, transparent);
  background: var(--mos-plate);
  color: var(--mos-text, #1a1a22);
  letter-spacing: -.005em;
  cursor: pointer;
  border-radius: 999px;
  align-self: center;
  margin-top: 2px;
  padding: .45rem 1.15rem;
  font-size: .85rem;
  font-weight: 560;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
  box-shadow: 0 1px 2px #0000000f;
}

[data-appearance="dark"] .studio-dm-call-ring-actions > .studio-dm-call-ring-ignore {
  background: var(--mos-plate-strong, #2a2a34);
  border-color: color-mix(in srgb, var(--color-cursor-border-soft, #2a2a34) 88%, transparent);
  color: var(--mos-text);
}

.studio-dm-call-ring-actions > .studio-dm-call-ring-ignore:hover {
  background: color-mix(in srgb, var(--mos-plate) 70%, var(--mos-accent, #6366f1) 12%);
  border-color: color-mix(in srgb, var(--mos-accent, #6366f1) 30%, var(--color-cursor-border, var(--mos-border)));
  color: var(--mos-text-bright, var(--mos-text));
}

.studio-dm-call-ring-actions > .studio-dm-call-ring-ignore:disabled {
  opacity: .55;
  cursor: default;
}

.studio-dm-call-ring-actions > .studio-payment-celebration-btn.is-danger:only-child {
  border-radius: 999px;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 3.5rem;
  height: 3.5rem;
  margin: 0 auto;
  padding: 0;
  display: inline-flex;
}

.studio-dm-call-ring-actions > .studio-payment-celebration-btn.is-danger:only-child svg {
  width: 1.4rem;
  height: 1.4rem;
}

.studio-dm-call-secondary-head {
  min-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-panel, var(--mos-page, var(--color-cursor-bg)));
  flex: none;
  align-items: center;
  gap: .65rem;
  padding: 0 .75rem;
  display: flex;
}

.studio-dm-call-ring-bar {
  background: color-mix(in srgb, var(--mos-plate, #15151a) 92%, var(--mos-success, #22c55e) 8%);
  position: relative;
  overflow: hidden;
}

.studio-dm-call-ring-bar-pulse {
  background: color-mix(in srgb, var(--mos-success, #22c55e) 16%, transparent);
  pointer-events: none;
  animation: 1.4s ease-in-out infinite studio-dm-call-chip-pulse;
  position: absolute;
  inset: 0;
}

.studio-dm-call-ring-bar .studio-dm-call-compact-main, .studio-dm-call-ring-bar .studio-dm-call-compact-actions {
  z-index: 1;
  position: relative;
}

.studio-dm-call-ring-bar-btn {
  border-width: 1px;
  width: 1.85rem;
  height: 1.85rem;
}

.studio-dm-call-ring-bar-btn svg {
  width: .85rem;
  height: .85rem;
}

@keyframes studio-dm-call-chip-pulse {
  0%, 100% {
    opacity: .35;
  }

  50% {
    opacity: .85;
  }
}

.studio-dm-call-compact-bar {
  background: color-mix(in srgb, var(--mos-plate, #15151a) 94%, var(--mos-success, #22c55e) 6%);
}

.studio-dm-call-compact-main {
  min-width: 0;
  color: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  flex: 1;
  align-items: center;
  gap: .55rem;
  padding: 0;
  display: inline-flex;
}

.studio-dm-call-compact-copy {
  flex-direction: column;
  min-width: 0;
  line-height: 1.15;
  display: flex;
}

.studio-dm-call-compact-copy strong, .studio-dm-call-compact-copy span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-dm-call-compact-copy strong {
  font-size: .78rem;
  font-weight: 650;
}

.studio-dm-call-compact-copy span {
  color: var(--mos-text-muted, #9ca3af);
  font-size: .68rem;
}

.studio-dm-call-compact-actions {
  flex-shrink: 0;
  align-items: center;
  gap: .45rem;
  display: inline-flex;
}

.studio-dm-call-stage-wrap {
  background: var(--mos-page, #0b0b0f);
  flex-direction: column;
  flex: auto;
  gap: .75rem;
  min-width: 0;
  min-height: 0;
  padding: .75rem;
  display: flex;
  overflow: hidden;
}

.studio-dm-call-stage-wrap.is-stage-only {
  background: #111;
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.studio-dm-call-stage-wrap.is-stage-only .studio-dm-call-stage, .studio-dm-call-stage-wrap.is-stage-only .studio-dm-call-voice-stage {
  border-radius: 0;
  flex: 1;
  min-height: 0;
}

.studio-dm-call-stage-head {
  color: var(--mos-text-muted, #9ca3af);
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  font-size: .8125rem;
  display: flex;
}

.studio-dm-call-stage-minimize {
  color: var(--cursor-accent, var(--mos-accent));
  cursor: pointer;
  background: none;
  border: 0;
  font-size: .8125rem;
  font-weight: 600;
}

.studio-dm-call-voice-stage {
  text-align: center;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: .65rem;
  min-height: 14rem;
  display: flex;
}

.studio-dm-call-voice-stage strong {
  font-size: 1.05rem;
}

.studio-dm-call-voice-stage span {
  color: var(--mos-text-muted, #9ca3af);
  font-size: .875rem;
}

.studio-dm-call-ring-halo {
  border-radius: 999px;
  place-items: center;
  display: grid;
  position: relative;
}

.studio-dm-call-ring-halo.is-ringing:before, .studio-dm-call-ring-halo.is-ringing:after {
  content: "";
  border: 2px solid color-mix(in srgb, var(--cursor-accent) 42%, transparent);
  pointer-events: none;
  border-radius: 999px;
  animation: 1.8s ease-out infinite studio-dm-call-ring;
  position: absolute;
  inset: -12px;
}

.studio-dm-call-ring-halo.is-ringing:after {
  animation-delay: .9s;
}

@keyframes studio-dm-call-ring {
  0% {
    opacity: .65;
    transform: scale(.92);
  }

  100% {
    opacity: 0;
    transform: scale(1.38);
  }
}

.studio-dm-call-stage {
  aspect-ratio: auto;
  background: #000;
  border-radius: .75rem;
  flex: 1;
  min-height: 12rem;
  position: relative;
  overflow: hidden;
}

.studio-dm-call-remote, .studio-dm-call-local {
  position: absolute;
  inset: 0;
}

.studio-dm-call-local {
  border: 1px solid #ffffff2e;
  border-radius: .65rem;
  width: 7rem;
  height: 9rem;
  inset: auto .75rem .75rem auto;
  overflow: hidden;
  box-shadow: 0 8px 24px #00000073;
}

.studio-dm-call-video {
  object-fit: cover;
  background: #000;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-call-audio-host {
  display: none;
}

.studio-dm-call-error {
  color: var(--mos-danger, #f87171);
  text-align: center;
  margin: 0;
  font-size: .8125rem;
}

.studio-dm-call-actions {
  justify-content: center;
  align-items: center;
  gap: .85rem;
  display: flex;
  overflow: visible;
}

.studio-dm-call-stage-actions {
  padding: .4rem 0 .6rem;
}

.studio-dm-call-btn {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  width: 3rem;
  height: 3rem;
  color: var(--mos-text);
  background: var(--mos-page, var(--color-cursor-panel, #12141a));
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  transition: background .15s, border-color .15s, color .15s;
  display: inline-flex;
}

.studio-dm-call-btn svg {
  width: 1.15rem;
  height: 1.15rem;
}

.studio-dm-call-btn:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover));
  border-color: var(--color-cursor-border, var(--mos-border));
}

.studio-dm-call-btn.is-expand {
  background: var(--mos-page, var(--color-cursor-panel, #12141a));
  width: 2.5rem;
  height: 2.5rem;
  color: var(--mos-text);
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
}

.studio-dm-call-btn.is-expand svg {
  width: 1rem;
  height: 1rem;
}

.studio-dm-call-btn:disabled {
  opacity: .55;
  cursor: default;
}

.studio-dm-call-btn.is-accept {
  background: var(--mos-success, #16a34a);
  border-color: var(--mos-success, #16a34a);
  color: var(--cursor-on-accent);
}

.studio-dm-call-btn.is-decline {
  background: var(--mos-danger, #dc2626);
  border-color: var(--mos-danger, #dc2626);
  color: var(--cursor-on-accent);
}

.studio-dm-call-btn.is-decline:hover:not(:disabled) {
  background: color-mix(in srgb, var(--mos-danger, #dc2626) 88%, #000 12%);
  border-color: color-mix(in srgb, var(--mos-danger, #dc2626) 88%, #000 12%);
}

.studio-dm-call-btn.is-toggle {
  background: var(--mos-page, var(--color-cursor-panel, #12141a));
  color: var(--mos-text);
}

.studio-dm-call-btn.is-toggle.is-on {
  color: #fff;
  background: #b45309;
  border-color: #b45309;
}

.studio-dm-call-spin {
  width: 1.1rem;
  height: 1.1rem;
  animation: .8s linear infinite studio-dm-call-spin;
}

@keyframes studio-dm-call-spin {
  to {
    transform: rotate(360deg);
  }
}

.studio-dm-call-log {
  justify-content: center;
  padding: .35rem 0;
  display: flex;
}

.studio-dm-call-log span {
  background: var(--mos-plate, var(--mos-panel));
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-2xs, 10px);
  letter-spacing: .03em;
  text-transform: uppercase;
  border-radius: 999px;
  align-items: center;
  gap: .35rem;
  padding: 3px 10px;
  font-weight: 650;
  display: inline-flex;
}

.studio-dm-chat-head-tools .studio-dm-call-btn-head:disabled {
  opacity: .45;
}

.studio-dm-chat-column:has(.studio-dm-call-stage-wrap) {
  min-height: 0;
}

.studio-dm-call-stage.is-gallery, .studio-dm-call-stage.has-focus, .studio-dm-call-stage.has-screen-share, .studio-dm-call-screen-cell, .studio-dm-call-participant-strip, .studio-dm-call-tile-cell {
  min-width: 0;
  min-height: 0;
}

.studio-dm-call-stage.is-gallery, .studio-dm-call-stage.has-focus {
  box-sizing: border-box;
  justify-content: center;
  align-items: stretch;
  padding: 8px;
  display: flex;
}

.studio-dm-call-stage.has-focus {
  box-sizing: border-box;
  background: none;
  grid-template-columns: 168px minmax(0, 1fr);
  grid-template-areas: "rail main";
  gap: 8px;
  padding: 8px;
  display: grid;
}

.studio-dm-call-stage.has-focus:has(.studio-dm-call-participant-strip:empty) {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "main";
}

.studio-dm-call-stage.has-focus .studio-dm-call-participant-strip:empty {
  display: none;
}

.studio-dm-call-screen-cell, .studio-dm-call-tile-cell {
  place-items: center;
  display: grid;
  position: relative;
  container-type: size;
}

.studio-dm-call-screen-cell {
  grid-area: main;
  place-items: start center;
  overflow: visible;
}

.studio-dm-call-participant-strip {
  grid-area: rail;
  grid-auto-rows: 96px;
  align-content: start;
  gap: 8px;
  display: grid;
  overflow: hidden auto;
}

.studio-dm-call-participant-strip .studio-dm-call-tile-cell {
  background: var(--mos-plate);
  isolation: isolate;
  border-radius: 12px;
  height: 96px;
  overflow: hidden;
  transform: translateZ(0);
}

.studio-dm-call-tile-frame {
  --studio-call-video-ratio: 1.77778;
  background: var(--mos-plate);
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  box-shadow: none;
  border: 0;
  border-radius: 0;
  outline: none;
  position: relative;
  overflow: hidden;
}

.studio-dm-call-tile-frame.is-featured {
  width: min(100cqw, calc(100cqh * var(--studio-call-video-ratio)));
  height: auto;
  aspect-ratio: var(--studio-call-video-ratio);
  background: var(--mos-plate);
  border-radius: 12px;
}

.studio-dm-call-tile-frame.is-screen-share {
  --studio-call-video-ratio: 1.77778;
}

.studio-dm-call-tile-frame.is-local {
  box-shadow: none;
}

.studio-dm-call-tile-media {
  z-index: 1;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-dm-call-tile-media .studio-dm-call-video {
  object-fit: contain;
}

.studio-dm-call-video-off {
  z-index: 0;
  background: var(--mos-plate);
  color: var(--mos-text);
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0;
}

.studio-dm-call-tile-frame.is-featured .studio-dm-call-video-off {
  background: var(--mos-plate);
}

.studio-dm-call-video-off.is-blocked {
  color: #ffffffd1;
  background: #111;
  flex-direction: column;
  gap: 10px;
}

.studio-dm-call-video-off.is-blocked > svg {
  width: 28px;
  height: 28px;
  color: inherit;
  position: static;
}

.studio-dm-call-tile-frame.is-featured .studio-dm-call-video-off.is-blocked > svg {
  width: 36px;
  height: 36px;
}

.studio-dm-call-video-off.is-blocked > span {
  letter-spacing: -.01em;
  font-size: 13px;
  font-weight: 600;
}

.studio-dm-call-tile-frame:not(.is-featured) .studio-dm-call-video-off.is-blocked > span {
  font-size: 11px;
}

.studio-dm-call-video-off .studio-profile-avatar {
  --spa-size: 40px;
  --spa-font: 12px;
}

.studio-dm-call-tile-frame.is-featured .studio-dm-call-video-off .studio-profile-avatar {
  --spa-size: 68px;
  --spa-font: 20px;
}

.studio-dm-call-video-off > svg {
  width: 14px;
  height: 14px;
  color: var(--mos-text-muted, #9ca3af);
  position: absolute;
  top: 8px;
  right: 8px;
}

.studio-dm-call-tile-name {
  z-index: 2;
  color: #fff;
  letter-spacing: .01em;
  white-space: nowrap;
  pointer-events: none;
  background: #00000094;
  border-radius: 999px;
  align-items: center;
  gap: 4px;
  max-width: calc(100% - 12px);
  padding: 1px 6px;
  font-size: 9px;
  font-weight: 600;
  line-height: 1.25;
  display: inline-flex;
  position: absolute;
  bottom: 6px;
  left: 6px;
  overflow: hidden;
}

.studio-dm-call-tile-name-label {
  text-overflow: ellipsis;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-call-host-tag {
  letter-spacing: .04em;
  text-transform: uppercase;
  background: #ffffff38;
  border-radius: 999px;
  flex: none;
  padding: 0 5px;
  font-size: 8px;
  font-weight: 700;
}

.studio-dm-call-camera-empty {
  color: #ffffffad;
  flex-direction: column;
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.studio-dm-call-camera-empty svg {
  width: 22px;
  height: 22px;
}

@media (max-width: 899px) {
  .studio-dm-call-stage.is-gallery, .studio-dm-call-stage.has-focus {
    padding: 6px;
  }

  .studio-dm-call-stage.has-focus {
    grid-template: "main" minmax(0, 1fr)
                   "rail" 104px
                   / minmax(0, 1fr);
    gap: 6px;
  }

  .studio-dm-call-stage.has-focus:has(.studio-dm-call-participant-strip:empty) {
    grid-template: "main" minmax(0, 1fr)
    / minmax(0, 1fr);
  }

  .studio-dm-call-participant-strip {
    gap: 6px;
    display: flex;
    overflow: auto hidden;
  }

  .studio-dm-call-participant-strip .studio-dm-call-tile-cell {
    flex: 0 0 min(42vw, 156px);
    height: 104px;
  }
}

@media (max-width: 899px) and (orientation: landscape) {
  .studio-dm-call-stage.has-focus {
    grid-template: "rail main" minmax(0, 1fr)
    / minmax(96px, 22vw) minmax(0, 1fr);
  }

  .studio-dm-call-stage.has-focus:has(.studio-dm-call-participant-strip:empty) {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "main";
  }

  .studio-dm-call-participant-strip {
    grid-auto-rows: 72px;
    align-content: start;
    display: grid;
    overflow: hidden auto;
  }

  .studio-dm-call-participant-strip .studio-dm-call-tile-cell {
    flex: none;
    height: 72px;
  }
}

.studio-dm-call-stage-actions .studio-dm-call-btn {
  min-width: 44px;
  min-height: 44px;
}

.studio-dm-call-btn.is-record-control svg {
  fill: currentColor;
  width: 14px;
  height: 14px;
}

.studio-dm-call-rec-pill {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--mos-danger, #ef4444);
  margin-left: auto;
  margin-right: 8px;
  font-size: .7rem;
  font-weight: 700;
}

.studio-dm-join-banner {
  background: var(--mos-plate);
  border-radius: 10px;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin: 8px 12px 0;
  padding: 8px 10px;
  display: flex;
}

.studio-dm-join-banner button {
  background: var(--mos-plate-strong);
  min-height: 32px;
  color: var(--mos-text);
  cursor: pointer;
  border: 0;
  border-radius: 8px;
  margin-left: auto;
  padding: 0 12px;
  font-weight: 600;
}

.studio-dm-system {
  text-align: center;
  color: var(--mos-text-muted, #8e8e93);
  padding: .4rem 0;
  font-size: .75rem;
}

.studio-dm-reactions {
  background: var(--mos-plate, var(--color-cursor-sidebar));
  border-radius: 999px;
  align-items: center;
  gap: 0;
  margin-top: -7px;
  padding: 1px 5px;
  display: inline-flex;
}

.studio-dm-reaction {
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 0;
  align-items: center;
  height: 16px;
  padding: 0 1px;
  font-size: .75rem;
  display: inline-flex;
}

.studio-dm-reaction.is-mine {
  background: var(--mos-plate-strong);
}

.studio-dm-recording-card {
  border-radius: 10px;
  flex-direction: column;
  gap: 0;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-dm-transcript {
  color: var(--mos-text);
  white-space: pre-wrap;
  font-size: .8rem;
  line-height: 1.4;
}

.studio-dm-call-waiting {
  text-align: center;
  color: var(--mos-text);
  flex-direction: column;
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 24px 16px;
  display: flex;
}

.studio-dm-call-waiting strong {
  font-size: 15px;
  font-weight: 650;
}

.studio-dm-call-waiting span {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
}

.studio-dm-call-host-menu {
  display: inline-flex;
  position: relative;
}

.studio-dm-call-host-badge {
  background: var(--mos-accent, var(--color-cursor-accent));
  min-width: 14px;
  height: 14px;
  color: var(--mos-page);
  text-align: center;
  border-radius: 999px;
  padding: 0 4px;
  font-size: 9px;
  font-weight: 700;
  line-height: 14px;
  position: absolute;
  top: -2px;
  right: -2px;
}

.studio-dm-call-host-panel {
  z-index: 40;
  flex-direction: column;
  gap: 0;
  width: min(260px, 78vw);
  padding: 0;
  display: flex;
  position: absolute;
  bottom: calc(100% + 8px);
  right: 0;
  overflow: visible;
}

.studio-dm-call-host-panel .studio-admin-head-tabs {
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  flex: none;
  align-self: stretch;
  padding: 0 8px;
}

.studio-dm-call-host-panel .studio-admin-head-tab {
  min-height: 24px;
  padding: 0 8px;
  font-size: 11px;
}

.studio-dm-call-host-panel .studio-chrome-settings-row:last-child {
  border-bottom: 0;
}

.studio-dm-call-waiting-list {
  flex-direction: column;
  gap: 0;
  padding: 4px 0;
  display: flex;
}

.studio-dm-call-waiting-empty {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  margin: 0;
  padding: 10px 12px;
  font-size: 12px;
  font-weight: 600;
}

.studio-dm-call-host-panel .studio-chrome-settings-row, .studio-dm-call-waiting-row {
  width: 100%;
  min-height: var(--cursor-section-h, 36px);
  border: 0;
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  color: var(--mos-text, var(--color-cursor-text));
  font: inherit;
  text-align: left;
  background: none;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
  overflow: visible;
}

.studio-dm-call-waiting-row {
  border-bottom: 0;
  justify-content: flex-start;
}

.studio-dm-call-waiting-row > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--mos-text);
  flex: auto;
  font-size: 12px;
  font-weight: 600;
  overflow: hidden;
}

.cursor-workspace-head > .studio-header-call {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--color-cursor-panel));
  pointer-events: auto;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-self: stretch;
  align-items: center;
  gap: 2px;
  width: 36px;
  height: 100%;
  margin: 0;
  padding: 2px;
  transition: width .2s;
  display: flex;
  overflow: hidden;
}

.cursor-workspace-head > .studio-header-call.is-open {
  width: 64px;
}

.studio-header-call-btn {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  cursor: pointer;
  width: 28px;
  height: 28px;
  color: var(--cursor-on-accent);
  border-radius: 999px;
  flex: 0 0 28px;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
}

.studio-header-call-btn svg {
  flex: none;
  width: 15px;
  height: 15px;
}

.studio-header-call-btn.is-primary {
  background: var(--cursor-accent);
  transition: background-color .28s, filter .28s;
  position: relative;
}

.studio-header-call.is-open .studio-header-call-btn.is-primary {
  filter: none;
  background: #16a34a;
}

.studio-header-call-btn.is-hangup {
  background: #e11d48;
}

.studio-polish.is-studio-mobile .cursor-workspace-head > .studio-header-call {
  width: var(--cursor-head-h, 44px);
  padding: 3px;
}

.studio-polish.is-studio-mobile .cursor-workspace-head > .studio-header-call.is-open {
  width: calc(var(--cursor-head-h, 44px) * 2 - 6px);
}

.studio-polish.is-studio-mobile .studio-header-call-btn {
  flex-basis: 36px;
  width: 36px;
  height: 36px;
}

.studio-polish.is-studio-mobile .studio-header-call-btn svg {
  width: 17px;
  height: 17px;
}

.studio-header-call.is-ringing .studio-header-call-btn.is-primary:before {
  content: "";
  border-radius: inherit;
  border: 2px solid #0000;
  border-top-color: var(--cursor-on-accent);
  border-right-color: color-mix(in srgb, var(--cursor-on-accent) 40%, transparent);
  pointer-events: none;
  animation: .9s linear infinite studio-header-call-ring;
  position: absolute;
  inset: 1px;
}

.studio-header-call-eq {
  align-items: flex-end;
  gap: 2px;
  height: 12px;
  display: inline-flex;
}

.studio-header-call-eq span {
  background: currentColor;
  border-radius: 999px;
  width: 2px;
  height: 4px;
  animation: .9s ease-in-out infinite studio-header-call-eq;
  display: block;
}

.studio-header-call-eq span:nth-child(2) {
  animation-delay: .15s;
}

.studio-header-call-eq span:nth-child(3) {
  animation-delay: .3s;
}

.studio-header-call-spin {
  animation: .8s linear infinite studio-header-call-ring;
}

@keyframes studio-header-call-ring {
  to {
    transform: rotate(360deg);
  }
}

@keyframes studio-header-call-eq {
  0%, 100% {
    height: 4px;
  }

  50% {
    height: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-header-call.is-ringing .studio-header-call-btn.is-primary:before, .studio-header-call-eq span, .studio-header-call-spin {
    animation: none;
  }
}

.studio-call-state-text {
  background: linear-gradient(90deg, #f59e0b 0%, #facc15 25%, #fff1a8 50%, #fb923c 75%, #f97316 100%) 0 0 / 200% 100%;
  color: #0000;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  font-weight: 600;
  animation: 5s ease-in-out infinite studio-call-state-sheen;
}

@keyframes studio-call-state-sheen {
  0%, 100% {
    background-position: 200% 0;
  }

  50% {
    background-position: -200% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-call-state-text {
    animation: none;
  }
}

/* [project]/src/studio/components/studio-dm-empty.css [app-client] (css) */
.studio-dm-empty-state {
  box-sizing: border-box;
  flex: auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin-inline: auto;
  padding: 16px;
  display: flex;
}

.studio-dm-empty-state.is-select {
  padding: 16px;
}

.studio-dm-empty-state.is-compact {
  padding: 12px;
}

.studio-dm-empty-card {
  aspect-ratio: 1;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  background: color-mix(in srgb, var(--mos-surface) 58%, transparent);
  width: min(72vw, 17.5rem);
  height: auto;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright) 7%, transparent),
    0 1px 2px #00000014,
    0 4px 10px #0000000f;
  text-align: center;
  color: var(--color-cursor-muted, var(--mos-muted));
  border-radius: 50%;
  place-content: center;
  justify-items: center;
  gap: 16px;
  padding: 28px 22px;
  display: grid;
}

[data-appearance="light"] .studio-dm-empty-card {
  background: color-mix(in srgb, var(--mos-plate) 92%, transparent);
  box-shadow: inset 0 1px #ffffff8c, 0 1px 2px #0000000d, 0 4px 10px #0000000a;
}

.studio-dm-empty-state.is-compact .studio-dm-empty-card {
  border-radius: 50%;
  gap: 12px;
  width: min(70vw, 14.5rem);
  padding: 20px 16px;
}

.studio-dm-empty-copy {
  gap: 6px;
  display: grid;
}

.studio-dm-empty-copy strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  letter-spacing: -.02em;
  font-size: clamp(13px, 2.1vw, 14px);
  font-weight: 600;
  line-height: 1.2;
}

.studio-dm-empty-copy p {
  font-size: var(--desk-text-sm, 12.5px);
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-weight: 520;
  line-height: 1.45;
}

.studio-dm-empty-state.is-compact .studio-dm-empty-copy strong {
  font-size: 13px;
}

.studio-dm-empty-state.is-compact .studio-dm-empty-copy p {
  font-size: 11px;
}

.studio-dm-empty-art {
  justify-content: center;
  width: 100%;
  display: flex;
}

.studio-dm-empty-art-frame {
  --studio-dm-balloon: 48px;
  grid-template-columns: repeat(2, var(--studio-dm-balloon));
  grid-template-rows: auto auto;
  gap: 14px;
  width: max-content;
  margin-inline: auto;
  display: grid;
  position: relative;
  overflow: visible;
}

.studio-dm-empty-art.is-compact .studio-dm-empty-art-frame {
  --studio-dm-balloon: 36px;
  gap: 10px;
}

.studio-dm-empty-art-glow {
  width: calc(100% + var(--studio-dm-balloon));
  aspect-ratio: 1;
  margin-left: calc((100% + var(--studio-dm-balloon)) / -2);
  margin-top: calc((100% + var(--studio-dm-balloon)) / -2);
  background: radial-gradient(circle at 50% 50%,
    color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 28%, transparent) 0%,
    transparent 72%);
  filter: blur(12px);
  opacity: .85;
  border-radius: 50%;
  animation: 5.2s ease-in-out infinite studio-dm-empty-glow;
  position: absolute;
  top: 50%;
  left: 50%;
}

.studio-dm-empty-float {
  --studio-dm-balloon: 48px;
  width: var(--studio-dm-balloon);
  height: var(--studio-dm-balloon);
  aspect-ratio: 1;
  border: 1px solid var(--studio-composer-glass-border, color-mix(in srgb, var(--color-cursor-border-soft) 78%, transparent));
  background: var(--studio-composer-glass-strong, var(--mos-plate));
  box-shadow: var(--studio-composer-glass-shadow, 0 10px 24px #0000001f);
  color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 76%, var(--mos-text));
  border-radius: 18px;
  place-items: center;
  display: grid;
  position: relative;
}

.studio-dm-empty-art.is-compact .studio-dm-empty-float {
  --studio-dm-balloon: 36px;
  border-radius: 14px;
}

.studio-dm-empty-float svg {
  width: calc(var(--studio-dm-balloon) * .46);
  height: calc(var(--studio-dm-balloon) * .46);
}

.studio-dm-empty-float.is-top {
  z-index: 3;
  grid-column: 1 / -1;
  justify-self: center;
  animation: 6s ease-in-out infinite studio-dm-empty-float-top;
}

.studio-dm-empty-float.is-left {
  z-index: 1;
  justify-self: end;
  animation: 5.8s ease-in-out .35s infinite studio-dm-empty-float-left;
}

.studio-dm-empty-float.is-right {
  z-index: 2;
  justify-self: start;
  animation: 5.5s ease-in-out .7s infinite studio-dm-empty-float-right;
}

@keyframes studio-dm-empty-glow {
  0%, 100% {
    opacity: .62;
    transform: scale(.96);
  }

  50% {
    opacity: 1;
    transform: scale(1.04);
  }
}

@keyframes studio-dm-empty-float-top {
  0%, 100% {
    transform: translate(0);
  }

  50% {
    transform: translate(0, -5px);
  }
}

@keyframes studio-dm-empty-float-left {
  0%, 100% {
    transform: translate(0)rotate(-4deg);
  }

  50% {
    transform: translate(-3px, -4px)rotate(-2deg);
  }
}

@keyframes studio-dm-empty-float-right {
  0%, 100% {
    transform: translate(0)rotate(4deg);
  }

  50% {
    transform: translate(3px, -4px)rotate(6deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-dm-empty-art-glow, .studio-dm-empty-float {
    animation: none !important;
  }
}

button.studio-dm-empty-card {
  appearance: none;
  font: inherit;
  cursor: pointer;
  pointer-events: auto;
}

button.studio-dm-empty-card.is-pressed {
  transform: scale(.97);
}

.studio-dm-empty-art-frame.is-mark {
  min-width: calc(var(--studio-dm-balloon) * 2 + 14px);
  min-height: calc(var(--studio-dm-balloon) * 2 + 14px);
  place-items: center;
}

.studio-dm-empty-logo-mark {
  z-index: 1;
  object-fit: contain;
  grid-area: 1 / 1 / -1 / -1;
  place-self: center;
  width: 72px;
  height: 72px;
}

.studio-empty-logo-card.studio-dm-empty-card {
  width: min(58vw, 14.25rem);
  padding: 20px 16px;
}

/* [project]/src/studio/components/studio-dm-generate-menu.css [app-client] (css) */
.studio-action-menu.studio-dm-gen-menu .studio-action-section {
  min-width: 248px;
}

.studio-action-menu.studio-dm-mode-menu .studio-action-section {
  min-width: 168px;
}

.studio-dm-gen-ratio {
  box-sizing: border-box;
  border: 1.5px solid;
  border-radius: 3px;
  display: block;
}

.studio-dm-gen-scrubber {
  gap: 4px;
  display: grid;
}

.studio-dm-gen-scrubber-head {
  font-size: var(--studio-type-meta, 12px);
  color: var(--color-cursor-text, var(--mos-text));
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  font-weight: 500;
  display: flex;
}

.studio-dm-gen-scrubber-head strong {
  font-variant-numeric: tabular-nums;
  color: var(--cursor-accent, var(--mos-accent));
  font-weight: 600;
}

.studio-dm-gen-scrubber.is-muted .studio-dm-gen-scrubber-head strong {
  color: var(--color-cursor-muted, var(--mos-text-muted));
}

.studio-dm-gen-scrubber-track {
  padding-bottom: 24px;
  position: relative;
}

.studio-action-menu .studio-dm-gen-scrubber-input {
  touch-action: pan-y;
  margin: 0;
  display: block;
}

.studio-dm-gen-scrubber.is-muted .studio-dm-gen-scrubber-input {
  opacity: .7;
  --range-progress: 0% !important;
}

.studio-dm-gen-scrubber-ticks {
  pointer-events: none;
  position: absolute;
  inset: 26px 0 0;
}

.studio-dm-gen-scrubber-tick {
  cursor: pointer;
  pointer-events: auto;
  min-width: 24px;
  color: var(--color-cursor-faint, var(--mos-text-faint, var(--mos-text-muted)));
  background: none;
  border: 0;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 0;
  display: flex;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
}

.studio-dm-gen-scrubber-tick i {
  background: color-mix(in srgb, var(--mos-text) 22%, transparent);
  border-radius: 2px;
  width: 2px;
  height: 5px;
  display: block;
}

.studio-dm-gen-scrubber-tick span {
  font-size: var(--studio-type-meta, 12px);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-weight: 500;
  line-height: 1;
}

.studio-dm-gen-scrubber-minor {
  background: color-mix(in srgb, var(--mos-text) 16%, transparent);
  border-radius: 2px;
  width: 2px;
  height: 3px;
  position: absolute;
  top: 0;
  transform: translateX(-50%);
}

.studio-dm-gen-scrubber-minor.is-passed {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 50%, transparent);
}

.studio-dm-gen-scrubber-tick.is-passed i {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 70%, transparent);
}

.studio-dm-gen-scrubber-tick.is-on {
  color: var(--cursor-accent, var(--mos-accent));
}

.studio-dm-gen-scrubber-tick:first-of-type {
  align-items: flex-start;
  transform: translateX(-8.5px);
}

.studio-dm-gen-scrubber-tick:last-of-type {
  align-items: flex-end;
  transform: translateX(calc(8.5px - 100%));
}

.studio-action-menu.is-edge .studio-dm-gen-scrubber-input {
  height: 32px;
}

.studio-action-menu.is-edge .studio-dm-gen-scrubber-ticks {
  top: 32px;
}

/* [project]/src/studio/components/studio-emoji.css [app-client] (css) */
.studio-emoji {
  vertical-align: -.12em;
  object-fit: contain;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  flex-shrink: 0;
  width: 1em;
  height: 1em;
  display: inline-block;
}

/* [project]/src/studio/editor/studio-editor.css [app-client] (css) */
.studio-editor {
  background: var(--mos-page, var(--mos-bg));
  height: 100%;
  min-height: 0;
  color: var(--mos-text);
  flex-direction: column;
  display: flex;
}

.studio-editor-shell {
  flex-direction: row;
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-editor-workspace {
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-editor-h-panels {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-editor-side {
  flex-direction: row;
  flex-shrink: 0;
  align-items: stretch;
  min-height: 0;
  display: flex;
}

.studio-editor-inspector-dock {
  background: var(--mos-page, var(--mos-bg));
  border: none;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-editor-panels {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-editor-resize {
  background: var(--mos-border);
  flex-shrink: 0;
  width: 5px;
  transition: background .15s, width .15s, opacity .15s;
}

.studio-editor-resize:hover, .studio-editor-resize[data-resize-handle-active] {
  background: color-mix(in srgb, var(--cursor-accent, #2563eb) 35%, var(--mos-border));
}

.studio-editor-resize.is-collapsed {
  opacity: 0;
  pointer-events: none;
  width: 0;
}

.studio-editor-resize-y {
  width: 100%;
  height: 1px;
  cursor: var(--studio-cursor-resize-y, ns-resize);
  z-index: 2;
  background: none;
  position: relative;
}

.studio-editor-resize-y:before {
  content: "";
  position: absolute;
  inset: -3px 0;
}

.studio-editor-inspector {
  background: var(--mos-page, var(--mos-bg));
  width: 100%;
  height: 100%;
  min-height: 0;
  color: var(--mos-text, #1f2328);
  flex-direction: row;
  display: flex;
  overflow: hidden;
}

[data-appearance="light"] .studio-editor-mode-stack, [data-appearance="light"] .studio-editor-inspector, [data-appearance="light"] .studio-editor-inspector-dock {
  background: var(--mos-page, var(--mos-bg));
}

.studio-editor-mode-stack {
  width: var(--cursor-head-h, 36px);
  background: var(--mos-page, var(--mos-bg));
  border: none;
  flex-direction: column;
  flex-shrink: 0;
  align-items: center;
  gap: .25rem;
  padding: .35rem 0;
  display: flex;
}

.studio-editor-mode-icon, .studio-editor-mode-export {
  width: 26px;
  height: 26px;
  color: var(--mos-muted);
  background: none;
  border: 1px solid #0000;
  border-radius: 8px;
  flex-shrink: 0;
  place-items: center;
  display: grid;
}

.studio-editor-mode-icon:hover:not(:disabled), .studio-editor-mode-export:hover:not(:disabled) {
  background: var(--mos-hover);
  color: var(--mos-text);
}

.studio-editor-mode-icon.is-active:not(:disabled), .studio-editor-mode-export.is-active:not(:disabled) {
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-bg));
  border-color: color-mix(in srgb, var(--cursor-accent) 40%, var(--mos-border));
  color: var(--cursor-accent);
}

.studio-editor-mode-icon.is-disabled, .studio-editor-mode-icon:disabled, .studio-editor-mode-export:disabled {
  opacity: .35;
  cursor: not-allowed;
  color: var(--mos-muted);
}

.studio-editor-export-tiers {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  display: grid;
}

.studio-editor-export-tier {
  border-radius: var(--cursor-radius-sm, 6px);
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  min-height: 32px;
  font-size: var(--desk-text-sm, 12px);
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  place-items: center;
  padding: 7px 6px;
  font-weight: 600;
  display: grid;
}

.studio-editor-export-tier.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, var(--mos-border));
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-bg));
  color: var(--cursor-accent);
}

.studio-editor-export-frame-row {
  align-items: center;
  gap: .65rem;
  display: flex;
}

.studio-editor-export-frame-value {
  font-variant-numeric: tabular-nums;
  color: var(--mos-text);
  margin: 0;
  font-size: .9rem;
  font-weight: 600;
}

.studio-editor-export-progress {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  display: grid;
}

.studio-editor-export-error {
  color: var(--mos-danger, #ef4444);
  white-space: normal;
  overflow-wrap: anywhere;
  -webkit-user-select: text;
  user-select: text;
  margin: 8px 2px 0;
  font-size: 12px;
  line-height: 1.45;
}

.studio-editor-export-meter {
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate);
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  min-height: 32px;
  box-shadow: none;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  display: grid;
  position: relative;
  overflow: hidden;
}

.studio-editor-export-meter-fill {
  background: color-mix(in srgb, var(--cursor-accent) 22%, var(--mos-plate));
  pointer-events: none;
  width: 0;
  transition: width .28s linear;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.studio-editor-export-meter--error .studio-editor-export-meter-fill {
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 18%, var(--mos-plate));
}

.studio-editor-export-meter--done .studio-editor-export-meter-fill {
  background: color-mix(in srgb, var(--cursor-accent) 16%, var(--mos-plate));
}

.studio-editor-export-meter-fill.is-indeterminate {
  width: 32%;
  animation: 1.15s ease-in-out infinite desk-download-indeterminate;
}

.studio-editor-export-meter-label, .studio-editor-export-meter-pct, .studio-editor-export-meter-x, .studio-editor-export-meter-x-spacer {
  z-index: 1;
  position: relative;
}

.studio-editor-export-meter-label {
  min-width: 0;
  color: var(--mos-muted);
  white-space: nowrap;
  text-overflow: ellipsis;
  text-shadow: none;
  padding: 0 8px 0 12px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  overflow: hidden;
}

.studio-editor-export-meter-pct {
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  color: var(--mos-text);
  text-align: center;
  text-shadow: none;
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
}

.studio-editor-export-meter:not(.is-running) .studio-editor-export-meter-label {
  grid-column: 1 / 3;
}

.studio-editor-export-meter:not(.is-running) .studio-editor-export-meter-pct {
  display: none;
}

.studio-editor-export-meter-x, .studio-editor-export-meter-x-spacer {
  justify-self: end;
  width: 22px;
  height: 22px;
  margin: 0 5px 0 auto;
}

.studio-editor-export-meter-x {
  cursor: pointer;
  background: var(--mos-plate-strong);
  color: var(--mos-text);
  box-shadow: none;
  border: none;
  border-radius: 999px;
  place-items: center;
  padding: 0;
  display: grid;
}

.studio-editor-export-meter-x:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
}

.studio-editor-export-progress-bar {
  background: var(--mos-plate-strong);
  border-radius: 999px;
  height: 6px;
  overflow: hidden;
}

.studio-editor-export-progress-bar > span {
  border-radius: inherit;
  background: var(--cursor-accent);
  height: 100%;
  transition: width .18s;
  display: block;
}

.studio-editor-inspector-main {
  background: none;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-editor-inspector-panel-head {
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  box-sizing: border-box;
  background: none;
  border-bottom: none;
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  display: flex;
}

.studio-editor-inspector-identity {
  flex: auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  height: 100%;
  display: flex;
}

.studio-editor-inspector-export {
  background: var(--cursor-accent);
  height: 24px;
  color: var(--cursor-on-accent, #fff);
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
  border: 0;
  border-radius: 8px;
  flex: none;
  margin-left: auto;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  transition: background-color .15s, opacity .15s;
}

.studio-editor-inspector-export:hover:not(:disabled) {
  background: var(--cursor-accent-hover, var(--cursor-accent));
  color: var(--cursor-on-accent, #fff);
}

.studio-editor-inspector-export:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.studio-editor-inspector-back {
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 6px;
  flex: none;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.studio-editor-inspector-back:hover {
  background: var(--mos-hover);
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-editor-export-body {
  padding: 10px;
}

.studio-editor-export-stack {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.studio-editor-export-card {
  box-shadow: none;
  background: none;
  border: none;
  border-radius: 0;
  flex: none;
  overflow: visible;
}

.studio-editor-export-card-head {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 10px 14px 0;
  display: flex;
}

.studio-editor-export-card-head h4 {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 11px;
  font-weight: 700;
}

.studio-editor-export-card-meta {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 12px;
  font-weight: 600;
}

.studio-editor-export-card-body {
  flex-direction: column;
  gap: 10px;
  padding: 10px 14px 14px;
  display: flex;
}

.studio-editor-export-pills {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-editor-export-pills .studio-settings-pill {
  border-radius: var(--cursor-radius-pill, 999px);
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  min-width: 0;
  min-height: 28px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  flex: 1 1 0;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 650;
  transition: background-color .15s, border-color .15s, color .15s;
  display: inline-flex;
}

.studio-editor-export-pills .studio-settings-pill:hover {
  color: var(--color-cursor-text, var(--mos-text));
  border-color: var(--color-cursor-border, var(--mos-border));
}

.studio-editor-export-pills .studio-settings-pill.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 42%, var(--color-cursor-border-soft, var(--mos-border)));
  color: var(--color-cursor-text-bright, var(--mos-text));
  background: color-mix(in srgb, var(--cursor-accent) 10%, var(--mos-page, var(--color-cursor-panel, #fff)));
}

.studio-editor-export-filename {
  margin: 0;
  display: block;
}

.studio-editor-export-filename-row {
  align-items: center;
  gap: 8px;
  width: 100%;
  display: flex;
}

.studio-editor-export-filename-row .cursor-input, .studio-editor-export-filename-row input {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: var(--cursor-surface-input, var(--mos-plate-strong, var(--mos-hover)));
  width: 100%;
  min-width: 0;
  min-height: 32px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  border-radius: 8px;
  flex: auto;
  padding: 0 10px;
  font-size: 13px;
}

.studio-editor-export-filename-row .cursor-input:focus, .studio-editor-export-filename-row input:focus {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, var(--mos-border));
  outline: none;
}

.studio-editor-export-filename-ext {
  color: var(--color-cursor-muted, var(--mos-muted));
  -webkit-user-select: none;
  user-select: none;
  flex: none;
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
}

.studio-editor-export-note {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-editor-export-size {
  font-variant-numeric: tabular-nums;
  color: var(--mos-text);
  margin: 0;
  font-size: .82rem;
  font-weight: 600;
}

.studio-editor-inspector-thumb {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: var(--mos-plate-strong, var(--mos-panel));
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted, var(--mos-muted));
  border-radius: 999px;
  flex: none;
  place-items: center;
  display: grid;
  position: relative;
  overflow: hidden;
}

.studio-editor-inspector-thumb.has-thumb {
  color: var(--cursor-on-accent);
  border-color: #ffffffb3;
}

.studio-editor-inspector-thumb.has-thumb .studio-editor-inspector-thumb-icon {
  filter: drop-shadow(0 0 1.25px #000000b3);
}

.studio-editor-inspector-thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0;
}

.studio-editor-inspector-thumb-icon {
  z-index: 1;
  pointer-events: none;
  place-items: center;
  display: grid;
  position: relative;
}

.studio-editor-inspector-thumb-icon .lucide-play {
  stroke-width: 2.85px;
}

.studio-editor-inspector-name {
  letter-spacing: -.01em;
  min-width: 0;
  color: var(--color-cursor-text, var(--mos-text));
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: auto;
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
  overflow: hidden;
}

.studio-editor-inspector-panel-head h3 {
  letter-spacing: -.01em;
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
}

.studio-editor-inspector-panel-sub {
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .72rem;
  overflow: hidden;
}

.studio-editor-files-panel {
  background: var(--mos-page, var(--mos-bg));
  flex-direction: column;
  flex: auto;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-editor-files-panel .cursor-explorer-body, .studio-editor-files-panel .studio-files-drop-zone {
  flex-direction: column;
  flex: auto;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-editor-files-panel .desk-file-tree-scroll {
  flex: 1 1 0;
  min-height: 0;
}

.studio-editor-inspector-body {
  background: none;
  flex-direction: column;
  flex: 1 1 0;
  gap: 10px;
  min-height: 0;
  padding: 10px;
  font-size: .82rem;
  line-height: 1.4;
  display: flex;
  overflow: hidden auto;
}

[data-appearance="light"] .studio-editor-inspector-body, [data-appearance="light"] .studio-editor-inspector-main, [data-appearance="light"] .studio-editor-inspector-panel-head {
  background: none;
}

.studio-editor-inspector-section {
  box-shadow: none;
  background: none;
  border: none;
  border-radius: 0;
  flex: none;
  margin: 0;
  padding: 0;
  overflow: visible;
}

.studio-editor-inspector-section-head {
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  min-height: 36px;
  margin: 0;
  padding: 10px 14px 0;
  display: flex;
}

.studio-editor-inspector-section-head h4 {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 11px;
  font-weight: 700;
}

.studio-editor-inspector-section-toggle {
  min-width: 0;
  color: inherit;
  cursor: pointer;
  text-align: left;
  background: none;
  border: 0;
  flex: auto;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  display: flex;
}

.studio-editor-inspector-section-toggle h4 {
  flex: none;
}

.studio-editor-inspector-section-meta {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-muted, var(--mos-muted));
  text-align: right;
  flex: auto;
  font-size: .72rem;
  font-weight: 500;
  overflow: hidden;
}

.studio-editor-inspector-section-caret {
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
  margin-left: auto;
  transition: transform .15s;
}

.studio-editor-inspector-section.is-open .studio-editor-inspector-section-caret {
  transform: rotate(180deg);
}

.studio-editor-inspector-section.is-collapsible:not(.is-open) .studio-editor-inspector-section-head {
  padding-bottom: 12px;
}

.studio-editor-inspector-reset {
  width: 24px;
  height: 24px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 6px;
  place-items: center;
  display: grid;
}

.studio-editor-inspector-reset:hover {
  background: var(--mos-hover, #e6e6ec);
  color: var(--mos-text);
}

.studio-editor-inspector-section-body {
  flex-direction: column;
  gap: 10px;
  padding: 10px 14px 14px;
  display: flex;
}

.studio-editor-inspector-hint {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  padding: 4px 14px 0;
  font-size: .72rem;
  line-height: 1.35;
}

.studio-editor-slider-row {
  flex-direction: column;
  gap: .28rem;
  display: flex;
}

.studio-editor-slider-reset {
  width: 20px;
  height: 20px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 6px;
  flex: none;
  place-items: center;
  display: grid;
}

.studio-editor-slider-reset:hover:not(:disabled) {
  background: var(--mos-hover, #e6e6ec);
  color: var(--mos-text);
}

.studio-editor-slider-reset:disabled {
  opacity: .35;
  cursor: default;
}

.studio-editor-slider-row-controls {
  align-items: center;
  gap: .55rem;
  min-width: 0;
  display: flex;
}

.studio-editor-slider-label {
  color: var(--color-cursor-muted, var(--mos-muted));
  align-items: center;
  gap: .3rem;
  font-size: .72rem;
  font-weight: 500;
  line-height: 1.2;
  display: inline-flex;
}

.studio-editor-slider-value, .studio-editor-slider-input {
  box-sizing: border-box;
  background: var(--mos-hover, #e6e6ec);
  width: 3.35rem;
  min-width: 3.35rem;
  color: var(--mos-text);
  text-align: center;
  font-variant-numeric: tabular-nums;
  border: 0;
  border-radius: 6px;
  flex: none;
  padding: .2rem .3rem;
  font-size: .68rem;
  font-weight: 600;
  line-height: 1.2;
}

.studio-editor-slider-input:focus {
  background: var(--mos-panel);
  box-shadow: 0 0 0 1px var(--mos-border, #d1d5db);
  outline: none;
}

.studio-editor-detail-grid {
  flex-direction: column;
  gap: .45rem;
  display: flex;
}

.studio-editor-detail-row {
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  font-size: .74rem;
  display: flex;
}

.studio-editor-detail-row span {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-editor-detail-row strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-weight: 600;
}

.studio-editor-timing {
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.studio-editor-timing-ruler {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.studio-editor-timing-ruler-track {
  background: color-mix(in srgb, var(--mos-page, #fff) 72%, var(--mos-hover, #e6e6ec));
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  border-radius: 999px;
  height: 10px;
  position: relative;
  overflow: hidden;
}

.studio-editor-timing-ruler-range {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 72%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 35%, transparent);
  border-radius: 999px;
  position: absolute;
  top: 0;
  bottom: 0;
}

.studio-editor-timing-ruler-ends {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-muted, var(--mos-muted));
  justify-content: space-between;
  font-size: 11px;
  display: flex;
}

.studio-editor-timing-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  display: grid;
}

.studio-editor-timing-metric {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  border-radius: 10px;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 8px 8px 9px;
  display: flex;
}

.studio-editor-timing-metric-label {
  letter-spacing: .02em;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 11px;
  font-weight: 600;
}

.studio-editor-timing-metric-value {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-text, var(--mos-text));
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 650;
  overflow: hidden;
}

.studio-editor-timing-chip-row {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-editor-timing-chip {
  border-radius: var(--cursor-radius-pill, 999px);
  border: 1px solid color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 28%, var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 10%, var(--mos-page, #fff));
  min-height: 26px;
  color: var(--cursor-accent, var(--mos-accent));
  align-items: center;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.studio-editor-control-block {
  flex-direction: column;
  gap: .4rem;
  display: flex;
}

.studio-editor-transition-list {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.studio-editor-transition-list.is-muted {
  opacity: .5;
  pointer-events: none;
}

.studio-editor-transition-row {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  text-align: left;
  width: 100%;
  min-height: 40px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  cursor: pointer;
  border-radius: 12px;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: .55rem;
  padding: .45rem .7rem;
  transition: background-color .15s, border-color .15s, color .15s;
  display: grid;
}

.studio-editor-transition-row:hover:not(:disabled):not(.is-disabled) {
  color: var(--color-cursor-text-bright, var(--mos-text));
  border-color: var(--color-cursor-border, var(--mos-border));
  background: color-mix(in srgb, var(--mos-hover, #e6e6ec) 55%, var(--mos-page, #fff));
}

.studio-editor-transition-row.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 42%, var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent) 10%, var(--mos-page, var(--color-cursor-panel, #fff)));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-editor-transition-row.is-disabled, .studio-editor-transition-row:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.studio-editor-transition-row-icon {
  width: 22px;
  height: 22px;
  color: var(--cursor-accent, var(--mos-accent));
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, transparent);
  border-radius: 999px;
  place-items: center;
  display: grid;
}

.studio-editor-transition-row.is-active .studio-editor-transition-row-icon {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, transparent);
}

.studio-editor-transition-row-label {
  color: inherit;
  font-size: .78rem;
  font-weight: 650;
}

.studio-editor-transition-row-meta {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: .68rem;
  font-weight: 600;
}

.studio-editor-animation-list {
  flex-direction: column;
  gap: .35rem;
  margin-bottom: .65rem;
  display: flex;
}

.studio-editor-animation-btn {
  border: 1px solid var(--mos-border);
  background: var(--mos-bg);
  text-align: left;
  border-radius: 8px;
  min-height: 38px;
  padding: .45rem .65rem;
  font-size: .78rem;
}

.studio-editor-animation-btn.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent, #2563eb) 45%, var(--mos-border));
  color: var(--cursor-accent, #2563eb);
}

.studio-editor-layer-groups {
  flex-direction: column;
  gap: .85rem;
  display: flex;
}

.studio-editor-layer-group-head {
  justify-content: space-between;
  align-items: center;
  margin-bottom: .35rem;
  display: flex;
}

.studio-editor-layer-group-head strong {
  font-size: .78rem;
}

.studio-editor-layer-add {
  border: 1px solid var(--mos-border);
  background: var(--mos-bg);
  width: 28px;
  height: 28px;
  color: var(--mos-text);
  border-radius: 8px;
  place-items: center;
  display: grid;
}

.studio-editor-layer-items {
  flex-direction: column;
  gap: .3rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-editor-layer-items li {
  background: var(--mos-bg);
  border: 1px solid var(--mos-border);
  border-radius: 8px;
  padding: .45rem .6rem;
  font-size: .78rem;
}

.studio-editor-layer-empty {
  color: var(--mos-muted);
  margin: 0;
  font-size: .74rem;
}

.studio-editor-lib-grid {
  grid-template-columns: 1fr;
  gap: .4rem;
  margin-bottom: .65rem;
  display: grid;
}

.studio-editor-lib-grid.is-compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.studio-editor-lib-card {
  border: 1px solid var(--mos-border);
  background: var(--mos-bg);
  text-align: left;
  border-radius: 10px;
  flex-direction: row;
  align-items: center;
  gap: .5rem;
  min-height: 44px;
  padding: .55rem .65rem;
  display: flex;
}

.studio-editor-lib-card.is-compact {
  text-align: center;
  align-items: center;
  min-height: auto;
}

.studio-editor-lib-card.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent, #2563eb) 45%, var(--mos-border));
  background: color-mix(in srgb, var(--cursor-accent, #2563eb) 10%, var(--mos-bg));
}

.studio-editor-lib-card.is-disabled {
  opacity: .38;
  cursor: not-allowed;
}

.studio-editor-lib-grid.is-muted {
  opacity: .55;
  pointer-events: none;
}

.studio-editor-lib-card-icon {
  color: var(--cursor-accent, #2563eb);
}

.studio-editor-lib-card-label {
  color: var(--mos-text);
  font-size: .78rem;
  font-weight: 600;
}

.studio-editor-lib-card-meta {
  color: var(--mos-muted);
  margin-left: auto;
  font-size: .72rem;
}

.studio-editor-align-row {
  flex-wrap: wrap;
  gap: .35rem;
  margin-bottom: .55rem;
  display: flex;
}

.studio-editor-frame-presets {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  display: grid;
}

.studio-editor-frame-preset {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  min-height: 72px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  border-radius: 12px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: .4rem;
  padding: .45rem .35rem .5rem;
  font-size: .72rem;
  transition: background-color .15s, border-color .15s, color .15s;
  display: flex;
}

.studio-editor-frame-preset:hover {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-editor-frame-preset.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 42%, var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent) 10%, var(--mos-page, var(--color-cursor-panel, #fff)));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-editor-frame-preset-glyph {
  flex: auto;
  place-items: center;
  width: 100%;
  min-height: 34px;
  display: grid;
}

.studio-editor-frame-preset-glyph .studio-ratio-glyph {
  width: 32px;
  height: 32px;
}

.studio-editor-frame-preset-label {
  letter-spacing: .01em;
  flex: none;
  font-weight: 600;
  line-height: 1;
}

.studio-editor-preset-btn {
  border: 1px solid var(--mos-border);
  background: var(--mos-hover, #e6e6ec);
  text-transform: capitalize;
  min-height: 34px;
  color: var(--mos-text);
  border-radius: 8px;
  padding: .35rem .65rem;
  font-size: .76rem;
}

.studio-editor-preset-btn.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, var(--mos-border));
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-bg));
  color: var(--cursor-accent);
}

.studio-editor-primary-btn, .studio-editor-secondary-btn {
  border-radius: 10px;
  align-items: center;
  gap: .45rem;
  padding: .65rem .85rem;
  font-size: .8rem;
  display: inline-flex;
}

.studio-editor-primary-btn {
  background: var(--cursor-accent);
  color: var(--cursor-on-accent, #fff);
  cursor: pointer;
  border: none;
  justify-content: center;
  width: 100%;
  font-weight: 700;
}

.studio-editor-primary-btn:hover {
  background: var(--cursor-accent-hover, var(--cursor-accent));
}

.studio-editor-speed-process {
  flex-direction: column;
  gap: .5rem;
  margin: .35rem 0 .75rem;
  display: flex;
}

.studio-editor-speed-process-hint {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: .72rem;
  line-height: 1.35;
}

.studio-editor-speed-process-error {
  color: var(--mos-danger, #c23b3b);
  margin: 0;
  font-size: .72rem;
  line-height: 1.35;
}

.studio-editor-secondary-btn {
  border: 1px solid var(--mos-border);
  background: var(--mos-hover, #e6e6ec);
  margin-top: .35rem;
}

.studio-editor-layer-list {
  flex-direction: column;
  gap: .65rem;
  font-size: .68rem;
  display: flex;
}

.studio-editor-layer-list ul {
  color: var(--mos-muted);
  margin: .25rem 0 0;
  padding-left: 1rem;
}

.studio-editor-range-label {
  align-items: center;
  gap: .25rem;
  display: inline-flex;
}

.studio-editor-inspector-head {
  border-bottom: 1px solid var(--mos-border);
  color: var(--mos-text);
  align-items: center;
  gap: .4rem;
  padding: .5rem .65rem;
  font-size: .72rem;
  font-weight: 600;
  display: flex;
}

.studio-editor-joint {
  background: var(--mos-panel);
  min-width: 22px;
  height: 22px;
  color: var(--mos-text, #111314);
  z-index: 6;
  opacity: 0;
  pointer-events: auto;
  box-sizing: border-box;
  border: none;
  border-radius: 999px;
  place-items: center;
  padding: 0;
  transition: opacity .12s;
  display: grid;
  position: absolute;
  top: 50%;
  overflow: visible;
  transform: translateY(-50%);
  box-shadow: 0 1px 3px #0000001f;
}

.studio-editor-joint.is-adder:before {
  content: "";
  border-radius: 10px;
  position: absolute;
  inset: -12px -4px;
}

.studio-editor-joint.is-adder:hover, .studio-editor-joint.is-adder:focus-visible, .studio-editor-joint.is-adder.is-selected {
  opacity: 1;
}

.studio-editor-joint.is-adder svg {
  flex-shrink: 0;
  display: block;
}

.studio-editor-joint.has-transition {
  --studio-clip-accent: var(--studio-edit-accent, #00c2c7);
  opacity: 1;
  height: 100%;
  color: var(--cursor-on-accent);
  box-shadow: none;
  z-index: 6;
  background: #000000ad;
  border: none;
  border-radius: 8px;
  top: 0;
  transform: none;
}

.studio-editor-joint.has-transition.is-selected {
  z-index: 7;
}

.studio-editor-joint.has-transition.is-selected:after {
  content: "";
  border: 2px solid var(--studio-clip-accent);
  box-sizing: border-box;
  pointer-events: none;
  z-index: 10;
  border-radius: 10px;
  position: absolute;
  inset: -1px;
}

.studio-editor-joint-handle {
  opacity: 0;
  pointer-events: none;
  z-index: 11;
  width: 10px;
  cursor: var(--studio-cursor-resize-x, ew-resize);
  touch-action: none;
  position: absolute;
  top: 0;
  bottom: 0;
}

.studio-editor-joint.has-transition.is-selected .studio-editor-joint-handle {
  opacity: 1;
  background: var(--mos-text, var(--color-cursor-text, #111314));
  box-sizing: border-box;
  pointer-events: auto;
  border: none;
  border-radius: 6px;
  width: 5px;
  top: 34%;
  bottom: 34%;
}

.studio-editor-joint-handle.is-left {
  left: 0;
}

.studio-editor-joint.has-transition.is-selected .studio-editor-joint-handle.is-left {
  border-top: 2px solid var(--studio-clip-accent);
  border-bottom: 2px solid var(--studio-clip-accent);
  border-right: 2px solid var(--studio-clip-accent);
  border-left: none;
}

.studio-editor-joint-handle.is-right {
  right: 0;
}

.studio-editor-joint.has-transition.is-selected .studio-editor-joint-handle.is-right {
  border-top: 2px solid var(--studio-clip-accent);
  border-bottom: 2px solid var(--studio-clip-accent);
  border-left: 2px solid var(--studio-clip-accent);
  border-right: none;
}

.studio-editor-inspector-empty {
  text-align: center;
  color: var(--mos-muted);
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  padding: 1.25rem .75rem;
  font-size: .68rem;
  display: flex;
}

.studio-editor-inspector-btn {
  border: 1px solid var(--mos-border);
  background: var(--mos-bg);
  color: var(--mos-text);
  border-radius: 6px;
  align-items: center;
  gap: .35rem;
  padding: .35rem .55rem;
  font-size: .68rem;
  display: inline-flex;
}

.studio-editor-inspector-btn:hover {
  background: var(--mos-hover, #e6e6ec);
}

.studio-editor-chip-row {
  flex-wrap: wrap;
  gap: .25rem;
  margin-bottom: .45rem;
  display: flex;
}

.studio-editor-chip {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border)) 80%, transparent);
  background: color-mix(in srgb, var(--mos-panel) 70%, var(--mos-plate));
  color: var(--color-cursor-muted, #6b7280);
  cursor: pointer;
  border-radius: 999px;
  padding: .2rem .45rem;
  font-size: .62rem;
  font-weight: 600;
  transition: background-color .15s, border-color .15s, color .15s;
}

.studio-editor-chip:hover:not(:disabled) {
  color: var(--color-cursor-text, var(--mos-text));
  border-color: var(--color-cursor-border-soft, var(--mos-border));
}

.studio-editor-chip.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, var(--mos-border));
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-panel));
  color: var(--cursor-accent);
}

.studio-editor-chip:disabled {
  opacity: .45;
  cursor: default;
}

.studio-editor-look-chip {
  align-items: center;
  gap: .1rem;
  display: inline-flex;
}

.studio-editor-look-chip-del {
  width: 18px;
  height: 18px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-editor-look-chip-del:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-editor-field-row {
  grid-template-columns: 1fr 1fr;
  gap: .45rem;
  display: grid;
}

.studio-editor-field-row label, .studio-editor-field-full {
  font-size: var(--desk-text-xs, 11px);
  color: var(--color-cursor-muted, var(--mos-muted));
  flex-direction: column;
  gap: .35rem;
  margin-bottom: 0;
  display: flex;
}

.studio-editor-field-row input, .studio-editor-field-full input, .studio-editor-textarea {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  width: 100%;
  color: var(--color-cursor-text, var(--mos-text));
  font-size: var(--desk-text-ui, 13px);
  border-radius: 8px;
  min-height: 32px;
  padding: .45rem .55rem;
}

.studio-editor-textarea {
  resize: vertical;
  width: 100%;
  min-height: 88px;
  line-height: 1.4;
}

.studio-editor-field-row input:focus, .studio-editor-field-full input:focus, .studio-editor-textarea:focus {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, var(--mos-border));
  outline: none;
}

.studio-editor-range {
  --slider-progress: 0%;
  appearance: none;
  cursor: pointer;
  background: none;
  flex: auto;
  width: 100%;
  min-width: 0;
  height: 16px;
  margin: 0;
  padding: 0;
}

.studio-editor-range:focus {
  outline: none;
}

.studio-editor-range:focus-visible::-webkit-slider-thumb {
  border-color: var(--color-cursor-muted, var(--mos-muted));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-cursor-muted, var(--mos-muted)) 25%, transparent);
}

.studio-editor-range:focus-visible::-moz-range-thumb {
  border-color: var(--color-cursor-muted, var(--mos-muted));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-cursor-muted, var(--mos-muted)) 25%, transparent);
}

.studio-editor-range::-webkit-slider-runnable-track {
  background: linear-gradient(to right,
    var(--color-cursor-muted, #9ca3af) 0%,
    var(--color-cursor-muted, #9ca3af) var(--slider-progress),
    var(--color-cursor-border-soft, #e5e7eb) var(--slider-progress),
    var(--color-cursor-border-soft, #e5e7eb) 100%);
  border-radius: 999px;
  height: 2px;
}

.studio-editor-range::-webkit-slider-thumb {
  appearance: none;
  background: var(--mos-plate-strong);
  border: 1px solid var(--mos-border);
  width: 11px;
  height: 11px;
  box-shadow: none;
  border-radius: 999px;
  margin-top: -4.5px;
}

.studio-editor-range::-moz-range-track {
  background: var(--color-cursor-border-soft, #e5e7eb);
  border: 0;
  border-radius: 999px;
  height: 2px;
}

.studio-editor-range::-moz-range-progress {
  background: var(--color-cursor-muted, #9ca3af);
  border-radius: 999px;
  height: 2px;
}

.studio-editor-range::-moz-range-thumb {
  background: var(--mos-plate-strong);
  border: 1px solid var(--mos-border);
  width: 11px;
  height: 11px;
  box-shadow: none;
  border-radius: 999px;
}

.studio-editor-inspector-meta {
  color: var(--mos-muted);
  border-top: 1px solid var(--mos-border);
  flex-direction: column;
  gap: .15rem;
  padding-top: .35rem;
  font-size: .6rem;
  display: flex;
}

.studio-editor-shortcuts {
  border-top: 1px solid var(--mos-border);
  color: var(--mos-muted);
  margin-top: auto;
  padding: .55rem .65rem;
  font-size: .58rem;
}

.studio-editor-shortcuts h4 {
  text-transform: uppercase;
  letter-spacing: .04em;
  margin: 0 0 .3rem;
  font-size: .6rem;
}

.studio-editor-shortcuts dl {
  gap: .15rem;
  margin: 0;
  display: grid;
}

.studio-editor-shortcuts dl > div {
  grid-template-columns: 3.2rem 1fr;
  gap: .25rem;
  display: grid;
}

.studio-editor-shortcuts dt {
  color: var(--mos-text-soft);
  font-weight: 600;
}

.studio-editor-shortcuts dd {
  margin: 0;
}

.studio-editor-text-layer {
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.studio-editor-text-layer.is-under, .studio-editor-text-layer.is-over {
  z-index: 3;
}

.studio-editor-text-hit {
  z-index: 1;
  cursor: pointer;
  pointer-events: auto;
  box-sizing: border-box;
  background: none;
  border: 0;
  border-radius: 4px;
  margin: 0;
  padding: 0;
  position: absolute;
}

.studio-editor-text-hit.is-selected {
  outline: 2px solid var(--cursor-accent, #c9a227);
  outline-offset: 3px;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--mos-fg, #000) 20%, transparent);
}

.studio-editor-text-hit:focus-visible {
  outline: 2px solid var(--cursor-accent, #c9a227);
  outline-offset: 3px;
}

.studio-editor-text-overlay {
  text-align: center;
  text-shadow: 0 2px 12px #000000a6;
  pointer-events: none;
  z-index: 4;
  font-weight: 700;
  line-height: 1.15;
  position: absolute;
  bottom: 12%;
  left: 8%;
  right: 8%;
}

.studio-editor-text-overlay.is-align-left {
  text-align: left;
}

.studio-editor-text-overlay.is-align-right {
  text-align: right;
}

.studio-editor-preview {
  background: var(--mos-page, var(--mos-bg));
  flex-direction: column;
  flex: 1;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-editor-preview-head {
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  box-sizing: border-box;
  background: none;
  border: none;
  flex: none;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  display: grid;
  overflow: visible;
}

.studio-editor-preview-head-left {
  justify-self: start;
  align-items: center;
  min-width: 0;
  display: flex;
}

.studio-editor-preview-head-center {
  z-index: 2;
  justify-content: center;
  justify-self: center;
  align-items: center;
  display: flex;
}

.studio-editor-preview-tools {
  background: var(--mos-plate);
  border: none;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 2px;
  height: 28px;
  padding: 0 2px;
  display: inline-flex;
}

.studio-editor-preview-head-right {
  flex: none;
  justify-content: flex-end;
  justify-self: end;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-editor-preview-quality {
  background: var(--mos-plate);
  border: none;
  border-radius: 999px;
  align-items: center;
  height: 28px;
  display: flex;
  overflow: visible;
}

.studio-editor-preview-quality .studio-editor-preview-quality-select, .studio-editor-preview-quality .cursor-select-menu {
  min-width: 4.25rem;
  background: none !important;
}

.studio-editor-preview-quality .cursor-select-trigger {
  font-variant-numeric: tabular-nums;
  height: 26px;
  min-height: 26px;
  color: var(--color-cursor-text, var(--mos-text));
  border-radius: 7px;
  padding-inline: 8px 6px;
  font-size: 12px;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
}

.studio-editor-preview-quality .cursor-select-trigger:hover, .studio-editor-preview-quality .cursor-select-menu.is-open .cursor-select-trigger {
  background: var(--mos-hover, var(--mos-plate)) !important;
}

.studio-editor-preview-tool {
  width: 26px;
  height: 26px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 8px;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.studio-editor-preview-tool:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-editor-preview-tool.is-active {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, var(--mos-bg));
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, var(--mos-border));
  color: var(--cursor-accent, var(--mos-accent));
}

.studio-editor-preview-stage {
  background: var(--mos-page, var(--mos-bg));
  flex: 1;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: .75rem;
  display: flex;
  position: relative;
  overflow: hidden;
  container-type: size;
}

.studio-editor-preview-stage.is-zoomed, .studio-editor-preview-stage.is-pan-tool {
  cursor: grab;
}

.studio-editor-preview-stage.is-pan-tool:active, .studio-editor-preview-pan-layer:active {
  cursor: grabbing;
}

.studio-editor-preview-pan-layer {
  z-index: 30;
  cursor: grab;
  touch-action: none;
  position: absolute;
  inset: 0;
}

.studio-editor-canvas-zoom-controls {
  background: var(--mos-plate);
  border: none;
  border-radius: 999px;
  align-items: center;
  height: 28px;
  display: flex;
  overflow: hidden;
}

.studio-editor-canvas-zoom-controls button {
  min-width: 26px;
  height: 100%;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  background: none;
  border: 0;
  border-right-width: medium;
  place-items: center;
  display: grid;
}

.studio-editor-canvas-zoom-controls button:last-child {
  border-right: 0;
}

.studio-editor-canvas-zoom-controls button:hover {
  background: var(--mos-hover, var(--mos-plate));
}

.studio-editor-canvas-zoom-controls .studio-editor-canvas-zoom-value {
  box-sizing: border-box;
  border-right: none;
  justify-content: center;
  align-items: center;
  gap: 1px;
  min-width: 52px;
  height: 100%;
  padding: 0 4px;
  display: inline-flex;
}

.studio-editor-canvas-zoom-controls .studio-editor-canvas-zoom-input {
  width: 2.6em;
  color: inherit;
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: right;
  appearance: textfield;
  background: none;
  border: 0;
  border-radius: 0;
  outline: none;
  margin: 0;
  padding: 0;
  font-size: 11px;
  font-weight: 650;
}

.studio-editor-canvas-zoom-controls .studio-editor-canvas-zoom-input::-webkit-outer-spin-button {
  appearance: none;
  margin: 0;
}

.studio-editor-canvas-zoom-controls .studio-editor-canvas-zoom-input::-webkit-inner-spin-button {
  appearance: none;
  margin: 0;
}

.studio-editor-canvas-zoom-controls .studio-editor-canvas-zoom-suffix {
  opacity: .75;
  font-size: 11px;
  font-weight: 650;
}

.studio-editor-preview-fs-transport {
  box-sizing: border-box;
  border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: var(--mos-panel, var(--mos-bg));
  color: var(--color-cursor-text, var(--mos-text));
  flex-direction: column;
  flex: none;
  display: flex;
}

.studio-editor-preview-fs-scrub {
  flex-shrink: 0;
  padding: 8px 12px 4px;
}

.studio-editor-preview-fs-scrub-track {
  align-items: center;
  height: 14px;
  display: flex;
  position: relative;
}

.studio-editor-preview-fs-scrub-track:before {
  content: "";
  background: var(--color-cursor-border-soft, var(--mos-border));
  border-radius: 999px;
  height: 4px;
  position: absolute;
  left: 0;
  right: 0;
}

.studio-editor-preview-fs-scrub-track:after {
  content: "";
  width: var(--studio-fs-progress, 0%);
  background: var(--color-cursor-accent, #6b8afd);
  pointer-events: none;
  border-radius: 999px;
  height: 4px;
  position: absolute;
  left: 0;
}

.studio-editor-preview-fs-scrub-input {
  z-index: 1;
  appearance: none;
  cursor: pointer;
  background: none;
  width: 100%;
  height: 14px;
  margin: 0;
  position: relative;
}

.studio-editor-preview-fs-scrub-input::-webkit-slider-runnable-track {
  background: none;
  height: 4px;
}

.studio-editor-preview-fs-scrub-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  background: var(--color-cursor-text, var(--mos-text));
  border: 2px solid var(--mos-panel, var(--mos-bg));
  width: 12px;
  height: 12px;
  box-shadow: 0 0 0 1px var(--color-cursor-border-soft, var(--mos-border));
  border-radius: 50%;
  margin-top: -4px;
}

.studio-editor-preview-fs-scrub-input::-moz-range-track {
  background: none;
  height: 4px;
}

.studio-editor-preview-fs-scrub-input::-moz-range-thumb {
  background: var(--color-cursor-text, var(--mos-text));
  border: 2px solid var(--mos-panel, var(--mos-bg));
  border-radius: 50%;
  width: 10px;
  height: 10px;
}

.studio-editor-preview-fs-toolbar {
  min-height: var(--cursor-head-h, 36px);
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 4px 8px;
  display: flex;
}

.studio-editor-preview-fs-toolbar-left, .studio-editor-preview-fs-toolbar-right {
  align-items: center;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.studio-editor-preview-fs-toolbar-left {
  flex: auto;
}

.studio-editor-preview-fs-toolbar-right {
  flex: none;
  justify-content: flex-end;
}

.studio-editor-preview-fs-toolbar .cursor-icon-btn {
  border-radius: var(--cursor-radius-sm, 6px);
  width: 26px;
  min-width: 26px;
  height: 26px;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  background: none;
  border: none;
  flex-shrink: 0;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.studio-editor-preview-fs-toolbar .cursor-icon-btn:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
}

.studio-editor-preview-fs-play .lucide-play {
  margin-left: 1px;
}

.studio-editor-preview-fs-time {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  align-items: center;
  margin-left: 2px;
  font-size: 11px;
  display: inline-flex;
}

.studio-editor-preview-fs-time-sep {
  opacity: .65;
  margin: 0 3px;
}

.studio-editor-preview-fs-volume {
  width: 72px;
  height: 4px;
  accent-color: var(--color-cursor-accent, #6b8afd);
  cursor: pointer;
  flex-shrink: 0;
  margin: 0;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen {
  background: #000;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-head {
  background: var(--mos-plate);
  color: var(--mos-text);
  border-bottom-color: #ffffff1f;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-tool {
  color: #ffffffb3;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-tool:hover {
  color: var(--cursor-on-accent);
  background: #ffffff1a;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-tool.is-active {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 28%, transparent);
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 55%, transparent);
  color: var(--cursor-accent, #c9a227);
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-stage {
  background: #000;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-canvas-zoom-controls {
  background: #ffffff14;
  border-color: #ffffff29;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-canvas-zoom-controls button {
  color: var(--mos-text);
  border-right-color: #ffffff1f;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-canvas-zoom-controls button:hover {
  background: #ffffff1f;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-canvas-zoom-controls .studio-editor-canvas-zoom-value {
  border-right-color: #ffffff1f;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-fs-transport {
  background: var(--mos-plate);
  color: var(--mos-text);
  border-top-color: #ffffff1f;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-fs-scrub-track:before {
  background: #ffffff2e;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-fs-scrub-input::-webkit-slider-thumb {
  background: var(--mos-text);
  border-color: var(--mos-plate);
  box-shadow: 0 0 0 1px #fff3;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-fs-scrub-input::-moz-range-thumb {
  background: var(--mos-text);
  border-color: var(--mos-plate);
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-fs-toolbar .cursor-icon-btn {
  color: var(--mos-text);
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-fs-toolbar .cursor-icon-btn:hover {
  background: #ffffff1a;
}

[data-appearance="dark"] .studio-editor-preview.is-fullscreen .studio-editor-preview-fs-time {
  color: #ffffffc7;
}

.studio-editor-preview-frame {
  --preview-ar: 1.77778;
  isolation: isolate;
  box-shadow: none;
  outline: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  aspect-ratio: var(--preview-ar);
  width: min(100cqw, calc(100cqh * var(--preview-ar)));
  transform-origin: center;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  background: #000;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  position: relative;
  overflow: visible;
}

.studio-editor-preview-video {
  object-fit: cover;
  object-position: center;
  cursor: pointer;
  background: #000;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-editor-preview-layer {
  object-fit: cover;
  object-position: center;
  contain: layout style paint;
  will-change: opacity, transform, filter, clip-path;
  background: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  transform: translateZ(0);
}

.studio-editor-preview-canvas {
  z-index: 1;
  image-rendering: auto;
  pointer-events: none;
  object-fit: fill;
  background: #000;
}

.studio-editor-preview-poster {
  z-index: 0;
  object-fit: contain;
  pointer-events: none;
}

.studio-editor-preview-hit {
  display: none;
}

.studio-editor-picture-stack-hit {
  z-index: 9;
  cursor: default;
  pointer-events: none;
  touch-action: none;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
}

.studio-editor-picture-layer {
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.studio-editor-picture-hit {
  z-index: 9;
  cursor: pointer;
  pointer-events: none;
  transform-origin: center;
  touch-action: none;
  background: none;
  border: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
}

.studio-editor-text-transform {
  z-index: 5;
}

.studio-editor-text-flip-row {
  pointer-events: auto;
  gap: 4px;
  display: flex;
  position: absolute;
  top: -28px;
  left: 50%;
  transform: translateX(-50%);
}

.studio-editor-text-flip-btn {
  border: 1px solid color-mix(in srgb, var(--cursor-accent, #c9a227) 55%, transparent);
  background: var(--mos-plate-strong);
  width: 22px;
  height: 22px;
  color: var(--mos-fg, inherit);
  cursor: pointer;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
}

.studio-editor-text-flip-btn:hover {
  background: var(--mos-hover);
}

.studio-editor-text-flip-btn.is-active {
  background: color-mix(in srgb, var(--cursor-accent, #c9a227) 28%, var(--mos-plate-strong));
  border-color: var(--cursor-accent, #c9a227);
  color: var(--cursor-accent, #c9a227);
}

.studio-editor-text-section {
  box-sizing: border-box;
  flex-direction: column;
  gap: 8px;
  width: calc(100% + 20px);
  min-width: 0;
  margin: 0 -10px;
  padding: 0 10px;
  display: flex;
}

.studio-editor-inspector-body:has(.studio-editor-text-tabs) {
  padding-top: 0;
}

.studio-editor-text-tabs {
  box-sizing: border-box;
  width: calc(100% + 20px);
  max-width: none;
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  z-index: 3;
  background: none;
  border-bottom: none;
  flex: none;
  align-items: center;
  gap: 4px;
  margin: 0 -10px;
  padding: 0 8px;
  display: flex;
  position: sticky;
  top: 0;
}

.studio-editor-text-tab {
  border-radius: var(--cursor-radius-pill, 999px);
  min-width: 0;
  height: 24px;
  min-height: 24px;
  color: var(--color-cursor-muted, var(--mos-muted));
  font: inherit;
  cursor: pointer;
  box-shadow: none;
  white-space: nowrap;
  background: none;
  border: 1px solid #0000;
  flex: 1 1 0;
  justify-content: center;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 650;
  transition: border-color .16s, color .16s, background .16s;
  display: inline-flex;
}

.studio-editor-text-tab > svg {
  flex: none;
  width: 13px;
  height: 13px;
}

.studio-editor-text-tab:hover {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-editor-text-tab.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 42%, var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 14%, transparent);
  color: var(--color-cursor-text-bright, var(--mos-text));
  box-shadow: none;
}

.studio-editor-text-preset-panel {
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-editor-text-preset-rail {
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  min-width: 0;
  display: flex;
  overflow: auto hidden;
}

.studio-editor-text-preset-rail::-webkit-scrollbar {
  display: none;
}

.studio-editor-text-preset-tag {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-raised, var(--mos-surface, var(--mos-page)));
  height: 22px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0 8px;
  font-size: 10.5px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-editor-text-preset-tag:hover {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-editor-text-preset-tag.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 46%, var(--mos-border));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 12%,
    var(--cursor-surface-raised, var(--mos-surface, var(--mos-page))));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-editor-text-preset-tag.is-save {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin-left: auto;
}

.studio-editor-text-preset-tag.is-save:hover:not(:disabled) {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-editor-text-preset-tag.is-save:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.studio-editor-text-preset-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  display: grid;
}

.studio-editor-text-preset-card {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  color: inherit;
  cursor: pointer;
  text-align: left;
  border-radius: 12px;
  margin: 0;
  padding: 0;
  display: block;
  position: relative;
  overflow: hidden;
}

.studio-editor-text-preset-card:hover {
  border-color: color-mix(in srgb, var(--cursor-accent) 28%, var(--color-cursor-border-soft, var(--mos-border)));
}

.studio-editor-text-preset-card.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 48%, var(--mos-border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent) 28%, transparent);
}

.studio-editor-text-preset-card-stage {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 16%, #12141a);
  justify-content: center;
  align-items: center;
  min-height: 76px;
  padding: 16px 12px;
  display: flex;
  overflow: hidden;
}

.studio-editor-text-preset-card-stage.is-dark {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, #0e1016);
}

.studio-editor-text-preset-card-stage.is-light {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, #f4f2ef);
}

[data-appearance="dark"] .studio-editor-text-preset-card-stage.is-light {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 14%, #ebe8e4);
}

[data-appearance="dark"] .studio-editor-text-preset-card-stage.is-dark {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 22%, #0a0c10);
}

.studio-editor-text-preset-card-sample {
  white-space: nowrap;
  text-align: center;
  max-width: 100%;
  padding: 4px 6px;
  font-size: 20px;
  line-height: 1.2;
  display: inline-block;
  overflow: visible;
}

.studio-editor-text-preset-card-delete {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: var(--mos-page, #fff);
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  border-radius: 999px;
  place-items: center;
  display: grid;
  position: absolute;
  top: 4px;
  right: 4px;
}

.studio-editor-text-preset-card-delete:hover {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-editor-text-chip-row {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-editor-text-chip {
  background: var(--mos-plate-strong);
  min-height: 28px;
  color: inherit;
  cursor: pointer;
  border: 1px solid #0000;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.studio-editor-text-chip:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.studio-editor-text-chip.is-active {
  background: color-mix(in srgb, var(--cursor-accent, #c9a227) 28%, var(--mos-plate-strong));
  border-color: var(--cursor-accent, #c9a227);
  color: var(--cursor-accent, #c9a227);
}

.studio-editor-motion-tabs {
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: 0 0 .55rem;
  display: grid;
}

.studio-editor-motion-tab {
  appearance: none;
  border: 1px solid var(--color-cursor-border, var(--mos-border, #0f172a38));
  background: var(--mos-plate, var(--cursor-surface, #fff));
  height: 26px;
  min-height: 26px;
  color: var(--color-cursor-muted, var(--mos-muted));
  font: inherit;
  cursor: pointer;
  box-sizing: border-box;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-editor-motion-tab:hover, .studio-editor-motion-tab.is-active {
  border-color: var(--color-cursor-border, var(--mos-border, #0f172a47));
  background: var(--mos-plate, var(--cursor-surface, #fff));
  color: var(--color-cursor-text, var(--mos-ink));
}

.studio-editor-motion-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .4rem;
  display: grid;
}

.studio-editor-motion-card {
  aspect-ratio: 1;
  border: 1px solid var(--mos-border);
  background: var(--mos-plate-strong);
  min-height: 0;
  color: var(--mos-text);
  cursor: pointer;
  border-radius: 10px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: .35rem;
  margin: 0;
  padding: .4rem .3rem .45rem;
  display: flex;
}

.studio-editor-motion-card:hover {
  background: color-mix(in srgb, var(--cursor-accent, #c9a227) 8%, var(--mos-plate-strong));
}

.studio-editor-motion-card.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, var(--mos-border));
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-bg));
  color: var(--cursor-accent);
}

.studio-editor-motion-card-glyph {
  width: 100%;
  min-height: 0;
  color: inherit;
  flex: auto;
  place-items: center;
  display: grid;
}

.studio-editor-motion-card-label {
  letter-spacing: .01em;
  text-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: none;
  max-width: 100%;
  font-size: .68rem;
  font-weight: 600;
  line-height: 1.1;
  overflow: hidden;
}

.studio-editor-motion-glyph {
  width: 40px;
  height: 40px;
  display: block;
  overflow: visible;
}

@media (prefers-reduced-motion: no-preference) {
  .studio-motion-anim-fade-in {
    animation: 1.5s ease-out infinite studio-motion-fade-in;
  }

  .studio-motion-anim-fade-out {
    animation: 1.5s ease-out infinite studio-motion-fade-out;
  }

  .studio-motion-anim-slide-up {
    animation: 1.45s ease-out infinite studio-motion-slide-up;
  }

  .studio-motion-anim-slide-down {
    animation: 1.45s ease-out infinite studio-motion-slide-down;
  }

  .studio-motion-anim-pop {
    transform-box: fill-box;
    transform-origin: center;
    animation: 1.5s ease-out infinite studio-motion-pop;
  }

  .studio-motion-anim-pop-ring {
    transform-box: fill-box;
    transform-origin: center;
    animation: 1.5s ease-out infinite studio-motion-pop-ring;
  }

  .studio-motion-anim-pop-burst {
    transform-box: fill-box;
    transform-origin: center;
    animation: 1.5s ease-out infinite studio-motion-pop-burst;
  }

  .studio-editor-motion-card.is-active .studio-motion-anim-fade-in, .studio-editor-motion-card.is-active .studio-motion-anim-fade-out, .studio-editor-motion-card.is-active .studio-motion-anim-slide-up, .studio-editor-motion-card.is-active .studio-motion-anim-slide-down, .studio-editor-motion-card.is-active .studio-motion-anim-pop, .studio-editor-motion-card.is-active .studio-motion-anim-pop-ring, .studio-editor-motion-card.is-active .studio-motion-anim-pop-burst {
    animation-duration: 1.15s;
  }
}

@keyframes studio-motion-fade-in {
  0% {
    opacity: .1;
  }

  65% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

@keyframes studio-motion-fade-out {
  0% {
    opacity: 1;
  }

  65% {
    opacity: .1;
  }

  100% {
    opacity: .1;
  }
}

@keyframes studio-motion-slide-up {
  0% {
    opacity: .2;
    transform: translateY(8px);
  }

  65% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes studio-motion-slide-down {
  0% {
    opacity: .2;
    transform: translateY(-8px);
  }

  65% {
    opacity: 1;
    transform: translateY(0);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes studio-motion-pop {
  0% {
    opacity: .15;
    transform: scale(.45);
  }

  45% {
    opacity: 1;
    transform: scale(1.1);
  }

  65% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes studio-motion-pop-ring {
  0% {
    opacity: 0;
    transform: scale(.35);
  }

  45% {
    opacity: .5;
    transform: scale(1.05);
  }

  100% {
    opacity: 0;
    transform: scale(1.4);
  }
}

@keyframes studio-motion-pop-burst {
  0% {
    opacity: 0;
    transform: scale(.65);
  }

  40% {
    opacity: .55;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(1.25);
  }
}

.studio-editor-text-pose-readout {
  opacity: .75;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px 10px;
  font-size: 11px;
  display: grid;
}

.studio-editor-transform-layer {
  z-index: 5;
  cursor: default;
  touch-action: none;
  pointer-events: none;
  position: absolute;
  inset: 0;
  overflow: visible;
}

.studio-editor-transform-hit {
  transform-origin: center;
  pointer-events: none;
  touch-action: none;
  position: absolute;
}

.studio-editor-transform-layer.is-playing {
  cursor: pointer;
}

.studio-editor-transform-layer.is-selected .studio-editor-transform-hit {
  cursor: move;
}

.studio-editor-transform-box {
  z-index: 1;
  pointer-events: none;
  transform-origin: center;
  border: 2px solid #38bdf8;
  position: absolute;
  overflow: visible;
}

.studio-editor-transform-handle {
  pointer-events: none;
  cursor: nwse-resize;
  touch-action: none;
  background: #fff;
  border: 1.5px solid #1e293b;
  border-radius: 999px;
  width: 13px;
  height: 13px;
  position: absolute;
}

.studio-editor-transform-handle.is-nw {
  top: 0;
  left: 0;
  transform: translate(-65%, -65%);
}

.studio-editor-transform-handle.is-ne {
  top: 0;
  left: 100%;
  transform: translate(-35%, -65%);
}

.studio-editor-transform-handle.is-sw {
  top: 100%;
  left: 0;
  transform: translate(-65%, -35%);
}

.studio-editor-transform-handle.is-se {
  top: 100%;
  left: 100%;
  transform: translate(-35%, -35%);
}

.studio-editor-transform-rotate {
  pointer-events: none;
  cursor: grab;
  touch-action: none;
  flex-direction: column;
  align-items: center;
  display: flex;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
}

.studio-editor-transform-rotate:active {
  cursor: grabbing;
}

.studio-editor-transform-rotate-stem {
  background: #38bdf8;
  width: 1.5px;
  height: 14px;
}

.studio-editor-transform-rotate-knob {
  color: #0f172a;
  background: #fff;
  border: 1.5px solid #64748b;
  border-radius: 999px;
  place-items: center;
  width: 24px;
  height: 24px;
  display: grid;
}

.studio-editor-transform-box.is-dragging .studio-editor-transform-handle, .studio-editor-transform-box.is-dragging .studio-editor-transform-badge, .studio-editor-transform-box.is-dragging .studio-editor-transform-rotate {
  opacity: 0;
}

.studio-editor-transform-guide {
  z-index: 6;
  pointer-events: none;
  background: none;
  position: absolute;
}

.studio-editor-transform-guide.is-vertical {
  border-left: 2px dashed #7dd3fc;
  width: 0;
  top: 0;
  bottom: 0;
  transform: translateX(-1px);
}

.studio-editor-transform-guide.is-horizontal {
  border-top: 2px dashed #7dd3fc;
  height: 0;
  left: 0;
  right: 0;
  transform: translateY(-1px);
}

.studio-editor-transform-guide.is-vertical.is-center, .studio-editor-transform-guide.is-horizontal.is-center {
  border-color: #7dd3fc;
}

.studio-editor-transform-badge {
  color: #e2e8f0;
  letter-spacing: .02em;
  white-space: nowrap;
  background: #0f172ad1;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 10px;
  font-weight: 600;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, calc(-100% - 6px));
}

.studio-editor-preview-buffering {
  z-index: 8;
  pointer-events: none;
  background: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-editor-preview-buffering .media-load-frame-wave {
  position: absolute;
  inset: 0;
}

.studio-editor-preview-status {
  z-index: 8;
  max-width: min(90%, 520px);
  color: var(--cursor-on-accent);
  text-align: center;
  pointer-events: none;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background: #101216c7;
  border-radius: 8px;
  padding: 7px 11px;
  font-size: 12px;
  line-height: 1.35;
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
}

.studio-editor-preview-status.is-error {
  background: #791919e6;
}

.studio-editor-pending {
  overscroll-behavior: contain;
  width: max-content;
  max-width: calc(100% - 16px);
  max-height: calc(100% - 20px);
  padding: 5px 8px;
  bottom: 10px;
  overflow: auto;
}

.studio-editor-pending.is-expanded {
  white-space: normal;
  width: min(100% - 16px, 420px);
  padding: 7px 10px;
}

.studio-editor-pending-line {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 4px 6px;
  min-width: 0;
  display: flex;
}

.studio-editor-pending-label {
  white-space: normal;
  text-align: center;
  font-variant-numeric: tabular-nums;
  min-width: 0;
  font-weight: 600;
  line-height: 1.2;
}

.studio-editor-pending-info {
  width: 20px;
  height: 20px;
  color: inherit;
  cursor: pointer;
  pointer-events: auto;
  background: #ffffff1f;
  border: 0;
  border-radius: 999px;
  flex: none;
  place-items: center;
  display: inline-grid;
}

.studio-editor-pending-info:hover, .studio-editor-pending-info[aria-expanded="true"] {
  background: #ffffff3d;
}

.studio-editor-pending-detail {
  opacity: .88;
  margin: 5px 0 0;
  font-size: 11.5px;
  line-height: 1.4;
}

.studio-editor-pending-ring {
  flex: none;
  transform: rotate(-90deg);
}

.studio-editor-pending-ring circle {
  fill: none;
  stroke-width: 2.4px;
}

.studio-editor-pending-ring-track {
  stroke: #ffffff38;
}

.studio-editor-pending-ring-fill {
  stroke: #34d399;
  stroke-linecap: round;
  transition: stroke-dashoffset .6s;
}

.studio-editor-pending-ring.is-indeterminate {
  animation: 1.1s linear infinite studio-editor-pending-spin;
}

@keyframes studio-editor-pending-spin {
  from {
    transform: rotate(-90deg);
  }

  to {
    transform: rotate(270deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-editor-pending-ring.is-indeterminate {
    animation: none;
  }
}

.studio-editor-preview-transition-overlay {
  pointer-events: none;
  z-index: 3;
  position: absolute;
  inset: 0;
}

.studio-editor-preview-empty {
  text-align: center;
  color: #00000059;
  place-items: center;
  height: 100%;
  padding: 1rem;
  font-size: .75rem;
  display: grid;
}

.studio-editor-transport {
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  box-sizing: border-box;
  background: none;
  border: none;
  flex-shrink: 0;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: .5rem;
  padding: 0 .75rem;
  display: grid;
}

.studio-editor-transport-left, .studio-editor-transport-right {
  align-items: center;
  gap: .1rem;
  display: inline-flex;
}

.studio-editor-transport-right {
  justify-content: flex-end;
}

.studio-editor-transport-left button, .studio-editor-transport-right .studio-editor-zoom button, .studio-editor-overlay-snap {
  width: 26px;
  height: 26px;
  color: var(--mos-text-soft);
  background: none;
  border: none;
  border-radius: 6px;
  place-items: center;
  display: grid;
}

.studio-editor-transport-left button:hover:not(:disabled), .studio-editor-transport-right .studio-editor-zoom button:hover, .studio-editor-overlay-snap:hover {
  background: var(--mos-hover);
  color: var(--mos-text);
}

.studio-editor-overlay-snap.is-active {
  background: var(--mos-plate-strong);
  color: var(--mos-text);
}

.studio-editor-transport-left button:disabled {
  opacity: .3;
  cursor: not-allowed;
}

.studio-editor-transport-center {
  justify-content: center;
  align-items: center;
  gap: .5rem;
  display: inline-flex;
}

.studio-editor-transport-play {
  background: var(--mos-plate);
  width: 26px;
  height: 26px;
  color: var(--mos-text);
  border: none;
  border-radius: 999px;
  flex-shrink: 0;
  place-items: center;
  display: grid;
}

.studio-editor-transport-time {
  font-variant-numeric: tabular-nums;
  color: var(--mos-muted);
  white-space: nowrap;
  font-size: .72rem;
}

.studio-editor-transport-sep {
  opacity: .4;
  margin: 0 .35rem;
}

.studio-editor-zoom {
  align-items: center;
  gap: 0;
  display: inline-flex;
}

.studio-editor-zoom-input {
  box-sizing: border-box;
  background: var(--mos-plate);
  width: 3.25rem;
  height: 26px;
  color: var(--mos-text);
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: center;
  appearance: textfield;
  border: none;
  border-radius: 999px;
  margin: 0 2px;
  padding: 0 4px;
  font-size: .7rem;
}

.studio-editor-zoom-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.studio-editor-zoom-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.studio-editor-zoom-input:focus {
  box-shadow: none;
  outline: none;
}

.studio-editor-export-btn {
  border: 1px solid var(--mos-border);
  background: var(--mos-bg);
  height: 28px;
  color: var(--mos-text);
  white-space: nowrap;
  border-radius: 6px;
  margin-left: .25rem;
  padding: 0 .65rem;
  font-size: .72rem;
  font-weight: 500;
  box-shadow: 0 1px 2px #0000000f;
}

.studio-editor-export-btn:hover:not(:disabled) {
  background: var(--mos-hover);
}

.studio-editor-export-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.studio-editor-timeline-panel {
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-editor-timeline-wrap {
  --studio-edit-accent: #00c2c7;
  background: var(--mos-page, var(--mos-bg));
  min-height: 0;
  color: var(--mos-text);
  flex-direction: column;
  flex: auto;
  display: flex;
  overflow: hidden;
}

.studio-editor-timeline-scroll {
  overscroll-behavior: contain;
  background: var(--mos-page, var(--mos-bg));
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.studio-editor-timeline-canvas {
  box-sizing: border-box;
  flex-direction: column;
  min-height: 100%;
  display: flex;
  position: relative;
}

.studio-editor-track-block {
  flex-direction: column;
  flex: none;
  display: flex;
}

.studio-editor-timeline-empty-row {
  background: none;
  flex: auto;
  align-items: stretch;
  min-height: 48px;
  display: flex;
}

.studio-editor-timeline-empty-rail {
  pointer-events: none;
  flex: none;
  background: none !important;
  border: none !important;
}

.studio-editor-timeline-empty {
  cursor: default;
  touch-action: pan-y;
  background: none;
  border-radius: 0;
  flex: auto;
  min-height: 48px;
  margin: 0;
}

.studio-editor-ruler {
  z-index: 6;
  cursor: var(--studio-cursor-resize-x, ew-resize);
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
  background: none;
  border: none;
  flex-shrink: 0;
  position: sticky;
  top: 0;
}

.studio-editor-ruler-mark {
  background: color-mix(in srgb, var(--mos-text) 22%, transparent);
  pointer-events: none;
  border: none;
  width: 1px;
  margin-left: -.5px;
  position: absolute;
  top: 2px;
}

.studio-editor-ruler-mark.is-minor {
  background: color-mix(in srgb, var(--mos-text) 12%, transparent);
  height: 7px;
}

.studio-editor-ruler-mark.is-major {
  background: color-mix(in srgb, var(--mos-text) 28%, transparent);
  width: 1px;
  height: 18px;
  margin-left: -.5px;
}

.studio-editor-ruler-label {
  color: var(--mos-muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  pointer-events: none;
  font-size: .62rem;
  line-height: 1;
  position: absolute;
  top: 9px;
  left: 4px;
  transform: none;
}

.studio-editor-track-row {
  background: none;
  border: none;
  flex: none;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: stretch;
  display: grid;
  position: relative;
}

.studio-editor-track-row:after {
  content: none;
}

.studio-editor-track-row.is-drop-target .studio-editor-track-lane, .studio-editor-track-row.is-drop-target .studio-editor-track-rail {
  background: color-mix(in srgb, #00c2c7 6%, var(--mos-plate));
}

.studio-editor-track-rail {
  background: none;
  border: none;
  flex-shrink: 0;
  justify-content: center;
  align-self: stretch;
  align-items: center;
  display: flex;
}

.studio-editor-track-rail-inner {
  width: 100%;
  height: 100%;
  color: var(--mos-muted, var(--color-cursor-muted));
  box-sizing: border-box;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 2px;
  padding: 0 4px;
  display: flex;
}

.studio-editor-track-btn {
  width: 26px;
  height: 26px;
  color: var(--mos-muted, var(--color-cursor-muted));
  background: none;
  border: none;
  border-radius: 8px;
  place-items: center;
  transition: background .12s, color .12s;
  display: grid;
}

.studio-editor-track-btn:hover {
  background: var(--mos-hover, var(--mos-bg));
  color: var(--mos-text, var(--color-cursor-text));
}

.studio-editor-track-btn.is-static {
  cursor: default;
}

.studio-editor-track-btn.is-active {
  background: color-mix(in srgb, #00c2c7 12%, var(--mos-panel));
  color: #0f8f92;
}

.studio-editor-track-lane {
  background: var(--mos-plate);
  cursor: default;
  touch-action: pan-y;
  border-radius: 0 8px 8px 0;
  margin: 0;
  position: relative;
}

.studio-editor-track-row .studio-editor-track-rail {
  background: var(--mos-plate);
  border: none;
  border-radius: 8px 0 0 8px;
  margin: 0;
}

.studio-editor-marquee {
  z-index: 30;
  pointer-events: none;
  border: 1px solid color-mix(in srgb, var(--studio-edit-accent, #00c2c7) 80%, #fff);
  background: color-mix(in srgb, var(--studio-edit-accent, #00c2c7) 18%, transparent);
  box-sizing: border-box;
  border-radius: 4px;
  position: absolute;
}

.studio-editor-track-row.is-text {
  overflow: hidden;
}

.studio-editor-track-row.is-text .studio-editor-track-rail-inner {
  gap: 0;
  padding: 0;
}

.studio-editor-track-row.is-text .studio-editor-track-btn {
  border-radius: 6px;
  width: 22px;
  height: 22px;
}

.studio-editor-track-row.is-text .studio-editor-track-rail {
  background: var(--mos-plate);
  border-radius: 8px 0 0 8px;
  margin: 0;
}

.studio-editor-track-row.is-text .studio-editor-track-lane {
  background: var(--mos-plate);
  border-radius: 0 8px 8px 0;
  height: 100%;
  min-height: 0;
  margin: 0;
  overflow: hidden;
}

.studio-editor-track-row.is-text .studio-editor-clip, .studio-editor-track-row.is-text .studio-editor-slot-ghost, .studio-editor-track-row.is-text .studio-editor-ripple-ghost {
  box-sizing: border-box;
  border-radius: 6px;
  height: 100%;
  max-height: 100%;
  top: 0;
  bottom: auto;
  overflow: hidden;
}

.studio-editor-track-row.is-video .studio-editor-track-lane, .studio-editor-track-row.is-audio .studio-editor-track-lane, .studio-editor-track-row.is-text .studio-editor-track-lane, .studio-editor-track-row.is-video .studio-editor-track-rail, .studio-editor-track-row.is-audio .studio-editor-track-rail {
  background: var(--mos-plate);
}

.studio-editor-timeline-wrap.is-panning, .studio-editor-timeline-wrap.is-panning * {
  cursor: grabbing !important;
}

body.is-timeline-panning, body.is-timeline-panning * {
  cursor: grabbing !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

body.is-timeline-zoom-drag, body.is-timeline-zoom-drag * {
  cursor: var(--studio-cursor-resize-x, ew-resize) !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

body.is-drag-cursor .studio-editor-clip {
  pointer-events: none;
}

.studio-editor-clip {
  --studio-clip-accent: var(--studio-edit-accent, #00c2c7);
  cursor: grab;
  -webkit-user-select: none;
  user-select: none;
  height: 100%;
  box-shadow: none;
  z-index: 4;
  border: none;
  border-radius: 8px;
  position: absolute;
  top: 0;
  overflow: visible;
}

.studio-editor-clip-body {
  z-index: 1;
  border: none;
  border-radius: 8px;
  position: absolute;
  inset: 0;
  overflow: hidden;
  transform: translateZ(0);
}

.studio-editor-clip.is-video {
  background: none;
}

.studio-editor-clip.is-video .studio-editor-clip-body {
  background: #1a1c20;
}

.studio-editor-clip.is-audio {
  background: none;
}

.studio-editor-clip.is-audio .studio-editor-clip-body {
  background: color-mix(in srgb, var(--color-cursor-composer, #07111f) 72%, #4b5563);
  border: 0;
}

.studio-editor-clip.is-text {
  background: none;
  overflow: hidden;
}

.studio-editor-clip.is-text .studio-editor-clip-body {
  background: #e4d0fd;
  border-radius: 6px;
  overflow: hidden;
}

.studio-editor-clip.is-text.is-selected .studio-editor-clip-handle {
  top: 18%;
  bottom: 18%;
}

.studio-editor-clip.is-ripple-dimmed {
  opacity: .28;
}

.studio-editor-track-row.is-ripple-active .studio-editor-track-lane {
  background: color-mix(in srgb, var(--cursor-accent, #2563eb) 6%, var(--mos-composer, #dfe1e6) 94%);
}

.studio-editor-ripple-layer {
  pointer-events: none;
  z-index: 1;
  position: absolute;
  inset: 0;
}

.studio-editor-ripple-ghost {
  opacity: .92;
  background: #00c2c724;
  border: none;
  border-radius: 8px;
  height: 100%;
  position: absolute;
  top: 0;
  overflow: hidden;
}

.studio-editor-ripple-ghost.is-dragged {
  background: color-mix(in srgb, var(--cursor-accent, #2563eb) 22%, transparent);
  box-shadow: 0 2px 8px color-mix(in srgb, var(--cursor-accent, #2563eb) 25%, transparent);
  border-style: solid;
}

.studio-editor-ripple-ghost.is-video {
  background: color-mix(in srgb, var(--cursor-accent, #2563eb) 10%, #101114);
}

.studio-editor-ripple-ghost.is-audio {
  background: color-mix(in srgb, var(--color-cursor-composer, #07111f) 45%, #6b7280);
  border-color: color-mix(in srgb, var(--color-cursor-border, #94a3b833) 80%, transparent);
}

.studio-editor-ripple-ghost.is-text {
  background: #a855f729;
}

.studio-editor-track-insert-wrap {
  z-index: 1;
  pointer-events: none;
  flex-shrink: 0;
  align-items: center;
  margin: -6px 0;
  display: flex;
  position: relative;
}

body.is-timeline-media-drag .studio-editor-track-insert-wrap, body.is-clip-pickup .studio-editor-track-insert-wrap, .studio-editor-track-insert-wrap.is-active {
  pointer-events: auto;
  z-index: 5;
}

.studio-editor-track-insert {
  opacity: 0;
  pointer-events: none;
  height: 1px;
  box-shadow: none;
  background: none;
  border-radius: 0;
  flex: 1;
  transition: opacity .1s, background .1s;
}

.studio-editor-track-insert-wrap.is-active .studio-editor-track-insert {
  opacity: 1;
  background: var(--studio-edit-accent, #00c2c7);
  height: 1px;
  box-shadow: none;
}

.studio-editor-track-row.is-reordering {
  opacity: .35;
}

.studio-editor-track-btn.is-grip {
  cursor: grab;
  width: 18px;
  height: 22px;
  color: color-mix(in srgb, var(--color-cursor-text, var(--mos-text)) 55%, transparent);
  border-radius: 6px;
  flex: none;
}

.studio-editor-track-btn.is-grip:active {
  cursor: grabbing;
}

.studio-editor-track-rail-inner .studio-editor-track-btn:not(.is-grip) {
  border-radius: 6px;
  flex: none;
  width: 22px;
  height: 22px;
}

.studio-editor-track-rail-inner.is-reordering .studio-editor-track-btn.is-grip {
  color: var(--cursor-accent, #2563eb);
  background: color-mix(in srgb, var(--cursor-accent, #2563eb) 12%, var(--mos-panel));
}

.studio-editor-clip.is-dragging {
  cursor: grabbing;
  z-index: 4;
}

.studio-editor-clip.is-picked-up {
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  min-width: 0 !important;
  box-shadow: none !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.studio-editor-clip.is-picked-up:after {
  display: none !important;
}

.studio-editor-clip.is-pickup-float {
  pointer-events: none;
  cursor: grabbing;
  will-change: transform;
  filter: drop-shadow(0 10px 22px #0f172a47);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000001 !important;
}

.studio-editor-clip.is-pickup-float.is-text {
  border-radius: 6px;
  overflow: hidden;
}

.studio-editor-clip.is-pickup-float.is-text .studio-editor-clip-body {
  border-radius: 6px;
}

.studio-editor-clip.is-pickup-float.is-not-viable {
  opacity: .55;
  filter: grayscale(.2) drop-shadow(0 8px 16px #0f172a33);
}

.studio-editor-clip.is-ripple-shifting, body.is-clip-pickup .studio-editor-track-row .studio-editor-clip:not(.is-picked-up), .studio-editor-track-row.is-ripple-active .studio-editor-clip:not(.is-picked-up) {
  transition: left .16s;
}

.studio-editor-slot-ghost {
  pointer-events: none;
  z-index: 2;
  box-sizing: border-box;
  border-radius: 8px;
  height: 100%;
  transition: left .16s, width .16s;
  position: absolute;
  top: 0;
  overflow: hidden;
}

.studio-editor-slot-ghost.is-video, .studio-editor-slot-ghost.is-image {
  background: color-mix(in srgb, var(--studio-edit-accent, #00c2c7) 22%, transparent);
  box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--studio-edit-accent, #00c2c7) 65%, transparent);
}

.studio-editor-slot-ghost.is-audio {
  background: color-mix(in srgb, var(--color-cursor-composer, #07111f) 28%, transparent);
  box-shadow: inset 0 0 0 1.5px #9ca3af8c;
}

.studio-editor-slot-ghost.is-text {
  background: #a855f733;
  box-shadow: inset 0 0 0 1.5px #a855f78c;
}

.studio-editor-slot-ghost.is-media-drop {
  opacity: .85;
}

.studio-editor-slot-ghost.is-media-drop .studio-editor-filmstrip, .studio-editor-slot-ghost.is-media-drop .studio-editor-audio-waveform {
  opacity: .55;
}

body.is-clip-pickup, body.is-clip-pickup * {
  cursor: grabbing !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

body.is-clip-pickup .studio-editor-track-row.is-drop-target .studio-editor-track-lane {
  background: color-mix(in srgb, #00c2c7 8%, var(--mos-panel));
}

.studio-editor-clip.is-selected {
  z-index: 8;
  background: none !important;
}

.studio-editor-clip.is-selected .studio-editor-clip-body {
  box-shadow: none;
  border: none;
  border-radius: 8px;
  outline: none;
  inset: 0;
}

.studio-editor-clip.is-selected:after {
  content: "";
  border: 2px solid var(--studio-clip-accent);
  box-sizing: border-box;
  pointer-events: none;
  z-index: 10;
  border-radius: 8px;
  position: absolute;
  inset: 0;
}

.studio-editor-clip.is-text.is-selected:after {
  border-width: 1.5px;
  border-radius: 6px;
  inset: 0;
}

.studio-editor-filmstrip, .studio-editor-filmstrip--css {
  background-color: #1a1c20;
  border-radius: 8px;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: hidden;
}

.studio-editor-filmstrip img {
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  flex-shrink: 0;
  width: 28px;
  height: 100%;
}

.studio-editor-filmstrip img:first-child {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.studio-editor-filmstrip img:last-child {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.studio-editor-filmstrip-empty {
  background: linear-gradient(135deg, #2a2d34 25%, #0000 25%) -8px 0 / 16px 16px, linear-gradient(225deg, #2a2d34 25%, #0000 25%) -8px 0 / 16px 16px, #1a1c20;
  width: 100%;
  height: 100%;
}

.studio-editor-filmstrip--logo {
  background: #2a2e36;
  align-items: stretch;
  display: flex;
}

.studio-editor-filmstrip-logo-tile {
  object-fit: contain;
  object-position: center;
  box-sizing: border-box;
  opacity: .34;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  background: linear-gradient(#ffffff14, #0000 60%), #32363f;
  border-right: 1px solid #ffffff14;
  flex-shrink: 0;
  width: 28px;
  height: 100%;
  padding: 14px 10px;
}

.studio-editor-audio-wave {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-editor-audio-waveform {
  width: 100%;
  height: 100%;
}

.studio-editor-audio-waveform canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

.studio-editor-clip-fade-mask {
  z-index: 3;
  border-radius: inherit;
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none !important;
}

.studio-editor-clip-fade {
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  overflow: visible;
  pointer-events: none !important;
}

.studio-editor-clip-fade.is-in {
  left: 0;
}

.studio-editor-clip-fade.is-out {
  right: 0;
}

.studio-editor-clip-fade path {
  fill: #0000008c;
}

.studio-editor-clip-fade-handle {
  z-index: 12;
  cursor: ew-resize;
  opacity: 0;
  pointer-events: none;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  width: 14px;
  height: 14px;
  margin: 0;
  position: absolute;
  top: 0;
  transform: translate(-50%, -50%);
}

.studio-editor-clip.is-selected .studio-editor-clip-fade-handle, .studio-editor-clip-fade-handle.is-active {
  opacity: 1;
  pointer-events: auto;
}

.studio-editor-clip-fade-handle.is-in {
  z-index: 12;
}

.studio-editor-clip-fade-handle.is-out {
  z-index: 13;
}

.studio-editor-clip-fade-handle:before {
  content: "";
  border: 1.5px solid var(--studio-clip-accent, #00c2c7);
  box-sizing: border-box;
  pointer-events: none;
  background: #111314;
  border-radius: 4px;
  width: 8px;
  height: 8px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%)rotate(45deg);
}

.studio-editor-drop-ghost {
  pointer-events: none;
  z-index: 3;
  background: #00c2c71f;
  border: none;
  border-radius: 8px;
  height: 100%;
  position: absolute;
  top: 0;
  overflow: hidden;
}

.studio-editor-drop-ghost.is-audio {
  background: color-mix(in srgb, var(--color-cursor-composer, #07111f) 55%, #6b7280);
}

.studio-editor-drop-ghost-label {
  color: var(--cursor-accent, #2563eb);
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: .25rem .45rem;
  font-size: .6rem;
  display: block;
  overflow: hidden;
}

.studio-editor-clip-label {
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--mos-text-soft);
  padding: .25rem .45rem;
  font-size: .6rem;
  display: block;
  overflow: hidden;
}

.studio-editor-clip.is-text .studio-editor-clip-label.is-text {
  box-sizing: border-box;
  height: 100%;
  max-height: 100%;
  color: color-mix(in srgb, #6b21a8 70%, var(--mos-text));
  align-items: center;
  margin: 0;
  padding: 0 .4rem;
  font-size: .58rem;
  font-weight: 600;
  line-height: 1;
  display: flex;
}

.studio-editor-clip-name {
  z-index: 4;
  box-sizing: content-box;
  isolation: isolate;
  color: #fffffff2;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
  width: max-content;
  max-width: calc(100% - 8px);
  text-shadow: none;
  background: none;
  border: none;
  border-radius: 0 0 0 8px;
  padding: 8px 46px 1px 8px;
  font-size: .6rem;
  font-weight: 700;
  line-height: 1.15;
  position: absolute;
  bottom: 0;
  left: 0;
  right: auto;
  overflow: hidden;
}

.studio-editor-clip-name:before {
  content: "";
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(to top, #080a0c9e 0%, #080a0c61 40%, #080a0c1f 72%, #080a0c00 100%);
  position: absolute;
  inset: 0;
  -webkit-mask-image: linear-gradient(to right, #000 0% calc(100% - 40px), #0000008c calc(100% - 22px), #0003 calc(100% - 8px), #0000 100%);
  mask-image: linear-gradient(to right, #000 0% calc(100% - 40px), #0000008c calc(100% - 22px), #0003 calc(100% - 8px), #0000 100%);
}

.studio-editor-clip-name.is-editable {
  pointer-events: auto;
  cursor: inherit;
}

.studio-editor-clip-name.is-editing {
  pointer-events: auto;
  box-sizing: content-box;
  width: max-content;
  min-width: 4ch;
  max-width: calc(100% - 48px);
  box-shadow: none;
  font: inherit;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fffffff2;
  text-shadow: none;
  background: linear-gradient(to top, #080a0c9e 0%, #080a0c61 40%, #080a0c1f 72%, #080a0c00 100%);
  outline: none;
  padding: 8px 46px 1px 8px;
  font-size: .6rem;
  font-weight: 700;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, #000 0% calc(100% - 40px), #0000008c calc(100% - 22px), #0003 calc(100% - 8px), #0000 100%);
  mask-image: linear-gradient(to right, #000 0% calc(100% - 40px), #0000008c calc(100% - 22px), #0003 calc(100% - 8px), #0000 100%);
}

.studio-editor-clip-name.is-editing:before {
  display: none;
}

.studio-editor-clip-handle {
  width: 10px;
  cursor: var(--studio-cursor-resize-x, ew-resize);
  z-index: 2;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  bottom: 0;
}

.studio-editor-clip.is-selected .studio-editor-clip-handle {
  opacity: 1;
  background: var(--mos-text, var(--color-cursor-text, #111314));
  box-sizing: border-box;
  width: 5px;
  box-shadow: none;
  z-index: 11;
  pointer-events: auto;
  border: none;
  border-radius: 6px;
  top: 34%;
  bottom: 34%;
}

.studio-editor-clip.is-selected .studio-editor-clip-handle:before, .studio-editor-clip.is-selected .studio-editor-clip-handle:after {
  content: none;
}

.studio-editor-clip-handle.is-left {
  border-radius: 8px 0 0 8px;
  left: 0;
}

.studio-editor-clip.is-selected .studio-editor-clip-handle.is-left {
  border-top: 2px solid var(--studio-clip-accent);
  border-bottom: 2px solid var(--studio-clip-accent);
  border-right: 2px solid var(--studio-clip-accent);
  border-left: none;
  border-radius: 6px;
  left: 0;
}

.studio-editor-clip-handle.is-right {
  border-radius: 0 8px 8px 0;
  right: 0;
}

.studio-editor-clip.is-selected .studio-editor-clip-handle.is-right {
  border-top: 2px solid var(--studio-clip-accent);
  border-bottom: 2px solid var(--studio-clip-accent);
  border-left: 2px solid var(--studio-clip-accent);
  border-right: none;
  border-radius: 6px;
  right: 0;
}

.studio-editor-clip-snip {
  z-index: 12;
  cursor: pointer;
  pointer-events: auto;
  background: none;
  border: none;
  width: 18px;
  margin-left: -9px;
  padding: 0;
  position: absolute;
  top: 0;
  bottom: 0;
}

.studio-editor-clip-snip-icon {
  width: 12px;
  height: 16px;
  color: var(--cursor-on-accent);
  opacity: .82;
  pointer-events: none;
  filter: drop-shadow(0 0 1px #000000e6);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.studio-editor-clip-snip-icon:before, .studio-editor-clip-snip-icon:after {
  content: "";
  box-sizing: border-box;
  border-style: solid;
  border-color: currentColor;
  width: 6px;
  position: absolute;
  top: 0;
  bottom: 0;
}

.studio-editor-clip-snip-icon:before {
  border-width: 2px 2px 2px 0;
  left: 0;
}

.studio-editor-clip-snip-icon:after {
  border-width: 2px 0 2px 2px;
  right: 0;
}

.studio-editor-clip-snip:hover .studio-editor-clip-snip-icon {
  color: var(--studio-clip-accent, #00c2c7);
  opacity: 1;
  transform: translate(-50%, -50%)scale(1.08);
}

.studio-editor-playhead {
  pointer-events: none;
  cursor: default;
  touch-action: none;
  z-index: 8;
  background: none;
  width: 16px;
  margin-left: -8px;
  position: absolute;
  top: 0;
  bottom: 0;
}

.studio-editor-playhead-grip {
  pointer-events: auto;
  cursor: default;
  touch-action: none;
  z-index: 2;
  height: 18px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.studio-editor-playhead:after {
  content: "";
  background: var(--cursor-accent, var(--studio-edit-accent, #00c2c7));
  pointer-events: none;
  width: 1px;
  margin: 0 auto;
  position: absolute;
  inset: 0;
}

.studio-editor-playhead:before {
  content: "";
  background: var(--cursor-accent, var(--studio-edit-accent, #00c2c7));
  pointer-events: none;
  z-index: 1;
  width: 11px;
  height: 16px;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='16' viewBox='0 0 11 16'%3E%3Cpath d='M2.6 1.15H8.4A1.7 1.7 0 0 1 10.1 2.85v6.55L6.05 13.85a.7.7 0 0 1-.9 0L0.9 9.4V2.85A1.7 1.7 0 0 1 2.6 1.15Z'/%3E%3C/svg%3E") center / 11px 16px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='16' viewBox='0 0 11 16'%3E%3Cpath d='M2.6 1.15H8.4A1.7 1.7 0 0 1 10.1 2.85v6.55L6.05 13.85a.7.7 0 0 1-.9 0L0.9 9.4V2.85A1.7 1.7 0 0 1 2.6 1.15Z'/%3E%3C/svg%3E") center / 11px 16px no-repeat;
}

.studio-editor-playhead.is-scrubbing:before {
  background: var(--cursor-accent, var(--studio-edit-accent, #00c2c7));
}

.studio-editor-snap-guide {
  background: var(--cursor-accent, #2563eb);
  pointer-events: none;
  z-index: 4;
  opacity: .75;
  width: 1px;
  position: absolute;
  top: 0;
  bottom: 0;
}

.studio-editor-snap-guide:before {
  content: "";
  background: var(--cursor-accent, #2563eb);
  border-radius: 999px;
  width: 6px;
  height: 6px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

@media (max-width: 720px) {
  .studio-editor-transport-time {
    font-size: .66rem;
  }
}

.studio-editor-inspector .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;
}

.studio-editor-type-stack {
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  display: flex;
}

.studio-editor-font-size-row {
  align-items: stretch;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-editor-font-select {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  min-width: 0;
  height: 34px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  cursor: pointer;
  border-radius: 10px;
  flex: auto;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  font-size: 13px;
  font-weight: 600;
  transition: background-color .15s, border-color .15s, color .15s;
  display: inline-flex;
}

.studio-editor-font-select:hover {
  color: var(--color-cursor-text-bright, var(--mos-text));
  border-color: var(--color-cursor-border, var(--mos-border));
}

.studio-editor-font-select[aria-expanded="true"] {
  border-color: color-mix(in srgb, var(--cursor-accent) 42%, var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent) 8%, var(--mos-page, #fff));
}

.studio-editor-font-select-label {
  text-align: left;
  min-width: 0;
}

.studio-editor-font-select > svg {
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.studio-editor-font-size {
  flex: 0 0 68px;
}

.studio-editor-font-size input {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  width: 100%;
  height: 34px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  font-variant-numeric: tabular-nums;
  text-align: center;
  border-radius: 10px;
  padding: 0 6px;
  font-size: 13px;
  font-weight: 650;
}

.studio-editor-font-size input:focus {
  border-color: color-mix(in srgb, var(--cursor-accent) 45%, var(--mos-border));
  outline: none;
}

.studio-editor-font-panel, .studio-editor-color-panel {
  z-index: 140;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border)) 82%, transparent);
  background: var(--mos-plate, var(--mos-panel));
  border-radius: 14px;
  flex-direction: column;
  max-height: min(480px, 78vh);
  display: flex;
  position: fixed;
  overflow: hidden;
  box-shadow: 0 1px 2px #0000001a, 0 12px 32px #0000002e;
}

.studio-editor-font-search {
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-page, var(--mos-panel));
  color: var(--color-cursor-muted, var(--mos-muted));
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
}

.studio-editor-font-search input {
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  background: none;
  border: 0;
  outline: none;
  flex: 1;
  font-size: 13px;
}

.studio-editor-font-list {
  overscroll-behavior: contain;
  scrollbar-width: thin;
  flex: auto;
  min-height: 0;
  padding: 6px;
  overflow: hidden auto;
}

.studio-editor-font-list::-webkit-scrollbar:horizontal {
  height: 0;
  display: none;
}

.studio-editor-font-group-label {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--mos-muted));
  padding: 8px 10px 4px;
  font-size: 11px;
  font-weight: 700;
}

.studio-editor-font-option {
  width: 100%;
  min-height: 36px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 10px;
  align-items: center;
  padding: 6px 10px;
  font-size: 14px;
  transition: background-color .15s, color .15s;
  display: flex;
}

.studio-editor-font-option:hover {
  background: color-mix(in srgb, var(--mos-hover, #e6e6ec) 70%, transparent);
}

.studio-editor-font-option.is-active {
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-page, #fff));
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-weight: 650;
}

.studio-editor-font-more-hint {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 8px 10px;
  font-size: 11px;
}

.studio-editor-text-toolbar {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: color-mix(in srgb, var(--mos-page, #fff) 72%, transparent);
  border-radius: 12px;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 6px;
  display: flex;
}

.studio-editor-text-tool {
  width: 30px;
  height: 30px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 8px;
  place-items: center;
  transition: background-color .15s, border-color .15s, color .15s;
  display: grid;
}

.studio-editor-text-tool:hover {
  color: var(--color-cursor-text, var(--mos-text));
  background: color-mix(in srgb, var(--mos-hover, #e6e6ec) 65%, transparent);
}

.studio-editor-text-tool.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 36%, var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-page, #fff));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-editor-text-tool-sep {
  background: var(--studio-chrome-divider, var(--color-cursor-border-soft));
  width: 1px;
  height: 18px;
  margin: 0 2px;
}

.studio-editor-text-tool-wrap {
  position: relative;
}

.studio-editor-align-popover, .studio-editor-spacing-popover {
  z-index: 20;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border)) 82%, transparent);
  background: var(--mos-plate, var(--mos-panel));
  border-radius: 12px;
  grid-template-columns: repeat(4, 30px);
  gap: 4px;
  padding: 8px;
  display: grid;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  box-shadow: 0 1px 2px #00000014, 0 10px 24px #00000029;
}

.studio-editor-spacing-popover {
  grid-template-columns: 1fr;
  width: min(240px, 70vw);
}

.studio-editor-align-popover button {
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  width: 30px;
  height: 30px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  border: 1px solid #0000;
  border-radius: 8px;
  place-items: center;
  display: grid;
}

.studio-editor-align-popover button:hover {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-editor-align-popover button.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 36%, var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent) 12%, var(--mos-page, #fff));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-editor-align-popover button:disabled {
  opacity: .35;
  cursor: default;
}

.studio-editor-style-stack {
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.studio-editor-style-card {
  background: var(--color-cursor-panel, var(--mos-page, #fff));
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border)) 82%, transparent);
  border-radius: 12px;
  overflow: visible;
}

.studio-editor-style-card.is-open {
  background: var(--color-cursor-panel, var(--mos-page, #fff));
}

.studio-editor-style-card-head {
  align-items: center;
  gap: 4px;
  min-height: 40px;
  padding: 4px 6px 4px 12px;
  display: flex;
}

.studio-editor-style-card-summary {
  flex: auto;
  min-width: 0;
}

.studio-editor-style-card-summary .studio-editor-color-row {
  min-height: 32px;
}

.studio-editor-style-card-summary[role="button"] {
  cursor: pointer;
}

.studio-editor-style-card-caret {
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.studio-editor-style-card-caret:hover {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-editor-style-card-caret svg {
  transition: transform .15s;
}

.studio-editor-style-card.is-open .studio-editor-style-card-caret svg {
  transform: rotate(180deg);
}

.studio-editor-style-card-meta {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 500;
}

.studio-editor-style-card-actions {
  justify-content: flex-end;
  margin: -2px 0 0;
  display: flex;
}

.studio-editor-style-card-body {
  background: none;
  border-top: 0;
  flex-direction: column;
  gap: 10px;
  padding: 0 12px 12px;
  display: flex;
}

.studio-editor-style-card:not(.is-open) .studio-editor-style-card-body {
  display: none;
}

.studio-editor-style-card-toggle-row {
  min-height: 32px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  cursor: default;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
}

.studio-editor-color-row {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  min-height: 34px;
  display: flex;
}

.studio-editor-color-row-label {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 13px;
}

.studio-editor-color-row-actions {
  align-items: center;
  gap: 6px;
  display: inline-flex;
}

.studio-editor-color-swatch {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  cursor: pointer;
  background: #fff;
  border-radius: 6px;
  width: 22px;
  height: 22px;
  padding: 0;
}

.studio-editor-color-swatch.is-none {
  background: linear-gradient(to top right, #0000 calc(50% - 1px), #e5484d calc(50% - 1px) calc(50% + 1px), #0000 calc(50% + 1px)), #fff;
}

.studio-editor-color-swatch.is-active {
  outline: 2px solid var(--cursor-accent, var(--mos-accent));
  outline-offset: 1px;
}

.studio-editor-color-swatch.is-preview {
  cursor: default;
}

.studio-editor-color-panel-head {
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-page, var(--mos-panel));
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
}

.studio-editor-color-panel-head strong {
  flex: 1;
  font-size: 13px;
}

.studio-editor-color-panel-close {
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  place-items: center;
  display: grid;
}

.studio-editor-color-section-label {
  color: var(--color-cursor-muted, var(--mos-muted));
  padding: 10px 12px 4px;
  font-size: 11px;
  font-weight: 650;
}

.studio-editor-color-swatch-grid {
  flex-wrap: wrap;
  gap: 8px;
  padding: 4px 12px 10px;
  display: flex;
}

.studio-editor-color-swatch-grid.is-recommended {
  grid-template-columns: repeat(7, 1fr);
  display: grid;
}

.studio-editor-color-tool {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate-strong);
  width: 22px;
  height: 22px;
  color: inherit;
  cursor: pointer;
  border-radius: 6px;
  place-items: center;
  padding: 0;
  display: grid;
}

.studio-editor-color-custom {
  flex-direction: column;
  gap: 10px;
  padding: 10px 12px 14px;
  display: flex;
}

.studio-editor-color-back {
  color: var(--cursor-accent, var(--mos-accent));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  align-self: flex-start;
  padding: 0;
  font-size: 12px;
  font-weight: 600;
}

.studio-editor-color-sv {
  aspect-ratio: 1.2;
  touch-action: none;
  cursor: crosshair;
  border-radius: 10px;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.studio-editor-color-sv-thumb {
  pointer-events: none;
  border: 2px solid #fff;
  border-radius: 999px;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  position: absolute;
  box-shadow: 0 0 0 1px #00000059;
}

.studio-editor-color-hue-row {
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-editor-color-hue {
  appearance: none;
  background: linear-gradient(to right, red, #ff0, #0f0, #0ff, #00f, #f0f, red);
  border-radius: 999px;
  flex: 1;
  height: 12px;
}

.studio-editor-color-hue::-webkit-slider-thumb {
  appearance: none;
  background: #fff;
  border: 1px solid #00000040;
  border-radius: 999px;
  width: 14px;
  height: 14px;
}

.studio-editor-color-hex {
  align-items: center;
  gap: 8px;
  font-size: 12px;
  display: flex;
}

.studio-editor-color-hex input {
  background: var(--mos-plate-strong);
  height: 30px;
  color: inherit;
  font: inherit;
  border: 0;
  border-radius: 8px;
  flex: 1;
  padding: 0 10px;
}

.studio-editor-toggle-row {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  display: flex;
}

.studio-editor-toggle {
  appearance: none;
  background: color-mix(in srgb, var(--mos-text) 18%, transparent);
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  width: 42px;
  height: 24px;
  position: relative;
}

.studio-editor-toggle:after {
  content: "";
  background: #fff;
  border-radius: 999px;
  width: 18px;
  height: 18px;
  transition: transform .12s;
  position: absolute;
  top: 3px;
  left: 3px;
}

.studio-editor-toggle:checked {
  background: var(--cursor-accent, var(--mos-accent));
}

.studio-editor-toggle:checked:after {
  transform: translateX(18px);
}

.studio-editor-transcript {
  background: var(--mos-plate);
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text, inherit);
  flex-direction: column;
  display: flex;
}

.studio-editor-transcript-head {
  height: var(--cursor-section-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  align-items: center;
  padding: 0 12px;
  font-size: 12px;
  display: flex;
}

.studio-editor-transcript-body {
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px 16px;
  display: flex;
  overflow: auto;
}

.studio-editor-transcript-words {
  flex-wrap: wrap;
  gap: 4px;
  display: flex;
}

.studio-editor-transcript-words button {
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  padding: 2px 6px;
}

.studio-editor-transcript-words button.is-on {
  background: var(--mos-plate-strong);
}

.studio-editor-transcript-word {
  display: contents;
}

.studio-editor-transcript-speaker {
  letter-spacing: .02em;
  opacity: .7;
  flex-basis: 100%;
  margin-top: 6px;
  font-size: 11px;
  font-weight: 600;
}

.studio-editor-transcript-speaker:first-child {
  margin-top: 0;
}

.studio-editor-transcript-row {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-editor-transcript-empty, .studio-editor-transcript-status {
  opacity: .75;
  margin: 0;
  font-size: 12px;
}

.studio-editor-transcript-error {
  color: var(--color-cursor-danger, #d4544a);
  margin: 0;
  font-size: 12px;
}

.studio-editor-transcript-cuts {
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-editor-transcript-cuts li {
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  display: flex;
}

.studio-editor-transcript-cuts button {
  color: inherit;
  cursor: pointer;
  text-align: left;
  background: none;
  border: 0;
}

.studio-editor-transcript-check {
  align-items: center;
  gap: 6px;
  font-size: 12px;
  display: flex;
}

.studio-editor-transcript-check select {
  max-width: 100%;
  color: inherit;
  border: 1px solid var(--studio-border, #ffffff29);
  font: inherit;
  background: none;
  border-radius: 6px;
  margin-left: 6px;
  padding: 2px 4px;
}

.studio-editor-transcript-diff table {
  border-collapse: collapse;
  width: 100%;
  font-size: 12px;
}

.studio-editor-transcript-diff th, .studio-editor-transcript-diff td {
  text-align: left;
  border-bottom: 1px solid var(--studio-border, #ffffff14);
  overflow-wrap: anywhere;
  padding: 3px 4px;
}

.studio-editor-transcript-diff td.is-old {
  opacity: .7;
  text-decoration: line-through;
}

.studio-editor-transcript-diff td.is-new {
  color: var(--studio-accent, #10b981);
  font-weight: 600;
}

.studio-editor-transcript-diff button {
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0;
  text-decoration: underline;
}

.studio-editor-transcript-diff td.is-applied {
  color: var(--studio-accent, #10b981);
  font-size: 11px;
}

.studio-editor-transcript-diff td.is-suggested {
  opacity: .75;
  font-size: 11px;
}

/* [project]/src/studio/live/studio-live.css [app-client] (css) */
.studio-live {
  background: var(--mos-page);
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text);
  flex-direction: column;
  display: flex;
}

.studio-live-shell {
  flex-direction: row;
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-live-workspace {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-live-shell-panels, .studio-live-panels {
  flex: 1;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-live .cursor-resize, .studio-live .cursor-resize-v {
  z-index: 3;
  transition: none;
  position: relative;
}

.studio-live .cursor-resize, .studio-live .cursor-resize:hover, .studio-live .cursor-resize[data-resize-handle-active] {
  background: none;
  flex-shrink: 0;
  width: 0;
}

.studio-live .cursor-resize-v, .studio-live .cursor-resize-v:hover, .studio-live .cursor-resize-v[data-resize-handle-active] {
  background: var(--color-cursor-border-soft, var(--mos-border-soft));
  flex-shrink: 0;
  height: 1px;
}

.studio-live .cursor-resize:before {
  content: "";
  position: absolute;
  inset: 0 -4px;
}

.studio-live .cursor-resize-v:before {
  content: "";
  position: absolute;
  inset: -4px 0;
}

.studio-live-preview {
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-live-head, .studio-live-preview-head, .studio-live-bottom-head, .studio-live-col-h {
  height: var(--cursor-head-h);
  min-height: var(--cursor-head-h);
  box-sizing: border-box;
  border-bottom: 1px solid var(--mos-border-soft);
  background: var(--mos-page);
  align-items: center;
  gap: 8px;
  padding: 0 10px 0 12px;
  display: flex;
  overflow: visible;
}

.studio-live-bottom-head {
  font-size: var(--desk-text-xs);
  font-weight: var(--desk-w-semibold);
  color: var(--color-cursor-text-muted);
  z-index: 5;
  justify-content: space-between;
  position: relative;
  overflow: visible;
}

.studio-live-bottom-actions {
  align-items: center;
  gap: 4px;
  margin-left: auto;
  display: flex;
  overflow: visible;
}

.studio-live-col-h {
  font-size: var(--desk-text-xs);
  font-weight: var(--desk-w-semibold);
  color: var(--color-cursor-text-muted);
  justify-content: space-between;
  padding-right: 8px;
}

.studio-live-preview-head {
  justify-content: flex-start;
  gap: 4px;
}

.studio-live-head-title {
  font-size: var(--desk-text-ui);
  font-weight: var(--desk-w-semibold);
}

.studio-live-head-meta {
  color: var(--color-cursor-text-muted);
  font-size: var(--desk-text-xs);
  align-items: center;
  gap: 4px;
  display: flex;
}

.studio-live-preview-head .studio-live-rec {
  margin-left: auto;
}

.studio-live-rec {
  border-radius: var(--cursor-radius-pill);
  background: var(--mos-plate);
  min-width: 4.75rem;
  height: 24px;
  min-height: 24px;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-xs);
  font-weight: var(--desk-w-semibold);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  border: 0;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  line-height: 1;
  display: inline-flex;
}

.studio-live-rec-label {
  min-width: 0;
}

.studio-live-rec-dot {
  background: var(--mos-danger, #e11d48);
  border-radius: 50%;
  flex-shrink: 0;
  width: 7px;
  height: 7px;
}

.studio-live-rec.is-on {
  background: color-mix(in srgb, var(--mos-danger, #e11d48) 82%, var(--mos-plate-strong));
  color: var(--cursor-on-accent);
  border-color: #0000;
}

.studio-live-rec.is-on .studio-live-rec-dot {
  background: currentColor;
}

.studio-live-rec.is-saving, .studio-live-rec.is-saved {
  background: var(--mos-plate);
  color: var(--color-cursor-text);
}

.studio-live-start {
  border-radius: var(--cursor-radius-pill);
  background: var(--mos-plate);
  min-height: 24px;
  color: var(--color-cursor-text);
  border: 0;
  align-items: center;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.studio-live-start:hover, .studio-live-rec:hover:not(:disabled):not(.is-on) {
  background: var(--mos-active);
}

.studio-live-rec.is-on:hover:not(:disabled) {
  background: color-mix(in srgb, var(--mos-danger, #e11d48) 92%, var(--mos-plate-strong));
}

.studio-live-start:disabled, .studio-live-rec:disabled {
  opacity: .45;
}

.studio-live-rec.is-saving:disabled, .studio-live-rec.is-saved:disabled {
  opacity: 1;
}

.studio-live-rec-spin {
  flex-shrink: 0;
  animation: .8s linear infinite studio-live-rec-spin;
}

@keyframes studio-live-rec-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-live-rec-spin {
    animation: none;
  }
}

.studio-live-body {
  flex: 1;
  min-height: 0;
  display: flex;
}

.studio-live-stage {
  background: var(--mos-page);
  flex: 1;
  justify-content: center;
  align-items: center;
  min-width: 0;
  min-height: 0;
  padding: 12px;
  display: flex;
  container-type: size;
}

.studio-live-frame {
  --preview-ar: 1.77778;
  isolation: isolate;
  aspect-ratio: var(--preview-ar);
  width: min(100cqw, calc(100cqh * var(--preview-ar)));
  max-width: 100%;
  height: auto;
  max-height: 100%;
  box-shadow: none;
  outline: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: #000;
  border-radius: 0;
  position: relative;
  overflow: hidden;
}

.studio-live-canvas {
  object-fit: contain;
  background: #000;
  border-radius: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-live-hit {
  z-index: 1;
  cursor: default;
  position: absolute;
  inset: 0;
}

.studio-live-frame .studio-editor-transform-guide {
  z-index: 8;
  pointer-events: none;
  background: none;
  position: absolute;
}

.studio-live-frame .studio-editor-transform-guide.is-vertical {
  border-left: 2px dashed #7dd3fc;
  width: 0;
  top: 0;
  bottom: 0;
  transform: translateX(-1px);
}

.studio-live-frame .studio-editor-transform-guide.is-horizontal {
  border-top: 2px dashed #7dd3fc;
  height: 0;
  left: 0;
  right: 0;
  transform: translateY(-1px);
}

.studio-live-box {
  z-index: 2;
  box-sizing: border-box;
  border: 1.5px solid color-mix(in srgb, var(--cursor-accent) 70%, white);
  pointer-events: none;
  position: absolute;
  overflow: visible;
}

.studio-live-box.is-ghost {
  border: 2px dashed color-mix(in srgb, var(--cursor-accent) 88%, white);
}

.studio-live-box.is-mask.is-active {
  border-style: solid;
}

.studio-live-ratio-tag {
  z-index: 3;
  border-radius: var(--cursor-radius-sm);
  background: var(--mos-plate-strong);
  color: var(--color-cursor-text);
  font-size: var(--desk-text-xs);
  font-weight: var(--desk-w-semibold);
  pointer-events: none;
  padding: 1px 6px;
  line-height: 1.4;
  position: absolute;
  bottom: 6px;
  left: 6px;
}

.studio-live-gap {
  z-index: 9;
  pointer-events: none;
  position: absolute;
}

.studio-live-gap.is-left, .studio-live-gap.is-right {
  border-top: 1px dashed #7dd3fc;
  height: 0;
  transform: translateY(-.5px);
}

.studio-live-gap.is-top, .studio-live-gap.is-bottom {
  border-left: 1px dashed #7dd3fc;
  width: 0;
  transform: translateX(-.5px);
}

.studio-live-gap-label {
  border-radius: var(--cursor-radius-sm);
  background: var(--mos-plate-strong);
  color: var(--color-cursor-text);
  font-size: var(--desk-text-xs);
  font-weight: var(--desk-w-semibold);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  padding: 1px 5px;
  line-height: 1.3;
  position: absolute;
}

.studio-live-gap.is-left .studio-live-gap-label, .studio-live-gap.is-right .studio-live-gap-label {
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
}

.studio-live-gap.is-top .studio-live-gap-label, .studio-live-gap.is-bottom .studio-live-gap-label {
  top: 50%;
  left: 0;
  transform: translate(-50%, -50%);
}

.studio-live-handle {
  background: var(--mos-plate-strong);
  border: 1px solid var(--cursor-accent);
  pointer-events: none;
  width: 8px;
  height: 8px;
  position: absolute;
}

.studio-live-handle.is-nw {
  top: -4px;
  left: -4px;
}

.studio-live-handle.is-ne {
  top: -4px;
  right: -4px;
}

.studio-live-handle.is-sw {
  bottom: -4px;
  left: -4px;
}

.studio-live-handle.is-se {
  bottom: -4px;
  right: -4px;
}

.studio-live-handle.is-n {
  top: -4px;
  left: calc(50% - 4px);
}

.studio-live-handle.is-s {
  bottom: -4px;
  left: calc(50% - 4px);
}

.studio-live-handle.is-w {
  top: calc(50% - 4px);
  left: -4px;
}

.studio-live-handle.is-e {
  top: calc(50% - 4px);
  right: -4px;
}

.studio-live-inspector {
  background: var(--mos-panel, var(--mos-page));
  border-left: 1px solid var(--mos-border);
  flex-direction: column;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-live-bottom {
  background: var(--mos-page);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-live-bottom-split {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-live-bottom-panels {
  min-width: 0;
  height: 100%;
  min-height: 0;
}

.studio-live-sources-dock {
  flex-direction: row;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-live-scenes-col {
  border-right: 1px solid var(--mos-border);
  flex-direction: column;
  flex-shrink: 0;
  width: 196px;
  min-height: 0;
  display: flex;
}

.studio-live-sources-col {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-live-pane-head {
  height: var(--cursor-head-h);
  min-height: var(--cursor-head-h);
  box-sizing: border-box;
  border-bottom: 1px solid var(--mos-border-soft);
  background: var(--mos-page);
  font-size: var(--desk-text-xs);
  font-weight: var(--desk-w-semibold);
  color: var(--color-cursor-text-muted);
  z-index: 5;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 12px;
  display: flex;
  position: relative;
  overflow: visible;
}

.studio-live-pane-head > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-live-pane-head .studio-live-icon-btn, .studio-live-pane-head .studio-live-add-menu {
  flex-shrink: 0;
  margin-left: auto;
}

.studio-live-dock {
  border-left: 1px solid var(--mos-border-soft);
  background: var(--mos-page);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.studio-live-strip {
  border-top: 1px solid var(--mos-border-soft);
  gap: 0;
  min-height: 0;
  display: flex;
}

.studio-live-panel {
  background: var(--mos-page);
  flex-direction: column;
  flex: 1;
  min-width: 0;
  display: flex;
}

.studio-live-panel + .studio-live-panel {
  border-left: 1px solid var(--mos-border-soft);
}

.studio-live-panel-h {
  height: var(--cursor-head-h);
  font-size: var(--desk-text-xs);
  font-weight: var(--desk-w-semibold);
  color: var(--color-cursor-text-muted);
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 10px;
  display: flex;
}

.studio-live-list {
  flex-direction: column;
  flex: 1;
  gap: 1px;
  min-height: 0;
  padding: 6px;
  display: flex;
  overflow: auto;
}

.studio-live-row {
  border-radius: var(--cursor-radius-sm);
  min-height: 28px;
  color: var(--color-cursor-text);
  font-size: var(--desk-text-sm);
  text-align: left;
  background: none;
  border: 0;
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  display: flex;
}

.studio-live-row:hover, .studio-live-icon-btn:hover {
  background: var(--mos-hover);
}

.studio-live-icon-btn.is-confirm:hover {
  background: color-mix(in srgb, var(--mos-danger, #e5484d) 28%, var(--mos-plate-strong));
}

.studio-live-row.is-active, .studio-live-row.is-selected {
  background: var(--mos-plate);
}

.studio-live-row.is-dragging {
  opacity: .55;
  background: var(--mos-plate);
}

.studio-live-row.is-offline .studio-live-row-name {
  color: var(--color-cursor-text-muted);
}

.studio-live-grip {
  width: 18px;
  height: 24px;
  color: var(--color-cursor-text-muted);
  cursor: grab;
  touch-action: none;
  background: none;
  border: 0;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  margin-left: -4px;
  padding: 0;
  display: inline-flex;
}

.studio-live-grip:active, .studio-live-row.is-dragging .studio-live-grip {
  cursor: grabbing;
}

.studio-live-row-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  flex: 1;
  padding: 0;
  overflow: hidden;
}

.studio-live-row-name.is-renameable {
  cursor: text;
}

.studio-live-rename-input {
  border-radius: var(--cursor-radius-sm);
  background: var(--mos-page);
  min-width: 0;
  height: 22px;
  color: var(--color-cursor-text);
  font: inherit;
  font-size: var(--desk-text-sm);
  box-shadow: inset 0 0 0 1.5px var(--cursor-accent, var(--mos-accent));
  border: none;
  outline: none;
  flex: 1;
  margin: 0;
  padding: 0 6px;
}

.studio-live-scene-icon {
  border-radius: var(--cursor-radius-sm);
  background: var(--mos-plate);
  width: 22px;
  height: 22px;
  color: var(--color-cursor-text);
  border: 0;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-live-scene-icon:hover, .studio-live-scene-icon[aria-expanded="true"] {
  background: var(--mos-hover, var(--mos-plate));
}

.studio-live-icon-btn {
  border-radius: var(--cursor-radius-sm);
  background: var(--mos-plate);
  width: 24px;
  height: 24px;
  color: var(--color-cursor-text);
  border: 0;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-live-icon-btn:disabled {
  opacity: .35;
  cursor: default;
}

.studio-live-icon-btn.is-confirm {
  background: color-mix(in srgb, var(--mos-danger, #e5484d) 18%, var(--mos-plate-strong));
  color: var(--mos-danger, #e5484d);
}

.studio-live-icon-pop {
  z-index: 80;
  border-radius: var(--cursor-radius-md);
  background: var(--mos-plate);
  width: 228px;
  box-shadow: var(--cursor-shadow-menu, 0 8px 24px #0000002e);
  padding: 8px;
  position: fixed;
}

.studio-live-icon-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 5px;
  max-height: 220px;
  display: grid;
  overflow: auto;
}

.studio-live-icon-opt {
  aspect-ratio: 1;
  background: var(--mos-plate);
  color: var(--color-cursor-text);
  border: 0;
  border-radius: 7px;
  place-items: center;
  padding: 0;
  display: grid;
}

.studio-live-icon-opt:hover, .studio-live-icon-opt.is-active {
  background: var(--mos-active, var(--mos-plate));
}

.studio-live-icon-opt.is-active {
  outline: 1px solid color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 55%, transparent);
  outline-offset: -1px;
}

.studio-live-setup {
  border-bottom: 1px solid var(--mos-border-soft);
  background: var(--mos-plate);
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  display: flex;
}

.studio-live-setup h2 {
  font-size: var(--desk-text-sm);
  font-weight: var(--desk-w-semibold);
  margin: 0;
}

.studio-live-setup p {
  font-size: var(--desk-text-xs);
  color: var(--color-cursor-text-muted);
  margin: 0;
  line-height: 1.4;
}

.studio-live-code {
  border-radius: var(--cursor-radius-sm);
  background: var(--mos-plate-strong);
  letter-spacing: .14em;
  justify-content: center;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  font-size: 15px;
  font-weight: 700;
  display: inline-flex;
}

.studio-live-status {
  font-size: var(--desk-text-xs);
  color: var(--color-cursor-text-muted);
}

.studio-live-status.is-ready {
  color: var(--cursor-accent);
}

.studio-live-hidden {
  opacity: .01;
  pointer-events: none;
  width: auto;
  height: auto;
  position: fixed;
  top: 0;
  left: -10000px;
  overflow: visible;
}

.studio-live-hidden video {
  object-fit: fill;
  width: auto;
  max-width: none;
  height: auto;
  display: block;
}

.studio-live-phone {
  background: var(--mos-page);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
  position: relative;
}

.studio-live-phone-stage {
  min-height: 0;
  padding: max(16px, env(safe-area-inset-top, 0px))
    max(16px, env(safe-area-inset-right, 0px)) 12px
    max(16px, env(safe-area-inset-left, 0px));
  flex: 1;
  justify-content: center;
  align-items: center;
  display: flex;
  container-type: size;
}

.studio-live-phone-frame {
  border-radius: var(--cursor-radius-4xl);
  outline: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: #0b0d12;
  max-width: 100%;
  max-height: 100%;
  position: relative;
  overflow: hidden;
}

.studio-live-phone-frame.is-ready {
  --phone-ar: 1;
  aspect-ratio: var(--phone-ar);
  width: min(100cqw, calc(100cqh * var(--phone-ar)));
  height: auto;
}

.studio-live-phone-video {
  object-fit: contain;
  background: #0b0d12;
  width: auto;
  max-width: 100cqw;
  height: auto;
  max-height: 100cqh;
  display: block;
}

.studio-live-phone-frame.is-ready .studio-live-phone-video {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.studio-live-phone.is-screen-flash {
  background: #fff;
}

.studio-live-phone.is-screen-flash .studio-live-phone-frame {
  outline-color: var(--cursor-on-accent);
}

.studio-live-phone.is-screen-flash .studio-live-phone-bar {
  background: #fff;
}

.studio-live-phone.is-screen-flash .studio-live-phone-bar button.is-tool:not(.is-on) {
  color: #111;
  background: #e8e8e8;
}

.studio-live-phone-video.is-mirror {
  transform: scaleX(-1);
}

.studio-live-phone-bar {
  padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px));
  background: var(--mos-plate);
  justify-content: center;
  align-items: center;
  gap: 10px;
  display: flex;
}

.studio-live-phone-bar button {
  border-radius: var(--cursor-radius-pill);
  background: var(--mos-plate-strong);
  min-height: 36px;
  color: var(--color-cursor-text);
  border: 0;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 650;
}

.studio-live-phone-bar button.is-primary {
  background: var(--cursor-accent);
  color: var(--cursor-on-accent);
}

.studio-live-phone-bar button.is-stop {
  background: color-mix(in srgb, var(--mos-danger, #e11d48) 82%, var(--mos-plate-strong));
  color: var(--cursor-on-accent);
}

.studio-live-phone-bar button.is-tool {
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  margin: 0;
  padding: 0;
  line-height: 0;
  display: inline-flex;
}

.studio-live-phone-bar button.is-tool svg {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  display: block;
}

.studio-live-phone-bar button.is-tool.is-on {
  background: var(--cursor-accent);
  color: var(--cursor-on-accent);
}

.studio-live-phone-bar button.is-tool:disabled {
  opacity: .4;
}

.studio-live-mixer {
  background: var(--mos-page);
  border-left: 1px solid var(--mos-border);
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-live-mixer-head {
  height: var(--cursor-head-h);
  min-height: var(--cursor-head-h);
  border-bottom: 1px solid var(--mos-border-soft);
  font-size: var(--desk-text-xs);
  font-weight: var(--desk-w-semibold);
  color: var(--color-cursor-text-muted);
  align-items: center;
  padding: 0 12px;
  display: flex;
}

.studio-live-mixer-strips {
  flex: 1;
  gap: 8px;
  min-height: 0;
  padding: 8px;
  display: flex;
  overflow: auto;
}

.studio-live-strip {
  border-radius: var(--cursor-radius-sm);
  background: var(--mos-plate);
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 76px;
  min-width: 76px;
  padding: 6px 4px 8px;
  display: flex;
}

.studio-live-strip.is-selected {
  background: var(--mos-plate);
  box-shadow: inset 0 0 0 1px var(--mos-border-soft);
}

.studio-live-strip-name {
  width: 100%;
  color: inherit;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: none;
  border: 0;
  font-size: 11px;
  font-weight: 650;
  overflow: hidden;
}

.studio-live-strip-db {
  color: var(--color-cursor-text-muted);
  font-variant-numeric: tabular-nums;
  font-size: 10px;
}

.studio-live-strip-body {
  flex: 1;
  justify-content: center;
  align-items: stretch;
  gap: 8px;
  min-height: 96px;
  display: flex;
}

.studio-live-fader {
  --fader: 1;
  cursor: ns-resize;
  touch-action: none;
  background: none;
  border: 0;
  flex: 1;
  width: 24px;
  min-height: 88px;
  margin: 0;
  padding: 0;
  position: relative;
}

.studio-live-fader:focus-visible {
  outline: 1px solid var(--cursor-accent);
  outline-offset: 2px;
  border-radius: 4px;
}

.studio-live-fader-track {
  background: var(--mos-plate);
  pointer-events: none;
  border-radius: 999px;
  width: 6px;
  position: absolute;
  top: 10px;
  bottom: 10px;
  left: 50%;
  overflow: hidden;
  transform: translateX(-50%);
}

.studio-live-fader-fill {
  height: calc(var(--fader, 0) * 100%);
  border-radius: inherit;
  background: color-mix(in srgb, var(--cursor-accent) 62%, var(--mos-plate-strong));
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.studio-live-fader.is-muted .studio-live-fader-fill {
  background: var(--mos-plate-strong);
}

.studio-live-fader-cap {
  left: 50%;
  bottom: calc(10px + (100% - 20px) * var(--fader, 0));
  border: 1px solid var(--color-cursor-border);
  background: var(--mos-page);
  width: 20px;
  height: 12px;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--mos-text) 16%, transparent);
  pointer-events: none;
  border-radius: 3px;
  position: absolute;
  transform: translate(-50%, 50%);
}

.studio-live-fader-cap:after {
  content: "";
  background: var(--color-cursor-text-muted);
  height: 1px;
  position: absolute;
  top: 50%;
  left: 4px;
  right: 4px;
  transform: translateY(-50%);
}

.studio-live-fader:hover .studio-live-fader-cap, .studio-live-fader:focus-visible .studio-live-fader-cap {
  border-color: var(--cursor-accent);
}

.studio-live-meter {
  background: var(--mos-plate);
  border-radius: 4px;
  width: 7px;
  position: relative;
  overflow: hidden;
}

.studio-live-meter-grad {
  transform-origin: bottom;
  background: linear-gradient(to top, #34c759 0% 52%, #fc0 78%, #ff3b30 100%);
  position: absolute;
  inset: 0;
}

.studio-live-strip-mute {
  background: var(--mos-plate);
  width: 24px;
  height: 24px;
  color: inherit;
  border: 0;
  border-radius: 50%;
  place-items: center;
  display: grid;
}

.studio-live-strip-mute.is-off {
  color: var(--color-cursor-text-muted);
}

.studio-live .studio-editor-frame-preset:disabled {
  opacity: .45;
  cursor: default;
}

.studio-live-mask-presets {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 899px) {
  .studio-live-inspector, .studio-live-bottom {
    display: none;
  }
}

/* [project]/src/studio/components/studio-files-action-sheet.css [app-client] (css) */
.studio-files-action-sheet-backdrop {
  inset: auto;
  top: var(--studio-mobile-top-chrome, calc(44px + env(safe-area-inset-top, 0px)));
  right: 0;
  bottom: calc(var(--studio-mobile-bottom-chrome, calc(44px + env(safe-area-inset-bottom, 0px)))
      + var(--studio-keyboard-inset, 0px));
  z-index: 70;
  cursor: pointer;
  pointer-events: auto;
  background: #00000047;
  border: 0;
  margin: 0;
  padding: 0;
  left: 0;
  position: fixed !important;
}

.studio-mobile-app-menu-sheet.studio-files-action-sheet {
  z-index: 71;
  height: auto;
  max-height: min(48dvh, var(--studio-mobile-app-menu-sheet-band, 48dvh));
  pointer-events: auto;
}

.studio-files-action-sheet-head {
  min-height: var(--cursor-head-h, 36px);
  padding: 4px var(--studio-sheet-inline-pad, 12px) 2px;
  flex: none;
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-files-action-sheet-title {
  min-width: 0;
  color: var(--color-cursor-text-bright);
  flex: auto;
  font-size: 13px;
  font-weight: 600;
}

.studio-files-action-sheet-close {
  color: var(--color-cursor-accent, var(--mos-accent));
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
  padding: 4px 2px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
}

.studio-files-action-sheet-body {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  touch-action: pan-y;
  min-height: 0;
  padding: 4px var(--studio-sheet-inline-pad, 12px) 12px;
  pointer-events: auto;
  flex-direction: column;
  flex: auto;
  display: flex;
  overflow: hidden auto;
}

.studio-files-action-sheet .cursor-tab-context-item {
  pointer-events: auto;
  border-radius: 10px;
  min-height: 44px;
  padding: 12px;
  font-size: 15px;
}

.studio-files-action-sheet-submenu {
  border-left: 2px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  pointer-events: auto;
  margin: 0 0 4px;
  padding: 2px 0 6px 10px;
}

.studio-files-action-sheet-submenu .cursor-tab-context-item {
  min-height: 40px;
  font-size: 14px;
}

.studio-folder-pathbar-tools, .studio-file-add-wrap, .studio-files-mobile-sheet .studio-folder-pathbar-tools, .studio-files-mobile-sheet .studio-file-add-wrap {
  z-index: 3;
  pointer-events: auto;
  position: relative;
}

.studio-file-add-wrap {
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-polish.is-studio-mobile .studio-file-add-wrap, .studio-files-mobile-sheet .studio-file-add-wrap {
  min-width: 44px;
  min-height: 44px;
}

.studio-explorer-context-sheet.studio-files-action-sheet {
  bottom: calc(var(--studio-mobile-bottom-chrome, calc(44px + env(safe-area-inset-bottom, 0px)))
      + var(--studio-keyboard-inset, 0px));
  z-index: 71;
  height: auto;
  max-height: min(48dvh, var(--studio-mobile-app-menu-sheet-band, 48dvh));
}

.studio-polish .studio-centered-sheet.studio-mobile-app-menu-sheet {
  box-shadow: var(--cursor-shadow-menu, 0 12px 40px #00000047);
  z-index: var(--studio-z-toast);
  overflow: auto;
  background: color-mix(in srgb, var(--mos-page) 42%, var(--mos-plate, var(--mos-bg))) !important;
  border: none !important;
  border-radius: 18px !important;
  align-items: flex-start !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: min(320px, 100vw - 48px) !important;
  height: auto !important;
  max-height: min(70dvh, 640px) !important;
  animation: none !important;
  position: fixed !important;
  inset: 50% auto auto 50% !important;
  transform: translate(-50%, -50%) !important;
}

.studio-mobile-sheet-backdrop.is-clear {
  z-index: var(--studio-z-dialog);
  cursor: pointer;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  inset: 0;
}

.studio-centered-sheet .studio-mobile-app-menu-sheet-handle, .studio-centered-sheet .studio-mobile-sheet-head, .studio-centered-sheet [aria-label="Close"] {
  display: none !important;
}

.studio-centered-sheet .studio-mobile-sheet-body, .studio-centered-sheet .studio-action-menu, .studio-centered-sheet .studio-action-section {
  flex-direction: column;
  gap: 4px;
  max-width: min(320px, 100vw - 48px);
  min-height: 0;
  display: flex;
  flex: none !important;
  align-items: flex-start !important;
  width: max-content !important;
}

.studio-centered-sheet .studio-action-menu {
  padding: 6px;
}

.studio-centered-sheet .studio-action-section {
  background: none;
  margin: 0;
  padding: 0;
}

.studio-centered-sheet .cursor-tab-context-item, .studio-centered-sheet .studio-action-menu .cursor-tab-context-item {
  max-width: 100%;
  min-height: 32px;
  color: var(--color-cursor-text, var(--mos-text));
  box-sizing: border-box;
  border-radius: 10px;
  align-items: center;
  padding: 5px 10px 5px 6px;
  display: inline-flex;
  background: var(--mos-plate-strong, color-mix(in srgb, var(--mos-text) 7%, var(--mos-plate))) !important;
  text-align: left !important;
  border: 0 !important;
  justify-content: flex-start !important;
  align-self: flex-start !important;
  width: fit-content !important;
}

.studio-centered-sheet .cursor-tab-context-item-label, .studio-centered-sheet .studio-action-menu .cursor-tab-context-item-label {
  text-align: left !important;
  flex: 0 auto !important;
}

.studio-centered-sheet .cursor-tab-context-item.is-selected, .studio-centered-sheet .cursor-tab-context-item[aria-current="true"] {
  background: var(--mos-plate-strong, var(--mos-raised));
  color: var(--color-cursor-text, var(--mos-text));
  border: 0;
}

/* [project]/src/studio/components/studio-files-chrome.css [app-client] (css) */
.studio-files-source-toggle {
  box-sizing: border-box;
  width: 100%;
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-panel)));
  border: none;
  flex: none;
  align-items: center;
  gap: 4px;
  padding: 0 8px;
  display: flex;
}

.studio-files-source-toggle button {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-panel)));
  min-width: 0;
  height: 26px;
  min-height: 26px;
  color: var(--color-cursor-muted);
  font: inherit;
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  font-size: var(--studio-fs-sm, 12px);
  letter-spacing: -.01em;
  cursor: pointer;
  box-shadow: none;
  white-space: nowrap;
  flex: 1 1 0;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  font-weight: 650;
  line-height: 1.2;
  display: inline-flex;
}

.studio-files-source-toggle button > svg {
  flex: none;
  width: 13px;
  height: 13px;
}

.studio-files-source-toggle button.is-active {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 42%, var(--color-cursor-border));
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, transparent);
  color: var(--color-cursor-text-bright);
  box-shadow: none;
}

.studio-files-search-row {
  box-sizing: border-box;
  width: 100%;
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-panel)));
  border-bottom: none;
  flex: none;
  align-items: stretch;
  display: flex;
}

.studio-files-search-row > .cursor-panel-search {
  width: auto;
  min-width: 0;
  height: var(--studio-search-h, 36px);
  min-height: var(--studio-search-h, 36px);
  max-height: var(--studio-search-h, 36px);
  box-shadow: none;
  background: var(--mos-plate, var(--color-cursor-sidebar));
  border: none;
  flex: auto;
  align-self: center;
  margin-block: 0;
}

.studio-files-dock .studio-files-search-row > .cursor-panel-search, .studio-files-mobile-sheet .studio-files-search-row > .cursor-panel-search, .studio-files-workspace-tab .studio-files-search-row > .cursor-panel-search {
  background: var(--mos-page, #fff);
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  box-shadow: none;
  border-radius: 999px;
}

.studio-files-search-row .cursor-panel-search-end:before {
  display: none;
}

.cursor-explorer-body.is-workspace-chrome .studio-files-chrome {
  width: 100%;
  min-height: var(--studio-search-h, var(--cursor-head-h, 36px));
  height: var(--studio-search-h, var(--cursor-head-h, 36px));
  max-height: var(--studio-search-h, var(--cursor-head-h, 36px));
  box-sizing: border-box;
  background: var(--mos-page, var(--mos-panel, var(--color-cursor-panel)));
  border-bottom: none;
  flex-direction: row;
  flex: none;
  align-items: stretch;
  display: flex;
}

.cursor-explorer-body.is-workspace-chrome .studio-files-chrome > .studio-files-source-toggle {
  flex: none;
  align-self: center;
  width: auto;
}

@media (max-width: 899px) {
  .studio-files-source-toggle.studio-admin-head-tabs {
    height: 36px;
    min-height: 36px;
    max-height: 36px;
  }
}

.cursor-explorer-body.is-workspace-chrome .studio-files-chrome > .studio-files-search-row {
  background: none;
  border-top: none;
  border-bottom: none;
  flex: auto;
  width: auto;
  min-width: 0;
  height: auto;
  min-height: 0;
  max-height: none;
}

.studio-polish .cursor-explorer-body.is-workspace-chrome .studio-files-search-row > .cursor-panel-search {
  margin: 0 !important;
}

.cursor-explorer-body.is-workspace-chrome .cursor-file-grid, .cursor-explorer-body.is-sidebar-chrome .cursor-file-grid, .cursor-explorer-body.is-workspace-chrome .desk-file-preview-grid, .cursor-explorer-body.is-sidebar-chrome .desk-file-preview-grid, .cursor-explorer-body.is-workspace-chrome .desk-file-list, .cursor-explorer-body.is-sidebar-chrome .desk-file-list {
  padding-top: 8px;
}

.cursor-explorer-body.is-workspace-chrome, .cursor-explorer-body.is-sidebar-chrome, .cursor-explorer-body.is-workspace-chrome .studio-files-chrome, .cursor-explorer-body.is-sidebar-chrome .studio-files-source-toggle, .cursor-explorer-body.is-sidebar-chrome .studio-files-search-row {
  border-top: none;
}

.cursor-explorer-body.is-sidebar-chrome .studio-files-chrome, .cursor-explorer-body.is-workspace-chrome .studio-files-chrome {
  box-sizing: border-box;
  background: none;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  padding: 8px;
  display: flex;
}

.studio-polish:not(.is-studio-mobile) aside.studio-main-rail .cursor-explorer-body.is-sidebar-chrome .studio-files-chrome {
  padding-top: 20px;
}

.cursor-explorer-body.is-sidebar-chrome .studio-files-chrome > .studio-files-source-toggle, .cursor-explorer-body.is-workspace-chrome .studio-files-chrome > .studio-files-source-toggle, .studio-files-source-toggle.studio-admin-head-tabs {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  border-radius: 999px;
  flex: none;
  align-self: center;
  width: auto;
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  padding: 3px;
}

.cursor-explorer-body.is-sidebar-chrome .studio-files-source-toggle .studio-admin-head-tab, .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle .studio-admin-head-tab, .studio-files-source-toggle.studio-admin-head-tabs .studio-admin-head-tab {
  width: 30px;
  min-width: 30px;
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-muted, var(--mos-muted));
  background: none;
  border: 0;
  border-radius: 999px;
  flex: 0 0 30px;
  padding: 0;
}

.cursor-explorer-body.is-sidebar-chrome .studio-files-source-toggle .studio-admin-head-tab.is-active, .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle .studio-admin-head-tab.is-active, .studio-files-source-toggle.studio-admin-head-tabs .studio-admin-head-tab.is-active {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 18%,
    var(--mos-page, #fff));
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-polish .studio-files-source-toggle.studio-admin-head-tabs, [data-appearance="light"] .studio-polish .studio-files-source-toggle.studio-admin-head-tabs, .studio-polish .studio-files-mobile-sheet .studio-files-source-toggle.studio-admin-head-tabs, .studio-polish .cursor-explorer-body.is-workspace-chrome .studio-files-chrome > .studio-files-source-toggle.studio-admin-head-tabs, .studio-polish .cursor-explorer-body.is-sidebar-chrome .studio-files-chrome > .studio-files-source-toggle.studio-admin-head-tabs {
  align-items: center;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  border-radius: 999px !important;
  width: auto !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  padding: 3px !important;
  display: flex !important;
}

[data-appearance="light"] .studio-polish .studio-files-source-toggle.studio-admin-head-tabs {
  background: var(--mos-plate) !important;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle.studio-admin-head-tabs, [data-appearance="light"] .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle.studio-admin-head-tabs {
  box-sizing: border-box;
  gap: 2px;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  border-radius: 999px !important;
  width: auto !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  padding: 3px !important;
}

[data-appearance="light"] .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle.studio-admin-head-tabs {
  background: var(--mos-plate) !important;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle .studio-admin-head-tab, .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle .studio-admin-head-tab.is-active {
  box-sizing: border-box !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 999px !important;
  flex: 0 0 28px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle .studio-admin-head-tab.is-active {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, var(--mos-page, #fff)) !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
}

.studio-files-source-toggle .studio-admin-head-tab svg, .studio-polish.is-studio-mobile .studio-files-source-toggle .studio-admin-head-tab svg, .studio-polish:not(.is-studio-mobile) .studio-files-source-toggle .studio-admin-head-tab svg {
  stroke-width: 1.75px !important;
  width: 15px !important;
  height: 15px !important;
}

.cursor-explorer-body.is-sidebar-chrome .studio-files-chrome > .studio-files-search-row, .cursor-explorer-body.is-workspace-chrome .studio-files-chrome > .studio-files-search-row {
  background: none;
  flex: auto;
  width: auto;
  min-width: 0;
  height: auto;
  min-height: 0;
  max-height: none;
}

.cursor-explorer-body.is-sidebar-chrome .studio-files-search-row > .cursor-panel-search, .cursor-explorer-body.is-workspace-chrome .studio-files-search-row > .cursor-panel-search, .studio-files-dock .studio-files-search-row > .cursor-panel-search, .studio-files-mobile-sheet .studio-files-search-row > .cursor-panel-search {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  border-radius: 999px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  margin: 0 !important;
}

[data-appearance="light"] .cursor-explorer-body.is-sidebar-chrome .studio-files-search-row > .cursor-panel-search, [data-appearance="light"] .cursor-explorer-body.is-workspace-chrome .studio-files-search-row > .cursor-panel-search, [data-appearance="light"] .studio-files-dock .studio-files-search-row > .cursor-panel-search, [data-appearance="light"] .studio-files-mobile-sheet .studio-files-search-row > .cursor-panel-search {
  background: var(--mos-plate) !important;
}

.cursor-explorer-body.is-sidebar-chrome .studio-folder-pathbar, .studio-files-dock .studio-folder-pathbar {
  min-height: var(--cursor-head-h, 36px);
  background: none;
  padding: 0 8px 6px;
}

.cursor-explorer-body.is-sidebar-chrome .studio-folder-pathbar-tools .studio-settings-trigger, .studio-files-dock .studio-folder-pathbar-tools .studio-settings-trigger {
  border-radius: 999px;
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  padding: 0;
}

.studio-polish .cursor-tab-context-sep, .studio-action-menu .cursor-tab-context-sep {
  display: none;
}

@keyframes studio-action-menu-edge-in {
  from {
    transform: translate(100%, -50%);
  }

  to {
    transform: translate(0, -50%);
  }
}

@keyframes studio-action-menu-edge-out {
  from {
    transform: translate(0, -50%);
  }

  to {
    transform: translate(100%, -50%);
  }
}

@keyframes studio-action-menu-edge-in-start {
  from {
    transform: translate(-100%, -50%);
  }

  to {
    transform: translate(0, -50%);
  }
}

@keyframes studio-action-menu-edge-out-start {
  from {
    transform: translate(0, -50%);
  }

  to {
    transform: translate(-100%, -50%);
  }
}

@keyframes studio-action-menu-veil-out {
  to {
    opacity: 0;
  }
}

dialog.studio-action-menu-layer {
  width: auto;
  max-width: none;
  height: auto;
  max-height: none;
  color: inherit;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  animation: none;
  position: fixed;
  inset: 0;
  overflow: visible;
  transform: none;
}

dialog.studio-action-menu-layer.is-leaving {
  pointer-events: none;
  animation: none;
}

dialog.studio-action-menu-layer[open] {
  display: block;
}

dialog.studio-action-menu-layer::backdrop {
  background: none;
}

.studio-action-menu-scrim {
  z-index: 0;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  cursor: default;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  inset: 0;
}

.studio-add-menu.studio-action-menu {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  max-height: 372px;
  overflow: hidden auto;
  width: max-content !important;
  min-width: 0 !important;
  max-width: min(320px, 100vw - 24px) !important;
}

.studio-add-menu.studio-action-menu.is-edge {
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  box-shadow: var(--cursor-shadow-menu, 0 12px 40px #00000047);
  border-radius: 18px 0 0 18px;
  flex-direction: column;
  animation: none;
  top: 50%;
  right: 0;
  transform: translate(0, -50%);
  width: max-content !important;
  min-width: 0 !important;
  max-width: min(360px, 100vw) !important;
  max-height: none !important;
  padding: 0 !important;
  display: flex !important;
  position: fixed !important;
  bottom: auto !important;
  left: auto !important;
  overflow: hidden !important;
}

.studio-add-menu.studio-action-menu.is-edge.is-start {
  border-radius: 0 18px 18px 0;
  animation: none;
  left: 0 !important;
  right: auto !important;
}

.studio-action-menu.is-edge.is-leaving {
  pointer-events: none;
  animation: .18s cubic-bezier(.22, 1, .36, 1) forwards studio-action-menu-edge-out !important;
}

.studio-action-menu.is-edge.is-start.is-leaving {
  pointer-events: none;
  animation: .18s cubic-bezier(.22, 1, .36, 1) forwards studio-action-menu-edge-out-start !important;
}

.cursor-tab-context-menu.studio-action-menu {
  width: max-content;
  min-width: 0;
  max-width: min(320px, 100vw - 48px);
}

.studio-action-menu, .studio-action-section {
  flex-direction: column;
  align-items: stretch;
  width: max-content;
  max-width: min(320px, 100vw - 48px);
  display: flex;
}

.studio-action-menu > .studio-action-section, .studio-action-menu > .cursor-tab-context-item {
  flex: none;
  min-height: min-content;
}

.studio-action-section {
  background: none;
  border-radius: 12px;
  flex-direction: column;
  align-self: stretch;
  align-items: stretch;
  gap: 4px;
  width: auto;
  margin: 0;
  padding: 2px;
  display: flex;
}

.studio-action-menu-head {
  z-index: calc(var(--studio-z-base) + 2);
  background: var(--mos-page, var(--color-cursor-panel));
  height: 36px;
  box-shadow: 0 0 0 1px var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: 999px;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0 4px 0 12px;
  display: flex;
  position: absolute;
  top: 6px;
  left: 8px;
  right: 8px;
}

.studio-action-menu.is-edge .studio-action-menu-head:not(.has-extra) {
  box-shadow: none;
  background: none;
  border-radius: 0;
  padding: 0 8px 0 0;
  right: 0;
}

.studio-action-menu-head.has-extra {
  border-radius: 16px;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  height: auto;
  padding: 0;
}

.studio-action-menu-title-row {
  flex: auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  height: 36px;
  padding: 0;
  display: flex;
}

.studio-action-menu-head.has-extra .studio-action-menu-title-row {
  height: 36px;
  padding: 8px 8px 0;
}

.studio-action-menu-extra {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  min-width: 0;
  min-height: 0;
  padding: 0 8px 8px;
  display: flex;
}

.studio-action-menu-balance-row {
  background: color-mix(in srgb, var(--mos-text) 3%, var(--mos-page, var(--color-cursor-panel)));
  border-radius: 999px;
  align-self: stretch;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-width: 0;
  height: 28px;
  margin: 0;
  padding: 0 10px 0 5px;
  display: flex;
}

.studio-action-menu-balance {
  text-align: left;
  min-width: 0;
  color: var(--color-cursor-text, var(--mos-text));
  flex: auto;
  align-items: baseline;
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
  display: flex;
}

.studio-action-menu-balance-code {
  letter-spacing: .04em;
  color: var(--color-cursor-muted, var(--mos-muted));
  margin-left: 4px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
}

.studio-action-menu-extra .studio-balance-chip-topup {
  background: var(--cursor-accent, var(--mos-accent));
  width: 100%;
  height: 32px;
  min-height: 32px;
  color: var(--cursor-on-accent, #fff);
  letter-spacing: -.01em;
  border: 0;
  justify-content: center;
  align-self: stretch;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 650;
  display: inline-flex;
  border-radius: 999px !important;
}

.studio-action-menu-extra .studio-balance-chip-topup svg {
  width: 14px;
  height: 14px;
}

.studio-action-menu-extra .studio-balance-chip-topup:hover {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 88%, #000);
}

[data-appearance="light"] .studio-action-menu-head.has-extra, [data-appearance="light"] .studio-action-menu-head:not(.has-extra) .studio-action-menu-title {
  background: var(--mos-plate);
}

.studio-action-menu.is-edge:has(.studio-action-menu-head.has-extra) .studio-action-menu-scroll {
  max-height: 382px;
  padding-top: 128px;
}

.studio-action-menu-scroll {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  box-sizing: border-box;
  align-self: stretch;
  min-height: 0;
  max-height: 408px;
  padding: 46px 6px 6px 8px;
  overflow: hidden auto;
}

.studio-action-menu-title-sizer {
  visibility: hidden;
  white-space: nowrap;
  pointer-events: none;
  height: 0;
  padding-right: 76px;
  font-size: 13px;
  font-weight: 600;
  display: block;
  overflow: hidden;
}

.studio-action-menu-title {
  white-space: nowrap;
  background: var(--mos-page, var(--color-cursor-panel));
  min-width: 0;
  height: 28px;
  box-shadow: 0 0 0 1px var(--color-cursor-border-soft, var(--mos-border-soft));
  text-align: left;
  color: var(--color-cursor-text, var(--mos-text));
  border-radius: 999px;
  flex: auto;
  align-items: center;
  margin: 0;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  display: flex;
}

.studio-action-menu-head.has-extra .studio-action-menu-title {
  background: color-mix(in srgb, var(--mos-text) 4%, var(--mos-page, var(--color-cursor-panel)));
  box-shadow: none;
}

.studio-action-menu-close {
  background: color-mix(in srgb, var(--mos-text) 6%, transparent);
  width: 28px;
  height: 28px;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  flex: 0 0 28px;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
}

.studio-action-menu-close svg {
  width: 14px;
  height: 14px;
}

.studio-action-menu .cursor-tab-context-item {
  background: color-mix(in srgb, var(--mos-text) 4%, var(--mos-plate));
  text-align: left;
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  border: 0;
  border-radius: 10px;
  justify-content: flex-start;
  align-self: stretch;
  gap: 8px;
  width: auto;
  min-height: 32px;
  padding: 5px 22px 5px 6px;
}

.studio-action-menu .cursor-tab-context-item-label {
  text-align: left;
  -webkit-user-select: none;
  user-select: none;
  flex: 0 auto;
}

.studio-action-menu .cursor-tab-context-item:hover:not(:disabled) {
  background: color-mix(in srgb, var(--mos-text) 8%, var(--mos-plate));
}

.studio-action-menu .cursor-tab-context-item.is-plain .cursor-tab-context-item-icon, .studio-action-menu .cursor-tab-context-item.is-plain:hover:not(:disabled) .cursor-tab-context-item-icon {
  color: var(--color-cursor-text, var(--mos-text));
  background: none;
}

.studio-action-menu .cursor-tab-context-item-icon {
  background: color-mix(in srgb, var(--cursor-accent) 18%, transparent);
  width: 22px;
  height: 22px;
  color: var(--cursor-accent, var(--color-cursor-accent));
  border-radius: 8px;
  flex: 0 0 22px;
  justify-content: center;
  align-items: center;
  line-height: 0;
  display: inline-flex;
}

.studio-action-menu .cursor-tab-context-item:hover:not(:disabled) .cursor-tab-context-item-icon {
  background: color-mix(in srgb, var(--cursor-accent) 28%, transparent);
}

.studio-action-menu .cursor-tab-context-item-icon svg {
  width: 13px;
  height: 13px;
  color: inherit;
  margin: 0;
  display: block;
}

.studio-action-menu .cursor-tab-context-item-label {
  flex: auto;
  min-width: 0;
  font-size: 12px;
  font-weight: 550;
  line-height: 1.2;
}

.studio-action-menu .cursor-tab-context-item.is-danger {
  color: var(--cursor-danger, var(--color-cursor-danger));
}

.studio-action-menu .cursor-tab-context-item.is-danger .cursor-tab-context-item-icon {
  background: color-mix(in srgb, var(--cursor-danger, #ef4444) 16%, transparent);
  color: var(--cursor-danger, var(--color-cursor-danger));
}

.studio-polish .studio-folder-pathbar {
  min-height: var(--cursor-head-h, 36px);
  align-items: center;
  gap: 8px;
  padding: 0 8px 8px;
  background: none !important;
}

.studio-polish .studio-folder-pathbar .desk-file-breadcrumbs {
  background: none;
  border: 0;
  align-items: center;
  gap: 6px;
}

.studio-polish .studio-folder-pathbar .desk-file-breadcrumbs-back {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  color: var(--color-cursor-muted, var(--mos-muted));
  border-radius: 999px;
  margin: 0;
}

.studio-polish .studio-folder-pathbar .desk-file-breadcrumbs-track {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  border-radius: 999px;
  gap: 2px;
  height: 36px;
  padding: 0 8px 0 4px;
}

[data-appearance="light"] .studio-polish .studio-folder-pathbar .desk-file-breadcrumbs-back, [data-appearance="light"] .studio-polish .studio-folder-pathbar .desk-file-breadcrumbs-track, [data-appearance="light"] .studio-polish .studio-folder-pathbar-tools .studio-settings-trigger, [data-appearance="light"] .studio-polish .studio-folder-pathbar-tools .studio-file-select-toggle, [data-appearance="light"] .studio-polish .studio-folder-pathbar-tools .studio-file-view-toggle, [data-appearance="light"] .studio-polish .studio-folder-pathbar-tools .studio-file-add-toggle {
  background: var(--mos-plate) !important;
}

.studio-polish.is-studio-mobile .studio-files-workspace-tab .cursor-explorer-body > .studio-files-chrome, .studio-polish.is-studio-mobile .studio-files-workspace-tab .cursor-explorer-body > .studio-folder-pathbar {
  z-index: calc(var(--studio-z-base) + 4);
  position: absolute;
  left: 0;
  right: 0;
}

.studio-polish.is-studio-mobile .studio-files-workspace-tab .cursor-explorer-body > .studio-files-chrome {
  top: var(--studio-mobile-head-clear, 56px);
  background: none !important;
  padding: 4px 8px !important;
}

.studio-polish.is-studio-mobile .studio-files-workspace-tab .studio-files-search-row, .studio-polish.is-studio-mobile .studio-files-workspace-tab .studio-files-chrome {
  background: none !important;
}

.studio-polish.is-studio-mobile .studio-files-workspace-tab .studio-files-search-row {
  min-width: 0;
  flex: auto !important;
  width: auto !important;
  max-width: none !important;
}

.studio-polish.is-studio-mobile .studio-files-workspace-tab .studio-files-search-row > .cursor-panel-search {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

.studio-polish.is-studio-mobile .studio-files-workspace-tab .cursor-explorer-body > .studio-folder-pathbar {
  top: calc(var(--studio-mobile-head-clear, 56px) + 44px);
  background: none !important;
  padding: 0 8px !important;
}

.studio-polish.is-studio-mobile .studio-files-workspace-tab .studio-folder-pathbar-tools {
  padding-right: 0 !important;
}

.studio-polish.is-studio-mobile .studio-files-workspace-tab .cursor-explorer-body > .desk-file-tree-scroll, .studio-polish.is-studio-mobile .studio-files-workspace-tab .cursor-explorer-body > .studio-cn-store {
  z-index: var(--studio-z-base);
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  min-height: 0;
  padding-top: calc(var(--studio-mobile-head-clear, 56px) + 88px);
  box-sizing: border-box;
  position: absolute;
  inset: 0;
  overflow: hidden auto;
}

.studio-polish:not(.is-studio-mobile) .studio-files-workspace-tab:before {
  content: "";
  z-index: calc(var(--studio-z-base) + 5);
  pointer-events: none;
  background: linear-gradient(to bottom,
    color-mix(in srgb, var(--mos-page, #fff) 72%, transparent) 0%,
    color-mix(in srgb, var(--mos-page, #fff) 28%, transparent) 58%,
    transparent 100%);
  height: 72px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has(.studio-files-workspace-tab) {
  padding-top: 0;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome.is-network-store {
  padding-top: var(--studio-desktop-head-clear, 44px);
  box-sizing: border-box;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome {
  height: 100%;
  min-height: 0;
  padding: var(--studio-desktop-head-clear, 44px) 0 0 4px;
  box-sizing: border-box;
  grid-template-columns: max-content max-content minmax(0, 1fr) minmax(180px, 240px) max-content;
  grid-auto-rows: auto;
  align-content: start;
  align-items: center;
  gap: 6px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome.is-network-store {
  grid-template-columns: auto minmax(0, 1fr);
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome > .studio-files-chrome, .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) > .studio-folder-pathbar, .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) .desk-file-breadcrumbs {
  display: contents;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-source-toggle, .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) .desk-file-breadcrumbs-back, .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) .desk-file-breadcrumbs-track, .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-search-row, .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) .studio-folder-pathbar-tools {
  z-index: calc(var(--studio-z-base) + 6);
  pointer-events: auto;
  position: relative;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) .studio-files-source-toggle, .studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome.is-network-store .studio-files-source-toggle {
  flex: none;
  order: 1;
  grid-column: 1;
  width: auto !important;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) .desk-file-breadcrumbs-back {
  order: 2;
  grid-column: 2;
  margin: 0;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) .desk-file-breadcrumbs-track {
  order: 3;
  grid-column: 3;
  place-self: center stretch;
  width: 100%;
  min-width: 0;
  max-width: none;
  overflow: auto hidden;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome .studio-files-search-row {
  flex: none;
  order: 4;
  grid-column: 4;
  width: 100%;
  min-width: 0;
  max-width: none;
  height: 36px;
  max-height: 36px;
  margin-right: 0;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome.is-network-store .studio-files-search-row {
  grid-column: 2;
  justify-self: stretch;
  width: 100%;
  margin-right: 0;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) .studio-folder-pathbar-tools {
  flex: none;
  order: 5;
  grid-column: 5;
  justify-self: end;
  margin-right: 0;
  padding-right: 0;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) > :is(.studio-file-selection-bar, .studio-copy-dest-bar, .studio-file-inline-tools) {
  z-index: calc(var(--studio-z-base) + 2);
  grid-area: 2 / 1 / auto / -1;
  width: 100%;
  min-width: 0;
  position: relative;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store) > .desk-file-tree-scroll {
  z-index: var(--studio-z-base);
  min-height: 0;
  padding-top: calc(var(--studio-desktop-head-clear, 44px) + 44px);
  box-sizing: border-box;
  position: absolute;
  inset: 0;
  overflow: hidden auto;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome.is-network-store > .studio-cn-store {
  z-index: var(--studio-z-base);
  top: calc(var(--studio-desktop-head-clear, 44px) + 42px);
  pointer-events: auto;
  min-height: 0;
  padding-top: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}

.studio-polish:not(.is-studio-mobile) .cursor-explorer-body.is-workspace-chrome:not(.is-network-store):has(.studio-file-selection-bar, .studio-copy-dest-bar) > .desk-file-tree-scroll {
  padding-top: calc(var(--studio-desktop-head-clear, 44px) + 96px);
}

.studio-polish .studio-folder-pathbar .desk-file-breadcrumbs-sep {
  opacity: .45;
}

.studio-polish .studio-folder-pathbar .desk-file-breadcrumbs-chip {
  height: 28px;
  min-height: 28px;
  color: var(--color-cursor-muted, var(--mos-muted));
  background: none;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 13px;
  font-weight: 550;
}

.studio-polish .studio-folder-pathbar .desk-file-breadcrumbs-chip.is-current {
  color: var(--color-cursor-text, var(--mos-text));
  background: none;
  font-weight: 650;
}

.studio-polish .studio-folder-pathbar .desk-file-breadcrumbs-chip:hover {
  background: color-mix(in srgb, var(--mos-text, #111) 6%, transparent);
  color: var(--color-cursor-text, var(--mos-text));
}

/* [project]/src/studio/components/studio-files-nav.css [app-client] (css) */
.studio-files-nav-pane {
  width: 100%;
  min-width: 0;
  max-width: none;
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text, var(--mos-text));
  box-shadow: none;
  background: none;
  border: 0;
  flex-direction: column;
  flex: auto;
  margin: 0;
  padding: 0;
  display: flex;
}

.studio-files-nav-scroll {
  overscroll-behavior: contain;
  scrollbar-width: thin;
  flex: auto;
  width: 100%;
  min-width: 0;
  min-height: 0;
  padding: 6px 4px 12px;
  overflow: hidden auto;
}

.studio-files-nav-section {
  flex-direction: column;
  gap: 1px;
  width: 100%;
  margin-bottom: 10px;
  display: flex;
}

.studio-files-nav-section:last-child {
  margin-bottom: 0;
}

.studio-files-nav-section-label {
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  font-size: var(--studio-fs-xs, 11px);
  font-weight: var(--desk-w-strong, 650);
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted, var(--mos-muted));
  -webkit-user-select: none;
  user-select: none;
  padding: 4px 8px 5px;
}

.studio-files-nav-item {
  border-radius: var(--cursor-radius-md, var(--studio-r-md, 8px));
  width: 100%;
  min-width: 0;
  min-height: 28px;
  color: inherit;
  font: inherit;
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  font-size: var(--desk-fm-label-size, 13px);
  font-weight: var(--desk-w-medium, 500);
  letter-spacing: -.01em;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0 8px;
  display: flex;
}

.studio-files-nav-item[draggable="true"] {
  cursor: grab;
}

.studio-files-nav-item[draggable="true"]:active {
  cursor: grabbing;
}

.studio-files-nav-item svg {
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.studio-files-nav-item span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-files-nav-item:hover {
  background: var(--mos-hover, color-mix(in srgb, var(--mos-text) 6%, transparent));
}

.studio-files-nav-item:hover svg {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-files-nav-item.is-active {
  background: var(--mos-plate, var(--mos-panel));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-files-nav-item.is-active svg {
  color: var(--cursor-accent, var(--mos-accent));
}

.studio-files-nav-quick {
  border-radius: 8px;
  flex-direction: column;
  gap: 1px;
  width: 100%;
  min-height: 48px;
  padding: 0;
  transition: background .12s, box-shadow .12s;
  display: flex;
  position: relative;
}

.studio-files-nav-quick.is-drop-target {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 10%,
    var(--mos-plate, transparent));
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 42%, transparent);
}

.studio-files-nav-quick-empty {
  font-size: var(--studio-fs-md, 14px);
  color: var(--color-cursor-muted, var(--mos-muted));
  -webkit-user-select: none;
  user-select: none;
  margin: 0;
  padding: 8px;
  line-height: 1.35;
}

.studio-files-nav-pin-row {
  align-items: center;
  gap: 2px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-files-nav-pin-row .studio-files-nav-item {
  flex: auto;
  min-width: 0;
}

.studio-files-nav-unpin {
  width: 22px;
  height: 22px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  opacity: 0;
  background: none;
  border: 0;
  border-radius: 6px;
  flex: none;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
}

.studio-files-nav-pin-row:hover .studio-files-nav-unpin, .studio-files-nav-unpin:focus-visible {
  opacity: 1;
}

.studio-files-nav-unpin:hover {
  background: var(--mos-hover, color-mix(in srgb, var(--mos-text) 8%, transparent));
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-files-nav-unpin svg {
  width: 12px;
  height: 12px;
}

.studio-polish aside.is-files-nav {
  width: 100%;
  max-width: none;
  border-right: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft, var(--mos-border))) !important;
}

.studio-polish aside.is-files-nav .cursor-panel-head, .studio-polish aside.is-files-nav .cursor-sidebar-head {
  width: 100%;
}

.studio-polish .studio-main-panels > [data-panel-id="studio-sidebar"]:has(aside.is-files-nav) {
  overflow: hidden;
  background: var(--mos-page, var(--mos-panel)) !important;
}

.studio-polish aside.is-files-nav, .studio-polish aside.is-files-nav .cursor-panel-head, .studio-polish aside.is-files-nav .cursor-sidebar-head {
  background: var(--mos-page, var(--mos-panel)) !important;
}

.studio-polish .studio-files-workspace-tab, .studio-polish .studio-files-workspace-tab .cursor-explorer-body {
  width: 100%;
  box-shadow: none;
  border: 0;
}

.studio-files-nav-mobile-sheet {
  left: 0;
  right: 0;
  bottom: calc(var(--studio-mobile-bottom-chrome, calc(44px + env(safe-area-inset-bottom, 0px)))
      + var(--studio-keyboard-inset, 0px));
  z-index: 55;
  --studio-mobile-files-nav-sheet-band: calc(100svh
      - var(--studio-mobile-top-chrome, calc(44px + env(safe-area-inset-top, 0px)))
      - var(--studio-mobile-bottom-chrome, calc(44px + env(safe-area-inset-bottom, 0px)))
      - 8px);
  --studio-mobile-files-nav-sheet-height: calc(.55 * var(--studio-mobile-files-nav-sheet-band));
  --studio-mobile-files-nav-sheet-full: calc(.82 * var(--studio-mobile-files-nav-sheet-band));
  height: min(var(--studio-files-nav-sheet-h, var(--studio-mobile-files-nav-sheet-height, 55svh)),
    var(--studio-mobile-files-nav-sheet-band));
  max-height: min(var(--studio-mobile-files-nav-sheet-full, 72svh),
    var(--studio-mobile-files-nav-sheet-band));
  background: var(--mos-plate, var(--mos-panel));
  box-shadow: var(--studio-mobile-sheet-shadow, 0 -8px 28px #0000002e);
  overscroll-behavior: none;
  will-change: auto;
  border: none;
  border-radius: 18px 18px 0 0;
  flex-direction: column;
  padding: 0;
  transition: none;
  animation: .11s cubic-bezier(.22, 1, .36, 1) studio-files-nav-mobile-rise;
  display: flex;
  position: fixed;
  overflow: hidden;
}

.studio-polish[data-keyboard-open="1"] .studio-files-nav-mobile-sheet {
  top: calc(var(--studio-mobile-top-chrome, calc(44px + env(safe-area-inset-top, 0px))) + 8px);
  border-radius: 14px 14px 0 0;
  height: auto !important;
  max-height: none !important;
}

.studio-files-nav-mobile-sheet.is-entered {
  animation: none;
}

.studio-files-nav-mobile-sheet.is-full {
  border-radius: 14px 14px 0 0;
}

.studio-files-nav-mobile-sheet.is-dragging {
  transition: none !important;
  animation: none !important;
}

.studio-files-nav-mobile-sheet.is-settling {
  transition: height .14s cubic-bezier(.22, 1, .36, 1), border-radius .12s;
}

@keyframes studio-files-nav-mobile-rise {
  from {
    opacity: .92;
    transform: translate3d(0, 18px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.studio-files-nav-mobile-sheet-handle {
  z-index: 2;
  background: var(--mos-plate, var(--mos-panel));
  min-height: 28px;
  box-shadow: none;
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  border: 0;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 12px 0 8px;
  display: flex;
  position: relative;
}

.studio-files-nav-mobile-sheet-handle:active {
  cursor: grabbing;
}

.studio-files-nav-mobile-sheet-grab {
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: color-mix(in srgb, var(--mos-text, var(--color-cursor-text)) 40%, transparent);
  pointer-events: none;
  width: 44px;
  height: 5px;
}

.studio-files-nav-mobile-sheet-body {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-files-nav-mobile-sheet .studio-files-nav-pane {
  flex: auto;
  height: 100%;
  min-height: 0;
}

.studio-files-nav-mobile-sheet .studio-files-nav-scroll {
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  flex: auto;
  min-height: 0;
  padding: 4px 10px 12px;
  overflow: hidden auto;
}

.studio-files-nav-item, .studio-files-chrome-btn, .studio-files-tool-btn {
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
}

.studio-files-nav-section > .studio-files-nav-item, .studio-files-nav-section > .studio-files-nav-pin-row {
  content-visibility: auto;
  contain-intrinsic-size: auto 30px;
}

.studio-files-nav-scroll {
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

/* [project]/src/studio/components/studio-floating-overlay.css [app-client] (css) */
.studio-floating-overlay {
  z-index: var(--studio-floating-overlay-z, 120);
  pointer-events: none;
  position: fixed;
  inset: 0;
}

.studio-floating-overlay-slot {
  pointer-events: auto;
  box-sizing: border-box;
  width: max-content;
  max-width: min(220px, 100vw - 28px);
  height: max-content;
  position: absolute;
}

.studio-floating-overlay.is-bottom-right .studio-floating-overlay-slot {
  bottom: 12px;
  right: 12px;
}

.studio-floating-overlay.is-bottom-left .studio-floating-overlay-slot {
  bottom: 12px;
  left: 12px;
}

.studio-floating-overlay.is-top-right .studio-floating-overlay-slot {
  top: 12px;
  right: 12px;
}

.studio-floating-overlay.is-top-left .studio-floating-overlay-slot {
  top: 12px;
  left: 12px;
}

:is(body:has(.studio-polish.is-studio-mobile) .studio-floating-overlay.is-bottom-right .studio-floating-overlay-slot, body:has(.studio-polish.is-studio-mobile) .studio-floating-overlay.is-bottom-left .studio-floating-overlay-slot) {
  bottom: calc(12px + var(--studio-mobile-bottom-nav-height, 56px) + var(--studio-keyboard-inset, 0px));
}

body:has(.studio-polish.is-studio-mobile) .studio-floating-overlay.is-bottom-left .studio-floating-overlay-slot {
  left: 10px;
}

body:has(.studio-polish.is-studio-mobile) .studio-floating-overlay.is-bottom-right .studio-floating-overlay-slot {
  right: 10px;
}

.studio-floating-overlay .studio-file-transfer-tray, .studio-floating-overlay .studio-file-transfer-tray.is-floating {
  pointer-events: auto;
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  flex: none;
  gap: 3px;
  width: min(240px, 100vw - 24px);
  height: max-content;
  max-height: 88px;
  padding: 4px;
  position: relative;
  bottom: auto;
  right: auto;
  overflow-y: auto;
  box-shadow: 0 8px 20px #00000024;
}

.studio-floating-overlay .studio-file-transfer {
  height: 24px;
  min-height: 24px;
  padding: 0 4px 0 6px;
}

/* [project]/src/studio/components/studio-fullscreen-status.css [app-client] (css) */
.studio-fullscreen-status {
  z-index: 80;
  box-sizing: border-box;
  height: var(--studio-fullscreen-status-h, max(32px, calc(env(safe-area-inset-top, 0px) + 4px)));
  padding: 4px max(14px, env(safe-area-inset-right, 0px)) 4px
    max(14px, env(safe-area-inset-left, 0px));
  pointer-events: none;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  background: var(--mos-bg, #05080f);
  border-bottom: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, #333) 55%, transparent);
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  position: fixed !important;
}

.studio-polish.is-studio-mobile.is-browser-fullscreen .studio-fullscreen-status {
  display: flex;
}

[data-appearance="light"] .studio-fullscreen-status {
  background: var(--mos-panel);
  color: #12141a;
  border-bottom-color: #12141a1a;
}

[data-appearance="dark"] .studio-fullscreen-status {
  background: var(--mos-bg, #05080f);
  color: #f2f2f4;
  border-bottom-color: #ffffff1a;
}

.studio-fullscreen-status-time {
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.studio-fullscreen-status-battery {
  border: 1px solid color-mix(in srgb, currentColor 28%, transparent);
  background: color-mix(in srgb, var(--mos-page, #12141a) 55%, transparent);
  min-width: 36px;
  height: 14px;
  color: var(--color-cursor-text-bright, #fff);
  font-variant-numeric: tabular-nums;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 6px;
  font-size: 9px;
  font-weight: 750;
  line-height: 1;
  display: inline-flex;
  position: relative;
  overflow: hidden;
}

.studio-fullscreen-status-battery-fill {
  border-radius: inherit;
  background: color-mix(in srgb, currentColor 28%, transparent);
  transition: width .22s, background-color .22s;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.studio-fullscreen-status-battery.is-high .studio-fullscreen-status-battery-fill {
  background: #3dd68cb3;
}

.studio-fullscreen-status-battery.is-mid .studio-fullscreen-status-battery-fill {
  background: color-mix(in srgb, var(--mos-warning, #f5c542) 75%, transparent);
}

.studio-fullscreen-status-battery.is-low .studio-fullscreen-status-battery-fill {
  background: color-mix(in srgb, var(--mos-danger, #f87171) 78%, transparent);
}

.studio-fullscreen-status-battery.is-critical .studio-fullscreen-status-battery-fill {
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 88%, transparent);
}

.studio-fullscreen-status-battery.is-charging .studio-fullscreen-status-battery-fill {
  background: #3dd68ccc;
}

.studio-fullscreen-status-battery.is-charging {
  border-color: #3dd68c73;
}

.studio-fullscreen-status-battery-label {
  z-index: 1;
  position: relative;
}

[data-appearance="light"] .studio-fullscreen-status-battery {
  color: #12141a;
  background: #ffffffb8;
  border-color: #12141a29;
}

/* [project]/src/studio/components/studio-landing.css [app-client] (css) */
.studio-landing {
  --mos-page: #f5f5f7;
  --mos-plate: #ececf0;
  --mos-plate-strong: #d4d4da;
  --mos-text: #1c1c1e;
  --studio-landing-ink: #1c1c1e;
  --studio-landing-mute: #1c1c1e8c;
  --studio-landing-faint: #1c1c1e61;
  --studio-landing-line: #d8d8de;
  --studio-landing-chrome-h: var(--cursor-head-h, 36px);
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  background: var(--mos-page);
  height: 100dvh;
  max-height: 100dvh;
  color: var(--studio-landing-ink);
  flex-direction: column;
  font-family: inherit;
  display: flex;
  position: fixed;
  inset: 0;
  overflow: hidden;
}

.studio-landing-head {
  height: var(--studio-landing-chrome-h);
  min-height: var(--studio-landing-chrome-h);
  background: var(--mos-plate);
  border-bottom: 1px solid var(--studio-landing-line);
  box-sizing: border-box;
  z-index: 20;
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  display: flex;
  position: relative;
  overflow: visible;
}

.studio-landing-brand {
  z-index: 1;
  min-width: 0;
  color: inherit;
  cursor: pointer;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  display: inline-flex;
}

.studio-landing-brand-name {
  letter-spacing: .02em;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 12px;
  font-weight: 650;
  overflow: hidden;
}

.studio-landing-brand .mos-brand-logo {
  opacity: 1;
}

.studio-landing-nav {
  align-items: center;
  gap: 2px;
  height: 24px;
  display: none;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.studio-landing-nav-link {
  border-radius: var(--cursor-radius-sm, 6px);
  height: 24px;
  color: var(--studio-landing-mute);
  letter-spacing: .01em;
  cursor: pointer;
  background: none;
  border: none;
  justify-content: center;
  align-items: center;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
  transition: background .16s, color .16s;
  display: inline-flex;
}

.studio-landing-nav-link:hover {
  background: var(--mos-plate-strong);
  color: var(--studio-landing-ink);
}

.studio-landing-nav-link:focus-visible {
  outline-offset: 1px;
  outline: 2px solid #1c1c1e59;
}

.studio-landing-head-end {
  z-index: 1;
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  display: flex;
}

.studio-landing-head-btn {
  box-sizing: border-box;
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate-strong);
  height: 24px;
  min-height: 24px;
  color: var(--studio-landing-ink);
  letter-spacing: .01em;
  cursor: pointer;
  border: 1px solid #0000;
  justify-content: center;
  align-items: center;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
  transition: background .18s, color .18s, border-color .18s;
  display: inline-flex;
}

.studio-landing-head-btn:hover {
  background: #b3b3b8;
}

.studio-landing-head-btn:focus-visible {
  outline-offset: 1px;
  outline: 2px solid #1c1c1e59;
}

.studio-landing-head-btn.is-primary {
  color: #f5f5f7;
  background: #1c1c1e;
  border-radius: 999px;
  padding: 0 8px;
}

.studio-landing-head-btn.is-primary:hover {
  color: #f5f5f7;
  background: #363638;
}

.studio-landing-main {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scroll-snap-type: none;
  scrollbar-width: none;
  flex: auto;
  min-height: 0;
  overflow: hidden auto;
}

.studio-landing-foot-brand {
  color: var(--studio-landing-ink);
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 650;
  display: inline-flex;
}

.studio-landing-foot-copy {
  color: var(--studio-landing-faint);
  margin: 0;
  font-size: 11px;
  font-weight: 500;
}

.studio-landing-foot-mail {
  color: var(--studio-landing-mute);
  font-size: 12px;
  font-weight: 550;
  text-decoration: none;
}

.studio-landing-foot-mail:hover {
  color: var(--studio-landing-ink);
  text-decoration: underline;
}

@media (min-width: 980px) {
  .studio-landing-head {
    padding: 0 8px;
  }

  .studio-landing-nav {
    display: flex;
  }

  .studio-landing-head-btn.is-primary {
    padding: 0 10px;
  }
}

@media (max-width: 979px) {
  .studio-landing {
    --studio-landing-chrome-h: calc(38px + env(safe-area-inset-bottom, 0px));
  }

  .studio-landing-main {
    order: 1;
  }

  .studio-landing-head {
    height: var(--studio-landing-chrome-h);
    min-height: var(--studio-landing-chrome-h);
    padding: 0 8px;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    border-bottom: none;
    border-top: 1px solid var(--studio-landing-line);
    order: 2;
    gap: 6px;
  }

  .studio-landing-head-end {
    gap: 5px;
  }

  .studio-landing-brand {
    gap: 6px;
  }

  .studio-landing-brand .mos-brand-mark, .studio-landing-brand .mos-brand-mark img {
    width: 20px !important;
    height: 20px !important;
  }

  .studio-landing-brand-name {
    letter-spacing: .02em;
    max-width: 10rem;
    font-size: 12px;
    font-weight: 650;
  }

  .studio-landing-head-btn {
    border-radius: 999px;
    height: 28px;
    min-height: 28px;
    padding: 0 12px;
    font-size: 12px;
  }
}

/* [project]/src/studio/components/studio-layout-borderless-preview.css [app-client] (css) */
html[data-studio-layout-borders="off"] .studio-polish.is-layout-borderless, .studio-polish.is-layout-borderless {
  --studio-shell-border: transparent;
  --studio-chrome-divider: transparent;
}

html[data-studio-layout-borders="off"] .studio-polish.is-layout-borderless:not(.is-studio-mobile) .cursor-workspace-head, .studio-polish.is-layout-borderless:not(.is-studio-mobile) .cursor-workspace-head {
  border-bottom-color: #0000 !important;
}

html[data-studio-layout-borders="off"] .studio-polish.is-layout-borderless:not(.is-studio-mobile) .studio-mobile-bottom-nav, .studio-polish.is-layout-borderless:not(.is-studio-mobile) .studio-mobile-bottom-nav {
  border-top-color: #0000 !important;
}

html[data-studio-layout-borders="off"] .studio-polish.is-layout-borderless :is(aside, aside.is-files-nav, aside.profile-comments-dock, .studio-settings-sidebar, .studio-history-sidebar, .studio-dm-sidebar, .cursor-explorer-panel, .cursor-settings-panel, .cursor-settings-sheet), html[data-appearance="light"][data-studio-layout-borders="off"] .studio-polish.is-layout-borderless :is(aside, aside:not(.profile-comments-dock), aside.profile-comments-dock, .studio-settings-sidebar, .studio-history-sidebar, .studio-dm-sidebar, .cursor-explorer-panel), .studio-polish.is-layout-borderless :is(aside, aside.is-files-nav, aside.profile-comments-dock, .studio-settings-sidebar, .studio-history-sidebar, .studio-dm-sidebar, .cursor-explorer-panel, .cursor-settings-panel, .cursor-settings-sheet) {
  box-shadow: none;
  border-color: #0000 !important;
  border-left-style: none !important;
  border-left-width: 0 !important;
  border-right-style: none !important;
  border-right-width: 0 !important;
}

html[data-studio-layout-borders="off"] .studio-polish.is-layout-borderless .studio-main-panels > [data-panel], .studio-polish.is-layout-borderless .studio-main-panels > [data-panel] {
  border-color: #0000 !important;
}

html[data-studio-layout-borders="off"] .studio-polish.is-layout-borderless :is(.cursor-resize, .cursor-resize-v), html[data-studio-layout-borders="off"] .studio-polish.is-layout-borderless :is(.cursor-resize, .cursor-resize-v):hover, html[data-studio-layout-borders="off"] .studio-polish.is-layout-borderless :is(.cursor-resize, .cursor-resize-v)[data-resize-handle-active], .studio-polish.is-layout-borderless :is(.cursor-resize, .cursor-resize-v), .studio-polish.is-layout-borderless :is(.cursor-resize, .cursor-resize-v):hover, .studio-polish.is-layout-borderless :is(.cursor-resize, .cursor-resize-v)[data-resize-handle-active] {
  background: none !important;
}

/* [project]/src/studio/components/mail/studio-mail.css [app-client] (css) */
.studio-chrome-pane.studio-mail-pane {
  background: var(--mos-page);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: visible;
}

.studio-polish .studio-mail-pane .cursor-panel-head {
  z-index: 4;
  gap: 6px;
  position: relative;
  overflow: visible;
  height: auto !important;
  min-height: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  padding: 0 4px !important;
}

.studio-mail-pane .cursor-panel-head-tools {
  gap: 6px;
  height: auto;
  margin-left: 0;
  padding: 0;
}

.studio-mail-pane .cursor-panel-head .cursor-icon-btn, .studio-mail-pane .cursor-panel-head .cursor-icon-btn:hover, .studio-mail-pane .cursor-panel-head .cursor-icon-btn:active {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  border-radius: 999px !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
}

.studio-mail-pane .cursor-select-menu {
  background: none;
  min-width: 0;
  height: 36px;
  display: flex;
}

.studio-polish .studio-mail-pane .cursor-select-menu .cursor-select-trigger, .studio-polish .studio-mail-pane .cursor-select-menu .cursor-select-trigger:hover, .studio-polish .studio-mail-pane .cursor-select-menu.is-open .cursor-select-trigger, .studio-mail-pane .cursor-select-menu .cursor-select-trigger, .studio-mail-pane .cursor-select-menu .cursor-select-trigger:hover, .studio-mail-pane .cursor-select-menu.is-open .cursor-select-trigger {
  background: none;
  border: 0;
  border-radius: 999px;
  justify-content: space-between;
  width: 100%;
  height: 36px;
  min-height: 36px;
  padding: 0 12px;
  font-weight: 500;
}

.studio-mail-pane .cursor-select-menu .cursor-select-trigger > svg {
  flex: none;
  margin-left: auto;
}

.studio-polish .studio-mail-pane .cursor-dropdown {
  background: var(--mos-plate);
}

.studio-mail-mailbox-select, .studio-mail-folder-select {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  border-radius: 999px;
  flex: 0 auto;
  min-width: 0;
  height: 36px;
  position: relative;
  overflow: hidden;
}

.studio-mail-folder-select:before {
  content: none;
}

.studio-mail-head-selects {
  flex-wrap: nowrap;
  flex: 0 auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.studio-mail-head-selects .studio-mail-mailbox-select {
  flex: 0 auto;
  max-width: 280px;
}

.studio-mail-head-selects .studio-mail-folder-select {
  flex: none;
  max-width: 160px;
}

.studio-mail-head-selects .cursor-select-menu, .studio-mail-head-selects .cursor-select-trigger {
  min-width: 0;
  max-width: 100%;
}

.studio-mail-head-selects .cursor-select-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-mail-head-search {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  box-sizing: border-box;
  border-radius: 999px;
  flex: auto;
  align-self: center;
  align-items: center;
  gap: 8px;
  min-width: 0;
  height: 36px;
  margin: 0;
  padding: 0 12px;
  display: flex;
  position: relative;
}

.studio-mail-head-search:before, .studio-mail-head-search:after {
  content: none;
}

[data-appearance="light"] .studio-mail-mailbox-select, [data-appearance="light"] .studio-mail-folder-select, [data-appearance="light"] .studio-mail-head-search, [data-appearance="light"] .studio-mail-head-field, [data-appearance="light"] .studio-mail-pane .cursor-panel-head .cursor-icon-btn {
  background: #fff !important;
}

.studio-mail-head-search .studio-mail-flat-input.is-search {
  font-size: 13px;
}

.studio-mail-head-search svg {
  color: var(--color-cursor-muted, var(--mos-muted));
  flex-shrink: 0;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) {
  padding-top: 0;
  position: relative;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .cursor-panel-head {
  z-index: calc(var(--studio-z-base) + 4);
  top: var(--studio-mobile-head-clear, 56px);
  flex-wrap: wrap;
  align-content: start;
  align-items: center;
  gap: 6px;
  position: absolute;
  left: 0;
  right: 0;
  padding: 4px 8px !important;
  display: flex !important;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose):not(.is-reading) .studio-mail-head-search {
  flex: auto;
  order: 1;
  width: auto;
  min-width: 0;
  max-width: none;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-folder-select {
  flex: 0 auto;
  order: 2;
  width: fit-content;
  min-width: 0;
  max-width: 42%;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-mailbox-select {
  flex: auto;
  order: 2;
  width: auto;
  min-width: 0;
  max-width: none;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-head-selects {
  flex: 100%;
  order: 2;
  width: 100%;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-head-selects .studio-mail-mailbox-select {
  flex: 1 1 0;
  max-width: none;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-head-selects .studio-mail-folder-select {
  flex: 0 auto;
  max-width: 42%;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-folder-select .cursor-select-menu, .studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-folder-select .cursor-select-trigger {
  width: auto;
  min-width: 0;
  max-width: 100%;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-mailbox-select .cursor-select-menu, .studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-mailbox-select .cursor-select-trigger {
  text-align: left;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-mailbox-select .cursor-select-label {
  text-align: left;
  margin-right: auto;
}

.studio-polish.is-studio-mobile .studio-mail-pane .cursor-select-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  align-self: center;
  min-width: 0;
  height: auto;
  line-height: 36px;
  display: block;
  overflow: hidden;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose):not(.is-reading) .cursor-panel-head-tools {
  flex: none;
  order: 1;
  margin-left: 0;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-chrome-pane-body, .studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-body {
  min-height: 0;
  position: absolute;
  inset: 0;
}

.studio-polish.is-studio-mobile .studio-mail-pane:not(.is-compose) .studio-mail-body {
  padding-top: calc(var(--studio-mobile-head-clear, 56px) + 86px);
  box-sizing: border-box;
}

.studio-mail-pane .studio-chrome-pane-body {
  flex-direction: column;
  display: flex;
}

.studio-mail-body {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: auto;
}

.studio-mail-body.is-compose {
  overflow: hidden;
}

.studio-mail-compose-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text, var(--mos-text));
  flex: 1;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  overflow: hidden;
}

.studio-mail-head-compose {
  flex: auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 36px;
  display: flex;
}

.studio-mail-head-compose .studio-mail-compose-from {
  flex: 0 13rem;
  width: auto;
  max-width: 15rem;
  padding: 0 8px;
}

.studio-mail-head-field {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  box-sizing: border-box;
  border-radius: 999px;
  flex: 7rem;
  align-items: center;
  min-width: 0;
  height: 36px;
  padding: 0 12px;
  display: flex;
  position: relative;
}

.studio-mail-head-field.is-subject {
  flex: 1.35 9rem;
}

.studio-mail-head-field:before {
  content: none;
}

.studio-mail-head-compose .studio-mail-flat-input, .studio-mail-head-compose .studio-mail-flat-input.is-subject {
  flex: auto;
  min-width: 0;
  height: 100%;
  padding: 0;
  font-size: 12px;
}

.studio-mail-head-compose .studio-mail-compose-cc {
  flex: none;
  height: 100%;
  padding: 0 8px;
}

.studio-polish .studio-mail-pane .studio-mail-send.cursor-settings-action, .studio-polish .studio-mail-pane .studio-mail-send.studio-chrome-btn, .studio-polish .studio-mail-pane .studio-mail-send.studio-chrome-btn.is-compact {
  background: var(--cursor-accent);
  width: auto;
  min-width: 0;
  color: var(--cursor-on-accent, #fff);
  border: 0;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
  border-radius: 999px !important;
  height: 36px !important;
  min-height: 36px !important;
}

.studio-polish.is-studio-mobile .studio-mail-pane .studio-mail-send.studio-chrome-btn {
  width: 36px !important;
  min-width: 36px !important;
  padding: 0 !important;
}

.studio-polish.is-studio-mobile .studio-mail-pane {
  padding-top: var(--studio-mobile-head-clear, 56px);
  box-sizing: border-box;
}

.studio-mail-pane .studio-mail-send.cursor-settings-action:hover:not(:disabled), .studio-mail-pane .studio-mail-send.studio-chrome-btn:hover:not(:disabled) {
  background: color-mix(in srgb, var(--cursor-accent) 86%, #000);
  color: #fff;
  opacity: 1;
}

.studio-mail-pane .studio-mail-send svg, .studio-mail-pane .studio-mail-send:hover svg, .studio-mail-pane .studio-mail-send:hover:not(:disabled) svg {
  color: #fff;
  stroke: currentColor;
  flex: none;
}

.studio-mail-pane .studio-mail-send.cursor-settings-action:disabled, .studio-mail-pane .studio-mail-send.studio-chrome-btn:disabled {
  opacity: .5;
}

.studio-mail-list {
  flex-direction: column;
  flex: auto;
  gap: 10px;
  min-height: 0;
  margin: 0;
  padding: 12px 10px 10px;
  list-style: none;
  display: flex;
}

.studio-polish.is-studio-mobile .studio-mail-body, .studio-polish.is-studio-mobile .studio-mail-list, .studio-polish.is-studio-mobile .studio-mail-row {
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y !important;
}

.studio-mail-body:has( > .studio-mail-list.is-empty) {
  flex-direction: column;
  display: flex;
}

.studio-mail-list.is-empty {
  flex: auto;
  justify-content: center;
  align-items: center;
  height: auto;
  min-height: 0;
  padding: 0;
}

.studio-mail-list.is-empty > .studio-dm-empty-state {
  flex: none;
  height: auto;
  min-height: 0;
  margin: auto;
}

.studio-mail-list > .studio-mail-row {
  background: color-mix(in srgb, var(--mos-plate-strong) 42%, var(--mos-page));
}

.studio-mail-row {
  width: 100%;
  min-width: 0;
  box-shadow: none;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
  background: none;
  border: 1px solid #0000;
  border-radius: 16px;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 6px 12px 6px 8px;
  transition: background .16s, border-color .16s;
  display: grid;
}

@media (hover: hover) {
  .studio-mail-row:hover {
    border-color: color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
    box-shadow: none;
    border-radius: 18px;
  }
}

.studio-mail-row:active {
  border-color: color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  box-shadow: none;
  border-radius: 18px;
}

.studio-mail-row.is-unread {
  font-weight: 650;
}

.studio-mail-row-avatar-wrap {
  flex: none;
  width: 40px;
  min-width: 40px;
  max-width: 40px;
  height: 40px;
  min-height: 40px;
  max-height: 40px;
  position: relative;
  overflow: visible;
}

.studio-mail-row-avatar-wrap .studio-profile-avatar {
  letter-spacing: .01em !important;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  color: var(--color-cursor-text, var(--mos-text)) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-sizing: border-box !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.studio-mail-row-avatar-wrap .studio-profile-avatar:not(:has( > .studio-profile-avatar-media)) {
  box-shadow: none !important;
  background: none !important;
  border-color: #0000 !important;
}

[data-appearance="light"] .studio-mail-row-avatar-wrap .studio-profile-avatar-fallback:not(.is-placeholder) {
  background: unset;
  color: #fff !important;
}

.studio-mail-row-from {
  color: var(--mos-text);
  font-size: 13px;
}

.studio-mail-row-subject {
  color: var(--mos-text);
  font-size: 12px;
}

.studio-mail-row-snippet {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  overflow: hidden;
}

.studio-mail-row-time {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  white-space: nowrap;
  font-size: 11px;
}

.studio-mail-compose {
  background: var(--mos-page);
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  position: relative;
}

.studio-mail-compose-row {
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border, var(--color-cursor-border-soft));
  box-sizing: border-box;
  flex-shrink: 0;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  display: flex;
}

.studio-mail-compose-from {
  border-right: 1px solid var(--color-cursor-border, var(--color-cursor-border-soft));
  flex-shrink: 0;
  align-items: center;
  width: 38%;
  min-width: 0;
  max-width: 16rem;
  height: 100%;
  padding-right: 8px;
  display: flex;
}

.studio-mail-compose-from .cursor-select-menu {
  width: 100%;
  height: 100%;
}

.studio-polish .studio-mail-compose-from .cursor-select-menu .cursor-select-trigger, .studio-polish .studio-mail-compose-from .cursor-select-menu .cursor-select-trigger:hover, .studio-polish .studio-mail-compose-from .cursor-select-menu.is-open .cursor-select-trigger, .studio-mail-compose-from .cursor-select-menu .cursor-select-trigger, .studio-mail-compose-from .cursor-select-menu .cursor-select-trigger:hover, .studio-mail-compose-from .cursor-select-menu.is-open .cursor-select-trigger {
  background: none;
  border-radius: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  font-weight: 500;
}

.studio-mail-compose-from .cursor-select-leading {
  width: 18px;
  height: 18px;
}

.studio-mail-compose-from .cursor-select-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  overflow: hidden;
}

.studio-mail-email-avatar {
  background: var(--mos-plate-strong, var(--color-cursor-sidebar));
  width: 18px;
  height: 18px;
  color: var(--color-cursor-muted, var(--mos-muted));
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
}

.studio-mail-flat-input, .studio-mail-flat-input:focus, .studio-mail-flat-input:focus-visible {
  min-width: 0;
  height: auto;
  box-shadow: none;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  background: none;
  border: 0;
  outline: none;
  flex: 1;
  margin: 0;
  padding: 0;
  font-size: 12px;
  line-height: 1;
}

.studio-mail-flat-input.is-subject {
  font-weight: 500;
}

.studio-mail-flat-input::placeholder {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-mail-compose-cc {
  color: var(--color-cursor-muted, var(--mos-muted));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  flex-shrink: 0;
  padding: 0;
  font-size: 12px;
  line-height: 1;
}

.studio-mail-compose-cc:hover {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-mail-compose-toolbar {
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border, var(--color-cursor-border-soft));
  box-sizing: border-box;
  flex-shrink: 0;
  align-items: center;
  gap: 2px;
  padding: 0 8px;
  display: flex;
}

.studio-mail-compose-tool {
  border-radius: var(--cursor-radius-sm, 6px);
  width: 24px;
  height: 24px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  line-height: 1;
  display: inline-flex;
}

.studio-mail-compose-tool:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover));
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-mail-compose-tool:disabled {
  opacity: .5;
  cursor: default;
}

.studio-mail-compose-rule {
  background: var(--color-cursor-border, var(--color-cursor-border-soft));
  width: 1px;
  height: 16px;
  margin: 0 4px;
}

.studio-mail-compose-editor {
  min-height: 0;
  color: var(--color-cursor-text, var(--mos-text));
  outline: none;
  flex: auto;
  padding: 8px 12px;
  font-size: 13px;
  line-height: 1.5;
  overflow: auto;
}

.studio-mail-compose-editor:empty:before {
  content: attr(data-placeholder);
  color: var(--color-cursor-muted, var(--mos-muted));
  pointer-events: none;
}

.studio-mail-compose-editor a {
  color: var(--mos-accent, var(--cursor-accent));
  text-decoration: underline;
}

.studio-mail-compose-editor blockquote {
  border-left: 2px solid var(--color-cursor-border, var(--color-cursor-border-soft));
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: .5em 0;
  padding-left: .75em;
}

.studio-mail-compose-editor ul, .studio-mail-compose-editor ol {
  padding-left: 1.5em;
}

.studio-mail-compose-editor ul {
  list-style: outside;
}

.studio-mail-compose-editor ol {
  list-style: decimal;
}

.studio-mail-compose-attachments {
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-top: 1px solid var(--color-cursor-border, var(--color-cursor-border-soft));
  scrollbar-width: none;
  flex-shrink: 0;
  align-items: stretch;
  display: flex;
  overflow-x: auto;
}

.studio-mail-compose-attachments::-webkit-scrollbar {
  display: none;
}

.studio-mail-attach-item {
  border-right: 1px solid var(--color-cursor-border, var(--color-cursor-border-soft));
  color: var(--color-cursor-text, var(--mos-text));
  white-space: nowrap;
  flex-shrink: 0;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  font-size: 12px;
  line-height: 1;
  display: inline-flex;
}

.studio-mail-attach-item span {
  text-overflow: ellipsis;
  max-width: 14rem;
  overflow: hidden;
}

.studio-mail-attach-remove {
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-mail-attach-remove:hover {
  color: var(--cursor-danger, #ef4444);
}

.studio-mail-attach-add {
  border: 0;
  border-left: 1px solid var(--color-cursor-border, var(--color-cursor-border-soft));
  background: var(--mos-plate, var(--color-cursor-sidebar));
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  flex-shrink: 0;
  align-items: center;
  gap: 5px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  display: inline-flex;
}

.studio-mail-attach-add:hover {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-mail-attach-error {
  color: var(--cursor-danger, #ef4444);
  flex-shrink: 0;
  align-items: center;
  padding: 0 10px;
  font-size: 11px;
  display: inline-flex;
}

.studio-mail-reader {
  box-sizing: border-box;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  min-height: 0;
  padding: 12px 10px 16px;
  display: flex;
}

.studio-polish.is-studio-mobile .studio-mail-pane.is-reading .cursor-panel-head {
  flex-wrap: nowrap;
  overflow-x: auto;
}

.studio-polish .studio-mail-pane.is-reading .cursor-panel-head .studio-chrome-btn, .studio-polish .studio-mail-pane.is-reading .cursor-panel-head .studio-chrome-btn.is-compact {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  height: 36px !important;
  min-height: 36px !important;
  color: var(--color-cursor-text, var(--mos-text)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  padding: 0 12px !important;
}

[data-appearance="light"] .studio-polish .studio-mail-pane.is-reading .cursor-panel-head .studio-chrome-btn {
  background: #fff !important;
}

.studio-polish.is-studio-mobile .studio-mail-pane.is-reading .studio-mail-body {
  padding-top: calc(var(--studio-mobile-head-clear, 56px) + 44px);
}

.studio-polish.is-studio-mobile .studio-mail-pane.is-reading .cursor-panel-head > button:not(.cursor-icon-btn), .studio-polish.is-studio-mobile .studio-mail-pane.is-reading .cursor-panel-head > button:not(.cursor-icon-btn):hover, .studio-polish.is-studio-mobile .studio-mail-pane.is-reading .cursor-panel-head > button:not(.cursor-icon-btn):active {
  flex: 0 0 36px;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  display: inline-flex;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  padding: 0 !important;
}

.studio-mail-reader-subject {
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  min-width: 0;
  height: 36px;
  color: var(--mos-text);
  border-radius: 999px;
  flex: auto;
  align-items: center;
  margin: 0;
  padding: 0 14px;
  font-size: 14px;
  font-weight: 650;
  line-height: 1;
  display: flex;
  overflow: hidden;
}

[data-appearance="light"] .studio-mail-reader-subject, [data-appearance="light"] .studio-mail-reader-actions {
  background: #fff;
}

.studio-mail-reader-actions {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--color-cursor-panel));
  box-sizing: border-box;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 2px;
  height: 36px;
  margin-left: auto;
  padding: 2px;
  display: flex;
}

.studio-mail-pane.is-reading .studio-mail-reader-actions .cursor-icon-btn, .studio-mail-pane.is-reading .studio-mail-reader-actions .cursor-icon-btn:hover, .studio-mail-pane.is-reading .studio-mail-reader-actions .cursor-icon-btn:active {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.studio-mail-pane.is-reading .studio-mail-reader-actions .cursor-icon-btn:hover, .studio-mail-pane.is-reading .studio-mail-reader-actions .cursor-icon-btn:active {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, var(--mos-page, #fff)) !important;
  border-radius: 999px !important;
}

.studio-mail-reader-meta {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: 12px;
}

.studio-mail-message.is-card {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, var(--color-cursor-panel));
  border-radius: 18px;
  flex-direction: column;
  flex: none;
  min-width: 0;
  display: flex;
  overflow: hidden;
}

[data-appearance="light"] .studio-mail-message.is-card {
  background: #fff;
}

.studio-mail-row.studio-mail-message-head, .studio-mail-row.studio-mail-message-head:hover, .studio-mail-row.studio-mail-message-head:active {
  background: none;
  border: 0;
  border-radius: 0;
  padding: 10px 12px;
}

.studio-mail-row.studio-mail-message-head:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent) 55%, transparent);
  outline-offset: -2px;
}

.studio-mail-row.studio-mail-message-head.is-static {
  cursor: default;
}

.studio-mail-message-body {
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  padding: 0 12px 12px;
  display: flex;
}

.studio-mail-message-body .studio-mail-html-frame {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: 12px;
  display: block;
}

.studio-mail-text-body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  min-width: 0;
  font: inherit;
  color: var(--mos-text);
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}

.studio-mail-message-error {
  color: var(--cursor-danger, #ef4444);
  margin: 0;
  font-size: 12px;
}

.studio-mail-message-attachments {
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-mail-message-attachments li {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  min-width: 0;
  max-width: 100%;
  height: 30px;
  color: var(--mos-text);
  box-sizing: border-box;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 0 10px;
  font-size: 12px;
  display: inline-flex;
}

.studio-mail-message-attachments li span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-mail-message-attachments li small {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  flex: none;
  font-size: 11px;
}

.studio-mail-html-frame {
  box-sizing: border-box;
  background: #fff;
  border: 0;
  width: 100%;
  max-width: 100%;
  min-height: 60px;
  max-height: none;
  overflow: hidden;
}

.studio-polish.is-studio-mobile .studio-mail-reader {
  padding: 10px 8px 16px;
}

.studio-polish.is-studio-mobile .studio-mail-message-body {
  padding: 0 8px 8px;
}

.studio-polish.is-studio-mobile .studio-mail-row.studio-mail-message-head {
  padding: 8px 10px;
}

.studio-mail-claim {
  flex-direction: column;
  gap: 10px;
  max-width: 420px;
  padding: 16px;
  display: flex;
}

@media (max-width: 720px) {
  .studio-mail-head-search {
    max-width: none;
  }
}

.studio-mail-pane, .studio-mail-pane * {
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
}

.studio-polish:has(.studio-pane-keepalive-slot.is-active[data-tab="mail"]) :is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-chrome-rail-body, .cursor-explorer-body) {
  scrollbar-width: none !important;
  scrollbar-color: transparent transparent !important;
}

.studio-mail-pane::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-mail-pane ::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-mail-pane ::-webkit-scrollbar-thumb {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-polish:has(.studio-pane-keepalive-slot.is-active[data-tab="mail"]) :is(.studio-files-nav-scroll, .studio-dm-sidebar-body, .studio-history-list, .studio-chrome-rail-body, .cursor-explorer-body)::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-mail-message.is-card, .studio-mail-message-body, .studio-mail-text-body {
  max-height: none;
}

.studio-mail-reader {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, #fff);
  border-radius: 20px;
  flex: none;
  margin: 8px 8px 12px;
}

.studio-mail-list:not(.is-empty) {
  background: none;
  border: 0;
  border-radius: 0;
  flex: none;
  gap: 10px;
  padding: 0 8px 12px;
}

[data-appearance="light"] .studio-mail-reader {
  background: #fff;
}

.studio-polish.is-studio-mobile .studio-mail-body:not(.is-compose) {
  padding-bottom: calc(max(8px, env(safe-area-inset-bottom, 0px)) + var(--studio-mobile-nav-height, 44px) + 12px);
}

.studio-polish.is-studio-mobile .studio-mail-reader {
  margin: 4px 8px 8px;
}

.studio-mail-list > .studio-mail-row {
  content-visibility: auto;
  contain-intrinsic-size: auto 60px;
}

.studio-polish .studio-mail-pane {
  --studio-mail-plate: color-mix(in srgb, var(--mos-text, #eee) 7%, var(--mos-page, #111));
}

[data-appearance="light"] .studio-polish .studio-mail-pane {
  --studio-mail-plate: color-mix(in srgb, var(--mos-text, #202020) 5%, var(--mos-page, #fcfcfc));
}

.studio-polish .studio-mail-pane :is(.cursor-select-menu.studio-mail-folder-select, .cursor-select-menu.studio-mail-mailbox-select, .studio-mail-head-search, .studio-mail-head-field, .studio-mail-reader), .studio-polish .studio-mail-pane .cursor-panel-head .cursor-icon-btn, [data-appearance="light"] .studio-polish .studio-mail-pane :is(.cursor-select-menu.studio-mail-folder-select, .cursor-select-menu.studio-mail-mailbox-select, .studio-mail-head-search, .studio-mail-head-field, .studio-mail-reader), [data-appearance="light"] .studio-polish .studio-mail-pane .cursor-panel-head .cursor-icon-btn {
  background: var(--studio-mail-plate) !important;
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
}

.studio-polish .studio-mail-pane :is(.studio-mail-folder-select, .studio-mail-mailbox-select) .cursor-select-trigger {
  background: none !important;
}

/* [project]/src/studio/components/studio-meet.css [app-client] (css) */
.studio-meet-page {
  background: var(--mos-page);
  min-height: 100dvh;
  color: var(--mos-text, #1a1a22);
  font-family: var(--font-geist-sans), var(--font-cursor), system-ui, sans-serif;
  letter-spacing: -.01em;
  -webkit-font-smoothing: antialiased;
  font-size: 13px;
  font-weight: 500;
}

.studio-meet-lobby {
  box-sizing: border-box;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
  align-items: center;
  gap: 16px;
  min-height: 100dvh;
  max-height: 100dvh;
  padding: 16px;
  display: grid;
  overflow: hidden;
}

.studio-meet-preview-col {
  justify-content: center;
  align-self: stretch;
  align-items: center;
  min-width: 0;
  height: 100%;
  min-height: 0;
  max-height: calc(100dvh - 32px);
  display: flex;
  overflow: hidden;
}

.studio-meet-preview-wrap {
  --meet-preview-w: 16;
  --meet-preview-h: 9;
  aspect-ratio: var(--meet-preview-w) / var(--meet-preview-h);
  min-width: 0;
  min-height: 0;
  width: min(100%, calc((100dvh - 32px) * var(--meet-preview-w) / var(--meet-preview-h)));
  background: #111;
  border-radius: 16px;
  flex: 0 auto;
  max-width: 100%;
  height: auto;
  max-height: calc(100dvh - 32px);
  position: relative;
  overflow: hidden;
}

.studio-meet-preview {
  object-fit: cover;
  background: #111;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0;
}

.studio-meet-preview-empty {
  color: #ffffffd1;
  pointer-events: none;
  background: #111;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  display: flex;
  position: absolute;
  inset: 0;
}

.studio-meet-preview-empty svg {
  width: 36px;
  height: 36px;
}

.studio-meet-preview-empty span {
  letter-spacing: -.01em;
  font-size: 13px;
  font-weight: 600;
}

.studio-meet-preview-controls {
  background: linear-gradient(to top, #0000008c 0%, #0000 100%);
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 12px 12px 14px;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.studio-meet-preview-controls .studio-dm-call-btn {
  min-width: 44px;
  min-height: 44px;
}

.studio-meet-sheet {
  justify-content: center;
  align-self: center;
  align-items: center;
  min-width: 0;
  display: flex;
}

.studio-meet-page .studio-auth-card {
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 68%, transparent);
  background: linear-gradient(180deg, #ffffffc7, #ffffff38),
    var(--mos-plate);
  border-radius: 28px;
  width: 100%;
  max-width: 340px;
  padding: 28px 24px;
  position: relative;
  box-shadow: inset 0 1px #ffffffe0, 0 1px 2px #0f172a0a, 0 18px 42px #0f172a17;
}

.studio-meet-brand-wrap {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.studio-meet-brand {
  color: inherit;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: inline-flex;
}

.studio-meet-brand img {
  display: block;
}

.studio-meet-card-head {
  margin-top: 12px;
}

.studio-meet-page .studio-meet-subtitle {
  margin-top: 8px;
}

.studio-meet-page .studio-auth-title {
  color: var(--mos-text);
  letter-spacing: -.03em;
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.15;
}

.studio-meet-page .studio-auth-form {
  text-align: center;
  gap: 12px;
  margin-top: 1.35rem;
  display: grid;
}

.studio-meet-page .studio-auth-form label {
  width: 100%;
  display: block;
}

.studio-meet-page .studio-auth-accent-text {
  color: #1c1c1e6b;
  pointer-events: none;
  flex: none;
  width: 14px;
  height: 14px;
  display: block;
  position: absolute;
  left: 18px;
}

.studio-meet-page .studio-auth-field {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 86%, transparent);
  background: #fff;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  padding: 0 36px;
  transition: border-color .14s, background .14s, box-shadow .14s;
  display: flex;
  position: relative;
  box-shadow: 0 1px 2px #0f172a08;
}

.studio-meet-page .studio-auth-field.is-code {
  letter-spacing: .28em;
  text-align: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 18px;
  font-size: 1.15rem;
  font-weight: 700;
}

.studio-meet-page .studio-auth-field.is-code.is-email-otp {
  letter-spacing: .28em;
  background: #fff;
  border-radius: 18px;
  width: 100%;
  min-height: 52px;
  font-size: 1.25rem;
  font-weight: 700;
  box-shadow: inset 0 1px #ffffffe6, 0 1px 2px #0f172a0a;
}

.studio-meet-page .studio-auth-otp-stack {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  display: flex;
}

.studio-meet-page .studio-auth-otp-paste {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 86%, transparent);
  color: #636366;
  letter-spacing: -.01em;
  cursor: pointer;
  background: #fff;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 40px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
  box-shadow: 0 1px 2px #0f172a08;
}

.studio-meet-page .studio-auth-otp-paste:hover {
  color: #1c1c1e;
  background: #f6f6f6;
  border-color: #1c1c1e38;
}

.studio-meet-page .studio-auth-field:focus, .studio-meet-page .studio-auth-field:focus-within {
  background: #fff;
  border-color: #1c1c1e47;
  outline: none;
  box-shadow: 0 0 0 2px #1c1c1e1f;
}

.studio-meet-page .studio-auth-field input, .studio-meet-page input.studio-auth-field:not(.is-code) {
  width: 100%;
  min-width: 0;
  height: 18px;
  color: inherit;
  text-align: center;
  caret-color: #0000;
  background: none;
  border: 0;
  outline: none;
  flex: auto;
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 18px;
}

.studio-meet-page input.studio-auth-field.is-code {
  height: auto;
  color: var(--mos-text);
  font-family: inherit;
}

.studio-meet-page .studio-auth-field input::placeholder, .studio-meet-page input.studio-auth-field::placeholder {
  color: color-mix(in srgb, var(--mos-text) 38%, transparent);
  font-size: 14px;
  font-weight: 450;
  line-height: 18px;
}

.studio-meet-page .studio-auth-field input:-webkit-autofill {
  caret-color: #0000;
  -webkit-text-fill-color: #1c1c1e !important;
  background-color: #fff !important;
  box-shadow: inset 0 0 0 1000px #fff !important;
}

.studio-meet-page .studio-auth-field input:-webkit-autofill:hover {
  caret-color: #0000;
  -webkit-text-fill-color: #1c1c1e !important;
  background-color: #fff !important;
  box-shadow: inset 0 0 0 1000px #fff !important;
}

.studio-meet-page .studio-auth-field input:-webkit-autofill:focus {
  caret-color: #0000;
  -webkit-text-fill-color: #1c1c1e !important;
  background-color: #fff !important;
  box-shadow: inset 0 0 0 1000px #fff !important;
}

.studio-meet-page input.studio-auth-field:-webkit-autofill {
  caret-color: #0000;
  -webkit-text-fill-color: #1c1c1e !important;
  background-color: #fff !important;
  box-shadow: inset 0 0 0 1000px #fff !important;
}

.studio-meet-page .studio-auth-primary {
  color: #f5f5f7;
  letter-spacing: -.01em;
  cursor: pointer;
  background: #1c1c1e;
  border: 1px solid #0000;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
  padding: 0 18px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 650;
  transition: background .14s, transform .12s;
  display: inline-flex;
}

.studio-meet-page .studio-auth-primary:hover:not(:disabled) {
  background: #363638;
}

.studio-meet-page .studio-auth-primary:active:not(:disabled) {
  transform: translateY(1px)scale(.99);
}

.studio-meet-page .studio-auth-primary:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px #f5f5f7, 0 0 0 4px #1c1c1e59;
}

.studio-meet-page .studio-auth-primary:disabled {
  cursor: not-allowed;
  color: #ceced1;
  background: #87878b;
  transform: none;
}

.studio-meet-join-arrow, .studio-meet-join-spin {
  width: 16px;
  height: 16px;
}

.studio-meet-join-spin {
  animation: .8s linear infinite studio-meet-spin;
}

@keyframes studio-meet-spin {
  to {
    transform: rotate(360deg);
  }
}

.studio-meet-page .studio-auth-copy {
  color: color-mix(in srgb, var(--mos-text) 55%, transparent);
  text-align: center;
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-meet-page .studio-auth-copy strong {
  color: var(--mos-text);
  font-weight: 650;
}

.studio-meet-page .studio-auth-link {
  color: color-mix(in srgb, var(--mos-text) 55%, transparent);
  cursor: pointer;
  background: none;
  border: 0;
  font-size: 12px;
  font-weight: 600;
}

.studio-meet-text-btn {
  text-align: center;
  width: 100%;
  min-height: 32px;
  text-decoration: none;
}

.studio-meet-page .studio-auth-link:hover:not(:disabled) {
  text-underline-offset: 4px;
  text-decoration: underline;
}

.studio-meet-page .studio-auth-error-box {
  border: 1px solid color-mix(in srgb, var(--mos-danger, #b91c1c) 22%, transparent);
  background: color-mix(in srgb, var(--mos-danger, #fecaca) 28%, var(--mos-plate));
  color: var(--mos-danger, #991b1b);
  text-align: left;
  border-radius: 10px;
  margin: 12px 0 0;
  padding: 10px 12px;
  font-size: 12px;
  line-height: 1.35;
}

.studio-meet-copy {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 2rem;
  display: flex;
}

.studio-meet-copy p {
  margin: 0;
}

.studio-meet-page:has(.studio-meet-incall) {
  height: 100dvh;
  overflow: hidden;
}

.studio-meet-incall {
  z-index: 200000;
  grid-template-columns: minmax(0, 1fr) clamp(300px, 24vw, 360px);
  grid-template-rows: var(--cursor-head-h, 36px)
    minmax(0, 1fr)
    64px;
  background: var(--mos-page);
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  transition: grid-template-columns .35s, grid-template-rows .35s;
  display: grid;
  position: fixed;
  inset: 0;
  overflow: hidden;
}

.studio-meet-incall.is-split {
  grid-template-rows: none;
  grid-template-columns: none;
  transition: none;
  display: flex;
}

.studio-meet-incall-panels {
  flex: auto;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
}

.studio-meet-incall-stage-panel, .studio-meet-incall-chat-panel {
  min-height: 0;
}

.studio-meet-incall-panels > [data-panel-id="studio-meet-incall-chat"] {
  min-width: min(260px, 40vw);
}

.studio-meet-incall-stage {
  flex-direction: column;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-meet-incall.is-split .studio-meet-incall-head.cursor-panel-head, .studio-meet-incall.is-split .studio-meet-incall-video, .studio-meet-incall.is-split .studio-meet-incall-bar, .studio-meet-incall.is-split .studio-meet-incall-chat {
  grid-area: auto;
}

.studio-meet-incall.is-split .studio-meet-incall-video {
  flex: auto;
  min-height: 0;
}

.studio-meet-incall.is-split .studio-meet-incall-chat {
  border-left: 1px solid var(--color-cursor-border-soft);
  width: 100%;
  height: 100%;
}

.studio-meet-incall.is-split.is-full .studio-meet-incall-head.cursor-panel-head, .studio-meet-incall.is-split.is-full .studio-meet-incall-bar {
  pointer-events: none;
  border: 0;
  height: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.studio-meet-incall.is-full {
  grid-template-rows: 0 minmax(0, 1fr) 0;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0fr);
}

.studio-meet-incall.is-full .studio-meet-incall-head.cursor-panel-head, .studio-meet-incall.is-full .studio-meet-incall-bar {
  pointer-events: none;
  border: 0;
  height: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
}

.studio-meet-incall-head.cursor-panel-head {
  background: var(--mos-plate);
  grid-area: 1 / 1;
}

.studio-meet-incall-head .cursor-panel-head-title {
  flex: auto;
  min-width: 0;
}

.studio-meet-incall-title {
  align-items: center;
  gap: 8px;
  min-width: 0;
  font-size: 13px;
  font-weight: 650;
  display: flex;
}

.studio-meet-incall-title > span:first-child {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-meet-incall-title .studio-dm-call-rec-pill {
  margin: 0;
}

.studio-meet-incall-status {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: 12px;
  font-weight: 600;
}

.studio-meet-open-studio-btn {
  height: 24px;
  color: var(--mos-text);
  font: inherit;
  white-space: nowrap;
  background: none;
  border: 0;
  border-radius: 999px;
  align-items: center;
  gap: 5px;
  padding: 0 7px 0 2px;
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
  display: inline-flex;
}

.studio-meet-open-studio-btn:hover {
  background: var(--mos-hover);
}

.studio-meet-open-studio-mark {
  background: var(--mos-plate-strong);
  border-radius: 999px;
  flex: 0 0 20px;
  place-items: center;
  width: 20px;
  height: 20px;
  display: grid;
  overflow: hidden;
}

.studio-meet-open-studio-mark > * {
  display: block;
}

.studio-meet-incall-head .cursor-icon-btn[aria-pressed="true"] {
  background: var(--mos-plate-strong);
  color: var(--mos-text);
}

.studio-meet-incall-video {
  box-sizing: border-box;
  background: var(--mos-page);
  grid-area: 2 / 1;
  min-width: 0;
  min-height: 0;
  padding: 8px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-meet-incall.is-full .studio-meet-incall-video {
  padding: 0;
}

.studio-meet-incall-video .studio-dm-call-stage-wrap {
  border-radius: 12px;
  flex: 1;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.studio-meet-incall.is-open .studio-meet-incall-video .studio-dm-call-stage-wrap.is-stage-only {
  background: var(--mos-page);
}

.studio-meet-incall.is-full .studio-meet-incall-video .studio-dm-call-stage-wrap {
  border-radius: 0;
}

.studio-meet-incall-connecting {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
}

.studio-meet-incall-connecting-error {
  max-width: 28rem;
  color: var(--mos-text);
  text-align: center;
  margin: 0;
  padding: 0 16px;
  font-size: 13px;
  font-weight: 600;
}

.studio-meet-incall-connecting-leave {
  background: var(--mos-plate-strong);
  height: 32px;
  color: var(--mos-text);
  font: inherit;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 650;
}

.studio-meet-incall-connecting-leave:hover {
  background: var(--mos-hover);
}

.studio-meet-incall-overlay {
  z-index: 2;
  padding: 12px 12px max(14px, env(safe-area-inset-bottom));
  background: linear-gradient(to top, #0000008c 0%, #0000 100%);
  justify-content: center;
  align-items: center;
  gap: 10px;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.studio-meet-incall-overlay .studio-dm-call-btn {
  min-width: 44px;
  min-height: 44px;
}

.studio-meet-incall-chat {
  z-index: 1;
  border-left: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate);
  --studio-chrome-divider: var(--color-cursor-border-soft);
  --studio-composer-glass: color-mix(in srgb,
    var(--mos-plate) 72%,
    #fff 28%);
  --studio-composer-glass-strong: #ffffffe0;
  --studio-composer-glass-muted: color-mix(in srgb,
    var(--mos-plate) 55%,
    #fff 45%);
  --studio-composer-glass-border: var(--color-cursor-border-soft, var(--mos-border-soft));
  --studio-composer-glass-blur: saturate(170%) blur(18px);
  --studio-composer-glass-shadow: 0 1px 1px color-mix(in srgb, var(--mos-text) 10%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright, var(--mos-text)) 12%, transparent);
  --studio-composer-input-shadow: 0 1px 1px color-mix(in srgb, var(--mos-text) 8%, transparent);
  --studio-composer-shell-max: 100%;
  --studio-chat-column-max: 100%;
  --studio-chat-bubble-max: 90%;
  --studio-composer-min-height: 118px;
  flex-direction: column;
  grid-area: 1 / 2 / 4;
  min-width: 0;
  min-height: 0;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-meet-incall.is-full .studio-meet-incall-chat {
  visibility: hidden;
  pointer-events: none;
  border: 0;
}

.studio-meet-incall-chat > .studio-dm-pane, .studio-meet-incall-chat .studio-dm-chat-column {
  background: none;
  flex: auto;
  min-width: 0;
  min-height: 0;
}

.studio-meet-incall-chat {
  --studio-dm-chrome-circle: 22px;
  --studio-dm-chrome-glyph: 12px;
}

.studio-meet-incall-chat .studio-dm-composer.is-split {
  padding-inline: 10px;
  max-width: 100%;
  padding-bottom: 10px;
}

.studio-meet-incall-chat .studio-dm-composer.is-split .studio-dm-composer-row.is-extras {
  flex-wrap: nowrap;
  min-width: 0;
}

.studio-meet-incall-chat .studio-dm-chat-head .studio-profile-avatar {
  width: 22px !important;
  min-width: 22px !important;
  max-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  font-size: 9px !important;
}

.studio-meet-incall-bar {
  z-index: 6;
  box-sizing: border-box;
  background: var(--mos-page);
  pointer-events: auto;
  border: 0;
  grid-area: 3 / 1;
  justify-content: center;
  align-items: center;
  gap: 7px;
  width: 100%;
  height: 64px;
  min-height: 64px;
  padding: 8px 12px;
  display: flex;
  position: relative;
  overflow: visible;
}

.studio-meet-incall-bar .studio-dm-call-btn {
  width: 48px;
  min-width: 48px;
  height: 48px;
  min-height: 48px;
}

.studio-meet-incall-bar .studio-dm-call-btn svg {
  width: 18px;
  height: 18px;
}

.studio-meet-incall-bar .studio-dm-call-btn.is-record-control svg {
  width: 14px;
  height: 14px;
}

.studio-meet-incall-bar .studio-dm-call-btn.is-decline, .studio-meet-incall-bar .studio-dm-call-btn.is-decline:hover:not(:disabled) {
  background: var(--mos-danger, #dc2626);
  color: var(--cursor-on-accent);
}

@media (max-width: 899px) {
  .studio-meet-incall, .studio-meet-incall.is-full {
    grid-template-columns: minmax(0, 1fr);
  }

  .studio-meet-incall.is-full {
    grid-template-rows: 0 minmax(0, 1fr) 0;
  }

  .studio-meet-incall-head, .studio-meet-incall-video, .studio-meet-incall-bar {
    grid-column: 1;
  }

  .studio-meet-incall-chat {
    border: 0;
    grid-area: 2 / 1;
  }

  .studio-meet-incall.is-open .studio-meet-incall-chat, .studio-meet-incall.is-chat .studio-meet-incall-video {
    display: none;
  }

  .studio-meet-incall.is-chat .studio-meet-incall-chat {
    visibility: visible;
    border: 0;
    display: flex;
  }
}

@media (max-width: 720px) {
  .studio-meet-lobby {
    min-height: 100dvh;
    max-height: none;
    padding: 12px;
    padding-bottom: max(16px, env(safe-area-inset-bottom));
    grid-template-columns: 1fr;
    align-items: start;
  }

  .studio-meet-preview-col {
    height: auto;
    max-height: 42vh;
    overflow: hidden;
  }

  .studio-meet-preview-wrap {
    width: min(100%, calc(42vh * var(--meet-preview-w) / var(--meet-preview-h)));
    max-height: 42vh;
  }
}

/* [project]/src/studio/components/studio-messages.css [app-client] (css) */
.studio-dm-pane, .studio-dm-sidebar {
  --studio-dm-chrome-circle: 36px;
  --studio-dm-chrome-glyph: 15px;
  --studio-dm-edge: 8px;
}

.studio-dm-sidebar:before, .studio-dm-chat-column:before, .studio-dm-chat-column:after {
  content: "";
  z-index: calc(var(--studio-z-base) + 3);
  pointer-events: none;
  height: 72px;
  position: absolute;
  left: 0;
  right: 0;
}

.studio-dm-sidebar:before, .studio-dm-chat-column:before {
  background: linear-gradient(to bottom,
    color-mix(in srgb, var(--mos-page, #fff) 72%, transparent) 0%,
    color-mix(in srgb, var(--mos-page, #fff) 28%, transparent) 58%,
    transparent 100%);
  top: 0;
}

.studio-dm-chat-column:after {
  background: linear-gradient(to top,
    color-mix(in srgb, var(--mos-page, #fff) 72%, transparent) 0%,
    color-mix(in srgb, var(--mos-page, #fff) 28%, transparent) 58%,
    transparent 100%);
  bottom: 0;
}

.studio-dm-sidebar {
  flex-direction: column;
  flex: auto;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  position: relative;
  overflow: hidden;
}

html[data-studio-layout-borders="off"] .studio-polish:not(.is-studio-mobile) aside.studio-main-rail .studio-rail-card, .studio-polish:not(.is-studio-mobile) aside.studio-main-rail .studio-rail-card {
  box-sizing: border-box;
  border-radius: 18px;
  flex-direction: column;
  flex: auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
  padding: 0;
  display: flex;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent) !important;
  border-left: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent) !important;
  border-right: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent) !important;
  border-color: color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent) !important;
  background: var(--mos-page, var(--mos-bg)) !important;
  box-shadow: none !important;
}

.studio-polish:not(.is-studio-mobile) aside.studio-main-rail {
  padding: 4px;
  overflow: hidden;
  background: none !important;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-slot {
  flex-direction: column;
  flex: auto;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-slot.is-hidden {
  display: none;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-sidebar, .studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-pane {
  background: none !important;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .cursor-panel-search {
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  margin: 0;
  padding: 0 14px;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .cursor-panel-search-end {
  gap: 4px;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .cursor-panel-search-end .cursor-icon-btn, .studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-sidebar-tools .cursor-icon-btn {
  box-sizing: border-box;
  width: 36px;
  min-width: 36px;
  max-width: 36px;
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-search-filter-trigger {
  width: auto;
  min-width: 36px;
  max-width: 7.5rem;
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  border-radius: 999px !important;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .cursor-panel-search-end .cursor-icon-btn:hover, .studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-search-filter-trigger:hover, .studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-search-filter-trigger.is-open, .studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .cursor-panel-search-end .cursor-icon-btn.is-on {
  border-color: var(--color-cursor-border, var(--mos-border)) !important;
  background: var(--mos-hover, var(--color-cursor-hover)) !important;
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-chat-head, .studio-dm-chat-head {
  z-index: calc(var(--studio-z-base) + 6);
  pointer-events: none;
  border-radius: 0;
  align-items: center;
  gap: 6px;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 8px;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  box-shadow: none !important;
  background: none !important;
  border: none !important;
}

.studio-dm-chat-head > * {
  pointer-events: auto;
}

.studio-polish.is-studio-mobile .studio-dm-chat-head {
  border-radius: 0;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  padding: 8px;
  box-shadow: none !important;
  background: none !important;
  border: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-chrome {
  height: auto;
  min-height: 0;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar .cursor-panel-search {
  flex: auto;
  padding: 0 14px;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  border-radius: 999px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  margin: 0 !important;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar .cursor-panel-search-end {
  gap: 4px;
  padding-left: 6px;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar .cursor-panel-search-end .cursor-icon-btn, .studio-polish.is-studio-mobile .studio-dm-sidebar .cursor-panel-search-end .studio-composer-circle-btn, .studio-polish.is-studio-mobile .studio-dm-sidebar .studio-dm-search-filter-trigger, .studio-polish.is-studio-mobile .studio-dm-sidebar-tools .cursor-icon-btn, .studio-polish.is-studio-mobile .studio-dm-sidebar-tools .studio-dm-search-filter-trigger {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar .studio-dm-search-filter-trigger {
  width: auto !important;
  max-width: 7.5rem !important;
  padding: 0 12px !important;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-tools .studio-file-add-wrap {
  min-width: 0;
  min-height: 0;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar {
  overflow: clip;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-chrome, .studio-polish.is-studio-mobile .studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-chat-head {
  top: calc(max(8px, env(safe-area-inset-top, 0px)) + 44px);
  padding-top: 4px;
  padding-bottom: 4px;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-body {
  padding-top: calc(max(8px, env(safe-area-inset-top, 0px)) + 44px + 44px);
  padding-bottom: calc(max(8px, env(safe-area-inset-bottom, 0px)) + var(--studio-mobile-nav-height, 44px) + 10px);
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

.studio-polish:not(.is-studio-mobile) .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap, .studio-polish:not(.is-studio-mobile) .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap.has-agent-avatar, .studio-polish:not(.is-studio-mobile) .studio-dm-chat-head .studio-profile-avatar, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap.has-agent-avatar, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-profile-avatar {
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
}

.studio-polish:not(.is-studio-mobile) .studio-dm-chat-head .studio-agent-avatar, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-agent-avatar {
  --studio-agent-avatar-size: 28px;
}

.studio-polish:not(.is-studio-mobile) .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap.has-agent-avatar {
  place-items: center;
  display: grid;
  overflow: hidden;
}

.studio-polish.is-studio-mobile .studio-dm-chat-head .studio-dm-chat-peer {
  align-self: center;
  height: 36px;
}

.studio-polish.is-studio-mobile .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-dm-chat-peer-avatar-wrap.has-agent-avatar, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-profile-avatar {
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-chat-head .studio-dm-back, .studio-polish.is-studio-mobile .studio-dm-chat-head .studio-dm-back {
  border-radius: 999px !important;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card .studio-dm-composer.is-split {
  padding-inline: 6px;
  padding-bottom: 6px;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card :is(.studio-dm-sidebar-body, .studio-dm-conversations, .studio-dm-scroll) {
  scrollbar-width: none !important;
}

.studio-polish:not(.is-studio-mobile) aside.is-dm-rail .studio-dm-rail-card :is(.studio-dm-sidebar-body, .studio-dm-conversations, .studio-dm-scroll)::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

.studio-dm-pane {
  --studio-chat-bubble-max: 100%;
  background: var(--mos-page, var(--mos-bg));
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text, var(--mos-text));
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  flex-direction: column;
  display: flex;
  position: relative;
}

[data-appearance="light"] .studio-dm-pane {
  background: var(--mos-panel);
}

.studio-polish.is-studio-mobile .studio-dm-pane, .studio-polish.is-studio-mobile .studio-dm-sidebar {
  --studio-dm-chrome-circle: 36px;
  --studio-dm-chrome-glyph: 15px;
}

.studio-dm-pane.is-inbox {
  background: var(--mos-page, var(--mos-bg));
  overflow: clip;
}

[data-appearance="light"] .studio-dm-pane.is-inbox {
  background: var(--mos-panel);
}

.studio-dm-pane.is-inbox .studio-dm-sidebar {
  flex: auto;
  min-height: 0;
}

.studio-dm-pane {
  container: chat / inline-size;
}

.studio-dm-pane.is-rail-embedded {
  flex: auto;
  overflow: hidden;
}

@container chat (max-width: 480px) {
  .studio-dm-composer.is-split, .studio-dm-messages {
    max-width: 100%;
    padding-inline: var(--studio-space-rail-x, 8px);
  }
}

.studio-dm-pane.is-rail-embedded .studio-dm-chat-column {
  min-height: 0;
}

.studio-dm-pane.is-rail-embedded .studio-dm-scroll {
  --studio-dm-scroll-pad-top: 0;
}

.studio-dm-composer-dock {
  background: none;
  flex-direction: column;
  flex: none;
  align-items: stretch;
  display: flex;
}

.studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-chat-column {
  position: relative;
  overflow: clip;
}

.studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-chat-head {
  z-index: 6;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-composer-dock {
  z-index: 5;
  pointer-events: none;
  background: none;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-composer-dock > * {
  pointer-events: auto;
}

.studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-scroll-wrap {
  margin-top: 0;
  margin-bottom: 0;
  overflow: clip;
}

.studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-scroll {
  --studio-dm-scroll-pad-top: var(--studio-dm-head-clear, 64px);
  padding-top: var(--studio-dm-head-clear, 64px);
  padding-bottom: var(--studio-dm-composer-gap, 48px);
  scroll-padding-top: 0;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has(.studio-pane-keepalive-slot.is-active[data-tab="messages"]) {
  padding-top: 0;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column .studio-dm-pane:not(.is-inbox):not(.is-in-call):not(.is-rail-embedded) .studio-dm-chat-head {
  top: var(--studio-desktop-head-clear, 44px);
  padding-top: 0;
  padding-bottom: 4px;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column .studio-dm-pane:not(.is-inbox):not(.is-in-call):not(.is-rail-embedded) .studio-dm-scroll {
  --studio-dm-scroll-pad-top: calc(var(--studio-dm-head-clear, 64px) + var(--studio-desktop-head-clear, 44px));
  padding-top: calc(var(--studio-dm-head-clear, 64px) + var(--studio-desktop-head-clear, 44px));
}

.studio-polish:not(.is-studio-mobile) .studio-main-column .studio-dm-pane:not(.is-inbox):not(.is-in-call):not(.is-rail-embedded) .studio-dm-messages, .studio-polish:not(.is-studio-mobile) .studio-main-column .studio-dm-pane:not(.is-inbox):not(.is-in-call):not(.is-rail-embedded) .studio-dm-composer.is-split, .studio-polish:not(.is-studio-mobile) .studio-main-column .studio-dm-pane:not(.is-inbox):not(.is-in-call):not(.is-rail-embedded) .studio-dm-error {
  width: 70%;
  max-width: 70%;
  margin-inline: auto;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has(.studio-pane-keepalive-slot.is-active[data-tab="messages"]) aside.studio-dm-peer-sidebar {
  margin-top: var(--studio-desktop-head-clear, 44px);
  height: calc(100% - var(--studio-desktop-head-clear, 44px) - 4px);
}

.studio-dm-message-block:has(.studio-dm-cluster-rail) {
  content-visibility: visible;
  contain: none;
  overflow: visible;
}

.studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-jump-down {
  bottom: calc(var(--studio-dm-composer-gap, 48px) + var(--studio-mobile-nav-clear, 0px));
  z-index: calc(var(--studio-z-base) + 6);
}

.studio-polish.is-studio-mobile .studio-dm-pane, .studio-polish.is-studio-mobile .studio-dm-mobile-stack-thread {
  height: 100%;
  min-height: 0;
  overflow: clip;
}

.studio-dm-pane.is-rail-embedded .studio-dm-composer-box, .studio-polish.is-studio-mobile .studio-dm-composer-box {
  background: var(--mos-page, var(--color-cursor-panel));
  -webkit-backdrop-filter: none;
}

.studio-dm-pane.is-split {
  overflow: hidden;
}

.studio-dm-pane.is-in-call {
  min-height: 0;
}

.studio-dm-incall {
  flex: auto;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-incall-stage-panel, .studio-dm-incall-chat-panel {
  min-height: 0;
}

.studio-dm-incall > [data-panel-id="studio-dm-incall-chat"] {
  min-width: min(260px, 42vw);
}

.studio-dm-incall-stage {
  flex-direction: column;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-dm-incall-video {
  box-sizing: border-box;
  background: var(--mos-page, var(--mos-bg));
  flex: auto;
  min-width: 0;
  min-height: 0;
  padding: 8px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-dm-incall-video .studio-dm-call-stage-wrap {
  border-radius: 12px;
  flex: 1;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.studio-dm-incall-video .studio-dm-call-stage-wrap.is-stage-only, .studio-dm-incall-video .studio-dm-call-stage, .studio-dm-incall-video .studio-dm-call-tile-frame.is-featured, .studio-dm-incall-video .studio-dm-call-tile-frame.is-featured .studio-dm-call-video-off, .studio-dm-incall-video .studio-dm-call-video {
  background: var(--mos-page, var(--mos-bg));
}

[data-appearance="light"] .studio-dm-incall-video .studio-dm-call-stage-wrap.is-stage-only, [data-appearance="light"] .studio-dm-incall-video .studio-dm-call-stage, [data-appearance="light"] .studio-dm-incall-video .studio-dm-call-tile-frame.is-featured, [data-appearance="light"] .studio-dm-incall-video .studio-dm-call-tile-frame.is-featured .studio-dm-call-video-off, [data-appearance="light"] .studio-dm-incall-video .studio-dm-call-video {
  background: var(--mos-panel, var(--mos-page));
}

.studio-dm-incall-bar {
  box-sizing: border-box;
  background: var(--mos-page, var(--mos-bg));
  flex: 0 0 64px;
  justify-content: center;
  align-items: center;
  gap: 7px;
  width: 100%;
  height: 64px;
  min-height: 64px;
  padding: 8px 12px;
  display: flex;
  overflow: visible;
}

[data-appearance="light"] .studio-dm-incall-bar, [data-appearance="light"] .studio-dm-incall-video {
  background: var(--mos-panel, var(--mos-page));
}

.studio-dm-incall-bar .studio-dm-call-btn {
  width: 48px;
  min-width: 48px;
  height: 48px;
  min-height: 48px;
}

.studio-dm-incall-bar .studio-dm-call-btn svg {
  width: 18px;
  height: 18px;
}

.studio-dm-incall-bar .studio-dm-call-btn.is-record-control svg {
  width: 14px;
  height: 14px;
}

.studio-dm-incall-bar .studio-dm-call-btn.is-decline, .studio-dm-incall-bar .studio-dm-call-btn.is-decline:hover:not(:disabled) {
  background: var(--mos-danger, #dc2626);
}

.studio-dm-incall-chat {
  border-left: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  flex-direction: column;
  width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-incall-chat .studio-dm-composer.is-split {
  padding-inline: 10px;
  max-width: 100%;
  padding-bottom: 10px;
}

.studio-dm-incall-chat .studio-dm-bubble.is-video, .studio-dm-incall-chat .studio-dm-bubble.is-image, .studio-meet-incall-chat .studio-dm-bubble.is-video, .studio-meet-incall-chat .studio-dm-bubble.is-image {
  width: 100%;
  max-width: 100%;
}

:is(.studio-dm-incall-chat .studio-dm-bubble-row .studio-dm-bubble-stack:has(.studio-dm-bubble.is-video), .studio-meet-incall-chat .studio-dm-bubble-row .studio-dm-bubble-stack:has(.studio-dm-bubble.is-video)) {
  width: min(100%, 26rem);
  max-width: 100%;
}

.studio-dm-peer-panels {
  flex: auto;
  min-width: 0;
  min-height: 0;
}

.studio-dm-chat-column {
  background: var(--mos-page, var(--mos-bg));
  flex-direction: column;
  min-width: 0;
  max-width: 100%;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

[data-appearance="light"] .studio-dm-chat-column {
  background: var(--mos-panel, var(--mos-page));
}

.studio-agent-handoff {
  z-index: 8;
  background: var(--mos-bg, var(--color-cursor-bg, #05080f));
  flex-direction: column;
  display: flex;
  position: absolute;
  inset: 0;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column .studio-dm-pane:not(.is-rail-embedded) .studio-agent-handoff {
  top: var(--studio-desktop-head-clear, 44px);
}

[data-appearance="light"] .studio-agent-handoff {
  background: var(--mos-panel);
}

.studio-handoff-pair {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, var(--color-cursor-panel));
  border-radius: 999px;
  flex: 0 auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
  height: 32px;
  padding: 0 2px;
  display: inline-flex;
}

.studio-handoff-party {
  align-self: center;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 24px;
  display: inline-flex;
}

.studio-handoff-party strong {
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 13px;
  font-weight: 600;
  line-height: 24px;
  display: block;
  overflow: hidden;
}

.studio-handoff-agent-mark {
  flex: none;
  place-items: center;
  width: 22px;
  height: 22px;
  display: grid;
}

.studio-handoff-pair .studio-handoff-agent-mark .studio-agent-avatar, .studio-polish:not(.is-studio-mobile) .studio-agent-handoff .studio-dm-chat-head .studio-handoff-pair .studio-agent-avatar {
  --studio-agent-avatar-size: 20px;
}

.studio-handoff-workflow-mark {
  background: var(--mos-plate-strong);
  width: 24px;
  height: 24px;
  color: var(--cursor-accent, var(--color-cursor-accent));
  border-radius: 999px;
  flex: none;
  place-items: center;
  display: grid;
}

.studio-handoff-said {
  color: var(--color-cursor-text-muted, var(--mos-muted));
  flex: none;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
}

.studio-handoff-swap {
  color: var(--color-cursor-text-muted, var(--cursor-text-muted));
  flex: none;
}

.studio-handoff-swap.is-both {
  color: var(--cursor-accent, var(--color-cursor-accent));
}

.studio-dm-pane .studio-agent-handoff .studio-dm-chat-head, .studio-polish:not(.is-studio-mobile) .studio-main-column .studio-dm-pane:not(.is-inbox):not(.is-in-call):not(.is-rail-embedded) .studio-agent-handoff .studio-dm-chat-head, .studio-agent-handoff .studio-dm-chat-head {
  z-index: calc(var(--studio-z-base) + 2);
  background: var(--mos-page);
  flex: none;
  padding-top: 0;
  position: relative;
  top: auto;
  left: auto;
  right: auto;
}

.studio-handoff-scroll {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  padding: 8px 4px 24px;
  display: flex;
  overflow: auto;
}

.studio-handoff-sender {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin-bottom: 4px;
  display: flex;
}

.studio-handoff-sender time {
  color: var(--color-cursor-text-muted, var(--cursor-text-muted));
  flex: none;
  font-size: 11px;
}

.studio-agent-handoff .studio-dm-messages {
  flex-direction: column;
  gap: 8px;
  width: 100%;
  display: flex;
}

.studio-agent-handoff .studio-dm-bubble-row {
  justify-content: flex-start;
  display: flex;
}

.studio-agent-handoff .studio-dm-cluster.is-peer .studio-dm-bubble-row {
  justify-content: flex-end;
}

.studio-agent-handoff .studio-dm-bubble {
  background: var(--studio-received-fill, var(--mos-plate));
  width: auto;
  max-width: min(100%, 34rem);
}

.studio-agent-handoff .studio-handoff-body {
  max-height: 160px;
  overflow: auto;
}

.studio-agent-handoff .studio-handoff-body p {
  white-space: pre-wrap;
  margin: 0;
}

.studio-dm-tagged-body, .studio-agent-handoff .studio-handoff-body p {
  line-height: 1.45;
  display: block;
}

.studio-dm-bubble .studio-inline-tag.is-static, .studio-agent-handoff .studio-inline-tag.is-static {
  cursor: default;
  vertical-align: middle;
  height: 22px;
  margin: 0 4px 2px 0;
  font-size: 12px;
}

.studio-dm-bubble .studio-inline-tag.is-openable, .studio-agent-handoff .studio-inline-tag.is-openable {
  background: var(--mos-plate-strong, var(--mos-plate));
  height: 22px;
  color: inherit;
  font: inherit;
  vertical-align: middle;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  align-items: center;
  margin: 0 4px 2px 0;
  padding: 0 7px;
  font-size: 12px;
  display: inline-flex;
}

.studio-dm-bubble .studio-inline-tag.is-openable:hover, .studio-dm-bubble .studio-inline-tag.is-openable:focus-visible, .studio-agent-handoff .studio-inline-tag.is-openable:hover, .studio-agent-handoff .studio-inline-tag.is-openable:focus-visible {
  background: color-mix(in srgb, var(--cursor-accent) 16%, var(--mos-plate-strong, var(--mos-plate)));
  outline: none;
}

.studio-dm-generation-countdown {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
  display: flex;
}

.studio-dm-generation-countdown strong {
  font-size: 13px;
  font-weight: 650;
}

.studio-dm-generation-countdown .studio-chrome-btn {
  flex: none;
}

.studio-handoff-empty {
  color: var(--color-cursor-text-muted, var(--cursor-text-muted));
  margin: 24px auto;
  font-size: 13px;
}

.studio-dm-cluster:has(.studio-dm-run-card) .studio-dm-cluster-rail {
  display: none;
}

.studio-dm-cluster:has(.studio-dm-run-card) .studio-dm-cluster-bubbles {
  width: 100%;
  max-width: 100%;
}

.studio-dm-cluster:has(.studio-dm-run-card) .studio-dm-bubble-row {
  width: 100%;
  max-width: 100%;
}

.studio-dm-cluster:has(.studio-dm-run-card) .studio-dm-bubble-stack {
  width: 100%;
  max-width: 100%;
}

.studio-dm-cluster:has(.studio-dm-run-card) .studio-dm-bubble.is-agent-card {
  width: 100%;
  max-width: 100%;
}

.studio-dm-message-block:has(.studio-dm-handoff-open) {
  justify-content: center;
  display: flex;
}

.studio-dm-handoff-inline {
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: min(100%, 34rem);
  margin: 6px auto;
  display: flex;
}

.studio-dm-handoff-inline .studio-dm-handoff-open {
  align-self: center;
  margin: 0;
}

.studio-dm-handoff-line {
  border-radius: var(--studio-r-3xl, 16px);
  background: var(--studio-received-fill, var(--mos-plate));
  padding: 8px 11px;
}

.studio-dm-handoff-line.is-peer {
  background: color-mix(in srgb, var(--cursor-accent, #46b9d8) 12%, var(--studio-received-fill, var(--mos-plate)));
}

.studio-dm-handoff-open, .studio-handoff-pair {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, var(--color-cursor-panel));
  max-width: min(100%, 28rem);
  height: 32px;
  box-shadow: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0 2px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.studio-handoff-pair {
  cursor: default;
  max-width: 100%;
}

.studio-dm-handoff-open .studio-handoff-party, .studio-handoff-pair .studio-handoff-party {
  border: .5px solid color-mix(in srgb,
    var(--color-cursor-border-soft, var(--mos-border-soft)) 28%,
    transparent);
  box-sizing: border-box;
  background: var(--mos-plate-strong, var(--mos-plate));
  border-radius: 999px;
  align-items: center;
  gap: 4px;
  min-width: 0;
  height: 22px;
  padding: 0 3px 0 2px;
  display: inline-flex;
}

:is(.studio-dm-handoff-open .studio-handoff-party:has(.studio-handoff-agent-mark), .studio-handoff-pair .studio-handoff-party:has(.studio-handoff-agent-mark)) {
  padding-left: 2px;
}

:is(.studio-dm-handoff-open .studio-handoff-party:has(.studio-handoff-workflow-mark), .studio-handoff-pair .studio-handoff-party:has(.studio-handoff-workflow-mark)) {
  padding: 0 3px 0 2px;
}

.studio-dm-handoff-open .studio-handoff-party strong, .studio-handoff-pair .studio-handoff-party strong {
  background: none;
  border-radius: 0;
  max-width: 8rem;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
  display: block;
}

.studio-dm-handoff-open .studio-agent-avatar, .studio-handoff-pair .studio-agent-avatar {
  --studio-agent-avatar-size: 20px;
}

[data-appearance="light"] .studio-dm-handoff-open, [data-appearance="light"] .studio-handoff-pair {
  background: var(--mos-page);
}

.studio-dm-handoff-open .studio-handoff-workflow-mark, .studio-dm-handoff-open .studio-handoff-agent-mark, .studio-handoff-pair .studio-handoff-workflow-mark, .studio-handoff-pair .studio-handoff-agent-mark {
  place-items: center;
  width: 20px;
  height: 20px;
  display: grid;
}

.studio-dm-handoff-open .studio-handoff-agent-mark, .studio-handoff-pair .studio-handoff-agent-mark {
  width: 16px;
  height: 16px;
}

.studio-dm-handoff-open .studio-agent-avatar, .studio-handoff-pair .studio-agent-avatar {
  --studio-agent-avatar-size: 16px;
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
}

.studio-dm-handoff-open .studio-handoff-workflow-mark, .studio-handoff-pair .studio-handoff-workflow-mark {
  background: var(--mos-page, var(--color-cursor-panel));
  width: 16px;
  height: 16px;
  color: var(--cursor-accent, var(--color-cursor-accent));
  border-radius: 999px;
}

.studio-dm-handoff-count {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, var(--mos-page));
  min-width: 16px;
  height: 16px;
  color: var(--cursor-accent, var(--mos-accent));
  font-variant-numeric: tabular-nums;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 1px 4px 0;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-chat-head {
  box-sizing: border-box;
  pointer-events: none;
  flex: none;
  align-items: center;
  gap: 6px;
  display: flex;
}

.studio-dm-agent-talk-bar {
  min-height: 28px;
  color: var(--color-cursor-text-secondary);
  background: none;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  font-size: 12px;
  line-height: 1.2;
  display: flex;
}

.studio-dm-agent-talk-bar strong {
  color: var(--color-cursor-text);
  flex: none;
  font-weight: 600;
}

.studio-dm-agent-talk-bar span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-chat-head .studio-composer-circle-btn.studio-dm-back, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-call-btn-head, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-peer-toggle, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-open-full, .studio-dm-chat-head-tools .studio-composer-circle-btn {
  flex: none;
  width: var(--studio-head-pill-h, 36px) !important;
  min-width: var(--studio-head-pill-h, 36px) !important;
  max-width: var(--studio-head-pill-h, 36px) !important;
  height: var(--studio-head-pill-h, 36px) !important;
  min-height: var(--studio-head-pill-h, 36px) !important;
  max-height: var(--studio-head-pill-h, 36px) !important;
  box-sizing: border-box !important;
  border-radius: var(--studio-head-pill-radius, 999px) !important;
  border: 1px solid var(--studio-head-pill-border, var(--color-cursor-border-soft, var(--mos-border-soft))) !important;
  background: var(--studio-head-pill-bg, var(--mos-page, var(--color-cursor-panel))) !important;
  color: var(--studio-head-pill-fg, var(--color-cursor-muted, var(--mos-muted))) !important;
  box-shadow: none !important;
}

.studio-dm-chat-head .studio-composer-circle-btn.studio-dm-back:hover, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-call-btn-head:hover, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-peer-toggle:hover, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-open-full:hover {
  border-color: var(--color-cursor-border, var(--mos-border)) !important;
  background: var(--mos-hover, var(--color-cursor-hover)) !important;
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
}

[data-appearance="light"] .studio-dm-chat-head .studio-composer-circle-btn.studio-dm-back, [data-appearance="light"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-call-btn-head, [data-appearance="light"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-peer-toggle, [data-appearance="light"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-open-full, [data-appearance="light"] .studio-dm-sidebar .cursor-panel-search-end .studio-composer-circle-btn {
  background: var(--mos-page) !important;
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  color: var(--color-cursor-muted, #5c6570) !important;
}

[data-appearance="light"] .studio-dm-chat-head .studio-composer-circle-btn.studio-dm-back:hover, [data-appearance="light"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-call-btn-head:hover, [data-appearance="light"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-peer-toggle:hover, [data-appearance="light"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-open-full:hover, [data-appearance="light"] .studio-dm-sidebar .cursor-panel-search-end .studio-composer-circle-btn:hover {
  background: color-mix(in srgb, var(--mos-page) 82%, var(--mos-plate-strong, #e8eaee)) !important;
  border-color: var(--color-cursor-border, var(--mos-border)) !important;
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
}

[data-appearance="dark"] .studio-dm-chat-head .studio-composer-circle-btn.studio-dm-back, [data-appearance="dark"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-call-btn-head, [data-appearance="dark"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-peer-toggle, [data-appearance="dark"] .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-open-full, [data-appearance="dark"] .studio-dm-sidebar .cursor-panel-search-end .studio-composer-circle-btn {
  background: var(--mos-page, var(--color-cursor-panel, #12141a)) !important;
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
}

.studio-dm-chat-head .studio-composer-circle-btn.studio-dm-back svg, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-call-btn-head svg, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-peer-toggle svg, .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-open-full svg {
  width: var(--studio-dm-chrome-glyph, 13px) !important;
  height: var(--studio-dm-chrome-glyph, 13px) !important;
}

.studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-call-btn-head.is-live {
  animation: 1.2s ease-in-out infinite studio-dm-join-live;
  overflow: hidden;
  box-shadow: inset 0 0 0 1.5px var(--cursor-accent, var(--mos-accent)),
    inset 0 0 5px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent) !important;
}

@keyframes studio-dm-join-live {
  0%, 100% {
    box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 28%, transparent),
      inset 0 0 4px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, transparent);
  }

  50% {
    box-shadow: inset 0 0 0 1.5px var(--cursor-accent, var(--mos-accent)),
      inset 0 0 6px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 50%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-dm-chat-head-tools .studio-composer-circle-btn.studio-dm-call-btn-head.is-live {
    animation: none;
  }
}

.studio-dm-chat-peer {
  min-width: 0;
  max-width: 100%;
  height: var(--studio-head-pill-h, 36px);
  border: 1px solid var(--studio-head-pill-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  border-radius: var(--studio-head-pill-radius, 999px);
  background: var(--studio-head-pill-bg, var(--mos-page, #fff));
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  flex: 0 auto;
  align-items: center;
  gap: 8px;
  margin-right: auto;
  padding: 0 12px 0 4px;
  display: flex;
}

[data-appearance="light"] .studio-dm-chat-peer {
  background: var(--mos-plate);
}

.studio-dm-chat-peer:hover .studio-dm-chat-peer-copy strong {
  color: var(--cursor-accent, var(--mos-accent));
}

.studio-dm-chat-peer-avatar-wrap, .studio-dm-chat-peer-avatar-wrap.has-agent-avatar {
  flex: none;
  place-items: center;
  width: 28px;
  min-width: 28px;
  max-width: 28px;
  height: 28px;
  min-height: 28px;
  max-height: 28px;
  display: grid;
  position: relative;
  overflow: hidden;
}

.studio-dm-chat-peer-copy {
  flex-direction: column;
  justify-content: center;
  gap: 0;
  min-width: 0;
  line-height: 1;
  display: flex;
}

.studio-dm-chat-peer-copy strong {
  white-space: nowrap;
  min-width: 0;
  max-width: 100%;
  font-size: var(--studio-thread-title-size, var(--studio-fs-md, 14px));
  letter-spacing: -.01em;
  color: var(--color-cursor-text, var(--mos-text));
  align-items: center;
  gap: 5px;
  font-weight: 600;
  line-height: 1.2;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-chat-head-tools {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--color-cursor-panel));
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 2px;
  height: 36px;
  margin-left: auto;
  padding: 2px;
  display: inline-flex;
}

.studio-dm-chat-head .studio-dm-chat-head-tools .studio-composer-circle-btn, [data-appearance="light"] .studio-dm-chat-head .studio-dm-chat-head-tools .studio-composer-circle-btn, [data-appearance="dark"] .studio-dm-chat-head .studio-dm-chat-head-tools .studio-composer-circle-btn {
  margin: 0;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  padding: 0 !important;
}

[data-appearance="light"] .studio-dm-chat-head .studio-dm-chat-head-tools .studio-composer-circle-btn {
  background: var(--mos-plate) !important;
}

.studio-dm-chat-head .studio-dm-chat-head-tools .studio-composer-circle-btn:hover, [data-appearance="light"] .studio-dm-chat-head .studio-dm-chat-head-tools .studio-composer-circle-btn:hover, [data-appearance="dark"] .studio-dm-chat-head .studio-dm-chat-head-tools .studio-composer-circle-btn:hover {
  background: var(--mos-hover, var(--color-cursor-hover)) !important;
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
}

.studio-dm-chat-head-tools .studio-dm-peer-toggle.is-on {
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 48%,
    var(--color-cursor-border-soft, var(--mos-border))) !important;
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 16%,
    var(--mos-page, var(--color-cursor-panel))) !important;
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
}

.studio-dm-chat-head-tools .studio-dm-peer-toggle.is-on:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 62%,
    var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 24%,
    var(--studio-composer-glass-muted, var(--mos-plate-strong, var(--mos-raised))));
}

.studio-dm-chat-head .studio-profile-avatar {
  letter-spacing: .01em !important;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  color: var(--color-cursor-text, var(--mos-text)) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-sizing: border-box !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

.studio-dm-row-avatar-wrap .studio-profile-avatar {
  letter-spacing: .01em !important;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  color: var(--color-cursor-text, var(--mos-text)) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-sizing: border-box !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

.studio-dm-chat-head .studio-profile-avatar-media, .studio-dm-row-avatar-wrap .studio-profile-avatar-media {
  background: color-mix(in srgb, var(--color-cursor-muted) 12%, transparent);
}

:is(.studio-dm-chat-head .studio-profile-avatar:has( > .studio-profile-avatar-media), .studio-dm-row-avatar-wrap .studio-profile-avatar:has( > .studio-profile-avatar-media)) {
  background: var(--mos-page, var(--color-cursor-panel)) !important;
}

:is(.studio-dm-chat-head .studio-profile-avatar:not(:has( > .studio-profile-avatar-media)), .studio-dm-row-avatar-wrap .studio-profile-avatar:not(:has( > .studio-profile-avatar-media))) {
  box-shadow: none !important;
  background: none !important;
  border-color: #0000 !important;
}

:is([data-appearance="light"] .studio-dm-chat-head .studio-profile-avatar:has( > .studio-profile-avatar-media), [data-appearance="light"] .studio-dm-row-avatar-wrap .studio-profile-avatar:has( > .studio-profile-avatar-media)) {
  background: var(--mos-page) !important;
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  color: var(--color-cursor-text, #1b1f24) !important;
}

:is([data-appearance="dark"] .studio-dm-chat-head .studio-profile-avatar:has( > .studio-profile-avatar-media), [data-appearance="dark"] .studio-dm-row-avatar-wrap .studio-profile-avatar:has( > .studio-profile-avatar-media)) {
  background: var(--mos-page, var(--color-cursor-panel, #12141a)) !important;
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  color: var(--color-cursor-text, var(--mos-text)) !important;
}

[data-appearance="light"] .studio-dm-chat-head .studio-profile-avatar-fallback:not(.is-placeholder), [data-appearance="light"] .studio-dm-row-avatar-wrap .studio-profile-avatar-fallback:not(.is-placeholder) {
  background: unset;
  color: #fff !important;
}

.studio-dm-online-dot {
  box-sizing: border-box;
  width: auto;
  height: auto;
  box-shadow: none;
  pointer-events: none;
  z-index: 2;
  background: none;
  border: 1.5px solid #3dd68c;
  border-radius: 999px;
  position: absolute;
  inset: 0;
}

.studio-dm-typing-dot--inline {
  min-width: 16px;
  height: 10px;
  box-shadow: none;
  border-width: 1px;
  padding: 0 3px;
  position: static;
}

.studio-dm-typing-dot--bubble {
  min-width: 36px;
  height: 22px;
  box-shadow: none;
  padding: 0 8px;
  position: static;
}

.studio-dm-agent-typing-tail {
  justify-content: flex-start;
  padding: 2px 0 6px 2px;
  display: flex;
}

.studio-dm-bot-activity-row {
  align-items: flex-end;
  overflow: visible;
}

.studio-dm-bubble.is-bot-activity {
  flex-direction: row;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.studio-dm-bubble.is-bot-activity.has-steps {
  align-items: flex-end;
}

.studio-dm-bot-activity-copy {
  flex-direction: column;
  flex: auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.studio-dm-bot-activity-copy > .studio-dm-bot-activity-phase {
  text-align: left;
  align-self: flex-start;
  width: 100%;
}

.studio-dm-agent-work {
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-dm-agent-work-tags {
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-dm-bubble-stack > .studio-dm-agent-work {
  margin: 0 0 8px;
}

.studio-dm-agent-work .studio-agent-turn-media.is-dm {
  align-items: center;
  width: 100%;
  max-width: min(420px, 100%);
  margin: 0;
  padding: 0;
}

.studio-dm-work-tag {
  background: var(--mos-plate-strong, var(--color-cursor-bg-secondary));
  max-width: 100%;
  color: var(--color-cursor-text-soft, var(--mos-text-soft, var(--color-cursor-text)));
  font: inherit;
  font-size: var(--desk-text-xs, 11px);
  letter-spacing: -.01em;
  cursor: default;
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 4px 10px;
  font-weight: 500;
  line-height: 1.25;
  display: inline-flex;
}

.studio-dm-work-tag.is-openable {
  cursor: pointer;
}

.studio-dm-work-tag.is-openable:hover, .studio-dm-work-tag.is-openable:focus-visible {
  background: color-mix(in srgb,
    var(--cursor-accent) 16%,
    var(--mos-plate-strong, var(--color-cursor-bg-secondary)));
  color: var(--color-cursor-text-bright, var(--mos-ink, var(--color-cursor-text)));
  outline: none;
}

.studio-dm-work-tag.is-live {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-dm-work-tag-icon {
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-dm-work-tag-icon svg {
  display: block;
}

.studio-dm-work-tag-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  max-width: min(18rem, 70vw);
  overflow: hidden;
}

.studio-dm-work-summary {
  appearance: none;
  background: var(--mos-plate-strong, var(--color-cursor-bg-secondary));
  max-width: 100%;
  color: var(--color-cursor-text-soft, var(--mos-text-soft, var(--color-cursor-text)));
  font: inherit;
  font-size: var(--desk-text-xs, 11px);
  letter-spacing: -.01em;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 4px 10px;
  font-weight: 500;
  line-height: 1.25;
  display: inline-flex;
}

.studio-dm-work-summary:hover, .studio-dm-work-summary:focus-visible {
  background: color-mix(in srgb,
    var(--cursor-accent) 16%,
    var(--mos-plate-strong, var(--color-cursor-bg-secondary)));
  color: var(--color-cursor-text-bright, var(--mos-ink, var(--color-cursor-text)));
  outline: none;
}

.studio-dm-work-summary svg {
  transition: transform .16s;
}

.studio-dm-work-summary.is-open svg {
  transform: rotate(180deg);
}

.studio-dm-work-summary-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-bubble.is-bot-activity .studio-dm-bubble-avatar {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
}

.studio-dm-bot-activity-phase {
  font-size: var(--desk-text-ui, 13px);
  letter-spacing: 0;
  text-transform: none;
  white-space: pre-wrap;
  background: linear-gradient(90deg,
    color-mix(in srgb, var(--mos-accent, #6b8cff) 45%, transparent) 0%,
    color-mix(in srgb, var(--color-cursor-text-bright, var(--mos-text)) 70%, transparent) 25%,
    color-mix(in srgb, var(--mos-accent, #6b8cff) 85%, #fff) 50%,
    color-mix(in srgb, var(--color-cursor-text-bright, var(--mos-text)) 70%, transparent) 75%,
    color-mix(in srgb, var(--mos-accent, #6b8cff) 45%, transparent) 100%);
  color: #0000;
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  font-weight: 500;
  line-height: 1.4;
  animation: 5s ease-in-out infinite studio-dm-bot-activity-sheen;
}

@keyframes studio-dm-bot-activity-sheen {
  0%, 100% {
    background-position: 200% 0;
  }

  50% {
    background-position: -200% 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-dm-bot-activity-phase {
    color: color-mix(in srgb,
      var(--color-cursor-text-bright, var(--mos-text)) 82%,
      transparent);
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    animation: none;
  }
}

.studio-dm-typing-dot {
  background: var(--mos-plate-strong, var(--mos-raised, #2a2a30));
  border: 1.5px solid var(--cursor-surface-raised, var(--mos-surface));
  min-width: 22px;
  height: 14px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 28%, transparent);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 2.5px;
  padding: 0 4px;
  display: inline-flex;
  position: absolute;
  bottom: -4px;
  right: -5px;
}

.studio-dm-typing-dot > i {
  background: currentColor;
  border-radius: 999px;
  width: 3.5px;
  height: 3.5px;
  animation: 1s ease-in-out infinite studio-dm-typing-bounce;
  display: block;
}

.studio-dm-bubble.is-typing {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  min-width: 52px;
  padding: 10px 14px;
}

.studio-dm-typing-wave {
  justify-content: center;
  align-items: center;
  gap: 5px;
  height: 14px;
  display: inline-flex;
}

.studio-dm-typing-wave > i {
  opacity: .45;
  background: currentColor;
  border-radius: 999px;
  width: 7px;
  height: 7px;
  animation: 1.05s ease-in-out infinite studio-dm-typing-bounce;
  display: block;
}

.studio-dm-typing-wave > i:nth-child(2) {
  animation-delay: .15s;
}

.studio-dm-typing-wave > i:nth-child(3) {
  animation-delay: .3s;
}

.studio-dm-typing-dot > i:nth-child(2) {
  animation-delay: .15s;
}

.studio-dm-typing-dot > i:nth-child(3) {
  animation-delay: .3s;
}

@keyframes studio-dm-typing-bounce {
  0%, 80%, 100% {
    opacity: .45;
    transform: translateY(0);
  }

  40% {
    opacity: 1;
    transform: translateY(-2px);
  }
}

.studio-dm-scroll-wrap {
  flex-direction: column;
  flex: auto;
  min-width: 0;
  min-height: 0;
  display: flex;
  position: relative;
}

.studio-dm-scroll {
  --studio-dm-scroll-pad-top: 18px;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  min-width: 0;
  min-height: 0;
  padding: var(--studio-dm-scroll-pad-top) 0 8px;
  scroll-padding-top: var(--studio-dm-scroll-pad-top);
  scrollbar-width: none;
  flex: auto;
  overflow: clip auto;
}

.studio-dm-message-block {
  content-visibility: auto;
  contain-intrinsic-size: auto 72px;
}

.studio-dm-scroll::-webkit-scrollbar {
  display: none;
}

.studio-dm-jump-down {
  z-index: 4;
  border: 1px solid var(--color-cursor-border-soft, #ffffff1f);
  background: color-mix(in srgb, var(--mos-plate, #1a2230) 88%, transparent);
  width: 34px;
  height: 34px;
  color: var(--color-cursor-text-bright, #fff);
  -webkit-backdrop-filter: blur(10px);
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
  position: absolute;
  bottom: 10px;
  right: 14px;
  box-shadow: 0 8px 22px #00000047, inset 0 1px #ffffff1a;
}

.studio-dm-jump-down svg {
  width: 16px;
  height: 16px;
}

.studio-dm-jump-down:hover {
  border-color: color-mix(in srgb, var(--cursor-accent, #7dd3fc) 45%, transparent);
  color: var(--cursor-accent, #7dd3fc);
}

.studio-dm-jump-down:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent, #7dd3fc) 55%, transparent);
  outline-offset: 2px;
}

[data-appearance="light"] .studio-dm-jump-down {
  background: color-mix(in srgb, var(--mos-plate, #fff) 92%, transparent);
  color: var(--color-cursor-text, #111);
  box-shadow: 0 8px 18px #0000001f, inset 0 1px #ffffffb3;
}

.studio-dm-scroll-pending {
  flex: auto;
  min-height: 48px;
}

.studio-dm-scroll.is-pending {
  opacity: .92;
}

.studio-dm-messages {
  box-sizing: border-box;
  grid-template-columns: minmax(0, 1fr);
  gap: 5px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 0 auto;
  padding-inline: 8px;
  display: grid;
  overflow-x: visible;
  container-type: inline-size;
}

.studio-dm-day {
  justify-content: center;
  min-width: 0;
  max-width: 100%;
  padding: 10px 0 6px;
  display: flex;
}

.studio-dm-day span {
  background: var(--mos-plate, var(--mos-panel));
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-2xs, 10px);
  letter-spacing: .03em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 3px 10px;
  font-weight: 650;
}

.studio-dm-swipe-shell {
  box-sizing: border-box;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
  position: relative;
  overflow: visible;
}

.studio-dm-swipe-shell.is-mine {
  justify-content: flex-start;
}

.studio-dm-swipe-reply {
  z-index: 0;
  background: var(--mos-plate-strong, var(--mos-raised));
  width: 28px;
  height: 28px;
  color: var(--color-cursor-text, var(--mos-text));
  pointer-events: none;
  opacity: 0;
  border-radius: 999px;
  place-items: center;
  margin-top: -14px;
  display: grid;
  position: absolute;
  top: 50%;
  left: 6px;
}

.studio-dm-swipe-reply svg {
  width: 14px;
  height: 14px;
}

.studio-dm-bubble-row {
  z-index: 1;
  box-sizing: border-box;
  touch-action: pan-y;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
  position: relative;
  overflow: visible;
}

.studio-dm-bubble-row.is-mine {
  justify-content: flex-start;
  gap: 8px;
}

.studio-dm-bubble-row.has-sender {
  margin-top: 8px;
}

.studio-dm-bubble-row.is-cluster-mid, .studio-dm-bubble-row.is-cluster-end {
  margin-top: 0;
  padding-top: 8px;
}

.studio-dm-bubble-row.is-single:not(.has-sender) {
  align-items: center;
}

.studio-dm-cluster:has(.studio-dm-bubble-row.has-sender) .studio-dm-cluster-rail .studio-dm-bubble-avatar {
  margin-top: 16px;
}

.studio-dm-bubble-avatar {
  flex: none;
  place-items: center;
  width: auto;
  min-height: 0;
  display: grid;
}

.studio-dm-bubble-avatar.is-spacer {
  pointer-events: none;
  height: 0;
  overflow: hidden;
}

.studio-dm-cluster {
  align-items: stretch;
  gap: 8px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
}

.studio-dm-cluster.is-mine {
  justify-content: flex-start;
}

.studio-dm-cluster.is-grouped {
  border: 2px solid var(--studio-received-fill, var(--mos-plate));
  background: none;
  border-radius: 16px;
  flex-direction: column;
  gap: 6px;
  padding: 8px;
}

.studio-dm-cluster-lead {
  align-items: center;
  gap: 6px;
  min-width: 0;
  min-height: 20px;
  padding: 0 2px 4px;
  display: flex;
}

.studio-dm-cluster-lead .studio-dm-sender-name {
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
}

.studio-dm-cluster-lead .studio-dm-bubble-avatar {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  position: static;
}

.studio-dm-cluster-lead .studio-profile-avatar {
  --spa-size: 20px;
  --spa-font: 8px;
  width: 20px;
  height: 20px;
}

.studio-dm-cluster-lead .studio-agent-avatar {
  --studio-agent-avatar-size: 20px;
}

.studio-dm-cluster.is-grouped .studio-dm-bubble {
  border: none;
  border-radius: 12px;
}

.studio-dm-cluster.is-grouped.is-mine {
  border: 2px solid color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 7%,
    var(--mos-page, var(--mos-panel)));
  background: none;
}

[data-appearance="dark"] .studio-dm-cluster.is-grouped:not(.is-mine) {
  border-color: var(--studio-received-fill, var(--mos-page));
  background: none;
}

[data-appearance="dark"] .studio-dm-cluster.is-grouped.is-mine {
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 10%,
    var(--mos-panel, var(--mos-page)));
  background: none;
}

.studio-dm-cluster.is-grouped .studio-dm-msg-head {
  margin-bottom: 2px;
}

.studio-dm-msg-head.is-no-avatar {
  min-height: 0;
}

.studio-dm-cluster-rail {
  pointer-events: none;
  flex: 0 0 26px;
  align-self: stretch;
  width: 26px;
  position: relative;
}

.studio-dm-cluster-bubbles {
  flex-direction: column;
  flex: auto;
  gap: 5px;
  min-width: 0;
  display: flex;
}

.studio-dm-cluster-rail .studio-dm-bubble-avatar, .studio-dm-cluster-rail .studio-dm-bubble-avatar.is-sticky, .studio-dm-cluster-rail .studio-dm-bubble-avatar.is-bot-activity {
  top: var(--studio-dm-avatar-stick, 24px);
  justify-content: center;
  align-items: flex-start;
  height: auto;
  display: flex;
  position: sticky;
  overflow: visible;
}

.studio-dm-sender-name {
  white-space: nowrap;
  margin: 0;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
  display: inline;
}

.studio-dm-msg-head {
  align-items: center;
  gap: 6px;
  width: 100%;
  height: 20px;
  min-height: 20px;
  margin: 0 0 6px;
  display: flex;
}

.studio-dm-cluster.is-grouped .studio-dm-bubble > :not(.studio-dm-msg-head) .studio-dm-meta, .studio-dm-cluster.is-grouped .studio-dm-bubble > .studio-dm-bubble-body > .studio-dm-meta {
  display: none;
}

.studio-dm-msg-head-copy {
  flex-flow: row;
  flex: auto;
  align-self: center;
  align-items: center;
  gap: 6px;
  min-width: 0;
  height: 20px;
  padding: 0;
  line-height: 20px;
  display: inline-flex;
}

.studio-dm-msg-head-copy .studio-dm-sender-name {
  text-overflow: ellipsis;
  align-items: center;
  min-width: 0;
  height: 20px;
  line-height: 20px;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-msg-head .studio-dm-bubble-avatar {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  position: static;
}

.studio-dm-msg-head .studio-profile-avatar {
  --spa-size: 20px;
  --spa-font: 8px;
  width: 20px;
  height: 20px;
}

.studio-dm-msg-head .studio-agent-avatar {
  --studio-agent-avatar-size: 20px;
}

.studio-dm-bubble .studio-dm-meta {
  display: none;
}

.studio-dm-msg-head .studio-dm-meta {
  float: none;
  width: auto;
  height: 20px;
  color: var(--color-cursor-text-muted, var(--mos-muted));
  flex-direction: row;
  flex-shrink: 0;
  justify-content: flex-start;
  align-self: center;
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: 11px;
  line-height: 20px;
  display: inline-flex;
}

.studio-dm-msg-head .studio-dm-meta time {
  height: 20px;
  color: var(--color-cursor-text-muted, var(--mos-muted));
  white-space: nowrap;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 500;
  line-height: 20px;
  display: inline-flex;
}

.studio-dm-msg-tools {
  flex: none;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  display: flex;
}

.studio-dm-msg-menu {
  width: 20px;
  height: 20px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  box-shadow: none;
  background: none;
  border: none;
  border-radius: 0;
  flex: none;
  align-self: center;
  place-items: center;
  margin: 0;
  padding: 0;
  display: grid;
}

.studio-dm-msg-menu:hover, .studio-dm-msg-menu:active, .studio-dm-msg-menu:focus-visible {
  color: var(--color-cursor-text, var(--mos-text));
  background: none;
  border: none;
  outline: none;
}

.studio-dm-msg-menu svg {
  width: 14px;
  height: 14px;
}

.studio-dm-agent-run-block {
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 100%;
  margin: 6px 0;
  display: flex;
}

.studio-dm-agent-run-block > .studio-dm-run-card {
  width: min(100%, 34rem);
  margin-inline: auto;
}

.studio-dm-bubble.is-typing, .studio-dm-bubble.is-bot-activity {
  flex-direction: row;
  align-items: center;
  gap: 12px;
}

.studio-dm-bubble-stack {
  border-radius: var(--studio-r-3xl, 16px);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-shadow: none;
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.studio-dm-bubble-stack.has-reactions {
  padding-bottom: 8px;
  overflow: visible;
}

.studio-dm-bubble-row.is-mine .studio-dm-bubble-stack {
  border-radius: var(--studio-r-3xl, 16px);
  align-items: stretch;
  width: 100%;
  max-width: 100%;
}

.studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble-stack {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble {
  min-width: min(7.25rem, 100%);
  max-width: 100%;
}

.studio-dm-bubble-row.is-mine .studio-dm-bubble {
  min-width: min(7.25rem, 100%);
}

:is(.studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-image, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-video, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-meeting-rec, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-album, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-feed-share, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-studio-share, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-voice, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-agent-card:not(:has(.studio-dm-generation-card)), .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-image, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-video, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-meeting-rec, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-album, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-feed-share, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-studio-share, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-voice) {
  min-width: 0;
}

.studio-dm-bubble-stack .studio-dm-bubble {
  max-width: 100%;
}

.studio-dm-bubble {
  box-sizing: border-box;
  border-radius: var(--studio-r-3xl, 16px);
  background: var(--mos-plate, var(--mos-panel));
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: var(--color-cursor-text, var(--mos-text));
  box-shadow: none;
  overflow-wrap: anywhere;
  word-break: break-word;
  border: none;
  outline: none;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
  padding: 8px 11px;
  display: inline-flex;
  overflow: clip;
}

.studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble:not(.is-image):not(.is-video):not(.is-album):not(.is-feed-share):not(.is-studio-share):not(.is-voice):not(.is-meeting-rec):not(.is-agent-card):not(.is-typing) {
  background: color-mix(in srgb, var(--studio-received-fill, var(--mos-plate)) 40%, transparent);
  border: none;
  outline: none;
}

[data-appearance="dark"] .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble:not(.is-image):not(.is-video):not(.is-album):not(.is-feed-share):not(.is-studio-share):not(.is-voice):not(.is-meeting-rec):not(.is-agent-card):not(.is-typing) {
  background: color-mix(in srgb, var(--studio-received-fill, var(--mos-page)) 40%, transparent);
  border: none;
  outline: none;
}

.studio-dm-bubble.has-reply {
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  width: 100%;
  max-width: 100%;
}

.studio-dm-bubble-body {
  -webkit-user-select: text;
  user-select: text;
  -webkit-touch-callout: default;
  width: 100%;
  min-width: 0;
  display: block;
}

.studio-dm-bubble-body > p {
  text-align: left;
  width: 100%;
  display: flow-root;
}

.studio-dm-bubble p > .studio-dm-meta {
  float: right;
  align-self: auto;
  margin: 2px 0 -2px 12px;
  position: relative;
  top: .15em;
}

.studio-dm-bubble-row:not(.is-mine) p > .studio-dm-meta {
  margin-left: 14px;
}

.studio-dm-bubble-row.is-mine .studio-dm-bubble:not(.is-image):not(.is-video):not(.is-album):not(.is-feed-share):not(.is-studio-share):not(.is-voice):not(.is-meeting-rec):not(.is-agent-card):not(.is-bot-activity):not(.is-typing) {
  border-radius: var(--studio-r-3xl, 16px);
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 4%,
    transparent);
  color: var(--color-cursor-text, var(--mos-text));
  border: none;
  outline: none;
}

[data-appearance="dark"] .studio-dm-bubble-row.is-mine .studio-dm-bubble:not(.is-image):not(.is-video):not(.is-album):not(.is-feed-share):not(.is-studio-share):not(.is-voice):not(.is-meeting-rec):not(.is-agent-card):not(.is-bot-activity):not(.is-typing) {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 6%,
    transparent);
  color: var(--color-cursor-text, var(--mos-text));
  border: none;
  outline: none;
}

.studio-dm-bubble.is-image, .studio-dm-bubble.is-video, .studio-dm-bubble.is-album, .studio-dm-bubble.is-feed-share, .studio-dm-bubble.is-studio-share, .studio-dm-bubble.is-voice, .studio-dm-bubble.is-meeting-rec {
  border: none;
  outline: none;
}

.studio-dm-bubble-row.is-mine .studio-dm-bubble.is-studio-share {
  border-radius: var(--studio-r-3xl, 16px);
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 7%,
    var(--mos-page, var(--mos-panel)));
  color: var(--color-cursor-text, var(--mos-text));
  border: none;
  outline: none;
}

[data-appearance="dark"] .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-studio-share {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 10%,
    var(--mos-panel, var(--mos-page)));
  color: var(--color-cursor-text, var(--mos-text));
  border: none;
  outline: none;
}

.studio-dm-bubble.is-studio-share .studio-dm-studio-share + .studio-dm-md, .studio-dm-bubble.is-studio-share .studio-dm-studio-share + .studio-chat-markdown, .studio-dm-bubble.is-studio-share .studio-dm-studio-share + .mos-md, .studio-dm-bubble.is-studio-share .studio-dm-studio-share + .md-prose, .studio-dm-bubble.is-studio-share .studio-dm-studio-share + p {
  margin-top: 10px;
}

.studio-dm-bubble-row.is-mine .studio-dm-bubble.is-image, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-video, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-album, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-feed-share, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-voice, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-meeting-rec {
  border-radius: var(--studio-r-3xl, 16px);
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 6%,
    var(--mos-page, var(--mos-panel)));
  color: var(--color-cursor-text, var(--mos-text));
  border: none;
  outline: none;
}

.studio-dm-cluster.is-grouped .studio-dm-bubble-row .studio-dm-bubble {
  border: none;
}

.studio-dm-bubble-row.is-cluster-start:not(.is-mine) .studio-dm-bubble, .studio-dm-bubble-row.is-cluster-start:not(.is-mine) .studio-dm-bubble-stack, .studio-dm-bubble-row.is-mine.is-cluster-start .studio-dm-bubble, .studio-dm-bubble-row.is-mine.is-cluster-start .studio-dm-bubble-stack, .studio-dm-bubble-row.is-cluster-mid:not(.is-mine) .studio-dm-bubble, .studio-dm-bubble-row.is-cluster-mid:not(.is-mine) .studio-dm-bubble-stack, .studio-dm-bubble-row.is-mine.is-cluster-mid .studio-dm-bubble, .studio-dm-bubble-row.is-mine.is-cluster-mid .studio-dm-bubble-stack, .studio-dm-bubble-row.is-cluster-end:not(.is-mine) .studio-dm-bubble, .studio-dm-bubble-row.is-cluster-end:not(.is-mine) .studio-dm-bubble-stack, .studio-dm-bubble-row.is-mine.is-cluster-end .studio-dm-bubble, .studio-dm-bubble-row.is-mine.is-cluster-end .studio-dm-bubble-stack {
  border-radius: var(--studio-r-3xl, 16px);
}

.studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.has-reply, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-voice, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-voice.has-reply, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-image, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-image.has-reply, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-video, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-video.has-reply, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-studio-share, .studio-polish.is-studio-mobile .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-feed-share {
  max-width: 100%;
}

.studio-dm-bubble p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  margin: 0;
  font-size: 15px;
  line-height: 1.45;
}

.studio-dm-bubble-body a:not(.studio-pretty-link-hit), .studio-dm-bubble-body .mos-md a:not(.studio-pretty-link-hit), .studio-dm-bubble-body .md-prose a:not(.studio-pretty-link-hit), .studio-pretty-link {
  max-width: 100%;
  color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 72%,
    var(--mos-text));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 12%,
    transparent);
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  border: 0;
  border-radius: 8px;
  padding: 1px 3px 1px 4px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color .12s;
  display: inline;
}

.studio-pretty-link-hit, .studio-dm-bubble-body a.studio-pretty-link-hit, .studio-dm-bubble-body .mos-md a.studio-pretty-link-hit, .studio-dm-bubble-body .md-prose a.studio-pretty-link-hit {
  color: inherit;
  -webkit-box-decoration-break: slice;
  box-decoration-break: slice;
  font: inherit;
  font-weight: inherit;
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  text-decoration: none;
}

.studio-pretty-link-icon, .studio-pretty-link-chev-icon {
  vertical-align: -.1em;
  stroke-width: 2.25px;
  width: 11px;
  height: 11px;
  display: inline;
}

.studio-pretty-link-icon {
  margin-right: 4px;
}

.studio-pretty-link-label {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.studio-dm-bubble-body .studio-pretty-link, .studio-dm-bubble-body a.mos-workspace-link, .studio-dm-bubble-body a:not(.studio-pretty-link-hit) {
  vertical-align: baseline;
  border-radius: 4px;
  max-width: 100%;
  margin: 1px 3px 1px 0;
  padding: 0 4px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.25;
  display: inline-block;
}

.studio-dm-bubble-body .studio-pretty-link-icon, .studio-dm-bubble-body .studio-pretty-link-chev-icon {
  width: 10px;
  height: 10px;
}

.studio-dm-bubble-body .studio-pretty-link-icon {
  margin-right: 2px;
}

.studio-dm-bubble-body .studio-pretty-link-chev {
  margin-left: 1px;
}

.studio-pretty-link-chev {
  vertical-align: baseline;
  width: auto;
  height: auto;
  color: inherit;
  cursor: pointer;
  line-height: inherit;
  font: inherit;
  background: none;
  border: 0;
  border-radius: 0;
  margin-left: 3px;
  padding: 0;
  display: inline;
}

.studio-pretty-link-chev:hover, .studio-pretty-link-chev:focus-visible {
  background: none;
}

.studio-dm-row-preview-md .studio-pretty-link-icon, .studio-dm-row-preview-md .studio-pretty-link-chev {
  display: none;
}

.studio-dm-bubble-body a:not(.studio-pretty-link-hit):hover, .studio-dm-bubble-body .mos-md a:not(.studio-pretty-link-hit):hover, .studio-pretty-link:hover {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 20%,
    transparent);
}

.studio-dm-bubble-body a:focus-visible {
  outline: 2px solid
    color-mix(in srgb,
      var(--cursor-accent, var(--mos-accent)) 55%,
      transparent);
  outline-offset: 2px;
}

.studio-dm-bubble-body ::selection {
  color: inherit;
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 28%,
    transparent);
}

.studio-dm-bubble-body .studio-chat-markdown, .studio-dm-bubble-body .studio-dm-md, .studio-dm-bubble-body .mos-md, .studio-dm-bubble-body .md-prose {
  --mos-text: var(--mos-ink, var(--color-cursor-text, #1a1a1e));
  --mos-muted: color-mix(in srgb, var(--mos-ink, #1a1a1e) 62%, transparent);
  --mos-accent: var(--cursor-accent, var(--mos-accent, #3b82f6));
  --text: var(--mos-text);
  --text-muted: var(--mos-muted);
  color: var(--mos-text);
  font-size: var(--desk-text-ui, 13px);
  letter-spacing: -.01em;
  white-space: normal;
  line-height: 1.4;
}

.studio-dm-bubble-body .studio-chat-markdown.mos-md strong, .studio-dm-bubble-body .studio-chat-markdown.md-prose strong, .studio-dm-bubble-body .mos-md strong, .studio-dm-bubble-body .md-prose strong {
  color: inherit;
  font-weight: 650;
}

.studio-dm-bubble-body .studio-chat-markdown.mos-md em, .studio-dm-bubble-body .studio-chat-markdown.md-prose em, .studio-dm-bubble-body .mos-md em, .studio-dm-bubble-body .md-prose em {
  color: inherit;
  font-style: italic;
}

.studio-dm-bubble-body .studio-chat-markdown.mos-md a, .studio-dm-bubble-body .studio-chat-markdown.md-prose a, .studio-dm-bubble-body .mos-md a, .studio-dm-bubble-body .md-prose a {
  color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 72%,
    var(--mos-text));
}

.studio-dm-bubble-body .studio-chat-markdown :where(p, ul, ol, pre, blockquote) {
  margin: 0 0 .22em;
}

.studio-dm-bubble-body .studio-chat-markdown :where(p:last-child, ul:last-child, ol:last-child, pre:last-child, blockquote:last-child) {
  margin-bottom: 0;
}

.studio-dm-bubble-body .studio-chat-markdown :where(h1, h2, h3, h4) {
  color: inherit;
  margin: .2em 0 .12em;
  font-size: 1em;
  font-weight: 650;
}

.studio-dm-bubble-body .studio-chat-markdown :where(h1:first-child, h2:first-child, h3:first-child, h4:first-child) {
  margin-top: 0;
}

.studio-dm-bubble-body .studio-chat-markdown p {
  white-space: normal;
}

.studio-dm-bubble-body .studio-chat-markdown :where(ul, ol) {
  gap: 0;
  margin-left: 0;
  padding-left: 0;
  display: block;
}

.studio-dm-bubble-body .studio-chat-markdown ul > li, .studio-dm-bubble-body .studio-chat-markdown ol > li {
  min-height: 0;
  box-shadow: none;
  background: none;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0;
  line-height: 1.35;
  position: relative;
}

.studio-dm-bubble-body .studio-chat-markdown ul > li {
  padding-left: .85em;
}

.studio-dm-bubble-body .studio-chat-markdown ul > li + li, .studio-dm-bubble-body .studio-chat-markdown ol > li + li {
  margin-top: 1px;
}

.studio-dm-bubble-body .studio-chat-markdown ul > li:before {
  width: 4px;
  height: 4px;
  box-shadow: none;
  vertical-align: unset;
  margin: 0;
  display: block;
  position: absolute;
  top: .55em;
  left: .1em;
  transform: none;
}

.studio-dm-bubble-body .studio-chat-markdown ol {
  padding-left: .15em;
  list-style: inside decimal;
}

.studio-dm-bubble-body .studio-chat-markdown ol > li {
  padding-left: 0;
}

.studio-dm-bubble-body .studio-chat-markdown :where(code) {
  font-size: .92em;
}

.studio-dm-bubble-body .studio-chat-markdown pre {
  background: var(--mos-plate-strong, var(--mos-plate));
  border-radius: 8px;
  margin: .4em 0;
  padding: 8px 10px;
  overflow-x: auto;
}

.studio-dm-bubble-body .studio-chat-markdown pre code {
  font-size: .9em;
}

.studio-dm-bubble-body > .studio-chat-markdown + .studio-dm-meta, .studio-dm-bubble-body > .studio-dm-reply + .studio-dm-meta, .studio-dm-bubble-body > .studio-dm-reply-clip + .studio-dm-meta {
  float: none;
  justify-content: flex-end;
  width: 100%;
  margin-left: 0;
  display: flex;
}

.studio-dm-reply {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  min-width: 0;
  max-width: 100%;
  display: flex;
}

.studio-dm-reply-more {
  color: var(--color-cursor-muted, var(--mos-muted));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  align-self: flex-start;
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
}

.studio-dm-reply-more:hover {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-dm-reply-clip {
  overscroll-behavior: auto;
  min-width: 0;
  max-width: 100%;
  max-height: min(220px, 32vh);
  overflow: clip;
}

.studio-dm-reply-clip.is-clipped:not(.is-scroll-active) {
  -webkit-mask-image: linear-gradient(#000 0% 82%, #0000 100%);
  mask-image: linear-gradient(#000 0% 82%, #0000 100%);
}

[data-appearance="dark"] .studio-dm-reply-clip.is-clipped:not(.is-scroll-active) {
  -webkit-mask-image: linear-gradient(#000 0% 78%, #0000 100%);
  mask-image: linear-gradient(#000 0% 78%, #0000 100%);
}

.studio-dm-reply-clip.is-scroll-active {
  overscroll-behavior-y: contain;
  scrollbar-width: thin;
  overflow: clip auto;
  -webkit-mask-image: none;
  mask-image: none;
}

.studio-dm-reply-clip pre {
  overflow: auto hidden;
}

[data-appearance="dark"] .studio-dm-bubble:not(.is-mine) .studio-chat-markdown, [data-appearance="dark"] .studio-dm-reply-clip .studio-chat-markdown {
  color: var(--mos-text, var(--color-cursor-text));
}

[data-appearance="dark"] .studio-dm-agent-tool-boards .studio-agent-tool-board {
  background: var(--mos-plate-strong, var(--mos-plate));
}

[data-appearance="dark"] .studio-dm-agent-tool-boards .studio-agent-tool-board-title, [data-appearance="dark"] .studio-dm-agent-tool-boards .studio-agent-tool-board-query {
  color: var(--mos-text, var(--color-cursor-text));
}

.studio-dm-message-block.studio-dm-agent-ask {
  content-visibility: visible;
  contain-intrinsic-size: none;
}

.studio-dm-agent-ask {
  justify-content: flex-start;
  max-width: 100%;
  padding: 4px 12px 10px;
  display: flex;
}

.studio-dm-agent-ask .studio-agent-ask-card {
  width: min(100%, 420px);
}

.studio-dm-reply-quote {
  box-sizing: border-box;
  background: var(--studio-received-fill, var(--mos-plate));
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  border: 0;
  border-radius: 12px;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  margin: 0;
  padding: 5px 8px;
  display: flex;
  overflow: clip;
}

.studio-dm-reply-quote.is-mine {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 16%,
    var(--mos-page, var(--mos-panel)));
}

[data-appearance="dark"] .studio-dm-reply-quote.is-mine {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 20%,
    var(--mos-panel, var(--mos-page)));
}

.studio-dm-feed-share {
  width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 12px;
  margin: 0;
  padding: 0;
  display: block;
  overflow: clip;
}

.studio-dm-feed-share:disabled {
  cursor: default;
  opacity: .72;
}

.studio-dm-feed-share.is-post .studio-dm-feed-share-media {
  aspect-ratio: 1;
  background: color-mix(in srgb, var(--mos-text) 8%, transparent);
  border-radius: 12px;
  width: min(220px, 72vw);
  display: block;
  position: relative;
  overflow: hidden;
  box-shadow: 0 6px 18px #0000002e;
}

.studio-dm-feed-share.is-post.is-compact .studio-dm-feed-share-media {
  border-radius: 10px;
  width: 96px;
}

.studio-dm-feed-share-media img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-feed-share-media-empty {
  color: var(--color-cursor-muted, var(--mos-muted));
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.studio-dm-feed-share-media-scrim {
  pointer-events: none;
  background: linear-gradient(#0000 0%, #05060873 42%, #050608d1 100%);
  height: 52%;
  position: absolute;
  inset: auto 0 0;
}

.studio-dm-feed-share-media-meta {
  z-index: 1;
  color: #fff;
  text-shadow: 0 1px 2px #0000008c;
  gap: 2px;
  min-width: 0;
  padding: 10px 10px 9px;
  display: grid;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.studio-dm-feed-share-media-meta strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
}

.studio-dm-feed-share-media-meta span {
  -webkit-line-clamp: 2;
  line-clamp: 2;
  opacity: .92;
  -webkit-box-orient: vertical;
  font-size: 11px;
  line-height: 1.3;
  display: -webkit-box;
  overflow: hidden;
}

.studio-dm-feed-share.is-compact .studio-dm-feed-share-media-meta {
  padding: 7px 8px 6px;
}

.studio-dm-feed-share.is-compact .studio-dm-feed-share-media-meta strong {
  font-size: 11px;
}

.studio-dm-feed-share.is-compact .studio-dm-feed-share-media-meta span {
  -webkit-line-clamp: 1;
  line-clamp: 1;
  font-size: 10px;
}

.studio-dm-feed-share.is-comment {
  border: 1px solid color-mix(in srgb, var(--mos-text) 12%, transparent);
  background: color-mix(in srgb, var(--mos-text) 5%, var(--mos-panel, transparent));
  width: min(280px, 78vw);
  box-shadow: none;
  border-radius: 12px;
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: stretch;
  gap: 10px;
  padding: 8px;
  display: grid;
}

.studio-dm-feed-share.is-comment.is-compact {
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 8px;
  width: min(240px, 70vw);
  padding: 6px;
}

.studio-dm-feed-share.is-comment .studio-dm-feed-share-thumb {
  aspect-ratio: 1;
  background: color-mix(in srgb, var(--mos-text) 8%, transparent);
  border-radius: 8px;
  flex-shrink: 0;
  place-items: center;
  width: 100%;
  height: auto;
  display: grid;
  overflow: hidden;
}

.studio-dm-feed-share.is-comment .studio-dm-feed-share-thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-feed-share-thumb.is-empty {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-dm-feed-share-copy {
  align-content: center;
  gap: 3px;
  min-width: 0;
  display: grid;
}

.studio-dm-feed-share-copy strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
}

.studio-dm-feed-share-copy span {
  color: var(--color-cursor-muted, var(--mos-muted));
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  font-size: 12px;
  line-height: 1.35;
  display: -webkit-box;
  overflow: hidden;
}

.studio-dm-bubble.is-studio-share {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  width: 100%;
  max-width: 100%;
  padding: 10px;
}

.studio-dm-studio-share {
  gap: 6px;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: grid;
}

.studio-dm-studio-share-item {
  box-sizing: border-box;
  text-align: left;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-line, transparent)) 70%, transparent);
  border-radius: var(--studio-r-xl, 12px);
  background: color-mix(in srgb, var(--mos-plate-strong, #7f7f7f1f) 55%, transparent);
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: inherit;
  font: inherit;
  cursor: pointer;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  transition: background .12s, border-color .12s;
  display: flex;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-item {
  color: var(--mos-ink, #1a1a1e);
  background: #ffffff94;
  border-color: #f0f0f082;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-copy strong {
  color: var(--mos-ink, #1a1a1e);
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-copy span {
  color: color-mix(in srgb, var(--mos-ink, #1a1a1e) 58%, transparent);
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-folder {
  color: #b45309;
  background: #f59e0b29;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-pdf {
  color: #e11d48;
  background: #f43f5e29;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-doc {
  color: #2563eb;
  background: #3b82f624;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-text, .studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-script {
  color: #334155;
  background: #64748b24;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-image {
  color: #0f766e;
  background: #14b8a624;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-video, .studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-edit {
  color: #6d28d9;
  background: #8b5cf624;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-audio {
  color: #6d28d9;
  background: #7c3aed24;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-element {
  color: #be185d;
  background: #ec489924;
}

.studio-dm-bubble-row.is-mine .studio-dm-studio-share-thumb.is-file {
  background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 14%, transparent);
  color: var(--cursor-accent, #4f6ef7);
}

[data-appearance="light"] .studio-dm-bubble-row.is-mine .studio-dm-studio-share-item {
  color: var(--mos-ink, #1a1a1e);
  background: #ffffffad;
  border-color: #efefef8d;
}

[data-appearance="dark"] .studio-dm-bubble-row.is-mine .studio-dm-studio-share-item {
  color: var(--mos-ink, var(--color-cursor-text, #e8eaee));
  background: #ffffff1f;
  border-color: #ffffff2e;
}

.studio-dm-studio-share-item:disabled, .studio-dm-studio-share-item.is-unavailable {
  opacity: .55;
  cursor: default;
  pointer-events: none;
}

.studio-dm-studio-share-item.is-unavailable .studio-dm-studio-share-thumb {
  filter: grayscale(.35);
}

.studio-dm-studio-share-thumb {
  border-radius: var(--studio-r-md, 8px);
  background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 14%, transparent);
  width: 38px;
  height: 38px;
  color: var(--cursor-accent, #4f6ef7);
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-studio-share-thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.studio-dm-studio-share-thumb.is-folder {
  color: #b45309;
  background: #f59e0b29;
}

.studio-dm-studio-share-thumb.is-pdf {
  color: #e11d48;
  background: #f43f5e29;
}

.studio-dm-studio-share-thumb.is-doc {
  color: #2563eb;
  background: #3b82f624;
}

.studio-dm-studio-share-thumb.is-text, .studio-dm-studio-share-thumb.is-script {
  color: #334155;
  background: #64748b24;
}

.studio-dm-studio-share-thumb.is-image {
  color: #0f766e;
  background: #14b8a624;
}

.studio-dm-studio-share-thumb.is-video, .studio-dm-studio-share-thumb.is-edit {
  color: #6d28d9;
  background: #8b5cf624;
}

.studio-dm-studio-share-thumb.is-audio {
  color: #6d28d9;
  background: #7c3aed24;
}

.studio-dm-studio-share-thumb.is-element {
  color: #be185d;
  background: #ec489924;
}

.studio-dm-studio-share-thumb.is-file {
  background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 14%, transparent);
  color: var(--cursor-accent, #4f6ef7);
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-folder, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-folder {
  color: #fbbf24;
  background: #f59e0b38;
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-pdf, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-pdf {
  color: #fb7185;
  background: #f43f5e38;
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-doc, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-doc {
  color: #93c5fd;
  background: #3b82f638;
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-text, [data-appearance="dark"] .studio-dm-studio-share-thumb.is-script, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-text, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-script {
  color: #cbd5e1;
  background: #94a3b82e;
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-image, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-image {
  color: #5eead4;
  background: #14b8a638;
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-video, [data-appearance="dark"] .studio-dm-studio-share-thumb.is-edit, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-video, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-edit {
  color: #c4b5fd;
  background: #8b5cf638;
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-audio, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-audio {
  color: #c4b5fd;
  background: #7c3aed38;
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-element, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-element {
  color: #f9a8d4;
  background: #ec489938;
}

[data-appearance="dark"] .studio-dm-studio-share-thumb.is-file, :root:not([data-appearance="light"]) .studio-dm-studio-share-thumb.is-file {
  background: color-mix(in srgb, var(--cursor-accent, #6b8afd) 22%, transparent);
  color: color-mix(in srgb, var(--cursor-accent, #93a9ff) 90%, #fff);
}

.studio-dm-studio-share-thumb.has-media {
  background: var(--mos-plate, #7f7f7f1f);
  color: var(--color-cursor-muted);
}

.studio-dm-studio-share-copy {
  flex-direction: column;
  flex: 1 1 0;
  gap: 1px;
  min-width: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-studio-share-copy strong {
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  display: block;
  overflow: hidden;
}

.studio-dm-studio-share-copy span {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 600;
  display: block;
  overflow: hidden;
}

.studio-dm-bubble.is-feed-share {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  max-width: 100%;
  padding: 4px;
}

.studio-dm-bubble.is-feed-share .studio-dm-bubble-body {
  align-items: stretch;
  gap: 6px;
  width: 100%;
  display: grid;
}

.studio-dm-bubble.is-feed-share .studio-dm-bubble-body > p {
  margin: 0;
  padding: 2px 6px 0;
}

.studio-dm-bubble.is-feed-share .studio-dm-meta {
  align-self: flex-end;
  padding: 0 4px 2px;
}

.studio-dm-bubble.is-feed-share .studio-dm-feed-share.is-post .studio-dm-feed-share-media, .studio-dm-bubble.is-feed-share .studio-dm-feed-share.is-comment {
  width: 100%;
}

.studio-dm-attach-preview.is-feed-share {
  align-items: flex-start;
  gap: 8px;
  padding: 8px 10px;
  display: flex;
}

.studio-dm-attach-preview.is-feed-share .studio-dm-attach-clear {
  flex-shrink: 0;
  margin-top: 4px;
}

.studio-dm-row.is-feed-drop, .studio-dm-search-result.is-feed-drop {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent) 70%, transparent);
  outline-offset: -2px;
  background: color-mix(in srgb,
    var(--cursor-accent) 12%,
    color-mix(in srgb, var(--mos-surface) 58%, transparent));
  border-color: color-mix(in srgb, var(--cursor-accent) 40%, var(--color-cursor-border-soft));
}

.studio-dm-chat-column.is-studio-drop {
  outline: 1px dashed color-mix(in srgb, var(--cursor-accent) 50%, transparent);
  outline-offset: -2px;
  background: color-mix(in srgb, var(--cursor-accent) 5%, transparent);
}

.studio-dm-reply-quote.is-voice {
  padding-bottom: 4px;
}

.studio-dm-bubble > .studio-dm-msg-head {
  order: -1;
  align-self: stretch;
  align-items: center;
}

.studio-dm-bubble > .studio-dm-bubble-body, .studio-dm-bubble > .studio-dm-album {
  order: 2;
}

.studio-dm-bubble > .studio-dm-reply-quote {
  order: 3;
  margin-top: 8px;
}

.studio-dm-reply-quote-who {
  min-width: 0;
  max-width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  flex: auto;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 0;
  display: flex;
}

.studio-dm-reply-quote-top {
  align-items: center;
  gap: 6px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-dm-reply-quote-avatar {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-dm-reply-quote-avatar .studio-profile-avatar, .studio-dm-reply-quote-avatar .studio-profile-avatar.is-sm {
  width: 18px;
  min-width: 18px;
  height: 18px;
  font-size: 8px;
}

.studio-dm-reply-quote-age {
  color: var(--color-cursor-text-muted, var(--mos-muted));
  flex: none;
  font-size: 11px;
  font-weight: 500;
}

.studio-dm-reply-quote-head {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: default;
  background: none;
  border: 0;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  margin: 0;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-reply-quote strong, .studio-dm-reply-quote-head strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 12px;
  font-weight: 650;
}

.studio-dm-reply-quote span, .studio-dm-reply-snippet {
  max-width: 100%;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 11px;
  font-weight: 500;
  overflow: hidden;
}

.studio-dm-reply-snippet {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  align-items: flex-start;
  gap: 4px;
  margin: 0;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-reply-snippet-text {
  -webkit-line-clamp: 3;
  line-clamp: 3;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  -webkit-box-orient: vertical;
  flex: auto;
  min-width: 0;
  line-height: 1.35;
  display: -webkit-box;
  overflow: hidden;
}

.studio-dm-reply-snippet > :not(svg):not(.studio-dm-reply-snippet-text) {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-reply-snippet svg {
  opacity: .9;
  flex: none;
  width: 12px;
  height: 12px;
  margin-top: 1px;
}

.studio-dm-reply-voice {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.studio-dm-reply-voice .studio-chat-audio-player, .studio-dm-reply-voice .studio-chat-audio-player.is-compact {
  background: none;
  border: 0;
  width: 100%;
  max-width: 100%;
  padding: 2px 0;
  transform: none;
  min-width: 0 !important;
}

.studio-dm-pane .studio-chat-audio-host, .studio-dm-pane .studio-chat-audio-player, .studio-dm-incall-chat .studio-chat-audio-host, .studio-dm-incall-chat .studio-chat-audio-player, .studio-meet-incall-chat .studio-chat-audio-host, .studio-meet-incall-chat .studio-chat-audio-player {
  min-width: 0;
  max-width: 100%;
}

.studio-dm-reply-voice .studio-orb-play-glyph, .studio-dm-bubble.is-voice .studio-orb-play-glyph {
  color: #fff;
  filter: drop-shadow(0 1px 1.5px #00000073);
}

.studio-dm-reply-voice .studio-orb-play-spinner, .studio-dm-bubble.is-voice .studio-orb-play-spinner {
  filter: drop-shadow(0 1px 1.5px #00000059);
  border-color: #fff #ffffff59 #ffffff59;
}

.studio-dm-reply-image {
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 6px;
  width: 72px;
  height: 72px;
  margin: 0;
  padding: 0;
  display: block;
  overflow: hidden;
}

.studio-dm-reply-image img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-reply-preview {
  box-sizing: border-box;
  border: 1px solid
    color-mix(in srgb,
      var(--studio-composer-glass-border, var(--color-cursor-border-soft)) 40%,
      transparent);
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-bg, #05080f) 78%, transparent));
  width: calc(100% - 16px);
  max-width: 100%;
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(12px));
  border-radius: 14px;
  flex: none;
  align-items: center;
  gap: 10px;
  margin: 0 auto 6px;
  padding: 8px 10px;
  display: flex;
}

.studio-dm-reply-preview.is-voice {
  align-items: flex-start;
}

[data-appearance="light"] .studio-dm-reply-preview {
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-panel) 90%, transparent));
}

.studio-dm-reply-preview-icon {
  background: var(--mos-plate-strong, var(--mos-raised));
  width: 28px;
  height: 28px;
  color: var(--color-cursor-text, var(--mos-text));
  border-radius: 999px;
  flex: none;
  place-items: center;
  display: grid;
}

.studio-dm-reply-preview-thumb {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-raised, var(--mos-surface));
  border-radius: 8px;
  flex: none;
  width: 40px;
  height: 40px;
  overflow: hidden;
}

.studio-dm-reply-preview-thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-reply-preview-copy {
  flex-direction: column;
  flex: auto;
  gap: 1px;
  min-width: 0;
  display: flex;
}

.studio-dm-reply-preview-copy strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 11px;
  font-weight: 700;
}

.studio-dm-reply-preview-copy span {
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 12px;
  overflow: hidden;
}

.studio-dm-reply-preview .studio-dm-reply-voice {
  margin-top: 2px;
}

.studio-dm-meta {
  flex: none;
  justify-content: flex-end;
  align-self: flex-end;
  align-items: center;
  gap: 3px;
  margin-top: 2px;
  margin-left: auto;
  display: inline-flex;
  transform: none;
}

.studio-dm-bubble .studio-dm-msg-head-copy > .studio-dm-meta {
  float: none;
  flex-direction: row;
  justify-content: flex-start;
  align-self: center;
  align-items: center;
  width: auto;
  margin: 0;
  display: inline-flex;
}

.studio-dm-bubble-body .studio-dm-meta, .studio-dm-bubble p > .studio-dm-meta {
  display: none !important;
}

.studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble-body > .studio-dm-meta {
  float: none;
  justify-content: flex-end;
  width: 100%;
  margin-left: 0;
  display: flex;
}

.studio-dm-bubble.is-image > .studio-dm-meta, .studio-dm-bubble.is-video > .studio-dm-meta, .studio-dm-bubble.is-album > .studio-dm-meta, .studio-dm-bubble.is-voice .studio-dm-bubble-body > .studio-dm-meta, .studio-dm-bubble.is-feed-share .studio-dm-bubble-body > .studio-dm-meta, .studio-dm-bubble.is-studio-share .studio-dm-bubble-body > .studio-dm-meta {
  float: none;
}

.studio-dm-meta time {
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  font-size: 9.5px;
  font-weight: 600;
}

.studio-dm-bubble-row.is-mine .studio-dm-bubble:not(.is-image):not(.is-video):not(.is-album):not(.is-feed-share):not(.is-studio-share):not(.is-voice):not(.is-meeting-rec):not(.is-agent-card) .studio-dm-receipt, .studio-dm-bubble-row.is-mine .studio-dm-bubble:not(.is-image):not(.is-video):not(.is-album):not(.is-feed-share):not(.is-studio-share):not(.is-voice):not(.is-meeting-rec):not(.is-agent-card) .studio-dm-receipt svg, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-studio-share .studio-dm-receipt, .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-studio-share .studio-dm-receipt svg {
  color: var(--cursor-accent, var(--mos-accent));
  stroke: var(--cursor-accent, var(--mos-accent));
}

.studio-dm-edited {
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  font-size: 9.5px;
  font-style: italic;
  font-weight: 500;
}

.studio-dm-tombstone {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-style: italic;
}

.studio-dm-bubble.is-deleted {
  opacity: .92;
}

.studio-dm-edit {
  flex-direction: column;
  gap: 6px;
  width: min(100%, 28rem);
  min-width: min(100%, 16rem);
  display: flex;
}

.studio-dm-edit-input {
  -webkit-user-select: text;
  user-select: text;
  box-sizing: border-box;
  resize: vertical;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--mos-plate-strong, var(--mos-panel));
  width: 100%;
  min-height: 10rem;
  max-height: min(60vh, 28rem);
  color: var(--mos-text, inherit);
  font: inherit;
  field-sizing: content;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.4;
  overflow-y: auto;
}

.studio-dm-edit-input:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 55%, transparent);
  outline-offset: 1px;
}

.studio-dm-edit-actions {
  justify-content: flex-end;
  gap: 6px;
  display: flex;
}

.studio-dm-edit-cancel, .studio-dm-edit-save {
  appearance: none;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--mos-plate, var(--mos-panel));
  color: var(--mos-text, inherit);
  font: inherit;
  cursor: pointer;
  border-radius: 8px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 600;
}

.studio-dm-edit-save {
  background: var(--mos-plate-strong, var(--mos-panel));
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, var(--color-cursor-border, var(--mos-border)));
}

.studio-dm-edit-cancel:hover, .studio-dm-edit-save:hover {
  background: var(--mos-plate-strong, var(--mos-panel));
}

.studio-dm-edit-cancel:disabled, .studio-dm-edit-save:disabled {
  opacity: .55;
  cursor: default;
}

.studio-dm-ticks {
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.studio-dm-chat-column.is-agent .studio-dm-ticks, .studio-dm-row.is-agent .studio-dm-ticks {
  display: none;
}

.studio-dm-ticks.is-pending {
  opacity: .85;
}

.studio-dm-ticks.is-delivered {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-dm-ticks.is-read {
  color: var(--cursor-accent, var(--mos-accent));
}

.studio-polish .studio-dm-row:hover .studio-dm-ticks, .studio-polish .studio-dm-row.is-active .studio-dm-ticks, .studio-polish .studio-dm-row:hover .studio-dm-ticks.is-delivered, .studio-polish .studio-dm-row.is-active .studio-dm-ticks.is-delivered {
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
}

.studio-polish .studio-dm-row:hover .studio-dm-ticks.is-read, .studio-polish .studio-dm-row.is-active .studio-dm-ticks.is-read {
  color: var(--cursor-accent, var(--mos-accent)) !important;
}

.studio-dm-row-preview .studio-dm-ticks {
  flex: none;
  width: 13px;
  height: 13px;
  margin-right: 2px;
}

.studio-dm-error {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  color: var(--mos-danger, #ff8f8f);
  font-size: var(--desk-text-sm, 12px);
  margin: 0 auto 4px;
  padding: 4px 12px;
}

.studio-dm-composer {
  background: none;
  border-top: none;
  flex: none;
}

[data-appearance="light"] .studio-dm-composer {
  background: none;
}

.studio-dm-composer.is-split {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  padding: 0 8px max(10px, env(safe-area-inset-bottom, 0px));
  background: none;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  margin-inline: auto;
  display: flex;
}

.studio-dm-composer-box {
  background: var(--mos-page, var(--color-cursor-panel));
  -webkit-backdrop-filter: none;
  width: 100%;
  min-width: 0;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent);
  border: 0;
  border-radius: 20px;
  flex-direction: column;
  align-items: stretch;
  transition: box-shadow .28s cubic-bezier(.45, 0, .2, 1);
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-dm-composer-box:before, .studio-dm-composer-box:after {
  content: none;
}

.studio-dm-composer-box > :not(.studio-composer-resize-handle) {
  z-index: 1;
  position: relative;
}

.studio-dm-composer-box > .studio-composer-resize-handle {
  z-index: 6;
  position: absolute;
  top: 4px;
  left: auto;
  right: 6px;
}

[data-appearance="light"] .studio-dm-composer-box {
  background: var(--mos-plate);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent);
}

.studio-dm-composer-box:focus-within {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent);
}

@media (min-width: 900px) {
  .studio-dm-composer-box {
    height: auto;
    min-height: 0;
    max-height: min(72vh, var(--studio-composer-box-max-height, 240px));
  }

  .studio-dm-composer.is-split .studio-dm-composer-row.is-message {
    flex: none;
    align-items: center;
    min-height: 36px;
  }

  .studio-dm-composer.is-split .studio-dm-composer-row.is-extras {
    flex: none;
  }

  .studio-dm-composer.is-split textarea {
    height: 24px;
    min-height: 24px;
    max-height: 160px;
    overflow-y: auto;
  }
}

.studio-dm-composer.is-split .studio-dm-composer-row {
  align-items: center;
  gap: 0;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-message {
  box-sizing: border-box;
  background: var(--mos-page);
  width: auto;
  min-width: 0;
  max-width: calc(100% - 16px);
  height: auto;
  min-height: 36px;
  box-shadow: none;
  border: none;
  border-radius: 16px;
  align-items: center;
  margin: 8px 8px 2px;
  padding: 6px 8px;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras {
  box-sizing: border-box;
  gap: 8px;
  min-height: 40px;
  padding: 4px 8px 6px;
}

.studio-dm-composer.is-split.is-compact .studio-dm-composer-row.is-extras {
  flex-wrap: nowrap;
}

.studio-dm-extras-spacer {
  flex: auto;
  min-width: 8px;
}

.studio-dm-composer.is-split .studio-settings-pill.studio-dm-extra-pill {
  appearance: none;
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  border: 1px solid var(--studio-composer-glass-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-plate) 78%, transparent));
  height: 30px;
  min-height: 30px;
  color: var(--color-cursor-text, var(--mos-text));
  font-family: inherit;
  font-size: var(--studio-fs-md, 14px);
  white-space: nowrap;
  cursor: pointer;
  flex: none;
  align-items: center;
  gap: 5px;
  margin: 0;
  padding: 0 10px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-composer.is-split .studio-composer-circle-btn {
  appearance: none;
  border: 1px solid var(--studio-composer-glass-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-plate) 78%, transparent));
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-dm-extra-pill-label {
  display: none;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-settings-pill.studio-dm-extra-pill {
  width: var(--studio-mobile-chrome-control, 34px);
  min-width: var(--studio-mobile-chrome-control, 34px);
  height: var(--studio-mobile-chrome-control, 34px);
  min-height: var(--studio-mobile-chrome-control, 34px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px));
  justify-content: center;
  gap: 0;
  padding: 0;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-settings-pill.studio-dm-extra-pill svg {
  width: 15px;
  height: 15px;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-composer-circle-btn.studio-dm-composer-circle, .studio-dm-composer.is-split.is-mobile-icons .studio-composer-circle-btn.studio-composer-send-btn {
  width: var(--studio-mobile-chrome-control, 34px);
  min-width: var(--studio-mobile-chrome-control, 34px);
  height: var(--studio-mobile-chrome-control, 34px);
  min-height: var(--studio-mobile-chrome-control, 34px);
}

.studio-dm-composer.is-split.is-mobile-icons .studio-composer-circle-btn.studio-composer-send-btn.is-chat-send {
  width: var(--studio-mobile-chrome-control, 34px);
  min-width: var(--studio-mobile-chrome-control, 34px);
  height: var(--studio-mobile-chrome-control, 34px);
  min-height: var(--studio-mobile-chrome-control, 34px);
  aspect-ratio: 1;
  padding: 0;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-composer-circle-btn.studio-composer-send-btn.is-generate-send {
  width: auto;
  min-width: var(--studio-mobile-chrome-control, 34px);
  height: var(--studio-mobile-chrome-control, 34px);
  min-height: var(--studio-mobile-chrome-control, 34px);
  aspect-ratio: auto;
  gap: 4px;
  padding: 0 8px 0 7px;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-composer-circle-btn.studio-composer-send-btn:has(.studio-composer-send-cost) {
  width: auto;
  min-width: var(--studio-mobile-chrome-control, 34px);
  height: var(--studio-mobile-chrome-control, 34px);
  min-height: var(--studio-mobile-chrome-control, 34px);
  aspect-ratio: auto;
  gap: 4px;
  padding: 0 8px 0 7px;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-dm-composer-row.is-extras {
  min-height: calc(var(--studio-mobile-chrome-control, 34px) + 2px + 6px);
  gap: 6px;
  padding: 2px 6px 6px;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-dm-composer-row.is-message {
  align-items: center;
  width: auto;
  max-width: calc(100% - 16px);
  min-height: 36px;
  margin: 8px 8px 2px;
  padding: 6px 8px;
}

.studio-dm-composer.is-split.is-mobile-icons textarea, .studio-dm-composer.is-split.is-mobile-icons textarea.is-single-line {
  field-sizing: content;
  flex: none;
  max-height: 24px;
  padding: 0;
  font-size: 15px;
  font-weight: 550;
  line-height: 24px;
  overflow-y: hidden;
  height: 24px !important;
  min-height: 24px !important;
}

.studio-dm-composer.is-split.is-mobile-icons textarea:not(.is-single-line) {
  flex: auto;
  max-height: 120px;
  padding: 0;
  line-height: 22px;
  overflow-y: auto;
}

.studio-dm-composer.is-split .studio-settings-pill.studio-dm-extra-pill svg {
  stroke-width: 2.25px;
  flex: none;
  width: 14px;
  height: 14px;
}

.studio-dm-composer.is-split .studio-settings-pill.studio-dm-extra-pill:disabled {
  opacity: .55;
  cursor: default;
}

.studio-dm-extra-pill-label {
  white-space: nowrap;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-dm-composer-circle {
  flex: none;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-dm-composer-circle svg {
  stroke-width: 2.25px;
  width: 14px;
  height: 14px;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn {
  box-sizing: border-box;
  aspect-ratio: 1;
  border: 1px solid var(--studio-composer-glass-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-plate) 78%, transparent));
  width: 30px;
  min-width: 30px;
  max-width: none;
  height: 30px;
  min-height: 30px;
  color: var(--color-cursor-text, var(--mos-text));
  box-shadow: none;
  flex: none;
  gap: 0;
  padding: 0;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn svg {
  color: currentColor;
  stroke: currentColor;
}

:is(.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn.is-chat-send:disabled, .studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn:disabled:not(.is-generate-send):not(:has(.studio-composer-send-cost))) {
  opacity: .55;
  cursor: default;
  filter: none;
  border-color: var(--studio-composer-glass-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-plate) 78%, transparent));
  color: var(--color-cursor-text, var(--mos-text));
  box-shadow: none;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-composer-circle-btn.studio-dm-composer-circle svg, .studio-dm-composer.is-split.is-mobile-icons .studio-composer-circle-btn.studio-composer-send-btn svg {
  stroke-width: 2.2px;
  width: 15px;
  height: 15px;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-dm-composer-circle:disabled:not(.studio-composer-send-btn) {
  opacity: .55;
  cursor: default;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-recording {
  box-sizing: border-box;
  align-items: center;
  gap: 8px;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-recording .studio-composer-circle-btn {
  flex: none;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.is-discard {
  color: var(--mos-danger, #f87171);
}

.studio-dm-composer.is-split textarea {
  resize: none;
  width: 100%;
  min-width: 0;
  height: 22px;
  min-height: 22px;
  max-height: 160px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  box-shadow: none;
  scrollbar-width: none;
  appearance: none;
  box-sizing: border-box;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  flex: auto;
  margin: 0;
  padding: 0;
  font-size: 15px;
  font-weight: 550;
  line-height: 24px;
  overflow-y: auto;
}

.studio-dm-composer.is-split textarea::placeholder {
  color: var(--color-cursor-muted, var(--mos-muted));
  opacity: 1;
}

.studio-dm-composer.is-split textarea::-webkit-scrollbar {
  display: none;
}

.studio-dm-composer.is-split textarea:focus, .studio-dm-composer.is-split textarea:focus-visible {
  box-shadow: none;
  border: none;
  outline: none;
}

.studio-polish .studio-dm-composer.is-split .studio-composer-circle-btn.studio-dm-composer-circle:hover:not(:disabled) :where(svg, .icon-inline) {
  filter: none;
  color: inherit !important;
}

.studio-dm-composer.is-classic {
  min-height: var(--cursor-head-h, 36px);
  box-sizing: border-box;
  align-items: flex-end;
  gap: 6px;
  padding: 4px 8px;
  display: flex;
}

.studio-dm-composer.is-classic textarea {
  resize: none;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-input, var(--mos-surface));
  min-width: 0;
  height: 32px;
  min-height: 32px;
  max-height: 120px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  font-size: var(--desk-text-ui, 13px);
  scrollbar-width: none;
  box-sizing: border-box;
  border-radius: 16px;
  outline: none;
  flex: auto;
  margin: 0;
  padding: 6px 12px;
  font-weight: 500;
  line-height: 18px;
}

.studio-dm-composer.is-classic textarea::-webkit-scrollbar {
  display: none;
}

.studio-dm-composer.is-classic textarea:focus-visible {
  border-color: var(--cursor-border-focus, var(--cursor-accent));
}

.studio-dm-composer.is-classic .studio-dm-attach, .studio-dm-composer.is-classic .studio-dm-send {
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  display: inline-flex;
}

.studio-dm-composer.is-classic .studio-dm-send {
  background: var(--cursor-accent, var(--mos-accent));
  color: var(--cursor-on-accent, #fff);
  border: 0;
}

.studio-dm-composer.is-classic .studio-dm-send:hover:not(:disabled) {
  filter: brightness(1.05);
}

.studio-dm-composer.is-classic .studio-dm-send:disabled {
  opacity: .55;
  cursor: default;
}

.studio-dm-composer.is-classic .studio-dm-send.is-mic {
  background: var(--cursor-surface-input, var(--mos-surface));
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-dm-composer.is-classic .studio-dm-send.is-mic:hover:not(:disabled) {
  filter: none;
  border-color: var(--cursor-border-focus, var(--cursor-accent));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-dm-composer.is-classic .studio-dm-attach svg, .studio-dm-composer.is-classic .studio-dm-send svg {
  width: 16px;
  height: 16px;
}

.studio-dm-recording {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-input, var(--mos-surface));
  box-sizing: border-box;
  border-radius: 16px;
  flex: auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  height: 32px;
  min-height: 32px;
  padding: 0 4px 0 2px;
  display: flex;
}

.studio-dm-recording .studio-dm-send {
  width: 28px;
  min-width: 28px;
  height: 28px;
  min-height: 28px;
}

.studio-dm-rec-cancel {
  width: 28px;
  height: 28px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-dm-rec-cancel:hover:not(:disabled) {
  color: var(--mos-danger, #f87171);
  background: color-mix(in srgb, var(--mos-danger, #f87171) 12%, transparent);
}

.studio-dm-rec-cancel:disabled {
  opacity: .5;
  cursor: default;
}

.studio-dm-rec-meta {
  flex: none;
  align-items: center;
  gap: 6px;
  display: inline-flex;
}

.studio-dm-rec-dot {
  background: var(--mos-danger, #f87171);
  opacity: .5;
  border-radius: 999px;
  width: 8px;
  height: 8px;
}

.studio-dm-rec-dot.is-live {
  opacity: 1;
  animation: 1.1s ease-in-out infinite studio-dm-rec-pulse;
}

@keyframes studio-dm-rec-pulse {
  0%, 100% {
    opacity: 1;
  }

  50% {
    opacity: .35;
  }
}

.studio-dm-rec-time {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 11px;
  font-weight: 700;
}

.studio-dm-rec-wave {
  flex: auto;
  min-width: 0;
}

.studio-dm-bubble.is-voice {
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  padding: 4px 8px 6px 6px;
}

.studio-dm-bubble.is-voice.has-reply {
  width: 100%;
  max-width: 100%;
}

.studio-dm-bubble.is-voice .studio-dm-bubble-body {
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-dm-bubble.is-voice .studio-dm-bubble-body > .studio-chat-audio-host {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.studio-dm-bubble.is-voice .studio-dm-bubble-body > .studio-chat-audio-host > .studio-chat-audio-player, .studio-dm-bubble.is-voice .studio-dm-bubble-body > .studio-chat-audio-player {
  background: none;
  border: 0;
  flex: 0 auto;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 2px 0 0;
}

.studio-dm-voice-missing {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  padding: 4px 8px;
  font-size: 12px;
  font-style: italic;
}

.studio-dm-bubble.is-image {
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  width: fit-content;
  min-width: 0;
  max-width: 100%;
  padding: 10px;
  overflow: clip;
}

.studio-dm-bubble.is-image.has-reply {
  max-width: 100%;
}

.studio-dm-bubble.is-image > p {
  padding: 0 2px;
}

.studio-dm-bubble.is-image > .studio-dm-sender-name, .studio-dm-bubble.is-video > .studio-dm-sender-name, .studio-dm-bubble.is-album > .studio-dm-sender-name, .studio-dm-bubble.is-voice > .studio-dm-sender-name {
  align-self: flex-start;
  padding: 4px 6px 0;
}

.studio-dm-bubble.is-image .studio-dm-meta {
  align-self: flex-end;
  padding: 0 4px 2px;
}

.studio-dm-bubble.is-video {
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
  width: fit-content;
  min-width: 0;
  max-width: 100%;
  padding: 10px;
  overflow: clip;
}

.studio-dm-bubble.is-image > .studio-dm-msg-head, .studio-dm-bubble.is-video > .studio-dm-msg-head, .studio-dm-bubble.is-album > .studio-dm-msg-head {
  align-self: stretch;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-image, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-video, .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-album {
  background: var(--studio-received-fill, var(--mos-plate));
}

[data-appearance="dark"] .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-image, [data-appearance="dark"] .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-video, [data-appearance="dark"] .studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble.is-album {
  background: var(--studio-received-fill, var(--mos-page));
}

.studio-dm-bubble.is-video.has-reply {
  max-width: 100%;
}

.studio-dm-bubble.is-video > p {
  padding: 0 2px;
}

.studio-dm-bubble.is-video .studio-dm-meta {
  align-self: flex-end;
  padding: 0 4px 2px;
}

.studio-dm-video-wrap {
  isolation: isolate;
  background: #000;
  border-radius: 8px;
  width: fit-content;
  max-width: 100%;
  display: block;
  overflow: visible;
}

.studio-dm-video {
  vertical-align: middle;
  object-fit: contain;
  background: #000;
  border-radius: 8px;
  width: auto;
  max-width: min(26rem, 100cqi - 36px);
  height: auto;
  max-height: min(52dvh, 360px);
  display: block;
}

.studio-dm-image-btn {
  cursor: zoom-in;
  background: none;
  border: 0;
  border-radius: 10px;
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: 0;
  display: block;
  overflow: clip;
}

.studio-dm-image {
  object-fit: contain;
  vertical-align: middle;
  border-radius: 10px;
  width: auto;
  max-width: min(20rem, 100cqi - 36px);
  height: auto;
  max-height: min(42dvh, 320px);
  display: block;
}

.studio-dm-bubble.is-album, .studio-dm-bubble.is-album.is-album-tall, .studio-dm-bubble.is-album.is-album-wide {
  max-width: 100%;
}

.studio-dm-album {
  background: color-mix(in srgb, var(--mos-text, #111) 8%, transparent);
  border-radius: 10px;
  gap: 2px;
  display: grid;
  overflow: clip;
}

.studio-dm-album.is-2 {
  grid-template-columns: 1fr 1fr;
}

.studio-dm-album.is-2.is-orient-tall {
  grid-template-rows: min(52vh, 26rem);
  grid-template-columns: 1fr 1fr;
  height: min(52vh, 26rem);
}

.studio-dm-album.is-2.is-orient-tall .studio-dm-album-cell {
  aspect-ratio: auto;
  height: 100%;
  min-height: 0;
}

.studio-dm-album.is-2.is-orient-wide {
  grid-template-rows: auto auto;
  grid-template-columns: 1fr;
}

.studio-dm-album.is-2.is-orient-wide .studio-dm-album-cell {
  aspect-ratio: 16 / 9;
}

.studio-dm-album.is-2.is-orient-mixed .studio-dm-album-cell {
  aspect-ratio: 3 / 4;
}

.studio-dm-album.is-3 {
  grid-template-columns: 1fr 1fr;
}

.studio-dm-album.is-3.is-orient-mixed .studio-dm-album-cell:first-child, .studio-dm-album.is-3.is-orient-pending .studio-dm-album-cell:first-child {
  aspect-ratio: 16 / 10;
  grid-column: 1 / -1;
}

.studio-dm-album.is-3.is-orient-tall {
  grid-template-rows: min(48vh, 22rem);
  grid-template-columns: 1fr 1fr 1fr;
  height: min(48vh, 22rem);
}

.studio-dm-album.is-3.is-orient-tall .studio-dm-album-cell, .studio-dm-album.is-3.is-orient-tall .studio-dm-album-cell:first-child {
  aspect-ratio: auto;
  grid-column: auto;
  height: 100%;
  min-height: 0;
}

.studio-dm-album.is-3.is-orient-wide {
  grid-template-columns: 1fr 1fr;
}

.studio-dm-album.is-3.is-orient-wide .studio-dm-album-cell:first-child {
  aspect-ratio: 16 / 9;
  grid-column: 1 / -1;
}

.studio-dm-album.is-3.is-orient-wide .studio-dm-album-cell {
  aspect-ratio: 16 / 10;
}

.studio-dm-album.is-4 {
  grid-template-columns: 1fr 1fr;
}

.studio-dm-album.is-4.is-orient-tall .studio-dm-album-cell {
  aspect-ratio: 9 / 14;
}

.studio-dm-album.is-4.is-orient-wide .studio-dm-album-cell {
  aspect-ratio: 16 / 10;
}

.studio-dm-album-cell {
  aspect-ratio: 1;
  background: var(--mos-plate, var(--cursor-surface));
  cursor: zoom-in;
  border: 0;
  margin: 0;
  padding: 0;
  display: block;
  position: relative;
  overflow: clip;
}

.studio-dm-album-cell img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-album-more {
  color: #fff;
  letter-spacing: -.02em;
  background: #00000075;
  place-items: center;
  font-size: 22px;
  font-weight: 700;
  display: grid;
  position: absolute;
  inset: 0;
}

.studio-dm-attach-thumb-fallback {
  width: 100%;
  height: 100%;
  min-height: 48px;
  color: var(--color-cursor-muted, var(--mos-muted));
  background: var(--mos-plate-strong, var(--mos-raised));
  place-items: center;
  display: grid;
}

.studio-dm-attach-thumb-fallback svg {
  width: 18px;
  height: 18px;
}

.studio-dm-file-input {
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
  position: absolute;
}

.studio-dm-attach {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-input, var(--mos-surface));
  width: 32px;
  height: 32px;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-dm-attach:hover:not(:disabled) {
  border-color: var(--cursor-border-focus, var(--cursor-accent));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-dm-attach:disabled {
  opacity: .55;
  cursor: default;
}

.studio-dm-attach-preview {
  box-sizing: border-box;
  border: 1px solid
    color-mix(in srgb,
      var(--studio-composer-glass-border, var(--color-cursor-border-soft)) 40%,
      transparent);
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-bg, #05080f) 78%, transparent));
  width: calc(100% - 16px);
  max-width: 100%;
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(12px));
  border-radius: 14px;
  flex: none;
  align-items: center;
  gap: 10px;
  margin: 0 auto 6px;
  padding: 8px 10px;
  display: flex;
}

[data-appearance="light"] .studio-dm-attach-preview {
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-panel) 90%, transparent));
}

.studio-dm-attach-preview.is-multi {
  gap: 8px;
  padding: 8px 8px 8px 10px;
  overflow: hidden;
}

.studio-dm-attach-thumbs {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  scrollbar-width: none;
  flex: auto;
  align-items: center;
  gap: 6px;
  min-width: 0;
  max-width: none;
  display: flex;
  overflow: auto hidden;
}

.studio-dm-attach-thumbs::-webkit-scrollbar {
  display: none;
}

.studio-dm-attach-thumb {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--mos-plate, var(--mos-surface));
  border-radius: 8px;
  flex: none;
  width: 56px;
  height: 56px;
  position: relative;
  overflow: hidden;
}

.studio-dm-attach-thumb.is-voice {
  color: var(--color-cursor-text, var(--mos-text));
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2px;
  font-size: 10px;
  font-weight: 650;
  line-height: 1;
  display: flex;
}

.studio-dm-attach-thumb.is-voice svg {
  width: 16px;
  height: 16px;
}

.studio-dm-attach-thumb img, .studio-dm-attach-thumb video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-attach-clear.is-overlay {
  background: color-mix(in srgb, var(--mos-page) 88%, transparent);
  width: 18px;
  height: 18px;
  color: var(--color-cursor-text-bright);
  position: absolute;
  top: 2px;
  right: 2px;
}

.studio-dm-attach-badge {
  background: color-mix(in srgb, var(--mos-bg) 70%, transparent);
  width: 16px;
  height: 16px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: absolute;
  bottom: 2px;
  right: 2px;
}

.studio-dm-attach-name {
  min-width: 0;
  color: var(--color-cursor-text, var(--mos-text));
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: auto;
  font-size: 12px;
  font-weight: 600;
  overflow: hidden;
}

.studio-dm-attach-clear {
  width: 28px;
  height: 28px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-dm-attach-clear:hover {
  color: var(--mos-danger, #f87171);
  background: color-mix(in srgb, var(--mos-danger, #f87171) 12%, transparent);
}

.studio-dm-pane.is-lightbox-open {
  overflow: hidden;
}

.studio-dm-pane.is-lightbox-open .studio-dm-chat-head, .studio-dm-pane.is-lightbox-open .studio-dm-chat-head-tools, .studio-dm-pane.is-lightbox-open .studio-dm-peer-toggle {
  pointer-events: none;
  z-index: 0 !important;
}

.studio-dm-lightbox {
  z-index: 300;
  box-sizing: border-box;
  background: var(--mos-page, var(--mos-panel, var(--mos-bg)));
  min-width: 0;
  min-height: 0;
  color: var(--color-cursor-text, var(--mos-text));
  flex-direction: column;
  margin: 0;
  padding: 0;
  display: flex;
  position: absolute;
  inset: 0;
  overflow: hidden;
  container: dm-lightbox / inline-size;
}

.studio-dm-lightbox-head {
  z-index: 2;
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  box-sizing: border-box;
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-page, var(--mos-panel, var(--mos-bg)));
  flex: none;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 0 8px;
  display: grid;
  overflow: hidden;
}

.studio-dm-lightbox-meta {
  flex-direction: row;
  align-items: center;
  gap: 7px;
  min-width: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-lightbox-meta .studio-profile-avatar {
  flex: none;
  width: 20px !important;
  height: 20px !important;
  box-shadow: none !important;
  border: 0 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

.studio-dm-lightbox-meta-copy {
  flex-direction: column;
  justify-content: center;
  gap: 0;
  min-width: 0;
  line-height: 1.15;
  display: flex;
}

.studio-dm-lightbox-meta-copy strong {
  letter-spacing: -.01em;
  white-space: nowrap;
  text-overflow: ellipsis;
  min-width: 0;
  max-width: 100%;
  color: var(--color-cursor-text, var(--mos-text));
  align-items: baseline;
  gap: 0;
  font-size: 13px;
  font-weight: 500;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-lightbox-meta-name {
  text-overflow: ellipsis;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-lightbox-meta-you {
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
  font-weight: 400;
}

.studio-dm-lightbox-meta-copy > span {
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 11px;
  overflow: hidden;
}

.studio-dm-lightbox-tools {
  flex-wrap: nowrap;
  flex: none;
  align-items: center;
  gap: 4px;
  min-width: 0;
  height: 100%;
  display: inline-flex;
}

.studio-dm-lightbox-tool, .studio-dm-lightbox-close {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border));
  background: var(--mos-plate-strong, var(--mos-raised));
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-dm-lightbox-tool svg, .studio-dm-lightbox-close svg {
  stroke-width: 2.25px;
  flex: none;
  width: 13px;
  height: 13px;
}

.studio-dm-lightbox-tool:hover:not(:disabled), .studio-dm-lightbox-close:hover {
  background: var(--mos-hover, color-mix(in srgb, var(--mos-text) 8%, transparent));
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 34%,
    var(--color-cursor-border-soft, var(--mos-border)));
}

.studio-dm-lightbox-tool:disabled {
  opacity: .35;
  cursor: default;
}

.studio-dm-lightbox-zoom-label {
  text-align: center;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.01em;
  min-width: 2.4rem;
  color: var(--color-cursor-muted, var(--mos-muted));
  -webkit-user-select: none;
  user-select: none;
  font-size: 11px;
  font-weight: 600;
}

@container dm-lightbox (max-width: 340px) {
  .studio-dm-lightbox-zoom-label {
    display: none;
  }
}

.studio-dm-lightbox-stage {
  box-sizing: border-box;
  cursor: grab;
  touch-action: none;
  flex: auto;
  min-width: 0;
  min-height: 0;
  padding: 0;
  display: block;
  position: relative;
  overflow: hidden;
}

.studio-dm-lightbox-stage.is-dragging {
  cursor: grabbing;
}

.studio-dm-lightbox-canvas {
  box-sizing: border-box;
  pointer-events: none;
  justify-content: center;
  align-items: center;
  min-width: 0;
  min-height: 0;
  display: flex;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-dm-lightbox-image {
  object-fit: contain;
  object-position: center;
  transform-origin: center;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
  will-change: transform;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
  transition: transform .1s;
  display: block;
}

.studio-dm-lightbox-stage.is-dragging .studio-dm-lightbox-image {
  transition: none;
}

.studio-dm-lightbox-nav {
  z-index: 2;
  color: #fff;
  cursor: pointer;
  background: #00000073;
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  margin: 0;
  padding: 0;
  display: inline-flex;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

[data-appearance="light"] .studio-dm-lightbox-nav {
  color: #111;
  background: #1111112e;
}

.studio-dm-lightbox-nav svg {
  width: 22px;
  height: 22px;
}

.studio-dm-lightbox-nav.is-prev {
  left: 6px;
}

.studio-dm-lightbox-nav.is-next {
  right: 6px;
}

.studio-dm-lightbox-nav:disabled {
  opacity: .28;
  cursor: default;
}

.studio-dm-lightbox-nav:not(:disabled):hover {
  background: #0000009e;
}

[data-appearance="light"] .studio-dm-lightbox-nav:not(:disabled):hover {
  background: #11111147;
}

.studio-dm-lightbox-foot {
  box-sizing: border-box;
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-page, var(--mos-panel, var(--mos-bg)));
  flex-direction: column;
  flex: none;
  align-items: stretch;
  gap: 8px;
  min-height: 0;
  padding: 8px 0 10px;
  display: flex;
}

.studio-dm-lightbox-caption {
  text-align: center;
  max-width: 36rem;
  color: var(--color-cursor-text, var(--mos-text));
  overflow-wrap: anywhere;
  align-self: center;
  margin: 0;
  padding: 0 16px;
  font-size: 13px;
  line-height: 1.35;
}

.studio-dm-lightbox-thumbs {
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 0 12px;
  display: flex;
  overflow: auto hidden;
}

.studio-dm-lightbox-thumbs::-webkit-scrollbar {
  display: none;
}

.studio-dm-lightbox-thumb {
  cursor: pointer;
  background: #ffffff1a;
  border: 2px solid #0000;
  border-radius: 8px;
  flex: none;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  position: relative;
  overflow: hidden;
}

[data-appearance="light"] .studio-dm-lightbox-thumb {
  background: #1111110f;
}

.studio-dm-lightbox-thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-lightbox-thumb.is-active {
  border-color: var(--cursor-accent, #3dd68c);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent, #3dd68c) 40%, transparent);
}

.studio-dm-lightbox-thumb:hover:not(.is-active) {
  border-color: #ffffff59;
}

[data-appearance="light"] .studio-dm-lightbox-thumb:hover:not(.is-active) {
  border-color: #11111138;
}

.studio-dm-bubble.is-voice:not(.has-reply), .studio-dm-bubble.is-voice.has-reply {
  align-items: stretch;
}

.studio-dm-bubble.is-voice .studio-dm-meta {
  flex: none;
  align-self: flex-end;
}

.studio-dm-list-host {
  flex-direction: column;
  flex: auto;
  width: 100%;
  min-height: 0;
  display: flex;
}

.studio-dm-list-host .studio-dm-conversations {
  scrollbar-width: none;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  flex: auto;
  min-height: 0;
  overflow-y: auto;
}

.studio-dm-list-host .studio-dm-conversations::-webkit-scrollbar {
  display: none;
}

.studio-dm-conversations {
  padding: 0 var(--studio-dm-edge, 8px) 12px;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  list-style: none;
  display: flex;
}

.studio-dm-row {
  width: 100%;
  min-width: 0;
  box-shadow: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 16px;
  flex-direction: column;
  flex: none;
  align-items: stretch;
  gap: 0;
  padding: 6px 12px 6px 8px;
  transition: background .16s, border-color .16s, box-shadow .16s;
  display: flex;
  position: relative;
}

[data-appearance="light"] .studio-polish .studio-dm-row {
  box-shadow: none;
}

.studio-dm-row:not(.is-active), .studio-dm-row:not(.is-active):hover, .studio-dm-row:not(.is-active):active, .studio-polish.is-studio-mobile .studio-dm-row:not(.is-active):active {
  background: color-mix(in srgb, var(--mos-plate-strong) 42%, var(--mos-page));
}

@media (hover: hover) {
  .studio-dm-row:hover {
    border-color: color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
    box-shadow: none;
    border-radius: 18px;
  }
}

.studio-dm-row:active {
  border-color: color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  box-shadow: none;
  border-radius: 18px;
}

.studio-polish.is-studio-mobile .studio-dm-row {
  cursor: default;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  contain: layout style;
  transition: none;
}

.studio-polish.is-studio-mobile .studio-dm-row:active {
  box-shadow: none;
  border-color: #0000;
  border-radius: 16px;
}

.studio-dm-row.is-active, .studio-dm-row.studio-chrome-plate-surface {
  border-radius: 18px;
  overflow: visible;
}

.studio-dm-row-main {
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-dm-row-avatar-wrap {
  flex: none;
  place-items: center;
  width: 48px;
  min-width: 48px;
  max-width: 48px;
  height: 48px;
  min-height: 48px;
  max-height: 48px;
  display: grid;
  position: relative;
  overflow: visible;
}

.studio-dm-row-avatar-wrap .studio-agent-avatar {
  --studio-agent-avatar-size: 48px;
}

.studio-dm-row-label-ticks {
  flex: none;
  align-items: center;
  gap: 3px;
  height: 14px;
  padding: 0;
  display: inline-flex;
  position: relative;
}

.studio-dm-row-label-tick {
  border-radius: 1px;
  flex: none;
  width: 2px;
  height: 12px;
}

.studio-dm-row-label-card {
  z-index: 8;
  background: var(--mos-plate, var(--color-cursor-sidebar));
  min-width: 8.5rem;
  box-shadow: var(--cursor-shadow-menu);
  border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px));
  pointer-events: none;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  display: flex;
  position: absolute;
  bottom: calc(100% + 6px);
  right: 0;
}

.studio-dm-row-label-card-row {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: var(--studio-fs-sm, 12px);
  white-space: nowrap;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  line-height: 1.2;
  display: flex;
}

.studio-dm-row-label-card-row > svg {
  flex: none;
  width: 12px;
  height: 12px;
}

.studio-dm-row-labels {
  flex-wrap: wrap;
  align-items: center;
  gap: 3px;
  width: 100%;
  min-width: 0;
  margin-top: 1px;
  display: flex;
}

.studio-dm-row-label {
  max-width: 100%;
  height: calc(var(--studio-chip-h, 26px) - 8px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px));
  background: var(--mos-plate, var(--color-cursor-sidebar));
  font-size: var(--studio-chip-count-fs, var(--studio-fs-2xs, 10px));
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  text-overflow: ellipsis;
  border: 1px solid #0000;
  align-items: center;
  gap: 3px;
  padding: 0 6px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-row-label > svg {
  width: var(--studio-chip-icon, 11px);
  height: var(--studio-chip-icon, 11px);
  color: inherit;
  stroke: currentColor;
  flex: none;
}

.studio-dm-row-label.is-type {
  font-weight: 700;
}

.studio-dm-row-label.is-count {
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  font-weight: 700;
}

.studio-dm-row-copy {
  flex: auto;
  gap: 2px;
  min-width: 0;
  display: grid;
}

.studio-dm-row-top {
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-dm-row-top strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--studio-thread-title-size, var(--studio-fs-sm, 13px));
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-weight: 650;
  overflow: hidden;
}

.studio-dm-row-top time {
  font-size: var(--desk-text-2xs, 10px);
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  flex: none;
  font-weight: 600;
}

.studio-dm-row-top time.is-unread {
  color: var(--cursor-accent, var(--mos-accent));
  font-weight: 700;
}

.studio-dm-row-bottom {
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-dm-row-preview {
  min-width: 0;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: auto;
  align-items: center;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.25;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-row-preview-md {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-row-preview-md, .studio-dm-row-preview-md * {
  line-height: inherit;
  white-space: nowrap;
  margin: 0;
  display: inline;
}

.studio-dm-row-preview-md br, .studio-dm-row-preview-md p, .studio-dm-row-preview-md ul, .studio-dm-row-preview-md ol, .studio-dm-row-preview-md li, .studio-dm-row-preview-md pre, .studio-dm-row-preview-md h1, .studio-dm-row-preview-md h2, .studio-dm-row-preview-md h3 {
  display: none;
}

.studio-dm-row.is-unread .studio-dm-row-preview {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-weight: 500;
}

.studio-dm-unread-dot {
  background: var(--cursor-accent, var(--mos-accent));
  border-radius: 999px;
  flex: none;
  width: 8px;
  height: 8px;
}

.studio-dm-sidebar > .studio-dm-label-editor-panel {
  margin-top: 48px;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar > .studio-dm-label-editor-panel {
  margin-top: calc(max(8px, env(safe-area-inset-top, 0px)) + 44px + 44px);
  margin-bottom: calc(max(8px, env(safe-area-inset-bottom, 0px)) + var(--studio-mobile-nav-height, 44px) + 10px);
}

[data-appearance="light"] .studio-dm-sidebar {
  background: var(--mos-panel);
}

.studio-dm-sidebar-chrome {
  z-index: calc(var(--studio-z-base) + 4);
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 0;
  padding: 8px var(--studio-dm-edge, 8px) 4px;
  pointer-events: none;
  background: none;
  border: none;
  align-items: center;
  gap: 6px;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  overflow: visible;
}

.studio-dm-sidebar-chrome > * {
  pointer-events: auto;
}

.studio-dm-sidebar-tools {
  flex: none;
  align-items: center;
  gap: 6px;
  display: flex;
}

.studio-polish .studio-dm-sidebar .cursor-panel-search, .studio-dm-sidebar .cursor-panel-search {
  flex: auto;
  gap: 6px;
  width: auto;
  min-width: 0;
  height: 36px;
  min-height: 36px;
  max-height: 36px;
  padding: 0 14px;
  overflow: hidden;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  border-radius: 999px !important;
  margin: 0 !important;
}

[data-appearance="light"] .studio-dm-sidebar .cursor-panel-search, [data-appearance="light"] .studio-polish .studio-dm-sidebar .cursor-panel-search {
  background: var(--mos-plate) !important;
}

.studio-dm-search-filter, .studio-dm-create-menu {
  flex: none;
  align-items: center;
  display: inline-flex;
  position: relative;
}

.studio-dm-search-filter-trigger {
  max-width: 7.5rem;
  height: 22px;
  color: var(--color-cursor-text, var(--mos-text));
  font-size: var(--studio-fs-sm, 12px);
  white-space: nowrap;
  background: none;
  border: 0;
  border-radius: 999px;
  align-items: center;
  gap: 2px;
  padding: 0 10px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-search-filter-trigger > span {
  text-overflow: ellipsis;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-search-filter-trigger .cursor-select-arrow {
  flex: none;
  width: 10px;
  height: 10px;
}

.studio-dm-search-filter-trigger.is-active, .studio-dm-search-filter-trigger.is-open {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-action-menu.studio-dm-context-menu .studio-dm-menu-caret {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 32%,
    transparent);
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 12px;
  height: 12px;
  margin-left: 8px;
  display: inline-flex;
  position: relative;
}

.studio-action-menu.studio-dm-context-menu .studio-dm-menu-caret:after {
  content: "";
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 88%,
    transparent);
  border-radius: 50%;
  width: 5px;
  height: 5px;
}

.studio-dm-chrome-menu {
  z-index: 8;
  min-width: 11.5rem;
}

.studio-dm-chrome-sheet-list {
  flex-direction: column;
  gap: 2px;
  width: 100%;
  padding: 4px 0 8px;
  display: flex;
}

.studio-polish.is-studio-mobile .studio-mobile-app-menu-sheet.studio-dm-chrome-sheet {
  width: auto;
  min-width: 0;
  max-width: none;
  height: auto;
  max-height: min(48dvh, var(--studio-mobile-app-menu-sheet-band, 48dvh));
  left: 4px;
  right: 4px;
}

.studio-dm-sidebar .cursor-panel-search-end {
  gap: 2px;
  margin-left: 0;
  padding-left: 2px;
}

.studio-dm-sidebar .cursor-panel-search-end:before {
  height: 12px;
  margin-right: 4px;
}

.studio-dm-sidebar .cursor-panel-search-end .studio-composer-circle-btn {
  flex: 0 0 36px;
  box-sizing: border-box !important;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  margin: 0 !important;
}

.studio-dm-sidebar .cursor-panel-search-end .studio-composer-circle-btn svg {
  width: 15px !important;
  height: 15px !important;
}

.studio-dm-sidebar .cursor-panel-search-end .studio-composer-circle-btn.is-on {
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
  border-color: var(--color-cursor-border, var(--mos-border)) !important;
}

.studio-dm-sidebar-body {
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex-direction: column;
  min-height: 0;
  padding: 48px 0 8px;
  display: flex;
  position: absolute;
  inset: 0;
  overflow: clip auto;
}

.studio-dm-sidebar-body:has( > .studio-dm-label-editor-panel) {
  padding: 48px 0 0;
  overflow: hidden;
}

.studio-polish.is-studio-mobile .studio-dm-sidebar-body:has( > .studio-dm-label-editor-panel) {
  padding-top: calc(max(8px, env(safe-area-inset-top, 0px)) + 44px + 44px);
}

.studio-dm-sidebar-body::-webkit-scrollbar {
  display: none;
}

.studio-dm-sidebar-body .studio-dm-conversations {
  flex: auto;
}

.studio-dm-search-results {
  width: 100%;
  padding: 0 var(--studio-dm-edge, 8px) 12px;
  flex-direction: column;
  gap: 10px;
  display: flex;
}

.studio-dm-search-section {
  flex-direction: column;
  gap: 5px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-dm-search-section-head {
  background: color-mix(in srgb,
    var(--cursor-surface-raised, var(--mos-surface)) 76%,
    transparent);
  width: 100%;
  min-height: 24px;
  color: var(--color-cursor-muted, var(--mos-muted));
  letter-spacing: .035em;
  text-transform: uppercase;
  border-radius: 6px;
  justify-content: space-between;
  align-items: center;
  padding: 0 7px;
  font-size: 10px;
  font-weight: 750;
  display: flex;
}

.studio-dm-search-section-head > span {
  align-items: center;
  gap: 5px;
  min-width: 0;
  display: inline-flex;
}

.studio-dm-search-section-head svg {
  width: 12px;
  height: 12px;
}

.studio-dm-search-section-head > strong {
  background: color-mix(in srgb, var(--mos-text) 8%, transparent);
  min-width: 18px;
  height: 18px;
  color: var(--color-cursor-text, var(--mos-text));
  font-size: var(--studio-section-title-size, var(--studio-fs-md, 14px));
  border-radius: 999px;
  place-items: center;
  padding: 0 5px;
  font-weight: 750;
  display: grid;
}

.studio-dm-search-section-list {
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.studio-dm-search-result {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--cursor-surface-raised, color-mix(in srgb, var(--mos-surface) 92%, var(--mos-bg)));
  width: 100%;
  min-width: 0;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 7px 8px;
  transition: background .16s, border-color .16s;
  display: grid;
}

.studio-dm-search-result:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 32%,
    var(--mos-border));
  background: var(--color-cursor-hover, var(--mos-hover));
}

.studio-dm-search-result:focus-visible {
  box-shadow: var(--studio-focus-ring, 0 0 0 3px color-mix(in srgb, var(--cursor-accent) 16%, transparent));
  outline: none;
}

.studio-dm-search-result-copy {
  flex-direction: column;
  gap: 0;
  min-width: 0;
  line-height: 1;
  display: flex;
}

.studio-dm-search-result-copy strong, .studio-dm-search-result-copy > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.05;
  overflow: hidden;
}

.studio-dm-search-result-copy strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 11.5px;
  font-weight: 680;
}

.studio-dm-search-result-copy > span {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin-top: -1px;
  font-size: 10px;
  font-weight: 550;
}

.studio-dm-search-hit {
  background: color-mix(in srgb,
    var(--color-cursor-accent, var(--cursor-accent, #6b8afd)) 46%,
    var(--color-cursor-hover, var(--mos-raised)));
  color: inherit;
  font: inherit;
  font-weight: inherit;
  box-shadow: none;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  border: 0;
  border-radius: 4px;
  margin: 0;
  padding: 0;
  display: inline;
}

.studio-dm-search-result > time {
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  align-self: start;
  font-size: 9px;
  font-weight: 600;
}

.studio-dm-search-badges {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 3px;
  display: flex;
}

.studio-dm-search-badge {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 10%,
    transparent);
  color: var(--color-cursor-muted, var(--mos-muted));
  border-radius: 999px;
  padding: 2px 5px;
  font-size: 8.5px;
  font-weight: 700;
}

.studio-dm-search-result.is-chat, .studio-dm-search-result.is-message {
  align-items: center;
}

.studio-dm-search-result-labels {
  flex-wrap: wrap;
  grid-column: 1 / -1;
  gap: 3px;
  width: 100%;
  display: flex;
}

.studio-dm-search-result-labels > span {
  background: color-mix(in srgb, var(--mos-text) 7%, transparent);
  color: var(--color-cursor-muted, var(--mos-muted));
  border-radius: 999px;
  align-items: center;
  gap: 3px;
  padding: 1px 5px;
  font-size: 8.5px;
  font-weight: 650;
  display: inline-flex;
}

.studio-dm-search-result-labels svg {
  width: 9px;
  height: 9px;
}

.studio-dm-search-result.is-label {
  grid-template-columns: auto minmax(0, 1fr);
}

.studio-dm-search-label-icon {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 10%,
    transparent);
  width: 28px;
  height: 28px;
  color: var(--cursor-accent, var(--mos-accent));
  border-radius: 8px;
  place-items: center;
  display: grid;
}

.studio-dm-search-label-icon svg {
  width: 14px;
  height: 14px;
}

.studio-dm-search-empty {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-align: center;
  justify-items: center;
  gap: 4px;
  padding: 32px 16px;
  display: grid;
}

.studio-dm-search-empty svg {
  opacity: .65;
  width: 24px;
  height: 24px;
  margin-bottom: 3px;
}

.studio-dm-search-empty strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 12px;
}

.studio-dm-search-empty span {
  max-width: 220px;
  font-size: 10.5px;
  line-height: 1.4;
}

.studio-dm-empty {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: var(--desk-text-sm, 12px);
  margin: 0;
  padding: 14px 12px;
  font-weight: 550;
  line-height: 1.4;
}

.studio-dm-empty-state {
  box-sizing: border-box;
  text-align: center;
  width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 6px;
  margin-inline: auto;
  padding: 16px;
  display: flex;
}

.studio-dm-empty-state.is-select {
  padding: 16px;
}

.studio-dm-empty-state svg {
  opacity: .55;
  width: 28px;
  height: 28px;
  margin-bottom: 4px;
}

.studio-dm-empty-state strong {
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 13px;
  font-weight: 600;
}

.studio-dm-empty-state p {
  max-width: 22rem;
  font-size: var(--desk-text-sm, 12px);
  margin: 0;
  line-height: 1.45;
}

.studio-dm-rail-row {
  width: 100%;
  min-width: 0;
  height: var(--studio-search-h, var(--cursor-head-h, 36px));
  min-height: var(--studio-search-h, var(--cursor-head-h, 36px));
  max-height: var(--studio-search-h, var(--cursor-head-h, 36px));
  box-sizing: border-box;
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  padding-right: 6px;
  display: flex;
  overflow: visible;
}

.studio-dm-label-rail {
  --cursor-h-scroll-fade-pad: 8px;
  --cursor-h-scroll-fade-gap: 4px;
  box-sizing: border-box;
  white-space: nowrap;
  touch-action: pan-x;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  flex-flow: row;
  flex: 1 1 0;
  align-items: center;
  gap: 4px;
  width: 0;
  min-width: 0;
  max-width: 100%;
  height: 100%;
  padding: 0;
  display: flex;
  overflow: auto hidden;
  flex-wrap: nowrap !important;
}

.studio-dm-label-rail::-webkit-scrollbar {
  display: none;
}

.studio-dm-chat-filter.desk-explorer-type-filter {
  z-index: 3;
  flex: none;
  margin-left: 2px;
  padding-left: 8px;
  position: relative;
}

.studio-dm-chat-filter.desk-explorer-type-filter:before {
  content: "";
  background: var(--color-cursor-border, var(--studio-chrome-divider));
  pointer-events: none;
  width: 1px;
  height: 14px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.studio-dm-chat-filter .desk-explorer-type-filter-trigger .icon-inline, .studio-dm-chat-filter .desk-explorer-type-filter-trigger > svg:first-child {
  flex: none;
  width: 13px;
  height: 13px;
}

.studio-dm-chat-filter .desk-explorer-type-filter-clear > svg {
  width: 12px;
  height: 12px;
}

.studio-dm-chat-filter-menu .cursor-dropdown-item.is-online svg {
  color: #3dd68c;
  fill: #3dd68c;
}

.studio-dm-label-chip {
  height: var(--studio-chip-h, 26px);
  padding: 0 var(--studio-chip-pad-x, 10px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px));
  background: var(--mos-plate, var(--color-cursor-sidebar));
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  font-size: var(--studio-chip-fs, var(--studio-fs-sm, 12px));
  white-space: nowrap;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  border: none;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 4px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-label-chip > span {
  align-items: center;
  line-height: 1;
  display: inline-flex;
  transform: translateY(.5px);
}

.studio-dm-label-chip > svg {
  width: var(--studio-chip-icon, 12px);
  height: var(--studio-chip-icon, 12px);
  color: inherit;
  stroke: currentColor;
  flex: none;
  display: block;
}

.studio-dm-label-chip-count {
  min-width: var(--studio-chip-count-h, 16px);
  height: var(--studio-chip-count-h, 16px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px));
  background: color-mix(in srgb, currentColor 16%, transparent);
  color: inherit;
  font-size: var(--studio-chip-count-fs, var(--studio-fs-xs, 11px));
  font-variant-numeric: tabular-nums;
  justify-content: center;
  align-items: center;
  margin-left: 1px;
  padding: 0 5px;
  font-weight: 750;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-label-chip.is-active {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 12%,
    var(--mos-plate, var(--color-cursor-sidebar)));
  color: var(--color-cursor-text-bright, var(--mos-text));
  border: none;
}

.studio-dm-label-chip.is-add {
  color: var(--color-cursor-muted, var(--mos-muted));
  padding: 0 7px;
}

.studio-dm-label-chip.is-add:hover {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

@media (max-width: 899px) {
  .studio-polish.is-studio-mobile .studio-dm-rail-row {
    flex-wrap: nowrap;
    height: 40px;
    min-height: 40px;
    max-height: 40px;
    padding-right: 8px;
  }

  .studio-polish.is-studio-mobile .studio-dm-sidebar .cursor-panel-search-end .studio-dm-chat-filter {
    height: var(--studio-mobile-chrome-control, 30px);
    flex: none;
    margin: 0;
    padding: 0;
  }

  .studio-polish.is-studio-mobile .studio-dm-sidebar .cursor-panel-search-end .studio-dm-chat-filter:before {
    display: none;
  }

  .studio-polish.is-studio-mobile .studio-dm-sidebar .cursor-panel-search-end .desk-explorer-type-filter-trigger.is-icon-only {
    width: var(--studio-mobile-chrome-control, 30px);
    min-width: var(--studio-mobile-chrome-control, 30px);
    height: var(--studio-mobile-chrome-control, 30px);
    justify-content: center;
    padding: 0 8px;
    border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px)) !important;
  }

  .studio-polish.is-studio-mobile .studio-dm-label-chip {
    height: max(28px, var(--studio-chip-h, 26px));
    padding: 0 var(--studio-chip-pad-x, 10px);
    font-size: var(--studio-chip-fs, 12px);
  }

  .studio-polish.is-studio-mobile .studio-dm-label-chip > svg {
    width: 13px;
    height: 13px;
  }

  .studio-polish.is-studio-mobile .studio-dm-label-chip.is-add {
    padding: 0 9px;
  }

  .studio-polish.is-studio-mobile .studio-dm-provider-tag {
    width: 22px;
    min-width: 22px;
    height: 22px;
    font-size: var(--studio-chip-count-fs, 11px);
    padding: 0 !important;
  }

  .studio-polish.is-studio-mobile .studio-dm-provider-tag > svg {
    width: 11px;
    height: 11px;
  }
}

.studio-dm-label-editor-panel {
  background: var(--mos-page, var(--mos-panel, var(--mos-bg)));
  width: 100%;
  min-height: 0;
  box-shadow: none;
  border: 0;
  border-radius: 0;
  flex-direction: column;
  flex: auto;
  margin: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-label-editor-panel .studio-dm-dialog-head {
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: none;
  padding: 0 8px;
}

.studio-dm-assign-peer {
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.studio-dm-assign-peer strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-assign-peer .studio-profile-avatar {
  --spa-size: 20px;
  --spa-font: 8px;
  flex: none;
}

.studio-dm-assign-peer-divider {
  background: var(--color-cursor-border, var(--mos-border));
  flex: none;
  width: 1px;
  height: 14px;
}

.studio-dm-assign-peer-action {
  color: var(--color-cursor-muted, var(--mos-muted));
  letter-spacing: .035em;
  text-transform: uppercase;
  flex: none;
  font-size: 10px;
  font-weight: 750;
}

.studio-dm-label-editor-panel .studio-dm-dialog-body {
  scrollbar-width: thin;
  flex: auto;
  gap: 12px;
  min-height: 0;
  padding: 12px;
  overflow: auto;
}

.studio-dm-label-editor-panel .studio-dm-icon-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 5px;
}

.studio-dm-label-editor-panel .studio-dm-icon-opt {
  background: var(--mos-plate-strong, var(--cursor-surface-raised, var(--mos-surface)));
  border-color: #0000;
  border-radius: 7px;
}

.studio-dm-label-editor-panel .studio-dm-icon-opt.is-active, .studio-dm-label-editor-panel .studio-dm-icon-opt:hover {
  background: var(--mos-active, var(--mos-plate-strong));
  border-color: #0000;
}

.studio-dm-label-editor-panel .studio-dm-icon-opt.is-active {
  outline: 1px solid
    color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 55%, transparent);
  outline-offset: -1px;
}

.studio-dm-label-editor-panel .studio-dm-dialog-field input {
  background: var(--mos-plate, var(--cursor-surface-input, var(--mos-surface)));
}

.studio-dm-label-editor-panel .studio-dm-dialog-foot {
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-page, var(--mos-panel));
  flex: none;
  padding: 10px 12px;
}

.studio-dm-dialog-head .studio-dm-dialog-ghost {
  width: auto;
  height: var(--studio-dm-chrome-circle, 24px);
  min-height: var(--studio-dm-chrome-circle, 24px);
  max-height: var(--studio-dm-chrome-circle, 24px);
  background: var(--mos-plate-strong, var(--mos-raised));
  color: var(--color-cursor-text, var(--mos-text));
  border: 0;
  border-radius: 999px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 750;
  line-height: 1;
}

.studio-dm-dialog-head .studio-dm-dialog-ghost:hover:not(:disabled) {
  filter: brightness(1.04);
}

.studio-dm-dialog-head .studio-dm-dialog-ghost svg, .studio-dm-dialog-head .studio-dm-dialog-primary svg {
  flex: none;
  width: 13px;
  height: 13px;
}

.studio-dm-label-editor-panel .studio-dm-dialog-field textarea {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--mos-plate, var(--cursor-surface-input, var(--mos-surface)));
  min-height: 88px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  resize: vertical;
  border-radius: 8px;
  outline: none;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 1.4;
}

.studio-dm-label-editor-panel .studio-dm-dialog-field textarea:focus-visible {
  border-color: var(--cursor-border-focus, var(--cursor-accent));
}

.studio-dm-label-editor-panel .studio-group-create-body, .studio-dm-label-editor-panel .studio-bot-create-body {
  flex-direction: column;
  gap: 10px;
  padding: 10px;
  display: flex;
  overflow: hidden;
}

.studio-group-create-body > .studio-chrome-settings-card, .studio-bot-create-body > .studio-chrome-settings-card {
  flex: none;
}

.studio-group-create-people-card {
  flex: auto;
  grid-template-rows: auto minmax(0, 1fr);
  min-height: 0;
  display: grid;
}

.studio-group-create-people-card .studio-chrome-settings-card-body {
  flex-direction: column;
  flex: auto;
  gap: 8px;
  min-height: 0;
  padding: 8px 8px 10px;
  display: flex;
  overflow: hidden;
}

.studio-group-create-people-card .cursor-panel-search, .studio-polish .studio-group-create-people-card .cursor-panel-search {
  background: var(--mos-page, var(--mos-panel));
  margin: 0 2px;
}

.studio-group-create-body > .studio-chrome-settings-card:first-child .studio-chrome-settings-card-body, .studio-bot-create-body > .studio-chrome-settings-card .studio-chrome-settings-card-body {
  gap: 10px;
  padding: 10px 12px 12px;
}

.studio-group-create-body button.studio-chrome-settings-row:last-child:hover {
  border-radius: 8px;
}

.studio-dm-label-editor-panel .studio-people-search-block {
  border: 0;
  flex: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
}

.studio-dm-context-lead {
  align-self: stretch;
  min-width: 0;
}

.studio-mobile-app-menu-sheet.studio-dm-context-sheet {
  height: auto;
  max-height: min(48dvh,
    var(--studio-mobile-app-menu-sheet-band, 48dvh));
  z-index: 72;
}

.studio-dm-context-sheet-body {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  min-height: 0;
  padding: 4px var(--studio-sheet-inline-pad, 12px) 12px;
  flex-direction: column;
  flex: auto;
  display: flex;
  overflow: hidden auto;
}

.studio-dm-context-sheet .cursor-tab-context-item {
  border-radius: 10px;
  min-height: 44px;
  padding: 12px;
  font-size: 15px;
}

.studio-dm-context-menu .cursor-tab-context-item.is-confirm, .studio-dm-context-sheet .cursor-tab-context-item.is-confirm {
  background: color-mix(in srgb, var(--mos-danger, #e5484d) 18%, var(--mos-plate-strong, var(--mos-plate)));
  color: var(--mos-danger, #e5484d);
  font-weight: 600;
}

.studio-dm-dialog-backdrop {
  z-index: 80;
  background: #0000008c;
  place-items: center;
  padding: 16px;
  display: grid;
  position: fixed;
  inset: 0;
}

.studio-dm-dialog {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--mos-panel, var(--mos-bg));
  border-radius: 12px;
  flex-direction: column;
  width: min(100%, 360px);
  max-height: min(86vh, 560px);
  display: flex;
  overflow: hidden;
  box-shadow: 0 18px 48px #00000059;
}

.studio-dm-dialog-head {
  height: var(--cursor-head-h, 36px);
  min-height: var(--cursor-head-h, 36px);
  max-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  box-sizing: border-box;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  display: flex;
}

.studio-dm-dialog-head strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  overflow: hidden;
}

.studio-dm-dialog-head-actions {
  flex: none;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  display: inline-flex;
}

.studio-dm-dialog-head .studio-dm-dialog-primary, .studio-dm-dialog-head .studio-dm-dialog-danger {
  width: auto;
  height: var(--studio-dm-chrome-circle, 24px);
  min-height: var(--studio-dm-chrome-circle, 24px);
  max-height: var(--studio-dm-chrome-circle, 24px);
  letter-spacing: .01em;
  border-radius: 999px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 750;
  line-height: 1;
}

.studio-dm-dialog-head .studio-dm-dialog-primary {
  box-shadow: none;
  border: 0;
}

.studio-dm-dialog-head .studio-dm-dialog-primary svg, .studio-dm-dialog-head .studio-dm-dialog-danger svg {
  flex: none;
  width: 13px;
  height: 13px;
}

.studio-dm-dialog-head .studio-dm-dialog-primary:hover:not(:disabled) {
  filter: brightness(1.06);
}

.studio-dm-dialog-head .studio-dm-dialog-danger {
  padding: 0 10px;
}

.studio-dm-dialog-head .studio-composer-circle-btn.studio-dm-label-close {
  border-radius: 999px;
  padding: 0;
  width: var(--studio-dm-chrome-circle, 24px) !important;
  min-width: var(--studio-dm-chrome-circle, 24px) !important;
  max-width: var(--studio-dm-chrome-circle, 24px) !important;
  height: var(--studio-dm-chrome-circle, 24px) !important;
  min-height: var(--studio-dm-chrome-circle, 24px) !important;
  max-height: var(--studio-dm-chrome-circle, 24px) !important;
}

.studio-dm-dialog-head .studio-composer-circle-btn.studio-dm-label-close svg {
  width: var(--studio-dm-chrome-glyph, 13px);
  height: var(--studio-dm-chrome-glyph, 13px);
}

.studio-dm-dialog-body {
  flex-direction: column;
  flex: auto;
  gap: 12px;
  min-height: 0;
  padding: 12px;
  display: flex;
  overflow: auto;
}

.studio-dm-dialog-field {
  gap: 6px;
  display: grid;
}

.studio-dm-dialog-field > span {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 11px;
  font-weight: 700;
}

.studio-dm-dialog-field input {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-input, var(--mos-surface));
  height: 34px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  border-radius: 8px;
  outline: none;
  padding: 0 10px;
  font-size: 13px;
}

.studio-dm-dialog-field input:focus-visible {
  border-color: var(--cursor-border-focus, var(--cursor-accent));
}

.studio-dm-icon-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  display: grid;
}

.studio-dm-icon-opt {
  aspect-ratio: 1;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--cursor-surface-raised, var(--mos-surface));
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  border-radius: 8px;
  place-items: center;
  display: grid;
}

.studio-dm-icon-opt.is-active, .studio-dm-icon-opt:hover {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 50%, var(--mos-border));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-dm-icon-opt.is-active {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 14%,
    var(--cursor-surface-raised, var(--mos-surface)));
}

.studio-dm-dialog-foot {
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
}

.studio-dm-dialog-actions {
  align-items: center;
  gap: 6px;
  display: inline-flex;
}

.studio-dm-dialog-primary, .studio-dm-dialog-ghost, .studio-dm-dialog-danger {
  height: 30px;
  font: inherit;
  cursor: pointer;
  border: 1px solid #0000;
  border-radius: 8px;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.studio-dm-dialog-primary {
  background: var(--cursor-accent, var(--mos-accent));
  color: var(--cursor-on-accent, #fff);
}

.studio-dm-dialog-primary:disabled {
  opacity: .55;
  cursor: default;
}

.studio-dm-dialog-ghost {
  border-color: var(--color-cursor-border, var(--mos-border));
  color: var(--color-cursor-text, var(--mos-text));
  background: none;
}

.studio-dm-dialog-danger {
  border-color: color-mix(in srgb, var(--mos-danger, #f87171) 40%, var(--mos-border));
  color: var(--mos-danger, #f87171);
  background: none;
}

.studio-dm-assign-list {
  background: none;
  border-radius: 0;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-dm-assign-row {
  box-sizing: border-box;
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--mos-bg));
  width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  border: 0;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  display: flex;
}

.studio-dm-assign-row:hover {
  background: var(--mos-plate-strong, var(--mos-raised));
}

.studio-dm-assign-checkbox {
  appearance: none;
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  background: var(--mos-page, var(--mos-surface));
  cursor: pointer;
  border-radius: 3px;
  flex: none;
  width: 14px;
  height: 14px;
  margin: 0;
  position: relative;
}

.studio-dm-assign-checkbox:checked {
  border-color: var(--cursor-accent, var(--mos-accent));
  background: var(--cursor-accent, var(--mos-accent));
}

.studio-dm-assign-checkbox:checked:after {
  content: "";
  border: 1.5px solid #fff;
  border-width: 0 1.5px 1.5px 0;
  width: 4px;
  height: 7px;
  position: absolute;
  top: 1px;
  left: 3.5px;
  transform: rotate(45deg);
}

.studio-dm-assign-icon {
  width: 14px;
  height: 14px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-dm-assign-row:hover .studio-dm-assign-icon {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-dm-assign-name {
  min-width: 0;
  font-size: var(--desk-text-sm, 12px);
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--color-cursor-text, var(--mos-text));
  flex: auto;
  font-weight: 500;
  line-height: 1.25;
  overflow: hidden;
}

.studio-dm-name-text {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-agent-badge {
  border-radius: var(--cursor-radius-pill, 999px);
  background: color-mix(in srgb, var(--cursor-accent) 14%, var(--mos-plate));
  height: 16px;
  color: var(--cursor-accent);
  font-size: 9px;
  font-weight: var(--desk-w-bold, 700);
  flex: none;
  align-items: center;
  gap: 3px;
  padding: 0 6px;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-agent-badge > svg {
  width: 9px;
  height: 9px;
}

.studio-dm-agent-request {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate-strong);
  min-height: 28px;
  color: var(--color-cursor-text-muted);
  font-size: var(--desk-text-xs, 11px);
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin: 2px 0 8px;
  padding: 6px 8px;
  display: flex;
}

.studio-dm-agent-request-meta {
  align-items: center;
  gap: 5px;
  min-width: 0;
  display: inline-flex;
}

.studio-dm-agent-request-meta > svg {
  width: 11px;
  height: 11px;
  color: var(--cursor-accent);
  flex-shrink: 0;
}

.studio-dm-agent-request-source {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-agent-request-meta > strong {
  color: inherit;
  font-size: 10px;
  font-weight: var(--desk-w-semibold, 600);
  letter-spacing: .02em;
}

.studio-dm-agent-request-actions {
  align-items: center;
  gap: 4px;
  margin-left: auto;
  display: inline-flex;
}

.studio-dm-agent-request.is-resolved {
  color: var(--mos-success);
}

.studio-dm-agent-request.is-failed {
  color: var(--mos-danger);
}

.studio-dm-agent-request.is-cancelled {
  color: var(--color-cursor-text-muted);
}

.studio-dm-agent-request.is-answered, .studio-dm-agent-request.is-resuming {
  color: var(--cursor-accent);
}

.studio-dm-agent-request-actions > button {
  border-radius: var(--cursor-radius-pill, 999px);
  background: var(--mos-plate);
  min-height: 22px;
  color: inherit;
  font: inherit;
  font-weight: var(--desk-w-semibold, 600);
  cursor: pointer;
  border: 0;
  padding: 0 8px;
}

.studio-dm-agent-request-actions > button:hover {
  background: var(--mos-page);
}

.studio-dm-provider-tag {
  width: 20px;
  min-width: 20px;
  max-width: none;
  height: 20px;
  font-size: var(--studio-chip-count-fs, var(--studio-fs-xs, 11px));
  white-space: nowrap;
  vertical-align: middle;
  border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px));
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 0;
  margin-left: 0;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
  overflow: visible;
  padding: 0 !important;
}

.studio-dm-provider-tag > svg {
  flex: none;
  width: 11px;
  height: 11px;
}

.studio-dm-provider-tag.is-icon-only {
  width: 20px;
  min-width: 20px;
  padding: 0 !important;
}

.studio-dm-row-top strong, .studio-dm-search-result-copy strong {
  align-items: center;
  gap: 5px;
  min-width: 0;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-peer-shared-list {
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.studio-dm-peer-shared-row {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate, var(--cursor-surface-raised));
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  display: flex;
}

.studio-dm-peer-unshare-group {
  flex: none;
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.studio-dm-peer-unshare-cancel {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  width: auto;
  min-width: 22px;
  height: 22px;
  color: var(--color-cursor-muted);
  cursor: pointer;
  flex: none;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0 6px;
  display: inline-flex;
}

.studio-dm-peer-unshare-cancel > svg {
  width: 12px;
  height: 12px;
}

.studio-dm-peer-unshare-cancel:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.studio-dm-peer-unshare {
  appearance: none;
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  min-height: 22px;
  color: var(--mos-danger, #ef4444);
  font: inherit;
  cursor: pointer;
  transition: background var(--cursor-ease, .12s ease), border-color var(--cursor-ease, .12s ease);
  flex: none;
  margin: 0;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 650;
}

.studio-dm-peer-unshare:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--mos-danger, #ef4444) 35%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 12%, var(--mos-plate));
}

.studio-dm-peer-unshare.is-confirm {
  border-color: color-mix(in srgb, var(--mos-danger, #ef4444) 45%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 18%, var(--mos-plate-strong));
  color: var(--mos-danger, #ef4444);
}

.studio-dm-peer-unshare:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.studio-dm-peer-shared-copy {
  flex: auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-dm-peer-shared-copy > div {
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  display: flex;
}

.studio-dm-peer-shared-copy strong, .studio-dm-peer-shared-copy span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-dm-peer-shared-copy img, .studio-dm-peer-shared-fallback {
  object-fit: cover;
  background: var(--mos-plate);
  width: 32px;
  height: 32px;
  color: var(--color-cursor-muted);
  border-radius: 6px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-dm-peer-shared-fallback > svg {
  width: 14px;
  height: 14px;
}

.studio-dm-peer-shared-copy strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
  display: block;
  overflow: hidden;
}

.studio-dm-peer-shared-copy span {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.studio-dm-peer-sidebar {
  background: var(--mos-page, var(--color-cursor-bg));
}

.studio-dm-peer-sidebar .cursor-panel-head {
  gap: 4px;
  overflow: visible;
}

.studio-polish:not(.is-studio-mobile) .studio-dm-peer-sidebar > .cursor-panel-head.cursor-sidebar-head {
  box-sizing: border-box;
  height: auto;
  min-height: 0;
  max-height: none;
  padding: 8px 8px 0;
  background: none !important;
  border-bottom: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-dm-agent-sidebar.is-docked > .cursor-panel-head.cursor-sidebar-head {
  height: auto;
  min-height: 0;
  max-height: none;
  padding: 10px 8px 0;
  background: none !important;
  border-bottom: 0 !important;
}

.studio-dm-peer-sidebar .studio-admin-head-tab, .studio-dm-peer-mobile-tabs .studio-admin-head-tab {
  min-width: 0;
}

.studio-admin-head-tab-badge {
  background: var(--cursor-accent);
  min-width: 16px;
  height: 16px;
  color: var(--cursor-on-accent, #fff);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 4px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-peer-mobile-tabs .studio-admin-head-tab {
  min-height: 24px;
  padding: 0 8px;
  font-size: 11px;
}

.studio-dm-peer-mobile-tabs {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  scrollbar-width: none;
  flex: none;
  min-width: 0;
  padding: 0 10px;
  display: flex;
  overflow: auto hidden;
}

.studio-dm-peer-mobile-tabs .studio-admin-head-tabs {
  height: var(--cursor-head-h, 36px);
  flex: auto;
}

.studio-dm-peer-mobile-tabs::-webkit-scrollbar {
  display: none;
}

.studio-dm-peer-body {
  overscroll-behavior: contain;
  scrollbar-width: none;
  flex-direction: column;
  flex: auto;
  gap: 10px;
  min-height: 0;
  padding: 8px;
  display: flex;
  overflow: hidden auto;
}

.studio-dm-peer-body.is-flush {
  gap: 0;
  padding: 0;
  overflow: hidden;
}

.studio-dm-peer-body.is-flush > .studio-dm-label-editor-panel {
  flex: auto;
  min-height: 0;
}

.studio-dm-peer-body::-webkit-scrollbar {
  display: none;
}

.studio-dm-peer-stack {
  gap: 10px;
  display: grid;
}

.studio-dm-peer-composer, .studio-dm-peer-inline-actions {
  flex-direction: column;
  gap: 8px;
  display: flex;
}

.studio-dm-peer-inline-actions {
  flex-flow: wrap;
}

.studio-dm-peer-composer textarea.cursor-input, .studio-dm-peer-plate textarea.cursor-input {
  resize: vertical;
  min-height: 56px;
}

.studio-dm-peer-sidebar .cursor-settings-action, .studio-dm-peer-mobile-sheet .cursor-settings-action {
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-height: 32px;
  display: inline-flex;
}

.studio-dm-peer-sidebar .cursor-settings-action:disabled, .studio-dm-peer-mobile-sheet .cursor-settings-action:disabled {
  opacity: .45;
  cursor: default;
}

.studio-dm-peer-sidebar .cursor-settings-action > svg, .studio-dm-peer-mobile-sheet .cursor-settings-action > svg {
  flex: none;
  width: 14px;
  height: 14px;
}

.studio-dm-peer-add-note {
  flex: none;
}

.studio-dm-peer-new-label {
  color: var(--color-cursor-muted, var(--mos-muted));
  justify-content: flex-start;
  gap: 8px;
}

.studio-dm-peer-new-label > svg {
  flex: none;
  width: 14px;
  height: 14px;
}

.studio-dm-peer-new-label .studio-dm-assign-name {
  color: inherit;
  font-weight: 600;
}

.studio-dm-peer-new-label:hover {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-dm-peer-list {
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-dm-peer-plate {
  border: 1px solid var(--color-cursor-border, var(--mos-border-soft, var(--mos-border)));
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--cursor-surface-raised, color-mix(in srgb, var(--mos-surface) 92%, var(--mos-bg)));
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  display: flex;
}

.studio-dm-peer-note-body {
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-dm-peer-meta {
  color: var(--color-cursor-muted, var(--mos-muted));
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  font-weight: 600;
  display: flex;
}

.studio-dm-peer-meta-actions {
  gap: 8px;
  display: inline-flex;
}

.studio-dm-peer-meta-actions button {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  width: auto;
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  transition: background var(--cursor-ease, .12s ease), border-color var(--cursor-ease, .12s ease);
  padding: 4px 8px;
  font-size: 10px;
  font-weight: 650;
}

.studio-dm-peer-meta-actions button:hover {
  border-color: var(--color-cursor-border-subtle, var(--color-cursor-border-soft));
  background: var(--color-cursor-hover);
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-dm-peer-meta-actions button.is-danger {
  color: var(--mos-danger, #ef4444);
}

.studio-dm-peer-meta-actions button.is-danger:hover {
  border-color: color-mix(in srgb, var(--mos-danger, #ef4444) 35%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 12%, var(--mos-plate));
  color: var(--mos-danger, #ef4444);
}

.studio-dm-peer-error {
  border-radius: var(--cursor-radius-sm, 6px);
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 12%, transparent);
  color: var(--mos-danger, #ff8f8f);
  margin: 0;
  padding: 6px 8px;
  font-size: 11px;
  font-weight: 600;
}

.studio-dm-peer-text-btn {
  color: var(--color-cursor-muted, var(--mos-muted));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  gap: 4px;
  padding: 0;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-dm-peer-text-btn:hover {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-dm-peer-text-btn > svg {
  width: 12px;
  height: 12px;
}

.studio-dm-peer-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text, var(--mos-text));
  flex: auto;
  font-size: 13px;
  font-weight: 650;
  overflow: hidden;
}

.studio-dm-peer-facts {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin: 0;
  display: grid;
}

.studio-dm-peer-facts > div {
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate-strong, var(--mos-raised));
  padding: 6px 8px;
}

.studio-dm-peer-facts dt {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-transform: uppercase;
  font-size: 9px;
  font-weight: 700;
}

.studio-dm-peer-facts dd {
  color: var(--color-cursor-text, var(--mos-text));
  margin: 2px 0 0;
  font-size: 12px;
  font-weight: 650;
}

.studio-dm-peer-job-card, .studio-dm-peer-offer-card {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border, var(--mos-border-soft, var(--mos-border)));
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--cursor-surface-raised, color-mix(in srgb, var(--mos-surface) 92%, var(--mos-bg)));
  width: 100%;
  color: inherit;
  font: inherit;
  text-align: left;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  padding: 8px 10px;
  display: flex;
}

.studio-dm-peer-job-card {
  cursor: pointer;
  transition: border-color .14s, background .14s;
}

.studio-dm-peer-job-card:hover {
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 32%,
    var(--mos-border));
  background: var(--color-cursor-hover, var(--mos-hover));
}

.studio-dm-peer-card-head {
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  display: flex;
}

.studio-dm-peer-card-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  flex: auto;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.25;
  overflow: hidden;
}

.studio-dm-peer-card-chevron {
  width: 12px;
  height: 12px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.studio-dm-peer-job-card:hover .studio-dm-peer-card-chevron {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-dm-peer-chips {
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  min-width: 0;
  display: flex;
}

.studio-dm-peer-chip {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: color-mix(in srgb, var(--mos-bg) 55%, transparent);
  max-width: 100%;
  height: 17px;
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 3px;
  padding: 0 6px;
  font-size: 9.5px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-peer-chip > svg {
  flex: none;
  width: 9px;
  height: 9px;
}

.studio-dm-peer-chip.is-live {
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 38%, var(--mos-border));
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, transparent);
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-dm-peer-chip.is-done {
  border-color: color-mix(in srgb, #3dd68c 36%, var(--mos-border));
  color: color-mix(in srgb, #3dd68c 78%, var(--mos-text));
  background: #3dd68c1f;
}

.studio-dm-peer-chip.is-wait {
  border-color: color-mix(in srgb, #f5b544 36%, var(--mos-border));
  color: color-mix(in srgb, #f5b544 80%, var(--mos-text));
  background: #f5b5441f;
}

.studio-dm-peer-chip.is-off {
  color: var(--color-cursor-muted, var(--mos-muted));
  opacity: .8;
}

.studio-dm-peer-book {
  border: 1px solid color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 42%,
    var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 16%, transparent);
  height: 22px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0 10px;
  font-size: 10.5px;
  font-weight: 700;
  line-height: 1;
  transition: border-color .14s, background .14s;
  display: inline-flex;
}

.studio-dm-peer-book:hover:not(:disabled) {
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 60%,
    var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 26%, transparent);
}

.studio-dm-peer-book:disabled {
  opacity: .5;
  cursor: default;
}

.studio-dm-peer-section-icon {
  color: var(--color-cursor-muted, var(--mos-muted));
  vertical-align: -1px;
  align-items: center;
  margin-right: 5px;
  display: inline-flex;
}

.studio-dm-peer-identity {
  flex-direction: row;
  align-items: center;
  gap: 10px;
}

.studio-dm-peer-identity > .studio-profile-avatar {
  flex: none;
}

.studio-dm-peer-identity-copy {
  flex-direction: column;
  flex: auto;
  gap: 3px;
  min-width: 0;
  display: flex;
}

.studio-dm-peer-identity-copy strong {
  min-width: 0;
  max-width: 100%;
  color: var(--color-cursor-text, var(--mos-text));
  align-items: center;
  gap: 5px;
  font-size: 13px;
  font-weight: 650;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-peer-handle {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 550;
  overflow: hidden;
}

.studio-dm-peer-biz {
  min-width: 0;
  max-width: 100%;
  color: var(--color-cursor-text, var(--mos-text));
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  display: inline-flex;
}

.studio-dm-peer-biz > svg {
  width: 11px;
  height: 11px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.studio-dm-peer-bio {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--cursor-radius-md, 8px);
  background: color-mix(in srgb, var(--mos-plate, var(--mos-surface)) 70%, transparent);
  white-space: pre-wrap;
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-dm-peer-stat-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  display: grid;
}

.studio-dm-peer-stat {
  text-align: center;
  align-items: center;
  gap: 2px;
  padding: 8px 6px;
}

.studio-dm-peer-stat > svg {
  width: 12px;
  height: 12px;
  color: var(--color-cursor-muted, var(--mos-muted));
  margin-bottom: 1px;
}

.studio-dm-peer-stat > strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 13px;
  font-weight: 700;
  line-height: 1.15;
}

.studio-dm-peer-stat > span {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-transform: uppercase;
  letter-spacing: .02em;
  font-size: 9px;
  font-weight: 700;
}

.studio-dm-peer-contact-list .studio-dm-assign-row {
  gap: 8px;
}

.studio-dm-peer-contact-value {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  max-width: 42%;
  color: var(--color-cursor-muted, var(--mos-muted));
  text-align: right;
  flex: 0 auto;
  font-size: 10px;
  font-weight: 550;
  overflow: hidden;
}

.studio-dm-peer-contact-out {
  width: 11px;
  height: 11px;
  color: var(--color-cursor-muted, var(--mos-muted));
  opacity: .7;
  flex: none;
}

.studio-dm-peer-about-actions {
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding-top: 2px;
  display: grid;
}

.studio-dm-peer-mobile-sheet {
  height: var(--studio-mobile-dm-peer-sheet-height, 48dvh);
  max-height: var(--studio-mobile-dm-peer-sheet-full, 88dvh);
}

.studio-dm-peer-mobile-sheet-body {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-peer-mobile-sheet .studio-dm-peer-mobile-tabs {
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: none;
}

.studio-dm-peer-mobile-sheet .studio-dm-peer-body {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  flex: auto;
  min-height: 0;
  padding: 8px;
  overflow-y: auto;
}

.studio-group-create {
  background: var(--mos-page, var(--mos-panel));
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-group-create-head {
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  padding: 0 8px 0 10px;
  display: flex;
}

.studio-group-create-head strong {
  flex: 1;
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
}

.studio-group-create-body {
  flex-direction: column;
  flex: auto;
  gap: 0;
  min-height: 0;
  padding: 0;
  display: flex;
}

.studio-group-create-name-row {
  flex: none;
  padding: 8px;
}

.studio-group-create-name-row .cursor-input {
  height: 32px;
  min-height: 32px;
  padding: 0 10px;
  font-size: 13px;
}

.studio-people-rail {
  scrollbar-width: thin;
  overscroll-behavior-x: contain;
  flex-wrap: nowrap;
  flex: none;
  align-items: center;
  gap: 8px;
  min-height: 0;
  padding: 0 8px 8px;
  display: flex;
  overflow: auto hidden;
}

.studio-people-rail::-webkit-scrollbar {
  height: 4px;
}

.studio-people-rail-chip {
  background: var(--mos-plate-strong);
  max-width: 148px;
  height: 28px;
  color: var(--mos-text);
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 6px;
  padding: 0 4px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.studio-people-rail-chip .studio-profile-avatar {
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
}

.studio-people-rail-chip span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-people-rail-chip svg {
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.studio-people-search-block {
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex-direction: column;
  flex: auto;
  min-height: 0;
  margin: 0;
  padding: 2px 0;
  display: flex;
}

.studio-people-search-block > .cursor-panel-search, .studio-polish .studio-people-search-block > .cursor-panel-search, .studio-polish .studio-dm-sidebar .studio-people-search-block > .cursor-panel-search, .studio-dm-sidebar .studio-people-search-block > .cursor-panel-search, .studio-dm-peer-sidebar .studio-people-search-block > .cursor-panel-search, .studio-dm-peer-mobile-sheet .studio-people-search-block > .cursor-panel-search {
  border: none;
  width: auto;
}

.studio-people-pick-box, .studio-group-create-people {
  background: none;
  flex-direction: column;
  flex: auto;
  gap: 6px;
  min-height: 0;
  margin: 0;
  padding: 8px;
  list-style: none;
  display: flex;
  overflow: auto;
}

.studio-people-pick-box-hits {
  flex: 0 auto;
  max-height: 180px;
}

.studio-group-create-actions {
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: none;
  gap: 8px;
  padding: 8px;
  display: flex;
}

.studio-group-create-btn {
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate);
  height: 32px;
  min-height: 32px;
  color: var(--mos-text);
  cursor: pointer;
  border: 0;
  flex: 1;
  justify-content: center;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.studio-group-create-btn.is-primary {
  background: var(--mos-plate-strong);
}

.studio-people-pick {
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate);
  width: 100%;
  min-height: 32px;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  border: 0;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  display: flex;
}

.studio-people-pick:hover, .studio-people-pick.is-on {
  background: var(--mos-hover, var(--mos-plate-strong));
}

.studio-people-pick .studio-profile-avatar {
  width: 24px !important;
  min-width: 24px !important;
  max-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
}

.studio-people-pick-copy {
  flex-direction: column;
  flex: auto;
  min-width: 0;
  line-height: 1.2;
  display: flex;
}

.studio-people-pick-copy strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 600;
  overflow: hidden;
}

.studio-people-pick-copy span {
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 11px;
  font-weight: 500;
  overflow: hidden;
}

.studio-people-pick-empty {
  color: var(--color-cursor-muted, var(--mos-muted));
  padding: 12px 6px;
  font-size: 12px;
}

.studio-group-create-body .studio-people-rail {
  padding: 0 4px 2px;
}

.studio-group-create-body .studio-people-pick-box {
  gap: 2px;
  padding: 0 2px 2px;
}

.studio-group-create-body .studio-people-pick {
  background: none;
  border-radius: 8px;
}

.studio-group-create-body .studio-people-pick:hover, .studio-group-create-body .studio-people-pick.is-on {
  background: var(--mos-plate-strong);
}

.studio-people-pick-item {
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate);
  align-items: center;
  gap: 4px;
  padding-right: 4px;
  display: flex;
}

.studio-people-pick-item .studio-people-pick {
  background: none;
  flex: auto;
  min-width: 0;
}

.studio-people-pick-item .studio-people-pick:hover, .studio-people-pick-item .studio-people-pick.is-on {
  background: none;
}

.studio-people-pick-item:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
}

.studio-people-pick-role {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-transform: capitalize;
  flex: none;
  font-size: 11px;
  font-weight: 600;
}

.studio-people-pick-action {
  border-radius: var(--cursor-radius-sm, 6px);
  height: 24px;
  color: var(--color-cursor-muted, var(--mos-muted));
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
  padding: 0 6px;
  font-size: 11px;
  font-weight: 600;
}

.studio-people-pick-action:hover {
  background: var(--mos-hover, var(--mos-plate));
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-group-info {
  flex-direction: column;
  flex: auto;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-group-info-people {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
}

.studio-group-info-identity {
  text-align: left;
  flex-direction: row;
  flex: none;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  display: flex;
}

.studio-group-info-identity .studio-people-pick-copy {
  flex: auto;
  align-items: flex-start;
}

.studio-group-info-identity .studio-people-pick-copy strong, .studio-group-info-identity .studio-people-pick-copy span {
  max-width: 100%;
}

.studio-group-info .studio-people-search-block {
  flex: none;
}

.studio-group-info .studio-people-search-block:has(.studio-people-pick-box-hits) {
  flex: 0 auto;
  min-height: 0;
}

.studio-group-info-actions .cursor-settings-action, .studio-dm-peer-stack > .cursor-settings-action {
  background: var(--mos-plate);
  align-items: center;
  gap: 8px;
  height: 32px;
  min-height: 32px;
  padding: 0 10px;
  font-size: 12px;
  display: inline-flex;
}

.studio-group-info-list {
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: auto;
  min-height: 0;
  overflow-y: auto;
}

.studio-people-search-block + .studio-group-info-list {
  border-top: none;
}

.studio-group-info-settings {
  flex-direction: column;
  flex: auto;
  justify-content: flex-start;
  gap: 8px;
  min-height: 0;
  padding: 8px;
  display: flex;
  overflow: hidden auto;
}

.studio-group-info-settings > .studio-chrome-settings-card {
  flex: none;
}

.studio-dm-reactions {
  background: var(--mos-plate, var(--color-cursor-sidebar));
  z-index: 2;
  border-radius: 999px;
  align-items: center;
  gap: 0;
  margin-top: -7px;
  padding: 1px 5px;
  display: inline-flex;
  position: relative;
}

.studio-dm-bubble-row.is-mine .studio-dm-reactions {
  align-self: flex-end;
}

.studio-dm-reaction {
  height: 18px;
  color: var(--mos-text);
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 0;
  align-items: center;
  padding: 0 1px;
  font-size: 14px;
  line-height: 1;
  transition: transform .12s;
  display: inline-flex;
}

.studio-dm-reaction:hover {
  transform: scale(1.2);
}

.studio-dm-reaction-count {
  color: var(--mos-text-muted);
  margin-left: 2px;
  font-size: .65rem;
  font-weight: 650;
}

.studio-dm-react-bar {
  box-sizing: border-box;
  background: var(--mos-plate, var(--color-cursor-sidebar));
  scrollbar-width: none;
  -ms-overflow-style: none;
  border-radius: 999px;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-self: stretch;
  align-items: center;
  gap: 0;
  width: auto;
  margin: 0 0 2px;
  padding: 2px 4px;
  display: flex;
  overflow: auto hidden;
}

.studio-add-menu.studio-action-menu.studio-dm-context-menu:has(.studio-dm-react-bar) {
  width: max-content !important;
  min-width: 0 !important;
  max-width: min(280px, 100vw - 24px) !important;
}

.studio-add-menu.studio-action-menu.studio-dm-context-menu.is-edge:has(.studio-dm-react-bar) {
  max-width: min(280px, 100vw) !important;
}

.studio-add-menu.studio-action-menu.studio-dm-context-menu.is-edge .studio-action-menu-title-sizer {
  display: none;
}

.studio-add-menu.studio-action-menu.studio-dm-context-menu:has(.studio-dm-react-bar) .studio-dm-react-bar {
  contain: inline-size;
  box-sizing: border-box;
  width: 0;
  min-width: 100%;
  max-width: 100%;
  overflow: auto hidden;
}

.studio-add-menu.studio-action-menu.studio-dm-context-menu:not(.is-edge) .studio-dm-react-bar-btn {
  width: 24px;
  height: 24px;
  font-size: 1rem;
}

.studio-add-menu.studio-action-menu.studio-dm-context-menu:not(.is-edge) .studio-dm-react-bar-btn .studio-emoji {
  width: 1em;
  height: 1em;
}

.studio-dm-react-bar::-webkit-scrollbar {
  display: none;
}

.studio-dm-react-bar-btn {
  width: 28px;
  height: 28px;
  color: inherit;
  white-space: nowrap;
  cursor: pointer;
  touch-action: manipulation;
  transform-origin: center;
  background: none;
  border: 0;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  font-size: 1.15rem;
  line-height: 1;
  transition: transform .2s cubic-bezier(.16, 1, .3, 1), background-color .16s;
  display: inline-flex;
}

.studio-dm-react-bar-btn.is-mine {
  background: var(--mos-active, var(--mos-plate));
}

.studio-dm-react-bar-btn .studio-emoji {
  width: 1.15em;
  height: 1.15em;
}

.studio-dm-react-bar-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 70%, transparent);
  outline-offset: 1px;
}

.studio-dm-react-bar-btn:active {
  transform: scale(.94);
}

@media (hover: hover) and (pointer: fine) {
  .studio-dm-react-bar-btn:hover {
    background: var(--mos-hover, var(--mos-plate));
    transform: scale(1.18);
  }

  .studio-dm-react-bar-btn.is-mine:hover {
    background: var(--mos-active, var(--mos-plate));
  }
}

.studio-dm-context-sheet .studio-dm-react-bar {
  margin: 0 0 6px;
  padding: 2px 4px;
}

.studio-dm-context-sheet .studio-dm-react-bar-btn {
  width: 44px;
  height: 44px;
  font-size: 1.45rem;
}

@media (prefers-reduced-motion: reduce) {
  .studio-dm-react-bar-btn, .studio-dm-react-bar-btn:active {
    transition: none;
    transform: none;
  }
}

.studio-dm-recording-card {
  background: var(--mos-plate);
  border-radius: 10px;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.studio-dm-bubble-row .studio-dm-bubble-stack:has(.studio-dm-bubble.is-meeting-rec) {
  width: min(40rem, 100%);
  max-width: 100%;
}

.studio-dm-bubble.is-meeting-rec {
  width: 100%;
  max-width: 100%;
  box-shadow: none;
  background: none;
  border: 0;
  padding: 0;
  overflow: visible;
}

.studio-dm-bubble-row.is-mine .studio-dm-bubble.is-meeting-rec {
  background: none;
  border: 0;
}

.studio-dm-bubble.is-meeting-rec .studio-dm-meta {
  align-self: flex-end;
  padding: 4px 4px 0;
}

.studio-chat-video-player.is-meeting {
  width: 100%;
  display: block;
}

.studio-chat-video-player.is-meeting .studio-chat-video-player-stage {
  background: var(--mos-plate);
  border-radius: 10px;
  width: 100%;
}

.studio-chat-video-player.is-meeting .studio-chat-video-player-video {
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: none;
  width: 100%;
  max-width: none;
  max-height: none;
}

.studio-dm-bubble.is-meeting-rec.is-recording-pending {
  width: 100%;
  max-width: 100%;
}

.studio-dm-bubble-row .studio-dm-bubble-stack:has(.studio-dm-bubble.is-recording-pending) {
  width: min(40rem, 100%);
  max-width: 100%;
}

.studio-dm-recording-placeholder {
  aspect-ratio: 16 / 9;
  background: var(--mos-plate, #fff);
  width: 100%;
  color: var(--mos-text, var(--color-cursor-text));
  border-radius: 10px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  display: flex;
}

.studio-dm-recording-placeholder .studio-dm-recording-phase {
  color: var(--color-cursor-muted, var(--mos-muted));
  font-size: 12px;
  font-weight: 500;
}

.studio-dm-recording-placeholder.is-failed {
  background: var(--mos-plate, #fff);
}

.studio-dm-recording-detail {
  margin: 0;
  font-size: 12px;
  font-weight: 500;
}

.studio-dm-recording-overlay {
  background: #00000085;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
  position: absolute;
  inset: auto 0 0;
}

.studio-dm-recording-phase {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 13px;
  font-weight: 550;
}

.studio-dm-recording-overlay .studio-dm-recording-phase {
  color: var(--mos-text, var(--color-cursor-text));
}

.studio-dm-transcript {
  color: var(--mos-text-muted);
  white-space: pre-wrap;
  margin: 4px 0 0;
  padding: 0 6px;
  font-size: .8rem;
}

.studio-dm-transcript.is-failed {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-dm-transcript-card {
  background: var(--mos-plate, var(--cursor-surface-raised, var(--mos-surface)));
  color: inherit;
  font: inherit;
  text-align: left;
  box-sizing: border-box;
  border: 0;
  border-radius: 10px;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 6px 0 2px;
  padding: 8px 10px;
  display: flex;
  position: relative;
  overflow: hidden;
}

button.studio-dm-transcript-card.is-retry {
  cursor: pointer;
}

button.studio-dm-transcript-card.is-retry:hover {
  background: var(--mos-plate-strong, var(--mos-plate));
}

button.studio-dm-transcript-card.is-retry:focus-visible {
  outline: 2px solid var(--cursor-accent, var(--mos-accent));
  outline-offset: 2px;
}

button.studio-dm-transcript-card.is-retry:disabled {
  cursor: default;
  opacity: .72;
}

.studio-dm-transcript-card.is-pending:after {
  content: "";
  background: linear-gradient(105deg,
    transparent 0%,
    color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, transparent) 45%,
    transparent 90%);
  pointer-events: none;
  animation: 1.35s ease-in-out infinite studio-dm-transcript-shimmer;
  position: absolute;
  inset: 0;
  transform: translateX(-120%);
}

.studio-dm-transcript-card-copy {
  z-index: 1;
  letter-spacing: .01em;
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 12px;
  font-weight: 600;
  position: relative;
}

.studio-dm-transcript-eq {
  z-index: 1;
  flex: none;
  align-items: flex-end;
  gap: 2px;
  height: 14px;
  display: inline-flex;
  position: relative;
}

.studio-dm-transcript-eq > i {
  background: var(--cursor-accent, var(--mos-accent));
  border-radius: 999px;
  width: 3px;
  height: 6px;
  animation: .85s ease-in-out infinite studio-dm-transcript-eq;
  display: block;
}

.studio-dm-transcript-eq > i:nth-child(2) {
  animation-delay: .12s;
}

.studio-dm-transcript-eq > i:nth-child(3) {
  animation-delay: .24s;
}

.studio-dm-transcript-eq > i:nth-child(4) {
  animation-delay: .36s;
}

.studio-dm-transcript-eq.is-static > i {
  opacity: .55;
  animation: none;
}

@keyframes studio-dm-transcript-eq {
  0%, 100% {
    opacity: .45;
    height: 5px;
  }

  50% {
    opacity: 1;
    height: 14px;
  }
}

@keyframes studio-dm-transcript-shimmer {
  100% {
    transform: translateX(120%);
  }
}

.studio-dm-agent-card, .studio-dm-generate-sheet {
  background: var(--mos-plate, var(--cursor-surface-raised));
  border-radius: 10px;
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px;
  display: flex;
}

.studio-dm-generation-card {
  box-sizing: border-box;
  border-radius: 10px;
  gap: 8px;
  width: 100%;
  min-width: 0;
  padding: 10px 12px;
  overflow: visible;
}

.studio-dm-generation-chips {
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.studio-dm-generation-chip {
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  max-width: min(220px, 70%);
  height: 28px;
  color: var(--color-cursor-text);
  border-radius: 999px;
  align-items: center;
  padding: 0 8px;
  font-size: 12px;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-generation-chip > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-dm-generation-chip.is-media {
  border-radius: 8px;
  width: 48px;
  height: 48px;
  padding: 0;
}

.studio-dm-generation-chip.is-media img, .studio-dm-generation-preview-media {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-dm-generation-preview-media {
  z-index: 1;
  border-radius: inherit;
  position: absolute;
  inset: 0;
}

.studio-dm-generation-card .studio-dm-agent-card-head {
  min-height: 20px;
}

.studio-dm-generation-card .studio-dm-agent-card-head strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-generation-card .studio-dm-agent-card-head span {
  white-space: nowrap;
  flex: none;
}

.studio-dm-generation-card .studio-dm-agent-card-field {
  gap: 3px;
  position: relative;
}

.studio-dm-generation-card .studio-dm-agent-card-field > span {
  font-size: 11px;
}

.studio-dm-generation-card textarea.cursor-input {
  min-height: 48px;
  max-height: 92px;
  padding: 7px 8px;
}

.studio-dm-generation-card .studio-dm-agent-card-grid {
  grid-template-columns: repeat(3, minmax(4.5rem, 1fr));
  gap: 8px;
}

.studio-dm-generation-card .studio-dm-agent-card-actions {
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-top: 2px;
  display: flex;
}

.studio-dm-generation-card .studio-dm-agent-card-actions .studio-dm-generation-exclude, .studio-dm-generation-card .studio-dm-agent-card-actions .cursor-icon-btn-sm {
  color: var(--color-cursor-text, var(--mos-text));
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  line-height: 0;
  display: inline-flex;
  background: var(--mos-plate-strong, var(--mos-plate)) !important;
}

.studio-dm-generation-card .studio-dm-agent-card-actions .studio-dm-generation-exclude svg, .studio-dm-generation-card .studio-dm-agent-card-actions .cursor-icon-btn-sm svg {
  width: 16px;
  height: 16px;
  display: block;
}

.studio-dm-generation-card .studio-dm-agent-card-actions .studio-composer-send-btn {
  flex: none;
  margin-left: auto;
}

.studio-dm-generation-card .studio-dm-agent-card-body {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
}

.studio-dm-generate-sheet.studio-composer-options-panel {
  gap: 8px;
  min-height: 0;
  margin: 0;
  padding: 10px 12px;
}

.studio-dm-pane .studio-character-picker.is-overlay, .studio-dm-pane .studio-dm-generate-sheet.is-overlay {
  overflow: hidden;
  min-height: 0 !important;
  max-height: none !important;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings {
  min-height: 0 !important;
}

.studio-dm-agent-card-head {
  align-items: center;
  gap: 8px;
  min-height: 24px;
  font-size: 12px;
  display: flex;
}

.studio-dm-agent-card-head strong {
  font-weight: 600;
}

.studio-dm-agent-card-head span {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin-left: auto;
}

.studio-dm-agent-card-body {
  white-space: pre-wrap;
  margin: 0;
  font-size: 13px;
}

.studio-dm-agent-card-actions {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-dm-agent-card-field {
  min-width: 0;
  color: var(--color-cursor-muted, var(--mos-muted));
  gap: 5px;
  font-size: 11px;
  display: grid;
}

.studio-dm-agent-card-field > .cursor-input, .studio-dm-agent-card-field > textarea {
  resize: vertical;
  width: 100%;
  min-width: 0;
}

.studio-dm-agent-card-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  display: grid;
}

.studio-dm-agent-card-status {
  color: var(--color-cursor-muted, var(--mos-muted));
  align-items: center;
  gap: 6px;
  margin: 0;
  font-size: 12px;
  display: flex;
}

.studio-dm-agent-card-meta {
  color: var(--color-cursor-muted, var(--mos-muted));
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 11px;
  display: flex;
}

.studio-dm-agent-card.is-completed .studio-dm-agent-card-status {
  color: var(--cursor-success, var(--color-cursor-text));
}

.studio-dm-agent-card.is-failed .studio-dm-agent-card-status {
  color: var(--cursor-danger, var(--color-cursor-text));
}

.studio-dm-agent-sidebar-body {
  gap: 12px;
  padding: 12px;
  display: grid;
}

.studio-dm-agent-mobile-sheet .studio-admin-head-tabs {
  flex: none;
}

.studio-dm-agent-mobile-sheet .studio-dm-agent-sidebar-body {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  min-height: 0;
  padding: 12px var(--studio-sheet-inline-pad, 12px) 16px;
  flex: auto;
  overflow: hidden auto;
}

.studio-dm-agent-sidebar .studio-chrome-settings-card-body {
  gap: 10px;
  padding: 10px 12px 12px;
}

.studio-dm-agent-request-list {
  gap: 10px;
  display: grid;
}

.studio-dm-agent-request-list .studio-dm-generation-card {
  width: 100%;
}

.studio-dm-bubble.is-agent-card:has(.studio-dm-run-card) {
  width: 100%;
  max-width: 100%;
  box-shadow: none;
  background: none;
  border: none;
  align-self: stretch;
  padding: 0;
}

.studio-dm-cluster.is-grouped .studio-dm-bubble:has(.studio-dm-run-card) {
  width: 100%;
  max-width: 100%;
  box-shadow: none;
  background: none;
  border: none;
  align-self: stretch;
  padding: 0;
}

.studio-dm-cluster.is-grouped .studio-dm-bubble-row .studio-dm-bubble:has(.studio-dm-run-card) {
  width: 100%;
  max-width: 100%;
  box-shadow: none;
  background: none;
  border: none;
  align-self: stretch;
  padding: 0;
}

.studio-dm-bubble:has(.studio-dm-run-card) > .studio-dm-msg-head {
  display: none;
}

.studio-dm-run-card-actions {
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  display: flex;
}

.studio-dm-run-card-actions .studio-chrome-btn {
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.studio-dm-run-card {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--color-cursor-sidebar));
  text-align: left;
  border-radius: 12px;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  max-width: 100%;
  padding: 10px 12px;
  display: flex;
}

.studio-dm-run-card .studio-dm-agent-card-head {
  justify-content: flex-start;
  gap: 8px;
  min-height: 18px;
  font-size: 11px;
}

.studio-dm-run-card .studio-dm-agent-card-head span {
  margin-left: 0;
}

.studio-dm-run-card .studio-dm-agent-card-head .studio-dm-run-status {
  margin-left: auto;
}

.studio-dm-run-card .studio-dm-agent-card-head strong {
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  min-width: 0;
  font-weight: 600;
  overflow: hidden;
}

.studio-dm-run-status {
  background: var(--mos-plate-strong, var(--mos-plate));
  height: 18px;
  color: var(--color-cursor-muted, var(--mos-muted));
  letter-spacing: .01em;
  text-transform: none;
  white-space: nowrap;
  border-radius: 999px;
  flex: none;
  align-items: center;
  gap: 4px;
  margin-left: auto;
  padding: 0 7px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-run-card.is-running .studio-dm-run-status, .studio-dm-run-status.is-running {
  background: color-mix(in srgb, var(--cursor-accent) 18%, var(--mos-plate));
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-dm-run-card.is-completed .studio-dm-run-status, .studio-dm-run-status.is-completed {
  background: color-mix(in srgb,
    var(--cursor-success, #22c55e) 18%,
    var(--mos-plate));
  color: var(--cursor-success, #16a34a);
}

.studio-dm-run-card.is-failed .studio-dm-run-status, .studio-dm-run-status.is-failed, .studio-dm-run-card.is-cancelled .studio-dm-run-status {
  background: color-mix(in srgb,
    var(--cursor-danger, #ef4444) 16%,
    var(--mos-plate));
  color: var(--cursor-danger, #dc2626);
}

.studio-dm-run-card.is-waiting .studio-dm-run-status, .studio-dm-run-status.is-waiting, .studio-dm-run-card.is-paused .studio-dm-run-status, .studio-dm-run-status.is-paused {
  background: color-mix(in srgb,
    var(--mos-warning, #f59e0b) 18%,
    var(--mos-plate));
  color: var(--mos-warning, #b45309);
}

.studio-dm-run-card.is-restarted .studio-dm-run-status, .studio-dm-run-status.is-restarted {
  background: var(--mos-plate-strong, var(--mos-plate));
  color: var(--color-cursor-text-secondary, var(--mos-muted));
}

.studio-dm-agent-run-block.is-run-jump .studio-dm-run-card {
  outline: 2px solid color-mix(in srgb, var(--cursor-accent) 55%, transparent);
  outline-offset: 2px;
}

.studio-dm-run-spin {
  flex: none;
  animation: .8s linear infinite studio-dm-run-spin;
}

@keyframes studio-dm-run-spin {
  to {
    transform: rotate(360deg);
  }
}

.studio-dm-run-card-update {
  color: var(--color-cursor-muted, var(--mos-muted));
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
  overflow: hidden;
}

.studio-dm-run-card.is-completed .studio-dm-run-card-update {
  color: var(--color-cursor-text, var(--mos-text));
}

@media (prefers-reduced-motion: reduce) {
  .studio-dm-run-spin {
    animation: none;
  }
}

@media (max-width: 520px) {
  .studio-dm-agent-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn.is-generate-send {
  aspect-ratio: auto;
  border: 1px solid color-mix(in srgb, var(--cursor-accent-hover) 52%, var(--cursor-accent) 48%);
  border-bottom-color: color-mix(in srgb, var(--cursor-accent) 62%, #000 28%);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--cursor-accent-hover) 90%, #fff 6%) 0%,
    color-mix(in srgb, var(--cursor-accent) 90%, transparent) 46%,
    color-mix(in srgb, var(--cursor-accent) 70%, #000 24%) 100%);
  color: #fff;
  width: auto;
  min-width: 30px;
  max-width: none;
  height: 30px;
  min-height: 30px;
  box-shadow: inset 0 -2px 0 #00000038,
    0 2px 3px #00000038,
    0 4px 10px color-mix(in srgb, var(--cursor-accent) 18%, transparent);
  gap: 5px;
  padding: 0 10px 0 8px;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn:has(.studio-composer-send-cost) {
  aspect-ratio: auto;
  border: 1px solid color-mix(in srgb, var(--cursor-accent-hover) 52%, var(--cursor-accent) 48%);
  border-bottom-color: color-mix(in srgb, var(--cursor-accent) 62%, #000 28%);
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--cursor-accent-hover) 90%, #fff 6%) 0%,
    color-mix(in srgb, var(--cursor-accent) 90%, transparent) 46%,
    color-mix(in srgb, var(--cursor-accent) 70%, #000 24%) 100%);
  color: #fff;
  width: auto;
  min-width: 30px;
  max-width: none;
  height: 30px;
  min-height: 30px;
  box-shadow: inset 0 -2px 0 #00000038,
    0 2px 3px #00000038,
    0 4px 10px color-mix(in srgb, var(--cursor-accent) 18%, transparent);
  gap: 5px;
  padding: 0 10px 0 8px;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn:has(.studio-composer-send-cost):disabled {
  opacity: .55;
  filter: grayscale(.2);
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn .studio-composer-send-cost {
  letter-spacing: .01em;
  white-space: nowrap;
  color: #fffffff5;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-composer-mode-cluster {
  flex: none;
  align-items: center;
  gap: 6px;
  min-width: 0;
  display: inline-flex;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill, .studio-dm-composer-mode-cluster .studio-composer-options-btn {
  flex: none;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill.is-open, .studio-dm-composer-mode-cluster .studio-composer-options-btn.is-open {
  opacity: 1;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras .studio-composer-send-btn .studio-composer-send-cost {
  letter-spacing: .01em;
  white-space: nowrap;
  flex: none;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings.is-overlay {
  min-height: 0 !important;
}

.studio-dm-generate-kind {
  align-items: center;
  gap: 6px;
  display: flex;
}

.studio-dm-generate-kind .studio-mode-switcher {
  flex: none;
}

.studio-dm-generate-kind .studio-composer-options-btn {
  flex: none;
  margin-left: auto;
}

.studio-dm-generate-sheet.is-settings {
  gap: 8px;
}

.studio-dm-generate-sheet .studio-dm-agent-card-head strong {
  flex: auto;
  min-width: 0;
}

.studio-dm-generate-sheet .studio-dm-agent-card-head .cursor-icon-btn {
  margin-left: auto;
}

.studio-dm-generate-settings-body {
  flex-direction: column;
  flex: auto;
  gap: 10px;
  min-height: 0;
  display: flex;
  overflow: auto;
}

.studio-dm-generate-actions {
  flex: none;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.studio-dm-generate-prompt {
  resize: vertical;
  background: var(--studio-composer-glass, color-mix(in srgb, var(--mos-bg, var(--mos-page)) 88%, transparent));
  width: 100%;
  min-height: 72px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  box-shadow: 0 1px 1px color-mix(in srgb, var(--mos-text) 10%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright, var(--mos-text)) 8%, transparent);
  border: none;
  border-radius: 16px;
  padding: 10px 12px;
  font-size: 13px;
  transition: box-shadow .28s cubic-bezier(.45, 0, .2, 1);
}

.studio-dm-generate-prompt:focus {
  box-shadow: 0 1px 1px color-mix(in srgb, var(--mos-text) 12%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright, var(--mos-text)) 10%, transparent);
  outline: none;
}

[data-appearance="light"] .studio-dm-generate-prompt {
  background: var(--studio-composer-glass, color-mix(in srgb, var(--mos-panel, var(--mos-plate)) 92%, transparent));
}

.studio-dm-bubble.is-agent-card {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-shadow: none;
  background: none;
  border: 0;
  align-self: flex-start;
  padding: 0;
}

:is(.studio-dm-bubble-row:not(.is-mine) .studio-dm-bubble-stack:has(.studio-dm-generation-card), .studio-dm-bubble-row.is-mine .studio-dm-bubble-stack:has(.studio-dm-generation-card)) {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card) {
  border-radius: var(--studio-r-3xl, 16px);
  background: var(--studio-received-fill, var(--mos-plate));
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 8px 11px;
  overflow: clip;
}

.studio-dm-bubble-stack:has(.studio-dm-generation-card.is-settled) {
  width: fit-content;
  max-width: min(100%, 34rem);
}

.studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card.is-settled) {
  border-radius: var(--studio-r-3xl, 16px);
  background: var(--studio-received-fill, var(--mos-plate));
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  width: fit-content;
  max-width: min(100%, 34rem);
  padding: 10px;
  overflow: clip;
}

[data-appearance="dark"] .studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card.is-settled) {
  border-radius: var(--studio-r-3xl, 16px);
  background: var(--studio-received-fill, var(--mos-plate));
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  width: fit-content;
  max-width: min(100%, 34rem);
  padding: 10px;
  overflow: clip;
}

.studio-dm-bubble-row.is-mine .studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card.is-settled) {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 6%,
    var(--mos-page, var(--mos-panel)));
}

[data-appearance="dark"] .studio-dm-bubble-row.is-mine .studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card.is-settled) {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 6%,
    var(--mos-page, var(--mos-panel)));
}

.studio-dm-generation-card.is-settled {
  background: none;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  max-width: min(100%, 34rem);
  padding: 0;
  display: flex;
}

.studio-dm-generation-result-text {
  max-width: 100%;
  color: var(--color-cursor-text, var(--mos-text));
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: none;
  border-radius: 0;
  margin: 0;
  padding: 0 2px;
  font-size: 15px;
  line-height: 1.45;
}

.studio-dm-generation-media-row {
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  display: flex;
}

.studio-dm-generation-media-btn {
  cursor: zoom-in;
  background: none;
  border: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  display: block;
}

.studio-dm-generation-frame {
  box-sizing: border-box;
  width: min(100%,
    calc(min(36dvh, 280px) * min(var(--gen-aspect-w, 1) / var(--gen-aspect-h, 1), 1)));
  max-width: min(72vw, 280px);
  max-height: min(36dvh, 280px);
  aspect-ratio: var(--gen-aspect-ratio, 16 / 9);
  background: #000;
  border-radius: 12px;
  display: block;
  position: relative;
  overflow: hidden;
}

.studio-dm-generation-media {
  object-fit: cover;
  background: #000;
  border-radius: 12px;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  display: block;
}

.studio-dm-generation-mark {
  z-index: calc(var(--studio-z-base) + 2);
  color: #fff;
  pointer-events: none;
  background: #080a0ec7;
  border-radius: 8px;
  place-items: center;
  width: 22px;
  height: 22px;
  display: grid;
  position: absolute;
  top: 6px;
  right: 6px;
}

.studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card.is-failed) {
  background: var(--studio-received-fill, var(--mos-plate));
  gap: 8px;
  width: fit-content;
  max-width: min(100%, 34rem);
  padding: 10px;
}

[data-appearance="dark"] .studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card.is-failed) {
  background: var(--studio-received-fill, var(--mos-plate));
  gap: 8px;
  width: fit-content;
  max-width: min(100%, 34rem);
  padding: 10px;
}

.studio-dm-generation-card.is-failed {
  border-radius: var(--studio-r-3xl, 16px);
  background: var(--studio-received-fill, var(--mos-plate));
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  width: fit-content;
  max-width: min(100%, 280px);
  padding: 10px;
  display: flex;
}

.studio-dm-generation-failed-frame {
  box-sizing: border-box;
  width: min(72vw, 260px);
  max-height: min(40dvh, 320px);
  aspect-ratio: var(--gen-aspect-ratio, 1 / 1);
  color: #fff;
  background: #14161c;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-dm-generation-failed-copy {
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 12px;
  display: flex;
}

.studio-dm-generation-failed-info {
  color: #fff;
  background: #ffffff24;
  border-radius: 999px;
  place-items: center;
  width: 28px;
  height: 28px;
  display: grid;
}

.studio-dm-generation-card.is-failed .studio-dm-generation-retry {
  border-radius: 999px;
  align-self: center;
  width: auto;
  min-width: 88px;
  height: 28px;
  margin-top: 4px;
  padding: 0 14px;
}

.studio-dm-message-block:has(.studio-dm-gen-carousel) {
  width: 100%;
}

.studio-dm-gen-carousel {
  --studio-dm-gen-h: min(36dvh, 280px);
  width: 100%;
  max-width: 100%;
  height: var(--studio-dm-gen-h);
  max-height: var(--studio-dm-gen-h);
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  cursor: grab;
  touch-action: pan-x;
  align-items: stretch;
  gap: 8px;
  display: flex;
  overflow: auto hidden;
}

.studio-dm-gen-carousel:active {
  cursor: grabbing;
  scroll-behavior: auto;
}

.studio-dm-gen-carousel::-webkit-scrollbar {
  display: none;
}

.studio-dm-gen-carousel-slide {
  scroll-snap-align: start;
  scroll-snap-stop: always;
  flex: none;
  align-items: stretch;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  display: flex;
  overflow: hidden;
}

.studio-dm-gen-carousel-slide > .studio-dm-generation-card, .studio-dm-gen-carousel .studio-dm-generation-card.is-failed, .studio-dm-gen-carousel .studio-dm-generation-card.is-settled, .studio-dm-gen-carousel .studio-dm-generation-frame, .studio-dm-gen-carousel .studio-dm-generation-media-row, .studio-dm-gen-carousel .studio-dm-generation-media-btn {
  max-width: none;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  padding: 0;
}

.studio-dm-gen-carousel .studio-dm-generation-failed-frame, .studio-dm-gen-carousel .studio-dm-generation-media {
  object-fit: contain;
  object-position: center;
  width: auto;
  max-width: none;
  height: 100%;
  max-height: 100%;
  display: block;
}

.studio-dm-gen-carousel .studio-dm-generation-failed-frame {
  aspect-ratio: var(--gen-aspect-ratio, 1 / 1);
  width: auto;
  height: 100%;
}

.studio-dm-generation-failed-note {
  max-width: 28ch;
  color: var(--color-cursor-text-muted, var(--mos-muted));
  text-align: center;
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
}

.studio-dm-generation-failed-copy strong {
  letter-spacing: .02em;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}

.studio-dm-generation-failed-copy p {
  color: #ffffffd1;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  max-width: 28ch;
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  display: -webkit-box;
  overflow: hidden;
}

.studio-dm-generation-card.is-failed .studio-chrome-btn, .studio-dm-generation-card.is-failed .studio-dm-generation-retry {
  width: auto;
}

.studio-dm-gen-carousel .studio-dm-generation-media, .studio-dm-gen-carousel .studio-dm-generation-failed-frame {
  width: auto;
  max-width: none;
  height: 100%;
  max-height: 100%;
}

.studio-dm-generation-card .studio-video-progress-card {
  width: fit-content;
  max-width: 100%;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  background: none;
  border: 0;
}

.studio-dm-generation-card .studio-video-progress-card.is-image .studio-video-progress-frame, .studio-dm-generation-card .studio-video-progress-card.is-video .studio-video-progress-frame {
  box-sizing: border-box;
  width: min(100%,
    calc(min(36dvh, 280px) * min(var(--gen-aspect-w, 1) / var(--gen-aspect-h, 1), 1)));
  min-width: 0;
  max-width: min(72vw, 280px);
  height: auto;
  min-height: 0;
  max-height: min(36dvh, 280px);
  aspect-ratio: var(--gen-aspect-ratio, 1 / 1);
}

[data-appearance="dark"] .studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card) {
  background: var(--studio-received-fill, var(--mos-page));
}

.studio-dm-bubble.is-agent-card:has(.studio-dm-generation-card) .studio-dm-generation-card {
  background: none;
  border-radius: 0;
  padding: 0;
}

.studio-dm-generation-card .studio-dm-agent-card-field > span {
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.studio-dm-context-menu .cursor-tab-context-item-icon:has(.studio-agent-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-dm-context-menu .cursor-tab-context-item-icon:has(.studio-profile-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-dm-context-menu .cursor-tab-context-item-icon:has(.studio-dm-mode-menu-agent-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-action-menu.studio-dm-context-menu .cursor-tab-context-item-icon:has(.studio-agent-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-action-menu.studio-dm-context-menu .cursor-tab-context-item-icon:has(.studio-profile-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-action-menu.studio-dm-context-menu .cursor-tab-context-item-icon:has(.studio-dm-mode-menu-agent-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-dm-context-sheet .cursor-tab-context-item-icon:has(.studio-agent-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-dm-context-sheet .cursor-tab-context-item-icon:has(.studio-profile-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-dm-context-sheet .cursor-tab-context-item-icon:has(.studio-dm-mode-menu-agent-avatar) {
  background: none;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

.studio-dm-context-menu .studio-dm-mode-menu-agent-avatar, .studio-dm-context-menu .cursor-tab-context-item-icon .studio-agent-avatar, .studio-dm-context-sheet .studio-dm-mode-menu-agent-avatar, .studio-dm-context-sheet .cursor-tab-context-item-icon .studio-agent-avatar {
  --studio-agent-avatar-size: 18px;
  pointer-events: none;
}

.studio-dm-context-menu .cursor-tab-context-item-icon .studio-profile-avatar, .studio-dm-context-sheet .cursor-tab-context-item-icon .studio-profile-avatar {
  pointer-events: none;
  border-radius: 999px;
  place-items: center;
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
  font-size: 8px;
  overflow: hidden;
  display: inline-flex !important;
}

.studio-dm-context-menu .cursor-tab-context-item-icon .studio-profile-avatar span, .studio-dm-context-sheet .cursor-tab-context-item-icon .studio-profile-avatar span {
  display: inline-flex !important;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras {
  position: relative;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras > .studio-composer-circle-btn, .studio-dm-composer.is-split .studio-dm-composer-row.is-extras > .studio-dm-composer-mode-cluster {
  z-index: auto;
  flex: none;
  position: relative;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn.is-chat-send {
  aspect-ratio: 1;
  border: 1px solid var(--studio-composer-glass-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-plate) 78%, transparent));
  width: 30px;
  min-width: 30px;
  max-width: none;
  height: 30px;
  min-height: 30px;
  color: var(--color-cursor-text, var(--mos-text));
  box-shadow: none;
  gap: 0;
  padding: 0;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn.is-chat-send svg {
  color: currentColor;
  stroke: currentColor;
  filter: none;
}

.studio-dm-composer.is-split .studio-composer-circle-btn.studio-composer-send-btn.is-generate-send {
  z-index: 1;
  position: relative;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings.is-overlay {
  flex-direction: column;
  gap: 0;
  padding: 0;
  display: flex;
  overflow: hidden;
  min-height: 0 !important;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-dm-agent-card-head {
  display: none !important;
}

.studio-dm-generate-settings-body.is-settings-only, .studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-dm-generate-settings-body {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  flex-direction: column;
  flex: auto;
  gap: 14px;
  min-height: 0;
  margin: 0;
  padding: 12px 12px 14px;
  display: flex;
  overflow: auto;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-composer-options-section {
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 0;
  display: flex;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-composer-options-section-label {
  text-align: center;
  letter-spacing: .02em;
  width: 100%;
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  padding: 0;
  font-size: 11px;
  font-weight: 700;
  display: block;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-settings-chip-grid, .studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-settings-chip-grid.is-two, .studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-settings-chip-grid.is-three {
  gap: 6px;
  width: 100%;
  margin: 0;
  padding: 0;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-settings-chip {
  background: var(--mos-plate, var(--color-cursor-sidebar, #1a1f2a));
  box-shadow: none;
  min-height: 32px;
  padding: 6px 10px;
  border: none !important;
  border-radius: 999px !important;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-settings-chip:hover, .studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-settings-chip.is-active {
  background: var(--mos-plate-strong, color-mix(in srgb, var(--mos-plate) 70%, #fff 8%));
  box-shadow: none;
  border: none !important;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-settings-chip.has-ratio-icon, .studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-settings-chip.has-option-icon {
  border-radius: 999px !important;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-inline-settings-range-panel, .studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-inline-audio-setting {
  background: var(--mos-plate, var(--color-cursor-sidebar, #1a1f2a));
  border: none;
  border-radius: 14px;
  margin: 0;
  padding: 8px 10px;
}

.studio-dm-pane .studio-dm-generate-sheet.is-settings .studio-composer-options-body {
  gap: 14px;
  padding: 0;
  overflow: visible;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill {
  appearance: none;
  border: 1px solid var(--studio-composer-glass-border, var(--color-cursor-border-soft, var(--mos-border-soft)));
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--studio-composer-glass-muted, color-mix(in srgb, var(--mos-plate) 78%, transparent));
  height: 30px;
  min-height: 30px;
  color: var(--color-cursor-text, var(--mos-text));
  box-shadow: none;
  cursor: pointer;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0 8px 0 6px;
  display: inline-flex;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill:hover:not(:disabled), .studio-dm-composer-mode-cluster .studio-dm-mode-pill.is-open {
  opacity: 1;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill-preview {
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  pointer-events: none;
  place-items: center;
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
  display: inline-grid;
  overflow: hidden;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill-preview .studio-dm-mode-preview-agent-avatar, .studio-dm-composer-mode-cluster .studio-dm-mode-pill-preview .studio-agent-avatar {
  --studio-agent-avatar-size: 18px;
  pointer-events: none;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill-preview .studio-profile-avatar {
  pointer-events: none;
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
}

.studio-dm-composer-mode-cluster .studio-dm-mode-pill > svg {
  stroke-width: 2.25px;
  pointer-events: none;
  flex: none;
  width: 14px;
  height: 14px;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-dm-composer-mode-cluster .studio-dm-mode-pill {
  height: var(--studio-mobile-chrome-control, 34px);
  min-height: var(--studio-mobile-chrome-control, 34px);
  gap: 5px;
  padding: 0 9px 0 7px;
}

.studio-dm-composer.is-split.is-mobile-icons .studio-dm-composer-mode-cluster .studio-dm-mode-pill > svg {
  stroke-width: 2.2px;
  width: 15px;
  height: 15px;
}

.studio-dm-composer-box > .studio-dm-attach-preview.is-multi {
  width: auto;
  max-width: none;
  margin: 8px 10px 0;
}

.studio-dm-pending-agent-refs .studio-dm-pending-attach-row {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-dm-pending-agent-ref-chip {
  border: 1px solid color-mix(in oklab, var(--studio-border, #fff2) 80%, transparent);
  background: color-mix(in oklab, var(--studio-surface-2, #ffffff10) 70%, transparent);
  max-width: 100%;
  color: inherit;
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  font-size: 12px;
  line-height: 1.2;
  display: inline-flex;
}

.studio-dm-pending-agent-ref-chip:hover {
  background: color-mix(in oklab, var(--studio-surface-2, #ffffff18) 90%, transparent);
}

.studio-dm-pending-agent-ref-kind {
  opacity: .65;
  text-transform: uppercase;
  letter-spacing: .02em;
  font-size: 10px;
  font-weight: 600;
}

.studio-dm-pending-agent-ref-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 12rem;
  overflow: hidden;
}

.studio-dm-composer.is-agent-inline .studio-dm-composer-box {
  position: relative;
}

.studio-dm-composer.is-agent-inline .studio-dm-agent-mention-editor {
  min-width: 0;
  min-height: 24px;
  max-height: 160px;
  color: inherit;
  font: inherit;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  box-sizing: border-box;
  --studio-composer-line-size: 24px;
  --studio-composer-chip-size: 22px;
  --studio-composer-chip-font-size: var(--studio-chip-count-fs, 11px);
  --studio-composer-chip-media-size: 16px;
  --studio-composer-chip-lift: 0px;
  background: none;
  border: 0;
  outline: none;
  flex: auto;
  font-size: 15px;
  line-height: 24px;
  overflow: hidden auto;
}

.studio-dm-composer.is-agent-inline .studio-dm-agent-mention-editor:empty:before {
  content: attr(data-placeholder);
  color: var(--color-cursor-muted, var(--mos-muted, #888));
  opacity: .7;
  pointer-events: none;
}

.studio-dm-composer.is-agent-inline .studio-dm-agent-mention-editor:has( > br:only-child):before {
  content: attr(data-placeholder);
  color: var(--color-cursor-muted, var(--mos-muted, #888));
  opacity: .7;
  pointer-events: none;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag {
  height: var(--studio-composer-chip-size, 18px);
  min-height: var(--studio-composer-chip-size, 18px);
  margin: 0 2px;
  margin-top: calc((var(--studio-composer-line-size) - var(--studio-composer-chip-size)) / 2 -
      var(--studio-composer-chip-lift, 0px));
  vertical-align: top;
  border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px));
  border: 1px solid color-mix(in oklab, var(--studio-border, #fff2) 85%, transparent);
  background: color-mix(in oklab, var(--studio-surface-2, #ffffff12) 88%, transparent);
  font-size: var(--studio-composer-chip-font-size, 11px);
  box-sizing: border-box;
  -webkit-user-select: none;
  user-select: none;
  cursor: grab;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0 8px 0 3px;
  font-weight: 550;
  line-height: 1;
  display: inline-flex;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag.is-dragging {
  opacity: .45;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag-kind {
  width: var(--studio-composer-chip-media-size, 14px);
  height: var(--studio-composer-chip-media-size, 14px);
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  overflow: hidden;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag-kind svg {
  width: 11px;
  height: 11px;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 9rem;
  overflow: hidden;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag--image-only {
  width: var(--studio-composer-chip-size, 18px);
  min-width: var(--studio-composer-chip-size, 18px);
  max-width: var(--studio-composer-chip-size, 18px);
  padding: 0;
  position: relative;
  overflow: hidden;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag--image-only .studio-inline-tag-kind {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag-media {
  object-fit: cover;
  border-radius: 999px;
  width: 100%;
  height: 100%;
}

.studio-dm-composer.is-agent-inline .studio-inline-tag--image-only .studio-inline-tag-overlay {
  display: none;
}

.studio-dm-composer.is-agent-inline .studio-dm-agent-mention-menu {
  z-index: 86;
  border: 1px solid var(--studio-composer-glass-border, var(--color-cursor-border-soft, var(--mos-border)));
  background: var(--studio-composer-glass, var(--color-cursor-panel, var(--mos-panel)));
  max-height: min(240px, 42vh);
  box-shadow: var(--studio-composer-glass-shadow, 0 12px 32px #00000047);
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(150%) blur(5px));
  border-radius: 14px;
  position: fixed;
  bottom: 7rem;
  left: 12px;
  right: 12px;
  overflow: auto;
}

.studio-dm-reference-btn {
  flex: none;
}

.studio-dm-reference-btn.is-on {
  color: var(--cursor-accent, var(--mos-accent));
}

.studio-dm-composer.is-agent-inline.is-drop-target .studio-dm-composer-box, .studio-dm-composer.is-agent-inline .studio-dm-composer-box.is-drop-target {
  outline: 1px dashed color-mix(in oklab, var(--studio-accent, #6ea8ff) 70%, transparent);
  outline-offset: -2px;
}

[data-appearance="light"] .studio-dm-composer.is-agent-inline .studio-inline-tag {
  background: #0000000d;
  background: lab(0% 0 0 / .05);
  border-color: #0000001f;
  border-color: lab(0% 0 0 / .12);
}

.studio-dm-context-sheet-backdrop {
  z-index: 71;
  cursor: pointer;
  pointer-events: auto;
  background: #00000047;
  border: 0;
  margin: 0;
  padding: 0;
  position: fixed;
}

.studio-dm-context-sheet-backdrop.is-frost {
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  z-index: 72;
  filter: none;
  isolation: auto;
  contain: none;
  background: none;
}

@media (prefers-reduced-transparency: reduce) {
  .studio-dm-context-sheet-backdrop.is-frost {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

.studio-dm-context-floating-layer {
  z-index: 72;
  pointer-events: none;
  filter: none;
  isolation: auto;
  contain: none;
  position: fixed;
  inset: 0;
}

.studio-dm-context-floating-layer > * {
  pointer-events: auto;
}

.studio-dm-context-floating {
  z-index: 73;
  left: 4px;
  right: 4px;
  top: calc(var(--studio-mobile-top-chrome, calc(44px + env(safe-area-inset-top, 0px))) + 8px);
  bottom: calc(var(--studio-mobile-bottom-chrome, calc(44px + env(safe-area-inset-bottom, 0px)))
      + var(--studio-keyboard-inset, 0px)
      + 8px);
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: color-mix(in srgb, var(--mos-plate, var(--mos-panel)) 58%, transparent);
  height: fit-content;
  max-height: 100%;
  -webkit-backdrop-filter: var(--studio-composer-glass-blur, saturate(160%) blur(16px));
  backdrop-filter: var(--studio-composer-glass-blur, saturate(160%) blur(16px));
  filter: none;
  isolation: auto;
  contain: none;
  will-change: auto;
  pointer-events: auto;
  opacity: 1;
  border-radius: 16px;
  flex-direction: column;
  margin-top: auto;
  margin-bottom: auto;
  display: flex;
  position: fixed;
  overflow: hidden;
  transform: none;
  box-shadow: 0 12px 40px #00000047, 0 2px 8px #0000001f;
}

.studio-dm-context-floating-head {
  flex: none;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 8px 4px 14px;
  display: flex;
}

.studio-dm-context-floating-title {
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  text-align: left;
  flex: auto;
  font-size: 15px;
  font-weight: 600;
}

.studio-dm-context-floating-close {
  width: 36px;
  height: 36px;
  color: var(--color-cursor-text, var(--mos-text));
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 8px;
  flex: none;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
  display: inline-flex;
}

.studio-dm-context-floating-close svg {
  width: 18px;
  height: 18px;
}

.studio-dm-context-floating-close:hover, .studio-dm-context-floating-close:focus-visible {
  background: color-mix(in srgb, var(--mos-text, #fff) 10%, transparent);
}

.studio-dm-context-floating-body {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  flex-direction: column;
  flex: auto;
  min-height: 0;
  padding: 4px 8px 12px;
  display: flex;
  overflow: hidden auto;
}

.studio-dm-context-floating .cursor-tab-context-item {
  border-radius: 10px;
  min-height: 44px;
  padding: 12px;
  font-size: 15px;
}

@media (prefers-reduced-motion: reduce) {
  .studio-dm-context-floating {
    transition: none;
  }
}

.studio-dm-agent-sidebar .studio-chrome-rail-body.is-files-flush {
  flex-direction: column;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-agent-sidebar-body.is-files {
  flex-direction: column;
  flex: auto;
  gap: 0;
  height: 100%;
  min-height: 0;
  padding: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-agent-files-panel {
  flex-direction: column;
  flex: auto;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-dm-agent-files-panel .cursor-explorer-body, .studio-dm-agent-files-panel .studio-files-drop-zone {
  flex-direction: column;
  flex: auto;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-dm-agent-files-panel .desk-file-tree-scroll {
  flex: 1 1 0;
  min-height: 0;
}

.studio-dm-agent-mobile-tabs {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  scrollbar-width: none;
  flex: none;
  min-width: 0;
  padding: 0 10px;
  display: flex;
  overflow: auto hidden;
}

.studio-dm-agent-mobile-tabs .studio-admin-head-tabs {
  height: var(--cursor-head-h, 36px);
  flex: auto;
}

.studio-dm-agent-mobile-tabs::-webkit-scrollbar {
  display: none;
}

.studio-dm-agent-mobile-sheet .studio-dm-agent-sidebar-body.is-files {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
  padding: 0 !important;
}

.studio-dm-mode-pill, .studio-dm-extra-pill, .studio-dm-composer .studio-settings-pill, .studio-dm-chat-filter-btn, .studio-dm-toolbar-chip, .studio-dm-sidebar-search, .studio-dm-list-filter-chip {
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px)) !important;
}

.studio-dm-mode-pill, .studio-dm-extra-pill, .studio-dm-composer .studio-settings-pill, .studio-dm-chat-filter-btn {
  font-size: var(--studio-fs-md, 14px);
}

.studio-dm-row-time, .studio-dm-meta, .studio-dm-timestamp {
  font-size: var(--studio-fs-sm, 12px);
}

.studio-dm-composer .studio-composer-circle-btn, .studio-dm-composer .studio-composer-send-btn, .studio-dm-composer .studio-dm-composer-circle, .studio-dm-composer .studio-upload-trigger, .studio-composer-toolbar .studio-composer-circle-btn, .studio-composer-toolbar .studio-composer-send-btn, .studio-composer-toolbar .studio-upload-trigger {
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px)) !important;
}

.studio-profile-avatar, .studio-profile-avatar-media, .studio-profile-avatar-fallback, .studio-dm-presence-dot, .studio-presence-dot {
  border-radius: 999px !important;
}

.studio-profile-avatar, .studio-profile-avatar-media, .studio-profile-avatar-fallback {
  border-radius: 50% !important;
}

.studio-dm-mobile-stack {
  isolation: isolate;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: clip;
}

.studio-dm-mobile-stack-list, .studio-dm-mobile-stack-thread {
  content-visibility: visible;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
}

.studio-polish.is-studio-mobile .studio-dm-composer-box, .studio-polish.is-studio-mobile .studio-dm-reply-preview, .studio-polish.is-studio-mobile .studio-dm-jump-down {
  -webkit-backdrop-filter: none;
}

.studio-polish.is-studio-mobile .studio-dm-composer.is-split textarea, .studio-polish.is-studio-mobile .studio-dm-composer.is-split textarea.is-single-line {
  flex: none;
  max-height: 24px;
  overflow-y: hidden;
  height: 24px !important;
  min-height: 24px !important;
}

.studio-polish.is-studio-mobile .studio-dm-composer.is-split textarea:not(.is-single-line) {
  max-height: 120px;
  overflow-y: auto;
}

.studio-dm-mobile-stack-list {
  z-index: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform .28s cubic-bezier(.32, .72, 0, 1), visibility linear;
  transform: translate3d(0, 0, 0);
}

.studio-dm-mobile-stack-thread {
  z-index: 2;
  visibility: visible;
  pointer-events: none;
  transition: transform .28s cubic-bezier(.32, .72, 0, 1);
  transform: translate3d(100%, 0, 0);
}

.studio-dm-mobile-stack.is-thread-open .studio-dm-mobile-stack-list {
  z-index: 1;
  visibility: hidden;
  pointer-events: none;
  transition: transform .28s cubic-bezier(.32, .72, 0, 1), visibility 0s linear .28s;
  transform: translate3d(-24%, 0, 0);
}

.studio-dm-mobile-stack.is-thread-open .studio-dm-mobile-stack-thread {
  z-index: 2;
  visibility: visible;
  pointer-events: auto;
  transition: transform .28s cubic-bezier(.32, .72, 0, 1);
  transform: translate3d(0, 0, 0);
}

.studio-dm-mobile-stack .studio-dm-mobile-stack-list.is-solo, .studio-dm-mobile-stack .studio-dm-mobile-stack-thread.is-solo, .studio-dm-mobile-stack.is-thread-open .studio-dm-mobile-stack-list.is-solo, .studio-dm-mobile-stack.is-thread-open .studio-dm-mobile-stack-thread.is-solo {
  visibility: visible;
  pointer-events: auto;
  transition: none;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .studio-dm-mobile-stack-list, .studio-dm-mobile-stack-thread, .studio-dm-mobile-stack.is-thread-open .studio-dm-mobile-stack-list, .studio-dm-mobile-stack.is-thread-open .studio-dm-mobile-stack-thread {
    transition: none;
  }
}

.studio-polish.is-studio-mobile .studio-dm-sidebar, .studio-polish.is-studio-mobile .studio-dm-sidebar-body, .studio-polish.is-studio-mobile .studio-dm-conversations, .studio-polish.is-studio-mobile .studio-dm-conversations li, .studio-polish.is-studio-mobile .studio-dm-conversations .studio-dm-row, .studio-polish.is-studio-mobile .studio-dm-search-results, .studio-polish.is-studio-mobile .studio-dm-scroll, .studio-polish.is-studio-mobile .studio-dm-scroll .studio-dm-bubble, .studio-polish.is-studio-mobile .studio-dm-scroll .studio-dm-bubble-row, .studio-polish.is-studio-mobile .studio-dm-scroll .studio-dm-image-btn, .studio-polish.is-studio-mobile .studio-dm-scroll .studio-dm-album, .studio-polish.is-studio-mobile .studio-dm-scroll .studio-dm-album-cell, .studio-polish.is-studio-mobile .studio-dm-scroll .studio-dm-feed-share, .studio-polish.is-studio-mobile .studio-dm-scroll .studio-dm-reply-quote {
  touch-action: pan-y !important;
  transition: none !important;
}

.studio-polish.is-studio-mobile .studio-dm-pane:not(.is-inbox):not(.is-in-call) {
  --studio-mobile-nav-clear: calc(max(8px, env(safe-area-inset-bottom, 0px)) + var(--studio-mobile-nav-height, 44px) + 4px);
}

.studio-polish.is-studio-mobile .studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-composer.is-split {
  padding-bottom: 0;
}

.studio-polish.is-studio-mobile .studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-scroll {
  padding-top: calc(var(--studio-dm-head-clear, 64px) + var(--studio-mobile-head-clear, 56px));
  padding-bottom: calc(var(--studio-dm-composer-gap, 48px) + var(--studio-mobile-nav-clear, 62px));
}

.studio-polish.is-studio-mobile .studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-dm-composer-dock {
  bottom: var(--studio-mobile-nav-clear, 62px);
}

.studio-polish.is-studio-mobile .studio-mobile-nav-sections, .studio-polish.is-studio-mobile .studio-mobile-nav-tools {
  align-self: center;
  height: 36px !important;
  max-height: 36px !important;
}

.studio-polish.is-studio-mobile .studio-mobile-nav-btn, .studio-polish.is-studio-mobile .studio-mobile-nav-tools .studio-settings-pill, .studio-polish.is-studio-mobile .studio-mobile-nav-tools .studio-credit-pill {
  align-self: center;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
}

.studio-polish.is-studio-mobile .studio-dm-conversations .studio-dm-row:active {
  transform: none;
}

.studio-composer-frame {
  background: var(--mos-plate) !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent) !important;
  border: 0 !important;
  border-radius: 20px !important;
}

.studio-composer-frame:focus-within {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent) !important;
}

.studio-dm-composer .studio-dm-composer-box.studio-composer-frame, [data-appearance="light"] .studio-dm-composer .studio-dm-composer-box.studio-composer-frame {
  background: var(--mos-page, #fff) !important;
}

[data-appearance="light"] .studio-dm-composer .studio-dm-composer-box.studio-composer-frame {
  background: var(--mos-plate) !important;
}

.studio-dm-composer-reply {
  align-items: center;
  gap: 8px;
  width: calc(100% - 16px);
  max-width: calc(100% - 16px);
  margin: 2px auto 8px;
  display: flex;
}

.studio-dm-composer-reply .studio-dm-reply-quote {
  flex: auto;
  min-width: 0;
}

.studio-dm-composer-reply .studio-dm-attach-clear {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 70%, transparent);
  background: none;
  border-radius: 999px;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  margin: 0;
}

.studio-dm-composer-reply .studio-dm-attach-clear svg {
  width: 12px;
  height: 12px;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras :is(.studio-composer-circle-btn, .studio-settings-pill.studio-dm-extra-pill, .studio-dm-mode-pill) {
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
}

:is(.studio-dm-composer.is-split .studio-dm-composer-row.is-extras .studio-composer-circle-btn:not(.is-generate-send):not(:has(.studio-composer-send-cost)), .studio-dm-composer.is-split .studio-dm-composer-row.is-extras .studio-settings-pill.studio-dm-extra-pill:not(:has(.studio-dm-extra-pill-label))) {
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  padding: 0 !important;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras .studio-composer-circle-btn.is-generate-send, .studio-dm-composer.is-split .studio-dm-composer-row.is-extras .studio-dm-mode-pill {
  border-radius: 999px !important;
  width: auto !important;
  max-width: none !important;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras .studio-composer-circle-btn:has(.studio-composer-send-cost) {
  border-radius: 999px !important;
  width: auto !important;
  max-width: none !important;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras :is(.studio-composer-circle-btn, .studio-settings-pill.studio-dm-extra-pill, .studio-dm-mode-pill):hover:not(:disabled) {
  border-color: var(--color-cursor-border, var(--mos-border)) !important;
  background: var(--mos-hover, var(--color-cursor-hover)) !important;
  color: var(--color-cursor-text-bright, var(--mos-text)) !important;
}

.studio-dm-composer.is-split .studio-dm-composer-row.is-extras :is(.studio-composer-circle-btn, .studio-settings-pill.studio-dm-extra-pill) svg {
  width: var(--studio-dm-chrome-glyph, 13px) !important;
  height: var(--studio-dm-chrome-glyph, 13px) !important;
}

.studio-dm-subagent-pill-wrap {
  flex-direction: column;
  align-items: center;
  gap: 4px;
  width: 100%;
  max-width: 100%;
  display: flex;
}

.studio-dm-subagent-pill {
  border: 1px solid var(--mos-line, color-mix(in srgb, currentColor 12%, transparent));
  background: var(--mos-plate);
  max-width: min(100%, 22rem);
  height: 30px;
  color: var(--color-cursor-text, var(--mos-text));
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  cursor: default;
  border-radius: 999px;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 4px;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1;
  transition: background .12s, border-color .12s;
  display: inline-flex;
}

.studio-dm-subagent-pill[aria-expanded] {
  cursor: pointer;
}

.studio-dm-subagent-pill[aria-expanded]:hover {
  background: var(--mos-plate-strong, var(--mos-plate));
}

.studio-dm-subagent-pill-avatar {
  background: color-mix(in srgb, var(--cursor-accent) 20%, var(--mos-plate));
  width: 22px;
  height: 22px;
  color: var(--color-cursor-text, var(--mos-text));
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-dm-subagent-pill-title {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-subagent-pill .studio-dm-run-status {
  margin-left: 2px;
}

.studio-dm-subagent-pill-update {
  text-align: center;
  max-width: min(100%, 32rem);
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0 auto;
  font-size: 12px;
  line-height: 1.45;
}

.studio-polish.is-studio-mobile .studio-dm-pane .studio-agent-handoff {
  top: calc(max(8px, env(safe-area-inset-top, 0px)) + 44px);
}

.studio-dm-pane .studio-agent-handoff > .studio-dm-chat-head, .studio-polish.is-studio-mobile .studio-dm-pane:not(.is-inbox):not(.is-in-call) .studio-agent-handoff > .studio-dm-chat-head, .studio-polish:not(.is-studio-mobile) .studio-main-column .studio-dm-pane:not(.is-inbox):not(.is-in-call):not(.is-rail-embedded) .studio-agent-handoff > .studio-dm-chat-head {
  z-index: 2;
  pointer-events: auto;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  flex: none;
  gap: 8px;
  padding: 8px 10px;
  position: relative;
  inset: auto;
  background: color-mix(in srgb, var(--mos-page, #05080f) 92%, transparent) !important;
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
}

.studio-agent-handoff > .studio-handoff-scroll {
  z-index: 1;
  padding-top: 12px;
  position: relative;
}

.studio-polish.is-studio-mobile .studio-agent-handoff > .studio-handoff-scroll {
  padding-bottom: calc(max(8px, env(safe-area-inset-bottom, 0px)) + var(--studio-mobile-nav-height, 44px) + 24px);
  scroll-padding-bottom: calc(max(8px, env(safe-area-inset-bottom, 0px)) + var(--studio-mobile-nav-height, 44px) + 24px);
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}

.studio-helper-work .studio-dm-bubble-stack {
  width: 100%;
}

.studio-agent-handoff.is-helper-run .studio-handoff-pair {
  gap: 8px;
  padding: 0 10px 0 6px;
}

.studio-agent-handoff.is-helper-run .studio-handoff-body {
  max-height: none;
}

.studio-helper-step {
  max-width: min(100%, 34rem);
  color: var(--color-cursor-text-muted, var(--mos-muted));
  align-self: flex-end;
  align-items: center;
  gap: 6px;
  padding: 0 6px;
  font-size: 12px;
  line-height: 1.4;
  display: flex;
}

.studio-helper-step > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-helper-step.is-failed {
  color: var(--color-cursor-danger, #f87171);
}

.studio-helper-step.is-progress > span {
  white-space: normal;
}

.studio-helper-kids {
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  padding: 4px 6px 0;
  display: flex;
}

.studio-dm-wa-mark {
  color: #25d366;
  opacity: .9;
  flex: none;
  width: 10px;
  height: 10px;
}

.studio-dm-row-top time .studio-dm-wa-mark, .studio-dm-row-top time .studio-dm-source-mark {
  vertical-align: -1px;
  margin-right: 4px;
  display: inline-block;
}

.studio-dm-source-mark {
  opacity: .9;
  background-color: currentColor;
  flex: none;
  width: 10px;
  height: 10px;
  -webkit-mask: url("/branding/yatishara-logo-light-32.webp") center / contain no-repeat;
  mask: url("/branding/yatishara-logo-light-32.webp") center / contain no-repeat;
}

.studio-dm-ticks.is-failed {
  color: var(--mos-danger, #e5484d);
}

.studio-dm-forwarded {
  color: var(--color-cursor-muted, var(--mos-muted));
  align-items: center;
  gap: 4px;
  margin: 0 0 2px;
  font-size: 10.5px;
  font-style: italic;
  display: flex;
}

.studio-dm-forwarded svg {
  width: 11px;
  height: 11px;
}

.studio-dm-doc-chip {
  background: color-mix(in srgb, var(--color-cursor-muted, #888) 12%, transparent);
  max-width: 260px;
  color: inherit;
  cursor: pointer;
  border-radius: 8px;
  align-items: center;
  gap: 6px;
  margin: 2px 0 4px;
  padding: 6px 8px;
  font-size: 12px;
  text-decoration: none;
  display: flex;
}

.studio-dm-doc-chip[aria-disabled="true"] {
  cursor: default;
  opacity: .7;
}

.studio-dm-doc-chip span {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: auto;
  min-width: 0;
  overflow: hidden;
}

.studio-dm-doc-chip svg {
  flex: none;
  width: 14px;
  height: 14px;
}

.studio-dm-conversations > li {
  content-visibility: auto;
  contain-intrinsic-size: auto 66px;
}

.studio-dm-composer.is-split textarea:not(.is-single-line) {
  max-height: 152px !important;
  overflow-y: auto !important;
}

.studio-polish.is-studio-mobile .studio-dm-composer.is-split textarea:not(.is-single-line), .studio-dm-composer.is-split.is-mobile-icons textarea:not(.is-single-line) {
  max-height: min(40dvh, 136px) !important;
  overflow-y: auto !important;
}

.studio-dm-composer.is-split textarea.is-field-sized:not(.is-single-line), .studio-polish.is-studio-mobile .studio-dm-composer.is-split textarea.is-field-sized:not(.is-single-line), .studio-dm-composer.is-split.is-mobile-icons textarea.is-field-sized:not(.is-single-line) {
  field-sizing: content;
  height: auto !important;
  min-height: 24px !important;
}

.studio-dm-composer-editing {
  color: var(--color-cursor-text-muted, var(--mos-text-muted));
  align-items: center;
  gap: 6px;
  margin: 0 12px 2px;
  font-size: 12px;
  font-weight: 600;
  display: flex;
}

.studio-dm-composer-editing svg {
  width: 12px;
  height: 12px;
}

.studio-dm-poll {
  flex-direction: column;
  gap: 6px;
  min-width: min(260px, 70vw);
  max-width: 100%;
  display: flex;
}

.studio-dm-poll-title {
  overflow-wrap: anywhere;
  margin: 0;
  font-weight: 650;
}

.studio-dm-poll-hint {
  opacity: .7;
  margin: 0;
  font-size: 12px;
}

.studio-dm-poll-options {
  flex-direction: column;
  gap: 6px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.studio-dm-poll-option {
  border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
  background: color-mix(in srgb, currentColor 5%, transparent);
  width: 100%;
  min-height: 40px;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
  border-radius: 12px;
  grid-template-rows: auto 4px;
  grid-template-columns: 20px 1fr auto;
  align-items: center;
  gap: 4px 8px;
  padding: 6px 8px;
  display: grid;
}

.studio-dm-poll-option:disabled {
  cursor: progress;
}

.studio-dm-poll-option.is-mine {
  border-color: color-mix(in srgb, var(--cursor-accent, #25da67) 60%, transparent);
}

.studio-dm-poll-check {
  border: 1.5px solid color-mix(in srgb, currentColor 45%, transparent);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  display: inline-flex;
}

.studio-dm-poll-check.is-multi {
  border-radius: 5px;
}

.studio-dm-poll-option.is-mine .studio-dm-poll-check {
  border-color: var(--cursor-accent, #25da67);
  background: var(--cursor-accent, #25da67);
  color: #fff;
}

.studio-dm-poll-check svg {
  width: 12px;
  height: 12px;
}

.studio-dm-poll-label {
  overflow-wrap: anywhere;
  min-width: 0;
}

.studio-dm-poll-count {
  font-variant-numeric: tabular-nums;
  opacity: .75;
  font-size: 12px;
}

.studio-dm-poll-bar {
  background: color-mix(in srgb, currentColor 12%, transparent);
  border-radius: 999px;
  grid-column: 2 / 4;
  height: 4px;
  overflow: hidden;
}

.studio-dm-poll-bar > span {
  background: var(--cursor-accent, #25da67);
  transform-origin: 0;
  height: 100%;
  transition: transform .22s;
  display: block;
}

.studio-dm-poll-voters {
  opacity: .75;
  overflow-wrap: anywhere;
  margin: 4px 8px 0 36px;
  font-size: 12px;
}

.studio-dm-poll-footer {
  border: 0;
  border-top: 1px solid color-mix(in srgb, currentColor 12%, transparent);
  color: inherit;
  font: inherit;
  cursor: pointer;
  background: none;
  align-self: stretch;
  margin-top: 2px;
  padding: 6px 0 0;
  font-size: 13px;
  font-weight: 600;
}

.studio-dm-poll-footer:disabled {
  cursor: default;
  opacity: .6;
}

/* [project]/src/studio/components/studio-orb-play-button.css [app-client] (css) */
.studio-orb-play {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: 0;
  border-radius: 999px;
  flex: none;
  place-items: center;
  padding: 0;
  display: grid;
  position: relative;
}

span.studio-orb-play {
  cursor: inherit;
}

.studio-orb-play.is-sm {
  width: 32px;
  height: 32px;
}

.studio-orb-play.is-md {
  width: 36px;
  height: 36px;
}

.studio-orb-play.is-lg {
  width: 96px;
  height: 96px;
}

.studio-orb-play:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.studio-orb-frame {
  box-sizing: border-box;
  pointer-events: none;
  background: #e5e7eb;
  border-radius: 999px;
  padding: 2px;
  position: absolute;
  inset: 0;
  box-shadow: inset 0 2px 8px #0000001a;
}

:root:not([data-appearance="light"]) .studio-orb-frame {
  background: color-mix(in srgb, var(--mos-surface, #111c2f) 85%, #fff 15%);
  box-shadow: inset 0 2px 8px #00000080;
}

.studio-orb-well {
  background: var(--mos-bg, #020617);
  border-radius: 999px;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
  box-shadow: inset 0 0 12px #0000004d;
}

[data-appearance="light"] .studio-orb-frame {
  background: #e5e7eb;
  box-shadow: inset 0 2px 8px #0000001a;
}

[data-appearance="light"] .studio-orb-well {
  background: #fff;
  box-shadow: inset 0 0 12px #0000000d;
}

.studio-orb-canvas {
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  position: absolute !important;
  inset: 0 !important;
}

.studio-orb-canvas canvas {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

.studio-orb-fallback, .studio-orb-mark {
  border-radius: inherit;
  background: none;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-orb-aura {
  z-index: 2;
  border-radius: inherit;
  pointer-events: none;
  animation-name: studio-orb-aura;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  position: absolute;
  inset: 0;
  -webkit-mask: radial-gradient(circle, #0000 52%, #000 68% 100%);
  mask: radial-gradient(circle, #0000 52%, #000 68% 100%);
}

.studio-orb-aura-a {
  background: conic-gradient(from 0deg,
    transparent 0deg,
    color-mix(in srgb, var(--orb-c1, #cadcfc) 80%, transparent) 36deg,
    transparent 110deg,
    transparent 180deg,
    color-mix(in srgb, var(--orb-c2, #a0b9d1) 75%, transparent) 230deg,
    transparent 320deg);
  opacity: .9;
  animation-duration: var(--orb-a, 5s);
  animation-delay: var(--orb-da, 0s);
}

.studio-orb-aura-b {
  background: conic-gradient(from 80deg,
    transparent 0deg,
    #ffffff8c 24deg,
    transparent 80deg,
    color-mix(in srgb, var(--orb-c1, #cadcfc) 50%, transparent) 200deg,
    transparent 280deg);
  opacity: .7;
  animation-duration: var(--orb-b, 7.5s);
  animation-delay: var(--orb-db, -1.5s);
  animation-direction: reverse;
}

.studio-orb-mark.is-flip .studio-orb-aura-a {
  animation-direction: reverse;
}

.studio-orb-mark.is-flip .studio-orb-aura-b {
  animation-direction: normal;
}

.studio-orb-core {
  z-index: 1;
  border-radius: inherit;
  background: radial-gradient(circle at 40% 34%,
    color-mix(in srgb, var(--orb-c1, #cadcfc) 70%, #fff) 0%,
    var(--orb-c1, #cadcfc) 32%,
    var(--orb-c2, #a0b9d1) 100%);
  animation: studio-orb-core var(--orb-b, 7.5s) ease-in-out infinite;
  animation-delay: var(--orb-db, -1.5s);
  position: absolute;
  inset: 10%;
  overflow: hidden;
}

.studio-orb-glass {
  border-radius: inherit;
  pointer-events: none;
  background: radial-gradient(circle at 34% 28%, #ffffff80 0%, #0000 42%);
  position: absolute;
  inset: 0;
}

@keyframes studio-orb-aura {
  0% {
    transform: rotate(0)scale(.78);
  }

  18% {
    transform: rotate(28deg)scale(.88);
  }

  42% {
    transform: rotate(210deg)scale(1);
  }

  68% {
    transform: rotate(248deg)scale(.84);
  }

  100% {
    transform: rotate(360deg)scale(.78);
  }
}

@keyframes studio-orb-core {
  0%, 100% {
    transform: scale(.94);
  }

  50% {
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-orb-aura, .studio-orb-core {
    animation: none;
  }
}

.studio-orb-mark.is-eq .studio-orb-aura, .studio-orb-mark.is-eq .studio-orb-core {
  animation: none;
}

.studio-orb-mark.is-eq .studio-orb-aura-a {
  transform: rotate(var(--orb-angle, 0deg)) scale(var(--orb-eq, 1));
}

.studio-orb-mark.is-eq .studio-orb-aura-b {
  transform: rotate(calc(var(--orb-angle, 0deg) * -.7)) scale(var(--orb-eq, 1));
}

.studio-orb-mark.is-eq .studio-orb-core {
  transform: scale(var(--orb-eq, 1));
}

.studio-orb-play-glyph {
  z-index: 2;
  color: #fff;
  opacity: 0;
  pointer-events: none;
  filter: drop-shadow(0 1px 2px #0f172a73);
  place-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .15s;
  display: grid;
  position: relative;
}

.studio-orb-play:hover .studio-orb-play-glyph, .studio-orb-play:focus-visible .studio-orb-play-glyph, .studio-orb-play-glyph.is-visible {
  opacity: 1;
}

.studio-orb-play-glyph svg {
  margin-left: 1px;
}

.studio-orb-play-spinner {
  border: 1.5px solid #fff6;
  border-top-color: #fff;
  border-radius: 999px;
  width: 34%;
  height: 34%;
  animation: .7s linear infinite studio-orb-play-spin;
}

@keyframes studio-orb-play-spin {
  to {
    transform: rotate(360deg);
  }
}

/* [project]/src/studio/components/studio-org-pin-overlay.css [app-client] (css) */
.studio-org-pin-scrim {
  z-index: 200010;
  background: color-mix(in srgb, var(--mos-page, #0b0b0f) 94%, transparent);
  -webkit-backdrop-filter: blur(14px);
  place-items: center;
  padding: 24px;
  display: grid;
  position: fixed;
  inset: 0;
}

.studio-org-pin-scrim .studio-auth-theme.studio-auth-embedded {
  width: min(100%, 420px);
  max-height: min(92dvh, 840px);
}

.studio-org-pin-scrim .studio-auth-card {
  max-height: min(92dvh, 840px);
}

.studio-org-pin-scrim .studio-auth-form .studio-auth-primary {
  justify-content: center;
  align-items: center;
  gap: 8px;
  display: inline-flex;
}

/* [project]/src/studio/components/studio-org-workspace.css [app-client] (css) */
.studio-org-page .studio-org-admin-panel {
  min-height: 100%;
}

.studio-settings-workspace-body.is-org-admin {
  min-height: min(72vh, 720px);
  padding: 0;
}

.studio-org-admin-panel {
  flex-direction: column;
  gap: 0;
  min-height: min(72vh, 720px);
  display: flex;
}

.studio-org-admin-head {
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-plate);
  flex-shrink: 0;
}

.studio-org-admin-head-meta {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 8px 12px 0;
  display: flex;
}

.studio-org-admin-head-meta strong {
  letter-spacing: -.02em;
  font-size: 13px;
  font-weight: 700;
}

.studio-org-admin-head-meta span {
  color: var(--color-cursor-muted);
  font-size: 11px;
}

.studio-org-admin-body {
  flex: auto;
  min-height: 0;
  padding: 10px 12px 16px;
  overflow: auto;
}

.studio-org-admin-body .studio-settings-stack {
  gap: 8px;
}

.studio-org-member-list {
  gap: 4px;
  display: grid;
}

.studio-org-member-row {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-md, 10px);
  background: var(--mos-plate);
  width: 100%;
  min-height: 44px;
  color: inherit;
  text-align: left;
  cursor: pointer;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  display: grid;
}

.studio-org-member-row:hover, .studio-org-member-row.is-selected {
  border-color: color-mix(in srgb, var(--cursor-accent) 55%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 8%, var(--mos-plate));
}

.studio-org-member-row-copy {
  gap: 2px;
  min-width: 0;
  display: grid;
}

.studio-org-member-row-copy strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 650;
  overflow: hidden;
}

.studio-org-member-row-copy span {
  color: var(--color-cursor-muted);
  font-size: 10px;
}

.studio-org-member-row-role {
  color: var(--color-cursor-muted);
  text-transform: capitalize;
  font-size: 10px;
  font-weight: 650;
}

.studio-org-access-hint {
  border-radius: var(--cursor-radius-md, 10px);
  background: color-mix(in srgb, var(--mos-text-bright) 4%, var(--mos-plate));
  color: var(--color-cursor-muted);
  margin: 0;
  padding: 8px 10px;
  font-size: 11px;
  line-height: 1.45;
}

.studio-org-member-sidebar-actions {
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  display: flex;
}

.studio-org-admin-panel {
  background: var(--mos-page);
  min-height: 100%;
}

.studio-org-admin-head {
  min-height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page);
  grid-template-columns: minmax(180px, 1fr) auto;
  align-items: end;
  padding: 0 12px;
  display: grid;
}

.studio-org-admin-title {
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 32px;
  display: flex;
}

.studio-org-admin-title-copy {
  gap: 1px;
  min-width: 0;
  display: grid;
}

.studio-org-admin-eyebrow, .studio-org-section-label {
  color: var(--color-cursor-muted);
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
}

.studio-org-admin-title strong {
  color: var(--color-cursor-text-bright);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
  overflow: hidden;
}

.studio-org-admin-role, .studio-org-count {
  color: var(--color-cursor-muted);
  text-transform: capitalize;
  flex: none;
  font-size: 11px;
  font-weight: 600;
}

.studio-org-admin-tabs {
  align-self: stretch;
}

.studio-org-admin-tabs .studio-admin-head-tab {
  gap: 5px;
}

.studio-org-admin-tabs .studio-admin-head-tab svg {
  width: 13px;
  height: 13px;
}

.studio-org-admin-body {
  min-height: 0;
  padding: 16px 18px 24px;
  overflow: auto;
}

.studio-org-page-stack {
  gap: 12px;
  width: min(760px, 100%);
  margin: 0 auto;
  display: grid;
}

.studio-org-page-toolbar {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  display: flex;
}

.studio-org-page-toolbar > div {
  gap: 3px;
  min-width: 0;
  display: grid;
}

.studio-org-page-toolbar h2 {
  color: var(--color-cursor-text-bright);
  letter-spacing: -.02em;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}

.studio-org-page-toolbar p {
  color: var(--color-cursor-muted);
  margin: 0;
  font-size: 11px;
  line-height: 1.4;
}

.studio-org-page-stack > .cursor-panel-search {
  width: 100%;
  margin: 2px 0 4px;
}

.studio-org-list, .studio-org-incoming, .studio-org-invite-form {
  gap: 8px;
  display: grid;
}

.studio-org-list-rows {
  gap: 4px;
  display: grid;
}

.studio-org-list-row, .studio-org-member-row {
  background: var(--mos-plate);
  width: 100%;
  min-width: 0;
  min-height: 44px;
  color: var(--color-cursor-text);
  text-align: left;
  border: 0;
  border-radius: 10px;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  display: flex;
}

.studio-org-member-row {
  cursor: pointer;
  font: inherit;
}

.studio-org-list-row:hover, .studio-org-member-row:hover, .studio-org-list-row.is-active, .studio-org-member-row.is-selected {
  background: var(--mos-plate-strong);
  box-shadow: inset 2px 0 0 var(--cursor-accent);
}

.studio-org-list-row-copy, .studio-org-member-row-copy {
  gap: 2px;
  min-width: 0;
  display: grid;
}

.studio-org-list-row-copy strong, .studio-org-member-row-copy strong {
  color: var(--color-cursor-text-bright);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 650;
  overflow: hidden;
}

.studio-org-list-row-copy span, .studio-org-member-row-copy span, .studio-org-member-row-role {
  color: var(--color-cursor-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  overflow: hidden;
}

.studio-org-member-row-role {
  text-transform: capitalize;
  flex: none;
  font-weight: 650;
}

.studio-org-page-footer {
  justify-content: flex-end;
  padding-top: 4px;
  display: flex;
}

.studio-org-invite-form {
  background: var(--mos-plate);
  border-radius: 12px;
  padding: 12px;
}

.studio-org-invite-grid {
  grid-template-columns: minmax(0, 1fr) 140px auto;
  align-items: end;
  gap: 8px;
  display: grid;
}

.studio-org-invite-grid .studio-chrome-field {
  min-width: 0;
}

.studio-org-member-detail-backdrop {
  z-index: 80;
  background: color-mix(in srgb, var(--mos-page) 48%, transparent);
  cursor: default;
  border: 0;
  position: fixed;
  inset: 0;
}

.studio-org-member-detail {
  z-index: 81;
  border-left: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page);
  width: min(360px, 92vw);
  box-shadow: var(--cursor-shadow-pop);
  align-content: start;
  gap: 14px;
  padding: 14px;
  display: grid;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  overflow: auto;
}

.studio-org-member-detail-head {
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  display: flex;
}

.studio-org-member-detail-head h3 {
  color: var(--color-cursor-text-bright);
  margin: 3px 0 0;
  font-size: 16px;
  font-weight: 700;
}

.studio-org-member-detail .studio-settings-card {
  background: var(--mos-plate);
}

@media (max-width: 720px) {
  .studio-org-admin-head {
    grid-template-columns: 1fr;
    align-items: stretch;
    padding: 0 10px;
  }

  .studio-org-admin-tabs {
    overflow-x: auto;
  }

  .studio-org-admin-body {
    padding: 12px 10px 18px;
  }

  .studio-org-page-toolbar {
    flex-direction: column;
    align-items: flex-start;
  }

  .studio-org-invite-grid {
    grid-template-columns: 1fr;
  }
}

.studio-org-access-sidebar {
  background: var(--mos-sidebar, var(--mos-panel));
  width: 100%;
  min-width: 0;
  height: 100%;
  overflow: hidden;
}

.studio-org-access-body {
  flex-direction: column;
  flex: auto;
  gap: 12px;
  min-height: 0;
  padding: 12px 14px 16px;
  display: flex;
  overflow: auto;
}

.studio-org-access-item {
  color: var(--color-cursor-text-bright, var(--mos-text-bright));
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
  font-size: 15px;
  font-weight: 650;
  overflow: hidden;
}

.studio-org-access-status {
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 13px;
  font-weight: 650;
}

.studio-org-access-block {
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-org-access-label {
  color: var(--color-cursor-muted, var(--mos-text-muted));
  letter-spacing: .06em;
  text-transform: uppercase;
  margin: 0;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
}

.studio-org-access-pills {
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-org-access-pill {
  background: color-mix(in srgb,
    var(--mos-ink, var(--color-cursor-text)) 6%,
    var(--mos-page, var(--color-cursor-panel)));
  min-width: 0;
  min-height: 36px;
  color: var(--color-cursor-muted, var(--mos-muted, var(--mos-text-muted)));
  letter-spacing: -.01em;
  box-shadow: none;
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  flex: 1 1 0;
  justify-content: center;
  align-items: center;
  padding: 0 14px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 650;
  transition: background .14s, color .14s, transform .12s;
  display: inline-flex;
}

.studio-org-access-pill.is-selected {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 16%,
    var(--mos-page, var(--color-cursor-panel)));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-org-access-pill:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-org-access-pill.is-selected:hover:not(:disabled) {
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 24%,
    var(--mos-plate-strong, var(--mos-raised)));
}

.studio-org-access-pill:active:not(:disabled) {
  transform: translateY(1px)scale(.99);
}

.studio-org-access-pill:focus-visible {
  box-shadow: 0 0 0 2px var(--mos-page),
    0 0 0 4px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 35%, transparent);
  outline: none;
}

.studio-org-access-pill:disabled {
  cursor: not-allowed;
  opacity: .45;
  transform: none;
}

.studio-org-access-error {
  color: var(--cursor-danger, var(--color-cursor-danger));
  margin: 0;
  font-size: 12px;
}

.studio-org-access-actions {
  flex-direction: column;
  gap: 8px;
  margin-top: 4px;
  display: flex;
}

.studio-org-access-save, .studio-org-access-reset {
  letter-spacing: -.01em;
  cursor: pointer;
  width: 100%;
  min-height: 48px;
  box-shadow: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 18px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 650;
  transition: background .14s, transform .12s, border-color .14s;
  display: inline-flex;
}

.studio-org-access-save {
  border: 1px solid
    color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 34%, var(--color-cursor-border-soft));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 16%,
    var(--mos-plate-strong, var(--mos-raised)));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-org-access-save:hover:not(:disabled) {
  border-color: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 52%,
    var(--color-cursor-border));
  background: color-mix(in srgb,
    var(--cursor-accent, var(--mos-accent)) 24%,
    var(--mos-plate-strong, var(--mos-raised)));
}

.studio-org-access-reset {
  border: 1px solid var(--color-cursor-border, var(--mos-border));
  color: var(--color-cursor-text, var(--mos-text));
  background: none;
}

.studio-org-access-reset:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-org-access-save:active:not(:disabled), .studio-org-access-reset:active:not(:disabled) {
  transform: translateY(1px)scale(.99);
}

.studio-org-access-save:focus-visible, .studio-org-access-reset:focus-visible {
  box-shadow: 0 0 0 2px var(--mos-page),
    0 0 0 4px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 35%, transparent);
  outline: none;
}

.studio-org-access-save:disabled, .studio-org-access-reset:disabled {
  cursor: not-allowed;
  opacity: .5;
  transform: none;
}

/* [project]/src/studio/components/studio-pdf-viewer.css [app-client] (css) */
.studio-pdf-viewer {
  background: var(--mos-page, var(--color-cursor-bg));
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-pdf-viewer-toolbar .studio-pdf-viewer-page {
  text-align: center;
  min-width: 3.5rem;
  color: var(--color-cursor-text);
  font-variant-numeric: tabular-nums;
  -webkit-user-select: none;
  user-select: none;
  font-size: 11px;
  font-weight: 650;
}

.studio-pdf-viewer-sep {
  background: var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex-shrink: 0;
  width: 1px;
  height: 14px;
  margin: 0 4px;
}

.studio-pdf-viewer-stage {
  box-sizing: border-box;
  background: var(--mos-page, var(--color-cursor-bg));
  overscroll-behavior: contain;
  cursor: default;
  flex-direction: column;
  flex: 1;
  align-items: center;
  gap: 16px;
  min-height: 0;
  padding: 16px;
  display: flex;
  touch-action: pan-x pan-y !important;
  justify-content: flex-start !important;
  overflow: auto !important;
}

.studio-pdf-viewer-stage.is-pannable {
  cursor: default;
  touch-action: pan-x pan-y !important;
}

.studio-pdf-viewer-stage.is-pannable:active {
  cursor: default;
}

.studio-pdf-viewer-page-card {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-page);
  width: max-content;
  max-width: none;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--color-cursor-text) 8%, transparent),
    0 8px 24px color-mix(in srgb, var(--color-cursor-text) 10%, transparent);
  flex: none;
  line-height: 0;
  display: block;
  overflow: hidden;
}

[data-appearance="dark"] .studio-pdf-viewer-page-card {
  outline: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 70%, transparent);
  box-shadow: 0 1px 2px #0006, 0 10px 28px #00000073;
}

.studio-pdf-viewer-canvas {
  background: var(--mos-page);
  display: block;
}

.studio-pdf-viewer-empty {
  min-height: 180px;
  color: var(--color-cursor-muted);
  align-content: center;
  place-items: center;
  gap: 12px;
  margin: auto;
  font-size: 13px;
  display: grid;
}

.studio-pdf-viewer-empty.is-error {
  color: var(--color-cursor-text);
}

.studio-pdf-viewer-fallback {
  appearance: none;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 650;
}

.studio-pdf-viewer-fallback:hover {
  background: var(--mos-hover, var(--mos-plate-strong));
}

.studio-asset-preview .studio-pdf-viewer {
  height: 100%;
}

.studio-asset-preview .studio-pdf-viewer .desk-image-viewer-toolbar {
  flex-shrink: 0;
}

.studio-asset-preview .studio-pdf-viewer .studio-pdf-viewer-stage.desk-image-viewer-stage {
  touch-action: pan-x pan-y !important;
  justify-content: flex-start !important;
  align-items: center !important;
  padding: 16px !important;
  overflow: auto !important;
}

.studio-pdf-viewer-page-card.is-annotating {
  cursor: crosshair;
}

.studio-pdf-annot-bar {
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: var(--mos-plate, var(--cursor-surface));
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  padding: 0 10px;
  display: flex;
}

.studio-pdf-annot-tools {
  align-items: center;
  gap: 6px;
  display: flex;
}

.studio-pdf-annot-tools.is-context {
  flex: auto;
  justify-content: flex-start;
  min-width: 0;
}

.studio-pdf-annot-tools.is-end {
  flex: none;
  gap: 4px;
  margin-left: auto;
}

.studio-pdf-annot-seg {
  background: var(--mos-page, var(--color-cursor-panel));
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: 999px;
  flex: none;
  align-items: center;
  height: 24px;
  padding: 2px;
  display: inline-flex;
}

.studio-pdf-annot-seg-btn {
  appearance: none;
  height: 20px;
  color: var(--color-cursor-muted);
  font: inherit;
  letter-spacing: .01em;
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  transition: color .16s, background .16s;
  display: inline-flex;
}

.studio-pdf-annot-seg-btn:hover {
  color: var(--color-cursor-text);
}

.studio-pdf-annot-seg-btn.is-active {
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-pdf-annot-seg-btn:focus-visible {
  outline: 2px solid var(--color-cursor-accent, #1d4ed8);
  outline-offset: 1px;
}

.studio-pdf-annot-context {
  min-width: 0;
  height: 24px;
  color: var(--color-cursor-muted);
  align-items: center;
  gap: 8px;
  padding: 0 2px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-pdf-annot-context.is-muted {
  opacity: .72;
}

.studio-pdf-annot-context img {
  object-fit: contain;
  max-width: 64px;
  height: 14px;
  display: block;
}

.studio-pdf-annot-hint {
  height: auto;
  min-height: 0;
  color: var(--color-cursor-muted);
  white-space: nowrap;
  opacity: .85;
  pointer-events: none;
  background: none;
  border: none;
  border-radius: 0;
  flex: none;
  margin: 8px 12px 0;
  padding: 0;
  font-size: 11px;
  font-weight: 550;
  line-height: 1.3;
  display: block;
}

.studio-pdf-annot-quiet {
  appearance: none;
  height: 24px;
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  background: none;
  border: none;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-pdf-annot-quiet:hover {
  color: var(--color-cursor-text);
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-pdf-annot-icon {
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
}

.studio-pdf-annot-icon.is-danger {
  color: var(--color-danger, #dc2626);
}

.studio-pdf-annot-icon:disabled {
  opacity: .4;
  cursor: default;
}

.studio-pdf-annot-save, .studio-pdf-annot-export, .studio-pdf-sigpanel .cursor-settings-action.studio-pdf-annot-tool {
  appearance: none;
  width: auto;
  height: 24px;
  min-height: 24px;
  max-height: 24px;
  font: inherit;
  letter-spacing: .01em;
  white-space: nowrap;
  box-shadow: none;
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  transition: color .16s, border-color .16s, background .16s, filter .16s;
  display: inline-flex;
}

.studio-pdf-sigpanel .cursor-settings-action.studio-pdf-annot-tool {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-page, var(--color-cursor-panel));
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-pdf-sigpanel .cursor-settings-action.studio-pdf-annot-tool:hover:not(:disabled) {
  border-color: var(--color-cursor-border, var(--mos-border));
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-pdf-annot-swatch {
  outline: 1px solid var(--color-cursor-border-soft);
  cursor: pointer;
  border: 2px solid #0000;
  border-radius: 999px;
  flex: none;
  width: 14px;
  height: 14px;
  padding: 0;
}

.studio-pdf-annot-swatch.is-active {
  border-color: var(--mos-page);
  box-shadow: 0 0 0 2px var(--color-cursor-accent, #1d4ed8);
}

.studio-pdf-annot-bar .studio-pdf-sigpanel-size {
  gap: 6px;
  height: 24px;
  min-height: 24px;
}

.studio-pdf-annot-bar .studio-pdf-sigpanel-size input[type="range"] {
  width: 72px;
  height: 14px;
  accent-color: var(--color-cursor-accent, #1d4ed8);
  cursor: ew-resize;
  margin: 0;
}

.studio-pdf-annot-bar .studio-pdf-sigpanel-sizeval {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-muted);
  min-width: 1.5ch;
  font-size: 11px;
  font-weight: 600;
}

.studio-pdf-annot-save, .studio-pdf-annot-export {
  border: 1px solid color-mix(in srgb, var(--color-cursor-accent, #1d4ed8) 55%, transparent);
  background: var(--color-cursor-accent, #1d4ed8);
  color: var(--color-cursor-text-bright, #fff);
  font-weight: 700;
}

.studio-pdf-annot-export {
  border-color: var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate-strong, var(--mos-surface));
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-weight: 650;
}

.studio-pdf-annot-save:hover:not(:disabled), .studio-pdf-annot-export:hover:not(:disabled) {
  filter: brightness(1.05);
}

.studio-pdf-annot-save:disabled, .studio-pdf-annot-export:disabled {
  opacity: .45;
  cursor: default;
  filter: none;
}

.studio-pdf-annot-save:focus-visible, .studio-pdf-annot-export:focus-visible {
  outline: 2px solid var(--color-cursor-accent, #1d4ed8);
  outline-offset: 2px;
}

.studio-pdf-annot-layer {
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.studio-pdf-viewer-page-card {
  position: relative;
}

.studio-pdf-annot-layer > [data-annot-node] {
  pointer-events: auto;
}

.studio-pdf-annot-text {
  letter-spacing: 0;
  white-space: pre-wrap;
  word-break: break-word;
  cursor: move;
  -webkit-user-select: none;
  user-select: none;
  touch-action: none;
  border: 1px dashed #0000;
  border-radius: 4px;
  max-width: 80%;
  padding: 1px 5px;
  font-family: Helvetica Neue, Helvetica, Arial, ui-sans-serif, system-ui, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.2;
  position: absolute;
  transform: translate(-4px, -60%);
}

.studio-pdf-annot-text:hover, .studio-pdf-annot-text.is-selected {
  border-color: var(--color-cursor-accent, #1d4ed8);
  background: color-mix(in srgb, var(--color-cursor-accent, #1d4ed8) 8%, transparent);
}

.studio-pdf-annot-text input {
  background: var(--mos-page);
  color: inherit;
  font: inherit;
  min-width: 130px;
  box-shadow: 0 2px 10px color-mix(in srgb, var(--color-cursor-text) 20%, transparent);
  border: none;
  border-radius: 6px;
  outline: none;
  padding: 3px 7px;
}

.studio-pdf-annot-sig {
  cursor: move;
  -webkit-user-select: none;
  user-select: none;
  touch-action: none;
  border: 1px dashed #0000;
  border-radius: 4px;
  padding: 2px;
  position: absolute;
  transform: translate(-50%, -50%);
}

.studio-pdf-annot-sig:hover, .studio-pdf-annot-sig.is-selected {
  border-color: var(--color-cursor-accent, #1d4ed8);
  background: color-mix(in srgb, var(--color-cursor-accent, #1d4ed8) 8%, transparent);
}

.studio-pdf-annot-sig img {
  object-fit: contain;
  pointer-events: none;
  width: 130px;
  max-height: 60px;
  display: block;
}

.studio-pdf-annot-del {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate-strong);
  width: 18px;
  height: 18px;
  color: var(--color-cursor-text);
  cursor: pointer;
  pointer-events: auto;
  border-radius: 999px;
  place-items: center;
  padding: 0;
  display: grid;
  position: absolute;
  top: -9px;
  right: -9px;
}

.studio-pdf-sigmodal-backdrop, .studio-pdf-sigmodal, .studio-pdf-sigmodal-head {
  display: none;
}

.studio-pdf-sigmodal-tabs-label {
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--color-cursor-muted);
  margin-right: auto;
  font-size: 11px;
  font-weight: 700;
}

.studio-pdf-sigmodal-library {
  display: none;
}

.studio-pdf-siglib-row {
  background: none;
  border: 1px solid #0000;
  border-radius: 10px;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  transition: background .16s, border-color .16s;
  display: flex;
}

.studio-pdf-siglib-row:hover {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-pdf-siglib-row.is-active {
  background: var(--mos-plate-strong, var(--cursor-surface-raised));
  border-color: color-mix(in srgb, var(--color-cursor-accent, #1d4ed8) 42%, var(--color-cursor-border-soft));
  box-shadow: none;
}

.studio-pdf-siglib-pick {
  appearance: none;
  background: var(--mos-page);
  cursor: pointer;
  border: none;
  border-radius: 8px;
  flex: auto;
  place-items: center;
  min-width: 0;
  padding: 6px 10px;
  display: grid;
  position: relative;
}

.studio-pdf-siglib-pick img {
  object-fit: contain;
  max-width: 140px;
  height: 28px;
  display: block;
}

.studio-pdf-siglib-meta {
  flex: 0 88px;
  min-width: 0;
}

.studio-pdf-siglib-name {
  appearance: none;
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  background: none;
  border: none;
  max-width: 100%;
  padding: 2px 0;
  font-size: 12px;
  font-weight: 600;
  overflow: hidden;
}

.studio-pdf-siglib-del {
  opacity: .45;
  flex: none;
  transition: opacity .12s;
}

.studio-pdf-siglib-row:hover .studio-pdf-siglib-del, .studio-pdf-siglib-row:focus-within .studio-pdf-siglib-del {
  opacity: 1;
}

.studio-pdf-siglib-name-input {
  border: 1px solid var(--color-cursor-accent, #1d4ed8);
  background: var(--mos-page, var(--color-cursor-bg));
  width: 100%;
  color: var(--color-cursor-text);
  font: inherit;
  box-sizing: border-box;
  border-radius: 6px;
  padding: 3px 6px;
  font-size: 12px;
}

.studio-pdf-annot-ghost {
  pointer-events: none;
  opacity: .85;
  filter: saturate(1.1) contrast(1.4) brightness(.55);
  background-image: linear-gradient(45deg, var(--mos-plate-strong) 25%, transparent 25%),
    linear-gradient(-45deg, var(--mos-plate-strong) 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, var(--mos-plate-strong) 75%),
    linear-gradient(-45deg, transparent 75%, var(--mos-plate-strong) 75%);
  outline: 1px dashed var(--color-cursor-accent, #1d4ed8);
  outline-offset: 2px;
  background-position: 0 0, 0 5px, 5px -5px, -5px 0;
  background-size: 10px 10px;
  border-radius: 4px;
  position: absolute;
  transform: translate(-50%, -50%);
}

.studio-pdf-annot-ghost.is-hover {
  opacity: .6;
}

.studio-pdf-annot-ghost.is-dragging {
  opacity: .85;
}

.studio-pdf-annot-ghost img {
  pointer-events: none;
  display: block;
}

.studio-pdf-sigmodal-canvas {
  background: var(--mos-page);
  border: 1px dashed var(--color-cursor-border-soft);
  cursor: crosshair;
  touch-action: none;
  border-radius: 8px;
  margin: 12px auto 0;
  display: block;
}

.studio-pdf-sigmodal-type {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page, var(--color-cursor-bg));
  width: calc(100% - 24px);
  color: var(--color-cursor-text);
  font: inherit;
  box-sizing: border-box;
  border-radius: 8px;
  margin: 12px 12px 0;
  padding: 8px 10px;
  font-size: 14px;
  display: block;
}

.studio-pdf-sigmodal-typepreview {
  background: var(--mos-page);
  border: 1px dashed var(--color-cursor-border-soft);
  height: 70px;
  color: var(--color-cursor-text);
  border-radius: 8px;
  place-items: center;
  margin: 10px 12px 0;
  font-family: Brush Script MT, Segoe Script, cursive;
  font-size: 44px;
  display: grid;
  overflow: hidden;
}

.studio-pdf-viewer.desk-image-viewer.has-sig-panel {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  flex-direction: row !important;
}

.studio-pdf-main-col {
  flex-direction: column;
  flex: auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-pdf-viewer.has-sig-panel .studio-pdf-main-col .desk-image-viewer-stage {
  align-items: center;
}

.studio-pdf-sigpanel {
  float: none;
  background: var(--mos-plate, var(--color-cursor-panel));
  border-left: 1px solid var(--color-cursor-border-soft);
  width: 300px;
  max-width: 82vw;
  height: 100%;
  min-height: 0;
  color: var(--color-cursor-text);
  flex-direction: column;
  flex: 0 0 300px;
  align-self: stretch;
  display: flex;
  position: static;
  inset: auto;
  overflow: hidden;
  transform: none;
}

.studio-pdf-viewer .studio-pdf-annot-bar {
  min-height: var(--cursor-head-h);
  max-height: var(--cursor-head-h);
  height: var(--cursor-head-h);
  scrollbar-width: none;
  flex-wrap: nowrap;
  flex-shrink: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: auto hidden;
}

.studio-pdf-viewer .studio-pdf-annot-bar::-webkit-scrollbar {
  display: none;
}

.studio-pdf-viewer .studio-pdf-annot-bar .studio-pdf-annot-tools {
  flex-shrink: 0;
}

.studio-pdf-sigpanel-sub {
  display: none;
}

.studio-pdf-sigpanel-body {
  overscroll-behavior: contain;
  flex-direction: column;
  flex: auto;
  min-height: 0;
  padding-bottom: 12px;
  display: flex;
  overflow-y: auto;
}

.studio-pdf-sigpanel-library {
  flex: none;
  gap: 6px;
  padding: 10px 12px 0;
  display: grid;
  overflow: visible;
}

.studio-pdf-sigpanel-create {
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex: none;
  min-height: 0;
  margin-top: 10px;
  overflow: visible;
}

.studio-pdf-sigpanel-empty {
  margin: 10px 12px 0;
}

.studio-pdf-sigpanel-newhead {
  display: none;
}

.studio-pdf-sigpanel-create-head {
  align-items: center;
  gap: 8px;
  padding: 10px 12px 0;
  display: flex;
}

.studio-pdf-sigpanel-size {
  color: var(--color-cursor-muted);
  flex: none;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  font-size: 11px;
  font-weight: 650;
  display: flex;
}

.studio-pdf-sigpanel-size input[type="range"] {
  width: 64px;
  height: 14px;
  accent-color: var(--color-cursor-accent, #1d4ed8);
  cursor: ew-resize;
  margin: 0;
}

.studio-pdf-sigpanel-sizeval {
  text-align: right;
  font-variant-numeric: tabular-nums;
  min-width: 2ch;
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 600;
}

.studio-pdf-sigpanel .studio-admin-head-tabs.studio-pdf-sigpanel-tabs {
  flex-wrap: nowrap;
  flex: auto;
  align-items: center;
  gap: 4px;
  min-width: 0;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  display: flex;
  overflow: visible;
}

.studio-pdf-sigpanel .studio-admin-head-tab {
  border-radius: 999px;
  flex: none;
  justify-content: center;
  height: 24px;
  min-height: 24px;
  max-height: 24px;
  padding: 0 10px;
  font-size: 11px;
  font-weight: 650;
}

.studio-pdf-sigpanel .studio-pdf-sigmodal-canvas {
  width: calc(100% - 24px);
  margin: 10px 12px 0;
}

.studio-pdf-sigpanel .studio-pdf-sigmodal-type, .studio-pdf-sigpanel .studio-pdf-sigmodal-drop, .studio-pdf-sigpanel .studio-pdf-crop-wrap, .studio-pdf-sigpanel .studio-pdf-sigmodal-typepreview, .studio-pdf-sigpanel .studio-pdf-sigmodal-error {
  width: calc(100% - 24px);
  margin-left: 12px;
  margin-right: 12px;
}

.studio-pdf-sigpanel .studio-pdf-sigmodal-foot {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 8px 12px 12px;
  display: flex;
}

.studio-pdf-crop-wrap {
  margin-top: 10px;
}

.studio-pdf-crop-label {
  color: var(--color-cursor-muted);
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 650;
}

.studio-pdf-crop-box {
  background: var(--mos-page);
  border: 1px solid var(--color-cursor-border-soft);
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}

.studio-pdf-crop-box > img {
  pointer-events: none;
  width: 100%;
  height: auto;
  display: block;
}

.studio-pdf-crop-shade {
  background: color-mix(in srgb, var(--color-cursor-text) 55%, transparent);
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.studio-pdf-crop-rect {
  border: 1.5px solid var(--color-cursor-accent, #1d4ed8);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--mos-page) 70%, transparent);
  cursor: move;
  touch-action: none;
  position: absolute;
}

.studio-pdf-crop-handle {
  background: var(--color-cursor-accent, #1d4ed8);
  border: 1.5px solid var(--mos-page);
  border-radius: 3px;
  width: 12px;
  height: 12px;
  position: absolute;
}

.studio-pdf-crop-handle.is-nw {
  cursor: nwse-resize;
  top: -7px;
  left: -7px;
}

.studio-pdf-crop-handle.is-ne {
  cursor: nesw-resize;
  top: -7px;
  right: -7px;
}

.studio-pdf-crop-handle.is-sw {
  cursor: nesw-resize;
  bottom: -7px;
  left: -7px;
}

.studio-pdf-crop-handle.is-se {
  cursor: nwse-resize;
  bottom: -7px;
  right: -7px;
}

.studio-pdf-crop-foot {
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  display: flex;
}

.studio-pdf-sigmodal-file {
  opacity: 0;
  pointer-events: none;
  width: 1px;
  height: 1px;
  position: absolute;
}

.studio-pdf-sigmodal-drop {
  appearance: none;
  border: 1px dashed var(--color-cursor-border-soft);
  background: var(--mos-page, var(--color-cursor-bg));
  width: calc(100% - 24px);
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  box-sizing: border-box;
  border-radius: 10px;
  align-content: center;
  place-items: center;
  gap: 6px;
  margin: 10px 12px 0;
  padding: 16px 12px;
  font-size: 12px;
  font-weight: 650;
  display: grid;
}

.studio-pdf-sigmodal-drop:hover {
  color: var(--color-cursor-text);
  background: var(--mos-hover, var(--mos-plate-strong));
}

.studio-pdf-sigmodal-uploadpreview {
  background: var(--mos-page);
  border: 1px dashed var(--color-cursor-border-soft);
  border-radius: 8px;
  place-items: center;
  min-height: 70px;
  margin: 10px 12px 0;
  padding: 8px;
  display: grid;
}

.studio-pdf-sigmodal-uploadpreview img {
  object-fit: contain;
  max-width: 100%;
  max-height: 64px;
  display: block;
}

.studio-pdf-sigmodal-error {
  color: var(--color-danger, #dc2626);
  margin: 8px 12px 0;
  font-size: 12px;
}

/* [project]/src/studio/components/studio-profile-avatar.css [app-client] (css) */
.studio-profile-avatar {
  --spa-size: 32px;
  --spa-font: 11px;
  box-sizing: border-box;
  width: var(--spa-size);
  height: var(--spa-size);
  border: 1px solid var(--studio-composer-glass-border, #ffffff38);
  background: var(--studio-composer-glass, #07111f6b);
  color: #fff;
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  font-size: var(--spa-font);
  letter-spacing: .02em;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  filter: none;
  isolation: auto;
  border-radius: 50%;
  flex-shrink: 0;
  padding: 0;
  font-weight: 700;
  line-height: 1;
  display: block;
  position: relative;
  overflow: hidden;
  transform: none;
  box-shadow: 0 8px 18px #00000047, inset 0 1px #ffffff1f;
}

.studio-profile-avatar.is-sm {
  --spa-size: 26px;
  --spa-font: 9px;
}

.studio-profile-avatar.is-md {
  --spa-size: 32px;
  --spa-font: 11px;
}

.studio-profile-avatar.is-lg {
  --spa-size: 68px;
  --spa-font: 20px;
  font-weight: 700;
}

.studio-profile-avatar.is-xl {
  --spa-size: 72px;
  --spa-font: 22px;
  font-weight: 700;
}

.studio-profile-avatar.is-fill {
  width: 100%;
  height: 100%;
}

.studio-profile-avatar.is-button {
  cursor: pointer;
  font: inherit;
  font-family: var(--font-geist-sans), system-ui, sans-serif;
  font-size: var(--spa-font);
  letter-spacing: .02em;
  color: #fff;
  appearance: none;
  margin: 0;
  font-weight: 700;
  line-height: 1;
}

.studio-profile-avatar.is-button:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.studio-profile-avatar-media, .studio-profile-avatar-fallback {
  border-radius: inherit;
  border: 0;
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  padding: 0;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.studio-profile-avatar-media {
  z-index: 1;
  object-fit: cover;
  object-position: center center;
  background: #0506088c;
  display: block;
}

.studio-profile-avatar-fallback {
  font: inherit;
  color: inherit;
  place-content: center;
  place-items: center;
  line-height: 1;
  display: grid;
}

.studio-profile-avatar-fallback.is-placeholder {
  color: inherit;
  background: none;
}

.studio-profile-avatar-overlay {
  z-index: 2;
  border-radius: inherit;
  color: #fff;
  pointer-events: none;
  background: #00000073;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

[data-appearance="light"] .studio-profile-avatar {
  color: var(--color-cursor-text, #1b1f24);
  background: #ffffffb8;
  border-color: #1b1f2424;
  box-shadow: 0 10px 24px #0f172a1a, inset 0 1px #ffffffbf;
}

[data-appearance="light"] .studio-profile-avatar.is-button {
  color: var(--color-cursor-text, #1b1f24);
}

[data-appearance="light"] .studio-profile-avatar-media {
  background: #e8ecf2cc;
}

[data-appearance="light"] .studio-profile-avatar-fallback {
  background: #ffffff8c;
}

/* [project]/src/studio/components/studio-ratio-glyph.css [app-client] (css) */
.studio-ratio-glyph {
  border: 1px solid color-mix(in srgb, var(--cursor-accent) 24%, var(--color-cursor-border-soft, var(--mos-border)));
  background: color-mix(in srgb, var(--cursor-accent-dim, var(--cursor-accent)) 28%, transparent);
  width: 30px;
  height: 30px;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright, #fff) 8%, transparent);
  border-radius: 10px;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-ratio-glyph > span {
  background: linear-gradient(var(--cursor-accent), var(--cursor-accent)) left top / 6px 1px no-repeat,
    linear-gradient(var(--cursor-accent), var(--cursor-accent)) left top / 1px 6px no-repeat,
    linear-gradient(var(--cursor-accent), var(--cursor-accent)) right top / 6px 1px no-repeat,
    linear-gradient(var(--cursor-accent), var(--cursor-accent)) right top / 1px 6px no-repeat,
    linear-gradient(var(--cursor-accent), var(--cursor-accent)) left bottom / 6px 1px no-repeat,
    linear-gradient(var(--cursor-accent), var(--cursor-accent)) left bottom / 1px 6px no-repeat,
    linear-gradient(var(--cursor-accent), var(--cursor-accent)) right bottom / 6px 1px no-repeat,
    linear-gradient(var(--cursor-accent), var(--cursor-accent)) right bottom / 1px 6px no-repeat,
    color-mix(in srgb, var(--cursor-accent) 10%, transparent);
  box-shadow: 0 0 10px color-mix(in srgb, var(--cursor-accent) 18%, transparent);
  border-radius: 4px;
  display: block;
}

/* [project]/src/studio/components/studio-share-people.css [app-client] (css) */
.studio-share-people-panel {
  background: var(--mos-page, var(--cursor-surface));
  flex-direction: column;
  flex: auto;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-share-people-chrome {
  flex: none;
}

.studio-share-people-chrome-wrap {
  flex-direction: column;
  flex: none;
  min-width: 0;
  display: flex;
}

.studio-polish aside.is-share-people .studio-share-people-chrome .cursor-panel-search, .studio-share-people-chrome .cursor-panel-search {
  border: none;
}

.studio-share-people-top {
  box-sizing: border-box;
  min-height: var(--cursor-head-h, 36px);
  height: var(--cursor-head-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft);
  background: none;
  flex: none;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  padding: 0 8px;
  display: flex;
}

.studio-share-people-top-copy {
  flex: auto;
  align-items: center;
  gap: 5px;
  min-width: 0;
  line-height: 1;
  display: inline-flex;
}

.studio-share-people-count {
  background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 16%, transparent);
  width: 16px;
  height: 16px;
  color: var(--color-cursor-text-bright);
  letter-spacing: 0;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  font-size: 9px;
  font-weight: 700;
  display: inline-flex;
}

.studio-share-people-top-copy > svg {
  stroke-width: 2px;
  width: 12px;
  height: 12px;
  color: var(--color-cursor-muted);
  flex: none;
}

.studio-share-people-item-label, .studio-share-people-top-copy > strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright);
  font-size: 11px;
  font-weight: 650;
  overflow: hidden;
}

.studio-share-people-top-copy > span:not(.studio-share-people-count):not(.studio-share-people-item-label) {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-muted);
  font-size: 10px;
  overflow: hidden;
}

.studio-share-people-top-actions {
  flex: none;
  align-items: center;
  gap: 4px;
  display: inline-flex;
}

.studio-share-people-icon-btn {
  appearance: none;
  box-sizing: border-box;
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-page, var(--color-cursor-panel, var(--mos-page)));
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  color: var(--color-cursor-muted);
  font: inherit;
  box-shadow: none;
  cursor: pointer;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-share-people-icon-btn > svg {
  stroke-width: 2px;
  flex: none;
  width: 12px;
  height: 12px;
}

.studio-share-people-icon-btn.is-close {
  color: var(--color-cursor-muted);
}

.studio-share-people-icon-btn.is-share {
  border-color: color-mix(in srgb,
    var(--color-cursor-accent, #3b82f6) 28%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 10%, var(--mos-page, var(--mos-page)));
  width: auto;
  min-width: 0;
  color: var(--color-cursor-text-bright);
  padding: 0 9px;
}

.studio-share-people-icon-btn.is-share > span {
  line-height: 1;
}

.studio-share-people-icon-btn:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover));
  color: var(--color-cursor-text);
}

.studio-share-people-icon-btn.is-share:hover:not(:disabled) {
  background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 16%, var(--mos-page, var(--mos-page)));
  color: var(--color-cursor-text-bright);
}

.studio-share-people-icon-btn:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.studio-share-confirm-dropdown-anchor {
  z-index: 720;
  width: 260px;
  position: fixed;
}

.studio-share-confirm-menu {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate, var(--cursor-surface-raised, var(--mos-plate)));
  box-shadow: var(--cursor-shadow-menu, var(--cursor-shadow-pop));
  color: var(--color-cursor-text-bright);
  border-radius: 12px;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  display: flex;
}

.studio-share-confirm-menu.is-dropdown {
  min-width: 248px;
  max-width: 260px;
}

.studio-share-confirm-menu.is-sheet {
  left: 0;
  right: 0;
  bottom: calc(var(--studio-mobile-bottom-chrome, calc(44px + env(safe-area-inset-bottom, 0px)))
      + var(--studio-keyboard-inset, 0px));
  z-index: 720;
  background: var(--mos-plate, var(--cursor-surface-raised, var(--mos-plate)));
  width: 100%;
  min-width: 0;
  max-width: none;
  height: auto;
  max-height: min(70vh, 420px);
  box-shadow: var(--studio-mobile-sheet-shadow, 0 -8px 32px #00000038);
  border-bottom: 0;
  border-left: 0;
  border-right: 0;
  border-radius: 18px 18px 0 0;
  padding: 0 16px 14px;
  position: fixed;
  top: auto;
}

.studio-share-confirm-sheet-grab {
  background: color-mix(in srgb, var(--mos-text, var(--color-cursor-text)) 40%, transparent);
  border-radius: 999px;
  width: 44px;
  height: 5px;
  margin: 12px auto 10px;
}

.studio-share-confirm-backdrop {
  z-index: 719;
  cursor: pointer;
  background: #00000047;
  border: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  inset: 0;
}

.studio-polish aside.is-share-people {
  flex-direction: column;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-polish aside.is-share-people > :not(.cursor-panel-head):not(.cursor-sidebar-head) {
  flex: auto;
  min-height: 0;
}

.studio-share-confirm-title {
  color: var(--color-cursor-muted);
  letter-spacing: .04em;
  text-transform: uppercase;
  margin: 0;
  font-size: 11px;
  font-weight: 700;
}

.studio-share-confirm-block {
  flex-direction: column;
  gap: 6px;
  display: flex;
}

.studio-share-confirm-label {
  color: var(--color-cursor-muted);
  letter-spacing: .03em;
  text-transform: uppercase;
  margin: 0;
  font-size: 10px;
  font-weight: 650;
}

.studio-share-confirm-segment {
  background: color-mix(in srgb, var(--color-cursor-muted) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 80%, transparent);
  border-radius: 10px;
  grid-template-columns: 1fr 1fr;
  gap: 2px;
  padding: 2px;
  display: grid;
}

.studio-share-confirm-segment.is-single {
  grid-template-columns: 1fr;
}

.studio-share-confirm-seg {
  min-height: 30px;
  color: var(--color-cursor-muted);
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 650;
  transition: background .12s, color .12s, box-shadow .12s;
  display: inline-flex;
}

.studio-share-confirm-seg:hover:not(:disabled):not(.is-active) {
  color: var(--color-cursor-text);
  background: color-mix(in srgb, var(--mos-page, #fff) 55%, transparent);
}

.studio-share-confirm-seg.is-active {
  background: var(--mos-page, #fff);
  color: var(--color-cursor-text-bright);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-cursor-border-soft) 70%, transparent),
    0 1px 2px #00000014;
}

.studio-share-confirm-seg:disabled {
  opacity: .45;
  cursor: not-allowed;
}

.studio-share-confirm-hint {
  min-height: 2.7em;
  color: var(--color-cursor-muted);
  margin: 0;
  font-size: 11px;
  line-height: 1.35;
}

.studio-share-confirm-actions {
  border-top: 1px solid var(--color-cursor-border-soft);
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 2px;
  padding-top: 2px;
  display: grid;
}

.studio-share-confirm-dismiss, .studio-share-confirm-submit {
  border: 1px solid var(--color-cursor-border-soft);
  min-height: 32px;
  color: var(--color-cursor-text);
  font: inherit;
  cursor: pointer;
  background: none;
  border-radius: 9px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 650;
}

.studio-share-confirm-dismiss:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-share-confirm-submit {
  border-color: color-mix(in srgb,
    var(--color-cursor-accent, #3b82f6) 32%,
    var(--color-cursor-border-soft));
  background: color-mix(in srgb,
    var(--color-cursor-accent, #3b82f6) 14%,
    var(--mos-page, #fff));
  color: var(--color-cursor-text-bright);
}

.studio-share-confirm-submit:hover:not(:disabled) {
  background: color-mix(in srgb,
    var(--color-cursor-accent, #3b82f6) 22%,
    var(--mos-page, #fff));
}

.studio-share-confirm-dismiss:disabled, .studio-share-confirm-submit:disabled {
  opacity: .45;
  cursor: not-allowed;
}

[data-appearance="dark"] .studio-share-confirm-seg.is-active {
  background: color-mix(in srgb, var(--mos-page, #1a1a1e) 88%, #fff);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--color-cursor-border-soft) 90%, transparent),
    0 1px 3px #00000059;
}

.studio-share-people-selected {
  border-bottom: 1px solid var(--color-cursor-border-soft);
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  display: flex;
}

.studio-share-people-chip {
  border-radius: var(--cursor-radius-pill, 999px);
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate, var(--cursor-surface-raised));
  max-width: 100%;
  height: 20px;
  min-height: 20px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  cursor: pointer;
  align-items: center;
  gap: 4px;
  padding: 0 6px 0 1px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-share-people-chip .studio-profile-avatar {
  --spa-size: 16px;
  --spa-font: 7px;
  width: 16px;
  height: 16px;
}

.studio-share-people-chip > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-share-people-chip > svg {
  stroke-width: 2px;
  opacity: .55;
  width: 10px;
  height: 10px;
  color: var(--color-cursor-muted);
  flex: none;
}

.studio-share-people-body {
  flex: auto;
  min-height: 0;
  padding: 0;
  overflow: auto;
}

.studio-share-people-bubble .studio-dm-row-copy {
  flex-direction: column;
  flex: auto;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.studio-share-people-bubble .studio-dm-row-copy strong {
  color: var(--color-cursor-text-bright);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 650;
  overflow: hidden;
}

.studio-share-people-bubble .studio-dm-row-copy > span {
  color: var(--color-cursor-muted);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  overflow: hidden;
}

.studio-share-people-bubble-check {
  background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 22%, transparent);
  width: 20px;
  height: 20px;
  color: var(--color-cursor-text-bright);
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-share-people-bubble-check > svg {
  stroke-width: 2.5px;
  width: 12px;
  height: 12px;
}

.studio-share-people-section-label {
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  margin: 6px 4px 4px;
  font-size: 10px;
  font-weight: 700;
}

.studio-share-people-empty {
  color: var(--color-cursor-muted);
  text-align: center;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 28px 16px;
  font-size: 12px;
  display: flex;
}

.studio-share-people-empty > svg {
  opacity: .7;
  width: 22px;
  height: 22px;
}

.studio-share-people-cancel, .studio-share-people-confirm {
  border-radius: var(--cursor-radius-md, 8px);
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate, var(--cursor-surface-raised));
  min-height: 26px;
  color: var(--color-cursor-text-bright);
  font: inherit;
  cursor: pointer;
  align-items: center;
  gap: 4px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 650;
  display: inline-flex;
}

.studio-share-people-cancel > svg, .studio-share-people-confirm > svg {
  stroke-width: 2px;
  width: 12px;
  height: 12px;
}

.studio-share-people-confirm {
  background: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 16%, transparent);
  border-color: color-mix(in srgb, var(--color-cursor-accent, #3b82f6) 42%, var(--color-cursor-border-soft));
}

.studio-share-people-confirm:disabled, .studio-share-people-cancel:disabled {
  opacity: .45;
  cursor: not-allowed;
}

/* [project]/src/studio/components/studio-share-receive.css [app-client] (css) */
:root {
  --studio-share-receive-z: 128;
}

.studio-mobile-sheet-backdrop.studio-share-receive-backdrop {
  z-index: var(--studio-share-receive-z);
  background: #0000005c;
}

.studio-mobile-app-menu-sheet.studio-share-receive-sheet {
  min-height: 0;
  color: var(--color-cursor-text);
  box-shadow: var(--studio-mobile-sheet-shadow, 0 -12px 40px #00000038);
  flex-direction: column;
  overflow: hidden;
  z-index: calc(var(--studio-share-receive-z) + 1) !important;
  background: var(--mos-plate, var(--mos-panel)) !important;
  display: flex !important;
  position: fixed !important;
}

.studio-mobile-app-menu-sheet.studio-share-receive-sheet.is-phone {
  padding-bottom: env(safe-area-inset-bottom, 0px);
  transform: none;
  top: auto !important;
  left: 0 !important;
  right: 0 !important;
  bottom: var(--studio-keyboard-inset, 0px) !important;
  width: auto !important;
  max-width: none !important;
  height: min(calc(100dvh - env(safe-area-inset-top, 0px) - 28px - var(--studio-keyboard-inset, 0px)),
    760px) !important;
  border-radius: 18px 18px 0 0 !important;
  max-height: none !important;
}

.studio-mobile-app-menu-sheet.studio-share-receive-sheet.is-desk {
  box-shadow: var(--cursor-shadow-menu, 0 12px 40px #00000047);
  border-radius: 18px !important;
  width: min(460px, 100vw - 32px) !important;
  max-width: none !important;
  height: min(720px, 100dvh - 64px) !important;
  max-height: none !important;
  inset: 50% auto auto 50% !important;
  transform: translate(-50%, -50%) !important;
}

.studio-share-receive-sheet.is-phone.is-entering {
  animation: .18s cubic-bezier(.22, 1, .36, 1) studio-share-receive-rise;
}

@keyframes studio-share-receive-rise {
  from {
    opacity: .9;
    transform: translate3d(0, 24px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.studio-share-receive-head.cursor-panel-head {
  border-bottom: 0;
  flex: none;
}

.studio-share-receive-title {
  align-items: baseline;
  gap: 8px;
  min-width: 0;
  display: inline-flex;
}

.studio-share-receive-title > strong {
  font-size: var(--studio-type-title);
  color: var(--color-cursor-text-bright);
  white-space: nowrap;
  font-weight: 650;
}

.studio-share-receive-title > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-size: var(--studio-type-meta);
  color: var(--color-cursor-muted);
  overflow: hidden;
}

.studio-share-receive-body.studio-mobile-sheet-body {
  flex-direction: column;
  flex: auto;
  gap: 0;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-share-receive-sheet .studio-share-receive-tabs.studio-admin-head-tabs {
  margin: 0 var(--studio-sheet-inline-pad, 12px) 8px;
  flex: none;
  padding: 3px;
}

.studio-share-receive-sheet .studio-share-receive-tabs .studio-admin-head-tab {
  flex: 1 1 0;
  justify-content: center;
  min-width: 0;
}

.studio-share-receive-target {
  min-height: 52px;
  margin: 0 var(--studio-sheet-inline-pad, 12px);
  background: var(--mos-plate-strong, var(--mos-plate));
  border-radius: 14px;
  flex: none;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  display: flex;
}

.studio-share-receive-target-avatar {
  flex: none;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  display: inline-flex;
}

.studio-share-receive-target-avatar .studio-profile-avatar {
  width: 36px !important;
  height: 36px !important;
}

.studio-share-receive-target-glyph, .studio-share-receive-group-avatar {
  background: color-mix(in srgb, var(--color-cursor-accent, var(--cursor-accent)) 16%, transparent);
  width: 36px;
  height: 36px;
  color: var(--color-cursor-accent, var(--cursor-accent));
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-share-receive-target-glyph.is-files {
  border-radius: 10px;
}

.studio-share-receive-target-glyph > svg, .studio-share-receive-group-avatar > svg {
  stroke-width: 2px;
  width: 18px;
  height: 18px;
}

.studio-share-receive-target-copy {
  flex-direction: column;
  flex: auto;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.studio-share-receive-target-copy > strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--studio-type-title);
  color: var(--color-cursor-text-bright);
  font-weight: 650;
  line-height: 1.2;
  overflow: hidden;
}

.studio-share-receive-target-copy > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--studio-type-meta);
  color: var(--color-cursor-muted);
  line-height: 1.2;
  overflow: hidden;
}

.studio-share-receive-target.is-empty .studio-share-receive-target-copy > strong {
  color: var(--color-cursor-text);
}

.studio-share-receive-strip {
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  padding: 10px var(--studio-sheet-inline-pad, 12px) 4px;
  flex: none;
  gap: 8px;
  display: flex;
  overflow-x: auto;
}

.studio-share-receive-strip::-webkit-scrollbar {
  display: none;
}

.studio-share-receive-tile {
  background: var(--mos-plate-strong, var(--mos-plate));
  border-radius: 12px;
  flex: none;
  width: 72px;
  height: 72px;
  margin: 0;
  display: flex;
  position: relative;
  overflow: hidden;
}

.studio-share-receive-tile > img, .studio-share-receive-tile > video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.studio-share-receive-tile.is-document, .studio-share-receive-tile.is-audio {
  box-sizing: border-box;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  width: 112px;
  padding: 10px;
}

.studio-share-receive-tile-glyph {
  width: 100%;
  height: 100%;
  color: var(--color-cursor-muted);
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-share-receive-tile.is-document .studio-share-receive-tile-glyph, .studio-share-receive-tile.is-audio .studio-share-receive-tile-glyph {
  width: auto;
  height: auto;
}

.studio-share-receive-tile-glyph > svg {
  stroke-width: 1.8px;
  width: 20px;
  height: 20px;
}

.studio-share-receive-tile > figcaption {
  -webkit-line-clamp: 2;
  font-size: var(--studio-type-meta);
  color: var(--color-cursor-text);
  word-break: break-word;
  -webkit-box-orient: vertical;
  line-height: 1.25;
  display: -webkit-box;
  overflow: hidden;
}

.studio-share-receive-tile-badge {
  width: 20px;
  height: 20px;
  color: var(--color-cursor-text-bright);
  background: #0000008c;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  position: absolute;
  bottom: 6px;
  left: 6px;
}

.studio-share-receive-tile-badge > svg {
  width: 11px;
  height: 11px;
}

.studio-share-receive-tile-state, .studio-share-receive-tile-pct {
  box-sizing: border-box;
  min-width: 20px;
  height: 20px;
  font-size: var(--studio-type-meta);
  color: var(--color-cursor-text-bright);
  background: #0000008c;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 5px;
  font-weight: 700;
  display: inline-flex;
  position: absolute;
  top: 6px;
  right: 6px;
}

.studio-share-receive-tile-state.is-done {
  background: var(--color-cursor-accent, var(--cursor-accent));
  color: var(--cursor-accent-contrast, var(--color-cursor-text-bright));
}

.studio-share-receive-tile-state.is-error {
  background: var(--color-cursor-danger, #e5484d);
}

.studio-share-receive-tile-state > svg {
  stroke-width: 3px;
  width: 12px;
  height: 12px;
}

.studio-share-receive-tile.is-queued {
  opacity: .72;
}

.studio-share-receive-tile.is-skipped {
  opacity: .4;
}

.studio-share-receive-textcard {
  background: var(--mos-plate-strong, var(--mos-plate));
  box-sizing: border-box;
  border-radius: 12px;
  flex: 1 0 auto;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  max-width: 100%;
  padding: 10px 12px;
  display: flex;
}

.studio-share-receive-textcard.is-compact {
  flex: 0 0 220px;
  max-width: 220px;
  height: 72px;
}

.studio-share-receive-textcard-icon {
  background: color-mix(in srgb, var(--color-cursor-accent, var(--cursor-accent)) 16%, transparent);
  width: 28px;
  height: 28px;
  color: var(--color-cursor-accent, var(--cursor-accent));
  border-radius: 8px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-share-receive-textcard-icon > svg {
  width: 15px;
  height: 15px;
}

.studio-share-receive-textcard-copy {
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  display: flex;
}

.studio-share-receive-textcard-copy > strong {
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--studio-type-body);
  color: var(--color-cursor-text-bright);
  font-weight: 650;
  overflow: hidden;
}

.studio-share-receive-textcard-copy > span {
  -webkit-line-clamp: 2;
  font-size: var(--studio-type-meta);
  color: var(--color-cursor-muted);
  word-break: break-word;
  -webkit-box-orient: vertical;
  line-height: 1.3;
  display: -webkit-box;
  overflow: hidden;
}

.studio-share-receive-main {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-share-receive-search {
  padding: 8px var(--studio-sheet-inline-pad, 12px) 4px;
  flex: none;
}

.studio-share-receive-search .cursor-panel-search {
  background: var(--mos-plate-strong, var(--mos-plate));
  border: none;
  border-radius: 999px;
}

.studio-share-receive-list {
  padding: 4px calc(var(--studio-sheet-inline-pad, 12px) - 4px) 8px;
  overscroll-behavior: contain;
  flex: auto;
  min-height: 0;
  margin: 0;
  list-style: none;
  overflow-y: auto;
}

.studio-share-receive-list > li {
  margin: 0;
}

.studio-share-receive-list-label {
  font-size: var(--studio-type-meta);
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--color-cursor-muted);
  padding: 10px 8px 4px;
  font-weight: 650;
}

.studio-dm-row.studio-share-receive-row {
  text-align: left;
  border-radius: 12px;
  width: 100%;
}

.studio-dm-row.studio-share-receive-row.is-active {
  background: var(--mos-plate-strong, var(--mos-plate));
}

.studio-share-receive-row .studio-dm-row-main {
  align-items: center;
}

.studio-share-receive-radio {
  border: 1.5px solid var(--color-cursor-border, var(--color-cursor-border-soft));
  width: 22px;
  height: 22px;
  color: var(--cursor-accent-contrast, var(--color-cursor-text-bright));
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  display: inline-flex;
}

.studio-share-receive-radio.is-on {
  border-color: var(--color-cursor-accent, var(--cursor-accent));
  background: var(--color-cursor-accent, var(--cursor-accent));
}

.studio-share-receive-radio > svg {
  stroke-width: 3px;
  width: 13px;
  height: 13px;
}

.studio-share-receive-empty {
  padding: 24px var(--studio-sheet-inline-pad, 12px);
  font-size: var(--studio-type-body);
  color: var(--color-cursor-muted);
  text-align: center;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-share-receive-empty.is-quiet {
  padding: 18px var(--studio-sheet-inline-pad, 12px);
}

.studio-share-receive-empty > svg {
  flex: none;
  width: 16px;
  height: 16px;
}

.studio-share-receive-spin {
  animation: .9s linear infinite studio-share-receive-spin;
}

@keyframes studio-share-receive-spin {
  to {
    transform: rotate(360deg);
  }
}

.studio-share-receive-folders {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
}

.studio-share-receive-crumbs {
  min-height: var(--cursor-section-h, 36px);
  padding: 8px var(--studio-sheet-inline-pad, 12px) 2px;
  flex: none;
  align-items: center;
  gap: 6px;
  display: flex;
}

.studio-share-receive-crumb-up {
  appearance: none;
  background: var(--mos-plate-strong, var(--mos-plate));
  width: 28px;
  height: 28px;
  color: var(--color-cursor-text);
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-share-receive-crumb-up.is-home {
  cursor: default;
  color: var(--color-cursor-muted);
}

.studio-share-receive-crumb-up > svg {
  width: 15px;
  height: 15px;
}

.studio-share-receive-crumb-trail {
  scrollbar-width: none;
  white-space: nowrap;
  align-items: center;
  min-width: 0;
  display: flex;
  overflow-x: auto;
}

.studio-share-receive-crumb {
  flex: none;
  align-items: center;
  display: inline-flex;
}

.studio-share-receive-crumb > svg {
  width: 13px;
  height: 13px;
  color: var(--color-cursor-muted);
}

.studio-share-receive-crumb > button {
  appearance: none;
  font: inherit;
  font-size: var(--studio-type-body);
  color: var(--color-cursor-muted);
  cursor: pointer;
  background: none;
  border: 0;
  padding: 4px;
}

.studio-share-receive-crumb > button:disabled {
  color: var(--color-cursor-text-bright);
  cursor: default;
  font-weight: 650;
}

.studio-share-receive-folder {
  appearance: none;
  width: 100%;
  min-height: 48px;
  color: var(--color-cursor-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 12px;
  align-items: center;
  gap: 12px;
  padding: 6px 8px;
  display: flex;
}

.studio-share-receive-folder:hover, .studio-share-receive-folder:focus-visible {
  background: var(--mos-plate-strong, var(--mos-plate));
}

.studio-share-receive-folder-icon {
  background: var(--mos-plate-strong, var(--mos-plate));
  width: 36px;
  height: 36px;
  color: var(--color-cursor-accent, var(--cursor-accent));
  border-radius: 10px;
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.studio-share-receive-folder-icon > svg {
  width: 18px;
  height: 18px;
}

.studio-share-receive-folder-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-size: var(--studio-type-title);
  flex: auto;
  font-weight: 560;
  overflow: hidden;
}

.studio-share-receive-folder-chev {
  width: 16px;
  height: 16px;
  color: var(--color-cursor-muted);
  flex: none;
}

.studio-share-receive-agent {
  padding: 12px var(--studio-sheet-inline-pad, 12px);
  flex-direction: column;
  gap: 10px;
  display: flex;
  overflow-y: auto;
}

.studio-share-receive-hint {
  font-size: var(--studio-type-body);
  color: var(--color-cursor-muted);
  margin: 0;
  line-height: 1.4;
}

.studio-share-receive-chips {
  flex-wrap: wrap;
  gap: 6px;
  display: flex;
}

.studio-share-receive-chip {
  appearance: none;
  background: var(--mos-plate-strong, var(--mos-plate));
  min-height: 32px;
  color: var(--color-cursor-text);
  font: inherit;
  font-size: var(--studio-type-body);
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  align-items: center;
  padding: 0 12px;
  display: inline-flex;
}

.studio-share-receive-chip.is-active {
  background: color-mix(in srgb, var(--color-cursor-accent, var(--cursor-accent)) 22%, var(--mos-plate-strong, var(--mos-plate)));
  color: var(--color-cursor-text-bright);
}

.studio-share-receive-notices {
  padding: 4px var(--studio-sheet-inline-pad, 12px);
  font-size: var(--studio-type-meta);
  color: var(--color-cursor-muted);
  flex: none;
  margin: 0;
  list-style: none;
}

.studio-share-receive-error {
  padding: 6px var(--studio-sheet-inline-pad, 12px);
  font-size: var(--studio-type-body);
  color: var(--color-cursor-danger, #e5484d);
  flex: none;
  margin: 0;
}

.studio-share-receive-foot {
  padding: 8px var(--studio-sheet-inline-pad, 12px) 12px;
  border-top: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft));
  flex-direction: column;
  flex: none;
  gap: 8px;
  display: flex;
}

.studio-share-receive-composer {
  align-items: flex-end;
  gap: 8px;
  display: flex;
}

.studio-share-receive-input.cursor-input {
  resize: none;
  field-sizing: content;
  min-width: 0;
  min-height: 40px;
  max-height: 132px;
  font-size: var(--studio-type-pane);
  background: var(--mos-plate-strong, var(--mos-plate));
  border-radius: 20px;
  flex: auto;
  padding: 10px 14px;
  line-height: 1.35;
}

.studio-share-receive-send {
  appearance: none;
  background: var(--color-cursor-accent, var(--cursor-accent));
  width: 40px;
  height: 40px;
  color: var(--cursor-accent-contrast, var(--color-cursor-text-bright));
  cursor: pointer;
  border: 0;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: inline-flex;
}

.studio-share-receive-send:disabled {
  opacity: .42;
  cursor: default;
}

.studio-share-receive-send > svg {
  stroke-width: 2.2px;
  width: 18px;
  height: 18px;
}

.studio-share-receive-actions {
  display: flex;
}

.studio-share-receive-primary.cursor-settings-action {
  border-radius: 999px;
  flex: auto;
  justify-content: center;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  display: inline-flex;
}

.studio-share-receive-primary > svg {
  width: 16px;
  height: 16px;
}

.studio-share-receive-progress {
  flex-direction: column;
  gap: 4px;
  display: flex;
}

.studio-share-receive-progress-track {
  background: var(--mos-plate-strong, var(--mos-plate));
  border-radius: 999px;
  height: 4px;
  display: block;
  position: relative;
  overflow: hidden;
}

.studio-share-receive-progress-fill {
  border-radius: inherit;
  background: var(--color-cursor-accent, var(--cursor-accent));
  transition: width .16s linear;
  position: absolute;
  inset: 0 auto 0 0;
}

.studio-share-receive-progress-label {
  font-size: var(--studio-type-meta);
  color: var(--color-cursor-muted);
}

/* [project]/src/studio/components/StudioSitePreviewPane.css [app-client] (css) */
.studio-chrome-pane.studio-site-preview-pane > .studio-chrome-pane-body {
  overflow: hidden;
}

.studio-site-preview-pane > .cursor-panel-head .cursor-icon-btn {
  background: var(--mos-page);
  width: 24px;
  height: 24px;
  box-shadow: inset 0 0 0 1px var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: 999px;
}

.studio-site-preview-pane > .cursor-panel-head .cursor-icon-btn:hover:not(:disabled), .studio-site-preview-pane > .cursor-panel-head .cursor-icon-btn.is-on, .studio-site-preview-pane > .cursor-panel-head .cursor-icon-btn[aria-pressed="true"] {
  background: var(--mos-plate-strong, var(--mos-raised));
  border-radius: 999px;
}

.studio-site-preview-pane > .cursor-panel-head .studio-chrome-btn.is-compact {
  border-radius: 999px;
  width: auto;
  min-height: 28px;
  padding: 0 12px;
}

.studio-site-preview-body {
  background: var(--mos-page);
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.studio-site-preview-shell {
  flex: auto;
  min-width: 0;
  min-height: 0;
  display: flex;
}

.studio-site-preview-stage {
  background: var(--mos-page);
  flex-direction: column;
  flex: auto;
  justify-content: center;
  align-items: center;
  min-width: 0;
  min-height: 0;
  padding: 8px;
  display: flex;
  overflow: hidden;
}

.studio-site-preview-stage.is-desktop {
  justify-content: flex-start;
  align-items: stretch;
}

.studio-site-preview-stage.is-tablet, .studio-site-preview-stage.is-mobile {
  padding: 12px;
}

.studio-site-preview-device {
  background: var(--mos-plate);
  flex-direction: column;
  flex: auto;
  width: 100%;
  max-width: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-site-preview-device.is-desktop {
  background: var(--mos-plate);
  height: 100%;
  min-height: 0;
  box-shadow: var(--cursor-shadow-menu);
  border-radius: 12px;
}

.studio-site-preview-device.is-tablet, .studio-site-preview-device.is-mobile {
  height: 100%;
  max-height: 100%;
  box-shadow: var(--cursor-shadow-menu);
  border-radius: 18px;
  flex: 0 auto;
  margin: 0 auto;
}

.studio-site-preview-device.is-mobile {
  border-radius: 24px;
}

.studio-site-preview-frame {
  background: var(--mos-plate);
  border: 0;
  flex: auto;
  width: 100%;
  height: 100%;
  min-height: 0;
}

.studio-site-preview-settings {
  border-left: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  flex: 0 0 clamp(288px, 28vw, 340px);
  width: clamp(288px, 28vw, 340px);
}

.studio-site-preview-settings .cursor-panel-head {
  padding-inline: 4px;
}

.studio-site-preview-settings .studio-admin-head-tabs {
  width: 100%;
}

.studio-site-preview-settings .studio-admin-head-tab {
  flex: 1 1 0;
  justify-content: center;
  min-width: 0;
  padding-inline: 7px;
  font-size: 11px;
}

.studio-site-preview-settings .studio-chrome-rail-body {
  flex-direction: column;
  gap: 8px;
  padding: 8px;
  display: flex;
}

.studio-site-preview-settings .studio-chrome-settings-card-body > .studio-chrome-field {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  box-sizing: border-box;
  padding: 10px;
}

.studio-site-preview-hint {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  color: var(--color-cursor-muted, var(--mos-text-muted));
  box-sizing: border-box;
  margin: 0;
  padding: 10px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-site-preview-msg, .studio-site-preview-error {
  color: var(--color-cursor-muted, var(--mos-text-muted));
  margin: 0;
  padding: 16px;
  font-size: 13px;
}

.studio-site-preview-error {
  color: var(--color-cursor-danger, var(--mos-danger));
}

.studio-site-preview-status, .studio-site-preview-live {
  color: var(--color-cursor-muted, var(--mos-text-muted));
  padding: 0 6px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
}

.studio-site-preview-live {
  height: 28px;
  color: var(--color-cursor-text, var(--mos-text));
  box-sizing: border-box;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0 10px;
  display: inline-flex;
}

.studio-site-preview-live:hover {
  color: var(--color-cursor-text-bright, var(--mos-text-bright));
}

.studio-site-preview-pane > .cursor-panel-head .studio-site-preview-live:hover {
  background: var(--mos-plate-strong, var(--mos-raised));
  color: var(--color-cursor-text-bright, var(--mos-text-bright));
}

/* [project]/src/studio/components/studio-sounds-alerts.css [app-client] (css) */
.studio-sounds-alerts {
  gap: 14px;
}

.studio-sounds-card {
  gap: 14px !important;
  display: grid !important;
}

.studio-sounds-card-head {
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  display: flex;
}

.studio-sounds-card-title {
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
  display: flex;
}

.studio-sounds-card-icon {
  width: 36px;
  height: 36px;
  color: var(--color-cursor-text-bright);
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, var(--color-cursor-hover));
  border: 1px solid color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 18%, transparent);
  border-radius: 12px;
  flex: none;
  place-items: center;
  display: grid;
}

.studio-sounds-card-icon svg {
  width: 17px;
  height: 17px;
}

.studio-sounds-card-title strong {
  letter-spacing: -.01em;
  color: var(--color-cursor-text-bright);
  font-size: 14px;
  font-weight: 650;
  display: block;
}

.studio-sounds-card-title p {
  color: var(--color-cursor-muted);
  margin: 3px 0 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-sounds-banner {
  color: var(--color-cursor-muted);
  background: color-mix(in srgb, var(--color-cursor-hover) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 85%, transparent);
  border-radius: 12px;
  margin: 0;
  padding: 10px 12px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-sounds-banner.is-warn {
  color: color-mix(in srgb, #c45c26 55%, var(--color-cursor-text));
  background: color-mix(in srgb, #c45c26 10%, var(--color-cursor-hover));
  border-color: #c45c2638;
}

.studio-sounds-body.is-dimmed, .studio-sounds-rows.is-dimmed {
  opacity: .55;
  pointer-events: none;
}

.studio-sounds-volume {
  gap: 8px;
  display: grid;
}

.studio-sounds-volume-meta {
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  display: flex;
}

.studio-sounds-volume-meta span {
  color: var(--color-cursor-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 11px;
  font-weight: 650;
}

.studio-sounds-volume-meta strong {
  font-variant-numeric: tabular-nums;
  color: var(--color-cursor-text);
  font-size: 12px;
  font-weight: 650;
}

.studio-sounds-volume input[type="range"] {
  appearance: none;
  background: color-mix(in srgb, var(--color-cursor-border-soft) 90%, transparent);
  cursor: pointer;
  border-radius: 999px;
  outline: none;
  width: 100%;
  height: 6px;
}

.studio-sounds-volume input[type="range"]::-webkit-slider-thumb {
  appearance: none;
  background: var(--color-cursor-text-bright);
  border: 2px solid color-mix(in srgb, var(--mos-surface, #111) 35%, white);
  border-radius: 50%;
  width: 16px;
  height: 16px;
  box-shadow: 0 1px 4px #00000038;
}

.studio-sounds-volume input[type="range"]:disabled {
  cursor: default;
  opacity: .6;
}

.studio-sounds-rows {
  border-top: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 80%, transparent);
  gap: 2px;
  padding-top: 2px;
  display: grid;
}

.studio-sounds-row {
  border-bottom: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 55%, transparent);
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 11px 2px;
  display: flex;
}

.studio-sounds-row:last-child {
  border-bottom: 0;
  padding-bottom: 2px;
}

.studio-sounds-row-copy {
  text-align: left;
  cursor: pointer;
  min-width: 0;
  color: inherit;
  background: none;
  border: 0;
  gap: 2px;
  padding: 0;
  display: grid;
}

.studio-sounds-row-copy.is-static {
  cursor: default;
}

.studio-sounds-row-copy strong {
  color: var(--color-cursor-text-bright);
  font-size: 13px;
  font-weight: 650;
}

.studio-sounds-row-copy span {
  color: var(--color-cursor-muted);
  font-size: 11.5px;
  line-height: 1.35;
}

.studio-sounds-row-copy:disabled {
  cursor: default;
  opacity: .7;
}

.studio-sounds-previews {
  flex-wrap: wrap;
  gap: 6px;
  padding-top: 4px;
  display: flex;
}

.studio-sounds-preview-chip {
  appearance: none;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 90%, transparent);
  background: color-mix(in srgb, var(--color-cursor-hover) 55%, transparent);
  color: var(--color-cursor-text);
  cursor: pointer;
  border-radius: 999px;
  padding: 5px 11px;
  font-size: 11.5px;
  font-weight: 600;
  line-height: 1.2;
  transition: background .12s, border-color .12s, transform .1s;
}

.studio-sounds-preview-chip:hover:not(:disabled) {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 10%, var(--color-cursor-hover));
  border-color: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 22%, transparent);
}

.studio-sounds-preview-chip:active:not(:disabled) {
  transform: scale(.97);
}

.studio-sounds-preview-chip:disabled {
  opacity: .5;
  cursor: default;
}

.studio-sounds-push-bar {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 8%, var(--color-cursor-hover));
  border: 1px solid color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 16%, transparent);
  border-radius: 14px;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 12px;
  display: flex;
}

.studio-sounds-push-copy {
  gap: 2px;
  min-width: 0;
  display: grid;
}

.studio-sounds-push-copy strong {
  color: var(--color-cursor-text-bright);
  font-size: 13px;
  font-weight: 650;
}

.studio-sounds-push-copy span {
  color: var(--color-cursor-muted);
  font-size: 11.5px;
  line-height: 1.35;
}

.studio-sounds-push-btn {
  appearance: none;
  border: 1px solid color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 28%, transparent);
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 88%, black);
  color: #fff;
  cursor: pointer;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 650;
  display: inline-flex;
}

.studio-sounds-push-btn.is-on {
  color: var(--color-cursor-text-bright);
  border-color: color-mix(in srgb, var(--color-cursor-border-soft) 95%, transparent);
  background: none;
}

.studio-sounds-push-btn.is-error {
  border-color: #c45c2666;
}

.studio-sounds-push-btn:disabled {
  opacity: .55;
  cursor: default;
}

@media (max-width: 520px) {
  .studio-sounds-push-bar {
    flex-direction: column;
    align-items: stretch;
  }

  .studio-sounds-push-btn {
    width: 100%;
  }
}

/* [project]/src/studio/components/studio-tiktok.css [app-client] (css) */
.studio-tiktok-post-rail {
  background: var(--mos-page, var(--mos-panel));
}

.studio-tiktok-post-form {
  box-sizing: border-box;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 12px;
  display: flex;
}

.studio-tiktok-post-preview {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  aspect-ratio: 9 / 16;
  max-height: 220px;
  overflow: hidden;
}

.studio-tiktok-post-preview video, .studio-tiktok-post-preview img {
  object-fit: contain;
  background: var(--mos-plate-strong, var(--mos-plate));
  width: 100%;
  height: 100%;
  display: block;
}

.studio-tiktok-post-preview p {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  padding: 16px 12px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-tiktok-post-account, .studio-tiktok-post-file, .studio-tiktok-post-status, .studio-tiktok-post-error, .studio-tiktok-commercial-note, .studio-tiktok-music-note, .studio-tiktok-process-note {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-tiktok-post-account {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-tiktok-post-account strong {
  font-weight: 650;
}

.studio-tiktok-post-file, .studio-tiktok-commercial-note, .studio-tiktok-music-note, .studio-tiktok-process-note {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-tiktok-post-error {
  color: var(--mos-danger, var(--color-cursor-danger));
}

.studio-tiktok-post-status {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-tiktok-post-form .studio-chrome-field, .studio-tiktok-post-form .studio-settings-field {
  width: 100%;
}

.studio-tiktok-music-note a {
  color: inherit;
  text-underline-offset: 2px;
  text-decoration: underline;
}

.studio-tiktok-post-mobile {
  z-index: 40;
  background: var(--mos-page, var(--mos-panel));
  flex-direction: column;
  display: flex;
  position: fixed;
  inset: 0;
}

.studio-tiktok-post-mobile .studio-tiktok-post-rail {
  border-left: 0;
}

.studio-tiktok-account {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  gap: 4px;
  padding: 8px 10px;
  display: grid;
}

.studio-tiktok-account-hero {
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.studio-tiktok-account-avatar {
  flex: none;
}

.studio-tiktok-account-stats {
  text-align: center;
  flex: auto;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-width: 0;
  display: grid;
}

.studio-tiktok-account-stats strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  display: block;
}

.studio-tiktok-account-stats span {
  color: var(--color-cursor-muted, var(--mos-muted));
  letter-spacing: .01em;
  font-size: 10px;
  font-weight: 600;
}

.studio-tiktok-account-name {
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 13px;
  font-weight: 650;
}

.studio-tiktok-account-bio {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

/* [project]/src/studio/components/studio-linkedin.css [app-client] (css) */
.studio-linkedin-post-rail {
  background: var(--mos-page, var(--mos-panel));
}

.studio-linkedin-post-form {
  box-sizing: border-box;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 12px;
  display: flex;
}

.studio-linkedin-post-preview {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  aspect-ratio: 9 / 16;
  max-height: 220px;
  overflow: hidden;
}

.studio-linkedin-post-preview video, .studio-linkedin-post-preview img {
  object-fit: contain;
  background: var(--mos-plate-strong, var(--mos-plate));
  width: 100%;
  height: 100%;
  display: block;
}

.studio-linkedin-post-preview p {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  padding: 16px 12px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-linkedin-post-account, .studio-linkedin-post-file, .studio-linkedin-post-status, .studio-linkedin-post-error, .studio-linkedin-process-note {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-linkedin-post-account {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-linkedin-post-account strong {
  font-weight: 650;
}

.studio-linkedin-post-file, .studio-linkedin-process-note {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-linkedin-post-error {
  color: var(--mos-danger, var(--color-cursor-danger));
}

.studio-linkedin-post-status {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-linkedin-post-form .studio-chrome-field, .studio-linkedin-post-form .studio-settings-field {
  width: 100%;
}

.studio-linkedin-post-mobile {
  z-index: 40;
  background: var(--mos-page, var(--mos-panel));
  flex-direction: column;
  display: flex;
  position: fixed;
  inset: 0;
}

.studio-linkedin-post-mobile .studio-linkedin-post-rail {
  border-left: 0;
}

.studio-linkedin-account {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  gap: 4px;
  padding: 8px 10px;
  display: grid;
}

.studio-linkedin-account-hero {
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.studio-linkedin-account-avatar {
  flex: none;
}

.studio-linkedin-account-stats {
  text-align: center;
  flex: auto;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
  display: grid;
}

.studio-linkedin-account-stats.is-page {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.studio-chrome-settings-card .studio-admin-section + .studio-admin-section {
  border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
}

.studio-linkedin-page-empty {
  gap: 4px;
  display: grid;
}

.studio-linkedin-account-stats strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  display: block;
}

.studio-linkedin-account-stats span {
  color: var(--color-cursor-muted, var(--mos-muted));
  letter-spacing: .01em;
  font-size: 10px;
  font-weight: 600;
}

.studio-linkedin-account-name {
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 13px;
  font-weight: 650;
}

.studio-linkedin-account-bio {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

/* [project]/src/studio/components/studio-google.css [app-client] (css) */
.studio-google-post-rail {
  background: var(--mos-page, var(--mos-panel));
}

.studio-google-post-form {
  box-sizing: border-box;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 12px;
  display: flex;
}

.studio-google-post-preview {
  border-radius: var(--cursor-radius-md, 8px);
  background: var(--mos-plate);
  aspect-ratio: 16 / 9;
  max-height: 220px;
  overflow: hidden;
}

.studio-google-post-preview video, .studio-google-post-preview img {
  object-fit: contain;
  background: var(--mos-plate-strong, var(--mos-plate));
  width: 100%;
  height: 100%;
  display: block;
}

.studio-google-post-preview p {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  padding: 16px 12px;
  font-size: 12px;
  line-height: 1.4;
}

.studio-google-post-account, .studio-google-post-file, .studio-google-post-status, .studio-google-post-error, .studio-google-process-note {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-google-post-account {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-google-post-account strong {
  font-weight: 650;
}

.studio-google-post-file, .studio-google-process-note {
  color: var(--color-cursor-muted, var(--mos-muted));
}

.studio-google-post-error {
  color: var(--mos-danger, var(--color-cursor-danger));
}

.studio-google-post-status {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-google-post-form .studio-chrome-field {
  width: 100%;
}

.studio-google-post-mobile {
  z-index: 40;
  background: var(--mos-page, var(--mos-panel));
  flex-direction: column;
  display: flex;
  position: fixed;
  inset: 0;
}

.studio-google-post-mobile .studio-google-post-rail {
  border-left: 0;
}

.studio-google-account {
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  gap: 4px;
  padding: 8px 10px;
  display: grid;
}

.studio-google-account-hero {
  align-items: center;
  gap: 10px;
  min-width: 0;
  display: flex;
}

.studio-google-account-avatar {
  flex: none;
}

.studio-google-account-stats {
  text-align: center;
  flex: auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-width: 0;
  display: grid;
}

.studio-google-account-stats strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  display: block;
}

.studio-google-account-stats span {
  color: var(--color-cursor-muted, var(--mos-muted));
  letter-spacing: .01em;
  font-size: 10px;
  font-weight: 600;
}

.studio-google-account-name {
  color: var(--color-cursor-text, var(--mos-text));
  margin: 0;
  font-size: 13px;
  font-weight: 650;
}

.studio-google-account-bio {
  color: var(--color-cursor-muted, var(--mos-muted));
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
}

.studio-google-list {
  gap: 6px;
  padding: 8px 10px 10px;
  display: grid;
}

.studio-google-list-item {
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: flex;
}

.studio-google-list-item p {
  min-width: 0;
  color: var(--color-cursor-text, var(--mos-text));
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  overflow: hidden;
}

.studio-google-list-item span {
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
  font-size: 11px;
}

/* [project]/src/studio/components/studio-voice-picker.css [app-client] (css) */
.studio-voice-picker {
  box-sizing: border-box;
  flex-direction: column;
  flex: auto;
  gap: 12px;
  height: auto;
  min-height: 0;
  padding: 10px 12px 14px;
  display: flex;
  overflow: hidden;
}

.studio-voice-picker.is-embedded {
  flex: auto;
  gap: 0;
  height: 100%;
  min-height: 0;
  max-height: none;
  padding: 0;
}

.studio-composer-options-panel:has(.studio-voice-picker) {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.studio-composer-options-panel.is-overlay:has(.studio-voice-picker) > .studio-voice-picker {
  flex: auto;
  min-height: 0;
}

.studio-composer-options-panel:has(.studio-voice-picker)::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.studio-voice-picker-check {
  color: color-mix(in srgb, var(--color-cursor-text-bright, #f4f6fb) 78%, transparent);
  align-items: center;
  font-size: 12px;
  flex-direction: row !important;
  gap: 8px !important;
  display: inline-flex !important;
}

.studio-voice-picker-avatar {
  cursor: pointer;
  background: none;
  border-radius: 999px;
  flex: none;
  place-items: center;
  width: 36px;
  height: 36px;
  display: grid;
  position: relative;
  overflow: visible;
}

.studio-voice-picker.studio-vp {
  gap: 0;
  padding: 0;
}

.studio-vp-head {
  border-bottom: 1px solid var(--studio-chrome-divider, var(--color-cursor-border-soft, var(--mos-border-soft)));
  flex-direction: column;
  flex: none;
  gap: 8px;
  padding: 12px 12px 8px;
  display: flex;
}

.studio-vp-tabs.studio-admin-head-tabs {
  align-self: stretch;
}

.studio-vp-search .cursor-panel-search {
  height: var(--studio-h-control, 32px);
  min-height: var(--studio-h-control, 32px);
  margin: 0;
}

.studio-vp-search-tools {
  align-items: center;
  gap: 2px;
  display: inline-flex;
}

.studio-vp-search-tools .studio-file-add-wrap {
  display: inline-flex;
}

.studio-vp-search-clear.cursor-icon-btn {
  width: 24px;
  min-width: 24px;
  height: 24px;
}

.studio-vp-chips {
  flex-wrap: wrap;
  gap: 4px;
  display: flex;
}

.studio-vp-chip {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, var(--mos-plate));
  height: 24px;
  color: var(--color-cursor-text, var(--mos-text));
  font-size: var(--studio-type-meta, 12px);
  cursor: pointer;
  border: 0;
  border-radius: 6px;
  align-items: center;
  gap: 4px;
  padding: 0 6px 0 8px;
  font-weight: 500;
  display: inline-flex;
}

.studio-vp-chip svg {
  color: var(--color-cursor-muted, var(--mos-text-muted));
}

.studio-vp-chip:hover svg {
  color: var(--color-cursor-text, var(--mos-text));
}

.studio-vp-list {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  flex-direction: column;
  flex: auto;
  gap: 2px;
  min-height: 0;
  padding: 8px;
  display: flex;
  position: relative;
  overflow-y: auto;
}

.studio-vp-row {
  border-radius: 8px;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 8px;
  display: grid;
}

.studio-vp-row:hover {
  background: var(--mos-plate-strong, color-mix(in srgb, var(--mos-text) 5%, transparent));
}

.studio-vp-row.is-selected {
  background: color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 12%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent);
}

.studio-vp-orb {
  width: 36px;
  height: 36px;
  display: inline-grid;
  position: relative;
}

.studio-vp-orb-alert {
  background: var(--mos-page, var(--color-cursor-panel));
  width: 16px;
  height: 16px;
  color: var(--cursor-danger, var(--color-cursor-danger, #ef4444));
  pointer-events: none;
  border-radius: 999px;
  place-items: center;
  display: grid;
  position: absolute;
  bottom: -3px;
  right: -3px;
}

.studio-vp-row-main {
  min-width: 0;
  color: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  flex-direction: column;
  gap: 2px;
  padding: 0;
  display: flex;
}

.studio-vp-row-main strong, .studio-vp-row-main span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.studio-vp-row-main strong {
  font-size: var(--studio-type-body, 13px);
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-weight: 500;
}

.studio-vp-row-main span {
  font-size: var(--studio-type-meta, 12px);
  color: var(--color-cursor-muted, var(--mos-text-muted));
}

.studio-vp-row-main span.is-error {
  color: var(--cursor-danger, var(--color-cursor-danger, #ef4444));
}

.studio-vp-save.cursor-icon-btn {
  color: var(--color-cursor-muted, var(--mos-text-muted));
}

.studio-vp-save.cursor-icon-btn.is-saved {
  color: var(--cursor-accent, var(--mos-accent));
}

.studio-vp-empty {
  min-height: 120px;
  font-size: var(--studio-type-meta, 12px);
  color: var(--color-cursor-muted, var(--mos-text-muted));
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 16px;
  display: flex;
}

.studio-vp-empty.is-loading {
  pointer-events: none;
  min-height: 0;
  position: absolute;
  inset: 0;
}

.studio-vp-empty.is-more {
  min-height: 48px;
}

.studio-vp-sentinel {
  pointer-events: none;
  width: 100%;
  height: 1px;
}

.studio-audio-voice-chip, .studio-audio-suggest-chip {
  appearance: none;
  border: 1px solid color-mix(in srgb, var(--studio-composer-glass-border, #ffffff24) 70%, transparent);
  background: color-mix(in srgb, var(--color-mos-composer, #07111f) 30%, transparent);
  color: color-mix(in srgb, var(--color-cursor-text-bright, #f4f6fb) 82%, transparent);
  cursor: pointer;
  border-radius: 999px;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
}

.studio-audio-voice-chip {
  box-sizing: border-box;
  border-style: dashed;
  gap: 5px;
  max-width: 148px;
  height: 26px;
  min-height: 26px;
  max-height: 26px;
  padding: 0 8px 0 5px;
  font-size: 10px;
  font-weight: 650;
  line-height: 1;
}

.studio-audio-voice-chip.is-empty {
  color: color-mix(in srgb, var(--color-cursor-text-bright, #f4f6fb) 55%, transparent);
  border-style: dashed;
}

.studio-audio-voice-chip > span {
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 96px;
  overflow: hidden;
}

.studio-audio-voice-chip .studio-orb-play, .studio-audio-voice-chip-orb.studio-orb-play {
  flex: none;
  width: 16px;
  height: 16px;
}

.studio-audio-voice-chip .studio-orb-frame {
  padding: 1px;
}

.studio-audio-sfx-controls {
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  display: flex;
}

.studio-audio-sfx-controls label {
  color: color-mix(in srgb, var(--color-cursor-text-bright, #f4f6fb) 70%, transparent);
  align-items: center;
  gap: 6px;
  font-size: 11px;
  display: inline-flex;
}

.studio-audio-sfx-controls input[type="range"] {
  width: 96px;
}

.studio-audio-disabled-chip {
  opacity: .45;
  cursor: not-allowed;
}

.studio-voice-picker-select {
  appearance: none;
  border: 1px solid color-mix(in srgb, var(--studio-composer-glass-border, #ffffff24) 70%, transparent);
  background: var(--color-cursor-border-soft);
  color: var(--color-cursor-text-bright, #f4f6fb);
  border-radius: 10px;
  min-width: 0;
  padding: 7px 10px;
  font-size: 12px;
}

[data-appearance="light"] .studio-audio-voice-chip, [data-appearance="light"] .studio-audio-suggest-chip {
  color: color-mix(in srgb, var(--color-cursor-text, #0f172a) 88%, transparent);
  background: #ffffffb8;
  border-color: #0f172a24;
}

[data-appearance="light"] .studio-audio-voice-chip.is-empty {
  background: color-mix(in srgb, var(--mos-panel, var(--mos-page)) 58%, transparent);
  color: color-mix(in srgb, var(--color-cursor-text, #0f172a) 72%, transparent);
  border-style: dashed;
  border-color: #0f172a38;
}

[data-appearance="light"] .studio-audio-voice-chip:hover, [data-appearance="light"] .studio-audio-suggest-chip:hover {
  background: var(--mos-panel, var(--mos-page));
  color: var(--color-cursor-text, #0f172a);
  border-color: #0f172a47;
}

[data-appearance="light"] .studio-audio-sfx-controls label {
  color: color-mix(in srgb, var(--color-cursor-text, #0f172a) 78%, transparent);
}

[data-appearance="light"] .studio-voice-picker-select {
  border-color: var(--color-cursor-border-soft, #0f172a24);
  background: var(--mos-plate, #fff);
  color: var(--color-cursor-text, #0f172a);
}

[data-appearance="light"] .studio-voice-picker-check {
  color: color-mix(in srgb, var(--color-cursor-text, #0f172a) 78%, transparent);
}

/* [project]/src/studio/components/studio-workspace-head.css [app-client] (css) */
.studio-desktop-workspace-head {
  z-index: 5;
  flex: none;
  width: 100%;
}

.cursor-workspace-head .cursor-workspace-tools {
  flex-shrink: 0;
  gap: 4px;
}

.cursor-workspace-head .cursor-tab {
  border-right: 0;
}

.cursor-workspace-head .cursor-editor-tab-tools {
  border-left: 0;
}

.studio-polish .cursor-workspace-head .studio-settings-trigger.studio-workspace-brand-btn, .cursor-workspace-head .studio-workspace-brand-btn {
  pointer-events: auto;
  flex: none;
  justify-content: center;
  align-items: center;
  margin: 0 4px 0 0;
  display: inline-flex;
  border-radius: var(--studio-r-md, 8px) !important;
}

.studio-workspace-brand-logo {
  object-fit: contain;
  flex: none;
  width: 22px;
  max-width: 22px;
  height: 22px;
  max-height: 22px;
  display: block;
}

.studio-polish.is-studio-mobile .cursor-workspace-head .studio-workspace-brand-logo {
  width: 26px;
  max-width: 26px;
  height: 26px;
  max-height: 26px;
}

.studio-workspace-brand-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  color: var(--color-cursor-text-bright, var(--mos-text));
  letter-spacing: -.01em;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  overflow: hidden;
}

.studio-sidebar-brand {
  pointer-events: none;
  align-items: center;
  gap: 8px;
  min-width: 0;
  display: inline-flex;
}

.studio-sidebar-brand-label {
  color: var(--color-cursor-text-bright);
  letter-spacing: -.01em;
  font-size: 13px;
  font-weight: 700;
}

.studio-polish.is-studio-mobile .cursor-workspace-head .studio-settings-trigger.studio-workspace-brand-btn, .studio-polish.is-studio-mobile .cursor-workspace-head .cursor-workspace-tools .cursor-icon-btn:not(.studio-update-circle), .studio-polish.is-studio-mobile .cursor-workspace-head .cursor-workspace-tools .studio-settings-trigger {
  box-sizing: border-box;
  align-self: center;
  margin: 0;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  padding: 0 !important;
}

.studio-polish.is-studio-mobile .cursor-workspace-head .studio-update-circle.cursor-icon-btn {
  border-radius: 999px !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
}

.studio-polish.is-studio-mobile .cursor-workspace-head .studio-update-circle.cursor-icon-btn, .cursor-workspace-head .cursor-workspace-tools:not(.studio-head-menu-pill) > .studio-update-circle.cursor-icon-btn {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-plate, var(--color-cursor-panel)) !important;
  box-shadow: inset 0 0 0 999px color-mix(in srgb, var(--cursor-accent) 14%, transparent) !important;
}

.cursor-workspace-head .studio-update-circle.cursor-icon-btn {
  color: var(--cursor-accent);
  border: 1px solid color-mix(in srgb, var(--cursor-accent) 48%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 18%, var(--mos-plate-strong, var(--mos-raised)));
  position: relative;
  overflow: hidden;
}

.cursor-workspace-head .studio-update-circle.cursor-icon-btn:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--cursor-accent) 62%, var(--color-cursor-border));
  background: color-mix(in srgb, var(--cursor-accent) 28%, var(--mos-plate-strong, var(--mos-raised)));
}

.cursor-workspace-head .studio-update-circle svg {
  z-index: 1;
  color: var(--cursor-accent);
  position: relative;
}

.cursor-workspace-head .studio-update-circle-sheen {
  pointer-events: none;
  background: linear-gradient(100deg,
    transparent 0%,
    color-mix(in srgb, var(--cursor-on-accent, #fff) 0%, transparent) 20%,
    color-mix(in srgb, var(--cursor-on-accent, #fff) 78%, transparent) 50%,
    color-mix(in srgb, var(--cursor-on-accent, #fff) 0%, transparent) 80%,
    transparent 100%);
  width: 55%;
  animation: 7s ease-in-out .4s infinite studio-update-sheen-idle;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -40%;
  transform: translateX(-160%);
}

.cursor-workspace-head .studio-update-circle.is-applying .studio-update-circle-sheen {
  animation: 1.4s ease-in-out infinite studio-update-sheen;
}

@media (max-width: 899px) {
  .cursor-workspace-head .studio-update-circle.cursor-icon-btn {
    width: 32px;
    min-width: 32px;
    height: 32px;
    min-height: 32px;
  }

  .cursor-workspace-head .studio-update-circle svg {
    width: 16px;
    height: 16px;
  }
}

@keyframes studio-update-sheen {
  0% {
    opacity: 0;
    transform: translateX(-160%);
  }

  6% {
    opacity: 1;
  }

  40% {
    opacity: 1;
    transform: translateX(280%);
  }

  46% {
    opacity: 0;
    transform: translateX(280%);
  }

  46.01% {
    opacity: 0;
    transform: translateX(-160%);
  }

  50% {
    opacity: 0;
    transform: translateX(-160%);
  }

  56% {
    opacity: 1;
  }

  90% {
    opacity: 1;
    transform: translateX(280%);
  }

  96%, 100% {
    opacity: 0;
    transform: translateX(280%);
  }
}

@keyframes studio-update-sheen-idle {
  0% {
    opacity: 0;
    transform: translateX(-160%);
  }

  2% {
    opacity: 1;
  }

  15% {
    opacity: 1;
    transform: translateX(280%);
  }

  17% {
    opacity: 0;
    transform: translateX(280%);
  }

  17.01% {
    opacity: 0;
    transform: translateX(-160%);
  }

  19% {
    opacity: 0;
    transform: translateX(-160%);
  }

  21% {
    opacity: 1;
  }

  34% {
    opacity: 1;
    transform: translateX(280%);
  }

  36%, 100% {
    opacity: 0;
    transform: translateX(280%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .cursor-workspace-head .studio-update-circle-sheen, .cursor-workspace-head .studio-update-circle.is-applying .studio-update-circle-sheen {
    opacity: 0;
    animation: none;
  }
}

.cursor-workspace-head .cursor-workspace-tools .studio-settings-trigger, .cursor-workspace-head .cursor-workspace-tools .studio-profile-menu-trigger, .cursor-workspace-head .cursor-workspace-tools .studio-close-all-btn, .cursor-workspace-head .cursor-tab-close, .cursor-workspace-head .cursor-icon-btn {
  width: var(--studio-h-icon, 28px) !important;
  min-width: var(--studio-h-icon, 28px) !important;
  max-width: var(--studio-h-icon, 28px) !important;
  height: var(--studio-h-icon, 28px) !important;
  min-height: var(--studio-h-icon, 28px) !important;
  max-height: var(--studio-h-icon, 28px) !important;
  border-radius: 999px !important;
  padding: 0 !important;
}

.studio-polish:not(.is-studio-mobile) {
  --studio-desktop-head-h: 36px;
  --studio-desktop-head-inset: 4px;
  --studio-desktop-head-stack: 4px;
  --studio-desktop-head-clear: calc(var(--studio-desktop-head-inset) + var(--studio-desktop-head-h) +
      var(--studio-desktop-head-stack));
}

.studio-polish:not(.is-studio-mobile) .studio-desktop-workspace-head.cursor-workspace-head.cursor-panel-head {
  z-index: var(--studio-z-dropdown);
  top: var(--studio-desktop-head-inset, 4px);
  right: var(--studio-desktop-head-inset, 4px);
  left: var(--studio-desktop-head-inset, 4px);
  pointer-events: none;
  gap: 8px;
  width: auto;
  position: absolute;
  overflow: visible;
  height: var(--studio-desktop-head-h, 36px) !important;
  min-height: var(--studio-desktop-head-h, 36px) !important;
  max-height: var(--studio-desktop-head-h, 36px) !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-desktop-workspace-head > * {
  pointer-events: auto;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill, .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill {
  box-sizing: border-box;
  height: var(--studio-desktop-head-h, 36px);
  min-height: var(--studio-desktop-head-h, 36px);
  max-height: var(--studio-desktop-head-h, 36px);
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  background: var(--mos-plate, var(--color-cursor-panel));
  border-radius: 999px;
  align-items: center;
  padding: 2px;
  display: flex;
}

[data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill, [data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill {
  background: var(--mos-plate);
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill {
  flex: auto;
  align-items: center;
  gap: 2px;
  min-width: 0;
  overflow: hidden;
  padding-left: 2px !important;
}

.studio-polish:not(.is-studio-mobile) .studio-desktop-workspace-head > .studio-settings-trigger.studio-workspace-brand-btn {
  flex: 0 0 36px;
  align-self: center;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  margin: 0 !important;
  padding: 0 !important;
}

[data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-desktop-workspace-head > .studio-settings-trigger.studio-workspace-brand-btn {
  background: var(--mos-plate) !important;
}

.studio-polish.is-studio-mobile .cursor-workspace-head > .studio-settings-trigger.studio-workspace-brand-btn {
  flex: 0 0 44px;
  align-self: center;
  width: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  height: var(--cursor-head-h, 36px) !important;
  min-height: var(--cursor-head-h, 36px) !important;
  max-height: var(--cursor-head-h, 36px) !important;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  margin: 0 !important;
  padding: 0 !important;
}

[data-appearance="light"] .studio-polish.is-studio-mobile .cursor-workspace-head > .studio-settings-trigger.studio-workspace-brand-btn {
  background: var(--mos-plate) !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .studio-close-all-btn {
  flex: none;
  margin-left: 2px;
}

.studio-polish:not(.is-studio-mobile) .studio-head-menu-pill {
  flex: none;
  gap: 2px;
}

.studio-polish .cursor-unified-tabs.is-empty, .studio-polish .cursor-unified-tabs.is-empty .cursor-unified-tabs-scroll {
  width: 100%;
}

.studio-polish .cursor-unified-tabs.is-empty .cursor-unified-tabs-scroll {
  justify-content: center;
}

.studio-tab-empty {
  text-align: center;
  pointer-events: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: 0;
  max-width: none;
  padding: 0;
  line-height: 1.15;
  display: flex;
}

.studio-tab-empty strong {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 12px;
  font-weight: 650;
}

.studio-polish .studio-head-nav-pill:has(.cursor-unified-tabs.is-empty) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.studio-polish.is-studio-mobile .cursor-workspace-head .cursor-unified-tabs.is-empty, .studio-polish.is-studio-mobile .cursor-workspace-head .cursor-unified-tabs.is-empty .cursor-unified-tabs-scroll {
  border-radius: 0;
  align-self: stretch;
  height: 100%;
  overflow: visible;
  background: none !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill:has(.cursor-unified-tabs.is-empty) .cursor-unified-tabs {
  border-radius: 0;
  align-self: stretch;
  height: 100%;
  overflow: visible;
  background: none !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill:has(.cursor-unified-tabs.is-empty) .cursor-unified-tabs-scroll {
  border-radius: 0;
  align-self: stretch;
  height: 100%;
  overflow: visible;
  background: none !important;
}

.studio-tab-empty-quote {
  width: 100%;
  max-width: none;
  color: var(--color-cursor-text-muted, var(--mos-muted));
  white-space: nowrap;
  text-align: center;
  background: none;
  font-size: 11px;
  font-weight: 500;
  display: block;
  overflow: visible;
}

.studio-tab-empty-track {
  align-items: center;
  display: inline-flex;
}

.studio-tab-empty-quote.is-loop {
  text-align: left;
}

.studio-tab-empty-quote.is-loop .studio-tab-empty-track {
  gap: 3rem;
  padding-left: 0;
  animation: 18s linear infinite studio-tab-quote-marquee;
}

@keyframes studio-tab-quote-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(calc(-50% - 1.5rem));
  }
}

@media (prefers-reduced-motion: reduce) {
  .studio-tab-empty-quote.is-loop .studio-tab-empty-track {
    animation: none;
  }
}

.studio-polish .cursor-unified-tabs-scroll {
  padding-inline: 0;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.studio-polish .cursor-unified-tab-label {
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.cursor-unified-tabs-inset {
  pointer-events: none;
  flex: 0 0 0;
  width: 0;
  height: 0;
}

.studio-polish .cursor-unified-tabs-scroll .studio-workspace-brand-btn {
  margin: 0;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .studio-settings-trigger.studio-workspace-brand-btn, .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .studio-close-all-btn, .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .studio-settings-trigger, .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .studio-profile-menu-trigger, .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .studio-close-all-btn, .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .cursor-icon-btn {
  box-sizing: border-box;
  align-self: center;
  margin: 0;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, var(--color-cursor-panel)) !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  padding: 0 !important;
}

[data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .studio-settings-trigger.studio-workspace-brand-btn, [data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .studio-close-all-btn, [data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .studio-settings-trigger, [data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .studio-profile-menu-trigger, [data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .studio-close-all-btn, [data-appearance="light"] .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .cursor-icon-btn {
  background: var(--mos-plate) !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-menu-pill .studio-update-circle.cursor-icon-btn {
  color: var(--cursor-accent) !important;
  border-color: color-mix(in srgb, var(--cursor-accent) 48%, var(--color-cursor-border-soft)) !important;
  background: color-mix(in srgb, var(--cursor-accent) 18%, var(--mos-plate-strong, var(--mos-raised))) !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tabs, .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tabs-scroll {
  height: var(--cursor-head-h, 36px);
  align-self: center;
  align-items: center;
  min-width: 0;
  margin: 0;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab, .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab:hover, .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab.is-active {
  align-self: center;
  height: var(--cursor-head-h, 36px) !important;
  min-height: var(--cursor-head-h, 36px) !important;
  max-height: var(--cursor-head-h, 36px) !important;
  box-sizing: border-box !important;
  margin-block: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab .cursor-tab-close, .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab:hover .cursor-tab-close, .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab.is-active .cursor-tab-close, .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab .cursor-tab-close:hover, .studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab.is-active .cursor-tab-close:hover {
  align-self: center;
  background: var(--studio-received-fill, color-mix(in srgb, var(--mos-text, var(--color-cursor-text)) 5.5%, var(--mos-page, #fff))) !important;
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  box-shadow: none !important;
  color: var(--mos-text, var(--color-cursor-text)) !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab .cursor-tab-close svg {
  width: 13px !important;
  height: 13px !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill .cursor-unified-tab .cursor-tab-close:hover {
  color: var(--color-cursor-text, var(--mos-text)) !important;
  background: color-mix(in srgb, var(--mos-text, var(--color-cursor-text)) 8%, var(--mos-page, #fff)) !important;
}

.studio-polish:not(.is-studio-mobile) > .studio-desktop-stage {
  position: relative;
}

.studio-main-column {
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  position: relative;
}

.studio-main-column > :not(.studio-desktop-workspace-head) {
  flex: auto;
  min-width: 0;
  min-height: 0;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column {
  padding-top: var(--studio-desktop-head-clear, 56px);
  box-sizing: border-box;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column.is-academy-main {
  padding-top: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has(.studio-feed-browse) {
  padding-top: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has(.studio-academy-pane) {
  padding-top: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has([data-studio-pane="academy"]) {
  padding-top: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column.is-academy-main .studio-academy-pane {
  position: relative;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has([data-studio-pane="academy"]) .studio-academy-pane {
  position: relative;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column.is-academy-main .studio-academy-head, .studio-polish:not(.is-studio-mobile) .studio-main-column.is-academy-main .studio-academy-pane .studio-cn-head {
  z-index: calc(var(--studio-z-base) + 8);
  pointer-events: none;
  width: auto;
  max-height: none;
  top: var(--studio-desktop-head-clear, 44px) !important;
  left: var(--studio-desktop-head-inset, 4px) !important;
  right: var(--studio-desktop-head-inset, 4px) !important;
  height: auto !important;
  min-height: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: absolute !important;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has([data-studio-pane="academy"]) .studio-academy-head {
  z-index: calc(var(--studio-z-base) + 8);
  pointer-events: none;
  width: auto;
  max-height: none;
  top: var(--studio-desktop-head-clear, 44px) !important;
  left: var(--studio-desktop-head-inset, 4px) !important;
  right: var(--studio-desktop-head-inset, 4px) !important;
  height: auto !important;
  min-height: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: absolute !important;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has([data-studio-pane="academy"]) .studio-academy-pane .studio-cn-head {
  z-index: calc(var(--studio-z-base) + 8);
  pointer-events: none;
  width: auto;
  max-height: none;
  top: var(--studio-desktop-head-clear, 44px) !important;
  left: var(--studio-desktop-head-inset, 4px) !important;
  right: var(--studio-desktop-head-inset, 4px) !important;
  height: auto !important;
  min-height: 0 !important;
  box-shadow: none !important;
  background: none !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: absolute !important;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column.is-academy-main .studio-academy-head > *, .studio-polish:not(.is-studio-mobile) .studio-main-column.is-academy-main .studio-academy-pane .studio-cn-head > * {
  pointer-events: auto;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has([data-studio-pane="academy"]) .studio-academy-head > * {
  pointer-events: auto;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has([data-studio-pane="academy"]) .studio-academy-pane .studio-cn-head > * {
  pointer-events: auto;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column.is-academy-main .studio-academy-pane .public-offers-main-scroll {
  padding-top: calc(var(--studio-desktop-head-clear, 44px) + 36px + 4px) !important;
}

.studio-polish:not(.is-studio-mobile) .studio-main-column:has([data-studio-pane="academy"]) .studio-academy-pane .public-offers-main-scroll {
  padding-top: calc(var(--studio-desktop-head-clear, 44px) + 36px + 4px) !important;
}

.studio-polish.is-studio-mobile .cursor-workspace-head.cursor-panel-head {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  gap: 8px !important;
  padding: 0 !important;
}

.studio-polish:not(.is-studio-mobile) .studio-head-nav-pill, .studio-polish:not(.is-studio-mobile) .studio-head-menu-pill {
  padding: 2px !important;
}

.studio-stage > .studio-polish.is-studio-mobile .cursor-workspace-head.cursor-panel-head {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  gap: 8px !important;
  padding: 0 !important;
}

.studio-polish.is-studio-mobile .cursor-workspace-head > .studio-head-nav-pill {
  border: 1px solid var(--color-cursor-border, var(--mos-border)) !important;
}

.studio-polish.is-studio-mobile .cursor-unified-tabs-scroll .studio-close-all-btn {
  flex: 0 0 var(--studio-mobile-chrome-control, 30px);
  align-self: center;
  width: var(--studio-mobile-chrome-control, 30px) !important;
  min-width: var(--studio-mobile-chrome-control, 30px) !important;
  max-width: var(--studio-mobile-chrome-control, 30px) !important;
  height: var(--studio-mobile-chrome-control, 30px) !important;
  min-height: var(--studio-mobile-chrome-control, 30px) !important;
  max-height: var(--studio-mobile-chrome-control, 30px) !important;
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft)) !important;
  background: var(--mos-page, #fff) !important;
  color: var(--color-cursor-muted, var(--mos-muted)) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  margin: 0 !important;
  padding: 0 !important;
}

[data-appearance="light"] .studio-polish.is-studio-mobile .studio-head-nav-pill .studio-close-all-btn {
  background: var(--mos-plate) !important;
}

/* [project]/src/studio/components/chrome/studio-chrome-kit.css [app-client] (css) */
.studio-chrome-plate-surface {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  background: var(--mos-plate);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright) 7%, transparent),
    0 1px 2px #00000014,
    0 4px 10px #0000000f;
  border-radius: 18px;
}

[data-appearance="light"] .studio-polish .studio-chrome-plate-surface {
  box-shadow: inset 0 1px #ffffffb8, 0 1px 2px #0f172a0d, 0 3px 8px #0f172a0a;
}

.studio-chrome-settings-card {
  box-sizing: border-box;
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  background: var(--mos-plate);
  min-width: 0;
  max-width: 100%;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright) 7%, transparent);
  border-radius: 18px;
  gap: 0;
  display: grid;
  overflow: visible;
}

.studio-chrome-settings-card-head {
  height: var(--cursor-section-h, 36px);
  min-height: var(--cursor-section-h, 36px);
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  box-sizing: border-box;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  display: flex;
  overflow: visible;
}

.studio-chrome-settings-card-title {
  min-width: 0;
  color: var(--color-cursor-text, var(--mos-text));
  font-size: var(--studio-pane-title-size, var(--studio-fs-lg, 16px));
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 650;
  overflow: hidden;
}

.studio-chrome-settings-card-extras {
  flex: none;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  display: inline-flex;
  overflow: visible;
}

.studio-chrome-settings-card-extras .cursor-settings-action, .studio-chrome-settings-row-end .cursor-settings-action {
  width: auto;
  min-width: 0;
  height: 28px;
  min-height: 28px;
  font-size: var(--studio-fs-md, 14px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  padding: 0 10px;
  font-weight: 650;
  line-height: 1;
}

.studio-chrome-settings-card-body {
  flex-direction: column;
  min-width: 0;
  display: flex;
  overflow: visible;
}

.studio-chrome-settings-row {
  width: 100%;
  min-height: var(--cursor-section-h, 36px);
  border: 0;
  border-bottom: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  color: var(--mos-text, var(--color-cursor-text));
  font: inherit;
  font-size: var(--studio-fs-md, 14px);
  text-align: left;
  box-sizing: border-box;
  background: none;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  font-weight: 600;
  display: flex;
  overflow: visible;
}

.studio-chrome-settings-row:last-child {
  border-bottom: 0;
}

button.studio-chrome-settings-row {
  cursor: pointer;
}

button.studio-chrome-settings-row:disabled {
  opacity: .45;
  cursor: default;
}

button.studio-chrome-settings-row:hover {
  background: var(--mos-hover, var(--mos-plate));
}

button.studio-chrome-settings-row:last-child:hover {
  border-radius: 0 0 18px 18px;
}

.studio-chrome-settings-row-label {
  flex: 0 auto;
  min-width: 0;
}

.studio-chrome-settings-row-end {
  min-width: 0;
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: var(--studio-fs-sm, 12px);
  flex: 0 auto;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  display: inline-flex;
}

.studio-chrome-settings-row.is-rich {
  align-items: flex-start;
  gap: 12px;
  min-height: 0;
  padding: 10px;
}

.studio-chrome-settings-row.is-rich .studio-chrome-settings-row-label {
  flex: auto;
  gap: 2px;
  display: grid;
}

.studio-chrome-settings-row.is-rich .studio-chrome-settings-row-label strong {
  font-size: var(--studio-fs-md, 14px);
  color: var(--color-cursor-text, var(--mos-text));
  font-weight: 650;
}

.studio-chrome-settings-row-hint {
  font-size: var(--studio-fs-sm, 12px);
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-weight: 500;
  line-height: 1.35;
  display: block;
}

.studio-chrome-settings-row.is-rich .studio-chrome-settings-row-end {
  flex: none;
  padding-top: 2px;
}

.studio-chrome-settings-link {
  min-height: 24px;
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font: inherit;
  cursor: pointer;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 600;
}

.studio-chrome-settings-link:hover {
  color: var(--mos-text, var(--color-cursor-text));
}

.studio-chrome-settings-card-body > .studio-admin-section {
  flex-direction: column;
  gap: 0;
  min-width: 0;
  display: flex;
}

.studio-chrome-settings-card-body > .studio-admin-section + .studio-admin-section, .studio-chrome-settings-card-body > .studio-chrome-settings-row + .studio-admin-section {
  border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
}

.studio-chrome-settings-card-body > .studio-admin-section > .studio-admin-section-head {
  background: none;
  border: 0;
  border-radius: 0;
  height: auto;
  min-height: 0;
  padding: 12px 10px 2px;
}

.studio-chrome-settings-card-body > .studio-admin-section > .studio-admin-section-head .studio-admin-section-title {
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-size: var(--studio-fs-sm, 12px);
  font-weight: 650;
}

.studio-chrome-settings-card-body > .studio-admin-section > .studio-chrome-field, .studio-chrome-settings-card-body > .studio-chrome-field {
  padding: 8px 10px 10px;
}

.studio-chrome-settings-card-body > .studio-admin-section > .studio-chrome-settings-row:last-child {
  border-bottom: 0;
}

.studio-admin-section-icon {
  color: var(--color-cursor-muted, var(--mos-muted));
  vertical-align: -2px;
  justify-content: center;
  align-items: center;
  margin-right: 6px;
  display: inline-flex;
}

.studio-admin-section-icon svg {
  width: 12px;
  height: 12px;
}

.studio-chrome-btn {
  box-sizing: border-box;
}

.studio-chrome-btn svg, .cursor-settings-action svg {
  color: inherit;
}

.studio-chrome-btn.is-compact {
  min-height: 28px;
  font-size: var(--studio-fs-md, 14px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  padding: 0 10px;
  font-weight: 650;
}

.studio-chrome-btn.is-fit {
  width: auto;
}

.studio-chrome-btn.is-secondary, .studio-chrome-btn.is-muted, .studio-chrome-btn.is-default {
  background: var(--mos-plate-strong, var(--mos-hover));
  color: var(--mos-text);
  font-weight: 500;
}

.studio-chrome-btn.is-primary {
  background: var(--cursor-accent);
  color: var(--cursor-accent-fg, #fff);
  border-color: #0000;
  font-weight: 500;
}

.studio-chrome-btn.is-primary:hover:not(:disabled) {
  filter: brightness(1.06);
}

.studio-chrome-btn.is-ghost {
  background: none;
  border-color: #0000;
}

.studio-chrome-btn.is-ghost:hover:not(:disabled) {
  background: var(--color-cursor-hover);
}

.studio-chrome-btn.is-danger {
  border-color: color-mix(in srgb, var(--cursor-danger, #ef4444) 34%, var(--color-cursor-border-soft));
  color: color-mix(in srgb, var(--cursor-danger, #ef4444) 88%, var(--color-cursor-text));
}

.studio-chrome-icon-btn {
  flex: none;
}

.studio-chrome-field {
  gap: 6px;
  min-width: 0;
  display: grid;
}

.studio-chrome-field-label {
  color: var(--color-cursor-text, var(--mos-text));
  font-size: 12px;
  font-weight: 650;
}

.studio-chrome-field-hint {
  font-size: var(--studio-fs-sm, 12px);
  color: var(--mos-text-muted, var(--color-cursor-muted));
  font-weight: 500;
  line-height: 1.35;
}

.studio-chrome-rail, .studio-chrome-pane {
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-chrome-rail-body, .studio-chrome-pane-body {
  flex: auto;
  min-width: 0;
  min-height: 0;
  overflow: auto;
}

.studio-empty-logo-state {
  text-align: center;
  box-sizing: border-box;
  flex-direction: column;
  flex: auto;
  justify-content: center;
  align-self: stretch;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 100%;
  display: flex;
}

.studio-chrome-pane-footer {
  min-height: var(--cursor-head-h, 36px);
  border-top: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  box-sizing: border-box;
  flex: none;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  display: flex;
}

.studio-chrome-btn.is-fit {
  width: auto;
  min-width: 0;
}

.studio-chrome-btn.is-compact {
  width: auto;
  min-height: 28px;
  font-size: var(--studio-fs-md, 14px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  padding: 0 10px;
  font-weight: 650;
}

.studio-chrome-btn.is-primary {
  border-color: color-mix(in srgb, var(--cursor-accent) 34%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 16%, var(--mos-plate-strong, var(--mos-raised)));
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-weight: 650;
}

.studio-chrome-btn.is-primary:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--cursor-accent) 52%, var(--color-cursor-border));
  background: color-mix(in srgb, var(--cursor-accent) 24%, var(--mos-plate-strong, var(--mos-raised)));
}

.studio-chrome-btn.is-muted, .cursor-settings-action.muted {
  color: var(--color-cursor-muted);
  background: none;
}

.studio-chrome-btn.is-ghost {
  width: auto;
  color: var(--color-cursor-muted);
  background: none;
  border-color: #0000;
}

.studio-chrome-btn.is-ghost:hover:not(:disabled) {
  background: var(--mos-hover, var(--color-cursor-hover));
  color: var(--color-cursor-text);
}

.studio-chrome-btn.is-danger {
  border-color: color-mix(in srgb, var(--mos-danger, #ef4444) 34%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 12%, var(--mos-plate));
  color: color-mix(in srgb, var(--mos-danger, #ef4444) 72%, var(--color-cursor-text-bright));
}

.studio-chrome-btn.is-danger:hover:not(:disabled) {
  background: color-mix(in srgb, var(--mos-danger, #ef4444) 18%, var(--mos-plate));
}

.studio-chrome-btn:disabled {
  opacity: .55;
  cursor: default;
}

.cursor-settings-action.is-primary {
  border-color: color-mix(in srgb, var(--cursor-accent) 34%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 16%, var(--mos-plate-strong, var(--mos-raised)));
  color: var(--color-cursor-text-bright, var(--mos-text));
  font-weight: 650;
}

.studio-chrome-field, .studio-settings-field {
  gap: 6px;
  min-width: 0;
  max-width: 100%;
  display: grid;
}

.studio-chrome-field-head, .studio-settings-field-head {
  min-height: 18px;
  color: var(--color-cursor-muted);
  font-size: var(--studio-section-title-size, var(--studio-fs-md, 14px));
  letter-spacing: .05em;
  text-transform: uppercase;
  align-items: center;
  gap: 6px;
  padding: 0 2px;
  font-weight: 700;
  display: flex;
}

.studio-chrome-field-head strong, .studio-settings-field-head strong {
  color: var(--color-cursor-text-bright);
  font-size: var(--studio-section-title-size, var(--studio-fs-md, 14px));
  letter-spacing: 0;
  text-transform: none;
  margin-left: auto;
  font-weight: 650;
}

.studio-chrome-field-hint, .studio-settings-field-hint {
  color: var(--color-cursor-muted);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
}

.studio-settings-models-search {
  margin-top: 12px;
}

.studio-chrome-switch, .studio-audio-switch {
  box-sizing: border-box;
  border-radius: var(--cursor-radius-capsule, var(--studio-r-pill, 999px));
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--cursor-overlay-subtle, color-mix(in srgb, var(--mos-text) 8%, transparent));
  cursor: pointer;
  width: 34px;
  height: 18px;
  transition: background var(--studio-motion-fast, .16s) var(--studio-motion-ease, ease),
    border-color var(--studio-motion-fast, .16s) var(--studio-motion-ease, ease);
  flex: none;
  padding: 0;
  position: relative;
}

.studio-chrome-switch:after, .studio-audio-switch:after {
  content: "";
  background: var(--color-cursor-muted);
  width: 12px;
  height: 12px;
  transition: transform var(--studio-motion-fast, .16s) var(--studio-motion-spring, ease),
    background var(--studio-motion-fast, .16s) var(--studio-motion-ease, ease);
  border-radius: 999px;
  position: absolute;
  top: 2px;
  left: 2px;
}

.studio-chrome-switch.is-on, .studio-audio-switch.is-on {
  border-color: color-mix(in srgb, var(--cursor-accent) 44%, var(--color-cursor-border-soft));
  background: color-mix(in srgb, var(--cursor-accent) 22%, transparent);
}

.studio-chrome-switch.is-on:after, .studio-audio-switch.is-on:after {
  background: var(--cursor-accent);
  transform: translateX(16px);
}

.studio-chrome-switch:disabled, .studio-audio-switch:disabled {
  opacity: .5;
  cursor: default;
}

.studio-chrome-rail {
  background: var(--mos-page, var(--mos-panel));
  box-sizing: border-box;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-chrome-rail-search {
  flex: none;
  min-width: 0;
}

.studio-chrome-rail-body {
  flex: auto;
  min-width: 0;
  min-height: 0;
  overflow: auto;
}

.studio-chrome-pane {
  box-sizing: border-box;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  min-height: 0;
  display: flex;
}

.studio-chrome-pane.is-page {
  background: var(--mos-page, var(--mos-panel));
}

.studio-chrome-pane-body {
  flex: auto;
  min-width: 0;
  min-height: 0;
  overflow: auto;
}

.studio-workspace-switcher {
  min-width: 0;
  position: relative;
}

.studio-workspace-pin {
  z-index: 40;
  min-width: 280px;
  max-width: min(360px, 92vw);
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
}

.studio-workspace-switcher.is-menu-pill .studio-workspace-pin {
  left: auto;
  right: 0;
}

.studio-workspace-switcher.is-account-pill {
  flex: none;
  align-self: center;
  align-items: center;
  height: 24px;
  display: inline-flex;
}

.studio-workspace-switcher.is-menu-pill {
  justify-content: center;
  width: 100%;
  max-width: none;
  height: auto;
  display: flex;
}

.studio-workspace-menu-pill {
  width: 100%;
  height: var(--cursor-section-h, 36px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--mos-plate-strong, var(--mos-hover));
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  font-size: var(--studio-fs-md, 14px);
  cursor: pointer;
  border: 0;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0 14px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-workspace-menu-pill:hover, .studio-workspace-switcher.is-menu-pill.is-open .studio-workspace-menu-pill, .studio-workspace-menu-pill:focus-visible {
  background: color-mix(in srgb, var(--mos-text) 10%, var(--mos-plate-strong, var(--mos-plate)));
}

.studio-workspace-menu-pill:disabled {
  opacity: .55;
  cursor: default;
}

.studio-workspace-switcher.is-menu-pill .cursor-dropdown {
  width: 100%;
  max-width: none;
  left: 0;
  right: 0;
}

.studio-workspace-menu-list {
  flex-direction: column;
  flex: 1;
  width: 100%;
  min-height: 0;
  display: flex;
}

.studio-mobile-app-menu-body.is-workspace-list {
  flex-direction: column;
  flex: 0 auto;
  align-content: start;
  gap: 2px;
  min-height: auto;
  padding: 4px 4px 8px;
  display: flex;
  overflow: visible;
}

.studio-workspace-menu-list-item {
  width: 100%;
  min-height: var(--cursor-section-h, 36px);
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  font-size: var(--studio-fs-md, 14px);
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0 12px;
  font-weight: 550;
  display: flex;
}

.studio-workspace-menu-list-item:hover {
  background: var(--mos-hover, color-mix(in srgb, var(--mos-text) 6%, transparent));
}

.studio-workspace-menu-list-item.is-active {
  background: var(--studio-chrome-glow-bg-fade, var(--mos-hover, var(--color-cursor-hover)));
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-workspace-menu-list-item.is-active:hover {
  background: var(--studio-chrome-glow-bg-fade-hover, var(--mos-hover, var(--color-cursor-hover)));
}

.studio-workspace-menu-list-item.is-active .studio-workspace-menu-list-item-icon {
  color: var(--color-cursor-text-bright, var(--mos-text));
}

.studio-workspace-menu-list-item-icon {
  width: 16px;
  height: 16px;
  color: var(--color-cursor-icon, var(--mos-muted));
  flex: none;
  display: inline-flex;
}

.studio-workspace-menu-list-item-icon svg {
  width: 16px;
  height: 16px;
}

.studio-workspace-menu-list-item-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-workspace-pill {
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--mos-page, var(--color-cursor-panel));
  box-sizing: border-box;
  align-items: center;
  max-width: 13.5rem;
  height: 28px;
  padding: 1px;
  display: inline-flex;
}

.studio-workspace-pill.is-open, .studio-workspace-pill.is-profile-active {
  border-color: color-mix(in srgb, var(--cursor-accent) 42%, var(--color-cursor-border-soft, var(--color-cursor-border)));
}

.studio-workspace-pill-workspace {
  border-radius: var(--studio-chrome-radius, var(--studio-r-md, 8px));
  min-width: 0;
  max-width: 8.5rem;
  height: 22px;
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  font-size: var(--studio-fs-sm, 12px);
  cursor: pointer;
  background: none;
  border: 0;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0 6px 0 8px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-workspace-pill-workspace:hover, .studio-workspace-pill-workspace:focus-visible {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-workspace-pill.is-open .studio-workspace-pill-workspace {
  background: var(--mos-active, var(--color-cursor-active));
}

.studio-workspace-pill-workspace:disabled {
  opacity: .55;
  cursor: default;
}

.studio-workspace-pill-label {
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  overflow: hidden;
}

.studio-workspace-pill-caret {
  width: 12px;
  height: 12px;
  color: var(--color-cursor-muted, var(--mos-muted));
  flex: none;
}

.studio-workspace-pill-profile {
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  cursor: pointer;
  background: none;
  border: 0;
  justify-content: center;
  align-items: center;
  width: 22px;
  min-width: 22px;
  height: 22px;
  padding: 0;
  line-height: 0;
  display: inline-flex;
  overflow: hidden;
}

.studio-workspace-pill-profile:hover, .studio-workspace-pill-profile:focus-visible {
  background: var(--mos-hover, var(--color-cursor-hover));
}

.studio-workspace-pill.is-profile-active .studio-workspace-pill-profile {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--cursor-accent) 42%, transparent);
}

.studio-workspace-pill-avatar {
  --spa-size: 22px;
  width: 100% !important;
  height: 100% !important;
}

.studio-workspace-pill-error {
  z-index: 40;
  background: var(--mos-plate, var(--mos-surface));
  max-width: 16rem;
  box-shadow: var(--cursor-shadow-menu);
  color: var(--color-cursor-muted, var(--mos-muted));
  white-space: nowrap;
  border-radius: 8px;
  padding: 4px 8px;
  font-size: 11px;
  font-weight: 600;
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
}

.studio-workspace-switcher-menu {
  width: 100%;
  max-width: none;
  margin: 0;
}

.studio-org-pill-btn {
  width: 100%;
  min-height: var(--cursor-section-h, 36px);
  border: 1px solid var(--color-cursor-border-soft, var(--mos-border-soft));
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--mos-plate-strong, var(--mos-raised));
  color: var(--color-cursor-text, var(--mos-text));
  font: inherit;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
}

.studio-org-pill-btn:hover:not(:disabled), .studio-org-pill-btn:focus-visible {
  background: var(--mos-active, var(--color-cursor-active));
}

.studio-org-pill-btn:disabled {
  opacity: .55;
  cursor: default;
}

.studio-org-create {
  gap: 0;
  padding: 10px 10px 12px;
  display: grid;
}

.studio-org-create .studio-chrome-field {
  padding: 2px 0 10px;
}

.studio-org-create .studio-org-pill-btn {
  margin-top: 10px;
}

.studio-org-pin-actions {
  flex-wrap: wrap;
  gap: 8px;
  padding: 4px 0 8px;
  display: flex;
}

.studio-org-logo-preview {
  object-fit: cover;
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px));
  background: var(--mos-plate-strong);
  width: 48px;
  height: 48px;
}

.studio-billing-country-select {
  gap: 6px;
  width: 100%;
  min-width: 0;
  display: grid;
  overflow: visible;
}

.studio-mobile-app-menu-sheet, .studio-mobile-sheet, .studio-history-mobile-sheet, .studio-files-nav-mobile-sheet, .studio-files-dock.studio-files-mobile-sheet, .studio-explorer-context-sheet, .studio-cn-book-sheet, .profile-comments-sheet, .desk-mobile-sheet-panel {
  --studio-sheet-inline-pad: 12px;
}

.studio-mobile-sheet-backdrop {
  z-index: 70;
  cursor: pointer;
  background: #00000047;
  border: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  inset: 0;
}

.studio-mobile-sheet-head.cursor-panel-head, .studio-mobile-app-menu-sheet .cursor-panel-head, .studio-mobile-app-menu-sheet .studio-mobile-sheet-head, .studio-files-action-sheet-head, .studio-explorer-context-sheet-head, .desk-mobile-sheet-head {
  padding-left: var(--studio-sheet-inline-pad, 12px);
  padding-right: var(--studio-sheet-inline-pad, 12px);
  border-bottom-color: var(--studio-chrome-divider, var(--color-cursor-border-soft));
  background: none;
}

.studio-mobile-sheet-body {
  flex-direction: column;
  flex: auto;
  min-height: 0;
  display: flex;
  overflow: hidden;
}

.studio-mobile-app-menu-sheet .studio-dm-agent-sidebar-body, .studio-settings-mobile-sheet .studio-settings-workspace-body {
  padding-left: var(--studio-sheet-inline-pad, 12px) !important;
  padding-right: var(--studio-sheet-inline-pad, 12px) !important;
}

.studio-mobile-app-menu-sheet .studio-admin-head-tabs, .studio-dm-agent-mobile-sheet .studio-admin-head-tabs {
  padding-left: var(--studio-sheet-inline-pad, 12px);
  padding-right: var(--studio-sheet-inline-pad, 12px);
}

.studio-mobile-app-menu-sheet-handle, .studio-history-mobile-sheet-handle, .studio-files-dock-handle, .studio-files-nav-mobile-sheet-handle, .studio-cn-book-sheet-handle, .desk-mobile-sheet-handle {
  z-index: 2;
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  flex: none;
  justify-content: center;
  align-items: center;
  min-height: 28px;
  padding: 12px 0 8px;
  display: flex;
  position: relative;
}

.studio-mobile-app-menu-sheet-handle:active, .desk-mobile-sheet-handle:active {
  cursor: grabbing;
}

.studio-mobile-app-menu-sheet-grab, .studio-history-mobile-sheet-grab, .studio-files-dock-grab, .studio-files-nav-mobile-sheet-grab, .studio-cn-book-sheet-grab, .desk-mobile-sheet-grab {
  background: color-mix(in srgb, var(--mos-text, var(--color-cursor-text)) 40%, transparent);
  pointer-events: none;
  border-radius: 999px;
  width: 44px;
  height: 5px;
}

.studio-mobile-app-menu-sheet .cursor-panel-search, .studio-history-mobile-sheet .cursor-panel-search, .studio-files-nav-mobile-sheet .cursor-panel-search, .studio-explorer-context-sheet .cursor-panel-search, .desk-mobile-sheet-panel .cursor-panel-search, .desk-mobile-sheet-panel .composer-mobile-menu-search {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-cursor-border-soft) 70%, transparent);
  background: var(--mos-plate-strong, var(--mos-plate)) !important;
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px)) !important;
  border: none !important;
}

.studio-files-dock .cursor-panel-search, .studio-files-mobile-sheet .cursor-panel-search, .studio-files-workspace-tab .cursor-panel-search {
  background: var(--mos-plate, var(--color-cursor-sidebar)) !important;
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px)) !important;
  box-shadow: none !important;
  border: none !important;
}

.desk-mobile-sheet-panel .composer-mobile-menu-search {
  height: 28px;
  min-height: 28px;
  margin: 2px 0 8px;
  padding: 0 10px;
  font-size: 12px;
  font-weight: 500;
}

.studio-explorer-context-sheet, .studio-mobile-app-menu-sheet.studio-files-action-sheet, .studio-mobile-app-menu-sheet.studio-dm-context-sheet {
  height: auto;
  max-height: min(48dvh, var(--studio-mobile-app-menu-sheet-band, 48dvh));
}

.studio-mobile-app-menu-sheet .cursor-tab-context-item, .studio-explorer-context-sheet .cursor-tab-context-item, .studio-dm-context-floating .cursor-tab-context-item {
  text-align: center;
  justify-content: center;
  gap: 10px;
}

.studio-mobile-app-menu-sheet .cursor-tab-context-item-label, .studio-explorer-context-sheet .cursor-tab-context-item-label, .studio-dm-context-floating .cursor-tab-context-item-label {
  text-align: center;
  flex: 0 auto;
}

.studio-mobile-app-menu-sheet .cursor-tab-context-item.has-submenu, .studio-explorer-context-sheet .cursor-tab-context-item.has-submenu, .studio-dm-context-floating .cursor-tab-context-item.has-submenu {
  justify-content: center;
}

.studio-files-action-sheet-backdrop, .studio-explorer-context-sheet-backdrop, .studio-dm-context-sheet-backdrop, .studio-mobile-sheet-backdrop {
  inset: auto;
  top: var(--studio-mobile-top-chrome, calc(44px + env(safe-area-inset-top, 0px)));
  right: 0;
  bottom: calc(var(--studio-mobile-bottom-chrome, calc(44px + env(safe-area-inset-bottom, 0px)))
      + var(--studio-keyboard-inset, 0px));
  left: 0;
}

.studio-settings-pill, .studio-settings-trigger, .studio-pill-btn, .studio-dm-mode-pill, .studio-dm-extra-pill, .studio-balance-chip-topup, .cursor-settings-action, .cursor-toolbar-icon, .theme-chip, .cursor-panel-search, .studio-workspace-menu-pill, .studio-workspace-menu-list-item, .studio-workspace-pill, .studio-workspace-pill-workspace, .studio-chrome-btn, .studio-chrome-btn.is-compact, .studio-composer-circle-btn, .studio-composer-send-btn, .studio-dm-composer-circle, .studio-upload-trigger {
  border-radius: var(--studio-chrome-radius, var(--studio-r-xl, 12px)) !important;
}

.studio-settings-pill, .studio-pill-btn, .studio-dm-mode-pill, .studio-dm-extra-pill, .cursor-settings-action, .theme-chip, .studio-workspace-menu-pill, .studio-workspace-menu-list-item, .studio-chrome-settings-card-title, .studio-chrome-settings-row, .studio-chrome-btn.is-compact {
  font-size: var(--studio-fs-md, 14px);
}

.studio-chrome-settings-card {
  border-color: color-mix(in srgb, var(--color-cursor-border-soft, var(--mos-border-soft)) 100%, transparent);
}

.studio-chrome-settings-card-title, .studio-chrome-settings-row, .studio-workspace-menu-pill, .studio-workspace-menu-list-item {
  color: var(--color-cursor-text-bright, var(--mos-text-bright, var(--mos-text)));
}

.studio-profile-avatar, .studio-profile-avatar-media, .studio-profile-avatar-fallback, .studio-workspace-pill-avatar, .studio-credit-balance-ring, .studio-credit-balance-ring > *, .studio-ops-presence-dot, .studio-dm-presence-dot, .studio-presence-dot, .studio-online-dot, .studio-chrome-switch, .studio-audio-switch, .studio-chrome-switch:after, .studio-audio-switch:after, .studio-mobile-app-menu-sheet-grab, .studio-history-mobile-sheet-grab, .studio-files-dock-grab, .studio-files-nav-mobile-sheet-grab, .studio-cn-book-sheet-grab, .desk-mobile-sheet-grab, .ys-updating-bar, .ys-updating-bar-fill, .ys-ptr-puck {
  border-radius: 999px !important;
}

.studio-profile-avatar, .studio-profile-avatar-media, .studio-profile-avatar-fallback {
  border-radius: 50% !important;
}

.cursor-icon-btn, .cursor-icon-btn-sm, .studio-chrome-icon-btn, .studio-composer-circle-btn, .cursor-icon-btn:hover:not(:disabled), .cursor-icon-btn:active:not(:disabled), .cursor-icon-btn.active, .studio-composer-circle-btn:hover, .studio-composer-circle-btn:active {
  border-radius: var(--studio-radius-control, 10px) !important;
}

.cursor-tab-close, .studio-close-all-btn {
  width: var(--studio-h-close, 28px) !important;
  height: var(--studio-h-close, 28px) !important;
  min-width: var(--studio-h-close, 28px) !important;
  min-height: var(--studio-h-close, 28px) !important;
  border-radius: 999px !important;
}

.studio-panel-close, .cursor-icon-btn.studio-panel-close {
  border-radius: 999px !important;
}

.studio-composer-frame, .studio-dm-composer-box.studio-composer-frame, .studio-polish .studio-composer .cursor-composer-box.studio-composer-frame {
  background: var(--mos-plate) !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent) !important;
  border: 0 !important;
  border-radius: 20px !important;
}

.studio-composer-frame:focus-within, .studio-dm-composer-box.studio-composer-frame:focus-within, .studio-polish .studio-composer .cursor-composer-box.studio-composer-frame:focus-within {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cursor-accent, var(--mos-accent)) 40%, transparent) !important;
}

.studio-dm-composer-box.studio-composer-frame {
  background: var(--mos-page, #fff) !important;
}

[data-appearance="light"] .studio-dm-composer-box.studio-composer-frame {
  background: var(--mos-plate) !important;
}

.studio-dm-composer .studio-composer-send-btn, .studio-composer .studio-composer-send-btn {
  width: var(--studio-h-icon, 28px) !important;
  min-width: var(--studio-h-icon, 28px) !important;
  max-width: var(--studio-h-icon, 28px) !important;
  height: var(--studio-h-icon, 28px) !important;
  min-height: var(--studio-h-icon, 28px) !important;
  border-radius: 999px !important;
}

/* [project]/src/studio/components/studio-settings-chrome.css [app-client] (css) */
.studio-settings-stack {
  gap: 6px;
  display: grid;
}

.studio-settings-simple-card {
  padding: 0 !important;
}

.studio-settings-workspace .cursor-settings-section {
  background: none;
  border: 0;
  border-radius: 0;
  margin: 0;
  padding: 0 !important;
}

.studio-settings-workspace .studio-settings-stack {
  gap: 6px;
}

.studio-chrome-plate-surface, .studio-settings-workspace .studio-account-card, .studio-settings-workspace .studio-settings-appearance-card, .studio-settings-workspace .studio-settings-invoices-card, .studio-settings-workspace .studio-settings-plans, .studio-settings-workspace .studio-settings-storage-card, .studio-settings-workspace .studio-settings-activity-card, .studio-settings-workspace .studio-settings-payment-card, .studio-settings-workspace .studio-chrome-settings-card {
  border: 1px solid color-mix(in srgb, var(--color-cursor-border-soft) 82%, transparent);
  background: var(--mos-plate);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--mos-text-bright) 7%, transparent),
    0 1px 2px #00000014,
    0 4px 10px #0000000f;
  border-radius: 18px;
  overflow: hidden;
}

[data-appearance="light"] .studio-polish .studio-chrome-plate-surface, [data-appearance="light"] .studio-polish .studio-settings-workspace .studio-account-card, [data-appearance="light"] .studio-polish .studio-settings-workspace .studio-settings-appearance-card, [data-appearance="light"] .studio-polish .studio-settings-workspace .studio-settings-invoices-card, [data-appearance="light"] .studio-polish .studio-settings-workspace .studio-settings-plans, [data-appearance="light"] .studio-polish .studio-settings-workspace .studio-settings-storage-card, [data-appearance="light"] .studio-polish .studio-settings-workspace .studio-settings-activity-card, [data-appearance="light"] .studio-polish .studio-settings-workspace .studio-settings-payment-card, [data-appearance="light"] .studio-polish .studio-settings-workspace .studio-chrome-settings-card {
  box-shadow: inset 0 1px #ffffffb8, 0 1px 2px #0f172a0d, 0 3px 8px #0f172a0a;
}

.studio-appearance-scheme-pills {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 8px;
  display: grid;
}

.studio-appearance-scheme-pill {
  background: var(--mos-page);
  width: 100%;
  min-width: 0;
  height: 32px;
  min-height: 32px;
  color: var(--color-cursor-text-bright, var(--mos-text));
  letter-spacing: .01em;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: var(--cursor-shadow-menu);
  transition: box-shadow var(--cursor-ease);
  border: 1px solid #0000;
  border-radius: 999px;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  padding: 0 10px 0 6px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 650;
  line-height: 1;
  display: inline-flex;
  overflow: hidden;
}

.studio-appearance-scheme-swatch {
  border-radius: 999px;
  flex: none;
  width: 16px;
  height: 16px;
}

.studio-appearance-scheme-pill.is-active {
  box-shadow: var(--cursor-shadow-menu),
    0 0 0 1px var(--cursor-accent);
}

/* [project]/src/studio/components/studio-admin-chrome.css [app-client] (css) */
.studio-admin-section {
  gap: 8px;
  display: grid;
}

.studio-admin-list {
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.studio-admin-list-row {
  border: 1px solid var(--color-cursor-border);
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate, var(--mos-bg, var(--cursor-surface-raised)));
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 12px;
  display: flex;
}

.studio-admin-row-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  display: inline-flex;
}

.studio-admin-list-row .studio-muted {
  color: var(--color-cursor-muted);
  margin-top: 4px;
  font-size: 12px;
}

.studio-ops-settings {
  justify-content: center;
  padding: 8px 0 24px;
  display: flex;
}

.studio-ops-device {
  border: 1px solid var(--color-cursor-border-soft);
  background: var(--mos-plate, var(--mos-bg, var(--cursor-surface-raised)));
  width: 100%;
  max-width: 360px;
  box-shadow: 0 1px 0 color-mix(in srgb, var(--mos-text, #000) 4%, transparent);
  border-radius: 14px;
  gap: 16px;
  padding: 20px 18px 16px;
  display: grid;
}

.studio-ops-device-copy {
  text-align: center;
  justify-items: center;
  gap: 8px;
  display: grid;
}

.studio-ops-device-title {
  color: var(--color-cursor-text-bright);
  letter-spacing: -.02em;
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
}

.studio-ops-device-phone {
  color: var(--color-cursor-muted);
  font-variant-numeric: tabular-nums;
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
}

.studio-ops-icon-btn {
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate-strong, var(--mos-raised, var(--mos-plate-strong)));
  width: 34px;
  height: 34px;
  color: var(--color-cursor-text);
  cursor: pointer;
  justify-content: center;
  align-items: center;
  padding: 0;
  transition: background .16s, border-color .16s;
  display: inline-flex;
}

.studio-ops-icon-btn:hover:not(:disabled) {
  background: var(--color-cursor-hover);
  border-color: var(--color-cursor-border);
}

.studio-ops-icon-btn:disabled {
  opacity: .55;
  cursor: default;
}

.studio-ops-status {
  letter-spacing: .01em;
  background: color-mix(in srgb, var(--mos-plate-strong, var(--mos-plate-strong)) 55%, transparent);
  width: fit-content;
  color: color-mix(in srgb, var(--color-cursor-muted) 88%, var(--color-cursor-text-bright));
  border-radius: 999px;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.2;
  display: inline-flex;
}

.studio-ops-status:before {
  content: "";
  opacity: .85;
  background: currentColor;
  border-radius: 999px;
  width: 6px;
  height: 6px;
}

.studio-ops-status.is-linked {
  background: color-mix(in srgb, var(--mos-success, #22c55e) 16%, transparent);
  color: color-mix(in srgb, var(--mos-success, #15803d) 72%, var(--color-cursor-text-bright));
}

.studio-ops-status.is-scan {
  background: color-mix(in srgb, var(--mos-warning, #fbbf24) 15%, transparent);
  color: color-mix(in srgb, var(--mos-warning, #a16207) 62%, var(--color-cursor-text-bright));
}

.studio-ops-qr {
  background: var(--mos-plate);
  border: 1px solid var(--color-cursor-border-soft);
  border-radius: 12px;
  justify-items: center;
  gap: 8px;
  padding: 16px 14px 12px;
  display: grid;
}

.studio-ops-qr img {
  border-radius: 6px;
  width: 184px;
  height: 184px;
  display: block;
}

.studio-ops-qr-hint {
  color: var(--color-cursor-muted);
  text-align: center;
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
}

.studio-ops-advanced {
  border-top: 1px solid var(--color-cursor-border-soft);
  padding-top: 10px;
}

.studio-ops-advanced > summary {
  cursor: pointer;
  color: var(--color-cursor-muted);
  -webkit-user-select: none;
  user-select: none;
  text-align: center;
  font-size: 12px;
  font-weight: 550;
  list-style: none;
}

.studio-ops-advanced > summary::-webkit-details-marker {
  display: none;
}

.studio-ops-advanced > summary:before {
  content: "▸";
  margin-right: 6px;
  transition: transform .16s;
  display: inline-block;
}

.studio-ops-advanced[open] > summary:before {
  transform: rotate(90deg);
}

.studio-ops-advanced-body {
  justify-content: center;
  margin-top: 10px;
  display: flex;
}

.studio-ops-advanced-body .cursor-settings-action {
  width: auto;
  min-width: 120px;
}

.studio-admin-section-head {
  width: 100%;
  height: var(--cursor-section-h, 36px);
  min-height: var(--cursor-section-h, 36px);
  border: 1px solid var(--color-cursor-border);
  border-radius: var(--cursor-radius-sm, 6px);
  background: var(--mos-plate, var(--mos-bg, var(--cursor-surface-raised)));
  box-sizing: border-box;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 8px;
  line-height: 1;
  display: flex;
  overflow: visible;
}

.studio-admin-section-title {
  min-width: 0;
  color: var(--color-cursor-text);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 13px;
  font-weight: 650;
  overflow: hidden;
}

.studio-admin-section-extras {
  z-index: 2;
  flex: none;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  display: inline-flex;
  position: relative;
  overflow: visible;
}

.studio-admin-payment-layout {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  align-items: start;
  gap: 14px;
  display: grid;
}

.studio-admin-payments-shell {
  gap: 16px;
  display: grid;
  position: relative;
}

.studio-admin-payment-sidebar-backdrop {
  z-index: 80;
  background: #0000006b;
  border: 0;
  position: fixed;
  inset: 0;
}

.studio-admin-payment-sidebar {
  z-index: 81;
  border-left: 1px solid var(--studio-chrome-divider);
  background: var(--mos-bg, var(--color-cursor-bg));
  flex-direction: column;
  gap: 12px;
  width: min(420px, 100vw);
  height: 100dvh;
  padding: 16px;
  display: flex;
  position: fixed;
  top: 0;
  right: 0;
  overflow: auto;
  box-shadow: -16px 0 40px #0000003d;
}

[data-appearance="light"] .studio-admin-payment-sidebar {
  background: var(--mos-panel);
}

.studio-admin-payment-sidebar-head {
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  display: flex;
}

.studio-admin-payment-sidebar-head h3 {
  margin: 4px 0 0;
}

.studio-admin-status-field {
  color: var(--color-cursor-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  gap: 6px;
  font-size: 11px;
  font-weight: 650;
  display: grid;
}

.studio-admin-status-field .cursor-select-menu {
  width: 100%;
}

.studio-admin-status-field .cursor-select-trigger {
  text-transform: none;
  letter-spacing: normal;
}

.studio-admin-status-field .cursor-input {
  text-transform: none;
  letter-spacing: normal;
  font-weight: 500;
}

.studio-admin-section-extras .cursor-panel-search {
  border-radius: 999px;
  width: min(220px, 42vw);
  height: 26px;
  min-height: 26px;
  margin: 0;
}

/*# sourceMappingURL=%5Broot-of-the-server%5D__1x43aja._.css.map*/