/* === X-Tweet Market Page === */

/* Color tokens: dark (default) / light overrides */
:root {
  --xtm-actual: #ff9d2e;
  --xtm-expected: #8b949e;
  --xtm-cell-border: rgba(255,255,255,0.04);
  --xtm-hover-bg: rgba(255,255,255,0.02);
  --xtm-row-border: rgba(255,255,255,0.04);
}
html.light {
  --xtm-actual: #b45600;
  --xtm-expected: #4a4f57;
  --xtm-cell-border: rgba(0,0,0,0.04);
  --xtm-hover-bg: rgba(0,0,0,0.02);
  --xtm-row-border: rgba(0,0,0,0.04);
}

/* Person selector */
.person-selector { display:flex; align-items:center; gap:6px; margin-bottom:1.5rem; flex-wrap:wrap; }
.person-btn { background:none; border:1px solid var(--border); color:var(--text-dim); font-family:var(--font-ui); font-size:0.78rem; font-weight:600; padding:6px 14px; cursor:pointer; border-radius:20px; transition:all 0.15s; }
.person-btn:hover { border-color:var(--accent); color:var(--accent); }
.person-btn.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.person-btn:active { transform:scale(0.96); }

/* Market selector */
.market-selector { margin-bottom:1rem; min-height:160px; }
.market-header { display:flex; align-items:center; gap:12px; margin-bottom:0.75rem; min-height:42px; }
.market-title { font-size:1.05rem; font-weight:700; color:var(--text); line-height:1.3; min-height:42px; }
.market-title .market-cat { display:block; font-size:0.72rem; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.05em; margin-bottom:2px; }
.market-cycles { display:flex; align-items:center; gap:8px; margin-bottom:1rem; min-height:36px; }
.market-cycle-btn { background:none; border:1px solid var(--border); color:var(--text-dim); font-family:var(--font-ui); font-size:0.8rem; font-weight:600; padding:6px 16px; cursor:pointer; border-radius:20px; transition:all 0.15s; white-space:nowrap; flex-shrink:0; }
.market-cycle-btn:hover { border-color:var(--accent); color:var(--accent); }
.market-cycle-btn:active { transform:scale(0.96); }
.market-cycle-btn.active { background:var(--text); color:var(--bg2); border-color:var(--text); }
.market-past-wrap { position:relative; }
.market-past-btn { background:none; border:1px solid var(--border); color:var(--text-dim); font-family:var(--font-ui); font-size:0.8rem; font-weight:600; padding:6px 16px; cursor:pointer; border-radius:20px; white-space:nowrap; flex-shrink:0; }
.market-past-btn:hover { border-color:var(--accent); color:var(--accent); }
.market-past-dropdown { display:none; position:absolute; top:100%; left:0; background:var(--bg2); border:1px solid var(--border); border-radius:8px; padding:4px 0; min-width:140px; box-shadow:0 4px 12px rgba(0,0,0,0.08); z-index:20; }
.market-past-dropdown.open { display:block; }
.market-past-item { display:block; width:100%; background:none; border:none; text-align:left; padding:8px 14px; font-family:var(--font-ui); font-size:0.75rem; font-weight:500; color:var(--text-dim); cursor:pointer; white-space:nowrap; }
.market-past-item:hover { background:var(--xtm-hover-bg); color:var(--text); }

