:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
--card:rgba(255,255,255,.94);--tx:#2a2320;--mut:#6d625c;--bd:#e3d9d2;--inp:#fff;--ok:#2f7d5b;--warn:#c0392b}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--card:rgba(28,24,23,.9);--tx:#f3ebe6;--mut:#b8aaa2;--bd:#4a3f3c;--inp:#332c2a;--ok:#6fc79f;--warn:#ff8a7a}}
:root[data-theme="dark"]{--card:rgba(28,24,23,.9);--tx:#f3ebe6;--mut:#b8aaa2;--bd:#4a3f3c;--inp:#332c2a;--ok:#6fc79f;--warn:#ff8a7a}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
body{margin:0;color:var(--tx);font:16px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif;min-height:100vh;background:#1c1f21 center/cover fixed no-repeat;--ac:#444}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:rgba(0,0,0,.55);z-index:10}
body.v-home{background-image:radial-gradient(circle at 30% 20%,#33383b,#16181a);--ac:#b9a06a}
body.v-clientes{background-image:url(../img/fondo-clientes-verde.jpg);--ac:#55702a}
body.v-miembros{background-image:url(../img/fondo-membresias-dorado.jpg);--ac:#9a6410}
body.v-calendario{background-image:url(../img/fondo-calendario-rojo.jpg);--ac:#b3202f}
body.v-stats{background-image:url(../img/fondo-estadisticas-azul.jpg);--ac:#2a63b8}
main{padding:0 14px 40px;max-width:680px;margin:0 auto}
.top{display:flex;justify-content:space-between;align-items:center;margin:0 -14px 14px;padding:14px 16px;background:rgba(0,0,0,.45);color:#fff}
.top h1{margin:0;font-size:1.35rem;letter-spacing:.02em}
.view{display:none}.view.on{display:block}
.home{display:flex;align-items:center;gap:18px;padding:34px 0 22px}
.logo{width:50%;max-width:260px;aspect-ratio:1;border-radius:50%;object-fit:cover;box-shadow:0 6px 24px rgba(0,0,0,.5)}
.menu{flex:1;display:flex;flex-direction:column;gap:12px}
.hb{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font:inherit;font-weight:600;cursor:pointer;text-align:left}
.hb span{font-size:1.5rem}
a.hb{text-decoration:none}
.hb.ig{margin-top:6px;background:linear-gradient(135deg,#8a3ab9,#e95950 60%,#fccc63);border-color:transparent}
.card{background:var(--card);border:1px solid var(--bd);border-radius:14px;padding:14px;margin-bottom:10px}
.row{display:flex;justify-content:space-between;align-items:center;gap:10px}
.mut{color:var(--mut);font-size:.88rem}
.price{font-weight:700;color:var(--ac);white-space:nowrap}
label{display:block;font-size:.85rem;margin:12px 0 4px;color:var(--mut)}
input,select{width:100%;padding:12px;border-radius:10px;border:1px solid var(--bd);background:var(--inp);color:var(--tx);font:inherit}
.fm label{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btn{width:100%;margin-top:14px;padding:14px;border:0;border-radius:12px;background:var(--ac);color:#fff;font:inherit;font-weight:700;cursor:pointer}
.btn.sm{width:auto;margin:0;padding:7px 12px;font-size:.85rem;background:transparent;color:var(--ac);border:1px solid var(--ac)}
.btn.sm.w{color:#fff;border-color:#fff}
.btn.sm.on{background:var(--ac);color:#fff}
.btn.sm.danger{color:var(--warn);border-color:var(--warn)}
.btn.sm.sure{background:var(--warn);color:#fff}
.chips,.acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.tag{font-size:.75rem;padding:2px 8px;border-radius:99px;border:1px solid var(--ok);color:var(--ok);white-space:nowrap}
.tag.late{border-color:var(--warn);color:var(--warn)}
.media{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}
.media img,.media video{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;background:var(--bd)}
.media img.big{grid-column:1/-1;aspect-ratio:auto;object-fit:contain}
.mi{position:relative}
.mi button{position:absolute;top:2px;right:2px;border:0;border-radius:50%;width:24px;height:24px;background:var(--warn);color:#fff;cursor:pointer}
.msg{margin-top:12px;padding:12px;border-radius:10px;background:var(--card);border:1px solid var(--warn);color:var(--warn);display:none}
h2{font-size:1.05rem;margin:4px 0 8px}
h3{margin:0}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.cal b{font-size:.75rem;color:var(--mut)}
.cal button{aspect-ratio:1;border:1px solid var(--bd);border-radius:10px;background:var(--inp);color:var(--tx);font:inherit;cursor:pointer;position:relative;padding:0}
.cal button.hoy{border-color:var(--ac);font-weight:700}
.cal button.sel{background:var(--ac);color:#fff}
.cal button i{position:absolute;bottom:3px;left:0;right:0;font-size:.62rem;font-style:normal;color:var(--ac)}
.cal button.sel i{color:#fff}
.mh{text-transform:capitalize;font-weight:700}
.br{display:grid;grid-template-columns:86px 1fr 34px;gap:8px;align-items:center;margin:6px 0;font-size:.88rem}
.br i{display:block;height:10px;border-radius:6px;background:var(--ac);min-width:2px}
.br b{text-align:right}
.dk{background:rgba(20,14,6,.84);border-radius:14px;padding:14px;color:#fff}
.dk h2{color:#fff}
.dk label{color:#f3e8d6;font-size:.9rem}
.dk .btn.sm{color:#fff;border-color:#fff}
.dk .btn.sm.on{background:#e0a43a;border-color:#e0a43a;color:#1a1208}
body.v-miembros .price{color:var(--tx)}