/* ============================================================
   KPOP GALA — ANALYTICS.CSS · v1.5
   Dashboard, perfiles de detalle y gráficas SVG
   ============================================================ */

.analytics-page{
   max-width:1280px
}

.analytics-head{
   display:flex;
   align-items:flex-end;
   justify-content:space-between;
   gap:1rem;
   margin-bottom:1.4rem
}

.analytics-head h1{
   font-family:var(--font-display);
   font-size:clamp(2rem,5vw,3.35rem);
   line-height:1.05;
   letter-spacing:-.045em
}

.analytics-head p{
   color:var(--text-soft);
   margin-top:.4rem
}

.analytics-badge{display:inline-flex;
   align-items:center;
   gap:.35rem;
   padding:.32rem .82rem;
   border:1.5px solid var(--border);
   border-radius:999px;
   background:rgba(255,255,255,.72);
   font-size:.76rem;
   font-weight:800;
   color:var(--text-soft);
   margin-bottom:.65rem
}

.analytics-actions{
   display:flex;
   gap:.55rem;
   flex-wrap:wrap
}

.analytics-btn{
   display:inline-flex;
   align-items:center;
   justify-content:center;
   gap:.4rem;
   padding:.58rem .9rem;
   border:1.5px solid var(--border);
   border-radius:999px;
   background:var(--surface);
   color:var(--text-soft);
   font-weight:800;
   font-size:.82rem;
   transition:.18s ease
}

.analytics-btn:hover{
   border-color:var(--rosa);
   color:var(--rosa);
   transform:translateY(-1px)
}

.analytics-tabs{
   display:flex;
   gap:.45rem;
   flex-wrap:wrap;
   margin-bottom:1.4rem
}

.analytics-tab{
   padding:.58rem .95rem;
   border:1.5px solid var(--border);
   background:rgba(255,255,255,.68);
   border-radius:999px;
   color:var(--text-soft);
   font-weight:800
}

.analytics-tab.active,.analytics-tab:hover{
   background:var(--surface2);
   border-color:var(--rosa);
   color:var(--rosa)
}

.analytics-grid{
   display:grid;
   grid-template-columns:repeat(4,minmax(0,1fr));
   gap:.9rem
}

.analytics-stat{
   background:rgba(255,255,255,.78);
   border:1.5px solid var(--border);
   border-radius:var(--radius-md);
   padding:1.05rem;
   box-shadow:var(--shadow-sm)
}

.analytics-stat small{
   display:block;
   color:var(--text-muted);
   font-weight:700;
   margin-bottom:.25rem
}

.analytics-stat strong{
   font-family:var(--font-display);
   font-size:1.7rem;
   line-height:1;
   color:var(--text)
}

.analytics-stat span{
   display:block;
   color:var(--text-soft);
   font-size:.78rem;
   margin-top:.35rem
}

.analytics-section{
   margin-top:1.25rem;
   background:rgba(255,255,255,.68);
   border:1.5px solid var(--border);
   border-radius:var(--radius-lg);
   padding:1.2rem;
   box-shadow:var(--shadow-sm)
}

.analytics-section-head{
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:.8rem;margin-bottom:1rem
}

