:root { --ui-green:#075d3d; --ui-deep:#013825; --ui-paper:#f5f6f2; --ui-card:#fff; --ui-line:#e1e6df; --ui-muted:#647168; --ui-red:#de2b22; --ui-black:#161918; --ui-gold:#f0c52e; }
body.ui-redesign { background:var(--ui-paper); color:#15221a; }
body.ui-redesign > .app-shell { display:none; }
body.ui-redesign.live-mode-open > .app-shell { display:block; }
.ui-shell { min-height:100vh; padding:0 0 88px; background:linear-gradient(160deg,#f3f7f2 0,#fff 28%,#f5f6f2 100%); }
.ui-top { display:flex; align-items:center; justify-content:space-between; min-height:70px; padding:0 18px; color:#fff; background:linear-gradient(115deg,var(--ui-deep),var(--ui-green)); box-shadow:0 4px 14px rgba(2,56,37,.22); }
.ui-top h1 { margin:0; color:#fff; font-size:1.35rem; letter-spacing:.03em; }.ui-menu { border:0; padding:9px; color:#fff; background:transparent; font-size:1.45rem; line-height:1; }.ui-backup-badge { display:flex; align-items:center; gap:6px; font-size:.78rem; font-weight:800; }.ui-backup-badge.warning { color:#ffe089; }
.ui-page { display:none; max-width:1120px; margin:0 auto; padding:12px; }.ui-page.active { display:block; }.ui-page > * { margin-bottom:12px; }
.ui-overview { display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden; border:1px solid var(--ui-line); border-radius:17px; background:var(--ui-card); box-shadow:0 7px 20px rgba(20,48,31,.06); }.ui-overview div { min-width:0; padding:12px 10px; border-right:1px solid var(--ui-line); }.ui-overview div:last-child { border:0; }.ui-overview span,.ui-kicker { display:block; color:var(--ui-muted); font-size:.67rem; font-weight:800; }.ui-overview strong { display:block; overflow:hidden; margin-top:3px; font-size:1.06rem; text-overflow:ellipsis; white-space:nowrap; }.ui-overview time { display:block; margin-top:4px; font-size:.7rem; line-height:1.35; }
.ui-card { border:1px solid var(--ui-line); border-radius:17px; background:var(--ui-card); box-shadow:0 7px 20px rgba(20,48,31,.055); }.ui-card-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:14px 14px 10px; border-bottom:1px solid var(--ui-line); }.ui-card-head h2 { margin:0; font-size:1.12rem; }.ui-lock { padding:5px 8px; border-radius:7px; color:#226343; background:#e8f4eb; font-size:.7rem; font-weight:850; }.ui-lock.explore { color:#765013; background:#fff3d7; }
.ui-prediction { overflow:hidden; }.ui-empty { padding:28px 16px; color:var(--ui-muted); text-align:center; }.ui-empty strong { display:block; margin-bottom:5px; color:#243d2e; font-size:1.1rem; }.ui-wheel-grid { display:grid; grid-template-columns:minmax(280px,.95fr) minmax(250px,.75fr); gap:16px; padding:14px; }.ui-wheel-wrap { display:flex; flex-direction:column; align-items:center; min-width:0; }.ui-wheel { width:min(100%,390px); filter:drop-shadow(0 8px 12px rgba(1,56,37,.2)); }.wheel-number { font-family:Arial,sans-serif; font-size:10px; font-weight:800; text-anchor:middle; dominant-baseline:central; fill:#fff; }.wheel-number.zero { fill:#fff; }.wheel-center-label { fill:#fff; font-weight:800; text-anchor:middle; }.wheel-legend { display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:4px; color:var(--ui-muted); font-size:.68rem; }.wheel-dot { display:inline-block; width:9px; height:9px; margin-right:4px; border-radius:50%; background:var(--ui-gold); }.wheel-dot.normal { background:#125e42; }.wheel-dot.secondary { background:#78cf92; }
.ui-region { padding:14px; border:1px solid var(--ui-line); border-radius:13px; background:#fbfcfa; }.ui-region h3 { margin:0 0 11px; color:var(--ui-green); font-size:1rem; }.ui-region dl { margin:0; }.ui-region dl div { display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-top:1px solid var(--ui-line); }.ui-region dt { color:#36463b; font-size:.78rem; }.ui-region dd { margin:0; font-size:.83rem; font-weight:850; text-align:right; }.ui-cover { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0; }.ui-cover span { min-width:28px; padding:4px; border:1px solid #d7ddd7; border-radius:5px; background:#fff; font-size:.72rem; font-weight:800; text-align:center; }.ui-disagreement { margin:8px 0 0; color:var(--ui-muted); font-size:.73rem; }
.ui-recommend-row { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:12px; }.ui-recommend,.ui-facts,.ui-input-card,.ui-state-card,.ui-recent { padding:14px; }.ui-top-switch { display:flex; gap:6px; margin:10px 0; }.ui-top-switch button { min-width:39px; min-height:34px; padding:4px; border:1px solid #d4dbd4; border-radius:6px; color:#25382c; background:#fff; font-weight:800; }.ui-top-switch button.active { color:#fff; border-color:var(--ui-green); background:var(--ui-green); }.ui-balls { display:flex; flex-wrap:wrap; gap:12px; margin:15px 0 5px; }.ui-ball { display:grid; place-items:center; width:48px; height:48px; border-radius:50%; color:#fff; background:var(--ui-black); box-shadow:inset 0 -3px 0 rgba(0,0,0,.18); font-size:1.25rem; font-weight:900; }.ui-ball.red { background:var(--ui-red); }.ui-ball.zero { background:var(--ui-green); }.ui-facts dl { margin:0; }.ui-facts div { display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-bottom:1px solid var(--ui-line); font-size:.78rem; }.ui-facts div:last-child { border:0; }.ui-facts dt { color:#536157; }.ui-facts dd { margin:0; font-weight:900; }.ui-facts .no-bet { color:#d3751f; }.ui-input-row { display:flex; gap:9px; margin-top:10px; }.ui-input-row form { display:contents; }.ui-input-row input { flex:1; min-width:0; min-height:52px; border:1px solid #aeb9b0; border-radius:8px; font-size:1.35rem; font-weight:800; text-align:center; }.ui-input-row button { min-width:128px; min-height:52px; border:0; border-radius:8px; color:#fff; background:var(--ui-green); font-size:1rem; font-weight:900; }.ui-input-card #form-message { margin:8px 0 0; }.ui-state-line { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }.ui-state-line strong { font-size:1rem; }.ui-chip { padding:5px 8px; border-radius:7px; color:#285841; background:#e9f3e9; font-size:.72rem; font-weight:800; }
.ui-recent-head { display:flex; justify-content:space-between; gap:8px; align-items:center; }.ui-recent-head h2 { margin:0; font-size:1rem; }.ui-recent-grid { display:grid; grid-template-columns:repeat(10,1fr); gap:8px; margin-top:12px; }.ui-recent-grid .ui-ball { width:100%; aspect-ratio:1; height:auto; min-width:0; font-size:.95rem; }.ui-streak-meta { display:flex; flex-wrap:wrap; gap:10px; margin:11px 0 0; color:#3b4e42; font-size:.74rem; }
.ui-nav { position:fixed; z-index:20; bottom:0; left:0; right:0; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #dce4dd; background:rgba(255,255,255,.97); box-shadow:0 -7px 18px rgba(17,42,27,.08); backdrop-filter:blur(10px); }.ui-nav button { min-height:64px; border:0; color:#5d6a62; background:transparent; font-size:.72rem; font-weight:800; }.ui-nav button::before { display:block; margin-bottom:4px; font-size:1.3rem; content:attr(data-icon); }.ui-nav button.active { color:var(--ui-green); }
.ui-page-title { margin:8px 0 12px; color:var(--ui-deep); font-size:1.28rem; }.ui-accordion { overflow:hidden; margin-bottom:10px; border:1px solid var(--ui-line); border-radius:13px; background:#fff; }.ui-accordion summary { display:flex; align-items:center; min-height:54px; padding:0 14px; cursor:pointer; color:#163826; font-weight:900; list-style:none; }.ui-accordion summary::after { margin-left:auto; content:'⌄'; font-size:1.15rem; }.ui-accordion[open] summary { border-bottom:1px solid var(--ui-line); }.ui-accordion[open] summary::after { transform:rotate(180deg); }.ui-legacy-slot { padding:10px; }.ui-legacy-slot > section,.ui-legacy-slot > .dashboard,.ui-legacy-slot > .summary-grid { margin:0; }.ui-legacy-slot .backtest-intro .section-label,.ui-legacy-slot > section > .backtest-intro .section-label { display:none; }.ui-page-manage .dataset-card,.ui-page-manage .segment-card,.ui-page-manage .synthetic-test-card,.ui-page-settings .data-card,.ui-page-settings .checkpoint-card { margin:0; }.ui-page-manage .dataset-card,.ui-page-manage .segment-card,.ui-page-settings .data-card,.ui-page-settings .checkpoint-card { box-shadow:none; }.ui-page-settings .checkpoint-panel { margin:0; }.ui-page-settings #restore-diagnostics { margin:0; }.ui-page-settings .deployment-readiness { margin-top:10px; }
@media (max-width:620px) { .ui-wheel-grid,.ui-recommend-row { grid-template-columns:1fr; }.ui-facts { display:none; }.ui-overview { grid-template-columns:repeat(2,1fr); }.ui-overview div:nth-child(2) { border-right:0; }.ui-overview div:nth-child(-n+2) { border-bottom:1px solid var(--ui-line); }.ui-page { padding:10px; }.ui-wheel-grid { padding:10px; }.ui-region { padding:12px; }.ui-recent-grid { gap:6px; }.ui-balls { gap:10px; }.ui-ball { width:45px; height:45px; }.ui-top { min-height:62px; }.ui-top h1 { font-size:1.25rem; } }
@media (max-width:370px) { .ui-recent-grid { gap:4px; }.ui-recent-grid .ui-ball { font-size:.82rem; }.ui-input-row button { min-width:106px; }.ui-overview strong { font-size:.95rem; } }
