:root{--bg:#2a0a3a;--ink:#fff4fb;--card:#fff4fb;--cardink:#2a0a3a;--pink:#ff3e8a;--sun:#ffb400;--mint:#5ee6b0;--mute:#6b4a7a;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
*,*::before,*::after{box-sizing:inherit}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Figtree,system-ui,sans-serif;line-height:1.5}
h1,h2,h3{font-family:'Bagel Fat One',Impact,sans-serif;font-weight:400;margin:0;line-height:1}
.hero{position:relative;overflow:hidden;padding:56px 20px 72px;text-align:center;background:var(--pink);color:var(--bg)}
.hero h1{position:relative;z-index:2;font-size:clamp(3rem,16vw,8.5rem);letter-spacing:-.02em;transform:rotate(-2deg);text-shadow:5px 5px 0 var(--sun)}
.hero p{position:relative;z-index:2;font-size:1.2rem;font-weight:600;max-width:34ch;margin:22px auto 26px}
.btn{display:inline-block;border:3px solid var(--bg);background:var(--sun);color:var(--bg);font:800 1rem Figtree,sans-serif;padding:14px 26px;border-radius:999px;cursor:pointer;text-decoration:none;box-shadow:4px 4px 0 var(--bg);transition:transform .12s,box-shadow .12s}
.btn[hidden]{display:none}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--bg)}
.hero-actions{position:relative;z-index:2;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.btn-ghost{background:transparent;color:var(--bg);box-shadow:4px 4px 0 var(--bg)}
.btn-ghost:hover{background:var(--bg);color:var(--sun)}
.btn:focus-visible,input:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid var(--mint);outline-offset:3px}
.blob{position:absolute;font-size:5rem;animation:bob 4s ease-in-out infinite}
.b1{left:5%;top:14%}.b2{right:6%;top:20%;animation-delay:-1.5s}.b3{left:12%;bottom:6%;animation-delay:-3s}.b4{right:14%;bottom:8%;animation-delay:-2s}
@keyframes bob{50%{transform:translateY(-14px) rotate(8deg)}}
@media (prefers-reduced-motion:reduce){.blob{animation:none}html{scroll-behavior:auto}}
.strip{background:var(--sun);color:var(--bg);font-weight:800;text-align:center;padding:12px 16px}
main{max-width:1100px;margin:0 auto;padding:56px 20px;display:grid;gap:40px;grid-template-columns:1fr}
@media(min-width:900px){main{grid-template-columns:1fr 340px;align-items:start}}
h2{font-size:2.4rem;margin-bottom:22px;color:var(--sun)}

.cats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px}
.cat{position:relative;display:inline-flex;align-items:center;gap:8px;border:2px solid var(--mint);background:transparent;color:var(--ink);font:700 .95rem Figtree,sans-serif;padding:9px 16px;border-radius:999px;cursor:pointer}
.cat .check{display:none}
.cat.active{background:var(--mint);color:var(--bg)}
.cat.active .check{display:inline}
.cat .x{display:none;margin-left:4px}
.cat.active:hover .x{display:inline}
.cat.active:hover .check{display:none}

