:root{
  --bg:#b7b7b7;
  --panel-bg:#c1c1c1;
  --panel-border:#9f9f9f;
  --text:#111;
  --muted:#4a4a4a;
  --good:#179247;
  --bad:#c23b2e;
  --btc:#f7931a;
  --eth:#627eea;
  --sol:#14a06f;
  --font-title:"DM Sans",system-ui,sans-serif;
}
*{box-sizing:border-box;min-width:0}
html,body{overflow-x:hidden}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-title)}
.wrap{width:100%;max-width:1360px;margin:0 auto;padding:8px}

header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:4px 6px;margin-bottom:8px}
.header-left{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.brand-title{font-size:13px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;line-height:1.2}
.brand-link{display:inline-block;padding:1px 4px;border-radius:3px;color:#444;text-decoration:none}
.brand-link:hover{background:#000;color:#fff;text-decoration:none}
.top-nav{display:flex;align-items:center;gap:5px}
.nav-link{display:inline-flex;align-items:center;justify-content:center;height:19px;padding:0 7px;border-radius:4px;background:#000;color:#fff;text-decoration:none;font-size:11px;line-height:1;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.nav-link.app-back{width:19px;min-width:19px;padding:0;background:#c8c8c8;color:#111;font-size:13px;font-weight:900;text-shadow:.35px 0 currentColor,-.35px 0 currentColor}
.nav-link.app-back:hover{background:#000;color:#fff}
.header-right{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.meta-chip{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:24px;padding:0 8px;border-radius:4px;border:1px solid rgba(0,0,0,.12);background:#c8c8c8;color:#222;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
button.meta-chip{cursor:pointer;font-family:inherit}
.meta-chip.active,button.meta-chip:hover{background:#000;color:#fff}
.status-pill{width:24px;padding:0}
.status-dot{width:8px;height:8px;border-radius:999px;background:#d61f1f;box-shadow:0 0 0 1px rgba(0,0,0,.18),0 0 10px rgba(214,31,31,.25)}
.status-pill.is-active .status-dot{background:var(--good);box-shadow:0 0 0 1px rgba(0,0,0,.18),0 0 10px rgba(23,146,71,.25)}

main{display:grid;gap:8px}
.hero-panel,.info-block,.chart-panel,.asset-card{
  background:var(--panel-bg);
  border:1px solid var(--panel-border);
  border-radius:4px;
}
.hero-panel{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:10px 12px}
.info-main-title{font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.panel-subtitle{margin-top:2px;font-size:11px;line-height:1.35;color:var(--muted)}
.hero-total{text-align:right}
.hero-total span{display:block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.hero-total strong{display:block;font-size:26px;line-height:1.05;letter-spacing:-.04em}

.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.asset-card{display:flex;align-items:center;gap:10px;padding:10px;background:#b0b0b0}
.asset-icon{width:28px;height:28px;flex:0 0 28px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden}
.asset-icon svg{display:block;width:28px;height:28px;max-width:28px;max-height:28px}
.asset-main{flex:1 1 auto;min-width:0}
.asset-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:5px}
.asset-name{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.asset-pill{display:inline-flex;align-items:center;gap:4px;min-height:18px;padding:2px 7px;border-radius:999px;background:rgba(0,0,0,.08);font-size:10px;font-weight:700;white-space:nowrap;line-height:1}
.asset-pill-icon{width:12px;height:12px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 12px}
.asset-pill-icon svg,.asset-pill-icon .tiny-svg{display:block;width:12px!important;height:12px!important;max-width:12px!important;max-height:12px!important}
.asset-pill.btc{background:rgba(247,147,26,.22);color:#7a4300}
.asset-pill.eth{background:rgba(98,126,234,.18);color:#233b91}
.asset-pill.sol{background:rgba(20,241,149,.18);color:#0d6d49}
.asset-meta{display:flex;gap:5px;flex-wrap:wrap;font-size:11px;color:#2a2a2a}
.asset-value{flex:0 0 auto;min-width:112px;margin-left:auto;text-align:right;font-size:clamp(10px,1vw,12px);font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.asset-value small{display:block;font-size:10px;color:var(--muted);font-weight:600}

.chart-panel{padding:10px}
.daily-chart-head{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-bottom:8px}
.daily-chart-legend{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px 9px}
.daily-chart-legend-item{display:inline-flex;align-items:center;gap:5px;font-size:10px;color:#2a2a2a}
.daily-chart-legend-swatch{width:16px;height:3px;border-radius:999px;background:#111}
.daily-chart-legend-swatch.pessimistic{background:var(--bad)}
.daily-chart-legend-swatch.realistic{background:#111}
.daily-chart-legend-swatch.optimistic{background:var(--good)}
.scenario-tabs{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:8px}
.scenario-tabs button{height:24px;border:1px solid rgba(0,0,0,.12);border-radius:4px;background:#c8c8c8;color:#222;padding:0 8px;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.scenario-tabs button.active,.scenario-tabs button:hover{background:#000;color:#fff}
.scenario-chart{width:100%;max-width:1000px;aspect-ratio:3/1;margin:0 auto;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.22) 0%,rgba(255,255,255,.02) 100%),linear-gradient(180deg,#c9c9c9 0%,#bbbbbb 100%);border:1px solid rgba(0,0,0,.14);border-radius:6px;padding:0;display:flex;align-items:center;justify-content:center}
.scenario-chart svg{display:block;width:100%;height:100%;overflow:hidden}
.chart-grid-line{stroke:rgba(0,0,0,.16);stroke-width:1}
.chart-axis-label{font-size:9px;fill:#464646;font-weight:600}
.chart-phase-label{font-size:8px;fill:#262626;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.chart-line{fill:none;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.chart-line.pessimistic{stroke:var(--bad)}
.chart-line.realistic{stroke:#111}
.chart-line.optimistic{stroke:var(--good)}
.chart-line.dim{opacity:.62;stroke-width:3.2}
.chart-point{stroke:#c9c9c9;stroke-width:1.5}
.chart-point.pessimistic{fill:var(--bad)}
.chart-point.realistic{fill:#111}
.chart-point.optimistic{fill:var(--good)}
.chart-hit{fill:transparent;stroke:none;pointer-events:none;cursor:default}
.chart-tooltip{display:none}
.chart-year-hit{fill:transparent;stroke:none;pointer-events:all;cursor:default}
.chart-year-tooltip{opacity:0;pointer-events:none;transition:opacity .12s ease}
.chart-year-hover:hover .chart-year-tooltip{opacity:1}
.chart-value-pill{fill:#111;opacity:.94}
.chart-value-text{fill:#fff;font-size:8px;font-weight:700}

.projection-section{padding:10px}
.projection-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start;margin-bottom:8px}
.projection-table{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(5,auto);grid-auto-flow:column;gap:5px}
.projection-row{display:grid;grid-template-columns:42px minmax(0,1fr) 104px 72px;gap:8px;align-items:center;padding:8px;background:rgba(255,255,255,.12);border:1px solid rgba(0,0,0,.06);border-radius:4px;font-size:11px}
.projection-row.phase-accumulation{background:rgba(230,230,230,.44)}
.projection-row.phase-expansion{background:rgba(215,234,223,.54)}
.projection-row.phase-distribution{background:rgba(234,223,202,.54)}
.projection-row.phase-capitulation{background:rgba(234,212,208,.54)}
.projection-row.phase-recovery{background:rgba(215,225,234,.58)}
.projection-row .phase{color:var(--muted)}
.projection-row strong{text-align:right}
.projection-row .gain{text-align:right;font-weight:700}
.projection-row.is-target{background:rgba(0,0,0,.075);border-color:rgba(0,0,0,.13)}
.analysis{display:grid;grid-template-columns:repeat(4,auto);gap:5px;align-items:start}
.analysis p{margin:0;min-width:88px;padding:7px 8px;background:rgba(255,255,255,.14);border:1px solid rgba(0,0,0,.06);border-radius:4px;font-size:10px;line-height:1.25;color:#2a2a2a}
.analysis span{display:block;margin-bottom:2px;color:var(--muted);font-size:9px;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.analysis b{display:block;color:#000;font-size:12px;line-height:1.1}
@media(max-width:880px){
  .portfolio-grid{grid-template-columns:1fr}
  .projection-table{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row}
  .projection-head{grid-template-columns:1fr}
  .analysis{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:560px){
  .wrap{padding:8px}
  header{gap:10px}
  .header-right{max-width:116px}
  .hero-panel{align-items:flex-start;flex-direction:column}
  .hero-total{text-align:left}
  .daily-chart-head{align-items:flex-start;flex-direction:column}
  .daily-chart-legend{justify-content:flex-start}
  .scenario-tabs button{flex:1}
  .asset-card{align-items:flex-start}
  .asset-value{width:calc(100% - 38px);min-width:0;text-align:left;margin-left:38px}
  .projection-row{grid-template-columns:40px 1fr 88px}
  .projection-row .gain{display:none}
  .analysis{grid-template-columns:1fr 1fr}
}
