:root{
    --bg-void:#0a0d13; --bg-panel:#10141c; --bg-panel-2:#141924; --bg-raised:#181e2a;
    --line:#1e2530; --line-soft:#171c26;
    --text:#e7e9ee; --text-dim:#8891a0; --text-faint:#4d5563;
    --amber:#e8a33d;   /* паттерн 6 точек */
    --violet:#8f83e8;  /* паттерн 7 точек */
    --cyan:#47c1e0;    /* паттерн 8 точек */
    --teal:#2fd6a9;    /* рост / бычья свеча */
    --coral:#ef6461;   /* падение / медвежья свеча */
  }
  *{ box-sizing:border-box; }
  html, body{ height:100%; }
  body{
    margin:0; background:var(--bg-void); color:var(--text);
    font-family:'JetBrains Mono', ui-monospace, monospace; font-size:13px;
    -webkit-font-smoothing:antialiased;
  }
  .display{ font-family:'Space Grotesk',sans-serif; }

  /* ================= HEADER ================= */
  header{
    display:flex; align-items:center; gap:16px; padding:14px 24px;
    border-bottom:1px solid var(--line); background:var(--bg-panel);
    position:sticky; top:0; z-index:30;
  }
  .brand{ display:flex; align-items:center; gap:10px; }
  .brand svg{ width:19px; height:19px; }
  .brand b{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; letter-spacing:.01em; }
  .brand .divider{ width:1px; height:16px; background:var(--line); margin:0 4px; }
  header h1{
    font-size:12.5px; font-weight:600; letter-spacing:.06em; color:var(--teal);
    margin:0; text-transform:uppercase;
  }
  .sub{ color:var(--text-faint); font-size:11.5px; }
  header .spacer{ flex:1; }
  button{
    background:var(--bg-raised); border:1px solid var(--line); color:var(--text-dim);
    font-family:'JetBrains Mono',monospace; font-size:11px; padding:6px 12px; border-radius:5px; cursor:pointer;
    transition:border-color .15s, color .15s;
  }
  button:hover{ color:var(--amber); border-color:var(--amber); }

  #liveTimer{ font-size:11px; color:var(--text-faint); display:flex; align-items:center; gap:6px; }
  #liveTimer .dot{ width:6px; height:6px; border-radius:50%; background:var(--teal); animation:pulse 1.6s ease-in-out infinite; }
  @keyframes pulse{ 0%,100%{opacity:1;} 50%{opacity:.25;} }

  /* ================= SEARCH ROW ================= */
  .search-row{ padding:16px 24px; border-bottom:1px solid var(--line); background:var(--bg-panel-2); }
  .search-row .inner{ max-width:1500px; margin:0 auto; display:flex; align-items:center; gap:12px; }
  .ticker-box{
    display:flex; align-items:center; gap:10px; background:var(--bg-panel); border:1px solid var(--line);
    border-radius:9px; padding:11px 16px; cursor:pointer; width:340px; transition:border-color .15s;
  }
  .ticker-box:hover{ border-color:var(--text-faint); }
  .ticker-box .ic{ color:var(--text-faint); font-size:15px; }
  .ticker-box .cur-symbol{ font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:15px; }
  .ticker-box .cur-class{
    margin-left:auto; font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-faint);
    background:var(--bg-raised); border:1px solid var(--line); padding:3px 8px; border-radius:100px;
  }
  #tickerMatchStatus{ font-size:12px; color:var(--text-dim); }
  #tickerMatchStatus.found{ color:var(--teal); }
  #tickerMatchStatus.notfound{ color:var(--coral); }

  .legend-group{ display:flex; gap:16px; margin-left:auto; align-items:center; }
  .legend-item{ display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--text-dim); }
  .legend-item .sw{ width:15px; height:3px; border-radius:2px; }

  /* ================= MAIN GRID ================= */
  .wrap{ max-width:1560px; margin:0 auto; padding:20px 24px 60px; }
  .tf-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
  @media (max-width:1200px){ .tf-grid{ grid-template-columns:1fr; } }

  .tf-panel{ background:var(--bg-panel); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
  .tf-head{ display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid var(--line); }
  .tf-head .tf-name{ font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:600; }
  .tf-head .tf-price{ font-size:12.5px; display:flex; gap:10px; }
  .tf-head .tf-price .chg.up{ color:var(--teal); }
  .tf-head .tf-price .chg.down{ color:var(--coral); }

  .tf-body{ display:flex; }
  .tf-chart{ flex:1.5; min-width:0; height:300px; }
  .tf-side{ width:180px; flex-shrink:0; border-left:1px solid var(--line); display:flex; flex-direction:column; }
  .tf-side-block{ padding:10px 14px; border-bottom:1px solid var(--line-soft); }
  .tf-side-block:last-child{ border-bottom:none; }
  .tsb-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:4px; }
  .tsb-tag{ display:flex; align-items:center; gap:6px; font-size:11.5px; font-weight:600; }
  .tsb-tag .dot{ width:8px; height:8px; border-radius:2px; }
  .tsb-n{ font-size:10px; color:var(--text-faint); }
  .tsb-stats-full{ display:flex; flex-direction:column; gap:5px; margin-top:2px; }
