:root {
    color-scheme: dark;
    --body-bg:
        radial-gradient(circle at top left, rgba(14, 165, 233, 0.14), transparent 32rem),
        linear-gradient(180deg, #0a1019 0%, #080d14 44%, #070b11 100%);
    --header-bg: rgba(8, 13, 20, 0.82);
    --bg: #080d14;
    --bg-elevated: #0d1420;
    --panel: rgba(15, 23, 34, 0.88);
    --panel-strong: #111b28;
    --panel-soft: rgba(18, 28, 41, 0.72);
    --line: rgba(148, 163, 184, 0.16);
    --line-strong: rgba(148, 163, 184, 0.28);
    --text: #e6edf5;
    --text-strong: #f8fafc;
    --muted: #96a3b5;
    --muted-strong: #b9c4d4;
    --link: #7dd3fc;
    --field-bg: rgba(8, 13, 20, 0.72);
    --table-head: rgba(17, 27, 40, 0.94);
    --table-row-hover: rgba(56, 189, 248, 0.055);
    --detail-row-bg: rgba(8, 13, 20, 0.5);
    --chart-panel: linear-gradient(180deg, rgba(15, 23, 34, 0.94), rgba(9, 14, 22, 0.92));
    --chart-grid: rgba(148, 163, 184, 0.12);
    --chart-text: #96a3b5;
    --chart-green-fill: rgba(52, 211, 153, 0.12);
    --blue: #38bdf8;
    --blue-strong: #0ea5e9;
    --green: #34d399;
    --red: #fb7185;
    --orange: #f59e0b;
    --shadow: 0 20px 60px rgba(0, 0, 0, 0.32);
    --radius: 8px;
    --radius-sm: 6px;
}

/* Ideas and roadmap */
.idea-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 1rem 0;
}

.idea-tabs a {
    padding: 0.55rem 0.85rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    background: var(--panel-soft);
    text-decoration: none;
}

.idea-tabs a:hover,
.idea-tabs a.active {
    color: var(--theme-primary);
    border-color: var(--theme-primary);
    background: var(--theme-secondary-bg);
}

.idea-board-panel,
.idea-merge-panel,
.idea-withdraw-panel {
    margin-top: 1rem;
}

.idea-filters,
.idea-admin-filters {
    margin-bottom: 1rem;
}

.idea-list {
    display: grid;
    gap: 0.75rem;
}

.idea-row {
    display: grid;
    grid-template-columns: 5rem minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius, 0.75rem);
    background: var(--panel-soft);
}

.idea-vote-count {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 4.25rem;
    border-right: 1px solid var(--line);
    color: var(--muted);
}

.idea-vote-count strong,
.idea-voting-total {
    color: var(--text);
    font-size: 1.65rem;
    line-height: 1;
}

.idea-row-content h2 {
    margin: 0.35rem 0 0.45rem;
    font-size: 1.05rem;
}

.idea-row-content p {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--muted);
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.idea-row-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem;
    color: var(--muted);
    font-size: 0.82rem;
}

.idea-details-grid,
.idea-admin-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(17rem, 1fr);
    gap: 1rem;
}

.idea-detail-content,
.idea-voting-panel {
    min-width: 0;
}

.idea-detail-section + .idea-detail-section {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--line);
}

.idea-detail-section h2 {
    font-size: 1rem;
}

.idea-detail-section p {
    margin-bottom: 0;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.product-response {
    padding: 1rem;
    border: 1px solid var(--theme-primary);
    border-radius: var(--radius, 0.75rem);
    background: var(--theme-secondary-bg);
}

.idea-voting-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    align-self: start;
    text-align: center;
}

.idea-voting-panel form,
.idea-voting-panel button {
    width: 100%;
}

.idea-privacy-notice {
    border-left: 4px solid var(--warning, #f59e0b);
}

@media (max-width: 850px) {
    .idea-details-grid,
    .idea-admin-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .idea-row {
        grid-template-columns: 1fr;
    }

    .idea-vote-count {
        flex-direction: row;
        gap: 0.4rem;
        justify-content: flex-start;
        min-height: auto;
        padding-bottom: 0.65rem;
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }
}

html[data-theme="light"] {
    color-scheme: light;
    --body-bg:
        radial-gradient(circle at top left, rgba(14, 165, 233, 0.16), transparent 30rem),
        linear-gradient(180deg, #f8fbff 0%, #eef4f9 46%, #e9eef5 100%);
    --header-bg: rgba(248, 251, 255, 0.88);
    --bg: #f8fbff;
    --bg-elevated: #ffffff;
    --panel: rgba(255, 255, 255, 0.9);
    --panel-strong: #ffffff;
    --panel-soft: rgba(241, 245, 249, 0.88);
    --line: rgba(15, 23, 42, 0.12);
    --line-strong: rgba(15, 23, 42, 0.2);
    --text: #1f2937;
    --text-strong: #07111f;
    --muted: #64748b;
    --muted-strong: #334155;
    --link: #0369a1;
    --field-bg: rgba(255, 255, 255, 0.92);
    --table-head: rgba(241, 245, 249, 0.96);
    --table-row-hover: rgba(14, 165, 233, 0.08);
    --detail-row-bg: rgba(241, 245, 249, 0.72);
    --chart-panel: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(241, 245, 249, 0.92));
    --chart-grid: rgba(71, 85, 105, 0.14);
    --chart-text: #64748b;
    --chart-green-fill: rgba(5, 150, 105, 0.1);
    --blue: #0284c7;
    --blue-strong: #0369a1;
    --green: #059669;
    --red: #dc2626;
    --orange: #d97706;
    --shadow: 0 18px 42px rgba(15, 23, 42, 0.12);
}

html {
    font-size: 15px;
    min-height: 100%;
}

body {
    background: var(--body-bg);
    color: var(--text);
    display: flex;
    flex-direction: column;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    min-height: 100vh;
    margin: 0;
    overflow-x: clip;
}

main {
    flex: 1 0 auto;
    padding-top: 1.25rem;
    padding-bottom: 2rem;
}

a {
    color: var(--link);
    text-decoration: none;
    transition: color 160ms ease, opacity 160ms ease;
}

a:hover {
    color: var(--text-strong);
}

.app-shell {
    max-width: 1480px;
    padding-left: clamp(0.9rem, 2vw, 1.5rem);
    padding-right: clamp(0.9rem, 2vw, 1.5rem);
}

.app-header {
    background: var(--header-bg);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
    position: sticky;
    top: 0;
    z-index: 1030;
    backdrop-filter: blur(18px);
}

.app-nav {
    min-height: 68px;
    padding: 0.65rem 0;
}

.navbar-toggler {
    border-color: var(--line-strong);
    box-shadow: none;
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.16);
}

.app-brand {
    align-items: center;
    color: var(--text-strong) !important;
    display: inline-flex;
    font-weight: 800;
    gap: 0.65rem;
    letter-spacing: 0;
}

