@font-face {
    font-family: Inter;
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("/fonts/inter-latin-wght.woff2") format("woff2");
}

@font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("/fonts/ibm-plex-mono-400.woff2") format("woff2");
}

@font-face {
    font-family: "IBM Plex Mono";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("/fonts/ibm-plex-mono-500.woff2") format("woff2");
}

:root {
    --bg: #09090B;
    --bg-elev: #0C0C0E;
    --surface: #141416;
    --raised: #1C1C1F;
    --line: #2C2C30;
    --line-strong: #3F3F46;
    --text: #FAFAFA;
    --muted: #A1A1AA;
    --faint: #71717A;
    --amber: #F5A524;
    --amber-dim: rgba(245, 165, 36, 0.12);
    --green: #30D158;
    --red: #FF453A;
    --blue: #64D2FF;
    --sidebar: 248px;
    --radius: 12px;
    --radius-sm: 8px;
    --shadow: none;
    --sans: "Inter", "Segoe UI", sans-serif;
    --mono: "IBM Plex Mono", ui-monospace, monospace;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
html { color-scheme: dark; }
body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: var(--sans);
    font-size: 16px;
    line-height: 1.55;
    font-feature-settings: "kern";
    -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
.num, .kpi-value, .mono {
    font-family: var(--mono);
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

.shell {
    display: grid;
    grid-template-columns: var(--sidebar) 1fr;
    min-height: 100vh;
}

.sidebar {
    background: var(--bg-elev);
    border-right: 1px solid var(--line);
    padding: 20px 14px 18px;
    display: flex;
    flex-direction: column;
}
.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 2px 8px 22px;
}
.brand-logo-wrap {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border-radius: 12px;
    overflow: hidden;
    background: #05070a;
    box-shadow: 0 0 0 1px var(--line);
}
.brand-logo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.32);
}
.brand-copy { display: flex; flex-direction: column; min-width: 0; }
.brand-mark {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--text);
}
.brand-sub { display: none; }

.nav { padding: 0 2px; }
.nav a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 12px;
    margin-bottom: 4px;
    color: var(--muted);
    border-radius: var(--radius-sm);
    font-weight: 500;
}
.nav a:hover {
    color: var(--text);
    background: rgba(255, 255, 255, 0.04);
}
.nav a.active {
    color: var(--text);
    background: #2A2A2E;
}
.nav-wait {
    min-width: 1.4em;
    padding: 0 6px;
    border-radius: 999px;
    border: 1px solid rgba(228, 178, 74, 0.4);
    background: rgba(228, 178, 74, 0.12);
    color: #E4B24A;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
}
.nav-wait[hidden] { display: none !important; }

.nav .sec {
    margin: 18px 12px 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--faint);
}

.sidebar-foot {
    margin-top: auto;
    padding: 16px 10px 4px;
    color: var(--faint);
    font-size: 13px;
    line-height: 1.45;
}

.main { display: flex; flex-direction: column; min-width: 0; background: var(--bg); }
.topbar {
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 22px;
    border-bottom: 1px solid var(--line);
    background: rgba(12, 12, 14, 0.92);
    backdrop-filter: blur(14px);
    position: sticky;
    top: 0;
    z-index: 5;
}
.top-left, .top-right { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.board-tags {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    flex-wrap: wrap;
    gap: 4px;
    min-width: 0;
}
.board-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 22px;
    padding: 0 6px;
    border-radius: 6px;
    border: 1px solid var(--line);
    background: var(--raised);
    color: var(--faint);
    font-family: var(--mono);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1;
    text-decoration: none;
    font-variant-numeric: tabular-nums;
}
.board-tag.is-open {
    color: var(--green);
    border-color: rgba(48, 209, 88, 0.4);
    background: rgba(48, 209, 88, 0.12);
}
.board-tag.is-closed {
    color: var(--faint);
    border-color: var(--line);
    background: var(--raised);
}
.board-tag.is-open-soon {
    color: var(--amber);
    border-color: rgba(245, 165, 36, 0.45);
    background: var(--amber-dim);
}
.board-tag.is-close-soon {
    color: var(--red);
    border-color: rgba(255, 69, 58, 0.4);
    background: rgba(255, 69, 58, 0.12);
}
.board-tag.is-lunch {
    color: var(--blue);
    border-color: rgba(100, 210, 255, 0.4);
    background: rgba(100, 210, 255, 0.12);
}
.dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 0 4px rgba(48, 209, 88, 0.14);
}
.dot.warn {
    background: var(--amber);
    box-shadow: 0 0 0 4px var(--amber-dim);
}
.status { color: var(--muted); font-size: 13px; }

.chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    max-width: 14rem;
    padding: 0 10px;
    border-radius: 999px;
    background: var(--raised);
    border: 1px solid var(--line);
    color: var(--muted);
    font-size: 12px;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.chip .mono { font-size: 12px; color: var(--text); min-width: 0; overflow: hidden; text-overflow: ellipsis; }
a.chip.wait-chip {
    color: #E4B24A;
    border-color: rgba(228, 178, 74, 0.45);
    background: rgba(228, 178, 74, 0.12);
    text-decoration: none;
    max-width: 18rem;
    font-weight: 600;
}
a.chip.wait-chip:hover { color: #F0C56A; }
a.chip.wait-chip[hidden] { display: none !important; }

.lang-switch {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 2px;
    border-radius: 999px;
    background: var(--raised);
    border: 1px solid var(--line);
    gap: 0;
}
.lang-switch button {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    border: 0;
    background: transparent;
    color: var(--muted);
    font-family: var(--sans);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    min-height: 24px;
    padding: 0 8px;
    border-radius: 999px;
    cursor: pointer;
}
.lang-switch button.is-on {
    background: var(--panel, #1C1C1F);
    color: var(--text);
}
.lang-switch button:hover {
    border-color: transparent;
    background: transparent;
}
.lang-switch button.is-on:hover {
    background: var(--panel, #1C1C1F);
    color: var(--text);
}

.badge {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--raised);
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.badge-test { color: var(--text); }
.badge-paper { color: var(--muted); }
.badge-live { color: var(--amber); }
.badge-halted { color: var(--red); }

.content { padding: 22px 24px 40px; max-width: 1440px; }

.page-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 18px;
    min-height: 40px;
}
.page-head h1 {
    margin: 0;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -0.03em;
}
.page-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin: -6px 0 18px;
    border-bottom: 1px solid var(--line);
}
.page-tabs a {
    margin-bottom: -1px;
    padding: 8px 14px;
    border-bottom: 2px solid transparent;
    color: var(--muted);
    font-size: 14px;
    font-weight: 600;
}
.page-tabs a:hover { color: var(--text); }
.page-tabs a.is-on {
    color: var(--text);
    border-bottom-color: var(--text);
}
.page-lede {
    margin: -6px 0 20px;
    color: var(--muted);
    font-size: 15px;
    max-width: 46rem;
    line-height: 1.55;
}
.lede { display: none; }
.desk-path {
    list-style: none;
    margin: 0 0 22px;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}
.desk-path li {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel, var(--card, #141416));
    min-height: 88px;
}
.desk-path .path-mark {
    display: inline-block;
    width: fit-content;
    margin: 0 0 8px;
    padding: 2px 7px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: #2C2C30;
    color: var(--muted);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.desk-path li[data-path-state="now"] {
    border-color: #FAFAFA;
    background: #1C1C1F;
}
.desk-path li[data-path-state="now"] .path-mark {
    background: #FAFAFA;
    color: #09090B;
}
.desk-path li[data-path-state="off"] {
    opacity: 0.62;
    border-style: dashed;
}
.desk-path li[data-path-state="wait"] .path-mark {
    background: transparent;
    border-color: var(--line);
}
.desk-path strong {
    display: block;
    font-size: 13px;
    font-weight: 600;
}
.desk-path [data-path-note] {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.4;
}
@media (max-width: 980px) {
    .desk-path { grid-template-columns: 1fr 1fr; }
}

.actions { display: flex; align-items: center; gap: 8px; }
.actions form { display: flex; margin: 0; }
.page-head-form {
    display: flex;
    align-items: flex-end;
    gap: 10px;
}
.page-head-form .field,
.page-head-form .field-action {
    margin: 0;
}
.page-head-form .field {
    min-width: 12rem;
}
.page-head-form .field-action button {
    width: auto;
}
button,
.btn,
input[type="submit"],
input[type="button"] {
    -webkit-appearance: none;
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 0 14px;
    border: 1px solid var(--line-strong);
    border-radius: 10px;
    background: var(--raised);
    color: var(--text);
    font-family: var(--sans);
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.01em;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}
button:hover, .btn:hover, input[type="submit"]:hover, input[type="button"]:hover {
    border-color: var(--muted);
    background: #27272A;
}
button:focus-visible, .btn:focus-visible, input[type="submit"]:focus-visible, input[type="button"]:focus-visible {
    outline: 2px solid var(--muted);
    outline-offset: 2px;
}
button:disabled, .btn:disabled {
    opacity: 0.45;
    cursor: default;
}
button.primary, .btn.primary {
    background: #F4F4F5;
    color: #09090B;
    border-color: #F4F4F5;
    font-weight: 600;
}
button.primary:hover, .btn.primary:hover {
    background: #FFFFFF;
    border-color: #FFFFFF;
}

.kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.kpis > .card {
    border-right: 0;
    margin-bottom: 0;
}
.card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 16px 18px;
    margin-bottom: 14px;
    box-shadow: var(--shadow);
}
.card h2, .label {
    margin: 0 0 8px;
    font-size: 12px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--faint);
    font-weight: 600;
}
.kpi-value { font-size: 26px; letter-spacing: -0.03em; line-height: 1.2; }
.hint { color: var(--faint); font-size: 14px; margin-top: 6px; line-height: 1.45; }
a.story { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
a.story:hover { color: #FAFAFA; }
.story-read { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 8px 14px; }
tbody tr.row-focus,
tbody tr:target {
    background: #1C1C1F;
    box-shadow: inset 3px 0 0 #FAFAFA;
}
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.grid.three { grid-template-columns: 1fr 1fr 1fr; }
.grid.equal { grid-template-columns: 1fr 1fr; }
.grid > .card { margin-bottom: 0; }
.chart { height: 260px; }
.chart.tape { height: 360px; min-height: 300px; }
.chart.exposure { height: 360px; min-height: 300px; }
.chart.tape.name { height: 220px; min-height: 200px; }
.chart.tape.spark { height: 44px; min-height: 44px; width: 140px; }
.tape-card { padding: 16px 16px 10px; }
.grid.names { grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 12px; }
.card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 10px;
}
.card-head h2 { margin-bottom: 4px; }
.card-more {
    margin: -4px 0 12px;
    font-size: 14px;
}
.card-more a {
    color: var(--text);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.card-head .hint { margin-top: 0; }
td.tape { width: 156px; vertical-align: middle; }
.holdings {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.holding {
    display: grid;
    grid-template-columns: minmax(13rem, 16rem) minmax(14rem, 1fr) 176px minmax(18rem, 22rem);
    gap: 16px 20px;
    align-items: center;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--raised);
}
.holding-who .name-cell {
    white-space: normal;
    flex-wrap: wrap;
}
.holding-who .name-legal { max-width: none; }
.holding-theme {
    margin-top: 6px;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
}
.holding-why { min-width: 0; }
.holding-why.event-cell { max-width: none; }
.holding-why .story,
.holding-why .hint { -webkit-line-clamp: 3; }
.holding-tape { justify-self: stretch; }
.holding-tape .chart.tape.spark { width: 100%; height: 56px; min-height: 56px; }
.holding-money {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 12px;
    margin: 0;
}
.holding-money dt {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--faint);
}
.holding-money dd { margin: 0; font-size: 15px; line-height: 1.3; }
.holding-money .hint { margin-top: 2px; font-size: 12px; }
.holding-money .is-pnl dd { font-size: 18px; font-weight: 600; }
.holding.session-closed { color: var(--faint); }
.holding.session-closed .holding-theme,
.holding.session-closed .hint { color: #52525B; }
.holding.session-closed .pos { color: #2A7A3D; }
.holding.session-closed .neg { color: #B4231C; }
tr.session-closed { color: var(--faint); }
tr.session-closed .hint { color: #52525B; }
tr.session-closed .pos { color: #2A7A3D; }
tr.session-closed .neg { color: #B4231C; }
.holding-empty {
    margin: 4px 0 0;
    color: var(--faint);
    font-size: 14px;
}
button.spark {
    display: block;
    min-height: 0;
    padding: 2px;
    border: 1px solid var(--line);
    background: #0C0C0E;
    border-radius: 8px;
    line-height: 0;
}
button.spark:hover { border-color: var(--muted); background: #0C0C0E; }
.names-gallery[hidden] { display: none !important; }
dialog.chart-focus {
    width: min(920px, calc(100vw - 32px));
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--text);
    border-radius: var(--radius);
    padding: 16px 18px 12px;
}
dialog.chart-focus::backdrop { background: rgba(0, 0, 0, 0.64); }
dialog.chart-focus .chart.tape { height: 420px; min-height: 320px; }
.chart-focus-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}
.chart-focus-bar h2 {
    margin: 0;
    font-size: 18px;
    letter-spacing: -0.02em;
    text-transform: none;
    color: var(--text);
}
.chart-range { display: flex; flex-wrap: wrap; gap: 6px; }
.chart-range button {
    min-width: 4.25rem;
    min-height: 32px;
    padding: 0 10px;
    font-size: 13px;
}
.chart-range button[aria-pressed="true"] {
    background: #F4F4F5;
    color: #09090B;
    border-color: transparent;
    font-weight: 600;
}

table { width: 100%; border-collapse: collapse; font-size: 15px; }
th {
    text-align: left;
    color: var(--faint);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 10px 14px 10px 0;
    border-bottom: 1px solid var(--line);
}
td {
    padding: 12px 14px 12px 0;
    border-bottom: 1px solid #232326;
    vertical-align: top;
}
tbody tr.is-theme td { background: #1C1C1F; }
tbody tr.is-theme td:first-child { box-shadow: inset 2px 0 0 var(--text); }
tbody tr.is-dim { opacity: 0.32; }
tbody tr.is-dim:hover { opacity: 0.55; }
tr:last-child td { border-bottom: 0; }
tr:hover td { background: transparent; }
tbody tr { transition: background 0.12s ease, color 0.12s ease; }
tbody tr:hover { background: rgba(255, 255, 255, 0.025); }
tbody tr.session-closed td { color: var(--faint); }
tbody tr.session-closed .hint { color: #52525B; }
tbody tr.session-closed .pos { color: #2A7A3D; }
tbody tr.session-closed .neg { color: #B4231C; }
.name-pack {
    display: grid;
    gap: 8px;
}
.name-cell {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.name-stack {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    white-space: normal;
}
.name-legal {
    color: var(--faint);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.25;
    max-width: 14rem;
}
.pill.lang { margin-right: 6px; font-size: 11px; letter-spacing: 0.04em; }
.pill.session-open { color: var(--text); border-color: var(--line-strong); }
.pill.session-closed, .pill.session-unknown { color: var(--faint); }

.pos { color: var(--green); }
.neg { color: var(--red); }

.impacts {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    align-items: center;
}
.impact {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 22px;
}
.impact-sym {
    font-size: 13px;
    letter-spacing: 0.02em;
}
.dir {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    flex: 0 0 18px;
}
.dir svg {
    width: 10px;
    height: 10px;
    display: block;
    fill: currentColor;
}
.dir-up {
    color: var(--green);
    background: rgba(48, 209, 88, 0.16);
}
.dir-down {
    color: var(--red);
    background: rgba(255, 69, 58, 0.16);
}
.dir-flat {
    color: var(--faint);
    background: var(--raised);
}
.pill.buy {
    color: var(--green);
    border-color: rgba(48, 209, 88, 0.28);
    background: rgba(48, 209, 88, 0.08);
}
.pill.sell {
    color: var(--red);
    border-color: rgba(255, 69, 58, 0.28);
    background: rgba(255, 69, 58, 0.08);
}

.flash {
    border: 1px solid var(--line);
    background: var(--raised);
    color: var(--text);
    padding: 12px 14px;
    margin-bottom: 16px;
    border-radius: var(--radius-sm);
}
.flash.error {
    border-color: rgba(240, 113, 113, 0.4);
    background: rgba(240, 113, 113, 0.1);
}

.desk-banner {
    display: none;
    border: 1px solid #3F3F46;
    background: #1C1C1F;
    color: #FAFAFA;
    padding: 12px 14px;
    margin-bottom: 16px;
    border-radius: 10px;
    gap: 8px;
    align-items: baseline;
}
.desk-banner.is-on { display: flex; flex-wrap: wrap; }
.desk-banner[hidden] { display: none !important; }
.desk-banner strong { font-weight: 600; }
.desk-banner span { color: var(--muted); }

.pill.queue { color: #E4B24A; border-color: rgba(228, 178, 74, 0.35); background: rgba(228, 178, 74, 0.08); }
.pill.warn { color: var(--amber); border-color: rgba(245, 165, 36, 0.35); background: var(--amber-dim); }
.kpi-value.warn { color: var(--amber); }
.field.check label { display: flex; align-items: center; gap: 10px; color: var(--text); }
.field.check input[type="checkbox"] {
    appearance: none;
    width: 18px;
    height: 18px;
    min-width: 18px;
    min-height: 18px;
    flex: 0 0 18px;
    margin: 0;
    padding: 0;
    border: 1px solid #71717A;
    border-radius: 4px;
    background: #09090B center / 12px 12px no-repeat;
    cursor: pointer;
}
.field.check input[type="checkbox"]:checked {
    border-color: #FAFAFA;
    background-color: #FAFAFA;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'><path fill='none' stroke='%2309090B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.2 6.2 4.8 8.8 9.8 3.2'/></svg>");
}
.field.check input[type="checkbox"]:focus-visible {
    border-color: #A1A1AA;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);
}
tr.is-click { cursor: pointer; }
tr.is-click:hover td { background: #141416; }
.story-dialog {
    width: min(560px, calc(100vw - 32px));
    border: 1px solid var(--line);
    background: #141416;
    color: var(--text);
    border-radius: 12px;
    padding: 18px;
}
.story-dialog::backdrop { background: rgba(0, 0, 0, 0.55); }
.story-steps { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 12px; }
.story-steps strong { display: block; margin-bottom: 2px; }
.replay-tape { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.replay-tape li {
    display: grid;
    grid-template-columns: 84px auto 1fr;
    gap: 12px;
    align-items: start;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--bg);
}
.replay-tape li.is-now { border-color: #71717A; background: #1C1C1F; }
.replay-tape li.empty { grid-template-columns: 1fr; color: var(--faint); }
.chart.compact { height: 220px; }
.chart.calendar { height: 220px; min-height: 180px; }
.chart.sessions { height: 320px; min-height: 280px; }

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
form.form-grid[hidden] { display: none; }
[data-sim-reset] {
    margin-top: 4px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}
.form-grid.news-filters,
.form-grid.events-filters { grid-template-columns: 1fr 1fr 1fr; }
.form-grid.news-filters .field.search,
.form-grid.events-filters .field.search { grid-column: 1 / -1; }
.field.span-2 { grid-column: 1 / -1; }
.field label {
    display: block;
    font-size: 13px;
    color: var(--muted);
    margin-bottom: 6px;
    font-weight: 500;
}
.field input:not([type="checkbox"]), .field select, .field textarea {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    min-height: 40px;
    background: var(--bg);
    border: 1px solid var(--line);
    color: var(--text);
    border-radius: 10px;
    padding: 0 12px;
    font-family: var(--sans);
    font-size: 14px;
    line-height: 1.4;
}
.field select {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%23A1A1AA' d='M1 1.5L6 6.5L11 1.5'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
}
.field textarea { min-height: 72px; resize: vertical; padding: 10px 12px; }
.field input:not([type="checkbox"]):focus, .field select:focus, .field textarea:focus {
    outline: none;
    border-color: #71717A;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06);
}
.field .help { margin-top: 5px; color: var(--faint); font-size: 13px; }

.pill {
    display: inline-flex;
    align-items: center;
    max-width: 11rem;
    padding: 2px 7px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--bg);
    font-size: 11px;
    line-height: 1.25;
    color: var(--muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}
.pill.exec { color: var(--green); border-color: rgba(48, 209, 88, 0.28); background: rgba(48, 209, 88, 0.08); }
.pill.reject { color: var(--red); border-color: rgba(255, 69, 58, 0.28); background: rgba(255, 69, 58, 0.08); }
.pill.observe { color: var(--muted); }
.pill.news-waiting { color: var(--amber); border-color: rgba(245, 165, 36, 0.35); background: var(--amber-dim); }
.pill.news-look { color: var(--text); border-color: var(--line-strong); background: #2A2A2E; }
.pill.news-ignored { color: var(--faint); border-color: var(--line); background: transparent; }
.pill.news-grouped { color: var(--muted); border-color: #3F3F46; background: #1C1C1F; }
.pill.news-used { color: #E4B24A; border-color: rgba(228, 178, 74, 0.35); background: rgba(228, 178, 74, 0.08); }
[data-tip] { cursor: help; }
#desk-tip {
    position: fixed;
    z-index: 80;
    max-width: 280px;
    padding: 8px 10px;
    border-radius: 8px;
    background: #1C1C1F;
    border: 1px solid #3F3F46;
    color: #FAFAFA;
    font-size: 13px;
    line-height: 1.45;
    pointer-events: none;
}

.feed-status { display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 18px; }
.feed-add { margin-bottom: 16px; }
.feed-add .form-grid { margin-top: 14px; }
.filter-pair {
    display: flex;
    gap: 10px;
    align-items: stretch;
}
.filter-pair input,
.filter-pair select {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
}
.filter-pair button {
    flex: 0 0 auto;
    width: auto;
    min-height: 40px;
    padding-left: 16px;
    padding-right: 16px;
    white-space: nowrap;
}
.field-action { display: flex; align-items: flex-end; }
.field-action button { width: 100%; }
.field-action .row-actions { width: 100%; }
.field-action .row-actions button { width: auto; }
.form-bar { display: flex; justify-content: flex-end; margin: 0 0 14px; }
.pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
}
.pager p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}
.pager-actions { display: flex; gap: 8px; }
.pager a {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    color: var(--text);
    font-size: 13px;
    font-weight: 500;
}
.pager a.is-off {
    color: var(--faint);
    pointer-events: none;
}
.filter-clear { margin: 12px 0 0; }
.filter-clear a { color: var(--muted); font-size: 13px; }
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.key-state { min-height: 42px; display: flex; align-items: center; }
td.feed-url {
    max-width: 220px;
    font-family: var(--mono);
    font-size: 13px;
    color: var(--muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
td.row-actions, .field-action .row-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.row-actions button,
.row-actions .btn {
    min-height: 32px;
    padding: 0 10px;
    font-size: 13px;
}
td.row-actions { width: 1%; white-space: nowrap; }
td.row-actions form { display: inline-block; }
.row-actions .btn { text-decoration: none; }
tr.group-row td {
    padding-top: 16px;
    color: var(--faint);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-bottom-color: var(--line);
}
tr.group-row:first-child td { padding-top: 4px; }

.split { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 14px; }
.split > .card { margin-bottom: 0; }
.version-list { display: flex; flex-direction: column; gap: 2px; }
.version-item {
    border-bottom: 1px solid var(--line);
    padding: 12px 0;
}
.version-item:last-child { border-bottom: 0; }
.version-item strong { display: block; font-size: 15px; font-weight: 600; letter-spacing: -0.01em; }

.event-cell {
    max-width: 22rem;
}
.event-cell .story,
.event-cell .hint {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.now-card { margin-bottom: 14px; }
.now-card .kpi-value { font-size: 20px; letter-spacing: -0.02em; max-width: 42rem; }
.now-card .hint { margin-top: 8px; }
.overview-split { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.8fr); gap: 14px; margin-bottom: 14px; }
.overview-split > .card { margin-bottom: 0; }
.nav-mobile { display: none; }

@media (max-width: 1100px) {
    .shell { grid-template-columns: 1fr; }
    .sidebar { display: none; }
    .nav-mobile {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 4px;
        overflow-x: auto;
        padding: 8px 12px;
        border-bottom: 1px solid var(--line);
        background: var(--bg-elev);
    }
    .nav-mobile .sec { display: none; }
    .nav-mobile a {
        flex: 0 0 auto;
        margin: 0;
        white-space: nowrap;
        padding: 7px 10px;
    }
    .kpis { grid-template-columns: 1fr 1fr; }
    .grid, .grid.three, .grid.names, .form-grid, .split, .overview-split { grid-template-columns: 1fr; }
    .holding {
        grid-template-columns: minmax(0, 1fr) 160px;
    }
    .holding-money { grid-column: 1 / -1; }
    .content { padding: 16px; }
    .chip { max-width: 9rem; }
}

.sign-out { margin: 0; }
.sign-out button {
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: transparent;
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.person { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.person:first-of-type { margin-top: 8px; }
.person-name {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--text);
}
.person-name .pill { margin-left: 8px; font-weight: 500; letter-spacing: 0.04em; text-transform: none; }
.person form + form { margin-top: 12px; }

.login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
}
.login-card {
    width: min(420px, 100%);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 28px 24px 24px;
}
.login-brand {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}
.login-brand img { display: block; }
.login-card h1 { margin: 0 0 6px; font-size: 22px; font-weight: 600; }
.login-lead { margin: 0 0 18px; color: var(--muted); }
.login-card .flash { margin-bottom: 14px; }
.login-card .field { margin-bottom: 14px; }
.login-card button[type="submit"] { width: 100%; margin-top: 4px; }