/* Base compartida por la portada y el calendario.
   Idea: el residencial al anochecer. Azul noche, ventanas ámbar, y 12 colores, uno por apartamento. */
:root{
  --font-display:'Cormorant Garamond','Cormorant',Georgia,'Times New Roman',serif;
  --font:'Figtree','Segoe UI',system-ui,-apple-system,sans-serif;

  --night:#3B342B; --taupe:#7F7364; --taupe-deep:#5E5448; --sand:#F0EDE8;
  --amber:#FFB32C; --amber-deep:#E8890C; --amber-edge:#A85F00; --coral:#FF7A5C;

  --bg:#EEF3FA; --surface:#FFFFFF; --surface-2:#F5F8FD;
  --ink:#14213D; --muted:#566383; --line:#D8E0EE;
  --link:#0F5FA8; --danger:#B3261E; --danger-bg:#FCE4E2; --ok:#17734A; --ok-bg:#DCF3E6; --warn:#7A4E00; --warn-bg:#FFF0CC;
  --tile-top:#FFFFFF; --tile-bot:#EAF0FA; --tile-edge:#C9D5EA;
  --shadow:20,33,61;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0A1424; --surface:#12203A; --surface-2:#0F1B31;
    --ink:#E8EEFA; --muted:#9DB0CF; --line:#243759;
    --link:#7DB8F5; --danger:#FF9A92; --danger-bg:#3F1A1A; --ok:#6FD6A0; --ok-bg:#12382A; --warn:#F5C95C; --warn-bg:#3B2D09;
    --tile-top:#1A2C4C; --tile-bot:#132240; --tile-edge:#0B1527;
    --shadow:0,0,0;
    color-scheme:dark;
  }
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;
  padding-left:max(0px,env(safe-area-inset-left,0px));padding-right:max(0px,env(safe-area-inset-right,0px));
}
h1,h2,h3{font-family:var(--font-display);margin:0;text-wrap:balance;line-height:1.08;font-variant-numeric:lining-nums}
p{margin:0}
a{color:var(--link)}
.gutter{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.inner{max-width:1080px;margin:0 auto}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px}

/* Botones con relieve: se hunden al presionar */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border:0;cursor:pointer;
  border-radius:14px;padding:13px 22px;font-weight:700;font-size:16px;line-height:1.1;
  background:linear-gradient(180deg,#FFC654,var(--amber) 55%,var(--amber-deep));color:#2A1800;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 5px 0 var(--amber-edge),0 14px 22px -8px rgba(232,137,12,.65);
  transition:transform .12s,box-shadow .12s}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(4px);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 1px 0 var(--amber-edge),0 4px 8px -4px rgba(232,137,12,.6)}
.btn:disabled{opacity:.55;cursor:default;transform:none}
.btn.line{background:transparent;color:inherit;box-shadow:none;border:1.5px solid currentColor}
.btn.line:hover{background:rgba(255,255,255,.08)}
.btn.small{padding:9px 14px;font-size:14px;border-radius:11px;box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 3px 0 var(--amber-edge),0 8px 14px -6px rgba(232,137,12,.6)}
.btn.plain{background:var(--surface);color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 3px 0 var(--tile-edge),0 8px 14px -8px rgba(var(--shadow),.4);border:1px solid var(--line)}
.btn.danger{background:transparent;color:var(--danger);box-shadow:none;border:1.5px solid var(--danger);padding:8px 13px;font-size:14px;border-radius:10px}

/* Marca */
.brand{display:inline-flex;align-items:center;gap:10px;color:inherit;text-decoration:none;font-family:var(--font-display);font-weight:700;font-size:19px;letter-spacing:-.01em}
.brand svg{width:30px;height:30px;flex:none}

/* Pastillas de horario: teclas elevadas, iguales a los días del calendario */
.key{background:linear-gradient(180deg,var(--tile-top),var(--tile-bot));border-radius:14px;padding:14px 16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 4px 0 var(--tile-edge),0 14px 20px -12px rgba(var(--shadow),.5)}
.key b{display:block;font-family:var(--font-display);font-size:18px;letter-spacing:-.01em}
.key span{color:var(--muted);font-size:15px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}
