:root{
  --ink:#1d1d1f;--ink-2:#2c2c2e;--paper:#f5f5f7;--surface:#ffffff;
  --line:#d2d2d7;--muted:#6e6e73;--gold:#0071e3;--gold-soft:#e8f2ff;
  --success:#248a3d;--warning:#a05a00;--danger:#d70015;--white:#fff;
  --shadow:0 8px 30px rgba(0,0,0,.06);--radius:20px;
}
*{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{background:var(--paper);font-family:system-ui,-apple-system,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:14px;letter-spacing:-.12px}
.app{grid-template-columns:250px minmax(0,1fr)}
.sidebar{background:rgba(250,250,252,.88);color:var(--ink);border-right:1px solid rgba(0,0,0,.08);padding:20px 14px;backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px)}
.brand{padding:7px 12px 24px;border-bottom:1px solid rgba(0,0,0,.08)}
.brand strong{font-size:17px;letter-spacing:-.25px;font-weight:650}
.brand span{margin-top:5px;color:var(--muted);font-size:11px;letter-spacing:-.05px;text-transform:none}
nav{gap:2px}.nav-label{padding:17px 12px 5px;color:#86868b;letter-spacing:.02em;font-size:10px;font-weight:600;text-transform:none}
.nav-btn{min-height:42px;color:#424245;padding:10px 12px;border-radius:10px;font-weight:450;transition:background-color .18s ease,color .18s ease,transform .18s ease}
.nav-btn:hover,.nav-btn:focus-visible{background:rgba(0,0,0,.045);color:var(--ink)}
.nav-btn:active{transform:scale(.985)}
.nav-btn.active{background:#e8e8ed;color:#1d1d1f;font-weight:600;box-shadow:inset 0 0 0 1px rgba(0,0,0,.025)}
.nav-btn small{color:#86868b;opacity:1}
.profile-switch{background:rgba(255,255,255,.72);border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:8px 10px}
.profile-switch select{color:var(--ink);font-weight:550}.profile-switch span{color:#86868b;letter-spacing:0;text-transform:none}
.side-foot{color:#86868b}.status-dot{background:#30d158}
main{max-width:1600px;width:100%;margin:0 auto;padding:40px 44px 64px}
.topbar{align-items:center;margin-bottom:34px}
.eyebrow{color:#86868b;text-transform:none;letter-spacing:-.08px;font-size:12px;font-weight:500;margin-bottom:8px}
h1,.section-title h2,.panel h2,.metric .value,.kpi b{font-family:system-ui,-apple-system,"SF Pro Display","Segoe UI",sans-serif;color:var(--ink);letter-spacing:-.035em}
h1{font-size:40px;line-height:1.08;font-weight:650}.subtitle{font-size:15px;line-height:1.45;margin-top:8px}
.top-actions{gap:9px}
.btn{min-height:40px;border:0;background:#e8e8ed;color:#1d1d1f;border-radius:980px;padding:0 16px;font-weight:550;letter-spacing:-.15px;transition:transform .16s ease,background-color .16s ease,box-shadow .16s ease}
.btn:hover{border:0;background:#dedee3;box-shadow:none}.btn:active{transform:scale(.975)}
.btn:focus-visible,.nav-btn:focus-visible,.icon-btn:focus-visible{outline:3px solid rgba(0,113,227,.32);outline-offset:2px}
.btn.primary,.btn.gold{background:#0071e3;border:0;color:#fff}.btn.primary:hover,.btn.gold:hover{background:#0077ed}
.metric,.panel{background:rgba(255,255,255,.92);border:0;border-radius:var(--radius);box-shadow:var(--shadow)}
.metric{padding:22px}.metric .label{color:#86868b;font-size:12px;margin-bottom:12px}.metric .value{font-size:31px;font-weight:620}.metric .foot{color:#86868b;margin-top:11px}
.panel{padding:24px}.panel-head{margin-bottom:20px}.panel h2{font-size:21px;font-weight:620}.panel h3{font-weight:600}
.section-title{margin-bottom:22px}.section-title h2{font-size:30px;line-height:1.12;font-weight:650}.section-title p{margin-top:7px;font-size:15px}
.metrics,.grid{gap:18px}.metrics{margin-bottom:18px}.two-col{grid-template-columns:minmax(0,1.6fr) minmax(300px,.72fr)}
.search,.field input,.field select,.field textarea{border:1px solid rgba(0,0,0,.12);background:#fff;border-radius:12px;color:var(--ink);transition:border-color .16s ease,box-shadow .16s ease}
.search{min-height:42px;padding:0 14px}
.field input,.field select,.field textarea{padding:12px 13px}.field label{color:#6e6e73;text-transform:none;letter-spacing:-.05px;font-size:12px;font-weight:600}
.field input:focus,.field select:focus,.field textarea:focus,.search:focus{outline:none;border-color:#0071e3;box-shadow:0 0 0 4px rgba(0,113,227,.14)}
table{font-variant-numeric:tabular-nums}th{color:#86868b;text-transform:none;letter-spacing:-.04px;font-size:11px;padding:0 10px 11px;border-bottom:1px solid #d2d2d7}td{padding:15px 10px;border-bottom:1px solid #ececf0}
.tag{min-height:26px;background:#f0f0f2;color:#515154;border-radius:980px;padding:4px 10px;font-weight:600}.tag.ok{background:#e8f7ec;color:#187a32}.tag.warn{background:#fff2dc;color:#8a4b00}.tag.danger{background:#ffe8eb;color:#c20a1d}
.progress{height:8px;background:#e8e8ed}.progress span{background:#0071e3}
.activity-item i{background:#0071e3}.list{gap:11px}.list-item{border:0;border-radius:14px;background:#f5f5f7;padding:15px 16px}.list-item small{color:#6e6e73}
.icon-btn{border:0;background:#e8e8ed;border-radius:980px;min-height:34px;padding:0 12px;color:#1d1d1f;font-weight:550}.icon-btn:hover{border:0;background:#dedee3}
.board{gap:15px}.board-col{background:#f0f0f2;border:0;border-radius:17px;padding:12px}.task-card{background:#fff;border:0;border-radius:14px;padding:15px;box-shadow:0 2px 12px rgba(0,0,0,.045)}
.priority{background:#ff9f0a}.priority.Alta{background:#ff3b30}.priority.Baja{background:#30d158}
.callout{background:#e8f2ff;border:0;border-radius:14px;color:#174f86;padding:15px 17px}
.checkline{border-bottom:1px solid #ececf0}.checkline input{accent-color:#0071e3}
.empty{border:1px dashed #c7c7cc;border-radius:14px;color:#86868b}
.kpi{border:0;background:#f5f5f7;border-radius:14px;padding:17px}.capital-bar{background:#e8e8ed}.capital-bar span:nth-child(1){background:#0071e3}.capital-bar span:nth-child(2){background:#ff453a}.capital-bar span:nth-child(3){background:#30d158}.capital-bar span:nth-child(4){background:#8e8e93}
dialog{border:0;border-radius:22px;background:rgba(255,255,255,.98);box-shadow:0 24px 80px rgba(0,0,0,.22);backdrop-filter:blur(24px)}dialog::backdrop{background:rgba(0,0,0,.35);backdrop-filter:blur(5px)}
.modal-head,.modal-foot{background:rgba(255,255,255,.92);border-color:#e5e5e7}.close{width:32px;height:32px;border-radius:50%;background:#e8e8ed;font-size:20px;line-height:1}
.toast{background:rgba(29,29,31,.92);border-radius:980px;box-shadow:0 10px 34px rgba(0,0,0,.18);backdrop-filter:blur(16px)}
a{color:#0066cc;text-decoration:none}a:hover{text-decoration:underline}
@media(max-width:1100px){main{padding:32px 28px 56px}.metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.sidebar{background:rgba(250,250,252,.96);box-shadow:18px 0 50px rgba(0,0,0,.14)}main{padding:24px 16px 44px}h1{font-size:32px}.topbar{margin-bottom:25px}.panel{padding:18px}.metric{padding:18px}.mobile-menu{display:inline-flex}.two-col{grid-template-columns:1fr}}
@media(max-width:430px){.metrics{grid-template-columns:1fr}.section-title h2{font-size:27px}}
@media(prefers-color-scheme:dark){
  :root{--ink:#f5f5f7;--ink-2:#e8e8ed;--paper:#000;--surface:#1c1c1e;--line:#3a3a3c;--muted:#a1a1a6;--gold-soft:#122c48;--shadow:none}
  body{background:#000;color:#f5f5f7}.sidebar{background:rgba(28,28,30,.9);color:#f5f5f7;border-color:rgba(255,255,255,.1)}.brand,.nav-btn,.profile-switch select{color:#f5f5f7}.brand{border-color:rgba(255,255,255,.1)}
  .nav-btn{color:#c7c7cc}.nav-btn:hover,.nav-btn:focus-visible{background:rgba(255,255,255,.08);color:#fff}.nav-btn.active{background:#3a3a3c;color:#fff}.profile-switch{background:rgba(44,44,46,.72);border-color:rgba(255,255,255,.12)}
  h1,.section-title h2,.panel h2,.metric .value,.kpi b{color:#f5f5f7}.metric,.panel{background:#1c1c1e}.btn{background:#3a3a3c;color:#fff}.btn:hover{background:#48484a}
  .search,.field input,.field select,.field textarea{background:#2c2c2e;border-color:#48484a;color:#fff}.list-item,.kpi{background:#2c2c2e}.board-col{background:#1c1c1e}.task-card{background:#2c2c2e;box-shadow:none}
  th,td,.checkline{border-color:#38383a}.tag{background:#3a3a3c;color:#d1d1d6}.progress,.capital-bar{background:#3a3a3c}.icon-btn,.close{background:#3a3a3c;color:#fff}.callout{background:#102a43;color:#9dccff}
  dialog,.modal-head,.modal-foot{background:#1c1c1e;color:#f5f5f7;border-color:#38383a}.empty{border-color:#48484a}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Olympus tab transitions: energetic, fast, and non-blocking. */
.tab-transition{position:fixed;inset:0 0 0 250px;z-index:60;overflow:hidden;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .08s ease,visibility 0s linear .7s}
.tab-transition::before{content:"";position:absolute;inset:0;background:linear-gradient(112deg,transparent 0 34%,rgba(0,113,227,.08) 43%,rgba(41,151,255,.32) 49%,rgba(255,255,255,.25) 50%,rgba(0,113,227,.1) 57%,transparent 66%);transform:translateX(-120%)}
.tab-transition::after{content:"";position:absolute;top:-45%;left:-35%;width:42%;height:190%;background:radial-gradient(ellipse,rgba(41,151,255,.36),rgba(0,113,227,.11) 38%,transparent 68%);filter:blur(18px);transform:translateX(-120%) rotate(12deg)}
.tab-transition i{position:absolute;left:-20%;width:140%;height:2px;background:linear-gradient(90deg,transparent,#2997ff 32%,#fff 50%,#0071e3 68%,transparent);filter:drop-shadow(0 0 8px #2997ff);transform:translateX(-110%) skewX(-18deg)}
.tab-transition i:nth-child(1){top:23%}.tab-transition i:nth-child(2){top:51%;height:1px;animation-delay:.06s}.tab-transition i:nth-child(3){top:78%;height:3px;animation-delay:.11s}
.app.is-switching .tab-transition{opacity:1;visibility:visible;transition-delay:0s}
.app.is-switching .tab-transition::before{animation:olympus-sweep .65s cubic-bezier(.2,.8,.2,1)}
.app.is-switching .tab-transition::after{animation:olympus-burst .62s cubic-bezier(.16,1,.3,1)}
.app.is-switching .tab-transition i{animation:olympus-streak .52s cubic-bezier(.16,1,.3,1) forwards}
.view.view-exit{display:block;animation:olympus-exit .18s cubic-bezier(.4,0,1,1) forwards;transform-origin:50% 20%}
.view.view-enter{display:block;animation:olympus-enter .58s cubic-bezier(.16,1,.3,1) both;transform-origin:50% 20%}
.view.view-enter>.grid,.view.view-enter>.panel,.view.view-enter>.section-title,.view.view-enter>.callout,.view.view-enter>.board{animation:olympus-rise .52s cubic-bezier(.16,1,.3,1) both}
.view.view-enter>:nth-child(2){animation-delay:.055s}.view.view-enter>:nth-child(3){animation-delay:.1s}
.app.is-switching #pageTitle{animation:olympus-title .48s cubic-bezier(.16,1,.3,1) both}
.app.is-switching .nav-btn.active{box-shadow:0 0 0 1px rgba(0,113,227,.18),0 8px 24px rgba(0,113,227,.13)}
@keyframes olympus-sweep{0%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes olympus-burst{0%{transform:translateX(-120%) rotate(12deg);opacity:0}22%{opacity:1}100%{transform:translateX(330%) rotate(12deg);opacity:0}}
@keyframes olympus-streak{0%{transform:translateX(-110%) skewX(-18deg);opacity:0}18%{opacity:1}100%{transform:translateX(110%) skewX(-18deg);opacity:0}}
@keyframes olympus-exit{to{opacity:0;transform:scale(.975) translateY(8px);filter:blur(7px)}}
@keyframes olympus-enter{0%{opacity:0;transform:perspective(900px) rotateX(3deg) scale(.965) translateY(24px);filter:blur(9px)}55%{filter:blur(0)}100%{opacity:1;transform:none;filter:none}}
@keyframes olympus-rise{0%{opacity:0;transform:translateY(18px) scale(.985)}100%{opacity:1;transform:none}}
@keyframes olympus-title{0%{opacity:.15;transform:translateY(-10px);filter:blur(6px)}100%{opacity:1;transform:none;filter:none}}
@media(max-width:720px){.tab-transition{inset:0}.view.view-enter{animation-duration:.46s}.tab-transition i{width:170%;left:-35%}}
@media(prefers-reduced-motion:reduce){.tab-transition{display:none}.view.view-enter,.view.view-exit,.view.view-enter>*,.app.is-switching #pageTitle{animation:none!important;filter:none!important;transform:none!important}}
