/* app/styles.css */
/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
@layer properties;
@layer theme, base, components, utilities;

@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --spacing: .25rem;
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}

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

  ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  ::-webkit-file-upload-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

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

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

  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 {
    position: relative;
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
  }

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

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

  :-moz-focusring {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

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

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

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

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

  ::-webkit-file-upload-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

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

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

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

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

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

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

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

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

  ::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 {
    text-align: inherit;
    min-height: 1lh;
  }

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

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

  ::-webkit-datetime-edit {
    padding-block-start: 0;
    padding-block-end: 0;
  }

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

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

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

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

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

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

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

  ::-webkit-datetime-edit-meridiem-field {
    padding-block-start: 0;
    padding-block-end: 0;
  }

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

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

  button {
    appearance: button;
  }

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

  ::-webkit-file-upload-button {
    appearance: button;
  }

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

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

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

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

@layer utilities {
  .collapse {
    visibility: collapse;
  }

  .invisible {
    visibility: hidden;
  }

  .visible {
    visibility: visible;
  }

  .absolute {
    position: absolute;
  }

  .fixed {
    position: fixed;
  }

  .relative {
    position: relative;
  }

  .static {
    position: static;
  }

  .sticky {
    position: sticky;
  }

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

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

  .top-20\/20 {
    top: 100%;
  }

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

  .\!container {
    width: 100% !important;

    @media (width >= 40rem) {
      & {
        max-width: 40rem !important;
      }
    }

    @media (width >= 48rem) {
      & {
        max-width: 48rem !important;
      }
    }

    @media (width >= 64rem) {
      & {
        max-width: 64rem !important;
      }
    }

    @media (width >= 80rem) {
      & {
        max-width: 80rem !important;
      }
    }

    @media (width >= 96rem) {
      & {
        max-width: 96rem !important;
      }
    }
  }

  .container {
    width: 100%;

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

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

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

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

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

  .block {
    display: block;
  }

  .contents {
    display: contents;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .inline {
    display: inline;
  }

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

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

  .table {
    display: table;
  }

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

  .resize {
    resize: both;
  }

  .overflow-hidden {
    overflow: hidden;
  }

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

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

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

  .lowercase {
    text-transform: lowercase;
  }

  .uppercase {
    text-transform: uppercase;
  }

  .italic {
    font-style: italic;
  }

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

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

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

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

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

:root {
  --bg: #0a0b0e;
  --bg-2: #0e1014;
  --panel: #121419;
  --panel-2: #15181e;
  --line: #23262e;
  --line-2: #2c303a;
  --ink: #fff;
  --ink-dim: #e8e4da;
  --muted: #e2e5ea;
  --faint: #b8bdc7;
  --up: #4ad991;
  --up-glow: #4ad99129;
  --down: #ff6a6a;
  --down-glow: #ff6a6a29;
  --accent: #f2b441;
  --accent-2: #6ea8fe;
  --hi: 255, 255, 255;
  --btn-fg: #0a0b0e;
  --on-accent: #0b0d10;
  --font-display: "Instrument Serif", Georgia, serif;
  --amber: var(--accent);
  --surface: var(--panel);
}

:root[data-theme="light"] {
  --bg: #f4f2ec;
  --bg-2: #eae7dd;
  --panel: #fbfaf6;
  --panel-2: #f1eee6;
  --line: #e0dccf;
  --line-2: #cfc9b8;
  --ink: #14161b;
  --ink-dim: #33373f;
  --muted: #454b56;
  --faint: #6b717c;
  --up: #12965c;
  --up-glow: #12965c26;
  --down: #d83a3a;
  --down-glow: #d83a3a21;
  --accent: #b07714;
  --accent-2: #2f6fe0;
  --hi: 10, 11, 14;
  --btn-fg: #f7f6f2;
  --on-accent: #fff;
  --amber: var(--accent);
  --surface: var(--panel);
}

* {
  box-sizing: border-box;
}

input, select, textarea {
  min-width: 0;
  max-width: 100%;
}

label {
  min-width: 0;
}

html, body, #root {
  height: 100%;
}

body {
  background-color: var(--bg);
  background-image: radial-gradient(900px 500px at 88% -8%, #f2b4410f, transparent 60%), radial-gradient(800px 600px at -5% 105%, #6ea8fe0d, transparent 55%), linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  letter-spacing: 0;
  margin: 0;
  font-family: Atkinson Hyperlegible, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  font-weight: 400;
}

body:after {
  content: "";
  position: fixed;
  z-index: 9999;
  pointer-events: none;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' /%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  inset: 0;
}

.mono {
  font-feature-settings: "tnum" 1;
  font-family: Geist Mono, ui-monospace, monospace;
}

.serif {
  font-family: Instrument Serif, Georgia, serif;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-thumb {
  background: var(--line-2);
  border-radius: 6px;
}

::-webkit-scrollbar-track {
  background: none;
}

.panel {
  background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  border: 1px solid var(--line);
  border-radius: 10px;
  min-width: 0;
}

.panel-head {
  display: flex;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items:  center;
  gap: 8px;
  padding: 10px 14px;
}

.panel-title {
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--ink);
  font-size: 11px;
  font-weight: 600;
}

.eyebrow {
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--faint);
  font-size: 10.5px;
}

.price {
  border-radius: 5px;
  padding: 0 2px;
  transition: color .15s;
}

.price.up {
  color: var(--up);
  animation: flashUp .45s ease;
}

.price.down {
  color: var(--down);
  animation: flashDown .45s ease;
}

@keyframes flashUp {
  0% {
    background: var(--up-glow);
  }

  100% {
    background: none;
  }
}

@keyframes flashDown {
  0% {
    background: var(--down-glow);
  }

  100% {
    background: none;
  }
}

.pos {
  color: var(--up);
}

.neg {
  color: var(--down);
}

.dot {
  display: inline-block;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.dot.live {
  background: var(--up);
  box-shadow: 0 0 0 0 var(--up-glow);
  animation: pulse 2s infinite;
}

.dot.dead {
  background: var(--down);
}

.dot.warn {
  background: var(--amber, #d97706);
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 #4ad99173;
  }

  70% {
    box-shadow: 0 0 0 7px #4ad99100;
  }

  100% {
    box-shadow: 0 0 #4ad99100;
  }
}

.chain {
  border-collapse: collapse;
  width: 100%;
}

.chain th {
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--faint);
  text-align: right;
  position: sticky;
  background: var(--panel-2);
  padding: 6px 8px;
  font-size: 10px;
  font-weight: 500;
  top: 0;
}

.chain td {
  text-align: right;
  border-top: 1px solid var(--line);
  padding: 5px 8px;
}

.chain .strike-cell {
  text-align: center;
  color: var(--ink-dim);
  background: rgba(var(--hi), .012);
  font-weight: 500;
}

.chain tr.atm {
  background: #f2b4410f;
}

.chain tr.atm .strike-cell {
  color: var(--accent);
}

.chain .ce {
  color: var(--up);
}

.chain .pe {
  color: var(--down);
}

.chain .vol {
  color: var(--muted);
  font-size: 11.5px;
}

.chain td.pickable {
  cursor: pointer;
}

.chain td.pickable:hover {
  background: rgba(var(--hi), .06);
  box-shadow: inset 0 -1px 0 var(--accent);
}

.chain.compact th {
  padding: 6px 8px;
  font-size: 9px;
}

.chain.compact td {
  padding: 5px 8px;
  font-size: 12px;
}

.chain.compact .vol {
  font-size: 10.5px;
}

.dtable {
  border-collapse: collapse;
  width: 100%;
  min-width: 560px;
}

.dtable th {
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--faint);
  text-align: left;
  position: sticky;
  z-index: 2;
  background: var(--panel-2);
  box-shadow: inset 0 -1px 0 var(--line);
  padding: 6px 10px;
  font-size: 10px;
  font-weight: 500;
  top: 0;
}

.dtable td {
  border-top: 1px solid var(--line);
  color: var(--ink-dim);
  padding: 6px 10px;
}

.dtable.bright td {
  color: var(--ink);
}

.positions-table {
  font-size: 14px;
}

.positions-table .sub-line {
  color: var(--ink-dim);
  font-size: 11.5px;
}

.dtable tbody tr:hover {
  background: rgba(var(--hi), .018);
}

.dtable tbody tr.row-click:hover {
  background: rgba(var(--hi), .04);
  box-shadow: inset 2px 0 0 var(--accent);
}

.dtable.compact th, .dtable.compact td {
  padding: 5px 8px;
}

.sub-line {
  color: var(--faint);
  white-space: nowrap;
  margin-top: 3px;
  font-size: 10.5px;
}

.sl-tag {
  display: inline-block;
  letter-spacing: .08em;
  text-transform: uppercase;
  border: 1px solid var(--line-2);
  color: var(--muted);
  vertical-align: middle;
  border-radius: 4px;
  margin-left: 5px;
  padding: 1px 5px;
  font-size: 9px;
  font-weight: 500;
}

.sl-tag.trailing {
  color: var(--accent);
  border-color: #f2b4414d;
}

.sl-tag.fixed {
  color: var(--muted);
}

.tag {
  display: inline-flex;
  border: 1px solid var(--line-2);
  color: var(--ink-dim);
  border-radius: 999px;
  align-items:  center;
  gap: 6px;
  padding: 2px 8px;
  font-size: 11px;
}

.tag.ce {
  color: var(--up);
  border-color: #4ad9914d;
}

.tag.pe {
  color: var(--down);
  border-color: #ff6a6a4d;
}

.btn {
  letter-spacing: .02em;
  color: var(--btn-fg);
  background: var(--ink);
  cursor: pointer;
  border: none;
  border-radius: 7px;
  padding: 8px 14px;
  transition: transform 80ms, opacity .15s;
  font-family: Atkinson Hyperlegible, sans-serif;
  font-size: 13px;
  font-weight: 500;
}

.btn:hover {
  opacity: .92;
}

.btn:active {
  transform: translateY(1px);
}

.btn:disabled {
  opacity: .5;
  cursor: default;
}

.input {
  background: var(--bg-2);
  border: 1px solid var(--line-2);
  color: var(--ink);
  outline: none;
  border-radius: 7px;
  width: 100%;
  padding: 8px 11px;
  transition: border-color .15s;
  font-family: Geist Mono, monospace;
  font-size: 14px;
}

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

.reveal {
  opacity: 0;
  animation: reveal .6s cubic-bezier(.2, .7, .2, 1) forwards;
  transform: translateY(8px);
}

@keyframes reveal {
  to {
    opacity: 1;
    transform: none;
  }
}

.dot.green {
  background: var(--up);
  box-shadow: 0 0 0 0 var(--up-glow);
  animation: pulse 1.6s infinite;
}

.dot.red {
  background: var(--down);
}

.dot.gray {
  background: var(--faint);
}

.dot.yellow {
  background: var(--accent);
}

.dot.blue {
  background: var(--accent-2);
}

.pill {
  display: inline-flex;
  letter-spacing: .6px;
  border: 1px solid var(--line-2);
  color: var(--muted);
  white-space: nowrap;
  background: none;
  border-radius: 999px;
  align-items:  center;
  gap: 6px;
  padding: 3px 9px;
  font-size: 10px;
}

.pill.nifty {
  color: var(--accent-2);
  border-color: #6ea8fe52;
}

.pill.sensex {
  color: var(--accent);
  border-color: #f2b44152;
}

.pill.ce {
  color: var(--up);
  border-color: #4ad99152;
}

.pill.pe {
  color: var(--down);
  border-color: #ff6a6a52;
}

.pill.solid-paper {
  color: var(--accent);
  background: #f2b44124;
  border-color: #0000;
}

.pill.solid-live {
  background: var(--down-glow);
  color: var(--down);
  border-color: #ff6a6a66;
}

.seg {
  display: inline-flex;
  background: var(--bg-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  gap: 2px;
  padding: 2px;
}

.seg button {
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  background: none;
  border: 0;
  border-radius: 6px;
  align-items:  center;
  gap: 6px;
  padding: 4px 10px;
  transition: all .12s;
  font-family: Geist Mono, monospace;
  font-size: 10.5px;
}

.seg button:hover {
  color: var(--ink-dim);
}

.seg button.on-paper {
  color: var(--accent);
  background: #f2b44124;
}

.seg button.on-live {
  background: var(--down-glow);
  color: var(--down);
}

.seg button.on {
  color: var(--accent-2);
  background: #6ea8fe24;
}

.strat-strip {
  overflow: visible;
  position: relative;
  z-index: 30;
}

.strat-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 10px 10px;
}

.strat-chip {
  position: relative;
  display: inline-flex;
  border: 1px solid var(--line-2);
  background: var(--bg-2);
  cursor: pointer;
  border-radius: 8px;
  align-items:  center;
  gap: 7px;
  padding: 5px 11px;
  font-size: 12px;
}

.strat-chip:hover, .strat-chip.pinned {
  border-color: var(--accent);
}

.strat-chip.off > :not(.strat-tip) {
  opacity: .45;
}

.strat-chip.off {
  border-color: var(--line);
}

.strat-chip .lots {
  color: var(--muted);
  font-size: 10.5px;
}

.strat-chip .side-dot {
  border-radius: 50%;
  flex: none;
  width: 7px;
  height: 7px;
}

.strat-chip .side-dot.ce {
  background: var(--up);
}

.strat-chip .side-dot.pe {
  background: var(--down);
}

.strat-chip .side-dot.both {
  background: linear-gradient(90deg, var(--up) 50%, var(--down) 50%);
}

.strat-tip {
  display: none;
  position: absolute;
  z-index: 300;
  background: var(--bg-2);
  border: 1px solid var(--line-2);
  white-space: normal;
  cursor: text;
  border-radius: 10px;
  width: 360px;
  max-width: 78vw;
  padding: 11px 13px;
  font-size: 11.5px;
  line-height: 1.55;
  top: calc(100% + 8px);
  left: 0;
  box-shadow: 0 12px 32px #00000080;
}

.strat-chip:hover .strat-tip, .strat-chip.pinned .strat-tip {
  display: block;
}

.strat-chip:last-child .strat-tip, .strat-chip:nth-last-child(2) .strat-tip {
  left: auto;
  right: 0;
}

.strat-tip .tip-head {
  display: block;
  color: var(--ink);
  margin-bottom: 6px;
  font-weight: 600;
}

.strat-tip .tip-inst {
  float: right;
  color: var(--muted);
  font-size: 10.5px;
  font-weight: 400;
}

.strat-tip .tip-line {
  display: block;
  color: var(--ink-dim);
  margin-top: 3px;
}

.strat-tip .tip-line:before {
  content: "· ";
  color: var(--faint);
}

.dhan {
  display: inline-flex;
  cursor: pointer;
  border: 1px solid var(--line);
  background: var(--bg-2);
  letter-spacing: .5px;
  color: var(--muted);
  white-space: nowrap;
  border-radius: 8px;
  align-items:  center;
  gap: 8px;
  padding: 5px 11px;
  transition: all .12s;
  font-size: 10.5px;
}

.dhan:hover {
  border-color: var(--line-2);
  color: var(--ink-dim);
}

.dhan .dhan-name {
  color: var(--ink-dim);
}

.dhan .dhan-funds {
  color: var(--up);
}

.dhan.connected {
  border-color: #4ad9914d;
}

.cbx {
  border: 1px solid var(--line-2);
  background: var(--bg-2);
  cursor: pointer;
  display: inline-flex;
  border-radius: 3px;
  flex: none;
  justify-content: center;
  align-items:  center;
  width: 15px;
  height: 15px;
  transition: all .1s;
}

.cbx:hover {
  border-color: var(--accent-2);
}

.cbx.on, .cbx.dash {
  background: var(--accent-2);
  border-color: var(--accent-2);
}

.cbx svg {
  color: #fff;
  opacity: 0;
  width: 10px;
  height: 10px;
}

.cbx.on svg, .cbx.dash svg {
  opacity: 1;
}

.status-toggle {
  background: var(--line);
  border: 1px solid var(--line-2);
  position: relative;
  cursor: pointer;
  display: inline-block;
  border-radius: 10px;
  flex: none;
  width: 34px;
  height: 18px;
  transition: all .14s;
}

.status-toggle:after {
  content: "";
  position: absolute;
  background: var(--muted);
  border-radius: 50%;
  width: 12px;
  height: 12px;
  transition: all .14s;
  top: 2px;
  left: 2px;
}

.status-toggle.on {
  background: var(--up-glow);
  border-color: #4ad99180;
}

.status-toggle.on:after {
  background: var(--up);
  left: 16px;
}

.status-toggle.on.live {
  background: var(--down-glow);
  border-color: #ff6a6a8c;
}

.status-toggle.on.live:after {
  background: var(--down);
}

.stepper {
  display: inline-flex;
  border: 1px solid var(--line);
  background: var(--bg-2);
  overflow: hidden;
  border-radius: 4px;
  align-items:  center;
  height: 26px;
}

.stepper button {
  color: var(--muted);
  cursor: pointer;
  display: flex;
  background: none;
  border: 0;
  justify-content: center;
  align-items:  center;
  width: 22px;
  height: 100%;
  padding: 0;
  transition: all .1s;
  font-size: 13px;
}

.stepper button:hover {
  background: var(--line);
  color: var(--ink);
}

.stepper input {
  text-align: center;
  color: var(--ink);
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
  background: none;
  width: 34px;
  height: 100%;
  font-family: Geist Mono, monospace;
  font-size: 12px;
}

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

.overlay {
  position: fixed;
  z-index: 2000;
  display: flex;
  background: #0009;
  inset: 0;
}

.overlay.center {
  justify-content: center;
  align-items:  center;
}

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

.modal {
  background: var(--panel);
  border: 1px solid var(--line-2);
  display: flex;
  animation: pop .14s ease-out;
  border-radius: 10px;
  flex-direction: column;
  width: min(440px, 92vw);
  max-height: 92dvh;
  box-shadow: 0 8px 40px #000000b3;
}

@keyframes pop {
  from {
    transform: scale(.97);
    opacity: 0;
  }

  to {
    transform: scale(1);
    opacity: 1;
  }
}

.drawer {
  background: var(--panel);
  border-left: 1px solid var(--line-2);
  display: flex;
  animation: slidein .18s ease-out;
  flex-direction: column;
  width: min(460px, 100vw);
  height: 100dvh;
  box-shadow: -10px 0 40px #00000080;
}

@keyframes slidein {
  from {
    transform: translateX(30px);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.modal-hd, .drawer-hd {
  display: flex;
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  align-items:  center;
  padding: 11px 16px;
}

.modal-hd h3, .drawer-hd h3 {
  letter-spacing: .4px;
  color: var(--ink);
  margin: 0;
  font-size: 13px;
  font-weight: 600;
}

.modal-hd .sub, .drawer-hd .sub {
  color: var(--muted);
  letter-spacing: .5px;
  text-transform: uppercase;
  margin-top: 3px;
  font-size: 10px;
}

.x-btn {
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  background: none;
  border: 0;
  padding: 4px;
  font-size: 16px;
  line-height: 1;
}

.x-btn:hover {
  color: var(--ink);
}

.x-btn svg {
  width: 16px;
  height: 16px;
}

.modal-body {
  overflow-y: auto;
  min-height: 0;
  padding: 14px;
}

.drawer-body {
  overflow-y: auto;
  flex: 1;
  padding: 12px 16px;
}

.trade-detail-grid {
  display: flex;
  flex-wrap: wrap;
  align-items:  flex-start;
  gap: 16px 20px;
}

.trade-detail-grid > .td-pane {
  overflow: visible;
  min-width: 0;
}

.trade-detail-grid > .td-pane:first-child {
  flex: 0 0 calc(40% - 10px);
  max-width: calc(40% - 10px);
}

.trade-detail-grid > .td-pane:last-child {
  flex: calc(60% - 10px);
  min-width: 0;
}

.trade-detail-grid > .td-pane:first-child .td-facts {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.trade-detail-grid > .td-pane:first-child .td-facts .drow-val {
  word-break: break-word;
  white-space: normal;
  text-align: right;
  max-width: 62%;
}

.trade-detail-candles {
  width: 100%;
  min-width: 0;
  margin-top: 4px;
}

@media (width <= 900px) {
  .trade-detail-grid > .td-pane:first-child, .trade-detail-grid > .td-pane:last-child {
    flex: 100%;
    max-width: 100%;
  }
}

.modal-ft, .drawer-ft {
  display: flex;
  border-top: 1px solid var(--line);
  justify-content: flex-end;
  gap: 10px;
  padding: 10px 16px;
}

.toast-wrap {
  position: fixed;
  z-index: 3000;
  display: flex;
  flex-direction: column;
  align-items:  center;
  gap: 8px;
  bottom: 22px;
  left: 50%;
  transform: translateX(-50%);
}

.toast {
  background: var(--panel-2);
  border: 1px solid var(--line-2);
  color: var(--ink);
  animation: pop .14s;
  display: flex;
  border-radius: 8px;
  align-items:  center;
  gap: 9px;
  padding: 7px 13px;
  font-size: 11.5px;
  box-shadow: 0 8px 40px #000000b3;
}

.toast.ok {
  border-color: #4ad99166;
}

.toast.warn {
  border-color: #f2b44166;
}

.field {
  margin-bottom: 10px;
}

.field label {
  display: block;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
  font-size: 10.5px;
}

.field input[type="text"], .field input[type="password"], .field input[type="number"], .field input:not([type]) {
  background: var(--bg-2);
  border: 1px solid var(--line);
  color: var(--ink);
  outline: none;
  border-radius: 6px;
  width: 100%;
  padding: 7px 10px;
  transition: all .12s;
  font-size: 13px;
}

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

.field .hint {
  color: var(--faint);
  margin-top: 6px;
  font-size: 10.5px;
}

.warnbox {
  border: 1px solid var(--down);
  color: var(--down);
  background: #ff6a6a14;
  border-radius: 6px;
  margin-top: 4px;
  padding: 8px 11px;
  font-size: 11.5px;
}

.btn.primary {
  background: var(--accent);
  color: var(--on-accent);
  border-color: var(--accent);
}

.btn.primary:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.riskstrip-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  gap: 0;
  padding: 6px 10px;
}

.riskstrip-row.dash-book {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 10px;
  padding: 5px 6px;
}

.riskstrip-row.dash-book .riskstrip-cell {
  min-width: 0;
  padding: 0 8px;
}

.riskstrip-row.dash-book .rs-val {
  font-size: 12.5px;
}

@media (width <= 720px) {
  .riskstrip-row.dash-book {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 4px;
  }

  .riskstrip-row.dash-book .riskstrip-cell:nth-child(odd) {
    border-left: 0;
  }
}

.riskstrip-cell {
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  padding: 0 10px;
}

.riskstrip-cell + .riskstrip-cell {
  border-left: 1px solid var(--line);
}

.riskstrip-cell .eyebrow {
  letter-spacing: .18em;
  font-size: 9px;
}

.riskstrip-cell {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.riskstrip-cell .eyebrow {
  flex: none;
}

.rs-val {
  display: flex;
  align-items: baseline;
  gap: 5px;
  min-width: 0;
  font-size: 13px;
  line-height: 1.2;
}

.rs-val em {
  color: var(--faint);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 9.5px;
  font-style: normal;
}

.rs-val .riskstrip-bar {
  display: inline-block;
  flex: none;
  width: 34px;
}

.rs-actions {
  display: flex;
  white-space: nowrap;
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items:  center;
  gap: 5px;
  min-width: 0;
}

.rs-actions .btn {
  border-radius: 5px;
  padding: 4px 8px;
  font-size: 10.5px;
  line-height: 1;
}

.rs-actions .btn.kill {
  gap: 4px;
}

.rs-actions > * {
  flex: none;
}

.riskstrip-cell:not(button) {
  cursor: default;
}

.riskstrip-bar {
  background: var(--bg-2);
  overflow: hidden;
  border-radius: 4px;
  width: 100%;
  height: 4px;
}

.riskstrip-fill {
  height: 100%;
  transition: width .2s;
}

.riskstrip-fill.muted {
  background: var(--muted);
}

.riskstrip-fill.accent {
  background: var(--accent);
}

.riskstrip-fill.down {
  background: var(--down);
}

.btn.kill {
  display: inline-flex;
  align-items:  center;
  gap: 6px;
}

.btn.kill.on {
  border-color: var(--down);
  color: var(--down);
  background: #ff6a6a1f;
}

.forensics {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}

.forensics .up {
  color: var(--up);
}

.forensics .dn {
  color: var(--down);
}

.fx-empty {
  color: var(--faint);
  padding: 6px 2px;
  font-size: 11.5px;
}

.fx-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}

.fx-title {
  font-family: var(--mono, ui-monospace, monospace);
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: var(--accent);
  font-size: 9px;
}

.fx-verdict {
  font-family: var(--mono, ui-monospace, monospace);
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-size: 11px;
}

.fx-beats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 10px;
}

.fx-beat {
  background: var(--panel);
  border: 1px solid var(--line);
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  padding: 11px 12px;
}

.fx-beat.in {
  border-top: 2px solid var(--up);
}

.fx-beat.out {
  border-top: 2px solid var(--down);
}

.fx-beat-lab {
  font-family: var(--mono, ui-monospace, monospace);
  letter-spacing: .7px;
  text-transform: uppercase;
  color: var(--faint);
  display: flex;
  justify-content: space-between;
  align-items:  center;
  gap: 8px;
  margin-bottom: 7px;
  font-size: 9px;
}

.fx-beat-lab b {
  color: var(--muted);
  font-weight: 600;
}

.xplot {
  float: right;
  margin: -2px 0 2px 8px;
}

.xread {
  font-family: var(--mono, ui-monospace, monospace);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  line-height: 1.5;
}

.xread .kd {
  color: var(--faint);
}

.xread b {
  color: var(--ink);
}

.fx-meta {
  font-family: var(--mono, ui-monospace, monospace);
  color: var(--faint);
  display: flex;
  clear: both;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
  font-size: 10.5px;
}

.fx-meta b {
  color: var(--muted);
  font-weight: 600;
}

.fx-recipe {
  font-family: var(--mono, ui-monospace, monospace);
  color: var(--faint);
  margin-top: 7px;
  font-size: 9.5px;
}

.fx-recipe span {
  color: var(--up);
  margin-left: 5px;
}

.fx-recipe span:before {
  content: "✓ ";
}

.fx-journey {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 12px 14px 10px;
}

.fx-journey-lab {
  font-family: var(--mono, ui-monospace, monospace);
  letter-spacing: .7px;
  text-transform: uppercase;
  color: var(--faint);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
  font-size: 9px;
}

.fx-journey-lab .draw {
  color: var(--down);
}

.fx-track {
  position: relative;
  padding-bottom: 26px;
}

.journey-svg {
  display: block;
}

.jl {
  position: absolute;
  font-family: var(--mono, ui-monospace, monospace);
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-size: 10px;
}

.jl b {
  color: var(--ink);
}

.jl-entry {
  bottom: 12px;
  left: 0;
}

.jl-peak {
  color: var(--up);
  top: -2px;
  left: 42%;
}

.jl-exit {
  color: var(--down);
  text-align: right;
  bottom: 12px;
  right: 0;
}

.jl-stop {
  color: var(--accent);
  font-size: 9.5px;
  bottom: 0;
  right: 0;
}

.fx-trail {
  background: var(--panel);
  border: 1px solid var(--line);
  overflow-x: auto;
  border-radius: 10px;
  padding: 12px 14px;
}

.fx-trail-lab {
  font-family: var(--mono, ui-monospace, monospace);
  letter-spacing: .7px;
  text-transform: uppercase;
  color: var(--faint);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
  font-size: 9px;
}

.fx-trail-lab .muted {
  text-transform: none;
  letter-spacing: 0;
  color: var(--muted);
}

.fx-trail-tbl {
  border-collapse: collapse;
  table-layout: fixed;
  font-variant-numeric: tabular-nums;
  width: 100%;
  font-size: 11px;
}

.fx-trail-tbl th {
  color: var(--faint);
  text-align: right;
  border-bottom: 1px solid var(--line);
  padding: 3px 6px;
  font-weight: 500;
}

.fx-trail-tbl th:first-child {
  text-align: left;
  width: 64px;
}

.fx-trail-tbl th:nth-child(2) {
  text-align: left;
  width: 34%;
}

.fx-trail-tbl th:nth-child(3), .fx-trail-tbl th:nth-child(4), .fx-trail-tbl th:nth-child(5), .fx-trail-tbl th:nth-child(6), .fx-trail-tbl th:nth-child(7) {
  width: 11%;
}

.fx-trail-tbl td {
  text-align: right;
  color: var(--muted);
  white-space: nowrap;
  vertical-align: top;
  padding: 4px 6px;
}

.fx-trail-tbl td:first-child {
  text-align: left;
}

.fx-trail-tbl td:nth-child(2) {
  text-align: left;
  color: var(--ink);
  white-space: normal;
  word-break: break-word;
}

.fx-trail-tbl td .sig-stack {
  display: flex;
  flex-direction: column;
  align-items:  flex-start;
  gap: 1px;
  line-height: 1.25;
}

.fx-trail-tbl td .sig-stack b {
  color: var(--ink);
  font-weight: 700;
}

.fx-trail-tbl td .muted {
  color: var(--faint);
  font-size: 10px;
}

.fx-trail-tbl .up {
  color: var(--up);
}

.fx-trail-tbl .dn {
  color: var(--down);
}

.fx-trail-tbl tr.ph-in td {
  background: var(--up);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--up) 12%, transparent);
    }
  }
}