.brand-mark {
    align-items: center;
    background: linear-gradient(135deg, var(--blue), var(--green));
    border-radius: var(--radius-sm);
    color: #041017;
    display: inline-flex;
    font-size: 0.82rem;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.app-nav-links {
    align-items: center;
    gap: 0.15rem;
    min-width: 0;
}

.app-nav .nav-link {
    align-items: center;
    border-radius: var(--radius-sm);
    color: var(--muted-strong) !important;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.15;
    padding: 0.45rem 0.7rem;
    white-space: nowrap;
}

.app-nav .nav-link:hover,
.app-nav .nav-link:focus {
    background: rgba(56, 189, 248, 0.1);
    color: var(--text-strong) !important;
}

.app-nav .nav-link.active {
    background: linear-gradient(135deg, rgba(56, 189, 248, 0.18), rgba(52, 211, 153, 0.1));
    border: 1px solid rgba(56, 189, 248, 0.24);
    color: var(--text-strong) !important;
    box-shadow: inset 0 -2px 0 var(--blue);
}

html[data-theme="light"] .navbar-toggler {
    filter: invert(1);
}

.app-nav-actions {
    align-items: center;
    display: flex;
    gap: 0.65rem;
    margin-left: 0.75rem;
    white-space: nowrap;
}

.logout-link {
    background: transparent;
    border: 1px solid var(--line);
    display: inline-flex;
    line-height: 1.15;
    min-height: 36px;
    white-space: nowrap;
}

.admin-support-link {
    background: var(--panel-soft);
    border: 1px solid var(--line-strong);
    min-height: 36px;
}

.theme-toggle {
    background: var(--panel-soft);
    border-color: var(--line-strong);
    box-shadow: none;
    color: var(--text);
    gap: 0.45rem;
    min-height: 36px;
    padding: 0.42rem 0.7rem;
}

.theme-toggle:hover {
    box-shadow: none;
}

.theme-toggle-icon {
    background: linear-gradient(135deg, var(--blue), var(--green));
    border-radius: 999px;
    display: inline-block;
    height: 0.72rem;
    width: 0.72rem;
}

h1,
h2,
h3 {
    color: var(--text-strong);
    letter-spacing: 0;
}

h1 {
    font-size: clamp(1.85rem, 3vw, 3rem);
    font-weight: 850;
    line-height: 1.05;
}

h2 {
    font-size: 1.12rem;
    font-weight: 800;
}

button:not(.btn):not(.topbar-link),
.button {
    align-items: center;
    background: linear-gradient(135deg, var(--blue-strong), #2563eb);
    border: 1px solid rgba(125, 211, 252, 0.26);
    border-radius: var(--radius-sm);
    box-shadow: 0 10px 24px rgba(14, 165, 233, 0.16);
    color: #fff;
    display: inline-flex;
    font-weight: 800;
    justify-content: center;
    min-height: 40px;
    padding: 0.52rem 0.9rem;
    text-decoration: none;
    transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
}

button:not(.btn):not(.topbar-link):hover,
.button:hover {
    box-shadow: 0 14px 30px rgba(14, 165, 233, 0.22);
    color: #fff;
    transform: translateY(-1px);
}

button:disabled,
input:disabled,
select:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.secondary,
.button.secondary {
    background: var(--panel-soft);
    border-color: var(--line-strong);
    box-shadow: none;
    color: var(--text);
}

.danger-button,
.button.danger {
    background: linear-gradient(135deg, #e11d48, #b91c1c);
    border-color: rgba(251, 113, 133, 0.3);
    box-shadow: 0 10px 24px rgba(225, 29, 72, 0.16);
}

input,
select,
textarea {
    background: var(--field-bg);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    color: var(--text);
    display: block;
    margin-bottom: 0.75rem;
    min-height: 40px;
    padding: 0.52rem 0.68rem;
    width: 100%;
}

select option {
    background: var(--panel-strong);
    color: var(--text);
}

input[type="file"] {
    padding: 0.42rem;
}

input[type="file"]::file-selector-button {
    background: var(--panel-soft);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    color: var(--text);
    cursor: pointer;
    font-weight: 800;
    margin-right: 0.75rem;
    padding: 0.4rem 0.7rem;
}

input:focus,
select:focus,
textarea:focus {
    border-color: rgba(56, 189, 248, 0.72);
    box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.14);
    outline: 0;
}

input::placeholder,
textarea::placeholder {
    color: #66758a;
}

textarea {
    resize: vertical;
}

label {
    color: var(--muted-strong);
    font-size: 0.82rem;
    font-weight: 800;
    margin-bottom: 0.25rem;
}

table {
    background: transparent;
    border-collapse: separate;
    border-spacing: 0;
    color: var(--text);
    width: 100%;
}

.table-scroll {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overscroll-behavior-x: contain;
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-color: var(--line-strong) transparent;
    scrollbar-width: thin;
    touch-action: pan-x;
    width: 100%;
}

.table-scroll table {
    min-width: 900px;
}

.table-density-compact th,
.table-density-compact td {
    padding: 0.55rem 0.65rem;
}

.table-density-compact th {
    font-size: 0.68rem;
}

.table-density-relaxed th,
.table-density-relaxed td {
    padding: 0.9rem 1rem;
}

.table-scroll::after {
    color: var(--muted);
    content: "Scroll horizontally";
    display: none;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    padding: 0.55rem 0.75rem;
    text-transform: uppercase;
}

th,
td {
    border-bottom: 1px solid var(--line);
    padding: 0.72rem 0.78rem;
    text-align: left;
    vertical-align: middle;
}

td {
    color: var(--text);
}

tbody tr {
    transition: background 140ms ease;
}

tbody tr:hover > td {
    background: var(--table-row-hover);
}

tbody tr:last-child > td {
    border-bottom: 0;
}

th {
    background: var(--table-head);
    color: var(--muted-strong);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.dt-container {
    color: var(--text);
    min-width: 900px;
    padding: 0.8rem;
}

html.js table.data-table:not([data-dt-ready="true"]) {
    visibility: hidden;
}

html.js .table-scroll:has(> table.data-table:not([data-dt-ready="true"])),
html.js .table-wrap:has(> table.data-table:not([data-dt-ready="true"])) {
    min-height: 14rem;
}

.dt-container .dt-layout-row {
    align-items: center;
    gap: 0.85rem;
    margin: 0 0 0.75rem;
}

.dt-container .dt-layout-row:last-child {
    margin: 0.75rem 0 0;
}

.dt-container .dt-layout-cell {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.dt-container .dt-layout-cell.dt-layout-end {
    justify-content: flex-end;
}

.dt-container .dt-length,
.dt-container .dt-search,
.dt-container .dt-info,
.dt-container .dt-paging {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 750;
}

.dt-container .dt-search label,
.dt-container .dt-length label {
    margin: 0;
}

.dt-container .dt-search input,
.dt-container .dt-length select {
    background: var(--field-bg);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--text);
    min-height: 2.35rem;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.dt-container .dt-search input {
    margin-left: 0;
    min-width: min(18rem, 100%);
}

.dt-container .dt-length select {
    margin-right: 0.35rem;
    min-width: 4.5rem;
}

.dt-container .dt-search input:focus,
.dt-container .dt-length select:focus {
    border-color: rgba(56, 189, 248, 0.55);
    box-shadow: 0 0 0 0.18rem rgba(56, 189, 248, 0.14);
    outline: none;
}

.dt-container .dt-search input:hover,
.dt-container .dt-length select:hover {
    border-color: rgba(148, 163, 184, 0.38);
}

.dt-container table.dataTable {
    border-collapse: separate;
    border-spacing: 0;
    margin: 0 !important;
}

.dt-container table.dataTable > thead > tr > th,
.dt-container table.dataTable > tbody > tr > td {
    border-bottom: 1px solid var(--line);
    font-size: 0.95rem;
    line-height: 1.45;
    padding-bottom: 0.7rem;
    padding-top: 0.7rem;
    vertical-align: middle;
}

.dt-container table.dataTable > thead > tr > th {
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    outline: none;
    overflow-wrap: normal;
    position: relative;
    transition: background 160ms ease, color 160ms ease;
    white-space: nowrap;
}

.dt-container table.dataTable > tbody > tr > td.pnl-chip,
.dt-container table.dataTable > tbody > tr > td.pnl-positive,
.dt-container table.dataTable > tbody > tr > td.pnl-negative,
.data-table-child td.pnl-chip,
.data-table-child td.pnl-positive,
.data-table-child td.pnl-negative {
    font-variant-numeric: tabular-nums;
    font-weight: 850;
}

.dt-container table.dataTable > tbody > tr > td.pnl-chip,
.data-table-child td.pnl-chip {
    text-align: right;
}

.dt-container table.dataTable > thead > tr > th.money-column,
.dt-container table.dataTable > tbody > tr > td.money-column,
.data-table-child th.money-column,
.data-table-child td.money-column {
    text-align: right;
}

.dt-container table.dataTable > thead > tr > th.numeric-column,
.dt-container table.dataTable > tbody > tr > td.numeric-column,
.data-table-child th.numeric-column,
.data-table-child td.numeric-column {
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.dt-container table.dataTable > thead > tr > th.table-actions-column,
.dt-container table.dataTable > tbody > tr > td.table-actions {
    text-align: right;
}

.dt-container table.dataTable > tbody > tr > td.nowrap-cell,
.data-table-child td.nowrap-cell {
    white-space: nowrap;
}

.dt-container table.dataTable > tbody > tr > td.pnl-positive,
.data-table-child td.pnl-positive {
    color: var(--green);
}

.dt-container table.dataTable > tbody > tr > td.pnl-negative,
.data-table-child td.pnl-negative {
    color: var(--red);
}

.dt-container table.dataTable > thead > tr > th.dt-orderable-asc,
.dt-container table.dataTable > thead > tr > th.dt-orderable-desc {
    cursor: pointer;
}

.dt-container table.dataTable > thead > tr > th.dt-orderable-asc:hover,
.dt-container table.dataTable > thead > tr > th.dt-orderable-desc:hover {
    background: linear-gradient(180deg, rgba(56, 189, 248, 0.13), var(--table-head));
    color: var(--text-strong);
}

.dt-container table.dataTable > thead > tr > th.dt-ordering-asc,
.dt-container table.dataTable > thead > tr > th.dt-ordering-desc {
    background: linear-gradient(180deg, rgba(56, 189, 248, 0.16), var(--table-head));
    color: var(--text-strong);
}

.dt-container table.dataTable > thead > tr > th.dt-ordering-asc::before,
.dt-container table.dataTable > thead > tr > th.dt-ordering-desc::before {
    background: linear-gradient(180deg, var(--blue), var(--green));
    border-radius: 999px;
    bottom: 0.45rem;
    content: "";
    left: 0.35rem;
    position: absolute;
    top: 0.45rem;
    width: 0.14rem;
}

.dt-container table.dataTable > thead > tr > th.dt-orderable-asc:focus-visible,
.dt-container table.dataTable > thead > tr > th.dt-orderable-desc:focus-visible,
.dt-container .dt-paging .dt-paging-button:focus-visible {
    box-shadow: inset 0 0 0 2px rgba(56, 189, 248, 0.72), 0 0 0 0.18rem rgba(56, 189, 248, 0.14);
    outline: none;
}

.dt-container table.dataTable > thead .dt-column-order::before,
.dt-container table.dataTable > thead .dt-column-order::after {
    color: var(--muted);
    opacity: 0.48;
}

.dt-container table.dataTable > thead > tr > th.dt-ordering-asc .dt-column-order::before,
.dt-container table.dataTable > thead > tr > th.dt-ordering-desc .dt-column-order::after {
    color: var(--blue);
    opacity: 1;
}

.dt-container table.dataTable > tbody > tr > td.dt-empty {
    background:
        linear-gradient(135deg, rgba(56, 189, 248, 0.08), rgba(52, 211, 153, 0.035)),
        var(--detail-row-bg);
    border-bottom: 0;
    padding: 1.25rem;
}

.dt-empty-state {
    align-items: center;
    border: 1px dashed var(--line-strong);
    border-radius: var(--radius);
    color: var(--muted);
    display: grid;
    gap: 0.35rem;
    justify-items: center;
    margin: 0 auto;
    max-width: 34rem;
    min-height: 9rem;
    padding: 1.35rem;
    text-align: center;
}

.dt-empty-state-icon {
    background:
        linear-gradient(var(--panel-soft), var(--panel-soft)) padding-box,
        linear-gradient(135deg, rgba(56, 189, 248, 0.7), rgba(52, 211, 153, 0.55)) border-box;
    border: 1px solid transparent;
    border-radius: 999px;
    box-shadow: 0 10px 26px rgba(14, 165, 233, 0.12);
    display: inline-block;
    height: 2rem;
    position: relative;
    width: 2rem;
}

.dt-empty-state-icon::before,
.dt-empty-state-icon::after {
    background: var(--blue);
    border-radius: 999px;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}

.dt-empty-state-icon::before {
    height: 0.18rem;
    width: 0.95rem;
}

.dt-empty-state-icon::after {
    height: 0.95rem;
    width: 0.18rem;
}

.dt-empty-state strong {
    color: var(--text-strong);
    font-size: 1rem;
    font-weight: 850;
}

.dt-empty-state span:last-child {
    max-width: 26rem;
}

.dt-container table.dataTable > tbody > tr.dt-hasChild > td {
    background: rgba(56, 189, 248, 0.055);
}

.dt-container table.dataTable > tbody > tr.dt-hasChild + tr > td {
    background: var(--detail-row-bg);
    border-bottom: 1px solid var(--line);
    padding: 0.75rem;
}

.data-table-child {
    background: var(--detail-row-bg);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow-x: auto;
    padding: 0.75rem;
}

.data-table-child table {
    min-width: 760px;
}

.data-table-child .broker-fills-table {
    margin-top: 0.65rem;
}

.dt-container .dt-paging {
    --dt-pagination-color: var(--text);
    --dt-pagination-bg: var(--panel);
    --dt-pagination-border-color: var(--line);
    --dt-pagination-hover-color: var(--theme-primary);
    --dt-pagination-hover-bg: var(--theme-secondary-bg);
    --dt-pagination-hover-border-color: var(--line);
    --dt-pagination-active-color: #ffffff;
    --dt-pagination-active-bg: var(--theme-primary);
    --dt-pagination-active-border-color: var(--theme-primary);
    --dt-pagination-disabled-color: var(--muted);
    --dt-pagination-disabled-bg: var(--panel);
    --dt-pagination-disabled-border-color: var(--line);
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.dt-container .dt-paging .dt-paging-button {
    align-items: center;
    background-color: var(--dt-pagination-bg) !important;
    background-image: none !important;
    border: 1px solid var(--dt-pagination-border-color) !important;
    border-radius: var(--theme-border-radius, 0.3rem) !important;
    color: var(--dt-pagination-color) !important;
    display: inline-flex !important;
    font-size: var(--theme-pagination-font-size, var(--theme-font-size-base, 0.813rem));
    font-weight: var(--theme-body-font-weight, 400);
    height: 33.5px;
    justify-content: center;
    line-height: 1.25;
    margin-inline-start: 0.35rem !important;
    min-height: 0;
    min-width: 33.5px !important;
    padding: 0.1rem !important;
    text-decoration: none !important;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.dt-container .dt-paging .dt-paging-button:hover:not(.current):not(.disabled),
.dt-container .dt-paging .dt-paging-button:focus:not(.current):not(.disabled) {
    background-color: var(--dt-pagination-hover-bg) !important;
    background-image: none !important;
    border-color: var(--dt-pagination-hover-border-color) !important;
    color: var(--dt-pagination-hover-color) !important;
}

.dt-container .dt-paging .dt-paging-button.current,
.dt-container .dt-paging .dt-paging-button.current:hover,
.dt-container .dt-paging .dt-paging-button.current:focus {
    background-color: var(--theme-primary, #1ab394) !important;
    background-image: none !important;
    border-color: var(--theme-primary, #1ab394) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: var(--theme-body-font-weight, 400);
}

.dt-container .dt-paging .dt-paging-button.disabled,
.dt-container .dt-paging .dt-paging-button.disabled:hover,
.dt-container .dt-paging .dt-paging-button.disabled:focus {
    background-color: var(--dt-pagination-disabled-bg) !important;
    background-image: none !important;
    border-color: var(--dt-pagination-disabled-border-color) !important;
    color: var(--dt-pagination-disabled-color) !important;
    opacity: 1;
    pointer-events: none;
}

.select-cell {
    text-align: center;
    width: 44px;
}

.select-cell input {
    accent-color: var(--blue);
    display: inline-block;
    margin: 0;
    min-height: auto;
    width: auto;
}

.toolbar {
    align-items: flex-end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1.35rem;
}

.toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    justify-content: flex-end;
}

.toolbar-actions > *,
.filter-actions > * {
    min-width: 0;
}

.toolbar-actions form {
    margin: 0;
}

.toolbar-action-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: flex-end;
}

.import-review-toolbar-actions {
    align-items: flex-end;
    gap: 0.55rem;
}

.toolbar-nav-links {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.8rem;
    margin-top: 0.65rem;
}

.toolbar-nav-links a {
    color: var(--blue);
    font-size: 0.9rem;
    font-weight: 800;
    text-decoration: none;
}

.toolbar-nav-links a:hover {
    color: var(--text-strong);
}

.import-review-toolbar-actions {
    flex-wrap: nowrap;
}

.import-review-toolbar-actions button,
.import-review-toolbar-actions .button {
    min-height: 40px;
    padding-left: 0.8rem;
    padding-right: 0.8rem;
    white-space: nowrap;
}

.toolbar h1 {
    margin: 0;
}

.toolbar p {
    color: var(--muted);
    margin: 0.45rem 0 0;
    max-width: 760px;
}

.actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.inline-form {
    display: inline;
    margin: 0;
}

.inline-strategy-form {
    margin: 0;
}

.inline-strategy-form select {
    margin: 0;
    min-width: 190px;
}

.danger-link {
    background: transparent;
    border: 0;
    box-shadow: none;
    color: var(--red);
    font-weight: 800;
    min-height: auto;
    padding: 0;
}

.danger-link:hover {
    box-shadow: none;
    color: #fecdd3;
    transform: none;
}

.icon-button {
    background: rgba(148, 163, 184, 0.12);
    border-color: var(--line-strong);
    box-shadow: none;
    color: var(--text);
    font-weight: 900;
    justify-content: center;
    min-height: 30px;
    padding: 0;
    width: 30px;
}

.fill-detail-row > td,
.broker-fill-row > td {
    background: var(--detail-row-bg);
    padding: 0.8rem;
}

.fills-table,
.broker-fills-table {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
}

.fills-table th,
.broker-fills-table th {
    background: rgba(12, 20, 31, 0.98);
}

html[data-theme="light"] .dt-container table.dataTable > tbody > tr > td {
    background-color: rgba(255, 255, 255, 0.68);
    color: #1f2937;
}

html[data-theme="light"] .dt-container table.dataTable > tbody > tr > td.pnl-positive,
html[data-theme="light"] .data-table-child td.pnl-positive {
    color: var(--green);
}

html[data-theme="light"] .dt-container table.dataTable > tbody > tr > td.pnl-negative,
html[data-theme="light"] .data-table-child td.pnl-negative {
    color: var(--red);
}

html[data-theme="light"] .dt-container table.dataTable > tbody > tr:hover > td {
    background-color: var(--table-row-hover);
}

html[data-theme="light"] .dt-container table.dataTable > tbody > tr.dt-hasChild > td {
    background-color: rgba(14, 165, 233, 0.1);
}

html[data-theme="light"] .dt-container table.dataTable > tbody > tr.dt-hasChild + tr > td {
    background-color: #f8fbff;
}

html[data-theme="light"] .data-table-child {
    background: rgba(248, 251, 255, 0.94);
    border-color: rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] .fill-detail-row > td,
html[data-theme="light"] .broker-fill-row > td {
    background: #f8fbff;
}

html[data-theme="light"] .fills-table,
html[data-theme="light"] .broker-fills-table {
    background: #ffffff;
    border-color: rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] .fills-table th,
html[data-theme="light"] .broker-fills-table th {
    background: #e8f1f8;
    border-bottom-color: rgba(15, 23, 42, 0.16);
    color: #334155;
}

html[data-theme="light"] .fills-table td,
html[data-theme="light"] .broker-fills-table td {
    background: rgba(255, 255, 255, 0.76);
    color: #1f2937;
}

html[data-theme="light"] .fills-table tbody tr:hover > td,
html[data-theme="light"] .broker-fills-table tbody tr:hover > td {
    background: rgba(14, 165, 233, 0.08);
}

.draggable-staged-row {
    cursor: grab;
}

.create-trade-drop-zone {
    align-items: center;
    background:
        linear-gradient(135deg, rgba(56, 189, 248, 0.13), rgba(16, 185, 129, 0.08)),
        rgba(15, 23, 42, 0.55);
    border: 1px dashed rgba(56, 189, 248, 0.48);
    border-radius: var(--radius);
    color: var(--muted);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin: 0 0 0.85rem;
    min-height: 66px;
    padding: 0.85rem 1rem;
    position: relative;
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.create-trade-drop-zone::before {
    background: linear-gradient(180deg, var(--blue), var(--green));
    border-radius: var(--radius-sm);
    content: "";
    height: calc(100% - 1.2rem);
    left: 0.55rem;
    opacity: 0.55;
    position: absolute;
    top: 0.6rem;
    width: 3px;
}

.create-trade-drop-zone:hover {
    background:
        linear-gradient(135deg, rgba(56, 189, 248, 0.16), rgba(16, 185, 129, 0.11)),
        rgba(15, 23, 42, 0.68);
    border-color: rgba(56, 189, 248, 0.64);
    box-shadow: 0 0 0 1px rgba(56, 189, 248, 0.08);
}

.drop-zone-copy {
    min-width: 0;
    padding-left: 0.65rem;
}

.create-trade-drop-zone strong {
    color: var(--text);
    display: block;
    font-size: 0.92rem;
    letter-spacing: 0.01em;
    margin-bottom: 0.18rem;
}

.create-trade-drop-zone span {
    font-size: 0.82rem;
}

.drop-zone-chip {
    background: rgba(56, 189, 248, 0.13);
    border: 1px solid rgba(56, 189, 248, 0.32);
    border-radius: 999px;
    color: var(--blue);
    flex: 0 0 auto;
    font-size: 0.76rem;
    font-weight: 800;
    padding: 0.34rem 0.62rem;
    text-transform: uppercase;
    transition: background 160ms ease, border-color 160ms ease, color 160ms ease;
}

.create-trade-drop-zone.drop-zone-active {
    background:
        linear-gradient(135deg, rgba(56, 189, 248, 0.2), rgba(16, 185, 129, 0.16)),
        rgba(15, 23, 42, 0.75);
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.14), var(--shadow);
    transform: translateY(-1px);
}

.create-trade-drop-zone.drop-zone-active::before {
    opacity: 1;
}

.create-trade-drop-zone.drop-zone-active .drop-zone-chip {
    background: rgba(52, 211, 153, 0.15);
    border-color: rgba(52, 211, 153, 0.36);
    color: var(--green);
}

.create-trade-drop-zone.drop-zone-blocked {
    background:
        linear-gradient(135deg, rgba(248, 113, 113, 0.1), rgba(245, 158, 11, 0.06)),
        rgba(15, 23, 42, 0.62);
    border-color: rgba(248, 113, 113, 0.44);
}

.create-trade-drop-zone.drop-zone-blocked::before {
    background: var(--red);
}

.create-trade-drop-zone.drop-zone-blocked .drop-zone-chip {
    background: rgba(248, 113, 113, 0.12);
    border-color: rgba(248, 113, 113, 0.28);
    color: var(--red);
}

html[data-theme="light"] .create-trade-drop-zone {
    background:
        linear-gradient(135deg, rgba(2, 132, 199, 0.12), rgba(5, 150, 105, 0.08)),
        #ffffff;
    border-color: rgba(2, 132, 199, 0.58);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
    color: #334155;
}

html[data-theme="light"] .create-trade-drop-zone::before {
    opacity: 0.9;
}

html[data-theme="light"] .create-trade-drop-zone:hover {
    background:
        linear-gradient(135deg, rgba(2, 132, 199, 0.16), rgba(5, 150, 105, 0.11)),
        #f8fbff;
    border-color: rgba(2, 132, 199, 0.78);
    box-shadow: 0 16px 34px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(2, 132, 199, 0.1);
}

html[data-theme="light"] .create-trade-drop-zone strong {
    color: #0f172a;
}

html[data-theme="light"] .create-trade-drop-zone span {
    color: #475569;
}

html[data-theme="light"] .drop-zone-chip {
    background: rgba(2, 132, 199, 0.12);
    border-color: rgba(2, 132, 199, 0.38);
    color: #075985;
}

html[data-theme="light"] .create-trade-drop-zone.drop-zone-active {
    background:
        linear-gradient(135deg, rgba(2, 132, 199, 0.22), rgba(5, 150, 105, 0.18)),
        #eff6ff;
    border-color: #0284c7;
    box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.18), 0 16px 34px rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] .create-trade-drop-zone.drop-zone-active .drop-zone-chip {
    background: rgba(5, 150, 105, 0.14);
    border-color: rgba(5, 150, 105, 0.38);
    color: #047857;
}

html[data-theme="light"] .create-trade-drop-zone.drop-zone-blocked {
    background:
        linear-gradient(135deg, rgba(220, 38, 38, 0.12), rgba(217, 119, 6, 0.08)),
        #fff7ed;
    border-color: rgba(220, 38, 38, 0.5);
}

html[data-theme="light"] .create-trade-drop-zone.drop-zone-blocked .drop-zone-chip {
    background: rgba(220, 38, 38, 0.1);
    border-color: rgba(220, 38, 38, 0.3);
    color: #b91c1c;
}

.drop-target-active td {
    background: rgba(56, 189, 248, 0.12);
    outline: 2px solid var(--blue);
    outline-offset: -2px;
}

.metrics {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 1.15rem;
}

.metrics-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 0;
}

.compact-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.compact-metrics strong {
    font-size: 1.05rem;
}

.dashboard-kpi-layout {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
    margin-bottom: 1.25rem;
}

.dashboard-kpi-group {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1rem;
}

.dashboard-kpi-group .section-heading {
    margin-bottom: 0.8rem;
}

.metrics div,
.auth-panel,
.panel,
.notice,
.summary-grid article,
.market-card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1rem;
}

.metrics div {
    overflow: hidden;
    position: relative;
}

.metrics div::before {
    background: linear-gradient(90deg, rgba(56, 189, 248, 0.45), rgba(52, 211, 153, 0.12), transparent);
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.metrics span {
    color: var(--muted);
    display: block;
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.metrics strong {
    color: var(--text-strong);
    display: block;
    font-size: clamp(1.35rem, 2vw, 1.85rem);
    font-weight: 850;
    line-height: 1.1;
    margin-top: 0.35rem;
}

.summary-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 1.15rem;
}

.summary-grid article {
    min-width: 0;
}

.summary-grid span {
    color: var(--muted);
    display: block;
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.summary-grid strong {
    color: var(--text-strong);
    display: block;
    font-size: 1.18rem;
    font-weight: 850;
    margin-top: 0.35rem;
    overflow-wrap: anywhere;
}

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

.workflow-steps {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1.15rem;
}

.workflow-step {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1rem;
    position: relative;
}

.workflow-step::after {
    background: linear-gradient(90deg, var(--blue), transparent);
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    opacity: 0.35;
    position: absolute;
    right: 0;
}

.workflow-step.is-active {
    border-color: rgba(56, 189, 248, 0.45);
}

.workflow-step span {
    color: var(--blue);
    display: block;
    font-size: 0.75rem;
    font-weight: 900;
    margin-bottom: 0.35rem;
}

.workflow-step strong {
    color: var(--text-strong);
    display: block;
    font-size: 1rem;
}

.workflow-step p {
    color: var(--muted);
    margin: 0.25rem 0 0;
}

.import-upload-layout {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
}

.import-drop-panel {
    margin-bottom: 0;
}

.import-guidance ul {
    color: var(--muted-strong);
    display: grid;
    gap: 0.7rem;
    margin: 0;
    padding-left: 1.1rem;
}

.broker-import-instructions {
    display: grid;
    gap: 0.85rem;
}

.broker-import-instructions article {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.55rem;
    padding: 0.85rem;
}

.broker-import-instructions h3 {
    color: var(--text-strong);
    font-size: 1rem;
    margin: 0;
}

.broker-import-instructions p,
.broker-import-instructions dl {
    color: var(--muted-strong);
    margin: 0;
}

.broker-import-instructions dl {
    display: grid;
    gap: 0.55rem;
}

.broker-import-instructions dl > div {
    display: grid;
    gap: 0.12rem;
}

.broker-import-instructions dt {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.broker-import-instructions dd {
    margin: 0;
}

.import-summary article:nth-child(3) strong {
    color: var(--green);
}

.import-summary article:nth-child(4) strong {
    color: var(--orange);
}

.import-history-table > thead > tr > th.table-actions-column,
.import-history-table > tbody > tr > td.import-history-actions-cell {
    min-width: 8.5rem;
    width: 8.5rem;
}

.import-history-table > tbody > tr > td.import-history-actions-cell {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    vertical-align: middle;
}

.import-history-actions {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    min-height: 1.45rem;
    white-space: nowrap;
}

.import-review-panel .section-heading p {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.import-review-panel .table-scroll {
    overflow-x: hidden;
}

.import-review-panel table.dataTable {
    min-width: 0;
    table-layout: fixed;
}

.import-review-panel .inline-strategy-form select {
    font-size: 0.95rem;
    min-height: 2.55rem;
    min-width: 0;
}

.import-review-panel table.dataTable > thead > tr > th,
.import-review-panel table.dataTable > tbody > tr > td {
    font-size: 0.95rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
    padding-bottom: 0.7rem;
    padding-top: 0.7rem;
    vertical-align: middle;
}

.import-review-panel table.dataTable > thead > tr > th {
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    overflow-wrap: normal;
    white-space: nowrap;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(1),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(1),
.import-review-panel table.dataTable > thead > tr > th:nth-child(2),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(2) {
    width: 2.5rem;
}

.import-review-panel .select-cell,
.import-review-panel table.dataTable > tbody > tr > td.select-cell {
    overflow-wrap: normal;
    text-align: center;
}

.import-review-panel .expand-toggle,
.import-review-panel .match-toggle {
    background: var(--green);
    border-color: var(--green);
    color: #ffffff;
    font-family: var(--theme-body-font-family), "Open Sans", system-ui, sans-serif;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1;
}

.import-review-panel .expand-toggle,
.import-review-panel .match-toggle {
    font-size: 0;
}

.import-review-panel .expand-toggle::before {
    content: "+" !important;
    font-size: 0.82rem;
}

.import-review-panel .expand-toggle[aria-expanded="true"]::before {
    content: "-" !important;
}

.import-review-panel .match-toggle::before {
    content: attr(data-collapsed-label) !important;
    font-size: 0.86rem;
}

.import-review-panel .match-toggle[aria-expanded="true"]::before {
    content: attr(data-expanded-label) !important;
}

.import-review-panel .expand-toggle::after,
.import-review-panel .match-toggle::after,
.import-review-panel td.dt-control::before,
.import-review-panel td.dtr-control::before {
    content: none !important;
}

.import-review-panel .expand-toggle:hover,
.import-review-panel .expand-toggle:focus,
.import-review-panel .match-toggle:hover,
.import-review-panel .match-toggle:focus {
    background: #18a689;
    border-color: #18a689;
    color: #ffffff;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(3),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(3) {
    width: 4.4rem;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(5),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(5),
.import-review-panel table.dataTable > thead > tr > th:nth-child(10),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(10) {
    width: 4rem;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(4),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(4),
.import-review-panel table.dataTable > thead > tr > th:nth-child(6),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(6) {
    width: 10rem;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(5),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(5) {
    text-align: center;
    width: 3.75rem;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(7),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(7),
.import-review-panel table.dataTable > thead > tr > th:nth-child(8),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(8) {
    width: 6rem;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(9),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(9) {
    width: 7.2rem;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(11),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(11) {
    width: 8.75rem;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(11) {
    padding-right: 1rem;
    text-align: right;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(11) .dt-column-title {
    display: block;
    text-align: right;
}

.import-review-panel table.dataTable > thead > tr > th:nth-child(12),
.import-review-panel table.dataTable > tbody > tr > td:nth-child(12) {
    width: 10.25rem;
}

.import-review-panel table.dataTable > tbody > tr > td:nth-child(11) {
    overflow-wrap: normal;
    padding-right: 1rem;
    text-align: right;
}

.import-review-panel table.dataTable > tbody > tr > td.pnl-chip.pnl-positive {
    color: var(--green);
}

.import-review-panel table.dataTable > tbody > tr > td.pnl-chip.pnl-negative {
    color: var(--red);
}

.import-review-panel .data-table-child td.pnl-chip.pnl-positive {
    color: var(--green);
}

.import-review-panel .data-table-child td.pnl-chip.pnl-negative {
    color: var(--red);
}

.import-review-panel .data-table-child td.pnl-chip {
    text-align: right;
}

.import-review-panel table.dataTable > tbody > tr > td:nth-child(12) {
    padding-left: 0.85rem;
}

.import-review-panel .data-table-child table {
    table-layout: auto;
}

.reconciliation-assistant {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.9rem;
    min-width: 0;
    padding: 0.9rem;
}

.assistant-heading,
.candidate-card-heading,
.candidate-actions {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    min-width: 0;
}

.assistant-heading > div,
.candidate-card-heading > div {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
}

.assistant-heading span,
.candidate-card-heading span,
.candidate-empty {
    color: var(--muted);
    font-size: 0.86rem;
}

.candidate-grid {
    display: grid;
    gap: 0.8rem;
    grid-template-columns: minmax(0, 1fr);
}

.candidate-card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.7rem;
    min-width: 0;
    overflow: hidden;
    padding: 0.85rem;
}

.candidate-reasons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

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

.import-row-actions-cell {
    vertical-align: middle;
}

.import-row-actions {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 0.35rem;
    justify-content: center;
    min-width: 7.5rem;
}

.import-row-actions .compact-action {
    box-shadow: none;
    font-size: 0.86rem;
    line-height: 1.1;
    min-height: 36px;
    min-width: 4.25rem;
    padding: 0.36rem 0.52rem;
    white-space: nowrap;
}

.import-row-actions .compact-danger-action {
    background: var(--red);
    border: 1px solid var(--red);
    border-radius: var(--radius-sm);
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    min-height: 36px;
    min-width: 3.55rem;
    padding: 0.36rem 0.45rem;
    text-decoration: none;
    white-space: nowrap;
}

.import-row-actions .compact-danger-action:hover,
.import-row-actions .compact-danger-action:focus {
    background: #ec4758;
    border-color: #ec4758;
    color: #ffffff;
    text-decoration: none;
}

.trade-rollups-panel table.dataTable {
    table-layout: fixed;
}

.trade-rollups-panel table.dataTable > thead > tr > th,
.trade-rollups-panel table.dataTable > tbody > tr > td {
    font-size: 0.95rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
    padding-bottom: 0.7rem;
    padding-top: 0.7rem;
    vertical-align: middle;
}

.trade-rollups-panel table.dataTable > thead > tr > th {
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    overflow-wrap: normal;
    white-space: nowrap;
}

.trade-rollups-panel .select-cell,
.trade-rollups-panel table.dataTable > tbody > tr > td.select-cell {
    overflow-wrap: normal;
    text-align: center;
}

.trade-rollups-panel .expand-toggle {
    background: var(--green);
    border-color: var(--green);
    color: #ffffff;
    font-family: var(--theme-body-font-family), "Open Sans", system-ui, sans-serif;
    font-size: 0;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1;
}

.trade-rollups-panel .expand-toggle::before {
    content: "+" !important;
    font-size: 0.82rem;
}

.trade-rollups-panel .expand-toggle[aria-expanded="true"]::before {
    content: "-" !important;
}

.trade-rollups-panel .expand-toggle::after,
.trade-rollups-panel td.dt-control::before,
.trade-rollups-panel td.dtr-control::before {
    content: none !important;
}

.trade-rollups-panel .expand-toggle:hover,
.trade-rollups-panel .expand-toggle:focus {
    background: #18a689;
    border-color: #18a689;
    color: #ffffff;
}

.trade-rollups-panel table.dataTable > thead > tr > th:nth-child(13),
.trade-rollups-panel table.dataTable > tbody > tr > td:nth-child(13) {
    text-align: right;
}

.trade-rollups-panel table.dataTable > thead > tr > th:nth-child(14),
.trade-rollups-panel table.dataTable > tbody > tr > td:nth-child(14) {
    overflow-wrap: normal;
    text-align: right;
    width: 9.75rem;
}

.trade-rollups-panel table.dataTable > tbody > tr > td.pnl-chip.pnl-positive,
.trade-rollups-panel .data-table-child td.pnl-chip.pnl-positive {
    color: var(--green);
}

.trade-rollups-panel table.dataTable > tbody > tr > td.pnl-chip.pnl-negative,
.trade-rollups-panel .data-table-child td.pnl-chip.pnl-negative {
    color: var(--red);
}

.trade-rollups-panel .data-table-child td.pnl-chip {
    text-align: right;
}

.trade-rollups-panel .data-table-child table {
    min-width: 0;
    table-layout: auto;
    width: 100%;
}

.trade-rollups-panel .data-table-child th,
.trade-rollups-panel .data-table-child td {
    font-size: 0.9rem;
    line-height: 1.45;
}

.trade-rollups-panel .trade-rollup-actions-cell {
    vertical-align: middle;
}

.trade-rollups-panel .trade-rollup-row-actions {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 0.5rem;
    justify-content: flex-end;
    min-height: 2.35rem;
}

.trade-rollups-panel .trade-details-action {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--theme-primary);
    display: inline-flex;
    font-size: 0.86rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    min-height: 36px;
    padding: 0.36rem 0.52rem;
    text-decoration: none;
    white-space: nowrap;
}

.trade-rollups-panel .compact-danger-action {
    background: var(--red);
    border: 1px solid var(--red);
    border-radius: var(--radius-sm);
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    min-height: 36px;
    min-width: 3.55rem;
    padding: 0.36rem 0.45rem;
    text-decoration: none;
    white-space: nowrap;
}

.trade-rollups-panel .compact-danger-action:hover,
.trade-rollups-panel .compact-danger-action:focus {
    background: #ec4758;
    border-color: #ec4758;
    color: #ffffff;
    text-decoration: none;
}

.reconciliation-assistant .broker-fills-table {
    margin-top: 0;
    min-width: 0;
    table-layout: auto;
    width: 100%;
}

.reconciliation-assistant .broker-fills-table th,
.reconciliation-assistant .broker-fills-table td {
    font-size: 0.78rem;
    padding: 0.48rem 0.55rem;
    white-space: normal;
}

.reconciliation-assistant .broker-fills-table td:nth-child(1),
.reconciliation-assistant .broker-fills-table td:nth-child(3) {
    min-width: 10rem;
}

.missing-close-summary {
    max-width: none;
    white-space: nowrap;
}

.missing-close-workbench {
    display: grid;
    gap: 1rem;
}

.missing-close-workbench-layout {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(17rem, 0.42fr) minmax(0, 1fr);
}

.workbench-proposal-list {
    align-content: start;
    display: grid;
    gap: 0.55rem;
    max-height: 34rem;
    overflow: auto;
    padding-right: 0.15rem;
}

.workbench-proposal {
    align-items: flex-start;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    box-shadow: none;
    color: var(--text);
    display: grid;
    gap: 0.55rem;
    justify-items: stretch;
    min-height: auto;
    padding: 0.8rem;
    text-align: left;
    white-space: normal;
}

.workbench-trade-summary,
.workbench-missing-summary {
    display: grid;
    gap: 0.25rem;
    min-width: 0;
}

.workbench-trade-summary {
    border-bottom: 1px solid var(--line);
    padding-bottom: 0.55rem;
}

.workbench-trade-kicker {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.workbench-missing-summary {
    background: rgba(245, 158, 11, 0.07);
    border: 1px solid rgba(245, 158, 11, 0.18);
    border-radius: var(--radius-sm);
    padding: 0.55rem;
}

.workbench-missing-hint {
    color: var(--text);
    font-size: 0.78rem;
    font-weight: 750;
    line-height: 1.35;
}

.workbench-missing-more {
    color: var(--orange);
    font-size: 0.76rem;
    font-weight: 900;
}

.workbench-proposal:hover,
.workbench-proposal.is-active {
    background:
        linear-gradient(135deg, rgba(56, 189, 248, 0.12), rgba(52, 211, 153, 0.05)),
        var(--panel-soft);
    border-color: rgba(56, 189, 248, 0.42);
    box-shadow: none;
    color: var(--text-strong);
    transform: none;
}

.workbench-proposal span {
    min-width: 0;
}

.workbench-proposal strong,
.workbench-candidate-heading h3 {
    color: var(--text-strong);
}

.workbench-proposal small {
    color: var(--muted);
    display: block;
    font-weight: 750;
    margin-top: 0.2rem;
}

.workbench-proposal-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.workbench-candidate-stage {
    min-width: 0;
}

.workbench-candidate-panel {
    display: none;
    gap: 0.85rem;
}

.workbench-candidate-panel.is-active {
    display: grid;
}

.workbench-candidate-heading {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    min-width: 0;
}

.workbench-candidate-heading h3 {
    margin: 0;
}

.workbench-candidate-heading p {
    color: var(--muted);
    margin: 0.25rem 0 0;
}

.workbench-heading-actions {
    align-items: flex-end;
    display: grid;
    gap: 0.35rem;
    justify-items: end;
}

.workbench-heading-actions a {
    color: var(--blue);
    font-size: 0.86rem;
    font-weight: 850;
    text-decoration: none;
}

.workbench-empty {
    background: var(--panel-soft);
    border: 1px dashed var(--line-strong);
    border-radius: var(--radius-sm);
    padding: 1rem;
}

.missing-close-workbench .broker-fills-table {
    margin-top: 0;
    min-width: 0;
    table-layout: auto;
    width: 100%;
}

.sync-preview-panel {
    display: grid;
    gap: 1rem;
}

.sync-preview-grid {
    display: grid;
    gap: 0.85rem;
}

.sync-preview-card {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.8rem;
    min-width: 0;
    padding: 0.9rem;
}

.sync-preview-fill-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sync-preview-fill-grid > div {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
}

.sync-preview-fill-grid .broker-fills-table {
    margin-top: 0;
    min-width: 0;
    table-layout: auto;
    width: 100%;
}

@media (max-width: 900px) {
    .missing-close-workbench-layout {
        grid-template-columns: 1fr;
    }

    .workbench-proposal-list {
        max-height: none;
        overflow: visible;
    }

    .workbench-candidate-heading {
        flex-direction: column;
    }

    .workbench-heading-actions {
        align-items: flex-start;
        justify-items: start;
    }

    .sync-preview-fill-grid {
        grid-template-columns: 1fr;
    }
}

.status-chip {
    align-items: center;
    background: rgba(56, 189, 248, 0.1);
    border: 1px solid rgba(56, 189, 248, 0.2);
    border-radius: 999px;
    color: var(--muted-strong);
    display: inline-flex;
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.2;
    max-width: 22rem;
    min-height: 24px;
    padding: 0.22rem 0.55rem;
    white-space: normal;
}

.status-badge {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    color: var(--muted-strong);
    display: inline-flex;
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    line-height: 1.1;
    min-height: 26px;
    padding: 0.28rem 0.5rem;
    text-transform: uppercase;
}

.status-ready {
    background: rgba(52, 211, 153, 0.1);
    border-color: rgba(52, 211, 153, 0.24);
    color: var(--green);
}

.status-warning {
    background: rgba(245, 158, 11, 0.12);
    border-color: rgba(245, 158, 11, 0.28);
    color: var(--orange);
}

.empty-state {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.empty-state h2,
.empty-state p {
    margin: 0;
}

.empty-state p {
    color: var(--muted);
}

.metric-positive strong,
.metric-positive,
.pnl-positive {
    color: var(--green);
}

.metric-negative strong,
.metric-negative,
.pnl-negative {
    color: var(--red);
}

.pnl-chip {
    font-variant-numeric: tabular-nums;
    font-weight: 850;
    white-space: nowrap;
}

td.pnl-chip {
    min-width: 7rem;
}

.panel {
    margin-bottom: 1.35rem;
}

.section-heading {
    margin-bottom: 0.9rem;
}

.section-heading-actions {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.section-heading h2 {
    margin: 0;
}

.section-heading p {
    color: var(--muted);
    margin: 0.25rem 0 0;
}

.grid-two {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    margin-bottom: 1.25rem;
}

.filter-grid {
    align-items: end;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.compact-filter {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    margin-bottom: 0;
    padding: 0.85rem;
}

.compact-filter label {
    margin-bottom: 0;
}

.active-filter-strip {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 0.85rem;
    padding: 0.7rem 0.8rem;
}

.active-filter-strip strong {
    color: var(--text-strong);
}

.filter-grid input,
.filter-grid select,
.filter-grid button,
.filter-grid .button {
    margin-bottom: 0;
}

.filter-actions {
    display: flex;
    gap: 0.6rem;
}

.dashboard-chart {
    background: var(--chart-panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    margin-bottom: 1.25rem;
    padding: 1rem;
}

.dashboard-chart canvas {
    min-height: 260px;
    max-height: 360px;
}

.dashboard-chart-frame {
    height: 280px;
    min-height: 0;
    position: relative;
    width: 100%;
}

.dashboard-chart-frame canvas {
    display: block;
    height: 100% !important;
    max-height: 100%;
    min-height: 0 !important;
    width: 100% !important;
}

.dashboard-chart-empty-frame {
    align-items: center;
    display: flex;
    justify-content: center;
}

.dashboard-chart-empty-frame .dashboard-widget-empty {
    min-height: 0;
    padding: 1rem;
}

.dashboard-shell-header {
    align-items: flex-end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.dashboard-shell-header h1 {
    margin: 0.45rem 0 0;
}

.dashboard-shell-header p {
    color: var(--muted);
    margin: 0.45rem 0 0;
    max-width: 820px;
}

.dashboard-shell-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-end;
}

.dashboard-module-nav {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.dashboard-module-link {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    color: var(--text);
    display: grid;
    gap: 0.25rem;
    min-height: 5.7rem;
    padding: 0.78rem;
    position: relative;
    transition: border-color 160ms ease, transform 160ms ease, background 160ms ease;
}

.dashboard-module-link::before {
    background: linear-gradient(180deg, var(--blue), var(--green));
    border-radius: var(--radius-sm);
    bottom: 0.65rem;
    content: "";
    left: 0.55rem;
    opacity: 0;
    position: absolute;
    top: 0.65rem;
    width: 3px;
}

.dashboard-module-link:hover,
.dashboard-module-link:focus {
    background: rgba(56, 189, 248, 0.08);
    border-color: rgba(56, 189, 248, 0.36);
    color: var(--text-strong);
    transform: translateY(-1px);
}

.dashboard-module-link.active {
    background: linear-gradient(135deg, rgba(56, 189, 248, 0.14), rgba(52, 211, 153, 0.07)), var(--panel);
    border-color: rgba(56, 189, 248, 0.45);
}

.dashboard-module-link.active::before {
    opacity: 1;
}

.dashboard-module-link strong {
    color: var(--text-strong);
    font-size: 0.9rem;
    font-weight: 850;
    padding-left: 0.45rem;
}

.dashboard-module-link span {
    color: var(--muted);
    font-size: 0.76rem;
    line-height: 1.35;
    padding-left: 0.45rem;
}

.dashboard-filter-panel {
    margin-bottom: 1.25rem;
}

.dashboard-filter-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.dashboard-filter-grid label {
    display: grid;
    gap: 0.32rem;
    margin: 0;
}

.dashboard-filter-grid input,
.dashboard-filter-grid select {
    margin-bottom: 0;
}

.dashboard-filter-actions {
    align-items: end;
    display: grid;
    gap: 0.55rem;
    grid-template-columns: 1fr 1fr;
}

.dashboard-widget-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dashboard-widget-card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: grid;
    gap: 1rem;
    min-height: 18rem;
    padding: 1rem;
}

.reports-export-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.reports-export-card {
    align-content: space-between;
    min-height: 12rem;
}

.reports-export-card h3 {
    font-size: 1rem;
    margin: 0;
}

.reports-export-card form {
    margin: 0;
}

.reports-export-card button {
    width: 100%;
}

.dashboard-widget-header {
    align-items: start;
    display: flex;
    gap: 0.85rem;
    justify-content: space-between;
}

.dashboard-widget-header h2 {
    margin: 0;
}

.dashboard-widget-header p {
    color: var(--muted);
    margin: 0.28rem 0 0;
}

.dashboard-widget-empty {
    align-items: center;
    background:
        linear-gradient(135deg, rgba(56, 189, 248, 0.08), rgba(52, 211, 153, 0.04)),
        var(--panel-soft);
    border: 1px dashed var(--line-strong);
    border-radius: var(--radius);
    color: var(--muted);
    display: grid;
    justify-items: center;
    min-height: 10rem;
    padding: 1rem;
    text-align: center;
}

.dashboard-widget-empty strong {
    color: var(--text-strong);
}

.summary-state-panel {
    gap: 0.65rem;
    justify-items: start;
    margin-bottom: 1.25rem;
    text-align: left;
}

.summary-state-panel p {
    max-width: 54rem;
}

.first-run-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.first-run-path,
.billing-plan-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
}

.first-run-path article {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.85rem;
}

.first-run-path strong,
.first-run-path span {
    display: block;
}

.first-run-path span {
    color: var(--muted);
    margin-top: 0.3rem;
}

.pro-upgrade-panel {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.pro-upgrade-panel h2 {
    margin: 0.45rem 0;
}

.pro-upgrade-panel p {
    color: var(--muted);
    margin: 0;
    max-width: 74rem;
}

.summary-state-error {
    background:
        linear-gradient(135deg, rgba(251, 113, 133, 0.1), rgba(245, 158, 11, 0.05)),
        var(--panel);
}

.summary-skeleton {
    display: none;
    margin-bottom: 1.25rem;
}

.summary-skeleton-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.summary-skeleton-card,
.summary-skeleton-panel {
    background:
        linear-gradient(90deg, transparent, rgba(148, 163, 184, 0.14), transparent),
        var(--panel-soft);
    background-size: 220% 100%;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    min-height: 10.5rem;
    animation: dashboard-skeleton-pulse 1.1s ease-in-out infinite;
}

.summary-skeleton-panels {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.9fr);
}

.summary-skeleton-panel {
    min-height: 20rem;
}

.dashboard-loading .summary-skeleton {
    display: block;
}

.dashboard-loading .summary-dashboard-content,
.dashboard-loading .summary-state-panel {
    display: none;
}

@keyframes dashboard-skeleton-pulse {
    from {
        background-position: 180% 0;
    }

    to {
        background-position: -40% 0;
    }
}

.summary-kpi-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 0.85rem;
}

.summary-kpi-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
        var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: grid;
    gap: 0.55rem;
    min-height: 9.2rem;
    overflow: hidden;
    padding: 0.85rem;
    position: relative;
}

.summary-kpi-card::before {
    background: var(--blue);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.7;
    position: absolute;
    top: 0;
    width: 3px;
}

.summary-kpi-card.trend-positive::before {
    background: var(--green);
}

.summary-kpi-card.trend-negative::before {
    background: var(--red);
}

.summary-kpi-card.trend-warning::before {
    background: var(--orange);
}

.summary-kpi-card-header {
    align-items: center;
    display: flex;
    gap: 0.55rem;
    justify-content: space-between;
}

.summary-kpi-card-header span:first-child,
.summary-highlight-card span,
.summary-period-strip span,
.summary-driver-grid span,
.summary-insight-body span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.summary-kpi-card strong {
    color: var(--text-strong);
    font-size: clamp(1.18rem, 1.55vw, 1.55rem);
    font-weight: 900;
    line-height: 1.05;
}

.summary-kpi-card small {
    color: var(--muted);
    font-size: 0.68rem;
    line-height: 1.32;
}

.trend-pill {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted-strong);
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1;
    padding: 0.26rem 0.42rem;
    white-space: nowrap;
}

.trend-pill.trend-positive {
    background: rgba(52, 211, 153, 0.1);
    border-color: rgba(52, 211, 153, 0.25);
    color: var(--green);
}

.trend-pill.trend-negative {
    background: rgba(251, 113, 133, 0.1);
    border-color: rgba(251, 113, 133, 0.25);
    color: var(--red);
}

.trend-pill.trend-warning {
    background: rgba(245, 158, 11, 0.12);
    border-color: rgba(245, 158, 11, 0.28);
    color: var(--orange);
}

.mini-sparkline {
    align-items: end;
    display: flex;
    gap: 2px;
    height: 1.55rem;
}

.mini-sparkline span {
    background: var(--blue);
    border-radius: 999px 999px 0 0;
    flex: 1 1 0;
    min-height: 3px;
    opacity: 0.82;
}

.mini-sparkline .spark-positive {
    background: var(--green);
}

.mini-sparkline .spark-negative {
    background: var(--red);
}

.summary-period-strip {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.summary-period-strip article {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.25rem;
    grid-template-columns: 3px minmax(0, 1fr) auto auto;
    min-height: 3.35rem;
    padding: 0.65rem 0.8rem;
}

.summary-period-strip article::before {
    background: var(--blue);
    border-radius: 999px;
    content: "";
    height: 100%;
    min-height: 1.75rem;
    width: 3px;
}

.summary-period-strip article.trend-positive::before {
    background: var(--green);
}

.summary-period-strip article.trend-negative::before {
    background: var(--red);
}

.summary-period-strip article.trend-warning::before {
    background: var(--orange);
}

.summary-period-strip strong {
    color: var(--text-strong);
    font-size: 1rem;
    font-weight: 900;
    justify-self: end;
}

.summary-period-strip em {
    color: var(--muted);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 850;
    justify-self: end;
    white-space: nowrap;
}

.summary-main-grid,
.summary-primary-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 2.05fr) minmax(320px, 0.95fr);
    margin-bottom: 1.25rem;
}

.summary-side-rail {
    display: grid;
    gap: 1rem;
}

.summary-equity-widget,
.summary-calendar-widget {
    margin-bottom: 0;
}

.summary-equity-widget {
    display: grid;
    gap: 0.9rem;
}

.summary-equity-stats {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.summary-equity-stats > div {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
        var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.3rem;
    min-height: 4.4rem;
    padding: 0.7rem 0.75rem;
}

.summary-equity-stats span {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.summary-equity-stats strong {
    color: var(--text-strong);
    font-size: clamp(1rem, 1.2vw, 1.25rem);
    font-weight: 900;
    line-height: 1.05;
}

.summary-equity-widget canvas {
    min-height: 310px;
}

.calendar-month-grid {
    display: grid;
    gap: 0.85rem;
}

.calendar-month {
    display: grid;
    gap: 0.55rem;
}

.calendar-month-summary {
    align-items: start;
    display: grid;
    gap: 0.18rem;
    grid-template-columns: minmax(0, 1fr) auto;
}

.calendar-month-summary strong {
    color: var(--text-strong);
    font-size: 0.92rem;
}

.calendar-month-summary span {
    font-size: 0.86rem;
    font-weight: 850;
}

.calendar-month-summary em {
    color: var(--muted);
    font-size: 0.76rem;
    font-style: normal;
    grid-column: 1 / -1;
}

.calendar-heatmap {
    display: grid;
    gap: 0.28rem;
    grid-auto-flow: column;
    grid-template-rows: repeat(7, 1fr);
    min-height: 4.9rem;
}

.heatmap-day {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: 3px;
    color: var(--muted);
    display: grid;
    gap: 0.1rem;
    min-height: 1.85rem;
    min-width: 0.78rem;
    overflow: hidden;
    padding: 0.16rem;
    text-decoration: none;
    transition: border-color 0.16s ease, transform 0.16s ease;
}

.heatmap-day:hover,
.heatmap-day:focus-visible {
    border-color: rgba(56, 189, 248, 0.58);
    transform: translateY(-1px);
}

.heatmap-day span {
    font-size: 0.58rem;
    font-weight: 800;
    line-height: 1;
}

.heatmap-day em {
    color: var(--text-strong);
    font-size: 0.55rem;
    font-style: normal;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

.heatmap-positive.heatmap-level-1 { background: rgba(52, 211, 153, 0.16); }
.heatmap-positive.heatmap-level-2 { background: rgba(52, 211, 153, 0.28); }
.heatmap-positive.heatmap-level-3 { background: rgba(52, 211, 153, 0.45); }
.heatmap-positive.heatmap-level-4 { background: rgba(52, 211, 153, 0.72); }
.heatmap-negative.heatmap-level-1 { background: rgba(251, 113, 133, 0.16); }
.heatmap-negative.heatmap-level-2 { background: rgba(251, 113, 133, 0.28); }
.heatmap-negative.heatmap-level-3 { background: rgba(251, 113, 133, 0.45); }
.heatmap-negative.heatmap-level-4 { background: rgba(251, 113, 133, 0.72); }

.summary-secondary-grid {
    align-items: start;
    display: grid;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.summary-support-grid {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 1fr);
    margin-bottom: 1.25rem;
}

.consistency-widget-body {
    display: grid;
    gap: 0.85rem;
}

.consistency-summary {
    display: grid;
    gap: 0.65rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.consistency-summary > div {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.18rem;
    min-height: 3.6rem;
    padding: 0.65rem 0.75rem;
}

.consistency-summary span,
.consistency-footer,
.consistency-footer span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
}

.consistency-summary span {
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.consistency-summary strong {
    color: var(--text-strong);
    font-size: 1.05rem;
    font-weight: 900;
}

.consistency-heatmap {
    display: grid;
    gap: 0.34rem;
    grid-auto-columns: minmax(2.75rem, 1fr);
    grid-auto-flow: column;
    grid-template-rows: repeat(7, minmax(1.9rem, 1fr));
    overflow-x: auto;
    padding-bottom: 0.08rem;
}

.consistency-day {
    align-items: start;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: 4px;
    color: var(--muted-strong);
    display: grid;
    gap: 0.16rem;
    min-height: 1.9rem;
    min-width: 2.75rem;
    overflow: hidden;
    padding: 0.22rem 0.26rem;
    text-decoration: none;
    transition: border-color 0.16s ease, transform 0.16s ease;
}

.consistency-day:hover,
.consistency-day:focus-visible {
    border-color: rgba(56, 189, 248, 0.58);
    transform: translateY(-1px);
}

.consistency-day span {
    color: var(--muted-strong);
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1;
}

.consistency-day em {
    background: rgba(2, 6, 23, 0.28);
    border-radius: 3px;
    color: #fff;
    font-size: 0.66rem;
    font-style: normal;
    font-weight: 900;
    line-height: 1;
    padding: 0.12rem 0.16rem;
    white-space: nowrap;
}

.consistency-day.has-trades {
    border-color: rgba(255, 255, 255, 0.18);
}

.consistency-day.has-trades span {
    color: rgba(255, 255, 255, 0.92);
}

.consistency-day:not(.has-trades) em {
    display: none;
}

.consistency-footer {
    align-items: center;
    display: flex;
    gap: 0.65rem;
    justify-content: space-between;
}

.consistency-footer strong {
    color: var(--muted-strong);
    font-size: 0.78rem;
    font-weight: 900;
}

.consistency-footer strong span {
    color: var(--muted);
    margin: 0 0.25rem;
}

.consistency-legend {
    align-items: center;
    display: flex;
    gap: 0.25rem;
}

.consistency-legend i {
    border: 1px solid var(--line);
    border-radius: 3px;
    display: block;
    height: 0.72rem;
    width: 0.72rem;
}

.heatmap-neutral.heatmap-level-0 {
    background: var(--panel-soft);
}

.allocation-list,
.compact-feed {
    display: grid;
    gap: 0.7rem;
}

.allocation-row {
    display: grid;
    gap: 0.45rem;
}

.allocation-row > div:first-child,
.compact-feed-item {
    align-items: center;
    display: flex;
    gap: 0.8rem;
    justify-content: space-between;
}

.allocation-row strong,
.compact-feed-item strong {
    color: var(--text-strong);
}

.allocation-row span,
.compact-feed-item em {
    color: var(--muted);
    display: block;
    font-size: 0.8rem;
    font-style: normal;
}

.allocation-track {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: 999px;
    height: 0.56rem;
    overflow: hidden;
}

.allocation-track span {
    background: linear-gradient(90deg, var(--blue), var(--green));
    display: block;
    height: 100%;
}

.allocation-row em {
    color: var(--muted);
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 850;
    justify-self: end;
}

.compact-feed-item {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--text);
    min-height: 3.45rem;
    padding: 0.65rem 0.75rem;
}

.compact-feed-item:hover {
    background: rgba(56, 189, 248, 0.08);
    border-color: rgba(56, 189, 248, 0.28);
}

.recent-trade-link {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
}

.recent-trade-link small {
    align-self: center;
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.summary-highlight-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 1.35rem;
}

.summary-highlight-card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: grid;
    gap: 0.45rem;
    min-height: 8.5rem;
    padding: 1rem;
}

.summary-highlight-card strong {
    color: var(--text-strong);
    font-size: 1.02rem;
    font-weight: 900;
    line-height: 1.25;
}

.summary-highlight-card em {
    align-self: end;
    color: var(--muted);
    font-style: normal;
    font-weight: 850;
}

.summary-highlight-wide {
    grid-column: span 2;
}

.summary-driver-panel {
    align-self: start;
}

.summary-driver-grid {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.summary-driver-grid > div,
.summary-insight-body > div {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.3rem;
    min-height: 5rem;
    padding: 0.75rem;
}

.summary-driver-grid strong,
.summary-insight-body strong {
    color: var(--text-strong);
    font-weight: 900;
    line-height: 1.25;
}

.summary-driver-grid em,
.summary-insight-body em {
    color: var(--muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 850;
}

.summary-insight-body {
    display: grid;
    gap: 0.75rem;
}

.summary-insight-body > strong {
    background: linear-gradient(180deg, rgba(56, 189, 248, 0.1), rgba(52, 211, 153, 0.06));
    border: 1px solid rgba(56, 189, 248, 0.22);
    border-radius: var(--radius-sm);
    min-height: 6.5rem;
    padding: 0.85rem;
}

.insight-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.insight-card {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    display: grid;
    gap: 0.75rem;
    min-height: 150px;
    padding: 1rem;
}

.insight-card-header {
    align-items: center;
    display: flex;
    gap: 0.6rem;
    justify-content: space-between;
}

.insight-card p {
    color: var(--text);
    margin: 0;
}

.insight-card time {
    align-self: end;
    color: var(--muted);
    font-size: 0.82rem;
}

.confidence-meter {
    color: var(--green);
    font-size: 0.85rem;
    font-weight: 900;
    white-space: nowrap;
}

.risk-metric-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.risk-metric-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
        var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: grid;
    gap: 0.55rem;
    min-height: 9.75rem;
    overflow: hidden;
    padding: 0.9rem;
    position: relative;
}

.risk-metric-card::before,
.risk-treemap-item::before {
    background: var(--blue);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.78;
    position: absolute;
    top: 0;
    width: 3px;
}

.risk-metric-card > span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.risk-metric-card strong {
    color: var(--text-strong);
    font-size: clamp(1.28rem, 1.8vw, 1.75rem);
    font-weight: 900;
    line-height: 1.05;
}

.risk-metric-card small {
    color: var(--muted);
    font-size: 0.72rem;
    line-height: 1.32;
}

.risk-tone-positive::before {
    background: var(--green);
}

.risk-tone-negative::before {
    background: var(--red);
}

.risk-tone-warning::before {
    background: var(--orange);
}

.risk-dashboard-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.35fr);
    margin-bottom: 1.25rem;
}

.risk-dashboard-grid-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.risk-greeks-widget,
.risk-drawdown-widget {
    min-height: 22rem;
}

.risk-gauge-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.risk-gauge {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    display: grid;
    gap: 0.45rem;
    justify-items: center;
    min-height: 10rem;
    padding: 0.85rem;
    text-align: center;
}

.risk-gauge-ring {
    align-items: center;
    background:
        radial-gradient(circle at center, var(--panel-strong) 0 58%, transparent 59%),
        conic-gradient(var(--blue) var(--gauge), rgba(148, 163, 184, 0.18) 0);
    border-radius: 999px;
    display: inline-flex;
    height: 5.7rem;
    justify-content: center;
    width: 5.7rem;
}

.risk-gauge.risk-tone-positive .risk-gauge-ring {
    background:
        radial-gradient(circle at center, var(--panel-strong) 0 58%, transparent 59%),
        conic-gradient(var(--green) var(--gauge), rgba(148, 163, 184, 0.18) 0);
}

.risk-gauge.risk-tone-negative .risk-gauge-ring {
    background:
        radial-gradient(circle at center, var(--panel-strong) 0 58%, transparent 59%),
        conic-gradient(var(--red) var(--gauge), rgba(148, 163, 184, 0.18) 0);
}

.risk-gauge.risk-tone-warning .risk-gauge-ring {
    background:
        radial-gradient(circle at center, var(--panel-strong) 0 58%, transparent 59%),
        conic-gradient(var(--orange) var(--gauge), rgba(148, 163, 184, 0.18) 0);
}

.risk-gauge-ring strong,
.risk-gauge span {
    color: var(--text-strong);
    font-weight: 900;
}

.risk-gauge em,
.risk-table-row em,
.risk-framework-row em,
.correlation-cell em {
    color: var(--muted);
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 850;
}

.risk-treemap {
    align-content: stretch;
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    min-height: 17rem;
}

.risk-treemap-item {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--text);
    display: grid;
    flex-grow: 1;
    gap: 0.3rem;
    min-height: 6.5rem;
    min-width: min(13rem, 100%);
    overflow: hidden;
    padding: 0.8rem 0.8rem 0.8rem 1rem;
    position: relative;
}

.risk-treemap-item:hover {
    border-color: rgba(56, 189, 248, 0.36);
    color: var(--text-strong);
    transform: translateY(-1px);
}

.risk-treemap-item strong,
.risk-allocation-row strong,
.risk-table-row strong,
.risk-framework-row strong,
.correlation-cell strong {
    color: var(--text-strong);
}

.risk-treemap-item span,
.risk-allocation-row span,
.risk-table-row span,
.risk-framework-row span {
    color: var(--muted-strong);
}

.risk-allocation-list,
.risk-table-list {
    display: grid;
    gap: 0.7rem;
}

.risk-allocation-row {
    display: grid;
    gap: 0.45rem;
}

.risk-allocation-row > div:first-child,
.risk-table-row {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.risk-allocation-row em {
    color: var(--muted);
    font-size: 0.75rem;
    font-style: normal;
    font-weight: 850;
    justify-self: end;
}

.risk-table-row,
.risk-framework-row,
.correlation-cell {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    min-height: 3.35rem;
    padding: 0.65rem 0.75rem;
}

.risk-framework-row {
    display: grid;
    gap: 0.35rem;
}

.correlation-matrix {
    display: grid;
    gap: 0.55rem;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
}

.correlation-cell {
    display: grid;
    gap: 0.35rem;
    min-height: 4.5rem;
}

.performance-metric-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.performance-fee-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.performance-source-note {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 750;
    margin: -0.35rem 0 1rem;
}

.performance-metric-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
        var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: grid;
    gap: 0.55rem;
    min-height: 9.75rem;
    overflow: hidden;
    padding: 0.9rem;
    position: relative;
}

.performance-metric-card::before {
    background: var(--blue);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.78;
    position: absolute;
    top: 0;
    width: 3px;
}

.performance-metric-card > span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.performance-metric-card strong {
    color: var(--text-strong);
    font-size: clamp(1.28rem, 1.8vw, 1.75rem);
    font-weight: 900;
    line-height: 1.05;
}

.performance-metric-card small {
    color: var(--muted);
    font-size: 0.72rem;
    line-height: 1.32;
}

.performance-tone-positive::before {
    background: var(--green);
}

.performance-tone-negative::before {
    background: var(--red);
}

.performance-tone-warning::before {
    background: var(--orange);
}

.performance-primary-grid,
.performance-breakdown-grid,
.performance-rank-grid {
    display: grid;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.performance-primary-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.95fr);
}

.performance-breakdown-grid,
.performance-rank-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

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

.performance-equity-widget,
.performance-chart-widget {
    min-height: 0;
}

.performance-table-card {
    min-height: 21rem;
}

.performance-table-list {
    display: grid;
    gap: 0.65rem;
}

.performance-table-row,
.performance-rank-row {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.45rem;
    grid-template-columns: minmax(7.5rem, 1.45fr) minmax(5rem, 0.65fr) repeat(3, minmax(3.8rem, 0.5fr));
    min-height: 3.35rem;
    overflow: hidden;
    padding: 0.65rem 0.75rem;
    position: relative;
}

.performance-table-row::before,
.performance-rank-row::before {
    background: var(--muted);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 3px;
}

.performance-table-row.performance-tone-positive::before,
.performance-rank-row.performance-tone-positive::before {
    background: var(--green);
}

.performance-table-row.performance-tone-negative::before,
.performance-rank-row.performance-tone-negative::before {
    background: var(--red);
}

.performance-table-row.performance-tone-warning::before,
.performance-rank-row.performance-tone-warning::before {
    background: var(--orange);
}

.performance-table-row {
    align-items: start;
    grid-template-areas:
        "label value"
        "trades winrate"
        "profit profit";
    grid-template-columns: minmax(0, 1fr) auto;
}

.performance-rank-row {
    align-items: start;
    grid-template-areas:
        "label value"
        "trades winrate";
    grid-template-columns: minmax(0, 1fr) auto;
}

.performance-table-row strong,
.performance-rank-row strong {
    color: var(--text-strong);
    min-width: 0;
}

.performance-rank-row strong {
    display: -webkit-box;
    grid-area: label;
    line-height: 1.12;
    overflow: hidden;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.performance-table-row strong {
    display: -webkit-box;
    grid-area: label;
    line-height: 1.12;
    overflow: hidden;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.performance-table-row span,
.performance-rank-row span {
    color: var(--muted-strong);
    font-weight: 850;
    justify-self: end;
}

.performance-table-row span {
    grid-area: value;
}

.performance-rank-row span {
    grid-area: value;
}

.performance-table-row em,
.performance-rank-row em {
    color: var(--muted);
    font-size: 0.74rem;
    font-style: normal;
    font-weight: 850;
    justify-self: end;
    white-space: nowrap;
}

.performance-rank-row em:first-of-type {
    grid-area: trades;
    justify-self: start;
}

.performance-rank-row em:last-of-type {
    grid-area: winrate;
}

.performance-table-row em:first-of-type {
    grid-area: trades;
    justify-self: start;
}

.performance-table-row em:nth-of-type(2) {
    grid-area: winrate;
}

.performance-table-row em:last-of-type {
    grid-area: profit;
    justify-self: start;
}

.performance-benchmark-panel {
    margin-bottom: 1.25rem;
}

.performance-benchmark-grid {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.performance-benchmark-card {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.8rem;
    min-width: 0;
    overflow: hidden;
    padding: 0.85rem;
    position: relative;
}

.performance-benchmark-card::before {
    background: var(--muted);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 3px;
}

.performance-benchmark-card.performance-tone-positive::before {
    background: var(--green);
}

.performance-benchmark-card.performance-tone-warning::before {
    background: var(--orange);
}

.performance-benchmark-card-header {
    align-items: start;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.performance-benchmark-card-header strong {
    color: var(--text-strong);
    font-size: 1rem;
    font-weight: 900;
}

.performance-benchmark-card-header span {
    color: var(--text-strong);
    font-size: clamp(1.18rem, 1.8vw, 1.55rem);
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.performance-benchmark-card-stats {
    display: grid;
    gap: 0.45rem;
}

.performance-benchmark-card-stats > div {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.performance-benchmark-card-stats span {
    color: var(--muted);
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.performance-benchmark-card-stats strong {
    color: var(--muted-strong);
    font-size: 0.92rem;
    font-weight: 850;
    white-space: nowrap;
}

.performance-benchmark-card em {
    color: var(--muted);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 850;
    white-space: nowrap;
}

.performance-fee-panel {
    margin-bottom: 1.25rem;
}

.performance-fee-impact {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.performance-fee-impact-header {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.performance-fee-impact-header strong {
    color: var(--text-strong);
    font-size: 1rem;
    font-weight: 900;
}

.performance-fee-impact-header span {
    color: var(--muted);
    font-size: 0.86rem;
    font-weight: 750;
    text-align: right;
}

.performance-fee-impact-values {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.performance-fee-impact-values > div {
    background: rgba(255, 255, 255, 0.025);
    border: 1px solid var(--line);
    border-radius: 0.55rem;
    display: grid;
    gap: 0.35rem;
    min-width: 0;
    padding: 0.85rem;
}

.performance-fee-impact-values span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.performance-fee-impact-values strong {
    color: var(--text-strong);
    font-size: clamp(1.05rem, 1.6vw, 1.45rem);
    font-weight: 900;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.options-metric-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.options-metric-grid-compact {
    grid-template-columns: minmax(12rem, 18rem);
}

.options-metric-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
        var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: grid;
    gap: 0.5rem;
    min-height: 10.75rem;
    overflow: hidden;
    padding: 0.9rem;
    position: relative;
}

.options-metric-card::before,
.options-dte-heatmap > div::before {
    background: var(--blue);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.78;
    position: absolute;
    top: 0;
    width: 3px;
}

.options-metric-card > span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.options-metric-card strong {
    color: var(--text-strong);
    font-size: clamp(1.26rem, 1.8vw, 1.72rem);
    font-weight: 900;
    line-height: 1.05;
}

.options-metric-card small,
.options-metric-card em,
.options-strategy-row em,
.options-exposure-row em,
.options-framework-card em,
.options-dte-heatmap em {
    color: var(--muted);
    font-size: 0.74rem;
    font-style: normal;
    font-weight: 850;
    line-height: 1.35;
}

.options-tone-positive::before {
    background: var(--green);
}

.options-tone-negative::before {
    background: var(--red);
}

.options-tone-warning::before {
    background: var(--orange);
}

.options-primary-grid,
.options-framework-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.options-closed-layout {
    align-items: stretch;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.25fr) minmax(22rem, 0.95fr);
    margin-bottom: 1.25rem;
}

.options-closed-layout .options-chart-widget:first-child {
    grid-row: span 2;
}

.options-dte-widget {
    min-height: 0;
}

.options-chart-widget {
    min-height: 0;
}

.options-dte-heatmap {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.options-dte-heatmap > div {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.4rem;
    min-height: 6.25rem;
    overflow: hidden;
    padding: 0.75rem 0.75rem 0.75rem 1rem;
    position: relative;
}

.options-dte-heatmap strong,
.options-exposure-row strong,
.options-strategy-row strong,
.options-framework-card strong {
    color: var(--text-strong);
}

.options-dte-heatmap span,
.options-exposure-row span,
.options-strategy-row span,
.options-framework-card span {
    color: var(--muted-strong);
}

.options-exposure-list,
.options-expiration-ladder,
.options-strategy-table {
    display: grid;
    gap: 0.65rem;
}

.options-exposure-row {
    display: grid;
    gap: 0.45rem;
}

.options-exposure-row > div:first-child {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.options-exposure-row em {
    justify-self: end;
}

.options-expiration-row {
    align-items: center;
    display: grid;
    gap: 0.55rem;
    grid-template-columns: minmax(0, 1.15fr) minmax(7rem, 1fr) minmax(3rem, 0.35fr) minmax(5.5rem, 0.5fr);
}

.options-expiration-row > div:first-child {
    display: grid;
    gap: 0.18rem;
}

.options-expiration-row strong {
    color: var(--text-strong);
}

.options-expiration-row span,
.options-expiration-row em {
    color: var(--muted-strong);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 850;
}

.options-expiration-row em,
.options-expiration-row > span:last-child {
    justify-self: end;
    white-space: nowrap;
}

.options-strategy-panel {
    margin-bottom: 1.25rem;
}

.options-strategy-row {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    align-items: center;
    display: grid;
    gap: 0.7rem;
    grid-template-columns: minmax(0, 1.35fr) minmax(7rem, 0.8fr) repeat(5, minmax(5.8rem, 0.62fr));
    min-height: 4.25rem;
    padding: 0.8rem 0.9rem;
}

.options-strategy-row strong {
    font-size: clamp(0.98rem, 1.1vw, 1.12rem);
    line-height: 1.2;
}

.options-strategy-row span,
.options-strategy-row em {
    justify-self: end;
    white-space: nowrap;
}

.options-strategy-row span,
.options-strategy-row em {
    align-items: flex-end;
    display: inline-flex;
    flex-direction: column;
    gap: 0.1rem;
    color: var(--text-strong);
    font-size: clamp(0.98rem, 1.15vw, 1.18rem);
    font-weight: 900;
    line-height: 1.1;
}

.options-strategy-row small {
    color: var(--muted);
    display: inline;
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 850;
    letter-spacing: 0.04em;
    line-height: 1.15;
    text-transform: uppercase;
}

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

.options-framework-card {
    display: grid;
    gap: 0.55rem;
    min-height: 10rem;
}

.behavioral-metric-grid,
.behavioral-scorecard-grid,
.behavioral-insight-grid {
    display: grid;
    gap: 0.85rem;
    margin-bottom: 1.25rem;
}

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

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

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

.behavioral-metric-card,
.behavioral-scorecard,
.behavioral-insight-card {
    display: grid;
    gap: 0.5rem;
    overflow: hidden;
    position: relative;
}

.behavioral-metric-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
        var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    min-height: 10.75rem;
    padding: 0.9rem;
}

.behavioral-metric-card::before,
.behavioral-scorecard::before,
.behavioral-insight-card::before {
    background: var(--blue);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.78;
    position: absolute;
    top: 0;
    width: 3px;
}

.behavioral-metric-card > span,
.behavioral-scorecard > span {
    color: var(--muted);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.behavioral-metric-card strong,
.behavioral-scorecard strong,
.behavioral-insight-card strong,
.behavioral-heatmap strong {
    color: var(--text-strong);
}

.behavioral-metric-card strong,
.behavioral-scorecard strong {
    font-size: clamp(1.25rem, 1.8vw, 1.7rem);
    font-weight: 900;
    line-height: 1.05;
}

.behavioral-metric-card small,
.behavioral-metric-card em,
.behavioral-scorecard small,
.behavioral-scorecard em,
.behavioral-insight-card span,
.behavioral-heatmap em,
.behavioral-heatmap small {
    color: var(--muted);
    font-size: 0.74rem;
    font-style: normal;
    font-weight: 850;
    line-height: 1.35;
}

.behavioral-tone-positive::before {
    background: var(--green);
}

.behavioral-tone-negative::before {
    background: var(--red);
}

.behavioral-tone-warning::before {
    background: var(--orange);
}

.behavioral-scorecard-framework::before {
    background: var(--muted);
}

.behavioral-scorecard-framework strong {
    color: var(--muted-strong);
    font-size: 1.05rem;
}

.behavioral-primary-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 1.25rem;
}

.behavioral-chart-widget {
    min-height: 0;
}

.behavioral-heatmap {
    display: grid;
    gap: 0.7rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.behavioral-heatmap > div {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.4rem;
    min-height: 6.25rem;
    padding: 0.75rem;
}

.behavioral-heatmap span,
.behavioral-insight-card p {
    color: var(--muted-strong);
}

.behavioral-insight-card {
    min-height: 10rem;
}

.behavioral-insight-card div {
    display: grid;
    gap: 0.25rem;
}

.behavioral-insight-card p {
    margin: 0;
}

.strategy-metric-grid,
.strategy-primary-grid,
.strategy-breakdown-grid,
.strategy-framework-grid,
.strategy-data-health-grid {
    display: grid;
    gap: 0.85rem;
    margin-bottom: 1.25rem;
}

.strategy-metric-grid,
.strategy-data-health-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.strategy-primary-grid,
.strategy-breakdown-grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
}

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

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

.strategy-metric-card,
.strategy-row,
.strategy-treemap-item,
.strategy-drilldown-card,
.strategy-data-health-card,
.strategy-framework-card,
.strategy-framework-row {
    overflow: hidden;
    position: relative;
}

.strategy-metric-card,
.strategy-drilldown-card,
.strategy-data-health-card,
.strategy-framework-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent),
        var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    display: grid;
    gap: 0.5rem;
    min-height: 10rem;
    padding: 0.9rem;
}

.strategy-metric-card::before,
.strategy-row::before,
.strategy-treemap-item::before,
.strategy-drilldown-card::before,
.strategy-data-health-card::before {
    background: var(--blue);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.78;
    position: absolute;
    top: 0;
    width: 3px;
}

.strategy-tone-positive::before {
    background: var(--green);
}

.strategy-tone-negative::before {
    background: var(--red);
}

.strategy-tone-warning::before {
    background: var(--orange);
}

.strategy-metric-card > span,
.strategy-data-health-card > span,
.strategy-row em,
.strategy-drilldown-card em,
.strategy-framework-card em,
.strategy-framework-row em,
.strategy-treemap-item em,
.strategy-dte-grid em {
    color: var(--muted);
    font-size: 0.74rem;
    font-style: normal;
    font-weight: 850;
    line-height: 1.35;
}

.strategy-metric-card > span,
.strategy-data-health-card > span {
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.strategy-metric-card strong,
.strategy-row strong,
.strategy-treemap-item strong,
.strategy-drilldown-card strong,
.strategy-data-health-card strong,
.strategy-framework-card strong,
.strategy-framework-row strong,
.strategy-dte-grid strong {
    color: var(--text-strong);
}

.strategy-metric-card strong,
.strategy-data-health-card strong {
    font-size: clamp(1.2rem, 1.7vw, 1.55rem);
    font-weight: 900;
    line-height: 1.05;
}

.strategy-data-health-card strong {
    align-items: baseline;
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.strategy-data-health-card strong em {
    color: var(--muted);
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 850;
}

.strategy-data-health-percent {
    color: var(--muted-strong);
    font-size: 0.9rem;
    font-weight: 900;
    line-height: 1.2;
}

.strategy-metric-card small,
.strategy-data-health-card small,
.strategy-framework-card span,
.strategy-framework-row span,
.strategy-row span,
.strategy-drilldown-card span,
.strategy-dte-grid span {
    color: var(--muted-strong);
    font-size: 0.82rem;
    line-height: 1.35;
}

.strategy-data-health-card em,
.strategy-data-health-link {
    align-self: end;
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 850;
}

.strategy-data-health-card em {
    color: var(--muted);
}

.strategy-data-health-link {
    color: var(--blue);
    text-decoration: none;
}

.strategy-data-health-link:hover {
    text-decoration: underline;
}

.strategy-chart-widget,
.strategy-leaderboard-panel,
.strategy-drilldown-panel,
.strategy-treemap-panel {
    min-height: 0;
}

.strategy-leaderboard,
.strategy-dte-grid,
.strategy-treemap,
.strategy-drilldown-grid {
    display: grid;
    gap: 0.65rem;
}

.strategy-row-header,
.strategy-row {
    align-items: center;
    display: grid;
    gap: 0.55rem;
    grid-template-columns: minmax(8rem, 1.25fr) minmax(6.5rem, 0.85fr) repeat(5, minmax(4rem, 0.65fr)) minmax(5rem, 0.65fr) minmax(6.5rem, 0.85fr);
}

.strategy-row-header {
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    padding: 0 0.8rem 0 0.95rem;
    text-transform: uppercase;
}

.strategy-row {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    padding: 0.75rem 0.8rem 0.75rem 0.95rem;
}

.strategy-row:hover,
.strategy-treemap-item:hover {
    border-color: rgba(56, 189, 248, 0.45);
}

.strategy-sample-quality-cell {
    align-items: flex-start;
    display: inline-flex;
    min-width: 0;
}

.strategy-sample-count {
    color: var(--muted-strong);
    font-size: 0.78rem;
    line-height: 1.2;
}

.strategy-sample-badge {
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    display: inline-flex;
    font-size: 0.65rem;
    font-weight: 900;
    line-height: 1.12;
    max-width: 100%;
    padding: 0.25rem 0.45rem;
    text-align: center;
    white-space: normal;
}

.strategy-sample-warning {
    background: rgba(245, 158, 11, 0.12);
    border-color: rgba(245, 158, 11, 0.35);
    color: var(--orange);
}

.strategy-sample-neutral {
    background: rgba(148, 163, 184, 0.12);
    border-color: rgba(148, 163, 184, 0.28);
    color: var(--muted-strong);
}

.strategy-sample-positive {
    background: rgba(34, 197, 94, 0.12);
    border-color: rgba(34, 197, 94, 0.35);
    color: var(--green);
}

.strategy-drilldown-card {
    gap: 0.75rem;
    min-height: 13rem;
}

.strategy-drilldown-title {
    display: grid;
    gap: 0.25rem;
}

.strategy-drilldown-title strong {
    font-size: 0.95rem;
}

.strategy-outcome-strip {
    display: grid;
    gap: 0.4rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.strategy-outcome-strip span {
    background: rgba(148, 163, 184, 0.1);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    font-size: 0.72rem;
    font-weight: 850;
    padding: 0.45rem;
    text-align: center;
}

.strategy-outcome-strip .strategy-outcome-win {
    background: rgba(34, 197, 94, 0.1);
    border-color: rgba(34, 197, 94, 0.28);
    color: var(--green);
}

.strategy-outcome-strip .strategy-outcome-loss {
    background: rgba(239, 68, 68, 0.1);
    border-color: rgba(239, 68, 68, 0.28);
    color: var(--red);
}

.strategy-symbol-list {
    display: grid;
    gap: 0.4rem;
}

.strategy-symbol-list > div {
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.35rem;
    grid-template-columns: minmax(3.5rem, 0.7fr) minmax(4rem, 0.8fr) minmax(4rem, 0.8fr);
    padding: 0.45rem;
}

.strategy-symbol-list strong,
.strategy-symbol-list em {
    justify-self: end;
}

.strategy-treemap {
    align-content: stretch;
    display: flex;
    flex-wrap: wrap;
    min-height: 20rem;
}

.strategy-treemap-item {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    flex-grow: 1;
    gap: 0.45rem;
    min-height: 6.75rem;
    min-width: 11rem;
    padding: 0.8rem 0.85rem 0.8rem 1rem;
}

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

.strategy-dte-grid > div,
.strategy-framework-row {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.35rem;
    min-height: 6rem;
    padding: 0.75rem;
}

.strategy-framework-panel {
    display: grid;
    gap: 0.65rem;
}

.strategy-framework-card {
    min-height: 9.5rem;
}

.template-form {
    display: grid;
    gap: 0.75rem;
}

.template-card-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.template-library-toolbar {
    align-items: center;
}

.template-readiness {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.65rem;
}

.template-tabs {
    border-bottom-color: var(--line);
    gap: 0.35rem;
    margin-bottom: 1rem;
}

.template-tabs .nav-link {
    background: transparent;
    border-color: transparent;
    color: var(--muted-strong);
    font-weight: 800;
}

.template-tabs .nav-link.active {
    background: var(--panel-soft);
    border-color: var(--line) var(--line) var(--panel-soft);
    color: var(--text-strong);
}

.template-tab-content {
    padding-top: 0.25rem;
}

.template-create-panel {
    max-width: 1120px;
}

.template-create-summary {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.template-create-summary span {
    display: grid;
    gap: 0.2rem;
}

.template-create-summary small {
    color: var(--muted-strong);
    font-weight: 600;
}

.template-form-section {
    background: rgba(15, 23, 42, 0.2);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.75rem;
    padding: 0.85rem;
}

.template-form-section h3 {
    font-size: 0.98rem;
    margin: 0;
}

.template-library-table td {
    vertical-align: top;
}

.template-library-table {
    min-width: 980px;
}

.template-library-table th:first-child,
.template-library-table td:first-child {
    min-width: 260px;
    width: 26%;
}

.template-library-table th:nth-child(3),
.template-library-table td:nth-child(3) {
    min-width: 380px;
    width: 42%;
}

.template-library-table th:last-child,
.template-library-table td:last-child {
    min-width: 190px;
    white-space: nowrap;
}

.template-library-table td > span {
    display: block;
    margin-top: 0.25rem;
}

.template-metric-grid {
    display: grid;
    gap: 0.4rem;
    grid-template-columns: repeat(5, minmax(4.4rem, 1fr));
}

.template-metric-grid span {
    background: rgba(15, 23, 42, 0.28);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.1rem;
    min-height: 3.7rem;
    padding: 0.48rem 0.5rem;
}

.template-metric-grid strong {
    color: var(--text-strong);
    font-size: 0.92rem;
    line-height: 1.1;
}

.template-metric-grid small {
    color: var(--muted-strong);
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
}

.template-row-actions {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 0.5rem;
}

.template-row-actions .inline-action-form {
    margin: 0;
}

.template-row-details,
.template-row-edit {
    margin-top: 0.45rem;
    min-width: 18rem;
}

.template-row-edit {
    min-width: min(64rem, 82vw);
}

.template-modal .modal-content {
    background: var(--panel);
    border: 1px solid var(--line);
    color: var(--text);
    white-space: normal;
}

.template-modal * {
    white-space: normal;
}

.template-modal .modal-header {
    border-bottom-color: var(--line);
}

.template-modal .modal-header p {
    color: var(--muted-strong);
    margin: 0.25rem 0 0;
}

.template-modal .modal-body {
    overflow-x: hidden;
}

.template-modal,
.template-modal p,
.template-modal dd,
.template-modal section {
    overflow-wrap: anywhere;
    word-break: normal;
}

.template-modal .btn-close {
    filter: invert(1) grayscale(1);
}

.template-detail-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.template-detail-grid section {
    background: rgba(15, 23, 42, 0.22);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    min-width: 0;
    padding: 0.95rem;
}

.template-detail-grid h3 {
    font-size: 0.95rem;
    margin: 0 0 0.65rem;
}

.template-detail-grid dl {
    display: grid;
    gap: 0.45rem 0.75rem;
    grid-template-columns: minmax(7rem, auto) 1fr;
    margin: 0;
}

.template-detail-grid dt {
    color: var(--muted-strong);
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
}

.template-detail-grid dd {
    margin: 0;
}

.template-card-action {
    margin-top: 0.85rem;
}

.template-details-editor {
    background: rgba(15, 23, 42, 0.24);
}

.form-help {
    color: var(--muted-strong);
    font-size: 0.9rem;
    margin: -0.2rem 0 0;
}

.form-panel {
    max-width: 1080px;
}

.form-grid {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.form-grid > .text-danger,
.span-full {
    grid-column: 1 / -1;
}

.form-grid label,
.template-form label {
    display: grid;
    gap: 0.35rem;
}

.form-grid input,
.form-grid select,
.form-grid textarea,
.template-form input,
.template-form select,
.template-form textarea {
    margin-bottom: 0;
}

.form-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}

/* Edit staged fill form aligned with the Inspinia form layout. */
.edit-fill-toolbar {
    align-items: flex-start;
}

.edit-fill-panel {
    margin-left: 0;
    margin-right: auto;
    max-width: 1180px;
    padding: 1.35rem;
}

.edit-fill-heading {
    border-bottom: 1px solid var(--line);
    margin-bottom: 1.2rem;
    padding-bottom: 1rem;
}

.edit-fill-heading .status-badge {
    white-space: nowrap;
}

.edit-fill-grid {
    gap: 1rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.edit-fill-grid label {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--muted-strong);
    font-size: 0.92rem;
    font-weight: 700;
    gap: 0.5rem;
    padding: 0.85rem;
}

.edit-fill-grid input,
.edit-fill-grid select,
.edit-fill-grid textarea {
    background-color: var(--panel);
    font-size: 0.98rem;
    min-height: 2.7rem;
}

.edit-fill-grid textarea {
    line-height: 1.55;
    min-height: 7rem;
}

.edit-fill-raw-description {
    min-height: 0;
}

.edit-fill-actions {
    border-top: 1px solid var(--line);
    justify-content: flex-end;
    margin-top: 0.25rem;
    padding-top: 1rem;
}

@media (max-width: 1100px) {
    .form-grid.edit-fill-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .form-grid.edit-fill-grid {
        grid-template-columns: 1fr;
    }

    .edit-fill-panel {
        padding: 1rem;
    }
}

.account-cash-flow-panel {
    max-width: none;
}

.brokerage-section-heading {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
}

.cash-flow-grid {
    align-items: start;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.cash-flow-form {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    max-width: 720px;
    padding: 1rem;
    width: 100%;
}

.recent-cash-flows {
    min-width: 0;
    width: 100%;
}

.section-heading.compact {
    margin-bottom: 0.75rem;
}

.section-heading.compact h3 {
    font-size: 0.98rem;
    margin: 0;
}

.compact-empty {
    min-height: 140px;
}

.compact-table-wrap {
    margin-top: 0;
}

.mini-data-table {
    border-collapse: collapse;
    font-size: 0.92rem;
    width: 100%;
}

.mini-data-table th {
    background: rgba(15, 23, 42, 0.42);
    border-bottom: 1px solid var(--line);
    color: var(--muted-strong);
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    padding: 0.72rem 0.6rem;
    text-align: left;
    text-transform: uppercase;
}

.mini-data-table td {
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
    padding: 0.78rem 0.6rem;
}

.mini-data-table tbody tr:last-child td {
    border-bottom: 0;
}

.recent-cash-flow-table td,
.brokerage-accounts-table td {
    vertical-align: middle;
}

.account-cash-flow-panel table.dataTable,
.brokerage-accounts-panel table.dataTable {
    table-layout: fixed;
}

.account-cash-flow-panel table.dataTable > thead > tr > th,
.account-cash-flow-panel table.dataTable > tbody > tr > td,
.brokerage-accounts-panel table.dataTable > thead > tr > th,
.brokerage-accounts-panel table.dataTable > tbody > tr > td {
    font-size: 0.95rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
    padding-bottom: 0.7rem;
    padding-top: 0.7rem;
    vertical-align: middle;
}

.account-cash-flow-panel table.dataTable > thead > tr > th,
.brokerage-accounts-panel table.dataTable > thead > tr > th {
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    overflow-wrap: normal;
    white-space: nowrap;
}

.account-cash-flow-panel .dt-container,
.brokerage-accounts-panel .dt-container {
    padding: 0.85rem;
}

.account-cash-flow-panel .dt-layout-row,
.brokerage-accounts-panel .dt-layout-row {
    align-items: center;
}

.account-cash-flow-panel table.dataTable > thead > tr > th:nth-child(4),
.account-cash-flow-panel table.dataTable > tbody > tr > td:nth-child(4),
.brokerage-accounts-panel table.dataTable > thead > tr > th:nth-child(5),
.brokerage-accounts-panel table.dataTable > tbody > tr > td:nth-child(5),
.brokerage-accounts-panel table.dataTable > thead > tr > th:nth-child(6),
.brokerage-accounts-panel table.dataTable > tbody > tr > td:nth-child(6),
.brokerage-accounts-panel table.dataTable > thead > tr > th:nth-child(7),
.brokerage-accounts-panel table.dataTable > tbody > tr > td:nth-child(7) {
    text-align: right;
}

.account-cash-flow-panel table.dataTable > thead > tr > th:nth-child(6),
.account-cash-flow-panel table.dataTable > tbody > tr > td:nth-child(6),
.brokerage-accounts-panel table.dataTable > thead > tr > th:nth-child(9),
.brokerage-accounts-panel table.dataTable > tbody > tr > td:nth-child(9) {
    overflow-wrap: normal;
    text-align: right;
    width: 9.75rem;
}

.recent-cash-flow-table .cash-flow-amount {
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    white-space: nowrap;
}

.account-cash-flow-panel table.dataTable > tbody > tr > td.cash-flow-amount.pnl-positive,
.brokerage-accounts-panel table.dataTable > tbody > tr > td.brokerage-money.pnl-positive {
    color: var(--green);
}

.account-cash-flow-panel table.dataTable > tbody > tr > td.cash-flow-amount.pnl-negative,
.brokerage-accounts-panel table.dataTable > tbody > tr > td.brokerage-money.pnl-negative {
    color: var(--red);
}

.brokerage-accounts-panel table.dataTable > tbody > tr > td.brokerage-money {
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    white-space: nowrap;
}

.compact-action {
    font-size: 0.86rem;
    line-height: 1.1;
    min-height: 36px;
    padding: 0.36rem 0.58rem;
    white-space: nowrap;
}

.community-table-panel .section-heading {
    align-items: flex-start;
}

.community-data-table .community-title-cell {
    min-width: 16rem;
}

.community-data-table .community-title-cell small {
    color: var(--muted);
    display: block;
    line-height: 1.45;
    margin-top: 0.25rem;
}

.community-data-table .table-actions {
    display: table-cell;
    min-width: 6.5rem;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

.community-data-table .table-actions > .inline-action-form,
.community-data-table .table-actions > .button,
.community-data-table .table-actions > button,
.community-data-table .template-row-actions > .inline-action-form,
.community-data-table .template-row-actions > button {
    display: inline-flex;
    vertical-align: middle;
}

.community-data-table .table-actions button,
.community-data-table .template-row-actions button {
    font-size: 0.86rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    min-height: 36px;
    padding: 0.36rem 0.58rem;
}

.recent-cash-flow-table .table-actions {
    display: table-cell;
    min-width: 8rem;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

.recent-cash-flow-table .table-actions > .button,
.recent-cash-flow-table .table-actions > .inline-action-form {
    display: inline-flex;
    vertical-align: middle;
}

.recent-cash-flow-table .table-actions > .inline-action-form {
    margin-left: 0.5rem;
}

.account-cash-flow-panel .brokerage-details-action,
.brokerage-accounts-panel .brokerage-details-action {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--theme-primary);
    display: inline-flex;
    font-size: 0.86rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.1;
    min-height: 36px;
    padding: 0.36rem 0.52rem;
    text-decoration: none;
    white-space: nowrap;
}

.account-cash-flow-panel .brokerage-details-action:hover,
.account-cash-flow-panel .brokerage-details-action:focus,
.brokerage-accounts-panel .brokerage-details-action:hover,
.brokerage-accounts-panel .brokerage-details-action:focus {
    background: var(--panel);
    border-color: var(--line-strong);
    color: var(--theme-primary);
    text-decoration: none;
}

.account-cash-flow-panel .compact-danger-action,
.brokerage-accounts-panel .compact-danger-action {
    background: var(--red);
    border: 1px solid var(--red);
    border-radius: var(--radius-sm);
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.1;
    min-height: 36px;
    min-width: 3.55rem;
    padding: 0.36rem 0.45rem;
    text-decoration: none;
    white-space: nowrap;
}

.account-cash-flow-panel .compact-danger-action:hover,
.account-cash-flow-panel .compact-danger-action:focus,
.brokerage-accounts-panel .compact-danger-action:hover,
.brokerage-accounts-panel .compact-danger-action:focus {
    background: #ec4758;
    border-color: #ec4758;
    color: #ffffff;
    text-decoration: none;
}

.account-row-actions {
    display: table-cell;
    min-width: 176px;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

.account-row-actions > .button,
.account-row-actions > .inline-action-form {
    display: inline-flex;
    vertical-align: middle;
}

.account-row-actions > .inline-action-form {
    margin-left: 0.5rem;
}

.account-row-actions .button,
.account-row-actions button {
    min-height: 36px;
    padding: 0.45rem 0.75rem;
}

.inline-action-form {
    display: inline-flex;
    margin: 0;
}

.form-grid label.checkbox-row {
    align-items: center;
    display: inline-flex;
    gap: 0.55rem;
    justify-content: flex-start;
}

.form-grid label.checkbox-row input[type="checkbox"] {
    display: inline-block;
    margin: 0;
    min-height: auto;
    width: auto;
}

.detail-list {
    display: grid;
    gap: 0.75rem 1rem;
    grid-template-columns: minmax(9rem, auto) 1fr;
    margin: 0;
}

.detail-list dt {
    color: var(--muted-strong);
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
}

.detail-list dd {
    margin: 0;
}

.support-message {
    white-space: pre-wrap;
}

.public-support-form {
    margin-top: 1rem;
}

@media (max-width: 1100px) {
    .cash-flow-grid {
        grid-template-columns: 1fr;
    }
}

.checkbox-field {
    align-items: center;
    display: inline-flex !important;
    gap: 0.55rem !important;
    justify-content: flex-start;
}

.checkbox-field input,
label input[type="checkbox"] {
    accent-color: var(--blue);
    display: inline-block;
    margin: 0;
    min-height: auto;
    width: auto;
}

.template-card {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 1rem;
}

.template-card h3 {
    margin: 0;
}

.template-card details {
    margin-top: 0.75rem;
}

details {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 0.75rem;
}

details + details {
    margin-top: 0.75rem;
}

summary {
    color: var(--text-strong);
    cursor: pointer;
    font-weight: 850;
}

details[open] summary {
    margin-bottom: 0.65rem;
}

.tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.tag-list form {
    margin: 0;
}

.tag-list button {
    background: rgba(52, 211, 153, 0.1);
    border-color: rgba(52, 211, 153, 0.22);
    box-shadow: none;
    color: #bbf7d0;
    min-height: 34px;
}

.position-share-layout {
    align-items: start;
    display: grid;
    gap: 1.2rem;
    grid-template-columns: minmax(15rem, 0.42fr) minmax(0, 1fr);
    margin-bottom: 1.25rem;
}

.template-assignment-panel {
    align-self: start;
}

.template-assignment-panel form {
    align-items: end;
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin: 0;
}

.template-assignment-panel label {
    flex: 1 1 13rem;
    margin: 0;
}

.template-assignment-panel select {
    margin-bottom: 0;
}

.template-assignment-panel button {
    flex: 0 0 auto;
}

.share-panel {
    display: grid;
    gap: 0.85rem;
}

.share-panel .section-heading {
    margin-bottom: 0;
}

.share-heading {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.share-state {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.12), rgba(56, 189, 248, 0.08));
    border: 1px solid rgba(245, 158, 11, 0.24);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.25rem;
    padding: 0.7rem 0.85rem;
}

.share-state strong {
    color: var(--text-strong);
    font-size: 0.9rem;
}

.share-state span {
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.45;
}

.share-state-ready {
    background: linear-gradient(135deg, rgba(52, 211, 153, 0.13), rgba(56, 189, 248, 0.07));
    border-color: rgba(52, 211, 153, 0.24);
}

.share-readiness,
.share-setup-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.share-setup-actions form,
.share-unshare-form {
    margin: 0;
}

.share-setup-actions .button {
    box-shadow: none;
}

.share-compose {
    background: rgba(2, 6, 23, 0.18);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    padding: 0.85rem;
}

.share-compose-form {
    align-items: start;
    display: grid;
    gap: 0.85rem;
    grid-template-columns: minmax(13rem, 0.75fr) minmax(0, 1.25fr);
    margin: 0;
}

.share-compose-form label {
    display: grid;
    gap: 0.35rem;
    margin: 0;
}

.share-compose-form input,
.share-compose-form textarea {
    margin-bottom: 0;
}

.share-description-field textarea {
    min-height: 7.5rem;
}

.share-actions {
    display: flex;
    grid-column: 1 / -1;
    justify-content: flex-end;
}

.share-actions button {
    min-width: 9.5rem;
    white-space: nowrap;
}

.share-unshare-form {
    justify-self: start;
}

.position-detail-page {
    display: grid;
    gap: 1.25rem;
}

.position-detail-toolbar {
    margin-bottom: 0;
}

.position-detail-toolbar h1 {
    line-height: 1.1;
}

.position-detail-toolbar p {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.position-detail-top-grid {
    align-items: stretch;
    gap: 1.25rem;
    grid-template-columns: minmax(22rem, 0.95fr) minmax(0, 1.55fr);
    margin-bottom: 0;
}

.position-detail-top-grid > .panel {
    margin-bottom: 0;
}

.position-detail-summary-column {
    align-content: start;
    display: grid;
    gap: 1rem;
}

.position-detail-summary-column > .panel {
    margin-bottom: 0;
}

.position-detail-page .template-assignment-panel,
.position-detail-page .share-panel,
.position-detail-panel {
    padding: 1.15rem;
}

.position-detail-page .section-heading h2 {
    font-size: 1.12rem;
    line-height: 1.35;
}

.position-detail-page .section-heading p {
    color: var(--muted-strong);
    font-size: 0.95rem;
    line-height: 1.5;
}

.position-detail-page .share-state {
    background: var(--panel-soft);
    border-color: var(--line);
}

.position-detail-page .share-compose {
    background: var(--panel-soft);
    padding: 1rem;
}

.position-detail-page .share-compose-form {
    grid-template-columns: minmax(14rem, 0.7fr) minmax(0, 1.3fr);
}

.position-detail-page .share-compose-form input,
.position-detail-page .share-compose-form textarea {
    font-size: 0.95rem;
}

.position-detail-metrics {
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 0;
}

.position-detail-metrics div,
.position-campaign-metrics div {
    min-height: 5.9rem;
}

.position-detail-metrics span,
.position-campaign-metrics span {
    color: var(--theme-secondary-color);
    letter-spacing: 0.04em;
}

.position-detail-metrics strong,
.position-campaign-metrics strong {
    font-size: clamp(1.25rem, 1.4vw, 1.65rem);
    line-height: 1.18;
}

.roll-campaign-panel {
    display: grid;
    gap: 1rem;
}

.position-campaign-metrics {
    gap: 0.85rem;
    margin-bottom: 0;
}

.position-detail-page .data-table {
    table-layout: fixed;
}

.position-detail-page .data-table > thead > tr > th,
.position-detail-page .data-table > tbody > tr > td {
    font-size: 0.92rem;
    line-height: 1.45;
    vertical-align: middle;
}

.position-detail-page .data-table > thead > tr > th {
    font-size: 0.76rem;
    letter-spacing: 0.04em;
}

.position-detail-page .data-table td.pnl-chip {
    text-align: right;
}

.position-detail-secondary-grid {
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.65fr);
    margin-bottom: 0;
}

.position-detail-fit-table {
    box-shadow: none;
    overflow-x: visible;
    overflow-y: visible;
    touch-action: auto;
}

.position-detail-fit-table table {
    min-width: 0;
}

.position-detail-fit-table .dt-container {
    min-width: 0;
}

.position-detail-fit-table .dt-layout-row {
    display: flex;
    flex-wrap: wrap;
}

.position-detail-fit-table .dt-layout-cell.dt-layout-end {
    margin-left: auto;
}

.position-detail-fit-table .dt-search input {
    max-width: 12rem;
    min-width: 0;
}

.position-detail-fit-table::after {
    display: none;
}

.position-tags-panel form,
.position-notes-panel form {
    margin-bottom: 0.9rem;
}

@media (max-width: 1200px) {
    .position-detail-top-grid {
        grid-template-columns: 1fr;
    }

    .position-detail-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .position-detail-secondary-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .position-detail-metrics,
    .position-campaign-metrics {
        grid-template-columns: 1fr;
    }

    .position-detail-page .share-compose-form {
        grid-template-columns: 1fr;
    }
}

.sharing-ack-panel {
    display: grid;
    gap: 1rem;
}

.sharing-ack-panel .section-heading {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 0;
}

.sharing-terms {
    background: rgba(2, 6, 23, 0.18);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--muted);
    display: grid;
    gap: 0.65rem;
    padding: 0.9rem;
}

.sharing-terms strong {
    color: var(--text-strong);
}

.sharing-terms ul {
    display: grid;
    gap: 0.45rem;
    margin: 0;
    padding-left: 1.15rem;
}

.sharing-terms li {
    line-height: 1.45;
}

.note {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    margin-top: 0.75rem;
    padding: 1rem;
}

.note time {
    color: var(--muted);
    display: block;
    font-size: 0.85rem;
    margin-bottom: 0.5rem;
}

.auth-panel {
    margin: 2rem auto;
    max-width: 620px;
}

.auth-panel h1 {
    font-size: 1.8rem;
    margin-bottom: 1rem;
}

.auth-lede {
    color: var(--muted);
    margin: -0.35rem 0 1rem;
}

.auth-panel form + a {
    display: inline-flex;
    font-weight: 800;
    margin-top: 1rem;
}

.billing-period-selector {
    border: 0;
    display: grid;
    gap: 0.65rem;
    margin: 0 0 1rem;
    padding: 0;
}

.billing-period-selector legend {
    color: var(--muted-strong);
    font-size: 0.82rem;
    font-weight: 850;
    margin-bottom: 0.1rem;
}

.billing-period-option {
    align-items: center;
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    cursor: pointer;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
    margin: 0;
    min-height: 4.1rem;
    padding: 0.8rem 0.9rem;
}

.billing-period-option.selected,
.billing-period-option:has(input:checked) {
    border-color: var(--theme-primary);
    box-shadow: 0 0 0 3px rgba(26, 179, 148, 0.12);
}

.billing-period-option input {
    accent-color: var(--theme-primary);
    margin: 0;
}

.billing-period-option span,
.billing-period-option strong,
.billing-period-option small {
    display: block;
}

.billing-period-option strong {
    color: var(--text);
    font-size: 0.98rem;
}

.billing-period-option small {
    color: var(--muted);
    font-size: 0.82rem;
    line-height: 1.35;
}

.billing-period-option em {
    background: rgba(52, 211, 153, 0.14);
    border-radius: 999px;
    color: var(--green);
    font-size: 0.72rem;
    font-style: normal;
    font-weight: 900;
    padding: 0.25rem 0.5rem;
    white-space: nowrap;
}

.billing-action-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-end;
}

.billing-plan-grid {
    align-items: stretch;
    grid-template-columns: minmax(0, 1.2fr) minmax(24rem, 0.9fr);
}

.billing-plan-card {
    display: grid;
    gap: 1rem;
}

.billing-feature-card {
    align-content: start;
}

.billing-summary-grid {
    margin-bottom: 0;
}

.billing-renewal-note {
    color: var(--muted);
    margin: 0;
}

.plan-feature-list {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.plan-feature-list article {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    min-height: 7.25rem;
    padding: 0.9rem;
}

.plan-feature-list span,
.plan-feature-list strong {
    display: block;
}

.plan-feature-list span {
    color: var(--muted-strong);
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

.plan-feature-list strong {
    color: var(--text);
    font-size: 0.94rem;
    font-weight: 600;
    line-height: 1.45;
}

.billing-feature-note {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-left: 4px solid var(--theme-primary);
    border-radius: var(--radius-sm);
    color: var(--muted-strong);
    font-size: 0.95rem;
    line-height: 1.55;
    padding: 0.85rem 1rem;
}

.notice {
    border-left: 4px solid var(--blue);
    color: var(--muted-strong);
    margin-bottom: 1rem;
}

.footer {
    border-top: 1px solid var(--line);
    color: var(--muted);
    flex-shrink: 0;
    line-height: 54px;
    width: 100%;
}

.text-danger {
    color: #fda4af !important;
}

@media (max-width: 1100px) {
    .metrics,
    .summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .dashboard-module-nav {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dashboard-filter-grid,
    .dashboard-widget-grid,
    .reports-export-grid,
    .first-run-path {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .billing-plan-grid {
        grid-template-columns: 1fr;
    }

    .summary-kpi-grid,
    .summary-skeleton-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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

    .performance-metric-grid,
    .performance-fee-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .options-metric-grid-compact {
        grid-template-columns: minmax(0, 1fr);
    }

    .behavioral-metric-grid,
    .behavioral-scorecard-grid,
    .behavioral-insight-grid,
    .strategy-metric-grid,
    .strategy-data-health-grid,
    .strategy-framework-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .risk-dashboard-grid,
    .risk-dashboard-grid-three,
    .performance-primary-grid,
    .performance-breakdown-grid,
    .performance-rank-grid,
    .options-closed-layout,
    .options-primary-grid,
    .options-framework-grid,
    .behavioral-primary-grid,
    .strategy-primary-grid,
    .strategy-breakdown-grid,
    .strategy-drilldown-grid {
        grid-template-columns: 1fr;
    }

    .options-strategy-row {
        grid-template-columns: minmax(0, 1.1fr) repeat(2, minmax(5.5rem, 0.7fr));
    }

    .strategy-row-header {
        display: none;
    }

    .strategy-row {
        grid-template-columns: minmax(0, 1.2fr) repeat(3, minmax(5rem, 0.7fr));
    }

    .summary-main-grid,
    .summary-primary-grid,
    .summary-secondary-grid,
    .summary-support-grid,
    .summary-skeleton-panels {
        grid-template-columns: 1fr;
    }

    .summary-equity-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .import-upload-layout {
        grid-template-columns: 1fr;
    }

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

@media (max-width: 991.98px) {
    .navbar-collapse {
        background: var(--panel);
        border: 1px solid var(--line);
        border-radius: var(--radius);
        box-shadow: var(--shadow);
        margin-top: 0.75rem;
        padding: 0.75rem;
    }

    .app-nav-links {
        align-items: stretch;
        gap: 0.25rem;
    }

    .app-nav .nav-link {
        justify-content: flex-start;
        width: 100%;
    }

    .app-nav .nav-link.active {
        box-shadow: inset 3px 0 0 var(--blue);
    }
}

@media (max-width: 900px) {
    .grid-two {
        grid-template-columns: 1fr;
    }

    .toolbar,
    .section-heading-actions,
    .dashboard-shell-header {
        align-items: flex-start;
        flex-direction: column;
    }

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

    .toolbar-actions,
    .section-heading-actions .toolbar-actions {
        width: 100%;
    }

    .toolbar-action-group {
        justify-content: flex-start;
        width: 100%;
    }

    .import-review-toolbar-actions {
        align-items: stretch;
    }

    .import-review-toolbar-actions .toolbar-action-group {
        flex-wrap: wrap;
    }

    .section-heading-actions .toolbar-actions > *,
    .section-heading-actions .toolbar-actions button,
    .section-heading-actions .toolbar-actions .button {
        flex: 1 1 180px;
    }

    .app-nav-actions {
        align-items: stretch;
        flex-direction: column;
        margin-top: 0.75rem;
    }

    .filter-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-module-nav,
    .dashboard-filter-grid,
    .dashboard-widget-grid,
    .reports-export-grid,
    .first-run-path,
    .billing-plan-grid,
    .plan-feature-list,
    .summary-kpi-grid,
    .summary-period-strip,
    .summary-main-grid,
    .summary-secondary-grid,
    .summary-support-grid,
    .summary-skeleton-grid,
    .risk-metric-grid,
    .performance-metric-grid,
    .performance-fee-grid,
    .options-metric-grid,
    .options-metric-grid-compact,
    .options-closed-layout,
    .behavioral-metric-grid,
    .behavioral-scorecard-grid,
    .behavioral-insight-grid,
    .strategy-metric-grid,
    .strategy-data-health-grid,
    .strategy-drilldown-grid,
    .strategy-framework-grid,
    .summary-highlight-grid {
        grid-template-columns: 1fr;
    }

    .summary-equity-stats {
        grid-template-columns: 1fr;
    }

    .dashboard-shell-actions,
    .pro-upgrade-panel {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .risk-gauge-grid {
        grid-template-columns: 1fr;
    }

    .performance-table-row {
        grid-template-areas:
            "label"
            "value"
            "trades"
            "winrate"
            "profit";
        grid-template-columns: 1fr;
    }

    .performance-rank-row {
        grid-template-areas:
            "label"
            "value"
            "trades"
            "winrate";
        grid-template-columns: 1fr;
    }

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

    .performance-table-row span,
    .performance-table-row em,
    .performance-rank-row span,
    .performance-rank-row em {
        justify-self: start;
    }

    .performance-fee-impact-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .performance-fee-impact-header span {
        text-align: left;
    }

    .performance-fee-impact-values {
        grid-template-columns: 1fr;
    }

    .options-dte-heatmap,
    .options-strategy-row,
    .strategy-row,
    .strategy-dte-grid {
        grid-template-columns: 1fr;
    }

    .options-strategy-row span,
    .options-strategy-row em,
    .options-expiration-row em,
    .options-expiration-row > span:last-child,
    .options-exposure-row em,
    .strategy-row span,
    .strategy-row em {
        align-items: flex-start;
        justify-self: start;
    }

    .options-expiration-row {
        grid-template-columns: 1fr;
    }

    .strategy-row > [data-label] {
        align-items: start;
        display: grid;
        gap: 0.45rem;
        grid-template-columns: minmax(6.5rem, 0.45fr) minmax(0, 1fr);
        width: 100%;
    }

    .strategy-row > [data-label]::before {
        color: var(--muted);
        content: attr(data-label);
        font-size: 0.68rem;
        font-weight: 850;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    .behavioral-heatmap {
        grid-template-columns: 1fr;
    }

    .summary-highlight-wide {
        grid-column: span 1;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .position-share-layout {
        grid-template-columns: 1fr;
    }

    .share-compose-form {
        align-items: stretch;
        grid-template-columns: 1fr;
    }

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

    .workflow-steps {
        grid-template-columns: 1fr;
    }

    .metrics-three,
    .insight-grid {
        grid-template-columns: 1fr;
    }

    .table-scroll::after {
        display: block;
    }

    .inline-strategy-form select {
        min-width: 150px;
    }

}

@media (max-width: 640px) {
    html {
        font-size: 14px;
    }

    main {
        padding-top: 1rem;
    }

    h1 {
        font-size: 1.65rem;
        line-height: 1.12;
    }

    .app-nav {
        min-height: 60px;
        padding: 0.5rem 0;
    }

    .brand-mark {
        height: 30px;
        width: 30px;
    }

    .panel,
    .auth-panel,
    .notice,
    .dashboard-chart,
    .dashboard-kpi-group,
    .summary-grid article,
    .metrics div,
    .workflow-step,
    .insight-card {
        padding: 0.85rem;
    }

    .auth-panel {
        margin: 1rem 0;
        max-width: none;
    }

    .auth-panel h1 {
        font-size: 1.5rem;
    }

    .billing-period-option {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .billing-period-option em {
        grid-column: 2;
        justify-self: start;
    }

    .billing-action-group,
    .pricing-cta-group {
        flex-direction: column;
        width: 100%;
    }

    .billing-action-group .button,
    .pricing-cta-group .button {
        justify-content: center;
        width: 100%;
    }

    .metrics {
        grid-template-columns: 1fr;
    }

    .summary-grid {
        grid-template-columns: 1fr;
    }

    .create-trade-drop-zone {
        align-items: flex-start;
        flex-direction: column;
    }

    .toolbar-actions,
    .filter-actions {
        width: 100%;
    }

    .toolbar-actions > *,
    .toolbar-actions button,
    .toolbar-actions .button,
    .toolbar-action-group > *,
    .toolbar-action-group button,
    .toolbar-action-group .button,
    .filter-actions button,
    .filter-actions .button {
        flex: 1 1 auto;
    }

    .toolbar-actions button,
    .toolbar-actions .button,
    .toolbar-action-group button,
    .toolbar-action-group .button,
    .filter-actions button,
    .filter-actions .button,
    .theme-toggle,
    .logout-link {
        width: 100%;
    }

    .table-scroll {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        width: calc(100% + 1.5rem);
    }

    .table-scroll table {
        min-width: 760px;
    }

    .dt-container {
        min-width: 760px;
        padding: 0.65rem;
    }

    .dt-container .dt-layout-row,
    .dt-container .dt-layout-cell {
        align-items: stretch;
        flex-direction: column;
        gap: 0.55rem;
    }

    .dt-container .dt-layout-cell.dt-layout-end {
        justify-content: flex-start;
    }

    .dt-container .dt-search input {
        min-width: 0;
        width: 100%;
    }

    .dt-container .dt-length select {
        margin-right: 0;
        width: 100%;
    }

    .dt-container .dt-paging {
        display: flex;
        flex-wrap: wrap;
        gap: 0.35rem;
    }

    .dt-container .dt-paging .dt-paging-button {
        margin-left: 0;
    }

    .fills-table,
    .broker-fills-table {
        min-width: 680px;
    }

    th,
    td {
        padding: 0.62rem;
    }

    .actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .actions .button,
    .actions button {
        width: 100%;
    }

    .form-actions button,
    .form-actions .button {
        width: 100%;
    }

    .share-heading {
        flex-direction: column;
    }

    .sharing-ack-panel .section-heading {
        flex-direction: column;
    }

    .share-heading .button,
    .share-actions button,
    .share-setup-actions button,
    .share-unshare-form button {
        width: 100%;
    }

    .share-setup-actions,
    .share-setup-actions form,
    .share-unshare-form {
        width: 100%;
    }

    .status-chip {
        max-width: 14rem;
    }
}

@media (max-width: 420px) {
    .app-shell {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .table-scroll {
        margin-left: -0.75rem;
        margin-right: -0.75rem;
        border-left: 0;
        border-right: 0;
        border-radius: 0;
    }

    .dashboard-chart canvas {
        min-height: 220px;
    }
}

.landing-page {
    background:
        radial-gradient(circle at 18% 0%, rgba(56, 189, 248, 0.18), transparent 28rem),
        radial-gradient(circle at 88% 14%, rgba(52, 211, 153, 0.12), transparent 24rem),
        linear-gradient(180deg, #050914 0%, #080d14 42%, #060a10 100%);
    color: var(--text);
    overflow-x: clip;
}

.landing-page main {
    padding: 0;
}

.landing-container {
    margin: 0 auto;
    max-width: 1220px;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

.landing-section {
    padding: clamp(4rem, 8vw, 7rem) 0;
}

.landing-section-muted {
    background:
        linear-gradient(180deg, rgba(15, 23, 34, 0.5), rgba(10, 16, 25, 0.42)),
        rgba(8, 13, 20, 0.42);
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
    border-top: 1px solid rgba(148, 163, 184, 0.1);
}

.landing-nav-wrap {
    background: rgba(5, 9, 20, 0.78);
    border-bottom: 1px solid rgba(148, 163, 184, 0.14);
    backdrop-filter: blur(18px);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24);
    position: sticky;
    top: 0;
    z-index: 1040;
}

.landing-nav {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 1220px;
    min-height: 72px;
    padding: 0.75rem clamp(1rem, 3vw, 2rem);
}

.landing-brand {
    align-items: center;
    color: var(--text-strong);
    display: inline-flex;
    font-weight: 900;
    gap: 0.65rem;
    text-decoration: none;
    white-space: nowrap;
}

.landing-brand:hover {
    color: var(--text-strong);
}

.landing-nav-links,
.landing-nav-actions,
.landing-cta-row {
    align-items: center;
    display: flex;
    gap: 0.75rem;
}

.landing-nav-links a,
.landing-link-button,
.landing-footer a {
    color: var(--muted-strong);
    font-size: 0.9rem;
    font-weight: 800;
}

.landing-nav-links a:hover,
.landing-link-button:hover,
.landing-footer a:hover {
    color: var(--text-strong);
}

.landing-button {
    border-radius: var(--radius-sm);
    min-width: max-content;
}

.landing-button-large {
    min-height: 48px;
    padding: 0.72rem 1.05rem;
}

.landing-theme-toggle {
    flex: 0 0 auto;
}

.landing-hero {
    min-height: calc(100vh - 72px);
    padding: clamp(3.25rem, 6vw, 5.5rem) 0 clamp(4rem, 7vw, 6rem);
}

.landing-hero-grid {
    align-items: center;
    display: grid;
    gap: clamp(2rem, 5vw, 4rem);
    grid-template-columns: minmax(0, 0.88fr) minmax(360px, 1.12fr);
}

.landing-hero-copy {
    display: grid;
    gap: 1.1rem;
}

.landing-eyebrow {
    color: var(--green);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.landing-audience-cue {
    color: var(--text-strong);
    font-size: 0.95rem;
    font-weight: 850;
    line-height: 1.45;
    margin: -0.3rem 0 0;
    max-width: 35rem;
}

.landing-hero h1 {
    font-size: clamp(3.1rem, 6.4vw, 5.85rem);
    letter-spacing: 0;
    line-height: 0.95;
    margin: 0;
    max-width: 11ch;
}

.landing-hero-subhead {
    color: var(--muted-strong);
    font-size: clamp(1.05rem, 1.5vw, 1.28rem);
    line-height: 1.55;
    margin: 0;
    max-width: 43rem;
    overflow-wrap: anywhere;
}

.landing-microcopy {
    color: var(--muted);
    font-size: 0.88rem;
    font-weight: 750;
    margin: 0;
}

.trial-unlock-row,
.pricing-unlock-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.trial-unlock-row span,
.pricing-unlock-list span {
    background: rgba(56, 189, 248, 0.1);
    border: 1px solid rgba(56, 189, 248, 0.22);
    border-radius: 999px;
    color: var(--text-strong);
    font-size: 0.76rem;
    font-weight: 850;
    line-height: 1.2;
    padding: 0.34rem 0.56rem;
}

.pricing-unlock-list span {
    background: rgba(52, 211, 153, 0.1);
    border-color: rgba(52, 211, 153, 0.22);
}

.dashboard-mockup {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent),
        rgba(11, 18, 29, 0.92);
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 14px;
    box-sizing: border-box;
    box-shadow: 0 34px 80px rgba(0, 0, 0, 0.42);
    display: grid;
    gap: 0.9rem;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: clamp(0.9rem, 2vw, 1.2rem);
    position: relative;
    width: 100%;
}

.dashboard-mockup::before {
    background: linear-gradient(135deg, rgba(56, 189, 248, 0.85), rgba(52, 211, 153, 0.7));
    border-radius: 14px 14px 0 0;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.mockup-header,
.mockup-card li,
.landing-footer-grid {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.mockup-header span,
.mockup-card span,
.pricing-equivalent,
.pricing-trial,
.pricing-savings {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.mockup-header strong {
    color: var(--text-strong);
    display: block;
    font-size: 1rem;
    margin-top: 0.2rem;
}

.mockup-disclaimer {
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.28);
    border-radius: var(--radius-sm);
    color: #fcd58d;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.4;
    margin: 0;
    overflow-wrap: anywhere;
    padding: 0.58rem 0.7rem;
}

.mockup-grid,
.mockup-insight-grid,
.landing-card-grid,
.pricing-grid,
.value-strip-grid,
.landing-steps,
.options-grid {
    display: grid;
    gap: 0.9rem;
}

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

.mockup-card,
.landing-card,
.pricing-card,
.landing-steps article,
.workflow-visual article,
.final-cta-panel {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
        var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18);
}

.mockup-card {
    display: grid;
    gap: 0.55rem;
    min-height: 7.2rem;
    min-width: 0;
    padding: 0.85rem;
}

.mockup-card-wide {
    grid-column: span 2;
}

.mockup-card strong {
    color: var(--text-strong);
    font-size: 1rem;
    line-height: 1.25;
}

.mock-chart {
    align-items: end;
    display: grid;
    gap: 0.35rem;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    min-height: 5.2rem;
}

.mock-chart span {
    background: linear-gradient(180deg, rgba(52, 211, 153, 0.82), rgba(56, 189, 248, 0.28));
    border-radius: 999px 999px 0 0;
}

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

.mockup-insight-grid .mockup-card:first-child {
    grid-row: auto;
}

.mockup-card ul,
.pricing-card ul {
    display: grid;
    gap: 0.45rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.mockup-card li {
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
    gap: 0.75rem;
    padding-bottom: 0.4rem;
}

.mockup-card li em {
    color: var(--green);
    font-style: normal;
    font-weight: 900;
}

.mockup-alert {
    border-color: rgba(245, 158, 11, 0.32);
}

.mockup-ai {
    border-color: rgba(56, 189, 248, 0.32);
}

.mockup-card p,
.mockup-card small,
.landing-card p,
.landing-card small,
.landing-section-heading p,
.pricing-card p,
.landing-steps p,
.options-grid p,
.final-cta-panel p,
.faq-list p,
.landing-footer p,
.landing-footer small {
    color: var(--muted-strong);
    line-height: 1.55;
    margin: 0;
}

.mockup-card small,
.landing-card small {
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 800;
    line-height: 1.45;
}

.landing-value-strip {
    border-bottom: 1px solid rgba(148, 163, 184, 0.14);
    border-top: 1px solid rgba(148, 163, 184, 0.14);
    background: rgba(15, 23, 34, 0.56);
    padding: 1rem 0;
}

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

.value-strip-grid span {
    color: var(--text-strong);
    font-size: 0.86rem;
    font-weight: 850;
}

.landing-section-heading {
    display: grid;
    gap: 0.75rem;
    margin-bottom: clamp(1.5rem, 4vw, 2.6rem);
    max-width: 760px;
}

.landing-section-heading h2,
.options-grid h2,
.final-cta-panel h2 {
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: 1.02;
    margin: 0;
}

.landing-card-grid-three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.landing-card-grid-six {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.landing-card-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.landing-card {
    display: grid;
    gap: 0.75rem;
    min-height: 12rem;
    padding: 1.1rem;
    position: relative;
}

.landing-card::before,
.landing-steps article::before,
.workflow-visual article::before {
    background: linear-gradient(180deg, var(--blue), var(--green));
    border-radius: 999px;
    content: "";
    height: calc(100% - 1.5rem);
    left: 0.55rem;
    opacity: 0.72;
    position: absolute;
    top: 0.75rem;
    width: 3px;
}

.landing-card h3,
.landing-steps h3,
.workflow-visual h3,
.pricing-card h3 {
    font-size: 1.05rem;
    font-weight: 900;
    margin: 0;
}

.workflow-visual {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    position: relative;
}

.workflow-visual::before {
    background: linear-gradient(90deg, rgba(56, 189, 248, 0.45), rgba(52, 211, 153, 0.45));
    content: "";
    height: 2px;
    left: 8%;
    position: absolute;
    right: 8%;
    top: 1.75rem;
}

.workflow-visual article {
    display: grid;
    gap: 0.65rem;
    min-height: 15rem;
    padding: 1.1rem 1.1rem 1.1rem 1.35rem;
    position: relative;
}

.workflow-step-number {
    align-items: center;
    background: linear-gradient(135deg, var(--blue), var(--green));
    border-radius: 999px;
    color: #031018;
    display: inline-flex;
    font-weight: 950;
    height: 2.2rem;
    justify-content: center;
    position: relative;
    width: 2.2rem;
    z-index: 1;
}

.workflow-visual p {
    color: var(--muted-strong);
    line-height: 1.55;
    margin: 0;
}

.workflow-visual strong {
    align-self: end;
    background: rgba(56, 189, 248, 0.1);
    border: 1px solid rgba(56, 189, 248, 0.22);
    border-radius: var(--radius-sm);
    color: var(--text-strong);
    font-size: 0.82rem;
    line-height: 1.3;
    padding: 0.65rem;
}

.beta-offer-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.beta-offer-card {
    min-height: 13rem;
}

.beta-offer-card strong {
    align-self: end;
    color: var(--green);
    font-size: 0.86rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.beta-offer-card-featured {
    border-color: rgba(52, 211, 153, 0.42);
    box-shadow: 0 24px 56px rgba(14, 165, 233, 0.14);
}

.beta-feedback-row {
    justify-content: center;
    margin-top: 1.25rem;
}

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

.landing-steps article {
    display: grid;
    gap: 0.6rem;
    min-height: 11rem;
    padding: 1.1rem 1.1rem 1.1rem 1.35rem;
    position: relative;
}

.landing-steps span {
    align-items: center;
    background: linear-gradient(135deg, var(--blue), var(--green));
    border-radius: 999px;
    color: #031018;
    display: inline-flex;
    font-weight: 950;
    height: 2.2rem;
    justify-content: center;
    width: 2.2rem;
}

.options-grid {
    align-items: center;
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
}

.options-grid > div:first-child {
    display: grid;
    gap: 1rem;
}

.options-example-panel {
    background: rgba(15, 23, 34, 0.72);
    border: 1px solid rgba(56, 189, 248, 0.22);
    border-radius: var(--radius);
    display: grid;
    gap: 0.65rem;
    padding: 1rem;
}

.options-example-panel > span {
    color: var(--green);
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.options-example-panel ul {
    display: grid;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.options-example-panel li {
    color: var(--muted-strong);
    font-size: 0.9rem;
    font-weight: 760;
    line-height: 1.45;
    padding-left: 1.1rem;
    position: relative;
}

.options-example-panel li::before {
    color: var(--green);
    content: "+";
    font-weight: 950;
    left: 0;
    position: absolute;
}

.pricing-grid {
    align-items: stretch;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    margin: 0 auto;
    max-width: 980px;
}

.pricing-card {
    display: grid;
    gap: 0.85rem;
    padding: clamp(1.2rem, 3vw, 1.6rem);
    position: relative;
}

.pricing-card-heading {
    align-items: center;
    display: flex;
    gap: 0.65rem;
    justify-content: space-between;
}

.pricing-card-heading span {
    background: rgba(148, 163, 184, 0.1);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    color: var(--muted-strong);
    font-size: 0.72rem;
    font-weight: 900;
    padding: 0.24rem 0.5rem;
    white-space: nowrap;
}

.pricing-card > strong {
    color: var(--text-strong);
    font-size: clamp(2.3rem, 5vw, 3.6rem);
    line-height: 0.96;
}

.pricing-card li {
    color: var(--muted-strong);
    font-weight: 750;
    padding-left: 1.35rem;
    position: relative;
}

.pricing-card li::before {
    color: var(--green);
    content: "+";
    font-weight: 950;
    left: 0;
    position: absolute;
}

.pricing-card-free {
    align-self: start;
    gap: 0.72rem;
    padding: clamp(1.05rem, 2.6vw, 1.35rem);
}

.pricing-card-free > strong {
    font-size: clamp(2.15rem, 4vw, 3rem);
}

.pricing-card-intro {
    max-width: 25rem;
}

.pricing-feature-list-compact {
    gap: 0.34rem !important;
    padding-top: 0.15rem !important;
}

.pricing-feature-list-compact li {
    font-size: 0.9rem;
    line-height: 1.35;
}

.pricing-free-footer {
    border-top: 1px solid rgba(148, 163, 184, 0.14);
    display: grid;
    gap: 0.45rem;
    margin-top: 0.15rem;
    padding-top: 0.85rem;
}

.pricing-free-button {
    justify-self: start;
    min-height: 38px;
    padding: 0.5rem 0.76rem;
}

.pricing-free-footer small {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 760;
    line-height: 1.4;
}

.pricing-card-pro {
    border-color: rgba(52, 211, 153, 0.42);
    box-shadow: 0 28px 70px rgba(14, 165, 233, 0.16);
    transform: translateY(-0.6rem);
}

.pricing-badge {
    background: rgba(52, 211, 153, 0.14);
    border: 1px solid rgba(52, 211, 153, 0.32);
    border-radius: 999px;
    color: var(--green);
    font-size: 0.72rem;
    font-weight: 950;
    justify-self: start;
    padding: 0.28rem 0.55rem;
    text-transform: uppercase;
}

.pricing-equivalent,
.pricing-trial,
.pricing-savings {
    color: var(--green);
}

.pricing-monthly {
    color: var(--muted) !important;
    font-size: 0.86rem;
}

.pricing-cta-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.pricing-cta-group .landing-button {
    min-height: 40px;
}

.annual-value-anchor {
    background:
        linear-gradient(135deg, rgba(52, 211, 153, 0.14), rgba(56, 189, 248, 0.08)),
        rgba(15, 23, 34, 0.72);
    border: 1px solid rgba(52, 211, 153, 0.28);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.35rem;
    padding: 0.85rem;
}

.annual-value-anchor strong {
    color: var(--green);
    font-size: 0.78rem;
    font-weight: 950;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.annual-value-anchor span {
    color: var(--text-strong);
    font-size: 0.9rem;
    font-weight: 820;
    line-height: 1.45;
}

.annual-value-anchor small {
    color: var(--muted);
    font-size: 0.75rem;
    font-weight: 760;
    line-height: 1.45;
}

.pricing-reassurance {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin: 1.25rem auto 0;
    max-width: 1120px;
}

.pricing-reassurance article {
    background: rgba(15, 23, 34, 0.68);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.35rem;
    padding: 0.85rem;
}

.pricing-reassurance strong {
    color: var(--text-strong);
    font-size: 0.84rem;
    font-weight: 900;
}

.pricing-reassurance span {
    color: var(--muted-strong);
    font-size: 0.78rem;
    font-weight: 720;
    line-height: 1.45;
}

.comparison-table-wrap {
    background: var(--theme-secondary-bg);
    border: 1px solid var(--theme-border-color);
    border-radius: var(--theme-border-radius);
    box-shadow: 0 1px 4px rgba(49, 58, 70, 0.08);
    overflow: hidden;
}

.comparison-table {
    color: var(--theme-body-color);
    table-layout: fixed;
    width: 100%;
}

.comparison-table th,
.comparison-table td {
    background: transparent;
    border-color: var(--theme-border-color);
    overflow-wrap: anywhere;
    padding: 1rem 1.25rem;
    vertical-align: middle;
}

.comparison-table thead th {
    background: rgba(49, 58, 70, 0.03);
    color: var(--theme-secondary-color);
    font-size: 0.69105rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    letter-spacing: 0;
    text-transform: uppercase;
}

.comparison-table td:first-child {
    color: var(--theme-heading-color);
    font-weight: var(--theme-font-weight-medium, 500);
}

.comparison-table td:last-child,
.comparison-table th:last-child {
    background: rgba(26, 179, 148, 0.06);
    color: var(--theme-heading-color);
    font-weight: var(--theme-font-weight-semibold, 600);
}

html[data-theme="dark"] .comparison-table thead th {
    background: rgba(255, 255, 255, 0.035);
}

html[data-theme="dark"] .comparison-table td:last-child,
html[data-theme="dark"] .comparison-table th:last-child {
    background: rgba(26, 179, 148, 0.11);
}

@media (max-width: 767.98px) {
    .comparison-table thead {
        display: none;
    }

    .comparison-table,
    .comparison-table tbody,
    .comparison-table tr,
    .comparison-table td {
        display: block;
        width: 100%;
    }

    .comparison-table tr {
        border-bottom: 1px solid var(--theme-border-color);
        padding: 0.65rem 0;
    }

    .comparison-table tr:last-child {
        border-bottom: 0;
    }

    .comparison-table td {
        border: 0;
        display: grid;
        gap: 0.75rem;
        grid-template-columns: minmax(7rem, 0.42fr) minmax(0, 0.58fr);
        padding: 0.45rem 1rem;
    }

    .comparison-table td::before {
        color: var(--theme-secondary-color);
        content: attr(data-label);
        font-size: 0.75rem;
        font-weight: var(--theme-font-weight-semibold, 600);
        text-transform: uppercase;
    }

    .comparison-table td:first-child {
        background: rgba(49, 58, 70, 0.03);
        grid-template-columns: 1fr;
        margin-bottom: 0.35rem;
        padding-bottom: 0.65rem;
        padding-top: 0.65rem;
    }

    .comparison-table td:first-child::before {
        content: "Capability";
    }
}

.trust-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.trust-grid article {
    background: var(--theme-secondary-bg);
    border: 1px solid var(--theme-border-color);
    border-radius: var(--theme-border-radius);
    box-shadow: 0 1px 4px rgba(49, 58, 70, 0.08);
    display: grid;
    gap: 0.7rem;
    min-height: 10.5rem;
    padding: 1.25rem;
}

.trust-grid strong {
    color: var(--theme-heading-color);
    font-size: 1.01625rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
}

.trust-grid span {
    color: var(--theme-secondary-color);
    font-size: 0.95rem;
    font-weight: var(--theme-body-font-weight);
    line-height: 1.5;
}

.final-cta {
    padding-bottom: clamp(3.5rem, 7vw, 6rem);
}

.final-cta-panel {
    display: grid;
    gap: 1rem;
    overflow: hidden;
    padding: clamp(1.5rem, 4vw, 2.6rem);
    position: relative;
    text-align: center;
}

.final-cta-panel::before {
    background: linear-gradient(90deg, rgba(56, 189, 248, 0.72), rgba(52, 211, 153, 0.64));
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.final-cta-panel .landing-cta-row {
    justify-content: center;
}

.final-risk-free-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    justify-content: center;
}

.final-risk-free-row span {
    background: rgba(15, 23, 34, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    color: var(--text-strong);
    font-size: 0.8rem;
    font-weight: 850;
    line-height: 1.2;
    padding: 0.42rem 0.68rem;
}

.faq-list {
    display: grid;
    gap: 0.8rem;
    max-width: 920px;
}

.faq-list details {
    padding: 1rem 1.1rem;
}

.faq-list summary {
    font-size: 1rem;
}

.faq-list p {
    margin-top: 0.65rem;
}

.landing-footer {
    background: rgba(5, 9, 20, 0.9);
    border-top: 1px solid rgba(148, 163, 184, 0.14);
    padding: 2rem 0;
}

.landing-footer-grid {
    gap: 1.5rem;
}

.landing-footer-grid > div {
    display: grid;
    gap: 0.6rem;
}

.landing-footer nav {
    display: flex;
    gap: 1rem;
}

html[data-theme="light"] .landing-page {
    background:
        radial-gradient(circle at 18% 0%, rgba(14, 165, 233, 0.16), transparent 28rem),
        radial-gradient(circle at 88% 14%, rgba(5, 150, 105, 0.1), transparent 24rem),
        linear-gradient(180deg, #f8fbff 0%, #eef4f9 44%, #e9eef5 100%);
}

html[data-theme="light"] .landing-section-muted {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.76), rgba(241, 245, 249, 0.72)),
        rgba(255, 255, 255, 0.58);
    border-bottom-color: rgba(15, 23, 42, 0.1);
    border-top-color: rgba(15, 23, 42, 0.1);
}

html[data-theme="light"] .landing-nav-wrap {
    background: rgba(248, 251, 255, 0.82);
    border-bottom-color: rgba(15, 23, 42, 0.12);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.1);
}

html[data-theme="light"] .dashboard-mockup,
html[data-theme="light"] .mockup-card,
html[data-theme="light"] .landing-card,
html[data-theme="light"] .pricing-card,
html[data-theme="light"] .workflow-visual article,
html[data-theme="light"] .final-cta-panel {
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.1);
}

html[data-theme="light"] .dashboard-mockup {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(241, 245, 249, 0.78)),
        rgba(255, 255, 255, 0.92);
    border-color: rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] .mockup-disclaimer {
    background: rgba(217, 119, 6, 0.1);
    border-color: rgba(217, 119, 6, 0.24);
    color: #92400e;
}

html[data-theme="light"] .landing-value-strip {
    background: rgba(255, 255, 255, 0.64);
    border-bottom-color: rgba(15, 23, 42, 0.1);
    border-top-color: rgba(15, 23, 42, 0.1);
}

html[data-theme="light"] .options-example-panel,
html[data-theme="light"] .pricing-reassurance article,
html[data-theme="light"] .trust-grid article,
html[data-theme="light"] .final-risk-free-row span {
    background: rgba(255, 255, 255, 0.74);
    border-color: rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] .annual-value-anchor {
    background:
        linear-gradient(135deg, rgba(5, 150, 105, 0.1), rgba(2, 132, 199, 0.08)),
        rgba(255, 255, 255, 0.76);
    border-color: rgba(5, 150, 105, 0.2);
}

html[data-theme="light"] .landing-footer {
    background: rgba(248, 251, 255, 0.9);
    border-top-color: rgba(15, 23, 42, 0.12);
}

.landing-policy-page {
    min-height: calc(100vh - 72px);
}

.landing-policy-shell {
    display: grid;
    gap: 1rem;
    max-width: 1120px;
}

.landing-policy-shell h1 {
    color: var(--theme-heading-color);
    font-size: calc(1.425rem + 2.1vw);
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.5;
    margin: 0;
    max-width: none;
}

.landing-policy-lede {
    color: var(--theme-secondary-color);
    font-size: 0.933rem;
    line-height: 1.75;
    margin: 0 0 1.25rem;
    max-width: 760px;
}

.landing-policy-card {
    background: var(--theme-secondary-bg);
    border: 1px solid var(--theme-border-color);
    border-radius: var(--theme-border-radius);
    box-shadow: 0 1px 4px rgba(49, 58, 70, 0.08);
    display: grid;
    gap: 0.75rem;
    margin-top: 0;
    padding: 1.5rem;
}

.landing-policy-card h2 {
    color: var(--theme-heading-color);
    font-size: 1.084rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
    margin: 0;
}

.landing-policy-card p {
    color: var(--theme-secondary-color);
    font-size: 0.933rem;
    line-height: 1.75;
    margin: 0;
}

.landing-policy-card .landing-button {
    margin-top: 1rem;
}

.landing-contact-grid {
    display: grid;
    gap: 1rem;
}

@media (max-width: 1040px) {
    .landing-hero-grid,
    .options-grid,
    .pricing-grid {
        grid-template-columns: 1fr;
    }

    .landing-hero h1 {
        max-width: 12ch;
    }

    .pricing-card-pro {
        transform: none;
    }

    .value-strip-grid,
    .landing-card-grid-six {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .workflow-visual::before {
        display: none;
    }

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

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

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

@media (max-width: 760px) {
    .landing-nav {
        align-items: center;
        display: grid;
        gap: 0.55rem 0.75rem;
        grid-template-columns: minmax(0, 1fr) auto;
        min-height: 0;
        padding-bottom: 0.55rem;
        padding-top: 0.55rem;
    }

    .landing-nav-links,
    .landing-nav-actions {
        width: auto;
    }

    .landing-nav-links {
        gap: 1rem;
        grid-column: 1 / -1;
        grid-row: 2;
        justify-content: flex-start;
    }

    .landing-nav-links a,
    .landing-link-button {
        font-size: 0.82rem;
    }

    .landing-nav-actions {
        gap: 0.5rem;
        grid-column: 2;
        grid-row: 1;
        justify-content: flex-end;
    }

    .landing-nav-actions .landing-link-button,
    .landing-nav-actions .landing-button {
        flex: 0 0 auto;
    }

    .landing-nav-actions .landing-button {
        min-height: 36px;
        padding: 0.45rem 0.68rem;
    }

    .landing-theme-toggle {
        min-height: 36px;
        padding: 0.42rem 0.58rem;
        width: auto;
    }

    .landing-theme-toggle [data-theme-toggle-label] {
        display: none;
    }

    .landing-hero {
        min-height: auto;
        padding-bottom: 2.25rem;
        padding-top: 2rem;
    }

    .landing-hero-grid {
        gap: 1.35rem;
    }

    .landing-hero-copy {
        gap: 0.8rem;
    }

    .landing-hero h1 {
        font-size: clamp(2.15rem, 9.5vw, 2.7rem);
        max-width: 12ch;
    }

    .landing-hero-subhead {
        font-size: 1rem;
        line-height: 1.45;
    }

    .landing-hero .landing-button-large {
        min-height: 42px;
        padding-bottom: 0.6rem;
        padding-top: 0.6rem;
    }

    .landing-cta-row,
    .final-cta-panel .landing-cta-row {
        align-items: stretch;
        flex-direction: column;
        gap: 0.55rem;
    }

    .landing-cta-row .button {
        width: 100%;
    }

    .mockup-grid,
    .mockup-insight-grid,
    .value-strip-grid,
    .landing-card-grid-three,
    .landing-card-grid-six,
    .landing-card-grid-two,
    .beta-offer-grid,
    .workflow-visual,
    .pricing-reassurance,
    .trust-grid,
    .landing-steps {
        grid-template-columns: 1fr;
    }

    .mockup-card-wide,
    .mockup-insight-grid .mockup-card:first-child {
        grid-column: auto;
        grid-row: auto;
    }

    .mockup-header {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .dashboard-mockup {
        gap: 0.65rem;
        padding: 0.78rem;
    }

    .mockup-disclaimer {
        font-size: 0.7rem;
        padding: 0.45rem 0.55rem;
    }

    .mockup-grid {
        gap: 0.55rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mockup-card {
        gap: 0.35rem;
        min-height: 4.9rem;
        padding: 0.62rem;
    }

    .mockup-card-wide {
        grid-column: 1 / -1;
    }

    .mock-chart {
        min-height: 3.2rem;
    }

    .mockup-insight-grid {
        gap: 0.55rem;
    }

    .mockup-insight-grid .mockup-card {
        min-height: 0;
    }

    .landing-footer-grid {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 480px) {
    .landing-container,
    .landing-nav {
        padding-left: 0.85rem;
        padding-right: 0.85rem;
    }

    .landing-nav-links {
        flex-wrap: wrap;
        gap: 0.7rem;
        justify-content: flex-start;
    }

    .landing-nav-actions {
        align-items: center;
        flex-direction: row;
    }

    .landing-nav-actions .landing-link-button {
        font-size: 0.78rem;
    }

    .landing-nav-actions .landing-button {
        font-size: 0.82rem;
    }

    .dashboard-mockup {
        border-left: 0;
        border-radius: 0;
        border-right: 0;
        margin-left: -0.85rem;
        margin-right: -0.85rem;
    }

    .performance-benchmark-grid {
        grid-template-columns: 1fr;
    }

    .landing-section {
        padding: 3.25rem 0;
    }

    .landing-hero.landing-section {
        padding: 1.45rem 0 1.8rem;
    }
}

/* Inspinia template integration */
:root,
html[data-theme="light"] {
    color-scheme: light;
    --body-bg: #f1f2f7;
    --header-bg: #ffffff;
    --bg: #f1f2f7;
    --bg-elevated: #ffffff;
    --panel: #ffffff;
    --panel-strong: #ffffff;
    --panel-soft: #f6f7fb;
    --line: #e7e9eb;
    --line-strong: #d7dde4;
    --text: #4c4c5c;
    --text-strong: #313a46;
    --muted: #8a969c;
    --muted-strong: #6c757d;
    --link: #1ab394;
    --field-bg: #ffffff;
    --table-head: #f6f7fb;
    --table-row-hover: rgba(26, 179, 148, 0.07);
    --detail-row-bg: #fbfbfd;
    --chart-panel: #ffffff;
    --chart-grid: rgba(138, 150, 156, 0.18);
    --chart-text: #8a969c;
    --chart-green-fill: rgba(26, 179, 148, 0.12);
    --blue: #1c84c6;
    --blue-strong: #1c84c6;
    --green: #1ab394;
    --red: #ed5565;
    --orange: #f8ac59;
    --shadow: 0 1px 4px rgba(130, 143, 163, 0.15);
    --radius: 0.4rem;
    --radius-sm: 0.3rem;
    --radius-lg: 1rem;
    --shadow-soft: 0 4px 16px rgba(76, 76, 92, 0.12);
}

html[data-theme="dark"] {
    color-scheme: dark;
    --body-bg: #17181e;
    --header-bg: #1e1f27;
    --bg: #17181e;
    --bg-elevated: #1e1f27;
    --panel: #1e1f27;
    --panel-strong: #22232c;
    --panel-soft: #272832;
    --line: #293036;
    --line-strong: #38414a;
    --text: #aab8c5;
    --text-strong: #e7e9eb;
    --muted: #8391a2;
    --muted-strong: #aab8c5;
    --link: #76d1bf;
    --field-bg: #22232c;
    --table-head: #22232c;
    --table-row-hover: rgba(118, 209, 191, 0.09);
    --detail-row-bg: #272832;
    --chart-panel: #1e1f27;
    --chart-grid: rgba(131, 145, 162, 0.18);
    --chart-text: #8391a2;
    --chart-green-fill: rgba(118, 209, 191, 0.12);
    --blue: #77b5dd;
    --blue-strong: #1c84c6;
    --green: #76d1bf;
    --red: #f499a3;
    --orange: #fbcd9b;
    --shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

body {
    background: var(--body-bg);
    color: var(--text);
    font-family: "Open Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 0.875rem;
}

.trader-setups-app main,
.trader-content {
    padding-bottom: 1.5rem;
    padding-top: 1.25rem;
}

.trader-brand,
.trader-side-logo .logo-lg,
.trader-side-logo .logo-sm {
    align-items: center;
    color: var(--text-strong);
    display: inline-flex;
    font-weight: 800;
    gap: 0.65rem;
    text-decoration: none;
    white-space: nowrap;
}

.trader-brand:hover {
    color: var(--text-strong);
}

.trader-brand-logo,
.trader-brand-logo-sm {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: var(--theme-border-radius);
    box-shadow: 0 1px 4px rgba(49, 58, 70, 0.16);
    display: block;
    object-fit: contain;
}

.trader-brand-logo {
    height: 3.35rem;
    width: auto;
}

.trader-brand-logo-sidebar {
    height: 3.55rem;
}

.trader-brand-logo-footer {
    height: 4.25rem;
}

.trader-brand-logo-sm {
    height: 2.65rem;
    width: 2.65rem;
}

html[data-theme="dark"] .trader-brand-logo,
html[data-theme="dark"] .trader-brand-logo-sm,
html[data-bs-theme="dark"] .trader-brand-logo,
html[data-bs-theme="dark"] .trader-brand-logo-sm {
    border-color: rgba(255, 255, 255, 0.22);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

.trader-brand-mark {
    align-items: center;
    background: linear-gradient(135deg, #1ab394, #1c84c6);
    border-radius: 0.35rem;
    box-shadow: 0 8px 20px rgba(26, 179, 148, 0.2);
    color: #ffffff;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 900;
    height: 2rem;
    justify-content: center;
    letter-spacing: 0;
    width: 2rem;
}

.trader-brand-text {
    color: inherit;
    font-size: 1rem;
    letter-spacing: 0;
}

.trader-sidenav .logo {
    padding-inline: 1.15rem;
}

.trader-sidenav .logo-sm .trader-brand-mark {
    height: 1.85rem;
    width: 1.85rem;
}

.trader-sidenav-scroll {
    height: calc(100% - var(--theme-topbar-height));
    overflow-x: hidden;
    overflow-y: auto;
    padding-bottom: 1rem;
    padding-inline-end: 0.35rem;
    scrollbar-width: none;
}

.trader-sidenav-scroll::-webkit-scrollbar {
    height: 0;
    width: 0;
}

.trader-sidenav-scrollbar {
    --sidenav-thumb-height: 2rem;
    --sidenav-thumb-top: 0px;
    background: transparent;
    bottom: 0.75rem;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 0.18rem;
    top: calc(var(--theme-topbar-height) + 0.2rem);
    transition: opacity 130ms ease;
    width: 0.45rem;
    z-index: 3;
}

.trader-sidenav-scrollbar::before {
    background: rgba(155, 166, 183, 0.68);
    border-radius: 999px;
    content: "";
    height: var(--sidenav-thumb-height);
    left: 0;
    position: absolute;
    top: var(--sidenav-thumb-top);
    transition:
        background-color 160ms ease,
        height 120ms ease,
        top 120ms ease;
    width: 100%;
}

.trader-sidenav-scrollbar.is-visible {
    opacity: 1;
}

.trader-sidenav-scrollbar.is-hovered::before {
    background: rgba(170, 184, 197, 0.92);
}

.trader-sidenav-user {
    background:
        linear-gradient(135deg, rgba(26, 179, 148, 0.14), rgba(28, 132, 198, 0.1)),
        var(--panel-soft);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--radius);
    margin: 0.75rem;
    padding: 0.85rem;
}

.trader-user-avatar {
    align-items: center;
    background: rgba(26, 179, 148, 0.16);
    color: var(--green);
    display: inline-flex;
    flex: 0 0 auto;
    justify-content: center;
}

.side-nav .side-nav-item .side-nav-link.active,
.side-nav .side-nav-item .side-nav-link.active:hover,
.admin-support-link.active {
    background: rgba(26, 179, 148, 0.14);
    color: #ffffff;
}

html[data-menu-color="light"] .side-nav .side-nav-item .side-nav-link.active,
html[data-bs-theme="light"] .side-nav .side-nav-item .side-nav-link.active {
    color: #1ab394;
}

.trader-content-page {
    min-height: 100vh;
}

.trader-content {
    margin-inline: auto;
    max-width: 1760px;
    padding-inline: clamp(1rem, 1.35vw, 2rem);
    width: 100%;
}

/* Dashboard readability pass: use the wider app shell and avoid tiny analytics text. */
.dashboard-shell-header {
    gap: 1.5rem;
    margin-bottom: 1.25rem;
}

.dashboard-shell-header p {
    color: var(--muted-strong);
    font-size: 1rem;
    line-height: 1.6;
    max-width: 960px;
}

.dashboard-module-nav {
    gap: 0.9rem;
}

.dashboard-module-link {
    gap: 0.45rem;
    min-height: 6.35rem;
    padding: 1rem;
}

.dashboard-module-link strong {
    font-size: 1rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.35;
}

.dashboard-module-link span {
    color: var(--muted-strong);
    font-size: 0.92rem;
    line-height: 1.45;
}

.dashboard-filter-panel {
    padding: 1.25rem;
}

.dashboard-filter-grid {
    gap: 1rem;
    grid-template-columns: repeat(6, minmax(9.5rem, 1fr));
}

.dashboard-filter-grid label {
    color: var(--muted-strong);
    font-size: 0.95rem;
    font-weight: var(--theme-font-weight-medium, 500);
    line-height: 1.45;
}

.dashboard-filter-grid input,
.dashboard-filter-grid select {
    font-size: 1rem;
    min-height: 2.55rem;
}

.dashboard-filter-actions {
    gap: 0.75rem;
}

.dashboard-filter-actions button,
.dashboard-filter-actions .button {
    min-height: 2.55rem;
}

.dashboard-widget-card,
.dashboard-chart,
.dashboard-filter-panel,
.summary-kpi-card {
    padding: 1.15rem;
}

.dashboard-widget-header h2,
.trader-dashboard-page .section-heading h2 {
    font-size: 1.25rem;
    line-height: 1.35;
}

.dashboard-widget-header p,
.trader-dashboard-page .section-heading p {
    color: var(--muted-strong);
    font-size: 0.98rem;
    line-height: 1.55;
}

.summary-kpi-grid {
    gap: 1rem;
}

.summary-kpi-card {
    gap: 0.7rem;
    min-height: 10.25rem;
}

.summary-kpi-card-header span:first-child,
.summary-highlight-card span,
.summary-period-strip span,
.summary-driver-grid span,
.summary-insight-body span,
.summary-equity-stats span {
    font-size: 0.84rem;
    letter-spacing: 0.04em;
}

.summary-kpi-card strong {
    font-size: clamp(1.35rem, 1.6vw, 1.8rem);
}

.summary-kpi-card small,
.trend-pill,
.recent-trade-link small,
.summary-driver-grid em,
.summary-insight-body em {
    font-size: 0.85rem;
    line-height: 1.45;
}

.summary-main-grid,
.summary-primary-grid,
.summary-secondary-grid,
.summary-support-grid,
.dashboard-widget-grid {
    gap: 1.25rem;
}

.summary-equity-stats {
    gap: 0.9rem;
}

.summary-equity-stats > div,
.summary-driver-grid > div,
.summary-insight-body > div {
    padding: 0.9rem;
}

.compact-feed-item strong,
.summary-driver-grid strong,
.summary-insight-body strong {
    font-size: 1rem;
}

.compact-feed-item em {
    color: var(--muted-strong);
    font-size: 0.9rem;
    line-height: 1.45;
}

.dashboard-widget-empty {
    font-size: 0.98rem;
    line-height: 1.55;
}

.trader-footer .container-fluid {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.btn,
button.btn,
a.btn {
    border-radius: var(--theme-border-radius);
    box-shadow: none;
    font-weight: 700;
    min-height: auto;
    transform: none;
}

.btn:hover,
button.btn:hover,
a.btn:hover {
    box-shadow: none;
    transform: none;
}

button:not(.btn):not(.navbar-toggler):not(.btn-close):not(.button-on-hover):not(.button-close-offcanvas):not(.topbar-link),
.button {
    background: var(--theme-primary);
    border-color: var(--theme-primary);
    border-radius: var(--theme-border-radius);
    box-shadow: none;
}

button:not(.btn):not(.navbar-toggler):not(.btn-close):not(.button-on-hover):not(.button-close-offcanvas):not(.topbar-link):hover,
.button:hover {
    background: #16987e;
    border-color: #16987e;
    box-shadow: none;
}

/* Keep import review row actions distinct after template button styles load. */
.trader-setups-app .import-review-panel .import-row-actions .compact-danger-action {
    background: var(--red) !important;
    border-color: var(--red) !important;
    color: #ffffff !important;
}

.trader-setups-app .import-review-panel .import-row-actions .compact-danger-action:hover,
.trader-setups-app .import-review-panel .import-row-actions .compact-danger-action:focus {
    background: #ec4758 !important;
    border-color: #ec4758 !important;
    color: #ffffff !important;
}

.trader-setups-app .import-review-panel .import-row-actions .match-toggle {
    font-size: 0 !important;
}

.trader-setups-app .import-review-panel .import-row-actions .match-toggle::before {
    content: attr(data-collapsed-label) !important;
    font-size: 0.86rem !important;
}

.trader-setups-app .import-review-panel .import-row-actions .match-toggle[aria-expanded="true"]::before {
    content: attr(data-expanded-label) !important;
}

.trader-setups-app .trade-rollups-panel .expand-toggle {
    font-size: 0 !important;
}

.trader-setups-app .trade-rollups-panel .expand-toggle::before {
    content: "+" !important;
    font-size: 0.82rem !important;
}

.trader-setups-app .trade-rollups-panel .expand-toggle[aria-expanded="true"]::before {
    content: "-" !important;
}

.trader-setups-app .trade-rollups-panel .compact-danger-action {
    background: var(--red) !important;
    border-color: var(--red) !important;
    color: #ffffff !important;
}

.trader-setups-app .trade-rollups-panel .compact-danger-action:hover,
.trader-setups-app .trade-rollups-panel .compact-danger-action:focus {
    background: #ec4758 !important;
    border-color: #ec4758 !important;
    color: #ffffff !important;
}

.trader-setups-app .trade-rollups-actions {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    flex-wrap: wrap;
    gap: 0.55rem;
    padding: 0.65rem;
}

.trader-setups-app .trade-rollups-selection-count {
    background: var(--panel);
    border-color: var(--line);
    color: var(--theme-secondary-color);
    min-height: 2.25rem;
    padding: 0.52rem 0.75rem;
}

.trader-setups-app .trade-rollups-actions button {
    font-size: 0.9rem;
    min-height: 2.35rem;
    padding-left: 0.9rem;
    padding-right: 0.9rem;
    white-space: nowrap;
}

/* Missing close workbench uses template-style cards instead of primary button blocks. */
.trader-setups-app .missing-close-workbench {
    gap: 1.15rem;
    padding: 1.15rem;
}

.trader-setups-app .missing-close-workbench-layout {
    gap: 1.15rem;
    grid-template-columns: minmax(27rem, 0.44fr) minmax(0, 1fr);
}

.trader-setups-app .workbench-proposal-list {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    gap: 0.75rem;
    max-height: 31rem;
    overflow: auto;
    padding: 0.8rem;
}

.trader-setups-app .missing-close-workbench .workbench-proposal {
    align-items: stretch;
    background: var(--panel) !important;
    border: 1px solid var(--line) !important;
    border-left: 4px solid transparent !important;
    border-radius: var(--radius-sm);
    box-shadow: 0 1px 4px rgba(49, 58, 70, 0.06);
    color: var(--text) !important;
    cursor: pointer;
    display: grid !important;
    font-family: var(--theme-body-font-family), "Open Sans", system-ui, sans-serif;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr);
    justify-items: stretch;
    min-width: 0;
    padding: 0.95rem 1rem;
    white-space: normal;
    width: 100%;
}

.trader-setups-app .missing-close-workbench .workbench-proposal:hover,
.trader-setups-app .missing-close-workbench .workbench-proposal:focus,
.trader-setups-app .missing-close-workbench .workbench-proposal.is-active {
    background: var(--panel) !important;
    border-color: var(--line) !important;
    border-left-color: var(--theme-primary) !important;
    box-shadow: 0 1px 8px rgba(49, 58, 70, 0.1);
    color: var(--text-strong) !important;
}

.trader-setups-app .missing-close-workbench .workbench-proposal:focus-visible {
    outline: 2px solid rgba(45, 212, 191, 0.55);
    outline-offset: 2px;
}

.trader-setups-app .workbench-trade-summary {
    border-bottom: 1px solid var(--line);
    min-width: 0;
    padding-bottom: 0.65rem;
    width: 100%;
}

.trader-setups-app .workbench-trade-kicker {
    color: var(--theme-secondary-color);
    font-size: 0.78rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    letter-spacing: 0;
}

.trader-setups-app .workbench-proposal strong {
    color: var(--theme-heading-color);
    font-size: 1rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.trader-setups-app .workbench-proposal small {
    color: var(--theme-secondary-color);
    font-size: 0.9rem;
    font-weight: var(--theme-body-font-weight);
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.trader-setups-app .workbench-missing-summary {
    background: rgba(245, 158, 11, 0.06);
    border: 1px solid rgba(245, 158, 11, 0.2);
    border-radius: var(--theme-border-radius);
    gap: 0.3rem;
    min-width: 0;
    padding: 0.7rem;
    width: 100%;
}

.trader-setups-app .workbench-missing-hint {
    color: var(--theme-body-color);
    font-size: 0.9rem;
    font-weight: var(--theme-body-font-weight);
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.trader-setups-app .workbench-missing-more {
    color: var(--orange);
    font-size: 0.86rem;
    font-weight: var(--theme-font-weight-semibold, 600);
}

.trader-setups-app .workbench-proposal-meta {
    gap: 0.45rem;
    min-width: 0;
    width: 100%;
}

.trader-setups-app .workbench-proposal-meta .status-chip {
    min-width: 6rem;
    white-space: normal;
}

.trader-setups-app .workbench-candidate-stage {
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    min-height: 31rem;
    padding: 1rem;
}

.trader-setups-app .workbench-candidate-panel {
    gap: 1rem;
}

.trader-setups-app .workbench-candidate-heading {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    padding: 1rem;
}

.trader-setups-app .workbench-candidate-heading h3 {
    color: var(--theme-heading-color);
    font-size: 1.2rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.4;
}

.trader-setups-app .workbench-candidate-heading p {
    color: var(--theme-secondary-color);
    font-size: 0.95rem;
    line-height: 1.6;
}

.trader-setups-app .workbench-heading-actions a {
    color: var(--theme-primary);
    font-size: 0.9rem;
    font-weight: var(--theme-font-weight-semibold, 600);
}

.trader-setups-app .workbench-empty {
    background: var(--panel);
    border: 1px dashed var(--line-strong);
    color: var(--theme-secondary-color);
    font-size: 0.95rem;
    line-height: 1.6;
    padding: 1rem;
}

.trader-setups-app .missing-close-workbench .candidate-card {
    background: var(--panel);
    border-color: var(--line);
    box-shadow: 0 1px 4px rgba(49, 58, 70, 0.06);
}

.trader-setups-app .missing-close-workbench .broker-fills-table th,
.trader-setups-app .missing-close-workbench .broker-fills-table td {
    font-size: 0.9rem;
    line-height: 1.45;
}

.trader-setups-app .import-review-panel .section-heading-actions {
    align-items: flex-start;
}

.trader-setups-app .proposed-trades-actions {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    flex-wrap: wrap;
    gap: 0.55rem;
    padding: 0.65rem;
}

.trader-setups-app .proposed-trades-selection-count {
    background: var(--panel);
    border-color: var(--line);
    color: var(--theme-secondary-color);
    min-height: 2.25rem;
    padding: 0.52rem 0.75rem;
}

.trader-setups-app .proposed-trades-actions button {
    font-size: 0.9rem;
    min-height: 2.35rem;
    padding-left: 0.9rem;
    padding-right: 0.9rem;
    white-space: nowrap;
}

.trader-setups-app .proposed-trades-actions .danger-button {
    background: var(--red) !important;
    border-color: var(--red) !important;
    color: #ffffff !important;
}

.trader-setups-app .proposed-trades-actions .danger-button:hover,
.trader-setups-app .proposed-trades-actions .danger-button:focus {
    background: #ec4758 !important;
    border-color: #ec4758 !important;
    color: #ffffff !important;
}

@media (max-width: 900px) {
    .trader-setups-app .missing-close-workbench-layout {
        grid-template-columns: 1fr;
    }

    .trader-setups-app .workbench-proposal-list {
        max-height: none;
        overflow: visible;
    }

    .trader-setups-app .workbench-candidate-stage {
        min-height: 0;
    }

    .trader-setups-app .import-review-panel .section-heading-actions {
        align-items: stretch;
    }

    .trader-setups-app .proposed-trades-actions {
        justify-content: flex-start;
    }
}

.secondary,
.button.secondary {
    background: var(--panel-soft);
    border-color: var(--line);
    color: var(--text-strong);
}

.panel,
.landing-card,
.landing-policy-card,
.pricing-card,
.dashboard-mockup,
.mockup-card,
.workflow-visual article,
.options-example-panel,
.table-scroll,
.auth-panel {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.toolbar {
    background: transparent;
    border: 0;
    box-shadow: none;
}

input,
select,
textarea,
.form-control,
.form-select {
    background: var(--field-bg);
    border-color: var(--line);
    border-radius: var(--theme-border-radius);
    color: var(--text);
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus {
    border-color: rgba(26, 179, 148, 0.7);
    box-shadow: 0 0 0 0.18rem rgba(26, 179, 148, 0.16);
}

th {
    background: var(--table-head);
}

.dt-container .dt-paging .dt-paging-button.current,
.dt-container .dt-paging .dt-paging-button.current:hover {
    background-color: var(--theme-primary, #1ab394) !important;
    background-image: none !important;
    border-color: var(--theme-primary, #1ab394) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.dt-container .dt-paging button.dt-paging-button.current,
.dt-container .dt-paging button.dt-paging-button[aria-current="page"],
.dt-container .dt-paging button.dt-paging-button.current:hover,
.dt-container .dt-paging button.dt-paging-button[aria-current="page"]:hover,
.dt-container .dt-paging button.dt-paging-button.current:focus,
.dt-container .dt-paging button.dt-paging-button[aria-current="page"]:focus {
    background-color: var(--theme-primary, #1ab394) !important;
    background-image: none !important;
    border-color: var(--theme-primary, #1ab394) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.landing-page {
    background:
        radial-gradient(circle at 50% 0, rgba(26, 179, 148, 0.14), transparent 28rem),
        var(--body-bg);
}

.landing-nav-wrap,
.trader-public-nav {
    background: #ffffff;
    border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow);
    backdrop-filter: none;
}

.trader-public-nav .container {
    gap: 1rem;
}

.public-navbar-content {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    gap: 1rem;
    justify-content: space-between;
    min-width: 0;
}

.public-navbar-links {
    align-items: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 auto;
}

.public-navbar-actions {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 0.5rem;
}

html[data-theme="dark"] .landing-nav-wrap,
html[data-theme="dark"] .trader-public-nav {
    background: #1e1f27;
}

.landing-brand {
    color: var(--text-strong);
}

.landing-eyebrow {
    color: var(--green);
}

.landing-hero {
    background:
        linear-gradient(180deg, rgba(26, 179, 148, 0.08), transparent),
        var(--body-bg);
}

.landing-hero::before {
    background-image: url("../vendor/inspinia/images/bg-pattern.png");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 540px auto;
    content: "";
    inset: 5rem 0 auto;
    opacity: 0.28;
    pointer-events: none;
    position: absolute;
    height: 16rem;
}

.landing-page {
    font-family: var(--theme-body-font-family);
    font-size: 13.008px;
    font-weight: var(--theme-body-font-weight);
    line-height: var(--theme-body-line-height);
}

.landing-page h1,
.landing-page h2,
.landing-page h3,
.landing-page h4,
.landing-page h5,
.landing-page h6,
.landing-page button,
.landing-page input,
.landing-page select,
.landing-page textarea {
    font-family: var(--theme-body-font-family);
}

.landing-page h1,
.landing-page h2,
.landing-page h3,
.landing-page h4,
.landing-page h5,
.landing-page h6 {
    color: var(--theme-heading-color);
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
    margin-bottom: 0.5rem;
}

.landing-nav-links a,
.landing-link-button,
.landing-footer a,
.landing-audience-cue,
.landing-microcopy,
.value-strip-grid span,
.landing-card h3,
.landing-steps h3,
.workflow-visual h3,
.pricing-card h3,
.pricing-card li,
.workflow-visual strong,
.options-example-panel li,
.mockup-card li em,
.mockup-disclaimer,
.pricing-card-heading span,
.pricing-badge,
.pricing-equivalent,
.pricing-trial,
.pricing-savings {
    font-weight: var(--theme-font-weight-medium, 500);
}

.landing-eyebrow,
.options-example-panel > span,
.mockup-header span,
.mockup-card span {
    font-size: 0.69105rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    letter-spacing: 0;
}

.landing-section-heading h2,
.options-grid h2,
.final-cta-panel h2 {
    font-size: calc(1.2941rem + 0.52925vw);
    line-height: 1.5;
}

@media (min-width: 1200px) {
    .landing-section-heading h2,
    .options-grid h2,
    .final-cta-panel h2 {
        font-size: 1.69104rem;
    }
}

.landing-card h3,
.landing-steps h3,
.workflow-visual h3,
.pricing-card h3,
.mockup-card strong,
.mockup-header strong {
    font-size: 1.01625rem;
    line-height: 1.5;
}

.landing-card p,
.landing-card small,
.landing-section-heading p,
.pricing-card p,
.landing-steps p,
.options-grid p,
.final-cta-panel p,
.faq-list p,
.landing-footer p,
.landing-footer small,
.workflow-visual p,
.mockup-card p,
.mockup-card small {
    font-size: var(--theme-body-font-size);
    line-height: var(--theme-body-line-height);
}

.landing-theme-toggle.btn-icon {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--theme-body-color) !important;
    flex: 0 0 auto;
    height: 2.25rem;
    min-height: 2.25rem;
    padding: 0;
    width: 2.25rem;
}

.landing-theme-toggle.btn-icon:hover,
.landing-theme-toggle.btn-icon:focus {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--theme-body-color) !important;
}

@media (min-width: 1041px) {
    .landing-page .landing-hero {
        align-items: center;
        display: grid;
    }
}

.landing-hero-grid {
    column-gap: clamp(3rem, 5.5vw, 5.5rem);
    grid-template-columns: minmax(0, 0.86fr) minmax(420px, 1.14fr);
}

.landing-hero-copy {
    min-width: 0;
    position: relative;
    z-index: 1;
}

.landing-hero h1 {
    font-size: calc(1.425rem + 2.1vw);
    font-weight: 300;
    line-height: 1.18;
    max-width: 18ch;
    overflow-wrap: normal;
    word-break: normal;
}

@media (min-width: 1200px) {
    .landing-hero h1 {
        font-size: 3rem;
    }
}

.landing-hero-subhead {
    font-size: 1.01625rem;
    line-height: var(--theme-body-line-height);
}

.landing-hero-subhead,
.landing-audience-cue,
.trial-unlock-row {
    max-width: 35rem;
}

.landing-section-muted {
    background: #f1f2f7;
}

html[data-theme="dark"] .landing-section-muted {
    background: var(--theme-body-bg);
}

.landing-card-grid {
    gap: 1.25rem;
}

.landing-card-grid-six {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.landing-card {
    background: var(--theme-secondary-bg);
    border: 0;
    border-radius: var(--theme-border-radius);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 16rem;
    padding: 2rem;
    position: relative;
}

.landing-card::before {
    align-items: center;
    background: var(--theme-secondary);
    border-radius: 50%;
    color: #ffffff;
    content: "\2192";
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.25rem;
    height: 3rem;
    justify-content: center;
    margin-bottom: 1.6rem;
    position: static;
    width: 3rem;
}

.landing-card h3 {
    color: var(--theme-heading-color);
    font-size: 1rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
    margin: 0 0 0.75rem;
}

.landing-card p,
.landing-card small {
    color: var(--theme-secondary-color);
    font-size: 0.813rem;
    line-height: 1.5;
}

html[data-theme="dark"] .landing-card {
    background: var(--theme-secondary-bg);
    border: 1px solid var(--theme-border-color);
}

.dashboard-mockup {
    justify-self: end;
    max-width: 38rem;
    min-width: 0;
}

@media (min-width: 1400px) {
    .landing-container {
        max-width: 1260px;
    }
}

@media (max-width: 1180px) {
    .landing-hero-grid {
        grid-template-columns: minmax(0, 0.92fr) minmax(380px, 1.08fr);
    }

    .landing-hero h1 {
        font-size: clamp(3rem, 5.3vw, 4.75rem);
    }
}

@media (max-width: 1040px) {
    .landing-hero-grid {
        grid-template-columns: 1fr;
    }

    .landing-hero h1,
    .landing-hero-subhead,
    .landing-audience-cue,
    .trial-unlock-row {
        max-width: 42rem;
    }

    .dashboard-mockup {
        justify-self: stretch;
        max-width: none;
    }
}

@media (max-width: 760px) {
    .landing-theme-toggle.btn-icon {
        height: 2rem;
        min-height: 2rem;
        width: 2rem;
    }
}

.landing-section-muted,
.landing-value-strip {
    background: var(--panel-soft);
}

.pricing-card-pro {
    border-color: rgba(26, 179, 148, 0.42);
}

.pricing-badge,
.pricing-equivalent,
.pricing-trial,
.pricing-savings,
.pnl-positive {
    color: var(--green);
}

.pnl-negative {
    color: var(--red);
}

.auth-panel {
    margin: clamp(2rem, 6vw, 5rem) auto;
    max-width: 28rem;
    padding: clamp(1.25rem, 4vw, 2rem);
}

.auth-panel h1 {
    font-size: 1.75rem;
}

.auth-panel form {
    display: grid;
    gap: 0.35rem;
}

.admin-user-search,
.admin-subscription-form,
.admin-trade-removal-form {
    align-items: end;
    grid-template-columns: minmax(16rem, 1fr) minmax(8rem, 12rem) auto;
}

.admin-danger-zone-panel {
    border-color: rgba(251, 113, 133, 0.28);
    margin-top: 1rem;
}

.admin-user-detail-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.1fr) minmax(18rem, 0.9fr);
    margin-bottom: 1rem;
}

.admin-role-form {
    display: grid;
    gap: 0.65rem;
}

.check-row {
    align-items: center;
    background: var(--panel-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--text);
    display: flex;
    gap: 0.65rem;
    margin: 0;
    padding: 0.65rem 0.75rem;
}

.check-row input {
    margin: 0;
    min-height: 1rem;
    width: auto;
}

.pager-bar {
    align-items: center;
    color: var(--muted);
    display: flex;
    font-size: 0.85rem;
    font-weight: 750;
    justify-content: space-between;
    margin-top: 1rem;
}

.danger-status {
    background: rgba(251, 113, 133, 0.12);
    border-color: rgba(251, 113, 133, 0.28);
    color: var(--red);
}

@media (max-width: 900px) {
    .admin-user-search,
    .admin-subscription-form,
    .admin-trade-removal-form,
    .admin-user-detail-grid {
        grid-template-columns: 1fr;
    }

    .pager-bar {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.75rem;
    }
}

@media (max-width: 991.98px) {
    .trader-public-nav .trader-brand-text {
        font-size: 0.95rem;
    }

    .public-navbar-content {
        flex-basis: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .public-navbar-links {
        justify-content: flex-start;
        margin: 0;
    }
}

@media (max-width: 575.98px) {
    .trader-footer .container-fluid {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.35rem;
    }

    .trader-brand-text {
        font-size: 0.9rem;
    }
}

/* Landing blocks matched to the Inspinia template card pattern. */
.landing-page .landing-section-muted {
    background: #f1f2f7;
}

html[data-theme="light"] body.landing-page .landing-section-muted {
    background: #f1f2f7;
}

html[data-theme="dark"] .landing-page .landing-section-muted {
    background: var(--theme-body-bg);
}

.landing-page .landing-card-grid {
    gap: 1.25rem;
}

.landing-page .landing-card-grid-six {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.landing-page .landing-card {
    background: var(--theme-secondary-bg);
    border: 0;
    border-radius: var(--theme-border-radius);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 16rem;
    padding: 2rem;
    position: relative;
}

html[data-theme="light"] body.landing-page .landing-card {
    background: #ffffff;
    border: 0;
    box-shadow: none;
}

.landing-page .landing-card::before {
    align-items: center;
    background: var(--theme-secondary);
    border-radius: 50%;
    color: #ffffff;
    content: "\f3a3";
    display: inline-flex;
    flex: 0 0 auto;
    font-family: "tabler-icons";
    font-size: 1.25rem;
    font-weight: 400;
    height: 3rem;
    justify-content: center;
    line-height: 1;
    margin-bottom: 1.6rem;
    opacity: 1;
    position: static;
    width: 3rem;
}

.landing-page .landing-card:nth-child(1)::before {
    content: "\ea51";
}

.landing-page .landing-card:nth-child(2)::before {
    content: "\ea59";
}

.landing-page .landing-card:nth-child(3)::before {
    content: "\eb24";
}

.landing-page .landing-card:nth-child(4)::before {
    content: "\eb54";
}

.landing-page .landing-card:nth-child(5)::before {
    content: "\eae5";
}

.landing-page .landing-card:nth-child(6)::before {
    content: "\f59f";
}

.landing-page .landing-card::after {
    content: none;
}

.landing-page .landing-card h3 {
    color: var(--theme-heading-color);
    font-size: 1rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
    margin: 0 0 0.75rem;
}

.landing-page .landing-card p,
.landing-page .landing-card small {
    color: var(--theme-secondary-color);
    font-size: 0.813rem;
    line-height: 1.5;
}

html[data-theme="dark"] .landing-page .landing-card {
    background: var(--theme-secondary-bg);
    border: 1px solid var(--theme-border-color);
}

@media (max-width: 1199.98px) {
    .landing-page .landing-card-grid-six {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .landing-page .landing-card-grid-six {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .landing-page .landing-card-grid-six,
    .landing-page .landing-card-grid-three,
    .landing-page .landing-card-grid-two {
        grid-template-columns: 1fr;
    }
}

/* Landing value band matched to the Inspinia block system. */
.landing-page .landing-value-strip {
    background: #f1f2f7;
    border-bottom: 1px solid var(--theme-border-color);
    border-top: 1px solid var(--theme-border-color);
    padding: 1.75rem 0;
}

html[data-theme="light"] body.landing-page .landing-value-strip {
    background: #f1f2f7;
}

.landing-page .value-strip-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.landing-page .value-strip-grid article {
    align-items: flex-start;
    background: var(--theme-secondary-bg);
    border: 0;
    border-radius: var(--theme-border-radius);
    box-shadow: none;
    display: flex;
    gap: 1rem;
    min-height: 8rem;
    padding: 1.25rem;
}

.landing-page .value-strip-grid article > span {
    align-items: center;
    background: var(--theme-secondary);
    border-radius: 50%;
    color: #ffffff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.1rem;
    height: 2.75rem;
    justify-content: center;
    width: 2.75rem;
}

.landing-page .value-strip-grid article > div {
    display: grid;
    gap: 0.35rem;
}

.landing-page .value-strip-grid strong {
    color: var(--theme-heading-color);
    display: block;
    font-size: 1rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
}

.landing-page .value-strip-grid small {
    color: var(--theme-secondary-color);
    display: block;
    font-size: 0.813rem;
    line-height: 1.5;
}

html[data-theme="dark"] .landing-page .landing-value-strip {
    background: var(--theme-body-bg);
}

html[data-theme="dark"] .landing-page .value-strip-grid article {
    background: var(--theme-secondary-bg);
    border: 1px solid var(--theme-border-color);
}

@media (max-width: 1199.98px) {
    .landing-page .value-strip-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .landing-page .value-strip-grid {
        grid-template-columns: 1fr;
    }
}

/* Landing typography aligned with the Inspinia landing page scale. */
.landing-page .landing-section-heading p,
.landing-page .landing-hero-subhead,
.landing-page .landing-card p,
.landing-page .landing-card small,
.landing-page .landing-steps p,
.landing-page .workflow-visual p,
.landing-page .options-grid p,
.landing-page .options-example-panel li,
.landing-page .mockup-card p,
.landing-page .mockup-card small,
.landing-page .pricing-card p,
.landing-page .pricing-card li,
.landing-page .pricing-reassurance span,
.landing-page .comparison-table td,
.landing-page .trust-grid span,
.landing-page .faq-list p,
.landing-page .final-cta-panel p,
.landing-page .landing-footer p,
.landing-page .landing-footer small {
    color: var(--theme-secondary-color);
    font-size: 0.933rem;
    font-weight: var(--theme-body-font-weight);
    line-height: 1.75;
}

.landing-page .landing-section-heading {
    gap: 1rem;
}

.landing-page .landing-section-heading-wide {
    max-width: 980px;
}

.landing-page .landing-section-heading h2,
.landing-page .options-grid h2,
.landing-page .final-cta-panel h2 {
    font-size: calc(1.375rem + 0.625vw);
    font-weight: 700;
    line-height: 1.5;
}

@media (min-width: 1200px) {
    .landing-page .landing-section-heading h2,
    .landing-page .options-grid h2,
    .landing-page .final-cta-panel h2 {
        font-size: 1.85rem;
    }
}

.landing-page .landing-card h3,
.landing-page .landing-steps h3,
.landing-page .workflow-visual h3,
.landing-page .pricing-card h3,
.landing-page .trust-grid strong,
.landing-page .mockup-card strong,
.landing-page .mockup-header strong {
    color: var(--theme-heading-color);
    font-size: 1.084rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
}

.landing-page .landing-card::after {
    font-size: 0.875rem;
    line-height: 1.5;
}

.landing-page .value-strip-grid strong {
    font-size: 1.084rem;
    line-height: 1.5;
}

.landing-page .value-strip-grid small {
    color: var(--theme-secondary-color);
    font-size: 0.933rem;
    line-height: 1.75;
}

.landing-page .comparison-table thead th,
.landing-page .landing-eyebrow,
.landing-page .options-example-panel > span,
.landing-page .mockup-header span,
.landing-page .mockup-card span {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.5;
}

/* Landing workflow cards matched to the Inspinia service card pattern. */
.landing-page .workflow-visual {
    gap: 1.25rem;
}

.landing-page .workflow-visual::before {
    display: none;
}

.landing-page .workflow-visual article {
    background: var(--theme-secondary-bg);
    border: 0;
    border-radius: var(--theme-border-radius);
    box-shadow: none;
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 16rem;
    padding: 2rem;
}

.landing-page .workflow-step-number {
    background: var(--theme-secondary);
    border-radius: 50%;
    color: #ffffff;
    flex: 0 0 auto;
    font-size: 1rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    height: 3rem;
    margin-bottom: 1.6rem;
    width: 3rem;
}

.landing-page .workflow-visual h3 {
    margin: 0 0 0.75rem;
}

.landing-page .workflow-visual p {
    margin: 0;
}

.landing-page .workflow-visual strong {
    align-self: flex-start;
    background: transparent;
    border: 0;
    color: var(--theme-primary);
    font-size: 0.875rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
    margin-top: auto;
    padding: 1.5rem 0 0;
}

html[data-theme="dark"] .landing-page .workflow-visual article {
    background: var(--theme-secondary-bg);
    border: 1px solid var(--theme-border-color);
}

/* Pricing reassurance cards use template card typography. */
.landing-page .pricing-reassurance {
    gap: 1rem;
    max-width: 1120px;
}

.landing-page .pricing-reassurance article {
    background: var(--theme-secondary-bg);
    border: 1px solid var(--theme-border-color);
    border-radius: var(--theme-border-radius);
    box-shadow: none;
    gap: 0.7rem;
    padding: 1.25rem;
}

.landing-page .pricing-reassurance strong {
    color: var(--theme-heading-color);
    font-size: 1rem;
    font-weight: var(--theme-font-weight-semibold, 600);
    line-height: 1.5;
}

.landing-page .pricing-reassurance span {
    color: var(--theme-secondary-color);
    font-size: 0.933rem;
    font-weight: var(--theme-body-font-weight);
    line-height: 1.75;
}

/* Public footer aligned with the Inspinia landing footer typography. */
.landing-footer {
    background: var(--theme-body-bg);
    border-top: 1px solid var(--theme-border-color);
    padding: 2rem 0;
}

.landing-footer-grid {
    align-items: center;
    gap: 1.5rem;
}

.landing-footer-grid > div {
    gap: 0.5rem;
}

.landing-footer .trader-brand-logo-footer {
    height: 3.5rem;
}

.landing-footer p,
.landing-footer small {
    color: var(--theme-secondary-color);
    font-size: 0.875rem;
    font-weight: var(--theme-body-font-weight);
    line-height: 1.5;
    margin: 0;
}

.landing-footer nav {
    gap: 1.25rem;
}

.landing-footer a {
    color: var(--theme-secondary-color);
    font-size: 0.875rem;
    font-weight: var(--theme-body-font-weight);
    line-height: 1.5;
    text-decoration: none;
}

.landing-footer a:hover,
.landing-footer a:focus {
    color: var(--theme-primary);
}

@media (max-width: 991.98px) {
    .landing-page .landing-section-heading-wide {
        max-width: 760px;
    }
}