/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: "Manrope", ui-sans-serif, system-ui, sans-serif;
    --font-serif: "Literata", "Charter", "Iowan Old Style", Georgia, "Times New Roman", serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --color-red-50: oklch(97.1% 0.013 17.38);
    --color-red-300: oklch(80.8% 0.114 19.571);
    --color-red-700: oklch(50.5% 0.213 27.518);
    --color-red-900: oklch(39.6% 0.141 25.723);
    --color-amber-50: oklch(98.7% 0.022 95.277);
    --color-amber-100: oklch(96.2% 0.059 95.617);
    --color-amber-200: oklch(92.4% 0.12 95.746);
    --color-amber-300: oklch(87.9% 0.169 91.605);
    --color-amber-400: oklch(82.8% 0.189 84.429);
    --color-amber-600: oklch(66.6% 0.179 58.318);
    --color-amber-700: oklch(55.5% 0.163 48.998);
    --color-amber-800: oklch(47.3% 0.137 46.201);
    --color-amber-900: oklch(41.4% 0.112 45.904);
    --color-emerald-50: oklch(97.9% 0.021 166.113);
    --color-emerald-100: oklch(95% 0.052 163.051);
    --color-emerald-300: oklch(84.5% 0.143 164.978);
    --color-emerald-400: oklch(76.5% 0.177 163.223);
    --color-emerald-600: oklch(59.6% 0.145 163.225);
    --color-emerald-700: oklch(50.8% 0.118 165.612);
    --color-emerald-800: oklch(43.2% 0.095 166.913);
    --color-emerald-900: oklch(37.8% 0.077 168.94);
    --color-blue-400: oklch(70.7% 0.165 254.624);
    --color-blue-600: oklch(54.6% 0.245 262.881);
    --color-violet-100: oklch(94.3% 0.029 294.588);
    --color-violet-200: oklch(89.4% 0.057 293.283);
    --color-violet-800: oklch(43.2% 0.232 292.759);
    --color-violet-900: oklch(38% 0.189 293.745);
    --color-rose-300: oklch(81% 0.117 11.638);
    --color-rose-700: oklch(51.4% 0.222 16.935);
    --color-zinc-50: oklch(98.5% 0 0);
    --color-zinc-100: oklch(96.7% 0.001 286.375);
    --color-zinc-200: oklch(92% 0.004 286.32);
    --color-zinc-300: oklch(87.1% 0.006 286.286);
    --color-zinc-400: oklch(70.5% 0.015 286.067);
    --color-zinc-500: oklch(55.2% 0.016 285.938);
    --color-zinc-600: oklch(44.2% 0.017 285.786);
    --color-zinc-700: oklch(37% 0.013 285.805);
    --color-zinc-800: oklch(27.4% 0.006 286.033);
    --color-zinc-900: oklch(21% 0.006 285.885);
    --color-white: #fff;
    --spacing: 0.25rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-2xl: 1.5rem;
    --text-2xl--line-height: calc(2 / 1.5);
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --tracking-wider: 0.05em;
    --leading-snug: 1.375;
    --radius-md: 0.375rem;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-ink: #111;
    --color-ink-muted: #666;
    --color-paper: #fff;
    --color-paper-soft: #f7f7f7;
    --color-line: #e5e5e5;
  }
}
@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;
  }
  .absolute {
    position: absolute;
  }
  .fixed {
    position: fixed;
  }
  .relative {
    position: relative;
  }
  .sticky {
    position: sticky;
  }
  .top-1 {
    top: calc(var(--spacing) * 1);
  }
  .top-3 {
    top: calc(var(--spacing) * 3);
  }
  .top-10 {
    top: calc(var(--spacing) * 10);
  }
  .top-30 {
    top: calc(var(--spacing) * 30);
  }
  .top-40 {
    top: calc(var(--spacing) * 40);
  }
  .my-2 {
    margin-block: calc(var(--spacing) * 2);
  }
  .mt-1 {
    margin-top: calc(var(--spacing) * 1);
  }
  .mt-2 {
    margin-top: calc(var(--spacing) * 2);
  }
  .mt-3 {
    margin-top: calc(var(--spacing) * 3);
  }
  .mt-10 {
    margin-top: calc(var(--spacing) * 10);
  }
  .mb-1 {
    margin-bottom: calc(var(--spacing) * 1);
  }
  .mb-2 {
    margin-bottom: calc(var(--spacing) * 2);
  }
  .mb-3 {
    margin-bottom: calc(var(--spacing) * 3);
  }
  .ml-1 {
    margin-left: calc(var(--spacing) * 1);
  }
  .ml-2 {
    margin-left: calc(var(--spacing) * 2);
  }
  .line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .block {
    display: block;
  }
  .contents {
    display: contents;
  }
  .flex {
    display: flex;
  }
  .grid {
    display: grid;
  }
  .hidden {
    display: none;
  }
  .inline {
    display: inline;
  }
  .inline-block {
    display: inline-block;
  }
  .inline-flex {
    display: inline-flex;
  }
  .table {
    display: table;
  }
  .h-4 {
    height: calc(var(--spacing) * 4);
  }
  .max-h-80 {
    max-height: calc(var(--spacing) * 80);
  }
  .w-4 {
    width: calc(var(--spacing) * 4);
  }
  .w-full {
    width: 100%;
  }
  .max-w-none {
    max-width: none;
  }
  .flex-1 {
    flex: 1;
  }
  .shrink-0 {
    flex-shrink: 0;
  }
  .transform {
    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
  }
  .cursor-default {
    cursor: default;
  }
  .cursor-pointer {
    cursor: pointer;
  }
  .resize {
    resize: both;
  }
  .grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .flex-col {
    flex-direction: column;
  }
  .flex-wrap {
    flex-wrap: wrap;
  }
  .items-baseline {
    align-items: baseline;
  }
  .items-center {
    align-items: center;
  }
  .justify-between {
    justify-content: space-between;
  }
  .justify-center {
    justify-content: center;
  }
  .gap-0\.5 {
    gap: calc(var(--spacing) * 0.5);
  }
  .gap-1 {
    gap: calc(var(--spacing) * 1);
  }
  .gap-2 {
    gap: calc(var(--spacing) * 2);
  }
  .gap-2\.5 {
    gap: calc(var(--spacing) * 2.5);
  }
  .gap-3 {
    gap: calc(var(--spacing) * 3);
  }
  .gap-4 {
    gap: calc(var(--spacing) * 4);
  }
  .space-y-1 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-2 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .space-y-4 {
    :where(& > :not(:last-child)) {
      --tw-space-y-reverse: 0;
      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
    }
  }
  .overflow-x-auto {
    overflow-x: auto;
  }
  .rounded {
    border-radius: 0.25rem;
  }
  .rounded-\[4px\] {
    border-radius: 4px;
  }
  .rounded-full {
    border-radius: calc(infinity * 1px);
  }
  .rounded-lg {
    border-radius: var(--radius-lg);
  }
  .rounded-md {
    border-radius: var(--radius-md);
  }
  .rounded-xl {
    border-radius: var(--radius-xl);
  }
  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }
  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0px;
  }
  .border-t {
    border-top-style: var(--tw-border-style);
    border-top-width: 1px;
  }
  .border-b {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 1px;
  }
  .border-dashed {
    --tw-border-style: dashed;
    border-style: dashed;
  }
  .border-amber-300 {
    border-color: var(--color-amber-300);
  }
  .border-amber-400 {
    border-color: var(--color-amber-400);
  }
  .border-emerald-300 {
    border-color: var(--color-emerald-300);
  }
  .border-ink {
    border-color: var(--color-ink);
  }
  .border-line {
    border-color: var(--color-line);
  }
  .border-zinc-100 {
    border-color: var(--color-zinc-100);
  }
  .border-zinc-200 {
    border-color: var(--color-zinc-200);
  }
  .border-zinc-300 {
    border-color: var(--color-zinc-300);
  }
  .border-zinc-700 {
    border-color: var(--color-zinc-700);
  }
  .bg-amber-50\/60 {
    background-color: color-mix(in srgb, oklch(98.7% 0.022 95.277) 60%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-amber-50) 60%, transparent);
    }
  }
  .bg-amber-100 {
    background-color: var(--color-amber-100);
  }
  .bg-emerald-50 {
    background-color: var(--color-emerald-50);
  }
  .bg-emerald-700 {
    background-color: var(--color-emerald-700);
  }
  .bg-ink {
    background-color: var(--color-ink);
  }
  .bg-paper {
    background-color: var(--color-paper);
  }
  .bg-paper-soft {
    background-color: var(--color-paper-soft);
  }
  .bg-red-50 {
    background-color: var(--color-red-50);
  }
  .bg-transparent {
    background-color: transparent;
  }
  .bg-violet-100 {
    background-color: var(--color-violet-100);
  }
  .bg-white {
    background-color: var(--color-white);
  }
  .bg-white\/40 {
    background-color: color-mix(in srgb, #fff 40%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-white) 40%, transparent);
    }
  }
  .bg-zinc-50\/30 {
    background-color: color-mix(in srgb, oklch(98.5% 0 0) 30%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-zinc-50) 30%, transparent);
    }
  }
  .bg-zinc-50\/60 {
    background-color: color-mix(in srgb, oklch(98.5% 0 0) 60%, transparent);
    @supports (color: color-mix(in lab, red, red)) {
      background-color: color-mix(in oklab, var(--color-zinc-50) 60%, transparent);
    }
  }
  .bg-zinc-100 {
    background-color: var(--color-zinc-100);
  }
  .bg-zinc-700 {
    background-color: var(--color-zinc-700);
  }
  .bg-zinc-800 {
    background-color: var(--color-zinc-800);
  }
  .p-0 {
    padding: calc(var(--spacing) * 0);
  }
  .p-2 {
    padding: calc(var(--spacing) * 2);
  }
  .p-3 {
    padding: calc(var(--spacing) * 3);
  }
  .p-3\.5 {
    padding: calc(var(--spacing) * 3.5);
  }
  .p-4 {
    padding: calc(var(--spacing) * 4);
  }
  .px-1\.5 {
    padding-inline: calc(var(--spacing) * 1.5);
  }
  .px-2 {
    padding-inline: calc(var(--spacing) * 2);
  }
  .px-2\.5 {
    padding-inline: calc(var(--spacing) * 2.5);
  }
  .px-3 {
    padding-inline: calc(var(--spacing) * 3);
  }
  .py-0\.5 {
    padding-block: calc(var(--spacing) * 0.5);
  }
  .py-1 {
    padding-block: calc(var(--spacing) * 1);
  }
  .py-1\.5 {
    padding-block: calc(var(--spacing) * 1.5);
  }
  .py-2 {
    padding-block: calc(var(--spacing) * 2);
  }
  .py-3 {
    padding-block: calc(var(--spacing) * 3);
  }
  .pt-3 {
    padding-top: calc(var(--spacing) * 3);
  }
  .pt-6 {
    padding-top: calc(var(--spacing) * 6);
  }
  .text-center {
    text-align: center;
  }
  .text-left {
    text-align: left;
  }
  .text-right {
    text-align: right;
  }
  .align-top {
    vertical-align: top;
  }
  .font-mono {
    font-family: var(--font-mono);
  }
  .font-sans {
    font-family: var(--font-sans);
  }
  .text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--tw-leading, var(--text-2xl--line-height));
  }
  .text-base {
    font-size: var(--text-base);
    line-height: var(--tw-leading, var(--text-base--line-height));
  }
  .text-lg {
    font-size: var(--text-lg);
    line-height: var(--tw-leading, var(--text-lg--line-height));
  }
  .text-sm {
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
  }
  .text-xs {
    font-size: var(--text-xs);
    line-height: var(--tw-leading, var(--text-xs--line-height));
  }
  .text-\[10px\] {
    font-size: 10px;
  }
  .text-\[11px\] {
    font-size: 11px;
  }
  .text-\[12px\] {
    font-size: 12px;
  }
  .text-\[13px\] {
    font-size: 13px;
  }
  .text-\[14px\] {
    font-size: 14px;
  }
  .text-\[18px\] {
    font-size: 18px;
  }
  .leading-snug {
    --tw-leading: var(--leading-snug);
    line-height: var(--leading-snug);
  }
  .font-medium {
    --tw-font-weight: var(--font-weight-medium);
    font-weight: var(--font-weight-medium);
  }
  .font-semibold {
    --tw-font-weight: var(--font-weight-semibold);
    font-weight: var(--font-weight-semibold);
  }
  .tracking-wider {
    --tw-tracking: var(--tracking-wider);
    letter-spacing: var(--tracking-wider);
  }
  .break-words {
    overflow-wrap: break-word;
  }
  .break-all {
    word-break: break-all;
  }
  .whitespace-pre-wrap {
    white-space: pre-wrap;
  }
  .text-amber-600 {
    color: var(--color-amber-600);
  }
  .text-amber-700 {
    color: var(--color-amber-700);
  }
  .text-amber-800 {
    color: var(--color-amber-800);
  }
  .text-blue-600 {
    color: var(--color-blue-600);
  }
  .text-emerald-600 {
    color: var(--color-emerald-600);
  }
  .text-emerald-700 {
    color: var(--color-emerald-700);
  }
  .text-emerald-900 {
    color: var(--color-emerald-900);
  }
  .text-ink {
    color: var(--color-ink);
  }
  .text-ink-muted {
    color: var(--color-ink-muted);
  }
  .text-paper {
    color: var(--color-paper);
  }
  .text-red-700 {
    color: var(--color-red-700);
  }
  .text-rose-700 {
    color: var(--color-rose-700);
  }
  .text-violet-800 {
    color: var(--color-violet-800);
  }
  .text-white {
    color: var(--color-white);
  }
  .text-zinc-500 {
    color: var(--color-zinc-500);
  }
  .text-zinc-600 {
    color: var(--color-zinc-600);
  }
  .text-zinc-700 {
    color: var(--color-zinc-700);
  }
  .text-zinc-800 {
    color: var(--color-zinc-800);
  }
  .lowercase {
    text-transform: lowercase;
  }
  .uppercase {
    text-transform: uppercase;
  }
  .italic {
    font-style: italic;
  }
  .tabular-nums {
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .underline {
    text-decoration-line: underline;
  }
  .underline-offset-2 {
    text-underline-offset: 2px;
  }
  .opacity-60 {
    opacity: 60%;
  }
  .opacity-70 {
    opacity: 70%;
  }
  .shadow {
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .ring {
    --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }
  .outline {
    outline-style: var(--tw-outline-style);
    outline-width: 1px;
  }
  .blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .invert {
    --tw-invert: invert(100%);
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .filter {
    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
  }
  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }
  .outline-none {
    --tw-outline-style: none;
    outline-style: none;
  }
  .\[living-cron\:cleanup\] {
    living-cron: cleanup;
  }
  .\[living-cron\:heartbeat\] {
    living-cron: heartbeat;
  }
  .\[seed\:lenses\] {
    seed: lenses;
  }
  .\[tag\:VALUE\] {
    tag: VALUE;
  }
  .\[voyage\:embed\] {
    voyage: embed;
  }
  .hover\:border-ink-muted {
    &:hover {
      @media (hover: hover) {
        border-color: var(--color-ink-muted);
      }
    }
  }
  .hover\:bg-emerald-800 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-emerald-800);
      }
    }
  }
  .hover\:bg-zinc-50 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-zinc-50);
      }
    }
  }
  .hover\:bg-zinc-100 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-zinc-100);
      }
    }
  }
  .hover\:bg-zinc-900 {
    &:hover {
      @media (hover: hover) {
        background-color: var(--color-zinc-900);
      }
    }
  }
  .hover\:text-\[\#b3261e\] {
    &:hover {
      @media (hover: hover) {
        color: #b3261e;
      }
    }
  }
  .hover\:text-ink {
    &:hover {
      @media (hover: hover) {
        color: var(--color-ink);
      }
    }
  }
  .hover\:underline {
    &:hover {
      @media (hover: hover) {
        text-decoration-line: underline;
      }
    }
  }
  .focus\:border-zinc-400 {
    &:focus {
      border-color: var(--color-zinc-400);
    }
  }
  .disabled\:cursor-not-allowed {
    &:disabled {
      cursor: not-allowed;
    }
  }
  .disabled\:opacity-40 {
    &:disabled {
      opacity: 40%;
    }
  }
  .disabled\:opacity-70 {
    &:disabled {
      opacity: 70%;
    }
  }
  .md\:grid-cols-3 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  .md\:grid-cols-4 {
    @media (width >= 48rem) {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
  .dark\:border-amber-600 {
    @media (prefers-color-scheme: dark) {
      border-color: var(--color-amber-600);
    }
  }
  .dark\:border-amber-700\/50 {
    @media (prefers-color-scheme: dark) {
      border-color: color-mix(in srgb, oklch(55.5% 0.163 48.998) 50%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        border-color: color-mix(in oklab, var(--color-amber-700) 50%, transparent);
      }
    }
  }
  .dark\:border-emerald-700 {
    @media (prefers-color-scheme: dark) {
      border-color: var(--color-emerald-700);
    }
  }
  .dark\:border-zinc-200 {
    @media (prefers-color-scheme: dark) {
      border-color: var(--color-zinc-200);
    }
  }
  .dark\:border-zinc-600 {
    @media (prefers-color-scheme: dark) {
      border-color: var(--color-zinc-600);
    }
  }
  .dark\:border-zinc-700 {
    @media (prefers-color-scheme: dark) {
      border-color: var(--color-zinc-700);
    }
  }
  .dark\:border-zinc-800 {
    @media (prefers-color-scheme: dark) {
      border-color: var(--color-zinc-800);
    }
  }
  .dark\:bg-amber-900\/20 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(41.4% 0.112 45.904) 20%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-amber-900) 20%, transparent);
      }
    }
  }
  .dark\:bg-amber-900\/40 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(41.4% 0.112 45.904) 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-amber-900) 40%, transparent);
      }
    }
  }
  .dark\:bg-emerald-900\/30 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(37.8% 0.077 168.94) 30%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-emerald-900) 30%, transparent);
      }
    }
  }
  .dark\:bg-red-900\/30 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(39.6% 0.141 25.723) 30%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-red-900) 30%, transparent);
      }
    }
  }
  .dark\:bg-violet-900\/40 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(38% 0.189 293.745) 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-violet-900) 40%, transparent);
      }
    }
  }
  .dark\:bg-zinc-200 {
    @media (prefers-color-scheme: dark) {
      background-color: var(--color-zinc-200);
    }
  }
  .dark\:bg-zinc-800 {
    @media (prefers-color-scheme: dark) {
      background-color: var(--color-zinc-800);
    }
  }
  .dark\:bg-zinc-800\/70 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(27.4% 0.006 286.033) 70%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-zinc-800) 70%, transparent);
      }
    }
  }
  .dark\:bg-zinc-900 {
    @media (prefers-color-scheme: dark) {
      background-color: var(--color-zinc-900);
    }
  }
  .dark\:bg-zinc-900\/20 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(21% 0.006 285.885) 20%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-zinc-900) 20%, transparent);
      }
    }
  }
  .dark\:bg-zinc-900\/30 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(21% 0.006 285.885) 30%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-zinc-900) 30%, transparent);
      }
    }
  }
  .dark\:bg-zinc-900\/40 {
    @media (prefers-color-scheme: dark) {
      background-color: color-mix(in srgb, oklch(21% 0.006 285.885) 40%, transparent);
      @supports (color: color-mix(in lab, red, red)) {
        background-color: color-mix(in oklab, var(--color-zinc-900) 40%, transparent);
      }
    }
  }
  .dark\:text-amber-200 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-amber-200);
    }
  }
  .dark\:text-amber-300 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-amber-300);
    }
  }
  .dark\:text-amber-400 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-amber-400);
    }
  }
  .dark\:text-blue-400 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-blue-400);
    }
  }
  .dark\:text-emerald-100 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-emerald-100);
    }
  }
  .dark\:text-emerald-300 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-emerald-300);
    }
  }
  .dark\:text-emerald-400 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-emerald-400);
    }
  }
  .dark\:text-red-300 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-red-300);
    }
  }
  .dark\:text-rose-300 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-rose-300);
    }
  }
  .dark\:text-violet-200 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-violet-200);
    }
  }
  .dark\:text-zinc-200 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-zinc-200);
    }
  }
  .dark\:text-zinc-300 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-zinc-300);
    }
  }
  .dark\:text-zinc-400 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-zinc-400);
    }
  }
  .dark\:text-zinc-900 {
    @media (prefers-color-scheme: dark) {
      color: var(--color-zinc-900);
    }
  }
  .dark\:hover\:bg-white {
    @media (prefers-color-scheme: dark) {
      &:hover {
        @media (hover: hover) {
          background-color: var(--color-white);
        }
      }
    }
  }
  .dark\:hover\:bg-zinc-800\/60 {
    @media (prefers-color-scheme: dark) {
      &:hover {
        @media (hover: hover) {
          background-color: color-mix(in srgb, oklch(27.4% 0.006 286.033) 60%, transparent);
          @supports (color: color-mix(in lab, red, red)) {
            background-color: color-mix(in oklab, var(--color-zinc-800) 60%, transparent);
          }
        }
      }
    }
  }
}
:root {
  --ink-0: #FFFFFF;
  --ink-50: #FAFAF7;
  --ink-100: #F4F2EC;
  --ink-150: #ECEAE3;
  --ink-200: #E2DFD7;
  --ink-300: #C9C5BA;
  --ink-400: #9C988D;
  --ink-500: #6B6862;
  --ink-600: #45433E;
  --ink-700: #2E2C28;
  --ink-900: #1A1916;
  --brand: oklch(45% 0.09 45);
  --brand-soft: oklch(92% 0.03 50);
  --brand-ink: oklch(30% 0.06 40);
  --success: oklch(55% 0.13 150);
  --success-soft: oklch(94% 0.04 150);
  --danger: oklch(58% 0.18 30);
  --warn: oklch(72% 0.13 80);
  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --surface-sunken: var(--ink-50);
  --surface-2: var(--ink-100);
  --border: var(--ink-200);
  --border-strong: var(--ink-300);
  --frame-fill: transparent;
  --fs-sans: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;
  --fs-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --fs-serif: 'Literata', Georgia, 'Times New Roman', serif;
  --t-display: 56px;
  --t-h1: 36px;
  --t-h2: 24px;
  --t-h3: 18px;
  --t-body: 15px;
  --t-meta: 13px;
  --t-small: 12px;
  --t-mono: 11px;
  --t-mono-s: 10px;
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;
  --r-pill: 999px;
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;
  --shadow-1: 0 1px 2px rgba(26, 25, 22, 0.05);
  --shadow-2: 0 2px 8px rgba(26, 25, 22, 0.06), 0 1px 2px rgba(26, 25, 22, 0.04);
  --shadow-3: 0 8px 24px rgba(26, 25, 22, 0.08), 0 2px 6px rgba(26, 25, 22, 0.04);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 120ms;
  --dur-base: 180ms;
  --dur-slow: 320ms;
  --sidebar-w: 248px;
  --topbar-h: 64px;
  --content-max: 1192px;
}
* {
  box-sizing: border-box;
}
html, body {
  margin: 0;
  padding: 0;
}
body {
  background: var(--bg);
  color: var(--ink-900);
  font-family: var(--fs-sans);
  font-size: var(--t-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01", "cv11";
  min-width: 1240px;
}
a {
  color: inherit;
  text-decoration: none;
}
button {
  font-family: inherit;
  cursor: pointer;
}
::selection {
  background: var(--ink-900);
  color: var(--ink-0);
}
.num, .mono, .kbd, [data-num] {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}
.num {
  letter-spacing: -0.01em;
}
.mono {
  font-family: var(--fs-mono);
}
.eyebrow {
  font-family: var(--fs-mono);
  font-size: var(--t-mono-s);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.app {
  display: grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  min-height: 100vh;
}
.sidebar {
  border-right: 1px solid var(--border);
  padding: 24px 20px 64px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  background: var(--bg);
}
.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 8px;
  margin-bottom: 32px;
}
.brand-mark {
  width: 22px;
  height: 22px;
  background: var(--ink-900);
  border-radius: 6px;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.brand-mark::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 30%, var(--ink-0) 0 2px, transparent 3px);
}
.brand-name {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.brand-sub {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-top: 2px;
}
.nav-group {
  margin-bottom: 24px;
}
.nav-title {
  font-size: 11px;
  font-weight: 600;
  color: var(--ink-900);
  padding: 6px 10px;
  margin-bottom: 2px;
}
.nav-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px;
  font-size: 13px;
  color: var(--ink-600);
  border-radius: var(--r-xs);
  cursor: pointer;
  background: none;
  border: 0;
  width: 100%;
  text-align: left;
  font-family: inherit;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.nav-link:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.nav-link.active {
  color: var(--ink-900);
  font-weight: 500;
  background: var(--ink-100);
}
.nav-link .chev {
  color: var(--ink-400);
  font-size: 10px;
}
.topbar {
  height: var(--topbar-h);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 32px;
  background: var(--bg);
  position: sticky;
  top: 0;
  z-index: 10;
}
.top-nav {
  display: flex;
  align-items: center;
  gap: 4px;
}
.top-nav-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: var(--r-pill);
  font-size: 14px;
  color: var(--ink-600);
  background: none;
  border: 1px solid transparent;
  white-space: nowrap;
  transition: color var(--dur-fast) var(--ease-out);
}
.top-nav-item:hover {
  color: var(--ink-900);
}
.top-nav-item.active {
  border-color: var(--border);
  background: var(--surface);
  color: var(--ink-900);
}
.top-right {
  display: flex;
  align-items: center;
  gap: 12px;
}
.search {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  padding: 7px 14px;
  width: 280px;
  color: var(--ink-500);
  font-size: 13px;
  white-space: nowrap;
}
.search .placeholder {
  color: var(--ink-400);
  flex: 1;
}
.btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 18px;
  border-radius: var(--r-pill);
  font-size: 14px;
  font-weight: 500;
  font-family: inherit;
  border: 1px solid transparent;
  background: var(--surface);
  color: var(--ink-900);
  white-space: nowrap;
  transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.btn-primary {
  background: var(--ink-900);
  color: var(--ink-0);
}
.btn-primary:hover {
  background: var(--ink-700);
}
.btn-ghost {
  border-color: var(--border);
}
.btn-ghost:hover {
  border-color: var(--border-strong);
}
.btn-quiet {
  color: var(--ink-600);
  padding: 6px 12px;
}
.btn-quiet:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.btn-sm {
  padding: 5px 12px;
  font-size: 13px;
}
.icon-btn {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: var(--r-pill);
  color: var(--ink-600);
  padding: 0;
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.icon-btn:hover {
  color: var(--ink-900);
  border-color: var(--border-strong);
}
.kbd {
  font-family: var(--fs-mono);
  font-size: 10px;
  border: 1px solid var(--border);
  padding: 1px 5px;
  border-radius: 4px;
  background: var(--ink-50);
  color: var(--ink-500);
}
.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 4px;
  background: var(--ink-900);
  color: var(--ink-0);
  white-space: nowrap;
}
.badge-soft {
  background: var(--ink-100);
  color: var(--ink-700);
}
.badge-success {
  background: var(--success-soft);
  color: var(--success);
}
.badge-warn {
  background: oklch(95% 0.06 80);
  color: oklch(50% 0.16 70);
}
.status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}
.status::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ink-300);
  flex-shrink: 0;
}
.status.live {
  color: var(--success);
}
.status.live::before {
  background: var(--success);
  box-shadow: 0 0 0 3px var(--success-soft);
}
.status.ready::before {
  background: var(--success);
}
.status.review::before {
  background: var(--warn);
}
.status.todo::before {
  background: var(--ink-300);
}
.status.danger::before {
  background: var(--danger);
}
.tag-chip {
  display: inline-flex;
  align-items: center;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-600);
  background: var(--surface);
  border: 1px solid var(--border);
  padding: 3px 7px;
  border-radius: 4px;
  white-space: nowrap;
}
.variant-select {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: var(--r-sm);
  padding: 4px 8px 4px 12px;
  font-size: 13px;
  color: var(--ink-700);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.toggle {
  display: inline-block;
  width: 30px;
  height: 18px;
  background: var(--ink-200);
  border-radius: 999px;
  position: relative;
  flex-shrink: 0;
}
.toggle::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  background: var(--ink-0);
  border-radius: 50%;
  box-shadow: var(--shadow-1);
  transition: left var(--dur-base) var(--ease-out);
}
.toggle.on {
  background: var(--ink-900);
}
.toggle.on::after {
  left: 14px;
}
.segmented {
  display: inline-flex;
  background: var(--ink-100);
  border-radius: var(--r-pill);
  padding: 3px;
  gap: 2px;
}
.segmented-item {
  padding: 5px 14px;
  font-size: 13px;
  color: var(--ink-500);
  border-radius: var(--r-pill);
  background: none;
  border: 0;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.segmented-item.active {
  background: var(--surface);
  color: var(--ink-900);
  box-shadow: var(--shadow-1);
}
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.card-lg {
  border-radius: var(--r-lg);
}
.meta-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: var(--ink-700);
  font-size: 14px;
}
.meta-row svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--ink-500);
}
.meta-row .num {
  font-variant-numeric: tabular-nums;
}
.main {
  min-width: 0;
}
.page {
  max-width: var(--content-max);
  padding: 32px 32px 96px;
  margin: 0 auto;
}
.crumbs {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--ink-500);
  font-size: 13px;
  background: none;
  border: 0;
  padding: 0;
  margin-bottom: 24px;
  cursor: pointer;
}
.crumbs:hover {
  color: var(--ink-900);
}
.section {
  padding: 56px 0;
  border-bottom: 1px solid var(--border);
}
.section:last-of-type {
  border-bottom: 0;
}
.section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 28px;
  gap: 24px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}
.section-head h2 {
  font-size: var(--t-h1);
  font-weight: 500;
  letter-spacing: -0.025em;
  margin: 0;
  color: var(--ink-900);
}
.section-head .sh-meta {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-400);
  text-align: right;
  white-space: nowrap;
}
.section-intro {
  color: var(--ink-500);
  font-size: 14px;
  margin: 0 0 24px;
  max-width: 64ch;
  line-height: 1.55;
}
.section-intro a {
  color: var(--ink-700);
  text-decoration: underline;
  text-decoration-color: var(--ink-300);
  text-underline-offset: 3px;
}
.section-split {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 48px;
}
.section-split .sec-title {
  font-size: 16px;
  font-weight: 500;
  margin: 0;
}
.hero-edit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 40px;
  align-items: stretch;
  padding: 24px 0 40px;
  margin-bottom: 8px;
}
.hero-edit-left {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  padding-top: 8px;
}
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 28px;
}
.hero-eyebrow .pip {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 4px var(--success-soft);
}
.hero-edit h1 {
  margin: 0;
  font-size: 60px;
  line-height: 1.02;
  letter-spacing: -0.035em;
  font-weight: 500;
  max-width: 14ch;
}
.hero-edit h1 em {
  font-style: normal;
  color: var(--ink-400);
}
.hero-edit-tagline {
  color: var(--ink-500);
  font-size: 16px;
  max-width: 56ch;
  margin: 0 0 22px;
  line-height: 1.55;
}
.hero-edit-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.hero-cover {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  background: var(--surface-sunken);
  border: 1px solid var(--border);
  aspect-ratio: 1 / 1;
}
.hero-cover svg.geo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.hero-cover .corner {
  position: absolute;
  top: 12px;
  left: 14px;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-500);
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.hero-cover .corner::before {
  content: "";
  width: 6px;
  height: 6px;
  border: 1px solid var(--ink-500);
}
.hero-cover .corner-r {
  position: absolute;
  top: 12px;
  right: 14px;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-400);
}
.hero-cover .corner-b {
  position: absolute;
  bottom: 14px;
  left: 14px;
  right: 14px;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 12px;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-500);
  letter-spacing: 0.08em;
}
.hero-cover .corner-b > span {
  min-width: 0;
}
.spec-strip {
  margin-top: 28px;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--surface);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  overflow: hidden;
}
.spec {
  padding: 20px 24px;
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.spec:last-child {
  border-right: 0;
}
.spec-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.spec-vis {
  display: flex;
  align-items: center;
  gap: 5px;
  height: 18px;
}
.spec-vis .dot {
  width: 12px;
  height: 12px;
  background: var(--ink-900);
  border-radius: 50%;
}
.spec-vis .dot.off {
  background: var(--ink-150);
}
.spec-vis-row {
  display: flex;
  gap: 6px;
  color: var(--ink-900);
  align-items: center;
}
.spec-vis-row .off {
  color: var(--ink-150);
}
.bolt {
  width: 14px;
  height: 18px;
}
.spec-value {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.spec-value .sep {
  color: var(--ink-300);
  margin: 0 6px;
  font-weight: 400;
}
.spec-value .muted {
  color: var(--ink-400);
  font-weight: 400;
}
.spec-sub {
  font-size: 12px;
  color: var(--ink-500);
}
.cap {
  width: 22px;
  height: 22px;
  border: 1px solid var(--ink-200);
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-700);
  flex-shrink: 0;
}
.cap.off {
  color: var(--ink-200);
}
.stat-band {
  margin-top: 32px;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 28px 32px 30px;
  background: radial-gradient(circle at 0% 50%, rgba(0,0,0,0.025) 0 1px, transparent 1.5px) 0 0 / 14px 14px, var(--surface);
  position: relative;
  overflow: hidden;
}
.stat-band-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
  gap: 16px;
}
.stat-band-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
.stat-cell {
  padding-right: 28px;
  border-right: 1px solid var(--border);
  min-width: 0;
}
.stat-cell:last-child {
  border-right: 0;
}
.stat-cell + .stat-cell {
  padding-left: 28px;
}
.stat-num {
  font-size: 52px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.035em;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.stat-num .unit {
  font-size: 16px;
  color: var(--ink-400);
  font-weight: 400;
  letter-spacing: 0;
}
.stat-name {
  margin-top: 14px;
  font-size: 13px;
  color: var(--ink-600);
}
.stat-delta {
  margin-top: 4px;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.stat-delta.up {
  color: var(--success);
}
.stat-delta.dn {
  color: var(--danger);
}
.stat-spark {
  margin-top: 16px;
  height: 22px;
  width: 100%;
  color: var(--ink-300);
  display: block;
}
.stat-cell.featured .stat-spark {
  color: var(--ink-900);
}
.price-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.price-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.price-card.featured {
  background: var(--ink-50);
  border-color: var(--ink-300);
}
.price-card .label {
  font-size: 13px;
  color: var(--ink-600);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.price-card .value {
  font-size: 26px;
  font-weight: 600;
  color: var(--ink-900);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.price-card .value .per {
  font-size: 13px;
  color: var(--ink-400);
  font-weight: 400;
  letter-spacing: 0;
  margin-left: 4px;
}
.compare-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 16px 24px;
}
.bar-row {
  display: grid;
  grid-template-columns: 110px 1fr 96px;
  align-items: center;
  gap: 16px;
  padding: 10px 0;
}
.bar-row + .bar-row {
  border-top: 1px dashed var(--ink-150);
}
.bar-label {
  font-size: 13px;
  color: var(--ink-700);
  font-weight: 500;
  white-space: nowrap;
}
.bar-track {
  height: 10px;
  background: var(--ink-100);
  border-radius: 3px;
  overflow: hidden;
}
.bar-fill {
  height: 100%;
  background: var(--ink-900);
  border-radius: 3px;
}
.bar-value {
  font-family: var(--fs-mono);
  font-size: 12.5px;
  color: var(--ink-900);
  text-align: right;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.asset {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.asset-pad {
  position: relative;
  background: var(--surface-sunken);
  border-bottom: 1px solid var(--border);
  overflow: hidden;
}
.asset-pad .geo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.asset-pad .tag-chip {
  position: absolute;
  top: 10px;
  left: 12px;
}
.asset-pad .dims {
  position: absolute;
  bottom: 10px;
  right: 12px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  background: var(--surface);
  border: 1px solid var(--border);
  padding: 2px 6px;
  border-radius: 4px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.ratio-16x10 {
  aspect-ratio: 16 / 10;
}
.ratio-4x5 {
  aspect-ratio: 4 / 5;
}
.ratio-1x1 {
  aspect-ratio: 1 / 1;
}
.ratio-21x9 {
  aspect-ratio: 21 / 9;
}
.asset-meta {
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.asset-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.channels {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.channel-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.channel-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--ink-100);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-700);
  flex-shrink: 0;
}
.channel-meta {
  min-width: 0;
  flex: 1;
}
.channel-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.channel-num {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  margin-top: 4px;
  font-variant-numeric: tabular-nums;
}
.timeline {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 12px 24px;
}
.timeline-row {
  display: grid;
  grid-template-columns: 18px 130px 1fr 132px;
  align-items: center;
  gap: 16px;
  padding: 12px 0;
  font-size: 13px;
}
.timeline-row + .timeline-row {
  border-top: 1px solid var(--ink-100);
}
.tl-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--ink-200);
  box-shadow: 0 0 0 1px var(--ink-200);
  margin-left: 4px;
}
.tl-dot.done {
  background: var(--ink-900);
  box-shadow: 0 0 0 1px var(--ink-900);
}
.tl-dot.active {
  background: var(--success);
  box-shadow: 0 0 0 1px var(--success), 0 0 0 5px var(--success-soft);
}
.tl-stage {
  color: var(--ink-900);
  font-weight: 500;
}
.tl-stage.muted {
  color: var(--ink-400);
  font-weight: 400;
}
.tl-bar {
  height: 6px;
  background: var(--ink-100);
  border-radius: 2px;
  overflow: hidden;
}
.tl-bar-fill {
  height: 100%;
  background: var(--ink-900);
  border-radius: 2px;
}
.tl-bar-fill.active {
  background: var(--success);
}
.tl-date {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  text-align: right;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.weeks {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.week {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.week-thumb {
  aspect-ratio: 16 / 7;
  position: relative;
  background: var(--surface-sunken);
  border-bottom: 1px solid var(--border);
  overflow: hidden;
}
.week-thumb .geo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.week-num {
  position: absolute;
  top: 12px;
  left: 14px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--ink-600);
  text-transform: uppercase;
}
.week-body {
  padding: 14px 18px 16px;
}
.week-title {
  font-size: 14px;
  font-weight: 500;
  margin: 0 0 4px;
  color: var(--ink-900);
  line-height: 1.25;
}
.week-sub {
  font-size: 12px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
}
.team {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.team-card {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 18px 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.team-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--surface-sunken);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}
.team-avatar svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.team-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.team-role {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-top: 2px;
}
.team-meta {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px dashed var(--ink-150);
  font-size: 12px;
  color: var(--ink-500);
}
.launchmap {
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--surface-sunken);
  position: relative;
  overflow: hidden;
  aspect-ratio: 21 / 9;
}
.launchmap .geo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.launchmap .lm-tag {
  position: absolute;
  top: 18px;
  left: 20px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.launchmap .lm-title {
  position: absolute;
  bottom: 22px;
  left: 22px;
  font-size: 22px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.02em;
  max-width: 58%;
  margin: 0;
}
.launchmap .lm-action {
  position: absolute;
  bottom: 22px;
  right: 22px;
}
.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.field-label {
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-700);
  display: flex;
  align-items: center;
  gap: 6px;
}
.field-label .req {
  color: var(--danger);
  font-weight: 400;
}
.field-label .hint {
  margin-left: auto;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  font-weight: 400;
}
.input {
  font-family: inherit;
  font-size: 14px;
  color: var(--ink-900);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 9px 12px;
  width: 100%;
  outline: none;
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.input::placeholder {
  color: var(--ink-400);
}
.input:hover {
  border-color: var(--border-strong);
}
.input:focus {
  border-color: var(--ink-900);
  box-shadow: 0 0 0 3px var(--ink-100);
}
.input.invalid {
  border-color: var(--danger);
}
.input.invalid:focus {
  box-shadow: 0 0 0 3px oklch(94% 0.05 30);
}
.field-help {
  font-size: 11px;
  color: var(--ink-500);
}
.field-help.err {
  color: var(--danger);
}
textarea.input {
  resize: vertical;
  min-height: 88px;
  line-height: 1.5;
}
.input-group {
  display: flex;
  align-items: stretch;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--surface);
  overflow: hidden;
}
.input-group:focus-within {
  border-color: var(--ink-900);
  box-shadow: 0 0 0 3px var(--ink-100);
}
.input-group .input {
  border: 0;
  border-radius: 0;
  padding: 9px 12px;
}
.input-group .input:focus {
  box-shadow: none;
}
.input-group .addon {
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-500);
  background: var(--ink-50);
  border-right: 1px solid var(--border);
  white-space: nowrap;
}
.input-group .addon.trailing {
  border-right: 0;
  border-left: 1px solid var(--border);
}
.choice {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  font-size: 14px;
  color: var(--ink-900);
}
.choice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.choice .box, .choice .dot {
  width: 16px;
  height: 16px;
  border: 1px solid var(--border-strong);
  background: var(--surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.choice .box {
  border-radius: 4px;
}
.choice .dot {
  border-radius: 50%;
}
.choice .box svg {
  opacity: 0;
  color: var(--ink-0);
}
.choice .dot::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ink-0);
  opacity: 0;
  transition: opacity var(--dur-fast) var(--ease-out);
}
.choice:hover .box, .choice:hover .dot {
  border-color: var(--ink-900);
}
.choice input:checked ~ .box {
  background: var(--ink-900);
  border-color: var(--ink-900);
}
.choice input:checked ~ .box svg {
  opacity: 1;
}
.choice input:checked ~ .dot {
  background: var(--ink-900);
  border-color: var(--ink-900);
}
.choice input:checked ~ .dot::after {
  opacity: 1;
}
.dropzone {
  border: 1px dashed var(--border-strong);
  border-radius: var(--r-md);
  background: var(--ink-50);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
  color: var(--ink-600);
  font-size: 13px;
}
.dropzone .title {
  color: var(--ink-900);
  font-weight: 500;
  font-size: 14px;
}
.dropzone .mono {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ink-100);
  color: var(--ink-700);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.01em;
  border: 1px solid var(--border);
  flex-shrink: 0;
  overflow: hidden;
  position: relative;
}
.avatar svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.avatar.dark {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.avatar.sm {
  width: 24px;
  height: 24px;
  font-size: 10px;
}
.avatar.lg {
  width: 48px;
  height: 48px;
  font-size: 16px;
}
.avatar-stack {
  display: inline-flex;
  align-items: center;
}
.avatar-stack .avatar {
  box-shadow: 0 0 0 2px var(--surface);
  margin-left: -10px;
}
.avatar-stack .avatar:first-child {
  margin-left: 0;
}
.avatar-stack .more {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--surface);
  border: 1px solid var(--border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: -10px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  box-shadow: 0 0 0 2px var(--surface);
}
.tabs {
  display: flex;
  align-items: stretch;
  gap: 0;
  border-bottom: 1px solid var(--border);
}
.tab {
  background: none;
  border: 0;
  font-family: inherit;
  font-size: 14px;
  color: var(--ink-500);
  padding: 10px 16px;
  cursor: pointer;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-bottom: 1.5px solid transparent;
  margin-bottom: -1px;
  transition: color var(--dur-fast) var(--ease-out);
}
.tab:hover {
  color: var(--ink-900);
}
.tab.active {
  color: var(--ink-900);
  font-weight: 500;
  border-bottom-color: var(--ink-900);
}
.tab .count {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  background: var(--ink-100);
  padding: 1px 6px;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
}
.tab.active .count {
  background: var(--ink-900);
  color: var(--ink-0);
}
.breadcrumbs {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--ink-500);
}
.breadcrumbs a, .breadcrumbs button {
  color: inherit;
  background: none;
  border: 0;
  padding: 2px 6px;
  border-radius: 4px;
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
}
.breadcrumbs a:hover, .breadcrumbs button:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.breadcrumbs .sep {
  color: var(--ink-300);
}
.breadcrumbs .current {
  color: var(--ink-900);
  font-weight: 500;
  padding: 2px 6px;
}
.pagination {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  padding: 3px;
  background: var(--surface);
}
.page-btn {
  background: none;
  border: 0;
  font-family: var(--fs-mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: var(--ink-600);
  width: 28px;
  height: 28px;
  border-radius: var(--r-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.page-btn:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.page-btn.active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.page-btn.ellipsis {
  color: var(--ink-400);
  cursor: default;
}
.page-btn.ellipsis:hover {
  background: none;
}
.tooltip-wrap {
  position: relative;
  display: inline-block;
}
.tooltip {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--ink-900);
  color: var(--ink-0);
  font-size: 11.5px;
  padding: 5px 10px;
  border-radius: 6px;
  white-space: nowrap;
  box-shadow: var(--shadow-2);
}
.tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top-color: var(--ink-900);
}
.tooltip .kbd-dark {
  font-family: var(--fs-mono);
  font-size: 10px;
  margin-left: 6px;
  padding: 1px 5px;
  border-radius: 4px;
  background: rgba(255,255,255,0.12);
  color: var(--ink-0);
}
.menu {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-3);
  padding: 5px;
  min-width: 220px;
  font-size: 13px;
}
.menu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 10px;
  border-radius: var(--r-xs);
  color: var(--ink-700);
  cursor: pointer;
  background: none;
  border: 0;
  width: 100%;
  font-family: inherit;
  font-size: inherit;
  text-align: left;
}
.menu-item:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.menu-item .shortcut {
  margin-left: auto;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.02em;
}
.menu-item.danger {
  color: var(--danger);
}
.menu-item.danger:hover {
  background: oklch(96% 0.04 30);
}
.menu-section {
  padding: 6px 10px 4px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.menu-divider {
  height: 1px;
  background: var(--ink-100);
  margin: 4px -5px;
}
.sheet {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-3);
  overflow: hidden;
}
.sheet-head {
  padding: 18px 24px 14px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--border);
}
.sheet-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--ink-900);
  letter-spacing: -0.01em;
  margin: 0 0 4px;
}
.sheet-sub {
  font-size: 13px;
  color: var(--ink-500);
  margin: 0;
}
.sheet-body {
  padding: 20px 24px;
}
.sheet-foot {
  padding: 14px 24px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  background: var(--ink-50);
}
.banner {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 14px 18px;
  display: grid;
  grid-template-columns: 22px 1fr auto;
  gap: 14px;
  align-items: start;
  background: var(--surface);
  position: relative;
  overflow: hidden;
}
.banner::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--ink-300);
}
.banner .icon {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-500);
  flex-shrink: 0;
  margin-top: 1px;
}
.banner .msg {
  min-width: 0;
}
.banner .title {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.005em;
  margin: 0 0 2px;
  line-height: 1.4;
}
.banner .desc {
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.5;
  margin: 0;
}
.banner .action {
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--ink-900);
  background: none;
  border: 0;
  padding: 4px 8px;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: underline;
  text-decoration-color: var(--ink-300);
  text-underline-offset: 3px;
  align-self: center;
}
.banner .action:hover {
  text-decoration-color: var(--ink-900);
}
.banner.success::before {
  background: var(--success);
}
.banner.success .icon {
  color: var(--success);
}
.banner.warn::before {
  background: var(--warn);
}
.banner.warn .icon {
  color: oklch(50% 0.16 70);
}
.banner.danger::before {
  background: var(--danger);
}
.banner.danger .icon {
  color: var(--danger);
}
.toast {
  background: var(--ink-900);
  color: var(--ink-0);
  border-radius: var(--r-md);
  padding: 12px 12px 12px 16px;
  display: grid;
  grid-template-columns: 8px 1fr auto auto;
  gap: 14px;
  align-items: center;
  box-shadow: var(--shadow-3);
  font-size: 13px;
  min-width: 380px;
  max-width: 480px;
}
.toast .pip {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--success);
  flex-shrink: 0;
  box-shadow: 0 0 0 3px oklch(35% 0.08 150);
}
.toast .pip.warn {
  background: var(--warn);
  box-shadow: 0 0 0 3px oklch(40% 0.1 80);
}
.toast .pip.danger {
  background: var(--danger);
  box-shadow: 0 0 0 3px oklch(40% 0.13 30);
}
.toast .msg {
  min-width: 0;
  line-height: 1.35;
}
.toast .msg .meta {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  margin-top: 3px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  display: block;
}
.toast .undo {
  background: none;
  border: 0;
  color: var(--ink-0);
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 500;
  padding: 5px 10px;
  border-radius: 4px;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: var(--ink-500);
  text-underline-offset: 3px;
}
.toast .undo:hover {
  text-decoration-color: var(--ink-0);
}
.toast .close {
  background: none;
  border: 0;
  color: var(--ink-400);
  width: 24px;
  height: 24px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.toast .close:hover {
  color: var(--ink-0);
  background: rgba(255,255,255,0.06);
}
.empty {
  border: 1px dashed var(--border-strong);
  border-radius: var(--r-md);
  background: var(--ink-50);
  padding: 36px 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}
.empty .mark {
  width: 44px;
  height: 44px;
  border-radius: var(--r-md);
  background: var(--surface);
  border: 1px solid var(--border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-500);
  margin-bottom: 4px;
}
.empty .title {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.empty .desc {
  font-size: 12.5px;
  color: var(--ink-500);
  max-width: 38ch;
  line-height: 1.5;
}
.empty .actions {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}
.progress {
  height: 6px;
  background: var(--ink-100);
  border-radius: 3px;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.progress > .bar {
  height: 100%;
  background: var(--ink-900);
  border-radius: 3px;
  transition: width var(--dur-slow) var(--ease-out);
}
.progress > .bar.success {
  background: var(--success);
}
.progress.tall {
  height: 10px;
  border-radius: 5px;
}
.progress.tall > .bar {
  border-radius: 5px;
}
.progress-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
}
.progress-row .label {
  font-size: 13px;
  color: var(--ink-700);
}
.progress-row .val {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
}
.ring {
  --pct: 64;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: conic-gradient(var(--ink-900) calc(var(--pct) * 1%), var(--ink-100) 0);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex-shrink: 0;
}
.ring::after {
  content: "";
  position: absolute;
  inset: 5px;
  background: var(--surface);
  border-radius: 50%;
}
.ring .val {
  position: relative;
  font-family: var(--fs-mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: var(--ink-900);
  z-index: 1;
}
.stepper {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  align-items: start;
  gap: 0;
  position: relative;
}
.stepper-cell {
  position: relative;
  padding-top: 28px;
  padding-right: 16px;
}
.stepper-cell::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--ink-200);
}
.stepper-cell:last-child::before {
  right: 50%;
}
.stepper-cell:first-child::before {
  left: 50%;
}
.stepper-dot {
  position: absolute;
  top: 4px;
  left: calc(50% - 6px);
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--surface);
  border: 2px solid var(--ink-300);
}
.stepper-cell.done .stepper-dot {
  border-color: var(--ink-900);
  background: var(--ink-900);
}
.stepper-cell.active .stepper-dot {
  border-color: var(--success);
  background: var(--success);
  box-shadow: 0 0 0 4px var(--success-soft);
}
.stepper-cell.done::before, .stepper-cell.active::before {
  background: var(--ink-900);
}
.stepper-cell .name {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--ink-900);
  text-align: center;
}
.stepper-cell.idle .name {
  color: var(--ink-400);
  font-weight: 400;
}
.stepper-cell .sub {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  margin-top: 2px;
  font-variant-numeric: tabular-nums;
  text-align: center;
}
@keyframes sk-shimmer {
  0% {
    background-position: -200px 0;
  }
  100% {
    background-position: 200px 0;
  }
}
.sk {
  background: linear-gradient(90deg, var(--ink-100) 25%, var(--ink-150) 50%, var(--ink-100) 75%);
  background-size: 400px 100%;
  animation: sk-shimmer 1.4s linear infinite;
  border-radius: 4px;
}
.sk-line {
  height: 10px;
}
.sk-line.thick {
  height: 14px;
}
.sk-box {
  height: 60px;
  border-radius: var(--r-md);
}
.sk-circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  padding: 4px 6px 4px 10px;
  font-size: 12.5px;
  color: var(--ink-700);
  white-space: nowrap;
}
.chip .k {
  color: var(--ink-500);
}
.chip .v {
  font-weight: 500;
  color: var(--ink-900);
}
.chip .x {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--ink-100);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-500);
  cursor: pointer;
  border: 0;
}
.chip .x:hover {
  background: var(--ink-200);
  color: var(--ink-900);
}
.chip.applied {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.chip.applied .k {
  color: var(--ink-300);
}
.chip.applied .v {
  color: var(--ink-0);
}
.chip.applied .x {
  background: var(--ink-700);
  color: var(--ink-300);
}
.chip.applied .x:hover {
  background: var(--ink-600);
  color: var(--ink-0);
}
.kpi {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 18px 20px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  position: relative;
  overflow: hidden;
}
.kpi .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.kpi .label .trend {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
  text-transform: none;
  white-space: nowrap;
}
.kpi .label .trend.up {
  color: var(--success);
}
.kpi .label .trend.dn {
  color: var(--danger);
}
.kpi .value {
  font-size: 34px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.035em;
  line-height: 1.0;
  font-variant-numeric: tabular-nums;
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-top: 2px;
}
.kpi .value .u {
  font-size: 14px;
  color: var(--ink-400);
  font-weight: 400;
  letter-spacing: 0;
}
.kpi .spark {
  height: 28px;
  width: 100%;
  color: var(--ink-300);
  display: block;
  margin-top: 2px;
}
.kpi.featured .spark {
  color: var(--ink-900);
}
.kpi .foot {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
  border-top: 1px solid var(--ink-100);
  padding-top: 10px;
  margin-top: 2px;
}
.kpi .foot .pip {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--ink-300);
  flex-shrink: 0;
}
.kpi .foot .pip.up {
  background: var(--success);
}
.kpi .foot .pip.dn {
  background: var(--danger);
}
.feed {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 0;
  overflow: hidden;
}
.feed-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 56px;
  column-gap: 14px;
  align-items: start;
  padding: 14px 20px 14px 18px;
  position: relative;
}
.feed-row + .feed-row {
  border-top: 1px solid var(--ink-100);
}
.feed-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ink-100);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-700);
  flex-shrink: 0;
  margin-top: 0;
}
.feed-icon.done {
  background: var(--success-soft);
  color: var(--success);
}
.feed-icon.warn {
  background: oklch(94% 0.06 80);
  color: oklch(50% 0.16 70);
}
.feed-icon.danger {
  background: oklch(94% 0.04 30);
  color: var(--danger);
}
.feed-body {
  min-width: 0;
  font-size: 13px;
  color: var(--ink-600);
  line-height: 1.5;
  padding-top: 5px;
}
.feed-body strong {
  color: var(--ink-900);
  font-weight: 500;
}
.feed-body .sub {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  display: block;
  margin-top: 4px;
}
.feed-time {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  text-align: right;
  padding-top: 9px;
  letter-spacing: -0.01em;
}
.cal-mini {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 14px 16px 16px;
  width: fit-content;
}
.cal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.cal-head .month {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.cal-head .nav {
  display: inline-flex;
  gap: 2px;
}
.cal-nav-btn {
  width: 24px;
  height: 24px;
  border: 0;
  background: none;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--ink-500);
}
.cal-nav-btn:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 28px);
  gap: 2px;
  font-variant-numeric: tabular-nums;
}
.cal-grid .dow {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  text-align: center;
  padding: 4px 0;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.cal-day {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--ink-700);
  cursor: pointer;
  background: none;
  border: 0;
  font-family: inherit;
}
.cal-day:hover {
  background: var(--ink-100);
}
.cal-day.muted {
  color: var(--ink-300);
}
.cal-day.today {
  box-shadow: inset 0 0 0 1px var(--ink-300);
}
.cal-day.selected {
  background: var(--ink-900);
  color: var(--ink-0);
  font-weight: 500;
}
.cal-day.dot {
  position: relative;
}
.cal-day.dot::after {
  content: "";
  position: absolute;
  bottom: 3px;
  left: 50%;
  transform: translateX(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--brand);
}
.cal-day.selected.dot::after {
  background: var(--ink-0);
}
.code {
  background: var(--ink-900);
  color: var(--ink-100);
  border-radius: var(--r-md);
  overflow: hidden;
  font-family: var(--fs-mono);
  font-size: 12.5px;
  line-height: 1.55;
}
.code-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  background: var(--ink-700);
  color: var(--ink-300);
  font-size: 11px;
}
.code-head .tabs {
  display: inline-flex;
  gap: 4px;
  border-bottom: 0;
}
.code-head .tabs .tab {
  padding: 4px 10px;
  color: var(--ink-300);
  border-radius: 4px;
  border-bottom: 0;
  font-family: var(--fs-mono);
  font-size: 11px;
  margin-bottom: 0;
}
.code-head .tabs .tab.active {
  color: var(--ink-0);
  background: var(--ink-900);
}
.code-head .copy-btn {
  background: none;
  border: 0;
  color: var(--ink-400);
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  font-family: inherit;
  font-size: 11px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.code-head .copy-btn:hover {
  color: var(--ink-0);
  background: var(--ink-600);
}
.code-body {
  padding: 14px 16px;
}
.code-body pre {
  margin: 0;
  white-space: pre;
}
.tok-key {
  color: oklch(78% 0.12 80);
}
.tok-str {
  color: oklch(78% 0.1 150);
}
.tok-num {
  color: oklch(72% 0.13 220);
}
.tok-com {
  color: var(--ink-500);
}
.tok-pun {
  color: var(--ink-400);
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.spinner {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1.6px solid var(--ink-200);
  border-top-color: var(--ink-900);
  animation: spin 0.9s linear infinite;
  display: inline-block;
}
.spinner.sm {
  width: 12px;
  height: 12px;
  border-width: 1.4px;
}
.spinner.lg {
  width: 28px;
  height: 28px;
  border-width: 2px;
}
.spinner.invert {
  border-color: rgba(255,255,255,0.18);
  border-top-color: var(--ink-0);
}
@keyframes barslide {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(200%);
  }
}
.bar-indeterminate {
  height: 3px;
  background: var(--ink-100);
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}
.bar-indeterminate::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 40%;
  background: var(--ink-900);
  animation: barslide 1.4s ease-in-out infinite;
  border-radius: 2px;
}
.slider-wrap {
  padding: 18px 8px 6px;
  min-width: 260px;
}
.slider {
  position: relative;
  height: 4px;
  background: var(--ink-100);
  border-radius: 2px;
  width: 100%;
}
.slider .fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: var(--ink-900);
  border-radius: 2px;
}
.slider .handle {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 14px;
  height: 14px;
  background: var(--ink-0);
  border: 1.5px solid var(--ink-900);
  border-radius: 50%;
  box-shadow: var(--shadow-1);
}
.slider .bubble {
  position: absolute;
  bottom: 100%;
  transform: translate(-50%, -8px);
  background: var(--ink-900);
  color: var(--ink-0);
  font-family: var(--fs-mono);
  font-size: 10.5px;
  padding: 3px 7px;
  border-radius: 4px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.slider .bubble::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 3px solid transparent;
  border-top-color: var(--ink-900);
}
.slider-row {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.slider-range .handle-min, .slider-range .handle-max {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 14px;
  height: 14px;
  background: var(--ink-0);
  border: 1.5px solid var(--ink-900);
  border-radius: 50%;
  box-shadow: var(--shadow-1);
}
.multi-select {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 6px 8px;
  background: var(--surface);
  min-height: 40px;
  cursor: text;
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.multi-select:hover {
  border-color: var(--border-strong);
}
.multi-select.focused {
  border-color: var(--ink-900);
  box-shadow: 0 0 0 3px var(--ink-100);
}
.ms-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--ink-100);
  border-radius: 4px;
  padding: 2px 4px 2px 8px;
  font-size: 12.5px;
  color: var(--ink-900);
  font-weight: 500;
  white-space: nowrap;
}
.ms-chip .x {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  background: none;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-500);
  cursor: pointer;
}
.ms-chip .x:hover {
  color: var(--ink-900);
  background: var(--ink-200);
}
.ms-input {
  border: 0;
  outline: none;
  background: none;
  font: inherit;
  font-size: 13px;
  color: var(--ink-900);
  padding: 4px 4px;
  flex: 1;
  min-width: 80px;
}
.ms-input::placeholder {
  color: var(--ink-400);
}
.accordion {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
}
.accordion-row + .accordion-row {
  border-top: 1px solid var(--border);
}
.accordion-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  cursor: pointer;
  background: none;
  border: 0;
  width: 100%;
  font-family: inherit;
  font-size: inherit;
  text-align: left;
  color: var(--ink-900);
}
.accordion-head:hover {
  background: var(--ink-50);
}
.accordion-head .title {
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 10px;
}
.accordion-head .num {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.08em;
}
.accordion-head .right {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--ink-500);
  font-size: 12.5px;
}
.accordion-head .chev {
  transition: transform var(--dur-base) var(--ease-out);
  color: var(--ink-400);
}
.accordion-row.open .chev {
  transform: rotate(180deg);
  color: var(--ink-900);
}
.accordion-body {
  padding: 0 18px 16px;
  color: var(--ink-600);
  font-size: 13px;
  line-height: 1.55;
  display: none;
}
.accordion-row.open .accordion-body {
  display: block;
}
.tree {
  font-size: 13px;
  font-family: var(--fs-mono);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 6px 0;
}
.tree-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 14px;
  color: var(--ink-700);
  cursor: pointer;
  position: relative;
}
.tree-row:hover {
  background: var(--ink-50);
}
.tree-row.selected {
  background: var(--ink-100);
  color: var(--ink-900);
}
.tree-row.depth-1 {
  padding-left: 32px;
}
.tree-row.depth-2 {
  padding-left: 52px;
}
.tree-row.depth-3 {
  padding-left: 72px;
}
.tree-row .twg {
  color: var(--ink-400);
  width: 12px;
  display: inline-flex;
  justify-content: center;
}
.tree-row .ico {
  color: var(--ink-500);
  display: inline-flex;
}
.tree-row .name {
  font-family: var(--fs-sans);
  font-size: 13px;
}
.tree-row .meta {
  margin-left: auto;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.mention {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: var(--ink-100);
  color: var(--ink-900);
  padding: 1px 8px 1px 4px;
  border-radius: 999px;
  font-weight: 500;
  font-size: 0.94em;
  line-height: 1.3;
  vertical-align: baseline;
}
.mention .avatar.sm {
  width: 18px;
  height: 18px;
  font-size: 9px;
  border-radius: 50%;
}
.mention.tag {
  background: oklch(94% 0.04 50);
  color: oklch(40% 0.08 50);
}
.trend-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--fs-mono);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  color: var(--ink-500);
  background: var(--ink-100);
  padding: 2px 8px;
  border-radius: 999px;
  white-space: nowrap;
  letter-spacing: -0.01em;
}
.trend-pill.up {
  color: var(--success);
  background: var(--success-soft);
}
.trend-pill.dn {
  color: var(--danger);
  background: oklch(94% 0.04 30);
}
.color-picker {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.color-swatch {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1.5px solid transparent;
  cursor: pointer;
  position: relative;
  background: var(--ink-300);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.color-swatch::after {
  content: "";
  position: absolute;
  inset: 1.5px;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.08);
}
.color-swatch.selected {
  border-color: var(--ink-900);
}
.color-swatch.selected svg {
  color: var(--ink-0);
  position: relative;
  z-index: 1;
}
.person-row {
  display: grid;
  grid-template-columns: 36px 1fr auto auto;
  gap: 14px;
  align-items: center;
  padding: 12px 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.person-row + .person-row {
  margin-top: 6px;
}
.person-row .avatar {
  width: 36px;
  height: 36px;
  font-size: 12px;
}
.person-row .name {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink-900);
}
.person-row .meta {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: 2px;
}
.person-row .stat {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-700);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.person-row .stat .label {
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 2px;
  font-weight: 400;
}
.bell {
  position: relative;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: var(--r-pill);
  color: var(--ink-600);
  cursor: pointer;
}
.bell:hover {
  color: var(--ink-900);
  border-color: var(--border-strong);
}
.bell .count-badge {
  position: absolute;
  top: -3px;
  right: -3px;
  min-width: 16px;
  height: 16px;
  padding: 0 5px;
  background: var(--ink-900);
  color: var(--ink-0);
  border-radius: 999px;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--surface);
  font-variant-numeric: tabular-nums;
}
.bell .count-badge.danger {
  background: var(--danger);
}
.num-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  background: var(--ink-100);
  color: var(--ink-700);
  border-radius: 999px;
  font-family: var(--fs-mono);
  font-size: 10.5px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.num-badge.dark {
  background: var(--ink-900);
  color: var(--ink-0);
}
.num-badge.danger {
  background: var(--danger);
  color: var(--ink-0);
}
.inline-edit {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  border-radius: 4px;
  border: 1px dashed transparent;
  font-size: 14px;
  color: var(--ink-900);
  cursor: text;
}
.inline-edit:hover {
  border-color: var(--border-strong);
  background: var(--ink-50);
}
.inline-edit.editing {
  border-color: var(--ink-900);
  background: var(--surface);
  border-style: solid;
}
.inline-edit .input-inline {
  border: 0;
  outline: none;
  background: none;
  font: inherit;
  color: inherit;
  padding: 0;
  width: 200px;
}
.inline-edit .pencil {
  color: var(--ink-400);
  opacity: 0;
  transition: opacity var(--dur-fast);
}
.inline-edit:hover .pencil {
  opacity: 1;
}
.qabar {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  background: var(--ink-900);
  border-radius: var(--r-pill);
  padding: 4px;
  box-shadow: var(--shadow-3);
}
.qa-btn {
  background: none;
  border: 0;
  color: var(--ink-300);
  width: 32px;
  height: 32px;
  border-radius: var(--r-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.qa-btn:hover {
  color: var(--ink-0);
  background: rgba(255,255,255,0.08);
}
.qa-btn.active {
  color: var(--ink-0);
  background: rgba(255,255,255,0.12);
}
.qabar .qa-divider {
  width: 1px;
  height: 18px;
  background: rgba(255,255,255,0.14);
  margin: 0 4px;
}
.qabar .qa-count {
  padding: 0 12px;
  color: var(--ink-300);
  font-size: 12px;
  font-family: var(--fs-mono);
  font-variant-numeric: tabular-nums;
}
.qabar .qa-count strong {
  color: var(--ink-0);
  font-weight: 500;
}
.diff {
  font-family: var(--fs-mono);
  font-size: 12.5px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 0;
  overflow: hidden;
}
.diff-row {
  display: grid;
  grid-template-columns: 28px 1fr;
  padding: 4px 0;
  line-height: 1.5;
}
.diff-row .gut {
  text-align: right;
  color: var(--ink-400);
  font-size: 10px;
  padding-right: 8px;
  border-right: 1px solid var(--ink-100);
}
.diff-row .line {
  padding-left: 12px;
  color: var(--ink-700);
  white-space: pre;
}
.diff-row.add {
  background: oklch(96% 0.04 150);
}
.diff-row.add .gut {
  color: var(--success);
}
.diff-row.add .gut::before {
  content: "+";
  margin-right: 4px;
}
.diff-row.rem {
  background: oklch(96% 0.03 30);
}
.diff-row.rem .gut {
  color: var(--danger);
}
.diff-row.rem .gut::before {
  content: "−";
  margin-right: 4px;
}
.diff-head {
  background: var(--ink-50);
  padding: 8px 14px;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
}
.drag-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.drag-row {
  display: grid;
  grid-template-columns: 24px 24px 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 10px 14px 10px 6px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  font-size: 13px;
  color: var(--ink-700);
  cursor: grab;
}
.drag-row:hover {
  border-color: var(--border-strong);
}
.drag-row .handle {
  color: var(--ink-300);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  cursor: grab;
}
.drag-row .handle:hover {
  color: var(--ink-600);
}
.drag-row .ord {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.drag-row .name {
  color: var(--ink-900);
  font-weight: 500;
}
.drag-row .sub {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.spark-card {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 14px 16px;
}
.spark-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
}
.spark-title {
  font-size: 12px;
  color: var(--ink-500);
}
.spark-value {
  font-size: 18px;
  font-weight: 500;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.spark-svg {
  width: 100%;
  height: 48px;
  color: var(--ink-900);
  display: block;
}
.pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11.5px;
  font-weight: 500;
  padding: 3px 9px 3px 7px;
  border-radius: 999px;
  background: var(--ink-100);
  color: var(--ink-700);
  white-space: nowrap;
}
.pill svg {
  width: 11px;
  height: 11px;
  flex-shrink: 0;
}
.pill.success {
  background: var(--success-soft);
  color: oklch(35% 0.1 150);
}
.pill.danger {
  background: oklch(94% 0.04 30);
  color: oklch(38% 0.13 30);
}
.pill.warn {
  background: oklch(95% 0.06 80);
  color: oklch(45% 0.16 70);
}
.pill.brand {
  background: var(--brand-soft);
  color: var(--brand-ink);
}
.cmd {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-3);
  overflow: hidden;
  width: 100%;
  max-width: 540px;
}
.cmd-input {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  color: var(--ink-700);
}
.cmd-input input {
  border: 0;
  outline: none;
  flex: 1;
  font: inherit;
  font-size: 14px;
  background: none;
}
.cmd-input .kbd {
  margin-left: auto;
}
.cmd-section {
  padding: 10px 18px 4px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.cmd-row {
  display: grid;
  grid-template-columns: 22px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 8px 18px;
  cursor: pointer;
  font-size: 13.5px;
  color: var(--ink-700);
}
.cmd-row:hover, .cmd-row.active {
  background: var(--ink-100);
  color: var(--ink-900);
}
.cmd-row .ico {
  color: var(--ink-500);
  display: inline-flex;
}
.cmd-row .meta {
  color: var(--ink-400);
  font-size: 12px;
  font-family: var(--fs-mono);
}
.cmd-row strong {
  font-weight: 500;
}
.cmd-row mark {
  background: oklch(95% 0.08 80);
  color: var(--ink-900);
  border-radius: 2px;
  padding: 0 1px;
}
.picker-row {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 10px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.picker-row + .picker-row {
  margin-top: 4px;
}
.picker-row.selected {
  border-color: var(--ink-900);
  background: var(--ink-50);
}
.picker-thumb {
  width: 36px;
  height: 36px;
  border-radius: 6px;
  background: var(--ink-100);
  position: relative;
  overflow: hidden;
  border: 1px solid var(--border);
}
.picker-thumb svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.picker-title {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink-900);
}
.picker-meta {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
  margin-top: 2px;
}
.big-metric {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 28px 32px 24px;
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 32px;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.big-metric .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.big-metric .head > span:first-child {
  min-width: 0;
  flex: 1;
}
.big-metric .value {
  font-size: 76px;
  line-height: 0.95;
  font-weight: 500;
  letter-spacing: -0.04em;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.big-metric .value .u {
  font-size: 22px;
  color: var(--ink-400);
  font-weight: 400;
  letter-spacing: -0.01em;
}
.big-metric .below {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 16px;
  font-size: 12.5px;
  color: var(--ink-500);
  align-items: center;
}
.big-metric .below b {
  color: var(--ink-900);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.big-metric .right {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.big-metric .spark-big {
  width: 100%;
  height: 90px;
  color: var(--ink-900);
}
.big-metric .breakdown {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.big-metric .br-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  font-size: 12px;
  color: var(--ink-600);
  align-items: center;
}
.big-metric .br-row .v {
  font-family: var(--fs-mono);
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.funnel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.funnel-row {
  display: grid;
  grid-template-columns: 1fr 70px 70px;
  gap: 14px;
  align-items: center;
  padding: 8px 0;
}
.funnel-row + .funnel-row {
  border-top: 1px dashed var(--ink-100);
}
.funnel-name {
  font-size: 13px;
  color: var(--ink-900);
  font-weight: 500;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.funnel-name .step {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-400);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 400;
}
.funnel-bar {
  position: relative;
  height: 24px;
  background: var(--ink-100);
  border-radius: 4px;
  overflow: hidden;
}
.funnel-row.with-bar {
  grid-template-columns: 130px 1fr 84px 64px;
}
.funnel-bar .fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: var(--ink-900);
  border-radius: 4px;
}
.funnel-bar .label-on {
  position: relative;
  z-index: 1;
  color: var(--ink-0);
  font-family: var(--fs-mono);
  font-size: 11px;
  padding: 0 10px;
  line-height: 24px;
  font-variant-numeric: tabular-nums;
}
.funnel .v {
  font-family: var(--fs-mono);
  font-size: 12.5px;
  color: var(--ink-900);
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
.funnel .drop {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.funnel .drop.high {
  color: var(--danger);
}
.cohort {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 20px;
}
.cohort-grid {
  display: grid;
  grid-template-columns: 92px repeat(6, 1fr);
  gap: 3px;
}
.cohort-head {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  padding: 4px 0;
}
.cohort-row-label {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-700);
  padding: 0 8px 0 0;
  display: flex;
  align-items: center;
  font-variant-numeric: tabular-nums;
}
.cohort-cell {
  aspect-ratio: 1.2 / 1;
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  background: var(--ink-50);
}
.cohort-cell.empty {
  background: transparent;
  color: var(--ink-300);
}
.split-bar {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 22px;
}
.split-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 12px;
}
.split-head h4 {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
}
.split-head .total {
  font-family: var(--fs-mono);
  font-size: 13px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
.split-track {
  display: flex;
  width: 100%;
  height: 14px;
  border-radius: 3px;
  overflow: hidden;
  background: var(--ink-100);
}
.split-segment {
  height: 100%;
  transition: width var(--dur-slow) var(--ease-out);
}
.split-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 14px;
  font-size: 12px;
}
.split-legend .leg {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-700);
}
.split-legend .leg .swatch {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  flex-shrink: 0;
}
.split-legend .leg .val {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
  margin-left: 4px;
}
.top-list {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 6px 0;
}
.top-row {
  display: grid;
  grid-template-columns: 22px 1fr 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 10px 18px;
}
.top-row + .top-row {
  border-top: 1px solid var(--ink-100);
}
.top-row .rank {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
}
.top-row .nm {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  display: flex;
  align-items: center;
  gap: 8px;
}
.top-row .mini-track {
  height: 6px;
  background: var(--ink-100);
  border-radius: 2px;
  overflow: hidden;
}
.top-row .mini-track .fill {
  height: 100%;
  background: var(--ink-900);
  border-radius: 2px;
}
.top-row .v {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  text-align: right;
  font-weight: 500;
}
.date-range {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  background: var(--surface);
  padding: 3px;
  gap: 2px;
}
.dr-preset {
  border: 0;
  background: none;
  padding: 5px 12px;
  border-radius: var(--r-pill);
  font: inherit;
  font-size: 12.5px;
  color: var(--ink-500);
  cursor: pointer;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.dr-preset:hover {
  color: var(--ink-900);
}
.dr-preset.active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.dr-custom {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px 5px 10px;
  border-radius: var(--r-pill);
  font-size: 12.5px;
  color: var(--ink-700);
  font-variant-numeric: tabular-nums;
  border: 0;
  background: var(--ink-50);
  cursor: pointer;
}
.dr-custom svg {
  color: var(--ink-500);
}
.dr-custom:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.goal-ring {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 22px;
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 22px;
  align-items: center;
}
.goal-ring .ring {
  --pct: 64;
  width: 130px;
  height: 130px;
  background: conic-gradient(var(--ink-900) calc(var(--pct) * 1%), var(--ink-100) 0);
  position: relative;
  border-radius: 50%;
}
.goal-ring .ring::after {
  content: "";
  position: absolute;
  inset: 10px;
  background: var(--surface);
  border-radius: 50%;
}
.goal-ring .ring-inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 1;
  font-family: var(--fs-sans);
}
.goal-ring .ring-inner .pct {
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  color: var(--ink-900);
}
.goal-ring .ring-inner .lbl {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-top: 4px;
}
.goal-ring .stats {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.goal-ring .stat-line {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: baseline;
}
.goal-ring .stat-line .lbl {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.goal-ring .stat-line .v {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.goal-ring .stat-line .v.muted {
  color: var(--ink-400);
}
.ticker {
  background: var(--ink-900);
  color: var(--ink-100);
  border-radius: var(--r-md);
  padding: 0;
  overflow: hidden;
  font-family: var(--fs-mono);
  font-size: 12px;
}
.ticker-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  background: var(--ink-700);
  color: var(--ink-300);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.ticker-head .live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: oklch(75% 0.13 150);
}
.ticker-head .live::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: oklch(75% 0.13 150);
  box-shadow: 0 0 0 3px rgba(120, 200, 150, 0.18);
  animation: tick-blink 1.2s ease-in-out infinite;
}
@keyframes tick-blink {
  50% {
    opacity: 0.35;
  }
}
.ticker-body {
  padding: 0;
}
.ticker-row {
  display: grid;
  grid-template-columns: 60px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 8px 16px;
  font-variant-numeric: tabular-nums;
}
.ticker-row + .ticker-row {
  border-top: 1px solid rgba(255,255,255,0.05);
}
.ticker-row .ts {
  color: var(--ink-400);
  letter-spacing: -0.01em;
}
.ticker-row .msg {
  color: var(--ink-100);
  font-family: var(--fs-sans);
  font-size: 13px;
}
.ticker-row .msg b {
  color: var(--ink-0);
  font-weight: 500;
}
.ticker-row .tag {
  color: var(--ink-300);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.ticker-row.success .msg b {
  color: oklch(78% 0.12 150);
}
.ticker-row.warn .msg b {
  color: oklch(78% 0.13 80);
}
[data-theme="dark"] {
  --ink-0: #1A1916;
  --ink-50: #1F1E1B;
  --ink-100: #26241F;
  --ink-150: #2E2C27;
  --ink-200: #3A3832;
  --ink-300: #534F47;
  --ink-400: #7A7569;
  --ink-500: #98948A;
  --ink-600: #BAB6AC;
  --ink-700: #DEDAD0;
  --ink-900: #F4F2EC;
  --bg: #1A1916;
  --surface: #1F1E1B;
  --surface-sunken: #26241F;
  --border: #3A3832;
  --border-strong: #534F47;
  --brand-soft: oklch(30% 0.05 50);
  --success-soft: oklch(28% 0.05 150);
  --shadow-1: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-2: 0 2px 8px rgba(0,0,0,0.5), 0 1px 2px rgba(0,0,0,0.3);
  --shadow-3: 0 8px 24px rgba(0,0,0,0.6), 0 2px 6px rgba(0,0,0,0.4);
}
[data-density="compact"] {
  --s-3: 8px;
  --s-4: 12px;
  --s-5: 18px;
  --s-6: 24px;
}
[data-density="compact"] .btn {
  padding: 6px 14px;
  font-size: 13px;
}
[data-density="compact"] .input {
  padding: 6px 10px;
  font-size: 13px;
}
[data-density="compact"] .topbar {
  height: 52px;
}
[data-density="compact"] .nav-link {
  padding: 4px 10px;
  font-size: 12.5px;
}
[data-density="compact"] .dt-row {
  padding: 6px 14px;
}
[data-density="comfortable"] {
  --s-3: 16px;
  --s-4: 20px;
  --s-5: 28px;
  --s-6: 40px;
}
[data-density="comfortable"] .btn {
  padding: 12px 22px;
}
[data-density="comfortable"] .input {
  padding: 12px 14px;
  font-size: 15px;
}
[data-density="comfortable"] .topbar {
  height: 76px;
}
[data-density="comfortable"] .dt-row {
  padding: 16px 18px;
}
.dt {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
}
.dt-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
}
.dt-toolbar .ts-search {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 5px 10px;
  color: var(--ink-500);
  font-size: 12.5px;
  flex: 1;
  max-width: 260px;
}
.dt-toolbar .ts-search input {
  border: 0;
  outline: none;
  background: none;
  font: inherit;
  color: var(--ink-900);
  flex: 1;
}
.dt-toolbar .ts-actions {
  display: flex;
  gap: 6px;
  margin-left: auto;
}
.dt-head, .dt-row {
  display: grid;
  grid-template-columns: 28px 56px 1.6fr 1fr 1fr 1fr auto;
  gap: 14px;
  padding: 10px 14px;
  align-items: center;
  font-size: 13px;
}
.dt-head {
  background: var(--ink-50);
  border-bottom: 1px solid var(--border);
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.dt-head .col {
  display: flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  user-select: none;
}
.dt-head .col.sorted {
  color: var(--ink-900);
}
.dt-row {
  border-top: 1px solid var(--ink-100);
}
.dt-row:hover {
  background: var(--ink-50);
}
.dt-row.selected {
  background: var(--ink-100);
}
.dt-row .check {
  width: 16px;
  height: 16px;
  border: 1px solid var(--border-strong);
  border-radius: 3px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface);
}
.dt-row.selected .check {
  background: var(--ink-900);
  border-color: var(--ink-900);
  color: var(--ink-0);
}
.dt-row .id {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.dt-row .name {
  color: var(--ink-900);
  font-weight: 500;
  min-width: 0;
}
.dt-row .nm-sub {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
}
.dt-row .num {
  font-family: var(--fs-mono);
  font-variant-numeric: tabular-nums;
  color: var(--ink-700);
}
.dt-row .actions {
  display: flex;
  gap: 2px;
  justify-content: flex-end;
  opacity: 0;
}
.dt-row:hover .actions {
  opacity: 1;
}
.dt-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  background: var(--ink-50);
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.dt-foot .nav-x {
  display: inline-flex;
  gap: 4px;
}
.dt-foot .nav-x button {
  background: none;
  border: 1px solid var(--border);
  border-radius: 4px;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-600);
  cursor: pointer;
}
.chart-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 22px 24px 18px;
}
.chart-card .h {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 18px;
}
.chart-card .h h5 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
}
.chart-card .h .meta {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
}
.chart-card .legend {
  display: flex;
  gap: 14px;
  margin-top: 10px;
  font-size: 12px;
  color: var(--ink-500);
}
.chart-card .legend .leg {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.chart-card .legend .leg .sw {
  width: 8px;
  height: 8px;
  border-radius: 2px;
}
.chart-card svg {
  width: 100%;
  display: block;
}
.chart-card .ax {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
}
.bars-v {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 4px;
  align-items: flex-end;
  height: 160px;
  border-bottom: 1px solid var(--ink-200);
  padding-bottom: 2px;
}
.bars-v .b {
  background: var(--ink-900);
  border-radius: 2px 2px 0 0;
  min-height: 4px;
  position: relative;
}
.bars-v .b.brand {
  background: var(--brand);
}
.bars-v .b.muted {
  background: var(--ink-300);
}
.donut {
  position: relative;
  width: 160px;
  height: 160px;
  background: conic-gradient(var(--ink-900) 0 38%, var(--ink-700) 38% 62%, var(--brand) 62% 84%, var(--ink-300) 84% 100%);
  border-radius: 50%;
}
.donut::after {
  content: "";
  position: absolute;
  inset: 20px;
  background: var(--surface);
  border-radius: 50%;
}
.donut .center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.donut .center .v {
  font-size: 24px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.025em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.donut .center .l {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-top: 4px;
}
.dp {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-2);
  padding: 16px 18px;
  width: 280px;
}
.dp-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.dp-head .label {
  font-size: 13px;
  font-weight: 500;
}
.dp-nav-btn {
  width: 26px;
  height: 26px;
  border: 0;
  background: none;
  border-radius: 4px;
  cursor: pointer;
  color: var(--ink-500);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.dp-nav-btn:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.dp-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  margin-bottom: 12px;
}
.dp-dow {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  text-align: center;
  padding: 4px 0;
  letter-spacing: 0.04em;
}
.dp-day {
  aspect-ratio: 1;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--ink-700);
  cursor: pointer;
  background: none;
  border: 0;
  font-family: inherit;
  font-variant-numeric: tabular-nums;
}
.dp-day:hover {
  background: var(--ink-100);
}
.dp-day.muted {
  color: var(--ink-300);
}
.dp-day.today {
  box-shadow: inset 0 0 0 1px var(--ink-300);
}
.dp-day.selected {
  background: var(--ink-900);
  color: var(--ink-0);
  font-weight: 500;
}
.dp-day.in-range {
  background: var(--ink-100);
  border-radius: 0;
}
.dp-day.range-start {
  background: var(--ink-900);
  color: var(--ink-0);
  border-radius: 6px 0 0 6px;
}
.dp-day.range-end {
  background: var(--ink-900);
  color: var(--ink-0);
  border-radius: 0 6px 6px 0;
}
.dp-foot {
  display: flex;
  justify-content: space-between;
  padding-top: 10px;
  border-top: 1px solid var(--ink-100);
  font-size: 12px;
  color: var(--ink-500);
}
.dp-foot .v {
  font-family: var(--fs-mono);
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.dp-dual {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-2);
  padding: 16px;
  width: 580px;
}
.dp-dual .dp {
  border: 0;
  box-shadow: none;
  padding: 0;
  width: auto;
}
.tp {
  display: inline-flex;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 4px;
}
.tp .col {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.tp .col button {
  background: none;
  border: 0;
  width: 24px;
  height: 14px;
  color: var(--ink-400);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.tp .col .v {
  font-family: var(--fs-mono);
  font-size: 14px;
  color: var(--ink-900);
  padding: 4px 8px;
  font-variant-numeric: tabular-nums;
  min-width: 32px;
  text-align: center;
}
.tp .sep {
  color: var(--ink-400);
  font-family: var(--fs-mono);
  font-size: 14px;
  padding: 0 2px;
}
.form-layout {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.form-section {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 32px;
  padding: 24px 28px;
}
.form-section + .form-section {
  border-top: 1px solid var(--ink-100);
}
.form-section .lh h4 {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.form-section .lh p {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.55;
}
.form-section .rh {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}
.form-savebar {
  position: sticky;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--ink-900);
  color: var(--ink-0);
  border-radius: var(--r-md);
  padding: 10px 16px;
  margin-top: 16px;
  box-shadow: var(--shadow-2);
  font-size: 13px;
}
.form-savebar .dirty {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink-300);
}
.form-savebar .dirty .pip {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--warn);
  box-shadow: 0 0 0 3px rgba(220,160,60,0.18);
}
.form-savebar .actions {
  display: flex;
  gap: 8px;
}
.wizard {
  display: flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
}
.wizard .step {
  flex: 1;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  position: relative;
}
.wizard .step .pin {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--ink-100);
  color: var(--ink-500);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 11px;
  font-weight: 500;
  flex-shrink: 0;
}
.wizard .step.done .pin {
  background: var(--ink-900);
  color: var(--ink-0);
}
.wizard .step.active .pin {
  background: var(--success);
  color: var(--ink-0);
  box-shadow: 0 0 0 4px var(--success-soft);
}
.wizard .step .nm {
  color: var(--ink-500);
  font-weight: 500;
}
.wizard .step.active .nm {
  color: var(--ink-900);
}
.wizard .step.done .nm {
  color: var(--ink-700);
}
.wizard .step + .step {
  border-left: 1px solid var(--ink-100);
}
.facets {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
  width: 240px;
}
.facet-group {
  padding: 14px 18px;
}
.facet-group + .facet-group {
  border-top: 1px solid var(--ink-100);
}
.facet-group h6 {
  margin: 0 0 10px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.facet-group h6 .clear {
  font-size: 11px;
  color: var(--ink-400);
  background: none;
  border: 0;
  cursor: pointer;
  letter-spacing: 0;
  text-transform: none;
  font-family: var(--fs-sans);
}
.facet-row {
  display: grid;
  grid-template-columns: 14px 1fr auto;
  gap: 8px;
  padding: 4px 0;
  font-size: 12.5px;
  align-items: center;
  cursor: pointer;
}
.facet-row .check {
  width: 14px;
  height: 14px;
  border: 1px solid var(--border-strong);
  border-radius: 3px;
  background: var(--surface);
}
.facet-row.on .check {
  background: var(--ink-900);
  border-color: var(--ink-900);
}
.facet-row .lbl {
  color: var(--ink-700);
}
.facet-row.on .lbl {
  color: var(--ink-900);
  font-weight: 500;
}
.facet-row .n {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.fb {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 14px 16px;
}
.fb-row {
  display: grid;
  grid-template-columns: 32px 130px 110px 1fr 30px;
  gap: 8px;
  align-items: center;
  margin-bottom: 8px;
}
.fb-row .conj {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
  text-align: center;
  background: var(--ink-100);
  padding: 4px 0;
  border-radius: 4px;
  font-weight: 500;
}
.fb-row .field-pick, .fb-row .op-pick {
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 6px 10px;
  border-radius: var(--r-sm);
  font-size: 12.5px;
  color: var(--ink-700);
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.fb-row .val {
  border: 1px solid var(--border);
  background: var(--surface);
  padding: 6px 10px;
  border-radius: var(--r-sm);
  font-size: 12.5px;
  color: var(--ink-900);
  outline: none;
  font-family: inherit;
}
.fb-row .x-btn {
  width: 24px;
  height: 24px;
  background: none;
  border: 0;
  color: var(--ink-400);
  border-radius: 4px;
  cursor: pointer;
}
.fb-add {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  background: none;
  border: 1px dashed var(--border-strong);
  padding: 6px 12px;
  border-radius: var(--r-sm);
  cursor: pointer;
  margin-top: 4px;
}
.notif-center {
  width: 380px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-3);
  overflow: hidden;
}
.notif-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
}
.notif-head h5 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
}
.notif-head .clear-all {
  font-family: inherit;
  font-size: 11px;
  color: var(--ink-500);
  background: none;
  border: 0;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
}
.notif-group .label {
  padding: 8px 18px 4px;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-400);
}
.notif-row {
  display: grid;
  grid-template-columns: 26px 1fr auto;
  gap: 12px;
  padding: 10px 18px;
  align-items: start;
}
.notif-row + .notif-row {
  border-top: 1px solid var(--ink-100);
}
.notif-row.unread {
  background: oklch(98% 0.02 80);
}
.notif-row .av {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--ink-100);
  color: var(--ink-700);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  flex-shrink: 0;
}
.notif-row .body {
  font-size: 13px;
  color: var(--ink-700);
  line-height: 1.45;
}
.notif-row .body strong {
  color: var(--ink-900);
  font-weight: 500;
}
.notif-row .body .sub {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  margin-top: 3px;
  letter-spacing: 0.04em;
}
.notif-row .time {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.split {
  display: grid;
  grid-template-columns: 320px 1fr;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
  min-height: 480px;
}
.split-master {
  border-right: 1px solid var(--border);
  background: var(--ink-50);
}
.split-master-head {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--surface);
}
.split-master-head h5 {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
}
.split-master-head .n {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
}
.split-item {
  padding: 12px 16px;
  border-bottom: 1px solid var(--ink-100);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.split-item:hover {
  background: var(--ink-100);
}
.split-item.active {
  background: var(--surface);
  border-left: 2px solid var(--ink-900);
  padding-left: 14px;
}
.split-item .ti {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
}
.split-item .sub {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.split-detail {
  padding: 24px 28px;
  min-width: 0;
}
.file-list {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.file-row {
  display: grid;
  grid-template-columns: 36px 1fr 100px 80px;
  gap: 14px;
  align-items: center;
  padding: 12px 16px;
}
.file-row + .file-row {
  border-top: 1px solid var(--ink-100);
}
.file-icon {
  width: 36px;
  height: 36px;
  border-radius: 4px;
  background: var(--ink-100);
  color: var(--ink-700);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.05em;
}
.file-row .info .nm {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
}
.file-row .info .meta {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  margin-top: 2px;
  display: flex;
  gap: 8px;
}
.file-row .progress {
  height: 4px;
  background: var(--ink-100);
  border-radius: 2px;
  overflow: hidden;
}
.file-row .progress .fill {
  height: 100%;
  background: var(--ink-900);
  border-radius: 2px;
}
.file-row .progress .fill.done {
  background: var(--success);
}
.file-row .state {
  text-align: right;
}
.settings {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 32px;
}
.settings-nav .group {
  margin-bottom: 18px;
}
.settings-nav .group h6 {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-400);
  margin: 0 12px 6px;
}
.settings-nav .item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  font-size: 13px;
  color: var(--ink-600);
  cursor: pointer;
  border-radius: 4px;
}
.settings-nav .item.active {
  background: var(--ink-100);
  color: var(--ink-900);
  font-weight: 500;
}
.settings-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  padding: 18px 0;
  border-bottom: 1px solid var(--ink-100);
  align-items: center;
}
.settings-row .info h5 {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.settings-row .info p {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.5;
}
.settings-danger {
  margin-top: 32px;
  padding: 22px 24px;
  border: 1px solid oklch(86% 0.06 30);
  border-radius: var(--r-md);
  background: oklch(98% 0.02 30);
}
.settings-danger h5 {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--danger);
}
.settings-danger p {
  margin: 0 0 14px;
  font-size: 13px;
  color: var(--ink-700);
  line-height: 1.55;
}
.err-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 56px 32px;
  text-align: center;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
}
.err-code {
  font-family: var(--fs-mono);
  font-size: 56px;
  color: var(--ink-200);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.err-state h3 {
  margin: 0;
  font-size: 22px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.018em;
}
.err-state p {
  margin: 0;
  font-size: 14px;
  color: var(--ink-500);
  max-width: 44ch;
  line-height: 1.55;
}
.err-state .actions {
  display: flex;
  gap: 10px;
  margin-top: 8px;
}
.onboard {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
}
.onboard-head {
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--border);
  background: var(--ink-50);
}
.onboard-head h5 {
  margin: 0;
  font-size: 15px;
  font-weight: 500;
}
.onboard-head .pct {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
}
.onboard-head .pct strong {
  color: var(--ink-900);
}
.onboard-progress {
  height: 3px;
  background: var(--ink-100);
}
.onboard-progress .fill {
  height: 100%;
  background: var(--ink-900);
}
.onboard-step {
  display: grid;
  grid-template-columns: 24px 1fr auto;
  gap: 14px;
  padding: 14px 22px;
  align-items: center;
  cursor: pointer;
}
.onboard-step + .onboard-step {
  border-top: 1px solid var(--ink-100);
}
.onboard-step .check {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1.5px solid var(--ink-300);
  background: var(--surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.onboard-step.done .check {
  background: var(--success);
  border-color: var(--success);
  color: var(--ink-0);
}
.onboard-step.done .nm {
  color: var(--ink-400);
  text-decoration: line-through;
}
.onboard-step .nm {
  font-size: 13.5px;
  color: var(--ink-900);
}
.onboard-step .sub {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  margin-top: 2px;
  letter-spacing: 0.04em;
}
.onboard-step .time {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
}
.tagmgr {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.tagmgr-row {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  gap: 14px;
  align-items: center;
  padding: 10px 16px;
}
.tagmgr-row + .tagmgr-row {
  border-top: 1px solid var(--ink-100);
}
.tagmgr-row .sw {
  width: 14px;
  height: 14px;
  border-radius: 3px;
  border: 1px solid rgba(0,0,0,0.1);
}
.tagmgr-row .nm {
  font-size: 13px;
  color: var(--ink-900);
  font-weight: 500;
}
.tagmgr-row .nm .desc {
  font-size: 11.5px;
  color: var(--ink-500);
  font-weight: 400;
  margin-top: 2px;
}
.tagmgr-row .ct {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
}
.tagmgr-row .actions {
  display: flex;
  gap: 2px;
}
.ai-stream {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 18px 22px;
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 14px;
  align-items: start;
}
.ai-stream .av {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: var(--ink-900);
  color: var(--ink-0);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 11px;
  font-weight: 600;
}
.ai-stream .meta {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.ai-stream .meta .live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--success);
}
.ai-stream .meta .live::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 3px var(--success-soft);
  animation: ai-blink 1.2s ease-in-out infinite;
}
@keyframes ai-blink {
  50% {
    opacity: 0.4;
  }
}
.ai-stream p {
  margin: 0;
  font-size: 14.5px;
  color: var(--ink-700);
  line-height: 1.6;
}
.ai-stream p::after {
  content: "▎";
  color: var(--ink-900);
  margin-left: 2px;
  animation: ai-cursor 0.8s steps(2) infinite;
}
@keyframes ai-cursor {
  50% {
    opacity: 0;
  }
}
.ai-sources {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 12px 0;
}
.ai-source {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  padding: 4px 10px 4px 6px;
  font-size: 11.5px;
  color: var(--ink-700);
  font-family: var(--fs-mono);
  cursor: pointer;
}
.ai-source .n {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--ink-900);
  color: var(--ink-0);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 600;
}
.ai-source .host {
  color: var(--ink-500);
}
.ai-compare {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.ai-compare .col {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.ai-compare .col.win {
  border-color: var(--ink-900);
}
.ai-compare .col .h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--ink-100);
}
.ai-compare .col .h .model {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-700);
  letter-spacing: 0.04em;
  font-weight: 500;
}
.ai-compare .col .h .pick {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-400);
  padding: 2px 7px;
  border-radius: 4px;
  background: var(--ink-50);
}
.ai-compare .col.win .h .pick {
  background: var(--ink-900);
  color: var(--ink-0);
}
.ai-compare .col p {
  margin: 0;
  font-size: 13px;
  color: var(--ink-600);
  line-height: 1.55;
}
.ai-compare .col .stats {
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px dashed var(--ink-100);
  display: flex;
  justify-content: space-between;
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
}
.prompt-editor {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.prompt-editor .role-bar {
  display: flex;
  border-bottom: 1px solid var(--border);
}
.prompt-editor .role {
  padding: 8px 14px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
  cursor: pointer;
  border-right: 1px solid var(--ink-100);
}
.prompt-editor .role.active {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.prompt-editor .editor-area {
  padding: 16px 18px;
  font-family: var(--fs-mono);
  font-size: 13px;
  color: var(--ink-900);
  line-height: 1.55;
  min-height: 120px;
}
.prompt-editor .var-chip {
  display: inline-block;
  background: oklch(95% 0.07 80);
  color: oklch(40% 0.13 70);
  padding: 1px 6px;
  border-radius: 3px;
  font-family: var(--fs-mono);
  font-size: 12px;
}
.prompt-editor .slash {
  display: inline-block;
  background: var(--ink-900);
  color: var(--ink-0);
  padding: 0 4px;
  border-radius: 3px;
  font-family: var(--fs-mono);
  font-size: 12px;
}
.prompt-editor .footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  border-top: 1px solid var(--border);
  background: var(--ink-50);
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.06em;
}
.prompt-editor .footer .tokens strong {
  color: var(--ink-900);
  font-weight: 500;
}
.ai-conf {
  display: grid;
  grid-template-columns: 110px 1fr 80px;
  gap: 16px;
  align-items: center;
  padding: 12px 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.ai-conf .lbl {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.ai-conf .track {
  height: 6px;
  background: var(--ink-100);
  border-radius: 3px;
  position: relative;
  overflow: hidden;
}
.ai-conf .track .fill {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  background: linear-gradient(to right, var(--danger) 0%, var(--warn) 50%, var(--success) 100%);
  border-radius: 3px;
}
.ai-conf .v {
  font-family: var(--fs-mono);
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.lr {
  max-width: 740px;
  margin: 0 auto;
  font-family: var(--fs-sans);
  color: var(--ink-700);
  font-size: 16px;
  line-height: 1.65;
}
.lr-narrow {
  max-width: 640px;
}
.lr p {
  margin: 0 0 18px;
}
.lr p:last-child {
  margin-bottom: 0;
}
.lr-header {
  border-bottom: 1px solid var(--border);
  padding-bottom: 28px;
  margin-bottom: 32px;
}
.lr-eyebrow {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.lr-eyebrow .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ink-300);
}
.lr-header h1 {
  font-size: 44px;
  line-height: 1.04;
  letter-spacing: -0.03em;
  font-weight: 500;
  margin: 0 0 12px;
  color: var(--ink-900);
  max-width: 22ch;
}
.lr-header .lede {
  font-size: 18px;
  color: var(--ink-500);
  max-width: 56ch;
  line-height: 1.55;
  margin: 0;
}
.lr-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 22px;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.lr-meta .meta-pip {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--ink-300);
}
.lr-meta strong {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-authors {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 0;
  border-top: 1px solid var(--ink-100);
  border-bottom: 1px solid var(--ink-100);
  margin: 16px 0 32px;
}
.lr-authors .avatars {
  display: inline-flex;
}
.lr-authors .meta {
  font-size: 13px;
  color: var(--ink-700);
}
.lr-authors .meta .role {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
  display: block;
  margin-top: 2px;
}
.lr-tldr {
  border: 1px solid var(--ink-300);
  border-radius: var(--r-md);
  padding: 22px 26px;
  background: var(--ink-50);
  margin: 28px 0;
}
.lr-tldr .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-700);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.lr-tldr .head::before {
  content: "TL;DR";
  background: var(--ink-900);
  color: var(--ink-0);
  padding: 3px 7px;
  border-radius: 4px;
  font-weight: 500;
  letter-spacing: 0.06em;
}
.lr-tldr ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.lr-tldr li {
  font-size: 14.5px;
  color: var(--ink-700);
  line-height: 1.55;
  padding-left: 22px;
  position: relative;
}
.lr-tldr li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 2px;
  background: var(--ink-900);
}
.lr-tldr strong {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-exec {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 36px;
  padding: 26px 0 28px;
  border-top: 2px solid var(--ink-900);
  border-bottom: 1px solid var(--border);
  margin: 24px 0;
}
.lr-exec .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.lr-exec h3 {
  margin: 0 0 12px;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -0.018em;
  color: var(--ink-900);
}
.lr-exec p {
  font-size: 15.5px;
  color: var(--ink-600);
  line-height: 1.6;
  margin: 0;
}
.lr-toc {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 20px 24px;
  margin: 28px 0;
}
.lr-toc .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
}
.lr-toc ol {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: toc;
}
.lr-toc li {
  counter-increment: toc;
  display: grid;
  grid-template-columns: 32px 1fr auto;
  gap: 14px;
  padding: 8px 0;
  font-size: 14px;
  color: var(--ink-700);
  align-items: baseline;
}
.lr-toc li + li {
  border-top: 1px dashed var(--ink-100);
}
.lr-toc li::before {
  content: counter(toc, decimal-leading-zero);
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.lr-toc li .pg {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.lr-toc li.deep {
  padding-left: 24px;
  color: var(--ink-500);
  font-size: 13px;
}
.lr-toc li.deep::before {
  content: "";
}
.lr-progress {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 12px 18px;
  background: var(--ink-50);
  border-radius: var(--r-pill);
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.lr-progress .track {
  height: 4px;
  background: var(--ink-200);
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}
.lr-progress .track .fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: var(--ink-900);
  border-radius: 2px;
}
.lr-progress .pct {
  font-variant-numeric: tabular-nums;
  color: var(--ink-900);
  font-weight: 500;
}
.lr-divider {
  margin: 56px 0 32px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: baseline;
  gap: 18px;
}
.lr-divider .num {
  font-family: var(--fs-mono);
  font-size: 56px;
  font-weight: 400;
  color: var(--ink-200);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.lr-divider h2 {
  margin: 0;
  font-size: 30px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.025em;
  line-height: 1.1;
}
.lr-divider h2 + .sub {
  font-size: 14px;
  color: var(--ink-500);
  margin-top: 6px;
}
.lr-divider .meta {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  white-space: nowrap;
}
.lr-chapter {
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  padding: 36px 36px 32px;
  margin: 36px 0;
  background: var(--surface);
  position: relative;
  overflow: hidden;
}
.lr-chapter .ch-num {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.lr-chapter .ch-num::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--ink-200);
}
.lr-chapter h2 {
  margin: 0;
  font-size: 36px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.025em;
  line-height: 1.08;
  max-width: 22ch;
}
.lr-chapter .ch-sub {
  margin-top: 14px;
  font-size: 15.5px;
  color: var(--ink-500);
  max-width: 56ch;
}
.lr-pullquote {
  margin: 36px 0;
  padding: 8px 0 8px 28px;
  border-left: 2px solid var(--ink-900);
  font-size: 24px;
  font-weight: 400;
  color: var(--ink-900);
  letter-spacing: -0.018em;
  line-height: 1.32;
  max-width: 32ch;
  font-style: normal;
}
.lr-pullquote .attr {
  display: block;
  margin-top: 14px;
  font-size: 12px;
  color: var(--ink-500);
  font-family: var(--fs-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 400;
}
.lr-quote {
  margin: 32px 0;
  padding: 22px 24px;
  background: var(--ink-50);
  border-radius: var(--r-md);
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 20px;
  align-items: start;
}
.lr-quote .av {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--ink-900);
  color: var(--ink-0);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
}
.lr-quote .text {
  font-size: 16px;
  color: var(--ink-700);
  line-height: 1.55;
  margin: 0;
}
.lr-quote .text::before {
  content: "\201C";
  margin-right: 2px;
  color: var(--ink-300);
}
.lr-quote .text::after {
  content: "\201D";
  color: var(--ink-300);
}
.lr-quote .attr {
  display: block;
  margin-top: 10px;
  font-size: 12.5px;
  color: var(--ink-500);
}
.lr-quote .attr strong {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-dialogue {
  margin: 32px 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.lr-bubble {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 14px;
  align-items: start;
}
.lr-bubble .av {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  background: var(--ink-100);
  color: var(--ink-700);
}
.lr-bubble.you .av {
  background: var(--ink-900);
  color: var(--ink-0);
}
.lr-bubble .body {
  font-size: 15px;
  color: var(--ink-700);
  line-height: 1.6;
}
.lr-bubble .body .who {
  display: block;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.lr-insight {
  margin: 32px 0;
  padding: 22px 26px 22px 22px;
  background: var(--ink-900);
  color: var(--ink-100);
  border-radius: var(--r-md);
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 18px;
  align-items: start;
}
.lr-insight .ico {
  color: oklch(78% 0.13 80);
  margin-top: 2px;
}
.lr-insight .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: oklch(78% 0.13 80);
  margin-bottom: 8px;
}
.lr-insight .text {
  margin: 0;
  font-size: 16.5px;
  color: var(--ink-0);
  line-height: 1.5;
}
.lr-aside {
  margin: 28px 0;
  padding: 16px 20px;
  border-left: 3px solid var(--ink-200);
  background: var(--ink-50);
  font-size: 14px;
  color: var(--ink-600);
  line-height: 1.6;
  border-radius: 0 4px 4px 0;
}
.lr-aside .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 4px;
}
.lr-why {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 22px;
  margin: 28px 0;
  background: var(--surface);
}
.lr-why .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 10px;
}
.lr-why h4 {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-why p {
  font-size: 14px;
  color: var(--ink-600);
  line-height: 1.55;
  margin: 0;
}
.lr-def {
  border-bottom: 1px dotted var(--ink-400);
  cursor: help;
  background: var(--ink-50);
  padding: 1px 4px;
  border-radius: 2px;
  color: var(--ink-900);
}
.lr-glossary {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 18px 22px;
  margin: 28px 0;
}
.lr-glossary .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 14px;
}
.lr-glossary dl {
  margin: 0;
  padding: 0;
}
.lr-glossary dt {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink-900);
  margin-bottom: 3px;
}
.lr-glossary dd {
  margin: 0 0 14px;
  font-size: 13px;
  color: var(--ink-500);
  line-height: 1.55;
  padding-left: 14px;
  border-left: 2px solid var(--ink-100);
}
.lr-glossary dd:last-child {
  margin-bottom: 0;
}
.lr-bullets {
  list-style: none;
  margin: 18px 0 22px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.lr-bullets li {
  position: relative;
  padding-left: 22px;
  font-size: 15.5px;
  color: var(--ink-700);
  line-height: 1.55;
}
.lr-bullets li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 11px;
  width: 6px;
  height: 6px;
  background: var(--ink-900);
  border-radius: 50%;
}
.lr-numbered {
  margin: 22px 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
  counter-reset: lrnum;
}
.lr-numbered .row {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 18px;
  align-items: baseline;
  counter-increment: lrnum;
}
.lr-numbered .row::before {
  content: counter(lrnum, decimal-leading-zero);
  font-family: var(--fs-mono);
  font-size: 28px;
  font-weight: 400;
  color: var(--ink-300);
  letter-spacing: -0.02em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.lr-numbered .row h4 {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-numbered .row p {
  margin: 0;
  font-size: 14.5px;
  color: var(--ink-600);
  line-height: 1.55;
}
.lr-checklist {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 28px 0;
}
.lr-checklist .col {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 20px;
}
.lr-checklist .col h5 {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--fs-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.lr-checklist .col h5 .pip {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ink-300);
}
.lr-checklist .col.do h5 {
  color: var(--success);
}
.lr-checklist .col.do h5 .pip {
  background: var(--success);
}
.lr-checklist .col.dont h5 {
  color: var(--danger);
}
.lr-checklist .col.dont h5 .pip {
  background: var(--danger);
}
.lr-checklist ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.lr-checklist li {
  font-size: 13.5px;
  color: var(--ink-700);
  line-height: 1.5;
  padding-left: 22px;
  position: relative;
}
.lr-checklist .col.do li::before {
  content: "✓";
  position: absolute;
  left: 4px;
  top: 0;
  color: var(--success);
  font-weight: 600;
}
.lr-checklist .col.dont li::before {
  content: "—";
  position: absolute;
  left: 4px;
  top: 0;
  color: var(--danger);
  font-weight: 600;
}
.lr-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 28px 0;
}
.lr-compare .col {
  padding: 22px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.lr-compare .col.featured {
  background: var(--ink-50);
  border-color: var(--ink-300);
}
.lr-compare h5 {
  margin: 0 0 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
  display: flex;
  align-items: center;
  gap: 8px;
}
.lr-compare h5 .badge {
  font-family: var(--fs-mono);
  font-size: 9px;
  background: var(--ink-900);
  color: var(--ink-0);
  padding: 2px 6px;
  border-radius: 4px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.lr-compare p {
  margin: 0 0 8px;
  font-size: 14px;
  color: var(--ink-600);
  line-height: 1.55;
}
.lr-compare .kv {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  padding: 6px 0;
  font-size: 13px;
  align-items: baseline;
}
.lr-compare .kv + .kv {
  border-top: 1px dashed var(--ink-100);
}
.lr-compare .kv .k {
  color: var(--ink-500);
}
.lr-compare .kv .v {
  font-family: var(--fs-mono);
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.lr-stat {
  margin: 36px 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  padding: 28px 0;
  border-top: 1px solid var(--ink-100);
  border-bottom: 1px solid var(--ink-100);
}
.lr-stat .num {
  font-size: 88px;
  line-height: 0.95;
  letter-spacing: -0.04em;
  font-weight: 500;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.lr-stat .num .u {
  font-size: 22px;
  color: var(--ink-400);
  font-weight: 400;
  letter-spacing: -0.01em;
  margin-left: 8px;
}
.lr-stat .caption {
  font-size: 14px;
  color: var(--ink-500);
  max-width: 36ch;
  line-height: 1.5;
}
.lr-stat .caption .src {
  display: block;
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  letter-spacing: 0.06em;
  margin-top: 8px;
}
.lr-ministats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin: 28px 0;
  border-top: 1px solid var(--ink-100);
  border-bottom: 1px solid var(--ink-100);
}
.lr-ministats .ms {
  padding: 18px 22px;
  border-right: 1px solid var(--ink-100);
}
.lr-ministats .ms:last-child {
  border-right: 0;
}
.lr-ministats .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-400);
  margin-bottom: 8px;
}
.lr-ministats .v {
  font-size: 28px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.028em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  margin-bottom: 4px;
}
.lr-ministats .sub {
  font-size: 12px;
  color: var(--ink-500);
}
.lr-trend {
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 24px;
  align-items: center;
  padding: 20px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  margin: 28px 0;
}
.lr-trend .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 6px;
}
.lr-trend .text {
  font-size: 15px;
  color: var(--ink-700);
  margin: 0;
  line-height: 1.5;
}
.lr-trend .right {
  text-align: right;
}
.lr-trend .v {
  font-size: 32px;
  font-weight: 500;
  letter-spacing: -0.025em;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  line-height: 1;
  margin-bottom: 8px;
}
.lr-trend .v.up {
  color: var(--success);
}
.lr-trend .v.dn {
  color: var(--danger);
}
.lr-trend .spk {
  display: block;
  width: 100%;
  height: 18px;
  color: var(--ink-900);
}
.lr-table {
  width: 100%;
  border-collapse: collapse;
  margin: 28px 0;
  font-size: 14px;
}
.lr-table th, .lr-table td {
  padding: 12px 16px;
  text-align: left;
  border-bottom: 1px solid var(--ink-100);
  vertical-align: top;
}
.lr-table th {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  font-weight: 500;
  color: var(--ink-500);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--ink-300);
  background: var(--ink-50);
}
.lr-table td:first-child {
  font-weight: 500;
  color: var(--ink-900);
}
.lr-table td.num {
  font-family: var(--fs-mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
  color: var(--ink-900);
}
.lr-table td .pip {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ink-300);
  vertical-align: middle;
  margin-right: 6px;
}
.lr-table td .pip.up {
  background: var(--success);
}
.lr-table td .pip.dn {
  background: var(--danger);
}
.lr-table tr.highlight td {
  background: var(--ink-50);
}
.lr-spec {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.lr-spec .row {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 24px;
  padding: 12px 22px;
  font-size: 14px;
}
.lr-spec .row + .row {
  border-top: 1px solid var(--ink-100);
}
.lr-spec .k {
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
  align-self: center;
}
.lr-spec .v {
  color: var(--ink-900);
  line-height: 1.55;
}
.lr-spec .v .mono {
  font-family: var(--fs-mono);
  font-size: 12.5px;
  color: var(--ink-700);
}
.lr-matrix {
  display: grid;
  grid-template-columns: 160px repeat(3, 1fr);
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
  margin: 28px 0;
}
.lr-matrix > div {
  background: var(--surface);
  padding: 14px 16px;
  font-size: 13px;
  color: var(--ink-700);
}
.lr-matrix .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-500);
  background: var(--ink-50);
}
.lr-matrix .rowlabel {
  font-weight: 500;
  color: var(--ink-900);
  background: var(--ink-50);
}
.lr-matrix .cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.lr-matrix .cell .v {
  font-weight: 500;
  color: var(--ink-900);
}
.lr-matrix .cell.win {
  background: var(--success-soft);
}
.lr-matrix .cell.lose {
  background: oklch(96% 0.04 30);
  color: var(--ink-500);
}
.lr-findings {
  margin: 28px 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  counter-reset: find;
}
.lr-findings .find {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px 24px;
  background: var(--surface);
  display: grid;
  grid-template-columns: 56px 1fr auto;
  gap: 20px;
  align-items: start;
  counter-increment: find;
}
.lr-findings .find::before {
  content: counter(find, decimal-leading-zero);
  font-family: var(--fs-mono);
  font-size: 36px;
  font-weight: 400;
  color: var(--ink-200);
  line-height: 1;
  letter-spacing: -0.02em;
}
.lr-findings .find h4 {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-findings .find p {
  margin: 0;
  font-size: 14px;
  color: var(--ink-600);
  line-height: 1.55;
}
.lr-findings .find .tag {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  align-self: start;
  border: 1px solid var(--border);
  padding: 3px 7px;
  border-radius: 4px;
  white-space: nowrap;
}
.lr-sources {
  margin: 28px 0;
  border-top: 1px solid var(--ink-200);
  padding-top: 18px;
}
.lr-sources .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 12px;
}
.lr-sources ol {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: src;
}
.lr-sources li {
  counter-increment: src;
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 14px;
  padding: 8px 0;
  font-size: 13px;
  color: var(--ink-700);
  border-bottom: 1px dashed var(--ink-100);
  align-items: baseline;
}
.lr-sources li::before {
  content: "[" counter(src) "]";
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.lr-sources li .meta {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.lr-sources li strong {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-sources li em {
  color: var(--ink-500);
  font-style: normal;
}
.lr-steps {
  margin: 32px 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
}
.lr-step {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 20px;
  padding: 0 0 26px;
  position: relative;
}
.lr-step:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 22px;
  bottom: 0;
  width: 1px;
  background: var(--ink-200);
}
.lr-step .pin {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--surface);
  border: 1.5px solid var(--ink-300);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 10.5px;
  font-weight: 500;
  color: var(--ink-700);
  font-variant-numeric: tabular-nums;
  margin-left: 0;
}
.lr-step.done .pin {
  background: var(--ink-900);
  border-color: var(--ink-900);
  color: var(--ink-0);
}
.lr-step.active .pin {
  background: var(--success);
  border-color: var(--success);
  color: var(--ink-0);
  box-shadow: 0 0 0 4px var(--success-soft);
}
.lr-step h4 {
  margin: 0 0 6px;
  font-size: 15.5px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-step p {
  margin: 0;
  font-size: 14px;
  color: var(--ink-600);
  line-height: 1.55;
}
.lr-flow {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin: 32px 0;
}
.lr-flow .stage {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 16px 18px;
  background: var(--surface);
  position: relative;
}
.lr-flow .stage::after {
  content: "→";
  position: absolute;
  right: -12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ink-300);
  z-index: 1;
  background: var(--bg);
  padding: 2px;
  font-family: var(--fs-mono);
  font-size: 14px;
}
.lr-flow .stage:last-child::after {
  display: none;
}
.lr-flow .num {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.1em;
  margin-bottom: 6px;
}
.lr-flow h5 {
  margin: 0 0 6px;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-flow p {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.5;
}
.lr-framework {
  margin: 32px 0;
  display: grid;
  grid-template-columns: 60px 1fr 1fr;
  grid-template-rows: 60px 1fr 1fr;
  gap: 6px;
  aspect-ratio: 1.4 / 1;
}
.lr-framework .ax {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-500);
  display: flex;
  align-items: center;
  justify-content: center;
}
.lr-framework .ax.y {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}
.lr-framework .quad {
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 14px 16px;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.lr-framework .quad h5 {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-framework .quad p {
  margin: 0;
  font-size: 12px;
  color: var(--ink-500);
  line-height: 1.5;
}
.lr-framework .quad .tag {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-400);
  margin-top: 8px;
}
.lr-framework .quad.featured {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.lr-framework .quad.featured h5 {
  color: var(--ink-0);
}
.lr-framework .quad.featured p {
  color: var(--ink-300);
}
.lr-framework .quad.featured .tag {
  color: var(--ink-400);
}
.lr-tree {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px 22px;
  background: var(--surface);
  font-family: var(--fs-mono);
  font-size: 13px;
  color: var(--ink-700);
  line-height: 1.7;
}
.lr-tree .node {
  padding-left: 0;
}
.lr-tree .node-q {
  font-weight: 500;
  color: var(--ink-900);
  font-family: var(--fs-sans);
  margin-bottom: 10px;
  font-size: 14px;
}
.lr-tree .branch {
  display: flex;
  align-items: baseline;
  gap: 8px;
  padding: 4px 0;
}
.lr-tree .branch .arr {
  color: var(--ink-300);
  font-family: var(--fs-mono);
}
.lr-tree .branch.deep {
  padding-left: 24px;
  color: var(--ink-500);
}
.lr-tree .branch.deep.deeper {
  padding-left: 48px;
}
.lr-tree .res {
  color: var(--ink-900);
  font-family: var(--fs-sans);
  font-weight: 500;
}
.lr-codeblock {
  margin: 28px 0;
  background: var(--ink-900);
  color: var(--ink-100);
  border-radius: var(--r-md);
  overflow: hidden;
  font-family: var(--fs-mono);
  font-size: 13px;
  line-height: 1.6;
}
.lr-codeblock .lr-code-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 14px;
  background: var(--ink-700);
  color: var(--ink-300);
  font-size: 11px;
  letter-spacing: 0.04em;
}
.lr-codeblock pre {
  margin: 0;
  padding: 14px 18px;
  overflow-x: auto;
}
.lr-formula {
  margin: 32px 0;
  padding: 28px 32px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 24px;
}
.lr-formula .eq {
  font-family: 'JetBrains Mono', serif;
  font-size: 22px;
  letter-spacing: -0.01em;
  color: var(--ink-900);
  text-align: center;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
}
.lr-formula .eq em {
  color: var(--ink-400);
  font-style: italic;
}
.lr-formula .eq .op {
  color: var(--ink-500);
  margin: 0 6px;
}
.lr-formula .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.lr-term {
  margin: 28px 0;
  background: var(--ink-900);
  color: var(--ink-100);
  border-radius: var(--r-md);
  padding: 16px 18px;
  font-family: var(--fs-mono);
  font-size: 12.5px;
  line-height: 1.55;
}
.lr-term .prompt::before {
  content: "$ ";
  color: oklch(78% 0.13 150);
  margin-right: 4px;
}
.lr-term .out {
  color: var(--ink-300);
  padding-left: 14px;
}
.lr-term .ok {
  color: oklch(78% 0.13 150);
}
.lr-term .warn {
  color: oklch(80% 0.13 80);
}
.lr-term .err {
  color: oklch(80% 0.15 30);
}
.lr-figure {
  margin: 32px 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lr-figure .frame {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--surface-sunken);
  position: relative;
  aspect-ratio: 16/9;
}
.lr-figure .frame .geo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.lr-figure figcaption {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: baseline;
  font-size: 13px;
  color: var(--ink-500);
  line-height: 1.5;
}
.lr-figure .figno {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.lr-figure figcaption .source {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  display: block;
  margin-top: 4px;
}
.lr-gallery {
  margin: 32px 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.lr-gallery .tile {
  aspect-ratio: 1;
  background: var(--surface-sunken);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  position: relative;
  overflow: hidden;
}
.lr-gallery .tile .geo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.lr-gallery .tile .label {
  position: absolute;
  bottom: 8px;
  left: 10px;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  letter-spacing: 0.06em;
  color: var(--ink-500);
  text-transform: uppercase;
}
.lr-annotated {
  margin: 32px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 22px;
  background: var(--surface);
}
.lr-annotated .stage {
  position: relative;
  background: var(--surface-sunken);
  border-radius: var(--r-sm);
  aspect-ratio: 16/8;
  margin-bottom: 18px;
  overflow: hidden;
}
.lr-annotated .stage svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.lr-annotated .pin {
  position: absolute;
  width: 22px;
  height: 22px;
  background: var(--ink-900);
  color: var(--ink-0);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 10.5px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 0 0 3px var(--surface-sunken);
}
.lr-annotated .legend {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 28px;
  margin-top: 4px;
}
.lr-annotated .legend-row {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  align-items: baseline;
}
.lr-annotated .legend-row .pn {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1.5px solid var(--ink-900);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-900);
  background: var(--surface);
  font-variant-numeric: tabular-nums;
}
.lr-annotated .legend-row h6 {
  margin: 0;
  font-size: 13.5px;
  color: var(--ink-900);
  font-weight: 500;
}
.lr-annotated .legend-row p {
  margin: 4px 0 0;
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.5;
}
.lr-chart {
  margin: 32px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 22px 24px 18px;
}
.lr-chart .chart-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 18px;
}
.lr-chart h5 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-chart .legend-row {
  display: inline-flex;
  gap: 14px;
  font-size: 12px;
  color: var(--ink-500);
}
.lr-chart .legend-row .swatch {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  margin-right: 4px;
  vertical-align: middle;
}
.lr-chart .chart-stage {
  position: relative;
  height: 200px;
  background: linear-gradient(to top, var(--ink-50) 0 1px, transparent 1px) 0 0 / 100% 40px;
}
.lr-chart .chart-stage svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.lr-chart .chart-foot {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.lr-mark {
  background: oklch(96% 0.08 80);
  color: var(--ink-900);
  padding: 1px 4px;
  border-radius: 2px;
  font-weight: 500;
}
.lr-fnref {
  font-family: var(--fs-mono);
  font-size: 0.7em;
  color: var(--ink-500);
  vertical-align: super;
  padding: 0 2px;
  cursor: help;
}
.lr-footnotes {
  margin: 32px 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--ink-200);
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.55;
}
.lr-footnotes .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 10px;
}
.lr-footnotes ol {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: fn;
}
.lr-footnotes li {
  counter-increment: fn;
  padding: 5px 0;
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 10px;
  align-items: baseline;
}
.lr-footnotes li::before {
  content: counter(fn);
  font-family: var(--fs-mono);
  color: var(--ink-400);
  text-align: right;
}
.lr-takeaways {
  margin: 36px 0;
  padding: 28px 32px;
  background: var(--ink-900);
  color: var(--ink-100);
  border-radius: var(--r-md);
}
.lr-takeaways .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: oklch(78% 0.13 80);
  margin-bottom: 16px;
}
.lr-takeaways ol {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: tk;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.lr-takeaways li {
  counter-increment: tk;
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 14px;
  align-items: baseline;
  font-size: 15.5px;
  line-height: 1.5;
  color: var(--ink-0);
}
.lr-takeaways li::before {
  content: counter(tk, decimal-leading-zero);
  font-family: var(--fs-mono);
  font-size: 18px;
  font-weight: 400;
  color: oklch(78% 0.13 80);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.lr-actions {
  margin: 32px 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.lr-action {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 16px 22px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  font-size: 14px;
  color: var(--ink-700);
}
.lr-action:hover {
  border-color: var(--border-strong);
}
.lr-action .ico {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ink-100);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-700);
  flex-shrink: 0;
}
.lr-action h5 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-action .sub {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
  margin-top: 2px;
  display: block;
}
.lr-action .arr {
  color: var(--ink-400);
}
.lr-methodology {
  margin: 32px 0;
  border: 1px dashed var(--ink-300);
  border-radius: var(--r-md);
  padding: 20px 24px;
  background: var(--ink-50);
}
.lr-methodology .head {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 8px;
}
.lr-methodology h5 {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-methodology p {
  margin: 0 0 8px;
  font-size: 13px;
  color: var(--ink-600);
  line-height: 1.55;
}
.lr-methodology p:last-child {
  margin-bottom: 0;
}
.lr-methodology .params {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed var(--ink-200);
}
.lr-methodology .params .param {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.lr-methodology .params .k {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-500);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.lr-methodology .params .v {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.lr-footer {
  margin: 56px 0 0;
  padding: 24px 0 0;
  border-top: 2px solid var(--ink-900);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 32px;
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.55;
}
.lr-footer .col h6 {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-900);
  margin: 0 0 10px;
}
.lr-footer .col p {
  margin: 0;
}
.lr-footer .ver {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.lr-qa {
  margin: 28px 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.lr-qa .item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 14px;
  align-items: baseline;
}
.lr-qa .lbl {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  font-family: var(--fs-mono);
  font-size: 11px;
  font-weight: 600;
  background: var(--ink-100);
  color: var(--ink-700);
}
.lr-qa .item.q .lbl {
  background: var(--ink-900);
  color: var(--ink-0);
}
.lr-qa .item.q .text {
  font-size: 15px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.5;
}
.lr-qa .item.a .text {
  font-size: 14.5px;
  color: var(--ink-600);
  line-height: 1.6;
}
.lr-lead {
  font-size: 22px;
  line-height: 1.35;
  color: var(--ink-900);
  letter-spacing: -0.015em;
  font-weight: 400;
  margin: 28px 0;
  max-width: 30ch;
}
.lr-lead em {
  font-style: normal;
  background: oklch(96% 0.08 80);
  padding: 1px 6px;
  border-radius: 3px;
}
.lr-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  margin: 24px 0;
}
.lr-cols .col p {
  font-size: 14.5px;
  color: var(--ink-700);
  line-height: 1.6;
  margin: 0 0 12px;
}
.lr-cols .col h5 {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin: 0 0 10px;
}
.lr-hquote {
  margin: 40px 0;
  padding: 40px 0;
  border-top: 2px solid var(--ink-900);
  border-bottom: 1px solid var(--border);
  text-align: left;
}
.lr-hquote blockquote {
  margin: 0;
  font-size: 36px;
  line-height: 1.15;
  letter-spacing: -0.028em;
  font-weight: 400;
  color: var(--ink-900);
  max-width: 26ch;
}
.lr-hquote blockquote::before {
  content: "\201C";
  color: var(--ink-300);
  margin-right: 4px;
}
.lr-hquote blockquote::after {
  content: "\201D";
  color: var(--ink-300);
}
.lr-hquote .attr {
  margin-top: 22px;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 12px;
}
.lr-hquote .attr::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--ink-300);
}
.lr-dl {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 24px 0;
}
.lr-dl .row {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 24px;
  padding: 12px 0;
  align-items: baseline;
}
.lr-dl .row + .row {
  border-top: 1px solid var(--ink-100);
}
.lr-dl .term {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-dl .desc {
  font-size: 14px;
  color: var(--ink-600);
  line-height: 1.55;
}
.lr-ba {
  margin: 32px 0;
  display: grid;
  grid-template-columns: 1fr 32px 1fr;
  gap: 16px;
  align-items: stretch;
}
.lr-ba .side {
  padding: 22px 24px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
}
.lr-ba .side.before {
  background: var(--ink-50);
}
.lr-ba .side.after {
  border-color: var(--ink-300);
}
.lr-ba .side h6 {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin: 0 0 10px;
}
.lr-ba .side .v {
  font-size: 28px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.025em;
  font-variant-numeric: tabular-nums;
  margin-bottom: 8px;
}
.lr-ba .side p {
  font-size: 13px;
  color: var(--ink-600);
  margin: 0;
  line-height: 1.5;
}
.lr-ba .arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-400);
}
.lr-etl {
  margin: 32px 0;
  position: relative;
  padding: 32px 0 12px;
}
.lr-etl::before {
  content: "";
  position: absolute;
  top: 38px;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--ink-200);
}
.lr-etl .grid {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 12px;
  position: relative;
}
.lr-etl .ev {
  padding-top: 16px;
  position: relative;
}
.lr-etl .ev::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 4px;
  width: 10px;
  height: 10px;
  background: var(--surface);
  border: 1.5px solid var(--ink-300);
  border-radius: 50%;
}
.lr-etl .ev.done::before {
  background: var(--ink-900);
  border-color: var(--ink-900);
}
.lr-etl .ev .d {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  color: var(--ink-500);
  text-transform: uppercase;
  margin-bottom: 4px;
}
.lr-etl .ev .t {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-etl .ev .s {
  font-size: 12px;
  color: var(--ink-500);
  margin-top: 2px;
  line-height: 1.45;
}
.lr-guide {
  margin: 32px 0;
  padding: 22px 24px;
  border: 1px dashed var(--ink-300);
  border-radius: var(--r-md);
  background: var(--ink-50);
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 16px;
  align-items: start;
}
.lr-guide .ico {
  color: var(--ink-700);
  margin-top: 2px;
}
.lr-guide h5 {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-guide p {
  margin: 0;
  font-size: 13px;
  color: var(--ink-600);
  line-height: 1.55;
}
.lr-guide ul {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.lr-guide li {
  font-size: 13px;
  color: var(--ink-700);
}
.lr-guide li::before {
  content: "→";
  margin-right: 8px;
  color: var(--ink-400);
}
.lr-cite {
  display: inline-grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  font-size: 12px;
  padding: 4px 10px 4px 4px;
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  background: var(--surface);
  font-family: var(--fs-mono);
  color: var(--ink-700);
}
.lr-cite .num {
  background: var(--ink-900);
  color: var(--ink-0);
  padding: 2px 8px;
  border-radius: var(--r-pill);
  font-weight: 500;
}
.lr-caveat {
  margin: 28px 0;
  padding: 18px 22px 18px 24px;
  border-radius: var(--r-md);
  background: var(--surface);
  border: 1px solid var(--ink-200);
  border-left: 3px solid var(--warn);
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 16px;
}
.lr-caveat .ico {
  color: oklch(50% 0.16 70);
  margin-top: 2px;
}
.lr-caveat .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: oklch(50% 0.16 70);
  margin-bottom: 6px;
}
.lr-caveat h6 {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-caveat p {
  margin: 0;
  font-size: 13px;
  color: var(--ink-600);
  line-height: 1.55;
}
.lr-hyp {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 22px 26px;
  background: var(--surface);
}
.lr-hyp .h {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.lr-hyp .h .id {
  background: var(--ink-900);
  color: var(--ink-0);
  padding: 2px 7px;
  border-radius: 4px;
  font-weight: 500;
  letter-spacing: 0.04em;
}
.lr-hyp .h .conf {
  margin-left: auto;
  color: var(--ink-700);
  letter-spacing: 0.04em;
  text-transform: none;
}
.lr-hyp p {
  margin: 0;
  font-size: 17px;
  color: var(--ink-900);
  letter-spacing: -0.012em;
  line-height: 1.4;
}
.lr-evid {
  margin: 24px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 22px;
  background: var(--surface);
  display: grid;
  grid-template-columns: 1fr 140px;
  gap: 24px;
  align-items: center;
}
.lr-evid .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 6px;
}
.lr-evid p {
  margin: 0;
  font-size: 14px;
  color: var(--ink-700);
  line-height: 1.55;
}
.lr-evid .right {
  text-align: right;
}
.lr-evid .conf {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  margin-bottom: 8px;
  font-variant-numeric: tabular-nums;
}
.lr-evid .conf strong {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-evid .cbar {
  height: 6px;
  background: var(--ink-100);
  border-radius: 3px;
  position: relative;
  overflow: hidden;
}
.lr-evid .cbar .fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  background: var(--ink-900);
  border-radius: 3px;
}
.lr-evid .cbar .fill.high {
  background: var(--success);
}
.lr-counter {
  margin: 28px 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.lr-counter .side {
  padding: 18px 22px;
  border-radius: var(--r-md);
  background: var(--surface);
  border: 1px solid var(--border);
}
.lr-counter .side.con {
  border-style: dashed;
}
.lr-counter .side .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.lr-counter .side.pro .label::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--success);
}
.lr-counter .side.con .label::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ink-400);
}
.lr-counter .side p {
  margin: 0;
  font-size: 14px;
  color: var(--ink-700);
  line-height: 1.55;
}
.lr-counter .side strong {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-lex {
  margin: 28px 0;
  padding: 28px 24px 22px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  position: relative;
}
.lr-lex .ax {
  height: 1px;
  background: var(--ink-200);
  position: relative;
  margin: 32px 24px 12px;
}
.lr-lex .term {
  position: absolute;
  top: -8px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.lr-lex .term .pin {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--ink-900);
}
.lr-lex .term .lbl {
  font-size: 12px;
  color: var(--ink-900);
  white-space: nowrap;
  font-weight: 500;
  background: var(--surface);
  padding: 0 4px;
}
.lr-lex .term .desc {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-500);
  letter-spacing: 0.06em;
}
.lr-lex .end {
  display: flex;
  justify-content: space-between;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-400);
  margin: 0 24px;
}
.lr-recipe {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px 24px;
  background: var(--surface);
}
.lr-recipe .head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 14px;
}
.lr-recipe h5 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
}
.lr-recipe .meta {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.08em;
}
.lr-recipe ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.lr-recipe li {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 16px;
  padding: 8px 0;
  font-size: 13.5px;
  align-items: baseline;
}
.lr-recipe li + li {
  border-top: 1px dashed var(--ink-100);
}
.lr-recipe li .q {
  font-family: var(--fs-mono);
  font-size: 12.5px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.lr-recipe li .n {
  color: var(--ink-700);
}
.lr-read {
  margin: 32px 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.lr-read .card {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 16px 18px;
  background: var(--surface);
}
.lr-read .typ {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-500);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.lr-read h5 {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.3;
}
.lr-read .meta {
  font-size: 12px;
  color: var(--ink-500);
  font-family: var(--fs-mono);
  margin-top: 8px;
  letter-spacing: 0.04em;
}
.lr-read p {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-600);
  line-height: 1.5;
}
.lr-bio {
  margin: 28px 0;
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 18px;
  padding: 18px 22px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  align-items: center;
}
.lr-bio .av {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--ink-900);
  color: var(--ink-0);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 600;
}
.lr-bio h5 {
  margin: 0 0 2px;
  font-size: 15px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-bio .role {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.lr-bio p {
  margin: 0;
  font-size: 13px;
  color: var(--ink-600);
  line-height: 1.5;
}
.lr-bio .links {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: end;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.lr-vars {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.lr-vars .row {
  display: grid;
  grid-template-columns: 160px 1fr 120px 110px;
  gap: 16px;
  padding: 12px 22px;
  font-size: 13px;
  align-items: baseline;
}
.lr-vars .row + .row {
  border-top: 1px solid var(--ink-100);
}
.lr-vars .row.head {
  background: var(--ink-50);
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.lr-vars .row .n {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-vars .row .d {
  color: var(--ink-600);
}
.lr-vars .row .v {
  font-family: var(--fs-mono);
  color: var(--ink-700);
  font-variant-numeric: tabular-nums;
}
.lr-vars .row .src {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.lr-risk {
  margin: 28px 0;
  display: grid;
  grid-template-columns: 60px repeat(3, 1fr);
  grid-template-rows: 40px repeat(3, 1fr);
  gap: 4px;
  aspect-ratio: 1.4 / 1;
}
.lr-risk .ax {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
  display: flex;
  align-items: center;
  justify-content: center;
}
.lr-risk .ax.y {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}
.lr-risk .cell {
  border-radius: 4px;
  padding: 10px 12px;
  font-size: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  justify-content: space-between;
}
.lr-risk .cell.l1 {
  background: oklch(96% 0.04 150);
}
.lr-risk .cell.l2 {
  background: oklch(95% 0.06 80);
}
.lr-risk .cell.l3 {
  background: oklch(94% 0.06 30);
}
.lr-risk .cell .lbl {
  font-weight: 500;
  color: var(--ink-900);
}
.lr-risk .cell .it {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.lr-arc {
  margin: 28px 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  position: relative;
}
.lr-arc .act {
  padding: 18px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  position: relative;
}
.lr-arc .act .num {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-500);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.lr-arc .act h5 {
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-arc .act p {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.5;
}
.lr-arc .act.climax {
  background: var(--ink-900);
  border-color: var(--ink-900);
}
.lr-arc .act.climax .num {
  color: oklch(78% 0.13 80);
}
.lr-arc .act.climax h5 {
  color: var(--ink-0);
}
.lr-arc .act.climax p {
  color: var(--ink-300);
}
.lr-chain {
  margin: 28px 0;
  display: grid;
  grid-template-columns: 1fr 28px 1fr 28px 1fr;
  gap: 8px;
  align-items: stretch;
}
.lr-chain .node {
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
}
.lr-chain .node .lbl {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.lr-chain .node h6 {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.4;
}
.lr-chain .arr {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-300);
  font-family: var(--fs-mono);
  font-size: 16px;
}
.lr-hier {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 22px;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}
.lr-hier .lvl {
  display: flex;
  gap: 10px;
}
.lr-hier .node {
  padding: 8px 14px;
  border-radius: 6px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  font-size: 12.5px;
  color: var(--ink-900);
  font-weight: 500;
  text-align: center;
  min-width: 110px;
}
.lr-hier .node.root {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.lr-hier .line {
  height: 14px;
  width: 1px;
  background: var(--ink-200);
}
.lr-hier .bars {
  display: flex;
  gap: 70px;
  position: relative;
  padding-top: 6px;
}
.lr-hier .bars::before {
  content: "";
  position: absolute;
  top: 0;
  left: 18%;
  right: 18%;
  height: 1px;
  background: var(--ink-200);
}
.lr-cluster {
  margin: 28px 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
}
.lr-cluster .grp {
  padding: 16px 18px;
  border-radius: var(--r-md);
  background: var(--surface);
  border: 1px solid var(--border);
}
.lr-cluster .grp h5 {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  display: flex;
  align-items: center;
  gap: 8px;
}
.lr-cluster .grp h5 .pip {
  width: 8px;
  height: 8px;
  border-radius: 2px;
  background: var(--ink-300);
}
.lr-cluster .grp h5 .ct {
  margin-left: auto;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  font-weight: 400;
}
.lr-cluster .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.lr-cluster .tags .t {
  font-size: 11.5px;
  color: var(--ink-700);
  background: var(--ink-100);
  padding: 2px 8px;
  border-radius: 999px;
  white-space: nowrap;
}
.lr-qrib {
  margin: 32px 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.lr-qrib .q {
  padding: 18px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
}
.lr-qrib .q::before {
  content: "\201C";
  font-size: 36px;
  color: var(--ink-200);
  position: absolute;
  top: 6px;
  right: 14px;
  line-height: 1;
}
.lr-qrib .q .text {
  font-size: 14px;
  color: var(--ink-700);
  line-height: 1.5;
  margin: 0;
}
.lr-qrib .q .attr {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  letter-spacing: 0.06em;
  margin-top: auto;
}
.lr-heat {
  margin: 24px 0;
  padding: 18px 22px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.lr-heat .head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 12px;
}
.lr-heat h6 {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
}
.lr-heat .scale {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.08em;
}
.lr-heat .row {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 3px;
  margin-bottom: 6px;
}
.lr-heat .cell {
  aspect-ratio: 1;
  border-radius: 3px;
}
.lr-heat .labels {
  display: flex;
  justify-content: space-between;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.lr-map {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface-sunken);
  position: relative;
  aspect-ratio: 21 / 8;
  overflow: hidden;
}
.lr-map .geo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.lr-map .pin {
  position: absolute;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--ink-900);
  color: var(--ink-0);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 10px;
  font-weight: 600;
  box-shadow: 0 0 0 4px var(--surface);
}
.lr-map .legend {
  position: absolute;
  bottom: 14px;
  left: 16px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--surface);
  padding: 4px 8px;
  border-radius: 4px;
  border: 1px solid var(--border);
}
.lr-miles {
  margin: 28px 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.lr-miles .m {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  gap: 18px;
  padding: 14px 0;
  position: relative;
  align-items: start;
}
.lr-miles .m::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 28px;
  bottom: -14px;
  width: 1px;
  background: var(--ink-200);
}
.lr-miles .m:last-child::before {
  display: none;
}
.lr-miles .m .diamond {
  width: 14px;
  height: 14px;
  transform: rotate(45deg);
  background: var(--surface);
  border: 1.5px solid var(--ink-400);
  margin-top: 6px;
}
.lr-miles .m.done .diamond {
  background: var(--ink-900);
  border-color: var(--ink-900);
}
.lr-miles .m.now .diamond {
  background: var(--success);
  border-color: var(--success);
}
.lr-miles .m h5 {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-miles .m p {
  margin: 0;
  font-size: 12.5px;
  color: var(--ink-500);
  line-height: 1.5;
}
.lr-miles .m .when {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.lr-radar {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 22px 24px;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 28px;
  align-items: center;
}
.lr-radar svg {
  width: 240px;
  height: 240px;
  display: block;
}
.lr-radar .leg {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.lr-radar .leg .row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  font-size: 13px;
  align-items: baseline;
}
.lr-radar .leg .row + .row {
  border-top: 1px dashed var(--ink-100);
  padding-top: 8px;
}
.lr-radar .leg .row .k {
  color: var(--ink-700);
}
.lr-radar .leg .row .v {
  font-family: var(--fs-mono);
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.lr-ribbon {
  margin: 28px 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.lr-ribbon .cell {
  padding: 14px 18px;
  border-right: 1px solid var(--ink-100);
}
.lr-ribbon .cell:last-child {
  border-right: 0;
}
.lr-ribbon .lbl {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-500);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.lr-ribbon .v {
  font-size: 22px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.025em;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.lr-ribbon .d {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  margin-top: 2px;
}
.lr-ribbon .d.up {
  color: var(--success);
}
.lr-ribbon .d.dn {
  color: var(--danger);
}
.lr-photoq {
  margin: 32px 0;
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 28px;
  align-items: stretch;
  padding: 28px;
  background: var(--ink-50);
  border-radius: var(--r-md);
}
.lr-photoq .photo {
  background: var(--ink-900);
  position: relative;
  aspect-ratio: 4 / 5;
  border-radius: var(--r-sm);
  overflow: hidden;
}
.lr-photoq .photo svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.lr-photoq blockquote {
  margin: 0;
  font-size: 20px;
  line-height: 1.35;
  letter-spacing: -0.012em;
  color: var(--ink-900);
}
.lr-photoq blockquote::before {
  content: "\201C";
  color: var(--ink-300);
}
.lr-photoq blockquote::after {
  content: "\201D";
  color: var(--ink-300);
}
.lr-photoq .attr {
  margin-top: 18px;
  font-size: 13px;
  color: var(--ink-500);
  border-top: 1px solid var(--ink-200);
  padding-top: 12px;
}
.lr-photoq .attr strong {
  color: var(--ink-900);
  font-weight: 500;
  display: block;
  margin-bottom: 2px;
}
.lr-rtt {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
}
.lr-rtt .row {
  display: grid;
  grid-template-columns: 30px 1fr 80px 60px;
  gap: 16px;
  padding: 10px 22px;
  font-size: 13px;
  align-items: center;
}
.lr-rtt .row + .row {
  border-top: 1px solid var(--ink-100);
}
.lr-rtt .row.head {
  background: var(--ink-50);
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.lr-rtt .row .n {
  font-family: var(--fs-mono);
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.lr-rtt .row .ti {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-rtt .row .t {
  font-family: var(--fs-mono);
  color: var(--ink-700);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.lr-rtt .row .ratio {
  height: 5px;
  background: var(--ink-100);
  border-radius: 2px;
  overflow: hidden;
}
.lr-rtt .row .ratio .fill {
  height: 100%;
  background: var(--ink-900);
  border-radius: 2px;
}
.lr-changelog {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
}
.lr-changelog .v {
  padding: 16px 22px;
}
.lr-changelog .v + .v {
  border-top: 1px solid var(--ink-100);
}
.lr-changelog .head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 8px;
}
.lr-changelog .head .ver {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-900);
  font-weight: 500;
  letter-spacing: 0.04em;
}
.lr-changelog .head .when {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
}
.lr-changelog ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.lr-changelog li {
  font-size: 13px;
  color: var(--ink-700);
  padding: 3px 0;
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 12px;
  align-items: baseline;
}
.lr-changelog li .tag {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 3px;
  background: var(--ink-100);
  color: var(--ink-700);
  text-align: center;
  font-weight: 500;
}
.lr-changelog li .tag.add {
  background: oklch(94% 0.04 150);
  color: var(--success);
}
.lr-changelog li .tag.fix {
  background: oklch(95% 0.05 80);
  color: oklch(50% 0.16 70);
}
.lr-changelog li .tag.rem {
  background: oklch(95% 0.04 30);
  color: var(--danger);
}
.lr-disc {
  margin: 28px 0;
  padding: 16px 20px;
  background: var(--ink-50);
  border-radius: var(--r-md);
  font-size: 12px;
  color: var(--ink-500);
  line-height: 1.55;
  border-left: 3px solid var(--ink-300);
}
.lr-disc .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-700);
  margin-right: 8px;
  display: inline-block;
  margin-bottom: 4px;
}
.lr-export {
  margin: 28px 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  background: var(--surface);
}
.lr-export .btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border: 0;
  background: none;
  border-radius: var(--r-pill);
  font: inherit;
  font-size: 13px;
  color: var(--ink-600);
  cursor: pointer;
}
.lr-export .btn:hover {
  color: var(--ink-900);
  background: var(--ink-50);
}
.lr-export .btn.active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.lr-export .sep {
  width: 1px;
  height: 18px;
  background: var(--ink-200);
  margin: 0 4px;
}
.lr-bm {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 14px 18px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 16px;
  align-items: center;
}
.lr-bm .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.lr-bm .items {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.lr-bm .item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: 12px;
  border-radius: var(--r-pill);
  background: var(--ink-50);
  color: var(--ink-700);
  border: 1px solid var(--border);
  cursor: pointer;
}
.lr-bm .item:hover {
  border-color: var(--ink-700);
}
.lr-bm .item .pg {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.lr-figindex {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 22px;
}
.lr-figindex h6 {
  margin: 0 0 12px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.lr-figindex ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.lr-figindex li {
  display: grid;
  grid-template-columns: 56px 1fr 40px;
  gap: 14px;
  padding: 6px 0;
  font-size: 13px;
  align-items: baseline;
}
.lr-figindex li + li {
  border-top: 1px dashed var(--ink-100);
}
.lr-figindex li .ref {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.lr-figindex li .pg {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.lr-figindex li .ti {
  color: var(--ink-700);
}
.lr-refcard {
  margin: 28px 0;
  position: relative;
  display: inline-block;
}
.lr-refcard .ref-pop {
  display: inline-block;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-2);
  padding: 14px 18px;
  font-size: 12px;
  color: var(--ink-600);
  max-width: 280px;
  line-height: 1.5;
}
.lr-refcard .ref-pop strong {
  color: var(--ink-900);
  font-weight: 500;
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
}
.lr-refcard .ref-pop .meta {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  margin-top: 6px;
}
.lr-margin {
  margin: 28px 0;
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 28px;
  align-items: start;
}
.lr-margin .note {
  font-size: 12px;
  color: var(--ink-500);
  line-height: 1.55;
  padding: 8px 0 8px 14px;
  border-left: 2px solid var(--ink-200);
  font-family: var(--fs-mono);
}
.lr-margin .note .label {
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-700);
  display: block;
  margin-bottom: 6px;
  font-family: var(--fs-mono);
}
.lr-margin .body p {
  margin: 0;
  font-size: 15px;
  color: var(--ink-700);
  line-height: 1.65;
}
.lr-marginalia {
  margin: 28px 0;
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 32px;
  align-items: start;
}
.lr-marginalia .body p {
  margin: 0;
  font-size: 15px;
  color: var(--ink-700);
  line-height: 1.65;
}
.lr-marginalia .gloss {
  font-size: 12px;
  color: var(--ink-500);
  font-style: italic;
  line-height: 1.5;
  padding-left: 12px;
  border-left: 1px solid var(--ink-200);
}
.lr-log {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--ink-50);
  padding: 0;
  overflow: hidden;
  font-family: var(--fs-mono);
}
.lr-log .row {
  display: grid;
  grid-template-columns: 130px 60px 1fr;
  gap: 14px;
  padding: 8px 18px;
  font-size: 12px;
  color: var(--ink-700);
}
.lr-log .row + .row {
  border-top: 1px solid var(--ink-100);
}
.lr-log .ts {
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.lr-log .lvl {
  font-size: 9.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 500;
  align-self: center;
  padding: 2px 6px;
  border-radius: 3px;
  background: var(--ink-200);
  color: var(--ink-700);
  text-align: center;
}
.lr-log .lvl.ok {
  background: var(--success-soft);
  color: var(--success);
}
.lr-log .lvl.warn {
  background: oklch(95% 0.06 80);
  color: oklch(50% 0.16 70);
}
.lr-log .lvl.err {
  background: oklch(95% 0.05 30);
  color: var(--danger);
}
.lr-log .msg {
  color: var(--ink-900);
}
.lr-rank {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
}
.lr-rank .row {
  display: grid;
  grid-template-columns: 30px 32px 1fr 80px 56px;
  gap: 12px;
  padding: 10px 18px;
  align-items: center;
  font-size: 13px;
}
.lr-rank .row + .row {
  border-top: 1px solid var(--ink-100);
}
.lr-rank .r {
  font-family: var(--fs-mono);
  font-size: 14px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  letter-spacing: -0.02em;
}
.lr-rank .row.first .r {
  color: var(--ink-900);
}
.lr-rank .row .av {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--ink-100);
  color: var(--ink-700);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10.5px;
  font-weight: 600;
}
.lr-rank .row .nm {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-rank .row .v {
  font-family: var(--fs-mono);
  font-size: 12.5px;
  font-variant-numeric: tabular-nums;
  color: var(--ink-700);
  text-align: right;
}
.lr-rank .row .d {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.lr-rank .row .d.up {
  color: var(--success);
}
.lr-rank .row .d.dn {
  color: var(--danger);
}
.lr-likert {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px 24px;
  background: var(--surface);
}
.lr-likert h6 {
  margin: 0 0 16px;
  font-size: 13.5px;
  font-weight: 500;
}
.lr-likert .scale {
  display: flex;
  height: 14px;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 10px;
}
.lr-likert .scale .seg {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-0);
  font-variant-numeric: tabular-nums;
}
.lr-likert .labels {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--ink-500);
}
.lr-likert .labels .lbl {
  font-family: var(--fs-mono);
  letter-spacing: 0.04em;
}
.lr-likert .meta {
  margin-top: 8px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.06em;
}
.lr-vote {
  margin: 24px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 22px;
  background: var(--surface);
}
.lr-vote h6 {
  margin: 0 0 12px;
  font-size: 13.5px;
  font-weight: 500;
}
.lr-vote .bar {
  display: flex;
  height: 32px;
  border-radius: 4px;
  overflow: hidden;
}
.lr-vote .bar .yes {
  background: var(--ink-900);
  color: var(--ink-0);
  display: flex;
  align-items: center;
  padding: 0 12px;
  font-size: 12px;
  font-family: var(--fs-mono);
}
.lr-vote .bar .no {
  background: var(--ink-150);
  color: var(--ink-700);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 12px;
  font-size: 12px;
  font-family: var(--fs-mono);
}
.lr-vote .meta {
  margin-top: 8px;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.lr-hist {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 20px 24px;
  background: var(--surface);
}
.lr-hist .head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 14px;
}
.lr-hist h6 {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
}
.lr-hist .n {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
}
.lr-hist .bins {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 120px;
  margin-bottom: 8px;
}
.lr-hist .bin {
  flex: 1;
  background: var(--ink-900);
  border-radius: 2px 2px 0 0;
  min-height: 4px;
}
.lr-hist .bin.med {
  background: var(--ink-700);
}
.lr-hist .bin.lo {
  background: var(--ink-300);
}
.lr-hist .axis {
  display: flex;
  justify-content: space-between;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
}
.lr-box {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 22px 24px;
  background: var(--surface);
}
.lr-box .row {
  display: grid;
  grid-template-columns: 140px 1fr 80px;
  gap: 16px;
  align-items: center;
  padding: 10px 0;
}
.lr-box .row + .row {
  border-top: 1px dashed var(--ink-100);
}
.lr-box .lbl {
  font-size: 13px;
  color: var(--ink-700);
  font-weight: 500;
}
.lr-box .v {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.lr-box .plot {
  position: relative;
  height: 22px;
  background: linear-gradient(to right, var(--ink-50) 0%, var(--ink-50) 100%);
  border-radius: 4px;
}
.lr-box .plot .whisker {
  position: absolute;
  top: 50%;
  height: 1.5px;
  background: var(--ink-400);
  transform: translateY(-50%);
}
.lr-box .plot .iqr {
  position: absolute;
  top: 4px;
  bottom: 4px;
  background: var(--ink-900);
  border-radius: 2px;
}
.lr-box .plot .med {
  position: absolute;
  top: 2px;
  bottom: 2px;
  width: 2px;
  background: var(--ink-0);
}
.lr-box .plot .cap-l, .lr-box .plot .cap-r {
  position: absolute;
  top: 4px;
  bottom: 4px;
  width: 1.5px;
  background: var(--ink-400);
}
.lr-ci {
  margin: 24px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 16px 22px;
  background: var(--surface);
}
.lr-ci .row {
  display: grid;
  grid-template-columns: 160px 1fr 110px;
  gap: 16px;
  align-items: center;
  padding: 10px 0;
}
.lr-ci .row + .row {
  border-top: 1px dashed var(--ink-100);
}
.lr-ci .lbl {
  font-size: 13px;
  color: var(--ink-700);
  font-weight: 500;
}
.lr-ci .v {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.lr-ci .range {
  position: relative;
  height: 14px;
}
.lr-ci .range::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--ink-200);
  transform: translateY(-50%);
}
.lr-ci .range .span {
  position: absolute;
  top: 6px;
  height: 3px;
  background: var(--ink-900);
  border-radius: 2px;
}
.lr-ci .range .est {
  position: absolute;
  top: 3px;
  width: 9px;
  height: 9px;
  background: var(--surface);
  border: 2px solid var(--ink-900);
  border-radius: 50%;
  transform: translateX(-50%);
}
.lr-words {
  margin: 28px 0;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  justify-content: center;
  align-items: center;
}
.lr-words .w {
  color: var(--ink-700);
  letter-spacing: -0.01em;
  line-height: 1;
}
.lr-words .w.x4 {
  font-size: 32px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-words .w.x3 {
  font-size: 24px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-words .w.x2 {
  font-size: 18px;
}
.lr-words .w.x1 {
  font-size: 14px;
  color: var(--ink-500);
}
.lr-cmap {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 24px;
  background: var(--surface);
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.lr-cmap .net {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.lr-cmap .node {
  position: absolute;
  background: var(--surface);
  border: 1px solid var(--ink-300);
  border-radius: var(--r-pill);
  padding: 6px 14px;
  font-size: 12.5px;
  color: var(--ink-900);
  font-weight: 500;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}
.lr-cmap .node.center {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.lr-pyramid {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 22px 28px;
  background: var(--surface);
}
.lr-pyramid .head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 14px;
}
.lr-pyramid h6 {
  margin: 0;
  font-size: 13px;
  font-weight: 500;
}
.lr-pyramid .leg {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
}
.lr-pyramid .row {
  display: grid;
  grid-template-columns: 1fr 56px 1fr;
  gap: 8px;
  align-items: center;
  padding: 3px 0;
  font-family: var(--fs-mono);
  font-variant-numeric: tabular-nums;
}
.lr-pyramid .row .lbl {
  font-size: 10.5px;
  text-align: center;
  color: var(--ink-700);
}
.lr-pyramid .bar-l, .lr-pyramid .bar-r {
  height: 14px;
  background: var(--ink-200);
  position: relative;
}
.lr-pyramid .bar-l {
  border-radius: 2px 0 0 2px;
  display: flex;
  justify-content: flex-end;
}
.lr-pyramid .bar-l .fill {
  background: var(--ink-900);
  height: 100%;
  border-radius: 2px 0 0 2px;
}
.lr-pyramid .bar-r {
  border-radius: 0 2px 2px 0;
}
.lr-pyramid .bar-r .fill {
  background: var(--ink-700);
  height: 100%;
  border-radius: 0 2px 2px 0;
}
.lr-ack {
  margin: 32px 0;
  padding: 22px 26px;
  background: var(--ink-50);
  border-radius: var(--r-md);
  border-top: 2px solid var(--ink-900);
}
.lr-ack h6 {
  margin: 0 0 10px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-900);
}
.lr-ack p {
  margin: 0 0 10px;
  font-size: 13px;
  color: var(--ink-600);
  line-height: 1.6;
}
.lr-ack p:last-child {
  margin-bottom: 0;
}
.lr-ack strong {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-errata {
  margin: 28px 0;
  padding: 18px 22px;
  background: var(--surface);
  border: 1px solid var(--ink-200);
  border-radius: var(--r-md);
  font-size: 13px;
  color: var(--ink-700);
  line-height: 1.55;
}
.lr-errata .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--danger);
  display: block;
  margin-bottom: 8px;
}
.lr-errata .row {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 16px;
  padding: 8px 0;
  align-items: baseline;
}
.lr-errata .row + .row {
  border-top: 1px dashed var(--ink-100);
}
.lr-errata .row .when {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
}
.lr-preface {
  margin: 32px 0;
  padding: 26px 0;
  border-top: 1px solid var(--ink-200);
  border-bottom: 1px solid var(--ink-200);
}
.lr-preface .label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 12px;
}
.lr-preface p {
  margin: 0 0 12px;
  font-size: 16px;
  color: var(--ink-700);
  line-height: 1.6;
  font-style: italic;
  font-family: 'Manrope', serif;
}
.lr-preface .sig {
  margin-top: 14px;
  font-size: 12.5px;
  color: var(--ink-500);
  font-style: normal;
  font-family: var(--fs-mono);
  letter-spacing: 0.04em;
}
.lr-preface .sig strong {
  color: var(--ink-900);
  font-weight: 500;
}
.lr-feedback {
  margin: 28px 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 18px 22px;
  background: var(--surface);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px;
  align-items: center;
}
.lr-feedback h6 {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.lr-feedback .sub {
  font-size: 12px;
  color: var(--ink-500);
  margin-top: 2px;
}
.lr-feedback .opts {
  display: flex;
  gap: 6px;
}
.lr-feedback .opt {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: var(--surface);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 16px;
  color: var(--ink-600);
}
.lr-feedback .opt:hover {
  border-color: var(--ink-700);
}
.lr-feedback .opt.active {
  background: var(--ink-900);
  border-color: var(--ink-900);
  color: var(--ink-0);
}
.lr-feedback .opt svg {
  width: 18px;
  height: 18px;
}
.slot-card {
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: var(--r-md);
  padding: 16px 18px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: start;
}
.slot-card.major {
  border-color: var(--ink-700);
  border-width: 1.5px;
}
.slot-card .index {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.slot-card .label {
  font-size: 15px;
  font-weight: 600;
  color: var(--ink-900);
}
.slot-card .when {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-500);
  margin-top: 2px;
}
.slot-card .desc {
  font-size: 13px;
  color: var(--ink-500);
  margin-top: 6px;
  line-height: 1.5;
}
.bars-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.bars-list .bar-row {
  grid-template-columns: 110px 1fr 56px;
  padding: 7px 0;
}
.bars-list .bar-row + .bar-row {
  border-top: 1px dashed var(--ink-150);
}
.body-grid {
  margin-top: 32px;
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 48px;
  padding-bottom: 32px;
  border-bottom: 1px solid var(--border);
}
.body-text {
  font-size: 15px;
  color: var(--ink-700);
  line-height: 1.6;
}
.body-text a {
  text-decoration: underline;
  text-decoration-color: var(--ink-300);
  text-underline-offset: 3px;
}
.body-text a:hover {
  text-decoration-color: var(--ink-900);
}
.meta-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-top: 2px;
}
.app-hero {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 20px;
  align-items: center;
  margin-bottom: 24px;
}
.app-hero-avatar {
  width: 64px;
  height: 64px;
  border-radius: var(--r-lg);
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04);
}
.app-hero-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
.app-hero h1 {
  margin: 0;
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.app-hero-tagline {
  margin: 0;
  color: var(--ink-500);
  font-size: 15px;
  max-width: 560px;
}
.app-hero-actions {
  display: flex;
  gap: 10px;
}
:root {
  --rightbar-w: 360px;
  --rightbar-rail-w: 56px;
  --sidebar-rail-w: 56px;
}
.app--with-rightbar {
  padding-right: var(--rightbar-w);
}
html[data-right="rail"] .app--with-rightbar {
  padding-right: var(--rightbar-rail-w);
}
.app {
  transition: grid-template-columns var(--dur-base) var(--ease-out);
}
html[data-left="rail"] .app {
  grid-template-columns: var(--sidebar-rail-w) 1fr;
}
html[data-left="expanded"] .app {
  grid-template-columns: var(--sidebar-w) 1fr;
}
.rightbar {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: var(--rightbar-w);
  border-left: 1px solid var(--border);
  background: var(--bg);
  display: flex;
  flex-direction: column;
  z-index: 20;
  overflow: hidden;
  transition: width var(--dur-base) var(--ease-out);
}
html[data-right="rail"] .rightbar {
  width: var(--rightbar-rail-w);
}
html[data-right="rail"] .rightbar-expanded-view {
  display: none;
}
html[data-right="expanded"] .rightbar-rail-view {
  display: none;
}
.rightbar-rail-view {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 14px 0;
  gap: 6px;
}
.rightbar-head {
  height: var(--topbar-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 16px;
  border-bottom: 1px solid var(--border);
  background: var(--bg);
  flex-shrink: 0;
}
.rightbar-body {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
  overscroll-behavior: contain;
}
.rightbar-foot {
  border-top: 1px solid var(--border);
  padding: 12px 16px;
  flex-shrink: 0;
  background: var(--bg);
}
html[data-left="expanded"] .sidebar.left-sidebar {
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.sidebar-expanded-view {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
.sidebar-head {
  height: var(--topbar-h);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  padding: 0 12px 0 20px;
}
.sidebar-nav {
  flex: 1;
  overflow-y: auto;
  padding: 20px 20px 8px;
  min-height: 0;
}
.sidebar-foot {
  flex-shrink: 0;
  padding: 10px 16px 14px;
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 8px;
}
.sidebar {
  transition: width var(--dur-base) var(--ease-out);
}
html[data-left="rail"] .sidebar.left-sidebar {
  width: var(--sidebar-rail-w);
  padding: 0 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
html[data-left="rail"] .sidebar.left-sidebar .sidebar-expanded-view {
  display: none;
}
html[data-left="expanded"] .sidebar.left-sidebar .sidebar-rail-only {
  display: none;
}
.sidebar-rail-only {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}
.sidebar-rail-only .rail-head {
  margin: 0 -8px;
  width: calc(100% + 16px);
}
.rail-head {
  height: var(--topbar-h);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 100%;
}
.rail-nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding-top: 8px;
  flex: 1;
}
.rail-nav .rail-tab {
  width: 40px;
  height: 40px;
  padding: 8px;
  justify-content: center;
}
.rail-nav .rail-tab.disabled {
  opacity: 0.3;
  cursor: default;
}
.rail-nav .rail-tab.disabled:hover {
  background: none;
  color: var(--ink-600);
}
.rail-foot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding-bottom: 14px;
}
.sidebar--rail {
  width: var(--sidebar-rail-w);
  padding: 14px 8px;
}
.sidebar--rail .brand-name, .sidebar--rail .brand-sub, .sidebar--rail .nav-title, .sidebar--rail .nav-link > span:first-child {
  display: none;
}
.sidebar--rail .brand {
  gap: 0;
  justify-content: center;
  margin-bottom: 16px;
}
.sidebar--rail .nav-link {
  justify-content: center;
  padding: 8px;
  width: 40px;
  height: 40px;
}
.sidebar--rail .nav-group {
  margin-bottom: 12px;
}
.kanban {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  min-height: 0;
}
.kanban-col {
  background: var(--surface-sunken);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 200px;
}
.kanban-col-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
  padding: 0 4px 8px;
}
.kanban-col-head .count {
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.kanban-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 10px 12px;
  font-size: 13px;
  color: var(--ink-900);
  display: flex;
  flex-direction: column;
  gap: 6px;
  cursor: grab;
}
.kanban-card:hover {
  border-color: var(--border-strong);
}
.kanban-card.dragging {
  opacity: 0.5;
}
.kanban-card .meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.cell-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 14px 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  cursor: grab;
  position: relative;
  min-height: 120px;
  transition: border-color var(--dur-fast) var(--ease-out);
}
.cell-card:hover {
  border-color: var(--border-strong);
}
.cell-card.pinned {
  background: var(--ink-50);
  border-color: var(--ink-300);
}
.cell-card.dragging {
  opacity: 0.5;
}
.cell-card-head {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
}
.cell-card-icon {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ink-100);
  color: var(--ink-700);
  border-radius: 6px;
  flex-shrink: 0;
}
.cell-card-title {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.005em;
  line-height: 1.3;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.cell-card-body {
  font-size: 12px;
  color: var(--ink-500);
  line-height: 1.5;
  flex: 1;
  min-height: 0;
}
.cell-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.cell-card .drag-handle {
  color: var(--ink-300);
  cursor: grab;
}
.cell-card .drag-handle:hover {
  color: var(--ink-700);
}
.bars-h {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 18px 0 22px;
}
.bars-h-row {
  display: grid;
  grid-template-columns: 120px 1fr 56px;
  gap: 12px;
  align-items: center;
  font-size: 13px;
}
.bars-h-row .label {
  color: var(--ink-700);
  font-weight: 500;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bars-h-row .track {
  height: 8px;
  background: var(--ink-100);
  border-radius: 2px;
  overflow: hidden;
}
.bars-h-row .fill {
  height: 100%;
  background: var(--ink-900);
  border-radius: 2px;
  transition: width var(--dur-slow) var(--ease-out);
}
.bars-h-row .fill.brand {
  background: var(--brand);
}
.bars-h-row .fill.muted {
  background: var(--ink-300);
}
.bars-h-row .value {
  text-align: right;
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.plc-tracker {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 0;
  margin: 24px 0;
}
.plc-step {
  position: relative;
  padding: 32px 8px 0;
  text-align: center;
}
.plc-step::before {
  content: "";
  position: absolute;
  top: 13px;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--ink-200);
}
.plc-step:first-child::before {
  left: 50%;
}
.plc-step:last-child::before {
  right: 50%;
}
.plc-step-pin {
  position: absolute;
  top: 4px;
  left: calc(50% - 10px);
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--surface);
  border: 1.5px solid var(--ink-300);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--fs-mono);
  font-size: 10px;
  font-weight: 500;
  color: var(--ink-700);
  font-variant-numeric: tabular-nums;
}
.plc-step.done .plc-step-pin {
  background: var(--ink-900);
  border-color: var(--ink-900);
  color: var(--ink-0);
}
.plc-step.active .plc-step-pin {
  background: var(--success);
  border-color: var(--success);
  color: var(--ink-0);
  box-shadow: 0 0 0 4px var(--success-soft);
}
.plc-step.done::before, .plc-step.active::before {
  background: var(--ink-900);
}
.plc-step-name {
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-900);
}
.plc-step.idle .plc-step-name {
  color: var(--ink-400);
  font-weight: 400;
}
.plc-step-sub {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  margin-top: 2px;
  font-variant-numeric: tabular-nums;
}
.book-toc-card {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 18px 20px;
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 16px;
  align-items: center;
  cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-out);
}
.book-toc-card:hover {
  border-color: var(--border-strong);
}
.book-toc-card-num {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.book-toc-card-title {
  font-size: 15px;
  font-weight: 500;
  color: var(--ink-900);
  margin: 4px 0 2px;
  letter-spacing: -0.01em;
}
.book-toc-card-meta {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-500);
  display: flex;
  align-items: center;
  gap: 10px;
}
.book-toc-card-meta .pip {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--ink-300);
}
.msg-bubble {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 12px;
  padding: 10px 16px;
}
.msg-bubble + .msg-bubble {
  padding-top: 4px;
}
.msg-bubble .av {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ink-100);
  color: var(--ink-700);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  flex-shrink: 0;
}
.msg-bubble.you .av {
  background: var(--ink-900);
  color: var(--ink-0);
}
.msg-bubble.mad .av {
  background: var(--brand);
  color: var(--ink-0);
}
.msg-bubble .who {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 4px;
}
.msg-bubble .body {
  font-size: 14px;
  color: var(--ink-700);
  line-height: 1.55;
  word-wrap: break-word;
  overflow-wrap: anywhere;
}
.msg-bubble .body p {
  margin: 0 0 8px;
}
.msg-bubble .body p:last-child {
  margin-bottom: 0;
}
.msg-bubble .meta {
  margin-top: 6px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.analysis-tile {
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 96px;
  position: relative;
  overflow: hidden;
}
.analysis-tile.active {
  border-color: var(--ink-900);
}
.analysis-tile.done {
  background: var(--success-soft);
  border-color: var(--success);
}
.analysis-tile.failed {
  background: oklch(96% 0.04 30);
  border-color: var(--danger);
}
.analysis-tile-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.analysis-tile-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.analysis-tile-body {
  flex: 1;
  font-size: 12px;
  color: var(--ink-500);
  line-height: 1.5;
}
.analysis-tile-progress {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.gnews {
  display: grid;
  grid-template-columns: 188px minmax(300px, 372px) 1fr;
  gap: 0;
  margin-top: 20px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
  height: calc(100vh - 240px);
  min-height: 480px;
}
.gnews-rail {
  border-right: 1px solid var(--border);
  background: var(--surface-sunken);
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
}
.gnews-rail-head {
  padding: 12px 14px 8px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-400);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.gnews-rail-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  cursor: pointer;
  border-bottom: 1px solid transparent;
  transition: background var(--dur-fast) var(--ease-out);
  min-width: 0;
}
.gnews-rail-item:hover {
  background: var(--surface-2);
}
.gnews-rail-item.active {
  background: var(--surface);
  border-left: 2px solid var(--ink-700);
}
.gnews-rail-item:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: -2px;
}
.gnews-rail-dot {
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ink-300);
}
.gnews-rail-dot--all {
  background: var(--ink-500);
}
.gnews-rail-dot--critical {
  background: var(--danger);
  box-shadow: 0 0 0 3px oklch(94% 0.04 30);
}
.gnews-rail-dot--useful {
  background: var(--success);
  box-shadow: 0 0 0 3px var(--success-soft);
}
.gnews-rail-name {
  flex: 1;
  font-size: 13px;
  color: var(--ink-700);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
}
.gnews-rail-item.active .gnews-rail-name {
  color: var(--ink-900);
}
.gnews-rail-count {
  flex-shrink: 0;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  padding: 1px 5px;
  border-radius: var(--r-pill);
  background: var(--ink-100);
}
.gnews-rail-count--total {
  color: var(--ink-500);
}
.gnews-rail-count--critical {
  background: oklch(94% 0.04 30);
  color: var(--danger);
  font-weight: 600;
}
.gnews-rail-count--useful {
  background: var(--success-soft);
  color: var(--success);
  font-weight: 600;
}
.gnews-list {
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
.gnews-list-head {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.gnews-list-head .segmented {
  width: 100%;
}
.gnews-list-head .segmented-item {
  flex: 1;
  justify-content: center;
}
.gnews-kind-filter {
  display: flex;
  gap: 4px;
}
.gnews-kind-btn {
  flex: 1;
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: transparent;
  font-size: 11px;
  color: var(--ink-500);
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease-out);
  font-family: var(--fs-mono);
  letter-spacing: 0.02em;
}
.gnews-kind-btn:hover {
  border-color: var(--ink-400);
  color: var(--ink-700);
}
.gnews-kind-btn.active {
  background: var(--ink-900);
  border-color: var(--ink-900);
  color: var(--ink-0);
}
.gnews-list-body {
  flex: 1 1 0;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  overscroll-behavior: contain;
}
.gnews-section {
  display: flex;
  flex-direction: column;
}
.gnews-section-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px 6px;
  background: var(--surface-sunken);
  border-bottom: 1px solid var(--ink-100);
}
.gnews-section--critical .gnews-section-head {
  background: oklch(97% 0.015 30);
}
.gnews-section--useful .gnews-section-head {
  background: oklch(97% 0.02 145);
}
.gnews-section-icon {
  font-size: 12px;
}
.gnews-section-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--ink-600);
}
.gnews-section--critical .gnews-section-label {
  color: var(--danger);
}
.gnews-section--useful .gnews-section-label {
  color: var(--success);
}
.gnews-section-count {
  margin-left: auto;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
}
.gnews-section-rows {
  display: flex;
  flex-direction: column;
}
.gnews-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 14px;
  cursor: pointer;
  border-bottom: 1px solid var(--ink-100);
  transition: background var(--dur-fast) var(--ease-out);
  min-width: 0;
}
.gnews-row:hover {
  background: var(--surface-2);
}
.gnews-row.is-selected {
  background: var(--surface);
  box-shadow: inset 2px 0 0 var(--ink-700);
}
.gnews-row.is-unread .gnews-row-summary {
  color: var(--ink-900);
}
.gnews-row.is-read {
  opacity: 0.65;
}
.gnews-row:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: -2px;
}
.gnews-row-body {
  flex: 1;
  min-width: 0;
}
.gnews-row-top {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}
.gnews-row-project {
  font-size: 10px;
  font-family: var(--fs-mono);
  font-weight: 600;
  color: var(--brand-ink);
  background: var(--brand-soft);
  padding: 1px 6px;
  border-radius: var(--r-pill);
  white-space: nowrap;
  max-width: 90px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gnews-row-source {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-700);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 120px;
}
.gnews-row-time {
  margin-left: auto;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  white-space: nowrap;
  flex-shrink: 0;
}
.gnews-row-summary {
  font-size: 12px;
  color: var(--ink-600);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.gnews-row-tags {
  display: flex;
  gap: 4px;
  margin-top: 5px;
  flex-wrap: wrap;
}
.gnews-row-tag {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.04em;
  color: var(--ink-500);
  background: var(--ink-100);
  padding: 1px 5px;
  border-radius: var(--r-pill);
}
.gnews-row-thumb {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: var(--r-sm);
  overflow: hidden;
  background: var(--ink-100);
}
.gnews-row-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.gnews-archive-section {
  border-top: 1px solid var(--border);
}
.gnews-archive-toggle {
  width: 100%;
  padding: 9px 14px;
  text-align: left;
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 12px;
  color: var(--ink-400);
  display: flex;
  align-items: center;
  gap: 6px;
  transition: color var(--dur-fast) var(--ease-out);
}
.gnews-archive-toggle:hover {
  color: var(--ink-700);
}
.gnews-archive-toggle-icon {
  font-size: 10px;
}
.gnews-detail {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 0;
}
.gnews-detail-empty {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: var(--ink-400);
  padding: 40px;
}
.gnews-detail-empty .mark {
  font-size: 36px;
}
.gnews-detail-empty .title {
  font-size: 15px;
  font-weight: 600;
  color: var(--ink-600);
}
.gnews-detail-empty .desc {
  font-size: 13px;
  text-align: center;
  max-width: 280px;
}
.gnews-detail-article {
  flex: 1;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.gnews-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}
.gnews-detail-source-block {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
}
.gnews-detail-source-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--ink-900);
  line-height: 1.3;
}
.gnews-detail-source-meta {
  font-size: 12px;
  color: var(--ink-500);
  margin-top: 1px;
}
.gnews-detail-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.gnews-detail-launch {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--surface-sunken);
  border-radius: var(--r-sm);
  margin-bottom: 16px;
  border: 1px solid var(--border);
}
.gnews-detail-launch-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-400);
}
.gnews-detail-launch-link {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-900);
  text-decoration: none;
  transition: color var(--dur-fast);
}
.gnews-detail-launch-link:hover {
  color: var(--brand);
}
.gnews-detail-launch-status {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  font-weight: 400;
}
.gnews-detail-launch-arrow {
  color: var(--ink-400);
  font-size: 13px;
  margin-left: auto;
}
.gnews-detail-reason {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 14px;
  background: var(--surface-sunken);
  border-radius: var(--r-sm);
  margin-bottom: 14px;
  border-left: 3px solid var(--ink-200);
}
.gnews-detail-reason-badge {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-400);
}
.gnews-detail-reason-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.gnews-detail-reason-text {
  font-size: 13px;
  color: var(--ink-700);
  line-height: 1.5;
  margin: 0;
}
.gnews-detail-text {
  font-size: 14px;
  color: var(--ink-900);
  line-height: 1.65;
  white-space: pre-wrap;
  margin-bottom: 16px;
}
.gnews-detail-empty-text {
  font-size: 13px;
  color: var(--ink-400);
  margin-bottom: 16px;
  font-style: italic;
}
.gnews-detail-photo {
  margin-bottom: 16px;
  border-radius: var(--r-md);
  overflow: hidden;
  max-height: 440px;
}
.gnews-detail-photo img {
  width: 100%;
  object-fit: cover;
  display: block;
}
.gnews-detail-gallery {
  display: grid;
  gap: 3px;
  margin-bottom: 16px;
  border-radius: var(--r-md);
  overflow: hidden;
}
.gnews-detail-gallery.photos-1 {
  grid-template-columns: 1fr;
}
.gnews-detail-gallery.photos-2 {
  grid-template-columns: 1fr 1fr;
}
.gnews-detail-gallery.photos-3 {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
}
.gnews-detail-gallery.photos-3 .gnews-detail-gallery-cell:first-child {
  grid-row: span 2;
}
.gnews-detail-gallery.photos-4 {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
}
.gnews-detail-gallery-cell {
  overflow: hidden;
  aspect-ratio: 4/3;
  background: var(--ink-100);
}
.gnews-detail-gallery-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.gnews-detail-gallery-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 12px;
  color: var(--ink-400);
}
.gnews-detail-gallery-more {
  padding: 6px;
  font-size: 11px;
  color: var(--ink-400);
  text-align: center;
}
.gnews-detail-photo-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--ink-100);
  border-radius: var(--r-md);
  color: var(--ink-400);
  font-size: 13px;
  margin-bottom: 16px;
}
.gnews-detail-stats {
  border-top: 1px solid var(--border);
  padding-top: 12px;
  margin-top: 4px;
  margin-bottom: 12px;
}
.gnews-detail-stats-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.gnews-detail-stats-title {
  font-size: 11px;
  font-family: var(--fs-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-400);
}
.gnews-detail-stats-cells {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.gnews-meta-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.gnews-meta-label {
  font-size: 10px;
  color: var(--ink-400);
  font-family: var(--fs-mono);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.gnews-meta-value {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-900);
}
.gnews-detail-reactions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}
.gnews-reaction {
  font-size: 13px;
  padding: 3px 8px;
  background: var(--ink-100);
  border-radius: var(--r-pill);
  color: var(--ink-700);
}
.gnews-detail-feedback {
  border-top: 1px solid var(--border);
  padding-top: 12px;
  margin-top: 4px;
}
.gnews-detail-feedback-label {
  font-size: 11px;
  color: var(--ink-400);
  font-family: var(--fs-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: block;
  margin-bottom: 8px;
}
.gnews-detail-feedback-row {
  display: flex;
  gap: 6px;
}
.gnews-live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--success);
}
.gnews-live-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 3px var(--success-soft);
  animation: gnews-pulse 2s infinite;
}
@keyframes gnews-pulse {
  0%, 100% {
    box-shadow: 0 0 0 3px var(--success-soft);
  }
  50% {
    box-shadow: 0 0 0 5px transparent;
  }
}
.gnews-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 60px 32px;
  text-align: center;
}
.gnews-empty-mark {
  font-size: 36px;
}
.gnews-empty-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--ink-600);
}
.gnews-empty-desc {
  font-size: 13px;
  color: var(--ink-400);
  max-width: 240px;
}
.chat-rail-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--r-sm);
  background: transparent;
  border: 0;
  color: var(--ink-500);
}
.chat-rail-btn:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.chat-rail-btn.is-active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.chat-rail-dot {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #c89b2f;
  box-shadow: 0 0 0 2px var(--bg);
}
.chat-rail-spend {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  text-align: center;
  padding: 2px 4px;
  line-height: 1.2;
  word-break: break-all;
  max-width: 48px;
}
.chat-sidebar {
  width: 100%;
  height: 100%;
  background: var(--bg);
  display: flex;
  flex-direction: column;
  font-family: var(--fs-sans);
  color: var(--ink-900);
  overflow: hidden;
  min-width: 0;
  min-height: 0;
}
.chat-sidebar-full {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
}
.chat-head {
  height: var(--topbar-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 12px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  min-width: 0;
}
.chat-title {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
}
.chat-sub {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-top: 2px;
}
.chat-head-actions {
  display: flex;
  gap: 2px;
  flex-shrink: 0;
  align-items: center;
}
.chat-btn-ghost {
  padding: 4px 10px;
  font-size: 12px;
  background: var(--surface);
  color: var(--ink-700);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  font-family: var(--fs-mono);
}
.chat-btn-ghost:hover:not(:disabled) {
  background: var(--ink-50);
}
.chat-btn-ghost:disabled {
  opacity: 0.5;
  cursor: default;
}
.chat-btn-primary {
  padding: 6px 14px;
  font-size: 13px;
  background: var(--ink-900);
  color: var(--ink-0);
  border: 0;
  border-radius: var(--r-sm);
}
.chat-btn-primary:disabled {
  opacity: 0.45;
  cursor: default;
}
.chat-scroll {
  flex: 1;
  overflow-y: auto;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  overscroll-behavior: contain;
}
.chat-empty {
  font-size: 13px;
  color: var(--ink-500);
  padding: 12px;
  line-height: 1.55;
}
.chat-msg {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.chat-msg-role {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.chat-msg-text {
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-900);
  white-space: pre-wrap;
  word-wrap: break-word;
}
.chat-msg-user .chat-msg-text {
  background: var(--ink-50);
  padding: 8px 12px;
  border-radius: var(--r-sm);
  align-self: flex-end;
  max-width: 92%;
}
.chat-msg-user {
  align-items: flex-end;
}
.chat-err {
  padding: 8px 12px;
  font-size: 12px;
  background: var(--ink-50);
  border-left: 2px solid var(--ink-900);
  color: var(--ink-900);
}
.chat-input {
  border-top: 1px solid var(--border);
  padding: 10px 12px 12px;
  flex-shrink: 0;
}
.chat-input textarea {
  width: 100%;
  resize: none;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  font-family: var(--fs-sans);
  font-size: 13px;
  line-height: 1.5;
  background: var(--surface);
  color: var(--ink-900);
  outline: none;
}
.chat-input textarea:focus {
  border-color: var(--ink-700);
}
.chat-input-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 8px;
}
.chat-hint {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.chat-dots {
  display: inline-flex;
  gap: 4px;
  padding: 4px 0;
}
.chat-dots span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--ink-400);
  animation: chat-dot 1.2s infinite ease-in-out both;
}
.chat-dots span:nth-child(2) {
  animation-delay: 0.15s;
}
.chat-dots span:nth-child(3) {
  animation-delay: 0.3s;
}
@keyframes chat-dot {
  0%, 80%, 100% {
    opacity: 0.2;
    transform: scale(0.8);
  }
  40% {
    opacity: 1;
    transform: scale(1);
  }
}
.chat-thread {
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: opacity 0.2s ease;
}
.chat-thread.dim {
  opacity: 0.4;
}
.chat-thread.dim:hover {
  opacity: 0.7;
}
.chat-thread-sep {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 4px 0 -2px;
  position: relative;
}
.chat-thread-sep::before, .chat-thread-sep::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--border);
}
.chat-thread-sep span {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0 10px;
}
.chat-more-btn {
  align-self: center;
  margin: 0 auto 4px;
  padding: 6px 14px;
  font-family: var(--fs-mono);
  font-size: 11px;
  background: var(--surface);
  color: var(--ink-500);
  border: 1px dashed var(--border);
  border-radius: var(--r-pill);
  letter-spacing: 0.04em;
}
.chat-more-btn:hover:not(:disabled) {
  color: var(--ink-900);
  border-color: var(--ink-400);
}
.chat-more-btn:disabled {
  opacity: 0.5;
  cursor: default;
}
.chat-more-end {
  align-self: center;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 6px 0;
}
.chat-btn-ghost.active {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.chat-settings {
  border-bottom: 1px solid var(--border);
  background: var(--ink-50);
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-shrink: 0;
}
.chat-settings-row {
  display: grid;
  grid-template-columns: 68px 1fr;
  align-items: center;
  gap: 12px;
}
.chat-settings-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.chat-settings-seg {
  display: flex;
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  overflow: hidden;
  background: var(--surface);
}
.chat-seg-btn {
  flex: 1;
  padding: 5px 8px;
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.02em;
  background: transparent;
  color: var(--ink-700);
  border: 0;
  border-right: 1px solid var(--border);
  cursor: pointer;
  transition: background 0.1s ease;
}
.chat-seg-btn:last-child {
  border-right: 0;
}
.chat-seg-btn:hover:not(:disabled):not(.active) {
  background: var(--ink-100);
}
.chat-seg-btn.active {
  background: var(--ink-900);
  color: var(--ink-0);
  font-weight: 600;
}
.chat-seg-btn:disabled {
  opacity: 0.35;
  cursor: default;
}
.chat-settings-hint {
  font-size: 11px;
  color: var(--ink-400);
  font-family: var(--fs-sans);
  font-style: italic;
}
.launch-view-switcher {
  display: flex;
  gap: 4px;
  margin: 20px 0 16px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0;
}
.launch-view-tab {
  background: none;
  border: 0;
  border-bottom: 1.5px solid transparent;
  margin-bottom: -1px;
  padding: 10px 16px;
  font-family: var(--fs-sans);
  font-size: 14px;
  color: var(--ink-500);
  cursor: pointer;
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.launch-view-tab:hover {
  color: var(--ink-900);
}
.launch-view-tab.active {
  color: var(--ink-900);
  font-weight: 500;
  border-bottom-color: var(--ink-900);
}
.chat-view-tab {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 500;
  padding: 4px 8px 4px 7px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--r-pill);
  color: var(--ink-500);
  cursor: pointer;
  white-space: nowrap;
  line-height: 1.2;
}
.chat-view-tab:hover {
  color: var(--ink-900);
  background: var(--ink-50);
}
.chat-view-tab.is-active {
  background: var(--ink-900);
  border-color: var(--ink-900);
  color: var(--ink-0);
}
.chat-view-tab.is-active:hover {
  background: var(--ink-900);
  color: var(--ink-0);
}
.chat-view-tab:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
.chat-view-tab svg {
  flex-shrink: 0;
}
.chat-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: var(--r-sm);
  color: var(--ink-500);
  cursor: pointer;
}
.chat-icon-btn:hover:not(:disabled) {
  background: var(--ink-100);
  color: var(--ink-900);
}
.chat-icon-btn.is-active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.chat-icon-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
.tasks-panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}
.chat-input {
  position: relative;
}
.chat-mention-item {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 6px 12px;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.chat-mention-item:hover, .chat-mention-item.active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.chat-mention-item.active .chat-mention-key {
  color: var(--ink-0);
}
.chat-mention-key {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-600);
  flex-shrink: 0;
}
.chat-mention-title {
  font-size: 12px;
  color: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chat-mention-hint {
  padding: 4px 12px;
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  border-top: 1px solid var(--border);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.chat-msg-segments {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.chat-md {
  white-space: normal;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-900);
}
.chat-md > :first-child {
  margin-top: 0;
}
.chat-md > :last-child {
  margin-bottom: 0;
}
.chat-md p {
  margin: 0 0 8px;
}
.chat-md ul, .chat-md ol {
  margin: 0 0 8px;
  padding-left: 20px;
}
.chat-md li {
  margin: 2px 0;
}
.chat-md li > ul, .chat-md li > ol {
  margin: 2px 0;
}
.chat-md strong {
  font-weight: 650;
}
.chat-md em {
  font-style: italic;
}
.chat-md a {
  color: var(--ink-900);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.chat-md code {
  font-family: var(--fs-mono);
  font-size: 0.85em;
  background: var(--ink-100);
  padding: 1px 4px;
  border-radius: var(--r-xs);
}
.chat-md pre {
  background: var(--ink-100);
  border-radius: var(--r-sm);
  padding: 8px 10px;
  overflow-x: auto;
  margin: 0 0 8px;
}
.chat-md pre code {
  background: none;
  padding: 0;
  font-size: 12px;
}
.chat-md h1, .chat-md h2, .chat-md h3, .chat-md h4 {
  font-size: 13px;
  font-weight: 650;
  margin: 12px 0 4px;
}
.chat-md h1:first-child, .chat-md h2:first-child, .chat-md h3:first-child, .chat-md h4:first-child {
  margin-top: 0;
}
.chat-md blockquote {
  margin: 0 0 8px;
  padding-left: 10px;
  border-left: 2px solid var(--ink-200);
  color: var(--ink-500);
}
.chat-md hr {
  border: none;
  border-top: 1px solid var(--border);
  margin: 10px 0;
}
.chat-md table {
  border-collapse: collapse;
  font-size: 12px;
  margin: 0 0 8px;
}
.chat-md th, .chat-md td {
  border: 1px solid var(--border);
  padding: 3px 7px;
  text-align: left;
}
.chat-seg {
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--ink-50);
  overflow: hidden;
}
.chat-seg-head {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 5px 8px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.03em;
  color: var(--ink-600);
  text-align: left;
}
.chat-seg-head:hover {
  color: var(--ink-900);
}
.chat-seg-label {
  flex: 1;
}
.chat-seg-count {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-0);
  background: var(--ink-500);
  border-radius: 999px;
  padding: 0 5px;
  min-width: 14px;
  text-align: center;
}
.chat-seg-chev {
  color: var(--ink-400);
  transition: transform 0.12s ease;
}
.chat-seg.open .chat-seg-chev {
  transform: rotate(90deg);
}
.chat-seg-body {
  padding: 6px 8px 8px;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.chat-seg-think-body {
  font-size: 12px;
  color: var(--ink-500);
}
.chat-seg-think-body .chat-md {
  font-size: 12px;
  color: var(--ink-500);
}
.chat-seg-spin {
  animation: chat-seg-spin 1.4s linear infinite;
}
@keyframes chat-seg-spin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .chat-seg-spin {
    animation: none;
  }
}
.chat-stop-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.chat-tool-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-family: var(--fs-mono);
  font-size: 10px;
  line-height: 1.4;
  color: var(--ink-500);
  min-width: 0;
}
.chat-tool-mark {
  flex: none;
  width: 9px;
  text-align: center;
}
.chat-tool-row.is-running .chat-tool-mark {
  color: var(--ink-400);
}
.chat-tool-row.is-ok .chat-tool-mark {
  color: var(--ink-600);
}
.chat-tool-name {
  color: var(--ink-700);
  flex: none;
}
.chat-tool-note {
  color: var(--ink-400);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chat-tool-row.is-error, .chat-tool-row.is-error .chat-tool-mark, .chat-tool-row.is-error .chat-tool-name {
  color: #8d4040;
}
.chat-perm-zone {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px 12px;
  background: #fff9e8;
  border-top: 1px solid #d8b94a;
  flex-shrink: 0;
  max-height: 260px;
  overflow-y: auto;
}
.chat-perm-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid #d8b94a;
  border-radius: var(--r-sm);
}
.chat-perm-head {
  display: flex;
  align-items: center;
  gap: 8px;
}
.chat-perm-mad {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-700);
  font-weight: 600;
}
.chat-perm-tool {
  font-family: var(--fs-mono);
  font-size: 11px;
  background: var(--ink-900);
  color: var(--ink-0);
  padding: 1px 6px;
  border-radius: var(--r-xs);
}
.chat-perm-summary {
  font-size: 12px;
  line-height: 1.5;
  color: var(--ink-900);
  white-space: pre-wrap;
  font-family: var(--fs-sans);
  background: var(--ink-50);
  padding: 6px 10px;
  border-radius: var(--r-xs);
  max-height: 160px;
  overflow-y: auto;
}
.chat-perm-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.chat-perm-actions .chat-btn-primary, .chat-perm-actions .chat-btn-ghost {
  font-size: 11px;
  padding: 4px 10px;
}
.kanban-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(3px);
  z-index: 70;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
}
html[data-right="rail"] .chat-sidebar-full {
  display: none;
}
html[data-right="expanded"] .chat-sidebar-rail {
  display: none;
}
.chat-sidebar-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  padding: 0;
  gap: 0;
}
.tasks-quickadd {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}
.tasks-quickadd-icon {
  color: var(--ink-400);
  flex-shrink: 0;
}
.tasks-quickadd-input {
  flex: 1;
  border: 0;
  outline: none;
  font-size: 13px;
  font-family: inherit;
  background: transparent;
}
.tasks-filters {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--ink-50);
  flex-wrap: wrap;
}
.tasks-filters-sep {
  flex: 1;
}
.tasks-chip {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  background: transparent;
  color: var(--ink-500);
  cursor: pointer;
}
.tasks-chip:hover {
  color: var(--ink-900);
}
.tasks-chip.is-active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.tasks-archive-toggle {
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: var(--fs-mono);
  font-size: 10px;
  text-transform: uppercase;
  color: var(--ink-500);
  cursor: pointer;
}
.tasks-archive-toggle input {
  margin: 0;
  cursor: pointer;
}
.tasks-tabs {
  display: flex;
  gap: 2px;
  padding: 6px 8px 0;
  border-bottom: 1px solid var(--border);
  overflow-x: auto;
}
.tasks-tab {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--fs-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-bottom: 0;
  border-radius: var(--r-sm) var(--r-sm) 0 0;
  background: transparent;
  color: var(--ink-500);
  cursor: pointer;
  white-space: nowrap;
}
.tasks-tab:hover {
  color: var(--ink-900);
}
.tasks-tab.is-active {
  background: var(--surface);
  border-color: var(--border);
  color: var(--ink-900);
  position: relative;
  z-index: 1;
}
.tasks-tab.is-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: var(--surface);
}
.tasks-tab-count {
  font-size: 9px;
  padding: 1px 5px;
  border-radius: var(--r-pill);
  background: var(--ink-100);
  color: var(--ink-700);
}
.tasks-tab.is-active .tasks-tab-count {
  background: var(--ink-900);
  color: var(--ink-0);
}
.tasks-err {
  margin: 8px 12px;
  padding: 6px 10px;
  background: rgba(201, 50, 50, 0.08);
  border-left: 2px solid #c93232;
  font-size: 11px;
  color: #8b1f1f;
}
.tasks-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tasks-empty {
  padding: 32px 16px;
  text-align: center;
  font-size: 12px;
  color: var(--ink-400);
}
.task-card {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  transition: border-color 0.12s ease;
}
.task-card:hover {
  border-color: var(--ink-300, var(--border));
}
.task-card-done {
  opacity: 0.55;
}
.task-card-done .task-title {
  text-decoration: line-through;
  color: var(--ink-500);
}
.task-card-arch {
  opacity: 0.45;
}
.task-check {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1.5px solid var(--ink-400);
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-0);
  padding: 0;
  margin-top: 1px;
  transition: background 0.12s ease, border-color 0.12s ease;
}
.task-check:hover {
  border-color: var(--ink-900);
}
.task-check.is-checked {
  background: var(--ink-900);
  border-color: var(--ink-900);
}
.task-main {
  flex: 1;
  min-width: 0;
}
.task-title {
  background: transparent;
  border: 0;
  padding: 0;
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  text-align: left;
  cursor: text;
  display: block;
  width: 100%;
  word-break: break-word;
  line-height: 1.35;
}
.task-title:hover {
  color: var(--ink-900);
}
.task-title-input {
  width: 100%;
  font-size: 13px;
  font-weight: 500;
  border: 1px solid var(--ink-900);
  border-radius: var(--r-xs);
  padding: 3px 6px;
  background: var(--ink-0);
  font-family: inherit;
  outline: none;
}
.task-meta-row {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  flex-wrap: wrap;
}
.task-expand-btn {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  background: transparent;
  border: 0;
  padding: 1px 4px;
  font-family: var(--fs-mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-400);
  cursor: pointer;
  border-radius: var(--r-xs);
}
.task-expand-btn:hover {
  color: var(--ink-900);
  background: var(--ink-50);
}
.task-due, .task-link-badge, .task-mad-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-family: var(--fs-mono);
  font-size: 9px;
  padding: 1px 5px;
  border-radius: var(--r-pill);
  background: var(--ink-50);
  color: var(--ink-700);
  border: 1px solid var(--border);
  text-decoration: none;
}
.task-due.task-due-today {
  background: #c89b2f;
  color: #fff;
  border-color: #c89b2f;
}
.task-due.task-due-past {
  background: #c93232;
  color: #fff;
  border-color: #c93232;
}
.task-due.task-due-future {
  background: var(--ink-50);
  color: var(--ink-700);
}
.task-link-badge:hover {
  background: var(--ink-100);
}
.task-link-more {
  font-family: var(--fs-mono);
  font-size: 9px;
  padding: 0 4px;
  background: var(--ink-100);
  color: var(--ink-700);
  border-radius: var(--r-pill);
  margin-left: 2px;
}
.task-mad-badge {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.astro-popover {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.16), 0 4px 12px rgba(0, 0, 0, 0.06);
  font-family: var(--fs-sans);
  color: var(--ink-900);
  animation: astro-popover-in 0.12s ease-out;
}
@keyframes astro-popover-in {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.cell-ctx-menu {
  min-width: 200px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.16), 0 4px 12px rgba(0, 0, 0, 0.06);
  padding: 4px;
  font-family: var(--fs-sans);
  color: var(--ink-900);
  animation: astro-popover-in 0.1s ease-out;
  z-index: 250;
}
.tm-modal {
  width: min(840px, 100%);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg, 12px);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.18), 0 8px 24px rgba(0, 0, 0, 0.08);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: calc(100vh - 100px);
}
.tm-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.tm-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: var(--r-sm);
  color: var(--ink-500);
  cursor: pointer;
}
.tm-icon-btn:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.tm-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 0;
  min-height: 0;
  flex: 1;
}
@media (max-width: 720px) {
  .tm-body {
    grid-template-columns: 1fr;
  }
}
.tm-main {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 20px 24px;
  min-width: 0;
  overflow-y: auto;
}
.tm-title {
  width: 100%;
  font-family: inherit;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.25;
  color: var(--ink-900);
  border: 0;
  background: transparent;
  resize: none;
  outline: none;
  padding: 4px 0;
  letter-spacing: -0.01em;
}
.tm-title::placeholder {
  color: var(--ink-300, var(--ink-400));
}
.tm-desc {
  width: 100%;
  min-height: 160px;
  font-family: inherit;
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-700);
  border: 0;
  background: transparent;
  resize: vertical;
  outline: none;
  padding: 4px 0;
}
.tm-desc::placeholder {
  color: var(--ink-300, var(--ink-400));
}
.tm-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px 22px;
  background: var(--ink-50);
  border-left: 1px solid var(--border);
  overflow-y: auto;
}
@media (max-width: 720px) {
  .tm-side {
    border-left: 0;
    border-top: 1px solid var(--border);
  }
}
.tm-side-row {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.tm-side-label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.tm-side-control {
  display: flex;
  align-items: center;
  gap: 4px;
}
.tm-side-input {
  flex: 1;
  width: 100%;
  font-family: inherit;
  font-size: 13px;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink-900);
  outline: none;
}
.tm-side-input:focus {
  border-color: var(--ink-700);
}
.tm-side-clear {
  border: 0;
  background: transparent;
  color: var(--ink-400);
  cursor: pointer;
  padding: 0 6px;
  font-size: 16px;
  line-height: 1;
}
.tm-side-clear:hover {
  color: var(--ink-900);
}
.tm-side-value {
  font-size: 13px;
  color: var(--ink-900);
}
.tm-side-sub {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.tm-foot {
  display: flex;
  align-items: center;
  padding: 10px 18px;
  border-top: 1px solid var(--border);
  background: var(--ink-50);
  flex-shrink: 0;
}
.tm-foot-danger {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: transparent;
  border: 0;
  color: var(--ink-400);
  font-size: 12px;
  padding: 4px 8px;
  border-radius: var(--r-sm);
  cursor: pointer;
}
.tm-foot-danger:hover {
  color: #c93232;
  background: rgba(201, 50, 50, 0.07);
}
.tm-foot-hint {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.tm-status {
  position: relative;
}
.tm-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: var(--r-pill);
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-700);
  cursor: pointer;
}
.tm-status-pill:hover {
  border-color: var(--ink-900);
}
.tm-status-backlog {
  color: var(--ink-700);
}
.tm-status-in_progress {
  color: #8a6a14;
  background: rgba(200, 155, 47, 0.1);
  border-color: rgba(200, 155, 47, 0.3);
}
.tm-status-done {
  color: #4a6b3c;
  background: rgba(107, 142, 90, 0.12);
  border-color: rgba(107, 142, 90, 0.3);
}
.tm-status-archive {
  color: var(--ink-500);
  background: var(--ink-100);
}
.tm-status-popover {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 10;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  padding: 4px;
  min-width: 160px;
}
.tm-status-option {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 6px 10px;
  border: 0;
  background: transparent;
  font-size: 13px;
  color: var(--ink-700);
  text-align: left;
  border-radius: var(--r-xs);
  cursor: pointer;
}
.tm-status-option:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.tm-status-option.is-active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.tm-cellpicker {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tm-cellchips {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tm-cellchip {
  display: flex;
  align-items: stretch;
  gap: 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  overflow: hidden;
  transition: border-color 0.12s ease;
}
.tm-cellchip:hover {
  border-color: var(--ink-700);
}
.tm-cellchip-main {
  flex: 1;
  min-width: 0;
  padding: 5px 8px;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.tm-cellchip-title {
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tm-cellchip-key {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.02em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tm-cellchip-remove {
  border: 0;
  border-left: 1px solid var(--border);
  background: transparent;
  color: var(--ink-400);
  cursor: pointer;
  padding: 0 8px;
  font-size: 16px;
  line-height: 1;
}
.tm-cellchip-remove:hover {
  background: rgba(201, 50, 50, 0.08);
  color: #c93232;
}
.tm-cellpicker-trigger {
  font-size: 11px;
  font-family: var(--fs-mono);
  letter-spacing: 0.02em;
  background: transparent;
  border: 1px dashed var(--border);
  color: var(--ink-500);
  padding: 5px 8px;
  border-radius: var(--r-sm);
  cursor: pointer;
  text-align: left;
}
.tm-cellpicker-trigger:hover {
  border-style: solid;
  border-color: var(--ink-700);
  color: var(--ink-900);
}
.tm-cellpicker-popover {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.tm-cellpicker-search {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  color: var(--ink-400);
}
.tm-cellpicker-search input {
  flex: 1;
  border: 0;
  outline: none;
  background: transparent;
  font-size: 13px;
  font-family: inherit;
}
.tm-cellpicker-list {
  max-height: 280px;
  overflow-y: auto;
  padding: 4px;
}
.tm-cellpicker-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  padding: 6px 10px;
  background: transparent;
  border: 0;
  text-align: left;
  cursor: pointer;
  border-radius: var(--r-xs);
}
.tm-cellpicker-item:hover {
  background: var(--ink-100);
}
.tm-cellpicker-item.is-active {
  background: var(--ink-900);
  color: var(--ink-0);
}
.tm-cellpicker-item.is-active .tm-cellpicker-item-key {
  color: rgba(255, 255, 255, 0.6);
}
.tm-cellpicker-item-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
}
.tm-cellpicker-item.is-active .tm-cellpicker-item-title {
  color: var(--ink-0);
}
.tm-cellpicker-item-key {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
}
.tm-cellpicker-empty {
  padding: 16px;
  font-size: 12px;
  color: var(--ink-400);
  text-align: center;
}
.kanban-modal {
  width: 80vw;
  height: 80vh;
  max-width: 1600px;
  background: var(--surface);
  border-radius: var(--r-md);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.3);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  font-family: var(--fs-sans);
}
.kanban-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 24px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.kanban-title-block {
  display: flex;
  align-items: center;
  gap: 12px;
}
.kanban-title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--ink-900);
}
.kanban-meta {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.02em;
  margin-top: 2px;
}
.kanban-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.kanban-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-600);
  cursor: pointer;
}
.kanban-err {
  padding: 8px 24px;
  background: #f8e8e8;
  border-bottom: 1px solid #d8a8a8;
  color: #5a2c2c;
  font-size: 13px;
}
.kanban-board {
  flex: 1;
  display: grid;
  grid-auto-columns: minmax(220px, 1fr);
  grid-auto-flow: column;
  gap: 12px;
  padding: 16px 24px;
  overflow-x: auto;
  overflow-y: hidden;
}
.kanban-col {
  display: flex;
  flex-direction: column;
  background: var(--ink-50);
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  min-height: 0;
  transition: background 0.12s ease;
}
.kanban-col.is-over {
  background: var(--ink-100, #eee);
  border-color: var(--ink-700);
}
.kanban-col-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.kanban-col-stripe {
  width: 6px;
  height: 16px;
  border-radius: 3px;
  background: var(--col-color, var(--ink-300));
}
.kanban-col-name {
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-700);
  font-weight: 600;
  flex: 1;
}
.kanban-col-count {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  background: var(--surface);
  padding: 1px 8px;
  border-radius: var(--r-pill);
  border: 1px solid var(--border);
}
.kanban-col-body {
  flex: 1;
  overflow-y: auto;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.kanban-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--col-color, var(--ink-300));
  border-radius: var(--r-sm);
  padding: 8px 12px;
  cursor: grab;
  position: relative;
  transition: transform 0.1s ease, box-shadow 0.1s ease;
  touch-action: none;
  user-select: none;
}
.kanban-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.kanban-card-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.35;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.kanban-card-desc {
  font-size: 12px;
  color: var(--ink-500);
  margin-top: 4px;
  line-height: 1.4;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.kanban-card-mad {
  position: absolute;
  top: 6px;
  right: 6px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-family: var(--fs-mono);
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: var(--ink-900);
  color: var(--ink-0);
  padding: 1px 5px;
  border-radius: 3px;
}
.kanban-card-overlay {
  cursor: grabbing !important;
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.25);
  opacity: 0.92;
  transform: rotate(2deg);
}
.kanban-card-editing {
  cursor: default;
  border-color: var(--ink-700);
  background: var(--surface);
}
.kanban-card-adding {
  cursor: text;
  border-color: var(--ink-700);
}
.kanban-card-edit-title {
  width: 100%;
  font-size: 13px;
  font-weight: 500;
  border: 0;
  background: transparent;
  outline: none;
  padding: 2px 0;
  font-family: inherit;
}
.kanban-card-edit-desc {
  width: 100%;
  font-size: 12px;
  border: 0;
  background: var(--ink-50);
  outline: none;
  padding: 6px 8px;
  border-radius: var(--r-xs);
  margin-top: 6px;
  font-family: inherit;
  resize: vertical;
}
.kanban-card-move {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}
.kanban-card-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
}
.kanban-mini-btn {
  font-family: var(--fs-mono);
  font-size: 10px;
  padding: 2px 8px;
  background: var(--surface);
  color: var(--ink-700);
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  cursor: pointer;
}
.kanban-mini-btn:hover {
  background: var(--ink-50);
}
.kanban-mini-danger {
  color: #8d4040;
  border-color: #d8a8a8;
}
.kanban-mini-danger:hover {
  background: #f8e8e8;
}
.kanban-add-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  padding: 6px;
  background: transparent;
  border: 1px dashed var(--border);
  border-radius: var(--r-sm);
  color: var(--ink-500);
  font-family: var(--fs-sans);
  font-size: 12px;
  cursor: pointer;
  margin-top: 4px;
}
.kanban-add-btn:hover {
  background: var(--ink-50);
  color: var(--ink-900);
  border-color: var(--ink-700);
}
.cells-tabs {
  display: flex;
  gap: 6px;
}
.cells-tab {
  padding: 6px 14px;
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--surface);
  color: var(--ink-500);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  cursor: pointer;
}
.cells-tab:hover:not(.active) {
  color: var(--ink-700);
  background: var(--ink-50);
}
.cells-tab.active {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.cells-tab-count {
  margin-left: 6px;
  font-size: 10px;
  opacity: 0.7;
}
.cells-tools {
  display: flex;
  align-items: center;
  gap: 16px;
}
.cells-legend {
  display: flex;
  gap: 12px;
  align-items: center;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.cells-legend-item {
  display: flex;
  align-items: center;
  gap: 5px;
}
.cells-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.cells-filter-chip {
  padding: 3px 10px;
  font-family: var(--fs-mono);
  font-size: 11px;
  background: var(--surface);
  color: var(--ink-600);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  cursor: pointer;
  transition: all 0.1s ease;
}
.cells-filter-chip:hover:not(.active) {
  background: var(--ink-50);
  color: var(--ink-900);
}
.cells-filter-chip.active {
  background: var(--ink-900);
  color: var(--ink-0);
  border-color: var(--ink-900);
}
.cells-empty {
  padding: 48px 24px;
  text-align: center;
  color: var(--ink-500);
  font-size: 14px;
  background: var(--ink-50);
  border: 1px dashed var(--border);
  border-radius: var(--r-md);
}
.cells-grid-root {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 24px;
}
.cells-grid-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}
.cells-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-auto-flow: row dense;
  gap: 10px;
}
.cells-grid--archive {
  grid-auto-flow: row;
}
.cells-grid--archive .cell-card {
  grid-column: span 1 !important;
  grid-row: span 1 !important;
}
@media (max-width: 1280px) {
  .cells-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 1024px) {
  .cells-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 768px) {
  .cells-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 480px) {
  .cells-grid {
    grid-template-columns: 1fr;
  }
}
.chat-view-tabs {
  display: flex;
  gap: 2px;
  flex-shrink: 0;
  min-width: 0;
}
.cell-ctx-head {
  padding: 6px 8px 8px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.cell-ctx-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-900);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cell-ctx-key {
  font-size: 10px;
  font-family: var(--fs-mono, ui-monospace, monospace);
  color: var(--ink-500);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cell-ctx-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 6px 8px;
  border: 0;
  background: transparent;
  border-radius: var(--r-sm);
  font-family: inherit;
  font-size: 13px;
  color: var(--ink-900);
  text-align: left;
  cursor: pointer;
}
.cell-ctx-item:hover, .cell-ctx-item:focus-visible, .cell-ctx-item[data-highlighted] {
  background: var(--ink-50, rgba(0,0,0,0.05));
  outline: none;
}
.cell-ctx-item svg {
  color: var(--ink-500);
  flex-shrink: 0;
}
.cell-ctx-menu[data-state="open"] {
  animation: astro-popover-in 0.1s ease-out;
}
.dp-root {
  display: flex;
  flex-direction: column;
}
.dp-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--surface);
  font-family: inherit;
  font-size: 13px;
  color: var(--ink-500);
  cursor: pointer;
  text-align: left;
}
.cells-roadmap-toggle:hover {
  border-color: var(--ink-700);
  background: var(--ink-50);
}
.cells-roadmap-toggle.is-open {
  background: var(--ink-900);
  border-color: var(--ink-900);
  color: var(--ink-0);
}
.cells-roadmap-count {
  font-family: var(--fs-mono);
  font-size: 9px;
  padding: 1px 6px;
  border-radius: var(--r-pill);
  background: var(--ink-100);
  color: var(--ink-900);
}
.cells-roadmap-toggle.is-open .cells-roadmap-count {
  background: var(--ink-0);
  color: var(--ink-900);
}
.cells-roadmap-panel {
  margin: 8px 0 12px;
  padding: 12px 14px;
  background: var(--ink-50);
  border: 1px dashed var(--border);
  border-radius: var(--r-md);
}
.cells-roadmap-head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 8px;
}
.cells-roadmap-list {
  display: grid;
  gap: 8px;
}
.cells-roadmap-item {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 10px 12px;
}
.cells-roadmap-item-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.cells-roadmap-icon {
  display: inline-flex;
  align-items: center;
}
.cells-roadmap-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
}
.cells-roadmap-key {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
}
.cells-roadmap-desc {
  margin-top: 6px;
  font-size: 12px;
  color: var(--ink-600);
  line-height: 1.45;
}
.cells-roadmap-actions {
  margin-top: 8px;
  display: flex;
  justify-content: flex-end;
}
.cells-roadmap-add {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  font-size: 11px;
}
.cells-roadmap-add:disabled {
  opacity: 0.6;
  cursor: progress;
}
.cells-empty-start {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 24px 0;
}
.cells-empty-title {
  font-size: 16px;
  font-weight: 500;
  color: var(--ink-900);
}
.cells-empty-sub {
  font-size: 12px;
  color: var(--ink-500);
  text-align: center;
  max-width: 460px;
  line-height: 1.5;
}
.cells-empty-cta {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.cells-empty-seed-all {
  margin-top: 16px;
  font-size: 10px;
  opacity: 0.55;
  padding: 4px 10px;
}
.cells-empty-seed-all:hover {
  opacity: 1;
}
.cell-card {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 8px;
  min-height: 132px;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.12s ease, box-shadow 0.12s ease, transform 0.12s ease, opacity 0.14s ease;
  font-family: var(--fs-sans);
  color: var(--ink-900);
  user-select: none;
}
.cell-card:not(.cell-card--pinned) {
  touch-action: none;
}
.cell-card:hover {
  border-color: var(--ink-700);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}
.cell-card--pinned {
  background: var(--ink-50);
  border-style: solid;
  border-color: var(--brand, var(--ink-500));
  box-shadow: 0 0 0 1px var(--brand);
  @supports (color: color-mix(in lab, red, red)) {
    box-shadow: 0 0 0 1px color-mix(in oklch, var(--brand) 25%, transparent);
  }
}
.cell-card--draft:not(.cell-card--has-cover) {
  background-image: repeating-linear-gradient( 135deg, var(--surface) 0, var(--surface) 12px, var(--ink-100) 12px, var(--ink-100) 24px );
  background-size: calc(24px * 1.41421356) calc(24px * 1.41421356);
  animation: cell-draft-drift 15s linear infinite;
}
@keyframes cell-draft-drift {
  to {
    background-position: calc(24px * 1.41421356) calc(24px * 1.41421356);
  }
}
@media (prefers-reduced-motion: reduce) {
  .cell-card--draft:not(.cell-card--has-cover) {
    animation: none;
  }
}
.cell-card--empty {
  opacity: 0.3;
}
.cell-card--empty:hover, .cell-card--empty:focus-visible {
  opacity: 1;
}
.cell-card-overlay.cell-card--empty {
  opacity: 1;
}
.cell-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.cell-card-grip {
  color: var(--ink-300);
  display: inline-flex;
  align-items: center;
}
.cell-card-section-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin: -4px;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.12s ease, transform 0.12s ease;
}
.cell-card-section-icon:hover {
  background: var(--ink-50, rgba(0,0,0,0.06));
  transform: scale(1.05);
}
.cell-card-cover {
  background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), var(--cell-cover);
  background-size: cover;
  background-position: center;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
.cell-cover-spin {
  animation: cell-doc-spin 0.8s linear infinite;
}
.cell-card--has-cover {
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
  background: #15151b;
  border-color: rgba(255, 255, 255, 0.10);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 6px 22px rgba(0, 0, 0, 0.40);
  display: flex;
  gap: 0;
  padding: 0;
}
.cell-card--has-cover:hover {
  border-color: rgba(255, 255, 255, 0.28);
  transform: translateY(-2px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.11), 0 12px 34px rgba(0, 0, 0, 0.55);
}
.cell-card--has-cover .cell-card-name {
  color: #fff;
  text-shadow: none;
}
.cell-card--has-cover .cell-card-key, .cell-card--has-cover .cell-card-category, .cell-card--has-cover .cell-card-updated, .cell-card--has-cover .cell-card-meta-item, .cell-card--has-cover .cell-card-meta-label, .cell-card--has-cover .cell-status-line, .cell-card--has-cover .cell-status-line-label, .cell-card--has-cover .cell-status-line-time, .cell-card--has-cover .cell-history-item, .cell-card--has-cover .cell-history-label, .cell-card--has-cover .cell-history-time, .cell-card--has-cover .cell-card-links-count, .cell-card--has-cover .cell-card-link-item {
  color: rgba(255, 255, 255, 0.74);
}
.cell-card--has-cover .cell-card-empty-hint {
  color: rgba(255, 255, 255, 0.5);
}
.cell-card--has-cover .cell-card-grip {
  color: #fff;
}
.cell-card--has-cover .cell-card-section-icon svg {
  color: #fff;
}
.cell-card--has-cover .cell-card-section-icon:hover {
  background: rgba(255, 255, 255, 0.16);
}
.cell-card--has-cover .cell-card-link-item {
  background: rgba(255, 255, 255, 0.14);
}
.cell-card--has-cover .cell-card-status-history {
  border-left-color: rgba(255, 255, 255, 0.22);
}
.cell-card--has-cover .cell-history-dot {
  background: rgba(255, 255, 255, 0.3);
}
.cell-card--has-cover .cell-history-item--done .cell-history-dot {
  background: #fff;
}
.cell-card--has-cover .cell-dot-empty {
  border-color: rgba(255, 255, 255, 0.45);
  color: rgba(255, 255, 255, 0.75);
}
.cell-card-inner {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 8px;
  padding: 10px 12px;
}
.cell-card--media-fill .cell-card-cover {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.cell-card--media-left {
  flex-direction: row;
}
.cell-card--media-right {
  flex-direction: row-reverse;
}
.cell-card--media-left .cell-card-cover, .cell-card--media-right .cell-card-cover {
  flex: 0 0 40%;
  align-self: stretch;
}
.cell-card--media-top {
  flex-direction: column;
}
.cell-card--media-top .cell-card-cover {
  flex: 0 0 44%;
  width: 100%;
}
.cell-card-body {
  min-width: 0;
}
.cell-card-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.3;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.cell-card-key {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.02em;
  margin-top: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cell-card-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-900);
  line-height: 1.3;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow-wrap: anywhere;
}
.cell-card-category {
  margin-top: 4px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-400);
}
.cell-card-name--lg {
  font-size: 16px;
}
.cell-card-name--hero {
  font-size: 20px;
  font-weight: 700;
}
.cell-card-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.cell-card-updated {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.02em;
}
.cell-card-pills {
  display: flex;
  gap: 4px;
}
.cell-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1px solid transparent;
}
.cell-dot-letter {
  font-family: var(--fs-mono);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: lowercase;
}
.cell-dot-empty {
  background: transparent;
  border-color: var(--ink-200, var(--border));
  color: var(--ink-300);
}
.cell-dot-partial {
  background: #f5d76e;
  color: #6b5a00;
}
.cell-dot-ready {
  background: #6b8e5a;
  color: #fff;
}
.cell-doc-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(2px);
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
}
.cell-doc-modal {
  background: var(--surface);
  border-radius: var(--r-md);
  width: min(960px, 100%);
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
  overflow: hidden;
  font-family: var(--fs-sans);
  color: var(--ink-900);
}
.cell-doc-loading {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 60px;
  color: var(--ink-500);
  justify-content: center;
}
.cell-doc-spin {
  animation: cell-doc-spin 0.9s linear infinite;
}
@keyframes cell-doc-spin {
  to {
    transform: rotate(360deg);
  }
}
.cell-doc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.cell-doc-head-left {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.cell-doc-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--r-sm);
  background: var(--ink-50);
}
.cell-doc-title {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.01em;
}
.cell-doc-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  letter-spacing: 0.02em;
  margin-top: 4px;
}
.cell-doc-key {
  color: var(--ink-600);
}
.cell-doc-sep {
  color: var(--ink-300);
}
.cell-doc-head-right {
  display: flex;
  align-items: center;
  gap: 8px;
}
.cell-doc-close {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  color: var(--ink-500);
  cursor: pointer;
  border-radius: var(--r-sm);
}
.cell-doc-close:hover {
  background: var(--ink-50);
  color: var(--ink-900);
}
.cell-doc-save-saving {
  color: var(--ink-500);
}
.cell-doc-save-dirty {
  color: #a8732a;
}
.cell-doc-save-ok {
  color: #4a7a3a;
}
.cell-doc-save-err {
  color: #8d4040;
}
.cell-doc-save-idle {
  color: var(--ink-400);
}
.cell-doc-err {
  margin: 0 24px;
  margin-top: 12px;
  padding: 8px 12px;
  background: #f8e8e8;
  border-left: 3px solid #8d4040;
  color: #5a2c2c;
  font-size: 13px;
}
.cell-doc-body {
  flex: 1;
  overflow-y: auto;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.cell-doc-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cell-doc-section-title {
  font-family: var(--fs-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-700);
}
.cell-doc-section-sub {
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--ink-400);
  font-size: 11px;
  margin-left: 8px;
}
.cell-doc-section-content {
  font-family: var(--fs-sans);
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink-600);
  white-space: pre-wrap;
}
.cell-doc-description {
  background: var(--ink-50);
  padding: 12px 14px;
  border-radius: var(--r-sm);
  border-left: 3px solid var(--ink-300);
}
.cell-doc-description .cell-doc-section-title {
  color: var(--ink-500);
}
.cell-doc-textarea {
  width: 100%;
  min-height: 220px;
  resize: vertical;
  padding: 14px 16px;
  font-family: var(--fs-serif);
  font-size: 15px;
  line-height: 1.6;
  background: var(--surface);
  color: var(--ink-900);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  outline: none;
}
.cell-doc-textarea:focus {
  border-color: var(--ink-700);
}
.cell-doc-empty {
  padding: 16px;
  font-size: 13px;
  color: var(--ink-500);
  background: var(--ink-50);
  border: 1px dashed var(--border);
  border-radius: var(--r-sm);
  text-align: center;
}
.cell-doc-empty-thin {
  padding: 10px 14px;
  text-align: left;
  font-size: 12px;
}
.cell-doc-drafts {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cell-draft-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  padding: 10px 14px;
  font-family: var(--fs-sans);
}
.cell-draft-card.is-promoted {
  border-left: 3px solid #6b8e5a;
}
.cell-draft-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.cell-draft-source {
  font-family: var(--fs-mono);
  font-size: 10px;
  background: var(--ink-900);
  color: var(--ink-0);
  padding: 2px 8px;
  border-radius: var(--r-pill);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.cell-draft-date {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
}
.cell-draft-flag {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: #4a7a3a;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.cell-draft-actions {
  margin-left: auto;
  display: flex;
  gap: 6px;
}
.cell-draft-note {
  font-size: 12px;
  color: var(--ink-500);
  font-style: italic;
  margin-bottom: 4px;
}
.cell-draft-content {
  font-family: var(--fs-serif);
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink-700);
  white-space: pre-wrap;
  max-height: 220px;
  overflow-y: auto;
  background: var(--ink-50);
  padding: 10px 12px;
  border-radius: var(--r-xs);
}
.cell-doc-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.cell-doc-link-chip {
  display: inline-flex;
  align-items: stretch;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  overflow: hidden;
  font-family: var(--fs-sans);
  font-size: 12px;
}
.cell-doc-link-chip.cell-doc-link-broken {
  background: #f8e8e8;
  border-color: #d8a8a8;
  color: #6a3a3a;
}
.cell-doc-link-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
}
.cell-doc-link-button:hover:not(:disabled) {
  background: var(--ink-100);
}
.cell-doc-link-button:disabled {
  cursor: default;
}
.cell-doc-link-key {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-600);
}
.cell-doc-link-broken .cell-doc-link-key {
  color: #6a3a3a;
}
.cell-doc-link-title {
  color: var(--ink-900);
}
.cell-doc-link-section {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.cell-doc-link-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  background: transparent;
  border: 0;
  border-left: 1px solid var(--border);
  color: var(--ink-400);
  font-size: 14px;
  cursor: pointer;
}
.cell-doc-link-remove:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.cell-doc-section-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.cell-card-dragging {
  cursor: grabbing !important;
  border: 1px dashed var(--brand, var(--ink-500));
  background: var(--brand);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in oklch, var(--brand) 8%, var(--surface));
  }
}
.cell-card-overlay {
  cursor: grabbing;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.25);
  background: var(--surface);
  border-color: var(--ink-700);
  opacity: 0.95;
  transform: rotate(2deg);
  transition: none;
}
.cell-card-grip:active {
  cursor: grabbing !important;
}
.chat-mention-popover {
  position: absolute;
  bottom: 100%;
  left: 12px;
  right: 12px;
  margin-bottom: 4px;
  background: var(--surface);
  border: 1px solid var(--ink-700);
  border-radius: var(--r-sm);
  box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.1);
  max-height: 280px;
  overflow-y: auto;
  z-index: 50;
  font-family: var(--fs-sans);
}
.cell-card-body--cols {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 10px;
  min-width: 0;
}
.cell-card-body--three {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  gap: 10px;
  min-width: 0;
}
.cell-card-body--tall {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.cell-card-body--hero {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  flex: 1;
}
.cell-card-title--lg {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
}
.cell-card-title--hero {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
}
.cell-card-content-preview {
  margin: 0;
  font-size: 11px;
  line-height: 1.5;
  color: var(--ink-600);
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.cell-card-snippet .cell-card-content-preview {
  -webkit-line-clamp: 3;
}
.cell-card-snippet--lg .cell-card-content-preview {
  -webkit-line-clamp: 5;
}
.cell-card-snippet--xl .cell-card-content-preview {
  -webkit-line-clamp: 7;
}
.cell-card-snippet--full .cell-card-content-preview {
  -webkit-line-clamp: 10;
}
.cell-card-content-block .cell-card-content-preview {
  -webkit-line-clamp: 8;
}
.cell-card-content-block--tall .cell-card-content-preview {
  -webkit-line-clamp: 12;
}
.cell-card-content-pane .cell-card-content-preview {
  -webkit-line-clamp: 8;
}
.cell-card-content-pane--main .cell-card-content-preview {
  -webkit-line-clamp: 10;
}
.cell-card-content-pane--tall .cell-card-content-preview {
  -webkit-line-clamp: 14;
}
.cell-card-empty-hint {
  font-size: 11px;
  color: var(--ink-300);
  font-style: italic;
}
.cell-card-meta {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.cell-card-meta-item {
  font-size: 10px;
  color: var(--ink-400);
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: baseline;
}
.cell-card-meta-label {
  color: var(--ink-300);
  font-family: var(--fs-mono);
}
.cell-card-sidebar {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  font-size: 10px;
}
.cell-card-snippet, .cell-card-snippet--lg, .cell-card-snippet--xl, .cell-card-snippet--full {
  min-width: 0;
  overflow: hidden;
}
.cell-card-links-count {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  color: var(--ink-400);
  font-family: var(--fs-mono);
}
.cell-card-links-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cell-card-links-list--inline {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 4px;
}
.cell-card-link-item {
  font-size: 10px;
  color: var(--ink-500);
  font-family: var(--fs-mono);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  padding: 1px 4px;
  background: var(--ink-50);
  border-radius: 3px;
}
.cell-card-status-timeline {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 4px;
}
.cell-status-line {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  color: var(--ink-500);
}
.cell-status-line-label {
  font-family: var(--fs-mono);
  color: var(--ink-400);
  min-width: 28px;
}
.cell-status-line-time {
  color: var(--ink-300);
  font-size: 9px;
}
.cell-dot--sm {
  width: 6px;
  height: 6px;
  flex-shrink: 0;
}
.cell-card-status-history {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 6px;
  padding-left: 4px;
  border-left: 1px solid var(--border);
}
.cell-history-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--ink-300);
}
.cell-history-item--done {
  color: var(--ink-600);
}
.cell-history-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--border);
  flex-shrink: 0;
  margin-left: -7px;
}
.cell-history-item--done .cell-history-dot {
  background: var(--success);
}
.cell-history-label {
  font-family: var(--fs-mono);
  flex: 1;
}
.cell-history-time {
  color: var(--ink-300);
  font-size: 9px;
}
.cell-card-status-block {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-top: 4px;
}
.cell-card-hero-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.cell-card-hero-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.cell-card-hero-content {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.cell-card-hero-content .cell-card-content-preview {
  -webkit-line-clamp: 6;
}
.cell-card-hero-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
}
.cell-card-content-pane {
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cell-card-open-btn {
  font-size: 11px;
  padding: 3px 8px;
  margin-top: auto;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.cell-ctx-separator {
  height: 1px;
  background: var(--border);
  margin: 4px 0;
}
.cell-ctx-item--sub {
  display: flex;
  align-items: center;
  gap: 6px;
}
.cell-ctx-arrow {
  margin-left: auto;
  color: var(--ink-400);
  font-size: 14px;
}
.cell-ctx-size-badge {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  min-width: 28px;
  display: inline-block;
}
.cell-ctx-submenu {
  max-height: 300px;
  overflow-y: auto;
}
.cells-error-toast {
  background: oklch(97% 0.015 30);
  border: 1px solid oklch(85% 0.06 30);
  color: oklch(40% 0.12 30);
  font-size: 12px;
  padding: 8px 12px;
  border-radius: var(--r-sm);
  margin-bottom: 8px;
}
.cell-coord-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.25);
}
.cell-coord-picker {
  background: var(--surface);
  border: 1px solid var(--ink-700);
  border-radius: var(--r-md);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
  padding: 16px;
  min-width: 240px;
}
.cell-coord-picker-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-700);
  margin-bottom: 12px;
}
.cell-coord-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: var(--r-sm);
  background: transparent;
  border: none;
  color: var(--ink-400);
  cursor: pointer;
}
.cell-coord-close:hover {
  background: var(--ink-100);
  color: var(--ink-700);
}
.cell-coord-grid {
  display: grid;
  gap: 4px;
}
.cell-coord-cell {
  aspect-ratio: 1;
  border-radius: 4px;
  border: 1px solid var(--border);
  background: var(--surface);
  cursor: pointer;
  transition: background 0.1s, border-color 0.1s;
  min-width: 32px;
  min-height: 32px;
}
.cell-coord-cell--idle:hover {
  border-color: var(--brand);
  background: var(--brand);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in oklch, var(--brand) 8%, transparent);
  }
}
.cell-coord-cell--hovered {
  background: var(--brand);
  @supports (color: color-mix(in lab, red, red)) {
    background: color-mix(in oklch, var(--brand) 20%, transparent);
  }
  border-color: var(--brand);
}
.cell-coord-cell--occupied {
  background: var(--ink-100);
  border-color: var(--border);
  cursor: not-allowed;
  opacity: 0.5;
}
.cell-coord-cell--out {
  background: transparent;
  border-color: transparent;
  cursor: not-allowed;
  opacity: 0.2;
}
.cell-coord-hint {
  margin-top: 10px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  text-align: center;
  min-height: 16px;
}
.cell-card--1x1 {
  min-height: 132px;
}
.cell-card--2x1 {
  min-height: 120px;
}
.cell-card--1x2 {
  min-height: 200px;
}
.cell-card--2x2 {
  min-height: 180px;
}
.cell-card--1x3 {
  min-height: 280px;
}
.bk-now-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  margin: 0 6px 4px;
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--surface);
  text-decoration: none;
  color: inherit;
  transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.bk-now-card:hover {
  border-color: var(--border-strong);
  background: var(--ink-50);
}
.bk-now-body {
  min-width: 0;
}
.bk-now-title {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bk-now-meta {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
  margin-top: 2px;
}
.bk-now-track {
  position: relative;
  height: 2px;
  margin-top: 6px;
  background: var(--ink-150);
  border-radius: 1px;
  overflow: hidden;
}
.bk-now-track > span {
  position: absolute;
  inset: 0;
  background: var(--brand);
  border-radius: 1px;
}
.bk-other-link {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  gap: 8px;
  align-items: center;
}
.bk-other-glyph {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
}
.bk-other-glyph .bk-glyph {
  font-size: 14px;
  line-height: 1;
  color: var(--ink-500);
}
.bk-other-link.active .bk-other-glyph .bk-glyph {
  color: var(--brand);
}
.bk-other-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bk-entry {
  display: grid;
  grid-template-columns: 26px 1fr 16px;
  gap: 6px;
  align-items: baseline;
  padding: 5px 10px;
  border-radius: var(--r-xs);
  font-size: 13px;
  color: var(--ink-600);
  text-decoration: none;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.bk-entry:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.bk-entry.active {
  background: var(--ink-100);
  color: var(--ink-900);
  box-shadow: inset 2px 0 0 var(--brand);
}
.bk-entry.is-read {
  color: var(--ink-400);
}
.bk-entry.is-read .bk-title {
  text-decoration: none;
}
.bk-num {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.bk-entry.active .bk-num {
  color: var(--brand);
}
.bk-title {
  font-size: 13px;
  line-height: 1.35;
  white-space: normal;
  word-break: normal;
  overflow-wrap: anywhere;
  min-width: 0;
}
.bk-mark {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-300);
  line-height: 1;
}
.bk-mark-done {
  color: var(--success);
}
.bk-mark-half {
  color: var(--brand);
}
.bk-entry.active .bk-mark {
  color: var(--brand);
}
.bk-glyph {
  font-family: var(--fs-serif);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.02em;
  display: inline-block;
}
.bk-glyph--sm {
  font-size: 16px;
}
.bk-glyph--md {
  font-size: 28px;
}
.bk-glyph--lg {
  font-size: 56px;
}
.bk-glyph--xl {
  font-size: 84px;
}
.bk-glyph.is-active {
  color: var(--brand);
}
.bk-glyph.is-muted {
  color: var(--ink-300);
}
.bk-list-view {
  display: block;
}
.bk-hero {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 36px;
  margin-bottom: 48px;
  padding-bottom: 36px;
  border-bottom: 1px solid var(--border);
}
.bk-hero-cover {
  width: 320px;
  aspect-ratio: 2 / 3;
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 14px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: border-color var(--dur-fast) var(--ease-out);
}
.bk-hero-cover:hover {
  border-color: var(--border-strong);
}
.bk-hero-side {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 18px;
  min-width: 0;
}
.bk-hero-kicker {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--brand);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.bk-hero-title {
  margin: 0;
  font-size: 36px;
  font-weight: 600;
  letter-spacing: -0.025em;
  color: var(--ink-900);
  line-height: 1.08;
}
.bk-hero-sub {
  margin: 0;
  font-size: 14px;
  color: var(--ink-500);
  line-height: 1.55;
  max-width: 56ch;
}
.bk-hero-cta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.bk-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 16px;
  flex-wrap: wrap;
}
.bk-list-title {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink-900);
}
.bk-chips {
  display: inline-flex;
  gap: 4px;
  background: var(--ink-50);
  padding: 4px;
  border-radius: var(--r-pill);
}
.bk-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  background: transparent;
  border: 0;
  border-radius: var(--r-pill);
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--ink-500);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.bk-chip:hover {
  color: var(--ink-900);
}
.bk-chip.is-active {
  background: var(--ink-0);
  color: var(--ink-900);
  box-shadow: var(--shadow-1);
}
.bk-chip-count {
  font-variant-numeric: tabular-nums;
  color: var(--ink-400);
}
.bk-chip.is-active .bk-chip-count {
  color: var(--ink-500);
}
.bk-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 16px;
}
.bk-list-group + .bk-list-group {
  margin-top: 32px;
}
.bk-list-group-title {
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin: 0 0 14px 0;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.bk-list-group-count {
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.06em;
}
.bk-tile-cell {
  display: block;
}
.bk-list-view[data-filter="reading"] .bk-tile-cell:not([data-state="reading"]) {
  display: none;
}
.bk-list-view[data-filter="fresh"] .bk-tile-cell:not([data-state="fresh"]) {
  display: none;
}
.bk-list-view[data-filter="done"] .bk-tile-cell:not([data-state="done"]) {
  display: none;
}
.book-cover-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  aspect-ratio: 2 / 3;
  padding: 12px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.book-cover-tile:hover {
  border-color: var(--border-strong);
  transform: translateY(-1px);
}
.book-cover-tile.is-idle {
  background: var(--surface-sunken);
}
.book-cover-tile[data-has-cover="1"] {
  background-color: var(--surface-sunken);
  background-size: cover;
  background-position: center;
}
.book-cover-tile[data-has-cover="1"]::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient( to bottom, transparent 0%, transparent 45%, rgba(0, 0, 0, 0.55) 78%, rgba(0, 0, 0, 0.78) 100% );
  pointer-events: none;
  z-index: 0;
}
.book-cover-tile[data-has-cover="1"] > * {
  position: relative;
  z-index: 1;
}
.bk-tile-kind {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-400);
  line-height: 1.4;
}
.book-cover-tile.is-active .bk-tile-kind {
  color: var(--brand);
}
.book-cover-tile[data-has-cover="1"] .bk-tile-kind {
  color: rgba(255, 255, 255, 0.72);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
.bk-tile-glyph {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.bk-tile-glyph--xl {
  padding: 8px 0;
}
.bk-tile-spacer {
  flex: 1;
}
.bk-tile-foot {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-bottom: 4px;
}
.bk-tile-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-900);
  letter-spacing: -0.015em;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
}
.book-cover-tile.is-idle .bk-tile-title {
  color: var(--ink-700);
}
.book-cover-tile[data-has-cover="1"] .bk-tile-title {
  color: rgba(255, 255, 255, 0.96);
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}
.bk-tile-meta {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.book-cover-tile[data-has-cover="1"] .bk-tile-meta {
  color: rgba(255, 255, 255, 0.62);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
.bk-tile-prog {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 2px;
  background: var(--brand);
  border-radius: 0 1px 0 0;
}
.bk-toc-view {
  max-width: 900px;
}
.bk-toc-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 20px;
  align-items: center;
  padding-bottom: 28px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--border);
}
.bk-toc-glyph {
  display: flex;
  align-items: center;
}
.bk-toc-headtxt {
  min-width: 0;
}
.bk-toc-title {
  margin: 4px 0 4px;
  font-size: 32px;
  font-weight: 600;
  letter-spacing: -0.025em;
  color: var(--ink-900);
  line-height: 1.15;
}
.bk-toc-meta {
  margin: 0;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.bk-toc-cta {
  white-space: nowrap;
}
.bk-chap-bar {
  display: flex;
  height: 6px;
  gap: 2px;
  margin: 0 0 32px;
  border-radius: 3px;
  overflow: hidden;
  background: var(--ink-100);
}
.bk-chap-bar-seg {
  display: block;
  background: var(--ink-200);
  transition: background var(--dur-fast) var(--ease-out);
}
.bk-chap-bar-seg.is-read {
  background: var(--brand);
}
.bk-chap-bar-seg.is-current {
  background: var(--brand-soft);
  box-shadow: inset 0 0 0 1px var(--brand);
}
.bk-chap-bar-seg.is-unread {
  background: var(--ink-150);
}
.bk-chap-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.bk-chap-row {
  display: grid;
  grid-template-columns: 40px 1fr auto auto;
  gap: 16px;
  align-items: center;
  padding: 14px 12px;
  border-top: 1px solid var(--ink-100);
  text-decoration: none;
  color: var(--ink-700);
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.bk-chap-row:last-child {
  border-bottom: 1px solid var(--ink-100);
}
.bk-chap-row:hover {
  background: var(--ink-50);
  color: var(--ink-900);
}
.bk-chap-row.is-current {
  background: var(--surface);
  box-shadow: inset 2px 0 0 var(--brand);
  color: var(--ink-900);
}
.bk-chap-row.is-read {
  color: var(--ink-500);
}
.bk-chap-num {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.bk-chap-row.is-current .bk-chap-num {
  color: var(--brand);
}
.bk-chap-title {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
}
.bk-chap-row.is-current .bk-chap-title {
  font-weight: 600;
}
.bk-chap-mins {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  white-space: nowrap;
}
.bk-chap-state {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-300);
  width: 14px;
  text-align: center;
  line-height: 1;
}
.bk-chap-row.is-read .bk-chap-state {
  color: var(--success);
  font-weight: 700;
}
.bk-chap-row.is-current .bk-chap-state {
  color: var(--brand);
}
.bk-chap-row.is-started:not(.is-read):not(.is-current) .bk-chap-state {
  color: var(--brand-soft);
}
.bk-page-view {
  position: relative;
}
.bk-reader-grid {
  display: grid;
  grid-template-columns: minmax(0, 720px) minmax(320px, 1fr);
  gap: 48px;
  width: 100%;
  max-width: none;
  margin: 0;
  align-items: start;
}
.bk-reader-main {
  min-width: 0;
}
.bk-reader-main > .lr {
  margin: 0;
  max-width: 100%;
}
.bk-reader-margin {
  display: block;
  position: sticky;
  top: calc(var(--topbar-h) + 16px);
  max-height: calc(100vh - var(--topbar-h) - 32px);
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-width: thin;
  max-width: 520px;
  justify-self: start;
  width: 100%;
}
@media (max-width: 1080px) {
  .bk-reader-grid {
    grid-template-columns: minmax(0, 720px);
    max-width: 720px;
    margin: 0 auto;
  }
  .bk-reader-margin {
    position: static;
    max-height: none;
    max-width: none;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--border);
  }
}
.bk-page-eyebrow {
  font-family: var(--fs-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-400);
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.bk-page-eyebrow a {
  color: var(--ink-500);
  text-decoration: none;
}
.bk-page-eyebrow a:hover {
  color: var(--ink-900);
}
.bk-page-eyebrow .pip {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--ink-300);
  display: inline-block;
}
.bk-page-eyebrow--read {
  margin-bottom: 12px;
  justify-content: space-between;
  flex-wrap: wrap;
}
.bk-eb-crumb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}
.bk-eb-eta {
  color: var(--ink-500);
  white-space: nowrap;
}
.bk-page-h1 {
  margin: 0 0 24px;
  font-size: 32px;
  font-weight: 600;
  letter-spacing: -0.025em;
  color: var(--ink-900);
  line-height: 1.15;
  display: flex;
  align-items: baseline;
  gap: 14px;
}
.bk-glyph--inline {
  font-family: var(--fs-serif);
  font-size: 38px;
  font-weight: 500;
  color: var(--brand);
  letter-spacing: -0.02em;
  line-height: 1;
  flex-shrink: 0;
}
.bk-page-foot-nav {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: center;
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--border);
  font-size: 13px;
}
.bk-page-foot-nav .nav-prev, .bk-page-foot-nav .nav-next {
  color: var(--ink-500);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: color var(--dur-fast) var(--ease-out);
}
.bk-page-foot-nav .nav-prev:hover, .bk-page-foot-nav .nav-next:hover {
  color: var(--ink-900);
}
.bk-page-foot-nav .nav-next {
  justify-self: end;
}
.bk-mark-read {
  background: var(--ink-0);
  border: 1px solid var(--border);
  padding: 6px 14px;
  border-radius: var(--r-sm);
  cursor: pointer;
  color: var(--ink-700);
  font-size: 13px;
  font-weight: 500;
  font-family: var(--fs-sans);
  transition: all var(--dur-fast) var(--ease-out);
}
.bk-mark-read:hover {
  border-color: var(--brand);
  color: var(--brand);
}
.bk-mark-read.done {
  background: var(--success);
  color: white;
  border-color: var(--success);
  cursor: default;
}
.bk-mark-read.done::before {
  content: "✓ ";
}
.bk-mark-read:disabled:not(.done) {
  opacity: 0.6;
  cursor: wait;
}
.bk-float-actions {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 30;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-end;
  transition: transform var(--dur-base) var(--ease-out), opacity var(--dur-base) var(--ease-out);
}
.bk-float-actions[data-visible="false"] {
  transform: translateY(120px);
  opacity: 0;
  pointer-events: none;
}
.bk-float-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-pill);
  box-shadow: var(--shadow-2);
  cursor: pointer;
  font-family: var(--fs-sans);
  font-size: 12px;
  color: var(--ink-700);
  transition: border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.bk-float-btn:hover {
  border-color: var(--brand);
  color: var(--brand);
}
.bk-page-view[data-margin-open="true"] .bk-float-btn[data-role="margin-toggle"] {
  background: var(--brand);
  border-color: var(--brand);
  color: var(--ink-0);
}
.bk-page-view[data-margin-open="true"] .bk-float-btn[data-role="margin-toggle"]:hover {
  color: var(--ink-0);
}
.bk-float-btn-glyph {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
}
.bk-float-btn-label {
  font-size: 12px;
}
.mt-root {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mt-nav {
  display: flex;
  gap: 2px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 6px;
}
.mt-tab {
  flex: 1;
  padding: 6px 8px;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-400);
  cursor: pointer;
  transition: color var(--dur-fast) var(--ease-out), border-bottom-color var(--dur-fast) var(--ease-out);
  margin-bottom: -7px;
}
.mt-tab:hover {
  color: var(--ink-700);
}
.mt-tab[aria-selected="true"] {
  color: var(--brand);
  border-bottom-color: var(--brand);
}
.mt-panels {
  display: block;
}
.mt-panel {
  display: block;
}
.mt-panel[hidden] {
  display: none;
}
.mt-empty {
  padding: 24px 12px;
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  color: var(--ink-400);
  text-align: center;
}
.mg-list-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin: 0 0 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.mg-list-count {
  color: var(--ink-400);
  font-weight: 400;
}
.mg-empty {
  padding: 16px 0;
  font-size: 12px;
  color: var(--ink-400);
  line-height: 1.5;
}
.mg-focus-slot {
  padding: 14px 14px;
  background: var(--brand-soft);
  border: 1px solid var(--brand-soft);
  border-radius: var(--r-sm);
  margin-bottom: 14px;
}
.mg-focus-hint {
  font-size: 12px;
  color: var(--ink-500);
  line-height: 1.5;
}
.mg-focus-hint-mark {
  border-bottom: 1px dotted var(--ink-400);
  color: var(--ink-700);
}
.mg-focus-eyebrow {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--brand);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.mg-focus-term {
  font-size: 20px;
  font-weight: 600;
  color: var(--ink-900);
  letter-spacing: -0.015em;
  margin-bottom: 6px;
}
.mg-focus-def {
  font-size: 12px;
  color: var(--ink-600);
  line-height: 1.55;
}
.mg-focus-def p {
  margin: 0 0 6px;
}
.mg-focus-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--brand);
}
.mg-focus-action {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--brand);
  text-decoration: none;
  letter-spacing: 0.04em;
}
.mg-focus-action:hover {
  text-decoration: underline;
}
.mg-focus-action--muted {
  color: var(--ink-500);
}
.mg-focus-loading, .mg-focus-error {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
}
.mg-focus-error {
  color: var(--danger);
}
.mg-glossary {
  display: block;
}
.mg-gloss-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.mg-gloss-item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 6px;
  border-radius: var(--r-xs);
  text-decoration: none;
  color: var(--ink-700);
  transition: background var(--dur-fast) var(--ease-out);
}
.mg-gloss-item:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.mg-gloss-term {
  font-size: 12px;
  line-height: 1.35;
}
.mg-gloss-count {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.mg-gloss-more {
  margin: 6px 6px 0;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
}
.mg-graph {
  display: block;
}
.mg-graph-svg-wrap {
  margin: 8px 0 12px;
  padding: 4px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
}
.mg-graph-svg {
  display: block;
  max-width: 100%;
  height: auto;
}
.mg-graph-edge {
  transition: stroke-opacity var(--dur-fast) var(--ease-out), stroke-width var(--dur-fast) var(--ease-out);
}
.mg-graph-node circle {
  cursor: pointer;
  transition: r var(--dur-fast) var(--ease-out), stroke-width var(--dur-fast) var(--ease-out);
}
.mg-graph-node:hover circle {
  stroke-width: 2.2;
}
.mg-graph-node:hover ~ .mg-graph-edges .mg-graph-edge {
  stroke-opacity: 0.15;
}
.mg-graph-label {
  font-family: var(--fs-sans);
  font-size: 10px;
  fill: var(--ink-900);
  pointer-events: none;
  font-weight: 500;
  paint-order: stroke;
  stroke: var(--ink-0);
  stroke-width: 2.2;
  stroke-linejoin: round;
}
.mg-graph-node:hover .mg-graph-label {
  fill: var(--brand);
  font-weight: 600;
}
.mg-graph-hub circle {
  pointer-events: none;
}
.mg-graph-hub-label {
  font-family: var(--fs-mono);
  font-size: 8px;
  fill: var(--ink-0);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  pointer-events: none;
}
.mg-graph-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--border);
}
.mg-graph-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--fs-mono);
  font-size: 9.5px;
  color: var(--ink-600);
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.mg-graph-legend-swatch {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid var(--ink-0);
}
.mg-graph-legend-label {
  color: var(--ink-700);
}
.mg-graph-legend-count {
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
html[data-native] .mg-graph-label {
  fill: var(--ink-700);
}
html[data-native] .mg-graph-node:hover .mg-graph-label {
  fill: var(--ink-900);
}
html[data-native] .mg-graph-svg-wrap {
  background: rgba(20, 19, 16, 0.35);
}
.mg-notes {
  display: block;
}
.mg-notes-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mg-note {
  padding: 8px 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 2px solid var(--brand);
  border-radius: 0 var(--r-xs) var(--r-xs) 0;
}
.mg-note[data-color="warn"] {
  border-left-color: var(--warn);
}
.mg-note[data-color="danger"] {
  border-left-color: var(--danger);
}
.mg-note[data-color="brand"] {
  border-left-color: var(--brand);
}
.mg-note-head {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 4px;
}
.mg-note-kind {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--brand);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.mg-note[data-color="warn"] .mg-note-kind {
  color: var(--warn);
}
.mg-note[data-color="danger"] .mg-note-kind {
  color: var(--danger);
}
.mg-note-text {
  font-size: 12px;
  color: var(--ink-700);
  line-height: 1.45;
  font-style: italic;
}
.mg-note-mynote {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px dashed var(--ink-150);
  font-size: 11px;
  color: var(--ink-600);
}
.mg-notes-empty {
  font-size: 12px;
  color: var(--ink-400);
  line-height: 1.5;
  padding: 12px 0;
}
.mg-note {
  cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.mg-note:hover {
  border-color: var(--border-strong);
  background: var(--ink-50);
}
.mg-note:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 1px;
}
.mg-note .mg-note-del {
  cursor: pointer;
}
mark.mg-flash {
  background: oklch(94% 0.12 80 / 0.7);
  color: inherit;
  padding: 1px 0;
  border-radius: 2px;
  animation: mg-flash-fade 2.4s var(--ease-out) forwards;
}
@keyframes mg-flash-fade {
  0% {
    background: oklch(88% 0.18 80 / 0.95);
  }
  20% {
    background: oklch(90% 0.16 80 / 0.85);
  }
  100% {
    background: transparent;
  }
}
.mg-notes-hint {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  margin-top: 12px;
  padding-top: 8px;
  border-top: 1px dashed var(--ink-150);
}
#hl-popover {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px;
  background: var(--ink-900);
  border: 1px solid var(--brand);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-3);
  z-index: 40;
}
#hl-popover[hidden] {
  display: none;
}
#hl-popover .hl-colors {
  display: inline-flex;
  gap: 2px;
}
#hl-popover .hl-color {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: transparent;
  border: 0;
  border-radius: var(--r-xs);
  cursor: pointer;
  padding: 0;
}
#hl-popover .hl-color:hover {
  background: var(--ink-700);
}
#hl-popover .hl-color.is-active {
  background: var(--ink-700);
}
#hl-popover .hl-dot {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.18);
}
#hl-popover .hl-sep {
  width: 1px;
  height: 20px;
  margin: 0 4px;
  background: rgba(255,255,255,0.18);
}
#hl-popover .hl-actions {
  display: inline-flex;
  gap: 2px;
}
#hl-popover .hl-action {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 28px;
  padding: 0 8px;
  background: transparent;
  border: 0;
  border-radius: var(--r-xs);
  cursor: pointer;
  font-family: var(--fs-sans);
  color: var(--ink-100);
  font-size: 12px;
}
#hl-popover .hl-action:hover {
  background: var(--ink-700);
  color: var(--ink-0);
}
#hl-popover .hl-ico {
  line-height: 1;
}
#hl-popover .hl-kbd {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.gloss {
  border-bottom: 1px dotted var(--ink-400);
  cursor: help;
  padding-bottom: 1px;
  transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.gloss:hover {
  background: var(--brand-soft);
  border-bottom-color: var(--brand);
}
.gloss.gloss--current {
  background: var(--brand-soft);
  border-bottom-color: var(--brand);
  outline: 2px solid var(--brand-soft);
  outline-offset: 0;
  border-radius: 2px;
}
#book-scroll-progress {
  position: fixed;
  left: 0;
  bottom: 0;
  height: 2px;
  width: 0;
  background: var(--brand);
  z-index: 100;
  transition: width 0.1s linear, opacity var(--dur-fast) var(--ease-out);
  opacity: 0;
}
#book-scroll-progress.active {
  opacity: 1;
}
#gloss-popover {
  position: absolute;
  display: none;
  background: var(--ink-0);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-2);
  padding: 14px 16px;
  max-width: 380px;
  max-height: 60vh;
  overflow-y: auto;
  z-index: 50;
  font-size: 13px;
  line-height: 1.5;
}
#gloss-popover .gp-close {
  position: absolute;
  top: 6px;
  right: 6px;
  background: none;
  border: 0;
  cursor: pointer;
  font-size: 18px;
  color: var(--ink-400);
  line-height: 1;
  padding: 4px 8px;
}
#gloss-popover .gp-close:hover {
  color: var(--ink-900);
}
#gloss-popover .gp-term {
  font-weight: 700;
  font-size: 14px;
  color: var(--ink-900);
  margin-bottom: 4px;
}
#gloss-popover .gp-aliases {
  color: var(--ink-500);
  font-size: 11px;
  margin-bottom: 10px;
  font-family: var(--fs-mono);
}
#gloss-popover .gp-def {
  margin-bottom: 12px;
  color: var(--ink-700);
}
#gloss-popover .gp-def p {
  margin: 0 0 8px;
}
#gloss-popover .gp-section-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--ink-400);
  margin: 12px 0 6px;
}
#gloss-popover .gp-refs {
  list-style: none;
  padding: 0;
  margin: 0;
}
#gloss-popover .gp-refs li {
  margin-bottom: 8px;
  font-size: 12px;
  color: var(--ink-500);
}
#gloss-popover .gp-refs a {
  color: var(--brand);
  text-decoration: none;
  font-weight: 500;
}
#gloss-popover .gp-refs a:hover {
  text-decoration: underline;
}
#gloss-popover .gp-snippet {
  display: block;
  color: var(--ink-500);
  font-size: 11px;
  margin-top: 2px;
  line-height: 1.4;
}
#gloss-popover .gp-loading, #gloss-popover .gp-error {
  color: var(--ink-400);
  font-size: 12px;
}
#gloss-popover .gp-error {
  color: var(--danger);
}
.section-feedback {
  margin: 16px 0 28px;
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 8px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  font-size: 12px;
  color: var(--ink-500);
  flex-wrap: wrap;
}
.section-feedback .sf-prompt {
  font-weight: 500;
  color: var(--ink-700);
}
.section-feedback .sf-btn {
  padding: 3px 12px;
  min-width: 36px;
  font-weight: 600;
  font-size: 14px;
  line-height: 1.2;
}
.section-feedback .sf-btn.sf-up.done {
  background: var(--success);
  color: var(--ink-0);
  border-color: var(--success);
}
.section-feedback .sf-btn.sf-down.done {
  background: var(--danger);
  color: var(--ink-0);
  border-color: var(--danger);
}
.section-feedback .sf-counts {
  font-family: var(--fs-mono);
  color: var(--ink-500);
}
.section-feedback .sf-status {
  font-size: 11px;
  color: var(--success);
  transition: opacity var(--dur-base) var(--ease-out);
}
.section-feedback .sf-status.error {
  color: var(--danger);
}
.sb-group {
  margin-bottom: 2px;
}
.sb-group-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px;
  font-size: 11px;
  font-weight: 600;
  color: var(--ink-900);
  cursor: pointer;
  list-style: none;
  border-radius: var(--r-xs);
  user-select: none;
}
.sb-group-summary::-webkit-details-marker {
  display: none;
}
.sb-group-summary::marker {
  content: "";
}
.sb-group-summary:hover {
  background: var(--ink-100);
}
.sb-group-chev {
  display: inline-block;
  width: 10px;
  color: var(--ink-400);
  transition: transform 0.12s ease;
}
.sb-group[open] > .sb-group-summary .sb-group-chev {
  transform: rotate(90deg);
}
.sb-group-items {
  padding: 2px 0 6px 14px;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--ink-150);
  margin-left: 14px;
}
.sb-group-items .lg-nav-link {
  font-size: 12.5px;
  padding: 5px 10px;
}
.lg-slot {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 14px 16px;
}
.adm-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}
.adm-heatmap {
  border-collapse: collapse;
  font-size: 12px;
  font-family: var(--fs-mono);
  width: 100%;
}
.adm-heatmap th, .adm-heatmap td {
  border: 1px solid var(--border);
  padding: 8px 10px;
  text-align: center;
  min-width: 56px;
}
.adm-heatmap thead th {
  background: var(--ink-100);
  font-weight: 600;
}
.adm-heatmap tbody th {
  text-align: left;
  background: var(--surface);
  font-weight: 500;
}
.adm-heatmap td[data-tone="danger"] {
  background: oklch(96% 0.025 25);
  color: oklch(40% 0.15 25);
  font-weight: 600;
}
.adm-heatmap td[data-tone="warn"] {
  background: oklch(96% 0.03 80);
  color: oklch(40% 0.13 80);
  font-weight: 600;
}
.adm-heatmap td[data-tone="success"] {
  background: oklch(95% 0.04 150);
  color: oklch(38% 0.13 150);
  font-weight: 600;
}
.adm-heatmap td[data-tone="muted"] {
  color: var(--ink-400);
}
html[data-native] .adm-heatmap td[data-tone="danger"] {
  background: oklch(35% 0.10 25);
  color: oklch(86% 0.12 25);
}
html[data-native] .adm-heatmap td[data-tone="warn"] {
  background: oklch(35% 0.08 80);
  color: oklch(86% 0.10 80);
}
html[data-native] .adm-heatmap td[data-tone="success"] {
  background: oklch(35% 0.08 150);
  color: oklch(86% 0.10 150);
}
.adm-table {
  border-collapse: collapse;
  width: 100%;
  font-size: 13px;
}
.adm-table th, .adm-table td {
  border-bottom: 1px solid var(--border);
  padding: 8px 12px;
  text-align: left;
}
.adm-table thead th {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-500);
  font-weight: 600;
}
.adm-filt {
  display: flex;
  gap: 12px;
  align-items: center;
  margin: 0 0 16px;
  flex-wrap: wrap;
  font-size: 12px;
}
.adm-filt label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-500);
}
.adm-filt select {
  padding: 5px 9px;
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  background: var(--ink-0);
  font-size: 12px;
  color: var(--ink-700);
  font-family: var(--fs-sans);
}
.adm-filt select:hover {
  border-color: var(--border-strong);
}
.lr-h-anchor {
  position: relative;
}
.lr-h-anchor .lr-anchor-target {
  position: absolute;
  top: -80px;
  display: block;
  width: 0;
  height: 0;
}
.lr-h-section {
  display: block;
}
.lr-h-section .section-feedback {
  margin-top: -4px;
  margin-bottom: 28px;
}
#rs-overlay {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
#rs-overlay[hidden] {
  display: none;
}
#rs-overlay .rs-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 19, 16, 0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
#rs-overlay .rs-modal {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 480px;
  background: var(--ink-0);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-lg);
  padding: 28px 28px 22px;
  box-shadow: var(--shadow-3);
  display: flex;
  flex-direction: column;
  gap: 22px;
}
#rs-overlay .rs-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#rs-overlay .rs-modal-kicker {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
}
#rs-overlay .rs-modal-close {
  background: transparent;
  border: 0;
  cursor: pointer;
  font-size: 22px;
  color: var(--ink-400);
  line-height: 1;
  padding: 2px 8px;
}
#rs-overlay .rs-modal-close:hover {
  color: var(--ink-900);
}
#rs-overlay .rs-timer {
  font-family: var(--fs-mono);
  font-size: 64px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--brand);
  text-align: center;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
#rs-overlay[data-phase="paused"] .rs-timer {
  color: var(--ink-500);
}
#rs-overlay[data-phase="idle"] .rs-timer {
  color: var(--ink-700);
}
#rs-overlay .rs-track {
  height: 3px;
  background: var(--ink-150);
  border-radius: 2px;
  overflow: hidden;
}
#rs-overlay .rs-track-fill {
  height: 100%;
  width: 0;
  background: var(--brand);
  border-radius: 2px;
  transition: width 0.4s linear;
}
#rs-overlay .rs-goal {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#rs-overlay .rs-goal-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
}
#rs-overlay .rs-goal-input {
  width: 100%;
  padding: 9px 12px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  font-family: var(--fs-serif);
  font-style: italic;
  font-size: 14px;
  color: var(--ink-900);
}
#rs-overlay .rs-goal-input:focus {
  outline: none;
  border-color: var(--brand);
  background: var(--ink-0);
}
#rs-overlay .rs-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 14px 0;
  border-top: 1px solid var(--ink-100);
  border-bottom: 1px solid var(--ink-100);
}
#rs-overlay .rs-stat {
  text-align: center;
}
#rs-overlay .rs-stat-label {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-400);
  margin-bottom: 4px;
}
#rs-overlay .rs-stat-value {
  font-family: var(--fs-mono);
  font-size: 22px;
  font-weight: 500;
  color: var(--ink-900);
  letter-spacing: -0.02em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
#rs-overlay .rs-stat-sub {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  margin-top: 4px;
}
#rs-overlay .rs-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
}
#rs-overlay .rs-btn-primary {
  min-width: 140px;
}
#rs-overlay .rs-btn-secondary {
  min-width: 90px;
}
#rs-overlay .rs-hint {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  color: var(--ink-400);
  text-align: center;
}
html[data-native] #rs-overlay .rs-modal {
  background: rgba(20, 19, 16, 0.85);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  backdrop-filter: blur(24px) saturate(160%);
}
.bk-stats-view {
  max-width: 980px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.bk-stats-head {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 8px;
}
.bk-stats-title {
  margin: 0;
  font-size: 32px;
  font-weight: 600;
  letter-spacing: -0.025em;
  color: var(--ink-900);
  line-height: 1.15;
}
.bk-stats-sub {
  margin: 0;
  font-size: 14px;
  color: var(--ink-500);
  line-height: 1.55;
  max-width: 62ch;
}
.bk-bigstat-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.bk-bigstat {
  padding: 18px 18px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.bk-bigstat.is-accent {
  border-color: var(--brand);
  background: var(--brand-soft);
}
.bk-bigstat-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.bk-bigstat.is-accent .bk-bigstat-label {
  color: var(--brand-ink);
}
.bk-bigstat-value {
  font-size: 32px;
  font-weight: 600;
  color: var(--ink-900);
  letter-spacing: -0.025em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.bk-bigstat-unit {
  font-size: 16px;
  font-weight: 400;
  color: var(--ink-500);
  letter-spacing: -0.01em;
  margin-left: 4px;
}
.bk-bigstat-sub {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
  margin-top: 2px;
}
.bk-stats-two-col {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: 16px;
}
.bk-arch-panel, .bk-insights-panel, .bk-heatmap-panel {
  padding: 18px 22px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
}
.bk-stats-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 14px;
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.bk-stats-panel-meta {
  color: var(--ink-400);
  font-weight: 400;
}
.bk-arch-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.bk-arch-row {
  display: grid;
  grid-template-columns: minmax(80px, 110px) 1fr auto;
  gap: 12px;
  align-items: center;
  font-size: 13px;
  color: var(--ink-700);
}
.bk-arch-label {
  color: var(--ink-900);
  font-weight: 500;
}
.bk-arch-track {
  height: 8px;
  background: var(--ink-100);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}
.bk-arch-fill {
  display: block;
  height: 100%;
  background: var(--brand);
  border-radius: 4px;
  transition: width var(--dur-base) var(--ease-out);
}
.bk-arch-val {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.bk-insights-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.bk-insights-list li {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: baseline;
  font-size: 13px;
  color: var(--ink-600);
  line-height: 1.5;
}
.bk-insights-tag {
  font-family: var(--fs-mono);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--brand);
  background: var(--brand-soft);
  padding: 2px 6px;
  border-radius: 3px;
  white-space: nowrap;
}
.bk-heatmap {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.bk-heatmap-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4px;
}
.bk-heatmap-cell {
  display: block;
  height: 18px;
  border-radius: 3px;
  border: 1px solid transparent;
}
.bk-heatmap-cell.is-today {
  border-color: var(--brand);
}
.bk-heatmap-legend {
  margin-top: 12px;
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.bk-heatmap-legend .bk-heatmap-cell {
  width: 14px;
  height: 14px;
}
.bk-eor {
  margin-top: 48px;
  padding: 28px 32px 24px;
  background: linear-gradient(180deg, var(--brand-soft) 0%, var(--surface) 100%);
  border: 1px solid var(--brand);
  border-radius: var(--r-lg);
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.bk-eor-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.bk-eor-kicker {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--brand-ink);
}
.bk-eor-mark {
  padding: 6px 14px;
  background: var(--ink-0);
  border: 1px solid var(--brand);
  border-radius: var(--r-sm);
  color: var(--brand);
  font-family: var(--fs-sans);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease-out);
}
.bk-eor-mark:hover {
  background: var(--brand);
  color: var(--ink-0);
}
.bk-eor-mark.done {
  background: var(--success);
  border-color: var(--success);
  color: var(--ink-0);
  cursor: default;
}
.bk-eor-mark:disabled:not(.done) {
  opacity: 0.6;
  cursor: wait;
}
.bk-eor-summary {
  margin: 0;
  font-family: var(--fs-serif);
  font-size: 17px;
  line-height: 1.55;
  color: var(--ink-900);
}
.bk-eor-quotes {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.bk-eor-quote {
  margin: 0;
  padding: 10px 14px;
  background: var(--ink-0);
  border-left: 2px solid var(--brand);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.bk-eor-quote-text {
  font-family: var(--fs-serif);
  font-style: italic;
  font-size: 14px;
  color: var(--ink-700);
  line-height: 1.5;
}
.bk-eor-quote-anchor {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--brand);
  text-decoration: none;
  align-self: flex-start;
}
.bk-eor-quote-anchor:hover {
  text-decoration: underline;
}
.bk-eor-reflection {
  padding: 14px 16px;
  background: var(--ink-0);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.bk-eor-reflection-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.bk-eor-reflection-text {
  margin: 0;
  font-family: var(--fs-serif);
  font-style: italic;
  font-size: 15px;
  color: var(--ink-900);
  line-height: 1.45;
}
.bk-eor-reflection-input {
  width: 100%;
  padding: 8px 12px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  font-family: var(--fs-sans);
  font-size: 14px;
  color: var(--ink-900);
  resize: vertical;
  min-height: 48px;
}
.bk-eor-reflection-input:focus {
  outline: none;
  border-color: var(--brand);
  background: var(--ink-0);
}
.bk-eor-reflection-hint {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.bk-eor-next-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--ink-500);
  margin-bottom: 8px;
}
.bk-eor-next-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.bk-eor-next-card {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: 4px 10px;
  padding: 12px 14px;
  background: var(--ink-0);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  text-decoration: none;
  transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out);
}
.bk-eor-next-card:hover {
  border-color: var(--brand);
}
.bk-eor-next-primary {
  background: var(--brand);
  border-color: var(--brand);
}
.bk-eor-next-primary:hover {
  background: var(--brand-ink);
  border-color: var(--brand-ink);
}
.bk-eor-next-primary .bk-eor-next-kind, .bk-eor-next-primary .bk-eor-next-title, .bk-eor-next-primary .bk-eor-next-arrow {
  color: var(--ink-0);
}
.bk-eor-next-kind {
  grid-column: 1 / 2;
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.bk-eor-next-title {
  grid-column: 1 / 2;
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-900);
  line-height: 1.3;
}
.bk-eor-next-arrow {
  grid-row: 1 / 3;
  grid-column: 2 / 3;
  align-self: center;
  font-size: 16px;
  color: var(--ink-400);
}
.bk-eor-foot-nav {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: center;
  padding-top: 14px;
  border-top: 1px dashed var(--border);
  font-size: 12px;
  color: var(--ink-500);
}
.bk-eor-foot-nav .nav-prev {
  color: var(--ink-500);
  text-decoration: none;
}
.bk-eor-foot-nav .nav-prev:hover {
  color: var(--ink-900);
}
.bk-eor-foot-title {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  color: var(--ink-400);
  text-align: center;
}
.bk-ritual-view {
  max-width: 820px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.bk-ritual-head {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 20px;
  align-items: center;
}
.bk-ritual-glyph {
  display: flex;
  align-items: center;
}
.bk-ritual-headtxt {
  min-width: 0;
}
.bk-ritual-title {
  margin: 4px 0 4px;
  font-size: 32px;
  font-weight: 600;
  letter-spacing: -0.025em;
  color: var(--ink-900);
  line-height: 1.15;
}
.bk-ritual-meta {
  margin: 0;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.bk-ritual-continue {
  padding: 22px 24px;
  background: var(--brand-soft);
  border: 1px solid var(--brand);
  border-radius: var(--r-md);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.bk-ritual-continue-kicker {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--brand-ink);
}
.bk-ritual-continue-title {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-size: 22px;
  font-weight: 600;
  color: var(--ink-900);
  letter-spacing: -0.015em;
}
.bk-ritual-continue-no {
  font-family: var(--fs-mono);
  font-size: 14px;
  color: var(--brand);
  font-weight: 500;
}
.bk-ritual-continue-meta {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  letter-spacing: 0.04em;
}
.bk-ritual-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.bk-ritual-card {
  padding: 18px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.bk-ritual-card-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.bk-ritual-card-text {
  margin: 0;
  font-family: var(--fs-serif);
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-900);
}
.bk-ritual-intent-text {
  font-style: italic;
}
.bk-ritual-card-empty {
  margin: 0;
  font-size: 13px;
  color: var(--ink-400);
  font-style: italic;
}
.bk-ritual-card-sub {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.bk-ritual-intent-form {
  display: flex;
  gap: 8px;
  margin-top: 4px;
}
.bk-ritual-intent-input {
  flex: 1;
  padding: 7px 10px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  font-family: var(--fs-serif);
  font-style: italic;
  font-size: 13px;
  color: var(--ink-900);
}
.bk-ritual-intent-input:focus {
  outline: none;
  border-color: var(--brand);
  background: var(--ink-0);
}
.bk-ritual-intent-submit {
  padding: 7px 14px;
  background: var(--ink-0);
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  font-size: 12px;
  font-family: var(--fs-mono);
  letter-spacing: 0.04em;
  color: var(--ink-700);
  cursor: pointer;
}
.bk-ritual-intent-submit:hover {
  border-color: var(--brand);
  color: var(--brand);
}
.bk-ritual-intent-submit:disabled {
  opacity: 0.6;
  cursor: wait;
}
.bk-ritual-primer {
  padding: 18px 22px;
  background: var(--ink-50);
  border-left: 3px solid var(--brand);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
}
.bk-ritual-primer-kicker {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--brand);
  margin-bottom: 6px;
}
.bk-ritual-primer-text {
  margin: 0;
  font-family: var(--fs-serif);
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink-900);
}
.bk-ritual-cta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 8px;
}
.cc-root {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 320px;
  gap: 10px;
}
.cc-thread {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 4px 2px;
  scrollbar-width: thin;
}
.cc-empty {
  font-size: 12px;
  color: var(--ink-400);
  line-height: 1.5;
  padding: 16px 0;
}
.cc-msg {
  padding: 8px 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cc-msg--user {
  background: var(--ink-100);
  border-color: var(--ink-150);
}
.cc-msg-head {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.cc-msg-role {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.cc-msg-tag {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1px 5px;
  border-radius: 3px;
  background: var(--brand-soft);
  color: var(--brand);
}
.cc-msg--tag-parallel .cc-msg-tag {
  background: oklch(94% 0.05 220);
  color: oklch(40% 0.12 220);
}
.cc-msg--tag-question .cc-msg-tag {
  background: oklch(96% 0.05 90);
  color: oklch(45% 0.14 80);
}
.cc-msg--tag-noted .cc-msg-tag {
  background: oklch(94% 0.06 150);
  color: oklch(40% 0.13 150);
}
.cc-msg-anchor {
  font-family: var(--fs-mono);
  font-size: 9px;
  color: var(--ink-400);
}
.cc-msg-body {
  font-size: 12.5px;
  color: var(--ink-900);
  line-height: 1.5;
  white-space: pre-wrap;
}
.cc-msg--assistant .cc-msg-body {
  font-family: var(--fs-serif);
  font-size: 13px;
}
.cc-msg--pending {
  border-color: var(--brand-soft);
  background: var(--brand-soft);
}
.cc-msg--pending .cc-msg-body {
  min-height: 16px;
}
.cc-msg-status {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.04em;
  color: var(--ink-500);
  margin-left: auto;
  animation: cc-pulse 1.4s ease-in-out infinite;
}
@keyframes cc-pulse {
  0%, 100% {
    opacity: 0.4;
  }
  50% {
    opacity: 1;
  }
}
.cc-msg--error {
  border-color: var(--danger);
  background: oklch(96% 0.04 30);
}
.cc-msg--error .cc-msg-status {
  color: var(--danger);
  animation: none;
}
.cc-form {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.cc-input {
  width: 100%;
  padding: 8px 10px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  font-family: var(--fs-sans);
  font-size: 13px;
  color: var(--ink-900);
  resize: vertical;
  min-height: 44px;
}
.cc-input:focus {
  outline: none;
  border-color: var(--brand);
  background: var(--ink-0);
}
.cc-input:disabled {
  opacity: 0.6;
}
.cc-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.cc-status {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--danger);
  letter-spacing: 0.04em;
}
.cc-send {
  padding: 5px 12px;
  background: var(--brand);
  border: 1px solid var(--brand);
  border-radius: var(--r-xs);
  color: var(--ink-0);
  font-size: 12px;
  font-family: var(--fs-sans);
  cursor: pointer;
}
.cc-send:hover {
  background: var(--brand-ink);
  border-color: var(--brand-ink);
}
.cc-send:disabled {
  opacity: 0.6;
  cursor: wait;
}
#bk-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 70;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 80px 24px 24px;
}
#bk-search-overlay[hidden] {
  display: none;
}
#bk-search-overlay .bk-search-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 19, 16, 0.5);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
#bk-search-overlay .bk-search-modal {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 640px;
  max-height: calc(100vh - 160px);
  background: var(--ink-0);
  border: 1px solid var(--border-strong);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-3);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#bk-search-overlay .bk-search-form {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 14px;
  border-bottom: 1px solid var(--border);
}
#bk-search-overlay .bk-search-input {
  flex: 1;
  padding: 8px 10px;
  background: transparent;
  border: 0;
  font-family: var(--fs-sans);
  font-size: 16px;
  color: var(--ink-900);
}
#bk-search-overlay .bk-search-input:focus {
  outline: none;
}
#bk-search-overlay .bk-search-scope {
  padding: 6px 8px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-700);
}
#bk-search-overlay .bk-search-close {
  background: transparent;
  border: 0;
  cursor: pointer;
  font-size: 22px;
  color: var(--ink-400);
  line-height: 1;
  padding: 2px 8px;
}
#bk-search-overlay .bk-search-close:hover {
  color: var(--ink-900);
}
#bk-search-overlay .bk-search-results {
  flex: 1;
  overflow-y: auto;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.bk-search-status {
  padding: 24px 12px;
  text-align: center;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.bk-search-hint {
  padding: 24px 12px;
  text-align: center;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
  line-height: 1.8;
}
.bk-search-kbd {
  display: inline-block;
  padding: 1px 5px;
  margin: 0 2px;
  background: var(--ink-100);
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--ink-700);
}
.bk-search-result {
  display: block;
  padding: 10px 12px;
  border-radius: var(--r-sm);
  text-decoration: none;
  color: var(--ink-700);
  transition: background var(--dur-fast) var(--ease-out);
}
.bk-search-result:hover, .bk-search-result.active {
  background: var(--ink-100);
}
.bk-search-result-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.bk-search-result-book {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.bk-search-result-title {
  flex: 1;
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
  min-width: 0;
}
.bk-search-result-sim {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--brand);
  font-variant-numeric: tabular-nums;
}
.bk-search-result-section {
  margin-top: 2px;
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  letter-spacing: 0.04em;
}
.bk-search-result-snippet {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--ink-600);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
html[data-native] #bk-search-overlay .bk-search-modal {
  background: rgba(20, 19, 16, 0.88);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  backdrop-filter: blur(20px) saturate(160%);
}
@media (max-width: 1180px) {
  .bk-page-view[data-margin-open="true"] .bk-reader-grid {
    grid-template-columns: 1fr;
    max-width: 760px;
  }
  .bk-reader-margin {
    position: static;
    max-height: none;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--border);
  }
}
@media (max-width: 980px) {
  .bk-hero {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .bk-hero-cover {
    width: 100%;
    max-width: 320px;
  }
  .bk-toc-head {
    grid-template-columns: auto 1fr;
  }
  .bk-toc-cta {
    grid-column: 1 / -1;
    justify-self: start;
  }
  .bk-bigstat-row {
    grid-template-columns: repeat(2, 1fr);
  }
  .bk-stats-two-col {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 700px) {
  .bk-tile-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .bk-list-head {
    flex-direction: column;
    align-items: flex-start;
  }
  .bk-chips {
    width: 100%;
    overflow-x: auto;
  }
  .bk-page-h1 {
    flex-direction: column;
    gap: 6px;
  }
  .bk-glyph--inline {
    font-size: 32px;
  }
  .bk-chap-row {
    grid-template-columns: 28px 1fr auto;
  }
  .bk-chap-mins {
    display: none;
  }
  #gloss-popover {
    max-width: 92vw;
    left: 4vw !important;
    right: 4vw;
  }
}
.dp-trigger:hover {
  border-color: var(--ink-700);
  color: var(--ink-900);
}
.dp-trigger.has-value {
  color: var(--ink-900);
}
.dp-trigger.is-past {
  color: #c93232;
  border-color: rgba(201, 50, 50, 0.35);
}
.dp-trigger.is-today {
  color: #8a6a14;
  border-color: rgba(200, 155, 47, 0.55);
  background: rgba(200, 155, 47, 0.05);
}
.dp-trigger-label {
  flex: 1;
}
.dp-clear {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  color: var(--ink-400);
  cursor: pointer;
}
.dp-clear:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.dp-popover {
  padding: 8px 8px 0;
}
.dp-popover .rdp-root {
  --rdp-accent-color: var(--ink-900);
  --rdp-accent-background-color: var(--ink-900);
  --rdp-day-height: 30px;
  --rdp-day-width: 32px;
  --rdp-day_button-height: 28px;
  --rdp-day_button-width: 28px;
  --rdp-day_button-border-radius: 6px;
  --rdp-selected-border: 0;
  --rdp-today-color: #c89b2f;
  --rdp-range_middle-background-color: var(--ink-100);
  --rdp-weekday-padding: 4px 2px;
  --rdp-weekday-text-align: center;
  --rdp-disabled-opacity: 0.35;
  --rdp-outside-opacity: 0.3;
  font-family: var(--fs-sans);
  color: var(--ink-900);
}
.dp-popover .rdp-caption_label {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.01em;
  text-transform: capitalize;
}
.dp-popover .rdp-nav button, .dp-popover .rdp-button_previous, .dp-popover .rdp-button_next {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: var(--r-sm);
  border: 0;
  background: transparent;
  color: var(--ink-500);
  cursor: pointer;
}
.dp-popover .rdp-nav button:hover, .dp-popover .rdp-button_previous:hover, .dp-popover .rdp-button_next:hover {
  background: var(--ink-100);
  color: var(--ink-900);
}
.dp-popover .rdp-weekday {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink-400);
  font-weight: 500;
}
.dp-popover .rdp-day_button {
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-700);
  border-radius: 6px;
  border: 0;
  cursor: pointer;
}
.dp-popover .rdp-day_button:hover:not([disabled]) {
  background: var(--ink-100);
  color: var(--ink-900);
}
.dp-popover .rdp-today:not(.rdp-selected) .rdp-day_button {
  color: #c89b2f;
  font-weight: 600;
}
.dp-popover .rdp-selected .rdp-day_button {
  background: var(--ink-900);
  color: var(--ink-0);
  font-weight: 600;
}
.dp-popover .rdp-outside .rdp-day_button {
  color: var(--ink-300);
}
.dp-footer {
  display: flex;
  gap: 4px;
  align-items: center;
  padding: 8px;
  border-top: 1px solid var(--border);
  margin-top: 6px;
}
.dp-foot-btn {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  padding: 4px 8px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  color: var(--ink-700);
  cursor: pointer;
}
.dp-foot-btn:hover {
  border-color: var(--ink-900);
  color: var(--ink-900);
}
.dp-foot-clear {
  color: var(--ink-400);
  border-color: transparent;
}
.dp-foot-clear:hover {
  color: #c93232;
  border-color: rgba(201, 50, 50, 0.3);
}
.tm-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 20, 25, 0.32);
  backdrop-filter: blur(2px);
  z-index: 100;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 80px 16px 40px;
  overflow-y: auto;
}
.sys-topnav-sep {
  width: 1px;
  height: 20px;
  background: var(--border);
  margin: 0 6px;
  flex-shrink: 0;
}
.cardlab-grid {
  margin: 12px 0 8px;
}
.sys-toolbar {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.sys-h1 {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}
.sys-h2 {
  font-size: 13px;
  font-weight: 600;
  margin: 0 0 10px;
  color: var(--ink-700);
}
.sys-toolbar-meta {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.sys-toolbar-form, .sys-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  background: var(--surface);
  padding: 10px 12px;
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  margin-bottom: 14px;
}
.sys-filters-actions {
  display: flex;
  align-items: end;
  gap: 6px;
  margin-left: auto;
}
.sys-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 10px;
  font-family: var(--fs-mono);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-500);
}
.sys-input {
  font-family: var(--fs-mono);
  font-size: 12px;
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: var(--r-xs);
  background: var(--ink-0);
  min-width: 140px;
}
.sys-btn {
  font-family: var(--fs-mono);
  font-size: 11px;
  padding: 5px 14px;
  background: var(--ink-900);
  color: var(--ink-0);
  border: 0;
  border-radius: var(--r-pill);
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.sys-btn-ghost {
  font-family: var(--fs-mono);
  font-size: 11px;
  padding: 5px 14px;
  background: transparent;
  color: var(--ink-700);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.sys-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}
.sys-stat {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 12px 14px;
}
.sys-stat-value {
  font-family: var(--fs-mono);
  font-size: 20px;
  font-weight: 600;
}
.sys-stat-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  text-transform: uppercase;
  color: var(--ink-500);
  letter-spacing: 0.06em;
  margin-top: 4px;
}
.sys-stat-error .sys-stat-value {
  color: #c93232;
}
.sys-stat-warn .sys-stat-value {
  color: #c89b2f;
}
.sys-stat-ok {
  opacity: 0.7;
}
.sys-cols-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 18px;
}
.sys-cols-2-fixed {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  gap: 14px;
}
@media (max-width: 1000px) {
  .sys-cols-2, .sys-cols-2-fixed {
    grid-template-columns: 1fr;
  }
}
.sys-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 14px;
  margin-bottom: 14px;
}
.sys-panel-foot {
  margin-top: 8px;
  font-size: 11px;
  font-family: var(--fs-mono);
}
.sys-panel-foot a {
  color: var(--ink-700);
}
.sys-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.sys-table th, .sys-table td {
  text-align: left;
  padding: 5px 8px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.sys-table th {
  font-family: var(--fs-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ink-500);
  font-weight: 600;
  background: var(--ink-50);
}
.sys-table tr:last-child td {
  border-bottom: 0;
}
.sys-num {
  text-align: right;
  font-family: var(--fs-mono);
}
.sys-cell-mono {
  font-family: var(--fs-mono);
  font-size: 11px;
}
.sys-cell-payload {
  font-family: var(--fs-mono);
  font-size: 11px;
  max-width: 520px;
  word-break: break-word;
  white-space: pre-wrap;
}
.sys-cell-payload code {
  background: var(--ink-50);
  padding: 1px 4px;
  border-radius: 3px;
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sys-empty {
  padding: 36px;
  text-align: center;
  color: var(--ink-500);
  font-size: 13px;
}
.sys-empty-row {
  text-align: center;
  color: var(--ink-400);
  font-style: italic;
  padding: 16px !important;
}
.sys-row-error td {
  background: rgba(201, 50, 50, 0.06);
}
.sys-row-warn td {
  background: rgba(200, 155, 47, 0.06);
}
.sys-sev {
  font-family: var(--fs-mono);
  font-size: 9px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1px 6px;
  border-radius: var(--r-pill);
  background: var(--ink-100);
  color: var(--ink-700);
}
.sys-sev-error {
  background: #c93232;
  color: #fff;
}
.sys-sev-warn {
  background: #c89b2f;
  color: #fff;
}
.sys-sev-info {
  background: var(--ink-100);
  color: var(--ink-700);
}
.is-focus td {
  background: rgba(0, 0, 0, 0.04);
}
.sys-chat-thread {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 70vh;
  overflow-y: auto;
}
.sys-msg {
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  background: var(--ink-0);
}
.sys-msg-user {
  border-left: 3px solid var(--ink-700);
}
.sys-msg-assistant {
  border-left: 3px solid #6b8e5a;
}
.sys-msg-system {
  border-left: 3px solid #c89b2f;
  opacity: 0.85;
}
.sys-msg-head {
  display: flex;
  justify-content: space-between;
  padding: 6px 10px;
  background: var(--ink-50);
  font-family: var(--fs-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ink-500);
}
.sys-msg-role {
  font-weight: 600;
}
.sys-msg-body {
  margin: 0;
  padding: 10px 12px;
  font-family: var(--fs-mono);
  font-size: 11px;
  white-space: pre-wrap;
  line-height: 1.5;
  word-break: break-word;
}
.sys-bar-track {
  width: 200px;
  height: 8px;
  background: var(--ink-100);
  border-radius: 4px;
  overflow: hidden;
}
.sys-bar-fill {
  height: 100%;
  background: var(--ink-700);
}
.sys-table-events td {
  font-size: 11px;
}
.sys-pager {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 10px 0 14px;
}
.sys-pager-info {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.sys-btn-disabled {
  opacity: 0.35;
  cursor: not-allowed;
  pointer-events: none;
}
.sys-payload-details > summary {
  cursor: pointer;
  list-style: none;
}
.sys-payload-details > summary::-webkit-details-marker {
  display: none;
}
.sys-payload-details > summary::before {
  content: "▸ ";
  color: var(--ink-400);
  font-family: var(--fs-mono);
}
.sys-payload-details[open] > summary::before {
  content: "▾ ";
}
.sys-payload-full {
  margin: 6px 0 0;
  padding: 8px 10px;
  background: var(--ink-50);
  border-radius: var(--r-xs);
  font-size: 10px;
  max-width: 560px;
  max-height: 320px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}
.cells-roadmap-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  color: var(--ink-700);
  transition: background 0.12s ease, border-color 0.12s ease;
}
.feed-split {
  display: grid;
  grid-template-columns: minmax(360px, 420px) 1fr;
  gap: 0;
  margin-top: 20px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
  height: calc(100vh - 260px);
  min-height: 480px;
}
.feed-split-master {
  border-right: 1px solid var(--border);
  background: var(--surface-sunken);
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
.feed-split-master-head {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
  flex-shrink: 0;
}
.feed-split-master-head .segmented {
  width: 100%;
}
.feed-split-master-head .segmented-item {
  flex: 1;
  justify-content: center;
}
.feed-split-count {
  margin-left: 6px;
  font-family: var(--fs-mono);
  font-size: 10px;
  opacity: 0.7;
  font-variant-numeric: tabular-nums;
}
.feed-split-list {
  flex: 1 1 0;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  overscroll-behavior: contain;
  padding: 0;
}
.feed-split-day {
  display: flex;
  flex-direction: column;
}
.feed-split-day-head {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 10px 14px 6px;
  background: var(--surface-sunken);
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-500);
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid var(--ink-100);
}
.feed-split-day-count {
  font-family: var(--fs-mono);
  font-size: 10px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.feed-split-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: stretch;
  padding: 12px 14px;
  border-bottom: 1px solid var(--ink-100);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-out);
  background: transparent;
  position: relative;
}
.feed-split-row:hover {
  background: var(--ink-100);
}
.feed-split-row.is-selected {
  background: var(--surface);
  box-shadow: inset 0 0 0 1px var(--ink-200);
}
.feed-split-row.is-read {
  opacity: 0.55;
}
.feed-split-row.is-read .feed-split-row-source {
  font-weight: 400;
}
.feed-split-row.is-unread .feed-split-row-source {
  font-weight: 600;
}
.feed-split-row-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.feed-split-row-top {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
}
.feed-split-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.feed-split-row-source {
  color: var(--ink-900);
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1;
}
.feed-split-row-time {
  font-family: var(--fs-mono);
  font-size: 10.5px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}
.feed-split-row-summary {
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--ink-700);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-wrap: break-word;
}
.feed-split-row-tags {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-top: 2px;
}
.feed-split-tag {
  font-family: var(--fs-mono);
  font-size: 9.5px;
  letter-spacing: 0.04em;
  color: var(--ink-500);
  background: var(--ink-100);
  border-radius: var(--r-xs);
  padding: 2px 6px;
}
.feed-split-row-thumb {
  position: relative;
  width: 64px;
  height: 64px;
  border-radius: var(--r-sm);
  overflow: hidden;
  background: var(--ink-100);
  border: 1px solid var(--border);
  flex-shrink: 0;
}
.feed-split-row-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.feed-split-row-thumb-badge {
  position: absolute;
  right: 4px;
  bottom: 4px;
  background: rgba(26, 25, 22, 0.75);
  color: var(--ink-0);
  font-family: var(--fs-mono);
  font-size: 10px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: var(--r-pill);
  font-variant-numeric: tabular-nums;
  backdrop-filter: blur(4px);
}
.feed-split-row-thumb--empty {
  display: flex;
  align-items: center;
  justify-content: center;
  background: repeating-linear-gradient( 45deg, var(--ink-100), var(--ink-100) 6px, var(--ink-150) 6px, var(--ink-150) 12px );
  font-family: var(--fs-mono);
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-500);
}
.feed-split-empty {
  padding: 40px 24px;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  color: var(--ink-500);
}
.feed-split-empty .mark {
  font-size: 32px;
  opacity: 0.7;
}
.feed-split-empty .title {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-900);
}
.feed-split-empty .desc {
  font-size: 12px;
  max-width: 32ch;
  line-height: 1.5;
}
.feed-split-detail {
  padding: 28px 32px;
  overflow-y: auto;
  min-height: 0;
  overscroll-behavior: contain;
  background: var(--surface);
}
.feed-split-detail-empty {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--ink-500);
}
.feed-split-detail-empty .mark {
  font-size: 48px;
  opacity: 0.4;
}
.feed-split-detail-empty .title {
  font-size: 16px;
  font-weight: 500;
  color: var(--ink-900);
}
.feed-split-detail-empty .desc {
  font-size: 13px;
  max-width: 38ch;
}
.feed-detail {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 760px;
}
.feed-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}
.feed-detail-source {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.feed-detail-source-name {
  font-size: 17px;
  font-weight: 600;
  color: var(--ink-900);
  letter-spacing: -0.01em;
  line-height: 1.2;
}
.feed-detail-source-meta {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
  margin-top: 3px;
  letter-spacing: 0.02em;
}
.feed-detail-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
.feed-detail-photo {
  background: var(--ink-50);
  border-radius: var(--r-md);
  overflow: hidden;
  border: 1px solid var(--border);
  display: flex;
  justify-content: center;
}
.feed-detail-photo img {
  max-width: 100%;
  max-height: 480px;
  height: auto;
  display: block;
  object-fit: contain;
}
.feed-detail-gallery {
  position: relative;
  display: grid;
  gap: 4px;
  border-radius: var(--r-md);
  overflow: hidden;
  background: var(--ink-100);
  max-height: 540px;
}
.feed-detail-gallery.photos-2 {
  grid-template-columns: 1fr 1fr;
  aspect-ratio: 16 / 9;
}
.feed-detail-gallery.photos-3 {
  grid-template-columns: 2fr 1fr;
  grid-template-rows: 1fr 1fr;
  aspect-ratio: 16 / 11;
}
.feed-detail-gallery.photos-3 > .feed-detail-gallery-cell:nth-child(1) {
  grid-row: 1 / 3;
}
.feed-detail-gallery.photos-4 {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  aspect-ratio: 1 / 1;
}
.feed-detail-gallery-cell {
  position: relative;
  overflow: hidden;
  background: var(--surface-sunken);
}
.feed-detail-gallery-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.feed-detail-gallery-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: repeating-linear-gradient( 45deg, var(--ink-50), var(--ink-50) 10px, var(--ink-100) 10px, var(--ink-100) 20px );
  font-size: 12px;
  color: var(--ink-500);
  font-family: var(--fs-mono);
}
.feed-detail-gallery-more {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: rgba(26, 25, 22, 0.85);
  color: var(--ink-0);
  font-family: var(--fs-mono);
  font-size: 12px;
  padding: 4px 10px;
  border-radius: var(--r-pill);
  backdrop-filter: blur(4px);
}
.feed-detail-gallery-retry {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 1;
}
.feed-detail-photo-placeholder {
  background: repeating-linear-gradient( 45deg, var(--ink-50), var(--ink-50) 14px, var(--ink-100) 14px, var(--ink-100) 28px );
  border: 1px dashed var(--border-strong);
  border-radius: var(--r-md);
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--ink-500);
  padding: 24px;
  text-align: center;
}
.feed-detail-photo-placeholder svg {
  color: var(--ink-400);
  opacity: 0.8;
}
.feed-detail-photo-placeholder-text {
  font-size: 13px;
  color: var(--ink-700);
  font-weight: 500;
}
.feed-detail-photo-placeholder-dim {
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-400);
  font-variant-numeric: tabular-nums;
}
.feed-detail-reason {
  padding: 18px 20px;
  background: var(--ink-900);
  color: var(--ink-100);
  border-radius: var(--r-md);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.feed-detail-reason-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.feed-detail-reason-badge {
  display: inline-block;
  font-family: var(--fs-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-900);
  background: var(--ink-0);
  padding: 3px 8px;
  border-radius: var(--r-sm);
  flex-shrink: 0;
}
.feed-detail-reason p {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-0);
  font-style: normal;
}
.feed-detail-reason .tag-chip {
  background: transparent;
  border-color: var(--ink-600);
  color: var(--ink-200);
}
.feed-detail-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.feed-detail-text {
  font-size: 16px;
  line-height: 1.65;
  color: var(--ink-900);
  white-space: pre-wrap;
  word-wrap: break-word;
}
.feed-detail-empty-text {
  font-size: 14px;
  color: var(--ink-400);
  font-style: italic;
}
.feed-detail-media {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  font-family: var(--fs-mono);
  font-size: 12px;
  color: var(--ink-700);
  align-self: flex-start;
}
.feed-detail-media-icon {
  font-size: 16px;
}
.feed-detail-stats {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.feed-detail-stats-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.feed-detail-stats-title {
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.feed-detail-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 0;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  overflow: hidden;
}
.feed-detail-meta-cell {
  padding: 12px 16px;
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.feed-detail-meta-cell:last-child {
  border-right: 0;
}
.feed-detail-meta-label {
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-400);
}
.feed-detail-meta-value {
  font-family: var(--fs-mono);
  font-size: 16px;
  color: var(--ink-900);
  font-variant-numeric: tabular-nums;
}
.feed-detail-reactions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.feed-reaction {
  font-family: var(--fs-mono);
  font-size: 11px;
  padding: 3px 10px;
  background: var(--ink-50);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  color: var(--ink-700);
}
.feed-detail-feedback {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 18px;
  border-top: 1px solid var(--ink-100);
}
.feed-detail-feedback-label {
  font-family: var(--fs-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-500);
}
.feed-detail-feedback-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.feed-detail-feedback-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-sm);
  font-family: var(--fs-sans);
  font-size: 13px;
  font-weight: 500;
  color: var(--ink-700);
  cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-out), background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.feed-detail-feedback-btn svg {
  flex-shrink: 0;
}
.feed-detail-feedback-btn--critical:hover:not(:disabled) {
  border-color: var(--danger);
  background: oklch(98% 0.02 30);
  color: var(--danger);
}
.feed-detail-feedback-btn--useful:hover:not(:disabled) {
  border-color: var(--success);
  background: var(--success-soft);
  color: var(--success);
}
.feed-detail-feedback-btn--skip:hover:not(:disabled) {
  border-color: var(--border-strong);
  background: var(--ink-50);
  color: var(--ink-900);
}
.feed-detail-feedback-btn.is-current {
  cursor: default;
}
.feed-detail-feedback-btn--critical.is-current {
  background: var(--danger);
  border-color: var(--danger);
  color: var(--ink-0);
}
.feed-detail-feedback-btn--useful.is-current {
  background: var(--success);
  border-color: var(--success);
  color: var(--ink-0);
}
.feed-detail-feedback-btn--skip.is-current {
  background: var(--ink-700);
  border-color: var(--ink-700);
  color: var(--ink-0);
}
.feed-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: var(--r-pill);
  font-family: var(--fs-mono);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}
.feed-chip-pending {
  background: var(--ink-50);
  color: var(--ink-500);
  border: 1px solid var(--border);
}
.feed-chip-critical {
  background: oklch(96% 0.04 30);
  color: var(--danger);
  border: 1px solid oklch(85% 0.08 30);
}
.feed-chip-useful {
  background: var(--success-soft);
  color: var(--success);
  border: 1px solid oklch(85% 0.08 150);
}
.feed-chip-skip {
  background: var(--ink-50);
  color: var(--ink-500);
  border: 1px solid var(--border);
}
.launches-list {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.launches-layout {
  margin-top: 28px;
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 24px;
  align-items: start;
}
.launches-stats .stat-band, .launches-layout .launches-list, .launches-layout .launches-empty {
  margin-top: 0;
}
.launches-stats {
  position: sticky;
  top: calc(var(--topbar-h) + 16px);
}
.launches-stats .stat-band-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 28px 24px;
}
.launches-stats .stat-cell {
  border-right: 0;
  padding: 0;
}
@media (max-width: 920px) {
  .launches-layout {
    grid-template-columns: 1fr;
  }
  .launches-stats {
    position: static;
  }
}
.launch-row {
  display: grid;
  grid-template-columns: 44px 1fr auto auto;
  gap: 16px;
  align-items: center;
  padding: 14px 18px;
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  background: var(--surface);
  text-decoration: none;
  color: inherit;
}
.launch-row-main {
  min-width: 0;
}
.launch-row-name {
  font-size: 15px;
  font-weight: 500;
  color: var(--ink-900);
}
.launch-row-sub {
  font-size: 12px;
  color: var(--ink-500);
  margin-top: 2px;
}
.launch-chip {
  padding: 2px 10px;
  border-radius: var(--r-pill);
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--ink-50);
  color: var(--ink-700);
}
.launch-status {
  padding: 3px 12px;
  border-radius: var(--r-pill);
  font-family: var(--fs-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 600;
}
.launch-status.live {
  background: var(--ink-900);
  color: var(--ink-0);
}
.launch-status.preparing {
  background: var(--ink-150);
  color: var(--ink-900);
}
.launch-status.done {
  background: transparent;
  color: var(--ink-700);
  border: 1px solid var(--border-strong);
}
.launch-status.postmortem {
  background: var(--ink-50);
  color: var(--ink-500);
}
.launch-status.planning {
  background: var(--ink-50);
  color: var(--ink-700);
}
.launches-empty {
  margin-top: 32px;
  padding: 48px 32px;
  text-align: center;
  border: 1px dashed var(--border);
  border-radius: var(--r-md);
  color: var(--ink-500);
}
.launches-empty p {
  margin: 0 0 8px;
}
.launches-empty-hint {
  margin: 0;
  font-size: 13px;
}
html[data-native] .launches .stat-band, html[data-native] .launches .launch-row {
  background: var(--frame-fill);
}
html[data-native] .launches .launch-chip, html[data-native] .launches .launch-status {
  background: var(--frame-fill);
  border: 1px solid var(--border-strong);
  color: var(--ink-700);
}
html[data-native] .launches .launch-status.live {
  border-color: var(--ink-900);
  color: var(--ink-900);
}
.ref-pill {
  display: inline-flex;
  align-items: center;
  padding: 0 6px;
  margin: 0 1px;
  border-radius: 3px;
  font-size: 0.85em;
  line-height: 1.4;
  vertical-align: baseline;
  border: 1px solid transparent;
  background: var(--surface-2, #f1f5f9);
  color: var(--ink-700, #334155);
  cursor: pointer;
  font-family: var(--fs-mono, monospace);
  font-weight: 500;
  transition: background 0.1s ease, border-color 0.1s ease;
}
.ref-pill:hover {
  border-color: currentColor;
}
.ref-pill-post {
  background: #eff6ff;
  color: #1d4ed8;
}
.ref-pill-post:hover {
  background: #dbeafe;
}
.ref-pill-comment {
  background: #fdf4ff;
  color: #a21caf;
}
.ref-pill-comment:hover {
  background: #fae8ff;
}
.ref-pill-book {
  background: #fef3c7;
  color: #92400e;
}
.ref-pill-book:hover {
  background: #fde68a;
}
.ref-pill.inline-pill {
  cursor: default;
}
.ref-hover-preview, .ref-popover {
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--r-md, 8px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
  padding: 12px 14px;
  font-size: 13px;
  color: var(--ink-900, #1e293b);
  max-height: 480px;
  overflow-y: auto;
}
.ref-hover-preview {
  padding: 8px 10px;
  font-size: 12px;
  max-height: 200px;
}
.ref-hover-meta {
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  margin-bottom: 4px;
}
.ref-hover-text {
  color: var(--ink-700, #334155);
  white-space: pre-wrap;
  word-break: break-word;
}
.ref-popover-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.ref-popover-title {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--ink-500, #64748b);
  font-size: 12px;
  flex-wrap: wrap;
}
.ref-popover-tglink {
  color: var(--ink-500, #64748b);
  font-size: 12px;
  text-decoration: none;
  white-space: nowrap;
}
.ref-popover-tglink:hover {
  color: var(--ink-900, #1e293b);
  text-decoration: underline;
}
.ref-popover-loading, .ref-popover-error {
  color: var(--ink-500, #64748b);
  font-style: italic;
  padding: 4px 0;
}
.ref-popover-error {
  color: #b91c1c;
}
.ref-popover-text {
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.5;
  margin-bottom: 10px;
}
.ref-popover-stats {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--ink-500, #64748b);
  font-size: 12px;
  border-top: 1px solid var(--border, #e2e8f0);
  padding-top: 8px;
}
.ref-popover-reactions {
  font-family: var(--fs-mono, monospace);
  font-size: 12px;
}
.ref-popover-parent {
  background: var(--surface-2, #f8fafc);
  border-left: 3px solid var(--border-strong, #cbd5e1);
  padding: 6px 10px;
  margin-bottom: 10px;
  border-radius: 0 4px 4px 0;
}
.ref-popover-parent-label {
  font-size: 11px;
  color: var(--ink-500, #64748b);
  margin-bottom: 2px;
  font-family: var(--fs-mono, monospace);
}
.ref-popover-parent-text {
  font-size: 12px;
  color: var(--ink-700, #334155);
  line-height: 1.4;
}
.ref-popover-siblings {
  border-top: 1px solid var(--border, #e2e8f0);
  padding-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ref-popover-sibling {
  font-size: 12px;
  color: var(--ink-500, #64748b);
  line-height: 1.4;
}
.sibling-label {
  font-family: var(--fs-mono, monospace);
  font-weight: 500;
}
.section-card {
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--r-lg, 12px);
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.section-card:hover {
  border-color: var(--border-strong, #cbd5e1);
}
.section-card-empty {
  opacity: 0.7;
  background: var(--surface-2, #f8fafc);
}
.section-card-running {
  border-color: #06b6d4;
  background: #ecfeff;
}
.section-card-stale {
  border-left: 4px solid #f59e0b;
}
.section-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
}
.section-card-title {
  display: flex;
  align-items: center;
  gap: 8px;
}
.section-lens-icon {
  font-size: 18px;
  line-height: 1;
}
.section-card-name {
  font-size: 15px;
  font-weight: 600;
  color: var(--ink-900, #1e293b);
  margin: 0;
}
.section-card-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.status-pill {
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 500;
  white-space: nowrap;
}
.status-empty {
  background: var(--surface-2, #f1f5f9);
  color: var(--ink-500, #64748b);
}
.status-running {
  background: #cffafe;
  color: #0e7490;
  animation: status-running-pulse 1.5s ease-in-out infinite;
}
@keyframes status-running-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
}
.status-stale {
  background: #fef3c7;
  color: #92400e;
}
.status-ready {
  background: #d1fae5;
  color: #065f46;
}
.meta-chip {
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  color: var(--ink-500, #64748b);
  padding: 2px 6px;
  background: var(--surface-2, #f1f5f9);
  border-radius: 4px;
}
.section-card-empty .section-empty-desc {
  margin: 0;
  color: var(--ink-500, #64748b);
  font-size: 13px;
  line-height: 1.5;
}
.section-empty-cta {
  align-self: flex-start;
  padding: 6px 14px;
  border-radius: var(--r-md, 8px);
  background: var(--ink-900, #1e293b);
  color: white;
  border: none;
  font-size: 13px;
  cursor: pointer;
  font-family: inherit;
}
.section-empty-cta:hover {
  background: #0f172a;
}
.section-card-running {
  text-align: center;
  padding: 24px;
}
.running-spinner {
  font-size: 20px;
  letter-spacing: 6px;
  color: #0891b2;
  animation: running-spin 1s linear infinite;
}
@keyframes running-spin {
  0% {
    opacity: 0.3;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.3;
  }
}
.running-text {
  color: var(--ink-700, #334155);
  font-size: 14px;
  margin-top: 8px;
}
.running-eta {
  color: var(--ink-500, #64748b);
  font-size: 12px;
  margin-top: 4px;
  font-family: var(--fs-mono, monospace);
}
.section-card-collapsed {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.section-summary {
  color: var(--ink-700, #334155);
  font-size: 13px;
  line-height: 1.5;
  white-space: pre-wrap;
}
.section-expand-btn, .section-collapse-btn {
  align-self: flex-start;
  background: none;
  border: none;
  color: #0e7490;
  font-size: 13px;
  cursor: pointer;
  padding: 4px 0;
  font-family: inherit;
  font-weight: 500;
}
.section-expand-btn:hover, .section-collapse-btn:hover {
  color: #155e75;
  text-decoration: underline;
}
.section-card-expanded {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 20px;
}
.section-card-body {
  min-width: 0;
}
.section-body-md {
  color: var(--ink-900, #1e293b);
  font-size: 14px;
  line-height: 1.6;
}
.section-body-md h1, .section-body-md h2, .section-body-md h3 {
  font-weight: 600;
  margin-top: 16px;
  margin-bottom: 8px;
}
.section-body-md h1 {
  font-size: 18px;
}
.section-body-md h2 {
  font-size: 16px;
}
.section-body-md h3 {
  font-size: 14px;
}
.section-body-md p {
  margin: 0 0 10px 0;
}
.section-body-md ul, .section-body-md ol {
  padding-left: 22px;
  margin: 0 0 12px 0;
}
.section-body-md li {
  margin-bottom: 4px;
}
.section-body-md blockquote {
  border-left: 3px solid var(--border-strong, #cbd5e1);
  padding-left: 12px;
  margin: 8px 0;
  color: var(--ink-500, #64748b);
}
.section-body-md code {
  background: var(--surface-2, #f1f5f9);
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 0.85em;
}
.section-body-md strong {
  font-weight: 600;
}
@media (max-width: 900px) {
  .section-card-expanded {
    grid-template-columns: 1fr;
  }
}
.evidence-rail {
  background: var(--surface-2, #f8fafc);
  border-radius: var(--r-md, 8px);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: sticky;
  top: 16px;
  max-height: calc(100vh - 100px);
  overflow-y: auto;
}
.evidence-rail-header {
  display: flex;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border, #e2e8f0);
  font-size: 12px;
  font-family: var(--fs-mono, monospace);
}
.ev-count-red {
  color: #b91c1c;
}
.ev-count-green {
  color: #047857;
}
.evidence-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ev-item {
  background: var(--surface, #ffffff);
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 12px;
  line-height: 1.4;
  border-left: 3px solid transparent;
}
.ev-item-red {
  border-left-color: #ef4444;
}
.ev-item-green {
  border-left-color: #10b981;
}
.ev-item-adversarial {
  background: #fef2f2;
  border-left-color: #b91c1c;
  border: 1px solid #fecaca;
}
.ev-item-sev-critical {
  background: #fef2f2;
  border-left-color: #991b1b;
  border-left-width: 4px;
}
.ev-item-sev-high {
  border-left-color: #ea580c;
}
.ev-adv-tag {
  display: inline-block;
  font-size: 10px;
  font-family: var(--fs-mono, monospace);
  font-weight: 600;
  color: #991b1b;
  background: #fee2e2;
  padding: 1px 6px;
  border-radius: 3px;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
.ev-note {
  color: var(--ink-700, #334155);
  word-wrap: break-word;
}
.ev-refs {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.analysis-canvas {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px 40px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.canvas-header {
  position: sticky;
  top: 0;
  background: var(--surface, #ffffff);
  border-bottom: 1px solid var(--border, #e2e8f0);
  padding: 16px 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.canvas-header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.canvas-header-channel {
  display: flex;
  align-items: baseline;
  gap: 10px;
}
.canvas-channel-name {
  font-size: 18px;
  font-weight: 600;
  color: var(--ink-900, #1e293b);
}
.canvas-channel-link {
  font-size: 13px;
  color: var(--ink-500, #64748b);
  text-decoration: none;
}
.canvas-channel-link:hover {
  color: var(--ink-700, #334155);
  text-decoration: underline;
}
.canvas-goal {
  display: flex;
  gap: 8px;
  align-items: baseline;
  font-size: 13px;
  color: var(--ink-700, #334155);
  background: #fffbeb;
  padding: 6px 10px;
  border-radius: 6px;
  border-left: 3px solid #f59e0b;
}
.canvas-goal-label {
  color: var(--ink-500, #64748b);
  font-size: 12px;
  white-space: nowrap;
}
.canvas-goal-text {
  flex: 1;
}
.canvas-progress-strip {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
}
.verdict-pill {
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.3px;
}
.verdict-pill-pending {
  background: var(--surface-2, #f1f5f9);
  color: var(--ink-500, #64748b);
}
.verdict-pill-invest {
  background: #d1fae5;
  color: #065f46;
}
.verdict-pill-maybe {
  background: #fef3c7;
  color: #92400e;
}
.verdict-pill-skip {
  background: #fee2e2;
  color: #991b1b;
}
.conflicts-panel {
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: var(--r-lg, 12px);
  padding: 20px;
}
.conflicts-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.conflicts-title {
  font-size: 17px;
  font-weight: 600;
  color: #7f1d1d;
  margin: 0;
}
.conflicts-counts {
  display: flex;
  gap: 8px;
  font-size: 13px;
  color: #991b1b;
  font-family: var(--fs-mono, monospace);
}
.conflict-count-crit {
  background: #991b1b;
  color: white;
  padding: 2px 8px;
  border-radius: 3px;
  font-weight: 600;
}
.conflicts-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.conflict-card {
  background: var(--surface, #ffffff);
  border: 1px solid #fecaca;
  border-left: 4px solid #ef4444;
  border-radius: var(--r-md, 8px);
  padding: 14px 16px;
}
.conflict-sev-critical {
  border-left-color: #991b1b;
  border-left-width: 5px;
}
.conflict-sev-high {
  border-left-color: #ea580c;
}
.conflict-sev-medium {
  border-left-color: #ca8a04;
}
.conflict-sev-low {
  border-left-color: #64748b;
}
.conflict-card-header {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.conflict-sev-pill {
  font-size: 10px;
  font-family: var(--fs-mono, monospace);
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 3px;
  letter-spacing: 0.4px;
}
.conflict-sev-pill-critical {
  background: #991b1b;
  color: white;
}
.conflict-sev-pill-high {
  background: #ea580c;
  color: white;
}
.conflict-sev-pill-medium {
  background: #ca8a04;
  color: white;
}
.conflict-sev-pill-low {
  background: #64748b;
  color: white;
}
.conflict-pair {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--fs-mono, monospace);
  font-size: 13px;
  font-weight: 500;
}
.conflict-section {
  background: var(--surface-2, #f1f5f9);
  padding: 2px 8px;
  border-radius: 4px;
  color: var(--ink-700, #334155);
}
.conflict-arrow {
  color: #b91c1c;
  font-weight: 700;
}
.conflict-body {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink-700, #334155);
}
.inquiries-panel {
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: var(--r-lg, 12px);
  padding: 20px;
}
.inquiries-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}
.inquiries-title {
  font-size: 17px;
  font-weight: 600;
  color: #78350f;
  margin: 0;
}
.inquiries-counts {
  font-size: 13px;
  color: #92400e;
  font-family: var(--fs-mono, monospace);
}
.inq-answered-count {
  color: var(--ink-500, #64748b);
}
.inquiries-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.inquiry-card {
  background: var(--surface, #ffffff);
  border: 1px solid #fde68a;
  border-radius: var(--r-md, 8px);
  padding: 12px 14px;
}
.inquiry-open {
  border-left: 4px solid #f59e0b;
}
.inquiry-answered {
  border-left: 4px solid #10b981;
  cursor: pointer;
}
.inquiry-slug {
  font-family: var(--fs-mono, monospace);
  font-size: 12px;
  color: var(--ink-700, #334155);
  font-weight: 500;
  margin-bottom: 4px;
}
.inquiry-prompt {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink-700, #334155);
  margin-bottom: 8px;
}
.inquiry-investigate-btn {
  background: #f59e0b;
  color: white;
  border: none;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
}
.inquiry-investigate-btn:hover {
  background: #d97706;
}
.inquiries-answered-block {
  margin-top: 12px;
  font-size: 13px;
}
.inquiries-answered-block summary {
  cursor: pointer;
  color: var(--ink-500, #64748b);
  padding: 4px 0;
}
.inquiry-answer {
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink-700, #334155);
  padding-top: 8px;
}
.analysis-lane {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lane-header {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.lane-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--ink-900, #1e293b);
  margin: 0;
}
.lane-subtitle {
  font-size: 13px;
  color: var(--ink-500, #64748b);
}
.lane-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 16px;
}
.verdict-panel {
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--r-lg, 12px);
  padding: 24px;
  margin-top: 8px;
}
.verdict-panel-invest {
  border-left: 6px solid #10b981;
  background: #f0fdf4;
}
.verdict-panel-maybe {
  border-left: 6px solid #f59e0b;
  background: #fffbeb;
}
.verdict-panel-skip {
  border-left: 6px solid #ef4444;
  background: #fef2f2;
}
.verdict-panel-pending {
  background: var(--surface-2, #f8fafc);
  border-style: dashed;
}
.verdict-pending-text {
  color: var(--ink-500, #64748b);
  font-size: 14px;
  text-align: center;
  padding: 12px;
}
.verdict-header {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.verdict-decision {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: 1px;
}
.verdict-decision-invest {
  color: #065f46;
}
.verdict-decision-maybe {
  color: #92400e;
}
.verdict-decision-skip {
  color: #991b1b;
}
.verdict-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.verdict-conf {
  font-size: 13px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
}
.verdict-desc {
  font-size: 14px;
  color: var(--ink-700, #334155);
}
.verdict-rationale {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-900, #1e293b);
}
.analysis-page-wrap {
  padding: 0;
  width: 100%;
}
.analysis-page-meta {
  display: flex;
  gap: 14px;
  align-items: center;
  font-size: 13px;
  color: var(--ink-500, #64748b);
  padding: 8px 24px;
  background: var(--surface-2, #f8fafc);
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.analysis-skat-btn {
  margin-left: auto;
  padding: 6px 14px;
  background: #0e7490;
  color: white;
  border: none;
  border-radius: 6px;
  font-size: 13px;
  cursor: pointer;
  font-weight: 500;
  font-family: inherit;
}
.analysis-skat-btn:hover {
  background: #155e75;
}
.analysis-error-banner {
  padding: 10px 16px;
  background: #fee;
  border: 1px solid #fcc;
  border-radius: 6px;
  margin: 12px 24px;
  font-size: 13px;
}
.analysis-no-session-text, .analysis-no-doc-text {
  font-size: 13px;
  color: var(--ink-500, #64748b);
  padding: 12px;
}
.lane-grid:empty::after {
  content: "Ни одна линза этой ленты не запущена";
  color: var(--ink-500, #64748b);
  font-size: 13px;
  padding: 12px;
}
.quality-badge {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-family: var(--fs-mono, monospace);
  border: 1px solid transparent;
}
.quality-badge-green {
  background: #d1fae5;
  color: #065f46;
  border-color: #6ee7b7;
}
.quality-badge-yellow {
  background: #fef3c7;
  color: #92400e;
  border-color: #fcd34d;
}
.quality-badge-red {
  background: #fee2e2;
  color: #991b1b;
  border-color: #fca5a5;
}
.quality-badge-label {
  font-size: 11px;
}
.quality-badge-value {
  font-weight: 700;
}
.quality-panel {
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--r-lg, 12px);
  padding: 16px 20px;
}
.quality-panel-green {
  border-left: 4px solid #10b981;
}
.quality-panel-yellow {
  border-left: 4px solid #f59e0b;
}
.quality-panel-red {
  border-left: 4px solid #ef4444;
}
.quality-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.quality-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-700, #334155);
}
.quality-score {
  font-family: var(--fs-mono, monospace);
  font-size: 22px;
  font-weight: 700;
}
.quality-score-green {
  color: #065f46;
}
.quality-score-yellow {
  color: #92400e;
}
.quality-score-red {
  color: #991b1b;
}
.quality-breakdown {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.quality-breakdown-item {
  display: flex;
  align-items: baseline;
  gap: 10px;
  font-size: 12px;
}
.quality-delta {
  font-family: var(--fs-mono, monospace);
  color: #b91c1c;
  font-weight: 500;
  min-width: 50px;
}
.quality-label {
  color: var(--ink-700, #334155);
}
.quality-breakdown-empty {
  font-size: 13px;
  color: var(--ink-500, #64748b);
  font-style: italic;
}
.conflict-category {
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  color: var(--ink-500, #64748b);
  background: var(--surface-2, #f1f5f9);
  padding: 2px 6px;
  border-radius: 3px;
}
.conflict-status-pill {
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 500;
}
.conflict-status-pill-accepted_a, .conflict-status-pill-accepted_b {
  background: #d1fae5;
  color: #065f46;
}
.conflict-status-pill-dismissed {
  background: var(--surface-2, #f1f5f9);
  color: var(--ink-500, #64748b);
}
.conflict-status-pill-inquiry_opened {
  background: #fef3c7;
  color: #92400e;
}
.conflict-status-accepted_a, .conflict-status-accepted_b, .conflict-status-dismissed, .conflict-status-inquiry_opened {
  opacity: 0.85;
}
.conflict-quotes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 10px;
}
.conflict-quote {
  background: var(--surface-2, #f8fafc);
  border-left: 3px solid;
  padding: 8px 12px;
  border-radius: 0 6px 6px 0;
  font-size: 13px;
  line-height: 1.5;
}
.conflict-quote-a {
  border-left-color: #3b82f6;
}
.conflict-quote-b {
  border-left-color: #a21caf;
}
.conflict-quote-label {
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  color: var(--ink-500, #64748b);
  font-weight: 600;
  margin-bottom: 4px;
}
@media (max-width: 700px) {
  .conflict-quotes {
    grid-template-columns: 1fr;
  }
}
.conflict-resolution-note {
  margin-top: 10px;
  font-size: 12px;
  background: #ecfdf5;
  padding: 6px 10px;
  border-radius: 6px;
  color: #065f46;
}
.conflict-resolution-label {
  font-weight: 600;
  font-family: var(--fs-mono, monospace);
}
.conflict-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border, #e2e8f0);
  flex-wrap: wrap;
}
.conflict-action {
  padding: 5px 12px;
  font-size: 12px;
  border-radius: 6px;
  border: 1px solid var(--border, #e2e8f0);
  background: var(--surface, #ffffff);
  cursor: pointer;
  font-family: inherit;
  color: var(--ink-700, #334155);
  transition: background 0.1s ease;
}
.conflict-action:hover:not(:disabled) {
  background: var(--surface-2, #f8fafc);
}
.conflict-action:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.conflict-action-accept-a {
  border-color: #3b82f6;
  color: #1e40af;
}
.conflict-action-accept-a:hover:not(:disabled) {
  background: #eff6ff;
}
.conflict-action-accept-b {
  border-color: #a21caf;
  color: #86198f;
}
.conflict-action-accept-b:hover:not(:disabled) {
  background: #fdf4ff;
}
.conflict-action-dismiss {
  color: var(--ink-500, #64748b);
}
.conflict-action-confirm {
  background: #b91c1c;
  color: white;
  border-color: #b91c1c;
}
.conflict-action-confirm:hover:not(:disabled) {
  background: #991b1b;
}
.conflict-dismiss-form {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--border, #e2e8f0);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.conflict-dismiss-input {
  width: 100%;
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid var(--border, #e2e8f0);
  font-family: inherit;
  font-size: 13px;
  resize: vertical;
}
.conflict-dismiss-actions {
  display: flex;
  gap: 6px;
}
.lens-progress-strip {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  padding: 8px 0 4px;
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
}
.lens-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--surface-2, #f1f5f9);
  color: var(--ink-500, #64748b);
  border: 1px solid transparent;
}
.lens-pill-dot {
  font-size: 8px;
  line-height: 1;
}
.lens-pill-done {
  background: #d1fae5;
  color: #065f46;
  border-color: #6ee7b7;
}
.lens-pill-done .lens-pill-dot {
  color: #10b981;
}
.lens-pill-running {
  background: #cffafe;
  color: #0e7490;
  border-color: #67e8f9;
  animation: lens-pill-pulse 1.5s ease-in-out infinite;
}
.lens-pill-running .lens-pill-dot {
  color: #06b6d4;
}
@keyframes lens-pill-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
}
.lens-pill-planned {
  opacity: 0.55;
}
.lens-pill-planned .lens-pill-dot {
  color: var(--ink-500, #64748b);
}
.lens-pill-label {
  font-weight: 500;
}
.lens-pill-suffix {
  color: var(--ink-500, #64748b);
}
.pause-btn {
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  border: 1px solid var(--border, #e2e8f0);
  background: var(--surface, #ffffff);
  color: var(--ink-700, #334155);
}
.pause-btn:hover:not(:disabled) {
  background: var(--surface-2, #f8fafc);
}
.pause-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.pause-btn-paused {
  background: #d1fae5;
  color: #065f46;
  border-color: #6ee7b7;
}
.pause-btn-paused:hover:not(:disabled) {
  background: #a7f3d0;
}
.archetype-bars {
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--r-md, 8px);
  padding: 14px;
  margin-bottom: 16px;
}
.archetype-bars-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  flex-wrap: wrap;
  gap: 8px;
}
.archetype-bars-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
}
.archetype-bars-meta {
  display: flex;
  gap: 10px;
  font-size: 11px;
  color: var(--ink-500, #64748b);
  flex-wrap: wrap;
  font-family: var(--fs-mono, monospace);
}
.archetype-dominant strong {
  color: var(--ink-900, #1e293b);
}
.archetype-chaos {
  color: #b91c1c;
  font-weight: 600;
}
.archetype-bars-list {
  display: grid;
  grid-template-columns: 130px 1fr 40px;
  gap: 6px 10px;
  align-items: center;
}
.archetype-row {
  display: contents;
}
.archetype-label {
  font-size: 12px;
  color: var(--ink-700, #334155);
  display: flex;
  align-items: center;
  gap: 6px;
}
.archetype-gender-dot {
  font-size: 6px;
  line-height: 1;
}
.archetype-gender-dot[data-gender="f"] {
  color: #ec4899;
}
.archetype-gender-dot[data-gender="m"] {
  color: #3b82f6;
}
.archetype-bar-wrap {
  background: var(--surface, #ffffff);
  height: 12px;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--border, #e2e8f0);
}
.archetype-bar {
  height: 100%;
  transition: width 0.3s ease;
}
.archetype-bar-f {
  background: linear-gradient(90deg, #fbcfe8, #ec4899);
}
.archetype-bar-m {
  background: linear-gradient(90deg, #bfdbfe, #3b82f6);
}
.archetype-pct {
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  color: var(--ink-700, #334155);
  text-align: right;
}
.archetype-dominant-row .archetype-label {
  font-weight: 700;
  color: var(--ink-900, #1e293b);
}
.archetype-coalition .archetype-label::after {
  content: " ✦";
  color: #f59e0b;
}
.archetype-coalition-note {
  margin-top: 10px;
  font-size: 11px;
  color: var(--ink-500, #64748b);
  font-style: italic;
}
.plc-pipeline {
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--r-md, 8px);
  padding: 14px;
  margin-bottom: 16px;
}
.plc-pipeline-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
  margin-bottom: 12px;
}
.plc-steps {
  display: flex;
  gap: 4px;
  align-items: flex-start;
  flex-wrap: wrap;
}
.plc-step {
  flex: 1 1 auto;
  min-width: 70px;
  text-align: center;
  padding: 8px 4px;
  border-radius: 8px;
  position: relative;
}
.plc-step-future {
  background: var(--surface, #ffffff);
  opacity: 0.55;
}
.plc-step-past {
  background: #d1fae5;
  color: #065f46;
}
.plc-step-current {
  background: #cffafe;
  color: #0e7490;
  border: 2px solid #06b6d4;
  font-weight: 600;
}
.plc-step-icon {
  font-size: 18px;
  line-height: 1.4;
}
.plc-step-label {
  font-size: 11px;
  margin-top: 4px;
}
.plc-step-marker {
  font-size: 9px;
  color: #06b6d4;
  font-family: var(--fs-mono, monospace);
  margin-top: 2px;
}
.plc-stage-summary {
  margin-top: 10px;
  font-size: 11px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
}
.plc-stage-summary code {
  background: var(--surface, #ffffff);
  padding: 1px 6px;
  border-radius: 3px;
  border: 1px solid var(--border, #e2e8f0);
}
.create-launch-btn {
  padding: 4px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  background: #1e293b;
  color: white;
  border: none;
}
.create-launch-btn:hover {
  background: #0f172a;
}
.create-launch-form-wrap {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}
.create-launch-form {
  background: var(--surface, #ffffff);
  border-radius: var(--r-lg, 12px);
  padding: 24px;
  min-width: 420px;
  max-width: 540px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.2);
}
.create-launch-form-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.create-launch-form-row label {
  font-size: 12px;
  color: var(--ink-500, #64748b);
  font-weight: 500;
}
.create-launch-form-row input, .create-launch-form-row select {
  padding: 8px 12px;
  border-radius: 6px;
  border: 1px solid var(--border, #e2e8f0);
  font-family: inherit;
  font-size: 14px;
}
.create-launch-form-info {
  background: #fffbeb;
  border-left: 3px solid #f59e0b;
  padding: 8px 10px;
  border-radius: 0 4px 4px 0;
  font-size: 12px;
  color: var(--ink-700, #334155);
  flex-direction: row !important;
}
.create-launch-form-error {
  background: #fee2e2;
  color: #991b1b;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 13px;
}
.create-launch-form-actions {
  display: flex;
  gap: 10px;
  margin-top: 6px;
}
.create-launch-submit {
  padding: 8px 18px;
  background: #1e293b;
  color: white;
  border: none;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
}
.create-launch-submit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.create-launch-cancel {
  padding: 8px 16px;
  background: transparent;
  color: var(--ink-700, #334155);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
  font-family: inherit;
}
.ref-popover-cited {
  background: #fffbeb;
  border-left: 3px solid #f59e0b;
  padding: 8px 10px;
  margin-bottom: 10px;
  border-radius: 0 6px 6px 0;
}
.ref-popover-cited-label {
  font-size: 11px;
  color: var(--ink-500, #64748b);
  margin-bottom: 4px;
  font-family: var(--fs-mono, monospace);
  font-weight: 600;
}
.ref-popover-cited-text {
  font-size: 12px;
  color: var(--ink-900, #1e293b);
  font-style: italic;
}
.ev-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin-top: 6px;
}
.ev-dispute-btn {
  background: transparent;
  border: none;
  color: var(--ink-500, #64748b);
  font-size: 12px;
  cursor: pointer;
  padding: 2px 4px;
  border-radius: 3px;
  font-family: inherit;
  opacity: 0.6;
}
.ev-dispute-btn:hover {
  opacity: 1;
  background: var(--surface-2, #f1f5f9);
}
.ev-dispute-form {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed var(--border, #e2e8f0);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ev-dispute-input {
  width: 100%;
  padding: 4px 6px;
  font-size: 11px;
  font-family: inherit;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 4px;
  resize: vertical;
}
.ev-dispute-actions {
  display: flex;
  gap: 4px;
}
.ev-dispute-submit, .ev-dispute-cancel {
  padding: 3px 8px;
  font-size: 11px;
  border-radius: 4px;
  border: 1px solid var(--border, #e2e8f0);
  background: var(--surface, #ffffff);
  cursor: pointer;
  font-family: inherit;
}
.ev-dispute-submit {
  background: #b91c1c;
  color: white;
  border-color: #b91c1c;
}
.ev-dispute-submit:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.funnel-diagram, .funnel-empty, .capacity-widget, .launch-history-widget, .product-fit-widget, .engagement-widget, .risk-widget, .competitor-widget, .season-widget {
  background: var(--surface-2, #f8fafc);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--r-md, 8px);
  padding: 14px;
  margin-bottom: 16px;
}
.funnel-empty {
  text-align: center;
  padding: 24px;
  background: #f1f5f9;
}
.funnel-empty-icon {
  font-size: 32px;
  color: var(--ink-500, #64748b);
  margin-bottom: 8px;
}
.funnel-empty-text {
  color: var(--ink-700, #334155);
  font-size: 13px;
  font-style: italic;
}
.funnel-diagram-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
  margin-bottom: 12px;
}
.funnel-stages {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}
.funnel-stage {
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: var(--r-md, 8px);
  padding: 8px 16px;
  text-align: center;
  min-width: 260px;
  max-width: 100%;
  position: relative;
}
.funnel-stage-strong {
  border-left: 4px solid #10b981;
}
.funnel-stage-medium {
  border-left: 4px solid #f59e0b;
}
.funnel-stage-weak {
  border-left: 4px solid #ef4444;
}
.funnel-stage-missing {
  border: 1px dashed #ef4444;
  background: #fef2f2;
  opacity: 0.7;
}
.funnel-stage-name {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-900, #1e293b);
}
.funnel-stage-metric {
  font-size: 11px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
  margin-top: 2px;
}
.funnel-arrow {
  font-size: 16px;
  color: var(--ink-500, #64748b);
  text-align: center;
  margin: 2px 0;
}
.funnel-leakage {
  margin-top: 12px;
  padding: 8px 10px;
  background: #fef2f2;
  border-radius: 6px;
  font-size: 12px;
}
.funnel-leakage-title {
  font-weight: 600;
  color: #991b1b;
  margin-bottom: 4px;
}
.funnel-leakage ul {
  list-style: disc;
  padding-left: 18px;
  margin: 0;
  color: var(--ink-700, #334155);
}
.funnel-verdict {
  margin-top: 10px;
  padding: 8px 10px;
  background: var(--surface, #ffffff);
  border-radius: 6px;
  font-size: 13px;
  color: var(--ink-900, #1e293b);
}
.capacity-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.capacity-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
}
.capacity-tier {
  font-family: var(--fs-mono, monospace);
  font-size: 12px;
  padding: 2px 10px;
  border-radius: 4px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #e2e8f0);
}
.capacity-tier-low {
  color: #475569;
}
.capacity-tier-mid {
  color: #1e40af;
}
.capacity-tier-high {
  color: #86198f;
}
.capacity-tier-premium {
  color: #991b1b;
  font-weight: 600;
}
.capacity-bar {
  height: 28px;
  background: var(--surface, #ffffff);
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  margin-bottom: 12px;
  border: 1px solid var(--border, #e2e8f0);
}
.capacity-bar-segment {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 11px;
  font-family: var(--fs-mono, monospace);
  padding: 2px 4px;
  min-width: 50px;
  transition: width 0.3s ease;
}
.capacity-bar-label {
  font-weight: 500;
}
.capacity-bar-pct {
  font-size: 10px;
  opacity: 0.85;
}
.capacity-signals {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--ink-700, #334155);
}
.capacity-signal-row {
  display: flex;
  gap: 8px;
  align-items: baseline;
}
.capacity-signal-label {
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  min-width: 75px;
}
.capacity-price-examples {
  margin-top: 10px;
  padding: 8px 10px;
  background: var(--surface, #ffffff);
  border-radius: 6px;
  font-size: 12px;
}
.capacity-price-title {
  font-weight: 600;
  color: var(--ink-700, #334155);
  margin-bottom: 4px;
}
.capacity-price-examples ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.capacity-price {
  font-family: var(--fs-mono, monospace);
  font-weight: 600;
  color: var(--ink-900, #1e293b);
  margin-right: 8px;
}
.capacity-price-reaction {
  color: var(--ink-500, #64748b);
}
.launch-history-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  flex-wrap: wrap;
  gap: 6px;
}
.launch-history-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
}
.launch-trend {
  font-size: 12px;
  padding: 2px 10px;
  border-radius: 4px;
  font-family: var(--fs-mono, monospace);
}
.launch-trend-growing {
  background: #d1fae5;
  color: #065f46;
}
.launch-trend-stable {
  background: #f1f5f9;
  color: #475569;
}
.launch-trend-declining {
  background: #fee2e2;
  color: #991b1b;
}
.launch-trend-first_launch {
  background: #fef3c7;
  color: #92400e;
}
.launch-history-empty {
  text-align: center;
  padding: 12px;
  color: var(--ink-500, #64748b);
  font-style: italic;
  font-size: 13px;
}
.launch-history-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.launch-item {
  background: var(--surface, #ffffff);
  border-radius: 6px;
  padding: 8px 12px;
  border-left: 3px solid var(--border-strong, #cbd5e1);
}
.launch-outcome-success {
  border-left-color: #10b981;
}
.launch-outcome-tepid {
  border-left-color: #f59e0b;
}
.launch-outcome-fail {
  border-left-color: #ef4444;
}
.launch-item-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 4px;
}
.launch-item-name {
  font-weight: 600;
  font-size: 13px;
  color: var(--ink-900, #1e293b);
}
.launch-item-period {
  font-size: 11px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
}
.launch-item-metrics {
  display: flex;
  gap: 12px;
  font-size: 12px;
  flex-wrap: wrap;
  color: var(--ink-700, #334155);
}
.launch-metric {
  font-family: var(--fs-mono, monospace);
}
.launch-revenue {
  color: #065f46;
  font-weight: 600;
}
.launch-item-refs {
  margin-top: 4px;
  font-size: 11px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
}
.launch-history-best, .launch-history-prediction {
  margin-top: 10px;
  padding: 8px 10px;
  background: var(--surface, #ffffff);
  border-radius: 6px;
  font-size: 13px;
  color: var(--ink-900, #1e293b);
}
.launch-history-prediction {
  background: #ecfdf5;
}
.product-fit-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
  margin-bottom: 12px;
}
.product-fit-cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.product-hypothesis {
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  padding: 10px 12px;
}
.product-hypothesis-rank-1 {
  border-color: #10b981;
  border-width: 2px;
}
.hypothesis-header {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 4px;
}
.hypothesis-rank {
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  background: #1e293b;
  color: white;
  padding: 1px 6px;
  border-radius: 3px;
}
.hypothesis-name {
  font-weight: 600;
  font-size: 13px;
  color: var(--ink-900, #1e293b);
}
.hypothesis-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.hypothesis-format, .hypothesis-price, .hypothesis-archetype {
  font-size: 11px;
  padding: 2px 8px;
  border-radius: 3px;
  font-family: var(--fs-mono, monospace);
}
.hypothesis-format {
  background: #eff6ff;
  color: #1e40af;
}
.hypothesis-price {
  background: #ecfdf5;
  color: #065f46;
  font-weight: 600;
}
.hypothesis-archetype {
  background: #fdf4ff;
  color: #86198f;
}
.hypothesis-segment {
  font-size: 12px;
  color: var(--ink-500, #64748b);
  margin-bottom: 4px;
}
.hypothesis-rationale {
  font-size: 12px;
  color: var(--ink-700, #334155);
  line-height: 1.5;
}
.engagement-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
  margin-bottom: 12px;
}
.engagement-gauges {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 10px;
}
.gauge {
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  padding: 10px;
  text-align: center;
}
.gauge-label {
  font-size: 11px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
}
.gauge-value {
  font-size: 22px;
  font-weight: 700;
  font-family: var(--fs-mono, monospace);
  color: var(--ink-900, #1e293b);
  margin: 4px 0;
}
.gauge-zone {
  font-size: 11px;
  color: var(--ink-500, #64748b);
}
.gauge-zone-dead {
  color: #b91c1c;
  font-weight: 500;
}
.gauge-zone-thin {
  color: #ea580c;
}
.gauge-zone-mid {
  color: #ca8a04;
}
.gauge-zone-live {
  color: #065f46;
  font-weight: 500;
}
.gauge-zone-silent {
  color: #94a3b8;
}
.gauge-zone-conversational {
  color: #065f46;
  font-weight: 500;
}
.engagement-anomalies {
  background: var(--surface, #ffffff);
  border-radius: 6px;
  padding: 8px 10px;
  font-size: 12px;
}
.engagement-anomalies-title {
  font-weight: 600;
  color: var(--ink-700, #334155);
  margin-bottom: 4px;
}
.engagement-anomalies ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.anomaly-ref {
  font-family: var(--fs-mono, monospace);
  color: #1d4ed8;
  margin-right: 6px;
}
.anomaly-type {
  background: var(--surface-2, #f1f5f9);
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10px;
  color: var(--ink-700, #334155);
  margin-right: 6px;
}
.anomaly-note {
  color: var(--ink-700, #334155);
}
.risk-widget.risk-overall-red {
  border-color: #ef4444;
  background: #fef2f2;
}
.risk-widget.risk-overall-orange {
  border-color: #ea580c;
}
.risk-widget.risk-overall-yellow {
  border-color: #ca8a04;
}
.risk-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.risk-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
}
.risk-overall {
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 999px;
  font-weight: 500;
}
.risk-overall-pill-green {
  background: #d1fae5;
  color: #065f46;
}
.risk-overall-pill-yellow {
  background: #fef3c7;
  color: #92400e;
}
.risk-overall-pill-orange {
  background: #fed7aa;
  color: #9a3412;
}
.risk-overall-pill-red {
  background: #fee2e2;
  color: #991b1b;
  font-weight: 700;
}
.risk-empty {
  text-align: center;
  padding: 12px;
  color: var(--ink-500, #64748b);
  font-style: italic;
  font-size: 13px;
}
.risk-categories {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.risk-category {
  background: var(--surface, #ffffff);
  border-radius: 6px;
  padding: 8px 10px;
  border-left: 3px solid var(--border-strong, #cbd5e1);
}
.risk-level-low {
  border-left-color: #94a3b8;
}
.risk-level-medium {
  border-left-color: #ca8a04;
}
.risk-level-high {
  border-left-color: #ef4444;
}
.risk-category-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
.risk-category-kind {
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-900, #1e293b);
}
.risk-level-pill {
  font-family: var(--fs-mono, monospace);
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 3px;
  text-transform: uppercase;
}
.risk-level-pill-low {
  background: #f1f5f9;
  color: #475569;
}
.risk-level-pill-medium {
  background: #fef3c7;
  color: #92400e;
}
.risk-level-pill-high {
  background: #fee2e2;
  color: #991b1b;
  font-weight: 700;
}
.risk-evidence {
  font-size: 12px;
  color: var(--ink-700, #334155);
  line-height: 1.4;
}
.risk-refs {
  margin-top: 4px;
  font-size: 11px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
}
.competitor-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
  margin-bottom: 12px;
}
.competitor-empty {
  font-size: 13px;
  color: var(--ink-500, #64748b);
  font-style: italic;
}
.competitor-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.competitor-item {
  background: var(--surface, #ffffff);
  border-radius: 6px;
  padding: 8px 12px;
  border-left: 3px solid var(--border-strong, #cbd5e1);
  font-size: 12px;
}
.competitor-cat-direct {
  border-left-color: #ef4444;
}
.competitor-cat-parallel {
  border-left-color: #f59e0b;
}
.competitor-cat-substitute {
  border-left-color: #94a3b8;
}
.competitor-item-header {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}
.competitor-name {
  font-weight: 600;
  color: var(--ink-900, #1e293b);
}
.competitor-cat {
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  color: var(--ink-500, #64748b);
}
.competitor-price {
  background: #ecfdf5;
  color: #065f46;
  padding: 1px 8px;
  border-radius: 3px;
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  font-weight: 600;
}
.competitor-strength, .competitor-weakness {
  color: var(--ink-700, #334155);
  line-height: 1.4;
  margin-top: 3px;
}
.competitor-label {
  font-family: var(--fs-mono, monospace);
  font-size: 11px;
  color: var(--ink-500, #64748b);
  margin-right: 4px;
}
.competitor-angle {
  margin-top: 12px;
  padding: 8px 10px;
  background: #ecfdf5;
  border-radius: 6px;
  font-size: 13px;
  color: var(--ink-900, #1e293b);
}
.season-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-700, #334155);
  margin-bottom: 12px;
}
.season-calendar {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 4px;
}
.season-month {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.season-month-label {
  font-size: 10px;
  color: var(--ink-500, #64748b);
  font-family: var(--fs-mono, monospace);
}
.season-halves {
  display: flex;
  gap: 1px;
}
.season-cell {
  width: 12px;
  height: 18px;
  border-radius: 2px;
  background: var(--surface-2, #f1f5f9);
  border: 1px solid transparent;
}
.season-neutral {
  background: #f1f5f9;
}
.season-primary {
  background: #10b981;
}
.season-backup {
  background: #fbbf24;
}
.season-weak {
  background: #94a3b8;
  opacity: 0.7;
}
.season-avoid {
  background: #ef4444;
}
.season-current {
  border-color: #1e293b !important;
  border-width: 2px !important;
}
.season-legend {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 10px;
  font-size: 11px;
  font-family: var(--fs-mono, monospace);
}
.season-legend-item {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--ink-700, #334155);
}
.season-legend-item.season-primary::before {
  content: "■";
  color: #10b981;
}
.season-legend-item.season-backup::before {
  content: "■";
  color: #fbbf24;
}
.season-legend-item.season-weak::before {
  content: "■";
  color: #94a3b8;
}
.season-legend-item.season-avoid::before {
  content: "■";
  color: #ef4444;
}
.season-legend-item.season-current-legend {
  color: #1e293b;
  font-weight: 600;
}
.season-rationale {
  margin-top: 10px;
  padding: 8px 10px;
  background: var(--surface, #ffffff);
  border-radius: 6px;
  font-size: 12px;
  color: var(--ink-700, #334155);
  line-height: 1.5;
}
.lg-history-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.lg-history-item {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-md);
  padding: 14px 18px;
  transition: border-color 0.12s ease;
}
.lg-history-item:hover {
  border-color: var(--border-strong);
}
.lg-history-item .row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px;
  color: var(--ink-500);
  font-size: 12px;
  font-family: var(--fs-mono);
  font-variant-numeric: tabular-nums;
}
.lg-history-item .snippet {
  margin: 6px 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink-700);
  font-style: italic;
}
.lg-history-item .chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.lg-history-item .chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--r-pill);
  background: var(--ink-50);
  border: 1px solid var(--border);
  font-size: 11px;
  color: var(--ink-700);
}
.lg-history-item .actions {
  display: flex;
  gap: 14px;
  margin-top: 10px;
  font-family: var(--fs-mono);
  font-size: 11px;
  color: var(--ink-500);
}
.lg-history-item .actions button {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  text-decoration: underline;
  text-decoration-color: var(--ink-200);
}
.lg-history-item .actions button:hover {
  color: var(--ink-900);
}
.lg-history-item .actions .danger:hover {
  color: var(--danger);
}
.lg-history-item .expanded {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--ink-150);
}
.lg-history-item .raw-pre {
  margin-top: 6px;
  max-height: 280px;
  overflow: auto;
  background: var(--ink-50);
  border-radius: var(--r-sm);
  padding: 10px 12px;
  font-family: var(--fs-mono);
  font-size: 11px;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--ink-700);
}
html[data-native] {
  --ink-0: #1A1916;
  --ink-50: #221F1B;
  --ink-100: #2A2724;
  --ink-150: #322F2B;
  --ink-200: #3D3A35;
  --ink-300: #565249;
  --ink-400: #8E897E;
  --ink-500: #A8A399;
  --ink-600: #C4C0B6;
  --ink-700: #DDD9D0;
  --ink-900: #F6F4EE;
  --bg: transparent;
  --surface: rgba(20, 19, 16, 0.42);
  --surface-sunken: rgba(20, 19, 16, 0.24);
  --surface-2: rgba(20, 19, 16, 0.32);
  --border: rgba(255, 255, 255, 0.28);
  --border-strong: rgba(255, 255, 255, 0.48);
  --frame-fill: rgba(0, 0, 0, 0.10);
  --brand-soft: oklch(40% 0.055 50);
  --success-soft: oklch(42% 0.075 150);
}
html[data-native] body {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
}
html[data-native] .chev, html[data-native] .chat-seg-chev, html[data-native] .gnews-detail-launch-arrow, html[data-native] .meta-row svg, html[data-native] .dr-custom svg, html[data-native] .cell-ctx-item svg, html[data-native] .feed-detail-photo-placeholder svg {
  color: var(--ink-600);
}
html[data-native] .sidebar, html[data-native] .topbar, html[data-native] .rightbar, html[data-native] .rightbar-head, html[data-native] .rightbar-foot {
  background: transparent;
}
html[data-native] .card, html[data-native] .kpi, html[data-native] .banner, html[data-native] .empty, html[data-native] .sheet, html[data-native] .menu, html[data-native] .dt, html[data-native] .segmented, html[data-native] .input, html[data-native] .btn {
  -webkit-backdrop-filter: blur(12px) saturate(160%);
  backdrop-filter: blur(12px) saturate(160%);
}
html[data-native] .badge-warn {
  background: oklch(40% 0.09 85);
  color: oklch(86% 0.12 88);
}
html[data-native] .chat-perm-zone {
  background: rgba(200, 155, 47, 0.12);
}
html[data-native] .kanban-mini-danger:hover, html[data-native] .cell-doc-link-chip.cell-doc-link-broken {
  background: rgba(201, 50, 50, 0.13);
}
html[data-native] .chat-tool-row.is-error .chat-tool-name, html[data-native] .tasks-err, html[data-native] .kanban-mini-danger, html[data-native] .cell-doc-save-err {
  color: #E89B97;
}
html[data-native] .cell-doc-save-dirty, html[data-native] .dp-trigger.is-today {
  color: #E0B96A;
}
html[data-native] .sys-msg-assistant {
  border-left-color: #8FB07A;
}
html[data-native] .cell-card--draft:not(.cell-card--has-cover) {
  background-image: repeating-linear-gradient( 135deg, transparent 0, transparent 12px, rgba(255, 255, 255, 0.05) 12px, rgba(255, 255, 255, 0.05) 24px );
}
html[data-native] .cell-doc-modal, html[data-native] .kanban-modal {
  background: rgba(20, 19, 16, 0.85);
  -webkit-backdrop-filter: blur(24px) saturate(150%);
  backdrop-filter: blur(24px) saturate(150%);
}
html[data-native] .section-feedback, html[data-native] .book-cover-tile, html[data-native] .bk-hero-cover, html[data-native] .bk-now-card, html[data-native] .bk-float-btn, html[data-native] .bk-chips, html[data-native] .bk-chap-row, html[data-native] .bk-bigstat, html[data-native] .bk-arch-panel, html[data-native] .bk-insights-panel, html[data-native] .bk-heatmap-panel, html[data-native] .bk-eor, html[data-native] .bk-eor-quote, html[data-native] .bk-eor-reflection, html[data-native] .bk-eor-next-card:not(.bk-eor-next-primary), html[data-native] .bk-ritual-continue, html[data-native] .bk-ritual-card, html[data-native] .bk-ritual-primer, html[data-native] .cc-msg, html[data-native] .mg-note, html[data-native] .mg-focus-slot, html[data-native] .lr-pullquote, html[data-native] .lr-aside, html[data-native] .mg-graph-svg-wrap, html[data-native] #gloss-popover, html[data-native] #hl-popover {
  -webkit-backdrop-filter: blur(12px) saturate(160%);
  backdrop-filter: blur(12px) saturate(160%);
}
html[data-native] .mg-graph-edge {
  stroke-opacity: 0.7;
}
html[data-native] .mg-graph-hub circle {
  stroke-width: 2;
}
html[data-native] .mg-graph-label {
  fill: var(--ink-900);
  stroke: rgba(20, 19, 16, 0.85);
}
html[data-native] .bk-eor {
  border-color: var(--brand);
}
html[data-native] .bk-ritual-continue {
  border-color: var(--brand);
}
html[data-native] .bk-bigstat.is-accent {
  border-color: var(--brand);
}
html[data-native] .mg-focus-slot {
  border-color: var(--brand);
}
html[data-native] .bk-page-eyebrow, html[data-native] .bk-eb-eta, html[data-native] .mg-list-head, html[data-native] .bk-bigstat-label, html[data-native] .bk-stats-panel-head {
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}
html[data-native] .gloss:hover, html[data-native] .gloss.gloss--current {
  background: rgba(184, 134, 75, 0.18);
  outline-color: rgba(184, 134, 75, 0.34);
  border-bottom-color: oklch(70% 0.10 60);
}
html[data-native] #gloss-popover {
  background: rgba(28, 25, 22, 0.92);
  border-color: var(--border-strong);
}
a {
  transition: color 0.12s ease, background 0.12s ease, border-color 0.12s ease;
}
.book-prose {
  font-family: var(--font-serif);
  font-optical-sizing: auto;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.book-prose h1 {
  font-size: 56px;
  font-weight: 600;
  line-height: 1.0;
  letter-spacing: -0.02em;
  margin: 0 0 16px;
}
.book-prose h2 {
  font-size: 52px;
  font-weight: 600;
  line-height: 1.0;
  letter-spacing: -0.02em;
  margin: 48px 0 20px;
  padding-top: 32px;
  border-top: 1px solid var(--color-line);
}
.book-prose h2:first-of-type {
  margin-top: 16px;
  padding-top: 0;
  border-top: none;
}
.book-prose h3 {
  font-size: 28px;
  font-weight: 600;
  margin: 32px 0 12px;
  letter-spacing: -0.01em;
  line-height: 1.1;
}
.book-prose p {
  font-size: 22px;
  line-height: 1.25;
  margin: 0 0 18px;
  color: var(--color-ink);
}
.book-prose p:first-of-type {
  font-size: 23px;
  line-height: 1.2;
}
.book-prose strong {
  font-weight: 600;
}
.book-prose em {
  font-style: italic;
}
.book-prose ul, .book-prose ol {
  margin: 0 0 16px;
  padding-left: 24px;
}
.book-prose li {
  font-size: 22px;
  margin-bottom: 4px;
  line-height: 1.25;
}
.book-prose blockquote {
  margin: 18px 0;
  padding: 8px 16px;
  border-left: 3px solid var(--color-ink);
  background: var(--color-paper-soft);
  font-style: italic;
}
.book-prose hr {
  border: none;
  border-top: 1px solid var(--color-line);
  margin: 32px 0;
}
.book-prose a {
  color: var(--color-ink);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.book-prose code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 14px;
  padding: 1px 5px;
  border-radius: 3px;
  background: var(--color-paper-soft);
}
.bk-acts {
  display: flex;
  flex-direction: column;
}
.bk-preface {
  margin-bottom: 8px;
}
.bk-act {
  scroll-margin-top: 24px;
}
.bk-act-heading {
  margin-bottom: 8px;
}
.bk-pieces {
  display: flex;
  flex-direction: column;
}
.bk-piece {
  opacity: 0.22;
  transition: opacity 220ms ease;
  padding: 4px 0 8px;
}
.bk-pieces:hover .bk-piece {
  opacity: 0.22;
}
.bk-pieces .bk-piece:hover {
  opacity: 1;
}
.book-prose.has-acts .bk-act-heading > h2 {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}
@media (hover: none) {
  .bk-piece {
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .bk-piece {
    transition: none;
  }
}
@property --tw-rotate-x {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-y {
  syntax: "*";
  inherits: false;
}
@property --tw-rotate-z {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-x {
  syntax: "*";
  inherits: false;
}
@property --tw-skew-y {
  syntax: "*";
  inherits: false;
}
@property --tw-space-y-reverse {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}
@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-leading {
  syntax: "*";
  inherits: false;
}
@property --tw-font-weight {
  syntax: "*";
  inherits: false;
}
@property --tw-tracking {
  syntax: "*";
  inherits: false;
}
@property --tw-ordinal {
  syntax: "*";
  inherits: false;
}
@property --tw-slashed-zero {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-figure {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false;
}
@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false;
}
@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
  syntax: "*";
  inherits: false;
}
@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}
@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}
@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}
@property --tw-blur {
  syntax: "*";
  inherits: false;
}
@property --tw-brightness {
  syntax: "*";
  inherits: false;
}
@property --tw-contrast {
  syntax: "*";
  inherits: false;
}
@property --tw-grayscale {
  syntax: "*";
  inherits: false;
}
@property --tw-hue-rotate {
  syntax: "*";
  inherits: false;
}
@property --tw-invert {
  syntax: "*";
  inherits: false;
}
@property --tw-opacity {
  syntax: "*";
  inherits: false;
}
@property --tw-saturate {
  syntax: "*";
  inherits: false;
}
@property --tw-sepia {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false;
}
@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}
@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@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-space-y-reverse: 0;
      --tw-border-style: solid;
      --tw-leading: initial;
      --tw-font-weight: initial;
      --tw-tracking: initial;
      --tw-ordinal: initial;
      --tw-slashed-zero: initial;
      --tw-numeric-figure: initial;
      --tw-numeric-spacing: initial;
      --tw-numeric-fraction: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
      --tw-outline-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
    }
  }
}