.fx-trail-tbl tr.ph-out td {
  background: var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--down) 12%, transparent);
    }
  }
}

.fx-trail-tbl tr.ph-pre td {
  color: var(--faint);
}

.trail-detail {
  background: var(--panel-2);
  border: 1px solid var(--line-2);
  display: grid;
  border-radius: 9px;
  gap: 8px;
  margin: 4px 0 6px;
  padding: 10px 12px;
}

.trail-summary {
  display: flex;
  color: var(--ink);
  flex-wrap: wrap;
  gap: 14px;
  font-size: 11.5px;
}

.trail-summary > span {
  white-space: nowrap;
}

.trail-rows {
  display: grid;
  gap: 2px;
}

.trail-row {
  display: grid;
  grid-template-columns: 72px minmax(72px, max-content) minmax(70px, 100px) minmax(0, 1fr) minmax(64px, auto);
  align-items: baseline;
  gap: 8px 10px;
  padding: 3px 0;
  font-size: 11.5px;
}

.trail-t {
  color: var(--faint);
  white-space: nowrap;
}

.trail-move {
  text-align: right;
  color: var(--ink);
  white-space: nowrap;
}

.trail-desc {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.trail-ltp {
  color: var(--faint);
  white-space: nowrap;
  text-align: right;
  font-size: 10.5px;
}

.trail-badge {
  letter-spacing: .06em;
  text-transform: uppercase;
  border: 1px solid var(--line-2);
  color: var(--muted);
  text-align: center;
  white-space: nowrap;
  border-radius: 4px;
  justify-self: start;
  padding: 1px 6px;
  font-size: 9px;
  font-weight: 500;
}

@media (width <= 1100px) {
  .trail-row {
    grid-template-columns: 64px minmax(64px, auto) minmax(60px, 90px) minmax(0, 1fr);
    grid-template-areas: "t badge move ltp" "desc desc desc desc";
  }

  .trail-row .trail-t {
    grid-area: t;
  }

  .trail-row .trail-badge {
    grid-area: badge;
  }

  .trail-row .trail-move {
    grid-area: move;
  }

  .trail-row .trail-desc {
    grid-area: desc;
    white-space: normal;
  }

  .trail-row .trail-ltp {
    grid-area: ltp;
  }
}

.trail-badge.trail {
  color: var(--accent);
  border-color: #f2b4414d;
}

.trail-badge.held {
  color: var(--faint);
}

.trail-badge.exit {
  color: var(--ink);
  border-color: var(--line-2);
}

.trail-exit {
  border-top: 1px dashed var(--line-2);
  margin-top: 3px;
  padding-top: 5px;
}

.trail-empty {
  color: var(--faint);
  font-size: 11.5px;
}

.trail-live {
  border-top: 1px solid var(--line-2);
  padding-top: 7px;
  font-size: 12px;
}

.trail-spark {
  display: block;
}

.trail-chevron {
  cursor: pointer;
  color: var(--faint);
  background: none;
  border: 0;
  padding: 0 4px;
  font-size: 10px;
  line-height: 1;
}

.trail-chevron:hover, .chain-chart-btn:hover {
  color: var(--accent);
}

.md-body {
  color: var(--ink);
}

.md-body:-webkit-full-screen {
  background: var(--bg);
  overflow: auto;
  padding: 28px 8vw;
}

.md-body:fullscreen {
  background: var(--bg);
  overflow: auto;
  padding: 28px 8vw;
}

.md-body pre {
  position: relative;
  cursor: copy;
}

.md-body pre:hover:after {
  content: "click to copy";
  position: absolute;
  color: var(--faint);
  font-size: 10px;
  top: 6px;
  right: 8px;
}

.md-body pre[data-copied]:after {
  content: "copied ✓";
  position: absolute;
  color: var(--up);
  font-size: 10px;
  top: 6px;
  right: 8px;
}

.md-body > :first-child {
  margin-top: 0;
}

.md-body h1 {
  letter-spacing: -.01em;
  margin: 18px 0 10px;
  font-size: 21px;
  font-weight: 650;
}

.md-body h2 {
  border-bottom: 1px solid var(--line);
  margin: 22px 0 8px;
  padding-bottom: 5px;
  font-size: 16px;
  font-weight: 600;
}

.md-body h3 {
  color: var(--muted);
  margin: 16px 0 6px;
  font-size: 13.5px;
  font-weight: 600;
}

.md-body h4 {
  color: var(--muted);
  margin: 12px 0 4px;
  font-size: 12.5px;
  font-weight: 600;
}

.md-body p {
  margin: 8px 0;
}

.md-body ul, .md-body ol {
  margin: 8px 0;
  padding-left: 22px;
}

.md-body li {
  margin: 3px 0;
}

.md-body a {
  color: var(--accent);
  text-decoration: none;
}

.md-body a:hover {
  text-decoration: underline;
}

.md-body strong {
  color: var(--ink);
  font-weight: 650;
}

.md-body hr {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 18px 0;
}

.md-body code {
  background: rgba(var(--hi), .06);
  border: 1px solid var(--line);
  border-radius: 5px;
  padding: 1px 5px;
  font-family: ui-monospace, SF Mono, Menlo, monospace;
  font-size: .85em;
}

.md-body pre {
  background: rgba(var(--hi), .035);
  border: 1px solid var(--line-2);
  overflow-x: auto;
  border-radius: 9px;
  margin: 10px 0;
  padding: 12px 14px;
}

.md-body pre code {
  background: none;
  border: 0;
  padding: 0;
  font-size: 12px;
}

.md-body blockquote {
  border-left: 3px solid var(--accent);
  background: rgba(var(--hi), .02);
  color: var(--muted);
  border-radius: 0 6px 6px 0;
  margin: 10px 0;
  padding: 8px 14px;
}

.md-body table {
  border-collapse: collapse;
  width: 100%;
  margin: 12px 0;
  font-size: 12.5px;
}

.md-body th {
  text-align: left;
  border: 1px solid var(--line-2);
  background: rgba(var(--hi), .05);
  color: var(--ink);
  white-space: nowrap;
  padding: 7px 11px;
  font-weight: 600;
}

.md-body td {
  border: 1px solid var(--line);
  color: var(--ink-dim);
  vertical-align: top;
  padding: 6px 11px;
}

.md-body tbody tr:nth-child(2n) {
  background: rgba(var(--hi), .015);
}

.md-body td code {
  white-space: nowrap;
}

.app-shell {
  max-width: 1480px;
  margin: 0 auto;
  padding: 14px 16px 44px;
}

.app-shell > section > * {
  min-width: 0;
}

.split-2-3 {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.split-2-3 > * {
  flex-basis: calc(759240px - 99900%);
  min-width: 0;
}

.split-2-3 > :first-child {
  flex-grow: 1.55;
}

.split-2-3 > :last-child {
  flex-grow: 3.45;
}

.split-chain-pos {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.split-chain-pos > * {
  flex-basis: calc(759240px - 99900%);
  min-width: 0;
}

.split-chain-pos > :first-child {
  flex-grow: 2;
}

.split-chain-pos > :last-child {
  flex-grow: 3;
}

.panel.chain-fs:-webkit-full-screen {
  display: flex;
  background: var(--bg-2, var(--bg));
  box-sizing: border-box;
  border-radius: 0;
  flex-direction: column;
  width: 100vw;
  max-width: none;
  height: 100vh;
  padding: 12px 16px;
}

.panel.chain-fs:fullscreen {
  display: flex;
  background: var(--bg-2, var(--bg));
  box-sizing: border-box;
  border-radius: 0;
  flex-direction: column;
  width: 100vw;
  max-width: none;
  height: 100vh;
  padding: 12px 16px;
}

.panel.chain-fs:-webkit-full-screen {
  display: flex;
  background: var(--bg-2, var(--bg));
  box-sizing: border-box;
  border-radius: 0;
  flex-direction: column;
  width: 100vw;
  max-width: none;
  height: 100vh;
  padding: 12px 16px;
}

.panel.chain-fs:-webkit-full-screen .chain-body {
  resize: none;
  flex: 1;
  min-height: 0;
  height: auto !important;
}

.panel.chain-fs:fullscreen .chain-body {
  resize: none;
  flex: 1;
  min-height: 0;
  height: auto !important;
}

.panel.chain-fs:-webkit-full-screen .chain-body {
  resize: none;
  flex: 1;
  min-height: 0;
  height: auto !important;
}

.split-sidebar {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.split-sidebar > * {
  min-width: 0;
}

.split-sidebar > :first-child {
  flex: 280px;
}

.split-sidebar > :last-child {
  flex: 999 1 0;
  min-width: 50%;
}

.split-sidebar.bt > :first-child {
  flex-basis: 380px;
}

.multichart-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 1px;
}

@media (width <= 640px) {
  .app-shell {
    padding: 14px 12px 48px;
  }
}

@media (pointer: coarse) {
  .stepper button, .x-btn, .cbx {
    min-width: 32px;
    min-height: 32px;
  }
}

.rj-hd {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 10px;
  font-size: 11px;
  font-weight: 700;
}

.rj-strike {
  color: var(--faint);
  letter-spacing: .02em;
}

.rj-empty {
  color: var(--faint);
  font-size: 12px;
  line-height: 1.5;
}

.rj-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}

.rj-pct {
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
}

.rj-pct em {
  opacity: .6;
  margin-left: 1px;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
}

.rj-status {
  color: var(--muted);
  text-align: right;
  font-size: 11px;
}

.rj-status b {
  color: var(--down);
  font-weight: 700;
}

.rj-status.rj-armed {
  color: var(--up);
}

.rj-bar {
  background: rgba(var(--hi), .09);
  overflow: hidden;
  border-radius: 3px;
  height: 5px;
  margin: 8px 0 14px;
}

.rj-bar > i {
  display: block;
  border-radius: 3px;
  height: 100%;
  transition: width .35s cubic-bezier(.2,.7,.2,1);
}

.rj-gates {
  display: flex;
  position: relative;
  flex-direction: column;
}

.rj-gates:before {
  content: "";
  position: absolute;
  background: linear-gradient(var(--line-2), rgba(var(--hi), .02));
  width: 1px;
  top: 16px;
  bottom: 16px;
  left: 17px;
}

.rj-gate {
  display: grid;
  grid-template-columns: 20px 1fr auto;
  position: relative;
  border-radius: 7px;
  align-items:  center;
  gap: 11px;
  padding: 7px 8px;
}

.rj-glyph {
  display: grid;
  z-index: 1;
  background: var(--panel);
  box-shadow: 0 0 0 3px var(--panel);
  border-radius: 50%;
  place-items:  center;
  width: 18px;
  height: 18px;
  font-size: 10.5px;
  font-weight: 700;
}

.rj-gate.pass .rj-glyph {
  color: var(--up);
  background: var(--up);
  box-shadow: 0 0 0 3px var(--panel);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--up) 15%, var(--panel));
    }
  }
}