/* Stats bar */
.market-stats { border:1px solid var(--border); background:var(--bg2); padding:1.1rem 1.4rem; min-height:60px; }
.market-stats-top { display:grid; grid-template-columns:320px 1fr auto; align-items:center; position:relative; }
.market-tweet-count { display:flex; align-items:center; gap:5px; }
.market-tweet-label { font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--accent); display:flex; align-items:center; gap:5px; margin-right:8px; white-space:nowrap; }
.market-tweet-label::before { content:''; display:inline-block; width:7px; height:7px; background:var(--accent); border-radius:50%; }
.market-tweet-val { font-size:1.5rem; font-weight:800; color:var(--xtm-actual); line-height:1; letter-spacing:-0.02em; font-variant-numeric:tabular-nums; text-align:right; min-width:4ch; }
.market-tweet-slash { font-size:1rem; font-weight:500; color:var(--text-muted); margin:0 3px; }
.market-tweet-exp { font-size:1.25rem; font-weight:700; color:var(--xtm-expected); font-variant-numeric:tabular-nums; min-width:7ch; }
.tweet-info-btn { background:none; border:1px solid var(--border); border-radius:50%; font-size:0.65rem; color:var(--text-muted); cursor:pointer; width:18px; height:18px; display:inline-flex; align-items:center; justify-content:center; opacity:0.6; transition:opacity 0.15s; vertical-align:middle; margin-left:4px; }
.tweet-info-btn:hover { opacity:1; border-color:var(--accent); color:var(--accent); }
.tweet-info-tooltip { display:none; position:absolute; top:calc(100% + 8px); left:0; background:var(--bg2); border:1px solid var(--border); border-radius:10px; padding:14px 18px; font-size:0.73rem; line-height:1.5; color:var(--text-dim); width:280px; box-shadow:0 8px 24px rgba(0,0,0,0.15); z-index:30; }
.tweet-info-tooltip.open { display:block; }
.tip-row { display:flex; align-items:flex-start; gap:8px; margin-bottom:6px; }
.tip-row:last-child { margin-bottom:0; }
.tip-num { font-weight:800; font-size:0.82rem; min-width:18px; flex-shrink:0; }
.market-time-left { display:flex; align-items:center; gap:14px; justify-self:end; min-width:180px; justify-content:flex-end; }
.market-time-label { font-size:0.8rem; color:var(--text-muted); font-weight:500; }
.market-time-compact { font-size:0.95rem; font-weight:700; color:var(--text); letter-spacing:0.01em; font-variant-numeric:tabular-nums; min-width:11ch; text-align:right; }

/* Activity Scale */
.activity-scale { display:flex; align-items:center; gap:8px; justify-self:center; }
.activity-blocks { display:flex; align-items:center; gap:2px; position:relative; }
.activity-block { width:12px; height:16px; border-radius:2px; }
.activity-marker { position:absolute; top:-4px; width:2px; height:24px; background:var(--text); border-radius:1px; }
.activity-val { font-size:1.2rem; font-weight:800; color:var(--xtm-expected); line-height:1; font-variant-numeric:tabular-nums; min-width:2ch; text-align:right; }
.activity-unit { font-size:0.85rem; font-weight:600; color:var(--xtm-expected); margin-left:1px; }

/* Activity Scale */

