@font-face {
  font-family: 'Tiza';
  src: url('/static/fonts/cabin-sketch-700.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
}

:root {
  --tiza: #f3f0e6;
  --tiza-suave: rgba(243, 240, 230, .78);
  --amarillo: #ffe27a;
  --celeste: #9fdcf5;
  --pizarra: #26392f;
  --madera-1: #7a4e2d;
  --madera-2: #5a361d;
  --madera-3: #8f603a;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  background: #1d1915;
  color: var(--tiza);
  font: 500 19px/1.4 system-ui, -apple-system, 'Segoe UI', Roboto, Ubuntu, sans-serif;
}

/* Un solo letrero centrado; nunca columnas */
.caballete {
  max-width: 480px;
  margin: 0 auto;
  padding: 10px 10px 28px;
}

/* Marco de madera */
.marco {
  padding: 14px;
  border-radius: 8px;
  background:
    repeating-linear-gradient(92deg, rgba(0,0,0,.10) 0 2px, transparent 2px 9px, rgba(255,255,255,.05) 9px 10px, transparent 10px 17px),
    linear-gradient(180deg, var(--madera-3), var(--madera-1) 40%, var(--madera-2));
  box-shadow: 0 10px 30px rgba(0,0,0,.55), inset 0 0 0 2px rgba(0,0,0,.25), inset 0 2px 0 rgba(255,255,255,.15);
}

/* Pizarra verde con textura sutil de tiza */
.tablero {
  position: relative;
  min-height: 70vh;
  padding: 26px 22px 22px;
  border-radius: 3px;
  background-color: var(--pizarra);
  background-image:
    radial-gradient(ellipse at 20% 10%, rgba(255,255,255,.07), transparent 55%),
    radial-gradient(ellipse at 80% 85%, rgba(255,255,255,.05), transparent 50%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  box-shadow: inset 0 0 40px rgba(0,0,0,.55);
  text-shadow: 0 0 1px rgba(243,240,230,.35);
  text-align: center;
}

.nombre, h2, .titulo-dia, .monto {
  font-family: 'Tiza', 'Comic Sans MS', 'Chalkboard SE', cursive;
  font-weight: 700;
  letter-spacing: .5px;
}

.nombre {
  margin: 0;
  font-size: clamp(30px, 9vw, 42px);
  line-height: 1.1;
}

.titulo-dia {
  margin: 10px 0 0;
  font-size: 26px;
  color: var(--celeste);
}

.fecha {
  margin: 2px 0 0;
  color: var(--tiza-suave);
  font-size: 17px;
}

/* Separador: línea discontinua de tiza */
hr.tiza {
  border: 0;
  height: 0;
  border-top: 2px dashed rgba(243,240,230,.45);
  margin: 18px 6px;
}

h2 {
  margin: 0 0 6px;
  font-size: 28px;
  color: var(--celeste);
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.lista li {
  padding: 3px 0;
  font-size: 20px;
}

.linea p {
  margin: 0;
  font-size: 19px;
}
.linea .cat {
  color: var(--celeste);
  font-weight: 700;
}
.linea .sep { color: var(--tiza-suave); }

.precio .monto {
  margin: 0;
  font-size: 68px;
  line-height: 1;
  color: var(--amarillo);
}
.precio .ejecutivo {
  margin: 8px 0 0;
  font-size: 18px;
}

.carta ul { text-align: left; }
.carta li {
  display: flex;
  align-items: baseline;
  padding: 4px 0;
  font-size: 19px;
}
.carta .dots {
  flex: 1;
  min-width: 18px;
  margin: 0 6px;
  border-bottom: 2px dotted rgba(243,240,230,.55);
  transform: translateY(-4px);
}
.carta .p {
  color: var(--amarillo);
  font-weight: 700;
  white-space: nowrap;
}

.vacio {
  margin: 40px 0;
  font-size: 22px;
  color: var(--tiza-suave);
}

.pie {
  font-size: 14px;
  line-height: 1.5;
  color: var(--tiza-suave);
}
.pie p { margin: 4px 0; }
.pie .pension { color: var(--tiza); }
.pie .pension b { color: var(--amarillo); }
.pie a {
  color: var(--celeste);
  text-underline-offset: 3px;
}