.rj-gate.fail .rj-glyph {
  color: var(--down);
  background: var(--down);
  box-shadow: 0 0 0 3px var(--panel);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--down) 18%, var(--panel));
    }
  }
}

.rj-gate.wait .rj-glyph {
  color: var(--faint);
}

.rj-label {
  color: var(--ink);
  font-size: 12px;
}

.rj-gate.pass .rj-label {
  color: var(--muted);
}

.rj-gate.wait .rj-label {
  color: var(--faint);
}

.rj-val {
  color: var(--faint);
  font-variant-numeric: tabular-nums;
  display: inline-flex;
  align-items:  center;
  gap: 7px;
  font-size: 11.5px;
}

.rj-gate.block {
  background: var(--down);
  box-shadow: inset 2px 0 0 var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--down) 9%, transparent);
    }
  }
}

.rj-gate.block .rj-label {
  color: var(--ink);
  font-weight: 600;
}

.rj-gate.block .rj-val {
  color: var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      color: color-mix(in srgb, var(--down) 70%, var(--ink));
    }
  }
}

.rj-tag {
  letter-spacing: .09em;
  color: var(--down);
  border: 1px solid var(--down);
  border-radius: 4px;
  padding: 1px 5px;
  font-size: 8.5px;
  font-weight: 700;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border: 1px solid color-mix(in srgb, var(--down) 40%, transparent);
    }
  }
}

.insight-strip {
  border: 1px solid var(--line);
  background: var(--panel);
  overflow: hidden;
  border-radius: 10px;
}

.insight-strip-head {
  display: flex;
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
  align-items:  center;
  gap: 10px;
  min-height: 36px;
  padding: 7px 10px;
}

.insight-title-group {
  display: flex;
  align-items:  center;
  gap: 8px;
  min-width: 0;
}

.insight-pulse-ring {
  background: var(--up);
  box-shadow: 0 0 0 0 var(--up-glow);
  position: relative;
  border-radius: 50%;
  flex: none;
  width: 8px;
  height: 8px;
}

.insight-pulse-ring:after {
  content: "";
  position: absolute;
  border: 1px solid var(--up);
  animation: insight-pulse 1.8s ease-out infinite;
  border-radius: 50%;
  inset: -3px;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border: 1px solid color-mix(in srgb, var(--up) 55%, transparent);
    }
  }
}

@keyframes insight-pulse {
  0% {
    transform: scale(.85);
    opacity: .9;
  }

  100% {
    transform: scale(1.9);
    opacity: 0;
  }
}

.insight-title {
  letter-spacing: .02em;
  color: var(--ink);
  white-space: nowrap;
  font-size: 11.5px;
  font-weight: 600;
}

.insight-head-right {
  display: flex;
  align-items:  center;
  gap: 6px;
  margin-left: auto;
}

.insight-book {
  display: inline-flex;
  background: var(--bg-2);
  border: 1px solid var(--line-2);
  border-radius: 7px;
  align-items: stretch;
  gap: 1px;
  padding: 2px;
}

.insight-book-tab {
  display: inline-flex;
  color: var(--muted);
  cursor: pointer;
  letter-spacing: .02em;
  white-space: nowrap;
  background: none;
  border: 0;
  border-radius: 5px;
  align-items:  center;
  gap: 5px;
  padding: 3px 8px;
  transition: background .12s, color .12s;
  font-size: 10.5px;
  line-height: 1.2;
}

.insight-book-tab:hover {
  color: var(--ink);
  background: rgba(var(--hi), .05);
}

.insight-book-tab:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.insight-book-tab.on {
  background: var(--ink);
  color: var(--btn-fg, #1a1a1a);
}

.insight-book-tab.on.live {
  background: var(--down);
  color: #fff;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--down) 88%, #000);
    }
  }
}