/* Telegram CTA */
.tg-cta { display:flex; align-items:center; gap:12px; border:1px solid var(--accent-border); background:rgba(224,120,0,0.03); padding:12px 1.2rem; margin-bottom:1rem; cursor:pointer; transition:background 0.15s; min-height:52px; }
.tg-cta:hover { background:rgba(224,120,0,0.06); }
.tg-cta-icon { flex-shrink:0; width:28px; height:28px; color:var(--accent); }
.tg-cta-text { flex:1; text-align:center; }
.tg-cta-title { font-size:0.88rem; font-weight:700; color:var(--text); }
.tg-cta-sub { font-size:0.68rem; color:var(--text-dim); margin-top:3px; }
.tg-cta-btn { background:var(--accent); color:#fff; border:none; font-family:var(--font-ui); font-size:0.72rem; font-weight:700; padding:7px 16px; border-radius:6px; cursor:pointer; white-space:nowrap; transition:opacity 0.15s; }
.tg-cta-btn:hover { opacity:0.85; }

/* Market Brackets */
.brackets-wrap { border:1px solid var(--border); background:var(--bg2); margin-top:0.25rem; margin-bottom:1rem; min-height:336px; }
.brackets-header { display:flex; align-items:center; justify-content:space-between; padding:0.7rem 1.2rem; border-bottom:1px solid var(--border); }
.brackets-title { font-family:var(--font-display); font-size:0.95rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--accent); }
.brackets-title .sub { font-weight:400; font-size:0.78rem; color:var(--text-muted); text-transform:none; letter-spacing:0; }
.brackets-count { font-size:0.72rem; font-weight:600; color:var(--text-muted); }
.brackets-list { max-height:288px; overflow-y:auto; }
.brackets-list::-webkit-scrollbar { width:4px; }
.brackets-list::-webkit-scrollbar-track { background:transparent; }
.brackets-list::-webkit-scrollbar-thumb { background:var(--border); border-radius:2px; }
.bracket-row {
  display:flex; align-items:center; gap:20px;
  height:42px; padding:0 1.2rem; border-bottom:1px solid var(--xtm-cell-border);
  font-size:0.82rem; transition:background 0.15s;
}
.bracket-row:last-child { border-bottom:none; }
.bracket-row:hover { background:var(--xtm-hover-bg); }
.bracket-row.target { border:1px solid var(--accent-border); background:rgba(224,120,0,0.03); border-left:3px solid var(--accent); padding-left:calc(1.2rem - 3px); }
.bracket-tag { font-size:0.78rem; font-weight:700; padding:4px 12px; border-radius:12px; white-space:nowrap; letter-spacing:0.03em; }
.bracket-tag.tag-target { color:var(--accent); background:rgba(224,120,0,0.08); border:1px solid var(--accent-border); margin-left:auto; min-width:70px; text-align:center; }
.bracket-tag.tag-potential, .bracket-tag.tag-decline { margin-left:8px; display:flex; align-items:center; gap:6px; min-width:110px; }
.bracket-tag.tag-potential { color:#2d6abf; background:rgba(45,106,191,0.06); border:1px solid rgba(45,106,191,0.18); }
.bracket-tag.tag-potential .pot-val { font-weight:800; }
.bracket-tag.tag-potential .pot-time { color:rgba(45,106,191,0.55); font-weight:600; }
.bracket-tag.tag-decline { color:#a84040; background:rgba(168,64,64,0.06); border:1px solid rgba(168,64,64,0.18); display:flex; align-items:center; gap:6px; }
.bracket-tag.tag-decline .pot-val { font-weight:800; }
.bracket-tag.tag-decline .pot-time { color:rgba(168,64,64,0.50); font-weight:600; }
.bracket-range { font-weight:700; color:var(--text); min-width:62px; }
.bracket-vol { font-size:0.72rem; font-weight:500; color:var(--text-muted); min-width:58px; }
.bracket-pct { font-weight:800; font-size:0.95rem; color:var(--text); min-width:36px; margin-left:28px; }
.bracket-change { font-size:0.68rem; font-weight:700; min-width:40px; }
.bracket-change.down { color:var(--red); }
.bracket-change.up { color:var(--green); }
.bracket-prices { margin-left:auto; display:flex; gap:8px; flex-shrink:0; }
.bracket-price { font-size:0.75rem; font-weight:600; padding:4px 0; border-radius:4px; width:90px; text-align:center; font-variant-numeric:tabular-nums; }
.bracket-price.yes { color:var(--green); background:rgba(26,127,55,0.06); border:1px solid rgba(26,127,55,0.15); }
.bracket-price.no { color:var(--red); background:rgba(207,34,46,0.06); border:1px solid rgba(207,34,46,0.15); }

/* Model Performance */
.perf-wrap { border:1px solid var(--border); background:var(--bg2); margin-top:1rem; margin-bottom:1rem; }
.perf-header { display:flex; align-items:center; justify-content:space-between; padding:0.7rem 1.2rem; border-bottom:1px solid var(--border); }
.perf-title { font-family:var(--font-display); font-size:0.95rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--accent); }
.perf-title .sub { font-weight:400; font-size:0.78rem; color:var(--text-muted); text-transform:none; letter-spacing:0; }
.perf-badge { font-size:0.78rem; font-weight:700; padding:4px 12px; border-radius:12px; }
.perf-badge.good { color:var(--green); background:rgba(26,127,55,0.08); border:1px solid rgba(26,127,55,0.18); }
.perf-badge.poor { color:var(--red); background:rgba(207,34,46,0.08); border:1px solid rgba(207,34,46,0.18); }
.perf-row { display:flex; align-items:center; height:36px; padding:0 1.2rem; border-bottom:1px solid var(--xtm-cell-border); font-size:0.82rem; transition:background 0.15s; cursor:pointer; }
.perf-row:last-child { border-bottom:none; }
.perf-row:hover { background:var(--xtm-hover-bg); }
.perf-row .perf-arrow { display:inline-block; width:0; height:0; border-top:4px solid transparent; border-bottom:4px solid transparent; border-left:6px solid var(--text-muted); margin-right:10px; transition:transform 0.2s; flex-shrink:0; }
.perf-row.open .perf-arrow { transform:rotate(90deg); }
.perf-detail { display:none; padding:0.8rem 1.2rem 0.8rem 2.2rem; border-bottom:1px solid var(--xtm-cell-border); font-size:0.75rem; color:var(--text-dim); line-height:1.6; background:var(--xtm-hover-bg); }
.perf-detail.open { display:block; }
.perf-detail span { color:var(--text); font-weight:600; }
.perf-label { flex:1; font-weight:600; color:var(--text); }
.perf-user { min-width:60px; font-size:0.72rem; color:var(--text-muted); font-weight:500; }
.perf-pred { min-width:65px; text-align:right; color:var(--xtm-expected); font-variant-numeric:tabular-nums; font-weight:600; }
.perf-actual { min-width:65px; text-align:right; color:var(--xtm-actual); font-variant-numeric:tabular-nums; font-weight:700; }
.perf-error { min-width:55px; text-align:right; font-weight:700; font-variant-numeric:tabular-nums; }
.perf-hit { color:var(--green); }
.perf-miss { color:var(--red); }

/* Heatmap */
.heatmap-wrap { border:1px solid var(--border); background:var(--bg2); }
.heatmap-controls { display:flex; align-items:center; gap:8px; }
.week-nav { display:flex; align-items:center; gap:6px; }
.week-nav-btn { background:none; border:1px solid var(--border); color:var(--text-dim); font-size:0.82rem; width:28px; height:28px; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:color 0.15s,border-color 0.15s; }
.week-nav-btn:hover { color:var(--accent); border-color:var(--accent); }
.week-label { font-size:0.75rem; font-weight:600; color:var(--text-dim); white-space:nowrap; }
.heatmap-header { display:flex; align-items:center; justify-content:space-between; padding:0.85rem 1.2rem; border-bottom:1px solid var(--border); }
.heatmap-title { font-family:var(--font-display); font-size:0.95rem; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--accent); }
.heatmap-title .sub { font-weight:400; font-size:0.78rem; color:var(--text-muted); text-transform:none; letter-spacing:0; }
.heatmap-btn { background:none; border:1px solid var(--border); color:var(--text-dim); font-family:var(--font-ui); font-size:0.78rem; font-weight:600; padding:4px 12px; cursor:pointer; }