.tsb-row{ display:flex; justify-content:space-between; font-size:11px; }
.tsb-row .k{ color:var(--text-faint); }
.tsb-row .v{ font-weight:600; color:var(--text); }
.tsb-row .v.up{ color:var(--teal); }
.tsb-row .v.down{ color:var(--coral); }  .tf-loading, .tf-error{ padding:40px 20px; text-align:center; color:var(--text-faint); font-size:12px; line-height:1.7; }
  .tf-error{ color:var(--coral); }

  /* ================= MODAL (в духе поиска тикера TradingView) ================= */
  .modal-overlay{
    position:fixed; inset:0; background:rgba(6,8,12,0.72); backdrop-filter:blur(3px);
    display:none; align-items:flex-start; justify-content:center; z-index:100; padding-top:9vh;
  }
  .modal-overlay.show{ display:flex; }
  .modal-box{
    width:720px; max-width:92vw; max-height:74vh; background:var(--bg-panel); border:1px solid var(--line);
    border-radius:12px; overflow:hidden; box-shadow:0 40px 100px -20px rgba(0,0,0,.7);
    display:flex; flex-direction:column;
  }
  .modal-search{ padding:14px 16px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:10px; }
  .modal-search .ic{ color:var(--text-faint); font-size:16px; }
  .modal-search input{
    flex:1; background:transparent; border:none; outline:none; color:var(--text);
    font-family:'JetBrains Mono',monospace; font-size:15px;
  }
  .modal-search .close{ background:none; border:none; color:var(--text-faint); font-size:18px; cursor:pointer; padding:2px 6px; }
  .modal-search .close:hover{ color:var(--text); border:none;}

  .modal-body{ display:flex; min-height:0; flex:1; }
  .modal-categories{ width:190px; flex-shrink:0; border-right:1px solid var(--line); padding:8px; overflow-y:auto; }
  .cat-item{
    display:flex; align-items:center; justify-content:space-between; padding:9px 10px; border-radius:7px;
    font-size:12.5px; color:var(--text-dim); cursor:pointer; margin-bottom:2px;
  }
  .cat-item:hover:not(.disabled){ background:var(--bg-raised); color:var(--text); }
  .cat-item.active{ background:rgba(232,163,61,0.1); color:var(--amber); }
  .cat-item.disabled{ color:var(--text-faint); cursor:not-allowed; opacity:.55; }
  .cat-item .soon{ font-size:9px; border:1px solid var(--line); padding:1px 6px; border-radius:100px; text-transform:uppercase; letter-spacing:.04em; }

  .modal-results{ flex:1; overflow-y:auto; padding:6px; }
  .result-row{
    display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:8px; cursor:pointer;
  }
  .result-row:hover{ background:var(--bg-raised); }
  .result-row .r-icon{
    width:30px; height:30px; border-radius:7px; background:var(--bg-raised); border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; color:var(--text-dim);
    flex-shrink:0;
  }
  .result-row .r-symbol{ font-weight:600; font-size:13.5px; }
  .result-row .r-name{ font-size:11.5px; color:var(--text-faint); }
  .result-row .r-tag{
    margin-left:auto; font-size:10px; color:var(--text-faint); border:1px solid var(--line);
    padding:2px 8px; border-radius:100px; text-transform:uppercase; letter-spacing:.03em;
  }
  .modal-empty{ padding:40px 20px; text-align:center; color:var(--text-faint); font-size:12.5px; }

  /* ================= AGGREGATE SECTION ================= */