.insight-book-tab.on.paper {
  background: var(--accent);
  color: #fff;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--accent) 85%, #000);
    }
  }
}

.insight-book-label {
  text-transform: lowercase;
  font-weight: 600;
}

.insight-book-n {
  font-variant-numeric: tabular-nums;
  opacity: .72;
  text-align: right;
  min-width: .9em;
  font-size: 10px;
}

.insight-book-tab.on .insight-book-n {
  opacity: .85;
}

.insight-toggle {
  display: inline-grid;
  border: 1px solid var(--line-2);
  color: var(--muted);
  cursor: pointer;
  background: none;
  border-radius: 6px;
  place-items:  center;
  width: 24px;
  height: 24px;
  padding: 0;
  font-size: 11px;
  line-height: 1;
}

.insight-toggle:hover {
  color: var(--ink);
  border-color: var(--ink-dim);
}

.insight-count {
  color: var(--faint);
  font-size: 10.5px;
}

.ir-body {
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 0;
  max-height: 360px;
  padding: 6px 8px 8px;
}

.ir-body-chips {
  gap: 8px;
}

.ir-body::-webkit-scrollbar {
  width: 6px;
}

.ir-body::-webkit-scrollbar-thumb {
  background: rgba(var(--hi), .1);
  border-radius: 4px;
}

.ir-chip-row {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 5px;
}

.ir-chip {
  display: inline-flex;
  border: 1px solid var(--line-2);
  background: var(--bg-2);
  color: var(--ink);
  cursor: pointer;
  white-space: nowrap;
  border-radius: 999px;
  align-items:  center;
  gap: 6px;
  padding: 4px 8px 4px 7px;
  transition: border-color .12s, background .12s, box-shadow .12s;
  font-size: 10.5px;
  line-height: 1.15;
}

.ir-chip:hover {
  border-color: rgba(var(--hi), .22);
  background: rgba(var(--hi), .04);
}

.ir-chip:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.ir-chip.open {
  border-color: var(--accent);
  background: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--accent) 55%, var(--line-2));
    }
  }
}

.ir-chip.armed {
  border-color: var(--up);
  background: var(--up);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--up) 40%, var(--line-2));
    }
  }
}

.ir-chip.holding {
  border-color: var(--accent);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--accent) 45%, var(--line-2));
    }
  }
}

.ir-chip.live {
  box-shadow: inset 2px 0 0 var(--down);
}

.ir-chip-name {
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--ink);
  max-width: 148px;
  font-weight: 500;
}

.ir-chip-tf {
  letter-spacing: .04em;
  color: var(--faint);
  border: 1px solid var(--line-2);
  border-radius: 3px;
  padding: 0 4px;
  font-size: 8.5px;
}

.ir-chip-reg {
  display: inline-grid;
  background: rgba(var(--hi), .08);
  color: var(--muted);
  border-radius: 3px;
  place-items:  center;
  width: 14px;
  height: 14px;
  font-size: 8.5px;
  font-weight: 700;
}

.ir-chip-reg.strong {
  color: var(--up);
  background: var(--up);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--up) 12%, transparent);
    }
  }
}

.ir-chip-reg.weak {
  color: var(--accent);
  background: var(--accent);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--accent) 12%, transparent);
    }
  }
}

.ir-chip-pct {
  font-variant-numeric: tabular-nums;
  color: var(--muted);
  text-align: right;
  min-width: 2.4em;
  font-size: 11px;
  font-weight: 700;
}

.ir-chip-pct.armed {
  color: var(--up);
}

.ir-chip-pct.holding {
  color: var(--accent);
}

.ir-exit-ladders {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 6px;
}

.ir-exit-pill {
  display: inline-flex;
  color: var(--ink-dim);
  border: 1px solid var(--line-2);
  background: var(--panel);
  border-radius: 6px;
  align-items:  center;
  gap: 6px;
  padding: 3px 8px;
  font-size: 10px;
}

.ir-exit-mini {
  display: inline-block;
  background: rgba(var(--hi), .08);
  overflow: hidden;
  position: relative;
  border-radius: 2px;
  width: 36px;
  height: 4px;
}

.ir-exit-mini b {
  position: absolute;
  background: var(--accent);
  border-radius: 2px;
  top: 0;
  bottom: 0;
  left: 0;
}

.ir-expand {
  display: flex;
  border: 1px solid var(--line-2);
  background: rgba(var(--hi), .025);
  border-radius: 8px;
  flex-direction: column;
  gap: 7px;
  padding: 8px 10px;
}

.ir-expand.armed {
  border-left: 2px solid var(--up);
}

.ir-expand.holding {
  border-left: 2px solid var(--accent);
}

.ir-expand-top {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 10px;
  min-width: 0;
}

.ir-expand-top .ir-id {
  display: flex;
  align-items:  center;
  gap: 6px;
  min-width: 0;
}

.ir-expand-top .ir-meta {
  color: var(--muted);
  white-space: nowrap;
  flex: none;
  font-size: 10px;
}

.ir-expand-top .ir-railwrap {
  display: flex;
  flex: 160px;
  align-items:  center;
  gap: 8px;
  min-width: 120px;
}

.ir-expand-top .ir-status {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: none;
  max-width: 220px;
  font-family: Geist Mono, ui-monospace, monospace;
  font-size: 10px;
}

.ir-book-tag {
  letter-spacing: .08em;
  text-transform: uppercase;
  border: 1px solid var(--line-2);
  color: var(--muted);
  border-radius: 3px;
  flex: none;
  padding: 1px 5px;
  font-size: 8.5px;
}

.ir-book-tag.live {
  border-color: var(--down);
  color: var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--down) 50%, transparent);
    }
  }
}

.ir-expand-gates {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 4px;
}

.ir-hgate {
  display: inline-flex;
  border: 1px solid var(--line-2);
  background: var(--panel);
  border-radius: 6px;
  align-items:  center;
  gap: 5px;
  max-width: 100%;
  padding: 3px 7px;
  font-size: 10px;
  line-height: 1.2;
}

.ir-hgate .g-glyph {
  text-align: center;
  flex: none;
  width: 11px;
  font-size: 10px;
}

.ir-hgate .g-label {
  color: var(--ink);
  white-space: nowrap;
}

.ir-hgate .g-detail {
  color: var(--faint);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 120px;
  font-size: 9.5px;
}

.ir-hgate.pass {
  color: var(--ink-dim);
  border-color: var(--up);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--up) 22%, var(--line-2));
    }
  }
}

.ir-hgate.pass .g-glyph {
  color: var(--up);
}

.ir-hgate.pass .g-label {
  color: var(--muted);
}

.ir-hgate.fail .g-glyph {
  color: var(--down);
}

.ir-hgate.wait {
  opacity: .72;
}

.ir-hgate.wait .g-glyph {
  color: var(--faint);
}

.ir-hgate.block {
  background: var(--down);
  border-color: var(--down);
  box-shadow: inset 2px 0 0 var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--down) 9%, transparent);
    }
  }
}

.ir-hgate.block .g-label {
  color: var(--ink);
  font-weight: 600;
}

.ir-id {
  display: flex;
  align-items:  center;
  gap: 7px;
  min-width: 0;
}

.ir-dot {
  border-radius: 50%;
  flex: none;
  width: 7px;
  height: 7px;
  box-shadow: 0 0 6px;
}

.ir-dot.ce {
  color: var(--up);
  background: var(--up);
}

.ir-dot.pe {
  color: var(--down);
  background: var(--down);
}

.ir-dot.both {
  color: #0000;
  background: linear-gradient(90deg, var(--up) 50%, var(--down) 50%);
  box-shadow: none;
}

.ir-name {
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 11px;
  font-weight: 500;
}

.ir-prio {
  color: var(--accent);
  background: var(--accent);
  border: 1px solid var(--accent);
  border-radius: 3px;
  flex: none;
  padding: 1px 4px;
  font-size: 8px;
  font-weight: 700;
  line-height: 1;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--accent) 12%, transparent);
    }
  }
}

.ir-meta {
  color: var(--muted);
  white-space: nowrap;
  font-size: 10px;
}

.ir-sl {
  color: var(--down);
}

.ir-railwrap {
  display: flex;
  align-items:  center;
  gap: 8px;
  min-width: 0;
}

.ir-rail {
  display: flex;
  flex: 1;
  align-items:  center;
  gap: 3px;
  min-width: 0;
  height: 12px;
}

.ir-seg {
  background: rgba(var(--hi), .07);
  border-radius: 2px;
  flex: 1;
  min-width: 3px;
  height: 6px;
  transition: background .2s, height .2s, box-shadow .2s;
}

.ir-seg.pass {
  background: var(--up);
  box-shadow: 0 0 6px var(--up-glow);
}

.ir-seg.fail {
  background: var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--down) 45%, transparent);
    }
  }
}

.ir-seg.block {
  background: var(--down);
  box-shadow: 0 0 8px var(--down-glow);
  height: 12px;
}

.ir-seg.wait {
  border: 1px solid rgba(var(--hi), .14);
  background: none;
}

.ir-rail.exitfill, .ir-rail.empty {
  display: block;
  background: rgba(var(--hi), .07);
  overflow: hidden;
  position: relative;
  border-radius: 4px;
  height: 6px;
}

.ir-exit-fill {
  position: absolute;
  background: linear-gradient(90deg, var(--accent), var(--accent));
  box-shadow: 0 0 10px var(--accent);
  border-radius: 4px;
  transition: width .3s cubic-bezier(.2,.8,.2,1);
  top: 0;
  bottom: 0;
  left: 0;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 40%, transparent), var(--accent));
    }
  }
}

.ir-pct {
  text-align: right;
  color: var(--muted);
  flex: none;
  min-width: 34px;
  font-size: 11px;
  font-weight: 700;
}

.ir-pct.armed {
  color: var(--up);
}

.ir-pct.holding {
  color: var(--accent);
}

.ir-status {
  font-family: Geist Mono, ui-monospace, monospace;
  font-size: 10px;
}

.ir-status.armed {
  color: var(--up);
  letter-spacing: .06em;
  font-weight: 700;
}

.ir-armed-dot {
  display: inline-block;
  background: var(--up);
  box-shadow: 0 0 6px var(--up-glow);
  animation: ir-blink 1.6s ease-in-out infinite;
  border-radius: 50%;
  width: 6px;
  height: 6px;
  margin-left: 5px;
}

@keyframes ir-blink {
  50% {
    opacity: .35;
  }
}

.ir-status.blocked {
  color: var(--down);
}

.ir-status.holding {
  color: var(--accent);
  font-weight: 700;
}

.ir-status.holding em {
  color: var(--ink-dim);
  font-style: normal;
  font-weight: 500;
}

.ir-status.idle {
  color: var(--faint);
}

.ir-detail {
  cursor: default;
  border-top: 1px dashed rgba(var(--hi), .08);
  margin-top: 4px;
  padding-top: 8px;
}

.ir-gates {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.ir-gate {
  display: flex;
  border-radius: 5px;
  align-items: baseline;
  gap: 8px;
  padding: 3px 6px;
  font-size: 11px;
}

.ir-gate .g-detail {
  color: var(--muted);
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 55%;
  margin-left: auto;
  font-size: 10px;
}

.ir-gates.cols3 .ir-gate-head, .ir-gates.cols3 .ir-gate {
  display: grid;
  grid-template-columns: minmax(96px, 1.1fr) minmax(0, 1.6fr) minmax(64px, .9fr);
  border-radius: 5px;
  align-items: baseline;
  gap: 10px;
  padding: 3px 6px;
}

.ir-gates.cols3 .ir-gate-head {
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--faint);
  border-bottom: 1px solid var(--line);
  margin-bottom: 2px;
  padding-bottom: 4px;
  font-size: 8.5px;
}

.ir-gates.cols3 .ir-gate-head .num, .ir-gates.cols3 .ir-gate .g-now {
  text-align: right;
}

.ir-gates.cols3 .ir-gate {
  font-size: 11px;
}

.ir-gates.cols3 .ir-gate .g-type {
  display: flex;
  align-items: baseline;
  gap: 6px;
  min-width: 0;
}

.ir-gates.cols3 .ir-gate .g-formula, .ir-gates.cols3 .ir-gate .g-now {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
}

.ir-gates.cols3 .ir-gate .g-formula {
  color: var(--muted);
}

.ir-gates.cols3 .ir-gate .g-now {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

.ir-gates.cols3 .ir-gate.wait .g-now {
  color: var(--faint);
}

.ir-gates.cols3 .ir-gate.fail .g-now {
  color: var(--down);
}

.ir-gates.cols3 .ir-gate.pass .g-now {
  color: var(--up);
}

.ir-gate .g-glyph {
  text-align: center;
  flex: none;
  width: 12px;
}

.ir-gate.pass {
  color: var(--ink-dim);
}

.ir-gate.pass .g-glyph {
  color: var(--up);
}

.ir-gate.wait {
  color: var(--faint);
}

.ir-gate.fail {
  color: var(--ink-dim);
}

.ir-gate.fail .g-glyph {
  color: var(--down);
}

.ir-gate.block {
  background: var(--down);
  border: 1px solid var(--down);
  color: var(--ink);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--down) 7%, transparent);
    }
  }
}

.ir-gate .g-label {
  min-width: 0;
}

.ir-empty {
  color: var(--faint);
  padding: 4px 6px;
  font-size: 11px;
  line-height: 1.5;
}

.ir-detail-foot {
  display: flex;
  justify-content: space-between;
  align-items:  center;
  gap: 8px;
  margin-top: 8px;
}

.ir-detail-sub {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
  font-size: 10px;
}

.ir-journal-btn {
  color: var(--accent);
  cursor: pointer;
  border: 1px solid var(--accent);
  background: none;
  border-radius: 6px;
  flex: none;
  padding: 3px 9px;
  font-size: 10px;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
    }
  }
}

.ir-journal-btn:hover {
  background: var(--accent);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--accent) 12%, transparent);
    }
  }
}

@media (width <= 640px) {
  .ir-body {
    max-height: 380px;
  }

  .ir-chip-name {
    max-width: 110px;
  }

  .ir-expand-top .ir-status {
    max-width: 140px;
  }

  .ir-hgate .g-detail {
    max-width: 80px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ir-seg, .ir-exit-fill, .ir-chip {
    transition: none;
  }

  .ir-armed-dot, .insight-pulse-ring:after {
    animation: none;
  }
}

.pos-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 2px;
}

.pos-box {
  border: 1px solid var(--line-2);
  background: rgba(var(--hi), .015);
  border-radius: 8px;
  padding: 7px 10px;
  transition: border-color .15s, background .15s;
}

.pos-box.open, .pos-box:hover {
  border-color: rgba(var(--hi), .16);
  background: rgba(var(--hi), .03);
}

