:root {
        --bg: #050b11;
        --bg-alt: #0a1522;
        --panel: #0d1a28;
        --panel-2: #0a1420;
        --stroke: rgba(138, 167, 190, 0.35);
        --stroke-2: rgba(138, 167, 190, 0.2);
        --text: #d7e3ef;
        --muted: #88a2b8;
        --accent: #22d3ee;
        --up: #22c55e;
        --down: #f97316;
        --warn: #f59e0b;
      }

      * {
        box-sizing: border-box;
      }

      body {
        margin: 0;
        min-height: 100vh;
        font-family: "Space Grotesk", sans-serif;
        color: var(--text);
        background:
          radial-gradient(circle at 12% -10%, #123a4d 0%, transparent 42%),
          radial-gradient(circle at 80% -20%, #17323e 0%, transparent 36%),
          linear-gradient(165deg, var(--bg), var(--bg-alt));
      }

      .app {
        width: min(1820px, calc(100% - 1.2rem));
        margin: 0.6rem auto 1rem;
        display: grid;
        gap: 0.7rem;
      }

      .topbar {
        border: 1px solid var(--stroke);
        background: linear-gradient(180deg, #0f1b2a, #0b1622);
        border-radius: 2px;
        padding: 0.6rem;
        display: grid;
        gap: 0.6rem;
      }

      .topline {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.5rem;
        flex-wrap: wrap;
      }

      .topline-left {
        display: inline-flex;
        align-items: center;
        gap: 0.45rem;
        min-width: 0;
      }

      .topline-right {
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 0.45rem;
        flex-wrap: wrap;
        margin-left: auto;
      }

      .topbar-user {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
      }

      .topbar-user-badge {
        border: 1px solid var(--stroke);
        background: #0f2133;
        color: #cfe1ef;
        border-radius: 2px;
        padding: 0.34rem 0.55rem;
        font-size: 0.72rem;
        letter-spacing: 0.03em;
      }

      .topbar-user-badge strong {
        color: #f2f7fb;
        font-weight: 700;
      }

      .topbar-user-role {
        color: var(--accent);
      }

      .topbar-user-logout {
        padding: 0.34rem 0.58rem;
        font-size: 0.72rem;
      }

      .topbar-user-admin {
        padding: 0.34rem 0.58rem;
        font-size: 0.72rem;
      }

      .topbar-user-account {
        padding: 0.34rem 0.58rem;
        font-size: 0.72rem;
      }

      .title {
        font-size: 0.95rem;
        letter-spacing: 0.06em;
        text-transform: uppercase;
      }

      .title span {
        color: var(--accent);
      }

      .pair {
        font-size: 0.8rem;
        color: var(--muted);
      }

      .toolbar {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        align-items: center;
      }

      .workspace-settings {
        position: relative;
        display: inline-flex;
        align-items: center;
      }

      .topbar-settings-btn {
        border: 1px solid var(--stroke);
        background: #102437;
        color: #c8d9e8;
        border-radius: 2px;
        width: 2.2rem;
        height: 2.2rem;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
        line-height: 1;
      }

      .menu-title {
        font-size: 0.66rem;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: #a8c5d8;
        margin-bottom: 0.32rem;
      }

      .topbar-settings-btn[data-open="true"] {
        border-color: #2f678f;
        color: #e5f4ff;
      }

      .topbar-settings-menu {
        position: absolute;
        top: calc(100% + 0.35rem);
        right: 0;
        z-index: 42;
        min-width: 26rem;
        max-width: min(92vw, 38rem);
        border: 1px solid var(--stroke);
        border-radius: 2px;
        background: rgba(7, 18, 29, 0.98);
        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.38);
        padding: 0.48rem 0.52rem;
        display: none;
      }

      .topbar-settings-menu[data-open="true"] {
        display: block;
      }

      .topbar-settings-section + .topbar-settings-section {
        margin-top: 0.42rem;
        padding-top: 0.42rem;
        border-top: 1px solid var(--stroke-2);
      }

      .topbar-settings-label {
        font-size: 0.64rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: #9fbdd3;
        margin-bottom: 0.22rem;
      }

      .topbar-settings-copy {
        color: #95b2c8;
        font-size: 0.68rem;
        line-height: 1.35;
      }

      .topbar-settings-actions {
        display: grid;
        gap: 0.3rem;
      }

      label,
      .label {
        font-size: 0.72rem;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: var(--muted);
        display: grid;
        gap: 0.28rem;
      }

      select,
      input,
      button {
        font: inherit;
        color: var(--text);
        border: 1px solid var(--stroke);
        background: #0f2133;
        border-radius: 2px;
        padding: 0.4rem 0.55rem;
      }

      button {
        cursor: pointer;
        font-weight: 700;
      }

      .btn {
        background: linear-gradient(140deg, #0ea5e9, #14b8a6);
        color: #041017;
        border-color: transparent;
      }

      .btn.subtle {
        background: #102435;
        color: var(--text);
        border-color: var(--stroke);
      }

      .panel-visibility {
        display: flex;
        flex-wrap: wrap;
        gap: 0.35rem;
      }

      .topbar-settings-menu .panel-visibility {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 0.26rem;
      }

      .topbar-settings-menu .toggle-chip {
        width: 100%;
        justify-content: flex-start;
      }

      .toggle-chip {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        padding: 0.2rem 0.35rem;
        border: 1px solid var(--stroke);
        background: #0f2133;
        border-radius: 2px;
        font-size: 0.7rem;
        color: var(--muted);
        cursor: pointer;
      }

      .toggle-chip input {
        margin: 0;
        accent-color: #22d3ee;
      }

      .dashboard {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        grid-auto-rows: 42px;
        gap: 0.65rem;
        visibility: visible;
        pointer-events: auto;
      }

      html[data-app-js="true"] .dashboard[data-layout-ready="false"] {
        visibility: hidden;
        pointer-events: none;
      }

      .auth-overlay {
        position: fixed;
        inset: 0;
        z-index: 120;
        display: none;
        align-items: center;
        justify-content: center;
        padding: 1.2rem;
        background: rgba(3, 8, 14, 0.82);
        backdrop-filter: blur(10px);
      }

      .auth-overlay[data-open="true"] {
        display: flex;
      }

      .auth-card {
        width: min(28rem, 100%);
        border: 1px solid var(--stroke);
        background: linear-gradient(180deg, rgba(11, 24, 37, 0.98), rgba(8, 18, 29, 0.98));
        box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
        padding: 1rem 1rem 0.9rem;
        display: grid;
        gap: 0.9rem;
      }

      .auth-title {
        font-size: 1.15rem;
        font-weight: 700;
        letter-spacing: 0.03em;
      }

      .auth-copy {
        color: #9db6ca;
        font-size: 0.82rem;
        line-height: 1.45;
      }

      .auth-tabs {
        display: inline-flex;
        gap: 0.3rem;
      }

      .auth-tab {
        border: 1px solid var(--stroke);
        background: #102337;
        color: #9db6ca;
        padding: 0.4rem 0.65rem;
        font-size: 0.74rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
      }

      .auth-tab[data-active="true"] {
        border-color: rgba(34, 211, 238, 0.6);
        color: #f2f8fc;
        background: linear-gradient(180deg, rgba(21, 47, 67, 0.95), rgba(14, 32, 46, 0.95));
      }

      .auth-form {
        display: none;
        gap: 0.7rem;
      }

      .auth-form[data-active="true"] {
        display: grid;
      }

      .auth-form .label {
        font-size: 0.68rem;
      }

      .auth-actions {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.6rem;
        flex-wrap: wrap;
      }

      .auth-submit {
        min-width: 8.5rem;
      }

      .auth-google {
        display: none;
      }

      .auth-google[data-enabled="true"] {
        display: inline-flex;
      }

      .auth-message {
        min-height: 1.1rem;
        font-size: 0.76rem;
        color: #9db6ca;
      }

      .auth-message[data-tone="error"] {
        color: #ff9a8b;
      }

      .auth-message[data-tone="success"] {
        color: #6de6a1;
      }

      .widget {
        position: relative;
        display: flex;
        flex-direction: column;
        border: 1px solid var(--stroke);
        border-radius: 2px;
        background: linear-gradient(180deg, var(--panel), var(--panel-2));
        min-height: 120px;
        overflow: hidden;
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.24);
      }

      .widget[data-hidden="true"] {
        display: none;
      }

      .widget.dragging {
        opacity: 0.45;
        border-color: var(--accent);
      }

      .widget.resizing {
        border-color: var(--accent);
      }

      .widget-head {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.35rem;
        position: relative;
        padding: 0.42rem 0.5rem;
        border-bottom: 1px solid var(--stroke-2);
        cursor: grab;
        user-select: none;
        background: rgba(7, 18, 28, 0.7);
      }

      .widget-head:active {
        cursor: grabbing;
      }

      .widget-title {
        font-size: 0.72rem;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: var(--muted);
      }

      .widget-hide {
        border: 1px solid var(--stroke-2);
        background: #0f2336;
        color: var(--muted);
        font-size: 0.68rem;
        border-radius: 2px;
        padding: 0.22rem 0.4rem;
      }

      .widget-head-actions {
        display: inline-flex;
        align-items: center;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 0.3rem;
      }

      .widget-head-controls {
        display: inline-flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.3rem;
      }

      .widget-head-control {
        display: inline-flex;
        align-items: center;
        gap: 0.28rem;
        padding: 0.18rem 0.28rem;
        border: 1px solid var(--stroke-2);
        background: #0f2336;
        border-radius: 2px;
        color: var(--muted);
        font-size: 0.64rem;
        letter-spacing: 0.04em;
        text-transform: uppercase;
      }

      .widget-head-control select {
        min-width: 4.5rem;
        padding: 0.16rem 0.32rem;
        border: 1px solid var(--stroke-2);
        background: #102437;
        color: var(--text);
        font-size: 0.68rem;
        letter-spacing: 0.02em;
      }

      .widget-menu-anchor {
        position: relative;
        display: inline-flex;
        align-items: center;
      }

      .widget-head-btn {
        border: 1px solid var(--stroke-2);
        background: #0f2336;
        color: var(--muted);
        font-size: 0.68rem;
        border-radius: 2px;
        padding: 0.22rem 0.4rem;
      }

      .widget-help-btn {
        width: 1.55rem;
        min-width: 1.55rem;
        height: 1.55rem;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 0.78rem;
        line-height: 1;
      }

      .widget-icon-btn {
        width: 2rem;
        min-width: 2rem;
        height: 2rem;
        padding: 0;
        font-size: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }

      .widget-icon-btn svg,
      .topbar-settings-btn svg {
        width: 0.95rem;
        height: 0.95rem;
        stroke: currentColor;
        fill: none;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
        pointer-events: none;
      }

      .widget-icon-btn svg .icon-fill,
      .topbar-settings-btn svg .icon-fill {
        fill: currentColor;
        stroke: none;
      }

      .widget-head-btn[data-open="true"] {
        border-color: #2f678f;
        color: #d8ecf9;
      }

      .chart-overlay-menu,
      .widget-settings-menu {
        position: absolute;
        right: 0;
        top: calc(100% + 0.28rem);
        z-index: 28;
        min-width: 12rem;
        border: 1px solid var(--stroke-2);
        border-radius: 2px;
        background: rgba(7, 18, 29, 0.96);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
        padding: 0.42rem;
        display: none;
      }

      .chart-overlay-menu[data-open="true"],
      .widget-settings-menu[data-open="true"] {
        display: block;
      }

      .widget-settings-section + .widget-settings-section {
        margin-top: 0.42rem;
        padding-top: 0.42rem;
        border-top: 1px solid var(--stroke-2);
      }

      .chart-overlay-menu label,
      .widget-settings-menu label {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        color: #b7cfe0;
        font-size: 0.72rem;
        line-height: 1.2;
        padding: 0.14rem 0;
        user-select: none;
      }

      .chart-overlay-menu input[type="checkbox"],
      .widget-settings-menu input[type="checkbox"] {
        width: 0.9rem;
        height: 0.9rem;
      }

      .chart-overlay-menu input[type="color"] {
        width: 1.6rem;
        height: 1rem;
        padding: 0;
        border: 1px solid var(--stroke-2);
        background: transparent;
      }

      .chart-overlay-section + .chart-overlay-section {
        margin-top: 0.42rem;
        padding-top: 0.42rem;
        border-top: 1px solid var(--stroke-2);
      }

      .chart-overlay-section-title {
        font-size: 0.64rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: #9fbdd3;
        margin-bottom: 0.12rem;
      }

      .chart-overlay-suboption {
        padding-left: 0.95rem;
      }

      .chart-overlay-color-row {
        justify-content: space-between;
      }

      .chart-overlay-color-row span {
        flex: 1;
      }

      .chart-overlay-range-row {
        display: grid !important;
        grid-template-columns: minmax(4.4rem, 1fr) minmax(4.8rem, 1.2fr) 2.6rem;
        align-items: center;
        gap: 0.45rem;
      }

      .chart-overlay-range-row input[type="range"] {
        width: 100%;
        accent-color: #62d1ff;
      }

      .chart-overlay-range-row span:last-child {
        text-align: right;
        color: #d7e3ef;
      }

      .widget-settings-action {
        width: 100%;
        text-align: left;
        border: 1px solid var(--stroke-2);
        background: #102437;
        color: #d7e3ef;
        font-size: 0.72rem;
        font-weight: 600;
        padding: 0.35rem 0.45rem;
      }

      .widget-settings-copy {
        color: #95b2c8;
        font-size: 0.68rem;
        line-height: 1.35;
      }

      .widget-body {
        padding: 0.55rem;
        flex: 1;
        overflow: auto;
      }

      .chart-body {
        display: flex;
        flex-direction: column;
        gap: 0.45rem;
      }

      #chart {
        width: 100%;
        min-height: 260px;
        height: 100%;
        flex: 1;
      }

      /* Remove leftover left spacer cell from lightweight-charts table layout */
      #chart .tv-lightweight-charts table tr > td:first-child {
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        overflow: hidden !important;
      }

      .widget[data-panel-id="chart"] .widget-body {
        padding: 0;
        overflow: hidden;
      }

      .widget[data-panel-id="chart"] .chart-body {
        gap: 0;
      }

      .widget[data-panel-id="chart"] .meta {
        padding: 0.4rem 0.55rem 0.5rem;
        border-top: 1px solid var(--stroke-2);
      }

      .meta {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 0.4rem;
        color: var(--muted);
        font-size: 0.78rem;
      }

      .chart-attribution {
        font-size: 0.72rem;
        color: #6f8ca5;
      }

      .chart-attribution a {
        color: #7db8e5;
        text-decoration: none;
        border-bottom: 1px dotted rgba(125, 184, 229, 0.55);
      }

      .chart-attribution a:hover {
        color: #a8d8ff;
        border-bottom-color: rgba(168, 216, 255, 0.85);
      }

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

      .status-offline {
        color: var(--warn);
      }

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

      .stat {
        border: 1px solid var(--stroke-2);
        background: rgba(8, 19, 31, 0.65);
        border-radius: 2px;
        padding: 0.45rem;
      }

      .stat .label {
        margin-bottom: 0.16rem;
      }

      .order-actions {
        margin-top: 0.55rem;
        display: flex;
        gap: 0.45rem;
      }

      .buy {
        background: linear-gradient(135deg, #22c55e, #14b8a6);
        color: #04130b;
        border-color: transparent;
      }

      .sell {
        background: linear-gradient(135deg, #fb923c, #f43f5e);
        color: #23070c;
        border-color: transparent;
      }

      #order-result {
        min-height: 1rem;
        color: var(--muted);
        font-size: 0.82rem;
      }

      .strategy-body {
        display: flex;
        flex-direction: column;
        gap: 0.42rem;
        overflow: hidden;
        min-height: 0;
      }

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

      .strategy-summary-grid .stat {
        padding: 0.38rem 0.42rem;
      }

      .strategy-summary-grid .stat strong {
        font-size: 0.84rem;
        font-variant-numeric: tabular-nums;
      }

      .strategy-meta {
        font-size: 0.67rem;
        color: #89aac2;
        line-height: 1.28;
        border: 1px solid var(--stroke-2);
        background: rgba(8, 20, 31, 0.58);
        border-radius: 2px;
        padding: 0.3rem 0.4rem;
      }

      .strategy-side-head {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.4rem;
        color: #8cb0c9;
        font-size: 0.68rem;
      }

      .strategy-view {
        display: flex;
        flex-direction: column;
        gap: 0.42rem;
        flex: 1;
        min-height: 0;
      }

      .strategy-view[data-hidden="true"] {
        display: none;
      }

      .strategy-tables {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.42rem;
        flex: 1;
        min-height: 0;
      }

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

      .strategy-market-grid .stat {
        padding: 0.34rem 0.4rem;
      }

      .strategy-stat-label-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.3rem;
        margin-bottom: 0.16rem;
      }

      .strategy-stat-label-row .label {
        display: inline-block;
        gap: 0;
      }

      .strategy-market-grid .stat strong {
        font-size: 0.78rem;
        font-variant-numeric: tabular-nums;
      }

      .strategy-meta-row {
        display: flex;
        align-items: flex-start;
        gap: 0.36rem;
      }

      .strategy-meta-row .strategy-meta {
        flex: 1;
      }

      .strategy-log-card {
        flex: 1;
        min-height: 0;
      }

      .strategy-table-card {
        border: 1px solid var(--stroke-2);
        background: rgba(7, 18, 29, 0.7);
        border-radius: 2px;
        display: flex;
        flex-direction: column;
        min-height: 0;
      }

      .strategy-table-title {
        font-size: 0.67rem;
        color: #a8c4d8;
        letter-spacing: 0.02em;
        text-transform: uppercase;
        border-bottom: 1px solid var(--stroke-2);
        padding: 0.26rem 0.34rem;
      }

      .strategy-table-card .table-wrap {
        flex: 1;
        min-height: 0;
      }

      .table-wrap {
        position: relative;
        height: 100%;
        max-height: 100%;
        overflow: auto;
      }

      .tape-time-cell {
        display: inline-flex;
        align-items: center;
        gap: 0.38rem;
      }

      .symbol-logo {
        width: 1rem;
        height: 1rem;
        border-radius: 999px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 0.72rem;
        font-weight: 700;
        line-height: 1;
        border: 1px solid rgba(144, 176, 204, 0.35);
        color: #d9e9f6;
        background: #173246;
      }

      .symbol-logo-btc {
        background: #f7931a;
        border-color: rgba(247, 147, 26, 0.55);
        color: #fff;
      }

      .orderbook-body {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        overflow: hidden;
        min-height: 0;
      }

      .orderbook-tabs {
        display: inline-flex;
        gap: 0.28rem;
        align-self: flex-start;
      }

      .orderbook-tab {
        border: 1px solid var(--stroke-2);
        background: rgba(12, 30, 46, 0.92);
        color: var(--muted);
        border-radius: 2px;
        font-size: 0.67rem;
        letter-spacing: 0.02em;
        text-transform: uppercase;
        padding: 0.18rem 0.42rem;
        cursor: pointer;
      }

      .orderbook-tab.is-active {
        background: #174362;
        color: #d8e8f5;
        border-color: #2f678f;
      }

      .orderbook-view {
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
      }

      .orderbook-view[data-hidden="true"] {
        display: none;
      }

      .tape-controls {
        display: inline-flex;
        align-items: center;
        gap: 0.32rem;
        margin-bottom: 0.12rem;
        color: #9ab5c9;
        font-size: 0.66rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
      }

      .tape-controls select {
        font-size: 0.66rem;
        padding: 0.16rem 0.3rem;
        min-width: 8.2rem;
      }

      .orderbook-viz {
        border: 1px solid var(--stroke-2);
        background: rgba(8, 19, 31, 0.68);
        border-radius: 2px;
        padding: 0.34rem 0.38rem 0.38rem;
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
      }

      .orderbook-viz-head {
        display: flex;
        flex-direction: column;
        gap: 0.08rem;
        font-size: 0.68rem;
        color: var(--muted);
        margin-bottom: 0.22rem;
      }

      .orderbook-viz-head .ask-label {
        color: #f7a35a;
      }

      .orderbook-viz-head .bid-label {
        color: #67d69a;
      }

      .orderbook-viz-scale {
        color: #7fa7c4;
        font-size: 0.66rem;
        margin-bottom: 0.28rem;
        letter-spacing: 0.01em;
      }

      .orderbook-viz-body {
        display: flex;
        flex-direction: column;
        gap: 0.34rem;
        flex: 1;
        min-height: 0;
        overflow: hidden;
      }

      .orderbook-viz-bound {
        font-size: 0.64rem;
        letter-spacing: 0.01em;
        color: #98b7cf;
      }

      .orderbook-viz-bound-max {
        color: #f7b277;
      }

      .orderbook-viz-bound-min {
        color: #8ee1bb;
      }

      .orderbook-viz-section {
        display: flex;
        flex-direction: column;
        gap: 0.14rem;
        min-height: 0;
      }

      .orderbook-viz-section-title {
        font-size: 0.65rem;
        color: var(--muted);
      }

      .orderbook-viz-title-ask {
        color: #f7a35a;
      }

      .orderbook-viz-title-bid {
        color: #67d69a;
      }

      .orderbook-viz-section-list {
        display: flex;
        flex-direction: column;
        gap: 0.1rem;
        flex: 1;
        min-height: 0;
        overflow: auto;
      }

      .orderbook-viz-empty {
        color: var(--muted);
        font-size: 0.74rem;
        padding: 0.2rem 0;
      }

      .orderbook-viz-row {
        display: grid;
        grid-template-columns: 6.2rem 1fr;
        align-items: center;
        gap: 0.3rem;
        min-height: 0.46rem;
      }

      .orderbook-viz-row-meta {
        display: inline-flex;
        align-items: center;
        gap: 0.22rem;
        font-size: 0.62rem;
        font-variant-numeric: tabular-nums;
        color: #9ab5c9;
      }

      .orderbook-viz-row-level {
        min-width: 1.65rem;
        color: #8ea6b8;
      }

      .orderbook-viz-row-value {
        color: #d8e8f5;
      }

      .orderbook-viz-row-ask .orderbook-viz-row-value {
        color: #f7c08f;
      }

      .orderbook-viz-row-bid .orderbook-viz-row-value {
        color: #97e1bf;
      }

      .orderbook-viz-side {
        position: relative;
        height: 0.4rem;
        border-radius: 1px;
        overflow: hidden;
        background: rgba(30, 56, 77, 0.28);
      }

      .orderbook-viz-ask-bar,
      .orderbook-viz-bid-bar {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
      }

      .orderbook-viz-ask-bar {
        background: linear-gradient(90deg, rgba(249, 115, 22, 0.74), rgba(249, 115, 22, 0.28));
      }

      .orderbook-viz-bid-bar {
        background: linear-gradient(90deg, rgba(34, 197, 94, 0.74), rgba(34, 197, 94, 0.28));
      }

      .orderbook-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem;
        flex: 1;
        min-height: 0;
      }

      .heatmap-body {
        display: flex;
        flex-direction: column;
        gap: 0.42rem;
        overflow: hidden;
        min-height: 0;
      }

      .heatmap-head {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 0.4rem;
        font-size: 0.68rem;
        color: var(--muted);
      }

      .heatmap-title {
        color: #b8d4e7;
      }

      .heatmap-scale {
        color: #87abc5;
        text-align: right;
      }

      .heatmap-controls {
        display: inline-flex;
        align-items: center;
        gap: 0.32rem;
      }

      .heatmap-controls select {
        font-size: 0.67rem;
        padding: 0.2rem 0.34rem;
        min-width: 4.6rem;
      }

      .heatmap-canvas-wrap {
        position: relative;
        border: 1px solid var(--stroke-2);
        background: linear-gradient(180deg, rgba(7, 18, 29, 0.88), rgba(5, 13, 22, 0.92));
        border-radius: 2px;
        flex: 1;
        min-height: 200px;
        overflow: hidden;
      }

      .heatmap-canvas-layout {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: 0.42rem;
        flex: 1;
        min-height: 0;
      }

      .heatmap-intensity {
        position: relative;
        width: 4.9rem;
        min-width: 4.9rem;
        pointer-events: none;
      }

      .heatmap-intensity-track {
        position: absolute;
        right: 0.1rem;
        top: 0;
        bottom: 0;
        width: 0.9rem;
        border: 1px solid rgba(125, 160, 185, 0.44);
        border-radius: 2px;
        overflow: hidden;
        background: rgba(5, 15, 24, 0.92);
        display: flex;
        flex-direction: column;
      }

      .heatmap-intensity-half {
        flex: 1;
      }

      .heatmap-intensity-half.pos {
        background: linear-gradient(180deg, rgba(34, 197, 94, 1), rgba(34, 197, 94, 0.06));
      }

      .heatmap-intensity-half.neg {
        border-top: 1px solid rgba(125, 160, 185, 0.26);
        background: linear-gradient(180deg, rgba(249, 115, 22, 0.06), rgba(249, 115, 22, 1));
      }

      .heatmap-intensity-label {
        position: absolute;
        left: 0;
        color: #89abc3;
        font-size: 0.65rem;
        line-height: 1;
        letter-spacing: 0.01em;
        white-space: nowrap;
      }

      .heatmap-intensity-label.pos {
        top: 0;
      }

      .heatmap-intensity-label.zero {
        top: 50%;
        transform: translateY(-50%);
      }

      .heatmap-intensity-label.neg {
        bottom: 0;
      }

      .heatmap-canvas {
        width: 100%;
        height: 100%;
        display: block;
      }

      .heatmap-tooltip {
        position: absolute;
        left: 0;
        top: 0;
        max-width: min(22rem, calc(100% - 0.6rem));
        border: 1px solid rgba(127, 163, 188, 0.65);
        background: linear-gradient(180deg, rgba(5, 17, 28, 0.98), rgba(6, 14, 22, 0.98));
        color: #d8e9f7;
        font-size: 0.67rem;
        line-height: 1.25;
        border-radius: 2px;
        padding: 0.34rem 0.42rem;
        box-shadow: 0 8px 22px rgba(0, 0, 0, 0.45);
        pointer-events: none;
        white-space: nowrap;
        z-index: 5;
        opacity: 0;
        visibility: hidden;
        transform: translate3d(0, 0, 0);
      }

      .heatmap-tooltip[data-visible="true"] {
        opacity: 1;
        visibility: visible;
      }

      .heatmap-tooltip .line {
        display: block;
      }

      .heatmap-meta {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 0.4rem;
        color: #8bacc2;
        font-size: 0.67rem;
      }

      .heatmap-meta span {
        white-space: nowrap;
      }

      .volume-body {
        display: flex;
        flex-direction: column;
        gap: 0.45rem;
        overflow: hidden;
        min-height: 0;
      }

      .forecaster-body {
        display: flex;
        flex-direction: column;
        gap: 0.42rem;
        overflow: hidden;
        min-height: 0;
      }

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

      .forecaster-summary .stat {
        padding: 0.34rem 0.4rem;
      }

      .forecaster-summary .stat strong {
        font-size: 0.82rem;
        font-variant-numeric: tabular-nums;
      }

      .forecaster-summary-help {
        width: 100%;
        border: 0;
        background: transparent;
        color: #d4e4f0;
        padding: 0;
        margin: 0 0 0.16rem;
        font: inherit;
        display: inline-flex;
        align-items: center;
        justify-content: flex-start;
        gap: 0.24rem;
        cursor: pointer;
        text-align: left;
      }

      .forecaster-summary-help:hover {
        color: #e9f5ff;
      }

      .forecaster-summary-help .hint {
        width: 0.8rem;
        height: 0.8rem;
        border-radius: 999px;
        border: 1px solid rgba(138, 167, 190, 0.6);
        color: #9dbbd3;
        font-size: 0.58rem;
        line-height: 0.8rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
      }

      .forecaster-controls {
        display: flex;
        align-items: center;
        gap: 0.45rem;
        flex-wrap: wrap;
        color: #95b2c8;
        font-size: 0.66rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
      }

      .forecaster-horizon-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.45rem;
        flex-wrap: wrap;
      }

      .forecaster-horizon-meta {
        color: #89abc3;
        font-size: 0.66rem;
        letter-spacing: 0.02em;
      }

      .forecaster-horizon-panel {
        display: flex;
        flex-direction: column;
        gap: 0.45rem;
        border: 1px solid rgba(88, 117, 141, 0.32);
        background: linear-gradient(180deg, rgba(7, 18, 30, 0.92), rgba(8, 18, 28, 0.88));
        padding: 0.55rem 0.65rem 0.6rem;
      }

      .forecaster-horizon-summary {
        color: #cfe1ee;
        font-size: 0.78rem;
        line-height: 1.4;
      }

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

      .forecaster-horizon-column {
        display: flex;
        flex-direction: column;
        gap: 0.28rem;
        min-width: 0;
      }

      .forecaster-horizon-column strong {
        font-size: 0.67rem;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: #c4d7e6;
      }

      .forecaster-horizon-column ul {
        margin: 0;
        padding-left: 1rem;
        color: #9fb8cb;
        font-size: 0.7rem;
        line-height: 1.42;
      }

      .forecaster-horizon-column li + li {
        margin-top: 0.16rem;
      }

      .forecaster-horizon-column.support strong {
        color: #9ce0b1;
      }

      .forecaster-horizon-column.risk strong {
        color: #f6b1bf;
      }

      .forecaster-horizon-column.invalidate strong {
        color: #f2cd8d;
      }

      @media (max-width: 960px) {
        .forecaster-horizon-columns {
          grid-template-columns: 1fr;
        }
      }

      .forecaster-modules {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        flex-wrap: wrap;
        color: #95b2c8;
        font-size: 0.62rem;
      }

      .forecaster-intervals {
        display: flex;
        align-items: center;
        gap: 0.35rem;
        flex-wrap: wrap;
        color: #95b2c8;
        font-size: 0.62rem;
      }

      .forecaster-module {
        display: inline-flex;
        align-items: center;
        gap: 0.24rem;
        padding: 0.12rem 0.28rem;
        border: 1px solid rgba(138, 167, 190, 0.3);
        border-radius: 3px;
        background: rgba(7, 23, 38, 0.42);
      }

      .forecaster-controls select {
        font-size: 0.66rem;
        padding: 0.16rem 0.28rem;
        min-width: 4.2rem;
      }

      .forecaster-check {
        display: inline-flex;
        align-items: center;
        gap: 0.28rem;
        margin: 0;
        color: #95b2c8;
      }

      .forecaster-check input[type="checkbox"] {
        width: 0.84rem;
        height: 0.84rem;
        margin: 0;
      }

      .forecaster-bias {
        font-weight: 700;
      }

      .forecaster-bias.buy {
        color: #22c55e;
      }

      .forecaster-bias.sell {
        color: #f97316;
      }

      .forecaster-bias.neutral {
        color: #9ab5c9;
      }

      .forecaster-col {
        position: relative;
      }

      .forecaster-col-signal {
        background: linear-gradient(180deg, rgba(126, 168, 210, 0.12), rgba(126, 168, 210, 0.06));
        box-shadow: inset 1px 0 0 rgba(130, 177, 219, 0.22), inset -1px 0 0 rgba(130, 177, 219, 0.16);
      }

      .forecaster-col-score {
        background: linear-gradient(180deg, rgba(70, 133, 182, 0.14), rgba(70, 133, 182, 0.07));
        box-shadow: inset 1px 0 0 rgba(90, 156, 208, 0.2), inset -1px 0 0 rgba(90, 156, 208, 0.14);
      }

      .forecaster-col-osc {
        background: linear-gradient(180deg, rgba(43, 102, 147, 0.12), rgba(43, 102, 147, 0.05));
        box-shadow: inset 1px 0 0 rgba(76, 142, 194, 0.18), inset -1px 0 0 rgba(76, 142, 194, 0.12);
      }

      .forecaster-col-signal .forecaster-head-help,
      .forecaster-col-score .forecaster-head-help,
      .forecaster-col-osc .forecaster-head-help {
        background: transparent;
      }

      .forecaster-score-cell {
        min-width: 8.2rem;
        padding-inline: 0.4rem;
      }

      .forecaster-score-track {
        position: relative;
        width: 100%;
        height: 0.54rem;
        border-radius: 2px;
        overflow: hidden;
        border: 1px solid rgba(138, 167, 190, 0.2);
        background: rgba(8, 21, 33, 0.84);
      }

      .forecaster-score-mid {
        position: absolute;
        top: -1px;
        bottom: -1px;
        left: 50%;
        width: 1px;
        background: rgba(149, 179, 201, 0.55);
      }

      .forecaster-score-bar {
        position: absolute;
        top: 0;
        bottom: 0;
      }

      .forecaster-score-bar.buy {
        background: linear-gradient(90deg, rgba(34, 197, 94, 0.45), rgba(34, 197, 94, 0.9));
      }

      .forecaster-score-bar.sell {
        background: linear-gradient(90deg, rgba(249, 115, 22, 0.9), rgba(249, 115, 22, 0.45));
      }

      .forecaster-score-value {
        margin-top: 0.15rem;
        font-size: 0.64rem;
        color: #9db8cb;
        font-variant-numeric: tabular-nums;
      }

      .forecaster-compact {
        font-size: 0.65rem;
        color: #9cb5c8;
        font-variant-numeric: tabular-nums;
        white-space: nowrap;
      }

      .forecaster-metric-cell {
        min-width: 5.4rem;
        padding-inline: 0.32rem;
      }

      th.forecaster-col-st,
      td.forecaster-col-st {
        width: 3rem;
      }

      td.forecaster-col-st.forecaster-metric-cell {
        min-width: 3rem;
        padding-inline: 0.18rem;
      }

      .forecaster-metric-track {
        position: relative;
        width: 100%;
        height: 0.46rem;
        border-radius: 2px;
        overflow: hidden;
        border: 1px solid rgba(138, 167, 190, 0.2);
        background: rgba(8, 21, 33, 0.72);
      }

      .forecaster-metric-mid {
        position: absolute;
        top: -1px;
        bottom: -1px;
        left: 50%;
        width: 1px;
        background: rgba(149, 179, 201, 0.35);
      }

      .forecaster-metric-bar {
        position: absolute;
        top: 0;
        bottom: 0;
      }

      .forecaster-metric-fill {
        position: absolute;
        top: 0;
        bottom: 0;
        border-radius: 1px;
      }

      .forecaster-metric-marker {
        position: absolute;
        top: 50%;
        width: 0.42rem;
        height: 0.72rem;
        border-radius: 999px;
        transform: translate(-50%, -50%);
        box-shadow: 0 0 0 1px rgba(8, 20, 31, 0.45);
        z-index: 2;
      }

      .forecaster-metric-bar.buy {
        background: linear-gradient(90deg, rgba(34, 197, 94, 0.45), rgba(34, 197, 94, 0.88));
      }

      .forecaster-metric-bar.sell {
        background: linear-gradient(90deg, rgba(249, 115, 22, 0.88), rgba(249, 115, 22, 0.45));
      }

      .forecaster-metric-fill.buy {
        background: linear-gradient(90deg, rgba(34, 197, 94, 0.52), rgba(74, 222, 128, 0.94));
      }

      .forecaster-metric-fill.sell {
        background: linear-gradient(90deg, rgba(251, 146, 60, 0.94), rgba(249, 115, 22, 0.52));
      }

      .forecaster-metric-marker.buy {
        background: linear-gradient(180deg, rgba(110, 231, 183, 0.98), rgba(34, 197, 94, 0.95));
      }

      .forecaster-metric-marker.sell {
        background: linear-gradient(180deg, rgba(253, 186, 116, 0.98), rgba(249, 115, 22, 0.95));
      }

      .forecaster-metric-track-split {
        display: flex;
        align-items: stretch;
      }

      .forecaster-metric-split {
        height: 100%;
        min-width: 0;
      }

      .forecaster-metric-track-units {
        display: grid;
        align-items: stretch;
        gap: 0.08rem;
        padding: 0.08rem;
      }

      .forecaster-metric-track-dot {
        display: flex;
        align-items: center;
        justify-content: center;
      }

      .forecaster-metric-dot {
        width: 0.58rem;
        height: 0.58rem;
        border-radius: 999px;
        box-shadow: 0 0 0 1px rgba(9, 18, 28, 0.26);
      }

      .forecaster-metric-dot.buy {
        background: radial-gradient(circle at 35% 35%, rgba(167, 243, 208, 0.98), rgba(34, 197, 94, 0.95));
      }

      .forecaster-metric-dot.sell {
        background: radial-gradient(circle at 35% 35%, rgba(254, 215, 170, 0.98), rgba(249, 115, 22, 0.95));
      }

      .forecaster-metric-dot.neutral {
        background: radial-gradient(circle at 35% 35%, rgba(216, 230, 241, 0.92), rgba(146, 171, 193, 0.8));
      }

      .forecaster-metric-unit {
        min-width: 0;
        border-radius: 999px;
        box-shadow: inset 0 0 0 1px rgba(9, 18, 28, 0.22);
      }

      .forecaster-metric-split.buy {
        background: linear-gradient(90deg, rgba(34, 197, 94, 0.7), rgba(34, 197, 94, 0.92));
      }

      .forecaster-metric-split.neutral {
        background: rgba(146, 171, 193, 0.32);
      }

      .forecaster-metric-split.sell {
        background: linear-gradient(90deg, rgba(249, 115, 22, 0.92), rgba(249, 115, 22, 0.7));
      }

      .forecaster-metric-unit.buy {
        background: linear-gradient(180deg, rgba(110, 231, 183, 0.95), rgba(34, 197, 94, 0.92));
      }

      .forecaster-metric-unit.neutral {
        background: rgba(146, 171, 193, 0.34);
      }

      .forecaster-metric-unit.sell {
        background: linear-gradient(180deg, rgba(253, 186, 116, 0.95), rgba(249, 115, 22, 0.92));
      }

      .forecaster-tooltip {
        position: absolute;
        left: 0;
        top: 0;
        width: min(24rem, calc(100% - 0.8rem));
        border: 1px solid rgba(127, 163, 188, 0.65);
        background: linear-gradient(180deg, rgba(5, 17, 28, 0.98), rgba(6, 14, 22, 0.98));
        color: #d8e9f7;
        font-size: 0.67rem;
        line-height: 1.3;
        border-radius: 2px;
        padding: 0.48rem 0.55rem;
        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45);
        pointer-events: none;
        white-space: normal;
        z-index: 8;
        opacity: 0;
        visibility: hidden;
        transform: translate3d(0, 0, 0);
      }

      .forecaster-tooltip[data-visible="true"] {
        opacity: 1;
        visibility: visible;
      }

      .forecaster-tooltip-head {
        display: flex;
        flex-direction: column;
        gap: 0.16rem;
        margin-bottom: 0.34rem;
      }

      .forecaster-tooltip-head .eyebrow {
        font-size: 0.58rem;
        color: #8fb1c9;
        text-transform: uppercase;
        letter-spacing: 0.06em;
      }

      .forecaster-tooltip-head .title-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.55rem;
      }

      .forecaster-tooltip-head .signal,
      .forecaster-tooltip-head .score {
        font-weight: 700;
      }

      .forecaster-tooltip-head .signal.tone-buy,
      .forecaster-tooltip-head .score.tone-buy,
      .forecaster-tooltip-split .tone-buy,
      .forecaster-tooltip-inline-split .tone-buy,
      .forecaster-tooltip-summary-row .symbol.tone-buy,
      .forecaster-tooltip-summary-row .value.tone-buy {
        color: #22c55e;
      }

      .forecaster-tooltip-head .signal.tone-sell,
      .forecaster-tooltip-head .score.tone-sell,
      .forecaster-tooltip-split .tone-sell,
      .forecaster-tooltip-inline-split .tone-sell,
      .forecaster-tooltip-summary-row .symbol.tone-sell,
      .forecaster-tooltip-summary-row .value.tone-sell {
        color: #f97316;
      }

      .forecaster-tooltip-head .signal.tone-neutral,
      .forecaster-tooltip-head .score.tone-neutral,
      .forecaster-tooltip-split .tone-neutral,
      .forecaster-tooltip-inline-split .tone-neutral,
      .forecaster-tooltip-summary-row .symbol.tone-neutral,
      .forecaster-tooltip-summary-row .value.tone-neutral {
        color: #9ab5c9;
      }

      .forecaster-tooltip-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 0.28rem 0.55rem;
        margin-bottom: 0.38rem;
        color: #9cb9cf;
      }

      .forecaster-tooltip-section {
        display: flex;
        flex-direction: column;
        gap: 0.22rem;
      }

      .forecaster-tooltip-section-title {
        font-size: 0.58rem;
        color: #8fb1c9;
        text-transform: uppercase;
        letter-spacing: 0.06em;
      }

      .forecaster-tooltip-summary-list,
      .forecaster-tooltip-detail-list {
        display: flex;
        flex-direction: column;
        gap: 0.16rem;
      }

      .forecaster-tooltip-summary-row {
        display: grid;
        grid-template-columns: minmax(2.8rem, auto) auto auto 1fr;
        gap: 0.42rem;
        align-items: baseline;
      }

      .forecaster-tooltip-summary-row .label {
        color: #d8e9f7;
        font-weight: 600;
      }

      .forecaster-tooltip-summary-row .symbol,
      .forecaster-tooltip-summary-row .value {
        font-variant-numeric: tabular-nums;
        font-weight: 700;
      }

      .forecaster-tooltip-summary-row .meta {
        color: #9cb9cf;
      }

      .forecaster-tooltip-inline-split,
      .forecaster-tooltip-split {
        display: inline-flex;
        align-items: center;
        gap: 0.38rem;
        font-variant-numeric: tabular-nums;
      }

      .forecaster-tooltip-copy {
        color: #a9c2d4;
      }

      .forecaster-tooltip-line {
        display: flex;
        align-items: baseline;
        gap: 0.42rem;
      }

      .forecaster-signal-bar {
        width: max-content;
        display: inline-grid;
        grid-template-columns: repeat(5, 0.34rem);
        gap: 0.12rem;
        padding: 0.06rem 0.08rem;
        border-radius: 999px;
        background: rgba(7, 17, 28, 0.84);
        box-shadow: inset 0 0 0 1px rgba(94, 123, 149, 0.34);
        align-items: center;
        transform: translateY(-0.02rem);
      }

      .forecaster-signal-bar .segment {
        height: 0.2rem;
        border-radius: 999px;
        background: rgba(54, 78, 101, 0.96);
        border: 1px solid rgba(138, 165, 189, 0.38);
        box-shadow: inset 0 0 0 1px rgba(6, 14, 22, 0.2);
      }

      .forecaster-signal-bar.buy .segment.is-active {
        background: rgba(34, 197, 94, 0.96);
        border-color: rgba(126, 231, 158, 0.96);
        box-shadow: 0 0 0 1px rgba(9, 29, 16, 0.22);
      }

      .forecaster-signal-bar.sell .segment.is-active {
        background: rgba(249, 115, 22, 0.96);
        border-color: rgba(253, 186, 116, 0.96);
        box-shadow: 0 0 0 1px rgba(38, 17, 5, 0.22);
      }

      .forecaster-signal-bar.neutral .segment.center.is-active {
        background: rgba(183, 205, 223, 0.96);
        border-color: rgba(216, 230, 241, 0.96);
        box-shadow: 0 0 0 1px rgba(13, 20, 28, 0.22);
      }

      .forecaster-tooltip-line .text {
        color: #d8e9f7;
        overflow-wrap: anywhere;
      }

      .forecaster-tooltip-empty {
        color: #8fb1c9;
      }

      .forecaster-head-help {
        width: 100%;
        border: 0;
        background: transparent;
        color: #d4e4f0;
        padding: 0;
        margin: 0;
        font: inherit;
        font-size: 0.76rem;
        font-weight: 700;
        display: inline-flex;
        align-items: center;
        justify-content: flex-start;
        gap: 0.22rem;
        cursor: pointer;
      }

      .forecaster-head-help:hover {
        color: #e9f5ff;
      }

      .forecaster-head-help .hint {
        width: 0.8rem;
        height: 0.8rem;
        border-radius: 999px;
        border: 1px solid rgba(138, 167, 190, 0.6);
        color: #9dbbd3;
        font-size: 0.58rem;
        line-height: 0.8rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
      }

      .forecaster-doc-modal {
        position: fixed;
        inset: 0;
        z-index: 120;
        display: none;
        align-items: center;
        justify-content: center;
        background: rgba(2, 8, 14, 0.74);
        padding: 1rem;
      }

      .forecaster-doc-modal[data-open="true"] {
        display: flex;
      }

      .forecaster-doc-card {
        width: min(960px, 96vw);
        max-height: 88vh;
        display: flex;
        flex-direction: column;
        border: 1px solid var(--stroke);
        border-radius: 2px;
        background: linear-gradient(180deg, #0b1a2a, #091523);
        box-shadow: 0 16px 40px rgba(0, 0, 0, 0.42);
        overflow: hidden;
      }

      .forecaster-doc-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.6rem;
        padding: 0.55rem 0.65rem;
        border-bottom: 1px solid var(--stroke-2);
        background: rgba(8, 23, 37, 0.78);
      }

      .forecaster-doc-title {
        font-size: 0.82rem;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: #cfe1ef;
      }

      .forecaster-doc-close {
        border: 1px solid var(--stroke);
        background: #10304a;
        color: #d4e8f7;
        border-radius: 2px;
        font-size: 0.68rem;
        padding: 0.22rem 0.42rem;
        cursor: pointer;
      }

      .forecaster-doc-body {
        padding: 0.62rem 0.68rem 0.8rem;
        overflow: auto;
        color: #c5d9e8;
        font-size: 0.76rem;
        line-height: 1.44;
      }

      .forecaster-doc-intro {
        color: #d5e8f6;
        margin-bottom: 0.62rem;
      }

      .forecaster-doc-section + .forecaster-doc-section {
        margin-top: 0.55rem;
      }

      .forecaster-doc-section h4 {
        margin: 0 0 0.26rem;
        font-size: 0.72rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        color: #9fc0d8;
      }

      .forecaster-doc-section ul {
        margin: 0;
        padding-left: 1rem;
      }

      .forecaster-doc-section li + li {
        margin-top: 0.2rem;
      }

      .admin-center-card {
        width: min(1320px, 96vw);
      }

      .account-password-card {
        width: min(34rem, 96vw);
      }

      .account-password-form {
        display: grid;
        gap: 0.7rem;
        margin-top: 0.8rem;
      }

      .admin-center-headline {
        color: #9db7cb;
        font-size: 0.74rem;
      }

      .admin-center-toolbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.6rem;
        margin-bottom: 0.72rem;
        flex-wrap: wrap;
      }

      .admin-center-meta {
        color: #8ea9bf;
        font-size: 0.7rem;
      }

      .admin-tab-content {
        display: grid;
        gap: 0.72rem;
      }

      .admin-summary-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        gap: 0.55rem;
      }

      .admin-summary-card {
        border: 1px solid var(--stroke-2);
        background: rgba(10, 22, 35, 0.9);
        border-radius: 2px;
        padding: 0.52rem 0.58rem;
        display: grid;
        gap: 0.14rem;
      }

      .admin-summary-card .label {
        display: block;
        font-size: 0.62rem;
        color: #8facbf;
        text-transform: uppercase;
        letter-spacing: 0.04em;
      }

      .admin-summary-card .value {
        font-size: 1.02rem;
        color: #edf5fb;
        font-weight: 700;
      }

      .admin-summary-card .meta {
        font-size: 0.68rem;
        color: #89a5ba;
      }

      .admin-panel {
        border: 1px solid var(--stroke-2);
        background: rgba(7, 18, 29, 0.82);
        border-radius: 2px;
        padding: 0.62rem 0.68rem;
      }

      .admin-panel-title {
        margin: 0 0 0.45rem;
        font-size: 0.76rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: #d6e8f5;
      }

      .admin-panel-copy {
        margin: 0;
        color: #9bb6ca;
        font-size: 0.73rem;
        line-height: 1.45;
      }

      .admin-list {
        margin: 0;
        padding-left: 1rem;
        display: grid;
        gap: 0.28rem;
        color: #cfe0ec;
        font-size: 0.74rem;
        line-height: 1.45;
      }

      .admin-list li::marker {
        color: #7eb7de;
      }

      .admin-table-wrap {
        border: 1px solid var(--stroke-2);
        background: rgba(7, 18, 29, 0.76);
        border-radius: 2px;
        overflow: auto;
      }

      .admin-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.72rem;
      }

      .admin-table th,
      .admin-table td {
        padding: 0.42rem 0.48rem;
        border-bottom: 1px solid var(--stroke-2);
        vertical-align: top;
        text-align: left;
      }

      .admin-table th {
        color: #a8c4d8;
        text-transform: uppercase;
        letter-spacing: 0.03em;
        font-size: 0.63rem;
        background: rgba(14, 31, 46, 0.82);
      }

      .admin-table tr:last-child td {
        border-bottom: none;
      }

      .admin-chip-row {
        display: flex;
        flex-wrap: wrap;
        gap: 0.35rem;
      }

      .admin-chip {
        border: 1px solid var(--stroke);
        background: rgba(11, 25, 39, 0.82);
        border-radius: 999px;
        padding: 0.15rem 0.44rem;
        font-size: 0.64rem;
        color: #c9dceb;
      }

      .admin-chip[data-tone="good"] {
        border-color: rgba(34, 197, 94, 0.45);
        color: #73e3a0;
      }

      .admin-chip[data-tone="warn"] {
        border-color: rgba(245, 158, 11, 0.45);
        color: #f7c56c;
      }

      .admin-chip[data-tone="bad"] {
        border-color: rgba(249, 115, 22, 0.45);
        color: #ffb071;
      }

      .admin-event {
        border: 1px solid var(--stroke-2);
        background: rgba(8, 20, 32, 0.72);
        border-radius: 2px;
        padding: 0.48rem 0.55rem;
        display: grid;
        gap: 0.18rem;
      }

      .admin-event-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        flex-wrap: wrap;
      }

      .admin-event-title {
        color: #e1edf7;
        font-size: 0.74rem;
        font-weight: 700;
      }

      .admin-event-meta {
        color: #8ea9be;
        font-size: 0.66rem;
      }

      .admin-event-message {
        color: #c6d9e8;
        font-size: 0.72rem;
        line-height: 1.4;
      }

      .admin-empty {
        color: #90aabd;
        font-size: 0.72rem;
      }

      .regime-body {
        display: flex;
        flex-direction: column;
        gap: 0.48rem;
        overflow: hidden;
        min-height: 0;
      }

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

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

      .regime-state-card,
      .regime-score-card,
      .regime-card,
      .regime-narrative,
      .regime-group {
        border: 1px solid rgba(123, 157, 182, 0.24);
        background: linear-gradient(180deg, rgba(8, 21, 34, 0.94), rgba(7, 17, 28, 0.96));
        border-radius: 3px;
      }

      .regime-state-card,
      .regime-score-card,
      .regime-card {
        --regime-tone-rgb: 148, 163, 184;
        --regime-tone-soft: 0.08;
        --regime-tone-border: 0.22;
        --regime-tone-ring: 0.08;
        --regime-tone-value: #e6eff7;
        --regime-tone-detail: #9cb1c4;
        --regime-tone-metric-bg: rgba(10, 20, 31, 0.78);
        --regime-tone-metric-border: rgba(148, 163, 184, 0.12);
        --regime-tone-metric-value: #e5edf4;
        --regime-tone-chip-bg: rgba(10, 21, 32, 0.92);
        --regime-tone-chip-border: rgba(148, 163, 184, 0.14);
        --regime-tone-chip-color: #a8bbcb;
        --regime-tone-fill-start: rgba(148, 163, 184, 0.22);
        --regime-tone-fill-end: rgba(148, 163, 184, 0.52);
        --regime-move-rgb: var(--regime-tone-rgb);
        --regime-move-value: var(--regime-tone-value);
        border-color: rgba(var(--regime-tone-rgb), var(--regime-tone-border));
        box-shadow: inset 0 0 0 1px rgba(var(--regime-tone-rgb), var(--regime-tone-ring));
        background:
          radial-gradient(circle at top right, rgba(var(--regime-tone-rgb), var(--regime-tone-soft)), rgba(var(--regime-tone-rgb), 0) 62%),
          linear-gradient(180deg, rgba(8, 21, 34, 0.94), rgba(7, 17, 28, 0.96));
      }

      .regime-state-card,
      .regime-score-card {
        padding: 0.42rem 0.46rem;
      }

      .regime-state-label-row,
      .regime-score-head,
      .regime-card-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 0.35rem;
      }

      .regime-state-label,
      .regime-score-label,
      .regime-card-label,
      .regime-group-title {
        color: #d5e6f2;
        font-size: 0.67rem;
        letter-spacing: 0.03em;
        text-transform: uppercase;
      }

      .regime-state-value,
      .regime-card-value {
        margin-top: 0.14rem;
        color: var(--regime-tone-value, #f2fbff);
        font-size: 0.9rem;
        font-weight: 700;
        font-variant-numeric: tabular-nums;
      }

      .regime-state-detail,
      .regime-card-text,
      .regime-score-meta span,
      .regime-group-subtitle,
      .regime-tab-verdict,
      .regime-meta-line {
        color: var(--regime-tone-detail, #93afc4);
        font-size: 0.67rem;
        line-height: 1.35;
      }

      .regime-headline-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        flex-wrap: wrap;
      }

      .regime-headline {
        color: #dff2ff;
        font-size: 0.8rem;
        line-height: 1.35;
      }

      .regime-tabs {
        display: flex;
        align-items: center;
        gap: 0.32rem;
        overflow-x: auto;
        padding-bottom: 0.06rem;
      }

      .regime-tab-btn {
        border: 1px solid rgba(123, 157, 182, 0.26);
        background: rgba(8, 21, 34, 0.72);
        color: #a9c4d8;
        border-radius: 999px;
        padding: 0.26rem 0.54rem;
        font-size: 0.66rem;
        white-space: nowrap;
        cursor: pointer;
      }

      .regime-tab-btn[data-active="true"] {
        color: #eef8ff;
        border-color: rgba(122, 187, 228, 0.52);
        background: linear-gradient(90deg, rgba(21, 74, 108, 0.9), rgba(13, 49, 74, 0.95));
        box-shadow: inset 0 0 0 1px rgba(122, 187, 228, 0.18);
      }

      .regime-tab-content {
        min-height: 0;
        overflow: auto;
        display: flex;
        flex-direction: column;
        gap: 0.42rem;
        padding-right: 0.05rem;
      }

      .regime-tab-header {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 0.45rem;
        flex-wrap: wrap;
      }

      .regime-tab-title {
        color: #dff3ff;
        font-size: 0.78rem;
      }

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

      .regime-score-track {
        position: relative;
        margin-top: 0.3rem;
        height: 0.5rem;
        border-radius: 999px;
        overflow: hidden;
        background: rgba(9, 24, 38, 0.9);
        border: 1px solid rgba(123, 157, 182, 0.18);
      }

      .regime-score-fill {
        position: absolute;
        inset: 0 auto 0 0;
        background: linear-gradient(90deg, var(--regime-tone-fill-start), var(--regime-tone-fill-end));
        opacity: var(--regime-fill-opacity, 0.82);
        box-shadow: 0 0 16px rgba(var(--regime-tone-rgb), 0.24);
      }

      .regime-score-meta {
        margin-top: 0.28rem;
        display: flex;
        justify-content: space-between;
        gap: 0.35rem;
      }

      .regime-score-meta strong {
        color: var(--regime-tone-value, #eff9ff);
        font-size: 0.82rem;
        font-variant-numeric: tabular-nums;
      }

      .regime-group {
        padding: 0.46rem 0.48rem 0.5rem;
      }

      .regime-group-head {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 0.45rem;
        flex-wrap: wrap;
        margin-bottom: 0.34rem;
      }

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

      .regime-card {
        position: relative;
        z-index: 0;
        overflow: visible;
        padding: 0.42rem 0.44rem;
        min-height: 9.6rem;
        display: flex;
        flex-direction: column;
        gap: 0.34rem;
      }

      .regime-card.has-spark-tooltip {
        z-index: 7;
      }

      .regime-card-unavailable {
        opacity: 0.82;
      }

      .regime-card-metrics {
        display: grid;
        grid-template-columns: repeat(var(--regime-card-metric-columns, 2), minmax(0, 1fr));
        gap: 0.28rem;
      }

      .regime-card-metric {
        display: flex;
        flex-direction: column;
        gap: 0.08rem;
        padding: 0.22rem 0.24rem;
        border-radius: 2px;
        background: var(--regime-tone-metric-bg, rgba(5, 15, 25, 0.72));
        border: 1px solid var(--regime-tone-metric-border, rgba(123, 157, 182, 0.14));
        cursor: pointer;
        appearance: none;
        text-align: left;
        transition:
          border-color 140ms ease,
          background 140ms ease,
          color 140ms ease,
          transform 140ms ease,
          box-shadow 140ms ease;
      }

      .regime-card-metric.regime-move-support,
      .regime-card-metric.regime-move-risk,
      .regime-card-metric.regime-move-neutral {
        border-color: rgba(var(--regime-move-rgb), 0.22);
        background:
          linear-gradient(180deg, rgba(var(--regime-move-rgb), 0.08), rgba(6, 16, 28, 0.08)),
          var(--regime-tone-metric-bg, rgba(5, 15, 25, 0.72));
      }

      .regime-card-metric:hover {
        border-color: rgba(var(--regime-move-rgb), 0.34);
      }

      .regime-card-metric:focus-visible {
        outline: none;
        border-color: rgba(var(--regime-move-rgb), 0.42);
        box-shadow: 0 0 0 1px rgba(var(--regime-move-rgb), 0.18);
      }

      .regime-card-metric.is-active {
        border-color: rgba(var(--regime-move-rgb), 0.52);
        background:
          linear-gradient(180deg, rgba(var(--regime-move-rgb), 0.14), rgba(6, 16, 28, 0.2)),
          var(--regime-tone-metric-bg, rgba(5, 15, 25, 0.72));
        transform: translateY(-1px);
      }

      .regime-card-metric-label {
        color: rgba(var(--regime-move-rgb), 0.86);
        font-size: 0.6rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
      }

      .regime-card-metric strong {
        color: var(--regime-move-value, var(--regime-tone-metric-value, #eaf7ff));
        font-size: 0.74rem;
        font-variant-numeric: tabular-nums;
      }

      .regime-card-foot {
        margin-top: auto;
        display: flex;
        gap: 0.25rem;
        flex-wrap: wrap;
      }

      .regime-card-series {
        position: relative;
        margin-top: 0.08rem;
        height: 3.35rem;
        overflow: visible;
      }

      .regime-card-series-frame {
        height: 100%;
        border-radius: 2px;
        overflow: hidden;
        border: 1px solid rgba(var(--regime-move-rgb), 0.16);
        background:
          linear-gradient(180deg, rgba(var(--regime-move-rgb), 0.05), rgba(9, 21, 34, 0.08)),
          rgba(7, 17, 28, 0.58);
      }

      .regime-card-series svg {
        width: 100%;
        height: 100%;
        display: block;
      }

      .regime-card-spark-grid line {
        stroke: rgba(var(--regime-move-rgb), 0.14);
        stroke-width: 1;
      }

      .regime-card-spark-area {
        fill: rgba(var(--regime-move-rgb), 0.18);
      }

      .regime-card-spark-line {
        fill: none;
        stroke: rgba(var(--regime-move-rgb), 0.92);
        stroke-width: 2.15;
        stroke-linecap: round;
        stroke-linejoin: round;
        filter: drop-shadow(0 0 10px rgba(var(--regime-move-rgb), 0.22));
      }

      .regime-card-spark-dot {
        fill: var(--regime-move-value, var(--regime-tone-value, #edf8ff));
        stroke: rgba(6, 17, 27, 0.95);
        stroke-width: 1.25;
      }

      .regime-card-spark-tooltip {
        position: absolute;
        left: 0;
        top: 0;
        transform: translate(-50%, -100%);
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        padding: 0.18rem 0.34rem;
        border-radius: 2px;
        border: 1px solid rgba(127, 163, 188, 0.55);
        background: rgba(5, 15, 25, 0.96);
        color: #dcebf8;
        font-size: 0.6rem;
        line-height: 1;
        white-space: nowrap;
        pointer-events: none;
        box-shadow: 0 8px 18px rgba(0, 0, 0, 0.32);
        opacity: 0;
        visibility: hidden;
        z-index: 12;
      }

      .regime-card-spark-tooltip[data-visible="true"] {
        opacity: 1;
        visibility: visible;
      }

      .regime-card-spark-tooltip.is-below {
        transform: translate(-50%, 0);
      }

      .regime-card-spark-tooltip-date {
        color: #9cb8cd;
        text-transform: uppercase;
        letter-spacing: 0.04em;
      }

      .regime-move-support {
        --regime-move-rgb: 34, 197, 94;
        --regime-move-value: #d4fbe1;
      }

      .regime-move-risk {
        --regime-move-rgb: 244, 63, 94;
        --regime-move-value: #ffd6df;
      }

      .regime-move-neutral {
        --regime-move-rgb: 148, 163, 184;
        --regime-move-value: #e2ebf4;
      }

      .regime-chip {
        display: inline-flex;
        align-items: center;
        gap: 0.18rem;
        padding: 0.12rem 0.26rem;
        border-radius: 999px;
        background: var(--regime-tone-chip-bg, rgba(9, 24, 38, 0.92));
        color: var(--regime-tone-chip-color, #8eaac0);
        border: 1px solid var(--regime-tone-chip-border, rgba(123, 157, 182, 0.14));
        font-size: 0.58rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
      }

      .regime-info-btn {
        width: 1rem;
        height: 1rem;
        border-radius: 999px;
        border: 1px solid rgba(138, 167, 190, 0.6);
        background: rgba(7, 23, 38, 0.82);
        color: #9dc0d8;
        font-size: 0.62rem;
        line-height: 1;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        flex: 0 0 auto;
      }

      .regime-info-btn:hover {
        color: #ecf8ff;
        border-color: rgba(162, 203, 230, 0.74);
      }

      .regime-narrative {
        padding: 0.48rem 0.5rem;
      }

      .regime-narrative-summary {
        color: #e1f3ff;
        font-size: 0.73rem;
        line-height: 1.45;
        margin-bottom: 0.45rem;
      }

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

      .regime-narrative-block h4 {
        margin: 0 0 0.22rem;
        color: #9fc3dc;
        font-size: 0.65rem;
        text-transform: uppercase;
        letter-spacing: 0.03em;
      }

      .regime-narrative-block ul {
        margin: 0;
        padding-left: 1rem;
        color: #a8c1d2;
        font-size: 0.68rem;
        line-height: 1.45;
      }

      .regime-empty {
        padding: 0.8rem 0.2rem;
        color: #95b2c8;
        font-size: 0.72rem;
      }

      .regime-tone-support {
        --regime-tone-rgb: 34, 197, 94;
        --regime-tone-soft: 0.15;
        --regime-tone-border: 0.26;
        --regime-tone-ring: 0.16;
        --regime-tone-value: #d4fbe1;
        --regime-tone-detail: #8fd2a9;
        --regime-tone-metric-bg: rgba(8, 28, 17, 0.8);
        --regime-tone-metric-border: rgba(34, 197, 94, 0.16);
        --regime-tone-metric-value: #e4fff0;
        --regime-tone-chip-bg: rgba(8, 30, 18, 0.88);
        --regime-tone-chip-border: rgba(34, 197, 94, 0.2);
        --regime-tone-chip-color: #97e0b1;
        --regime-tone-fill-start: rgba(34, 197, 94, 0.34);
        --regime-tone-fill-end: rgba(34, 197, 94, 0.96);
      }

      .regime-tone-warning {
        --regime-tone-rgb: 245, 158, 11;
        --regime-tone-soft: 0.16;
        --regime-tone-border: 0.26;
        --regime-tone-ring: 0.15;
        --regime-tone-value: #ffe4ba;
        --regime-tone-detail: #efb866;
        --regime-tone-metric-bg: rgba(34, 20, 6, 0.8);
        --regime-tone-metric-border: rgba(245, 158, 11, 0.18);
        --regime-tone-metric-value: #fff0d5;
        --regime-tone-chip-bg: rgba(38, 24, 8, 0.88);
        --regime-tone-chip-border: rgba(245, 158, 11, 0.2);
        --regime-tone-chip-color: #f6c47a;
        --regime-tone-fill-start: rgba(245, 158, 11, 0.4);
        --regime-tone-fill-end: rgba(249, 115, 22, 0.96);
      }

      .regime-tone-risk {
        --regime-tone-rgb: 244, 63, 94;
        --regime-tone-soft: 0.16;
        --regime-tone-border: 0.28;
        --regime-tone-ring: 0.18;
        --regime-tone-value: #ffd0d9;
        --regime-tone-detail: #f0a1b2;
        --regime-tone-metric-bg: rgba(38, 10, 18, 0.82);
        --regime-tone-metric-border: rgba(244, 63, 94, 0.18);
        --regime-tone-metric-value: #ffe6ec;
        --regime-tone-chip-bg: rgba(43, 10, 17, 0.9);
        --regime-tone-chip-border: rgba(244, 63, 94, 0.2);
        --regime-tone-chip-color: #f7a0b2;
        --regime-tone-fill-start: rgba(249, 115, 22, 0.46);
        --regime-tone-fill-end: rgba(244, 63, 94, 0.96);
      }

      .regime-tone-neutral {
        --regime-tone-rgb: 148, 163, 184;
        --regime-tone-soft: 0.09;
        --regime-tone-border: 0.22;
        --regime-tone-ring: 0.08;
        --regime-tone-value: #e2ebf4;
        --regime-tone-detail: #9eb2c4;
        --regime-tone-metric-bg: rgba(10, 20, 31, 0.78);
        --regime-tone-metric-border: rgba(148, 163, 184, 0.12);
        --regime-tone-metric-value: #e5edf4;
        --regime-tone-chip-bg: rgba(10, 21, 32, 0.92);
        --regime-tone-chip-border: rgba(148, 163, 184, 0.14);
        --regime-tone-chip-color: #a8bbcb;
        --regime-tone-fill-start: rgba(148, 163, 184, 0.24);
        --regime-tone-fill-end: rgba(148, 163, 184, 0.56);
      }

      .regime-tone-missing {
        --regime-tone-rgb: 100, 116, 139;
        --regime-tone-soft: 0.08;
        --regime-tone-border: 0.18;
        --regime-tone-ring: 0.08;
        --regime-tone-value: #c5d3de;
        --regime-tone-detail: #8fa0af;
        --regime-tone-metric-bg: rgba(11, 18, 27, 0.76);
        --regime-tone-metric-border: rgba(100, 116, 139, 0.14);
        --regime-tone-metric-value: #d8e1e9;
        --regime-tone-chip-bg: rgba(11, 18, 27, 0.88);
        --regime-tone-chip-border: rgba(100, 116, 139, 0.16);
        --regime-tone-chip-color: #97a8b8;
        --regime-tone-fill-start: rgba(100, 116, 139, 0.22);
        --regime-tone-fill-end: rgba(100, 116, 139, 0.46);
      }

      @media (max-width: 1100px) {
        .regime-summary,
        .regime-state-grid,
        .regime-score-grid,
        .regime-card-grid,
        .regime-narrative-grid {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
      }

      @media (max-width: 760px) {
        .regime-summary,
        .regime-state-grid,
        .regime-score-grid,
        .regime-card-grid,
        .regime-narrative-grid {
          grid-template-columns: 1fr;
        }
      }

      .volume-ls-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.24rem;
        flex: 0 0 auto;
      }

      .volume-ls-row {
        display: grid;
        grid-template-columns: 3.4rem minmax(0, 1fr);
        align-items: stretch;
        gap: 0.28rem;
        min-height: 1.72rem;
      }

      .volume-ls-label {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.68rem;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: #9db7cb;
        border: 1px solid var(--stroke-2);
        border-radius: 2px;
        background: rgba(9, 24, 38, 0.92);
      }

      .volume-ls-track {
        display: flex;
        width: 100%;
        border: 1px solid var(--stroke-2);
        border-radius: 2px;
        overflow: hidden;
        background: rgba(9, 24, 38, 0.92);
      }

      .volume-ls-segment {
        display: flex;
        align-items: center;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.01em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }

      .volume-ls-segment.long {
        justify-content: flex-start;
        padding-left: 0.42rem;
        background: linear-gradient(90deg, rgba(34, 197, 94, 0.72), rgba(34, 197, 94, 0.22));
        color: #d9f8e6;
      }

      .volume-ls-segment.short {
        justify-content: flex-end;
        padding-right: 0.42rem;
        background: linear-gradient(270deg, rgba(239, 68, 68, 0.72), rgba(239, 68, 68, 0.22));
        color: #ffe2e2;
      }

      .volume-exchanges-wrap {
        flex: 1 1 auto;
        min-height: 8.5rem;
        height: auto;
        max-height: none;
      }

      .widget[data-panel-id="volume"] .heatmap-head {
        flex: 0 0 auto;
      }

      .widget[data-panel-id="volume"] .heatmap-canvas-wrap {
        flex: 0 0 clamp(11rem, 30vh, 16rem);
        min-height: 11rem;
      }

      table {
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
        font-size: 0.79rem;
      }

      th,
      td {
        text-align: left;
        padding: 0.35rem 0.18rem;
        border-bottom: 1px solid var(--stroke-2);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }

      thead th {
        position: sticky;
        top: 0;
        background: #0b1927;
        z-index: 1;
      }

      .resize-handle {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 15px;
        height: 15px;
        cursor: nwse-resize;
        z-index: 6;
        pointer-events: auto;
        background:
          linear-gradient(135deg, transparent 55%, var(--muted) 56% 62%, transparent 63%),
          linear-gradient(135deg, transparent 72%, var(--muted) 73% 79%, transparent 80%);
        opacity: 0.65;
      }

      .widget[data-panel-id="chart"] .resize-handle {
        right: 2px;
        bottom: 2px;
        width: 18px;
        height: 18px;
        z-index: 12;
        opacity: 0.95;
        background-color: rgba(8, 24, 38, 0.72);
        border-top: 1px solid var(--stroke-2);
        border-left: 1px solid var(--stroke-2);
      }

      @media (max-width: 1280px) {
        .dashboard {
          grid-template-columns: repeat(8, minmax(0, 1fr));
        }
      }

      @media (max-width: 900px) {
        .topbar-settings-menu {
          min-width: min(94vw, 30rem);
        }

        .topline-right {
          width: 100%;
          justify-content: space-between;
        }

        .topbar-settings-menu .panel-visibility {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .dashboard {
          grid-template-columns: repeat(1, minmax(0, 1fr));
          grid-auto-rows: auto;
        }

        .widget {
          grid-column: 1 / -1 !important;
          grid-row: auto !important;
          min-height: 260px;
        }

        .resize-handle,
        .widget-head {
          cursor: default;
        }

        .widget-head {
          touch-action: auto;
        }

        .orderbook-grid {
          grid-template-columns: 1fr;
        }

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

        .strategy-tables {
          grid-template-columns: 1fr;
        }

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