.analytics-section-head h2{font-family:var(--font-display);font-size:1.2rem}
.analytics-section-head p{color:var(--text-muted);font-size:.82rem}
.analytics-records{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.record-card{padding:1rem;border:1.5px solid var(--border);border-radius:var(--radius-md);background:var(--surface);min-height:120px}
.record-card .record-icon{font-size:1.35rem}.record-card small{display:block;color:var(--text-muted);font-weight:800;margin:.35rem 0 .15rem}.record-card strong{font-family:var(--font-display);font-size:1.05rem}.record-card p{color:var(--text-soft);font-size:.78rem;margin-top:.25rem}
.duel{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:center}
.duel-person{text-align:center;padding:1rem;border-radius:var(--radius-md);border:1.5px solid var(--border);background:var(--surface)}
.duel-person strong{display:block;font-family:var(--font-display);font-size:1.5rem}.duel-person small{color:var(--text-muted)}
.duel-vs{font-family:var(--font-display);font-weight:900;color:var(--text-muted)}
.duel-bar{grid-column:1/-1;height:14px;border-radius:999px;background:rgba(34,211,238,.2);overflow:hidden;border:1px solid var(--border)}
.duel-bar>div{height:100%;background:linear-gradient(90deg,var(--rosa),var(--violeta));border-radius:inherit}
.analytics-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.25rem}
.top-panel{background:rgba(255,255,255,.7);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:1rem}
.top-panel h3{font-family:var(--font-display);margin-bottom:.65rem}.top-row{display:grid;grid-template-columns:34px 44px 1fr auto;gap:.65rem;align-items:center;padding:.55rem;border-radius:12px;cursor:pointer;transition:.16s ease}
.top-row:hover{background:var(--surface2);transform:translateX(2px)}.top-row img,.top-row .top-ph{width:44px;height:44px;border-radius:11px;object-fit:cover;background:var(--surface2);display:flex;align-items:center;justify-content:center}.top-row .num{font-weight:900;color:var(--text-muted);text-align:center}.top-row strong{display:block;font-size:.88rem}.top-row small{display:block;color:var(--text-muted);font-size:.72rem}.top-row .pts{font-weight:900;font-size:.82rem}
.analytics-searchbar{display:flex;gap:.7rem;align-items:center;margin-bottom:1rem}.analytics-searchbar input{flex:1;padding:.72rem .9rem;border:1.5px solid var(--border);border-radius:14px;background:var(--surface);outline:none}.analytics-searchbar input:focus{border-color:var(--violeta);box-shadow:0 0 0 3px var(--violeta-glow)}
.analytics-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.analytics-item{display:grid;grid-template-columns:58px 1fr auto;gap:.8rem;align-items:center;padding:.8rem;border:1.5px solid var(--border);border-radius:var(--radius-md);background:var(--surface);cursor:pointer;transition:.18s ease}.analytics-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:rgba(167,139,250,.45)}.analytics-item img,.analytics-item .ai-ph{width:58px;height:58px;border-radius:14px;object-fit:cover;background:var(--surface2);display:flex;align-items:center;justify-content:center;font-size:1.4rem}.analytics-item h3{font-size:.95rem}.analytics-item p{font-size:.74rem;color:var(--text-muted)}.analytics-item .ai-meta{display:flex;gap:.32rem;flex-wrap:wrap;margin-top:.35rem}.analytics-pill{font-size:.66rem;font-weight:800;padding:.18rem .42rem;border-radius:999px;border:1px solid var(--border);background:var(--bg2);color:var(--text-soft)}.analytics-item .ai-score{text-align:right}.analytics-item .ai-score strong{display:block;font-family:var(--font-display);font-size:1.1rem}.analytics-item .ai-score small{color:var(--text-muted)}
.detail-hero{display:grid;grid-template-columns:150px 1fr;gap:1.2rem;align-items:center;background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,248,243,.86));border:1.5px solid var(--border);border-radius:var(--radius-xl);padding:1.25rem;box-shadow:var(--shadow-md)}.detail-cover{width:150px;height:150px;border-radius:28px;object-fit:cover;background:var(--surface2);display:flex;align-items:center;justify-content:center;font-size:2.6rem}.detail-hero h1{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.2rem);line-height:1.05}.detail-hero .sub{color:var(--text-soft);font-weight:600;margin-top:.35rem}.detail-badges{display:flex;gap:.45rem;flex-wrap:wrap;margin-top:.8rem}.detail-badge{padding:.28rem .55rem;border-radius:999px;background:var(--surface);border:1px solid var(--border);font-size:.72rem;font-weight:800;color:var(--text-soft)}
.detail-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.7rem;margin-top:1rem}.detail-kpi{padding:.8rem;border-radius:var(--radius-md);background:rgba(255,255,255,.8);border:1.5px solid var(--border);text-align:center}.detail-kpi small{display:block;color:var(--text-muted);font-size:.68rem;font-weight:800}.detail-kpi strong{font-family:var(--font-display);font-size:1.22rem}
.chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.chart-card{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:1rem;overflow:hidden}.chart-card h3{font-family:var(--font-display);font-size:1rem}.chart-card p{color:var(--text-muted);font-size:.72rem;margin-bottom:.6rem}.kg-chart{width:100%;height:auto;display:block;min-height:220px}.kg-gridline{stroke:rgba(160,112,96,.15);stroke-width:1}.kg-line{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.kg-area{opacity:.08}.kg-dot{fill:var(--surface);stroke:currentColor;stroke-width:2}.kg-label{font-size:10px;fill:#a07060;font-family:Arial,sans-serif}.chart-empty{height:220px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:.82rem}
.history-table{width:100%;border-collapse:collapse;font-size:.78rem}.history-table th{color:var(--text-muted);font-weight:800;text-align:left;padding:.55rem;border-bottom:1px solid var(--border)}.history-table td{padding:.6rem .55rem;border-bottom:1px solid rgba(255,224,208,.7)}.history-table tr:hover td{background:rgba(254,240,230,.45)}.history-table .num{text-align:right;font-variant-numeric:tabular-nums}.history-wrap{overflow:auto}.empty-analytics{text-align:center;padding:3rem 1rem;color:var(--text-muted)}
@media(max-width:900px){.analytics-grid{grid-template-columns:repeat(2,1fr)}.analytics-records{grid-template-columns:1fr 1fr}.analytics-panels,.analytics-list,.chart-grid{grid-template-columns:1fr}.detail-kpis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.analytics-head{display:block}.analytics-actions{margin-top:.8rem}.analytics-grid,.analytics-records{grid-template-columns:1fr}.duel{grid-template-columns:1fr}.duel-vs{display:none}.duel-bar{grid-column:auto}.detail-hero{grid-template-columns:92px 1fr;padding:1rem}.detail-cover{width:92px;height:92px;border-radius:20px}.detail-kpis{grid-template-columns:repeat(2,1fr)}.top-row{grid-template-columns:28px 42px 1fr}.top-row .pts{grid-column:3;text-align:left}.analytics-item{grid-template-columns:50px 1fr}.analytics-item img,.analytics-item .ai-ph{width:50px;height:50px}.analytics-item .ai-score{grid-column:2;text-align:left}}
