:root { --navy:#102a43; --blue:#2563eb; --sky:#eaf3ff; --ink:#172b4d; --muted:#62748a; --green:#0f9f6e; --amber:#d97706; --red:#dc2626; --white:#fff; --border:#dbe5f0; --shadow:0 14px 40px rgba(16,42,67,.10); }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); font-family:Inter,Segoe UI,Arial,sans-serif; background:linear-gradient(135deg,#f3f8ff 0%,#f8fafc 45%,#edfdf6 100%); min-height:100vh; }
header { background:var(--navy); color:#fff; box-shadow:0 2px 12px rgba(15,42,67,.2); }
.nav-container { max-width:1400px; margin:auto; min-height:68px; padding:12px 24px; display:flex; justify-content:space-between; gap:16px; align-items:center; }
.logo { font-size:1.2rem; font-weight:800; letter-spacing:.01em; }.user-info { display:flex; align-items:center; gap:14px; }.user-tag { font-size:.92rem; }
.dashboard-container { max-width:1400px; margin:0 auto; padding:28px 24px 48px; }.dashboard-grid-student { display:grid; grid-template-columns:250px minmax(0,1fr); gap:24px; }.sim-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr); gap:24px; align-items:start; }
.glass-card,.sidebar { background:rgba(255,255,255,.92); border:1px solid var(--border); border-radius:18px; box-shadow:var(--shadow); }.glass-card { padding:24px; }.sidebar { padding:12px; height:max-content; position:sticky; top:18px; }.sidebar h3 { padding:6px 10px 12px; margin:0; }
.menu-item { border-radius:10px; cursor:pointer; padding:12px 10px; margin:3px 0; font-weight:650; transition:.18s; }.menu-item:hover,.menu-item.active { background:var(--sky); color:var(--blue); }
.canvas-container { height:330px; border-radius:14px; overflow:hidden; background:#eaf6ff; border:1px solid #c8def2; position:relative; }.canvas-container canvas { width:100%; height:100%; display:block; }
.sim-controls { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:20px; }.form-group { margin:0 0 15px; }.form-group label { display:block; font-size:.85rem; font-weight:700; margin:0 0 7px; color:#344b68; }.form-control { width:100%; min-height:43px; padding:10px 12px; border:1px solid #bdcddd; border-radius:9px; background:#fff; color:var(--ink); font:inherit; }.form-control:focus { outline:3px solid rgba(37,99,235,.18); border-color:var(--blue); }
button,.btn-primary,.btn-logout { border:0; border-radius:9px; cursor:pointer; font:700 .92rem inherit; padding:11px 15px; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; transition:transform .15s,filter .15s; }button:hover,.btn-primary:hover,.btn-logout:hover { transform:translateY(-1px); filter:brightness(1.04); }.btn-primary { width:100%; background:var(--blue); color:#fff; }.btn-action { background:#e9f0f8; color:var(--ink); }.btn-success { background:var(--green); color:#fff; }.btn-secondary { background:#e9f0f8; }.btn-action:disabled { opacity:.5; cursor:not-allowed; transform:none; }.btn-logout { background:rgba(255,255,255,.13); color:#fff; border:1px solid rgba(255,255,255,.22); padding:8px 11px; }
.data-preview { min-height:86px; padding:13px; color:#31506f; background:#f3f8fc; border-left:4px solid var(--blue); border-radius:8px; font-size:.9rem; line-height:1.55; }.report-card { position:sticky; top:18px; }.alert { padding:12px; border-radius:8px; margin-bottom:16px; }.alert-danger { color:#991b1b; background:#fef2f2; }.alert-success { color:#065f46; background:#ecfdf5; }footer { padding:22px; color:var(--muted); text-align:center; font-size:.88rem; }
.auth-wrapper { min-height:calc(100vh - 70px); display:grid; place-items:center; padding:28px; }.auth-card { width:min(100%,480px); }.auth-header { text-align:center; margin-bottom:24px; }.auth-header h1 { margin:0 0 8px; color:var(--navy); }.auth-header p { margin:0; color:var(--muted); }.auth-footer { margin-top:18px; text-align:center; font-size:.9rem; }.auth-footer a { color:var(--blue); font-weight:700; }
.table-responsive { overflow:auto; }.table-premium { width:100%; border-collapse:collapse; min-width:700px; }.table-premium th,.table-premium td { padding:14px 12px; border-bottom:1px solid var(--border); text-align:left; }.table-premium th { color:#51657e; font-size:.78rem; text-transform:uppercase; }.badge { display:inline-block; border-radius:99px; padding:5px 9px; font-size:.78rem; font-weight:750; }.badge-mru { background:#e0f2fe;color:#0369a1; }.badge-caida { background:#fef3c7;color:#92400e; }.badge-pendulo { background:#d1fae5;color:#047857; }.modal { display:none; position:fixed; inset:0; z-index:10; align-items:center; justify-content:center; background:rgba(15,32,52,.55); padding:20px; }.modal.active { display:flex; }.modal-content { width:min(680px,100%); max-height:90vh; overflow:auto; background:#fff; border-radius:16px; padding:24px; }.modal-header { display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:1px solid var(--border); }.modal-close { font-size:1.5rem; padding:4px 10px; background:transparent; }.modal-section { padding-top:16px; }.modal-section h4 { margin:0 0 7px; }.modal-text { white-space:pre-wrap; line-height:1.6; }.param-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }.param-item { padding:10px; border:1px solid var(--border); border-radius:8px; }.param-label { display:block; font-size:.78rem; color:var(--muted); }.param-value { font-weight:750; }
@media (max-width:1000px) { .sim-grid { grid-template-columns:1fr; }.report-card,.sidebar { position:static; }.dashboard-grid-student { grid-template-columns:1fr; }.sidebar { display:flex; flex-wrap:wrap; gap:4px; }.sidebar h3 { width:100%; }.menu-item { flex:1 1 175px; } }
@media (max-width:650px) { .nav-container,.dashboard-container { padding-left:15px; padding-right:15px; }.nav-container { align-items:flex-start; flex-direction:column; }.user-info { width:100%; justify-content:space-between; }.glass-card { padding:17px; }.canvas-container { height:270px; }.sim-controls { grid-template-columns:1fr; gap:0; }.param-grid { grid-template-columns:1fr; } }