.pos-line1 {
  display: flex;
  align-items:  center;
  gap: 8px;
}

.pos-qty {
  color: var(--muted);
  white-space: nowrap;
  font-size: 10.5px;
}

.pos-spring {
  flex: 1;
}

.pos-ltp {
  font-size: 13px;
}

.pos-mtm {
  text-align: right;
  min-width: 56px;
  font-size: 13px;
  font-weight: 700;
}

.pos-sell {
  border: 1px solid var(--down);
  color: var(--down);
  background: none;
  border-radius: 6px;
  padding: 3px 10px;
  font-size: 10.5px;
  font-weight: 600;
}

.pos-sell:disabled {
  opacity: .5;
}

.pos-line2 {
  display: flex;
  color: var(--muted);
  flex-wrap: wrap;
  align-items:  center;
  gap: 4px;
  margin-top: 4px;
  font-size: 11px;
}

.pos-strat {
  color: var(--ink-dim);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 220px;
  font-weight: 500;
}

.pos-dot {
  color: var(--faint);
  margin: 0 2px;
}

.pos-trail {
  padding: 4px 6px 8px;
}

.pos-empty {
  text-align: center;
  color: var(--faint);
  padding: 22px;
  font-size: 12px;
}

:where(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.fno-sector-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  padding: 12px;
}

.fno-sector-card {
  background: var(--panel);
  border: 1px solid var(--line);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  display: flex;
  border-radius: 8px;
  flex-direction: column;
  justify-content: space-between;
  min-height: 80px;
  padding: 12px 14px;
  transition: all .2s cubic-bezier(.4,0,.2,1);
}

.fno-sector-card:hover {
  border-color: var(--line-2);
  box-shadow: 0 4px 12px rgba(var(--hi), .05);
  transform: translateY(-2px);
}

.fno-sector-card.selected {
  border-color: var(--accent);
  background: var(--panel-2);
}

.fno-sector-name {
  font-family: var(--font-display);
  color: var(--ink);
  margin-bottom: 6px;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.2;
}

.fno-sector-stats {
  display: flex;
  justify-content: space-between;
  align-items:  center;
  font-size: 11px;
}

.fno-sector-stats .watched-count {
  color: var(--muted);
}

.fno-sector-stats .pnl {
  font-family: Geist Mono, monospace;
  font-weight: bold;
}

.fno-sector-indicator {
  position: absolute;
  background: none;
  width: 100%;
  height: 2px;
  transition: background-color .25s;
  bottom: 0;
  left: 0;
}

.fno-sector-card.trade .fno-sector-indicator {
  background: var(--accent);
}

.fno-sector-card.alarm {
  border: 1.5px solid var(--down);
  animation: fnoSectorAlarmPulse 1.5s ease-in-out infinite;
}

@keyframes fnoSectorAlarmPulse {
  0%, 100% {
    border-color: #ff464666;
    box-shadow: 0 0 #ff464600;
  }

  50% {
    border-color: #ff4646;
    box-shadow: 0 0 8px 1px #ff464626;
  }
}

.fno-gainer-loser-wrap {
  margin-top: 14px;
}

.fno-mover-row:hover {
  opacity: .8;
}

.fno-stock-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 16px;
  padding: 12px 0;
}

.fno-stock-card {
  background: var(--panel);
  border: 1px solid var(--line);
  display: flex;
  position: relative;
  border-radius: 10px;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  transition: all .2s;
}

.fno-stock-card:hover {
  border-color: var(--line-2);
  box-shadow: 0 4px 14px rgba(var(--hi), .04);
}

.fno-stock-card.trade {
  border-left: 3px solid var(--accent);
}

.fno-stock-card-header {
  display: flex;
  justify-content: space-between;
  align-items:  flex-start;
  gap: 8px;
}

.fno-stock-identity {
  display: flex;
  flex-direction: column;
}

.fno-stock-symbol-row {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 6px;
}

.fno-stock-symbol-row .symbol {
  color: var(--ink);
  font-size: 16px;
  font-weight: 700;
}

.fno-stock-identity .company-name {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  margin-top: 2px;
  font-size: 11px;
}

.fno-stock-spot-price {
  display: flex;
  flex-direction: column;
  align-items:  flex-end;
  font-size: 14px;
}

.fno-stock-spot-price .ltp {
  color: var(--ink);
  font-weight: 600;
}

.fno-stock-spot-price .pct {
  font-size: 11px;
  font-weight: bold;
}

.fno-stock-spot-price .stock-pnl {
  background: rgba(var(--hi), .04);
  border-radius: 3px;
  padding: 1px 4px;
  font-size: 10px;
  font-weight: bold;
}

.fno-stock-actions {
  display: flex;
  align-items:  center;
  gap: 6px;
}

.fno-expand-btn, .fno-watch-toggle {
  appearance: none;
  border: 1px solid var(--line-2);
  cursor: pointer;
  display: flex;
  background: none;
  border-radius: 5px;
  justify-content: center;
  align-items:  center;
  width: 26px;
  height: 26px;
  transition: all .15s;
  font-size: 12px;
}

.fno-expand-btn:hover, .fno-watch-toggle:hover {
  background: var(--panel-2);
  border-color: var(--muted);
}

.fno-expand-btn.active {
  background: var(--accent-glow);
  border-color: var(--accent);
}

.fno-watch-toggle.add {
  color: var(--up);
  border-color: #4ad9914d;
}

.fno-watch-toggle.add:hover {
  background: var(--up-glow);
}

.fno-watch-toggle.remove {
  color: var(--down);
  border-color: #ff6a6a4d;
  font-size: 16px;
}

.fno-watch-toggle.remove:hover {
  background: var(--down-glow);
}

.fno-stock-px-row {
  display: flex;
  border-top: 1px solid var(--line);
  gap: 12px;
  padding-top: 12px;
}

.fno-opt-col {
  display: flex;
  background: var(--panel-2);
  border: 1px solid var(--line-2);
  border-radius: 6px;
  flex-direction: column;
  flex: 1;
  gap: 8px;
  padding: 8px;
}

.fno-opt-info {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 6px;
}

.fno-opt-badge {
  color: #fff;
  border-radius: 3px;
  padding: 1px 4px;
  font-size: 9px;
  font-weight: bold;
}

.fno-opt-badge.CE {
  background: var(--up);
}

.fno-opt-badge.PE {
  background: var(--down);
}

.fno-opt-info .strike {
  color: var(--muted);
  font-size: 11px;
}

.fno-opt-info .ltp {
  color: var(--ink);
  font-size: 12px;
  font-weight: bold;
}

.fno-opt-info .pct {
  font-size: 10.5px;
  font-weight: 600;
}

.fno-gates-wrapper {
  display: flex;
  align-items:  center;
  gap: 6px;
}

.fno-gates-wrapper .gates-label {
  color: var(--faint);
  white-space: nowrap;
  font-size: 9px;
}

.fno-gate-segments {
  display: flex;
  align-items:  center;
  gap: 2px;
}

.fno-gate-segment {
  background: var(--line-2);
  border-radius: 1.5px;
  width: 8px;
  height: 8px;
}

.fno-gate-segment.pass {
  background: var(--up);
}

.fno-gate-segment.fail {
  background: var(--down);
}

.fno-gate-segment.gray {
  background: var(--line-2);
  opacity: .5;
}

.fno-inline-chart-wrap {
  border-top: 1px dashed var(--line-2);
  margin-top: 4px;
  padding-top: 12px;
}

.fno-loading-chart {
  text-align: center;
  color: var(--faint);
  padding: 24px;
  font-size: 12px;
}

.exit-only-badge {
  background: rgba(var(--hi), .05);
  border: 1px solid var(--line-2);
  color: var(--muted);
  text-transform: uppercase;
  border-radius: 3px;
  padding: 1px 4px;
  font-size: 9px;
}

.in-trade-badge {
  background: var(--accent-glow);
  border: 1px solid var(--accent);
  color: var(--accent-text);
  text-transform: uppercase;
  border-radius: 3px;
  padding: 1px 4px;
  font-size: 9px;
}

.fno-pulse {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  padding: 10px 14px;
}

.fno-chip {
  appearance: none;
  cursor: pointer;
  letter-spacing: .04em;
  color: var(--muted);
  border: 0;
  border-bottom: 1px solid var(--line-2);
  background: none;
  padding: 3px 2px 6px;
  font-family: Atkinson Hyperlegible, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  font-size: 11.5px;
}

.fno-chip:hover {
  color: var(--ink);
}

.fno-chip:focus-visible {
  outline: 2px solid var(--accent-2);
  outline-offset: 2px;
  border-radius: 3px;
}

.fno-chip.sel {
  color: var(--ink);
  border-bottom-color: var(--ink);
}

.fno-chip.trade {
  color: var(--ink);
  border-bottom: 2px solid var(--accent);
}

.fno-chip.alarm {
  color: var(--down);
  border-bottom: 2px solid var(--down);
  animation: fnoAlarm 1.2s ease-in-out infinite;
}

@keyframes fnoAlarm {
  0%, 100% {
    box-shadow: 0 6px 12px -8px #0000;
  }

  50% {
    box-shadow: 0 6px 12px -6px var(--down-glow);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fno-chip.alarm {
    animation: none;
  }
}

.fno-layout {
  display: flex;
  align-items:  flex-start;
  gap: 14px;
}

.fno-main {
  flex: 1;
  min-width: 0;
}

.fno-book {
  position: sticky;
  background: var(--panel);
  border: 1px solid var(--line);
  display: flex;
  border-radius: 10px;
  flex-direction: column;
  flex: none;
  width: 248px;
  max-height: calc(100vh - 90px);
  margin-top: 14px;
  top: 14px;
}

.fno-book-head {
  padding: 10px 12px 6px;
}

.fno-book-search {
  background: var(--bg-2);
  border: 1px solid var(--line-2);
  color: var(--ink);
  border-radius: 6px;
  margin: 0 10px 8px;
  padding: 6px 9px;
  font-size: 12px;
}

.fno-book-results {
  border-bottom: 1px solid var(--line);
  background: var(--panel-2);
}

.fno-book-list {
  overflow-y: auto;
  padding: 4px 0 6px;
}

.fno-book-row {
  display: flex;
  cursor: pointer;
  border-left: 2px solid #0000;
  align-items:  center;
  gap: 8px;
  padding: 7px 10px 7px 12px;
}

.fno-book-row:hover {
  background: var(--panel-2);
}

.fno-book-row.live {
  border-left-color: var(--accent);
}

.fno-book-row.sel {
  background: var(--panel-2);
}

.fno-book-row.off {
  opacity: .45;
}

.fno-book-row.search {
  cursor: default;
  border-left: 0;
}

.fno-book-name {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.fno-book-name > span:first-child {
  color: var(--ink);
  letter-spacing: .02em;
  font-size: 12.5px;
}

.fno-book-sub {
  color: var(--faint);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 10px;
}

.fno-book-px {
  display: flex;
  flex-direction: column;
  align-items:  flex-end;
  font-size: 11.5px;
}

.fno-book-px .pos {
  color: var(--up);
  font-size: 10px;
}

.fno-book-px .neg {
  color: var(--down);
  font-size: 10px;
}

.fno-book-acts {
  display: none;
  gap: 2px;
}

.fno-book-row:hover .fno-book-acts {
  display: inline-flex;
}

.fno-book-act {
  appearance: none;
  cursor: pointer;
  color: var(--muted);
  background: none;
  border: 0;
  border-radius: 4px;
  padding: 2px 4px;
  font-size: 12px;
}

.fno-book-act:hover {
  color: var(--ink);
  background: var(--line);
}

.fno-book-add {
  appearance: none;
  cursor: pointer;
  border: 1px solid var(--up);
  color: var(--up);
  display: inline-flex;
  background: none;
  border-radius: 50%;
  justify-content: center;
  align-items:  center;
  width: 20px;
  height: 20px;
  font-size: 14px;
  line-height: 1;
}

.fno-book-add:hover {
  background: var(--up-glow);
}

.fno-book-added {
  color: var(--up);
  padding: 0 4px;
  font-size: 12px;
}

.fno-book-empty {
  color: var(--faint);
  margin: 0;
  padding: 10px 12px;
  font-size: 11.5px;
}

.fno-book-toggle {
  appearance: none;
  cursor: pointer;
  color: var(--muted);
  border: 1px solid var(--line-2);
  background: none;
  border-radius: 5px;
  padding: 1px 6px;
  font-size: 11px;
}

.fno-book-toggle:hover {
  color: var(--ink);
}

@media (width <= 900px) {
  .fno-layout {
    flex-direction: column;
  }

  .fno-book {
    position: static;
    width: 100%;
    max-height: 320px;
  }
}

.audit-cards {
  display: flex;
  overflow-y: auto;
  flex-direction: column;
  gap: 10px;
  max-height: 456px;
  padding: 5px;
}

.audit-card {
  background: linear-gradient(135deg, var(--panel-2) 0%, var(--panel) 100%);
  border: 1px solid var(--line);
  position: relative;
  border-radius: 10px;
  padding: 14px;
  transition: border-color .15s;
}

.audit-card:hover {
  border-color: var(--line-2);
}

.audit-card-hdr {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items:  center;
  gap: 10px;
  margin-bottom: 7px;
}

.audit-card-meta {
  display: flex;
  color: var(--faint);
  align-items:  center;
  gap: 10px;
  font-size: 14px;
}

.audit-card-sym-side {
  color: var(--ink);
  font-weight: 700;
}

.audit-card-kind {
  text-transform: uppercase;
  background: rgba(var(--hi), .05);
  letter-spacing: .05em;
  color: var(--muted);
  border-radius: 5px;
  padding: 2px 7px;
  font-size: 12px;
  font-weight: 700;
}

.audit-card-decision {
  letter-spacing: .02em;
  border-radius: 5px;
  padding: 2px 10px;
  font-family: Geist Mono, monospace;
  font-size: 13px;
  font-weight: 800;
}

.audit-card-lat {
  color: var(--faint);
  font-size: 13px;
}

.audit-card-body {
  color: var(--ink-dim);
  margin-top: 5px;
  font-size: 15px;
  line-height: 1.4;
}

.audit-card-gates {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  border-top: 1px dashed var(--line);
  gap: 7px;
  margin-top: 10px;
  padding-top: 10px;
}

.audit-card-gate {
  display: flex;
  background: rgba(var(--hi), .02);
  border: 1px solid rgba(var(--hi), .04);
  border-radius: 6px;
  flex-direction: column;
  align-items:  flex-start;
  gap: 4px;
  padding: 8px 12px;
  font-size: 13px;
}

.audit-card-gate.pass {
  background: #4ad99108;
  border-color: #4ad99126;
}

.audit-card-gate.fail {
  background: #ff6a6a08;
  border-color: #ff6a6a26;
}

.audit-card-gate-hdr-line {
  display: flex;
  align-items:  center;
  gap: 6px;
  width: 100%;
}

.audit-card-gate-glyph {
  margin-right: 2px;
  font-weight: 700;
}

.audit-card-gate.pass .audit-card-gate-glyph {
  color: var(--up);
}

.audit-card-gate.fail .audit-card-gate-glyph {
  color: var(--down);
}

.audit-card-gate-label {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: 11px;
  font-weight: 600;
}

.audit-card-gate-val {
  color: var(--ink-dim);
  padding-left: 14px;
  font-family: Geist Mono, monospace;
  font-size: 11.5px;
}

.audit-card-gate.fail .audit-card-gate-val {
  color: var(--down);
  font-weight: 600;
}

.audit-card-gate-target {
  font-size: 10.5px;
  font-weight: 400;
  color: var(--faint) !important;
}

.fno-fab {
  position: fixed;
  z-index: 1000;
  display: flex;
  background: var(--panel-2);
  border: 1.5px solid var(--line-2);
  color: var(--ink-dim);
  cursor: pointer;
  letter-spacing: .02em;
  border-radius: 30px;
  align-items:  center;
  gap: 8px;
  padding: 10px 18px;
  transition: all .2s cubic-bezier(.4,0,.2,1);
  font-size: 13.5px;
  font-weight: 700;
  bottom: 24px;
  right: 24px;
  box-shadow: 0 4px 15px #0006;
}

.fno-fab:hover {
  border-color: var(--accent);
  color: var(--ink);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px #00000080;
}

.fno-fab.active {
  border-color: var(--accent);
  color: var(--accent);
  animation: fno-fab-pulse 2s infinite;
  background: #f2b44114;
  box-shadow: 0 4px 20px #f2b44133;
}

@keyframes fno-fab-pulse {
  0% {
    box-shadow: 0 0 #f2b44166, 0 4px 15px #0006;
  }

  70% {
    box-shadow: 0 0 0 8px #f2b44100, 0 4px 15px #0006;
  }

  100% {
    box-shadow: 0 0 #f2b44100, 0 4px 15px #0006;
  }
}

.fno-modal-overlay {
  position: fixed;
  backdrop-filter: blur(4px);
  z-index: 2000;
  display: flex;
  animation: fadeIn .15s ease-out;
  background: #0009;
  justify-content: center;
  align-items:  center;
  inset: 0;
}

.fno-modal {
  background: var(--panel);
  border: 1px solid var(--line);
  display: flex;
  animation: slideUp .2s cubic-bezier(.4, 0, .2, 1);
  border-radius: 12px;
  flex-direction: column;
  width: 540px;
  max-width: 90vw;
  max-height: 85vh;
  box-shadow: 0 10px 30px #00000080;
}

.fno-modal-head {
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items:  center;
  padding: 16px 20px;
}

.fno-modal-title {
  color: var(--ink);
  display: flex;
  align-items:  center;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
}

.fno-modal-close {
  color: var(--muted);
  cursor: pointer;
  background: none;
  border: none;
  padding: 4px;
  transition: color .15s;
  font-size: 18px;
}

.fno-modal-close:hover {
  color: var(--ink);
}

.fno-modal-body {
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px;
}

.fno-modal-filters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--panel-2);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  gap: 12px;
  padding: 12px;
}

