*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#f6f7f5;color:#1f2933}
a{color:inherit}.top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 16px;background:#0f766e;color:#fff}
.brand{text-decoration:none;font-weight:700;display:flex;gap:8px;align-items:center}.brand small{font-weight:400;opacity:.7}
.logo{background:#f59e0b;color:#0f172a;border-radius:8px;width:30px;height:30px;display:grid;place-items:center;font-weight:900}
.demo{font-size:12px;opacity:.9}.demo button{margin-left:6px}
main{max-width:1150px;margin:0 auto;padding:16px}h1{font-size:22px}h2{font-size:17px;margin:18px 0 8px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.card{background:#fff;border-radius:12px;padding:14px;box-shadow:0 1px 3px #0001;text-decoration:none;display:block}
.card .ic{font-size:26px}.card b{display:block;margin:6px 0 4px}.card p{margin:0;font-size:13px;color:#52606d}
.tag{font-size:11px;padding:2px 6px;border-radius:6px;background:#e6f4f1;color:#0f766e}.tag.ph{background:#fdf2e0;color:#9a5b00}
button,.btn{background:#0f766e;color:#fff;border:0;border-radius:8px;padding:8px 12px;cursor:pointer;font-size:14px;text-decoration:none;display:inline-block}
button.sec{background:#e5e7eb;color:#111}button.warn{background:#b45309}button.sm{padding:4px 8px;font-size:12px}
.mesas{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:10px}
.mesa{border-radius:12px;padding:16px 6px;text-align:center;font-weight:700;cursor:pointer;border:2px solid transparent}
.libre{background:#e6f4f1}.ocupada{background:#fde7c7}.cobrar{background:#fecaca}
.row{display:flex;gap:12px;flex-wrap:wrap}.col{flex:1;min-width:280px}
.list{list-style:none;padding:0;margin:0}.list li{background:#fff;border-radius:8px;padding:8px 10px;margin-bottom:6px;display:flex;justify-content:space-between;gap:8px;align-items:center}
.muted{color:#6b7280;font-size:12px}input,select,textarea{padding:7px;border:1px solid #cbd2d9;border-radius:8px;font-size:14px}
.tot{font-size:18px;font-weight:700}.kds{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.tk{background:#fff;border-radius:10px;padding:10px;border-top:6px solid #0f766e}.tk.late{border-color:#dc2626}.tk.prep{border-color:#f59e0b}
.nav{position:sticky;bottom:0;display:flex;justify-content:space-around;background:#fff;border-top:1px solid #ddd;padding:6px;margin:16px -16px -16px}
.nav a{text-decoration:none;font-size:12px;text-align:center}
#map{height:380px;border-radius:12px}.prod{display:flex;gap:10px;background:#fff;border-radius:10px;padding:8px;align-items:center}
.ph-img{width:64px;height:64px;border-radius:10px;display:grid;place-items:center;font-size:30px;background:#fef3c7}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:8px}td,th{padding:6px 8px;border-bottom:1px solid #eee;text-align:left;font-size:13px}
.modal{position:fixed;inset:0;background:#0006;display:grid;place-items:center;z-index:2000}.modal>div{background:#fff;border-radius:12px;padding:16px;max-width:420px;width:92%;max-height:90vh;overflow:auto}
.chips button{margin:2px}.kpi{background:#fff;border-radius:10px;padding:12px}.kpi b{font-size:20px;display:block}