
/* Feellin UI – dark style kit */
:root{
  --fe-bg:#0f1220; --fe-panel:#171b2e; --fe-text:#e8eaf6; --fe-muted:#8c92ac;
  --fe-brand:#5D176A; --fe-brand-2:#824DEB; --fe-border:#262b42; --fe-card:#14192a;
  --fe-good:#1db954; --fe-warn:#ffb020; --fe-bad:#ff4d4f; --fe-radius:16px;
  --fe-shadow:0 8px 24px rgba(0,0,0,.28);
}
body.fe-dark{
  background: radial-gradient(1200px 800px at 10% -10%, rgba(130,77,235,.12), transparent 60%),
              radial-gradient(1000px 800px at 120% 0%, rgba(93,23,106,.15), transparent 60%),
              var(--fe-bg);
  color:var(--fe-text);
  font-family:"Quicksand",system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  margin:0;
}
.container{ max-width:960px; margin:0 auto; padding:16px; }
.fe-hero{ background:linear-gradient(135deg,var(--fe-brand),var(--fe-brand-2)); color:#fff; padding:36px 16px 56px; border-radius:0 0 24px 24px; }
.fe-cta{ background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.25); color:#fff; padding:8px 12px; border-radius:12px; text-decoration:none; font-weight:600; }
.fe-card{ background:var(--fe-card); border:1px solid var(--fe-border); border-radius:16px; padding:16px; box-shadow:var(--fe-shadow); }
.fe-badge{ display:inline-block; padding:4px 8px; font-size:12px; color:#dfe3ff; background:#12172b; border:1px solid var(--fe-border); border-radius:999px; }
.fe-btn{ display:inline-flex; align-items:center; gap:6px; border-radius:12px; border:1px solid var(--fe-border); padding:10px 14px; cursor:pointer; font-weight:600; background:#12172b; color:#e9eaff; text-decoration:none; }
.fe-btn.primary{ background:linear-gradient(135deg,var(--fe-brand),var(--fe-brand-2)); border:none; color:#fff; }
.grid{ display:grid; gap:16px; }
.kpis{ display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:12px; }
.kpi{ padding:12px 14px; background:var(--fe-panel); border:1px solid var(--fe-border); border-radius:16px; }
.kpi .title{ color:var(--fe-muted); font-size:13px; }
.kpi .value{ font-size:22px; font-weight:800; margin-top:4px; }
/* Chat */
#chat{ display:flex; flex-direction:column; gap:10px; height:55vh; overflow:auto; }
.msg{ max-width:78%; padding:10px 12px; border-radius:14px; line-height:1.4; font-size:15px; box-shadow:0 4px 12px rgba(0,0,0,.25); }
.msg.ai{ align-self:flex-start; background:#1d223a; border:1px solid #202747; }
.msg.me{ align-self:flex-end; background:#2a2f4a; border:1px solid #243052; }
.inputbar{ display:flex; gap:8px; align-items:center; padding:8px; background:#171b2e; border:1px solid var(--fe-border); border-radius:16px; }
.inputbar input{ flex:1; padding:12px 14px; border-radius:12px; border:1px solid var(--fe-border); background:#0f1326; color:var(--fe-text); outline:none; }
.scale-grid{ display:grid; grid-template-columns: repeat(10,1fr); gap:8px; }
.scale-grid button{ padding:10px 0; border:1px solid var(--fe-border); background:#12172b; color:#cfd3ff; border-radius:10px; cursor:pointer; font-weight:700; }
.hint{ color:#8c92ac; }
.chart{ height:260px; }
.hidden{ display:none !important; }