.fno-modal-filter-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.fno-modal-label {
  text-transform: uppercase;
  color: var(--muted);
  letter-spacing: .03em;
  font-size: 11px;
  font-weight: 600;
}

.fno-modal-threshold-buttons {
  display: flex;
  gap: 4px;
}

.fno-modal-threshold-btn {
  background: var(--panel);
  border: 1.5px solid var(--line-2);
  color: var(--muted);
  cursor: pointer;
  border-radius: 5px;
  flex: 1;
  padding: 6px;
  transition: all .15s;
  font-size: 11px;
  font-weight: 600;
}

.fno-modal-threshold-btn.active {
  border-color: var(--accent);
  color: var(--accent);
  background: #f2b4411f;
}

.fno-modal-toggle-row {
  display: flex;
  border-bottom: 1px dashed var(--line);
  justify-content: space-between;
  align-items:  center;
  padding: 6px 4px 12px;
}

.fno-modal-signals-list {
  display: flex;
  overflow-y: auto;
  flex-direction: column;
  gap: 8px;
  max-height: 280px;
  padding-right: 4px;
}

.fno-modal-signal-item {
  display: flex;
  background: rgba(var(--hi), .02);
  border: 1px solid var(--line-2);
  cursor: pointer;
  border-radius: 6px;
  justify-content: space-between;
  align-items:  center;
  padding: 10px 14px;
  transition: all .15s;
}

.fno-modal-signal-item:hover {
  background: rgba(var(--hi), .05);
  border-color: var(--accent);
  transform: translateX(2px);
}

.fno-modal-signal-sym {
  color: var(--ink);
  font-size: 14px;
  font-weight: 700;
}

.fno-modal-signal-side {
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 12px;
  font-weight: 700;
}

.fno-modal-signal-side.CE {
  color: var(--up);
  background: #4ad9911a;
}

.fno-modal-signal-side.PE {
  color: var(--down);
  background: #ff6a6a1a;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    transform: translateY(20px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.app-header-sticky {
  position: sticky;
  z-index: 1000;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-left: -16px;
  margin-right: -16px;
  padding: 9px 16px 8px;
  top: 0;
}

@media (width <= 640px) {
  .app-header-sticky {
    margin-left: -12px;
    margin-right: -12px;
    padding-left: 12px;
    padding-right: 12px;
  }
}

.app-header-sticky .btn {
  border-radius: 5px;
  padding: 5px 10px;
  font-size: 11.5px;
}

.app-header-sticky .riskstrip-row {
  padding: 5px 10px;
}

.app-header-sticky .rs-actions .btn {
  padding: 4px 8px;
  font-size: 10.5px;
}

@media (width <= 900px) {
  .riskstrip-cell {
    padding: 2px 6px;
  }

  .riskstrip-cell + .riskstrip-cell {
    border-left: 0;
  }

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

.fnops {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.fnops-sec {
  border: 1px solid var(--line);
  border-left: 3px solid var(--sec, var(--accent));
  background: var(--panel-2);
  border-radius: 8px;
  padding: 10px 12px 12px;
}

.fnops-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 10px;
}

.fnops-title {
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.fnops-hint {
  color: var(--faint);
  font-size: 11px;
}

.fnops-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px 14px;
}

.fnops-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.fnops-field .input {
  box-sizing: border-box;
  width: 100% !important;
}

.fnops-label {
  display: flex;
  color: var(--muted);
  letter-spacing: .02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  align-items: baseline;
  gap: 6px;
  font-size: 11px;
}

.fnops-unit {
  color: var(--faint);
  font-size: 10px;
}

.fnops-lock {
  border: 1px solid var(--line-2);
  color: var(--faint);
  text-transform: uppercase;
  letter-spacing: .05em;
  border-radius: 4px;
  padding: 1px 5px;
  font-size: 9px;
}

.fnops-field.locked {
  opacity: .55;
}

.fnops-math .fnops-sec {
  padding-bottom: 10px;
}

.fnops-cardgrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
  align-items:  start;
  gap: 10px;
}

@media (width <= 480px) {
  .fnops-cardgrid {
    grid-template-columns: 1fr;
  }
}

.fnops-card {
  border: 1px solid var(--line);
  background: var(--panel);
  border-radius: 8px;
  min-width: 0;
  padding: 9px 11px;
}

.fnops-cardhead {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 7px;
}

.fnops-cardtitle {
  color: var(--ink);
  font-size: 11.5px;
  font-weight: 600;
}

.fnops-ref {
  color: var(--faint);
  opacity: .75;
  font-size: 9.5px;
}

.fnops-formula {
  display: flex;
  color: var(--muted);
  background: var(--panel-2);
  overflow-x: auto;
  border-radius: 6px;
  flex-wrap: wrap;
  align-items:  center;
  gap: 4px 3px;
  min-width: 0;
  max-width: 100%;
  margin-bottom: 5px;
  padding: 6px 8px;
  font-size: 11.5px;
  line-height: 1.9;
}

.fnops-expr {
  white-space: pre-wrap;
}

.fnops-side {
  letter-spacing: .06em;
  border: 1px solid var(--line-2);
  color: var(--faint);
  border-radius: 4px;
  flex: none;
  margin-right: 4px;
  padding: 1px 5px;
  font-size: 9px;
  font-weight: 700;
}

.fnops-slot {
  display: inline-flex;
  align-items:  center;
  gap: 3px;
}

.fnops-slot .fnops-in {
  text-align: right;
  border-color: var(--sec, var(--accent));
  background: var(--panel-2);
  width: 62px;
  height: 21px;
  padding: 1px 5px;
  font-size: 11.5px;
}

.fnops-slot .fnops-in:disabled {
  opacity: .5;
  border-color: var(--line);
}

.fnops-slot select.fnops-in {
  text-align: left;
  width: auto;
}

.fnops-slot .fnops-time {
  text-align: center;
  width: 78px;
}

.fnops-slotkey {
  color: var(--faint);
  font-size: 10px;
}

.fnops-notes {
  color: var(--faint);
  margin: 2px 0 0;
  padding-left: 14px;
  font-size: 10.5px;
  line-height: 1.55;
}

.fnops-notes li {
  margin: 1px 0;
}

.fnops-legend {
  color: var(--muted);
  margin: 4px 0 2px;
  font-family: ui-monospace, SF Mono, Menlo, monospace;
  font-size: 10.5px;
  line-height: 1.6;
}

.fnops-legend b {
  color: var(--ink);
  font-weight: 600;
}

.fnops-side.ce {
  color: var(--up);
  border-color: var(--up);
}

.fnops-side.pe {
  color: var(--down);
  border-color: var(--down);
}

.disclose {
  cursor: pointer;
  color: var(--ink);
  background: none;
  border: none;
  padding: 0;
  font-size: 12px;
}

.disclose:hover {
  color: var(--accent);
}

.disclose:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 3px;
}

.taud2 {
  display: grid;
  grid-template-columns: 250px 1fr;
  overflow: auto;
  gap: 20px;
  max-height: 74vh;
}

@media (width <= 760px) {
  .taud2 {
    grid-template-columns: 1fr;
  }
}

.taud2-left {
  display: flex;
  flex-direction: column;
  align-content:  start;
  gap: 3px;
}

.taud2-sec {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--amber, #cf9f3f);
  margin: 12px 0 4px;
  font-size: 10px;
  font-weight: 700;
}

.taud2-left .taud2-sec:first-child {
  margin-top: 0;
}

.taud2-kv {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 2px 0;
  font-size: 12.5px;
}

.taud2-kv span {
  color: var(--muted);
}

.taud2-legpill {
  border: 1px solid var(--up);
  color: var(--up);
  border-radius: 5px;
  margin-right: 8px;
  padding: 2px 8px;
  font-size: 11px;
}

.taud2-right {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}

.taud2-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

@media (width <= 980px) {
  .taud2-cards {
    grid-template-columns: 1fr;
  }
}

.taud2-card {
  border: 1px solid var(--line);
  background: var(--panel-2);
  border-radius: 8px;
  min-width: 0;
  padding: 14px 16px;
}

.taud2-cardhd {
  display: flex;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 700;
}

.taud2-cardhd b {
  letter-spacing: .02em;
  font-size: 15px;
  font-weight: 800;
}

.taud2-bar {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  font-size: 13px;
  line-height: 1.8;
}

.taud2-bar b {
  color: var(--ink);
  font-weight: 600;
}

.taud2-vchips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin-top: 8px;
}

.taud2-vchip {
  display: flex;
  border: 1px solid var(--line);
  border-radius: 6px;
  flex-direction: column;
  gap: 1px;
  min-width: 76px;
  padding: 4px 9px;
}

.taud2-vchip span {
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--faint);
  font-size: 9.5px;
}

.taud2-vchip b {
  font-variant-numeric: tabular-nums;
  font-size: 14px;
}

.taud2-block {
  border: 1px solid var(--line);
  background: var(--panel-2);
  border-radius: 8px;
  min-width: 0;
  padding: 10px 12px;
}

.taud2-math {
  display: flex;
  border-bottom: 1px solid var(--line-2, #ffffff0d);
  align-items: baseline;
  gap: 10px;
  padding: 4px 0;
}

.taud2-math:last-of-type {
  border-bottom: 0;
}

.taud2-math .taud-gate {
  text-align: center;
  flex: none;
  min-width: 108px;
}

.taud2-mathfx {
  color: var(--ink);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  min-width: 0;
  font-family: ui-monospace, SF Mono, Menlo, monospace;
  font-size: 12px;
  line-height: 1.6;
}

.taud2-blockhd {
  display: flex;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--amber, #cf9f3f);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 7px;
  font-size: 10px;
  font-weight: 700;
}

.taud2-blockhd b {
  font-size: 10.5px;
  font-weight: 600;
}

.taud2-scroll {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  max-height: 46vh;
}

.taud2-table {
  width: 100%;
  font-size: 12px;
}

.taud2-table thead th {
  position: sticky;
  z-index: 3;
  background: var(--panel-2);
  top: 0;
}

.taud2-table .r {
  text-align: right;
}

.taud2-table .muted {
  color: var(--muted);
}

.taud2-table tr.hl-enter td {
  background: var(--up);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--up) 12%, transparent);
    }
  }
}

.taud2-table tr.hl-exit td {
  background: var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--down) 12%, transparent);
    }
  }
}

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

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

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

.taud-graph {
  width: 100%;
  height: auto;
}

.taud-axis {
  fill: var(--muted);
  font-family: inherit;
  font-size: 10px;
}

.taud-legend {
  display: flex;
  color: var(--muted);
  flex-wrap: wrap;
  align-items:  center;
  gap: 16px;
  margin-top: 4px;
  font-size: 11px;
}

.taud-legend i {
  display: inline-block;
  vertical-align: middle;
  border-radius: 2px;
  width: 14px;
  height: 3px;
  margin-right: 5px;
}

.taud-legend i.dash {
  background: none;
  border-top: 2px dashed;
  border-radius: 0;
  height: 0;
}

.taud-gates {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.taud-gate {
  border: 1px solid;
  border-radius: 9px;
  padding: 1px 7px;
  font-size: 10.5px;
}

.taud-gate.ok {
  color: var(--up);
  border-color: var(--up);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--up) 45%, transparent);
    }
  }
}

.taud-gate.bad {
  color: var(--down);
  border-color: var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--down) 45%, transparent);
    }
  }
}

.taud-vals {
  color: var(--faint, var(--muted));
  overflow-wrap: anywhere;
  font-size: 11px;
}

