:root{--bg: #2b3038;--panel: #323842;--panel-2: #2f353e;--text: #ecf1f8;--muted: #b9c3d2;--line: #4a5568;--line-strong: #5a677d;--orange: #e38a2f;--green: #78c850;--red: #d94e4e;--purple: #8d7ddb;--cyan: #4fc7c7;--yellow: #d0c53d;--positive: #47cf7f;--negative: #ff6f74}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Tahoma,sans-serif;background:#2b3038;color:var(--text)}.app{min-height:100vh;padding:6px;display:flex;flex-direction:column;gap:6px;overflow-x:hidden}.header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 0}.app-title{margin:0;font-size:1rem;font-weight:700;line-height:1.1}.header-actions{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}.status-banner{border:1px solid #4b6487;background:#243246;color:#d2e6ff;padding:6px 8px;font-size:.8rem}.status-banner.warning{border-color:#85693f;background:#3a2f1f;color:#ffe2b2}.status-banner.floating{position:fixed;left:10px;bottom:10px;z-index:80}.status-banner.floating.error{bottom:42px}.kpi-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.kpi-card{background:var(--panel);border:1px solid var(--line-strong);padding:5px 7px}.kpi-card.primary{border-color:#8fb8ff}.kpi-title{margin:0;font-size:.74rem;color:var(--muted)}.kpi-title-row{display:inline-flex;align-items:center;gap:6px}.kpi-value{margin:3px 0 2px;font-weight:700;font-size:1.45rem;line-height:1}.kpi-delta{margin:0;font-size:.74rem}.kpi-delta.positive{color:var(--positive)}.kpi-delta.negative{color:var(--negative)}.kpi-delta.neutral{color:var(--muted)}.layout{display:flex;flex-direction:column;gap:6px;min-height:0;width:100%;min-width:0}.canvas{min-height:0}.right{display:flex;flex-direction:column;gap:6px;min-height:0;min-width:0}.bottom{display:flex;flex-direction:column;gap:6px;min-height:0;width:100%;min-width:0}.panel{background:var(--panel);border:1px solid var(--line-strong);padding:6px}.panel h2{margin:0 0 6px;font-size:.84rem;letter-spacing:.3px;text-transform:uppercase}.panel-title-row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:6px}.panel-title-row h2{margin:0}.panel-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.mini-btn{padding:4px 8px;font-size:.72rem;font-weight:700}.accent-orange{border-color:var(--orange)}.accent-green{border-color:var(--green)}.accent-blue{border-color:#7fb3ff}.accent-red{border-color:var(--red)}.accent-yellow{border-color:var(--yellow)}.assistive-text{margin:5px 0;font-size:.8rem;color:var(--muted)}.label-row{display:inline-flex;align-items:center;gap:6px}.event-label{font-size:.82rem;color:#c6d4e8}.canvas-panel{height:clamp(240px,32vh,360px);min-height:0;display:flex;flex-direction:column;overflow:hidden;border-color:var(--purple)}.inspector-card{border:1px solid #5a6f8f;padding:6px;background:#253043;color:#d9ebff}.inspector-card p{margin:5px 0;font-size:.8rem}.inspector-card ul{margin:0;padding-left:16px;font-size:.78rem}.canvas-stage{flex:1 1 auto;min-height:0;overflow:hidden;position:relative;border:1px solid var(--line);background:linear-gradient(180deg,#1f2530,#1b212b)}.canvas-stage canvas{display:block}.canvas-placeholder{display:grid;place-items:center;height:100%;color:var(--muted)}.chip{border:1px solid #6a7892;padding:3px 8px;font-size:.72rem;color:#dbe6f8;background:#2b3442}.chip.success{border-color:#2d7a52;background:#1f3a2d;color:#b6f1cf}.chart-panel{min-height:180px;width:100%;min-width:0;display:flex;flex-direction:column}.timeline-panel{max-height:clamp(200px,30vh,320px);overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;width:100%;min-width:0}.timeline-panel ul{margin:0;padding-left:18px}.timeline-panel li{font-size:.9rem;line-height:1.35;margin-bottom:4px}.timeline-panel li strong{font-size:.9rem}.timeline-filters{display:inline-flex;gap:6px;flex-wrap:wrap}.timeline-filters select{font-size:.72rem;padding:3px 6px}.timeline-tag{display:inline-block;margin-left:6px;padding:1px 6px;border:1px solid #5f7391;font-size:.66rem;color:#cfe1fb;background:#27374d}.timeline-tag.actor-ia{border-color:#4f8a71;background:#234236}.timeline-tag.actor-usuario{border-color:#7c6aa3;background:#3a3450}.timeline-tag.actor-sistema{border-color:#6b7f9a;background:#334256}.timeline-tag.sev-warning{border-color:#b38745;background:#4b3a22}.timeline-tag.sev-error{border-color:#bb5454;background:#4f2626}.timeline-text{font-size:.8rem;color:#d7e5fa;margin-top:2px}.timeline-text.observed{color:#bce6cb}label{display:grid;gap:6px;margin-bottom:8px}.checkbox-row{display:flex;align-items:center;gap:8px}.checkbox-row input{margin:0}.time-block{border:1px solid var(--line);padding:6px;margin-bottom:6px;background:#2a323f}.time-header{display:flex;justify-content:space-between;align-items:center;font-size:.82rem;margin-bottom:6px}.time-slider{width:100%}.btn-row{display:flex;gap:6px;margin-bottom:4px;flex-wrap:wrap}.speed-badge{border:1px solid #5f7391;background:#2a3444;color:#dce9fb;padding:5px 8px;font-size:.78rem;font-weight:700;display:inline-flex;align-items:center}button,select,input,textarea{border:1px solid #627794;padding:5px 8px;background:#2b3443;color:#eef5ff}textarea{resize:vertical;font-family:inherit}button{cursor:pointer;font-weight:700;font-size:.8rem;white-space:nowrap;line-height:1.1}button:hover{border-color:#9cc0ef;background:#36455b}button.active{border-color:var(--orange);background:#4b3b27;color:#ffe0ba}.clear-btn{width:100%}.help-box{margin-top:8px;border:1px solid var(--line);background:#2a313d;padding:6px 8px}.ai-panel{max-height:none;overflow:visible}.scenario-headline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.scenario-actions{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}.scenario-pill{border:1px solid #5c7190;background:#27364d;color:#dbeaff;padding:3px 8px;font-size:.74rem;font-weight:700}.scenario-auto-toggle{margin:0;font-size:.78rem;color:#c7d7ee}.scenario-grid{display:grid;gap:6px;margin:6px 0 8px}.scenario-card{display:grid;gap:4px;border:1px solid #4f6482;background:#283749;color:#e8f1ff;padding:6px 8px}.scenario-card strong{font-size:.8rem}.scenario-card span{font-size:.74rem;color:#c9d9f0}.scenario-card.active-scenario{border-color:#7fb3ff;background:#2f4664}.ai-chat{display:grid;gap:6px;margin:6px 0 8px}.ai-bubble{border:1px solid #4d627f;background:#253346;padding:6px 8px}.ai-bubble .role{display:inline-block;font-size:.68rem;font-weight:800;color:#9ec4ff;margin-bottom:2px}.ai-bubble p{margin:0;font-size:.8rem;color:#e8f2ff}.ai-bubble.assistant{border-color:#516784;background:#253547}.ai-bubble.assistant.severity-info{border-color:#5579a8;background:#243a57}.ai-bubble.assistant.severity-warning{border-color:#bf9350;background:#4b3a22}.ai-bubble.assistant.severity-critical{border-color:#c25f5f;background:#4a2628}.ai-bubble.assistant.severity-success{border-color:#4f946f;background:#214034}.ai-bubble.assistant.secondary{border-color:#5d7392;background:#28384d}.ai-bubble.user{border-color:#6c5f87;background:#2e3248}.ai-action-btn{border:1px solid #4f6482;background:#273449;color:#e8f1ff;font-weight:800;letter-spacing:.1px;transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease}.ai-action-btn:hover:not(:disabled){border-color:#88addf;background:#314562;box-shadow:0 0 0 1px #88addf40 inset}.ai-action-btn.ai-action-simulate{border-color:#5f7fb0;background:#2a3e5d}.ai-action-btn.ai-action-recommend{border-color:#2f8f66;background:#1f3e34;color:#d6ffe8}.ai-action-btn.ai-action-recommend.is-loading{border-color:#d0a04a;background:#5a4520;color:#ffe7bf}.ai-action-btn.ai-action-apply{border-color:#8f6a34;background:#4b3921;color:#ffe8c9}.ai-action-btn:disabled{border-color:#4f5f77;background:#2a313d;color:#93a4bc;cursor:not-allowed;box-shadow:none}.ai-highlight{border:1px solid #5c6f8d;padding:6px 8px;background:#273449}.ai-highlight p{margin:0 0 5px}.ai-highlight p:last-child{margin-bottom:0}.warning-block{border-color:#b98d4a;background:#3f3425}.success-block{border-color:#4c8f6b;background:#223b31}.phase-badge{border:1px solid #5f7391;padding:2px 8px;font-size:.7rem;font-weight:700;background:#2b3a50;color:#dbeaff}.phase-badge.info{border-color:#5f8ad0;background:#273d63}.phase-badge.warning{border-color:#bf9350;background:#4b3b22}.phase-badge.success{border-color:#4f946f;background:#214034}.phase-badge.error{border-color:#bf5a5a;background:#4f2828}.help-box summary{cursor:pointer;font-weight:700;color:#b6d5ff}.help-box ul{margin:8px 0 0;padding-left:18px}.link-btn{border:0;background:transparent;color:#7cc9ff;font-weight:700;cursor:pointer;padding:0}.zone-tag{background:#374456;border:1px solid #627794;padding:2px 8px;font-size:.66rem;font-weight:700;color:#d8e9ff;white-space:nowrap;pointer-events:none}.zone-tag.selected{border-color:var(--orange)}.alert-tag{padding:1px 7px;font-size:.62rem;font-weight:800;letter-spacing:.3px;white-space:nowrap}.alert-tag.critical{background:#7f2222;color:#ffe6e6;border:1px solid #ff8e8e}.alert-tag.warning{background:#6a4a1f;color:#ffe8c8;border:1px solid #f3bf7b}.example-list{display:grid;gap:6px;margin-top:8px}.example-btn{text-align:left;font-size:.8rem}.help-panel h3{margin:10px 0 6px;font-size:.9rem}.help-panel ol,.help-panel ul{margin:0;padding-left:18px;font-size:.82rem}.help-hint-wrap{position:relative;display:inline-flex;align-items:center}.help-hint{width:15px;height:15px;min-width:15px;border-radius:50%;border:1px solid #7b8ea9;background:#34475f;color:#e4eeff;font-size:.66rem;font-weight:800;line-height:1;padding:0;display:inline-flex;align-items:center;justify-content:center}.help-hint-tooltip{position:absolute;left:20px;top:50%;transform:translateY(-50%);background:#202b3b;color:#e4eefc;border:1px solid #5d7392;padding:6px 8px;width:220px;font-size:.76rem;line-height:1.35;white-space:normal;word-break:break-word;opacity:0;pointer-events:none;transition:opacity .14s ease;z-index:6}.help-hint-wrap:hover .help-hint-tooltip,.help-hint-wrap:focus-within .help-hint-tooltip{opacity:1}.help-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000;background:#0a101b9e;display:flex;justify-content:center;align-items:flex-start;padding:54px 12px 12px}.help-modal{width:min(900px,100%);max-height:calc(100vh - 70px);overflow:auto;border:1px solid var(--line);background:var(--panel-2)}.help-modal-header{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border-bottom:1px solid var(--line);background:#293240}.help-modal-header h2{margin:0;font-size:.9rem}.help-modal-body{padding:8px}.help-modal-body .help-panel{margin:0}.settings-modal{width:min(760px,100%)}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.settings-grid label{margin-bottom:0}.settings-actions{margin-top:8px}.settings-subsection{margin-top:10px;padding-top:8px;border-top:1px solid var(--line)}.settings-subsection h3{margin:0 0 6px;font-size:.86rem;text-transform:uppercase;letter-spacing:.2px}.event-checkbox-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.compare-layout{display:flex;flex-direction:column;gap:8px}.compare-chart-panel{min-height:280px}.compare-chart-controls{display:inline-flex;gap:8px;align-items:center}.compare-chart-controls label{display:inline-flex;align-items:center;gap:6px;margin:0}.compare-actions{display:flex;justify-content:flex-end}.compare-topbar{display:grid;gap:4px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));border:0;background:transparent;padding:0}.compare-pill{border:1px solid var(--line);background:#2d3747;padding:5px 6px;display:grid;gap:2px}.compare-pill strong{font-size:.74rem;color:#d8e6ff}.compare-pill span{font-size:.72rem;color:#b7c8de}.compare-cards{display:grid;gap:8px;grid-template-columns:1fr}.compare-scorebar{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:6px;border:0;background:transparent;padding:0}.compare-scorebar>span{border:1px solid var(--line);padding:6px 8px;background:#2c3849;font-size:.8rem}.chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.winner{border-color:var(--green);background:#2c3a34}.canvas-overlay{position:absolute;top:8px;left:8px;z-index:3;width:auto;max-width:min(320px,calc(100% - 16px));display:grid;gap:8px;pointer-events:none}.canvas-overlay .inspector-card{margin-bottom:0}.canvas-tooltip{position:absolute;top:8px;right:8px;z-index:3;max-width:min(330px,calc(100% - 16px));border:1px solid #5f7391;padding:6px 8px;background:#263244;color:#cfdcf0;font-size:.78rem;line-height:1.35;pointer-events:none}.canvas-mode-badge{position:absolute;right:8px;bottom:8px;z-index:3;border:1px solid #5f7391;padding:3px 8px;font-size:.7rem;color:#dbe6f8;background:#2c3748;pointer-events:none}.canvas-legend{position:absolute;left:8px;bottom:8px;z-index:3;display:grid;gap:4px;border:1px solid #4f607a;background:#232e3f;padding:5px 7px;font-size:.72rem;color:#d7e4f8;pointer-events:none}.legend-item{display:inline-flex;align-items:center;gap:6px}.legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.legend-dot.critical{background:#d64545}.legend-dot.warning{background:#d48f32}.legend-dot.normal{background:#2fa64e}.recharts-cartesian-axis-tick-value{fill:#a8bfdc}.recharts-tooltip-wrapper .recharts-default-tooltip{background:#1e2838!important;border:1px solid #4f668a!important;color:#dcecff!important}.chart-panel .recharts-responsive-container{width:100%!important;min-width:0}@media (pointer: coarse){*::-webkit-scrollbar{width:14px;height:14px}*::-webkit-scrollbar-track{background:#1f2734}*::-webkit-scrollbar-thumb{background:#5f7391;border:2px solid #1f2734}}@media (min-width: 768px){.app{padding:6px;gap:6px}.layout{gap:6px}.kpi-strip{grid-template-columns:repeat(6,minmax(0,1fr))}.canvas-panel{height:clamp(240px,30vh,320px)}.right{display:grid;grid-template-columns:1fr 1fr;gap:6px;align-items:start}.bottom{display:grid;grid-template-columns:1fr;gap:6px;align-items:start}.timeline-panel{max-height:clamp(260px,34vh,360px)}.compare-cards{grid-template-columns:1fr 1fr}}@media (max-width: 767px){.settings-grid,.event-checkbox-grid{grid-template-columns:1fr}.help-hint-tooltip{left:auto;right:0;top:calc(100% + 6px);transform:none;width:min(280px,calc(100vw - 28px))}}@media (min-width: 1200px){.layout{display:grid;gap:6px;grid-template-columns:2fr 1fr;align-items:start;min-height:0}.left-stack{display:flex;flex-direction:column;gap:6px;width:100%;min-width:0}.right{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto;align-items:start;gap:6px}.left-stack .bottom{display:flex;flex-direction:column;gap:6px;width:100%;min-width:0;align-items:stretch}.canvas-panel{height:clamp(250px,31vh,340px)}.ai-panel,.control-panel{max-height:none;overflow:visible}.timeline-panel{max-height:clamp(300px,38vh,430px);overflow-y:auto;overflow-x:hidden}.compare-cards{grid-template-columns:1fr 1fr 1fr}}