:root{
  --pine:#1f3b30; --pine-2:#2f5647; --paper:#f6f2e9; --card:#fffdf8;
  --brass:#b0803a; --ink:#25302a; --muted:#7c8a80; --line:#e4ddcd;
  --amber:#c98a2b; --green:#3d7a54; --red:#b0503f; --slate:#4a6572;
  --radius:14px; --shadow:0 1px 2px rgba(31,59,48,.06),0 6px 20px rgba(31,59,48,.06);
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  line-height:1.55;font-size:16px}
h1,h2,h3,.serif{font-family:"Fraunces","Georgia",serif;font-weight:600;
  letter-spacing:-.01em;color:var(--pine)}
a{color:var(--pine-2)}
.container{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:560px}

/* Header */
.topbar{background:var(--pine);color:#f3efe4}
.topbar .container{display:flex;align-items:center;justify-content:space-between;
  min-height:64px;gap:16px}
.brand{display:flex;align-items:center;gap:12px;font-family:"Fraunces",serif;
  font-size:1.25rem;color:#f6f2e9;text-decoration:none;font-weight:600}
.brand .leaf{width:30px;height:30px;flex:0 0 auto}
.nav{display:flex;gap:6px;flex-wrap:wrap}
.nav a{color:#dfe7e0;text-decoration:none;padding:8px 14px;border-radius:9px;
  font-size:.92rem}
.nav a:hover{background:rgba(255,255,255,.08)}
.nav a.active{background:var(--brass);color:#241a08}

/* Cards & layout */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:22px;margin:18px 0}
.hero{padding:38px 0 8px}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;
  color:var(--brass);font-weight:600;margin:0 0 8px}
.lead{color:var(--muted);max-width:52ch}
.grid{display:grid;gap:16px}
.grid-2{grid-template-columns:1fr 1fr}
@media(max-width:720px){.grid-2{grid-template-columns:1fr}}

/* Forms */
label{display:block;font-size:.86rem;font-weight:600;margin:14px 0 6px;color:var(--pine)}
input,select,textarea{width:100%;padding:11px 13px;border:1px solid var(--line);
  border-radius:10px;background:#fff;font:inherit;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--brass);
  outline-offset:1px;border-color:var(--brass)}
textarea{min-height:74px;resize:vertical}
.help{font-size:.8rem;color:var(--muted);margin-top:4px}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--pine);
  color:#f6f2e9;border:none;padding:12px 20px;border-radius:11px;font:inherit;
  font-weight:600;cursor:pointer;text-decoration:none}
.btn:hover{background:var(--pine-2)}
.btn.brass{background:var(--brass);color:#241a08}
.btn.ghost{background:transparent;color:var(--pine);border:1px solid var(--line)}
.btn.sm{padding:7px 12px;font-size:.85rem;border-radius:9px}

/* Slots */
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.slot{padding:11px 6px;text-align:center;border:1px solid var(--line);border-radius:10px;
  background:#fff;cursor:pointer;font-weight:600;font-size:.9rem}
.slot:hover{border-color:var(--brass)}
.slot.on{background:var(--pine);color:#fff;border-color:var(--pine)}
.empty{color:var(--muted);font-style:italic;padding:10px 0}

/* Table */
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);
  font-size:.92rem;vertical-align:middle}
th{font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
tr:last-child td{border-bottom:none}

/* Status pills */
.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:.76rem;
  font-weight:700;text-transform:capitalize}
.pill.pendiente{background:#fbf0d8;color:#8a6410}
.pill.confirmada{background:#dcefe1;color:#1f5a37}
.pill.cancelada{background:#f4dcd7;color:#8a2f21}
.pill.completada{background:#dde6ec;color:#33505f}

/* Alerts */
.alert{padding:12px 15px;border-radius:11px;margin:14px 0;font-size:.92rem}
.alert.err{background:#f6ddd7;color:#7d2b1c;border:1px solid #e6b6ab}
.alert.ok{background:#dcefe1;color:#1f5a37;border:1px solid #b3d8bf}

.toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;
  flex-wrap:wrap;margin:8px 0 4px}
.tabs{display:flex;gap:6px}
.tabs a{padding:8px 14px;border-radius:9px;text-decoration:none;color:var(--pine);
  border:1px solid var(--line);font-size:.88rem;font-weight:600;background:#fff}
.tabs a.active{background:var(--pine);color:#fff;border-color:var(--pine)}
.muted{color:var(--muted)}
.day-head{margin:22px 0 2px;font-size:1.05rem;color:var(--pine-2)}
footer{color:var(--muted);font-size:.82rem;text-align:center;padding:28px 0}