.taud2-hover {
  position: fixed;
  z-index: 120;
  pointer-events: none;
  border: 1px solid var(--line);
  background: var(--panel-2);
  border-radius: 8px;
  padding: 10px 12px;
  box-shadow: 0 12px 32px #00000073;
}

.taud2-hoverhd {
  display: flex;
  color: var(--muted);
  border-bottom: 1px solid var(--line);
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
  padding-bottom: 6px;
  font-size: 11px;
}

.taud2-hoverhd b {
  color: var(--ink);
}

.taud2-hoverfoot {
  display: flex;
  border-top: 1px solid var(--line);
  color: var(--ink-dim, var(--muted));
  font-variant-numeric: tabular-nums;
  flex-wrap: wrap;
  gap: 3px 12px;
  margin-top: 8px;
  padding-top: 6px;
  font-size: 10.5px;
}

.taud2-hoverfoot i {
  color: var(--faint);
  font-style: normal;
}

.fnops-ex {
  border: 1px solid var(--line-2);
  border-radius: 6px;
  padding: 6px 10px;
}

.fnops-ex-sample {
  margin-top: 4px;
  font-size: 11px;
}

.fnops-ex-formula {
  white-space: pre-wrap;
  color: var(--muted);
}

.fnops-ex-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
  margin-top: 2px;
}

.fnops-verdict {
  font-weight: 600;
}

.fnops-verdict.pass {
  color: var(--up);
}

.fnops-verdict.fail {
  color: var(--down);
}

.fnops-ex-ctx {
  color: var(--faint);
}

.doc-shell {
  padding-bottom: 56px;
}

.doc-topbar {
  display: flex;
  align-items:  center;
  gap: 10px;
  padding: 16px 0 22px;
}

.doc-topbar-spacer {
  flex: 1;
}

.doc-masthead {
  border-bottom: 1px solid var(--line);
  margin-bottom: 20px;
  padding-bottom: 22px;
}

.doc-title {
  font-family: var(--font-display);
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
  margin: 10px 0 0;
  font-size: clamp(30px, 5.5vw, 50px);
  font-weight: 400;
  line-height: 1.02;
}

.doc-lede {
  color: var(--muted);
  max-width: 56ch;
  margin: 12px 0 0;
  font-size: 14px;
  line-height: 1.55;
}

.doc-ro {
  border: 1px solid var(--line-2);
  color: var(--faint);
  letter-spacing: .12em;
  border-radius: 3px;
  margin-left: 10px;
  padding: 1px 7px;
}

.run-ticket {
  display: inline-flex;
  border: 1px solid var(--line-2);
  background: rgba(var(--hi), .03);
  border-radius: 4px;
  align-items: baseline;
  gap: 9px;
  margin-top: 16px;
  padding: 7px 13px;
  font-size: 13px;
}

.run-ticket-stamp {
  color: var(--faint);
}

.run-ticket-sep {
  color: var(--line-2);
}

.run-ticket-tail {
  color: var(--accent);
  letter-spacing: .1em;
  font-size: 15px;
}

.doc-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 34px;
  margin: 20px 0 0;
}

.doc-facts div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.doc-facts dt {
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--faint);
  font-size: 10px;
}

.doc-facts dd {
  color: var(--ink);
  margin: 0;
  font-size: 16px;
}

.daystrip {
  display: flex;
  overflow-x: auto;
  align-items: stretch;
  gap: 5px;
  margin-top: 22px;
  padding-bottom: 4px;
}

.daystrip-col {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 5px;
  min-width: 26px;
}

.daystrip-col > .daystrip-bar {
  border-radius: 1px;
  width: 100%;
}

.daystrip-label {
  color: var(--faint);
  text-align: center;
  white-space: nowrap;
  font-size: 9.5px;
}

.doc-caveats {
  color: var(--muted);
  margin: 0;
  padding: 0 14px 14px 30px;
  font-size: 12.5px;
  line-height: 1.6;
}

.doc-caveats li {
  margin-bottom: 6px;
}

@media (width <= 640px) {
  .doc-facts {
    gap: 10px 22px;
  }

  .doc-facts dd {
    font-size: 14px;
  }

  .run-ticket {
    font-size: 11.5px;
  }
}

.fno-sticky-tabs {
  position: sticky;
  background: var(--bg, #0b0b0b);
  z-index: 100;
  display: flex;
  overflow-x: auto;
  border-bottom: 1px solid var(--line-2, #ffffff14);
  scrollbar-width: none;
  gap: 8px;
  padding: 8px 14px;
  top: 0;
}

.fno-sticky-tabs::-webkit-scrollbar {
  display: none;
}

.fno-tab-btn {
  font-family: var(--font-mono, ui-monospace, monospace);
  background: var(--panel-2, #ffffff05);
  color: var(--muted);
  border: 1px solid var(--line-2, #ffffff14);
  cursor: pointer;
  white-space: nowrap;
  border-radius: 4px;
  padding: 4px 10px;
  transition: all .2s;
  font-size: 11px;
}

.fno-tab-btn:hover {
  color: var(--ink);
  background: rgba(var(--hi), .05);
  border-color: var(--accent);
}

.fno-tab-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.trade-filter-bar {
  display: flex;
  border: 1px solid var(--line-2, #ffffff14);
  background: var(--panel-2, #ffffff05);
  border-radius: 6px;
  flex-wrap: wrap;
  align-items:  center;
  gap: 8px;
  margin: 10px 0;
  padding: 8px;
}

.trade-filter-bar .input {
  background: var(--input-bg, #121212);
  border: 1px solid var(--line-2, #ffffff14);
  color: var(--ink);
  box-sizing: border-box;
  border-radius: 4px;
  height: 26px;
}

.trade-filter-bar .input:focus {
  border-color: var(--accent);
  outline: none;
}

@media (width <= 768px) {
  .trade-filter-bar {
    flex-direction: column;
    align-items: stretch;
  }

  .trade-filter-bar select, .trade-filter-bar input {
    width: 100%;
    flex: none !important;
  }
}

.fstrat-head {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 10px;
  padding: 7px 12px;
  font-size: 11.5px;
}

.fstrat-head .panel-title {
  margin-right: 2px;
}

.fstrat-head-right {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 8px;
  margin-left: auto;
}

.fstrat-head-right .btn {
  padding: 4px 10px;
  font-size: 11.5px;
}

.fstrat-mode {
  letter-spacing: .06em;
  background: var(--bg-2);
  color: var(--muted);
  border: 1px solid var(--line-2);
  border-radius: 4px;
  padding: 2px 7px;
  font-family: Geist Mono, monospace;
  font-size: 10px;
}

.fstrat-mode.dry {
  background: var(--amber);
  color: #000;
  border-color: #0000;
}

.fstrat-mode.real, .fstrat-mode.killed {
  background: var(--down);
  color: #fff;
  border-color: #0000;
}

.fstrat-metric {
  display: inline-flex;
  color: var(--ink-dim);
  align-items:  center;
  gap: 4px;
  font-family: Geist Mono, monospace;
  font-size: 11px;
}

.fstrat-metric i {
  color: var(--faint);
  font-size: 10px;
  font-style: normal;
}

.fstrat-metric em {
  color: var(--faint);
  font-size: 9.5px;
  font-style: normal;
}

.fstrat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr));
  gap: 8px;
  padding: 0 10px 10px;
}

.fstrat-card {
  border: 1px solid var(--line);
  border-left: 2px solid var(--line-2);
  background: var(--bg-2);
  display: flex;
  border-radius: 8px;
  flex-direction: column;
  gap: 7px;
  min-width: 0;
  padding: 8px 10px;
}

.fstrat-card.liveok {
  border-left-color: var(--accent);
}

.fstrat-card.off {
  opacity: .55;
}

.fstrat-id {
  display: flex;
  align-items:  center;
  gap: 6px;
  min-width: 0;
}

.fstrat-id b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 500;
}

.fstrat-tag {
  letter-spacing: .06em;
  white-space: nowrap;
  color: var(--accent);
  border: 1px solid var(--accent);
  border-radius: 3px;
  margin-left: auto;
  padding: 1px 5px;
  font-family: Geist Mono, monospace;
  font-size: 9px;
}

.fstrat-boxes {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
}

.fstrat-box {
  background: var(--panel);
  border: 1px solid var(--line);
  display: flex;
  border-radius: 6px;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  padding: 4px 6px;
}

.fstrat-k {
  display: flex;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--faint);
  align-items:  center;
  gap: 3px;
  font-size: 8.5px;
}

.fstrat-k i {
  font-size: 9.5px;
  font-style: normal;
}

.fstrat-v {
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: Geist Mono, monospace;
  font-size: 12.5px;
}

.fstrat-v em {
  color: var(--faint);
  font-size: 9.5px;
  font-style: normal;
}

.fstrat-v .input {
  background: none;
  border: 0;
  border-radius: 0;
  width: 100%;
  padding: 0;
  font-size: 12.5px;
}

.fstrat-v .input:focus {
  color: var(--accent);
  border: 0;
}

.fstrat-foot {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 6px;
}

.fstrat-pnl {
  font-size: 11.5px;
}

.fstrat-pnl em {
  color: var(--faint);
  font-size: 9.5px;
  font-style: normal;
}

.fstrat-acts {
  display: flex;
  align-items:  center;
  gap: 3px;
  margin-left: auto;
}

.btn.icon {
  color: var(--muted);
  border: 1px solid var(--line-2);
  background: none;
  border-radius: 5px;
  padding: 4px 6px;
  font-size: 11px;
  line-height: 1;
}

.btn.icon:hover:not(:disabled) {
  color: var(--ink);
  border-color: var(--ink-dim);
}

.btn.icon.danger:hover:not(:disabled) {
  color: var(--down);
  border-color: var(--down);
}

@media (width <= 520px) {
  .fstrat-boxes {
    grid-template-columns: repeat(2, 1fr);
  }
}

.book-head {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 8px;
  padding: 8px 12px;
}

.book-tag {
  letter-spacing: .1em;
  border: 1px solid var(--line-2);
  color: var(--muted);
  border-radius: 4px;
  padding: 2px 7px;
  font-family: Geist Mono, monospace;
  font-size: 9.5px;
}

.book-tag.live {
  border-color: var(--down);
  color: var(--down);
}

.book-scope {
  color: var(--faint);
  font-size: 10.5px;
}

.book-tools {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 6px;
  margin-left: auto;
}

.book-tools .input {
  border-radius: 6px;
  padding: 4px 8px;
  font-size: 11px;
}

.book-search {
  width: 210px;
}

.book-reason {
  width: 165px;
}

.book-size {
  width: 100px;
}

.book-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(50%, 108px), 1fr));
  background: var(--line);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  gap: 1px;
}

.bstat {
  background: var(--panel);
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
  padding: 6px 10px;
}

.bstat-k {
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--faint);
  font-size: 8.5px;
}

.bstat-v {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-size: 13.5px;
  font-weight: 700;
}

.bstat-v.pos {
  color: var(--up);
  font-weight: 700;
}

.bstat-v.neg {
  color: var(--down);
  font-weight: 700;
}

.bstat-s {
  color: var(--faint);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 9.5px;
}

.bstat-s .pos {
  color: var(--up);
  font-weight: 600;
}

.bstat-s .neg {
  color: var(--down);
  font-weight: 600;
}

.book-table-wrap {
  overflow-x: auto;
}

.ledger {
  font-variant-numeric: tabular-nums;
  min-width: 520px;
}

.ledger th.num, .ledger td.num {
  text-align: right;
}

.ledger td {
  border-top: 1px solid var(--line);
  padding: 5px 10px;
}

.ledger-row {
  cursor: pointer;
  box-shadow: inset 2px 0 0 var(--line-2);
}

.ledger-row.win {
  box-shadow: inset 2px 0 0 var(--up);
}

.ledger-row.loss {
  box-shadow: inset 2px 0 0 var(--down);
}

.ledger-row:hover {
  background: rgba(var(--hi), .04);
}

.ledger-dim {
  color: var(--faint);
}

.ledger-held {
  color: var(--faint);
  margin-left: 6px;
  font-size: 9.5px;
}

.pos-held {
  color: var(--faint);
  margin-left: 4px;
  font-size: 9.5px;
}

.ledger-since {
  margin-left: 4px;
  font-size: 9.5px;
}

.ledger-since.up {
  color: var(--up);
}

.ledger-since.down {
  color: var(--down);
}

.ledger-sym {
  color: var(--ink);
  font-weight: 500;
}

.ledger-leg {
  border: 1px solid var(--line-2);
  color: var(--muted);
  white-space: nowrap;
  border-radius: 3px;
  margin-left: 6px;
  padding: 1px 5px;
  font-size: 10px;
}

.ledger-leg.ce, .ledger-leg.pe {
  border-color: currentColor;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, currentColor 38%, transparent);
    }
  }
}

.ledger-leg.ce {
  color: var(--up);
}

.ledger-leg.pe {
  color: var(--down);
}

.ledger-reason {
  color: var(--muted);
  font-size: 10px;
}

.ledger-net.win {
  color: var(--up);
}

.ledger-net.loss {
  color: var(--down);
}

.ledger-net.flat {
  color: var(--faint);
}

.ledger-day td {
  background: var(--bg-2);
  border-top: 1px solid var(--line-2);
  padding: 5px 10px;
  font-size: 10.5px;
}

.book-empty {
  color: var(--muted);
  text-align: center;
  padding: 18px 12px;
  font-size: 12px;
}

.pager {
  display: flex;
  border-top: 1px solid var(--line);
  flex-wrap: wrap;
  align-items:  center;
  gap: 10px;
  padding: 7px 10px;
}

.pager-count {
  color: var(--faint);
  font-size: 10.5px;
}

.pager-nav {
  display: flex;
  align-items:  center;
  gap: 3px;
  margin-left: auto;
}

.pager-btn {
  cursor: pointer;
  color: var(--muted);
  border: 1px solid var(--line-2);
  background: none;
  border-radius: 5px;
  padding: 5px 8px;
  font-family: Geist Mono, monospace;
  font-size: 11px;
  line-height: 1;
}

.pager-btn.num {
  text-align: center;
  font-variant-numeric: tabular-nums;
  min-width: 26px;
}

.pager-btn:hover:not(:disabled) {
  color: var(--ink);
  border-color: var(--ink-dim);
}

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

.pager-btn.on {
  background: var(--ink);
  color: var(--btn-fg);
  border-color: var(--ink);
}

.pager-gap {
  color: var(--faint);
  padding: 0 2px;
  font-size: 11px;
}

@media (width <= 720px) {
  .book-tools {
    width: 100%;
  }

  .book-search, .book-reason, .book-size {
    flex: 120px;
    width: auto;
  }

  .pager-nav {
    margin-left: 0;
  }
}