.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.prod{background:var(--card);color:var(--cardink);border-radius:26px;overflow:hidden;display:flex;flex-direction:column}
.pic{font-size:4.2rem;text-align:center;padding:22px 0}
.prod:nth-child(4n+1) .pic{background:var(--pink)}.prod:nth-child(4n+2) .pic{background:var(--mint)}
.prod:nth-child(4n+3) .pic{background:var(--sun)}.prod:nth-child(4n) .pic{background:#b69cff}
.pb{padding:16px;display:flex;flex-direction:column;gap:6px;flex:1}
.pb h3{font-size:1.35rem}.pb p{margin:0;color:var(--mute);font-size:.92rem;flex:1}
.tag{display:inline-block;font-size:.72rem;font-weight:800;color:var(--pink);text-transform:uppercase;letter-spacing:.04em}
.row{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.price{font-weight:800;font-size:1.15rem}
.qty{display:flex;align-items:center;gap:8px}
.qty button{width:34px;height:34px;border-radius:50%;border:2px solid var(--cardink);background:#fff;color:var(--cardink);font:800 1.1rem Figtree;cursor:pointer}
.qty button.add{background:var(--cardink);color:var(--ink)}
.qty b{min-width:18px;text-align:center}

aside{background:var(--card);color:var(--cardink);border-radius:26px;padding:24px;border:4px solid var(--mint)}
@media(min-width:900px){aside{position:sticky;top:calc(16px + env(safe-area-inset-top,0px))}}
aside h2{color:var(--pink);font-size:1.9rem;margin-bottom:12px}
.line{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px dashed #c9a8d8}
.empty{color:var(--mute)}
.total{display:flex;justify-content:space-between;font-weight:800;font-size:1.25rem;margin:14px 0}
label{display:block;font-weight:600;font-size:.9rem;margin:10px 0 4px}
input,select{width:100%;padding:11px 12px;border:2px solid var(--cardink);border-radius:12px;font:inherit;background:#fff;color:var(--cardink)}
aside .btn{width:100%;margin-top:16px;background:var(--pink);color:#fff;text-align:center}
.msg{margin-top:12px;font-weight:600;color:#b00045}
.ok{background:var(--mint);border-radius:18px;padding:18px;text-align:center}
.ok h3{font-size:1.6rem;margin-bottom:6px}.code{font:800 1.8rem Figtree;letter-spacing:.08em}
.consulta{max-width:720px;margin:0 auto;padding:0 20px 56px;text-align:center}
.consulta h2{color:var(--sun)}
.consulta p{color:#d9b8e8;margin:10px 0 24px}
.consulta-card{background:var(--card);color:var(--cardink);border-radius:26px;padding:28px 24px;border:4px solid var(--mint)}
.consulta-form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.consulta-form input{max-width:220px}
.consulta .msg{margin-top:12px}
.resultados{display:grid;gap:14px;margin-top:22px;grid-template-columns:1fr;text-align:left}
.reserva-card{background:var(--bg);color:var(--ink);border-radius:18px;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.reserva-card .info b{font-size:1.1rem;color:var(--sun)}
.reserva-card .info small{display:block;color:#c9a8d8}

footer{text-align:center;padding:30px 20px 50px;color:#d9b8e8}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.logo{display:block;width:min(88%,520px);height:auto;margin:0 auto;transform:rotate(-2deg);filter:drop-shadow(6px 6px 0 #2a0a3a)}

/* plataforma / dashboard */
.panel{max-width:1200px;margin:0 auto;padding:40px 20px}
.topbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;margin-bottom:28px}
.topbar nav a{color:var(--mint);font-weight:700;text-decoration:none;margin-left:16px}
.filtros{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.filtros button{border:2px solid var(--mint);background:transparent;color:var(--ink);padding:8px 16px;border-radius:999px;font-weight:700;cursor:pointer}
.filtros button.active{background:var(--mint);color:var(--bg)}
table{width:100%;border-collapse:collapse;background:var(--card);color:var(--cardink);border-radius:18px;overflow:hidden}
th,td{padding:12px 14px;text-align:left;font-size:.92rem}
thead{background:var(--pink);color:#fff}
tbody tr:nth-child(even){background:#f3e2ee}
.pill{display:inline-block;padding:4px 10px;border-radius:999px;font-weight:800;font-size:.75rem;text-transform:uppercase}
.pill.pendiente{background:var(--sun);color:#3a2800}
.pill.aprobada{background:var(--mint);color:#063b2a}
.pill.cancelada{background:#ff8fb8;color:#5a0024}
.pill.entregada{background:#b69cff;color:#28144d}
.acciones{display:flex;gap:6px;flex-wrap:wrap}
.acciones button{border:none;border-radius:8px;padding:6px 10px;font-weight:700;font-size:.78rem;cursor:pointer}
.acciones .aprobar{background:var(--mint);color:#063b2a}
.acciones .cancelar{background:#ff8fb8;color:#5a0024}
.acciones .entregar{background:#b69cff;color:#28144d}
.cards{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));margin-bottom:28px}
.kpi{background:var(--card);color:var(--cardink);border-radius:20px;padding:20px;text-align:center}
.kpi b{display:block;font-size:2.1rem;font-family:'Bagel Fat One',sans-serif;color:var(--pink)}
.kpi span{font-size:.85rem;color:var(--mute);font-weight:700}

.form-producto{background:var(--card);color:var(--cardink);border-radius:20px;padding:22px 24px;margin-bottom:28px}
.form-producto h2{color:var(--pink);font-size:1.5rem;margin-bottom:16px}
.form-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.form-grid .full{grid-column:1/-1}
.form-grid label{margin:0 0 4px}
.form-grid input,.form-grid select{width:100%;padding:10px 12px;border:2px solid var(--cardink);border-radius:10px;font:inherit;background:#fff;color:var(--cardink)}
#emoji{font-size:1.4rem;text-align:center}
.checkbox-row{display:flex;align-items:center}
.checkbox-row label{display:flex;align-items:center;gap:8px;font-weight:600;margin:0}
.checkbox-row input{width:auto}
.form-acciones{display:flex;gap:12px;margin-top:18px;flex-wrap:wrap}
.form-acciones .btn{margin:0;width:auto}
.form-producto .btn-ghost{background:transparent;color:var(--cardink);border-color:var(--cardink);box-shadow:4px 4px 0 var(--cardink)}
.emoji-cell{font-size:1.6rem;text-align:center}