/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/.pnpm/next@15.5.18_@playwright+test@1.59.1_react-dom@19.2.5_react@19.2.5__react@19.2.5/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[2].use[1]!../../node_modules/.pnpm/next@15.5.18_@playwright+test@1.59.1_react-dom@19.2.5_react@19.2.5__react@19.2.5/node_modules/next/dist/build/webpack/loaders/next-font-loader/index.js??ruleSet[1].rules[14].oneOf[2].use[2]!../../node_modules/.pnpm/next@15.5.18_@playwright+test@1.59.1_react-dom@19.2.5_react@19.2.5__react@19.2.5/node_modules/next/font/google/target.css?{"path":"app/layout.tsx","import":"Plus_Jakarta_Sans","arguments":[{"display":"swap","subsets":["latin"],"variable":"--f-brand","weight":"800"}],"variableName":"plusJakartaSans"} ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* cyrillic-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/_next/static/media/abe8a82a16fdcc78-s.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* vietnamese */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/_next/static/media/a03112ac118b372a-s.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/_next/static/media/5d2b6f2872dfc654-s.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, 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;
}
/* latin */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(/_next/static/media/3b91a0ab9b540401-s.p.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}@font-face {font-family: 'Plus Jakarta Sans Fallback';src: local("Arial");ascent-override: 98.88%;descent-override: 21.15%;line-gap-override: 0.00%;size-adjust: 104.98%
}.__className_cedafb {font-family: 'Plus Jakarta Sans', 'Plus Jakarta Sans Fallback';font-weight: 800;font-style: normal
}.__variable_cedafb {--f-brand: 'Plus Jakarta Sans', 'Plus Jakarta Sans Fallback'
}

/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/.pnpm/next@15.5.18_@playwright+test@1.59.1_react-dom@19.2.5_react@19.2.5__react@19.2.5/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!../../node_modules/.pnpm/next@15.5.18_@playwright+test@1.59.1_react-dom@19.2.5_react@19.2.5__react@19.2.5/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./app/globals.css ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
      "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --spacing: 0.25rem;
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}
@layer base {
  *, ::after, ::before, ::backdrop, ::file-selector-button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0 solid;
  }
  html, :host {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    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;
    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 {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  sub {
    bottom: -0.25em;
  }
  sup {
    top: -0.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 {
    display: block;
    vertical-align: middle;
  }
  img, video {
    max-width: 100%;
    height: auto;
  }
  button, input, select, optgroup, textarea, ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    border-radius: 0;
    background-color: transparent;
    opacity: 1;
  }
  :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)) {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize: vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }
  ::-webkit-datetime-edit {
    display: inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }
  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }
  :-moz-ui-invalid {
    box-shadow: none;
  }
  button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
    appearance: button;
  }
  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto;
  }
  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}
@layer utilities {
  .collapse {
    visibility: collapse;
  }
  .visible {
    visibility: visible;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .sticky {
    position: sticky;
  }
  .start {
    inset-inline-start: var(--spacing);
  }
  .end {
    inset-inline-end: var(--spacing);
  }
  .container {
    width: 100%;
    @media (width >= 40rem) {
      max-width: 40rem;
    }
    @media (width >= 48rem) {
      max-width: 48rem;
    }
    @media (width >= 64rem) {
      max-width: 64rem;
    }
    @media (width >= 80rem) {
      max-width: 80rem;
    }
    @media (width >= 96rem) {
      max-width: 96rem;
    }
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .table {
    display: table;
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .p-7 {
    padding: calc(var(--spacing) * 7);
  }
  .uppercase {
    text-transform: uppercase;
  }
  .line-through {
    text-decoration-line: line-through;
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .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,);
  }
}
:root {
  color-scheme: light;
  --paper: #ffffff;
  --paper-soft: #f7f6fb;
  --paper-warm: #fbfafe;
  --ink: #0b0420;
  --ink-2: #170a33;
  --ink-soft: #2a1b4e;
  --violet-50: #f4eeff;
  --violet-100: #e5d7ff;
  --violet-200: #c8aeff;
  --violet-300: #a57bff;
  --violet-500: #6e3cff;
  --violet-600: #5a24ea;
  --violet-700: #4517b8;
  --magenta: #b026ff;
  --rose: #ff3d8b;
  --mint: #00e5c7;
  --mint-2: #00b89e;
  --amber: #ffb23b;
  --live: #ff4d6d;
  --danger: #c8214a;
  --line: #ece7f5;
  --line-2: #d8d1e8;
  --muted: #6e6680;
  --muted-2: #9890ab;
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --sh-sm: 0 1px 2px rgba(20, 8, 60, 0.06);
  --sh-md: 0 12px 30px -10px rgba(60, 20, 140, 0.18), 0 4px 8px rgba(20, 8, 60, 0.04);
  --sh-lg: 0 40px 80px -20px rgba(70, 20, 160, 0.3), 0 10px 30px rgba(20, 8, 60, 0.1);
  --sh-glow: 0 0 0 1px rgba(110, 60, 255, 0.18), 0 30px 60px -20px rgba(110, 60, 255, 0.45);
  --g-brand: linear-gradient(135deg, #6e3cff 0%, #b026ff 50%, #ff3d8b 100%);
  --g-brand-soft: linear-gradient(135deg, rgba(110, 60, 255, 0.14), rgba(255, 61, 139, 0.1));
  --g-mint: linear-gradient(135deg, #00e5c7 0%, #37a8ff 100%);
  --f-brand: "Plus Jakarta Sans", var(--f-sans);
  --f-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --g-soft: var(--g-brand-soft);
  --g-night: radial-gradient(120% 80% at 80% -10%, #2b1166 0%, #120630 45%, #08021a 100%);
  background: #f7f6fb;
}
* {
  box-sizing: border-box;
}
html {
  background: #f7f6fb;
}
body {
  margin: 0;
  background: radial-gradient(circle at 12% 0%, rgba(110, 60, 255, 0.12), transparent 22%),
    radial-gradient(circle at 88% 4%, rgba(255, 61, 139, 0.08), transparent 20%),
    linear-gradient(180deg, #fbfafe 0%, #f2eef8 100%);
  color: var(--ink);
  font-family: "Inter",
    "Segoe UI",
    ui-sans-serif,
    system-ui;
}
a {
  color: inherit;
  text-decoration: none;
}
summary {
  cursor: pointer;
}
button,
input,
select,
textarea {
  font: inherit;
}
input,
select,
textarea {
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  min-height: 2.8rem;
  padding: 0.72rem 0.85rem;
}
.media-workspace {
  display: grid;
  gap: 1.5rem;
}
.media-list-page {
  gap: 1.15rem;
}
.media-list-stats {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.media-list-stat {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-left: 3px solid var(--violet-600);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.95rem 1rem;
}
.media-list-stat.mint {
  border-left-color: var(--mint-2);
}
.media-list-stat.danger {
  border-left-color: #c8214a;
}
.media-list-stat span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}
.media-list-stat strong {
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 950;
}
.media-list-filter-bar {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 0.55rem;
  grid-template-columns: minmax(16rem, 1fr) minmax(10rem, 0.34fr) minmax(10rem, 0.34fr) auto;
  padding: 0.65rem;
}
.media-list-filter-bar label {
  display: block;
  min-width: 0;
}
.media-list-filter-bar input,
.media-list-filter-bar select {
  border-color: var(--line);
  min-height: 2.35rem;
  width: 100%;
}
.media-list-search {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--muted);
  display: flex !important;
  gap: 0.45rem;
  padding: 0 0.65rem;
}
.media-list-search input {
  background: transparent;
  border: 0;
  flex: 1;
  min-height: 2.35rem;
  padding: 0;
}
.media-list-table-wrap {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  overflow-x: auto;
}
.media-list-table {
  border-collapse: collapse;
  min-width: 58rem;
  width: 100%;
}
.media-list-table th,
.media-list-table td {
  border-bottom: 1px solid var(--line);
  padding: 0.85rem 0.95rem;
  text-align: left;
  vertical-align: middle;
}
.media-list-table th {
  color: var(--muted);
  font: 850 0.7rem var(--f-mono);
  letter-spacing: 0;
  text-transform: uppercase;
  white-space: nowrap;
}
.media-list-table td {
  color: var(--ink-soft);
  font-size: 0.84rem;
  font-weight: 650;
}
.media-list-table tr:last-child td {
  border-bottom: 0;
}
.media-list-project-cell {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  min-width: 0;
}
.media-list-project-cell > span:last-child {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
}
.media-list-project-cell strong {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}
.media-list-project-cell small,
.media-list-muted {
  color: var(--muted);
  font: 700 0.73rem var(--f-mono);
}
.media-list-thumb {
  align-items: center;
  background: var(--g-night);
  border-radius: 9px;
  color: #fff;
  display: inline-flex;
  flex: 0 0 auto;
  height: 2.4rem;
  justify-content: center;
  overflow: hidden;
  position: relative;
  width: 2.4rem;
}
.media-list-thumb > span {
  background: var(--mint);
  bottom: 0;
  height: 2px;
  left: 0;
  position: absolute;
}
.media-list-source-chip {
  align-items: center;
  background: var(--ink);
  border-radius: 6px;
  color: #fff;
  display: inline-flex;
  font: 800 0.72rem var(--f-mono);
  min-height: 1.5rem;
  padding: 0 0.45rem;
}
.media-list-output-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.media-list-output-chips span {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  display: inline-flex;
  font: 800 0.66rem var(--f-mono);
  min-height: 1.45rem;
  padding: 0 0.45rem;
}
.media-list-output-chips .muted {
  color: var(--muted);
}
.media-list-actions {
  display: flex;
  gap: 0.35rem;
  justify-content: flex-end;
}
.media-list-pagination {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  box-shadow: var(--sh-sm);
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: space-between;
  padding: 0.65rem 0.75rem;
}
.media-list-pagination span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
}
.media-list-table td > small.media-list-muted {
  display: block;
  margin-top: 0.22rem;
}
.file-list-filter-bar {
  grid-template-columns: minmax(14rem, 1fr) repeat(3, minmax(9rem, 0.3fr)) auto;
}
.video-export-filter-bar {
  grid-template-columns: minmax(16rem, 1fr) minmax(10rem, 0.34fr) auto;
}
.cookie-consent-banner {
  align-items: center;
  background: rgba(255, 255, 255, 0.98);
  border-top: 1px solid rgba(15, 23, 42, 0.14);
  bottom: 0;
  box-shadow: 0 -16px 48px rgba(15, 23, 42, 0.12);
  color: var(--ink);
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) auto;
  left: 0;
  max-width: none;
  padding: 0.78rem max(1rem, env(safe-area-inset-right)) 0.78rem max(1rem, env(safe-area-inset-left));
  position: fixed;
  right: 0;
  z-index: 260;
}
.cookie-consent-copy {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
  min-width: 0;
}
.cookie-consent-copy strong,
.cookie-consent-dialog-head strong {
  color: var(--ink);
  font-size: 0.96rem;
  font-weight: 900;
  line-height: 1.25;
}
.cookie-consent-copy p {
  color: var(--ink-soft);
  font-size: 0.84rem;
  line-height: 1.55;
  margin: 0;
  max-width: none;
}
.cookie-consent-copy span {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.4;
}
.cookie-consent-copy .cookie-consent-error {
  color: #b42318;
  font-weight: 850;
}
.cookie-consent-actions {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 0.55rem;
  justify-content: end;
  min-width: 0;
}
.cookie-consent-actions a,
.cookie-consent-actions button,
.cookie-consent-dialog-head button,
.cookie-consent-save {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font: 850 0.78rem var(--f-body);
  justify-content: center;
  min-height: 2.35rem;
  padding: 0.55rem 0.8rem;
  text-decoration: none;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
  white-space: nowrap;
}
.cookie-consent-actions button:hover,
.cookie-consent-actions a:hover,
.cookie-consent-dialog-head button:hover,
.cookie-consent-save:hover {
  border-color: rgba(23, 123, 122, 0.36);
  box-shadow: 0 10px 26px rgba(23, 123, 122, 0.12);
  transform: translateY(-1px);
}
.cookie-consent-actions button:disabled,
.cookie-consent-dialog-head button:disabled,
.cookie-consent-save:disabled {
  cursor: not-allowed;
  opacity: 0.58;
  transform: none;
}
.cookie-consent-actions .cookie-consent-accept,
.cookie-consent-save {
  background: #177b7a;
  border-color: #177b7a;
  color: #fff;
}
.cookie-consent-modal {
  align-items: center;
  background: rgba(15, 23, 42, 0.52);
  display: grid;
  inset: 0;
  justify-items: center;
  padding: 1rem;
  position: fixed;
  z-index: 270;
}
.cookie-consent-dialog {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: 0 26px 80px rgba(15, 23, 42, 0.24);
  color: var(--ink);
  display: grid;
  gap: 0.85rem;
  max-height: min(92vh, 42rem);
  max-width: 34rem;
  overflow: auto;
  padding: 1rem;
  width: min(100%, 34rem);
}
.cookie-consent-dialog-head {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.cookie-consent-option {
  align-items: start;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 0.85rem;
}
.cookie-consent-option input {
  height: 1.1rem;
  margin-top: 0.1rem;
  width: 1.1rem;
}
.cookie-consent-option span {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}
.cookie-consent-option strong {
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 900;
  line-height: 1.25;
}
.cookie-consent-option small {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
}
.cookie-consent-save {
  justify-self: start;
}
@media (max-width: 760px) {
  .cookie-consent-banner {
    align-items: stretch;
    grid-template-columns: 1fr;
  }
  .cookie-consent-actions {
    flex-wrap: wrap;
    justify-content: stretch;
    min-width: 0;
  }
  .cookie-consent-actions a,
  .cookie-consent-actions button {
    flex: 1 1 9rem;
  }
}
.support-ticket-page,
.support-ticket-detail-page {
  gap: 1.15rem;
}
.support-ticket-console,
.support-ticket-detail-grid {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(20rem, 0.42fr) minmax(0, 1fr);
}
.support-ticket-detail-grid {
  grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.38fr);
}
.support-ticket-list-page,
.support-ticket-create-shell {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.support-ticket-create-shell {
  max-width: 54rem;
  width: 100%;
}
.support-ticket-panel,
.support-ticket-list-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding: 1rem;
}
.support-ticket-panel-head {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  min-width: 0;
}
.support-ticket-panel-head.compact {
  justify-content: space-between;
}
.support-ticket-panel-head > div {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}
.support-ticket-panel-head span:not(.media-list-thumb) {
  color: var(--muted);
  font: 850 0.72rem var(--f-mono);
  letter-spacing: 0;
  text-transform: uppercase;
}
.support-ticket-panel-head h2 {
  color: var(--ink);
  font-size: 1.05rem;
  line-height: 1.2;
  margin: 0;
}
.support-ticket-form {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.support-ticket-field {
  color: var(--ink);
  display: grid;
  font-size: 0.84rem;
  font-weight: 850;
  gap: 0.3rem;
  min-width: 0;
}
.support-ticket-field span {
  color: var(--muted);
  font: 850 0.72rem var(--f-mono);
  letter-spacing: 0;
  text-transform: uppercase;
}
.support-ticket-field input,
.support-ticket-field select,
.support-ticket-field textarea {
  border-color: var(--line);
  width: 100%;
}
.support-ticket-field textarea {
  min-height: 9rem;
  resize: vertical;
}
.support-ticket-field-wide,
.support-ticket-submit {
  grid-column: 1 / -1;
}
.support-ticket-submit {
  cursor: pointer;
  justify-self: start;
}
.support-ticket-filter-bar {
  grid-template-columns: minmax(14rem, 1fr) auto;
}
.support-ticket-table {
  min-width: 52rem;
}
.support-ticket-project-cell {
  align-items: start;
}
.support-ticket-preview {
  color: var(--muted);
  display: -webkit-box;
  font-size: 0.78rem;
  line-height: 1.45;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.support-ticket-open-link {
  min-height: 2.25rem;
  padding-inline: 0.75rem;
}
.support-ticket-empty {
  min-height: 15rem;
}
.support-ticket-detail-meta {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.support-ticket-meta-card strong {
  font-size: 0.92rem;
  overflow-wrap: anywhere;
}
.support-message-list {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  overflow: hidden;
}
.support-message-row {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 0.55rem;
  padding: 0.9rem;
}
.support-message-row:last-child {
  border-bottom: 0;
}
.support-message-row.is-admin {
  background: linear-gradient(90deg, rgba(23, 123, 122, 0.08), transparent 82%);
}
.support-message-head {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: space-between;
}
.support-message-head strong {
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 900;
}
.support-message-head time {
  color: var(--muted);
  font: 700 0.72rem var(--f-mono);
}
.support-message-row p {
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.6;
  margin: 0;
  white-space: pre-wrap;
}
.media-list-delete-form {
  margin: 0;
}
.confirm-submit-modal {
  align-items: center;
  display: grid;
  inset: 0;
  justify-items: center;
  padding: 1rem;
  position: fixed;
  z-index: 230;
}
.confirm-submit-backdrop {
  background: rgba(19, 19, 32, 0.42);
  border: 0;
  cursor: pointer;
  inset: 0;
  position: absolute;
}
.confirm-submit-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-lg);
  display: grid;
  gap: 1rem;
  max-width: min(92vw, 22rem);
  padding: 1.15rem;
  position: relative;
  width: 100%;
}
.confirm-submit-panel strong {
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.35;
}
.confirm-submit-actions {
  display: flex;
  gap: 0.55rem;
  justify-content: flex-end;
}
.confirm-submit-cancel,
.confirm-submit-yes {
  align-items: center;
  border-radius: var(--r-sm);
  cursor: pointer;
  display: inline-flex;
  font: 850 0.86rem var(--f-body);
  justify-content: center;
  min-height: 2.3rem;
  min-width: 4.75rem;
  padding: 0 0.9rem;
}
.confirm-submit-cancel {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  color: var(--ink);
}
.confirm-submit-yes {
  background: #9f1d1d;
  border: 1px solid #9f1d1d;
  color: #ffffff;
}
.media-list-icon-action,
.media-list-text-action {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 850;
  gap: 0.35rem;
  justify-content: center;
  min-height: 2.15rem;
  padding: 0 0.62rem;
  text-decoration: none;
  white-space: nowrap;
}
button.media-list-icon-action {
  cursor: pointer;
  font-family: inherit;
}
.media-list-icon-action {
  background: var(--paper-soft);
}
.media-list-icon-action.danger {
  background: #fff5f5;
  border-color: rgba(185, 28, 28, 0.22);
  color: #9f1d1d;
}
.media-list-icon-action.disabled,
.media-list-text-action.disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: 0.58;
}
.media-list-empty {
  align-items: center;
  background: linear-gradient(135deg, rgba(110, 60, 255, 0.08), rgba(255, 255, 255, 0.9)),
    var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  gap: 0.65rem;
  justify-items: center;
  min-height: 18rem;
  padding: clamp(1.5rem, 4vw, 2.4rem);
  text-align: center;
}
.media-list-empty > svg {
  color: var(--violet-600);
}
.media-list-empty strong {
  color: var(--ink);
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 900;
}
.media-list-empty p {
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
  max-width: 34rem;
}
.media-title-row,
.media-toolbar {
  align-items: flex-start;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}
.media-eyebrow {
  color: var(--violet-600);
  display: inline-block;
  font-size: 0.86rem;
  font-weight: 950;
  letter-spacing: 0;
  margin-bottom: 0.5rem;
  text-transform: uppercase;
}
.media-title {
  font-size: clamp(1.9rem, 4vw, 2.6rem);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.06;
  margin: 0;
}
.media-subtitle {
  color: var(--muted);
  line-height: 1.65;
  margin: 0.55rem 0 0;
  max-width: 58rem;
}
.media-shell-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: var(--sh-md);
  overflow: hidden;
}
.media-chrome {
  align-items: center;
  background: linear-gradient(#fbfafe, #f4f1fa);
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
}
.media-chrome-dot {
  background: #e0daeb;
  border-radius: 50%;
  height: 0.7rem;
  width: 0.7rem;
}
.media-chrome-path {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  display: inline-flex;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.75rem;
  font-weight: 650;
  gap: 0.45rem;
  margin-left: 0.5rem;
  max-width: 34rem;
  min-width: 0;
  overflow: hidden;
  padding: 0.42rem 0.85rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.media-grid {
  background: var(--paper-warm);
  display: grid;
  gap: 1.35rem;
  grid-template-columns: 320px minmax(0, 1fr) 340px;
  padding: 1.5rem;
}
.media-grid.start {
  grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.85fr);
}
.media-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 1.15rem;
}
.media-panel.sticky {
  position: sticky;
  top: 1rem;
}
.media-panel h2,
.media-panel h3 {
  font-size: 1rem;
  letter-spacing: 0;
  margin: 0;
}
.media-muted {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.55;
}
.media-stack {
  display: grid;
  gap: 1rem;
}
.media-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}
.media-source-thumb,
.media-wave-card {
  background: var(--g-night);
  border-radius: 16px;
  color: #fff;
  overflow: hidden;
  position: relative;
}
.media-source-thumb {
  aspect-ratio: 16 / 9;
  display: grid;
  place-items: center;
}
.media-source-thumb::before,
.media-wave-card::before {
  background: radial-gradient(60% 70% at 30% 10%, rgba(176, 38, 255, 0.33), transparent 60%);
  content: "";
  inset: 0;
  position: absolute;
}
.media-play {
  align-items: center;
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  display: inline-flex;
  height: 3.4rem;
  justify-content: center;
  position: relative;
  width: 3.4rem;
}
.media-wave-bars {
  align-items: end;
  display: flex;
  gap: 2px;
  height: 3.5rem;
  position: relative;
}
.media-wave-bars span {
  background: linear-gradient(180deg, #9df7e3, #7c5cff);
  border-radius: 2px;
  flex: 1;
  min-width: 3px;
  opacity: 0.82;
}
.media-stats {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding-top: 1rem;
}
.media-stat small,
.media-track-meta small {
  color: var(--muted);
  display: block;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.06em;
  margin-bottom: 0.25rem;
  text-transform: uppercase;
}
.media-stat strong,
.media-track-meta strong {
  color: var(--ink);
  font-size: 0.92rem;
}
.media-tabs {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 12px;
  display: inline-flex;
  gap: 0.25rem;
  padding: 0.25rem;
}
.media-tab {
  border-radius: 8px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
  padding: 0.5rem 0.85rem;
}
.media-tab.active {
  background: var(--ink);
  color: #fff;
}
.media-track-card {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  display: grid;
  gap: 1rem;
  grid-template-columns: 4px minmax(12rem, 1.25fr) minmax(8rem, 0.8fr) minmax(8rem, 0.8fr) auto;
  margin-bottom: 0.7rem;
  padding: 0.85rem 1rem 0.85rem 1.1rem;
}
.media-track-accent {
  align-self: stretch;
  background: var(--g-brand);
  border-radius: 999px;
}
.media-track-card.source {
  background: linear-gradient(180deg, #fbfafe, #fff);
  border-color: rgba(110, 60, 255, 0.22);
}
.media-track-card.audio .media-track-accent {
  background: linear-gradient(180deg, #00e5c7, #37a8ff);
}
.media-lang-badge {
  align-items: center;
  background: var(--ink);
  border-radius: 9px;
  color: #fff;
  display: inline-flex;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.72rem;
  font-weight: 850;
  height: 2rem;
  justify-content: center;
  min-width: 2rem;
  padding: 0 0.45rem;
  text-transform: uppercase;
}
.media-lang-badge.light {
  background: #fff;
  border: 1px solid var(--line);
  color: var(--ink);
}
.media-track-name {
  display: grid;
  gap: 0.25rem;
}
.media-track-name strong {
  font-size: 0.95rem;
}
.media-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
}
.media-button {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 999px;
  color: var(--ink);
  display: inline-flex;
  font-size: 0.84rem;
  font-weight: 800;
  gap: 0.4rem;
  min-height: 2.35rem;
  padding: 0 0.9rem;
}
.media-button.primary {
  background: var(--g-brand);
  border-color: transparent;
  box-shadow: 0 26px 52px -28px rgba(110, 60, 255, 0.8);
  color: #fff;
}
.media-button.dark {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
.media-button.full {
  justify-content: center;
  width: 100%;
}
.media-input,
.media-select,
.media-textarea {
  border: 1px solid var(--line);
  border-radius: 11px;
  width: 100%;
}
.media-field {
  display: grid;
  gap: 0.45rem;
}
.media-field label,
.media-field .label {
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 800;
}
.media-dropzone {
  align-items: center;
  background: linear-gradient(180deg, #fbfafe, #fff);
  border: 1.5px dashed var(--line-2);
  border-radius: 18px;
  display: grid;
  gap: 0.9rem;
  min-height: 16rem;
  padding: 2rem;
  place-items: center;
  text-align: center;
}
.media-dropzone-icon {
  background: var(--g-brand);
  border-radius: 18px;
  box-shadow: 0 30px 60px -28px rgba(110, 60, 255, 0.8);
  color: #fff;
  display: grid;
  font-size: 1.65rem;
  font-weight: 900;
  height: 4.5rem;
  place-items: center;
  width: 4.5rem;
}
.media-chip-list {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 11px;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  min-height: 2.8rem;
  padding: 0.45rem;
}
.media-chip {
  align-items: center;
  background: var(--violet-50);
  border: 1px solid rgba(110, 60, 255, 0.18);
  border-radius: 8px;
  color: var(--violet-700);
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 800;
  gap: 0.35rem;
  padding: 0.4rem 0.6rem;
}
.media-pipeline-step {
  border-top: 1px dashed var(--line);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 1.8rem minmax(0, 1fr) auto;
  padding: 0.85rem 0;
}
.media-pipeline-step:first-child {
  border-top: 0;
}
.media-pipeline-num {
  align-items: center;
  background: var(--ink);
  border-radius: 8px;
  color: #fff;
  display: inline-flex;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.75rem;
  font-weight: 850;
  height: 1.8rem;
  justify-content: center;
}
.media-export-bar {
  align-items: center;
  background: linear-gradient(180deg, #1a0b40, #0b0420);
  border-radius: 18px;
  color: #fff;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1.1rem 1.25rem;
}
.document-workspace {
  display: grid;
  gap: 1.4rem;
}
.document-layout {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(20rem, 26rem);
}
.document-queue-panel {
  position: sticky;
  top: 1rem;
}
.document-form {
  display: grid;
  gap: 1rem;
}
.document-step {
  background: linear-gradient(180deg, #fbfafe, #ffffff);
  border: 1px solid var(--line);
  border-radius: 18px;
  display: grid;
  gap: 1rem;
  padding: 1rem;
}
.document-step-head {
  align-items: center;
  display: flex;
  gap: 0.8rem;
}
.document-step-head > span {
  align-items: center;
  background: var(--ink);
  border-radius: 10px;
  color: #fff;
  display: inline-flex;
  flex: 0 0 auto;
  font: 800 0.78rem var(--f-mono);
  height: 2.2rem;
  justify-content: center;
  width: 2.2rem;
}
.document-step-head div {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}
.document-step-head strong {
  color: var(--ink);
  font-size: 0.98rem;
  font-weight: 850;
}
.document-step-head small,
.document-job-title span,
.document-job-warning,
.document-dropzone small {
  color: var(--muted);
  font-size: 0.86rem;
}
.document-grid {
  display: grid;
  gap: 0.9rem;
}
.document-grid.two {
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}
.document-field {
  display: grid;
  gap: 0.45rem;
}
.document-field > span {
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 800;
}
.document-language-grid {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
}
.document-language-option,
.document-mode-option {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--ink);
  display: grid;
  gap: 0.3rem;
  min-height: 5rem;
  padding: 0.85rem;
  text-align: left;
  transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}
.document-language-option:hover,
.document-mode-option:hover {
  border-color: var(--violet-200);
  box-shadow: var(--sh-sm);
  transform: translateY(-1px);
}
.document-language-option.selected,
.document-mode-option.selected {
  background: linear-gradient(135deg, rgba(110, 60, 255, 0.1), rgba(255, 61, 139, 0.08));
  border-color: rgba(110, 60, 255, 0.42);
  box-shadow: 0 0 0 1px rgba(110, 60, 255, 0.08);
}
.document-language-option strong,
.document-mode-option span {
  font-size: 0.9rem;
  font-weight: 850;
}
.document-language-option span,
.document-mode-option strong {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 650;
}
.document-language-option code {
  color: var(--violet-700);
  font: 800 0.72rem var(--f-mono);
}
.document-mode-grid {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}
.document-mode-option {
  cursor: pointer;
  min-height: 4.5rem;
}
.document-mode-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.document-upload-input {
  height: 1px;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  width: 1px;
}
.document-upload-card {
  min-height: 12rem;
}
.document-upload-error {
  color: var(--color-danger, #c0392b);
  font-size: 0.82rem;
  font-weight: 720;
}
.document-selected-files {
  gap: 0.65rem;
}
.document-selected-file .ico {
  font: 800 0.68rem var(--f-mono);
  min-width: 42px;
  padding: 0 0.3rem;
}
.document-dropzone {
  align-items: center;
  background: linear-gradient(180deg, #fbfafe, #ffffff);
  border: 1.5px dashed var(--line-2);
  border-radius: 18px;
  cursor: pointer;
  display: grid;
  gap: 0.55rem;
  min-height: 16rem;
  min-width: 0;
  overflow: hidden;
  padding: 1.5rem;
  place-items: center;
  text-align: center;
}
.document-dropzone input {
  max-width: min(100%, 18rem);
  min-width: 0;
  width: 100%;
}
.document-dropzone-wide {
  min-height: 12rem;
}
.document-file-selection-list {
  display: grid;
  gap: 0.55rem;
}
.document-file-selection-row {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 3.5rem minmax(0, 1fr) auto;
  padding: 0.75rem 0.85rem;
}
.document-file-selection-row > span {
  background: var(--ink);
  border-radius: 7px;
  color: #fff;
  font: 800 0.68rem var(--f-mono);
  justify-self: start;
  padding: 0.32rem 0.45rem;
}
.document-file-selection-row strong {
  color: var(--ink);
  font-size: 0.9rem;
  min-width: 0;
  overflow-wrap: anywhere;
}
.document-file-selection-row small {
  color: var(--muted);
  font: 700 0.78rem var(--f-mono);
}
.document-dropzone-icon {
  background: var(--g-brand);
  border-radius: 16px;
  box-shadow: 0 30px 60px -28px rgba(110, 60, 255, 0.8);
  color: #fff;
  display: grid;
  font: 900 0.88rem var(--f-mono);
  height: 4.25rem;
  place-items: center;
  width: 4.25rem;
}
.document-textarea {
  min-height: 16rem;
  resize: vertical;
}
.document-pdf-options {
  background: rgba(15, 23, 42, 0.035);
  border: 1px solid var(--line);
  border-radius: 14px;
  display: grid;
  gap: 0.75rem;
  padding: 0.9rem;
}
.document-pdf-options-head {
  display: grid;
  gap: 0.18rem;
}
.document-pdf-options-head strong {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 850;
}
.document-pdf-options-head small {
  color: var(--muted);
  font-size: 0.8rem;
}
.document-pdf-mode-grid {
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}
.document-pdf-warning {
  background: rgba(192, 57, 43, 0.08);
  border: 1px solid rgba(192, 57, 43, 0.25);
  border-radius: 10px;
  color: var(--color-danger, #c0392b);
  font-size: 0.82rem;
  font-weight: 720;
  padding: 0.7rem 0.8rem;
}
.document-submit-bar {
  align-items: center;
  background: linear-gradient(180deg, #1a0b40, #0b0420);
  border-radius: 18px;
  color: #fff;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1rem;
}
.document-inline-check {
  align-items: center;
  color: rgba(255, 255, 255, 0.88);
  display: inline-flex;
  font-size: 0.9rem;
  font-weight: 750;
  gap: 0.6rem;
}
.document-inline-check input {
  min-height: auto;
}
.document-submit-copy {
  display: grid;
  gap: 0.3rem;
  max-width: 42rem;
}
.document-submit-copy small {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.78rem;
  line-height: 1.4;
}
.document-job-list {
  display: grid;
  gap: 0.8rem;
}
.document-job-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.75rem;
  padding: 1rem;
}
.document-job-head,
.document-job-actions {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.document-job-title {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.document-job-title strong {
  color: var(--ink);
  font-weight: 850;
}
.document-job-warning {
  margin: 0;
}
.document-job-actions {
  flex-wrap: wrap;
  justify-content: flex-start;
}
.document-output-actions {
  align-items: center;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.document-download-link {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 10px;
  color: var(--ink);
  display: inline-flex;
  gap: 0.45rem;
  font-weight: 800;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.75rem 1.05rem;
  text-decoration: none;
}
.document-download-link:hover {
  border-color: var(--violet-300);
  color: var(--violet-700);
}
.document-download-link.disabled {
  color: var(--muted-2);
  cursor: not-allowed;
  opacity: 0.58;
}
.document-audit-button,
.document-audit-close {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line-2);
  border-radius: 10px;
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 800;
  gap: 0.45rem;
  min-height: 2.75rem;
  padding: 0.7rem 0.95rem;
}
.document-audit-button:hover,
.document-audit-close:hover {
  border-color: var(--violet-300);
  color: var(--violet-700);
}
.document-audit-modal {
  position: relative;
}
.document-audit-backdrop {
  background: rgba(5, 3, 14, 0.72);
  border: 0;
  cursor: default;
  inset: 0;
  position: fixed;
  z-index: 92;
}
.document-audit-panel {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: 0 24px 80px rgba(5, 3, 14, 0.36);
  color: var(--ink);
  display: grid;
  gap: 1.1rem;
  left: 50%;
  max-height: min(86dvh, 50rem);
  max-width: min(48rem, calc(100vw - 2rem));
  overflow: auto;
  padding: 1.15rem;
  position: fixed;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  z-index: 93;
}
.document-audit-head {
  align-items: center;
  background: linear-gradient(135deg, rgba(110, 60, 255, 0.1), rgba(0, 184, 158, 0.08));
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 0.95rem;
}
.document-audit-head div {
  display: grid;
  gap: 0.2rem;
}
.document-audit-head span {
  color: var(--violet-600);
  font: 900 0.72rem var(--f-mono);
  text-transform: uppercase;
}
.document-audit-head strong {
  color: var(--ink);
  font-size: 1.25rem;
  font-weight: 950;
}
.document-quality-report {
  background: linear-gradient(180deg, #ffffff, var(--paper-soft));
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 1rem;
  padding: 1rem;
}
.document-quality-report-empty {
  gap: 0.35rem;
}
.document-quality-report-empty strong {
  color: var(--ink);
  font-size: 1rem;
}
.document-quality-report-empty p {
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.55;
  margin: 0;
}
.document-quality-hero {
  align-items: center;
  display: grid;
  gap: 1rem;
  grid-template-columns: auto minmax(0, 1fr);
}
.document-quality-hero p {
  color: var(--ink);
  font-size: 0.95rem;
  font-weight: 650;
  line-height: 1.6;
  margin: 0.65rem 0 0;
}
.document-quality-score {
  align-items: center;
  aspect-ratio: 1;
  background: #ffffff;
  border: 1px solid rgba(0, 184, 158, 0.28);
  border-radius: 999px;
  box-shadow: inset 0 0 0 8px rgba(0, 184, 158, 0.1);
  display: grid;
  justify-items: center;
  min-width: 7rem;
  padding: 1.1rem;
}
.document-quality-score strong {
  color: var(--ink);
  font: 950 2rem var(--f-head);
  line-height: 1;
}
.document-quality-score span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 850;
  text-align: center;
}
.document-quality-verdict {
  background: rgba(0, 184, 158, 0.12);
  border: 1px solid rgba(0, 184, 158, 0.22);
  border-radius: 999px;
  color: #007a69;
  display: inline-flex;
  font-size: 0.82rem;
  font-weight: 850;
  padding: 0.35rem 0.6rem;
}
.document-quality-grid {
  display: grid;
  gap: 0.75rem;
}
.document-quality-list {
  background: #ffffff;
  border: 1px solid var(--line);
  border-left: 4px solid var(--violet-300);
  border-radius: 12px;
  display: grid;
  gap: 0.45rem;
  padding: 0.8rem 0.85rem;
}
.document-quality-list-success {
  border-left-color: #00a889;
}
.document-quality-list-warning {
  border-left-color: #e09a22;
}
.document-quality-list-info {
  border-left-color: var(--violet-300);
}
.document-quality-list > strong {
  color: var(--ink);
  font-size: 0.88rem;
}
.document-quality-list ul {
  color: var(--muted);
  display: grid;
  font-size: 0.9rem;
  gap: 0.35rem;
  line-height: 1.5;
  margin: 0;
  padding-left: 1.1rem;
}
.media-editor-grid {
  display: grid;
  gap: 1.35rem;
  grid-template-columns: minmax(0, 1fr) 360px;
}
.media-wave-card {
  padding: 1rem;
}
.media-cue-table {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
}
.media-cue-head,
.media-cue-row {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: 4rem 7rem minmax(0, 1fr) minmax(0, 1fr) 5rem;
}
.media-cue-head {
  background: var(--paper-soft);
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  padding: 0.8rem 1rem;
  text-transform: uppercase;
}
.media-cue-row {
  border-bottom: 1px solid var(--line);
  padding: 0.9rem 1rem;
}
.media-cue-row.active {
  background: #faf7ff;
  border-left: 3px solid var(--violet-500);
  padding-left: calc(1rem - 3px);
}
.media-cue-row textarea {
  min-height: 5rem;
  resize: vertical;
}
.media-inspector {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  display: grid;
  gap: 1rem;
  padding: 1.15rem;
  position: sticky;
  top: 1rem;
}
@media (max-width: 1100px) {
  .media-grid,
  .media-grid.start,
  .document-layout,
  .document-detail-hero,
  .document-detail-grid,
  .media-editor-grid,
  .provider-admin-layout {
    grid-template-columns: 1fr;
  }
  .media-panel.sticky,
  .document-queue-panel,
  .media-inspector,
  .provider-summary-rail {
    position: static;
  }
}
@media (max-width: 760px) {
  .media-title-row,
  .media-toolbar,
  .document-job-head,
  .document-submit-bar,
  .media-export-bar {
    align-items: stretch;
    flex-direction: column;
  }
  .media-track-card,
  .media-cue-head,
  .media-cue-row,
  .document-detail-output,
  .document-quality-summary,
  .document-quality-hero {
    grid-template-columns: 1fr;
  }
  .document-detail-intro-actions,
  .document-output-actions {
    justify-content: flex-start;
  }
  .document-stage-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .document-detail-facts {
    grid-template-columns: 1fr;
  }
  .document-detail-facts dd {
    text-align: left;
  }
  .document-audit-head {
    align-items: stretch;
    flex-direction: column;
  }
  .document-quality-score {
    justify-self: start;
  }
  .media-actions {
    justify-content: flex-start;
  }
}
.brand-mark {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  height: 2rem;
  justify-content: center;
  line-height: 1;
  width: 2rem;
}
.brand-mark-image {
  display: block;
  height: 100%;
  object-fit: contain;
  width: 100%;
}
.brand-lockup {
  align-items: center;
  display: inline-flex;
  gap: 0.7rem;
  font-family: var(--f-brand), var(--f-sans);
  font-weight: 800;
  letter-spacing: 0;
}
.brand-name {
  display: inline-block;
  font-family: var(--f-brand), var(--f-sans);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.18;
  padding-bottom: 0.08em;
}
.pill {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  display: inline-flex;
  font-size: 0.72rem;
  font-weight: 800;
  gap: 0.4rem;
  letter-spacing: 0.04em;
  padding: 0.36rem 0.66rem;
  text-transform: uppercase;
}
.pill-live {
  background: rgba(255, 77, 109, 0.1);
  border-color: rgba(255, 77, 109, 0.3);
  color: #c8214a;
}
.pill-live::before {
  background: var(--live);
  border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(255, 77, 109, 0.18);
  content: "";
  height: 0.4rem;
  width: 0.4rem;
}
.pill-mint {
  background: rgba(0, 184, 158, 0.12);
  border-color: rgba(0, 184, 158, 0.25);
  color: #00735f;
}
.pill-violet {
  background: var(--violet-50);
  border-color: rgba(110, 60, 255, 0.2);
  color: var(--violet-700);
}
.pill-amber {
  background: rgba(255, 178, 59, 0.16);
  border-color: rgba(255, 178, 59, 0.3);
  color: #8b5a00;
}
.pill-rose {
  background: rgba(255, 61, 139, 0.1);
  border-color: rgba(255, 61, 139, 0.25);
  color: #b81f60;
}
.btn-link {
  align-items: center;
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  display: inline-flex;
  font-size: 0.92rem;
  font-weight: 800;
  gap: 0.5rem;
  min-height: 2.75rem;
  padding: 0 1rem;
}
.btn-link.primary {
  background: var(--g-brand);
  border-color: transparent;
  box-shadow: 0 22px 44px -24px rgba(110, 60, 255, 0.7);
  color: #ffffff;
}
.btn-link.dark {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
}
.btn-link.danger {
  background: #fff5f5;
  border-color: rgba(185, 28, 28, 0.22);
  color: #9f1d1d;
}
.btn-link.disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: 0.58;
}
button.btn-link {
  cursor: pointer;
  font-family: inherit;
}
.marketing-page {
  background: var(--g-night);
  color: #ffffff;
  min-height: 100vh;
  overflow: hidden;
}
.marketing-nav {
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin: 0 auto;
  max-width: 1180px;
  padding: 1.1rem 1.25rem;
}
.marketing-nav a {
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.86rem;
  font-weight: 650;
}
.marketing-nav .links {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.hero-shell {
  display: grid;
  gap: clamp(2rem, 5vw, 4rem);
  grid-template-columns: minmax(0, 1.02fr) minmax(20rem, 0.98fr);
  margin: 0 auto;
  max-width: 1180px;
  padding: clamp(3rem, 8vw, 6rem) 1.25rem 5rem;
}
.hero-copy {
  align-self: center;
  display: grid;
  gap: 1.2rem;
}
.hero-copy h1 {
  font-size: clamp(3rem, 8vw, 5.1rem);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 0.98;
  margin: 0;
}
.hero-copy h1 span {
  background: linear-gradient(90deg, #ffb1e2 0%, #9cc9ff 58%, #9df7e3 100%);
  background-clip: text;
  color: transparent;
}
.hero-copy p {
  color: rgba(255, 255, 255, 0.76);
  font-size: 1.08rem;
  line-height: 1.65;
  margin: 0;
  max-width: 39rem;
}
.hero-actions,
.auth-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}
.console-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02));
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--r-lg);
  box-shadow: 0 60px 120px -30px rgba(0, 0, 0, 0.62), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  padding: 1rem;
}
.console-head,
.console-row,
.metric-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.console-head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.85rem;
  font-weight: 800;
  padding: 0.25rem 0.25rem 0.9rem;
}
.wave {
  align-items: center;
  display: flex;
  gap: 0.22rem;
  height: 4.6rem;
  margin: 0.8rem 0;
}
.wave span {
  background: linear-gradient(180deg, #9df7e3, #7c5cff);
  border-radius: 999px;
  flex: 1;
}
.console-row {
  align-items: flex-start;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  gap: 0.8rem;
  justify-content: flex-start;
  padding: 0.85rem 0.25rem;
}
.console-row code {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 6px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.7rem;
  font-weight: 800;
  padding: 0.35rem 0.45rem;
}
.console-row p {
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.94rem;
  font-weight: 650;
  line-height: 1.48;
  margin: 0;
}
.console-row:nth-of-type(4) p {
  color: #c0f2e2;
}
.feature-band {
  background: var(--paper);
  color: var(--ink);
  padding: 4.5rem 1.25rem;
}
.feature-inner {
  display: grid;
  gap: 1.2rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 auto;
  max-width: 1180px;
}
.feature-card,
.auth-form-card,
.host-side-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-md);
}
.feature-card {
  display: grid;
  gap: 0.75rem;
  padding: 1.6rem;
}
.feature-card strong {
  font-size: 1.06rem;
  letter-spacing: 0;
}
.feature-card p {
  color: var(--muted);
  line-height: 1.58;
  margin: 0;
}
.auth-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(21rem, 1fr);
  min-height: 100vh;
}
.auth-copy {
  background: var(--g-night);
  color: #ffffff;
  display: grid;
  padding: clamp(2rem, 6vw, 4.5rem);
}
.auth-copy-inner {
  align-self: center;
  display: grid;
  gap: 1.4rem;
  max-width: 34rem;
}
.auth-copy h1 {
  font-size: clamp(2.5rem, 6vw, 4.4rem);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  margin: 0;
}
.auth-copy p {
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.65;
  margin: 0;
}
.auth-form-wrap {
  align-items: center;
  display: grid;
  padding: clamp(2rem, 5vw, 4rem);
}
.auth-form-card {
  display: grid;
  gap: 1.4rem;
  margin: 0 auto;
  max-width: 31rem;
  padding: clamp(1.4rem, 4vw, 2rem);
  width: 100%;
}
.auth-form-card h2 {
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.06;
  margin: 0;
}
.auth-form-card p {
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
}
.auth-form-card form,
.form-grid {
  display: grid;
  gap: 0.9rem;
}
.host-shell {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(14rem, 17rem) minmax(0, 1fr);
  min-height: 100vh;
  padding: 1.25rem;
  transition: grid-template-columns 180ms ease;
}
.host-workspace-only {
  min-height: 100dvh;
  padding: 1.25rem;
}
.host-shell[data-collapsed="true"] {
  grid-template-columns: 5rem minmax(0, 1fr);
}
.host-side {
  align-self: start;
  display: grid;
  gap: 1rem;
  max-height: calc(100vh - 2.5rem);
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  position: sticky;
  top: 1.25rem;
  z-index: 90;
}
.host-shell[data-collapsed="true"] .host-side {
  overflow: visible;
}
.host-side-card {
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding: 1rem;
}
.host-side-header {
  align-items: center;
  display: flex;
  gap: 0.55rem;
  justify-content: space-between;
  min-width: 0;
}
.host-side-header .brand-lockup {
  min-width: 0;
}
.host-side-primary {
  position: relative;
}
.host-side-nav-sections {
  min-width: 0;
}
.language-switcher {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.55rem;
  padding-top: 0.85rem;
}
.language-switcher label {
  color: var(--ink-soft);
  display: grid;
  font-size: 0.78rem;
  font-weight: 800;
  gap: 0.35rem;
}
.language-switcher select,
.language-switcher button {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  min-height: 2.5rem;
}
.language-switcher select {
  background: var(--paper);
  color: var(--ink);
  padding: 0 0.65rem;
}
.language-switcher button {
  background: var(--paper-soft);
  color: var(--ink);
  cursor: pointer;
  font-weight: 800;
  padding: 0 0.75rem;
  touch-action: manipulation;
}
.host-shell[data-collapsed="true"] .language-switcher {
  display: none;
}
.host-sidebar-toggle {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink-soft);
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  height: 2.75rem;
  justify-content: center;
  touch-action: manipulation;
  width: 2.75rem;
}
.host-mobile-menu-toggle {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink-soft);
  cursor: pointer;
  display: none;
  flex: 0 0 auto;
  height: 2.75rem;
  justify-content: center;
  touch-action: manipulation;
  width: 2.75rem;
}
.host-sidebar-toggle:hover,
.host-sidebar-toggle:focus-visible,
.host-mobile-menu-toggle:hover,
.host-mobile-menu-toggle:focus-visible {
  border-color: var(--violet-200);
  color: var(--violet-700);
}
.brand-lockup-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.host-shell[data-collapsed="true"] .host-side-card {
  padding: 0.75rem;
}
.host-shell[data-collapsed="true"] .brand-lockup {
  gap: 0;
  justify-content: center;
}
.host-shell[data-collapsed="true"] .brand-lockup-text,
.host-shell[data-collapsed="true"] .side-group-label,
.host-shell[data-collapsed="true"] .sidebar-card-heading strong,
.host-shell[data-collapsed="true"] .sidebar-card-heading p {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.host-shell[data-collapsed="true"] .host-side-header {
  display: grid;
  gap: 0.25rem;
  justify-items: center;
}
.host-shell[data-collapsed="true"] .host-sidebar-toggle {
  width: 100%;
}
.side-group-label {
  color: var(--muted);
  display: block;
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}
.sidebar-card-heading {
  display: grid;
  gap: 0.35rem;
}
.sidebar-card-heading strong {
  color: var(--ink);
  font-size: 0.95rem;
  font-weight: 900;
  letter-spacing: 0;
}
.sidebar-card-heading p {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
  margin: 0;
}
.provider-admin-card {
  background: var(--paper);
  border-color: rgba(124, 58, 237, 0.18);
  gap: 0.85rem;
  position: relative;
}
.provider-admin-card::before {
  background: linear-gradient(135deg, var(--violet-500), var(--magenta-500));
  border-radius: 999px;
  content: "";
  height: 0.2rem;
  left: 1rem;
  position: absolute;
  right: 1rem;
  top: 0.65rem;
}
.provider-admin-card .sidebar-card-heading {
  padding-top: 0.35rem;
}
.provider-admin-card .host-nav a,
.provider-admin-card .host-nav button {
  font-size: 0.88rem;
  padding: 0.62rem 0.85rem;
}
.host-shell[data-collapsed="true"] .provider-admin-card::before {
  left: 0.75rem;
  right: 0.75rem;
}
.host-nav {
  display: grid;
  gap: 0.25rem;
}
.host-nav a,
.host-nav button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: var(--r-sm);
  color: var(--ink-soft);
  cursor: pointer;
  display: flex;
  font-size: 0.92rem;
  font-weight: 760;
  justify-content: space-between;
  min-width: 0;
  padding: 0.78rem 0.85rem;
  text-align: left;
  touch-action: manipulation;
  width: 100%;
}
.host-nav-item-main {
  align-items: center;
  display: inline-flex;
  gap: 0.65rem;
  min-width: 0;
}
.host-nav-icon {
  flex: 0 0 auto;
  height: 1.28rem;
  width: 1.28rem;
}
.host-nav-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.host-nav-chevron {
  color: var(--muted);
  flex: 0 0 auto;
}
.host-nav-tooltip {
  background: var(--ink);
  border-radius: 9px;
  box-shadow: var(--sh-md);
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 800;
  left: calc(100% + 0.55rem);
  line-height: 1;
  opacity: 0;
  padding: 0.5rem 0.6rem;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate(-0.25rem, -50%);
  transition: opacity 140ms ease, transform 140ms ease;
  white-space: nowrap;
  z-index: 20;
}
.host-shell[data-collapsed="true"] .host-nav a,
.host-shell[data-collapsed="true"] .host-nav button {
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.7rem;
  position: relative;
}
.host-shell[data-collapsed="true"] .provider-admin-card .host-nav a,
.host-shell[data-collapsed="true"] .provider-admin-card .host-nav button {
  padding: 0.7rem;
}
.host-shell[data-collapsed="true"] .host-nav-item-main {
  gap: 0;
}
.host-shell[data-collapsed="true"] .host-nav-label,
.host-shell[data-collapsed="true"] .host-nav-chevron {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.host-shell[data-collapsed="true"] .host-nav a:hover .host-nav-tooltip,
.host-shell[data-collapsed="true"] .host-nav a:focus-visible .host-nav-tooltip,
.host-shell[data-collapsed="true"] .host-nav button:hover .host-nav-tooltip,
.host-shell[data-collapsed="true"] .host-nav button:focus-visible .host-nav-tooltip {
  opacity: 1;
  transform: translate(0, -50%);
}
.host-shell[data-collapsed="true"] .host-nav-group[data-flyout-open="true"] .host-nav-tooltip {
  opacity: 0;
}
.host-shell[data-collapsed="true"] .host-nav-flyout .host-nav-label {
  clip: auto;
  clip-path: none;
  height: auto;
  overflow: hidden;
  position: static;
  white-space: nowrap;
  width: auto;
}
.host-shell[data-collapsed="true"] .host-nav-flyout a {
  justify-content: flex-start;
}
.skeleton-line,
.skeleton-card {
  animation: vocalis-skeleton-pulse 1.2s ease-in-out infinite;
  background: linear-gradient(90deg, rgba(15, 23, 42, 0.08), rgba(124, 58, 237, 0.14), rgba(15, 23, 42, 0.08));
  border-radius: 8px;
  display: block;
}
.skeleton-line {
  height: 18px;
  max-width: 34rem;
}
.skeleton-line-wide {
  width: min(100%, 34rem);
}
.skeleton-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}
.skeleton-card {
  aspect-ratio: 16 / 7;
  min-height: 5rem;
}
.loading-surface {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-md);
  justify-items: center;
  min-height: min(32rem, 72dvh);
  text-align: center;
}
.loading-spinner {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex;
  height: 4rem;
  justify-content: center;
  width: 4rem;
}
.loading-spinner span {
  animation: vocalis-loading-spin 800ms linear infinite;
  border: 3px solid rgba(110, 60, 255, 0.18);
  border-top-color: var(--violet-600);
  border-radius: 999px;
  display: block;
  height: 2rem;
  width: 2rem;
}
.loading-copy {
  display: grid;
  gap: 0.4rem;
  max-width: 28rem;
}
.loading-copy strong {
  color: var(--ink);
  font-size: 1.15rem;
  font-weight: 900;
}
.loading-copy span {
  color: var(--muted);
  line-height: 1.55;
}
.loading-skeleton-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(3, minmax(5rem, 9rem));
  max-width: 100%;
}
.loading-skeleton-grid.compact {
  grid-template-columns: repeat(2, minmax(5rem, 9rem));
}
.loading-skeleton-grid span {
  animation: vocalis-skeleton-pulse 1.2s ease-in-out infinite;
  background: linear-gradient(90deg, rgba(15, 23, 42, 0.08), rgba(124, 58, 237, 0.14), rgba(15, 23, 42, 0.08));
  border-radius: var(--r-sm);
  display: block;
  height: 4.25rem;
}
@keyframes vocalis-loading-spin {
  to {
    transform: rotate(360deg);
  }
}
.voices-delete-form,
.voices-delete-confirm {
  align-items: center;
  display: flex;
  gap: 0.5rem;
}
.voices-delete-form {
  flex-wrap: wrap;
  justify-content: flex-end;
}
.voices-delete-confirm {
  color: var(--ink-soft);
  font-size: 0.78rem;
  font-weight: 700;
}
.voices-delete-confirm input {
  accent-color: var(--danger);
  min-height: 1rem;
  min-width: 1rem;
}
.voices-list-actions[aria-busy="true"] {
  opacity: 0.62;
  pointer-events: none;
}
@keyframes vocalis-skeleton-pulse {
  0%,
  100% {
    opacity: 0.55;
  }
  50% {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .host-shell,
  .host-nav-tooltip,
  .loading-spinner span,
  .loading-skeleton-grid span,
  .skeleton-line,
  .skeleton-card {
    transition: none;
    animation: none;
  }
}
.host-nav-group {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
  position: relative;
}
.host-nav-submenu {
  border-left: 1px solid var(--line-2);
  display: grid;
  gap: 0.15rem;
  margin: 0.1rem 0 0.35rem 0.85rem;
  padding-left: 0.55rem;
}
.host-nav-submenu a {
  color: var(--muted);
  font-size: 0.82rem;
  padding: 0.58rem 0.7rem;
}
.host-nav-flyout {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  box-shadow: var(--sh-md);
  display: grid;
  gap: 0.45rem;
  left: calc(100% + 0.65rem);
  min-width: 12rem;
  padding: 0.55rem;
  position: absolute;
  top: 0;
  z-index: 100;
}
.host-nav-flyout::before {
  background: #ffffff;
  border-bottom: 1px solid var(--line);
  border-left: 1px solid var(--line);
  content: "";
  height: 0.65rem;
  left: -0.38rem;
  position: absolute;
  top: 1rem;
  transform: rotate(45deg);
  width: 0.65rem;
}
.host-nav-flyout strong {
  color: var(--ink);
  font-size: 0.75rem;
  font-weight: 900;
  padding: 0.35rem 0.5rem 0.2rem;
}
.host-nav-flyout > div {
  display: grid;
  gap: 0.15rem;
}
.host-nav-flyout a {
  border-radius: 9px;
  color: var(--ink-soft);
  font-size: 0.86rem;
  font-weight: 800;
  min-height: 2.5rem;
  padding: 0.68rem 0.72rem;
  position: relative;
}
.host-nav a:hover,
.host-nav a.active,
.host-nav button:hover,
.host-nav button.active {
  background: var(--paper);
  box-shadow: inset 0 0 0 1px var(--line), var(--sh-sm);
  color: var(--violet-700);
}
.host-nav a:hover,
.host-nav button:hover {
  background: var(--violet-50);
  box-shadow: none;
}
.host-workspace-label {
  margin: 0.85rem 0 0.25rem;
}
.host-credit-card {
  gap: 0.65rem;
}
.host-credit-card.collapsed {
  align-items: center;
  color: var(--violet-600);
  justify-items: center;
  min-height: 3.25rem;
  padding: 0.75rem;
}
.host-credit-card-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.host-credit-card-head span {
  color: var(--muted);
  font: 850 0.7rem var(--f-mono);
  letter-spacing: 0;
  text-transform: uppercase;
}
.host-credit-card-head strong {
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 900;
}
.host-credit-meter {
  background: var(--line);
  border-radius: 999px;
  height: 0.38rem;
  overflow: hidden;
}
.host-credit-meter span {
  background: var(--g-brand);
  border-radius: inherit;
  display: block;
  height: 100%;
}
.host-credit-card p {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
  margin: 0;
}
.host-credit-card a {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-size: 0.82rem;
  font-weight: 850;
  justify-content: center;
  min-height: 2.35rem;
  text-decoration: none;
}
.host-shell[data-collapsed="true"] .host-workspace-label {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.work-filter-bar {
  align-items: end;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(12rem, 1.5fr) minmax(10rem, 0.8fr) minmax(10rem, 0.8fr) auto;
  margin-bottom: 1rem;
}
.work-filter-bar label {
  display: grid;
  gap: 0.35rem;
}
.work-filter-bar span {
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 800;
}
.work-filter-submit,
.work-action {
  align-items: center;
  border: 1px solid var(--line-2);
  border-radius: 10px;
  color: var(--ink);
  display: inline-flex;
  font-weight: 850;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.68rem 0.95rem;
}
.work-filter-submit {
  background: var(--ink);
  color: #ffffff;
  cursor: pointer;
}
.work-list {
  display: grid;
  gap: 0.7rem;
}
.work-list-row {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.8rem;
  grid-template-columns: minmax(0, 1.3fr) minmax(12rem, 0.7fr) auto;
  padding: 0.9rem;
}
.work-row-main,
.work-row-status {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.work-row-main strong {
  color: var(--ink);
  font-weight: 900;
  overflow-wrap: anywhere;
}
.work-row-main span,
.work-row-status span {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.5;
}
.work-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
}
.work-delete-form {
  display: inline-flex;
  margin: 0;
}
.work-row-actions.two {
  min-width: 10rem;
}
.work-action {
  background: var(--paper-soft);
  gap: 0.35rem;
  min-width: 5.25rem;
  text-decoration: none;
}
button.work-action {
  cursor: pointer;
  font: inherit;
}
.work-action.primary {
  background: var(--g-brand);
  border-color: transparent;
  color: #ffffff;
}
.work-action.danger,
.document-icon-action.document-icon-action-danger {
  background: #fff5f5;
  border-color: rgba(185, 28, 28, 0.22);
  color: #9f1d1d;
}
.work-action.danger:hover,
.document-icon-action.document-icon-action-danger:hover {
  border-color: rgba(185, 28, 28, 0.42);
  color: #7f1d1d;
}
.work-action.disabled {
  color: var(--muted-2);
  cursor: not-allowed;
  opacity: 0.55;
}
.document-detail-workspace {
  gap: 1.25rem;
}
.document-detail-intro-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}
.document-detail-intro-actions form {
  display: inline-flex;
}
.document-icon-action {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 850;
  gap: 0.45rem;
  justify-content: center;
  min-height: 2.5rem;
  padding: 0.62rem 0.82rem;
  text-decoration: none;
  white-space: nowrap;
}
.document-icon-action:hover {
  border-color: var(--violet-300);
  color: var(--violet-700);
}
.document-icon-action-primary {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
}
.document-icon-action-primary:hover {
  background: var(--ink-2);
  border-color: var(--ink-2);
  color: #ffffff;
}
.document-icon-action:disabled {
  cursor: wait;
  opacity: 0.72;
}
.document-download-spinner {
  animation: vocalis-loading-spin 0.85s linear infinite;
}
.document-detail-hero {
  align-items: stretch;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1.45fr) minmax(17rem, 0.65fr);
}
.document-detail-hero-main,
.document-detail-hero-aside,
.document-detail-panel {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.document-detail-hero-main {
  display: grid;
  gap: 1rem;
  padding: 1rem;
}
.document-detail-file-row {
  align-items: center;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: auto minmax(0, 1fr);
}
.document-detail-file-icon,
.document-output-file-icon,
.document-detail-metric-icon {
  align-items: center;
  background: var(--brand-50, #f5f2ff);
  border: 1px solid rgba(110, 60, 255, 0.16);
  border-radius: 8px;
  color: var(--violet-700);
  display: inline-flex;
  flex: 0 0 auto;
  justify-content: center;
}
.document-detail-file-icon {
  height: 3rem;
  width: 3rem;
}
.document-detail-file-copy {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.document-detail-file-copy strong {
  color: var(--ink);
  font-size: 1.02rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}
.document-detail-file-copy span,
.document-detail-progress-head span,
.document-detail-metric small,
.document-output-file-meta span,
.document-output-status span,
.document-quality-summary p,
.document-quality-output-list,
.document-detail-facts dd,
.document-detail-warning-list {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
}
.document-detail-progress-block {
  display: grid;
  gap: 0.45rem;
}
.document-detail-progress-head {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.document-detail-progress-head strong {
  color: var(--ink);
  font: 900 0.92rem var(--f-mono);
}
.document-detail-progress-track {
  background: var(--line);
  border-radius: 999px;
  height: 0.55rem;
  overflow: hidden;
}
.document-detail-progress-track span {
  background: linear-gradient(90deg, var(--violet-600), #00b89e);
  border-radius: inherit;
  display: block;
  height: 100%;
  min-width: 0.35rem;
}
.document-stage-rail {
  display: grid;
  gap: 0.45rem;
  grid-template-columns: repeat(auto-fit, minmax(5.25rem, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}
.document-stage-rail li {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  display: grid;
  gap: 0.35rem;
  justify-items: center;
  min-height: 4.25rem;
  padding: 0.55rem;
  text-align: center;
}
.document-stage-rail li > span {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex;
  height: 1.55rem;
  justify-content: center;
  width: 1.55rem;
}
.document-stage-rail strong {
  color: inherit;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.25;
}
.document-stage-rail li[data-state="complete"] {
  background: rgba(0, 184, 158, 0.08);
  border-color: rgba(0, 184, 158, 0.24);
  color: #007a69;
}
.document-stage-rail li[data-state="current"] {
  background: var(--brand-50, #f5f2ff);
  border-color: rgba(110, 60, 255, 0.32);
  color: var(--violet-700);
  box-shadow: 0 0 0 2px rgba(110, 60, 255, 0.08);
}
.document-stage-rail li[data-state="failed"] {
  background: rgba(255, 77, 109, 0.08);
  border-color: rgba(255, 77, 109, 0.25);
  color: #c8214a;
}
.document-detail-hero-aside {
  display: grid;
  gap: 0;
  padding: 0;
}
.document-detail-metric {
  align-items: center;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 1rem;
}
.document-detail-metric:first-child {
  border-top: 0;
}
.document-detail-metric-icon {
  height: 2.2rem;
  width: 2.2rem;
}
.document-detail-metric div {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}
.document-detail-metric span:not(.document-detail-metric-icon) {
  color: var(--muted);
  font: 800 0.7rem var(--f-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.document-detail-metric strong {
  color: var(--ink);
  font: 900 1.4rem var(--f-sans);
  line-height: 1.05;
}
.document-detail-grid {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(19rem, 24rem);
}
.document-detail-grid[data-has-side="false"] {
  grid-template-columns: 1fr;
}
.document-detail-main-column,
.document-detail-side-column,
.document-detail-output-list,
.document-detail-warning-list,
.document-quality-output-list {
  display: grid;
  gap: 0.75rem;
}
.document-detail-output {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(0, 1fr) minmax(8rem, auto) auto;
  padding: 0.9rem;
}
.document-detail-item {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 0.75rem;
  padding: 0.85rem;
}
.document-detail-item-head {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  min-width: 0;
}
.document-output-file-meta {
  align-items: center;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
}
.document-output-file-icon {
  height: 2.3rem;
  width: 2.3rem;
}
.document-output-file-meta div,
.document-output-status {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.document-output-file-meta strong {
  color: var(--ink);
  font-weight: 900;
  overflow-wrap: anywhere;
}
.document-output-warning-list {
  color: #8b5a00;
  display: grid;
  font-size: 0.82rem;
  gap: 0.2rem;
  line-height: 1.45;
  list-style: disc;
  margin: 0.15rem 0 0;
  padding-left: 1rem;
}
.document-output-status {
  justify-items: start;
}
.document-output-quality-notice {
  background: #fff8e6;
  border: 1px solid #f3d28a;
  border-radius: 8px;
  color: #7a4d00;
  display: grid;
  font-size: 0.78rem;
  gap: 0.2rem;
  line-height: 1.4;
  max-width: 22rem;
  padding: 0.5rem 0.6rem;
}
.document-output-quality-notice p,
.document-output-quality-notice small {
  overflow-wrap: anywhere;
}
.document-output-actions {
  justify-content: flex-end;
}
.document-detail-output:has(.document-output-actions:nth-child(2)) {
  grid-template-columns: minmax(0, 1fr) auto;
}
.document-source-file-row {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 0.9rem;
}
.document-source-file-row.compact {
  background: #ffffff;
}
.document-quality-summary {
  align-items: center;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: auto minmax(0, 1fr);
}
.document-quality-summary p {
  margin: 0.6rem 0 0;
}
.document-quality-meter {
  align-items: center;
  aspect-ratio: 1;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 999px;
  box-shadow: inset 0 0 0 0.48rem var(--paper-soft);
  display: grid;
  justify-items: center;
  min-width: 5.8rem;
  padding: 0.85rem;
}
.document-quality-meter[data-tone="success"] {
  border-color: rgba(0, 184, 158, 0.28);
  box-shadow: inset 0 0 0 0.48rem rgba(0, 184, 158, 0.1);
}
.document-quality-meter[data-tone="warning"] {
  border-color: rgba(255, 178, 59, 0.34);
  box-shadow: inset 0 0 0 0.48rem rgba(255, 178, 59, 0.13);
}
.document-quality-meter[data-tone="danger"] {
  border-color: rgba(255, 77, 109, 0.34);
  box-shadow: inset 0 0 0 0.48rem rgba(255, 77, 109, 0.1);
}
.document-quality-meter strong {
  color: var(--ink);
  font: 950 1.65rem var(--f-sans);
  line-height: 1;
}
.document-quality-meter span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 850;
}
.document-quality-output-row {
  align-items: center;
  border-top: 1px dashed var(--line);
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  padding-top: 0.65rem;
}
.document-quality-output-row:first-child {
  border-top: 0;
  padding-top: 0;
}
.document-quality-output-row span {
  color: var(--muted);
  font: 800 0.76rem var(--f-mono);
}
.document-quality-output-row strong {
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 850;
  text-align: right;
}
.document-detail-facts {
  display: grid;
  gap: 0.55rem 1rem;
  grid-template-columns: minmax(6rem, auto) minmax(0, 1fr);
  margin: 0;
}
.document-detail-facts dt {
  color: var(--muted);
  font: 800 0.72rem var(--f-mono);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.document-detail-facts dd {
  margin: 0;
  text-align: right;
}
.document-language-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.25rem;
}
.document-language-chip-list span {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  font: 800 0.72rem var(--f-mono);
  padding: 0.28rem 0.55rem;
}
.document-detail-warning-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.document-detail-warning-list li {
  align-items: start;
  background: rgba(255, 178, 59, 0.08);
  border: 1px solid rgba(255, 178, 59, 0.22);
  border-radius: 8px;
  color: #8b5a00;
  display: grid;
  gap: 0.55rem;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 0.75rem;
}
@media (max-width: 1100px) {
  .document-detail-hero,
  .document-detail-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .document-detail-workspace {
    gap: 0.9rem;
  }
  .document-detail-intro-actions,
  .document-output-actions {
    align-items: stretch;
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
    width: 100%;
  }
  .document-detail-intro-actions form,
  .document-icon-action,
  .document-download-link,
  .document-audit-button {
    width: 100%;
  }
  .document-detail-hero-main,
  .document-detail-panel {
    padding: 0.9rem;
  }
  .document-detail-file-row,
  .document-output-file-meta,
  .document-detail-metric {
    align-items: start;
    grid-template-columns: auto minmax(0, 1fr);
  }
  .document-stage-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .document-detail-output,
  .document-detail-output:has(.document-output-actions:nth-child(2)),
  .document-source-file-row,
  .document-quality-summary {
    align-items: stretch;
    grid-template-columns: 1fr;
  }
  .document-output-status,
  .document-output-actions {
    justify-items: stretch;
  }
  .document-detail-facts {
    grid-template-columns: 1fr;
  }
  .document-detail-facts dd {
    text-align: left;
  }
}
.surface-page {
  display: grid;
  gap: 1.35rem;
}
.surface-panel-grid,
.metric-grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}
.surface-split {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 24rem);
}
.surface-two-col {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
}
.surface-list {
  display: grid;
  gap: 0.875rem;
}
.production-test-media-source {
  display: grid;
  gap: 0.75rem;
}
.production-test-subnav {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 0.45rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0.45rem;
}
.production-test-subnav a {
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  color: var(--ink);
  display: grid;
  gap: 0.25rem;
  min-height: 4.2rem;
  padding: 0.8rem 0.9rem;
  text-decoration: none;
}
.production-test-subnav a:hover,
.production-test-subnav a.active {
  background: var(--violet-50);
  border-color: rgba(110, 60, 255, 0.24);
}
.production-test-subnav a.active {
  box-shadow: inset 0 0 0 1px rgba(110, 60, 255, 0.18);
}
.production-test-subnav strong {
  font-size: 0.95rem;
  font-weight: 850;
}
.production-test-subnav span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.35;
}
.production-test-workspace,
.production-test-results-layout {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
}
.production-test-results-layout {
  grid-template-columns: minmax(17rem, 0.42fr) minmax(0, 1fr);
}
.production-test-guide {
  background: linear-gradient(135deg, rgba(110, 60, 255, 0.08), rgba(38, 211, 164, 0.08));
  border: 1px solid rgba(110, 60, 255, 0.18);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0.85rem;
}
.production-test-guide div {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
}
.production-test-guide span {
  align-items: center;
  background: var(--ink);
  border-radius: 999px;
  color: var(--paper);
  display: inline-flex;
  font: 800 0.75rem var(--f-mono);
  height: 1.45rem;
  justify-content: center;
  width: 1.45rem;
}
.production-test-guide strong {
  color: var(--ink);
  font-size: 0.88rem;
}
.production-test-guide p {
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.45;
  margin: 0;
}
.production-test-run-detail {
  display: grid;
  gap: 1.1rem;
  min-width: 0;
}
.production-test-timeline {
  display: grid;
  gap: 0;
}
.production-test-timeline-step {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: 1rem minmax(0, 1fr);
  min-width: 0;
  position: relative;
}
.production-test-timeline-step + .production-test-timeline-step {
  padding-top: 0.9rem;
}
.production-test-timeline-step::before {
  background: var(--line);
  bottom: -0.9rem;
  content: "";
  left: 0.45rem;
  position: absolute;
  top: 1rem;
  width: 2px;
}
.production-test-timeline-step:last-child::before {
  display: none;
}
.production-test-timeline-marker {
  background: var(--paper);
  border: 3px solid var(--line);
  border-radius: 999px;
  height: 1rem;
  margin-top: 1.1rem;
  position: relative;
  width: 1rem;
  z-index: 1;
}
.production-test-timeline-step.passed .production-test-timeline-marker {
  border-color: var(--mint);
}
.production-test-timeline-step.failed .production-test-timeline-marker {
  border-color: var(--rose);
}
.production-test-timeline-step.blocked .production-test-timeline-marker,
.production-test-timeline-step.skipped .production-test-timeline-marker {
  border-color: var(--amber);
}
.production-test-timeline-step.running .production-test-timeline-marker {
  border-color: var(--live);
}
.production-test-timeline-body,
.production-test-artifact-card,
.production-test-coverage-row {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  min-width: 0;
  padding: 1rem;
}
.production-test-timeline-head,
.production-test-artifact-head {
  align-items: flex-start;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.production-test-timeline-head > div,
.production-test-artifact-head > div {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.production-test-timeline-head strong,
.production-test-artifact-head strong,
.production-test-coverage-row strong {
  color: var(--ink);
  font-weight: 850;
}
.production-test-timeline-head span,
.production-test-artifact-head span,
.production-test-coverage-row span {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.45;
}
.production-test-step-meta {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0.8rem 0 0;
}
.production-test-step-meta div {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  min-width: 0;
  padding: 0.6rem;
}
.production-test-step-meta dt {
  color: var(--muted);
  font: 800 0.68rem var(--f-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.production-test-step-meta dd {
  color: var(--ink);
  font-size: 0.84rem;
  margin: 0.15rem 0 0;
  overflow-wrap: anywhere;
}
.production-test-detail-summary {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.5;
  margin: 0.8rem 0 0;
}
.production-test-step-artifacts {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.85rem;
}
.production-test-artifact-card {
  display: grid;
  gap: 0.75rem;
}
.production-test-artifact-card.compact {
  background: var(--paper-soft);
}
.production-test-artifact-card audio,
.production-test-artifact-card iframe {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  width: 100%;
}
.production-test-artifact-card iframe {
  background: #ffffff;
  min-height: 14rem;
}
.production-test-artifact-link {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-size: 0.88rem;
  font-weight: 800;
  min-height: 2.4rem;
  padding: 0.5rem 0.7rem;
  text-decoration: none;
  width: fit-content;
}
.production-test-json-details {
  display: grid;
  gap: 0.5rem;
}
.production-test-json-details summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 0.84rem;
  font-weight: 800;
}
.production-test-json-details pre {
  background: #111827;
  border-radius: var(--r-sm);
  color: #f8fafc;
  font-size: 0.78rem;
  line-height: 1.5;
  margin: 0;
  overflow-x: auto;
  padding: 0.8rem;
  white-space: pre-wrap;
}
.production-test-coverage-grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
}
.production-test-coverage-list {
  display: grid;
  gap: 0.75rem;
}
.production-test-coverage-row {
  color: var(--ink);
  display: grid;
  gap: 0.75rem;
  text-decoration: none;
}
.production-test-coverage-row > div:first-child {
  display: grid;
  gap: 0.25rem;
}
.production-test-coverage-row > div:last-child {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.surface-row,
.surface-card-row {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.875rem;
  min-width: 0;
  padding: 1rem;
}
.surface-row {
  align-items: center;
  grid-template-columns: minmax(0, 1fr) auto;
}
.surface-row.compact {
  border-left: 0;
  border-radius: 0;
  border-right: 0;
  border-top: 0;
  padding-inline: 0;
}
.surface-form-grid {
  display: grid;
  gap: 0.875rem;
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}
.surface-table-wrap {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  overflow-x: auto;
}
.surface-table {
  border-collapse: collapse;
  min-width: 42rem;
  width: 100%;
}
.surface-table th,
.surface-table td {
  border-bottom: 1px solid var(--line);
  padding: 0.85rem;
  text-align: left;
  vertical-align: middle;
}
.surface-table th {
  color: var(--muted);
  font: 800 0.74rem var(--f-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.surface-kpi {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.35rem;
  padding: 1rem;
}
.surface-kpi span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}
.surface-kpi strong {
  color: var(--ink);
  font: 850 1.7rem/1 var(--f-sans);
}
.surface-section-title {
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 850;
  letter-spacing: 0;
  margin: 0 0 0.85rem;
}
.account-console {
  min-width: 0;
}
.profile-console {
  gap: 1.35rem;
}
.profile-settings-layout {
  align-items: start;
  display: grid;
  gap: 1.75rem;
  grid-template-columns: minmax(12rem, 13.75rem) minmax(0, 1fr);
  min-width: 0;
}
.profile-settings-nav {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
  position: sticky;
  top: 1rem;
}
.profile-settings-nav a {
  border: 1px solid transparent;
  border-radius: 0.65rem;
  color: var(--muted);
  display: block;
  font-size: 0.88rem;
  font-weight: 800;
  line-height: 1.25;
  min-height: 2.45rem;
  padding: 0.62rem 0.78rem;
}
.profile-settings-nav a.active,
.profile-settings-nav a:focus-visible,
.profile-settings-nav a:hover {
  background: var(--paper);
  border-color: var(--line);
  box-shadow: var(--sh-sm);
  color: var(--ink);
}
.profile-card-stack {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.profile-settings-card {
  scroll-margin-top: 1rem;
}
.profile-avatar-row {
  align-items: center;
  display: grid;
  gap: 1.1rem;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-width: 0;
}
.profile-avatar {
  border-radius: 999px;
  font-size: 1.45rem;
  height: 5rem;
  width: 5rem;
}
.profile-avatar-copy {
  display: grid;
  gap: 0.28rem;
  min-width: 0;
}
.profile-avatar-copy span,
.profile-input-field span {
  color: var(--muted);
  font: 800 0.72rem var(--f-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.profile-avatar-copy strong {
  color: var(--ink);
  font: 900 1.38rem/1.12 var(--f-sans);
  overflow-wrap: anywhere;
}
.profile-avatar-copy small,
.profile-security-row p,
.profile-input-field small {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 650;
  line-height: 1.45;
  margin: 0;
  overflow-wrap: anywhere;
}
.profile-input-grid {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
}
.profile-input-field {
  color: var(--ink);
  display: grid;
  gap: 0.42rem;
  min-width: 0;
}
.profile-input-field input,
.profile-input-field select,
.profile-input-field textarea {
  width: 100%;
}
.profile-summary-grid,
.profile-locale-summary {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-width: 0;
  padding: 1rem;
}
.profile-locale-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.profile-security-row {
  align-items: start;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(12rem, 0.34fr) minmax(0, 1fr);
  min-width: 0;
  padding-top: 1rem;
}
.profile-security-row:first-child {
  border-top: 0;
  padding-top: 0;
}
.profile-security-row > div:first-child {
  display: grid;
  gap: 0.42rem;
  min-width: 0;
}
.profile-inline-controls {
  align-items: end;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  min-width: 0;
}
.account-avatar {
  align-items: center;
  background: linear-gradient(135deg, var(--ink), var(--violet-600) 55%, var(--rose));
  border-radius: var(--r-md);
  color: var(--paper);
  display: inline-flex;
  font: 900 1.05rem/1 var(--f-sans);
  height: 3.7rem;
  justify-content: center;
  width: 3.7rem;
}
.account-progress-head span,
.account-metric-item span,
.account-context-item span {
  color: var(--muted);
  font: 800 0.72rem var(--f-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.account-badge-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.account-profile-progress {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
}
.account-progress-head {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.account-progress-head strong {
  color: var(--ink);
  font-size: 0.95rem;
  font-weight: 850;
}
.account-progress-line {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  height: 0.62rem;
  overflow: hidden;
}
.account-progress-line span {
  background: linear-gradient(90deg, var(--mint-2), var(--violet-500), var(--rose));
  display: block;
  height: 100%;
  min-width: 0.45rem;
}
.account-metric-grid {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding-top: 1rem;
}
.account-metric-item {
  display: grid;
  gap: 0.32rem;
  min-width: 0;
}
.account-metric-item svg,
.account-context-item > svg,
.account-section-heading svg {
  color: var(--violet-600);
}
.account-metric-item strong,
.account-context-item strong {
  color: var(--ink);
  font-size: 0.92rem;
  font-weight: 850;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.account-context-item {
  align-items: flex-start;
  display: grid;
  gap: 0.7rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
  padding: 1rem;
}
.account-context-item > div {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.account-form,
.account-security-stack,
.account-preferences-form {
  display: grid;
  gap: 1.35rem;
  min-width: 0;
}
.account-section-heading {
  align-items: center;
  display: flex;
  gap: 0.55rem;
  min-width: 0;
}
.account-section-heading h3 {
  color: var(--ink);
  font-size: 0.98rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.2;
  margin: 0;
}
.account-form-grid {
  align-items: start;
}
.account-settings-table {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  min-width: 0;
  overflow: hidden;
}
.account-settings-table > * + * {
  border-top: 1px solid var(--line);
}
.account-field-row {
  align-items: center;
  color: var(--ink);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(10rem, 0.34fr) minmax(0, 1fr);
  min-width: 0;
  padding: 1rem;
}
.account-field-label {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
}
.account-field-label strong {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 850;
  line-height: 1.25;
}
.account-field-control {
  min-width: 0;
}
.account-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: flex-end;
  min-width: 0;
}
.account-preferences-form button {
  width: fit-content;
}
.account-toggle-row {
  align-items: center;
  border: 0;
  border-radius: 0;
  cursor: pointer;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
  padding: 1rem;
}
.account-toggle-row input {
  accent-color: var(--violet-600);
  flex: 0 0 auto;
  height: 1.05rem;
  margin: 0;
  min-height: 0;
  width: 1.05rem;
}
.account-toggle-row > span {
  display: grid;
  gap: 0.28rem;
  min-width: 0;
}
.account-toggle-row strong {
  align-items: center;
  color: var(--ink);
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  font-size: 0.92rem;
  font-weight: 850;
  line-height: 1.25;
}
.account-toggle-row strong svg {
  color: var(--violet-600);
  flex: 0 0 auto;
}
.account-toggle-row small {
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.45;
}
@media (max-width: 1100px) {
  .profile-settings-layout {
    grid-template-columns: 1fr;
  }
  .profile-settings-nav {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    position: static;
  }
  .profile-settings-nav a {
    flex: 1 1 10rem;
    text-align: center;
  }
}
@media (max-width: 760px) {
  .account-metric-grid,
  .account-field-row,
  .profile-avatar-row,
  .profile-input-grid,
  .profile-summary-grid,
  .profile-locale-summary,
  .profile-security-row,
  .profile-inline-controls {
    grid-template-columns: 1fr;
  }
  .profile-avatar-row .account-badge-row {
    justify-content: flex-start;
  }
  .account-form-actions,
  .account-preferences-form button {
    justify-content: stretch;
    width: 100%;
  }
}
.provider-language-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.9rem;
  min-width: 0;
  padding: 1rem;
}
.provider-language-card-head {
  align-items: baseline;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  min-width: 0;
  padding-bottom: 0.8rem;
}
.provider-language-card-head strong {
  color: var(--ink);
  font-size: 1.08rem;
  font-weight: 900;
  min-width: 0;
  overflow-wrap: anywhere;
}
.provider-language-card-head span {
  color: var(--muted);
  flex: 0 0 auto;
  font-size: 0.86rem;
  font-weight: 750;
}
.provider-language-capabilities {
  display: grid;
  gap: 0.75rem;
}
.provider-language-capability-row {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(8.5rem, 11rem) minmax(0, 1fr);
  min-width: 0;
}
.provider-language-capability-label {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.provider-language-capability-label strong {
  color: var(--ink);
  font-weight: 900;
  line-height: 1.2;
}
.provider-language-capability-label span,
.provider-language-chip-group > span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}
.provider-language-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  min-width: 0;
}
.provider-language-pair-groups {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
}
.provider-language-chip-group {
  align-items: start;
  display: grid;
  gap: 0.65rem;
  grid-template-columns: 4.5rem minmax(0, 1fr);
  min-width: 0;
}
.provider-language-editor-form {
  align-items: end;
}
.surface-form-wide {
  grid-column: 1 / -1;
}
.provider-language-row-editor {
  grid-column: 1 / -1;
  min-width: 0;
}
.provider-language-row-editor summary {
  color: var(--ink);
  cursor: pointer;
  font-size: 0.88rem;
  font-weight: 850;
}
.provider-language-edit-list {
  display: grid;
  gap: 0.75rem;
  margin-top: 0.75rem;
}
.provider-language-edit-item {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.6rem;
  min-width: 0;
  padding: 0.75rem;
}
.provider-language-edit-form {
  align-items: end;
  display: grid;
  gap: 0.65rem;
  grid-template-columns: minmax(4rem, 5rem) repeat(4, minmax(7rem, 1fr)) auto;
  min-width: 0;
}
.provider-language-edit-form strong {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}
.provider-language-edit-notes {
  grid-column: 2 / -2;
}
.provider-language-delete-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: flex-end;
}
.provider-language-delete-form label {
  align-items: center;
  display: inline-flex;
  flex-direction: row;
  gap: 0.4rem;
}
@media (max-width: 760px) {
  .provider-language-card-head,
  .provider-language-capability-row,
  .provider-language-chip-group,
  .provider-language-edit-form {
    grid-template-columns: 1fr;
  }
  .provider-language-card-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .provider-language-edit-notes {
    grid-column: auto;
  }
}
.usage-page {
  min-width: 0;
}
.usage-period-layout {
  align-items: stretch;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.65fr);
}
.usage-summary-panel,
.usage-period-panel,
.usage-activity-panel {
  min-width: 0;
}
.usage-summary-body,
.usage-service-list,
.usage-language-list,
.usage-activity-list {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.usage-period-metrics {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}
.usage-period-metrics div {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.3rem;
  min-width: 0;
  padding-top: 0.8rem;
}
.usage-period-metrics dt,
.usage-period-metrics span,
.usage-meter-label span,
.usage-period-nav span,
.usage-period-nav small,
.usage-activity-title span,
.usage-activity-title p,
.usage-activity-credit span,
.usage-activity-credit small,
.usage-activity-meta dt,
.usage-charge-head,
.usage-charge-main span,
.usage-charge-reason,
.usage-service-main span,
.usage-service-credit span,
.usage-language-row span {
  color: var(--muted);
}
.usage-period-metrics dt,
.usage-meter-label,
.usage-period-nav span,
.usage-activity-credit span,
.usage-activity-credit small,
.usage-activity-meta dt,
.usage-charge-head,
.usage-service-credit span {
  font: 800 0.74rem var(--f-mono);
  letter-spacing: 0;
  text-transform: uppercase;
}
.usage-period-metrics dd {
  color: var(--ink);
  font: 850 1.7rem / 1.1 var(--f-sans);
  margin: 0;
  overflow-wrap: anywhere;
}
.usage-period-metrics span,
.usage-period-nav small,
.usage-activity-title p,
.usage-charge-main span,
.usage-charge-reason {
  line-height: 1.45;
}
.usage-empty-state {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  padding-top: 0.95rem;
}
.usage-empty-state strong {
  color: var(--ink);
}
.usage-empty-state p {
  color: var(--muted);
  margin: 0;
  max-width: 38rem;
}
.usage-summary-progress-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
}
.usage-meter-block {
  display: grid;
  gap: 0.65rem;
  min-width: 0;
}
.usage-meter-label {
  align-items: center;
  display: flex;
  gap: 0.85rem;
  justify-content: space-between;
}
.usage-meter-label strong {
  color: var(--ink);
  font-size: 0.82rem;
}
.usage-period-empty {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.3rem;
  padding-top: 1rem;
}
.usage-period-empty strong {
  color: var(--ink);
}
.usage-period-empty span {
  color: var(--muted);
}
.usage-period-nav {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  overflow: hidden;
}
.usage-period-nav a {
  display: grid;
  gap: 0.25rem;
  min-height: 4.4rem;
  padding: 0.85rem 0.95rem;
  text-decoration: none;
  touch-action: manipulation;
}
.usage-period-nav a + a {
  border-top: 1px solid var(--line);
}
.usage-period-nav a:hover,
.usage-period-nav a:focus-visible {
  background: var(--paper-soft);
  outline: none;
}
.usage-period-nav a.active {
  background: var(--violet-50);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--violet-50) 68%, white);
  }
  box-shadow: inset 3px 0 0 var(--violet-600);
}
.usage-period-nav strong {
  color: var(--ink);
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.usage-progress-track,
.usage-mini-track {
  background: var(--line);
  border-radius: 999px;
  overflow: hidden;
}
.usage-progress-track {
  height: 0.7rem;
}
.usage-mini-track {
  height: 0.42rem;
}
.usage-progress-fill,
.usage-mini-track span {
  border-radius: inherit;
  display: block;
  height: 100%;
  width: var(--usage-progress, 0%);
}
.usage-progress-fill {
  background: var(--g-brand);
}
.usage-progress-fill.success {
  background: var(--g-mint);
}
.usage-progress-fill.warning {
  background: linear-gradient(135deg, var(--amber), var(--rose));
}
.usage-progress-fill.danger {
  background: linear-gradient(135deg, var(--rose), var(--violet-700));
}
.usage-progress-fill.neutral {
  background: var(--line-2);
}
.usage-progress-fill.connected,
.usage-mini-track span {
  background: var(--g-mint);
}
.usage-activity-list {
  border-top: 1px solid var(--line);
  padding-top: 0.2rem;
}
.usage-activity-item {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding: 1rem;
}
.usage-activity-disclosure {
  gap: 0;
}
.usage-activity-disclosure[open] {
  border-color: rgba(110, 60, 255, 0.24);
  box-shadow: inset 0 0 0 1px rgba(110, 60, 255, 0.08);
}
.usage-activity-head {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(6rem, auto);
}
.usage-activity-summary {
  cursor: pointer;
  list-style: none;
  outline: 0;
  touch-action: manipulation;
}
.usage-activity-summary::-webkit-details-marker {
  display: none;
}
.usage-activity-summary:focus-visible {
  border-radius: var(--r-sm);
  box-shadow: 0 0 0 3px rgba(110, 60, 255, 0.2);
}
.usage-activity-summary-main {
  display: grid;
  gap: 0.9rem;
  min-width: 0;
}
.usage-activity-summary-side {
  align-items: center;
  display: grid;
  gap: 0.8rem;
  grid-template-columns: minmax(0, 1fr) auto;
  justify-items: end;
}
.usage-activity-title {
  align-items: start;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
}
.usage-activity-title h2 {
  color: var(--ink);
  font-size: 1.05rem;
  line-height: 1.25;
  margin: 0.15rem 0 0;
  overflow-wrap: anywhere;
}
.usage-activity-title p {
  margin: 0.3rem 0 0;
}
.usage-activity-credit {
  display: grid;
  justify-items: end;
  line-height: 1.1;
  min-width: 6rem;
}
.usage-activity-credit strong {
  color: var(--ink);
  font-size: 1.55rem;
  line-height: 1;
}
.usage-activity-toggle {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex;
  height: 2rem;
  justify-content: center;
  width: 2rem;
}
.usage-activity-toggle::before {
  border-bottom: 2px solid var(--ink-soft);
  border-right: 2px solid var(--ink-soft);
  content: "";
  display: block;
  height: 0.42rem;
  transform: translateY(-0.1rem) rotate(45deg);
  transition: transform 160ms ease;
  width: 0.42rem;
}
.usage-activity-disclosure[open] .usage-activity-toggle::before {
  transform: translateY(0.1rem) rotate(225deg);
}
.usage-activity-meta {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.8rem;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr) minmax(5rem, auto);
  margin: 0;
  padding-top: 0.9rem;
}
.usage-activity-summary-meta {
  border-bottom: 0;
  margin: 0;
}
.usage-activity-detail-panel {
  border-top: 1px solid var(--line);
  margin-top: 1rem;
  padding-top: 1rem;
}
.usage-activity-meta div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.usage-activity-meta dd {
  color: var(--ink);
  font-weight: 800;
  margin: 0;
  overflow-wrap: anywhere;
}
.usage-charge-list {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  min-width: 0;
  overflow: hidden;
}
.usage-charge-head,
.usage-charge-row {
  align-items: center;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(11rem, 0.8fr) minmax(0, 1fr) minmax(4.8rem, auto);
  min-width: 0;
}
.usage-charge-head {
  background: var(--paper-soft);
  padding: 0.65rem 0.85rem;
}
.usage-charge-row {
  border-top: 1px solid var(--line);
  padding: 0.85rem;
}
.usage-charge-main {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.usage-charge-main strong,
.usage-charge-credit,
.usage-service-main strong,
.usage-language-row strong {
  color: var(--ink);
}
.usage-charge-main strong,
.usage-charge-main span,
.usage-charge-reason {
  overflow-wrap: anywhere;
}
.usage-charge-credit {
  justify-self: end;
}
.usage-breakdown-layout {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.42fr);
}
.usage-service-row {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) auto;
  padding-bottom: 1rem;
}
.usage-service-row:last-child,
.usage-language-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.usage-service-main {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}
.usage-service-credit {
  display: grid;
  justify-items: end;
  line-height: 1.2;
  min-width: 5.5rem;
}
.usage-service-credit strong {
  color: var(--ink);
  font-size: 1.2rem;
}
.usage-language-row {
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 0.65rem;
  padding-bottom: 0.9rem;
}
.usage-language-row > div:first-child {
  align-items: baseline;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  min-width: 0;
}
@media (max-width: 1100px) {
  .usage-period-layout,
  .usage-breakdown-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .usage-period-metrics,
  .usage-summary-progress-grid,
  .usage-activity-head,
  .usage-activity-summary-side,
  .usage-activity-title,
  .usage-activity-meta {
    grid-template-columns: 1fr;
  }
  .usage-meter-label,
  .usage-language-row > div:first-child {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.3rem;
  }
  .usage-activity-credit {
    justify-items: start;
  }
  .usage-activity-summary-side {
    justify-items: start;
  }
  .usage-charge-head {
    display: none;
  }
  .usage-charge-row {
    align-items: stretch;
    gap: 0.65rem;
    grid-template-columns: 1fr;
  }
  .usage-charge-main,
  .usage-charge-reason,
  .usage-charge-credit {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    justify-self: stretch;
  }
  .usage-charge-main::before,
  .usage-charge-reason::before,
  .usage-charge-credit::before {
    color: var(--muted);
    content: attr(data-label);
    font: 800 0.74rem var(--f-mono);
    letter-spacing: 0;
    text-transform: uppercase;
  }
  .usage-charge-main {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.3rem;
  }
}
.voices-page {
  min-width: 0;
}
.voices-overview {
  align-items: stretch;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.1fr) minmax(19rem, 0.9fr);
}
.voices-readiness-panel,
.voices-library-panel {
  min-width: 0;
}
.voices-readiness-body,
.voices-readiness-main,
.voices-progress-block,
.voices-list,
.voices-form-stack,
.voices-form {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.voices-readiness-main {
  gap: 0.45rem;
}
.voices-readiness-main > span,
.voices-progress-label,
.voices-summary-grid dt,
.voices-card-meta dt,
.voices-card-main span,
.voices-empty-state p,
.voices-field span,
.voices-check small {
  color: var(--muted);
}
.voices-readiness-main > span,
.voices-progress-label,
.voices-summary-grid dt,
.voices-card-meta dt,
.voices-field span {
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.voices-readiness-main strong {
  color: var(--ink);
  font: 850 clamp(2.25rem, 5vw, 4.2rem) / 0.95 var(--f-sans);
}
.voices-readiness-main p,
.voices-empty-state p {
  margin: 0;
}
.voices-progress-label {
  align-items: center;
  display: flex;
  gap: 0.85rem;
  justify-content: space-between;
}
.voices-progress-label strong {
  color: var(--ink);
  font-size: 0.82rem;
}
.voices-progress-track {
  background: var(--line);
  border-radius: 999px;
  height: 0.7rem;
  overflow: hidden;
}
.voices-progress-track span {
  background: var(--g-mint);
  border-radius: inherit;
  display: block;
  height: 100%;
  width: var(--voices-progress, 0%);
}
.voices-summary-grid {
  display: grid;
  gap: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}
.voices-summary-grid div {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.9rem 0.85rem 0 0;
}
.voices-summary-grid dd {
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 850;
  margin: 0;
  overflow-wrap: anywhere;
}
.voices-workspace {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(21rem, 0.42fr);
}
.voices-empty-state {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  padding-top: 0.95rem;
}
.voices-empty-state strong {
  color: var(--ink);
}
.voices-list {
  gap: 0.9rem;
}
.voices-card {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-2);
  border-radius: var(--r-sm);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
  padding: 1rem;
}
.voices-card.ready {
  border-left-color: var(--mint-2);
}
.voices-card.training {
  border-left-color: var(--amber);
}
.voices-card.failed {
  border-left-color: var(--rose);
}
.voices-card-main {
  align-items: center;
  display: flex;
  gap: 0.85rem;
  min-width: 0;
}
.voices-avatar {
  align-items: center;
  background: var(--g-brand);
  border-radius: var(--r-sm);
  color: #fff;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 0.86rem;
  font-weight: 900;
  height: 2.55rem;
  justify-content: center;
  width: 2.55rem;
}
.voices-card-main > div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.voices-card-main strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.voices-card-main span {
  overflow-wrap: anywhere;
}
.voices-card-meta {
  display: grid;
  gap: 0.75rem;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  min-width: 0;
}
.voices-card-meta div {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
}
.voices-card-meta dd {
  color: var(--ink);
  font-size: 0.92rem;
  font-weight: 800;
  margin: 0;
  overflow-wrap: anywhere;
}
.voices-card-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  justify-content: flex-end;
}
.voices-list-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  justify-content: flex-end;
}
.voices-provider-coverage {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  grid-column: 1 / -1;
}
.voices-provider-chip {
  background: #f5f7fb;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  max-width: 100%;
  overflow-wrap: anywhere;
  padding: 0.35rem 0.55rem;
}
.voices-provider-chip.ready {
  background: rgba(0, 184, 158, 0.1);
  border-color: rgba(0, 184, 158, 0.25);
  color: #047766;
}
.voices-provider-chip.failed,
.voices-provider-chip.requires_resample {
  background: rgba(255, 90, 95, 0.08);
  border-color: rgba(255, 90, 95, 0.22);
  color: #9e2930;
}
.voices-form-stack {
  gap: 1.25rem;
}
.voices-form-grid {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.voices-field {
  display: grid;
  gap: 0.45rem;
  min-width: 0;
}
.voices-field input {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  font: 600 0.95rem var(--f-sans);
  min-height: 2.75rem;
  min-width: 0;
  padding: 0.75rem 0.85rem;
  width: 100%;
}
.voices-field input[type="file"] {
  color: var(--muted);
  font-weight: 700;
}
.voices-field input:focus {
  border-color: var(--violet-300);
  box-shadow: 0 0 0 3px rgba(110, 60, 255, 0.12);
  outline: 0;
}
.voices-check {
  align-items: start;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: auto minmax(0, 1fr);
  padding: 0.85rem;
}
.voices-check input {
  margin-top: 0.25rem;
}
.voices-check span {
  display: grid;
  gap: 0.2rem;
}
.voices-check strong {
  color: var(--ink);
}
.voices-check small {
  font-size: 0.82rem;
  line-height: 1.45;
}
.voices-form button,
.voices-card-actions button {
  width: 100%;
}
@media (max-width: 1100px) {
  .voices-overview,
  .voices-workspace {
    grid-template-columns: 1fr;
  }
  .voices-form-stack {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .voices-form-stack,
  .voices-form-grid,
  .voices-summary-grid,
  .voices-card,
  .voices-card-meta {
    grid-template-columns: 1fr;
  }
  .voices-progress-label {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.3rem;
  }
  .voices-card {
    align-items: stretch;
  }
  .voices-card-actions {
    align-items: stretch;
    justify-content: stretch;
  }
  .voices-list-actions {
    align-items: stretch;
    justify-content: stretch;
  }
}
.archive-page {
  min-width: 0;
}
.archive-link-button,
.archive-action,
.archive-inline-link {
  align-items: center;
  border-radius: var(--r-sm);
  display: inline-flex;
  font-weight: 850;
  justify-content: center;
  text-decoration: none;
}
.archive-link-button,
.archive-action {
  min-height: 2.75rem;
  padding: 0.75rem 1rem;
}
.archive-link-button,
.archive-action {
  background: var(--paper);
  border: 1px solid var(--line-2);
  color: var(--ink);
}
.archive-action.primary {
  background: var(--g-brand);
  border-color: transparent;
  box-shadow: var(--sh-glow);
  color: #fff;
}
.archive-inline-link {
  color: var(--violet-700);
  min-height: 2.2rem;
}
.archive-quick-actions {
  display: flex;
  justify-content: flex-end;
}
.archive-overview {
  align-items: stretch;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.15fr) minmax(19rem, 0.85fr);
}
.archive-status-panel,
.archive-projects-panel {
  min-width: 0;
}
.archive-status-body,
.archive-status-headline,
.archive-latest-project,
.archive-project-list,
.archive-side-stack,
.archive-session-list,
.archive-snapshot-list {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.archive-status-headline {
  gap: 0.45rem;
}
.archive-status-headline > span,
.archive-stat-grid dt,
.archive-row-metrics dt,
.archive-session-metrics dt,
.archive-empty-state p,
.archive-row-main span,
.archive-latest-project span,
.archive-snapshot-row span {
  color: var(--muted);
}
.archive-status-headline > span,
.archive-stat-grid dt,
.archive-row-metrics dt,
.archive-session-metrics dt {
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.archive-status-headline strong {
  color: var(--ink);
  font: 850 clamp(2.25rem, 5vw, 4.2rem) / 0.95 var(--f-sans);
}
.archive-status-headline p,
.archive-empty-state p {
  margin: 0;
}
.archive-stat-grid {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  padding-top: 1rem;
}
.archive-stat-grid div,
.archive-row-metrics div,
.archive-session-metrics div {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}
.archive-stat-grid div {
  padding-right: 1rem;
}
.archive-stat-grid dd,
.archive-row-metrics dd,
.archive-session-metrics dd {
  color: var(--ink);
  font-weight: 850;
  margin: 0;
  overflow-wrap: anywhere;
}
.archive-stat-grid dd {
  font-size: 1.05rem;
}
.archive-latest-project {
  align-items: start;
  grid-template-columns: 1fr;
}
.archive-latest-project > div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.archive-latest-project strong,
.archive-row-main strong,
.archive-snapshot-row strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.archive-content-layout {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(22rem, 0.45fr);
}
.archive-project-row,
.archive-session-row,
.archive-snapshot-row {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding-top: 1rem;
}
.archive-project-row {
  align-items: center;
  grid-template-columns: minmax(0, 1fr) minmax(15rem, 0.65fr) minmax(9rem, auto);
}
.archive-row-main {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.archive-row-metrics {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(6rem, 1fr) repeat(2, minmax(3rem, 0.45fr));
  margin: 0;
  min-width: 0;
}
.archive-row-actions {
  display: grid;
  gap: 0.5rem;
}
.archive-session-row {
  gap: 0.85rem;
}
.archive-session-metrics {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  padding: 0.8rem;
}
.archive-session-footer {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: space-between;
}
.archive-snapshot-row {
  gap: 0.25rem;
}
.archive-snapshot-row span {
  font: 700 0.78rem var(--f-mono);
  overflow-wrap: anywhere;
}
.archive-empty-state {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  padding-top: 0.95rem;
}
.archive-empty-state strong {
  color: var(--ink);
}
@media (max-width: 1100px) {
  .archive-overview,
  .archive-content-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .archive-quick-actions {
    justify-content: stretch;
  }
  .archive-quick-actions .archive-link-button {
    width: 100%;
  }
  .archive-stat-grid,
  .archive-latest-project,
  .archive-project-row,
  .archive-row-metrics,
  .archive-session-metrics {
    grid-template-columns: 1fr;
  }
  .archive-row-actions {
    grid-template-columns: 1fr;
  }
  .archive-session-footer {
    align-items: stretch;
    flex-direction: column;
  }
}
.admin-usage-page,
.billing-admin-page {
  min-width: 0;
}
.admin-usage-filter-form,
.admin-usage-kpi-grid,
.admin-usage-main-layout,
.admin-usage-breakdown-grid,
.admin-usage-provider-grid,
.admin-usage-operation-list,
.admin-usage-anomaly-list {
  min-width: 0;
}
.admin-usage-checkbox {
  align-items: center;
  color: var(--ink);
  display: flex;
  font-weight: 800;
  gap: 0.55rem;
  min-height: 2.7rem;
}
.admin-usage-checkbox input {
  accent-color: var(--violet-600);
  height: 1rem;
  width: 1rem;
}
.admin-usage-filter-action {
  align-self: end;
}
.admin-usage-kpi-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.admin-usage-kpi-grid span,
.admin-usage-operation-title span,
.admin-usage-operation-credit span,
.admin-usage-operation-meta dt,
.admin-usage-operation-details summary,
.admin-usage-charge-row span,
.admin-usage-anomaly-row span,
.admin-usage-anomaly-row small,
.admin-usage-row span {
  color: var(--muted);
}
.admin-usage-kpi-grid span,
.admin-usage-operation-credit span,
.admin-usage-operation-meta dt,
.admin-usage-operation-details summary {
  font: 800 0.74rem var(--f-mono);
  letter-spacing: 0;
  text-transform: uppercase;
}
.admin-usage-main-layout {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.65fr);
}
.admin-usage-breakdown-grid,
.admin-usage-provider-grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-usage-operation-list,
.admin-usage-anomaly-list {
  display: grid;
  gap: 0.85rem;
}
.admin-usage-operation-row,
.admin-usage-anomaly-row {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.9rem;
  min-width: 0;
  padding: 1rem;
}
.admin-usage-anomaly-row {
  background: var(--amber);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--amber) 8%, var(--paper));
  }
}
.admin-usage-anomaly-row.warning {
  background: var(--rose);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--rose) 8%, var(--paper));
  }
}
.admin-usage-operation-head {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(5.5rem, auto);
}
.admin-usage-operation-title,
.admin-usage-anomaly-row div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.admin-usage-operation-title strong,
.admin-usage-anomaly-row strong,
.admin-usage-charge-row strong,
.admin-usage-row strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.admin-usage-operation-title span,
.admin-usage-anomaly-row span,
.admin-usage-anomaly-row p,
.admin-usage-anomaly-row small,
.admin-usage-charge-row span,
.admin-usage-row span {
  overflow-wrap: anywhere;
}
.admin-usage-operation-credit {
  display: grid;
  justify-items: end;
  line-height: 1.1;
  min-width: 5.5rem;
}
.admin-usage-operation-credit strong {
  color: var(--ink);
  font-size: 1.45rem;
  line-height: 1;
}
.admin-usage-operation-meta {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  padding-top: 0.8rem;
}
.admin-usage-operation-meta div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.admin-usage-operation-meta dd {
  color: var(--ink);
  font-weight: 800;
  margin: 0;
  overflow-wrap: anywhere;
}
.admin-usage-operation-details {
  border-top: 1px solid var(--line);
  padding-top: 0.75rem;
}
.admin-usage-operation-details summary {
  cursor: pointer;
  width: fit-content;
}
.admin-usage-charge-list {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  margin-top: 0.75rem;
  overflow: hidden;
}
.admin-usage-charge-row {
  align-items: center;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(0, 1fr) minmax(4rem, auto) minmax(5rem, auto);
  min-width: 0;
  padding: 0.75rem 0.85rem;
}
.admin-usage-charge-row + .admin-usage-charge-row {
  border-top: 1px solid var(--line);
}
.admin-usage-charge-row > div {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.admin-usage-charge-row > strong {
  justify-self: end;
}
.admin-usage-anomaly-row p {
  color: var(--ink);
  font-weight: 800;
  margin: 0;
}
.admin-usage-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(5rem, auto);
}
.admin-usage-row a {
  color: inherit;
  text-decoration: none;
}
@media (max-width: 1180px) {
  .admin-usage-kpi-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .admin-usage-main-layout,
  .admin-usage-breakdown-grid,
  .admin-usage-provider-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .admin-usage-kpi-grid,
  .admin-usage-operation-head,
  .admin-usage-operation-meta,
  .admin-usage-charge-row,
  .admin-usage-row {
    grid-template-columns: 1fr;
  }
  .admin-usage-operation-credit,
  .admin-usage-charge-row > strong {
    justify-items: start;
    justify-self: start;
  }
}
.billing-admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: flex-end;
}
.billing-admin-link-button {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-weight: 850;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.75rem 1rem;
  text-decoration: none;
}
.billing-admin-overview,
.billing-admin-insights {
  align-items: stretch;
  display: grid;
  gap: 1.25rem;
}
.billing-admin-overview {
  grid-template-columns: minmax(0, 1.15fr) minmax(19rem, 0.85fr);
}
.billing-admin-insights {
  grid-template-columns: minmax(18rem, 0.45fr) minmax(0, 1fr);
}
.billing-admin-revenue-panel {
  min-width: 0;
}
.billing-admin-revenue-body,
.billing-admin-headline,
.billing-admin-plan-list,
.billing-admin-tenant-list,
.billing-admin-controls,
.billing-admin-form-list {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.billing-admin-headline {
  gap: 0.45rem;
}
.billing-admin-headline > span,
.billing-admin-stat-grid dt,
.billing-admin-catalog-grid dt,
.billing-admin-tenant-row dt,
.billing-admin-form-title span,
.billing-admin-user-head,
.billing-admin-empty-state p,
.billing-admin-row-main span {
  color: var(--muted);
}
.billing-admin-headline > span,
.billing-admin-stat-grid dt,
.billing-admin-catalog-grid dt,
.billing-admin-tenant-row dt,
.billing-admin-user-head,
.billing-admin-form-title span {
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.billing-admin-headline strong {
  color: var(--ink);
  font: 850 clamp(2.25rem, 5vw, 4.2rem) / 0.95 var(--f-sans);
  overflow-wrap: anywhere;
}
.billing-admin-headline p,
.billing-admin-empty-state p {
  margin: 0;
}
.billing-admin-stat-grid,
.billing-admin-catalog-grid {
  display: grid;
  gap: 0;
  margin: 0;
}
.billing-admin-stat-grid {
  border-top: 1px solid var(--line);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-top: 1rem;
}
.billing-admin-catalog-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.billing-admin-stat-grid div,
.billing-admin-catalog-grid div {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.9rem 1rem 0 0;
}
.billing-admin-stat-grid div {
  border-top: 0;
  padding-top: 0;
}
.billing-admin-stat-grid dd,
.billing-admin-catalog-grid dd,
.billing-admin-tenant-row dd {
  color: var(--ink);
  font-weight: 850;
  margin: 0;
  overflow-wrap: anywhere;
}
.billing-admin-stat-grid dd,
.billing-admin-catalog-grid dd {
  font-size: 1.05rem;
}
.billing-admin-plan-row {
  align-items: center;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
  padding-top: 0.9rem;
}
.billing-admin-plan-row > div {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  min-width: 0;
}
.billing-admin-plan-row strong,
.billing-admin-row-main strong,
.billing-admin-form-title strong,
.billing-admin-empty-state strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.billing-admin-plan-row > span {
  color: var(--ink);
  font-size: 1.25rem;
  font-weight: 850;
}
.billing-admin-tenant-row {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.8fr);
  min-width: 0;
  padding-top: 1rem;
}
.billing-admin-row-main {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.billing-admin-tenant-row dl {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  min-width: 0;
  padding: 0.8rem;
}
.billing-admin-tenant-row dl div {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}
.billing-admin-empty-state {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  padding-top: 0.95rem;
}
.billing-admin-user-table {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  overflow: hidden;
}
.billing-admin-provider-table {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  overflow: hidden;
}
.billing-admin-panel-actions {
  align-items: center;
  display: flex;
  justify-content: flex-end;
  margin-bottom: 0.85rem;
}
.billing-admin-inline-form {
  display: flex;
  justify-content: flex-end;
}
.billing-admin-user-head,
.billing-admin-user-row {
  align-items: center;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(12rem, 1fr) minmax(16rem, 1fr) minmax(6rem, auto);
  min-width: 0;
}
.billing-admin-provider-head,
.billing-admin-provider-row {
  align-items: center;
  display: grid;
  gap: 0.9rem;
  grid-template-columns: minmax(8.5rem, 0.8fr)
    minmax(10rem, 1fr)
    minmax(7rem, 0.6fr)
    minmax(10rem, 1fr)
    minmax(9rem, 0.8fr)
    minmax(9rem, 0.8fr);
  min-width: 0;
}
.billing-admin-user-head {
  background: var(--paper-soft);
  padding: 0.75rem 1rem;
}
.billing-admin-provider-head {
  background: var(--paper-soft);
  padding: 0.75rem 1rem;
}
.billing-admin-user-row {
  border-top: 1px solid var(--line);
  padding: 0.9rem 1rem;
}
.billing-admin-provider-row {
  border-top: 1px solid var(--line);
  padding: 0.9rem 1rem;
}
.billing-admin-user-row strong,
.billing-admin-user-row span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.billing-admin-provider-row strong,
.billing-admin-provider-row span,
.billing-admin-provider-row code,
.billing-admin-provider-row small {
  min-width: 0;
  overflow-wrap: anywhere;
}
.billing-admin-user-row strong {
  color: var(--ink);
}
.billing-admin-provider-row strong {
  color: var(--ink);
}
.billing-admin-user-row span {
  color: var(--muted);
}
.billing-admin-provider-row span {
  color: var(--muted);
}
.billing-admin-provider-row code {
  color: var(--muted);
  font: 700 0.76rem var(--f-mono);
}
.billing-admin-provider-row small {
  color: var(--muted);
  display: block;
  font-size: 0.75rem;
  margin-top: 0.25rem;
}
.billing-admin-provider-table.invoice-evidence .billing-admin-provider-row strong {
  display: grid;
  gap: 0.15rem;
}
.billing-admin-form-list.compact {
  gap: 0.75rem;
}
.billing-admin-form-row {
  align-items: end;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding-top: 1rem;
}
.billing-admin-form-row.pricing {
  grid-template-columns: minmax(12rem, 1fr) minmax(25rem, auto);
}
.billing-admin-form-row.limit {
  grid-template-columns: minmax(12rem, 0.7fr) minmax(16rem, 1fr) minmax(14rem, auto);
}
.billing-admin-form-row.rate {
  grid-template-columns: minmax(10rem, 0.55fr) minmax(16rem, 1fr) minmax(23rem, auto);
}
.billing-admin-form-title {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}
.billing-admin-form-title.metric strong {
  font-size: 0.92rem;
}
.billing-admin-form-actions {
  align-items: end;
  display: grid;
  gap: 0.65rem;
  justify-self: end;
  min-width: 0;
  width: 100%;
}
.billing-admin-form-row.pricing .billing-admin-form-actions {
  grid-template-columns: minmax(7.5rem, 1fr) minmax(7.5rem, 1fr) auto;
}
.billing-admin-form-row.limit .billing-admin-form-actions {
  grid-template-columns: minmax(7.5rem, 1fr) auto;
}
.billing-admin-form-row.rate .billing-admin-form-actions {
  grid-template-columns: minmax(7.5rem, 1fr) minmax(7.5rem, 1fr) auto;
}
.billing-admin-form-actions > label {
  min-width: 0;
}
.billing-admin-form-actions input {
  font-size: 1rem !important;
  min-width: 0;
}
.billing-admin-form-row button {
  min-width: 5.5rem;
}
@media (max-width: 1100px) {
  .billing-admin-overview,
  .billing-admin-insights,
  .billing-admin-tenant-row {
    grid-template-columns: 1fr;
  }
  .billing-admin-form-row.pricing {
    grid-template-columns: minmax(10rem, 0.65fr) minmax(22rem, 1fr);
  }
  .billing-admin-form-row.limit,
  .billing-admin-form-row.rate {
    grid-template-columns: minmax(10rem, 0.8fr) minmax(14rem, 1fr);
  }
  .billing-admin-form-row.limit .billing-admin-form-actions,
  .billing-admin-form-row.rate .billing-admin-form-actions {
    grid-column: 1 / -1;
    justify-self: stretch;
  }
}
@media (max-width: 760px) {
  .billing-admin-actions {
    flex-direction: column;
  }
  .billing-admin-stat-grid,
  .billing-admin-catalog-grid,
  .billing-admin-tenant-row dl {
    grid-template-columns: 1fr;
  }
  .billing-admin-user-head,
  .billing-admin-provider-head {
    display: none;
  }
  .billing-admin-user-row,
  .billing-admin-provider-row {
    align-items: stretch;
    gap: 0.65rem;
    grid-template-columns: 1fr;
  }
  .billing-admin-user-row strong,
  .billing-admin-user-row span,
  .billing-admin-provider-row strong,
  .billing-admin-provider-row span,
  .billing-admin-provider-row code {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
  }
  .billing-admin-user-row strong::before,
  .billing-admin-user-row span::before,
  .billing-admin-provider-row strong::before,
  .billing-admin-provider-row span::before,
  .billing-admin-provider-row code::before {
    color: var(--muted);
    content: attr(data-label);
    flex: 0 0 6.5rem;
    font: 800 0.74rem var(--f-mono);
    text-transform: uppercase;
    white-space: nowrap;
  }
  .billing-admin-link-button {
    width: 100%;
  }
  .billing-admin-form-row.pricing {
    grid-template-columns: 1fr;
  }
  .billing-admin-form-row.limit,
  .billing-admin-form-row.rate {
    align-items: start;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  }
  .billing-admin-form-row.pricing .billing-admin-form-actions,
  .billing-admin-form-row.limit .billing-admin-form-actions,
  .billing-admin-form-row.rate .billing-admin-form-actions {
    grid-column: 1 / -1;
    justify-self: stretch;
  }
  .billing-admin-form-row.pricing .billing-admin-form-actions,
  .billing-admin-form-row.rate .billing-admin-form-actions {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  }
  .billing-admin-form-row.limit .billing-admin-form-actions {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .billing-admin-form-actions {
    gap: 0.5rem;
  }
  .billing-admin-form-row button {
    min-width: 4.25rem;
    padding-inline: 0.65rem !important;
  }
}
@media (max-width: 360px) {
  .billing-admin-form-row.pricing .billing-admin-form-actions,
  .billing-admin-form-row.rate .billing-admin-form-actions {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .billing-admin-form-row.pricing .billing-admin-form-actions button,
  .billing-admin-form-row.rate .billing-admin-form-actions button {
    grid-column: 1 / -1;
    width: 100%;
  }
}
.cost-calculator-page,
.cost-calculator-shell,
.cost-calculator-results {
  min-width: 0;
}
.cost-calculator-shell {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(19rem, 0.42fr) minmax(0, 1fr);
}
.cost-calculator-input-panel {
  position: sticky;
  top: 1rem;
}
.cost-calculator-segmented {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.35rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 0.35rem;
}
.cost-calculator-scenario-button,
.cost-calculator-toggle {
  align-items: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  font: 850 0.9rem var(--f-sans);
  gap: 0.45rem;
  justify-content: center;
  min-height: 2.45rem;
  padding: 0.6rem 0.75rem;
}
.cost-calculator-scenario-button[data-active="true"],
.cost-calculator-toggle[data-active="true"] {
  background: var(--paper);
  border-color: var(--line-2);
  color: var(--ink);
  box-shadow: var(--sh-sm);
}
.cost-calculator-field-grid {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
}
.cost-calculator-operation-stack {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.65rem;
  padding-top: 0.95rem;
}
.cost-calculator-operation-stack strong,
.cost-calculator-fieldset legend {
  color: var(--muted);
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.cost-calculator-operation-stack > div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.cost-calculator-operation-stack span {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-size: 0.86rem;
  font-weight: 850;
  line-height: 1.2;
  padding: 0.45rem 0.6rem;
}
.cost-calculator-fieldset {
  border: 0;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.9rem;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  min-width: 0;
  padding: 1rem 0 0;
}
.cost-calculator-fieldset legend {
  margin-bottom: 0.1rem;
  padding: 0;
}
.cost-calculator-field-grid label {
  min-width: 0;
}
.cost-calculator-toggle {
  background: var(--paper);
  border-color: var(--line-2);
  min-height: 2.75rem;
  width: 100%;
}
.cost-calculator-results {
  display: grid;
  gap: 1.25rem;
}
.cost-calculator-summary-stack,
.cost-calculator-summary-grid {
  display: grid;
  gap: 0.9rem;
  min-width: 0;
}
.cost-calculator-summary-grid[data-row="base"] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cost-calculator-summary-grid[data-row="totals"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.cost-calculator-summary-card {
  align-items: start;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.8rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
  padding: 1rem;
}
.cost-calculator-summary-card > span {
  align-items: center;
  background: var(--violet-600);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--violet-600) 10%, var(--paper));
  }
  border: 1px solid var(--violet-600);
  @supports (color: color-mix(in lab, red, red)) {
    border: 1px solid color-mix(in srgb, var(--violet-600) 22%, var(--line));
  }
  border-radius: var(--r-sm);
  color: var(--violet-700);
  display: inline-flex;
  height: 2.15rem;
  justify-content: center;
  width: 2.15rem;
}
.cost-calculator-summary-card div {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.cost-calculator-summary-card small,
.cost-calculator-metrics dt,
.cost-calculator-assumption-list dt,
.cost-calculator-breakdown-head,
.cost-calculator-breakdown-row > div span,
.cost-calculator-breakdown-row > span {
  color: var(--muted);
}
.cost-calculator-summary-card small,
.cost-calculator-metrics dt,
.cost-calculator-assumption-list dt,
.cost-calculator-breakdown-head {
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.cost-calculator-summary-card strong {
  color: var(--ink);
  font-size: 1.35rem;
  line-height: 1;
  overflow-wrap: anywhere;
}
.cost-calculator-summary-card[data-strong="true"] {
  background: var(--mint-2);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--mint-2) 10%, var(--paper));
  }
  border-color: var(--mint-2);
  @supports (color: color-mix(in lab, red, red)) {
    border-color: color-mix(in srgb, var(--mint-2) 28%, var(--line));
  }
}
.cost-calculator-summary-card[data-strong="true"] strong {
  font-size: 1.55rem;
}
.cost-calculator-metrics,
.cost-calculator-assumption-list {
  display: grid;
  gap: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
}
.cost-calculator-assumption-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cost-calculator-metrics div,
.cost-calculator-assumption-list div {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.9rem 0.85rem 0 0;
}
.cost-calculator-metrics dd,
.cost-calculator-assumption-list dd {
  color: var(--ink);
  font-weight: 850;
  margin: 0;
  overflow-wrap: anywhere;
}
.cost-calculator-breakdown {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  overflow: hidden;
}
.cost-calculator-breakdown-head,
.cost-calculator-breakdown-row {
  align-items: center;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(13rem, 1.4fr) minmax(9rem, 0.8fr) minmax(8rem, 0.7fr) minmax(7rem, 0.65fr) minmax(5rem, 0.45fr);
  min-width: 0;
}
.cost-calculator-breakdown-head {
  background: var(--paper-soft);
  padding: 0.75rem 1rem;
}
.cost-calculator-breakdown-row {
  border-top: 1px solid var(--line);
  padding: 0.9rem 1rem;
}
.cost-calculator-breakdown-row[data-warning="true"] {
  background: var(--amber);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in srgb, var(--amber) 8%, var(--paper));
  }
}
.cost-calculator-breakdown-row > div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.cost-calculator-breakdown-row > div strong,
.cost-calculator-breakdown-row > strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.cost-calculator-breakdown-row > div span,
.cost-calculator-breakdown-row > span {
  overflow-wrap: anywhere;
}
.cost-calculator-breakdown-row a {
  align-items: center;
  color: var(--violet-700);
  display: inline-flex;
  font-weight: 850;
  gap: 0.3rem;
  width: fit-content;
}
.cost-calculator-breakdown-row p {
  align-items: center;
  color: var(--amber);
  @supports (color: color-mix(in lab, red, red)) {
    color: color-mix(in srgb, var(--amber) 55%, var(--ink));
  }
  display: flex;
  font-weight: 800;
  gap: 0.4rem;
  grid-column: 1 / -1;
  margin: 0;
}
.cost-calculator-side-grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  min-width: 0;
}
.cost-calculator-warning-list {
  display: grid;
  gap: 0.75rem;
}
@media (max-width: 1180px) {
  .cost-calculator-shell {
    grid-template-columns: 1fr;
  }
  .cost-calculator-input-panel {
    position: static;
  }
  .cost-calculator-summary-grid[data-row="base"],
  .cost-calculator-summary-grid[data-row="totals"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 860px) {
  .cost-calculator-field-grid,
  .cost-calculator-fieldset,
  .cost-calculator-side-grid,
  .cost-calculator-metrics,
  .cost-calculator-assumption-list {
    grid-template-columns: 1fr;
  }
  .cost-calculator-breakdown-head {
    display: none;
  }
  .cost-calculator-breakdown-row {
    align-items: stretch;
    gap: 0.65rem;
    grid-template-columns: 1fr;
  }
  .cost-calculator-breakdown-row > span,
  .cost-calculator-breakdown-row > strong {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
  }
  .cost-calculator-breakdown-row > span::before,
  .cost-calculator-breakdown-row > strong::before {
    color: var(--muted);
    content: attr(data-label);
    flex: 0 0 7.2rem;
    font: 800 0.72rem var(--f-mono);
    text-transform: uppercase;
  }
}
@media (max-width: 520px) {
  .cost-calculator-segmented,
  .cost-calculator-summary-grid[data-row="base"],
  .cost-calculator-summary-grid[data-row="totals"] {
    grid-template-columns: 1fr;
  }
}
.admin-users-page {
  min-width: 0;
}
.admin-users-detail-nav {
  display: flex;
  justify-content: flex-start;
}
.admin-users-overview {
  align-items: stretch;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.1fr) minmax(20rem, 0.9fr);
}
.admin-users-hero-panel,
.admin-users-filter-panel {
  min-width: 0;
}
.admin-users-hero-body,
.admin-users-headline,
.admin-users-action-card {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.admin-users-headline {
  gap: 0.45rem;
}
.admin-users-headline > span,
.admin-users-stat-grid dt,
.admin-users-meta-grid dt,
.admin-users-table-head span {
  color: var(--muted);
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.admin-users-headline strong {
  color: var(--ink);
  font: 850 clamp(2.25rem, 5vw, 4.2rem) / 0.95 var(--f-sans);
  overflow-wrap: anywhere;
}
.admin-users-headline p {
  color: var(--muted);
  margin: 0;
}
.admin-users-stat-grid,
.admin-users-meta-grid {
  display: grid;
  gap: 0;
  margin: 0;
}
.admin-users-stat-grid {
  border-top: 1px solid var(--line);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-top: 1rem;
}
.admin-users-stat-grid div,
.admin-users-meta-grid div {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.85rem 1rem 0 0;
}
.admin-users-stat-grid dd,
.admin-users-meta-grid dd {
  color: var(--ink);
  font-weight: 850;
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}
.admin-users-stat-grid dd {
  font-size: 1.05rem;
}
.admin-users-filter-form {
  display: grid;
  gap: 0.875rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
}
.admin-users-filter-form label {
  min-width: 0;
}
.admin-users-filter-form input,
.admin-users-filter-form select,
.admin-users-action-fields input,
.admin-users-action-fields select,
.admin-users-action-card textarea {
  min-width: 0;
  width: 100%;
}
.admin-users-filter-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  grid-column: 1 / -1;
  justify-content: flex-end;
}
.admin-users-link-button {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-weight: 850;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.75rem 1rem;
  text-decoration: none;
}
.admin-users-table-shell {
  min-width: 0;
}
.admin-users-table {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  min-width: 0;
  overflow: hidden;
}
.admin-users-table-head,
.admin-users-table-row {
  align-items: center;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(15rem, 1.35fr) minmax(12rem, 1fr) minmax(9rem, 0.8fr) minmax(10rem, 0.8fr) minmax(7rem, 0.55fr) minmax(5rem, 0.45fr);
  min-width: 0;
  padding: 0.9rem 1rem;
}
.admin-users-table-head {
  background: var(--paper-soft);
  border-bottom: 1px solid var(--line);
}
.admin-users-table-row {
  background: var(--paper);
  border-left: 4px solid var(--line-2);
  border-top: 1px solid var(--line);
}
.admin-users-table-row:first-of-type {
  border-top: 0;
}
.admin-users-table-row.active {
  border-left-color: var(--mint-2);
}
.admin-users-table-row.pending_email_verification,
.admin-users-table-row.package_selection_required,
.admin-users-table-row.enterprise_pending {
  border-left-color: var(--amber);
}
.admin-users-table-row.suspended,
.admin-users-table-row.deactivated,
.admin-users-table-row.locked {
  border-left-color: var(--live);
}
.admin-users-table-row > span,
.admin-users-table-row > div {
  min-width: 0;
  overflow-wrap: anywhere;
}
.admin-users-card-head {
  align-items: flex-start;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  min-width: 0;
}
.admin-users-identity,
.admin-users-identity-cell {
  align-items: center;
  display: grid;
  gap: 0.8rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
}
.admin-users-identity div,
.admin-users-identity-cell div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.admin-users-identity strong,
.admin-users-identity-cell strong,
.admin-users-action-card h3 {
  color: var(--ink);
  font-weight: 900;
  margin: 0;
  overflow-wrap: anywhere;
}
.admin-users-identity span:not(.admin-users-avatar),
.admin-users-identity-cell span:not(.admin-users-avatar),
.admin-users-linked-row span {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.admin-users-avatar {
  align-items: center;
  background: linear-gradient(135deg, var(--ink), var(--violet-600) 58%, var(--rose));
  border-radius: var(--r-sm);
  color: #ffffff;
  display: inline-flex;
  font: 850 0.9rem var(--f-mono);
  height: 2.75rem;
  justify-content: center;
  width: 2.75rem;
}
.admin-users-badges {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
}
.admin-users-status-cell {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.admin-users-table-actions {
  display: flex;
  justify-content: flex-end;
}
.admin-users-meta-grid {
  border-bottom: 1px solid var(--line);
  border-top: 1px solid var(--line);
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.admin-users-meta-grid.detail {
  border-bottom: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-users-detail-grid,
.admin-users-detail-actions {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.admin-users-detail-grid {
  align-items: stretch;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-users-detail-identity {
  grid-column: 1 / -1;
}
.admin-users-action-card {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  gap: 0.75rem;
  padding: 1rem;
}
.admin-users-action-card h3 {
  font-size: 0.95rem;
}
.admin-users-action-fields {
  align-items: end;
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}
.admin-users-action-fields.status {
  grid-template-columns: minmax(12rem, 0.8fr) minmax(12rem, 1fr) auto;
}
.admin-users-action-fields.package {
  grid-template-columns: minmax(13rem, 1.05fr) minmax(8rem, 0.55fr) minmax(12rem, 0.9fr) auto;
}
.admin-users-action-fields button,
.admin-users-support-actions button,
.admin-users-action-card.note button {
  min-width: 8rem;
}
.admin-users-action-card button:disabled {
  opacity: 0.55;
}
.admin-users-support-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.admin-users-linked-list {
  display: grid;
  gap: 0.75rem;
}
.admin-users-linked-row {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(6rem, 0.45fr) minmax(0, 1fr) auto;
  min-width: 0;
  padding: 0.85rem;
}
.admin-users-action-card.note {
  align-items: start;
}
.admin-users-action-card.note button {
  justify-self: end;
}
.admin-users-pagination {
  display: flex;
  justify-content: flex-end;
}
@media (max-width: 1100px) {
  .admin-users-overview,
  .admin-users-detail-grid,
  .admin-users-stat-grid,
  .admin-users-meta-grid,
  .admin-users-meta-grid.detail,
  .admin-users-action-fields.status,
  .admin-users-action-fields.package {
    grid-template-columns: 1fr;
  }
  .admin-users-stat-grid div,
  .admin-users-meta-grid div {
    border-top: 1px solid var(--line);
    padding: 0.85rem 0 0;
  }
  .admin-users-stat-grid div:first-child,
  .admin-users-meta-grid div:first-child {
    border-top: 0;
  }
}
@media (max-width: 980px) {
  .admin-users-table-head {
    display: none;
  }
  .admin-users-table {
    border: 0;
    gap: 0.85rem;
    overflow: visible;
  }
  .admin-users-table-row {
    border: 1px solid var(--line);
    border-left: 4px solid var(--line-2);
    border-radius: var(--r-sm);
    grid-template-columns: 1fr;
    padding: 1rem;
  }
  .admin-users-table-row > span,
  .admin-users-table-row > div:not(.admin-users-identity-cell) {
    align-items: start;
    display: grid;
    gap: 0.35rem;
  }
  .admin-users-table-row > span::before,
  .admin-users-table-row > div:not(.admin-users-identity-cell)::before {
    color: var(--muted);
    content: attr(data-label);
    font: 800 0.72rem var(--f-mono);
    text-transform: uppercase;
  }
  .admin-users-table-actions {
    justify-content: stretch;
  }
}
@media (max-width: 760px) {
  .admin-users-filter-form {
    grid-template-columns: 1fr;
  }
  .admin-users-filter-actions,
  .admin-users-card-head {
    align-items: stretch;
    flex-direction: column;
  }
  .admin-users-filter-actions button,
  .admin-users-filter-actions a,
  .admin-users-support-actions form,
  .admin-users-support-actions button,
  .admin-users-action-fields button,
  .admin-users-action-card.note button,
  .admin-users-pagination a,
  .admin-users-table-actions a,
  .admin-users-detail-nav a {
    width: 100%;
  }
  .admin-users-badges {
    justify-content: flex-start;
  }
  .admin-users-linked-row {
    align-items: start;
    grid-template-columns: 1fr;
  }
}
.billing-packages-page {
  min-width: 0;
}
.billing-self-service-page,
.billing-self-service {
  min-width: 0;
}
.billing-self-service {
  display: grid;
  gap: 1.25rem;
}
.billing-self-service-tab-list {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  min-width: 0;
  padding-bottom: 0.35rem;
}
.billing-self-service-tab {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--muted-strong);
  cursor: pointer;
  font: 800 0.9rem var(--f-sans);
  min-height: 2.5rem;
  min-width: 0;
  padding: 0.65rem 0.85rem;
  transition: background 150ms ease, border-color 150ms ease, box-shadow 150ms ease, color 150ms ease;
}
.billing-self-service-tab[data-active="true"] {
  background: var(--paper);
  border-color: rgba(110, 60, 255, 0.34);
  box-shadow: inset 0 -2px 0 var(--violet-500);
  color: var(--ink);
}
.billing-self-service-tab:hover,
.billing-self-service-tab:focus-visible {
  border-color: rgba(39, 194, 160, 0.48);
  color: var(--ink);
  outline: none;
}
.billing-self-service-tab-panel {
  min-width: 0;
}
.billing-self-service-tab-panel[hidden] {
  display: none;
}
.billing-self-service-tab-stack {
  display: grid;
  gap: 1.25rem;
  min-width: 0;
}
.billing-self-service-overview,
.billing-self-service-layout {
  align-items: stretch;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.15fr) minmax(19rem, 0.85fr);
}
.billing-self-service-hero {
  min-width: 0;
}
.billing-self-service-hero-body,
.billing-self-service-headline,
.billing-self-service-note-list,
.billing-self-service-card-grid,
.billing-self-service-cancel,
.billing-self-service-checkout {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.billing-self-service-headline {
  gap: 0.45rem;
}
.billing-self-service-headline > span,
.billing-self-service-stat-grid dt,
.billing-self-service-preview dt,
.billing-self-service-card small,
.billing-self-service-note-list p,
.billing-self-service-checkout span,
.billing-self-service-checkout p,
.billing-self-service-notes {
  color: var(--muted);
}
.billing-self-service-headline > span,
.billing-self-service-stat-grid dt,
.billing-self-service-preview dt,
.billing-self-service-region span {
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.billing-self-service-headline strong {
  color: var(--ink);
  font: 850 clamp(2.25rem, 5vw, 4.2rem) / 0.95 var(--f-sans);
  overflow-wrap: anywhere;
}
.billing-self-service-headline p,
.billing-self-service-note-list p,
.billing-self-service-card p,
.billing-self-service-checkout p,
.billing-self-service-recurring-note {
  margin: 0;
}
.billing-self-service-stat-grid,
.billing-self-service-preview dl {
  display: grid;
  gap: 0;
  margin: 0;
}
.billing-self-service-stat-grid {
  border-top: 1px solid var(--line);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-top: 1rem;
}
.billing-self-service-preview dl {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.billing-self-service-stat-grid div,
.billing-self-service-preview dl div {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.9rem 1rem 0 0;
}
.billing-self-service-stat-grid div {
  border-top: 0;
  padding-top: 0;
}
.billing-self-service-stat-grid dd,
.billing-self-service-preview dd {
  color: var(--ink);
  font-weight: 850;
  margin: 0;
  overflow-wrap: anywhere;
}
.billing-self-service-note-list {
  align-content: start;
}
.billing-self-service-payment-marks {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: flex;
  min-height: 3.4rem;
  padding: 0.65rem 0.75rem;
}
.billing-self-service-payment-marks img {
  display: block;
  height: auto;
  max-height: 2rem;
  max-width: 100%;
  object-fit: contain;
  object-position: left center;
}
.billing-self-service-region {
  display: grid;
  gap: 0.45rem;
}
.billing-self-service-attestation {
  align-items: flex-start;
  color: var(--muted-strong);
  display: grid;
  font-size: 0.9rem;
  gap: 0.6rem;
  grid-template-columns: 1.1rem minmax(0, 1fr);
  line-height: 1.45;
}
.billing-self-service-attestation input {
  accent-color: var(--violet-700);
  height: 1.05rem;
  margin: 0.15rem 0 0;
  width: 1.05rem;
}
.billing-self-service-profile-alert {
  background: rgba(255, 248, 219, 0.82);
  border: 1px solid rgba(179, 132, 0, 0.24);
  border-left: 4px solid #b88400;
  border-radius: var(--r-sm);
  color: var(--ink);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.85rem;
}
.billing-self-service-profile-alert strong {
  font-weight: 850;
}
.billing-self-service-profile-alert span {
  color: var(--muted-strong);
  font-size: 0.9rem;
  line-height: 1.45;
}
.billing-self-service-profile-alert a {
  color: var(--violet-700);
  font-size: 0.9rem;
  font-weight: 800;
  text-decoration: none;
}
.billing-self-service-profile-alert a:hover,
.billing-self-service-profile-alert a:focus-visible {
  text-decoration: underline;
}
.billing-self-service-inline-action {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: flex-start;
}
.billing-self-service-region select {
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  font: 700 1rem var(--f-sans);
  min-height: 2.75rem;
  padding: 0.65rem 0.75rem;
}
.billing-self-service-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
}
.billing-self-service-card-grid.compact {
  grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}
.billing-self-service-card {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  cursor: pointer;
  display: grid;
  gap: 0.7rem;
  min-height: 10rem;
  min-width: 0;
  padding: 1rem;
  text-align: left;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}
.billing-self-service-card[data-selected="true"] {
  background: var(--paper);
  border-color: rgba(110, 60, 255, 0.34);
  border-left-color: var(--violet-500);
  box-shadow: inset 0 0 0 1px rgba(110, 60, 255, 0.12), var(--sh-sm);
}
.billing-self-service-card:hover,
.billing-self-service-card:focus-visible {
  border-left-color: var(--mint-2);
  box-shadow: var(--sh-sm);
  outline: none;
  transform: translateY(-1px);
}
.billing-self-service-card span {
  align-items: flex-start;
  display: flex;
  gap: 0.6rem;
  justify-content: space-between;
  min-width: 0;
}
.billing-self-service-card strong,
.billing-self-service-preview strong,
.billing-self-service-checkout strong {
  color: var(--ink);
  font-weight: 850;
  overflow-wrap: anywhere;
}
.billing-self-service-card em {
  color: var(--ink);
  font: 850 1.15rem var(--f-sans);
  font-style: normal;
}
.billing-self-service-card small,
.billing-self-service-card p,
.billing-self-service-checkout span,
.billing-self-service-checkout p {
  font-size: 0.9rem;
  line-height: 1.5;
}
.billing-self-service-card p {
  color: var(--muted);
}
.billing-self-service-actions,
.billing-self-service-danger-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: flex-end;
}
.billing-self-service-danger-actions {
  border-top: 1px solid var(--line);
  padding-top: 1rem;
}
.billing-self-service-preview {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-left: 4px solid var(--mint-2);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.85rem;
  min-width: 0;
  padding: 1rem;
}
.billing-self-service-recurring-note {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 750;
  line-height: 1.5;
}
.billing-self-service-notes {
  display: grid;
  gap: 0.35rem;
  margin: 0;
  padding-left: 1rem;
}
.billing-self-service-checkout {
  align-items: start;
  grid-template-columns: minmax(0, 1fr) minmax(12rem, auto);
}
.billing-self-service-checkout > div {
  display: grid;
  gap: 0.25rem;
}
.billing-self-service-checkout p {
  grid-column: 1 / -1;
}
.billing-self-service-checkout-frame {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  grid-column: 1 / -1;
  min-height: 520px;
  width: 100%;
}
.billing-self-service-checkout-link {
  align-items: center;
  background: var(--g-brand);
  border-radius: var(--r-sm);
  color: #fff;
  display: inline-flex;
  font-weight: 800;
  justify-content: center;
  min-height: 2.7rem;
  padding: 0.7rem 1rem;
  width: max-content;
}
.billing-self-service-invoice-list {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  overflow: hidden;
}
.billing-self-service-invoice-row {
  align-items: center;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(12rem, 1fr) minmax(9rem, auto) minmax(8rem, auto);
  min-width: 0;
  padding: 0.9rem 1rem;
}
.billing-self-service-invoice-row + .billing-self-service-invoice-row {
  border-top: 1px solid var(--line);
}
.billing-self-service-invoice-row > div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.billing-self-service-invoice-row strong {
  color: var(--ink);
  font-weight: 850;
  overflow-wrap: anywhere;
}
.billing-self-service-invoice-row span {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.billing-self-service-receipt-link {
  align-items: center;
  border: 1px solid var(--line-strong);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-size: 0.9rem;
  font-weight: 800;
  justify-content: center;
  justify-self: end;
  min-height: 2.35rem;
  padding: 0.55rem 0.8rem;
  text-decoration: none;
  width: max-content;
}
.billing-self-service-receipt-link:hover {
  background: var(--surface-muted);
}
.billing-self-service-cancel textarea,
.billing-self-service label textarea {
  min-height: 5.5rem;
}
@media (max-width: 1100px) {
  .billing-self-service-overview,
  .billing-self-service-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .billing-self-service-tab {
    flex: 1 1 100%;
    white-space: normal;
  }
  .billing-self-service-stat-grid,
  .billing-self-service-preview dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .billing-self-service-actions,
  .billing-self-service-danger-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .billing-self-service-actions button,
  .billing-self-service-danger-actions button {
    width: 100%;
  }
  .billing-self-service-checkout {
    grid-template-columns: 1fr;
  }
  .billing-self-service-invoice-row {
    align-items: start;
    grid-template-columns: 1fr;
  }
  .billing-self-service-receipt-link {
    justify-self: start;
  }
}
@media (max-width: 380px) {
  .billing-self-service-stat-grid,
  .billing-self-service-preview dl,
  .billing-self-service-card-grid,
  .billing-self-service-card-grid.compact {
    grid-template-columns: 1fr;
  }
}
.billing-packages-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: flex-end;
}
.billing-packages-link-button {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-weight: 850;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.75rem 1rem;
  text-decoration: none;
}
.billing-packages-overview {
  align-items: stretch;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.15fr) minmax(19rem, 0.85fr);
}
.billing-packages-hero-panel {
  min-width: 0;
}
.billing-packages-hero-body,
.billing-packages-headline,
.billing-packages-list,
.billing-packages-form,
.billing-packages-card-title,
.billing-packages-empty-state {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.billing-packages-headline {
  gap: 0.45rem;
}
.billing-packages-headline > span,
.billing-packages-stat-grid dt,
.billing-packages-catalog-grid dt,
.billing-packages-card-stats dt,
.billing-packages-card-title span,
.billing-packages-empty-state p {
  color: var(--muted);
}
.billing-packages-headline > span,
.billing-packages-stat-grid dt,
.billing-packages-catalog-grid dt,
.billing-packages-card-stats dt,
.billing-packages-card-title span {
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.billing-packages-headline strong {
  color: var(--ink);
  font: 850 clamp(2.25rem, 5vw, 4.2rem) / 0.95 var(--f-sans);
  overflow-wrap: anywhere;
}
.billing-packages-headline p,
.billing-packages-empty-state p {
  margin: 0;
}
.billing-packages-stat-grid,
.billing-packages-catalog-grid,
.billing-packages-card-stats {
  display: grid;
  gap: 0;
  margin: 0;
}
.billing-packages-stat-grid {
  border-top: 1px solid var(--line);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-top: 1rem;
}
.billing-packages-catalog-grid,
.billing-packages-card-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.billing-packages-stat-grid div,
.billing-packages-catalog-grid div,
.billing-packages-card-stats div {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.9rem 1rem 0 0;
}
.billing-packages-stat-grid div {
  border-top: 0;
  padding-top: 0;
}
.billing-packages-stat-grid dd,
.billing-packages-catalog-grid dd,
.billing-packages-card-stats dd {
  color: var(--ink);
  font-weight: 850;
  margin: 0;
  overflow-wrap: anywhere;
}
.billing-packages-stat-grid dd,
.billing-packages-catalog-grid dd {
  font-size: 1.05rem;
}
.billing-packages-price-stack {
  display: grid;
  gap: 0.2rem;
}
.billing-packages-price-stack span {
  display: block;
}
.billing-packages-list {
  gap: 1rem;
}
.billing-packages-card {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-2);
  border-radius: var(--r-sm);
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding: 1rem;
}
.billing-packages-card.active {
  border-left-color: var(--mint-2);
}
.billing-packages-card.inactive {
  border-left-color: var(--line-2);
}
.billing-packages-card-head {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  min-width: 0;
}
.billing-packages-card-title {
  gap: 0.25rem;
}
.billing-packages-card-title strong,
.billing-packages-empty-state strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.billing-packages-form {
  gap: 0.85rem;
}
.billing-packages-form.edit {
  border-top: 1px solid var(--line);
  padding-top: 1rem;
}
.billing-packages-form-grid {
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}
.billing-packages-form-grid.identity {
  grid-template-columns: minmax(8rem, 0.45fr) minmax(12rem, 0.55fr) minmax(16rem, 1fr);
}
.billing-packages-form-grid.commercial {
  grid-template-columns: minmax(8rem, 1fr) repeat(3, minmax(7rem, 0.8fr)) minmax(7rem, 0.7fr);
}
.billing-packages-form-grid > label {
  min-width: 0;
}
.billing-packages-form-grid input {
  font-size: 1rem !important;
  min-width: 0;
}
.billing-packages-form-grid textarea {
  font-size: 1rem !important;
  min-height: 4.75rem;
  min-width: 0;
}
.billing-packages-form-footer {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: space-between;
  min-width: 0;
}
.billing-packages-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  min-width: 0;
}
.billing-packages-check {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: inline-flex;
  font-weight: 800;
  gap: 0.55rem;
  min-height: 2.75rem;
  padding: 0.65rem 0.8rem;
}
.billing-packages-check input {
  margin: 0;
}
.billing-packages-form-footer button,
.billing-packages-delete-form button {
  min-width: 6rem;
}
.billing-packages-delete-form {
  align-items: center;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: flex-end;
  padding-top: 1rem;
}
.billing-packages-empty-state {
  border-top: 1px solid var(--line);
  gap: 0.35rem;
  padding-top: 0.95rem;
}
@media (max-width: 1100px) {
  .billing-packages-overview,
  .billing-packages-form-grid.identity {
    grid-template-columns: 1fr;
  }
  .billing-packages-form-grid.commercial {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .billing-packages-actions {
    flex-direction: column;
  }
  .billing-packages-link-button {
    width: 100%;
  }
  .billing-packages-stat-grid,
  .billing-packages-catalog-grid {
    grid-template-columns: 1fr;
  }
  .billing-packages-card-head {
    align-items: flex-start;
  }
  .billing-packages-card-stats,
  .billing-packages-form-grid.identity,
  .billing-packages-form-grid.commercial {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .billing-packages-form-grid.identity label:nth-child(3) {
    grid-column: 1 / -1;
  }
  .billing-packages-form-grid.commercial label:nth-child(5) {
    grid-column: 1 / -1;
  }
  .billing-packages-form-footer {
    align-items: stretch;
  }
  .billing-packages-form-footer button {
    flex: 1 1 6rem;
  }
  .billing-packages-checks {
    flex: 999 1 12rem;
  }
  .billing-packages-check {
    flex: 1 1 8rem;
    justify-content: center;
  }
  .billing-packages-delete-form {
    justify-content: stretch;
  }
  .billing-packages-delete-form button {
    width: 100%;
  }
}
@media (max-width: 360px) {
  .billing-packages-card-stats,
  .billing-packages-form-grid.identity,
  .billing-packages-form-grid.commercial {
    grid-template-columns: 1fr;
  }
  .billing-packages-form-grid.identity label:nth-child(3),
  .billing-packages-form-grid.commercial label:nth-child(5) {
    grid-column: auto;
  }
}
.provider-call-logs-page {
  min-width: 0;
}
.provider-call-logs-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: flex-end;
}
.provider-call-logs-link-button,
.provider-call-logs-clear-link,
.provider-call-logs-next-link {
  align-items: center;
  border-radius: var(--r-sm);
  display: inline-flex;
  font-weight: 850;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.75rem 1rem;
  text-decoration: none;
}
.provider-call-logs-link-button,
.provider-call-logs-clear-link,
.provider-call-logs-next-link {
  background: var(--paper);
  border: 1px solid var(--line-2);
  color: var(--ink);
}
.provider-call-logs-overview {
  align-items: stretch;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.15fr) minmax(19rem, 0.85fr);
}
.provider-call-logs-health-panel {
  min-width: 0;
}
.provider-call-logs-health-body,
.provider-call-logs-headline,
.provider-call-logs-list,
.provider-call-logs-stats-list,
.provider-call-logs-card-title,
.provider-call-logs-empty-state {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.provider-call-logs-headline {
  gap: 0.45rem;
}
.provider-call-logs-headline > span,
.provider-call-logs-stat-grid dt,
.provider-call-logs-rollup-grid dt,
.provider-call-logs-card-grid dt,
.provider-call-logs-card-title span,
.provider-call-logs-stat-row span,
.provider-call-logs-failure-note > span,
.provider-call-logs-error span,
.provider-call-logs-empty-state p {
  color: var(--muted);
}
.provider-call-logs-headline > span,
.provider-call-logs-stat-grid dt,
.provider-call-logs-rollup-grid dt,
.provider-call-logs-card-grid dt,
.provider-call-logs-card-title span,
.provider-call-logs-stat-row span,
.provider-call-logs-failure-note > span,
.provider-call-logs-error span {
  font: 800 0.74rem var(--f-mono);
  text-transform: uppercase;
}
.provider-call-logs-headline strong {
  color: var(--ink);
  font: 850 clamp(2.25rem, 5vw, 4.2rem) / 0.95 var(--f-sans);
  overflow-wrap: anywhere;
}
.provider-call-logs-headline p,
.provider-call-logs-empty-state p,
.provider-call-logs-error p,
.provider-call-logs-failure-note p {
  margin: 0;
}
.provider-call-logs-stat-grid,
.provider-call-logs-rollup-grid,
.provider-call-logs-card-grid {
  display: grid;
  gap: 0;
  margin: 0;
}
.provider-call-logs-stat-grid {
  border-top: 1px solid var(--line);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding-top: 1rem;
}
.provider-call-logs-rollup-grid,
.provider-call-logs-card-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.provider-call-logs-stat-grid div,
.provider-call-logs-rollup-grid div,
.provider-call-logs-card-grid div {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding: 0.9rem 1rem 0 0;
}
.provider-call-logs-stat-grid div {
  border-top: 0;
  padding-top: 0;
}
.provider-call-logs-stat-grid dd,
.provider-call-logs-rollup-grid dd,
.provider-call-logs-card-grid dd {
  color: var(--ink);
  font-weight: 850;
  margin: 0;
  overflow-wrap: anywhere;
}
.provider-call-logs-stat-grid dd,
.provider-call-logs-rollup-grid dd {
  font-size: 1.05rem;
}
.provider-call-logs-filter {
  align-items: end;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(12rem, 1fr) minmax(8rem, 0.55fr) minmax(8rem, 0.55fr) minmax(12rem, 1fr) minmax(8rem, 0.55fr) auto;
  min-width: 0;
}
.provider-call-logs-filter > label {
  min-width: 0;
}
.provider-call-logs-filter input,
.provider-call-logs-filter select {
  font-size: 1rem !important;
  min-width: 0;
}
.provider-call-logs-filter-actions {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  justify-content: flex-end;
  min-width: 0;
}
.provider-call-logs-filter-actions button {
  white-space: nowrap;
}
.provider-call-logs-layout {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(20rem, 0.42fr);
}
.provider-call-logs-card {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-left: 4px solid var(--line-2);
  border-radius: var(--r-sm);
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding: 1rem;
}
.provider-call-logs-card.success {
  border-left-color: var(--mint-2);
}
.provider-call-logs-card.error {
  border-left-color: var(--rose);
}
.provider-call-logs-card.skipped {
  border-left-color: var(--amber);
}
.provider-call-logs-card-head {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  min-width: 0;
}
.provider-call-logs-card-title {
  gap: 0.25rem;
}
.provider-call-logs-card-title strong,
.provider-call-logs-stat-row strong,
.provider-call-logs-failure-note strong,
.provider-call-logs-empty-state strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.provider-call-logs-error,
.provider-call-logs-failure-note {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  padding-top: 0.9rem;
}
.provider-call-logs-error p,
.provider-call-logs-failure-note p {
  color: var(--ink);
  overflow-wrap: anywhere;
}
.provider-call-logs-stat-row {
  align-items: center;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.85rem;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
  padding-top: 0.9rem;
}
.provider-call-logs-stat-row > div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.provider-call-logs-next-link {
  justify-self: stretch;
}
.provider-call-logs-empty-state {
  border-top: 1px solid var(--line);
  gap: 0.35rem;
  padding-top: 0.95rem;
}
@media (max-width: 1200px) {
  .provider-call-logs-filter {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .provider-call-logs-filter-actions {
    justify-content: stretch;
  }
  .provider-call-logs-filter-actions button,
  .provider-call-logs-clear-link {
    flex: 1 1 8rem;
  }
}
@media (max-width: 1100px) {
  .provider-call-logs-overview,
  .provider-call-logs-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .provider-call-logs-actions {
    flex-direction: column;
  }
  .provider-call-logs-link-button {
    width: 100%;
  }
  .provider-call-logs-stat-grid,
  .provider-call-logs-rollup-grid,
  .provider-call-logs-card-grid,
  .provider-call-logs-filter {
    grid-template-columns: 1fr;
  }
  .provider-call-logs-card-head,
  .provider-call-logs-stat-row {
    align-items: stretch;
    grid-template-columns: 1fr;
  }
  .provider-call-logs-stats-panel {
    order: -1;
  }
  .provider-call-logs-filter-actions {
    flex-direction: column;
  }
  .provider-call-logs-filter-actions button,
  .provider-call-logs-clear-link {
    width: 100%;
  }
}
.host-main {
  display: grid;
  gap: 1.25rem;
  min-width: 0;
}
.provider-admin {
  display: grid;
  gap: 1.25rem;
  min-width: 0;
}
.provider-admin-actions,
.provider-chip-row {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.provider-admin-actions {
  justify-content: flex-end;
}
.provider-admin-summary {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.provider-metric {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 0.4rem;
  min-width: 0;
  padding: 1rem;
}
.provider-metric span {
  color: var(--muted);
  font: 750 0.72rem var(--f-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.provider-metric strong {
  color: var(--ink);
  font-size: 1.75rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
}
.provider-metric p {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
  margin: 0;
}
.provider-admin-layout {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(16rem, 22rem);
}
.provider-tabs {
  display: grid;
  gap: 0.9rem;
  min-width: 0;
}
.provider-tab-input {
  height: 1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  width: 1px;
}
.provider-tab-list {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: 0.45rem;
}
.provider-tab-list label {
  align-items: center;
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font-size: 0.88rem;
  font-weight: 820;
  justify-content: center;
  min-height: 2.55rem;
  padding: 0.68rem 0.85rem;
  user-select: none;
}
.provider-tab-list label:hover {
  background: var(--violet-50);
  color: var(--violet-700);
}
#provider-tab-catalog:checked ~ .provider-tab-list label[for="provider-tab-catalog"],
#provider-tab-create:checked ~ .provider-tab-list label[for="provider-tab-create"],
#provider-tab-routes:checked ~ .provider-tab-list label[for="provider-tab-routes"],
#provider-tab-flow:checked ~ .provider-tab-list label[for="provider-tab-flow"] {
  background: var(--g-brand);
  border-color: rgba(110, 60, 255, 0.35);
  box-shadow: var(--sh-glow);
  color: #ffffff;
}
.provider-tab-panels {
  min-width: 0;
}
.provider-tab-panel {
  display: none;
}
#provider-tab-catalog:checked ~ .provider-tab-panels .provider-tab-panel-catalog,
#provider-tab-create:checked ~ .provider-tab-panels .provider-tab-panel-create,
#provider-tab-routes:checked ~ .provider-tab-panels .provider-tab-panel-routes,
#provider-tab-flow:checked ~ .provider-tab-panels .provider-tab-panel-flow {
  display: block;
}
.provider-summary-rail {
  align-self: start;
  display: grid;
  gap: 1rem;
  min-width: 0;
  position: sticky;
  top: 1rem;
}
.provider-summary-list {
  display: grid;
  gap: 0.75rem;
}
.provider-summary-item {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.45rem;
  min-width: 0;
  padding-top: 0.75rem;
}
.provider-summary-item:first-child {
  border-top: 0;
  padding-top: 0;
}
.provider-summary-item strong {
  color: var(--ink);
  font-size: 0.94rem;
  font-weight: 850;
  line-height: 1.3;
}
.provider-summary-item span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.provider-summary-item form {
  display: grid;
  gap: 0.55rem;
  justify-self: start;
}
.provider-summary-item form.provider-danger-form {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: 0.55rem;
  justify-self: stretch;
  min-width: 0;
}
.provider-danger-form button {
  flex: 0 0 auto;
}
.provider-delete-confirm {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex: 1 1 auto;
  font-size: 0.72rem;
  gap: 0.38rem;
  line-height: 1.25;
  min-width: 0;
}
.provider-delete-confirm input {
  flex: 0 0 auto;
  height: 0.9rem;
  margin: 0;
  min-height: 0;
  width: 0.9rem;
}
.provider-delete-confirm span {
  font-size: inherit;
  line-height: inherit;
}
.provider-catalog-list {
  display: grid;
  gap: 0;
}
.provider-catalog-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr;
}
.provider-catalog-group {
  display: grid;
  gap: 0;
}
.provider-catalog-group h3 {
  color: var(--muted);
  font: 800 0.72rem var(--f-mono);
  letter-spacing: 0.08em;
  margin: 0 0 0.25rem;
  text-transform: uppercase;
}
.provider-catalog-row {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.8rem;
  min-width: 0;
  padding: 1rem 0;
}
.provider-catalog-grid .provider-catalog-row {
  background: transparent;
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  padding: 0.9rem 0;
}
.provider-catalog-row:first-child {
  border-top: 0;
  padding-top: 0;
}
.provider-catalog-grid .provider-catalog-row:first-child {
  border-top: 0;
  padding-top: 0;
}
.provider-catalog-row:last-child {
  padding-bottom: 0;
}
.provider-catalog-grid .provider-catalog-row:last-child {
  padding-bottom: 0;
}
.provider-row-main {
  align-items: start;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(10rem, 0.55fr) minmax(0, 1fr);
}
.provider-row-main strong {
  color: var(--ink);
  display: block;
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.2;
}
.provider-kind {
  color: var(--muted);
  display: block;
  font-size: 0.82rem;
  font-weight: 760;
  line-height: 1.35;
  margin-top: 0.15rem;
}
.provider-catalog-row code,
.provider-admin-table code {
  color: var(--muted);
  display: block;
  font: 700 0.72rem var(--f-mono);
  margin-top: 0.18rem;
  overflow-wrap: anywhere;
}
.provider-catalog-row p {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.5;
  margin: 0;
}
.provider-chip {
  background: var(--violet-50);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--violet-700);
  display: inline-flex;
  font-size: 0.64rem;
  font-weight: 820;
  line-height: 1;
  padding: 0.28rem 0.42rem;
  white-space: nowrap;
}
.provider-field-list {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}
.provider-field-list div {
  min-width: 0;
}
.provider-field-list dt {
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 850;
  margin-bottom: 0.18rem;
}
.provider-field-list dd {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
  margin: 0;
  overflow-wrap: anywhere;
}
.provider-doc-link {
  color: var(--violet-700);
  font-size: 0.9rem;
  font-weight: 820;
  justify-self: start;
}
.provider-admin-form {
  display: grid;
  gap: 1rem;
}
.provider-form-grid {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.provider-fieldset {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  gap: 0.85rem;
  margin: 0;
  min-width: 0;
  padding: 1rem;
}
.provider-fieldset legend {
  color: var(--ink);
  font-size: 0.92rem;
  font-weight: 850;
  padding: 0 0.35rem;
}
.provider-fieldset p {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
  margin: 0;
}
.provider-checkbox-grid {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.provider-check {
  align-items: center;
  background: var(--paper-warm);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  cursor: pointer;
  display: grid;
  gap: 0.55rem;
  grid-template-columns: auto auto minmax(0, 1fr);
  min-height: 2.85rem;
  padding: 0.65rem 0.75rem;
}
.provider-check input {
  height: 1rem;
  margin: 0;
  min-height: 0;
  padding: 0;
  width: 1rem;
}
.provider-check span {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--violet-700);
  font: 820 0.68rem var(--f-mono);
  padding: 0.25rem 0.4rem;
  white-space: nowrap;
}
.provider-check strong {
  font-size: 0.86rem;
  font-weight: 820;
  line-height: 1.25;
}
.provider-inline-check {
  align-items: center;
  color: var(--ink);
  display: flex;
  font-size: 0.9rem;
  font-weight: 800;
  gap: 0.45rem;
}
.provider-inline-check input {
  height: 1rem;
  margin: 0;
  min-height: 0;
  padding: 0;
  width: 1rem;
}
.provider-route-list {
  display: grid;
  gap: 0.85rem;
}
.provider-route-row {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.7rem;
  grid-template-columns: minmax(0, 1fr);
  padding-top: 0.85rem;
}
.provider-route-row:first-child {
  border-top: 0;
  padding-top: 0;
}
.provider-assignment-row {
  align-items: end;
  grid-template-columns: minmax(10rem, 1fr) minmax(14rem, 1.2fr) auto;
}
.provider-primary-row,
.provider-priority-editor {
  background: var(--paper-warm);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 0.85rem;
}
.provider-route-chain-card {
  background: var(--paper-warm);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.75rem;
  padding: 0.85rem;
}
.provider-primary-row:first-child,
.provider-priority-editor:first-child,
.provider-route-chain-card:first-child {
  border-top: 1px solid var(--line);
}
.provider-chain-editor.provider-assignment-row {
  align-items: stretch;
  grid-template-columns: minmax(0, 1fr);
}
.provider-priority-editor {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(0, 1fr);
}
.provider-assignment-chain {
  display: grid;
  gap: 0.55rem;
}
.provider-assignment-slot {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.55rem;
  min-width: 0;
  padding: 0.65rem;
}
.provider-assignment-slot-form,
.provider-add-provider-form {
  align-items: end;
  display: grid;
  gap: 0.65rem;
  min-width: 0;
}
.provider-assignment-slot-form {
  grid-template-columns: minmax(5rem, 0.45fr) minmax(13rem, 1.15fr) minmax(10rem, 0.9fr) auto auto;
}
.provider-add-provider-form {
  background: var(--paper);
  border: 1px dashed var(--line-2);
  border-radius: var(--r-sm);
  grid-template-columns: minmax(13rem, 1.15fr) minmax(5rem, 0.45fr) minmax(10rem, 0.9fr) auto auto;
  padding: 0.65rem;
}
.provider-slot-delete-form {
  align-items: center;
  display: flex;
  gap: 0.55rem;
  justify-self: end;
}
.provider-flow-shell {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.provider-flow-toolbar {
  align-items: center;
  background: var(--paper-warm);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  justify-content: space-between;
  padding: 0.85rem;
}
.provider-flow-toolbar > div:first-child {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}
.provider-flow-toolbar strong {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 880;
}
.provider-flow-toolbar span {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.35;
}
.provider-flow-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  justify-content: flex-end;
}
.provider-flow-board {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(15rem, 0.28fr) minmax(0, 1fr);
  min-width: 0;
}
.provider-flow-credential-pool {
  background: var(--paper-warm);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.85rem;
  min-width: 0;
  padding: 0.85rem;
  position: sticky;
  top: 1rem;
}
.provider-flow-credential-pool > header,
.provider-flow-workflow-header {
  display: grid;
  gap: 0.18rem;
}
.provider-flow-credential-pool > header span,
.provider-flow-workflow-header span {
  color: var(--muted);
  font: 800 0.68rem var(--f-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.provider-flow-credential-pool > header strong,
.provider-flow-workflow-header strong {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 880;
  line-height: 1.25;
}
.provider-flow-credential-list,
.provider-flow-workflows {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
}
.provider-flow-credential {
  align-items: start;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  cursor: grab;
  display: grid;
  gap: 0.65rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
  padding: 0.75rem;
}
.provider-flow-credential:active,
.provider-flow-slot:active {
  cursor: grabbing;
}
.provider-flow-credential svg,
.provider-flow-slot-main svg {
  color: var(--muted);
  margin-top: 0.1rem;
}
.provider-flow-credential strong,
.provider-flow-slot-main strong {
  color: var(--ink);
  display: block;
  font-size: 0.9rem;
  font-weight: 850;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.provider-flow-credential span,
.provider-flow-slot-main small {
  color: var(--muted);
  display: block;
  font-size: 0.78rem;
  line-height: 1.35;
  margin-top: 0.12rem;
}
.provider-flow-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.32rem;
  grid-column: 1 / -1;
}
.provider-flow-chip {
  background: var(--paper-warm);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  display: inline-flex;
  font-size: 0.62rem;
  font-weight: 820;
  line-height: 1;
  padding: 0.24rem 0.38rem;
  white-space: nowrap;
}
.provider-flow-workflow {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.9rem;
  min-width: 0;
  overflow: hidden;
  padding: 0.9rem;
}
.provider-flow-steps {
  display: flex;
  gap: 1.15rem;
  min-width: 0;
  overflow-x: auto;
  padding: 0.1rem 0.2rem 0.3rem 0;
}
.provider-flow-node {
  background: var(--paper-warm);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  flex: 0 0 min(19rem, 82vw);
  gap: 0.75rem;
  min-height: 13.5rem;
  min-width: 0;
  padding: 0.8rem;
  position: relative;
}
.provider-flow-node.is-empty {
  border-style: dashed;
}
.provider-flow-connector {
  background: var(--line-2);
  height: 2px;
  left: calc(100% + 0.15rem);
  position: absolute;
  top: 2.3rem;
  width: 0.9rem;
}
.provider-flow-connector::after {
  border-bottom: 5px solid transparent;
  border-left: 7px solid var(--line-2);
  border-top: 5px solid transparent;
  content: "";
  position: absolute;
  right: -0.35rem;
  top: -4px;
}
.provider-flow-node-header {
  align-items: start;
  display: flex;
  gap: 0.65rem;
  justify-content: space-between;
  min-width: 0;
}
.provider-flow-node-header div {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}
.provider-flow-node-header div > span {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--violet-700);
  display: inline-flex;
  font: 850 0.66rem var(--f-mono);
  justify-self: start;
  padding: 0.22rem 0.38rem;
}
.provider-flow-node-header strong {
  color: var(--ink);
  font-size: 0.96rem;
  font-weight: 880;
  line-height: 1.25;
}
.provider-flow-slots {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
}
.provider-flow-empty-slot,
.provider-flow-drop-target {
  align-items: center;
  border: 1px dashed var(--line-2);
  border-radius: var(--r-sm);
  color: var(--muted);
  display: flex;
  font-size: 0.82rem;
  font-weight: 760;
  justify-content: center;
  min-height: 2.8rem;
  padding: 0.55rem;
  text-align: center;
}
.provider-flow-drop-target {
  background: var(--paper);
}
.provider-flow-slot {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  cursor: grab;
  display: grid;
  gap: 0.65rem;
  min-width: 0;
  padding: 0.65rem;
}
.provider-flow-slot.is-selected {
  border-color: rgba(110, 60, 255, 0.45);
  box-shadow: 0 0 0 3px rgba(110, 60, 255, 0.08);
}
.provider-flow-slot.is-disabled {
  opacity: 0.72;
}
.provider-flow-slot-main {
  align-items: center;
  display: grid;
  gap: 0.55rem;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  min-width: 0;
}
.provider-flow-priority {
  background: var(--paper-warm);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--violet-700);
  display: inline-flex;
  font: 850 0.66rem var(--f-mono);
  justify-content: center;
  min-width: 2.05rem;
  padding: 0.22rem 0.38rem;
}
.provider-flow-slot-editor {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.65rem;
  grid-template-columns: minmax(10rem, 1.15fr) minmax(9rem, 0.9fr) auto auto;
  padding-top: 0.65rem;
}
.provider-flow-toggle {
  align-items: center;
  color: var(--ink);
  display: flex;
  font-size: 0.85rem;
  font-weight: 820;
  gap: 0.45rem;
}
.provider-flow-toggle input {
  height: 1rem;
  margin: 0;
  min-height: 0;
  width: 1rem;
}
.provider-chain-stack {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0;
  overflow: hidden;
}
.provider-chain-slot {
  align-items: center;
  background: var(--paper-warm);
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.65rem;
  grid-template-columns: 2.6rem minmax(8rem, 1fr) minmax(10rem, 1fr);
  min-width: 0;
  padding: 0.55rem 0.65rem;
}
.provider-chain-slot:first-child {
  border-top: 0;
}
.provider-chain-slot span {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--violet-700);
  display: inline-flex;
  font: 850 0.66rem var(--f-mono);
  justify-content: center;
  padding: 0.2rem 0.35rem;
}
.provider-chain-slot strong {
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 850;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.provider-chain-slot small {
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.provider-priority-slot-form {
  align-items: end;
  display: grid;
  gap: 0.65rem;
  grid-template-columns: minmax(5.5rem, 0.55fr) minmax(13rem, 1.2fr) minmax(10rem, 0.9fr) auto auto;
}
.provider-priority-row {
  align-items: end;
  grid-template-columns: minmax(10rem, 1fr) minmax(14rem, 1.1fr) minmax(13rem, 1.1fr) auto auto;
}
.provider-priority-fields {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: minmax(5.5rem, 0.7fr) minmax(9rem, 1fr);
}
.provider-priority-fields label {
  min-width: 0;
}
.provider-route-label {
  display: grid;
  gap: 0.18rem;
}
.provider-route-label strong {
  color: var(--ink);
  font-size: 0.95rem;
  font-weight: 850;
  line-height: 1.25;
}
.provider-route-label span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.35;
}
.provider-table-wrap {
  margin: -0.35rem 0;
  overflow-x: auto;
}
.provider-admin-table {
  border-collapse: collapse;
  color: var(--ink-soft);
  font-size: 0.9rem;
  min-width: 36rem;
  width: 100%;
}
.provider-admin-table th {
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font: 800 0.72rem var(--f-mono);
  letter-spacing: 0.06em;
  padding: 0.65rem 0.7rem;
  text-align: left;
  text-transform: uppercase;
}
.provider-admin-table td {
  border-bottom: 1px solid var(--line);
  line-height: 1.45;
  padding: 0.85rem 0.7rem;
  vertical-align: top;
}
.provider-admin-table tr:last-child td {
  border-bottom: 0;
}
.provider-admin-table strong {
  color: var(--ink);
  font-weight: 850;
}
.dashboard-app {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-md);
  min-width: 0;
  overflow: visible;
}
.dashboard-topbar {
  align-items: center;
  background: linear-gradient(#fbfafe, #f7f4fb);
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(8rem, 0.6fr) minmax(16rem, 1.4fr) auto;
  padding: 0.85rem 1rem;
}
.dashboard-topbar[data-has-search="false"] {
  grid-template-columns: minmax(0, 1fr) auto;
}
.crumbs {
  align-items: center;
  color: var(--muted);
  display: flex;
  font-size: 0.82rem;
  gap: 0.45rem;
}
.crumbs strong {
  color: var(--ink);
}
.dash-search,
.dashboard-signal {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  display: flex;
  font-size: 0.84rem;
  gap: 0.55rem;
  min-height: 2.35rem;
  min-width: 0;
  padding: 0 0.8rem;
}
.topbar-search-form {
  padding-right: 0.55rem;
}
.topbar-search-form input[type="search"] {
  appearance: none;
  background: transparent;
  border: 0;
  color: var(--ink);
  flex: 1;
  font: inherit;
  min-width: 0;
  outline: 0;
  padding: 0;
}
.topbar-search-form input[type="search"]::placeholder {
  color: var(--muted);
  opacity: 1;
}
.dash-search span:nth-child(2),
.dashboard-signal span:nth-child(2) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dash-search kbd {
  background: var(--paper-soft);
  border: 1px solid var(--line-2);
  border-radius: 6px;
  color: var(--ink-soft);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.68rem;
  margin-left: auto;
  padding: 0.18rem 0.38rem;
  white-space: nowrap;
}
.dashboard-user {
  align-items: center;
  display: flex;
  gap: 0.45rem;
}
.topbar-notification {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  display: inline-flex;
  height: 2.35rem;
  justify-content: center;
  position: relative;
  text-decoration: none;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
  width: 2.35rem;
}
.topbar-notification-details {
  position: relative;
}
.topbar-notification-details summary {
  list-style: none;
}
.topbar-notification-details summary::-webkit-details-marker {
  display: none;
}
.topbar-notification:hover,
.topbar-notification:focus-visible,
.topbar-notification.active {
  background: #ffffff;
  border-color: rgba(23, 123, 122, 0.34);
  color: #177b7a;
  outline: 0;
  transform: translateY(-1px);
}
.topbar-notification:focus-visible {
  box-shadow: 0 0 0 3px rgba(23, 123, 122, 0.16);
}
.topbar-notification-badge {
  align-items: center;
  background: #c2410c;
  border: 2px solid #ffffff;
  border-radius: 999px;
  color: #ffffff;
  display: inline-flex;
  font-size: 0.64rem;
  font-weight: 900;
  height: 1.1rem;
  justify-content: center;
  line-height: 1;
  min-width: 1.1rem;
  padding: 0 0.25rem;
  position: absolute;
  inset-inline-end: -0.28rem;
  top: -0.26rem;
}
.topbar-notification-drawer {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-lg);
  color: var(--ink);
  display: grid;
  max-height: min(34rem, calc(100vh - 7rem));
  overflow: hidden;
  position: absolute;
  inset-inline-end: 0;
  top: calc(100% + 0.55rem);
  width: min(26rem, calc(100vw - 2rem));
  z-index: 150;
}
.topbar-notification-drawer-head {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 0.9rem 1rem;
}
.topbar-notification-drawer-head h2 {
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.2;
  margin: 0;
}
.topbar-notification-drawer-head span {
  color: var(--muted);
  display: block;
  font: 700 0.74rem var(--f-mono);
  margin-top: 0.2rem;
}
.topbar-notification-drawer-actions {
  align-items: center;
  display: flex;
  gap: 0.4rem;
}
.topbar-notification-drawer-actions button,
.topbar-notification-drawer-actions a {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 850;
  justify-content: center;
  min-height: 2.15rem;
  padding: 0 0.65rem;
  text-decoration: none;
}
.topbar-notification-tabs {
  background: var(--paper-soft);
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 0.35rem;
  padding: 0.55rem 0.75rem;
}
.topbar-notification-tabs span {
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 850;
  padding: 0.35rem 0.6rem;
}
.topbar-notification-tabs .active {
  background: var(--paper);
  color: var(--ink);
}
.topbar-notification-list {
  display: grid;
  max-height: 24rem;
  overflow: auto;
}
.topbar-notification-row {
  align-items: start;
  border-bottom: 1px solid var(--line);
  color: inherit;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: auto minmax(0, 1fr) auto;
  padding: 0.85rem 1rem;
  text-decoration: none;
}
.topbar-notification-row.unread {
  background: linear-gradient(90deg, rgba(110, 60, 255, 0.06), transparent 70%);
}
.topbar-notification-row-icon {
  align-items: center;
  background: #eef4ff;
  border: 1px solid #d7e3ff;
  border-radius: var(--r-sm);
  color: #315fbd;
  display: inline-flex;
  height: 2rem;
  justify-content: center;
  width: 2rem;
}
.topbar-notification-row-icon.is-success {
  background: #e9f8ef;
  border-color: #c6ebd2;
  color: #168047;
}
.topbar-notification-row-icon.is-warning {
  background: #fff7df;
  border-color: #f4dea1;
  color: #95620a;
}
.topbar-notification-row-icon.is-danger {
  background: #fff1f2;
  border-color: #fecdd3;
  color: #be123c;
}
.topbar-notification-row-copy {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
}
.topbar-notification-row-copy strong {
  color: var(--ink);
  font-size: 0.88rem;
  line-height: 1.35;
}
.topbar-notification-row-copy span {
  color: var(--muted);
  display: -webkit-box;
  font-size: 0.78rem;
  line-height: 1.45;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.topbar-notification-row time {
  color: var(--muted);
  font: 700 0.68rem var(--f-mono);
  white-space: nowrap;
}
.topbar-notification-empty {
  align-items: center;
  color: var(--muted);
  display: grid;
  gap: 0.45rem;
  justify-items: center;
  padding: 2rem 1rem;
  text-align: center;
}
.topbar-notification-empty strong {
  color: var(--ink);
}
.topbar-notification-empty p {
  line-height: 1.5;
  margin: 0;
}
.topbar-notification-view-all {
  color: var(--violet-600);
  font-size: 0.86rem;
  font-weight: 850;
  padding: 0.8rem 1rem;
  text-align: center;
  text-decoration: none;
}
.icon-btn {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink-soft);
  display: inline-flex;
  font-size: 0.82rem;
  font-weight: 850;
  height: 2.3rem;
  justify-content: center;
  min-width: 2.3rem;
  padding: 0 0.55rem;
}
.avatar {
  align-items: center;
  background: var(--g-brand);
  border-radius: 50%;
  color: #ffffff;
  display: inline-flex;
  font-size: 0.78rem;
  font-weight: 900;
  height: 2.35rem;
  justify-content: center;
  width: 2.35rem;
}
.topbar-profile {
  position: relative;
}
.topbar-profile summary {
  cursor: pointer;
  display: inline-flex;
  list-style: none;
}
.topbar-profile summary::-webkit-details-marker {
  display: none;
}
.topbar-profile summary:focus-visible {
  border-radius: 999px;
  outline: 3px solid rgba(110, 60, 255, 0.26);
  outline-offset: 3px;
}
.topbar-profile-menu {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-md);
  display: grid;
  gap: 0.35rem;
  inline-size: min(18rem, calc(100vw - 2rem));
  max-inline-size: calc(100vw - 2rem);
  padding: 0.75rem;
  position: absolute;
  inset-inline-end: 0;
  top: calc(100% + 0.55rem);
  z-index: 140;
}
.topbar-profile-heading {
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 0.2rem;
  margin-bottom: 0.2rem;
  padding: 0.25rem 0.35rem 0.7rem;
}
.topbar-profile-heading span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}
.topbar-profile-heading strong {
  color: var(--ink);
  font-size: 0.96rem;
  line-height: 1.3;
}
.topbar-profile-heading small {
  color: var(--muted);
  overflow-wrap: anywhere;
}
.topbar-profile-menu a,
.topbar-profile-menu button {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: var(--r-sm);
  color: var(--ink-soft);
  cursor: pointer;
  display: flex;
  font: inherit;
  font-weight: 800;
  gap: 0.55rem;
  justify-content: flex-start;
  min-height: 2.45rem;
  padding: 0 0.55rem;
  text-align: start;
  text-decoration: none;
  width: 100%;
}
.topbar-profile-menu a svg,
.topbar-profile-menu button svg {
  color: var(--muted);
  flex: 0 0 auto;
}
.topbar-language-switcher {
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 0.55rem;
  margin-bottom: 0.2rem;
  padding: 0.15rem 0.35rem 0.8rem;
}
.topbar-language-heading {
  align-items: center;
  color: var(--ink-soft);
  display: flex;
  gap: 0.45rem;
}
.topbar-language-heading svg {
  color: var(--muted);
  flex: 0 0 auto;
}
.topbar-language-heading span {
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}
.topbar-language-options {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.25rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 0.25rem;
}
.topbar-language-options button {
  align-items: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: calc(var(--r-sm) - 3px);
  color: var(--ink-soft);
  display: grid;
  gap: 0.1rem;
  justify-items: center;
  min-height: 3rem;
  padding: 0.35rem 0.45rem;
  text-align: center;
}
.topbar-language-options button span {
  color: var(--muted);
  font: 850 0.68rem var(--f-mono);
}
.topbar-language-options button strong {
  color: inherit;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.15;
}
.topbar-language-options button[aria-pressed="true"] {
  background: #ffffff;
  border-color: rgba(23, 123, 122, 0.24);
  box-shadow: 0 6px 14px rgba(28, 21, 42, 0.08);
  color: #177b7a;
}
.topbar-language-options button:hover,
.topbar-language-options button:focus-visible {
  background: #ffffff;
  color: var(--ink);
  outline: 0;
}
.topbar-profile-menu a:hover,
.topbar-profile-menu button:hover,
.topbar-profile-menu a:focus-visible,
.topbar-profile-menu button:focus-visible {
  background: var(--paper-soft);
  color: var(--ink);
  outline: 0;
}
.topbar-profile-menu a:hover svg,
.topbar-profile-menu button:hover svg,
.topbar-profile-menu a:focus-visible svg,
.topbar-profile-menu button:focus-visible svg {
  color: var(--ink);
}
.topbar-profile-menu .topbar-language-options button:hover,
.topbar-profile-menu .topbar-language-options button:focus-visible {
  background: #ffffff;
  color: var(--ink);
}
.topbar-profile-menu .topbar-language-options button[aria-pressed="true"]:hover,
.topbar-profile-menu .topbar-language-options button[aria-pressed="true"]:focus-visible {
  color: #177b7a;
}
.topbar-language-select-row {
  align-items: center;
  display: grid;
  gap: 0.45rem;
  grid-template-columns: minmax(0, 1fr) auto;
}
.topbar-language-select-row select {
  appearance: none;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  min-height: 2.45rem;
  min-width: 0;
  padding: 0 0.75rem;
}
.topbar-language-select-row button {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
  min-height: 2.45rem;
  padding: 0 0.75rem;
}
.visually-hidden {
  clip: rect(0 0 0 0);
  border: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}
.dashboard-body {
  display: grid;
  gap: 1rem;
  padding: 1.25rem;
}
.host-page-intro {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) auto;
  min-width: 0;
}
.host-page-intro-copy {
  display: grid;
  gap: 0.45rem;
  min-width: 0;
}
.host-page-intro-actions {
  display: grid;
  gap: 0.75rem;
  justify-items: end;
  min-width: 0;
}
.notification-center-page {
  min-width: 0;
}
.notification-workspace {
  gap: 1.15rem;
}
.notification-overview-grid {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.notification-metric {
  align-items: start;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: 0 10px 24px rgba(28, 27, 46, 0.05);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
  padding: 1rem;
}
.notification-metric-icon {
  align-items: center;
  background: #e7f8f5;
  border: 1px solid #bfe9e3;
  border-radius: var(--r-sm);
  color: #177b7a;
  display: inline-flex;
  height: 2.15rem;
  justify-content: center;
  width: 2.15rem;
}
.notification-metric div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.notification-metric span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}
.notification-metric strong {
  color: var(--ink);
  font-size: 1.05rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.notification-metric p {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.5;
  margin: 0;
}
.notification-center-grid {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(19rem, 0.38fr);
}
.notification-main-column,
.notification-side-column {
  display: grid;
  gap: 1rem;
  min-width: 0;
}
.notification-filter-bar {
  align-items: end;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
}
.notification-filter-bar label {
  color: var(--ink-soft);
  display: grid;
  font-size: 0.8rem;
  font-weight: 850;
  gap: 0.4rem;
}
.notification-filter-bar select {
  appearance: none;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  font: inherit;
  min-height: 2.65rem;
  padding: 0 0.78rem;
}
.notification-filter-submit,
.notification-primary-action,
.notification-save-preferences,
.notification-row-action {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 850;
  gap: 0.45rem;
  justify-content: center;
  min-height: 2.45rem;
  text-decoration: none;
  transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
  white-space: nowrap;
}
.notification-primary-action,
.notification-save-preferences {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
  padding: 0 0.85rem;
}
.notification-filter-submit,
.notification-row-action {
  background: #ffffff;
  color: var(--ink-soft);
  padding: 0 0.7rem;
}
.notification-filter-submit:hover,
.notification-filter-submit:focus-visible,
.notification-primary-action:hover,
.notification-primary-action:focus-visible,
.notification-save-preferences:hover,
.notification-save-preferences:focus-visible,
.notification-row-action:hover,
.notification-row-action:focus-visible {
  border-color: rgba(23, 123, 122, 0.36);
  color: #177b7a;
  outline: 0;
  transform: translateY(-1px);
}
.notification-primary-action:hover,
.notification-primary-action:focus-visible,
.notification-save-preferences:hover,
.notification-save-preferences:focus-visible {
  background: #123b3f;
  color: #ffffff;
}
.notification-list {
  display: grid;
  gap: 0.75rem;
}
.notification-row {
  align-items: start;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  gap: 0.85rem;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-width: 0;
  padding: 0.95rem;
}
.notification-row.is-unread {
  border-color: rgba(194, 65, 12, 0.26);
  box-shadow: inset 3px 0 0 #c2410c;
}
.notification-row-icon {
  align-items: center;
  background: #eef4ff;
  border: 1px solid #d7e3ff;
  border-radius: var(--r-sm);
  color: #315fbd;
  display: inline-flex;
  height: 2.35rem;
  justify-content: center;
  width: 2.35rem;
}
.notification-row-icon.is-success {
  background: #e9f8ef;
  border-color: #c6ebd2;
  color: #168047;
}
.notification-row-icon.is-warning {
  background: #fff7df;
  border-color: #f4dea1;
  color: #95620a;
}
.notification-row-icon.is-danger {
  background: #fff1f2;
  border-color: #fecdd3;
  color: #be123c;
}
.notification-row-body {
  display: grid;
  gap: 0.5rem;
  min-width: 0;
}
.notification-row-heading {
  align-items: start;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.notification-row-heading strong {
  color: var(--ink);
  font-size: 0.98rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.notification-row-heading time {
  color: var(--muted);
  flex: 0 0 auto;
  font-size: 0.76rem;
  line-height: 1.35;
  white-space: nowrap;
}
.notification-row-body p {
  color: var(--ink-soft);
  line-height: 1.6;
  margin: 0;
  overflow-wrap: anywhere;
}
.notification-row-meta {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 0.78rem;
  gap: 0.45rem;
}
.notification-row-meta > span:not(.status-badge) {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0.16rem 0.48rem;
}
.notification-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: end;
}
.notification-row-actions form {
  display: inline-flex;
}
.notification-channel-list,
.notification-preferences-grid {
  display: grid;
  gap: 0.65rem;
}
.notification-channel-state {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--muted);
  display: flex;
  gap: 0.55rem;
  min-height: 2.55rem;
  padding: 0 0.72rem;
}
.notification-channel-state[data-active="true"] {
  background: #e9f8ef;
  border-color: #c6ebd2;
  color: #168047;
}
.notification-channel-state span {
  color: var(--ink-soft);
  font-weight: 820;
}
.notification-updated-at {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.25rem;
  margin-top: 0.15rem;
  padding-top: 0.75rem;
}
.notification-updated-at span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}
.notification-updated-at strong {
  color: var(--ink);
  font-size: 0.9rem;
}
.notification-preference {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  cursor: pointer;
  display: grid;
  gap: 0.65rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
  padding: 0.72rem;
}
.notification-preference.is-locked {
  cursor: default;
}
.notification-preference input[type="checkbox"] {
  opacity: 0;
  position: absolute;
  pointer-events: none;
}
.notification-toggle-visual {
  background: var(--paper-soft);
  border: 1px solid var(--line-2);
  border-radius: 999px;
  display: inline-flex;
  height: 1.38rem;
  position: relative;
  width: 2.55rem;
}
.notification-toggle-visual::after {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 999px;
  box-shadow: 0 3px 8px rgba(28, 27, 46, 0.12);
  content: "";
  height: 1rem;
  left: 0.15rem;
  position: absolute;
  top: 0.12rem;
  transition: transform 160ms ease;
  width: 1rem;
}
.notification-preference input[type="checkbox"]:checked + .notification-toggle-visual {
  background: #177b7a;
  border-color: #177b7a;
}
.notification-preference input[type="checkbox"]:checked + .notification-toggle-visual::after {
  transform: translateX(1.16rem);
}
.notification-preference input[type="checkbox"]:focus-visible + .notification-toggle-visual {
  box-shadow: 0 0 0 3px rgba(23, 123, 122, 0.16);
}
.notification-preference input[type="checkbox"]:disabled + .notification-toggle-visual {
  opacity: 0.72;
}
.notification-preference-copy {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}
.notification-preference-copy strong {
  color: var(--ink);
  font-size: 0.88rem;
}
.notification-preference-copy span {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
}
.dashboard-title-row {
  align-items: start;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}
.dashboard-design-head {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) auto;
}
.dashboard-design-button {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  display: inline-flex;
  font-size: 0.9rem;
  font-weight: 850;
  gap: 0.45rem;
  justify-content: center;
  min-height: 2.65rem;
  padding: 0 0.95rem;
  text-decoration: none;
  white-space: nowrap;
}
.dashboard-design-button.primary {
  background: var(--g-brand);
  border-color: transparent;
  box-shadow: var(--sh-glow);
  color: #fff;
}
.dashboard-design-button:disabled,
.dashboard-design-button[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.56;
}
.dashboard-live-banner {
  align-items: center;
  background: linear-gradient(135deg, rgba(255, 77, 109, 0.08), rgba(176, 38, 255, 0.08));
  border: 1px solid rgba(255, 77, 109, 0.18);
  border-radius: var(--r-md);
  display: grid;
  gap: 1rem;
  grid-template-columns: auto minmax(0, 1fr) auto;
  padding: 1rem;
}
.dashboard-live-icon {
  align-items: center;
  background: linear-gradient(135deg, #ff4d6d, #b026ff);
  border-radius: var(--r-sm);
  box-shadow: 0 8px 18px rgba(255, 77, 109, 0.24);
  color: #fff;
  display: inline-flex;
  height: 2.75rem;
  justify-content: center;
  width: 2.75rem;
}
.dashboard-live-banner div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.dashboard-live-banner strong {
  color: var(--ink);
  font-size: 0.98rem;
  line-height: 1.35;
}
.dashboard-live-banner span:not(.dashboard-live-icon) {
  color: var(--muted);
  font: 700 0.78rem var(--f-mono);
}
.dashboard-live-banner a {
  align-items: center;
  background: var(--ink);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 0.86rem;
  font-weight: 850;
  justify-content: center;
  min-height: 2.45rem;
  padding: 0 0.85rem;
  text-decoration: none;
  white-space: nowrap;
}
.dashboard-title {
  color: var(--ink);
  font-size: clamp(1.85rem, 2.8vw, 2.45rem);
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.08;
  margin: 0;
}
.dashboard-sub {
  color: var(--muted);
  font-size: 0.95rem;
  line-height: 1.5;
  margin: 0.35rem 0 0;
}
.dashboard-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}
.dashboard-stats {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.dashboard-stats article {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.25rem;
  min-width: 0;
  padding: 0.9rem;
}
.dashboard-stats span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}
.dashboard-stats strong {
  color: var(--ink);
  font-size: 1.38rem;
  font-weight: 950;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-stats small {
  color: var(--muted);
}
.dashboard-product-summary {
  align-items: stretch;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(244, 238, 255, 0.72));
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 0.95fr) minmax(20rem, 1.05fr);
  padding: clamp(1rem, 2.4vw, 1.35rem);
}
.dashboard-product-copy {
  align-content: start;
  display: grid;
  gap: 0.55rem;
  min-width: 0;
}
.dashboard-product-copy h2 {
  color: var(--ink);
  font-size: clamp(1.42rem, 2.5vw, 1.92rem);
  font-weight: 950;
  letter-spacing: 0;
  line-height: 1.14;
  margin: 0;
}
.dashboard-product-copy p {
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
  max-width: 46rem;
}
.dashboard-route-actions {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-width: 0;
}
.dashboard-route-button {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  box-shadow: var(--sh-sm);
  color: var(--ink);
  display: grid;
  gap: 0.35rem;
  grid-template-rows: auto auto 1fr;
  min-height: 6rem;
  min-width: 0;
  padding: 0.9rem;
  touch-action: manipulation;
}
.dashboard-route-button svg {
  color: var(--violet-600);
  height: 1.5rem;
  width: 1.5rem;
}
.dashboard-route-button strong {
  font-size: 1.05rem;
  font-weight: 950;
  letter-spacing: 0;
}
.dashboard-route-button span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
}
.dashboard-route-button:hover,
.dashboard-route-button:focus-visible {
  border-color: var(--violet-200);
  box-shadow: var(--sh-md);
  transform: translateY(-1px);
}
.tabs {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 0.35rem;
  overflow-x: auto;
  padding-top: 0.25rem;
}
.tab {
  align-items: center;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--muted);
  display: inline-flex;
  font-weight: 800;
  gap: 0.45rem;
  min-height: 2.55rem;
  padding: 0 0.7rem;
  white-space: nowrap;
}
.tabs a.tab {
  text-decoration: none;
}
.tab.active {
  border-bottom-color: var(--violet-600);
  color: var(--ink);
}
.badge {
  align-items: center;
  background: var(--violet-50);
  border-radius: 999px;
  color: var(--violet-700);
  display: inline-flex;
  font-size: 0.68rem;
  font-weight: 900;
  min-width: 1.35rem;
  justify-content: center;
  padding: 0.15rem 0.4rem;
}
.badge.amber {
  background: rgba(255, 178, 59, 0.16);
  color: #8b5a00;
}
.session-filter-menu {
  position: relative;
}
.session-filter-menu summary {
  cursor: pointer;
  list-style: none;
  min-height: 2.75rem;
}
.session-filter-menu summary::-webkit-details-marker {
  display: none;
}
.session-filter-menu[open] summary {
  background: var(--violet-50);
  border-color: rgba(110, 60, 255, 0.22);
}
.session-filter-sheet {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-md);
  display: grid;
  gap: 0.85rem;
  min-width: min(22rem, calc(100vw - 2rem));
  padding: 1rem;
  position: absolute;
  right: 0;
  top: calc(100% + 0.5rem);
  z-index: 120;
}
.session-filter-sheet label {
  display: grid;
  gap: 0.35rem;
}
.session-filter-sheet label span {
  color: var(--ink-soft);
  font-size: 0.78rem;
  font-weight: 850;
}
.session-filter-sheet input,
.session-filter-sheet select {
  min-height: 2.75rem;
}
.session-filter-actions {
  align-items: center;
  display: flex;
  gap: 0.55rem;
  justify-content: flex-end;
}
.session-list-toolbar {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}
.session-list-toolbar .tabs {
  border-bottom: 0;
  padding-top: 0;
}
.session-list-toolbar .tab {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  min-height: 2.35rem;
  padding: 0 0.8rem;
}
.session-list-toolbar .tab.active {
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}
.session-list-toolbar .tab.active .badge {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}
.session-list {
  display: grid;
  gap: 0.5rem;
}
.admin-mobile-topbar {
  display: none;
}
.session-card {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 1rem;
  grid-template-columns: 0.25rem minmax(14rem, 1.55fr) minmax(8rem, 0.85fr) minmax(8rem, 0.75fr) minmax(5rem, 0.45fr) auto;
  min-width: 0;
  overflow: hidden;
  padding: 0.95rem;
}
.session-card .accent {
  align-self: stretch;
  background: var(--line-2);
  border-radius: 999px;
  min-height: 3.6rem;
}
.session-card.live {
  border-color: rgba(255, 77, 109, 0.25);
}
.session-card.live .accent {
  background: var(--live);
}
.session-card.scheduled .accent {
  background: var(--amber);
}
.session-card.past .accent {
  background: var(--violet-500);
  opacity: 0.45;
}
.session-card .ttl {
  align-items: center;
  color: var(--ink);
  display: flex;
  flex-wrap: wrap;
  font-size: 0.98rem;
  font-weight: 900;
  gap: 0.5rem;
  line-height: 1.3;
}
.session-card-primary {
  min-width: 0;
}
.session-card .meta {
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-size: 0.78rem;
  gap: 0.45rem;
  margin-top: 0.35rem;
}
.session-card .meta span:not(:last-child)::after {
  color: var(--line-2);
  content: "/";
  margin-left: 0.45rem;
}
.metric {
  color: var(--ink-soft);
  display: grid;
  font-size: 0.86rem;
  font-weight: 650;
  gap: 0.35rem;
  min-width: 0;
}
.metric .l {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}
.lang-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
}
.lang-chip {
  align-items: center;
  background: var(--violet-50);
  border: 1px solid rgba(110, 60, 255, 0.16);
  border-radius: 6px;
  color: var(--violet-700);
  display: inline-flex;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.7rem;
  font-weight: 900;
  height: 1.55rem;
  justify-content: center;
  min-width: 2rem;
  padding: 0 0.35rem;
}
.lang-chip.src {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
}
.lang-chip.muted {
  background: var(--paper-soft);
  border-color: var(--line);
  color: var(--muted);
}
.session-muted {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
}
.session-row-insight strong {
  color: var(--ink-soft);
  font-size: 0.86rem;
}
.session-row-insight small {
  color: var(--muted);
  font-size: 0.74rem;
  line-height: 1.35;
}
.session-row-state {
  display: flex;
  justify-content: flex-start;
}
.session-empty-card {
  align-items: center;
  background: linear-gradient(135deg, rgba(110, 60, 255, 0.08), rgba(255, 255, 255, 0.88)),
    var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: grid;
  gap: 0.65rem;
  justify-items: center;
  min-height: 18rem;
  padding: clamp(1.5rem, 4vw, 2.4rem);
  text-align: center;
}
.session-empty-card strong {
  color: var(--ink);
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 900;
}
.session-empty-card p {
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
  max-width: 32rem;
}
.pill-paused {
  background: rgba(255, 178, 59, 0.16);
  border-color: rgba(255, 178, 59, 0.3);
  color: #8b5a00;
}
.actions-cell {
  align-items: center;
  display: flex;
  gap: 0.45rem;
  justify-content: flex-end;
}
.session-delete-form {
  display: inline-flex;
  margin: 0;
}
.dashboard-footer-note {
  color: var(--muted);
  display: flex;
  font-size: 0.84rem;
  font-weight: 650;
  gap: 0.45rem;
  justify-content: center;
  padding-top: 0.5rem;
}
.dashboard-footer-note a {
  color: var(--violet-600);
  font-weight: 850;
}
.section-eyebrow {
  color: var(--violet-600);
  display: inline-flex;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.86rem;
  font-weight: 950;
  letter-spacing: 0;
  margin-bottom: 0.55rem;
  text-transform: uppercase;
}
.construction-hero,
.dashboard-hero {
  background: linear-gradient(135deg, rgba(110, 60, 255, 0.1), rgba(255, 255, 255, 0.78)),
    var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: clamp(1rem, 3vw, 1.35rem);
}
.construction-grid,
.dashboard-summary-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.construction-grid article,
.dashboard-focus-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.45rem;
  min-width: 0;
  padding: 1rem;
}
.dashboard-focus-panel h2 {
  color: var(--ink);
  font-size: 1.18rem;
  letter-spacing: 0;
  line-height: 1.2;
  margin: 0;
}
.dashboard-focus-panel p,
.dashboard-empty-state p {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
  margin: 0;
}
.dashboard-mini-stats {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  margin: 0;
}
.dashboard-mini-stats div {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.25rem;
  min-width: 0;
  padding: 0.7rem;
}
.dashboard-mini-stats dt {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}
.dashboard-mini-stats dd {
  color: var(--ink);
  font-size: 1.05rem;
  font-weight: 900;
  margin: 0;
  overflow-wrap: normal;
}
.dashboard-activity-list {
  display: grid;
  gap: 0.55rem;
}
.dashboard-activity-list a {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: inherit;
  display: grid;
  gap: 0.25rem;
  min-height: 3.4rem;
  padding: 0.75rem;
  text-decoration: none;
}
.dashboard-activity-list strong,
.dashboard-empty-state strong {
  color: var(--ink);
  font-weight: 900;
  line-height: 1.3;
}
.dashboard-activity-list span {
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
}
.dashboard-empty-state {
  background: var(--paper-soft);
  border: 1px dashed var(--line-2);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.45rem;
  padding: 0.85rem;
}
.dashboard-empty-state a,
.dashboard-inline-link {
  color: var(--violet-600);
  font-size: 0.88rem;
  font-weight: 850;
  text-decoration: none;
}
.dashboard-main-grid {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1.42fr) minmax(20rem, 0.82fr);
}
.dashboard-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 1rem;
  min-width: 0;
  padding: 1rem;
}
.dashboard-card-head {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}
.dashboard-card-head h2 {
  color: var(--ink);
  font-size: 1.12rem;
  font-weight: 950;
  line-height: 1.2;
  margin: 0;
}
.dashboard-card-head > a,
.dashboard-card-head > span {
  color: var(--muted);
  font: 800 0.74rem var(--f-mono);
  text-decoration: none;
}
.dashboard-design-activity-list,
.dashboard-side-stack,
.dashboard-shortcut-list,
.dashboard-service-list {
  display: grid;
  gap: 0.6rem;
}
.dashboard-design-activity-row {
  align-items: center;
  border: 1px solid transparent;
  border-radius: var(--r-sm);
  color: inherit;
  display: grid;
  gap: 0.8rem;
  grid-template-columns: 2.35rem minmax(0, 1fr) auto;
  min-height: 4rem;
  padding: 0.7rem 0.8rem;
  text-decoration: none;
}
.dashboard-design-activity-row:hover,
.dashboard-design-activity-row:focus-visible {
  background: var(--paper-soft);
  border-color: var(--line);
  outline: 0;
}
.dashboard-design-activity-row > span:first-child {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--violet-600);
  display: inline-flex;
  height: 2.35rem;
  justify-content: center;
  width: 2.35rem;
}
.dashboard-design-activity-row.live > span:first-child {
  color: var(--live);
}
.dashboard-design-activity-row.media > span:first-child {
  color: var(--mint-2);
}
.dashboard-design-activity-row.usage > span:first-child {
  color: var(--amber);
}
.dashboard-design-activity-row > span:nth-child(2) {
  display: grid;
  gap: 0.22rem;
  min-width: 0;
}
.dashboard-design-activity-row strong {
  color: var(--ink);
  font-size: 0.9rem;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-design-activity-row small {
  color: var(--muted);
  font: 700 0.74rem var(--f-mono);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-credit-total {
  display: grid;
  gap: 0.2rem;
}
.dashboard-credit-total strong {
  color: var(--ink);
  font-size: 2rem;
  line-height: 1;
}
.dashboard-credit-total span {
  color: var(--muted);
  font-size: 0.86rem;
}
.dashboard-credit-meter {
  background: var(--line);
  border-radius: 999px;
  height: 0.45rem;
  overflow: hidden;
}
.dashboard-credit-meter span {
  background: var(--g-brand);
  border-radius: inherit;
  display: block;
  height: 100%;
}
.dashboard-service-list div {
  align-items: center;
  border-top: 1px solid var(--line);
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  padding-top: 0.6rem;
}
.dashboard-service-list span {
  color: var(--ink-soft);
  font-size: 0.86rem;
  font-weight: 750;
}
.dashboard-service-list strong {
  color: var(--muted);
  font: 800 0.74rem var(--f-mono);
  white-space: nowrap;
}
.dashboard-shortcut-list a {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: flex;
  font-size: 0.98rem;
  font-weight: 900;
  gap: 0.65rem;
  min-height: 2.75rem;
  padding: 0 0.8rem;
  text-decoration: none;
}
.dashboard-shortcut-list svg {
  color: var(--violet-600);
  flex: 0 0 auto;
  height: 1.3rem;
  width: 1.3rem;
}
@media (max-width: 1120px) {
  .dashboard-main-grid,
  .dashboard-design-head,
  .dashboard-live-banner {
    grid-template-columns: 1fr;
  }
  .dashboard-live-banner a {
    justify-self: start;
  }
}
@media (max-width: 760px) {
  .dashboard-stats,
  .dashboard-route-actions,
  .dashboard-mini-stats {
    grid-template-columns: 1fr;
  }
  .dashboard-actions {
    justify-content: stretch;
  }
  .dashboard-design-button {
    width: 100%;
  }
  .topbar-notification-drawer {
    position: fixed;
    right: 1rem;
    top: 4.25rem;
  }
  .topbar-notification-row {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .topbar-notification-row time {
    grid-column: 2;
  }
}
.construction-grid strong {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 900;
}
.construction-grid span {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
}
.live-console-shell {
  background: #120f1f;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 0;
  box-shadow: var(--sh-md);
  color: #f8f6ff;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0;
  height: 100dvh;
  inset: 0;
  min-width: 0;
  overflow: hidden;
  position: fixed;
  z-index: 200;
}
.live-console-shell.playback {
  background: #151321;
}
.live-console-toast {
  background: rgba(28, 24, 44, 0.97);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-left-width: 3px;
  border-radius: var(--r-sm);
  bottom: 4.75rem;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.55);
  display: grid;
  gap: 0.22rem;
  max-width: 22rem;
  min-width: 16rem;
  padding: 0.8rem 1rem;
  position: absolute;
  right: 1.25rem;
  z-index: 300;
}
.live-console-toast strong {
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 850;
}
.live-console-toast span {
  color: rgba(248, 246, 255, 0.68);
  font-size: 0.8rem;
  line-height: 1.4;
}
.live-console-toast-success {
  border-left-color: #4ade80;
}
.live-console-toast-danger {
  border-left-color: #f87171;
}
.live-console-toast-neutral {
  border-left-color: rgba(255, 255, 255, 0.3);
}
.live-console-top {
  align-items: center;
  background: rgba(255, 255, 255, 0.04);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(13rem, 1fr) auto minmax(12rem, 1fr);
  padding: 0.9rem 1rem;
}
.live-console-brand,
.live-console-status,
.live-console-top-actions,
.live-bottom-actions,
.live-mini-grid,
.live-feed-tools {
  align-items: center;
  display: flex;
}
.live-console-brand {
  gap: 0.75rem;
  min-width: 0;
}
.live-console-brand div,
.live-bottom-summary,
.live-panel-head {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
}
.live-console-brand .brand-mark {
  height: 2.3rem;
  width: 2.3rem;
}
.live-console-brand strong,
.live-console-status strong,
.live-panel-head strong,
.live-feed-head h1,
.live-bottom-summary strong {
  color: #ffffff;
}
.live-console-brand span,
.live-console-status span,
.live-console-pill,
.live-panel p,
.live-panel small,
.live-bottom-summary span,
.live-activity-list,
.live-feed-head span,
.live-transcript-card span,
.live-translation-card span,
.live-translation-card small {
  color: rgba(248, 246, 255, 0.66);
}
.live-console-status {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  gap: 0.55rem;
  justify-content: center;
  min-height: 2.5rem;
  padding: 0 0.85rem;
  white-space: nowrap;
}
.live-dot {
  background: #a7a0b8;
  border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3);
  height: 0.65rem;
  width: 0.65rem;
}
.live-dot.connected {
  background: var(--mint);
  box-shadow: 0 0 0 0.35rem rgba(0, 184, 158, 0.14);
}
.live-dot.connecting,
.live-dot.reconnecting,
.live-dot.degraded {
  background: var(--amber);
  box-shadow: 0 0 0 0.35rem rgba(255, 178, 59, 0.13);
}
.live-dot.ended {
  background: var(--live);
}
.live-console-top-actions {
  gap: 0.6rem;
  justify-content: flex-end;
}
.live-console-pill {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 850;
  padding: 0.46rem 0.7rem;
}
.live-console-pill.review {
  background: rgba(0, 184, 158, 0.14);
  border-color: rgba(0, 184, 158, 0.28);
  color: #d9fff8;
}
.live-console-grid {
  display: grid;
  grid-template-columns: minmax(18rem, 22rem) minmax(0, 1fr) minmax(16rem, 20rem);
  min-height: 0;
  overflow: hidden;
}
.live-console-grid.no-audience {
  grid-template-columns: minmax(20rem, 25rem) minmax(0, 1fr);
}
.live-console-rail,
.live-feed-panel {
  display: grid;
  gap: 0.85rem;
  min-width: 0;
  padding: 0.9rem;
}
.live-console-rail {
  align-content: start;
  background: rgba(255, 255, 255, 0.03);
  overflow: auto;
}
.live-console-rail:first-child {
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}
.live-console-rail:last-child {
  border-left: 1px solid rgba(255, 255, 255, 0.1);
}
.legacy-audience-link-list {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: grid;
  gap: 0.5rem;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
}
.legacy-audience-link-list > strong {
  color: #ffffff;
  font-size: 0.82rem;
}
.legacy-audience-link-list a {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  color: #ffffff;
  display: grid;
  gap: 0.25rem;
  min-width: 0;
  padding: 0.65rem;
  text-decoration: none;
}
.legacy-audience-link-list a:hover,
.legacy-audience-link-list a:focus-visible {
  background: rgba(255, 255, 255, 0.1);
  outline: 2px solid rgba(156, 201, 255, 0.45);
  outline-offset: 2px;
}
.legacy-audience-link-list small {
  color: rgba(248, 246, 255, 0.62);
  overflow-wrap: anywhere;
}
.live-panel {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--r-md);
  display: grid;
  gap: 0.8rem;
  min-width: 0;
  overflow: visible;
  padding: 0.9rem;
}
.live-panel.source {
  background: linear-gradient(145deg, rgba(110, 60, 255, 0.24), rgba(255, 75, 170, 0.12));
}
.live-console-shell.playback .live-panel.source {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.04));
}
.live-panel-head {
  grid-template-columns: 1fr;
}
.live-panel-head span,
.live-feed-head span {
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}
.live-panel-head strong {
  font-size: 1rem;
  line-height: 1.2;
}
.live-panel p {
  font-size: 0.84rem;
  line-height: 1.5;
  margin: 0;
}
.audio-meter {
  align-items: end;
  display: grid;
  gap: 0.35rem;
  grid-template-columns: repeat(6, 1fr);
  height: 4.4rem;
}
.audio-meter span {
  background: linear-gradient(180deg, #ffffff, var(--mint));
  border-radius: 999px;
  min-height: 0.5rem;
}
.session-review-summary {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.28rem;
  padding: 0.8rem;
}
.session-review-summary strong {
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 900;
}
.session-review-summary span {
  color: rgba(248, 246, 255, 0.64);
  font-size: 0.78rem;
  line-height: 1.45;
}
.live-mini-grid {
  gap: 0.5rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.live-soft-button,
.live-feed-tools button,
.live-action {
  border: 0;
  border-radius: var(--r-sm);
  cursor: pointer;
  font-weight: 850;
}
.live-soft-button {
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  min-height: 2.25rem;
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 0 0.7rem;
  text-align: center;
}
.live-language-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.live-language-list span {
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  color: #ffffff;
  font-size: 0.76rem;
  font-weight: 850;
  padding: 0.35rem 0.55rem;
}
.live-feed-panel {
  background: radial-gradient(circle at 18% 0, rgba(110, 60, 255, 0.14), transparent 36%),
    #181424;
  color: #ffffff;
  grid-template-rows: minmax(0, 1fr);
  overflow: hidden;
  padding: 1rem 1.1rem 0;
}
.source-language-device,
.voice-target-card {
  align-items: center;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.7rem;
  grid-template-columns: auto minmax(0, 1fr) auto;
  padding: 0.75rem;
}
.source-language-device > div,
.voice-target-card > div {
  min-width: 0;
}
.language-globe,
.voice-avatar {
  align-items: center;
  background: linear-gradient(135deg, var(--violet-600), var(--magenta));
  border-radius: 50%;
  color: #ffffff;
  display: inline-flex;
  font-size: 0.72rem;
  font-weight: 950;
  height: 2.1rem;
  justify-content: center;
  width: 2.1rem;
}
.source-language-device strong,
.voice-target-card strong {
  color: #ffffff;
  display: block;
  font-size: 0.88rem;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.source-language-device span,
.voice-target-card span {
  color: rgba(248, 246, 255, 0.62);
  font-size: 0.76rem;
  overflow-wrap: anywhere;
}
.source-language-device .chevron {
  color: rgba(248, 246, 255, 0.5);
  font-size: 0.78rem;
  font-weight: 900;
}
.voice-target-list {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--r-sm);
  display: grid;
  overflow: hidden;
}
.voice-target-row {
  align-items: center;
  display: grid;
  gap: 0.55rem;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 0.65rem 0.7rem;
}
.voice-target-row + .voice-target-row {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.voice-target-left {
  align-items: center;
  display: flex;
  gap: 0.65rem;
  min-width: 0;
}
.voice-target-left div {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}
.voice-target-left strong {
  color: #ffffff;
  font-size: 0.84rem;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.voice-target-left span {
  color: rgba(248, 246, 255, 0.58);
  font-size: 0.73rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.voice-toggle {
  background: rgba(255, 255, 255, 0.16);
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  height: 1.25rem;
  position: relative;
  width: 2.15rem;
}
.voice-toggle::after {
  background: #ffffff;
  border-radius: 50%;
  content: "";
  height: 0.92rem;
  left: 0.17rem;
  position: absolute;
  top: 0.165rem;
  transition: left 140ms ease;
  width: 0.92rem;
}
.voice-toggle.on {
  background: var(--mint);
}
.voice-toggle.on::after {
  left: 1.06rem;
}
.voice-listen {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 850;
  min-height: 1.8rem;
  padding: 0 0.55rem;
  grid-column: 1 / -1;
  justify-self: start;
}
.voice-listen:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}
.mock-feed {
  display: grid;
  gap: 0.85rem;
  grid-template-rows: auto auto minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
}
.mock-feed-head {
  align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding-bottom: 0.75rem;
}
.mock-playback-button {
  background: #ffffff;
  border: 0;
  border-radius: var(--r-sm);
  color: var(--ink);
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 900;
  min-height: 2rem;
  padding: 0 0.75rem;
}
.mock-playback-button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.session-player {
  align-items: center;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.04)),
    rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--r-md);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
  display: grid;
  gap: 0.85rem;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
  padding: 0.8rem;
}
.session-player-main,
.session-player-skip button {
  border: 0;
  cursor: pointer;
  font-weight: 900;
}
.session-player-main {
  background: #ffffff;
  border-radius: 999px;
  color: var(--ink);
  min-height: 3.2rem;
  min-width: 4.8rem;
  padding: 0 1rem;
}
.session-player-main:disabled,
.session-player-skip button:disabled,
.session-player-progress:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.session-player-body {
  display: grid;
  gap: 0.45rem;
  min-width: 0;
}
.session-player-meta {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  min-width: 0;
}
.session-player-meta strong {
  color: #ffffff;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.8rem;
}
.session-player-meta span,
.session-player-caption {
  color: rgba(248, 246, 255, 0.62);
  font-size: 0.78rem;
}
.session-player-progress {
  --progress: 0%;
  appearance: none;
  background: linear-gradient(90deg, var(--mint) 0 var(--progress), rgba(255, 255, 255, 0.18) var(--progress) 100%);
  border: 0;
  border-radius: 999px;
  height: 0.44rem;
  min-height: 0;
  padding: 0;
  width: 100%;
}
.session-player-progress::-webkit-slider-thumb {
  appearance: none;
  background: #ffffff;
  border: 2px solid var(--mint);
  border-radius: 50%;
  height: 1rem;
  width: 1rem;
}
.session-player-progress::-moz-range-thumb {
  background: #ffffff;
  border: 2px solid var(--mint);
  border-radius: 50%;
  height: 1rem;
  width: 1rem;
}
.session-player-caption {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.session-player-skip {
  display: flex;
  gap: 0.35rem;
  grid-column: 1 / -1;
  justify-content: flex-end;
  min-width: 0;
}
.session-player-skip button {
  background: rgba(255, 255, 255, 0.1);
  border-radius: var(--r-sm);
  color: #ffffff;
  min-height: 2.2rem;
  padding: 0 0.7rem;
}
.mock-feed-head h4 {
  color: rgba(255, 255, 255, 0.55);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0;
  margin: 0;
  text-transform: uppercase;
}
.mock-feed-tabs {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 999px;
  display: flex;
  gap: 0.25rem;
  overflow-x: auto;
  padding: 0.2rem;
}
.mock-feed-tab {
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 800;
  min-height: 1.9rem;
  padding: 0 0.65rem;
  white-space: nowrap;
}
.mock-feed-tab.active {
  background: #ffffff;
  color: var(--ink);
}
.mock-feed-search {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.5);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.74rem;
  font-weight: 700;
  margin-left: auto;
  padding: 0.48rem 0.7rem;
}
.mock-transcript {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 0;
  overflow: auto;
  padding: 0 0 1.1rem;
  transition: transform 220ms ease;
}
.mock-feed.playing .mock-transcript {
  transform: translateY(-0.75rem);
}
.mock-transcript-entry {
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  display: grid;
  gap: 1rem;
  grid-template-columns: 4rem minmax(0, 1fr);
  padding: 0.9rem 0;
}
.mock-transcript-entry.live {
  background: linear-gradient(90deg, rgba(110, 60, 255, 0.1), transparent 50%);
  border-bottom: 0;
  border-radius: 10px;
  box-shadow: inset 3px 0 0 var(--violet-500);
  padding: 0.9rem 0.75rem;
}
.mock-transcript-entry.playback-active {
  background: linear-gradient(90deg, rgba(0, 184, 158, 0.16), rgba(110, 60, 255, 0.08) 65%, transparent);
  border-bottom-color: transparent;
  border-radius: 10px;
  box-shadow: inset 3px 0 0 var(--mint);
  padding: 0.9rem 0.75rem;
}
.mock-transcript-time {
  color: rgba(255, 255, 255, 0.42);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.74rem;
  font-weight: 700;
}
.mock-speaker {
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 900;
  margin-bottom: 0.45rem;
}
.mock-lang-stack {
  display: grid;
  gap: 0.5rem;
}
.mock-lang-line {
  display: grid;
  gap: 0.35rem;
}
.mock-lang-line span {
  color: rgba(255, 255, 255, 0.48);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 850;
  text-transform: uppercase;
}
.mock-lang-line p {
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.93rem;
  line-height: 1.5;
  margin: 0;
}
.mock-lang-line.source {
  border-left: 2px solid rgba(255, 255, 255, 0.22);
  padding-left: 0.65rem;
}
.mock-lang-line.translated {
  border-left: 2px solid rgba(0, 184, 158, 0.45);
  padding-left: 0.65rem;
}
.mock-lang-line.translated p {
  color: rgba(220, 255, 249, 0.88);
}
.mock-empty-entry {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--r-sm);
  color: rgba(255, 255, 255, 0.68);
  display: grid;
  gap: 0.45rem;
  margin-top: 1rem;
  padding: 1rem;
}
.mock-empty-entry strong {
  color: #ffffff;
}
.live-feed-head {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}
.live-feed-head h1 {
  color: var(--ink);
  font-size: clamp(1.6rem, 4vw, 2.5rem);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.05;
  margin: 0.2rem 0 0;
}
.live-feed-head span {
  color: var(--violet-600);
}
.live-feed-tools {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 999px;
  gap: 0.2rem;
  padding: 0.25rem;
}
.live-feed-tools button {
  background: transparent;
  color: var(--muted);
  min-height: 2rem;
  padding: 0 0.75rem;
}
.live-feed-tools button.active {
  background: var(--ink);
  color: #ffffff;
}
.live-feed-list {
  align-content: start;
  display: grid;
  gap: 0.8rem;
  overflow: auto;
  padding-right: 0.15rem;
}
.live-artifact-grid {
  display: grid;
  gap: 0.7rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.live-artifact-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.25rem;
  min-width: 0;
  padding: 0.85rem;
}
.live-artifact-card span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}
.live-artifact-card strong {
  color: var(--ink);
  font-weight: 950;
}
.live-artifact-card small {
  color: var(--muted);
  line-height: 1.35;
}
.live-artifact-card.s2t {
  border-color: rgba(110, 60, 255, 0.24);
}
.live-artifact-card.translation {
  border-color: rgba(0, 184, 158, 0.22);
}
.live-artifact-card.voiceover {
  border-color: rgba(255, 75, 170, 0.22);
}
.live-artifact-card.recording {
  border-color: rgba(255, 178, 59, 0.28);
}
.live-empty,
.live-transcript-card,
.live-translation-card {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 0.65rem;
  padding: 1rem;
}
.live-empty strong,
.live-transcript-card strong,
.live-translation-card strong {
  color: var(--ink);
  font-weight: 900;
}
.live-empty span,
.live-transcript-card span,
.live-translation-card span,
.live-translation-card small {
  color: var(--muted);
}
.live-transcript-card div,
.live-translation-card div {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.live-transcript-card p,
.live-translation-card p {
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.55;
  margin: 0;
}
.live-transcript-card.partial {
  background: var(--violet-50);
  border-color: rgba(110, 60, 255, 0.2);
}
.live-translation-card {
  border-color: rgba(0, 184, 158, 0.22);
}
.qr-tile {
  aspect-ratio: 1;
  background: linear-gradient(90deg, #ffffff 10px, transparent 10px) 0 0 / 28px 28px,
    linear-gradient(#ffffff 10px, transparent 10px) 0 0 / 28px 28px,
    rgba(255, 255, 255, 0.12);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.5rem;
  grid-template-columns: repeat(2, 1fr);
  padding: 0.8rem;
}
.qr-tile span {
  background: rgba(18, 15, 31, 0.8);
  border-radius: 4px;
}
.audience-qr-list {
  display: grid;
  gap: 0.75rem;
}
.audience-qr-card {
  align-items: center;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 5.75rem minmax(0, 1fr);
  padding: 0.65rem;
}
.audience-qr-card img,
.audience-qr-card .qr-tile {
  height: 5.1rem;
  width: 5.1rem;
}
.audience-qr-card div {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.audience-qr-card strong {
  color: #ffffff;
  font-weight: 900;
}
.audience-qr-card span,
.audience-qr-card small {
  color: rgba(248, 246, 255, 0.66);
  font-size: 0.78rem;
}
.audience-qr-card a {
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 850;
}
.audience-qr-empty {
  background: rgba(255, 255, 255, 0.06);
  border: 1px dashed rgba(255, 255, 255, 0.16);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.6rem;
  padding: 0.85rem;
}
.audience-qr-empty strong {
  color: #ffffff;
  font-weight: 900;
}
.audience-qr-empty span,
.audience-qr-empty small {
  color: rgba(248, 246, 255, 0.68);
  font-size: 0.84rem;
  line-height: 1.45;
}
.audience-qr-empty form {
  margin-top: 0.2rem;
}
.audience-copy-button {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  color: #ffffff;
  cursor: pointer;
  font-size: 0.76rem;
  font-weight: 850;
  min-height: 1.9rem;
  padding: 0 0.65rem;
  width: fit-content;
}
.live-recorder {
  display: grid;
  gap: 0.45rem;
}
.live-recorder button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.audience-bars {
  display: grid;
  gap: 0.65rem;
}
.audience-bars div {
  display: grid;
  gap: 0.35rem;
}
.audience-bars span {
  color: rgba(248, 246, 255, 0.75);
  font-size: 0.78rem;
  font-weight: 800;
}
.audience-bars i {
  background: linear-gradient(90deg, var(--mint), var(--magenta));
  border-radius: 999px;
  display: block;
  height: 0.45rem;
}
.live-activity-list {
  display: grid;
  font-size: 0.8rem;
  gap: 0.55rem;
  line-height: 1.45;
  list-style: none;
  margin: 0;
  padding: 0;
}
.live-activity-list li {
  border-left: 2px solid rgba(255, 255, 255, 0.18);
  padding-left: 0.55rem;
}
.live-console-bottom {
  align-items: center;
  background: rgba(255, 255, 255, 0.06);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: block;
  padding: 0.85rem 1rem;
}
.live-bottom-summary span {
  font-size: 0.86rem;
  line-height: 1.45;
}
.live-bottom-actions {
  flex-wrap: wrap;
  gap: 0.55rem;
  justify-content: flex-end;
}
.live-action {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.4rem;
  padding: 0 0.85rem;
  text-decoration: none;
}
.live-action.primary {
  background: #ffffff;
  color: var(--ink);
}
.live-action.danger {
  background: rgba(255, 77, 109, 0.18);
  border-color: rgba(255, 77, 109, 0.3);
  color: #ffd7df;
}
.live-output-modal {
  position: relative;
}
.live-output-modal-backdrop {
  background: rgba(5, 3, 14, 0.72);
  border: 0;
  cursor: default;
  inset: 0;
  position: fixed;
  z-index: 88;
}
.live-output-modal-panel {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: 0 24px 80px rgba(5, 3, 14, 0.36);
  color: var(--ink);
  display: grid;
  gap: 1rem;
  left: 50%;
  max-height: min(86dvh, 52rem);
  max-width: min(58rem, calc(100vw - 2rem));
  overflow: auto;
  padding: 1rem;
  position: fixed;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  z-index: 89;
}
.live-output-modal-panel > .panel {
  border: 0;
  box-shadow: none;
  padding: 0;
}
.live-output-modal-head {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding-bottom: 0.8rem;
}
.live-output-modal-head div {
  display: grid;
  gap: 0.2rem;
}
.live-output-modal-head span {
  color: var(--violet-600);
  font: 900 0.72rem var(--f-mono);
  text-transform: uppercase;
}
.live-output-modal-head strong {
  color: var(--ink);
  font-size: 1.25rem;
  font-weight: 950;
}
.live-output-modal-head .live-action {
  background: var(--paper-soft);
  border-color: var(--line);
  color: var(--ink);
}
.session-output-add-card {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.85rem;
  padding: 1rem;
}
.session-output-add-card[data-empty="true"] p {
  color: var(--ink-muted);
  margin: 0;
}
.session-output-add-head {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}
.session-output-add-head div,
.session-output-add-detail,
.session-output-add-card label {
  display: grid;
  gap: 0.35rem;
}
.session-output-add-head span,
.session-output-add-card label > span {
  color: var(--ink-muted);
  font-size: 0.78rem;
  font-weight: 850;
}
.session-output-language-search {
  max-width: 28rem;
}
.session-output-add-grid {
  display: grid;
  gap: 0.8rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.session-output-add-detail {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 0.85rem;
}
.session-output-add-detail > span {
  color: var(--ink-muted);
  font-size: 0.88rem;
}
.session-output-add-warning {
  color: var(--danger);
}
.session-output-add-submit {
  align-items: center;
  background: var(--ink);
  border: 1px solid var(--ink);
  border-radius: var(--r-sm);
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-weight: 850;
  justify-content: center;
  min-height: 2.6rem;
  padding: 0.65rem 0.95rem;
}
.session-output-add-submit:disabled {
  background: var(--paper);
  border-color: var(--line);
  color: var(--ink-muted);
  cursor: not-allowed;
}
.session-output-active-list {
  display: grid;
  gap: 0.5rem;
}
@media (max-width: 720px) {
  .session-output-add-head {
    align-items: stretch;
    flex-direction: column;
  }
  .session-output-add-grid {
    grid-template-columns: 1fr;
  }
}
.live-bottom-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: center;
}
.live-bottom-nav a,
.live-bottom-nav button {
  align-items: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  color: rgba(248, 246, 255, 0.82);
  cursor: pointer;
  display: inline-flex;
  font-size: 0.82rem;
  font-weight: 850;
  gap: 0.35rem;
  min-height: 2.75rem;
  padding: 0.55rem 0.85rem;
  text-decoration: none;
  touch-action: manipulation;
}
.live-bottom-nav a:hover,
.live-bottom-nav a.active,
.live-bottom-nav button:hover,
.live-bottom-nav button.active,
.live-bottom-nav button[aria-expanded="true"] {
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.24);
  color: #ffffff;
}
.live-bottom-nav-group {
  position: relative;
}
.live-bottom-submenu {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  bottom: calc(100% + 0.6rem);
  box-shadow: var(--sh-md);
  display: grid;
  gap: 0.2rem;
  left: 50%;
  min-width: 12rem;
  padding: 0.45rem;
  position: absolute;
  transform: translateX(-50%);
  z-index: 220;
}
.live-bottom-submenu::after {
  background: #ffffff;
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  bottom: -0.36rem;
  content: "";
  height: 0.65rem;
  left: 50%;
  position: absolute;
  transform: translateX(-50%) rotate(45deg);
  width: 0.65rem;
}
.live-bottom-submenu a {
  background: transparent;
  border-color: transparent;
  border-radius: 8px;
  color: var(--ink-soft);
  justify-content: flex-start;
  min-height: 2.55rem;
  width: 100%;
}
.live-bottom-submenu a:hover,
.live-bottom-submenu a.active {
  background: var(--violet-50);
  color: var(--violet-700);
}
.new-session-shell {
  align-items: start;
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 24rem);
}
.new-session-panel,
.new-session-preview {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-md);
}
.new-session-panel {
  display: grid;
  gap: 1.25rem;
  padding: clamp(1rem, 3vw, 1.5rem);
}
.new-session-shell.read-only .choice-card,
.new-session-shell.read-only .option-card {
  cursor: default;
}
.new-session-shell.read-only input:disabled,
.new-session-shell.read-only select:disabled,
.new-session-shell.read-only button:disabled {
  cursor: not-allowed;
}
.new-session-hero {
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 0.65rem;
  padding-bottom: 1.1rem;
}
.new-session-hero h1 {
  color: var(--ink);
  font-size: clamp(2rem, 5vw, 3.35rem);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.02;
  margin: 0;
}
.new-session-hero p,
.new-session-preview p {
  color: var(--muted);
  font-size: 0.96rem;
  line-height: 1.62;
  margin: 0;
  max-width: 44rem;
}
.wizard-form,
.wizard-step,
.wizard-step-body {
  display: grid;
  gap: 1rem;
}
.wizard-step {
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 1rem;
}
.wizard-step-head {
  align-items: start;
  display: grid;
  gap: 0.85rem;
  grid-template-columns: 2.4rem minmax(0, 1fr);
}
.step-num {
  align-items: center;
  background: var(--ink);
  border-radius: var(--r-sm);
  color: #ffffff;
  display: inline-flex;
  font-weight: 900;
  height: 2.4rem;
  justify-content: center;
  width: 2.4rem;
}
.wizard-step-head span:not(.step-num) {
  color: var(--violet-600);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}
.wizard-step-head h2 {
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.15;
  margin: 0.18rem 0;
}
.wizard-step-head p {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.55;
  margin: 0;
}
.provider-grid,
.choice-grid,
.option-grid {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.provider-card,
.choice-card,
.option-card,
.wizard-callout,
.preview-device {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
}
.provider-card {
  align-items: center;
  background: var(--paper-soft);
  display: flex;
  gap: 0.8rem;
  justify-content: space-between;
  padding: 0.85rem;
}
.provider-card.ready {
  background: rgba(0, 184, 158, 0.08);
  border-color: rgba(0, 184, 158, 0.2);
}
.provider-card div {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}
.provider-card strong,
.wizard-callout strong,
.language-picker-head strong,
.wizard-submit-row strong,
.choice-card strong,
.option-card strong {
  color: var(--ink);
  font-weight: 900;
}
.provider-card span,
.wizard-callout span,
.wizard-submit-row span,
.choice-card span,
.option-card small,
.wizard-field small {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.45;
}
.wizard-callout {
  align-items: center;
  background: linear-gradient(135deg, #fbf7ff, #ffffff);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1rem;
}
.wizard-callout-warning {
  background: #fff8ed;
  border-color: #f2c37b;
}
.wizard-callout div,
.wizard-submit-row div {
  display: grid;
  gap: 0.25rem;
}
.cloned-voice-selector {
  align-items: start;
}
.cloned-voice-fields {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: min(100%, 28rem);
}
.cloned-voice-fields label {
  color: var(--ink-soft);
  display: grid;
  font-size: 0.78rem;
  font-weight: 900;
  gap: 0.45rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.wizard-field {
  display: grid;
  gap: 0.45rem;
}
.wizard-field label {
  color: var(--ink-soft);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.choice-card,
.option-card,
.language-choice {
  cursor: pointer;
  display: grid;
  gap: 0.35rem;
  padding: 0.9rem;
}
.choice-card,
.language-choice,
.option-card {
  background: var(--paper);
}
.choice-card.active,
.language-choice.active,
.option-card.active {
  background: var(--violet-50);
  border-color: rgba(110, 60, 255, 0.28);
  box-shadow: 0 0 0 1px rgba(110, 60, 255, 0.08);
}
.choice-card input,
.language-choice input,
.option-card input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.meeting-grid,
.language-layout {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.language-layout {
  align-items: start;
  grid-template-columns: 1fr;
}
.language-layout.compact {
  grid-template-columns: 1fr;
}
.source-language-card {
  background: linear-gradient(135deg, #fbf7ff, #ffffff);
  border: 1px solid rgba(110, 60, 255, 0.18);
  border-radius: var(--r-md);
  display: grid;
  gap: 0.85rem;
  min-width: 0;
  padding: 0.95rem;
}
.source-language-head {
  display: grid;
  gap: 0.25rem;
}
.source-language-head span {
  color: var(--violet-600);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}
.source-language-head strong {
  color: var(--ink);
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1.1;
}
.source-language-head small {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.75rem;
}
.source-language-grid {
  display: grid;
  gap: 0.45rem;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  max-height: 12.5rem;
  overflow: auto;
}
.source-language-option {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink-soft);
  display: flex;
  justify-content: space-between;
  min-height: 2.5rem;
  min-width: 0;
  padding: 0.45rem 0.6rem;
  text-align: left;
}
.source-language-option span {
  color: var(--ink);
  font-weight: 850;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.source-language-option small {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 900;
}
.source-language-option.active {
  background: var(--ink);
  border-color: var(--ink);
}
.source-language-option.active span,
.source-language-option.active small {
  color: #ffffff;
}
.language-picker {
  display: grid;
  gap: 0.7rem;
  min-width: 0;
}
.language-search {
  display: grid;
  gap: 0.65rem;
}
.language-search-input {
  color: var(--ink-soft);
  display: grid;
  font-size: 0.76rem;
  font-weight: 900;
  gap: 0.35rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.language-search-input input {
  min-height: 2.65rem;
}
.language-empty-state {
  background: var(--paper-soft);
  border: 1px dashed var(--line-2);
  border-radius: var(--r-sm);
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
  padding: 0.85rem;
}
.language-picker-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.language-picker-head span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}
.language-chip-grid {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(auto-fit, minmax(8.75rem, 1fr));
  max-height: 22rem;
  overflow: auto;
}
.language-choice {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  min-width: 0;
  overflow: hidden;
}
.language-choice.disabled {
  cursor: not-allowed;
  opacity: 0.45;
}
.language-choice span {
  color: var(--ink);
  font-weight: 900;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.language-choice small {
  color: var(--muted);
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
}
.option-card {
  grid-template-columns: auto minmax(0, 1fr);
}
.option-card strong,
.option-card small {
  grid-column: 2;
}
.toggle-ui {
  background: var(--line-2);
  border-radius: 999px;
  grid-row: 1 / span 2;
  height: 1.4rem;
  position: relative;
  width: 2.45rem;
}
.toggle-ui::after {
  background: var(--paper);
  border-radius: 50%;
  box-shadow: var(--sh-sm);
  content: "";
  height: 1.05rem;
  left: 0.18rem;
  position: absolute;
  top: 0.18rem;
  transition: left 120ms ease;
  width: 1.05rem;
}
.option-card.active .toggle-ui {
  background: var(--g-brand);
}
.option-card.active .toggle-ui::after {
  left: 1.22rem;
}
.wizard-submit-row {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1rem;
}
.new-session-preview {
  display: grid;
  gap: 0.85rem;
  padding: 1rem;
  position: sticky;
  top: 1.25rem;
}
.new-session-preview h2 {
  color: var(--ink);
  font-size: 1.55rem;
  font-weight: 900;
  letter-spacing: 0;
  margin: 0;
}
.preview-device {
  background: var(--g-night);
  color: #ffffff;
  display: grid;
  gap: 0.9rem;
  margin-top: 0.4rem;
  min-height: 18rem;
  padding: 1rem;
}
.preview-device-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.preview-device-head span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.82rem;
  font-weight: 800;
}
.preview-device-head strong {
  color: var(--mint);
}
.preview-caption {
  align-self: center;
  color: #ffffff;
  font-size: 1.55rem;
  font-weight: 900;
  line-height: 1.2;
}
.preview-languages {
  align-self: end;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.preview-languages span {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.78rem;
  font-weight: 800;
  padding: 0.32rem 0.6rem;
}
.summary-list {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  overflow: hidden;
}
.summary-row {
  align-items: start;
  background: var(--paper);
  display: grid;
  gap: 0.25rem;
  padding: 0.75rem;
}
.summary-row + .summary-row {
  border-top: 1px solid var(--line);
}
.summary-row span {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}
.summary-row strong {
  color: var(--ink);
  font-size: 0.93rem;
  line-height: 1.35;
}
.summary-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.summary-options span {
  background: rgba(0, 184, 158, 0.1);
  border: 1px solid rgba(0, 184, 158, 0.24);
  border-radius: 999px;
  color: #00735f;
  font-size: 0.75rem;
  font-weight: 900;
  padding: 0.34rem 0.58rem;
}
.audience-view {
  background: #fbfafe;
  color: var(--ink);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  height: 100dvh;
  inset: 0;
  overflow: hidden;
  position: fixed;
  z-index: 70;
}
.audience-view-top {
  align-items: center;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 1.1rem;
  justify-content: space-between;
  min-width: 0;
  padding: 0.85rem 1.5rem;
}
.audience-brand-row {
  align-items: center;
  display: flex;
  gap: 0.8rem;
  min-width: 0;
}
.audience-brand-row h1 {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.2;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.audience-top-meta {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.76rem;
  font-weight: 750;
  gap: 0.5rem;
  margin-top: 0.25rem;
}
.audience-status-pill {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  display: inline-flex;
  font-family: "Inter", "Segoe UI", ui-sans-serif, system-ui;
  font-size: 0.7rem;
  font-weight: 900;
  gap: 0.35rem;
  line-height: 1;
  padding: 0.3rem 0.55rem;
  text-transform: uppercase;
}
.audience-status-pill::before {
  background: var(--muted-2);
  border-radius: 50%;
  content: "";
  height: 0.38rem;
  width: 0.38rem;
}
.audience-status-pill.live {
  background: rgba(255, 77, 109, 0.1);
  border-color: rgba(255, 77, 109, 0.3);
  color: #c8214a;
}
.audience-status-pill.live::before {
  background: var(--live);
  box-shadow: 0 0 0 3px rgba(255, 77, 109, 0.16);
}
.audience-status-pill.waiting,
.audience-status-pill.reconnecting {
  background: rgba(255, 178, 59, 0.16);
  border-color: rgba(255, 178, 59, 0.3);
  color: #8b5a00;
}
.audience-status-pill.waiting::before,
.audience-status-pill.reconnecting::before {
  background: var(--amber);
}
.audience-status-pill.denied,
.audience-status-pill.ended {
  background: var(--paper-soft);
  color: var(--muted);
}
.audience-output-selector {
  display: grid;
  gap: 0.5rem;
  margin-left: auto;
  max-width: min(100%, 38rem);
  min-width: min(100%, 24rem);
}
.audience-output-label {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.audience-language-tabs {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  display: flex;
  gap: 0.25rem;
  max-width: 100%;
  overflow-x: auto;
  padding: 0.25rem;
}
.audience-language-tabs button {
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: var(--ink-soft);
  cursor: pointer;
  flex: 0 0 auto;
  font-size: 0.82rem;
  font-weight: 850;
  min-height: 2.1rem;
  padding: 0 0.85rem;
}
.audience-language-tabs button.active {
  background: var(--ink);
  color: #ffffff;
}
.audience-output-tabs {
  align-items: stretch;
  display: grid;
  gap: 0.5rem;
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  margin-left: auto;
  max-width: min(100%, 34rem);
}
.audience-output-tabs button {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 0.65rem;
  color: var(--ink);
  cursor: pointer;
  display: grid;
  gap: 0.25rem;
  min-height: 3.2rem;
  padding: 0.65rem 0.8rem;
  text-align: left;
}
.audience-output-tabs button.active {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
}
.audience-output-tabs button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.audience-output-tabs span {
  color: inherit;
  font-size: 0.74rem;
  font-weight: 800;
}
.audience-output-tabs strong {
  color: inherit;
  font-size: 0.9rem;
}
.audience-mode-tabs {
  align-items: stretch;
  display: grid;
  gap: 0.4rem;
  grid-template-columns: repeat(auto-fit, minmax(7.25rem, 1fr));
}
.audience-mode-tabs button,
.audience-mode-unavailable {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  display: grid;
  gap: 0.18rem;
  min-height: 2.75rem;
  padding: 0.55rem 0.7rem;
  text-align: left;
}
.audience-mode-tabs button {
  cursor: pointer;
}
.audience-mode-tabs button.active {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
}
.audience-mode-tabs button.active.text {
  background: var(--violet-50);
  border-color: rgba(110, 60, 255, 0.2);
  color: var(--violet-700);
}
.audience-mode-tabs button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.audience-mode-tabs span,
.audience-mode-unavailable {
  color: inherit;
  font-size: 0.72rem;
  font-weight: 850;
}
.audience-mode-tabs strong {
  color: inherit;
  font-size: 0.82rem;
}
.audience-mode-unavailable {
  color: var(--muted);
}
.audience-message {
  align-items: center;
  background: var(--violet-50);
  border-bottom: 1px solid rgba(110, 60, 255, 0.18);
  color: var(--ink-soft);
  display: flex;
  gap: 0.65rem;
  padding: 0.65rem 1.5rem;
}
.audience-message strong {
  color: var(--violet-700);
  font-size: 0.86rem;
  font-weight: 900;
  white-space: nowrap;
}
.audience-message span {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.4;
}
.audience-view-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem);
  min-height: 0;
  overflow: hidden;
}
.audience-caption-panel,
.audience-side-panel {
  min-height: 0;
  position: relative;
}
.audience-caption-panel {
  overflow: auto;
}
.audience-caption-feed {
  display: flex;
  flex-direction: column;
  gap: 1.65rem;
  margin: 0 auto;
  max-width: 58rem;
  min-height: 100%;
  padding: clamp(2rem, 6vw, 3.5rem) clamp(1.25rem, 5vw, 3.75rem) 2rem;
}
.audience-now {
  align-items: center;
  color: var(--violet-600);
  display: inline-flex;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 900;
  gap: 0.5rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.audience-now .pulse {
  background: var(--live);
  border-radius: 50%;
  box-shadow: 0 0 0 0.25rem rgba(255, 77, 109, 0.16);
  height: 0.5rem;
  width: 0.5rem;
}
.audience-caption {
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: calc(var(--audience-caption-size, 38px) * 0.48);
  font-weight: 650;
  line-height: 1.42;
  padding-bottom: 1.2rem;
}
.audience-caption .speaker {
  color: var(--muted-2);
  display: block;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  line-height: 1.2;
  margin-bottom: 0.55rem;
  text-transform: uppercase;
}
.audience-caption.current {
  animation: audienceCaptionIn 240ms ease;
  border-bottom: 0;
  color: var(--ink);
  font-size: var(--audience-caption-size, 38px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.18;
  order: -1;
}
.audience-caption.current .speaker {
  color: var(--violet-600);
}
.audience-caption.provisional {
  opacity: 0.62;
}
.audience-caption.current.empty {
  color: var(--muted);
}
@keyframes audienceCaptionIn {
  from {
    opacity: 0;
    transform: translateY(-0.35rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.live-caption-composer {
  display: grid;
  gap: 1.1rem;
  min-height: 0;
}
.live-caption-active {
  animation: liveCaptionActiveIn 360ms cubic-bezier(0.2, 0.78, 0.22, 1);
  color: var(--ink);
  display: grid;
  gap: 0.65rem;
  min-height: clamp(9rem, 24vh, 15rem);
  padding-bottom: 0.35rem;
  transform-origin: top left;
  will-change: opacity, transform;
}
.live-caption-active.voice-active,
.live-caption-history-line.voice-active {
  background: rgba(110, 60, 255, 0.08);
  border-color: rgba(110, 60, 255, 0.26);
  border-radius: 8px;
  box-shadow: inset 0.24rem 0 0 rgba(110, 60, 255, 0.72);
  padding-left: 0.85rem;
}
.live-caption-active.voice-active .live-caption-meta::before,
.live-caption-history-line.voice-active .live-caption-meta::before {
  background: currentColor;
  border-radius: 50%;
  content: "";
  display: inline-block;
  height: 0.46rem;
  margin-right: 0.45rem;
  vertical-align: 0.05rem;
  width: 0.46rem;
}
.live-caption-active p,
.live-caption-history-line p {
  letter-spacing: 0;
  margin: 0;
  overflow-wrap: anywhere;
}
.live-caption-active p {
  font-size: var(--audience-caption-size, 38px);
  font-weight: 900;
  line-height: 1.18;
}
.live-caption-active.provisional p {
  color: rgba(18, 22, 37, 0.78);
}
.live-caption-active.empty p {
  color: var(--muted);
}
.live-caption-meta {
  color: var(--violet-600);
  display: block;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  line-height: 1.2;
  text-transform: uppercase;
}
.live-caption-caret {
  animation: liveCaptionCaret 900ms steps(2, start) infinite;
  border-right: 0.12em solid currentColor;
  margin-left: 0.12em;
}
.live-caption-history {
  display: grid;
  gap: 0.9rem;
}
.live-caption-history-line {
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  display: grid;
  gap: 0.45rem;
  padding-bottom: 0.95rem;
  transform-origin: top left;
  will-change: opacity, transform;
}
.live-caption-history-line:first-child {
  animation: liveCaptionCommitSlide 520ms cubic-bezier(0.18, 0.82, 0.24, 1);
}
.live-caption-history-line p {
  font-size: calc(var(--audience-caption-size, 38px) * 0.48);
  font-weight: 650;
  line-height: 1.42;
}
.host-live-caption-composer {
  --audience-caption-size: 28px;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  min-height: 0;
  overflow: auto;
  padding: clamp(1rem, 2vw, 1.35rem);
}
.host-live-caption-composer .live-caption-active {
  color: #ffffff;
  min-height: clamp(7rem, 22vh, 12rem);
}
.host-live-caption-composer .live-caption-active.provisional p {
  color: rgba(248, 246, 255, 0.78);
}
.host-live-caption-composer .live-caption-active.empty p,
.host-live-caption-composer .live-caption-history-line {
  color: rgba(248, 246, 255, 0.62);
}
.host-live-caption-composer .live-caption-meta {
  color: rgba(141, 122, 255, 0.95);
}
.host-live-caption-composer .live-caption-history-line {
  border-bottom-color: rgba(255, 255, 255, 0.07);
}
.host-live-caption-composer .live-caption-active.voice-active,
.host-live-caption-composer .live-caption-history-line.voice-active {
  background: rgba(141, 122, 255, 0.12);
  border-color: rgba(141, 122, 255, 0.3);
  box-shadow: inset 0.24rem 0 0 rgba(141, 122, 255, 0.82);
}
@keyframes liveCaptionCaret {
  0%,
  45% {
    opacity: 1;
  }
  46%,
  100% {
    opacity: 0;
  }
}
@keyframes liveCaptionActiveIn {
  from {
    opacity: 0;
    transform: translateY(-0.75rem) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes liveCaptionCommitSlide {
  from {
    opacity: 0.48;
    transform: translateY(-2.15rem) scale(1.035);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .live-caption-active,
  .live-caption-caret,
  .live-caption-history-line:first-child {
    animation: none;
  }
}
.audience-side-panel {
  background: var(--paper);
  border-left: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
  overflow: auto;
  padding: 1.35rem;
}
.audience-side-panel h2 {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  line-height: 1;
  margin: 0 0 0.75rem;
  text-transform: uppercase;
}
.audience-control {
  display: grid;
  gap: 0.75rem;
}
.audience-control .row {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.audience-control .row span {
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 850;
}
.audience-control .row strong {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
}
.audience-font-slider {
  background: var(--line);
  border-radius: 999px;
  height: 0.38rem;
  margin-top: 0.25rem;
  position: relative;
}
.audience-font-slider::before {
  background: var(--g-brand);
  border-radius: inherit;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 60%;
}
.audience-font-slider::after {
  background: #ffffff;
  border: 2px solid var(--violet-500);
  border-radius: 50%;
  box-shadow: 0 4px 8px rgba(110, 60, 255, 0.28);
  content: "";
  height: 1rem;
  left: calc(60% - 0.5rem);
  position: absolute;
  top: -0.32rem;
  width: 1rem;
}
.audience-range {
  accent-color: var(--violet-600);
  background: transparent;
  border: 0;
  border-radius: 0;
  cursor: pointer;
  min-height: 1.6rem;
  padding: 0;
  width: 100%;
}
.audience-range:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}
.audience-range::-webkit-slider-runnable-track {
  background: var(--line);
  border-radius: 999px;
  height: 0.42rem;
}
.audience-range::-webkit-slider-thumb {
  appearance: none;
  background: var(--ink);
  border: 2px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 4px 8px rgba(20, 8, 60, 0.18);
  height: 1rem;
  margin-top: -0.3rem;
  width: 1rem;
}
.audience-range::-moz-range-track {
  background: var(--line);
  border-radius: 999px;
  height: 0.42rem;
}
.audience-range::-moz-range-thumb {
  background: var(--ink);
  border: 2px solid #ffffff;
  border-radius: 50%;
  box-shadow: 0 4px 8px rgba(20, 8, 60, 0.18);
  height: 0.85rem;
  width: 0.85rem;
}
.audience-font-sample {
  align-items: end;
  color: var(--muted);
  display: flex;
  justify-content: space-between;
}
.audience-font-sample span {
  font-size: 0.78rem;
  font-weight: 850;
}
.audience-font-sample strong {
  color: var(--ink);
  font-size: 1.35rem;
  line-height: 1;
}
.audience-voice-card {
  align-items: center;
  background: linear-gradient(135deg, #fbf7ff, #ffffff);
  border: 1px solid rgba(110, 60, 255, 0.18);
  border-radius: 14px;
  display: flex;
  gap: 0.7rem;
  padding: 0.75rem;
}
.audience-voice-card .avatar {
  align-items: center;
  background: var(--g-brand);
  border-radius: 50%;
  color: #ffffff;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 0.82rem;
  font-weight: 900;
  height: 2.25rem;
  justify-content: center;
  width: 2.25rem;
}
.audience-voice-card div {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}
.audience-voice-card strong {
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.audience-voice-card span:not(.avatar) {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.audience-toggle {
  background: var(--line-2);
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  flex: 0 0 auto;
  height: 1.45rem;
  margin-left: auto;
  position: relative;
  width: 2.55rem;
}
.audience-toggle::after {
  background: var(--paper);
  border-radius: 50%;
  box-shadow: var(--sh-sm);
  content: "";
  height: 1.05rem;
  left: 0.2rem;
  position: absolute;
  top: 0.2rem;
  transition: left 120ms ease;
  width: 1.05rem;
}
.audience-toggle.on {
  background: var(--g-brand);
}
.audience-toggle.on::after {
  left: 1.3rem;
}
.audience-toggle:disabled {
  cursor: not-allowed;
}
.audience-audio-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.65rem;
}
.audience-audio-stats span {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 850;
  padding: 0.28rem 0.48rem;
}
.audience-replay-button {
  background: var(--ink);
  border: 1px solid var(--ink);
  border-radius: var(--r-sm);
  color: #ffffff;
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 900;
  min-height: 2.35rem;
  padding: 0 0.8rem;
  width: 100%;
}
.audience-replay-button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.audience-help-text {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.45;
  margin: 0.55rem 0 0;
}
.audience-section-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
}
.audience-section-head span {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 850;
  white-space: nowrap;
}
.audience-qa-panel {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.75rem;
  padding-top: 1.1rem;
}
.audience-qa-form {
  display: grid;
  gap: 0.6rem;
}
.audience-qa-form textarea {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--ink);
  font: 750 0.86rem/1.45 "Inter", "Segoe UI", ui-sans-serif, system-ui;
  min-height: 5.5rem;
  outline: none;
  padding: 0.75rem;
  resize: vertical;
  width: 100%;
}
.audience-qa-form textarea:focus {
  border-color: rgba(110, 60, 255, 0.48);
  box-shadow: 0 0 0 3px rgba(110, 60, 255, 0.12);
}
.audience-qa-form textarea:disabled {
  cursor: not-allowed;
  opacity: 0.62;
}
.audience-qa-share-option {
  align-items: center;
  color: var(--muted);
  display: inline-flex;
  font-size: 0.76rem;
  font-weight: 800;
  gap: 0.45rem;
  line-height: 1.35;
}
.audience-qa-share-option input {
  accent-color: var(--ink);
  flex: 0 0 auto;
  height: 1rem;
  width: 1rem;
}
.audience-qa-actions {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.audience-qa-actions span {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.68rem;
  font-weight: 850;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.audience-qa-actions button,
.audience-qa-archive-link {
  align-items: center;
  border-radius: var(--r-sm);
  display: inline-flex;
  font-size: 0.8rem;
  font-weight: 900;
  justify-content: center;
  min-height: 2.2rem;
  padding: 0 0.8rem;
  text-decoration: none;
}
.audience-qa-actions button {
  background: var(--ink);
  border: 1px solid var(--ink);
  color: #ffffff;
  cursor: pointer;
  flex: 0 0 auto;
}
.audience-qa-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
.audience-qa-archive-link {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  color: var(--ink);
  width: 100%;
}
.audience-qa-list {
  display: grid;
  gap: 0.55rem;
}
.audience-qa-list h3 {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.2;
  margin: 0;
}
.audience-qa-list article {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.35rem;
  padding: 0.7rem;
}
.audience-qa-list strong {
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1.35;
}
.audience-qa-list span {
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.45;
}
.audience-qa-list small {
  color: var(--muted-2);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.66rem;
  font-weight: 850;
}
.audience-disclosure {
  border-top: 1px solid var(--line);
  color: var(--muted);
  display: grid;
  font-size: 0.8rem;
  gap: 0.35rem;
  line-height: 1.5;
  margin-top: auto;
  padding-top: 1.1rem;
}
.audience-disclosure strong {
  color: var(--ink);
  font-weight: 900;
}
.audience-disclosure span,
.audience-disclosure small {
  color: var(--muted);
}
.audience-disabled-notice {
  align-content: center;
  align-items: center;
  background: rgba(255, 255, 255, 0.76);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(110, 60, 255, 0.16);
  border-radius: var(--r-md);
  box-shadow: var(--sh-md);
  display: grid;
  gap: 0.45rem;
  inset: 1.25rem;
  justify-items: center;
  padding: 1.2rem;
  position: absolute;
  text-align: center;
  z-index: 2;
}
.audience-disabled-notice strong {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 900;
}
.audience-disabled-notice span {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.5;
  max-width: 24rem;
}
.audience-caption-panel.disabled .audience-caption-feed,
.audience-side-panel.disabled > section {
  filter: grayscale(0.2);
  opacity: 0.26;
  pointer-events: none;
}
.audience-audio-dock {
  align-items: center;
  background: var(--paper);
  border-top: 1px solid var(--line);
  display: flex;
  gap: 1rem;
  min-height: 4.5rem;
  padding: 0.85rem 1.35rem;
}
.audience-audio-dock .play {
  align-items: center;
  background: var(--g-brand);
  border: 0;
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(110, 60, 255, 0.3);
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 0.95rem;
  font-weight: 900;
  height: 2.75rem;
  justify-content: center;
  letter-spacing: 0;
  width: 2.75rem;
}
.audience-audio-dock .play:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.audience-audio-dock .now {
  display: grid;
  flex: 1;
  gap: 0.15rem;
  min-width: 0;
}
.audience-audio-dock .now strong {
  color: var(--ink);
  font-size: 0.88rem;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.audience-audio-dock .now span,
.audience-audio-dock .volume-label {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 750;
}
.audience-audio-dock .volume {
  max-width: 8rem;
}
.audience-audio-dock.disabled {
  opacity: 0.72;
}
.technical-monitor {
  background: #f7f8fb;
  color: var(--ink);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  height: 100dvh;
  inset: 0;
  overflow: hidden;
  position: fixed;
  z-index: 70;
}
.technical-topbar {
  align-items: center;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  min-width: 0;
  padding: 0.9rem 1.35rem;
}
.technical-brand-row {
  align-items: center;
  display: flex;
  gap: 0.85rem;
  min-width: 0;
}
.technical-brand-row h1 {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.2;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.technical-meta-row {
  align-items: center;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.74rem;
  font-weight: 750;
  gap: 0.5rem;
  margin-top: 0.25rem;
}
.technical-status-pill {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  display: inline-flex;
  font-family: "Inter", "Segoe UI", ui-sans-serif, system-ui;
  font-size: 0.7rem;
  font-weight: 900;
  gap: 0.35rem;
  line-height: 1;
  padding: 0.3rem 0.55rem;
  text-transform: uppercase;
}
.technical-status-pill::before {
  background: var(--muted-2);
  border-radius: 50%;
  content: "";
  height: 0.38rem;
  width: 0.38rem;
}
.technical-status-pill.connected {
  background: rgba(0, 115, 95, 0.1);
  border-color: rgba(0, 115, 95, 0.24);
  color: #00735f;
}
.technical-status-pill.connected::before {
  background: #00a882;
  box-shadow: 0 0 0 3px rgba(0, 168, 130, 0.14);
}
.technical-status-pill.reconnecting,
.technical-status-pill.silence,
.technical-status-pill.waiting {
  background: rgba(255, 178, 59, 0.16);
  border-color: rgba(255, 178, 59, 0.3);
  color: #8b5a00;
}
.technical-status-pill.reconnecting::before,
.technical-status-pill.silence::before,
.technical-status-pill.waiting::before {
  background: var(--amber);
}
.technical-status-pill.error,
.technical-status-pill.denied,
.technical-status-pill.ended {
  background: rgba(255, 77, 109, 0.1);
  border-color: rgba(255, 77, 109, 0.22);
  color: #c8214a;
}
.technical-link-code {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 0.55rem;
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.74rem;
  font-weight: 800;
  max-width: 18rem;
  overflow: hidden;
  padding: 0.55rem 0.7rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.technical-system-message {
  align-items: center;
  background: rgba(255, 178, 59, 0.14);
  border-bottom: 1px solid rgba(255, 178, 59, 0.28);
  color: var(--ink-soft);
  display: flex;
  gap: 0.65rem;
  padding: 0.65rem 1.35rem;
}
.technical-system-message.denied,
.technical-system-message.ended {
  background: rgba(255, 77, 109, 0.08);
  border-color: rgba(255, 77, 109, 0.2);
}
.technical-system-message strong {
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 900;
  white-space: nowrap;
}
.technical-system-message span {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.4;
}
.technical-monitor-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
  padding: 1rem;
}
.technical-output-panel,
.technical-play-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  min-width: 0;
}
.technical-output-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}
.technical-section-head {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  padding: 0.85rem 1rem;
}
.technical-section-head span {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 900;
  text-transform: uppercase;
}
.technical-section-head strong {
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 900;
}
.technical-output-list {
  display: grid;
  gap: 0.55rem;
  overflow-y: auto;
  padding: 0.75rem;
}
.technical-output-list button {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  color: var(--ink);
  cursor: pointer;
  display: grid;
  gap: 0.2rem;
  min-height: 4.6rem;
  padding: 0.75rem;
  text-align: left;
}
.technical-output-list button.active {
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff;
}
.technical-output-list button:disabled {
  cursor: not-allowed;
  opacity: 0.52;
}
.technical-output-list span,
.technical-output-list em {
  color: inherit;
  font-size: 0.74rem;
  font-style: normal;
  font-weight: 800;
}
.technical-output-list strong {
  color: inherit;
  font-size: 0.95rem;
  font-weight: 950;
}
.technical-empty-state {
  align-items: center;
  border: 1px dashed var(--line);
  border-radius: 0.5rem;
  color: var(--muted);
  display: flex;
  font-size: 0.88rem;
  font-weight: 800;
  justify-content: center;
  min-height: 8rem;
}
.technical-play-panel {
  display: grid;
  gap: 1rem;
  grid-template-rows: auto auto auto auto minmax(3rem, auto);
  overflow: auto;
  padding: 1rem;
}
.technical-selected-output {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  display: grid;
  gap: 0.35rem;
  min-height: 9rem;
  padding: 1.1rem;
}
.technical-selected-output span {
  color: #00735f;
  font-size: 0.78rem;
  font-weight: 950;
  text-transform: uppercase;
}
.technical-selected-output h2 {
  color: var(--ink);
  font-size: clamp(1.6rem, 3vw, 2.7rem);
  font-weight: 950;
  line-height: 1.05;
  margin: 0;
}
.technical-selected-output p {
  color: var(--muted);
  font-size: 0.95rem;
  font-weight: 750;
  margin: 0;
}
.technical-state-rail {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.technical-state-rail span {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  min-height: 2.8rem;
  padding: 0.85rem 0.65rem;
  text-align: center;
}
.technical-state-rail span.active {
  background: rgba(0, 115, 95, 0.1);
  border-color: rgba(0, 115, 95, 0.25);
  color: #00735f;
}
.technical-player-row {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  display: flex;
  gap: 0.85rem;
  min-height: 4.75rem;
  padding: 0.8rem;
}
.technical-play-button {
  background: var(--ink);
  border: 0;
  border-radius: 0.5rem;
  color: #ffffff;
  cursor: pointer;
  font-size: 0.86rem;
  font-weight: 950;
  min-height: 2.8rem;
  min-width: 5.5rem;
  padding: 0 1rem;
}
.technical-play-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}
.technical-player-copy {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}
.technical-player-copy strong {
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 900;
}
.technical-player-copy span {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.technical-stream-list {
  border: 1px solid var(--line);
  border-radius: 0.75rem;
  display: grid;
  gap: 0.55rem;
  padding: 0.85rem;
}
.technical-stream-list > strong {
  color: var(--ink);
  font-size: 0.86rem;
  font-weight: 950;
}
.technical-stream-list a {
  border: 1px solid transparent;
  border-radius: 0.6rem;
  color: inherit;
  display: grid;
  gap: 0.2rem;
  min-height: 2.75rem;
  padding: 0.55rem 0.65rem;
  text-decoration: none;
}
.technical-stream-list a.active {
  background: var(--surface-muted);
  border-color: var(--line);
}
.technical-stream-list span {
  color: var(--ink);
  font-size: 0.84rem;
  font-weight: 900;
}
.technical-stream-list small {
  color: var(--muted);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.68rem;
  overflow-wrap: anywhere;
}
.technical-device-select {
  display: grid;
  gap: 0.45rem;
}
.technical-device-select span {
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 900;
  text-transform: uppercase;
}
.technical-device-select select {
  appearance: none;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  color: var(--ink);
  font-size: 0.9rem;
  font-weight: 800;
  min-height: 2.85rem;
  padding: 0 0.85rem;
}
.technical-device-select select:disabled {
  color: var(--muted);
  opacity: 0.7;
}
.technical-play-panel audio {
  width: 100%;
}
@media (max-width: 860px) {
  .technical-monitor {
    height: auto;
    min-height: 100dvh;
    overflow: auto;
    position: static;
  }
  .technical-topbar {
    align-items: flex-start;
    flex-direction: column;
  }
  .technical-link-code {
    max-width: 100%;
    width: 100%;
  }
  .technical-monitor-grid {
    grid-template-columns: 1fr;
    overflow: visible;
  }
  .technical-output-panel {
    max-height: none;
  }
  .technical-output-list {
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    overflow: visible;
  }
  .technical-state-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .technical-player-row {
    align-items: stretch;
    flex-direction: column;
  }
  .technical-play-button {
    width: 100%;
  }
}
.technical-monitor[data-layout="technical-listener"] {
  background: #f6f7f9;
  display: flex;
  flex-direction: column;
}
.technical-monitor[data-layout="technical-listener"] .technical-topbar {
  flex: 0 0 auto;
}
.technical-monitor[data-layout="technical-listener"] .technical-monitor-grid {
  align-content: center;
  display: grid;
  flex: 1 1 auto;
  grid-template-columns: minmax(0, 42rem);
  justify-content: center;
  min-height: 0;
  overflow: auto;
  padding: clamp(1rem, 4vw, 3rem);
}
.technical-monitor[data-layout="technical-listener"] .technical-play-panel {
  box-shadow: 0 1.25rem 3rem rgba(16, 24, 40, 0.08);
  gap: 1.15rem;
  grid-template-rows: auto auto auto auto;
  padding: clamp(1rem, 4vw, 1.6rem);
}
.technical-monitor[data-layout="technical-listener"] .technical-selected-output {
  background: transparent;
  border: 0;
  min-height: 0;
  padding: 0;
}
.technical-monitor[data-layout="technical-listener"] .technical-selected-output h2 {
  font-size: clamp(2rem, 8vw, 4.25rem);
  letter-spacing: 0;
}
.technical-monitor[data-layout="technical-listener"] .technical-output-list {
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  overflow: visible;
  padding: 0;
}
.technical-monitor[data-layout="technical-listener"] .technical-output-list button {
  min-height: 4.4rem;
}
.technical-monitor[data-layout="technical-listener"] .technical-player-row {
  align-items: center;
  background: var(--paper-soft);
}
.technical-monitor[data-layout="technical-listener"] .technical-play-button {
  min-width: 8rem;
}
.technical-monitor[data-layout="technical-listener"] audio {
  width: 100%;
}
@media (max-width: 720px) {
  .technical-monitor[data-layout="technical-listener"] {
    height: auto;
    min-height: 100dvh;
    overflow: auto;
    position: static;
  }
  .technical-monitor[data-layout="technical-listener"] .technical-monitor-grid {
    align-content: stretch;
    padding: 1rem;
  }
  .technical-monitor[data-layout="technical-listener"] .technical-play-panel {
    box-shadow: none;
  }
}
.volume-bar {
  background: var(--line);
  border-radius: 999px;
  height: 0.38rem;
  position: relative;
  width: 7rem;
}
.volume-bar::before {
  background: var(--ink);
  border-radius: inherit;
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 75%;
}
.volume-bar::after {
  background: var(--ink);
  border-radius: 50%;
  content: "";
  height: 0.85rem;
  left: calc(75% - 0.42rem);
  position: absolute;
  top: -0.24rem;
  width: 0.85rem;
}
.audience-archive-page {
  background: #fbfafe;
  color: var(--ink);
  min-height: 100dvh;
  padding: clamp(1rem, 4vw, 2.5rem);
}
.audience-archive-shell {
  display: grid;
  gap: 1.2rem;
  margin: 0 auto;
  max-width: 56rem;
}
.audience-archive-head {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  display: flex;
  gap: 0.9rem;
  padding: 1rem;
}
.audience-archive-head h1,
.audience-archive-shell > h1 {
  color: var(--ink);
  font-size: clamp(1.35rem, 4vw, 2.15rem);
  font-weight: 950;
  line-height: 1.12;
  margin: 0;
}
.audience-archive-head p,
.audience-archive-shell > p {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 750;
  line-height: 1.45;
  margin: 0.25rem 0 0;
}
.audience-archive-list {
  display: grid;
  gap: 0.85rem;
}
.audience-archive-list article,
.audience-archive-empty {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  padding: 1rem;
}
.audience-archive-list small {
  color: var(--violet-600);
  font-family: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}
.audience-archive-list h2 {
  color: var(--ink);
  font-size: 1.02rem;
  font-weight: 950;
  line-height: 1.3;
  margin: 0.4rem 0 0;
}
.audience-archive-list p,
.audience-archive-empty {
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 650;
  line-height: 1.55;
  margin: 0.45rem 0 0;
}
@media (max-width: 880px) {
  .hero-shell,
  .auth-page,
  .host-shell {
    grid-template-columns: 1fr;
  }
  .host-shell[data-collapsed="true"] {
    grid-template-columns: 1fr;
  }
  .host-side {
    gap: 0.75rem;
    max-height: none;
    max-width: 100%;
    overflow: visible;
    position: static;
    width: 100%;
  }
  .host-shell {
    gap: 0.75rem;
    overflow-x: hidden;
    padding: 0.75rem;
  }
  .host-side-card:first-child {
    border-radius: var(--r-md);
    gap: 0.7rem;
    padding: 0.75rem;
  }
  .host-shell[data-collapsed="true"] .host-side-card {
    padding: 0.75rem;
  }
  .host-shell[data-collapsed="true"] .brand-lockup {
    gap: 0.7rem;
    justify-content: flex-start;
  }
  .host-shell[data-collapsed="true"] .brand-lockup-text {
    clip: auto;
    clip-path: none;
    height: auto;
    overflow: hidden;
    position: static;
    white-space: nowrap;
    width: auto;
  }
  .host-shell[data-collapsed="true"] .host-side-header {
    display: flex;
    justify-items: initial;
  }
  .host-sidebar-toggle {
    display: none;
  }
  .host-mobile-menu-toggle {
    display: inline-flex;
  }
  .host-side-card[data-mobile-open="false"] > .host-side-nav-sections {
    display: none;
  }
  .provider-admin-card {
    gap: 0.7rem;
  }
  .provider-admin-card::before {
    display: none;
  }
  .provider-admin-card .sidebar-card-heading {
    align-items: center;
    display: flex;
    justify-content: space-between;
    min-height: 2.75rem;
    padding-top: 0;
  }
  .host-side-card.usage-meter,
  .host-side > section[data-tone] {
    display: none !important;
  }
  .host-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    width: 100%;
  }
  .host-side-nav-sections {
    max-width: 100%;
    overflow: hidden;
  }
  .host-nav::-webkit-scrollbar {
    display: none;
  }
  .host-nav a,
  .host-nav button {
    flex: 1 1 min(10rem, 100%);
    font-size: 0.82rem;
    justify-content: space-between;
    min-width: 0;
    padding: 0.58rem 0.7rem;
    white-space: nowrap;
    width: 100%;
  }
  .host-shell[data-collapsed="true"] .host-nav a,
  .host-shell[data-collapsed="true"] .host-nav button,
  .host-shell[data-collapsed="true"] .provider-admin-card .host-nav a,
  .host-shell[data-collapsed="true"] .provider-admin-card .host-nav button {
    justify-content: space-between;
    min-height: 2.55rem;
    padding: 0.58rem 0.7rem;
    width: auto;
  }
  .host-shell[data-collapsed="true"] .host-nav-item-main {
    gap: 0.65rem;
  }
  .host-shell[data-collapsed="true"] .host-nav-label,
  .host-shell[data-collapsed="true"] .host-nav-chevron {
    clip: auto;
    clip-path: none;
    height: auto;
    overflow: hidden;
    position: static;
    white-space: nowrap;
    width: auto;
  }
  .host-nav-group {
    display: flex;
    flex: 1 1 min(10rem, 100%);
    flex-wrap: wrap;
    gap: 0.25rem;
    min-width: 0;
  }
  .host-nav-submenu {
    border-left: 0;
    display: flex;
    flex: 1 1 100%;
    flex-wrap: wrap;
    margin: 0;
    min-width: 0;
    padding-left: 0;
  }
  .host-nav-submenu a {
    flex: 1 1 min(9rem, 100%);
  }
  .host-nav-flyout {
    display: none;
  }
  .dashboard-topbar,
  .dashboard-topbar[data-has-search="false"] {
    align-items: center;
    grid-template-areas: "crumbs user"
      "search search";
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .dashboard-topbar[data-has-search="false"] {
    grid-template-areas: "crumbs user";
  }
  .crumbs {
    grid-area: crumbs;
    min-width: 0;
    overflow: hidden;
  }
  .crumbs span,
  .crumbs strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .topbar-search-form {
    grid-area: search;
    width: 100%;
  }
  .dashboard-user {
    grid-area: user;
    justify-self: end;
  }
  .admin-mobile-topbar {
    display: grid;
  }
  .topbar-profile-menu {
    inset-inline-end: 0;
  }
  .media-list-filter-bar,
  .media-list-stats,
  .support-ticket-console,
  .support-ticket-detail-grid,
  .support-ticket-detail-meta,
  .work-filter-bar,
  .work-list-row {
    grid-template-columns: 1fr;
  }
  .support-ticket-form {
    grid-template-columns: 1fr;
  }
  .media-list-table {
    min-width: 46rem;
  }
  .work-row-actions {
    justify-content: flex-start;
  }
  .surface-split,
  .surface-two-col {
    grid-template-columns: 1fr;
  }
  .surface-row {
    align-items: start;
    grid-template-columns: 1fr;
  }
  .notification-overview-grid,
  .notification-center-grid,
  .notification-filter-bar,
  .notification-row,
  .host-page-intro {
    grid-template-columns: 1fr;
  }
  .host-page-intro-actions {
    justify-items: start;
  }
  .notification-row-heading,
  .notification-row-actions {
    align-items: flex-start;
    justify-content: flex-start;
  }
  .notification-row-heading {
    flex-direction: column;
  }
  .notification-row-heading time {
    white-space: normal;
  }
  .feature-inner {
    grid-template-columns: 1fr;
  }
  .marketing-nav .links {
    display: flex;
    gap: 0.65rem;
    margin-left: auto;
  }
  .marketing-nav .links a:not(.marketing-sign-in) {
    display: none;
  }
  .marketing-nav .marketing-sign-in {
    align-items: center;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: var(--r-sm);
    color: #ffffff;
    display: inline-flex;
    min-height: 2.75rem;
    padding: 0 0.85rem;
    white-space: nowrap;
  }
  .marketing-nav > .btn-link.primary {
    min-height: 2.75rem;
    padding: 0 0.85rem;
    white-space: nowrap;
  }
  .dashboard-topbar,
  .dashboard-product-summary,
  .dashboard-stats,
  .dashboard-summary-grid,
  .dashboard-mini-stats,
  .provider-admin-summary,
  .provider-admin-layout,
  .provider-flow-board,
  .provider-flow-slot-editor,
  .provider-add-provider-form,
  .provider-assignment-row,
  .provider-assignment-slot-form,
  .provider-chain-slot,
  .provider-catalog-grid,
  .provider-priority-fields,
  .provider-priority-row,
  .provider-priority-slot-form,
  .provider-row-main,
  .provider-field-list,
  .provider-form-grid,
  .construction-grid,
  .session-card,
  .live-console-top,
  .live-console-grid,
  .live-console-bottom,
  .live-artifact-grid,
  .audience-qr-card,
  .new-session-shell,
  .provider-grid,
  .choice-grid,
  .option-grid,
  .cloned-voice-fields,
  .meeting-grid,
  .language-layout,
  .language-chip-grid {
    grid-template-columns: 1fr;
  }
  .dashboard-title-row {
    align-items: stretch;
    flex-direction: column;
  }
  .dashboard-actions,
  .actions-cell {
    justify-content: flex-start;
  }
  .dashboard-route-actions {
    grid-template-columns: 1fr;
  }
  .session-filter-menu {
    position: static;
  }
  .session-filter-sheet {
    left: 0.75rem;
    max-height: min(26rem, calc(100dvh - 8rem));
    min-width: 0;
    overflow-y: auto;
    position: fixed;
    right: 0.75rem;
    top: 5rem;
    width: auto;
  }
  .session-filter-actions {
    align-items: stretch;
    flex-direction: column-reverse;
  }
  .session-filter-actions .btn-link,
  .session-filter-actions button,
  .dashboard-actions .btn-link,
  .dashboard-actions a,
  .dashboard-actions button {
    width: 100%;
  }
  .session-list-toolbar {
    align-items: stretch;
    flex-direction: column;
  }
  .session-tabs {
    border-bottom: 0;
    display: grid;
    gap: 0.45rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
    padding-top: 0;
  }
  .session-tabs .tab {
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    justify-content: center;
    min-width: 0;
    padding: 0 0.5rem;
  }
  .session-tabs .tab.active {
    background: var(--violet-50);
    border-color: rgba(110, 60, 255, 0.28);
  }
  .session-tabs .badge {
    flex: 0 0 auto;
  }
  .provider-admin-actions {
    justify-content: flex-start;
  }
  .provider-flow-toolbar,
  .provider-flow-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .provider-flow-actions button {
    width: 100%;
  }
  .provider-flow-credential-pool {
    position: static;
  }
  .provider-flow-steps {
    display: grid;
    gap: 0.85rem;
    overflow: visible;
  }
  .provider-flow-node {
    flex: initial;
    min-height: 0;
    width: 100%;
  }
  .provider-flow-connector {
    display: none;
  }
  .session-card .accent {
    min-height: 0.25rem;
  }
  .new-session-preview {
    position: static;
  }
  .wizard-callout,
  .wizard-submit-row {
    align-items: stretch;
    flex-direction: column;
  }
  .live-console-rail:first-child,
  .live-console-rail:last-child {
    border-left: 0;
    border-right: 0;
  }
  .live-console-shell {
    overflow: auto;
  }
  .live-console-top,
  .live-console-grid {
    min-height: auto;
  }
  .live-console-bottom {
    display: none;
  }
  .session-player {
    grid-template-columns: 1fr;
  }
  .session-player-skip {
    justify-content: space-between;
  }
  .live-console-top-actions,
  .live-bottom-actions,
  .live-feed-head {
    align-items: stretch;
    flex-direction: column;
  }
  .live-console-status,
  .live-console-top-actions,
  .live-bottom-actions {
    justify-content: flex-start;
  }
  .audience-view {
    height: auto;
    min-height: 100dvh;
    overflow: auto;
    position: relative;
  }
  .audience-view-top,
  .audience-audio-dock {
    align-items: stretch;
    flex-direction: column;
  }
  .audience-output-selector,
  .audience-language-tabs {
    margin-left: 0;
    width: 100%;
  }
  .audience-view-main {
    grid-template-columns: 1fr;
    overflow: visible;
  }
  .audience-caption-panel {
    min-height: 28rem;
    overflow: visible;
  }
  .audience-side-panel {
    border-left: 0;
    border-top: 1px solid var(--line);
    overflow: visible;
  }
  .audience-audio-dock {
    bottom: 0;
    position: sticky;
  }
  .volume-bar {
    width: 100%;
  }
}
@media (max-width: 360px) {
  .marketing-nav {
    gap: 0.5rem;
    padding: 0.85rem 0.75rem;
  }
  .marketing-nav .brand-lockup {
    gap: 0;
  }
  .marketing-nav .brand-lockup span:not(.brand-mark) {
    display: none;
  }
  .marketing-nav .links {
    gap: 0.5rem;
  }
  .marketing-nav .marketing-sign-in,
  .marketing-nav > .btn-link.primary {
    min-height: 2.75rem;
    padding: 0 0.75rem;
  }
}
@media (max-width: 640px) {
  .provider-checkbox-grid {
    grid-template-columns: 1fr;
  }
  .provider-admin-table {
    min-width: 32rem;
  }
}
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  font: 600 14px/1 var(--f-sans);
  letter-spacing: -0.005em;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
  border: 0;
  cursor: pointer;
  text-decoration: none;
}
.btn:hover {
  transform: translateY(-1px);
}
.btn-primary {
  background: var(--g-brand);
  color: #fff;
  box-shadow: var(--sh-glow);
}
.btn-primary:hover {
  box-shadow: 0 0 0 1px rgba(110,60,255,.4), 0 36px 70px -20px rgba(110,60,255,.55);
}
.btn-ghost {
  background: transparent;
  color: var(--ink);
}
.btn-ghost:hover {
  background: var(--paper-soft);
}
.btn-outline {
  background: var(--paper);
  border: 1px solid var(--line-2);
  color: var(--ink);
}
.btn-outline:hover {
  border-color: var(--ink);
}
.btn-dark {
  background: var(--ink);
  color: #fff;
}
.btn-sm {
  height: 32px;
  padding: 0 12px;
  font-size: 13px;
}
.btn-lg {
  height: 48px;
  padding: 0 22px;
  font-size: 15px;
  border-radius: 14px;
}
.start-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 22px;
  align-items: flex-start;
}
@media (max-width: 1100px) {
  .start-grid {
    grid-template-columns: 1fr;
  }
}
.start-hero {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.entry-tabs {
  display: flex;
  gap: 4px;
  padding: 5px;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 14px;
  width: fit-content;
}
.entry-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 10px;
  font: 600 13.5px var(--f-sans);
  color: var(--muted-2);
  cursor: pointer;
  transition: background 0.12s;
  border: 0;
  background: transparent;
}
.entry-tab.active {
  background: #fff;
  color: var(--ink);
  box-shadow: var(--sh-sm);
}
.entry-tab:hover:not(.active) {
  color: var(--ink-soft);
}
.dropzone-card {
  position: relative;
  border: 1.5px dashed var(--line-2);
  border-radius: var(--r-lg);
  padding: 36px 28px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  text-align: center;
  background: linear-gradient(180deg, #FBFAFE, #fff);
  transition: border-color 0.15s, background 0.15s, transform 0.15s;
  cursor: pointer;
  overflow: hidden;
}
.dropzone-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: radial-gradient(60% 60% at 50% -10%, rgba(110,60,255,.08), transparent 60%);
  pointer-events: none;
}
.dropzone-card:hover, .dropzone-card.over {
  border-color: var(--violet-300);
  background: #FAF7FF;
}
.dropzone-card.over {
  transform: scale(1.005);
}
.dropzone-card > * {
  position: relative;
  z-index: 1;
}
.dropzone-card .icon-stack {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 10px;
}
.dropzone-card .file-card {
  width: 64px;
  height: 78px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--sh-sm);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 8px;
  gap: 4px;
  position: relative;
  transform: rotate(-6deg);
}
.dropzone-card .file-card.alt {
  transform: rotate(7deg) translateY(-4px);
  background: linear-gradient(180deg, #F4EEFF, #fff);
}
.dropzone-card .file-card .corner {
  position: absolute;
  top: 0;
  right: 0;
  width: 18px;
  height: 18px;
  background: linear-gradient(135deg, transparent 50%, var(--paper-soft) 50%);
  border-bottom-left-radius: 6px;
}
.dropzone-card .file-card .glyph {
  align-self: center;
  margin-top: auto;
  margin-bottom: 6px;
  font: 700 9px var(--f-mono);
  letter-spacing: .06em;
  color: var(--violet-600);
}
.dropzone-card .file-card .lines {
  display: flex;
  flex-direction: column;
  gap: 3px;
  width: 100%;
}
.dropzone-card .file-card .lines i {
  display: block;
  height: 3px;
  border-radius: 2px;
  background: var(--line);
}
.dropzone-card .file-card .lines i:nth-child(1) {
  width: 80%;
}
.dropzone-card .file-card .lines i:nth-child(2) {
  width: 60%;
}
.dropzone-card .center-icon {
  width: 74px;
  height: 74px;
  border-radius: 18px;
  background: var(--g-brand);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--sh-glow);
  position: relative;
}
.dropzone-card .ttl {
  font: 700 22px var(--f-sans);
  letter-spacing: -0.018em;
  margin: 0;
}
.dropzone-card .sub {
  font: 500 14px var(--f-sans);
  color: var(--muted);
  margin: 0;
  max-width: 48ch;
}
.dropzone-card .cta-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}
.dropzone-card .formats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  font: 500 11.5px var(--f-mono);
  color: var(--muted);
  margin-top: 2px;
}
.dropzone-card .formats span {
  padding: 3px 8px;
  border-radius: 6px;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  letter-spacing: .04em;
}
.selected-file {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: #FAF7FF;
  border: 1px solid rgba(110,60,255,.18);
  border-radius: 14px;
}
.selected-file .ico {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--g-brand);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.selected-file .info {
  flex: 1;
  min-width: 0;
}
.selected-file .info strong {
  font: 700 14px var(--f-sans);
  display: block;
  letter-spacing: -0.012em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.selected-file .info small {
  font: 500 12px var(--f-mono);
  color: var(--muted);
}
.fields {
  display: grid;
  gap: 18px;
}
.field-block {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.field-block .lbl {
  display: flex;
  align-items: center;
  gap: 8px;
  font: 600 13px var(--f-sans);
  color: var(--ink);
}
.field-block .lbl .req {
  color: var(--rose);
  font-weight: 700;
}
.field-block .hint {
  font: 500 12px var(--f-sans);
  color: var(--muted);
}
.input-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 10px 12px;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.input-wrap:focus-within {
  border-color: var(--violet-300);
  box-shadow: 0 0 0 3px rgba(110,60,255,.12);
}
.input-wrap input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  font: 500 14px var(--f-sans);
  color: var(--ink);
  min-height: unset;
  padding: 0;
  border-radius: 0;
}
.lang-seg {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.lang-seg .opt {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 10px;
  background: var(--paper);
  border: 1px solid var(--line);
  font: 600 13px var(--f-sans);
  color: var(--ink-soft);
  cursor: pointer;
  transition: all 0.12s;
}
.lang-seg .opt:hover {
  border-color: var(--violet-300);
}
.lang-seg .opt.on {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}
.lang-seg .opt .flag {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: var(--paper-soft);
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: 700 10px var(--f-mono);
}
.lang-seg .opt.on .flag {
  background: rgba(255,255,255,.16);
  color: #fff;
}
.lang-seg .opt.detect {
  background: transparent;
  border-style: dashed;
}
.lang-seg .opt.detect.on {
  background: var(--violet-700);
  border-color: var(--violet-700);
  border-style: solid;
}
.target-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  min-height: 42px;
  padding: 6px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 11px;
}
.target-chips .empty {
  color: var(--muted);
  font: 500 12.5px var(--f-sans);
  padding: 6px 8px;
}
.target-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px 6px 10px;
  border-radius: 8px;
  background: var(--violet-50);
  border: 1px solid rgba(110,60,255,.18);
  color: var(--violet-700);
  font: 600 12.5px var(--f-sans);
}
.target-chip .flag {
  font: 700 10px var(--f-mono);
  letter-spacing: .04em;
}
.target-chip .x {
  width: 16px;
  height: 16px;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(110,60,255,.10);
  color: var(--violet-700);
  cursor: pointer;
  border: 0;
  font: inherit;
}
.target-chip .x:hover {
  background: rgba(110,60,255,.18);
}
.target-chips .add-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  border: 1px dashed var(--line-2);
  font: 600 12.5px var(--f-sans);
  cursor: pointer;
}
.target-chips .add-chip:hover {
  border-color: var(--violet-300);
  color: var(--violet-700);
}
.target-chips .add-chip:disabled {
  cursor: not-allowed;
  opacity: .5;
}
.document-source-chips,
.document-target-chips,
.session-target-chips {
  min-height: 48px;
}
.dub-voice-picker-list {
  display: grid;
  gap: 0.65rem;
  margin-top: 0.75rem;
}
.dub-voice-picker-row {
  align-items: start;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 11px;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(8rem, 0.32fr) minmax(0, 1fr);
  padding: 0.75rem;
}
.dub-voice-picker-row .tts-picker {
  min-width: 0;
}
.dub-voice-picker-row .tts-picker.compact label {
  font-size: 0.78rem;
}
.dub-voice-language {
  align-self: start;
  justify-content: center;
  min-height: 32px;
}
@media (max-width: 720px) {
  .dub-voice-picker-row {
    grid-template-columns: 1fr;
  }
  .dub-voice-language {
    justify-content: flex-start;
  }
}
.language-modal-backdrop {
  align-items: flex-start;
  background: rgba(11,4,32,.55);
  backdrop-filter: blur(6px);
  display: flex;
  inset: 0;
  justify-content: center;
  padding: 80px 20px;
  position: fixed;
  z-index: 220;
}
.language-modal {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: var(--sh-lg);
  display: flex;
  flex-direction: column;
  max-height: min(520px, calc(100vh - 120px));
  max-width: 100%;
  overflow: hidden;
  width: 520px;
}
.language-modal-head {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding: 16px 18px;
}
.language-modal-head strong {
  color: var(--ink);
  font: 700 15px var(--f-sans);
}
.language-modal-head button {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  height: 30px;
  justify-content: center;
  width: 30px;
}
.language-modal-search {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--ink);
  font: 600 13px var(--f-sans);
  margin: 10px 12px 6px;
  min-height: 38px;
  padding: 0 12px;
}
.language-modal-search:focus {
  border-color: var(--violet-300);
  box-shadow: 0 0 0 3px rgba(110,60,255,.12);
  outline: none;
}
.language-modal-list {
  flex: 1;
  overflow-y: auto;
  padding: 6px 6px 12px;
}
.language-modal-empty {
  color: var(--muted);
  font: 500 13px var(--f-sans);
  padding: 24px;
  text-align: center;
}
.language-modal-option {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 10px;
  color: var(--ink);
  cursor: pointer;
  display: flex;
  gap: 12px;
  padding: 10px 12px;
  text-align: left;
  width: 100%;
}
.language-modal-option:hover {
  background: var(--paper-soft);
}
.language-modal-option.selected {
  background: var(--violet-50);
}
.language-modal-option.selected > span {
  background: var(--violet-700);
}
.language-modal-option > span {
  align-items: center;
  background: var(--ink);
  border-radius: 8px;
  color: #fff;
  display: inline-flex;
  flex: 0 0 auto;
  font: 700 10.5px var(--f-mono);
  height: 28px;
  justify-content: center;
  letter-spacing: .03em;
  width: 34px;
}
.language-modal-option strong {
  font: 600 14px var(--f-sans);
  min-width: 0;
}
.language-modal-option small {
  color: var(--muted);
  font: 500 12px var(--f-mono);
  margin-left: auto;
}
.start-cta {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  margin-top: 8px;
  padding: 14px 16px;
}
.start-cta .summary {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.start-cta .summary strong {
  font: 700 14px var(--f-sans);
  letter-spacing: -0.012em;
}
.start-cta .summary small {
  font: 500 12px var(--f-mono);
  color: var(--muted);
}
.start-cta .actions {
  display: flex;
  gap: 8px;
}
.credit-preview-summary {
  color: var(--ink);
  font: 700 12px var(--f-mono);
  margin-top: 0.18rem;
}
.credit-preview-summary.is-warning {
  color: var(--danger, #c8214a);
}
.media-upload-progress {
  display: none;
  flex-basis: 100%;
  gap: 0.5rem;
  margin-top: 0.9rem;
}
.media-upload-progress.is-active {
  display: grid;
}
.media-upload-progress-head {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.media-upload-progress-head strong {
  color: var(--ink);
  font: 700 0.88rem var(--f-sans);
}
.media-upload-progress-head span {
  color: var(--muted);
  font: 600 0.74rem var(--f-mono);
}
.media-upload-progress-track {
  background: rgba(17, 24, 39, 0.08);
  border: 1px solid rgba(17, 24, 39, 0.12);
  border-radius: 999px;
  height: 0.7rem;
  overflow: hidden;
}
.media-upload-progress-track span {
  background: linear-gradient(90deg, var(--violet-600), var(--g-mint));
  display: block;
  height: 100%;
  transition: width 0.18s ease;
}
.media-upload-progress.is-indeterminate .media-upload-progress-track span {
  animation: media-upload-progress-pulse 1.1s ease-in-out infinite alternate;
}
@keyframes media-upload-progress-pulse {
  from {
    opacity: 0.55;
  }
  to {
    opacity: 1;
  }
}
.preview-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-xl);
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  position: sticky;
  top: 96px;
}
.preview-card h3 {
  font: 700 14px var(--f-sans);
  margin: 0;
  letter-spacing: -0.012em;
  display: flex;
  align-items: center;
  gap: 8px;
}
.preview-card .hdr-meta {
  font: 500 11.5px var(--f-mono);
  color: var(--muted);
  margin-top: -12px;
}
.pipeline {
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
}
.pipeline .step {
  display: flex;
  gap: 14px;
  padding: 12px 0;
  position: relative;
}
.pipeline .step + .step {
  border-top: 1px dashed var(--line);
}
.pipeline .step .num {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  flex: 0 0 auto;
  background: var(--paper-soft);
  color: var(--muted);
  border: 1px solid var(--line);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: 700 12px var(--f-mono);
}
.pipeline .step.ready .num {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}
.pipeline .step.queued .num {
  background: var(--violet-50);
  color: var(--violet-700);
  border-color: rgba(110,60,255,.20);
}
.pipeline .step .body {
  flex: 1;
}
.pipeline .step .body strong {
  font: 600 13.5px var(--f-sans);
  display: block;
  letter-spacing: -0.005em;
}
.pipeline .step .body small {
  font: 500 12px var(--f-mono);
  color: var(--muted);
  display: block;
  margin-top: 2px;
}
.pipeline .step .badge {
  align-self: flex-start;
  font: 600 10px var(--f-mono);
  padding: 3px 7px;
  border-radius: 6px;
  letter-spacing: .04em;
}
.pipeline .step .badge.ready {
  background: rgba(0,184,158,.12);
  color: #00735F;
  border: 1px solid rgba(0,184,158,.25);
}
.pipeline .step .badge.queued {
  background: var(--violet-50);
  color: var(--violet-700);
  border: 1px solid rgba(110,60,255,.20);
}
.pipeline .step .badge.skip {
  background: var(--paper-soft);
  color: var(--muted);
  border: 1px solid var(--line);
}
.estimate-card {
  background: linear-gradient(135deg, rgba(110,60,255,.08), rgba(255,61,139,.05));
  border: 1px solid rgba(110,60,255,.18);
  border-radius: 14px;
  padding: 14px;
  display: grid;
  gap: 8px;
}
.estimate-card .row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.estimate-card .row .l {
  font: 600 11.5px var(--f-mono);
  letter-spacing: .04em;
  color: var(--muted);
  text-transform: uppercase;
}
.estimate-card .row .v {
  font: 700 14px var(--f-sans);
  color: var(--ink);
}
.estimate-card .row .v.big {
  font-size: 20px;
  letter-spacing: -0.012em;
}
.studio-grid {
  display: grid;
  grid-template-columns: 380px minmax(0, 1fr);
  gap: 22px;
  align-items: flex-start;
}
@media (max-width: 1100px) {
  .studio-grid {
    grid-template-columns: 1fr;
  }
}
.media-studio-tabs {
  display: grid;
  gap: 1rem;
}
.media-studio-tab-input {
  height: 1px;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  width: 1px;
}
.media-studio-tab-list {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  box-shadow: var(--sh-sm);
  display: flex;
  gap: 0.35rem;
  -webkit-overflow-scrolling: touch;
  overflow-x: auto;
  padding: 0.35rem;
}
.media-studio-tab-list label {
  border-radius: var(--r-sm);
  color: var(--muted);
  cursor: pointer;
  flex: 0 0 auto;
  font: 800 0.82rem var(--f-sans);
  min-height: 2.35rem;
  padding: 0.65rem 0.85rem;
  white-space: nowrap;
}
#media-studio-tab-language:checked ~ .media-studio-tab-list label[for="media-studio-tab-language"],
#media-studio-tab-video-output:checked ~ .media-studio-tab-list label[for="media-studio-tab-video-output"],
#media-studio-tab-video-exports:checked ~ .media-studio-tab-list label[for="media-studio-tab-video-exports"],
#media-studio-tab-audio-output:checked ~ .media-studio-tab-list label[for="media-studio-tab-audio-output"] {
  background: var(--ink);
  color: #fff;
}
.media-studio-tab-panel {
  display: none;
}
#media-studio-tab-language:checked ~ .media-studio-tab-panels .media-studio-tab-panel-language,
#media-studio-tab-video-output:checked ~ .media-studio-tab-panels .media-studio-tab-panel-video-output,
#media-studio-tab-video-exports:checked ~ .media-studio-tab-panels .media-studio-tab-panel-video-exports,
#media-studio-tab-audio-output:checked ~ .media-studio-tab-panels .media-studio-tab-panel-audio-output {
  display: block;
}
.source-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: sticky;
  top: 96px;
}
.source-thumb {
  position: relative;
  aspect-ratio: 16/9;
  border-radius: 14px;
  background: var(--g-night);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.source-thumb::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(60% 60% at 30% 20%, rgba(176,38,255,.35), transparent 60%);
}
.source-thumb .play-btn {
  position: relative;
  z-index: 1;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(6px);
}
.source-thumb .duration {
  position: absolute;
  bottom: 10px;
  right: 10px;
  z-index: 1;
  font: 600 11px var(--f-mono);
  color: #fff;
  background: rgba(0,0,0,.45);
  padding: 4px 8px;
  border-radius: 6px;
  letter-spacing: .04em;
}
.source-thumb .wave-strip {
  position: absolute;
  left: 10px;
  right: 60px;
  bottom: 10px;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 18px;
}
.source-thumb .wave-strip i {
  flex: 1;
  background: linear-gradient(180deg, #9DF7E3, #7C5CFF);
  border-radius: 1px;
  opacity: .85;
}
.source-meta {
  display: grid;
  gap: 6px;
}
.source-meta .ttl {
  font: 700 16px var(--f-sans);
  letter-spacing: -0.012em;
}
.source-meta .sub {
  font: 500 12.5px var(--f-mono);
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.source-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}
.source-stats .stat .l {
  font: 600 10.5px var(--f-mono);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
  display: block;
  margin-bottom: 4px;
}
.source-stats .stat .v {
  font: 700 14px var(--f-sans);
  color: var(--ink);
}
.tracks-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  gap: 12px;
  flex-wrap: wrap;
}
.tracks-head .ttl {
  font: 700 18px var(--f-sans);
  letter-spacing: -0.012em;
  margin: 0;
}
.tracks-head .sub {
  font: 500 12.5px var(--f-mono);
  color: var(--muted);
  margin-top: 2px;
}
.track-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px 18px 14px 22px;
  margin-bottom: 10px;
  display: grid;
  grid-template-columns: 14px minmax(180px,1.5fr) 1.1fr 1.1fr 1fr auto;
  gap: 18px;
  align-items: center;
  transition: box-shadow 0.15s, transform 0.15s, border-color 0.15s;
}
.track-card:hover {
  box-shadow: var(--sh-md);
  transform: translateY(-1px);
}
.track-card.source {
  border-color: rgba(110,60,255,.2);
  background: linear-gradient(180deg,#FBFAFE,#fff);
}
.track-card .accent {
  width: 4px;
  height: 46px;
  border-radius: 4px;
  background: var(--g-brand);
}
.track-card.source .accent {
  background: linear-gradient(180deg,#0B0420,#6E3CFF);
}
.track-card.dub-on .accent {
  background: linear-gradient(180deg,#00E5C7,#37A8FF);
}
.track-card.error .accent {
  background: linear-gradient(180deg,#FF4D6D,#FFB23B);
}
.track-id {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.track-id .row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.track-id .flag {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: var(--ink);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: 700 11px var(--f-mono);
  letter-spacing: .04em;
}
.track-id .flag.tgt {
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
}
.track-id .name {
  font: 700 14.5px var(--f-sans);
  letter-spacing: -0.012em;
}
.track-id .role {
  font: 500 12px var(--f-mono);
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 8px;
}
.track-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.track-meta .l {
  font: 500 11px var(--f-mono);
  letter-spacing: .05em;
  color: var(--muted);
  text-transform: uppercase;
  display: block;
  margin-bottom: 6px;
}
.track-meta .v {
  font: 600 13.5px var(--f-sans);
  color: var(--ink-soft);
}
.track-meta .v small {
  display: block;
  font: 500 12px var(--f-mono);
  color: var(--muted);
  margin-top: 2px;
}
.cue-bar {
  height: 6px;
  background: var(--line);
  border-radius: 999px;
  overflow: hidden;
  margin-top: 6px;
}
.cue-bar i {
  display: block;
  height: 100%;
  background: var(--g-brand);
}
.dub-cell {
  display: flex;
  align-items: center;
  gap: 10px;
}
.dub-thumb {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  background: var(--ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex: 0 0 auto;
}
.dub-thumb.on {
  background: var(--g-mint);
}
.dub-thumb.off {
  background: var(--paper-soft);
  color: var(--muted-2);
  border: 1px dashed var(--line-2);
}
.dub-cell .info {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.dub-cell .info strong {
  font: 600 12.5px var(--f-sans);
}
.dub-cell .info small {
  font: 500 11px var(--f-mono);
  color: var(--muted);
}
.track-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}
.add-lang-card {
  background: transparent;
  border: 1px dashed var(--line-2);
  border-radius: 18px;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.add-lang-card:hover {
  border-color: var(--violet-300);
  background: #FAF7FF;
}
.add-lang-card .ico {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--line);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--violet-600);
}
.add-lang-card .copy strong {
  font: 600 14px var(--f-sans);
  color: var(--ink);
  display: block;
}
.add-lang-card .copy span {
  font: 500 12.5px var(--f-mono);
  color: var(--muted);
}
.add-lang-card-button {
  text-align: left;
  width: 100%;
}
.subtitle-style-panel {
  display: grid;
  grid-template-columns: minmax(12rem, 0.9fr) minmax(16rem, 1.1fr);
  gap: 1rem;
  align-items: stretch;
}
.subtitle-style-preview {
  min-height: 7rem;
  border-radius: 12px;
  background: #111827;
  display: grid;
  place-items: center;
  padding: 0.75rem;
}
.subtitle-style-video-frame {
  aspect-ratio: 16 / 9;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0)),
    radial-gradient(70% 100% at 50% 0%, rgba(110,60,255,.28), transparent 68%),
    #111827;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 10px;
  display: grid;
  place-items: end center;
  padding: 0 8% 6%;
  width: 100%;
}
.subtitle-style-preview span {
  border: 2px solid #111827;
  border-radius: 8px;
  background: #000;
  color: #fff;
  font: 700 22px/1.35 var(--f-sans);
  padding: 0.35rem 0.65rem;
  text-align: center;
}
.subtitle-style-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}
.subtitle-style-fields strong {
  grid-column: 1 / -1;
  font: 700 0.9rem var(--f-sans);
}
.subtitle-style-fields label {
  display: grid;
  gap: 0.3rem;
  color: var(--muted);
  font: 650 0.75rem var(--f-sans);
}
.subtitle-style-fields input {
  width: 100%;
}
.export-bar {
  margin-top: 18px;
  background: linear-gradient(180deg,#1A0B40,#0B0420);
  color: #fff;
  border-radius: var(--r-lg);
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  box-shadow: var(--sh-md);
}
.export-bar .lhs {
  display: flex;
  align-items: center;
  gap: 14px;
}
.export-bar .lhs .ttl {
  font: 700 16px var(--f-sans);
  letter-spacing: -0.012em;
}
.export-bar .lhs .sub {
  font: 500 12.5px var(--f-mono);
  color: rgba(255,255,255,.55);
  margin-top: 3px;
}
.export-bar .formats {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.fmt-chip {
  font: 600 11px var(--f-mono);
  letter-spacing: .04em;
  padding: 5px 10px;
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.85);
  border: 1px solid rgba(255,255,255,.1);
  cursor: pointer;
}
.fmt-chip:hover {
  background: rgba(255,255,255,.12);
}
.fmt-chip.primary {
  background: var(--g-brand);
  border-color: transparent;
}
.wf-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  position: relative;
}
.wf-head .lhs {
  display: flex;
  align-items: center;
  gap: 12px;
}
.timecode {
  font: 600 13px var(--f-mono);
  color: rgba(255,255,255,.85);
}
.wf-head .right {
  display: flex;
  align-items: center;
  gap: 6px;
}
.wf-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.wf-btn:hover {
  background: rgba(255,255,255,.12);
}
.wf-btn.primary {
  background: var(--g-brand);
  border-color: transparent;
  box-shadow: 0 8px 20px rgba(110,60,255,.4);
}
.subtitle-editor-video-frame {
  position: relative;
  margin-bottom: 1rem;
  overflow: hidden;
  border-radius: 12px;
  background: #050510;
  aspect-ratio: 16 / 9;
  display: grid;
  place-items: center;
}
.subtitle-editor-video-frame video {
  display: block;
  width: 100%;
  max-height: 420px;
  background: #050510;
}
.subtitle-editor-video-frame:fullscreen {
  width: 100vw;
  height: 100vh;
  border-radius: 0;
  aspect-ratio: auto;
}
.subtitle-editor-video-frame:fullscreen video {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: contain;
}
.subtitle-editor-video-fullscreen {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 10px;
  background: rgba(0,0,0,.55);
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.subtitle-editor-video-fullscreen:hover {
  background: rgba(0,0,0,.72);
}
.subtitle-editor-video-subtitle-toggle {
  position: absolute;
  right: 52px;
  top: 12px;
  z-index: 2;
  min-height: 34px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 10px;
  background: rgba(0,0,0,.55);
  color: #fff;
  cursor: pointer;
  font: 800 12px var(--f-sans);
  padding: 0 10px;
}
.subtitle-editor-video-subtitle-toggle:hover {
  background: rgba(0,0,0,.72);
}
.subtitle-editor-video-overlay {
  position: absolute;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  z-index: 2;
  max-width: min(86%, 920px);
  border-radius: 8px;
  background: rgba(0,0,0,.68);
  color: #fff;
  font: 700 16px/1.45 var(--f-sans);
  padding: 8px 12px;
  text-align: center;
  overflow-wrap: anywhere;
}
.subtitle-editor-video-frame:fullscreen .subtitle-editor-video-overlay {
  bottom: max(32px, env(safe-area-inset-bottom));
  font-size: clamp(18px, 2.2vw, 30px);
  padding: 10px 16px;
}
.waveform-track {
  position: relative;
  height: 90px;
  display: flex;
  align-items: center;
  gap: 2px;
  margin-bottom: 8px;
}
.waveform-track i {
  flex: 1;
  border-radius: 1.5px;
  background: linear-gradient(180deg,#9DF7E3,#7C5CFF);
  opacity: .85;
}
.waveform-track i.past {
  opacity: .45;
}
.waveform-track .playhead {
  position: absolute;
  top: -6px;
  bottom: -6px;
  width: 2px;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255,255,255,.18);
  border-radius: 2px;
}
.waveform-track .selection {
  position: absolute;
  top: -6px;
  bottom: -6px;
  background: rgba(255,255,255,.08);
  border-left: 1px solid rgba(255,255,255,.4);
  border-right: 1px solid rgba(255,255,255,.4);
  border-radius: 4px;
}
.waveform-ruler {
  display: flex;
  justify-content: space-between;
  font: 500 11px var(--f-mono);
  color: rgba(255,255,255,.5);
  letter-spacing: .04em;
  position: relative;
}
.cue-list-wrap {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
}
.cue-list-head {
  display: grid;
  grid-template-columns: 60px 110px 1fr 1fr 80px;
  gap: 12px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  background: var(--paper-soft);
  font: 600 11px var(--f-mono);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
}
.cue-row {
  display: grid;
  grid-template-columns: 60px 110px 1fr 1fr 80px;
  gap: 12px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: background 0.12s;
  align-items: flex-start;
}
.cue-row:hover {
  background: var(--paper-soft);
}
.cue-row.active {
  background: #FAF7FF;
  border-left: 3px solid var(--violet-500);
  padding-left: 15px;
}
.cue-row.active .seq {
  color: var(--violet-700);
}
.cue-row.partial {
  background: rgba(255,178,59,.04);
}
.cue-source-group {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  border-left: 3px solid transparent;
  display: grid;
  gap: 0 12px;
  padding: 0 18px 0 15px;
}
.cue-source-group.active {
  border-left-color: var(--violet-500);
}
.cue-source-group.checked {
  background: #FBFCFF;
}
.cue-source-block {
  align-self: stretch;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  justify-content: center;
  margin: 10px 0;
  min-height: 4rem;
  padding: 0.78rem 0.9rem;
}
.cue-source-group.active .cue-source-block {
  border-color: rgba(110,60,255,.32);
}
.source-block-text {
  display: block;
  font: 600 14px/1.5 var(--f-sans);
  text-wrap: pretty;
}
.cue-group-cell {
  align-self: stretch;
  align-items: flex-start;
  cursor: pointer;
  display: flex;
  min-height: 3.75rem;
  padding: 14px 0;
}
.cue-group-cell.middle,
.cue-group-cell.last {
  border-top: 1px solid rgba(25,22,37,.09);
}
.cue-group-cell.active {
  color: var(--ink);
}
.cue-group-cell.checked {
  color: var(--ink);
}
.cue-group-check {
  align-items: flex-start;
}
.cue-group-cell.seq {
  align-items: flex-start;
}
.cue-group-cell.timestamp {
  flex-direction: column;
}
.source-block-translation {
  gap: 0.5rem;
}
.cue-group-cell.cue-actions {
  gap: 4px;
  justify-content: flex-end;
}
.seq {
  font: 700 13px var(--f-mono);
  color: var(--muted-2);
  padding-top: 2px;
}
.timestamp {
  font: 600 12px var(--f-mono);
  color: var(--ink-soft);
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding-top: 1px;
}
.timestamp .end {
  color: var(--muted);
}
.cue-text {
  font: 500 14px/1.5 var(--f-sans);
  color: var(--ink);
  text-wrap: pretty;
}
.cue-text.translated {
  color: var(--ink-soft);
}
.cue-actions {
  display: flex;
  gap: 4px;
  justify-content: flex-end;
}
.inspector {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  position: sticky;
  top: 96px;
}
.inspector h4 {
  font: 700 14px var(--f-sans);
  margin: 0 0 6px;
  letter-spacing: -0.012em;
}
.inspector .field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.inspector .field .lbl {
  font: 600 11px var(--f-mono);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--muted);
}
.inspector textarea.txt {
  border: 1px solid var(--line);
  background: var(--paper-soft);
  border-radius: 10px;
  padding: 12px;
  font: 500 14px/1.5 var(--f-sans);
  color: var(--ink);
  outline: none;
  width: 100%;
  resize: vertical;
  min-height: 96px;
  font-family: var(--f-sans);
}
.inspector textarea.txt:focus {
  border-color: var(--violet-300);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(110,60,255,.12);
}
.inspector .lang-meta {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.inspector .lang-meta .flag {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--ink);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: 700 12px var(--f-mono);
}
.inspector .lang-meta strong {
  font: 600 13.5px var(--f-sans);
  display: block;
}
.inspector .lang-meta small {
  font: 500 12px var(--f-mono);
  color: var(--muted);
}
.media-wave-card {
  background: var(--g-night);
  border-radius: var(--r-lg);
  color: #fff;
  padding: 18px;
  position: relative;
  overflow: hidden;
}
.media-wave-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(60% 100% at 30% 0%, rgba(176,38,255,.30), transparent 60%);
  pointer-events: none;
}
@media (max-width: 1100px) {
  .production-test-workspace,
  .production-test-results-layout {
    grid-template-columns: 1fr;
  }
  .studio-grid,
  .editor-grid {
    grid-template-columns: 1fr;
  }
  .source-card,
  .inspector {
    position: static;
  }
  .track-card {
    grid-template-columns: 14px 1fr;
    gap: 10px;
  }
  .cue-list-head,
  .cue-row {
    grid-template-columns: 50px 90px 1fr 1fr 60px;
  }
}
@media (max-width: 760px) {
  .subtitle-style-panel,
  .subtitle-style-fields {
    grid-template-columns: 1fr;
  }
  .production-test-subnav,
  .production-test-guide,
  .production-test-step-meta {
    grid-template-columns: 1fr;
  }
  .production-test-subnav a {
    min-height: auto;
  }
  .production-test-timeline-head,
  .production-test-artifact-head {
    align-items: stretch;
    display: grid;
  }
}
.prelogin-page {
  background: var(--paper-soft);
  color: var(--ink);
  min-height: 100vh;
}
.prelogin-nav {
  align-items: center;
  background: var(--g-night);
  color: #fff;
  display: grid;
  gap: 1rem;
  grid-template-columns: auto 1fr auto;
  padding: 1.1rem 5vw 0.9rem;
  position: sticky;
  top: 0;
  z-index: 20;
}
.prelogin-nav .brand-name,
.prelogin-auth-logo .brand-name,
.prelogin-plan-logo .brand-name {
  color: currentColor;
}
.prelogin-nav-links {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: center;
}
.prelogin-nav-links a,
.prelogin-nav-links span {
  color: rgba(255, 255, 255, 0.74);
  font-size: 0.92rem;
  font-weight: 650;
}
.prelogin-nav-links a:hover {
  color: #fff;
}
.prelogin-nav-disabled {
  cursor: default;
  opacity: 0.54;
}
.prelogin-nav-actions {
  align-items: center;
  display: flex;
  gap: 0.65rem;
  justify-content: flex-end;
}
.prelogin-button {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  font-size: 0.93rem;
  font-weight: 750;
  gap: 0.48rem;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.72rem 1.05rem;
  transition: background 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
  white-space: nowrap;
}
.prelogin-button:hover {
  transform: translateY(-1px);
}
.prelogin-button-primary {
  background: var(--g-brand);
  box-shadow: var(--sh-glow);
  color: #fff;
}
.prelogin-button-secondary {
  background: #fff;
  border-color: var(--line);
  color: var(--ink);
}
.prelogin-nav .prelogin-button-secondary {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.18);
  color: #fff;
}
.prelogin-button-ghost {
  background: transparent;
  border-color: transparent;
  color: inherit;
}
.prelogin-button-disabled,
.prelogin-button:disabled {
  background: var(--paper-soft);
  border-color: var(--line);
  box-shadow: none;
  color: var(--muted);
  cursor: not-allowed;
  transform: none;
}
.prelogin-hero {
  background: var(--g-night);
  color: #fff;
  display: grid;
  gap: 3rem;
  grid-template-columns: minmax(0, 0.9fr) minmax(520px, 1.1fr);
  min-height: 660px;
  padding: 5.2rem 5vw 5.5rem;
}
.prelogin-hero-copy {
  align-self: center;
  max-width: 780px;
}
.prelogin-kicker {
  align-items: center;
  color: #c9b9ff;
  display: inline-flex;
  font: 700 0.78rem var(--f-mono);
  gap: 0.55rem;
  margin-bottom: 1.4rem;
}
.prelogin-kicker span {
  background: var(--mint);
  border-radius: 999px;
  box-shadow: 0 0 0 6px rgba(0, 229, 199, 0.12);
  display: inline-flex;
  height: 0.55rem;
  width: 0.55rem;
}
.prelogin-hero h1 {
  color: #fff;
  font-size: 5rem;
  font-weight: 850;
  line-height: 0.98;
  margin: 0;
  max-width: 880px;
}
.prelogin-gradient-text {
  background: linear-gradient(90deg, #fff 0%, #cdbdff 36%, #ff8dba 72%, #8af7e7 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.prelogin-hero-copy > p {
  color: rgba(255, 255, 255, 0.72);
  font-size: 1.15rem;
  line-height: 1.7;
  margin: 1.4rem 0 0;
  max-width: 660px;
}
.prelogin-hero-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 2rem;
}
.prelogin-console-preview {
  align-self: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--r-lg);
  box-shadow: 0 40px 90px -35px rgba(0, 0, 0, 0.6);
  overflow: hidden;
}
.prelogin-capability-panel {
  align-self: center;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--r-lg);
  box-shadow: 0 40px 90px -35px rgba(0, 0, 0, 0.6);
  display: grid;
  gap: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
}
.prelogin-capability-panel article {
  display: grid;
  gap: 0.9rem;
  grid-template-rows: auto 1fr;
  min-width: 0;
  padding: clamp(1rem, 2vw, 1.35rem);
}
.prelogin-capability-panel article + article {
  border-left: 1px solid rgba(255, 255, 255, 0.12);
}
.prelogin-capability-heading {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  min-height: 2.9rem;
  min-width: 0;
}
.prelogin-capability-heading .prelogin-feature-icon {
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 26px -18px rgba(0, 0, 0, 0.65);
  color: var(--violet-700);
  flex: 0 0 auto;
}
.prelogin-capability-panel h2 {
  color: #fff;
  font-size: 1.08rem;
  line-height: 1.18;
  margin: 0;
}
.prelogin-capability-panel ul {
  color: rgba(255, 255, 255, 0.76);
  display: grid;
  gap: 0.58rem;
  line-height: 1.48;
  list-style: none;
  margin: 0;
  padding: 0;
}
.prelogin-capability-panel li {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 0.58rem;
}
.prelogin-capability-panel li:first-child {
  border-top: 0;
  padding-top: 0;
}
.prelogin-console-head,
.prelogin-mini-console-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.prelogin-console-head {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.75);
  font: 700 0.8rem var(--f-mono);
  padding: 1rem 1.1rem;
}
.prelogin-live-dot {
  align-items: center;
  display: inline-flex;
  gap: 0.45rem;
}
.prelogin-live-dot::before {
  background: var(--live);
  border-radius: 999px;
  content: "";
  display: inline-flex;
  height: 0.5rem;
  width: 0.5rem;
}
.prelogin-console-body {
  display: grid;
  gap: 1rem;
  padding: 1.2rem;
}
.prelogin-wave-preview {
  align-items: center;
  display: flex;
  gap: 0.26rem;
  height: 110px;
}
.prelogin-wave-preview span {
  background: linear-gradient(180deg, #9df7e3, #7c5cff);
  border-radius: 999px;
  flex: 1;
  min-width: 5px;
  opacity: 0.9;
}
.prelogin-caption-row {
  align-items: flex-start;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.8rem;
  grid-template-columns: 2.4rem 1fr;
  padding: 0.9rem;
}
.prelogin-caption-row code,
.prelogin-mini-line code {
  align-items: center;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  color: var(--mint);
  display: inline-flex;
  font: 800 0.78rem var(--f-mono);
  height: 1.9rem;
  justify-content: center;
  width: 2.4rem;
}
.prelogin-caption-row p {
  color: rgba(255, 255, 255, 0.86);
  line-height: 1.5;
  margin: 0;
}
.prelogin-console-metrics {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 0.3rem;
  padding-top: 1rem;
}
.prelogin-console-metrics strong {
  color: #fff;
  display: block;
  font-size: 1.15rem;
}
.prelogin-console-metrics span {
  color: rgba(255, 255, 255, 0.58);
  display: block;
  font-size: 0.78rem;
  margin-top: 0.2rem;
}
.prelogin-section {
  padding: 5rem 5vw;
}
.prelogin-footer {
  align-items: center;
  background: var(--paper);
  border-top: 1px solid var(--line);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1.2rem 5vw;
}
.prelogin-footer nav,
.prelogin-auth-legal-links {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
}
.prelogin-footer-meta {
  display: grid;
  gap: 0.45rem;
  justify-items: end;
  min-width: 0;
}
.prelogin-footer a,
.prelogin-auth-legal-links a {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 750;
}
.prelogin-footer a:hover,
.prelogin-auth-legal-links a:hover {
  color: var(--violet-600);
}
.prelogin-browser-support {
  color: var(--muted);
  display: grid;
  font-size: 0.76rem;
  font-weight: 700;
  gap: 0.12rem;
  line-height: 1.5;
  margin: 0;
  max-width: 48rem;
  text-align: right;
}
.prelogin-section-head {
  display: grid;
  gap: 0.65rem;
  margin: 0 auto 2rem;
  max-width: 760px;
  text-align: center;
}
.prelogin-section-head small {
  color: var(--violet-600);
  font: 900 0.92rem var(--f-mono);
}
.prelogin-section-head h2 {
  font-size: clamp(2.65rem, 4vw, 3rem);
  line-height: 1.05;
  margin: 0;
}
.prelogin-section-head p {
  color: var(--muted);
  line-height: 1.65;
  margin: 0;
}
.prelogin-card-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 auto;
  max-width: 1180px;
}
.prelogin-feature-card,
.prelogin-stack-item,
.prelogin-plan-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
}
.prelogin-feature-card {
  display: grid;
  gap: 0.9rem;
  min-height: 220px;
  padding: 1.35rem;
}
.prelogin-feature-icon {
  align-items: center;
  background: var(--g-brand-soft);
  border-radius: var(--r-sm);
  color: var(--violet-600);
  display: inline-flex;
  height: 2.9rem;
  justify-content: center;
  width: 2.9rem;
}
.prelogin-feature-icon svg {
  height: 1.5rem;
  width: 1.5rem;
}
.prelogin-feature-card strong,
.prelogin-stack-item strong {
  color: var(--ink);
  display: block;
  font-size: 1.05rem;
}
.prelogin-feature-card p,
.prelogin-stack-item p {
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
}
.prelogin-stack-list {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 auto;
  max-width: 1180px;
}
.prelogin-stack-item {
  padding: 1.2rem;
}
.prelogin-mini-tag {
  color: var(--violet-600);
  display: inline-block;
  font: 800 0.75rem var(--f-mono);
  margin-bottom: 1rem;
}
.prelogin-auth-page {
  background: var(--paper);
  color: var(--ink);
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(420px, 1fr);
  min-height: 100vh;
}
.prelogin-auth-form-pane {
  align-items: center;
  display: flex;
  padding: 3rem 5vw;
}
.prelogin-auth-form-inner {
  display: grid;
  gap: 1.45rem;
  margin: 0 auto;
  max-width: 470px;
  width: 100%;
}
.prelogin-auth-logo {
  margin-bottom: 0.7rem;
}
.prelogin-auth-heading {
  display: grid;
  gap: 0.65rem;
}
.prelogin-auth-heading h1 {
  font-size: 2.45rem;
  font-weight: 850;
  line-height: 1.05;
  margin: 0;
}
.prelogin-auth-heading p {
  color: var(--muted);
  line-height: 1.65;
  margin: 0;
}
.prelogin-sso-grid {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.prelogin-provider-button {
  align-items: center;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  cursor: pointer;
  display: inline-flex;
  font-size: 0.86rem;
  font-weight: 750;
  gap: 0.45rem;
  justify-content: center;
  min-height: 2.8rem;
  padding: 0.62rem 0.72rem;
  text-align: center;
}
.prelogin-provider-button span {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex;
  flex: 0 0 auto;
  font: 800 0.72rem var(--f-mono);
  height: 1.35rem;
  justify-content: center;
  width: 1.35rem;
}
.prelogin-provider-button:disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: 0.62;
}
.prelogin-divider {
  align-items: center;
  color: var(--muted);
  display: grid;
  gap: 0.8rem;
  grid-template-columns: 1fr auto 1fr;
}
.prelogin-divider span {
  background: var(--line);
  height: 1px;
}
.prelogin-divider small {
  font: 700 0.74rem var(--f-mono);
}
.prelogin-form {
  display: grid;
  gap: 0.85rem;
}
.prelogin-form-row {
  align-items: center;
  display: flex;
  gap: 0.8rem;
  justify-content: space-between;
}
.prelogin-captcha {
  min-height: 4.1rem;
  overflow-x: auto;
  width: 100%;
}
.prelogin-captcha-widget {
  min-height: 4.1rem;
  width: 100%;
}
.prelogin-captcha iframe {
  max-width: 100%;
}
.prelogin-field {
  display: grid;
  gap: 0.42rem;
}
.prelogin-field > span {
  color: var(--ink-soft);
  font-size: 0.84rem;
  font-weight: 750;
}
.prelogin-field input {
  background: var(--paper-soft);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  min-height: 3rem;
  width: 100%;
}
.prelogin-field input:focus {
  border-color: var(--violet-300);
  box-shadow: 0 0 0 3px rgba(110, 60, 255, 0.12);
  outline: none;
}
.prelogin-link {
  color: var(--violet-600);
  font-size: 0.88rem;
  font-weight: 750;
}
.prelogin-muted-link {
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 700;
}
.prelogin-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin-top: 0.35rem;
}
.prelogin-note {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.55;
  margin: 0;
}
.prelogin-checkbox {
  align-items: flex-start;
  color: var(--muted);
  display: flex;
  gap: 0.7rem;
  line-height: 1.5;
}
.prelogin-checkbox input {
  flex: 0 0 auto;
  margin-top: 0.15rem;
  min-height: 1.1rem;
  width: 1.1rem;
}
.prelogin-auth-story {
  background: var(--g-night);
  color: #fff;
  display: flex;
  min-height: 100%;
  padding: 4rem 5vw;
}
.prelogin-story-inner {
  align-self: center;
  display: grid;
  gap: 1.5rem;
  max-width: 560px;
}
.prelogin-story-kicker {
  align-items: center;
  color: #c9b9ff;
  display: inline-flex;
  font: 850 0.96rem var(--f-mono);
  gap: 0.55rem;
}
.prelogin-story-kicker span {
  background: var(--mint);
  border-radius: 999px;
  display: inline-flex;
  height: 0.5rem;
  width: 0.5rem;
}
.prelogin-story-inner blockquote {
  font-size: 2.35rem;
  font-weight: 800;
  line-height: 1.08;
  margin: 0;
}
.prelogin-story-inner > p {
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.6;
  margin: 0;
}
.prelogin-mini-console {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--r-md);
  display: grid;
  gap: 0.8rem;
  padding: 1rem;
}
.prelogin-mini-console-head {
  color: rgba(255, 255, 255, 0.72);
  font: 700 0.78rem var(--f-mono);
}
.prelogin-mini-console-head strong {
  color: var(--mint);
}
.prelogin-mini-line {
  align-items: center;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: 2.4rem 1fr;
}
.prelogin-mini-line span {
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.45;
}
.prelogin-code-input {
  font: 800 1.45rem var(--f-mono);
  letter-spacing: 0;
  text-align: center;
}
.prelogin-code-field input {
  font: 800 1.45rem var(--f-mono);
  letter-spacing: 0;
  text-align: center;
}
.prelogin-reset-checks {
  display: grid;
  gap: 0.5rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.prelogin-reset-checks span {
  align-items: center;
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  color: var(--muted);
  display: inline-flex;
  font-size: 0.82rem;
  font-weight: 650;
  gap: 0.45rem;
  padding: 0.55rem 0.7rem;
}
.prelogin-reset-checks svg {
  color: var(--violet-600);
}
.contact-page {
  background: var(--g-night);
  color: #fff;
}
.contact-shell {
  align-items: center;
  display: grid;
  gap: clamp(1.5rem, 4vw, 3rem);
  grid-template-columns: minmax(0, 0.9fr) minmax(22rem, 0.72fr);
  margin: 0 auto;
  max-width: 1180px;
  min-height: calc(100vh - 4.7rem);
  padding: clamp(3rem, 6vw, 5rem) 5vw;
}
.contact-hero {
  color: #fff;
  display: grid;
  gap: 1.35rem;
}
.contact-hero h1 {
  color: #fff;
  font-size: clamp(3rem, 6vw, 5rem);
  font-weight: 850;
  line-height: 0.98;
  margin: 0;
  max-width: 760px;
}
.contact-form-card {
  align-self: center;
  background: var(--paper);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--r-md);
  box-shadow: 0 30px 80px -42px rgba(12, 8, 32, 0.62), var(--sh-sm);
  display: grid;
  gap: 1.05rem;
  min-width: 0;
  padding: clamp(1rem, 2.5vw, 1.5rem);
}
.contact-form-head {
  display: grid;
  gap: 0.35rem;
}
.contact-form-head span {
  color: var(--violet-600);
  font: 800 0.76rem var(--f-mono);
  text-transform: uppercase;
}
.contact-form-head h2 {
  color: var(--ink);
  font-size: 1.45rem;
  line-height: 1.15;
  margin: 0;
}
.contact-alert {
  border-radius: var(--r-sm);
  display: grid;
  gap: 0.3rem;
  padding: 0.85rem 0.95rem;
}
.contact-alert-success {
  background: #ddfbf6;
  border: 1px solid #b8e2c8;
}
.contact-alert-danger {
  background: #fff1f2;
  border: 1px solid #fecdd3;
}
.contact-alert strong {
  color: var(--ink);
  font-size: 0.9rem;
}
.contact-alert p {
  color: var(--ink-soft);
  font-size: 0.86rem;
  line-height: 1.55;
  margin: 0;
}
.contact-form {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.contact-field {
  display: grid;
  gap: 0.42rem;
  min-width: 0;
}
.contact-field span {
  color: var(--ink-soft);
  font-size: 0.84rem;
  font-weight: 750;
}
.contact-field input,
.contact-field select,
.contact-field textarea {
  background: var(--paper-soft);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  color: var(--ink);
  min-height: 3rem;
  width: 100%;
}
.contact-field input:focus,
.contact-field select:focus,
.contact-field textarea:focus {
  border-color: var(--violet-300);
  box-shadow: 0 0 0 3px rgba(110, 60, 255, 0.12);
  outline: none;
}
.contact-field textarea {
  min-height: 9.2rem;
  resize: vertical;
}
.contact-field-wide,
.contact-submit {
  grid-column: 1 / -1;
}
.contact-submit {
  font-family: inherit;
  justify-self: start;
}
.prelogin-plan-page {
  background: var(--paper-soft);
  color: var(--ink);
  min-height: 100vh;
}
.prelogin-plan-topbar {
  align-items: center;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 1rem;
  grid-template-columns: auto 1fr auto;
  padding: 1rem 5vw;
}
.prelogin-plan-steps {
  align-items: center;
  color: var(--muted);
  display: flex;
  font-size: 0.86rem;
  font-weight: 750;
  gap: 0.6rem;
  justify-content: center;
}
.prelogin-plan-steps span,
.prelogin-plan-steps strong {
  align-items: center;
  display: inline-flex;
  gap: 0.35rem;
}
.prelogin-plan-steps strong {
  color: var(--violet-600);
}
.prelogin-logout-form {
  display: flex;
  justify-content: flex-end;
}
.prelogin-plan-shell {
  display: grid;
  gap: 2rem;
  margin: 0 auto;
  max-width: 1240px;
  padding: 4rem 5vw;
}
.prelogin-plan-heading {
  display: grid;
  gap: 0.75rem;
  max-width: 760px;
}
.prelogin-plan-heading h1 {
  font-size: 3rem;
  font-weight: 850;
  line-height: 1.04;
  margin: 0;
}
.prelogin-plan-heading p {
  color: var(--muted);
  line-height: 1.65;
  margin: 0;
}
.prelogin-plan-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.prelogin-plan-card {
  display: grid;
  gap: 1rem;
  padding: 1.25rem;
}
.prelogin-plan-card header {
  display: grid;
  gap: 0.65rem;
}
.prelogin-plan-card h2 {
  font-size: 1.25rem;
  margin: 0;
}
.prelogin-plan-card p {
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
}
.prelogin-plan-price {
  align-items: baseline;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.prelogin-plan-price strong {
  font-size: 2rem;
  line-height: 1;
}
.prelogin-plan-price span {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 650;
}
.prelogin-plan-facts {
  display: grid;
  gap: 0.55rem;
  margin: 0;
}
.prelogin-plan-facts div {
  align-items: center;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding-top: 0.55rem;
}
.prelogin-plan-facts dt {
  color: var(--muted);
  font-size: 0.84rem;
}
.prelogin-plan-facts dd {
  font-weight: 800;
  margin: 0;
}
.prelogin-plan-features {
  display: grid;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.prelogin-plan-features li {
  align-items: flex-start;
  color: var(--ink-soft);
  display: flex;
  gap: 0.45rem;
  line-height: 1.45;
}
.prelogin-plan-features svg {
  color: var(--violet-600);
  flex: 0 0 auto;
  margin-top: 0.15rem;
}
.prelogin-enterprise-notes {
  background: var(--paper-soft);
  border: 1px solid var(--line-2);
  border-radius: var(--r-sm);
  min-height: 5.8rem;
  resize: vertical;
  width: 100%;
}
.prelogin-status-stack {
  display: grid;
  gap: 0.7rem;
}
.prelogin-legal-page {
  background: var(--paper-soft);
  color: var(--ink);
  min-height: 100vh;
}
.prelogin-legal-nav {
  align-items: center;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  padding: 1rem 5vw;
}
.prelogin-legal-nav .brand-name {
  color: currentColor;
}
.prelogin-legal-actions {
  align-items: center;
  display: flex;
  gap: 0.65rem;
  justify-content: flex-end;
}
.prelogin-legal-shell {
  display: grid;
  gap: 2rem;
  margin: 0 auto;
  max-width: 980px;
  padding: 4rem 5vw 5rem;
}
.prelogin-legal-hero {
  display: grid;
  gap: 0.75rem;
}
.prelogin-legal-hero small {
  color: var(--violet-600);
  font: 800 0.78rem var(--f-mono);
}
.prelogin-legal-hero h1 {
  font-size: 3rem;
  font-weight: 850;
  line-height: 1.04;
  margin: 0;
}
.prelogin-legal-hero p {
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.65;
  margin: 0;
  max-width: 760px;
}
.prelogin-legal-hero span {
  color: var(--ink-soft);
  font-size: 0.9rem;
  font-weight: 750;
}
.prelogin-legal-content {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--sh-sm);
  display: grid;
  gap: 1.4rem;
  padding: 2rem;
}
.prelogin-legal-section {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 0.65rem;
  padding-top: 1.4rem;
}
.prelogin-legal-section:first-child {
  border-top: 0;
  padding-top: 0;
}
.prelogin-legal-section h2 {
  font-size: 1.08rem;
  margin: 0;
}
.prelogin-legal-section p,
.prelogin-legal-note {
  color: var(--muted);
  line-height: 1.7;
  margin: 0;
}
.prelogin-legal-note {
  background: var(--paper-soft);
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 0.95rem 1rem;
}
@media (max-width: 1120px) {
  .contact-shell,
  .prelogin-hero,
  .prelogin-auth-page {
    grid-template-columns: 1fr;
  }
  .prelogin-auth-story {
    min-height: auto;
  }
  .prelogin-card-grid,
  .prelogin-stack-list,
  .prelogin-plan-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .prelogin-capability-panel {
    grid-template-columns: 1fr;
  }
  .prelogin-capability-panel article + article {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
  }
}
@media (max-width: 820px) {
  .prelogin-nav,
  .prelogin-plan-topbar {
    grid-template-columns: 1fr;
  }
  .prelogin-nav-links,
  .prelogin-nav-actions,
  .prelogin-plan-steps,
  .prelogin-logout-form {
    justify-content: flex-start;
  }
  .prelogin-footer {
    align-items: flex-start;
    flex-direction: column;
  }
  .prelogin-footer-meta {
    justify-items: start;
  }
  .prelogin-browser-support {
    text-align: left;
  }
  .prelogin-nav-links {
    flex-wrap: wrap;
  }
  .prelogin-hero {
    min-height: auto;
    padding-top: 3rem;
  }
  .prelogin-hero h1 {
    font-size: 3.45rem;
  }
  .prelogin-section-head h2,
  .prelogin-plan-heading h1 {
    font-size: 2.15rem;
  }
  .prelogin-sso-grid,
  .prelogin-card-grid,
  .contact-form,
  .prelogin-stack-list,
  .prelogin-plan-grid,
  .prelogin-reset-checks {
    grid-template-columns: 1fr;
  }
  .prelogin-auth-form-pane,
  .prelogin-auth-story {
    padding: 2rem 5vw;
  }
  .prelogin-legal-nav {
    align-items: flex-start;
    display: grid;
    gap: 1rem;
  }
  .prelogin-legal-actions {
    justify-content: flex-start;
  }
  .prelogin-legal-shell {
    padding-top: 2.5rem;
  }
  .prelogin-legal-hero h1 {
    font-size: 2.15rem;
  }
  .prelogin-legal-content {
    padding: 1.35rem;
  }
  .prelogin-story-inner blockquote {
    font-size: 1.8rem;
  }
}
@media (max-width: 540px) {
  .prelogin-hero h1 {
    font-size: 2.65rem;
  }
  .prelogin-hero-actions,
  .prelogin-form-row,
  .prelogin-form-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .prelogin-button {
    width: 100%;
  }
  .prelogin-console-metrics {
    grid-template-columns: 1fr;
  }
}
@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-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@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;
}
@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-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --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;
    }
  }
}