.chart-btn {
  color: var(--muted);
  cursor: pointer;
  vertical-align: middle;
  background: none;
  border: 0;
  border-radius: 4px;
  margin-left: 6px;
  line-height: 1;
}

.chart-btn:hover {
  color: var(--accent);
  background: var(--accent);
}

.chart-btn:focus-visible {
  color: var(--accent);
  background: var(--accent);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--accent) 10%, transparent);
    }
  }
}

.chart-btn:hover {
  @supports (color: color-mix(in lab, red, red)) {
    & {
      background: color-mix(in srgb, var(--accent) 10%, transparent);
    }
  }
}

.chartmodal {
  position: relative;
  min-height: 320px;
}

.chartmodal-load {
  position: absolute;
  z-index: 3;
  display: flex;
  color: var(--muted);
  flex-direction: column;
  justify-content: center;
  align-items:  center;
  gap: 10px;
  font-size: 12px;
  inset: 0;
}

.chartmodal-spin {
  border: 2px solid var(--line-2);
  border-top-color: var(--accent);
  animation: chartspin .7s linear infinite;
  border-radius: 50%;
  width: 22px;
  height: 22px;
}

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

@media (prefers-reduced-motion: reduce) {
  .chartmodal-spin {
    animation-duration: 2.4s;
  }
}

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

.of-spin {
  border: 3px solid var(--line-2, #30363d);
  border-top-color: var(--accent, #f0b429);
  animation: of-spin .7s linear infinite;
  border-radius: 50%;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
}

@media (prefers-reduced-motion: reduce) {
  .of-spin {
    animation-duration: 2.4s;
  }
}

.ir-tools {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 6px;
}

.ir-tools .input {
  border-radius: 5px;
  padding: 3px 7px;
  font-size: 10.5px;
}

.ir-search {
  width: 150px;
}

.ir-filter {
  width: 165px;
}

.chart-btn {
  display: inline-flex;
  justify-content: center;
  align-items:  center;
  padding: 2px;
}

.chart-btn .chart-ico {
  display: block;
  opacity: .75;
}

.chart-btn:hover .chart-ico {
  opacity: 1;
}

.chart-btn:focus-visible .chart-ico {
  opacity: 1;
}

.ledger-chart {
  text-align: right;
  width: 30px;
  padding-right: 8px !important;
}

.insight-fno .ir-name {
  font-size: 10px;
}

.insight-fno .ir-meta {
  font-size: 9px;
}

.insight-fno .ir-pct {
  min-width: 31px;
  font-size: 10px;
}

.insight-fno .ir-status {
  font-size: 9px;
}

.insight-fno .ir-group-label {
  font-size: 8.5px;
}

.insight-fno .ir-group-count {
  font-size: 8px;
}

.insight-fno .ir-empty {
  font-size: 10px;
}

.insight-fno .ir-detail-sub {
  font-size: 9px;
}

.insight-fno .ir-tools .input, .insight-fno .insight-count, .insight-fno .insight-toggle {
  font-size: 9.5px;
}

.insight-fno .ir-gates.cols3 .ir-gate {
  font-size: 10px;
}

.insight-fno .ir-gates.cols3 .ir-gate-head {
  font-size: 7.5px;
}

.insight-fno .ir-gates.cols3 .g-formula, .insight-fno .ir-gates.cols3 .g-now {
  font-size: 9px;
}

.spa {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  align-items:  start;
  gap: 16px;
}

@media (width <= 1180px) {
  .spa {
    grid-template-columns: minmax(0, 1fr);
  }
}

.spa-main {
  min-width: 0;
}

.spa-identity {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
}

.spa-start {
  display: flex;
  color: var(--muted);
  flex-wrap: wrap;
  align-items:  center;
  gap: 8px;
  margin-bottom: 12px;
  font-size: 11px;
}

.spa-start > span {
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--faint);
  font-size: 9.5px;
}

.spa-start em {
  color: var(--faint);
  font-style: normal;
}

.spa-start .input {
  width: auto;
  font-size: 11px;
}

.spa-rail {
  position: sticky;
  border: 1px solid var(--line);
  background: var(--panel-2);
  overflow: auto;
  border-radius: 8px;
  align-self:  start;
  max-height: 72vh;
  top: 0;
}

.spa-railhd {
  position: sticky;
  z-index: 1;
  display: flex;
  background: var(--panel-2);
  border-bottom: 1px solid var(--line);
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--faint);
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  padding: 10px 12px;
  font-size: 9.5px;
  top: 0;
}

.spa-railhd b {
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  font-size: 20px;
}

.spa-railhd.bad b {
  color: var(--down);
}

.spa-railhd.ok, .spa-railhd.ok b {
  color: var(--up);
}

.spa-demands {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 0;
  padding: 4px;
}

.spa-demand {
  display: flex;
  text-align: left;
  color: inherit;
  cursor: pointer;
  background: none;
  border: 1px solid #0000;
  border-radius: 6px;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  padding: 7px 9px;
}

.spa-demand:hover {
  border-color: var(--down);
  background: var(--down);
}

.spa-demand:focus-visible {
  border-color: var(--down);
  background: var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--down) 35%, var(--line));
    }
  }
}

.spa-demand:hover {
  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--down) 35%, var(--line));
    }
  }
}

.spa-dpath {
  color: var(--ink);
  overflow-wrap: anywhere;
  font-size: 11px;
}

.spa-dmsg {
  color: var(--down);
  font-size: 10.5px;
}

.spa-railok {
  color: var(--muted);
  padding: 12px;
  font-size: 11.5px;
  line-height: 1.6;
}

.spa-railok p {
  margin: 0 0 6px;
}

.spa-railok .spa-sha {
  color: var(--up);
}

.spa-railnote {
  color: var(--faint);
  padding: 8px 10px;
  font-size: 10.5px;
}

.spa-railfoot {
  border-top: 1px solid var(--line);
  color: var(--faint);
  padding: 8px 12px;
  font-size: 10px;
  line-height: 1.55;
}

.spa-flash {
  outline: 2px solid var(--amber, #cf9f3f);
  outline-offset: 3px;
  border-radius: 4px;
}

.spa-prove {
  border: 1px solid var(--line);
  background: var(--panel-2);
  border-radius: 8px;
  margin-top: 14px;
  padding: 12px 14px;
}

.spa-provehd {
  display: flex;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--amber, #cf9f3f);
  align-items: baseline;
  gap: 10px;
  margin-bottom: 9px;
  font-size: 9.5px;
}

.spa-provehd em {
  letter-spacing: 0;
  text-transform: none;
  color: var(--faint);
  font-size: 10.5px;
  font-style: normal;
}

.spa-days {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 10px;
}

.spa-day {
  cursor: pointer;
  border: 1px solid var(--line);
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  background: none;
  border-radius: 5px;
  padding: 4px 9px;
  font-size: 11px;
}

.spa-day:hover {
  border-color: var(--muted);
  color: var(--ink);
}

.spa-day.on {
  border-color: var(--amber, #cf9f3f);
  color: var(--amber, #cf9f3f);
}

.spa-day i {
  opacity: .6;
  margin-left: 2px;
  font-style: normal;
}

.spa-proveact {
  display: flex;
  align-items:  center;
  gap: 10px;
}

.spa-verdict {
  display: flex;
  border-top: 1px solid var(--line);
  flex-wrap: wrap;
  align-items: baseline;
  gap: 18px;
  margin-top: 10px;
  padding-top: 10px;
}

.spa-verdict.wait {
  color: var(--muted);
  font-size: 11.5px;
}

.spa-net {
  font-variant-numeric: tabular-nums;
  font-size: 22px;
}

.spa-vk {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  font-size: 15px;
}

.spa-vk i {
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--faint);
  margin-left: 5px;
  font-size: 9.5px;
  font-style: normal;
}

.spa-open {
  color: var(--accent);
  margin-left: auto;
  font-size: 11px;
}

.spa-foothint {
  color: var(--faint);
  margin-right: auto;
  font-size: 10.5px;
}

.sped {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sped-status {
  position: sticky;
  z-index: 5;
  display: flex;
  border: 1px solid var(--line);
  background: var(--panel-2);
  border-radius: 6px;
  flex-wrap: wrap;
  align-items:  center;
  gap: 12px;
  padding: 6px 10px;
  font-size: 11.5px;
  top: 0;
}

.sped-status.ok {
  color: var(--up);
  border-color: var(--up);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--up) 40%, var(--line));
    }
  }
}

.sped-status.bad {
  color: var(--down);
  border-color: var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--down) 45%, var(--line));
    }
  }
}

.sped-status.wait {
  color: var(--muted);
}

.sped-lockmsg {
  color: var(--amber, var(--accent));
  margin-left: auto;
  font-size: 10.5px;
}

.sped-sec {
  border: 1px solid var(--line);
  background: var(--panel-2);
  border-radius: 8px;
}

.sped-head {
  display: flex;
  cursor: pointer;
  color: var(--ink);
  text-align: left;
  background: none;
  border: none;
  align-items: baseline;
  gap: 8px;
  width: 100%;
  padding: 7px 10px;
  font-size: 12px;
}

.sped-caret {
  color: var(--faint);
}

.sped-title {
  letter-spacing: .05em;
  text-transform: uppercase;
  font-size: 11.5px;
  font-weight: 700;
}

.sped-hint {
  color: var(--faint);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
  font-size: 10.5px;
}

.sped-headright {
  margin-left: auto;
}

.sped-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 4px 10px 12px;
}

.sped-badge {
  letter-spacing: .04em;
  border-radius: 4px;
  padding: 1px 6px;
  font-size: 9.5px;
}

.sped-badge.bad {
  color: var(--down);
  border: 1px solid var(--down);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border: 1px solid color-mix(in srgb, var(--down) 45%, var(--line));
    }
  }
}

.sped-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 10px 14px;
}

.sped-field {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.sped-field .input {
  box-sizing: border-box;
  width: 100%;
}

.sped-field.locked {
  opacity: .55;
}

.sped-label {
  display: flex;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  align-items: baseline;
  gap: 5px;
  font-size: 10.5px;
}

.sped-label em {
  color: var(--faint);
  font-size: 9.5px;
  font-style: normal;
}

.sped-tag {
  border: 1px solid var(--line-2);
  color: var(--faint);
  text-transform: uppercase;
  border-radius: 3px;
  padding: 0 4px;
  font-size: 8.5px;
  font-style: normal;
}

.sped-tag.hot {
  color: var(--up);
  border-color: var(--up);

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border-color: color-mix(in srgb, var(--up) 45%, var(--line));
    }
  }
}

.sped-tag.chg {
  color: var(--amber, var(--accent));
  border-color: currentColor;
}

.sped-range {
  color: var(--faint);
  font-size: 9.5px;
}

.sped-err {
  color: var(--down);
  word-break: break-word;
  font-size: 10px;
}

.input.bad {
  border-color: var(--down) !important;
}

.sped-pgroup {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sped-pgrouphd {
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--accent);
  font-size: 10px;
}

.sped-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
}

.sped-flag {
  display: flex;
  color: var(--muted);
  align-items:  center;
  gap: 6px;
  font-size: 11px;
}

.sped-flag.locked {
  opacity: .55;
}

.sped-sub {
  border-top: 1px dashed var(--line-2);
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 8px;
}

.sped-subhd {
  display: flex;
  color: var(--ink);
  align-items:  center;
  gap: 6px;
  font-size: 11px;
}

.sped-subhd em {
  color: var(--faint);
  font-size: 10px;
  font-style: normal;
}

.sped-note {
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.5;
}

.sped-note code {
  color: var(--muted);
}

.sped-legs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 12px;
}

.sped-leg {
  border: 1px solid var(--line-2);
  border-radius: 6px;
  min-width: 0;
  padding: 6px 8px;
}

.sped-leghd {
  display: flex;
  align-items:  center;
  gap: 8px;
  margin-bottom: 5px;
  font-size: 11px;
}

.sped-legacts {
  display: flex;
  gap: 4px;
  margin-left: auto;
}

.sped-leaf {
  display: flex;
  flex-wrap: wrap;
  align-items:  center;
  gap: 4px;
  margin-bottom: 3px;
}

.sped-leaf .sped-id {
  flex: none;
  width: 150px;
  font-size: 10.5px;
}

.sped-leaf .sped-expr {
  flex: 1;
  min-width: 160px;
  font-size: 11px;
}

.sped-node {
  border-left: 1px dashed var(--line-2);
  margin-top: 4px;
  padding-left: 6px;
}

.sped-noderow {
  display: flex;
  align-items:  center;
  gap: 5px;
  margin-bottom: 3px;
}

.sped-rules {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sped-rule {
  display: flex;
  align-items:  center;
  gap: 6px;
  font-size: 11px;
}

.sped-rule.ok > span:first-child {
  color: var(--up);
}

.sped-rule.bad > span:first-child {
  color: var(--down);
}

.sped-rule .input {
  flex: 1;
  font-size: 11px;
}

.sped-table {
  border-collapse: collapse;
  width: 100%;
  font-size: 11px;
}

.sped-table th {
  text-align: left;
  color: var(--faint);
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 3px 6px 3px 0;
  font-size: 9.5px;
  font-weight: 600;
}

.sped-table td {
  vertical-align: top;
  padding: 2px 6px 2px 0;
}

.sped-table td .input {
  box-sizing: border-box;
  width: 100%;
  font-size: 11px;
}

.sped-table tr.dim td {
  opacity: .55;
}

.sped-table tr.active td {
  color: var(--up);
}

.sped-note-cell {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 320px;
}

.sped-allerrs {
  border: 1px solid var(--down);
  color: var(--down);
  display: flex;
  overflow: auto;
  border-radius: 6px;
  flex-direction: column;
  gap: 3px;
  max-height: 180px;
  padding: 8px 10px;
  font-size: 10.5px;

  @supports (color: color-mix(in lab, red, red)) {
    & {
      border: 1px solid color-mix(in srgb, var(--down) 40%, var(--line));
    }
  }
}

.sped-allerrs b {
  color: var(--muted);
  font-weight: 600;
}

@media (width <= 560px) {
  .sped-leaf .sped-id {
    width: 100%;
  }

  .sped-legs {
    grid-template-columns: 1fr;
  }
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-ordinal {
  syntax: "*";
  inherits: false
}

@property --tw-slashed-zero {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-figure {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-spacing {
  syntax: "*";
  inherits: false
}

@property --tw-numeric-fraction {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-outline-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}

@keyframes pulse {
  50% {
    opacity: .5;
  }
}

@layer properties {
  @supports ((-webkit-hyphens: none) and ( not (margin-trim: inline))) or ((-moz-orient: inline) and ( not (color:rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-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;
    }
  }
}
