/* ============================================================
   GALO RADAR — KV herdado da Plataforma de Camarotes (Galo SAF)
   monocromático · accent dourado #FFCC00 · Apple-like · Inter
   ============================================================ */
:root{
  --bg:#f5f5f7; --bg-elev:#ffffff; --bg-card:#ffffff; --bg-soft:#fafafa;
  --text:#1d1d1f; --text-muted:#6e6e73; --text-faint:#a1a1a6;
  --border:rgba(0,0,0,.08); --border-strong:rgba(0,0,0,.16);
  --accent:#0a0a0a; --accent-on:#ffffff; --gold:#ffcc00; --gold-dk:#b28f00;
  --green:#34c759; --orange:#ff9500; --red:#ff3b30; --info:#0a84ff;
  --shadow-sm:0 1px 2px rgba(0,0,0,.04);
  --shadow:0 1px 3px rgba(0,0,0,.04), 0 4px 14px rgba(0,0,0,.04);
  --r-sm:8px; --r-md:10px; --r-lg:14px; --r-xl:20px;
}
*{box-sizing:border-box; margin:0; padding:0}
html{color-scheme:light}
body{
  background:var(--bg); color:var(--text);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;
  font-size:14px; line-height:1.5; letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace; font-variant-numeric:tabular-nums}
::selection{background:var(--gold); color:#000}
a{color:inherit; text-decoration:none}
.app{display:grid; grid-template-columns:232px 1fr; min-height:100vh}

/* ============ SIDEBAR ============ */
.sidebar{
  position:sticky; top:0; height:100vh; overflow-y:auto;
  background:var(--bg-elev); border-right:1px solid var(--border);
  padding:12px; display:flex; flex-direction:column; gap:2px;
}
.logo{display:flex; align-items:center; gap:10px; padding:6px 12px 16px}
.logo .mark{
  position:relative; width:28px; height:28px; border-radius:8px;
  background:var(--accent); color:var(--accent-on);
  display:grid; place-items:center; font-weight:800; font-size:15px;
}
.logo .mark::after{
  content:""; position:absolute; right:-2px; bottom:-2px; width:10px; height:10px;
  border-radius:50%; background:var(--gold); border:2px solid var(--bg-elev);
}
.logo b{font-size:15px; letter-spacing:-.02em}
.nav-sec{margin:12px 12px 6px; font-size:11px; font-weight:500; text-transform:uppercase; letter-spacing:.05em; color:var(--text-faint)}
.nav-item{
  display:flex; align-items:center; gap:10px; padding:8px 12px;
  border-radius:10px; font-size:13.5px; font-weight:500; color:var(--text-muted);
  cursor:pointer; transition:background .12s, color .12s;
}
.nav-item:hover{background:var(--bg-soft); color:var(--text)}
.nav-item.active{background:var(--accent); color:var(--accent-on)}
.nav-item svg{width:16px; height:16px; flex:0 0 auto}
.nav-item .badge{
  margin-left:auto; font-size:11px; font-weight:600; padding:1px 7px;
  border-radius:999px; background:var(--bg-soft); color:var(--text-muted);
}
.nav-item.active .badge{background:rgba(255,255,255,.2); color:var(--accent-on)}
.nav-item .badge.hot{background:rgba(255,59,48,.1); color:var(--red)}
.nav-item .dot-live{margin-left:auto; width:7px; height:7px; border-radius:50%; background:var(--red); animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,59,48,.45)} 70%{box-shadow:0 0 0 6px rgba(255,59,48,0)} 100%{box-shadow:0 0 0 0 rgba(255,59,48,0)}}
.sidebar .spacer{flex:1}
.tvtag{font-size:9.5px; font-weight:700; letter-spacing:.05em; color:var(--text-faint)}
.nav-item.active .tvtag{color:rgba(255,255,255,.6)}