.aggregate{ padding:28px 0 60px; }
.agg-head{ margin-bottom:20px; }
.agg-head .kicker{ font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--amber); text-transform:uppercase; letter-spacing:.07em; margin-bottom:8px; }
.agg-head h2{ font-family:'Space Grotesk',sans-serif; font-size:24px; font-weight:600; margin-bottom:6px; }
.agg-head p{ font-size:13px; color:var(--text-dim); max-width:560px; }

.agg-layout{ display:grid; grid-template-columns:1.4fr 1fr; gap:18px; }
@media (max-width:1080px){ .agg-layout{ grid-template-columns:1fr; } }

.agg-table-card{ background:var(--bg-panel); border:1px solid var(--line); border-radius:12px; overflow:hidden; }
table.agg-table{ width:100%; border-collapse:collapse; font-family:'JetBrains Mono',monospace; font-size:12.5px; }
table.agg-table th{ text-align:left; padding:12px 16px; background:var(--bg-raised); color:var(--text-faint); font-weight:500; text-transform:uppercase; font-size:10.5px; letter-spacing:.05em; border-bottom:1px solid var(--line); }
table.agg-table td{ padding:12px 16px; border-bottom:1px solid var(--line); color:var(--text-dim); }
table.agg-table tr:last-child td{ border-bottom:none; }
table.agg-table td.tf-col{ color:var(--text); font-weight:600; }
table.agg-table .pct{ font-weight:600; }
table.agg-table .pct.up{ color:var(--teal); }
table.agg-table .pct.down{ color:var(--coral); }
table.agg-table .bar{ display:inline-block; height:4px; border-radius:2px; background:var(--line); width:60px; position:relative; margin-left:8px; vertical-align:middle; overflow:hidden; }
table.agg-table .bar i{ position:absolute; left:0; top:0; bottom:0; background:var(--teal); display:block; }

.consensus-card{
  background:linear-gradient(180deg, rgba(232,163,61,0.08), var(--bg-panel) 55%);
  border:1px solid var(--amber); border-radius:12px; padding:26px;
  display:flex; flex-direction:column; align-items:center; text-align:center; justify-content:center;
}
.consensus-card .kicker{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.06em; margin-bottom:14px; }
.consensus-big{ font-family:'Space Grotesk',sans-serif; font-size:52px; font-weight:700; color:var(--teal); line-height:1; margin-bottom:6px; }
.consensus-big.down{ color:var(--coral); }
.consensus-card .sub{ font-size:13px; color:var(--text-dim); margin-bottom:20px; }
.consensus-split{ width:100%; height:8px; border-radius:4px; background:var(--coral); overflow:hidden; margin-bottom:10px; display:flex; }
.consensus-split i{ background:var(--teal); height:100%; display:block; }
.consensus-legend{ display:flex; justify-content:space-between; width:100%; font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--text-faint); margin-bottom:20px; }
.consensus-note{ font-size:12px; color:var(--text-faint); border-top:1px solid var(--line); padding-top:16px; width:100%; }
.consensus-note b{ color:var(--text-dim); }


.hidden{display:none!important;}
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:650px;background:var(--bg-panel);border:1px solid var(--line);border-radius:16px}
.empty-icon{font-size:64px;margin-bottom:20px}
.empty-state h2{font-family:'Space Grotesk',sans-serif;font-size:28px}
.empty-state p{max-width:500px;color:var(--text-dim);line-height:1.7}
.empty-btn{padding:12px 20px}

.consensus-tf-list{ display:flex; flex-direction:column; gap:10px; width:100%; margin-bottom:22px; }
.consensus-tf-row{ display:grid; grid-template-columns:34px 1fr 70px; gap:10px; align-items:center; }
.consensus-tf-row .tf-label{ font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--text-dim); text-align:left; }
.consensus-tf-row .tf-bar{ height:6px; border-radius:4px; background:var(--line); overflow:hidden; }
.consensus-tf-row .tf-bar i{ display:block; height:100%; background:var(--teal); border-radius:4px; transition:width .3s ease; }
.consensus-tf-row .tf-bar i.down{ background:var(--coral); }
.consensus-tf-row .tf-pct{ font-family:'JetBrains Mono',monospace; font-size:11.5px; text-align:right; }
.consensus-tf-row .tf-pct.up{ color:var(--teal); }
.consensus-tf-row .tf-pct.down{ color:var(--coral); }
.consensus-tf-row .tf-pct.muted{ color:var(--text-faint); font-size:10.5px; }

.consensus-divider{ width:100%; height:1px; background:var(--line); margin:2px 0 20px; }