.heatmap-grid-wrap { position:relative; overflow-x:auto; -webkit-overflow-scrolling:touch; cursor:grab; }
.heatmap-grid { display:grid; grid-template-columns:68px repeat(var(--hm-cols,7),1fr) 54px; font-size:0.82rem; font-weight:500; min-width:680px; }

.hm-corner { padding:12px 4px; text-align:center; color:var(--text-muted); font-size:0.72rem; font-weight:600; text-transform:uppercase; border-bottom:1px solid var(--border); position:sticky; left:0; z-index:4; background:var(--bg2); }
.hm-day-header { padding:12px 4px; text-align:center; border-bottom:1px solid var(--border); font-weight:700; font-size:0.82rem; }
.hm-day-header .date { display:block; font-size:0.7rem; font-weight:500; color:var(--text-muted); }
.hm-day-header.today { color:var(--accent); }
.hm-sum-header { padding:12px 4px; text-align:center; color:var(--text-muted); font-size:0.78rem; font-weight:700; border-bottom:1px solid var(--border); }

.hm-hour { padding:0 10px; text-align:right; color:var(--text-dim); font-size:0.78rem; font-weight:600; font-variant-numeric:tabular-nums; border-bottom:1px solid var(--xtm-cell-border); display:flex; align-items:center; justify-content:flex-end; height:36px; position:sticky; left:0; z-index:4; background:var(--bg2); }
.hm-hour.current { color:var(--accent); font-weight:700; font-size:0.76rem; }