/* ============ TOPBAR ============ */
.main{display:flex; flex-direction:column; min-width:0}
.topbar{
  position:sticky; top:0; z-index:10; height:64px;
  background:rgba(255,255,255,.82); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  display:flex; align-items:center; gap:14px; padding:0 36px;
}
.search{
  flex:0 1 420px; display:flex; align-items:center; gap:9px;
  background:var(--bg-soft); border:1px solid var(--border);
  border-radius:10px; padding:8px 12px; color:var(--text-faint); font-size:13px;
}
.search kbd{
  margin-left:auto; font-size:10.5px; font-family:inherit; color:var(--text-faint);
  border:1px solid var(--border-strong); border-radius:5px; padding:1px 5px; background:#fff;
}
.top-right{margin-left:auto; display:flex; align-items:center; gap:10px}
.pill-live{
  display:flex; align-items:center; gap:7px; font-size:12px; font-weight:600;
  color:var(--text-muted); background:var(--bg-soft); border:1px solid var(--border);
  padding:6px 12px; border-radius:999px; white-space:nowrap;
}
.pill-live .d{width:7px; height:7px; border-radius:50%; background:var(--green)}
.avatar{width:30px; height:30px; border-radius:50%; background:var(--accent); color:#fff; display:grid; place-items:center; font-size:12px; font-weight:700}

/* ============ CONTENT ============ */
.content{width:100%; max-width:1240px; margin:0 auto; padding:28px 36px 80px}
.page-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:22px; flex-wrap:wrap}
.page-head h1{font-size:28px; font-weight:700; letter-spacing:-.025em}
.page-head .sub{font-size:13px; color:var(--text-muted); margin-top:3px}
.btn{
  display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600;
  padding:9px 16px; border-radius:10px; border:1px solid var(--border-strong);
  background:var(--bg-elev); color:var(--text); cursor:pointer; transition:all .12s;
  font-family:inherit;
}
.btn:hover{border-color:var(--text-faint)}
.btn.primary{background:var(--accent); color:var(--accent-on); border-color:var(--accent)}
.btn.sm{font-size:12px; padding:8px 13px}
.btn svg{width:15px; height:15px}

/* KPI */
.kpis{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:14px}
.kpi{background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-lg); box-shadow:var(--shadow); padding:16px 18px}
.kpi .lbl{font-size:11px; font-weight:500; text-transform:uppercase; letter-spacing:.05em; color:var(--text-faint)}
.kpi .val{font-size:26px; font-weight:700; letter-spacing:-.02em; margin-top:6px; display:flex; align-items:baseline; gap:8px}
.kpi .delta{font-size:12px; font-weight:600}
.kpi .delta.up{color:var(--green)} .kpi .delta.dn{color:var(--red)}
.kpi .foot{font-size:11.5px; color:var(--text-muted); margin-top:3px}
.spark{margin-top:10px; height:30px; width:100%}

/* layout */
.grid{display:grid; grid-template-columns:1.55fr 1fr; gap:14px; align-items:start}
.grid-11{display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start}
.col{display:flex; flex-direction:column; gap:14px; min-width:0}
.card{background:var(--bg-card); border:1px solid var(--border); border-radius:var(--r-lg); box-shadow:var(--shadow); padding:18px}
.card-h{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; gap:10px}
.card-h h3{font-size:15px; font-weight:600; letter-spacing:-.01em; display:flex; align-items:center; gap:8px}
.card-h h3 .tick{width:3px; height:16px; border-radius:2px; background:var(--gold); flex:0 0 auto}
.card-h .more{font-size:12px; font-weight:600; color:var(--text-muted); cursor:pointer}
.card-h .more:hover{color:var(--text)}
.hint{font-size:11px; font-weight:500; color:var(--text-faint)}

