/* Identidad de IA Portafolio (iaportafolio web): azul marino, naranja, papel crema, Manrope + DM Serif Display.
   Se carga al final y solo redefine tokens y acabados; la estructura sigue en style.css y shelf.css. */
@font-face{font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;src:url(/static/fonts/Manrope-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;src:url(/static/fonts/Manrope-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DM Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/DMSerifDisplay-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"DM Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/DMSerifDisplay-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --navy:#071a3d;--navy-soft:#0f2d69;--blue:#143a8d;
  --orange:#f16a1b;--orange-bright:#ff7a22;--orange-contrast:#b54708;
  --paper:#f3efe6;--paper-deep:#e8e0d2;--cream:#fffaf1;
  --ink:#08152e;--muted:#5e6471;--line:rgba(8,21,46,.16);
  --green:var(--navy);--pale:var(--paper-deep);--amber:var(--orange-contrast);
  --serif:"DM Serif Display",Georgia,serif;
}
body{font-family:Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--paper);color:var(--ink)}
::selection{color:#fff;background:var(--orange)}
:focus-visible{outline:3px solid color-mix(in srgb,var(--orange) 75%,#fff);outline-offset:3px}

h1{font-weight:680;letter-spacing:-.05em;line-height:1}
h2,h3{font-weight:700;letter-spacing:-.02em}
h1 em,.login-card h1 em{font-family:var(--serif);font-style:normal;font-weight:400;letter-spacing:-.035em;color:var(--orange-contrast)}
.eyebrow{display:flex;align-items:center;gap:.7rem;font-size:.7rem;font-weight:800;letter-spacing:.16em;color:var(--muted)}
.eyebrow::before{content:"";width:28px;height:3px;border-radius:99px;background:var(--orange);box-shadow:0 0 14px rgba(241,106,27,.55)}

/* Botones: primario naranja de contraste (AA), secundario crema */
button{border-radius:.8rem;background:var(--orange-contrast);font-weight:800;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
button:hover{filter:none;transform:translateY(-1px);box-shadow:0 12px 28px rgba(241,106,27,.28)}
button:disabled{transform:none;box-shadow:none}
button.secondary,.button-link{color:var(--navy);background:var(--cream);border:1px solid var(--line)}
button.secondary:hover,.button-link:hover{box-shadow:0 8px 20px rgba(7,26,61,.12)}
button.quiet{background:transparent;color:var(--muted);box-shadow:none}
button.quiet:hover{transform:none;box-shadow:none;color:var(--navy)}
button.danger{background:#a33a2c}
input,select,textarea{border:1px solid rgba(8,21,46,.22);border-radius:.6rem;background:var(--cream)}
label{color:var(--muted)}

/* Acceso: fondo marino con cuadrícula, como el hero de la web */
.login{background:radial-gradient(circle at 71% 40%,rgba(27,70,150,.62),transparent 32%),radial-gradient(circle at 15% 8%,rgba(241,106,27,.16),transparent 26%),var(--navy);position:relative;overflow:hidden}
.login::before{content:"";position:absolute;inset:0;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to bottom,black,transparent 85%)}
.login-card{position:relative;background:var(--cream);border:1px solid rgba(255,255,255,.7);border-radius:1.35rem;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.login-card .logo{display:block;height:46px;width:auto;margin-bottom:26px}
.login-card h1{font-size:46px;margin:6px 0 18px;letter-spacing:-.05em}

/* Navegación lateral: tarjeta crema flotante con el logo */
aside{background:var(--cream);border:1px solid rgba(255,255,255,.7);border-radius:1.2rem;inset:12px auto 12px 12px;width:225px;box-shadow:0 10px 35px rgba(7,26,61,.12)}
.brand{margin:0 4px 26px;padding:0}
.brand img{display:block;width:100%;height:auto;max-width:170px}
.brand span{display:block;font-size:9px;font-weight:800;letter-spacing:.16em;color:var(--orange-contrast);margin-top:10px;white-space:nowrap}
nav button{color:var(--muted);font-weight:600;border-radius:.7rem;background:transparent;box-shadow:none}
nav button:hover{transform:none;box-shadow:none;background:rgba(8,21,46,.05);color:var(--navy)}
nav button.active{background:var(--navy);color:#fff;font-weight:800}
.aside-note{color:var(--ink)}
.workspace{margin-left:249px}

/* Superficies */
.card,.panel,.stat,.kpi,.cam,.drawer,.insights,.plan-stage,.cell-info,.alert-card{background:var(--cream);border-color:var(--line)}
.panel,.card,.insights,.drawer,.plan-stage{border-radius:1.1rem}
.panel,.insights,.drawer,.plan-stage{box-shadow:0 10px 30px rgba(7,26,61,.06)}
.stat strong,.kpi strong{font-weight:700;letter-spacing:-.05em;color:var(--navy)}
.kpi.warn strong{color:var(--orange-contrast)}
th{background:rgba(8,21,46,.04)}
.note{border-left-color:var(--orange)}
.badge{background:rgba(8,21,46,.07)}.badge.good{background:rgba(20,58,141,.1);color:var(--blue)}.badge.warn{background:rgba(241,106,27,.14);color:var(--orange-contrast)}
.headline{background:var(--navy);color:#fff;border-radius:1.1rem}
.headline p{color:#fff}
.score{background:rgba(20,58,141,.1);color:var(--blue)}.score.low{background:rgba(241,106,27,.14);color:var(--orange-contrast)}
.pill{background:rgba(20,58,141,.1);color:var(--blue)}.pill::before{background:var(--orange)}
.pill.off{background:rgba(8,21,46,.07);color:var(--muted)}.pill.off::before{background:var(--muted)}
.cam.selected{border-color:var(--orange);box-shadow:0 0 0 3px rgba(241,106,27,.22)}
.cam.best::after{background:var(--orange-contrast)}
.floor-toggle .on{background:var(--navy);border-color:var(--navy);color:#fff}
.chip{background:var(--cream);color:var(--navy);font-weight:600}
.chip:has(input:checked){background:var(--navy);color:#fff;border-color:var(--navy)}
.bars .track{background:rgba(8,21,46,.08)}.bars .fill{background:var(--navy)}.bars .fill.amber{background:var(--orange)}
.alert-card{border-left-color:var(--navy)}.alert-card.warn{border-left-color:var(--orange)}
#toast{background:var(--navy);border-radius:.9rem}

/* Plano: tonos de papel y trazos marinos; el calor y las marcas en naranja */
.plan-stage{background:var(--cream)}
.plan-floor{fill:#fffdf8;stroke:var(--navy)}
.plan-room{fill:#f3efe6;stroke:#b9b09f}
.plan-furniture{fill:#ece5d6;stroke:#b9b09f}
.plan-column{fill:#c9bfae;stroke:#8f8575}
.plan-stairs{fill:#fffdf8;stroke:#8f8575}.plan-step{stroke:#b9b09f}
.plan-rack{fill:#dbe3f5;stroke:var(--blue)}
.plan-door{stroke:var(--orange)}
.cam-dot{fill:var(--cream);stroke:var(--navy-soft)}
.cam-node.watched .cam-dot{fill:var(--navy);stroke:var(--navy)}
.cam-node.watched .cam-num{fill:#fff}
.cam-node.offline .cam-dot{stroke:#a33a2c}
.cam-node.selected .cam-dot,.cam-node:focus .cam-dot{stroke:var(--orange);stroke-width:.18}
.badge-alert{fill:var(--orange-contrast)}.badge-people{fill:var(--blue)}
.plan-heat{fill:var(--orange)}
.plan-trail{stroke:var(--blue);stroke-opacity:.4}
.plan-fov{fill:var(--blue);stroke:var(--blue)}
.calib-marker circle,.calib-dot,.shelf-cell{fill:var(--orange)}.calib-dot{background:var(--orange)}
.calib-dot.pending{background:var(--blue)}
.hotspot circle{fill:var(--orange-bright)}.hotspot text{fill:#fff}
.shelf-frame{fill:var(--cream);stroke:var(--navy-soft)}
.shelf-cell{stroke:var(--cream)}
.replay-dot{fill:var(--orange-contrast)}
.cell-info{border-left-color:var(--orange)}
.cell-idx{background:var(--navy);color:var(--orange-bright)}

@media(max-width:950px){aside{width:185px}.workspace{margin-left:209px}}
@media(max-width:620px){aside{position:static;inset:auto;width:auto;margin:10px 10px 0;border-radius:1rem}.workspace{margin:0}.brand img{max-width:130px}.login-card .logo{height:38px}}