.hm-cell {
  padding:0; text-align:center; font-variant-numeric:tabular-nums;
  border-bottom:1px solid var(--xtm-cell-border); border-left:1px solid var(--xtm-cell-border);
  position:relative; cursor:default; height:36px;
  display:flex; align-items:center; justify-content:center; gap:0;
  font-size:0.82rem; font-weight:700; transition:transform 0.15s ease;
}

/* Actual cell text colors — light theme defaults */
/* position:relative + z-index keeps text ABOVE the time line */
.hm-cell .a { color:var(--xtm-actual); position:relative; z-index:2; }
.hm-cell .s { color:var(--text-muted); font-weight:500; margin:0 0.5px; position:relative; z-index:2; }
.hm-cell .e { color:var(--xtm-expected); position:relative; z-index:2; }

/* High-intensity cells: white text */
.hm-cell.l5 .a,.hm-cell.l6 .a,.hm-cell.l7 .a { color:#fff; }
.hm-cell.l5 .s,.hm-cell.l6 .s,.hm-cell.l7 .s { color:rgba(255,255,255,0.45); }
.hm-cell.l5 .e,.hm-cell.l6 .e,.hm-cell.l7 .e { color:rgba(255,255,255,0.65); }

/* Actual levels — orange palette */
.hm-cell.l0 { background:transparent; }
.hm-cell.l0 .a,.hm-cell.l0 .e { color:var(--text-muted); }
.hm-cell.l1 { background:rgba(224,120,0,0.06); }
.hm-cell.l2 { background:rgba(224,120,0,0.12); }
.hm-cell.l3 { background:rgba(224,120,0,0.22); }
.hm-cell.l4 { background:rgba(224,120,0,0.35); }
.hm-cell.l5 { background:rgba(224,120,0,0.50); }
.hm-cell.l6 { background:rgba(224,120,0,0.68); }
.hm-cell.l7 { background:rgba(224,120,0,0.88); }

/* Prediction cells — cold blue palette */
.hm-cell[class*="p"] .a,.hm-cell[class*="p"] .s { display:none; }
.hm-cell.p0 { background:rgba(100,140,210,0.07); } .hm-cell.p0 .e { color:#9aa8bc; }
.hm-cell.p1 { background:rgba(90,130,200,0.12); } .hm-cell.p1 .e { color:#8898b0; }
.hm-cell.p2 { background:rgba(80,115,190,0.18); } .hm-cell.p2 .e { color:#7688a4; }
.hm-cell.p3 { background:rgba(70,100,180,0.25); } .hm-cell.p3 .e { color:#647898; }
.hm-cell.p4 { background:rgba(60,88,170,0.33); } .hm-cell.p4 .e { color:#56698c; }
.hm-cell.p5 { background:rgba(50,75,160,0.42); } .hm-cell.p5 .e { color:#fff; }
.hm-cell.p6 { background:rgba(42,64,148,0.52); } .hm-cell.p6 .e { color:#fff; }
.hm-cell.p7 { background:rgba(35,55,135,0.62); } .hm-cell.p7 .e { color:#fff; }

/* Out-of-market cells — diagonal stripes */
.hm-cell.out-of-market {
  background:repeating-linear-gradient(
    -45deg,
    transparent,
    transparent 3px,
    rgba(139,148,158,0.10) 3px,
    rgba(139,148,158,0.10) 4px
  ) !important;
}
.hm-cell.out-of-market .a,
.hm-cell.out-of-market .e { opacity:0.35; }
.hm-cell.out-of-market .s { opacity:0.25; }

/* Market start/end boundary markers */
.hm-cell.market-start { border-top:2px solid rgba(207,34,46,0.7); }
.hm-cell.market-end { border-bottom:2px solid rgba(207,34,46,0.7); }

.market-marker {
  position:absolute; font-size:0.55rem; font-weight:700; letter-spacing:0.04em;
  color:rgba(207,34,46,0.7); z-index:4; pointer-events:none;
  text-transform:uppercase;
}
.start-marker { top:2px; left:4px; }
.end-marker { bottom:2px; left:4px; }

/* Cell pulse on new tweet */
/* Active cell — current hour + today */
.hm-cell.active-cell { outline:2px solid var(--accent); outline-offset:-2px; z-index:3; }

@keyframes cellPulse { 0%{transform:scale(1)} 30%{transform:scale(1.08)} 100%{transform:scale(1)} }
.hm-cell.pulse { animation:cellPulse 0.4s ease-out; }

/* Smooth transitions for live updates */
.hm-cell { transition:background 500ms ease, transform 0.15s ease; }
.bracket-row { transition:background 300ms ease; }
.bracket-price { transition:color 300ms ease; }
.bracket-pct { transition:color 300ms ease; }
.bracket-tag { transition:opacity 300ms ease-in; }
.market-tweet-pace { transition:background 400ms ease, color 400ms ease; }
.activity-marker { transition:left 500ms ease; }

/* Digit scroll effect */
.digit-scroll {
  display:inline-block; overflow:hidden; vertical-align:bottom;
  height:1.2em; line-height:1.2em;
}
.digit-scroll-inner {
  display:block;
  transition:transform 350ms ease-out;
}

.hm-sum { padding:0 6px; text-align:center; font-size:0.82rem; font-weight:700; font-variant-numeric:tabular-nums; border-bottom:1px solid var(--xtm-cell-border); border-left:1px solid var(--border); height:36px; display:flex; align-items:center; justify-content:center; }
.hm-sum .a { color:var(--xtm-actual); } .hm-sum .s { color:var(--text-muted); font-weight:500; margin:0 0.5px; } .hm-sum .e { color:var(--xtm-expected); }

/* Footer row */
.hm-footer-label { padding:12px 10px; text-align:right; font-size:0.78rem; font-weight:700; color:var(--text-muted); text-transform:uppercase; border-top:1px solid var(--border); position:sticky; left:0; z-index:4; background:var(--bg2); }
.hm-footer-val { padding:8px 6px; text-align:center; font-variant-numeric:tabular-nums; border-top:1px solid var(--border); border-left:1px solid var(--xtm-cell-border); }
.hm-footer-val .ft-nums { font-size:0.82rem; font-weight:700; }
.hm-footer-val .ft-nums .fa { color:var(--xtm-actual); }
.hm-footer-val .ft-nums .fs { color:var(--text-muted); font-weight:500; }
.hm-footer-val .ft-nums .fe { color:var(--xtm-expected); }
.hm-footer-val .ft-pct { display:block; font-size:0.65rem; font-weight:700; margin-top:2px; padding:2px 5px; border-radius:3px; }
.ft-pct.up { color:var(--green); background:rgba(26,127,55,0.08); }
.ft-pct.down { color:var(--red); background:rgba(207,34,46,0.08); }
.hm-footer-total { padding:8px 6px; text-align:center; font-weight:800; font-size:0.9rem; color:var(--accent); border-top:1px solid var(--border); border-left:1px solid var(--border); }
.hm-footer-total .fe { font-weight:600; font-size:0.82rem; color:var(--xtm-expected); }
.hm-footer-total .fs { color:var(--text-muted); font-weight:500; }

/* Time line */
.time-line { position:absolute; left:68px; right:0; height:1px; background:rgba(207,34,46,0.35); z-index:1; pointer-events:none; transition:top 1s linear; }
.time-line::before { content:''; position:absolute; left:-4px; top:-2px; width:5px; height:5px; background:rgba(207,34,46,0.35); border-radius:50%; }

/* Legend */
.hm-legend { display:flex; align-items:center; gap:14px; padding:12px 1.2rem; border-top:1px solid var(--border); font-size:0.72rem; color:var(--text-muted); font-weight:500; flex-wrap:wrap; }
.hm-legend-scale { display:flex; align-items:center; gap:3px; }
.hm-legend-block { width:16px; height:16px; border-radius:2px; }

/* Cell tooltip */
.hm-cell[data-tooltip]:hover::after { content:attr(data-tooltip); position:absolute; bottom:calc(100% + 4px); left:50%; transform:translateX(-50%); background:var(--text); color:var(--bg2); font-size:0.7rem; font-weight:600; padding:5px 10px; border-radius:4px; white-space:nowrap; pointer-events:none; z-index:10; }
.hm-cell:hover { z-index:10; }

/* Sleep indicator — contour moon */
.sleep-icon { position:absolute; top:3px; right:3px; width:10px; height:10px; opacity:0.4; }
.sleep-icon svg { width:100%; height:100%; display:block; }

/* Pro Paywall — same style as main site */
.locked-row { position:relative; user-select:none; pointer-events:none; }
.locked-row > *:not(.locked-overlay) { filter:blur(5px); opacity:0.45; }
.locked-overlay {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  pointer-events:auto; cursor:pointer; z-index:2;
  font-size:0.78rem; font-weight:700; color:var(--accent); letter-spacing:0.02em; gap:0.4rem;
}
.locked-overlay .lock-icon { width:1em; height:1em; display:inline-flex; align-items:center; justify-content:center; color:var(--accent); }
.locked-overlay .lock-icon svg { width:100%; height:100%; stroke:currentColor; stroke-width:1.5; fill:none; }
.locked-banner {
  display:flex; align-items:center; justify-content:center; gap:0.4rem;
  padding:0.75rem 1rem; background:var(--accent-dim); border-top:1px solid var(--accent-border);
  color:var(--accent); font-size:0.78rem; font-weight:700; letter-spacing:0.03em; cursor:pointer;
}
.locked-banner:hover { background:var(--accent-border); }
.target-lock { display:inline-flex; align-items:center; gap:3px; color:var(--accent); cursor:pointer; }
.target-lock svg { width:14px; height:14px; stroke:currentColor; stroke-width:1.5; fill:none; }

/* Free user preview divider */
.free-preview-divider { margin:3rem 0 2rem; padding-top:2rem; border-top:2px dashed var(--border); text-align:center; }
.free-preview-label { font-family:var(--font-display); font-size:0.82rem; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.1em; margin-bottom:1.5rem; }

/* ── Mobile Responsive (≤480px) ── */
@media (max-width:480px) {
  /* Person selector: horizontal scroll */
  .person-selector { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; gap:6px; padding-bottom:4px; scrollbar-width:none; }
  .person-selector::-webkit-scrollbar { display:none; }
  .person-btn { flex-shrink:0; font-size:0.72rem; padding:5px 12px; }

  /* Market title */
  .market-title { font-size:0.9rem; }
  .market-title .market-cat { font-size:0.62rem; }

  /* Cycle buttons: horizontal scroll, same size */
  .market-cycles { gap:5px; flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .market-cycles::-webkit-scrollbar { display:none; }
  .market-cycle-btn { font-size:0.7rem; padding:5px 12px; flex-shrink:0; }
  .market-past-btn { font-size:0.7rem; padding:5px 12px; flex-shrink:0; }
  .market-past-dropdown.open { display:block; position:fixed; top:180px; left:16px; right:16px; width:auto; min-width:auto; z-index:100; background:var(--bg2); border:1px solid var(--border); border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,0.2); max-height:50vh; overflow-y:auto; padding:8px 0; }

  /* Stats mobile: 3 rows, aligned */
  .market-stats { padding:1rem 1rem 0.85rem; }
  .market-stats-top { display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto auto auto; gap:0 16px; align-items:center; }
  .market-tweet-count { grid-column:1; grid-row:1/3; display:flex; flex-wrap:wrap; align-items:baseline; gap:4px; }
  .market-tweet-label { width:100%; margin-bottom:2px; margin-right:0; }
  .market-tweet-val { font-size:1.5rem; }
  .market-tweet-slash { font-size:1rem; }
  .market-tweet-exp { font-size:1.25rem; }
  .market-tweet-pace { display:none; }
  .mobile-sub-labels { display:flex !important; }
  .market-time-left { grid-column:2; grid-row:1/3; margin-left:0; flex-direction:column; align-items:flex-end; gap:2px; }
  .market-time-label { font-size:0.68rem; }
  .market-time-compact { font-size:1.1rem; }
  .activity-scale { grid-column:1/3; grid-row:3; margin-top:12px; padding-top:10px; border-top:1px solid var(--xtm-cell-border); justify-content:center; }

  /* Telegram CTA */
  .tg-cta { flex-wrap:wrap; padding:14px 1rem; gap:8px; }
  .tg-cta-icon { width:32px; height:32px; }
  .tg-cta-title { font-size:0.88rem; }
  .tg-cta-sub { font-size:0.72rem; }
  .tg-cta-btn { width:100%; text-align:center; padding:10px; font-size:0.78rem; border-radius:8px; margin-top:4px; }

  /* Brackets: mobile card layout */
  .bracket-row {
    display:flex; flex-wrap:wrap; height:auto; padding:14px 1rem 16px;
    gap:0; border-bottom:1px solid var(--xtm-cell-border); align-items:center;
  }
  .bracket-range { font-size:0.95rem; font-weight:800; min-width:auto; }
  .bracket-vol { font-size:0.75rem; min-width:auto; margin-left:10px; }
  .bracket-change { display:none; }
  .bracket-pct { font-size:0.92rem; min-width:auto; margin-left:10px; }
  .bracket-pct.pct-down::before { content:'▾ '; color:var(--red); }
  .bracket-pct.pct-up::before { content:'▴ '; color:var(--green); }
  .bracket-tag { margin-left:auto; font-size:0.68rem; padding:3px 9px; }
  .bracket-tag + .bracket-tag { margin-left:5px; }
  .bracket-prices { width:100%; justify-content:flex-start; gap:10px; margin-left:0; margin-top:10px; }
  .bracket-price { width:auto; flex:1; font-size:0.78rem; padding:8px 0; border-radius:6px; }

  /* Hide time line on mobile */
  .time-line { display:none; }

  /* Heatmap header */
  .heatmap-header { padding:0.7rem 1rem; }
  .heatmap-title .sub { display:none; }
  .heatmap-controls { display:none; }

  /* Heatmap: horizontal scroll */
  .heatmap-grid { min-width:680px; }
  .hm-hour { font-size:0.7rem; }
  .hm-cell { font-size:0.72rem; }
  .hm-day-header { font-size:0.72rem; }
  .hm-day-header .date { font-size:0.62rem; }

  /* Legend */
  .hm-legend { flex-wrap:wrap; gap:8px 14px; font-size:0.65rem; padding:10px 1rem; }
  .hm-legend-block { width:12px; height:12px; }

  /* Brackets header */
  .brackets-header { padding:0.6rem 1rem; }
  .brackets-title { font-size:0.85rem; }
  .brackets-title .sub { display:none; }

  /* Info button: hide on mobile (saves space) */
  .tweet-info-btn { display:none; }

  /* Activity scale: center on mobile */
  .activity-scale { margin-left:0; justify-content:center; justify-self:center; }

  /* Model Performance mobile */
  .perf-header { flex-wrap:wrap; padding:0.6rem 1rem; gap:6px; }
  .perf-title { font-size:0.85rem; }
  .perf-title .sub { display:none; }
  .perf-badge { font-size:0.68rem; padding:3px 8px; }
  .perf-row { padding:0 1rem; font-size:0.75rem; height:32px; }
  .perf-label { font-size:0.72rem; }
  .perf-pred, .perf-actual { min-width:45px; font-size:0.72rem; }
  .perf-error { min-width:40px; font-size:0.72rem; }
  .perf-detail { padding:0.6rem 1rem 0.6rem 1.8rem; font-size:0.68rem; }
}