@import "https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@300;400;500;600;700&display=swap";
:root{--wine:#72052f;--wine-light:#8a1a45;--wine-bg:#72052f;--gold:#c9a84c;--gold-light:#e8d48b;--cream:#fffbfa;--cream-dark:#f5ede0;--text-dark:#2d1b1b;--text-mid:#6b5050;--text-light:#9a8080;--green:#2d7a4f;--green-light:#e8f5e9;--yellow:#c9a84c;--yellow-light:#fff8e1;--red:#c0392b;--red-light:#fdedec;--border:#e8ddd0;--shadow:0 2px 12px #72052f14;--radius:12px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--cream);color:var(--text-dark);min-height:100vh;font-family:Inter,sans-serif}.header{border-bottom:1px solid var(--border);z-index:100;background:#fff;justify-content:space-between;align-items:center;gap:24px;padding:24px 40px;display:flex;position:sticky;top:0}.header-left h1{color:var(--wine);font-family:Instrument Serif,serif;font-size:28px;font-weight:400}.header-left p{color:var(--text-mid);margin-top:4px;font-size:14px}.header-right{align-items:center;gap:12px;display:flex}.filter-select{border:1px solid var(--border);color:var(--text-dark);cursor:pointer;background:#fff;border-radius:8px;min-width:200px;padding:10px 16px;font-family:Inter,sans-serif;font-size:14px}.filter-select:focus{outline:2px solid var(--wine);outline-offset:-1px}.btn-refresh{background:var(--wine);color:#fff;cursor:pointer;border:none;border-radius:8px;align-items:center;gap:6px;padding:10px 20px;font-family:Inter,sans-serif;font-size:14px;font-weight:500;transition:background .2s;display:flex}.btn-refresh:hover{background:var(--wine-light)}.btn-refresh.loading{opacity:.7;cursor:wait}.last-updated{color:var(--text-light);font-size:12px}.main{max-width:1440px;margin:0 auto;padding:32px 40px}.kpi-row{grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:28px;display:grid}.kpi-card{background:var(--wine-bg);border-radius:var(--radius);color:#fff;opacity:.6;padding:24px 28px;position:relative}.kpi-card .label{opacity:.85;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:13px;display:flex}.kpi-card .value{font-family:Instrument Serif,serif;font-size:42px;font-weight:400}.kpi-card .info-icon{cursor:help;border:1.5px solid #fff6;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:13px;display:flex;position:relative}.kpi-card .info-icon:hover .tooltip{display:block}.tooltip{color:var(--text-dark);width:240px;box-shadow:var(--shadow);z-index:10;background:#fff;border-radius:8px;padding:12px 16px;font-family:Inter,sans-serif;font-size:12px;line-height:1.5;display:none;position:absolute;top:32px;right:0}.chart-row{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:28px;display:grid}.card{border:1px solid var(--border);border-radius:var(--radius);background:#fff;padding:24px 28px}.card h3{color:var(--text-dark);margin-bottom:20px;font-size:15px;font-weight:600}.session-bar{align-items:center;gap:12px;margin-bottom:12px;display:flex}.session-bar .bar-label{width:180px;color:var(--text-mid);text-overflow:ellipsis;white-space:nowrap;flex-shrink:0;font-size:13px;overflow:hidden}.session-bar .bar-track{background:var(--cream-dark);border-radius:6px;flex:1;height:24px;overflow:hidden}.session-bar .bar-fill{background:var(--wine);border-radius:6px;min-width:2px;height:100%;transition:width .6s}.session-bar .bar-value{text-align:right;width:40px;color:var(--text-dark);font-size:14px;font-weight:600}.session-total{color:var(--text-light);border-top:1px solid var(--border);margin-top:8px;padding-top:12px;font-size:12px}.rating-row{align-items:center;gap:12px;margin-bottom:14px;display:flex}.rating-row .label{width:140px;color:var(--text-dark);font-size:14px}.rating-row .bar-track{background:var(--cream-dark);border-radius:5px;flex:1;height:10px;overflow:hidden}.rating-row .bar-fill{border-radius:5px;height:100%;transition:width .6s}.rating-row.promoter .bar-fill{background:var(--green)}.rating-row.passive .bar-fill{background:var(--gold)}.rating-row.detractor .bar-fill{background:var(--red)}.rating-row .count{text-align:right;width:30px;font-size:14px;font-weight:600}.rating-row.promoter .count{color:var(--green)}.rating-row.passive .count{color:var(--gold)}.rating-row.detractor .count{color:var(--red)}.detail-metrics{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px;display:grid}.detail-metric-card{border:1px solid var(--border);border-radius:var(--radius);text-align:center;background:#fff;padding:20px 24px}.detail-metric-card .metric-label{color:var(--text-mid);margin-bottom:8px;font-size:12px;line-height:1.4}.detail-metric-card .metric-value{color:var(--wine);font-family:Instrument Serif,serif;font-size:32px}.detail-metric-card .metric-scale{color:var(--text-light);margin-top:4px;font-size:11px}.participant-section{border:1px solid var(--border);border-radius:var(--radius);background:#fff;margin-bottom:28px;padding:24px 28px}.participant-section h3{color:var(--text-dark);margin-bottom:16px;font-size:15px;font-weight:600}.participant-section .section-desc{color:var(--text-mid);margin-bottom:16px;font-size:13px}.participant-form{border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:flex-end;gap:12px;margin-bottom:20px;padding-bottom:20px;display:flex}.form-group{flex-direction:column;gap:4px;display:flex}.form-group label{color:var(--text-mid);font-size:12px;font-weight:500}.form-group input,.form-group select{border:1px solid var(--border);color:var(--text-dark);background:#fff;border-radius:6px;padding:8px 12px;font-family:Inter,sans-serif;font-size:13px}.form-group input:focus,.form-group select:focus{outline:2px solid var(--wine);outline-offset:-1px}.btn-add{background:var(--wine);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:8px 20px;font-family:Inter,sans-serif;font-size:13px;font-weight:500;transition:background .2s}.btn-add:hover{background:var(--wine-light)}.btn-delete{color:var(--red);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:16px}.btn-delete:hover{background:var(--red-light)}.participant-table{border-collapse:collapse;width:100%;font-size:13px}.participant-table th{background:var(--cream);text-align:left;color:var(--text-dark);border-bottom:1px solid var(--border);padding:8px 12px;font-weight:600}.participant-table td{border-bottom:1px solid var(--border);color:var(--text-mid);padding:8px 12px}.participant-table tr:hover td{background:var(--cream)}.representativity-bar{background:var(--cream);border-radius:8px;align-items:center;gap:12px;margin-top:16px;padding:16px;display:flex}.representativity-bar .rep-label{color:var(--text-mid);min-width:160px;font-size:13px}.representativity-bar .rep-track{background:var(--cream-dark);border-radius:6px;flex:1;height:12px;overflow:hidden}.representativity-bar .rep-fill{border-radius:6px;height:100%;transition:width .6s}.representativity-bar .rep-value{text-align:right;min-width:60px;font-size:14px;font-weight:600}.comments-row{grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:20px;display:grid}.comment-section{border:1px solid var(--border);border-radius:var(--radius);background:#fff;overflow:hidden}.comment-header{cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.comment-header h3{font-size:14px;font-weight:600}.comment-header .toggle{color:var(--text-light);font-size:18px;transition:transform .3s}.comment-header.open .toggle{transform:rotate(180deg)}.comment-list{max-height:0;transition:max-height .3s;overflow:hidden}.comment-list.open{max-height:600px;overflow-y:auto}.comment-item{border-top:1px solid var(--border);color:var(--text-mid);padding:12px 24px;font-size:13px;line-height:1.5}.comment-item .comment-meta{color:var(--text-light);margin-top:4px;font-size:11px}.comment-item:nth-child(odd){background:var(--cream)}.all-responses{border:1px solid var(--border);border-radius:var(--radius);background:#fff;overflow:hidden}.all-responses .comment-header{padding:16px 28px}.responses-table{border-collapse:collapse;width:100%;font-size:13px}.responses-table th{background:var(--cream);text-align:left;color:var(--text-dark);border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 16px;font-weight:600}.responses-table td{border-bottom:1px solid var(--border);color:var(--text-mid);text-overflow:ellipsis;white-space:nowrap;max-width:300px;padding:10px 16px;overflow:hidden}.responses-table tr:hover td{background:var(--cream)}.badge{border-radius:12px;padding:2px 10px;font-size:12px;font-weight:600;display:inline-block}.badge.promoter{background:var(--green-light);color:var(--green)}.badge.passive{background:var(--yellow-light);color:var(--yellow)}.badge.detractor{background:var(--red-light);color:var(--red)}.no-data{text-align:center;color:var(--text-light);padding:48px;font-size:14px}.spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.6s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.status-banner{text-align:center;padding:12px 40px;font-size:13px;display:none}.status-banner.error{background:var(--red-light);color:var(--red);display:block}.status-banner.info{color:#1565c0;background:#e3f2fd;display:block}@media (max-width:1024px){.kpi-row,.chart-row,.comments-row{grid-template-columns:1fr}.detail-metrics{grid-template-columns:repeat(2,1fr)}.header{flex-direction:column;align-items:flex-start}.main{padding:20px}}.nav-tabs{border-bottom:1px solid var(--border);z-index:99;background:#fff;gap:0;padding:0 40px;display:flex;position:sticky;top:48px}.nav-tab{cursor:pointer;color:var(--text-mid);background:0 0;border:none;border-bottom:3px solid #0000;padding:14px 28px;font-family:Inter,sans-serif;font-size:14px;font-weight:500;transition:all .2s}.nav-tab:hover{color:var(--text-dark);background:var(--cream)}.nav-tab.active{border-bottom-color:var(--wine);color:var(--wine);font-weight:600}.init-table{border-collapse:collapse;width:100%;font-size:13px}.init-table th{background:var(--cream);text-align:left;color:var(--text-dark);border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 14px;font-weight:600}.init-table td{border-bottom:1px solid var(--border);color:var(--text-mid);padding:10px 14px}.init-table tr:hover td{background:var(--cream)}.format-badge{border-radius:12px;padding:2px 10px;font-size:11px;font-weight:600;display:inline-block}.format-badge.workshop{background:var(--wine);color:#fff}.format-badge.one-on-one{background:var(--gold);color:#fff}.format-badge.focus-group{background:var(--green);color:#fff}.format-badge.ambos{background:linear-gradient(135deg, var(--wine), var(--gold));color:#fff}.format-badge.reunion{background:var(--cream-dark);color:var(--text-mid)}.estado-badge{border-radius:12px;padding:2px 10px;font-size:11px;font-weight:600;display:inline-block}.estado-badge.completado{background:var(--green-light);color:var(--green)}.estado-badge.en-curso{background:var(--yellow-light);color:var(--gold)}.estado-badge.pendiente{background:var(--cream-dark);color:var(--text-mid)}.client-cards{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-bottom:28px;display:grid}.client-card{border:2px solid var(--border);border-radius:var(--radius);cursor:pointer;background:#fff;padding:20px;transition:all .2s}.client-card:hover{border-color:var(--wine)}.client-card.selected,.client-card.active{border-color:var(--wine);background:var(--cream)}.client-card h4{color:var(--wine);margin-bottom:8px;font-family:Instrument Serif,serif;font-size:16px;font-weight:400}.client-card .client-stats{color:var(--text-mid);font-size:12px;line-height:1.6}.timeline-area{margin-bottom:24px}.timeline-area h4{color:var(--text-dark);border-bottom:1px solid var(--border);margin-bottom:12px;padding-bottom:8px;font-size:14px;font-weight:600}.timeline-item{border-radius:8px;align-items:center;gap:16px;margin-bottom:6px;padding:10px 16px;font-size:13px;display:flex}.timeline-item.past{border:1px solid var(--border);background:#fff}.timeline-item.current{background:var(--yellow-light);border:1px solid var(--gold)}.timeline-item .tl-date{width:90px;color:var(--text-light);flex-shrink:0;font-size:12px}.timeline-item .tl-name{color:var(--text-dark);flex:1;font-weight:500}.timeline-item .tl-participants{text-align:center;width:60px;color:var(--text-mid);font-size:12px}.timeline-item .tl-feedback{text-align:right;width:80px;font-size:12px}.client-header{background:var(--wine);color:#fff;border-radius:var(--radius);justify-content:space-between;align-items:center;margin-bottom:24px;padding:28px;display:flex}.client-header h2{font-family:Instrument Serif,serif;font-size:28px;font-weight:400}.client-header .ch-stats{gap:32px;display:flex}.client-header .ch-stat{text-align:center}.client-header .ch-stat .ch-value{font-family:Instrument Serif,serif;font-size:24px}.client-header .ch-stat .ch-label{opacity:.8;font-size:11px}.overview-kpis{grid-template-columns:repeat(5,1fr);gap:16px;margin-bottom:24px;display:grid}.overview-kpi{background:var(--wine-bg);border-radius:var(--radius);color:#fff;text-align:center;padding:20px 24px}.overview-kpi .ok-value{font-family:Instrument Serif,serif;font-size:36px;font-weight:400}.overview-kpi .ok-label{opacity:.85;margin-top:4px;font-size:12px}.overview-summary{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px;display:grid}.overview-summary-card{border:1px solid var(--border);border-radius:var(--radius);text-align:center;background:#fff;padding:20px 24px}.overview-summary-card .os-value{color:var(--wine);font-family:Instrument Serif,serif;font-size:28px}.overview-summary-card .os-label{color:var(--text-mid);margin-top:4px;font-size:12px}.overview-charts{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px;display:grid}@media (max-width:1024px){.overview-kpis{grid-template-columns:repeat(3,1fr)}.overview-summary{grid-template-columns:repeat(2,1fr)}.overview-charts{grid-template-columns:1fr}}.nps-mini{gap:16px;margin-bottom:24px;display:flex}.nps-mini-card{border:1px solid var(--border);border-radius:var(--radius);text-align:center;background:#fff;flex:1;padding:16px 20px}.nps-mini-card .mini-label{color:var(--text-mid);margin-bottom:4px;font-size:11px}.nps-mini-card .mini-value{color:var(--wine);font-family:Instrument Serif,serif;font-size:28px}.overview-impact-row{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;display:grid}.impact-card{border:1px solid var(--border);border-radius:var(--radius);background:#fff;padding:20px 24px}.impact-value{color:var(--wine);font-family:Instrument Serif,serif;font-size:32px}.impact-label{color:var(--text-dark);margin-top:2px;font-size:13px;font-weight:500}.impact-sub{color:var(--text-light);margin-top:4px;font-size:11px}.upcoming-dropdown{margin-bottom:8px}.upcoming-toggle{border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;text-align:left;background:0 0;align-items:center;gap:10px;width:100%;padding:12px 20px;transition:background .2s;display:flex}.upcoming-toggle:hover{background:var(--yellow-light)}.upcoming-count{background:var(--gold);color:#fff;border-radius:12px;padding:2px 10px;font-size:12px;font-weight:600}.upcoming-arrow{color:var(--text-light);margin-left:auto;font-size:16px;transition:transform .3s}.upcoming-arrow.open{transform:rotate(180deg)}.overview-upcoming{background:var(--yellow-light);border:1px solid var(--gold);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:8px;padding:16px 20px;display:flex}.upcoming-chip{border:1px solid var(--border);background:#fff;border-radius:20px;align-items:center;gap:6px;padding:6px 14px;display:flex}.upcoming-chip .uc-count{color:var(--gold);font-family:Instrument Serif,serif;font-size:20px}.upcoming-chip .uc-label{color:var(--text-mid);font-size:12px}.upcoming-detail{border-top:1px solid #c9a84c4d;flex-wrap:wrap;gap:8px;width:100%;margin-top:4px;padding-top:10px;display:flex}.upcoming-item{color:var(--text-mid);border:1px solid var(--border);background:#fff;border-radius:6px;padding:3px 10px;font-size:12px}.overview-tooltip{border:1px solid var(--border);z-index:100;pointer-events:none;max-width:280px;color:var(--text-dark);background:#fff;border-radius:8px;padding:12px 16px;font-size:12px;line-height:1.6;position:fixed;box-shadow:0 4px 20px #0000001f}.overview-tooltip strong{color:var(--wine);margin-bottom:4px;font-size:13px;display:block}.overview-tooltip .tooltip-line{color:var(--text-mid);display:block}