/* tags & chips */
.tag{font-size:10.5px; font-weight:600; padding:2px 9px; border-radius:999px; white-space:nowrap}
.tag.risk{background:rgba(255,59,48,.09); color:var(--red)}
.tag.warm{background:rgba(255,149,0,.1); color:var(--orange)}
.tag.ok{background:rgba(52,199,89,.1); color:var(--green)}
.tag.neutral{background:var(--bg-soft); color:var(--text-muted); border:1px solid var(--border)}
.tag.gold{background:rgba(255,204,0,.18); color:#8a6d00}
.chip{font-size:10.5px; font-weight:600; padding:3px 9px; border-radius:999px; border:1px solid var(--border); color:var(--text-muted); background:#fff}
.chip.r{color:var(--red); border-color:rgba(255,59,48,.35)}
.chip.o{color:var(--orange); border-color:rgba(255,149,0,.35)}
.chip.g{color:var(--green); border-color:rgba(52,199,89,.35)}

/* filtros / abas */
.tabs{display:flex; gap:7px; flex-wrap:wrap; margin-bottom:16px}
.tab{
  font-size:12.5px; font-weight:600; color:var(--text-muted);
  background:var(--bg-elev); border:1px solid var(--border);
  padding:7px 14px; border-radius:999px; cursor:pointer; transition:all .12s;
  display:inline-flex; align-items:center; gap:7px;
}
.tab:hover{border-color:var(--border-strong); color:var(--text)}
.tab.active{background:var(--accent); color:var(--accent-on); border-color:var(--accent)}
.tab .n{font-size:10.5px; font-weight:700; padding:0 6px; border-radius:999px; background:var(--bg-soft); color:var(--text-muted)}
.tab.active .n{background:rgba(255,255,255,.2); color:#fff}

/* tabela */
.tablecard{padding:0; overflow:hidden}
.tbl{width:100%; border-collapse:collapse; font-size:13px}
.tbl th{
  text-align:left; font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.05em;
  color:var(--text-faint); padding:11px 14px; border-bottom:1px solid var(--border);
  background:var(--bg-soft); cursor:pointer; user-select:none; white-space:nowrap;
}
.tbl td{padding:11px 14px; border-bottom:1px solid var(--border); vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.tbl tbody tr{cursor:pointer; transition:background .1s}
.tbl tbody tr:hover{background:var(--bg-soft)}
.tbl .name{font-weight:600}
.tbl .sub{font-size:11px; color:var(--text-faint); display:block}
.tbl .num{font-variant-numeric:tabular-nums; font-family:"JetBrains Mono",monospace; font-size:12px}
.avatar-s{width:26px; height:26px; border-radius:50%; background:var(--bg-soft); border:1px solid var(--border); display:inline-grid; place-items:center; font-size:10px; font-weight:700; color:var(--text-muted); margin-right:9px; vertical-align:middle}

/* rows list */
.nrow{display:flex; align-items:center; gap:12px; padding:11px 4px; border-bottom:1px solid var(--border); cursor:pointer}
.nrow:last-child{border-bottom:none}
.nrow:hover{background:var(--bg-soft); border-radius:8px}
.nrow .n{width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:10.5px; font-weight:800; color:#fff; flex:0 0 auto}
.nrow .t{flex:1; min-width:0}
.nrow .t b{display:block; font-size:13px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.nrow .t small{font-size:11.5px; color:var(--text-muted)}
.nrow .v{font-size:12px; font-weight:700} .v.up{color:var(--red)} .v.dn{color:var(--green)} .v.fl{color:var(--text-faint)}

/* feed de menções */
.feed-item{display:flex; gap:12px; padding:14px 4px; border-bottom:1px solid var(--border)}
.feed-item:last-child{border-bottom:none}
.feed-item .src-ic{flex:0 0 auto; width:36px; height:36px; border-radius:10px; display:grid; place-items:center; font-size:10px; font-weight:800; border:1px solid var(--border)}
.src-x{background:#0a0a0a; color:#fff}
.src-news{background:var(--bg-soft); color:var(--text-muted)}
.src-yt{background:rgba(255,59,48,.08); color:var(--red)}
.src-ig{background:rgba(255,149,0,.08); color:var(--orange)}
.feed-item .fx{flex:1; min-width:0}
.feed-item .who{font-size:12.5px; font-weight:600}
.feed-item .who small{font-weight:500; color:var(--text-faint); margin-left:6px}
.feed-item .txt{font-size:13px; color:var(--text); margin-top:2px; line-height:1.45}
.feed-item .meta{display:flex; gap:12px; margin-top:6px; font-size:11px; color:var(--text-faint)}
.sent{width:8px; height:8px; border-radius:50%; flex:0 0 auto; margin-top:6px}
.s-pos{background:var(--green)} .s-neu{background:#c7c7cc} .s-neg{background:var(--red)}

/* clipagem */
.clip-row{display:flex; gap:11px; padding:10px 4px; border-bottom:1px solid var(--border); cursor:pointer}
.clip-row:last-child{border-bottom:none}
.clip-row:hover{background:var(--bg-soft); border-radius:8px}
.clip-row .src{flex:0 0 auto; width:34px; height:34px; border-radius:9px; background:var(--bg-soft); border:1px solid var(--border); display:grid; place-items:center; font-size:10px; font-weight:800; color:var(--text-muted)}
.clip-row .t{min-width:0; flex:1}
.clip-row .t b{display:block; font-size:12.5px; font-weight:600; line-height:1.35}
.clip-row .t small{font-size:11px; color:var(--text-faint)}

/* mapa */
.map{position:relative; height:270px; background:var(--bg-soft); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden}
.map.tall{height:430px}
.map .gl{position:absolute; left:0; right:0; border-top:1px dashed rgba(0,0,0,.06)}
.map .gv{position:absolute; top:0; bottom:0; border-left:1px dashed rgba(0,0,0,.06)}
.map .zone{position:absolute; right:0; top:0; width:40%; height:44%; background:radial-gradient(130% 130% at 100% 0%, rgba(255,59,48,.10), rgba(255,59,48,0) 72%)}
.map .zlbl{position:absolute; right:10px; top:9px; font-size:9.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--red); opacity:.75}
.map .ax{position:absolute; font-size:10px; color:var(--text-faint)}
.bub{
  position:absolute; transform:translate(-50%,50%); border-radius:50%;
  display:grid; place-items:center; cursor:pointer;
  border:2px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.15);
  transition:transform .12s;
}
.bub:hover{transform:translate(-50%,50%) scale(1.1); z-index:3}
.bub span{font-size:10px; font-weight:800; color:#fff}
.b-pos{background:var(--green)} .b-neu{background:#b0b0b6} .b-neg{background:var(--red)}
.map-legend{display:flex; gap:14px; flex-wrap:wrap; margin-top:10px; font-size:11px; color:var(--text-muted)}
.map-legend i{display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:5px}

/* IA */
.ia{border:1px solid rgba(0,0,0,.14); background:linear-gradient(180deg,#fffdf2,#ffffff)}
.badge-ia{display:inline-flex; align-items:center; gap:6px; font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; background:var(--gold); color:#000; padding:3px 9px; border-radius:6px}
.ia h4{font-size:14.5px; font-weight:700; margin:10px 0 6px; letter-spacing:-.01em}
.ia p{font-size:12.5px; color:var(--text-muted); line-height:1.55}
.ia .chips{display:flex; gap:7px; margin:10px 0; flex-wrap:wrap}
.ia .actions{display:flex; gap:8px; margin-top:12px}

/* copiloto bar / chat */
.copilot{display:flex; gap:9px; align-items:center; background:var(--bg-elev); border:1px solid var(--border-strong); border-radius:12px; padding:6px 6px 6px 14px; box-shadow:var(--shadow)}
.copilot input{flex:1; border:none; outline:none; font:inherit; font-size:13.5px; color:var(--text); background:transparent}
.copilot input::placeholder{color:var(--text-faint)}
.copilot button{background:var(--accent); color:#fff; border:none; border-radius:9px; padding:9px 15px; font-size:12.5px; font-weight:700; cursor:pointer; display:flex; align-items:center; gap:6px; font-family:inherit}
.copilot .g{color:var(--gold)}
.sugg-row{display:flex; gap:8px; margin-top:9px; flex-wrap:wrap}
.sugg{font-size:11.5px; font-weight:500; color:var(--text-muted); background:var(--bg-elev); border:1px solid var(--border); padding:5px 11px; border-radius:999px; cursor:pointer}
.sugg:hover{border-color:var(--gold); color:var(--text)}
.chatlog{display:flex; flex-direction:column; gap:14px}
.msg{max-width:82%; padding:12px 15px; border-radius:14px; font-size:13.5px; line-height:1.55}
.msg.u{align-self:flex-end; background:var(--accent); color:#fff; border-bottom-right-radius:4px}
.msg.a{align-self:flex-start; background:var(--bg-soft); border:1px solid var(--border); border-bottom-left-radius:4px}
.msg.a b{font-weight:700}
.msg .cite{display:inline-block; font-size:10px; font-weight:700; background:rgba(255,204,0,.25); color:#8a6d00; border-radius:5px; padding:0 6px; margin:0 2px; vertical-align:1px}

/* segments mini */
.seg-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:9px}
.seg{display:flex; align-items:center; gap:10px; background:var(--bg-soft); border:1px solid var(--border); border-radius:10px; padding:10px 12px; cursor:pointer}
.seg:hover{border-color:var(--border-strong)}
.seg .ic{width:28px; height:28px; border-radius:8px; background:#fff; border:1px solid var(--border); display:grid; place-items:center}
.seg .ic svg{width:14px; height:14px; color:var(--text-muted)}
.seg b{font-size:12.5px; font-weight:600; display:block; line-height:1.2}
.seg small{font-size:11px; color:var(--text-faint)}
.seg .n{margin-left:auto; font-size:14px; font-weight:700}

/* misc */
.searchbox{display:flex; align-items:center; gap:9px; background:var(--bg-elev); border:1px solid var(--border); border-radius:10px; padding:8px 12px; font-size:13px; color:var(--text)}
.searchbox input{border:none; outline:none; font:inherit; flex:1; background:transparent; color:var(--text)}
.searchbox input::placeholder{color:var(--text-faint)}
.toolbar{display:flex; gap:10px; align-items:center; margin-bottom:14px; flex-wrap:wrap}
.toolbar .searchbox{flex:0 1 340px}
.select{font:inherit; font-size:12.5px; font-weight:600; color:var(--text-muted); background:var(--bg-elev); border:1px solid var(--border); border-radius:10px; padding:8px 12px; cursor:pointer}
.foot-note{margin-top:26px; text-align:center; font-size:11px; color:var(--text-faint); line-height:1.7}
.empty{padding:30px; text-align:center; color:var(--text-faint); font-size:13px}
.progress{height:6px; border-radius:99px; background:var(--bg-soft); overflow:hidden}
.progress i{display:block; height:100%; border-radius:99px}
.kv-list{display:flex; flex-direction:column; gap:8px; font-size:12.5px}
.kv-list .row{display:flex; justify-content:space-between; gap:10px}
.kv-list .row span:first-child{color:var(--text-muted)}
.kv-list .row b{font-weight:600}

@media(max-width:960px){
  .app{grid-template-columns:1fr} .sidebar{display:none}
  .kpis{grid-template-columns:repeat(2,1fr)} .grid,.grid-11{grid-template-columns:1fr}
}