/* Van Pe' — estilos de toda la app */
/* Layout: app shell — phone column with bottom tab bar; from 900px a left sidebar and a card grid. Brand from the Van Pe' logo: deep royal blue + sunset orange, sand from the Moche tunic. */
:root{
  --navy:#04208F; --blue:#0A5BD1; --orange:#F26B15; --amber:#F7A80D; --sand:#F3E9D8; --clay:#B4442E;
  --bg:#F3F6FC; --surface:#FFFFFF; --surface-2:#EAF0FA; --ink:#0B1A4A; --muted:#5B6890; --line:#DCE3F1;
  --on-navy:#FFFFFF; --on-navy-muted:#C9D5FF; --good:#1F8A4C; --good-bg:#E3F5EA; --warn:#B26A00; --warn-bg:#FFF2DA; --bad:#C23B2A; --bad-bg:#FDE7E3;
  --shadow:0 6px 20px rgba(4,32,143,.10); --heading:#04208F; --ocean:#BFD9F2; --land:#F1EADB; --maptext:#56607F; --oceantext:#5E86B5;
  --f-display:"Baloo 2", "Nunito", system-ui, sans-serif;
  --f-body:"Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
  --r:18px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#060F2E; --surface:#0E1A44; --surface-2:#142456; --ink:#ECF1FF; --muted:#9FB0DA; --line:#22336B;
  --blue:#4C8DFF; --sand:#3A2E1E; --good:#5CD38E; --good-bg:#11372A; --warn:#FFC56B; --warn-bg:#3A2A0C; --bad:#FF8A78; --bad-bg:#3D1A16;
  --shadow:0 6px 20px rgba(0,0,0,.35); --heading:#ECF1FF; --ocean:#0D2A57; --land:#1A2550; --maptext:#AEB9DE; --oceantext:#7FA6D6; color-scheme:dark }}
:root[data-theme="dark"]{
  --bg:#060F2E; --surface:#0E1A44; --surface-2:#142456; --ink:#ECF1FF; --muted:#9FB0DA; --line:#22336B;
  --blue:#4C8DFF; --sand:#3A2E1E; --good:#5CD38E; --good-bg:#11372A; --warn:#FFC56B; --warn-bg:#3A2A0C; --bad:#FF8A78; --bad-bg:#3D1A16;
  --shadow:0 6px 20px rgba(0,0,0,.35); --heading:#ECF1FF; --ocean:#0D2A57; --land:#1A2550; --maptext:#AEB9DE; --oceantext:#7FA6D6; color-scheme:dark }

*{box-sizing:border-box}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--navy)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:8px}
h1,h2,h3{font-family:var(--f-display);line-height:1.1;margin:0;text-wrap:balance}
p{margin:0}
.ic{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ic.sm{width:16px;height:16px}.ic.lg{width:26px;height:26px}
.muted{color:var(--muted)}
.tnum{font-variant-numeric:tabular-nums}

/* Shell */
.shell{min-height:100%;display:flex}
.side{display:none}
.main{flex:1;min-width:0;padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
.wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));max-width:1180px;margin:0 auto}
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:0 max(12px,env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));pointer-events:none}
.tabbar nav{pointer-events:auto;max-width:520px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);display:grid;grid-template-columns:repeat(5,1fr)}
.tab{background:none;border:0;padding:10px 4px 8px;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--muted);font-size:12px;font-weight:700;position:relative}
.tab[aria-current="page"]{color:var(--blue)}
.tab[aria-current="page"]::after{content:"";position:absolute;bottom:4px;width:22px;height:3px;border-radius:3px;background:var(--blue)}
.tab .badge{position:absolute;top:4px;left:calc(50% + 4px);background:var(--orange);color:#fff;font-size:10.5px;min-width:18px;height:18px;border-radius:9px;display:grid;place-items:center;padding:0 4px}

@media (min-width:900px){
  .side{display:flex;flex-direction:column;gap:6px;width:250px;flex:none;position:sticky;top:0;height:100vh;padding:24px 16px;background:var(--navy);color:var(--on-navy)}
  .side img.logo{width:120px;margin:0 8px 18px}
  .side .tab{flex-direction:row;justify-content:flex-start;gap:12px;padding:11px 14px;border-radius:12px;font-size:15px;color:var(--on-navy-muted)}
  .side .tab[aria-current="page"]{background:rgba(255,255,255,.12);color:#fff}
  .side .tab[aria-current="page"]::after{display:none}
  .side .tab .badge{position:static}
  .side .spacer{flex:1}
  .side .btn{justify-content:center}
  .tabbar{display:none}
  .hero-body .logo{display:none}
  .main{padding-bottom:40px}
}

/* Buttons & chips */
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:14px;padding:12px 18px;font-weight:800;font-size:15px;line-height:1;text-decoration:none;transition:transform .12s ease, filter .12s}
.btn:active{transform:scale(.97)}
.btn.orange{background:var(--orange);color:#fff}
.btn.blue{background:var(--blue);color:#fff}
.btn.navy{background:var(--navy);color:#fff}
.btn.ghost{background:var(--surface-2);color:var(--ink)}
.btn.line{background:transparent;color:var(--orange);box-shadow:inset 0 0 0 2px var(--orange)}
.btn.white{background:#fff;color:var(--navy)}
.btn.sm{padding:9px 13px;font-size:13.5px;border-radius:12px}
.btn.block{width:100%;justify-content:center}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.iconbtn{width:42px;height:42px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(15,23,60,.45);color:#fff;backdrop-filter:blur(6px)}
.iconbtn.on{color:var(--orange);background:#fff}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 0}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:8px 14px;font-weight:700;font-size:14px}
.chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 10px;font-size:12.5px;font-weight:800;letter-spacing:.01em}
.pill.good{background:var(--good-bg);color:var(--good)}
.pill.warn{background:var(--warn-bg);color:var(--warn)}
.pill.bad{background:var(--bad-bg);color:var(--bad)}
.pill.star{background:linear-gradient(90deg,var(--orange),var(--amber));color:#fff}
.pill.soft{background:var(--surface-2);color:var(--muted)}

/* Hero */
.hero{position:relative;overflow:hidden;background:
  radial-gradient(120% 90% at 85% 10%, #0B49C9 0%, transparent 55%),
  linear-gradient(180deg,var(--navy) 0%, #0A2A9E 100%);color:#fff}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22px;opacity:.22;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='22' viewBox='0 0 44 22'%3E%3Cpath d='M0 22V16h6v-6h6V4h8v6h6v6h6v6' fill='none' stroke='%23F7A80D' stroke-width='3'/%3E%3C/svg%3E") repeat-x bottom left/44px 22px}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:14px 4px}
.locbtn{display:flex;align-items:center;gap:8px;background:none;border:0;color:#fff;text-align:left;padding:0;min-width:0}
.locbtn b{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.locbtn small{display:block;color:var(--on-navy-muted);font-size:12.5px}
.langbtn{display:flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:7px 14px;font-weight:800}
.hero-body{display:grid;grid-template-columns:1fr auto;align-items:end;gap:8px;padding-block:6px 26px}
.hero-body .logo{width:118px;margin-bottom:12px}
.hero h1{font-size:clamp(32px,8vw,48px);font-weight:800;font-style:italic;letter-spacing:-.01em}
.hero .lede{font-family:var(--f-display);font-weight:700;font-style:italic;font-size:clamp(17px,4.4vw,22px);margin-top:6px;color:#E6ECFF;max-width:22ch}
.mascot{width:clamp(120px,32vw,190px);filter:drop-shadow(0 10px 18px rgba(0,0,0,.35));transform-origin:50% 90%;animation:wave 3.6s ease-in-out infinite}
@keyframes wave{0%,100%{transform:rotate(0)}8%{transform:rotate(-3deg)}16%{transform:rotate(2deg)}24%{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.mascot{animation:none}}
.hero .searchbar{margin-top:16px}
.searchbar{display:flex;align-items:center;gap:10px;background:var(--surface);color:var(--ink);border-radius:16px;padding:4px 6px 4px 14px;box-shadow:var(--shadow);border:1px solid var(--line)}
.searchbar input{flex:1;min-width:0;border:0;background:none;padding:10px 0;outline:none;font-size:15.5px}

/* Sections */
.sec{display:grid;gap:12px;padding-block:22px 4px}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.sec-h h2{font-size:23px;font-weight:800}
.sec-h .link{background:none;border:0;color:var(--blue);font-weight:800;padding:4px 0;white-space:nowrap}
.sec-h p{font-size:13.5px}
.row{display:grid;grid-auto-flow:column;grid-auto-columns:min(74%,290px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}
.row::-webkit-scrollbar{display:none}
.row>*{scroll-snap-align:start}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
@media (min-width:900px){
  .row{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));overflow:visible}
  .row.limit>*:nth-child(n+9){display:none}
}

/* Place card */
.card{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--line);text-align:left;padding:0;color:inherit;width:100%}
.card .media{position:relative;aspect-ratio:16/10;max-width:100%;background:var(--surface-2)}
.card .media img{width:100%;height:100%;object-fit:cover;display:block}
.card .media .iconbtn{position:absolute;top:10px;right:10px;width:38px;height:38px}
.card .media .tag{position:absolute;left:10px;bottom:10px}
.card .body{padding:12px 14px 14px;display:grid;gap:4px;min-width:0}
.card h3{font-size:18px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .sub{color:var(--muted);font-weight:700;font-size:13.5px}
.meta{display:flex;align-items:center;gap:6px;font-size:13.5px;color:var(--muted);min-width:0}
.meta span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meta .st{color:var(--amber)}
.why{margin-top:4px;font-size:12.5px;font-weight:700;color:var(--blue);display:flex;gap:6px;align-items:flex-start}
.why .ic{width:15px;height:15px;margin-top:1px}

/* Generated cover art for places without photos */
.art{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden}
.art::before{content:"";position:absolute;inset:auto 0 0 0;height:34%;opacity:.28;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cpath d='M0 40V30h10V20h10V10h10v10h10' fill='none' stroke='white' stroke-width='3.5'/%3E%3C/svg%3E") repeat-x bottom/40px 40px}
.art svg{width:46%;height:46%;stroke:rgba(255,255,255,.92);stroke-width:1.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.art.t-restaurante{background:linear-gradient(135deg,#F7A80D,#F26B15 70%)}
.art.t-hotel{background:linear-gradient(135deg,#0A5BD1,#04208F 75%)}
.art.t-lugar{background:linear-gradient(135deg,#D9773F,#8E3322 80%)}
.art.t-artesania{background:linear-gradient(135deg,#C99A5B,#7A5126 80%)}
.art.t-fiesta{background:linear-gradient(135deg,#E04A6B,#7A1F6E 80%)}

/* Fiesta date card */
.fcard{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px;box-shadow:var(--shadow);text-align:left;color:inherit;width:100%}
.date{width:58px;border-radius:14px;overflow:hidden;text-align:center;background:var(--surface-2);font-family:var(--f-display)}
.date .m{background:var(--clay);color:#fff;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 0}
.date .d{font-size:26px;font-weight:800;line-height:1.2;padding:2px 0 4px}
.fcard h3{font-size:16.5px;font-weight:700}
.fcard .meta{margin-top:2px}
.fcard .acts{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}

/* Detail */
.cover{position:relative;aspect-ratio:16/10;max-height:420px;width:100%;background:var(--surface-2);overflow:hidden}
.cover img{width:100%;height:100%;object-fit:cover;display:block}
.cover .bar{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));display:flex;justify-content:space-between}
.detail{display:grid;gap:16px;padding-block:16px 120px;max-width:820px}
.kicker{font-size:12.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--orange)}
.detail h1{font-size:clamp(28px,6vw,38px);font-weight:800;color:var(--heading)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:10px 6px;text-align:center;display:grid;gap:2px;justify-items:center;box-shadow:var(--shadow)}
.stat .ic{color:var(--blue);margin-bottom:2px}
.stat b{font-size:14px}
.stat small{font-size:11.5px;color:var(--muted);line-height:1.2}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;display:grid;gap:12px;box-shadow:var(--shadow)}
.panel h2{font-size:21px;font-weight:800}
.li{display:flex;gap:10px;align-items:flex-start}
.li .ic{color:var(--muted);margin-top:1px}
.items{display:grid;gap:0}
.item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line)}
.item:first-child{border-top:0}
.item .nm{font-weight:800}
.item .ds{font-size:13px;color:var(--muted)}
.item .pr{font-weight:800;white-space:nowrap}
.gallery{display:grid;grid-auto-flow:column;grid-auto-columns:min(42%,190px);gap:10px;overflow-x:auto;scrollbar-width:none}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;display:block}
.taxi{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}
.taxi .car{width:54px;height:54px;border-radius:14px;background:var(--warn-bg);color:var(--orange);display:grid;place-items:center}
.review{display:grid;gap:4px;padding:10px 0;border-top:1px solid var(--line)}
.review:first-of-type{border-top:0}
.addbar{position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(4,32,143,.08);padding:12px max(16px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.addbar .in{max-width:820px;margin:0 auto;display:flex;gap:10px}
.addbar .btn{flex:1;justify-content:center}
@media (min-width:900px){.addbar{left:250px}}

/* Plan */
.planhead{background:linear-gradient(135deg,var(--blue),var(--navy));color:#fff;border-radius:22px;padding:18px;display:grid;gap:10px;box-shadow:var(--shadow)}
.planhead h2{font-size:22px}
.planhead .chips{flex-wrap:wrap}.planhead .chips .chip{background:rgba(255,255,255,.12);color:#fff;border-color:transparent;font-size:13px;padding:6px 12px}
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:14px 8px;box-shadow:var(--shadow)}
.quick button{background:none;border:0;display:grid;justify-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--ink);text-align:center}
.quick .q{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:#fff}
.tl{display:grid;gap:0}
.tl-item{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:10px}
.tl-time{font-weight:800;font-size:12.5px;white-space:nowrap;color:var(--heading);padding-top:14px;position:relative}
.tl-time::after{content:"";position:absolute;left:8px;top:42px;width:12px;height:12px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px var(--warn-bg)}
.tl-time::before{content:"";position:absolute;left:13px;top:58px;bottom:0;width:2px;background:var(--line)}
.tl-card{display:grid;grid-template-columns:96px 1fr auto;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:10px;box-shadow:var(--shadow);min-width:0}
.tl-card .th{position:relative;width:96px;height:76px;border-radius:12px;overflow:hidden;background:var(--surface-2)}
.tl-card .th img{width:100%;height:100%;object-fit:cover}
.tl-card h3{font-size:16.5px;font-weight:700;overflow:hidden;text-overflow:ellipsis}
.tl-card .k{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.tl-ctrl{display:grid;gap:6px}
.tl-ctrl button{width:34px;height:34px;border-radius:10px;border:0;background:var(--surface-2);display:grid;place-items:center;color:var(--muted)}
.tl-ctrl button.del{color:var(--bad);background:var(--bad-bg)}
.leg{grid-column:2;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);padding:10px 4px 12px;font-weight:700}
.totals{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:14px 16px;box-shadow:var(--shadow)}
.totals .t{display:flex;gap:8px;align-items:center}
.totals .t b{display:block;font-size:17px}
.totals .t small{color:var(--muted);font-size:12px}
.totals .btn{margin-left:auto}

/* Map */
.map{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--land);box-shadow:var(--shadow)}
.map svg{display:block;width:100%;height:auto}
.map .ocean{fill:var(--ocean)}.map .land{fill:var(--land)}
.map .road{stroke:#E0B54A;stroke-width:2.2;fill:none}
.map .town{fill:#8A93B5}
.map text{font-family:var(--f-body);font-size:10.5px;font-weight:700;fill:var(--maptext)}
.map .route{stroke:#4A5578;stroke-width:2.4;stroke-dasharray:5 5;fill:none}
.map .pin{cursor:pointer}
.map .legend{position:absolute;left:10px;bottom:10px;background:var(--surface);color:var(--ink);border-radius:12px;padding:6px 10px;font-size:12px;font-weight:700;box-shadow:var(--shadow)}

/* Forms */
.field{display:grid;gap:6px}
.field label{font-weight:800;font-size:13.5px}
.field input,.field select,.field textarea{width:100%;border:1.5px solid var(--line);background:var(--surface);border-radius:12px;padding:11px 12px;font-size:15px;outline:none}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue)}
.field .hint{font-size:12.5px;color:var(--muted)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stack{display:grid;gap:14px}
.opt{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:14px;padding:12px;background:var(--surface);text-align:left;width:100%}
.opt[aria-pressed="true"]{border-color:var(--blue);background:var(--surface-2)}
.opt .q{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:#fff;flex:none}

/* Sheet / modal */
.scrim{position:fixed;inset:0;z-index:80;background:rgba(5,12,40,.55);display:flex;align-items:flex-end;justify-content:center;animation:fade .15s ease}
@keyframes fade{from{opacity:0}}
.sheet{background:var(--bg);width:100%;max-width:560px;max-height:92vh;overflow:auto;border-radius:24px 24px 0 0;padding:20px max(18px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));display:grid;gap:14px;animation:up .2s ease}
@keyframes up{from{transform:translateY(30px)}}
@media (min-width:700px){.scrim{align-items:center}.sheet{border-radius:24px}}
.sheet-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.sheet-h h2{font-size:23px;font-weight:800}
.x{width:38px;height:38px;border-radius:50%;border:0;background:var(--surface-2);display:grid;place-items:center;color:var(--ink)}
.toast{position:fixed;left:50%;bottom:calc(104px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:90;background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:14px;font-weight:700;box-shadow:var(--shadow);max-width:min(92vw,460px);text-align:center;animation:up .2s ease}
@media (min-width:900px){.toast{bottom:28px}}
.qrbox{background:#fff;padding:14px;border-radius:16px;justify-self:center;line-height:0}
.qrbox img,.qrbox canvas{width:200px!important;height:200px!important}
.copyrow{min-width:0;max-width:100%;display:flex;gap:8px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:8px 8px 8px 12px}
.copyrow code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;user-select:all}

/* Onboarding */
.onb{min-height:100%;background:linear-gradient(180deg,var(--navy),#0A2A9E);color:#fff;display:flex;flex-direction:column}
.onb .in{flex:1;display:flex;flex-direction:column;gap:18px;padding-block:calc(24px + env(safe-area-inset-top,0px)) calc(24px + env(safe-area-inset-bottom,0px));max-width:620px;width:100%;margin:0 auto}
.onb .steps{display:flex;gap:6px}
.onb .steps i{flex:1;height:5px;border-radius:5px;background:rgba(255,255,255,.22)}
.onb .steps i.on{background:var(--amber)}
.onb h1{font-size:clamp(30px,7vw,42px);font-weight:800;font-style:italic}
.onb p.lede{color:var(--on-navy-muted);font-size:16px}
.onb .chip{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff;padding:11px 16px;font-size:15px}
.onb .chip[aria-pressed="true"]{background:#fff;color:var(--navy);border-color:#fff}
.onb .wrapchips{display:flex;flex-wrap:wrap;gap:10px}
.onb .foot{margin-top:auto;display:flex;gap:10px;align-items:center}
.onb .foot .btn.orange{flex:1;justify-content:center;padding:15px}
.onb .skip{background:none;border:0;color:var(--on-navy-muted);font-weight:800;padding:10px}
.onb .opt{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.25);color:#fff}
.onb .opt[aria-pressed="true"]{background:#fff;color:var(--navy);border-color:#fff}
.onb-hero{display:grid;justify-items:center;gap:6px;text-align:center;margin-top:10px}
.onb-hero .logo{width:180px}
.onb-hero .mascot{width:150px}
.proto{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--amber)}

/* Business panel */
.bizhead{background:var(--navy);color:#fff}
.bizhead .in{display:flex;align-items:center;gap:12px;padding-block:16px 12px;flex-wrap:wrap}
.bizhead h1{font-size:24px;font-weight:800}
.bizhead small{color:var(--on-navy-muted);font-weight:700}
.bizhead .grow{flex:1 1 calc(100% - 80px);min-width:0}
.btabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-block:4px 12px}
.btabs::-webkit-scrollbar{display:none}
.btab{flex:none;border:0;border-radius:12px;padding:9px 14px;background:rgba(255,255,255,.1);color:#DCE4FF;font-weight:800;font-size:14px;display:inline-flex;gap:7px;align-items:center}
.btab[aria-current="page"]{background:#fff;color:var(--navy)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:14px;display:grid;gap:4px;box-shadow:var(--shadow)}
.kpi small{color:var(--muted);font-weight:800;font-size:12.5px}
.kpi b{font-family:var(--f-display);font-size:28px;line-height:1}
.kpi .d{font-size:12.5px;font-weight:800;color:var(--good)}
.bars{display:flex;align-items:flex-end;gap:6px;height:90px}
.bars div{flex:1;border-radius:6px 6px 2px 2px;background:var(--surface-2);position:relative}
.bars div.hi{background:var(--blue)}
.bars div span{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:11px;color:var(--muted);font-weight:700}
.resv{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.resv:first-child{border-top:0}
.resv .acts{display:flex;gap:6px}
.lock{display:grid;gap:10px;justify-items:start;background:var(--warn-bg);border:1.5px dashed var(--amber);border-radius:var(--r);padding:16px;color:var(--ink)}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.plan{background:var(--surface);border:1.5px solid var(--line);border-radius:20px;padding:16px;display:grid;gap:10px;align-content:start;box-shadow:var(--shadow)}
.plan.cur{border-color:var(--blue);box-shadow:0 0 0 3px var(--surface-2),var(--shadow)}
.plan h3{font-size:20px}
.plan .price{font-family:var(--f-display);font-weight:800;font-size:30px;line-height:1}
.plan .price small{font-size:14px;color:var(--muted);font-family:var(--f-body)}
.plan ul{margin:0;padding:0;list-style:none;display:grid;gap:6px;font-size:13.5px}
.plan li{display:flex;gap:8px}
.plan li .ic{color:var(--good);width:17px;height:17px;margin-top:1px}
.plan li.no{color:var(--muted)}.plan li.no .ic{color:var(--muted)}
.cal{display:grid;grid-template-columns:120px repeat(14,minmax(30px,1fr));gap:3px;font-size:12px;min-width:620px}
.cal div{padding:6px 2px;text-align:center;border-radius:6px;font-weight:700}
.cal .h{color:var(--muted)}
.cal .n{text-align:left;font-weight:800}
.cal .c0{background:var(--bad-bg);color:var(--bad)}.cal .c1{background:var(--warn-bg);color:var(--warn)}.cal .c2{background:var(--good-bg);color:var(--good)}
.scrollx{overflow-x:auto}
.toggle{position:relative;width:46px;height:28px;border-radius:14px;border:0;background:var(--line);flex:none;transition:background .15s}
.toggle::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.toggle[aria-pressed="true"]{background:var(--good)}
.toggle[aria-pressed="true"]::after{transform:translateX(18px)}
.photos{display:flex;gap:8px;flex-wrap:wrap}
.photos img{width:76px;height:76px;object-fit:cover;border-radius:12px}
.empty{text-align:center;padding:30px 16px;display:grid;gap:10px;justify-items:center;color:var(--muted)}
.empty .ic{width:44px;height:44px;color:var(--blue)}
.note{font-size:12.5px;color:var(--muted)}
.prof{display:flex;gap:14px;align-items:center}
.avatar{width:64px;height:64px;border-radius:50%;background:var(--sand);display:grid;place-items:center;overflow:hidden;flex:none}
.avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 12%}
.menu{display:grid}
.menu button{display:flex;align-items:center;gap:12px;background:none;border:0;border-top:1px solid var(--line);padding:14px 2px;text-align:left;font-weight:700;width:100%}
.menu button:first-child{border-top:0}
.menu button .ic.r{margin-left:auto;color:var(--muted)}
.bizcta{background:linear-gradient(135deg,var(--orange),var(--amber));color:#fff;border-radius:22px;padding:18px;display:grid;gap:10px}
.bizcta h2{font-size:22px}
.bizcta .acts{display:flex;gap:8px;flex-wrap:wrap}
.pagehead{padding-block:calc(18px + env(safe-area-inset-top,0px)) 4px;display:grid;gap:6px}
.pagehead h1{font-size:34px;font-weight:800;color:var(--heading)}
.back{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:var(--blue);font-weight:800;padding:4px 0}

/* Administración (entrega 2) */
.mrow{display:grid;grid-template-columns:minmax(0,150px) 1fr 32px;gap:10px;align-items:center;font-size:14px;font-weight:700}
.mrow span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrow b{text-align:right}
.meter{height:10px;border-radius:6px;background:var(--surface-2);overflow:hidden}
.meter i{display:block;height:100%;border-radius:6px}
@media (max-width:600px){.resv{grid-template-columns:minmax(0,1fr)}.resv .acts{justify-content:flex-start!important}}

/* Carrusel "Te podría interesar" (entrega 4) */
.carousel{display:grid;grid-auto-flow:column;grid-auto-columns:min(74%,270px);gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 10px;scrollbar-width:none;overscroll-behavior-x:contain}
.carousel::-webkit-scrollbar{display:none}
.carousel>*{scroll-snap-align:start}
.car-nav{display:none;gap:8px}
.car-nav .iconbtn{background:var(--surface-2);color:var(--ink);width:38px;height:38px}
@media (min-width:700px){.car-nav{display:flex}}

/* Fotos (entrega 5) */
.fimg{display:block;border:0;padding:0;margin:0;background:none;width:100%;height:100%;cursor:zoom-in;color:inherit}
.fimg img{width:100%;height:100%;object-fit:cover;display:block}
.gallery .fimg img{aspect-ratio:4/3;border-radius:14px;height:auto}
.cover .photocount{position:absolute;right:max(12px,env(safe-area-inset-right,0px));bottom:12px;background:rgba(15,23,60,.6);color:#fff}
.ithumb{width:64px;height:64px;flex:none;border-radius:12px;overflow:hidden;background:var(--surface-2);display:grid;place-items:center;color:var(--muted)}
.ithumb img{width:100%;height:100%;object-fit:cover}
.ithumb.empty .ic{width:22px;height:22px;opacity:.6}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.fitem{margin:0;position:relative;border-radius:14px;overflow:hidden;background:var(--surface-2);border:1px solid var(--line);display:grid}
.fitem .fimg{aspect-ratio:4/3;height:auto}
.fitem.off .fimg{opacity:.45;filter:grayscale(1)}
.fitem figcaption{position:absolute;top:8px;left:8px;right:8px;display:flex;gap:4px;flex-wrap:wrap;pointer-events:none}
.fitem .facts{display:flex;justify-content:center;gap:6px;padding:8px;background:var(--surface)}
.fitem .facts button{width:34px;height:34px;border-radius:10px;border:0;background:var(--surface-2);color:var(--ink);display:grid;place-items:center}
.fitem .facts button.del{background:var(--bad-bg);color:var(--bad)}
.fitem .facts button[disabled]{opacity:.35}
.upload{display:flex;align-items:center;gap:14px;border:2px dashed var(--blue);border-radius:16px;padding:16px;cursor:pointer;color:var(--blue);background:var(--surface-2)}
.upload small{color:var(--muted);font-weight:600}
.upload:focus-within{outline:3px solid var(--amber)}
.tips{margin:0;padding-left:18px;display:grid;gap:6px}
.lightbox{background:#000;border-radius:16px;overflow:hidden;display:grid;place-items:center;max-height:70vh}
.lightbox img{max-width:100%;max-height:70vh;object-fit:contain;display:block}

/* Inicio compacto y carruseles (entrega 6) */
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"text mascot" "tools tools";align-items:end;column-gap:12px;padding-block:4px 26px}
.hero-text{grid-area:text;padding-bottom:12px;min-width:0}
.hero-text .logo{width:92px;margin-bottom:8px}
.hero .hero-grid .mascot{grid-area:mascot;width:clamp(105px,30vw,160px);height:auto}
.hero-tools{grid-area:tools;display:grid;gap:12px;min-width:0}
.hero-tools .chip{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);color:#fff}
.hero-tools .chip[aria-pressed="true"]{background:#fff;color:var(--navy);border-color:#fff}
.hero-today{display:flex;gap:8px;align-items:flex-start;color:var(--on-navy-muted);font-size:13.5px;line-height:1.4}
.hero-today .ic{margin-top:2px}
.hero-today b{color:#fff}
.linkw{background:none;border:0;padding:0;color:var(--amber);font-weight:800;text-decoration:underline;text-underline-offset:2px;font-size:inherit}
@media (min-width:900px){
  .hero-grid{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"text mascot" "tools mascot";align-items:center;column-gap:32px;padding-block:0 24px}
  .hero-text{padding-bottom:0}
  .hero-text .logo{display:none}
  .hero .hero-grid .mascot{height:270px;width:auto;align-self:end;margin-bottom:-8px}
  .hero h1{font-size:50px}
  .hero .lede{max-width:none}
}
.card .body{flex:1}
.card h3.clamp2{white-space:normal}
.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card .acts.pad{display:flex;gap:8px;flex-wrap:wrap;padding:0 14px 14px}
.card .media .photocount{position:absolute;right:10px;bottom:10px;background:rgba(15,23,60,.6);color:#fff}
.dbadge{position:absolute;left:10px;top:10px;background:var(--surface);color:var(--ink);border-radius:12px;padding:4px 11px 3px;text-align:center;font-family:var(--f-display);box-shadow:var(--shadow);line-height:1.05}
.dbadge span{display:block;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--clay)}
.dbadge b{font-size:22px;font-weight:800}
.dbadge.blue span{color:var(--blue)}
.carousel.wide{grid-auto-columns:min(84%,300px)}
.car-head{display:flex;align-items:center;gap:12px}
.sec-h h2{text-wrap:balance}
.hero-grid{grid-template-columns:minmax(0,1fr) clamp(105px,30vw,160px)}
.hero-tools>*{min-width:0}
@media (min-width:900px){.hero-grid{grid-template-columns:minmax(0,1fr) auto}}

/* Buscar (entrega 7) */
.search-top{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;background:var(--bg);padding-bottom:10px;border-bottom:1px solid var(--line)}
.searchbar.big{padding:5px 6px 5px 16px;border-radius:18px}
.searchbar.big input{font-size:16px;padding:12px 0}
.searchbar .clearq{width:30px;height:30px;border-radius:50%;border:0;background:var(--surface-2);color:var(--muted);display:grid;place-items:center;flex:none}
.chips.cats{margin-top:12px}
.chip .ic{width:17px;height:17px}
.chip.cat{padding:8px 8px 8px 14px;gap:7px}
.chip.cat .cnt{min-width:24px;height:22px;padding:0 7px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:12px;font-weight:800;display:inline-grid;place-items:center}
.chip.cat[aria-pressed="true"] .cnt{background:rgba(255,255,255,.2);color:#fff}
.chip.cat:hover{border-color:var(--blue)}
.chip.fil{border-style:dashed}
.chip.fil[aria-pressed="true"]{background:var(--surface-2);border:1.5px solid var(--blue);color:var(--blue)}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:14px}
.toolbar .chips{flex:1;min-width:0}
.seg{display:inline-flex;flex:none;background:var(--surface-2);border-radius:14px;padding:3px;gap:2px}
.seg button{display:inline-flex;align-items:center;gap:6px;border:0;background:none;border-radius:11px;padding:8px 12px;font-weight:800;font-size:13.5px;color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px rgba(4,32,143,.12)}
.seg.small button{padding:6px 10px;font-size:13px}
.resbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding-top:12px}
.resbar p{color:var(--muted);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.resbar p b{color:var(--ink);font-size:17px}
.linkb{display:inline-flex;align-items:center;gap:4px;border:0;background:none;color:var(--blue);font-weight:800;padding:2px 0}
.sugs{display:flex;gap:8px;align-items:center;overflow-x:auto;scrollbar-width:none;padding-top:12px}
.sugs::-webkit-scrollbar{display:none}
.sug{flex:none;border:0;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700;color:var(--ink)}
.sug:hover{border-color:var(--orange);color:var(--orange)}
@media (max-width:600px){
  .toolbar{flex-direction:column;align-items:stretch}
  .toolbar .seg{align-self:flex-start}
  .seg.small span{display:none}
  .seg.small button[aria-pressed="true"] span{display:inline}
}
.resctl{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media (max-width:600px){
  .toolbar{flex-direction:row}
  .resbar{gap:8px}
  .resbar p{flex:1 1 100%}
  .resctl{width:100%;justify-content:space-between;flex-wrap:nowrap}
  .seg.view span{display:none}
}

/* Paneles con más color (entrega 8) */
.bizhead{--acc:#F7A80D;position:relative;overflow:hidden;
  background:radial-gradient(60% 140% at 100% 0%, color-mix(in srgb, var(--acc) 55%, transparent) 0%, transparent 60%),
             radial-gradient(50% 120% at 0% 100%, rgba(46,196,241,.35) 0%, transparent 60%),
             linear-gradient(135deg,#04208F 0%,#0A3FC2 100%)}
.bizhead::after{content:"";position:absolute;left:0;right:0;bottom:0;height:18px;opacity:.35;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='22' viewBox='0 0 44 22'%3E%3Cpath d='M0 22V16h6v-6h6V4h8v6h6v6h6v6' fill='none' stroke='%23F7A80D' stroke-width='3'/%3E%3C/svg%3E") repeat-x bottom left/36px 18px}
.bizhead .wrap{position:relative;z-index:1}
.bizhead .btabs{padding-bottom:22px}
.bizhead.role-restaurante{--acc:#F26B15}.bizhead.role-hotel{--acc:#2EC4F1}.bizhead.role-lugar{--acc:#E2734A}
.bizhead.role-artesania{--acc:#F7A80D}.bizhead.role-fiesta{--acc:#E04A6B}.bizhead.role-admin{--acc:#F7A80D}
.rolebadge{display:inline-flex;align-items:center;gap:6px;background:var(--acc);color:#fff;border-radius:999px;padding:3px 11px 3px 8px;font-size:12.5px;font-weight:800;margin-bottom:4px;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.bizhead h1{font-size:26px}
.btab{padding:6px 14px 6px 6px;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14)}
.btab:hover{background:rgba(255,255,255,.18)}
.btab .ti{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.16);color:#fff;flex:none}
.btab[aria-current="page"]{background:#fff;color:var(--navy);border-color:#fff;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.ti.t-resumen{background:#2EC4F1}.ti.t-reservas{background:#F26B15}.ti.t-items{background:#F7A80D}.ti.t-fotos{background:#E04A6B}
.ti.t-dispon{background:#22B573}.ti.t-eventos{background:#9B5DE5}.ti.t-perfil{background:#3B82F6}.ti.t-plan{background:#EAB308}.ti.t-qr{background:#64748B}
.ti.t-fiestas{background:#E04A6B}.ti.t-nuevafiesta{background:#F26B15}
.ti.t-solicitudes{background:#22B573}.ti.t-negocios{background:#3B82F6}.ti.t-cobros{background:#10B981}.ti.t-resenas{background:#F7A80D}.ti.t-planes{background:#9B5DE5}
.kpi{position:relative}
.kico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:#fff;margin-bottom:6px}
.kico .ic{width:21px;height:21px}
.k-blue{background:linear-gradient(135deg,#3B82F6,#0A5BD1)}.k-amber{background:linear-gradient(135deg,#FACC15,#F7A80D)}
.k-green{background:linear-gradient(135deg,#34D399,#10B981)}.k-red{background:linear-gradient(135deg,#FB7185,#E11D48)}.k-orange{background:linear-gradient(135deg,#F7A80D,#F26B15)}
.sec-h .link{display:inline-flex;align-items:center;gap:4px}
.chip.st-aprobado[aria-pressed="true"]{border-color:var(--good);color:var(--good)}
.chip.st-pendiente[aria-pressed="true"]{border-color:var(--warn);color:var(--warn)}
.chip.st-suspendido[aria-pressed="true"],.chip.st-rechazado[aria-pressed="true"]{border-color:var(--bad);color:var(--bad)}
.bars div{background:linear-gradient(180deg,#8EC5FF,#3B82F6)}
.bars div.hi{background:linear-gradient(180deg,#F7A80D,#F26B15)}

/* Asistente Vanpito (entrega 9) */
.fab{position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(100px + env(safe-area-inset-bottom,0px));z-index:42;display:flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:6px 16px 6px 6px;background:linear-gradient(135deg,var(--orange),var(--amber));color:#fff;font-weight:800;box-shadow:0 8px 24px rgba(242,107,21,.45)}
.fab img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:50% 12%;background:#fff}
@media (min-width:900px){.fab{bottom:calc(24px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:no-preference){.fab{animation:fabin .4s ease both .3s}@keyframes fabin{from{transform:translateY(20px);opacity:0}}}
.askvan{display:flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#fff;border-radius:16px;padding:6px 12px 6px 6px;text-align:left;width:100%;max-width:560px}
.askvan img{width:38px;height:38px;border-radius:12px;object-fit:cover;object-position:50% 12%;background:var(--sand);flex:none}
.askvan b{display:block;font-size:14px}.askvan small{display:block;color:var(--on-navy-muted);font-size:12.5px}
.askvan span{flex:1;min-width:0}
.chatwrap{max-width:820px;margin:0 auto;min-height:calc(100vh - 110px);display:flex;flex-direction:column;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.chathead{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;display:flex;align-items:center;gap:10px;padding-block:14px 12px;background:var(--bg);border-bottom:1px solid var(--line)}
.chathead .iconbtn{background:var(--surface-2);color:var(--ink);flex:none}
.chathead b{display:block;font-family:var(--f-display);font-size:19px}
.chathead small{display:block;color:var(--muted);font-size:12.5px}
.vanav{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:50% 12%;background:var(--sand);flex:none}
.vanav.big{width:46px;height:46px}
.chatlog{flex:1;display:flex;flex-direction:column;gap:14px;padding-block:16px}
.msg{display:flex;gap:8px;max-width:100%}
.msg p{margin:0;line-height:1.45}
.msg.yo{justify-content:flex-end}
.msg.yo p{background:var(--navy);color:#fff;padding:10px 14px;border-radius:18px 18px 4px 18px;max-width:80%}
.msg.van .vanbody{background:var(--surface);border:1px solid var(--line);border-radius:4px 18px 18px 18px;padding:12px 14px;display:grid;gap:10px;min-width:0;max-width:calc(100% - 42px);box-shadow:var(--shadow)}
.minis{display:grid;grid-auto-flow:column;grid-auto-columns:200px;gap:10px;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}
.mini{display:flex;flex-direction:column;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:14px;overflow:hidden;padding:0;color:inherit}
.mini .mmedia{position:relative;aspect-ratio:16/10;background:var(--surface-2)}
.mini .mmedia img{width:100%;height:100%;object-fit:cover;display:block}
.mini .mmedia .art svg{width:40%;height:40%}
.mini .dbadge{left:6px;top:6px;padding:2px 8px}.mini .dbadge b{font-size:17px}
.mini .mbody{padding:8px 10px 10px;display:grid;gap:2px}
.mini .mbody b{font-size:14px;line-height:1.2}
.mini .mbody small{color:var(--muted);font-size:12px}
.mwhy{display:flex;gap:4px;font-size:11.5px;font-weight:700;color:var(--blue);margin-top:2px}
.mwhy .ic{width:13px;height:13px;margin-top:1px}
.chatsugs{display:flex;gap:6px;flex-wrap:wrap}
.chatbar{position:sticky;bottom:calc(96px + env(safe-area-inset-bottom,0px));display:flex;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:6px 6px 6px 14px;box-shadow:var(--shadow);margin-bottom:12px}
.chatbar input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:16px;padding:10px 0}
.chatbar .btn{padding:10px 14px}
@media (min-width:900px){.chatbar{bottom:16px}.chatwrap{min-height:100vh}}
.typing{display:flex;gap:4px;padding:4px 0}
.typing i{width:8px;height:8px;border-radius:50%;background:var(--muted);animation:dot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

/* ===== Entrega 10: publicar en internet, afiches con QR y contraseña ===== */
.avisoclave{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:linear-gradient(90deg,var(--warn-bg),transparent 140%);border:1.5px solid var(--amber);border-left-width:6px;border-radius:var(--r);padding:14px 16px;color:var(--ink)}
.avisoclave>.ic{color:var(--orange);flex:none}
.avisoclave .grow{display:grid;gap:2px;min-width:200px;flex:1}
.avisoclave span{color:var(--muted);font-size:14px}
.avisolink{display:flex;gap:10px;align-items:flex-start;text-align:left;background:var(--warn-bg);border:1px solid var(--amber);border-radius:12px;padding:10px 12px;font-size:13.5px;line-height:1.45;color:var(--ink);width:100%}
.avisolink .ic{color:var(--orange);flex:none;margin-top:2px}
.afiche-prev{display:grid;gap:12px;justify-items:center}
.afiche-prev img{width:min(100%,360px);height:auto;border-radius:12px;box-shadow:0 10px 30px rgba(4,32,143,.18);border:1px solid var(--line)}
.afiche-prev .btn{width:100%}

/* ===== Entrega 11: catálogo de opciones, fotos de eventos, edición ===== */
.opcbar{display:flex;align-items:center;gap:10px;padding:2px 0 10px;min-width:0}
.opcbar .opct{flex:none;display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:13px;color:var(--muted)}
.opcbar .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;min-width:0}
.opcbar .chips::-webkit-scrollbar{display:none}
.chip.opc{padding:6px 12px;font-size:13.5px;border-color:color-mix(in srgb,var(--orange) 35%,var(--line))}
.chip.opc[aria-pressed="true"]{background:var(--orange);border-color:var(--orange);color:#fff}
.chip.opc .cnt{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--surface-2);color:var(--muted);font-size:11.5px;font-weight:800;display:inline-grid;place-items:center}
.chip.opc[aria-pressed="true"] .cnt{background:rgba(255,255,255,.25);color:#fff}
.opcdet{display:grid;gap:8px}
.opcdet>b{font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.opcdet .chips{flex-wrap:wrap}
.opcdet .chip{cursor:pointer}
.opcdet .chip:hover{border-color:var(--orange)}
.otags{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.otags span{font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:color-mix(in srgb,var(--orange) 12%,var(--surface));color:var(--ink);border:1px solid color-mix(in srgb,var(--orange) 25%,transparent)}
.req{font-size:11px;font-weight:800;color:var(--orange);text-transform:uppercase;letter-spacing:.04em;margin-left:4px}
/* Eventos en el panel */
.evlist{display:grid;gap:12px}
.evadm{display:grid;gap:10px;padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.evadm.past{opacity:.7}
.evhead{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap}
.evhead .acts{display:flex;gap:6px;flex-wrap:wrap}
.evfotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.evfotos .fimg img{width:100%;height:100%;object-fit:cover}
.evadd{display:grid;place-items:center;align-content:center;gap:2px;aspect-ratio:4/3;border:2px dashed var(--blue);border-radius:14px;color:var(--blue);cursor:pointer;background:var(--surface-2)}
.evadd small{font-weight:800;font-size:12px}
.facts .del[disabled]{opacity:.35;cursor:not-allowed}
/* Foto del evento en la tarjeta del turista */
.evimg{position:absolute;inset:0;border:0;padding:0;background:none;cursor:zoom-in;display:block;width:100%;height:100%}
.evimg img{width:100%;height:100%;object-fit:cover;display:block}
.nfotos{position:absolute;right:10px;bottom:10px;display:inline-flex;align-items:center;gap:4px;background:rgba(4,32,143,.82);color:#fff;font-weight:800;font-size:12px;padding:3px 8px;border-radius:999px}
/* Administración: catálogo de opciones */
.ti.t-opciones{background:#14B8A6}
.opcgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:16px;align-items:start}
.opcpanel h2{display:flex;align-items:center;gap:8px}
.opclist{display:grid}
.opcrow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.opcrow:last-child{border-bottom:0}
.opcrow.off b{color:var(--muted);text-decoration:line-through}
.opcrow .acts{display:flex;gap:4px;align-items:center;flex:none}
.arrowbtn{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}
.arrowbtn[disabled]{opacity:.3;cursor:default}
.opcadd{display:flex;gap:8px;margin-top:4px}
.opcadd input{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:12px;padding:9px 12px;font:inherit;background:var(--surface);color:var(--ink)}
@media (max-width:600px){.opcrow{flex-wrap:wrap}.opcrow .acts{width:100%;justify-content:flex-end}}

/* ===== Entrega 12: disponibilidad de hoteles y cambiar fotos ===== */
.disp{display:flex;gap:8px;align-items:flex-start;margin:0;padding:10px 12px;border-radius:12px;font-size:14px;line-height:1.4}
.disp .ic{flex:none;margin-top:2px}
.disp.ok{background:var(--good-bg);color:var(--good);border:1px solid color-mix(in srgb,var(--good) 40%,transparent)}
.disp.ok b,.disp.no b{color:inherit}
.disp.no{background:var(--bad-bg);color:var(--bad);border:1px solid color-mix(in srgb,var(--bad) 40%,transparent)}
.disp.wait{background:var(--surface-2);color:var(--muted)}
#b-disp{display:grid;gap:8px}
#b-disp:empty{display:none}
.cal button.celda{border:0;font:inherit;font-weight:800;border-radius:8px;padding:8px 0;cursor:pointer;position:relative}
.cal button.celda:hover{outline:2px solid var(--blue);outline-offset:-2px}
.cal .h.fin{color:var(--orange);font-weight:800}
.cal .n{display:grid;gap:1px;align-content:center}
.cal .n small{font-weight:600;font-size:11.5px}
.blq{position:absolute;top:3px;right:3px;width:7px;height:7px;border-radius:50%;background:var(--navy)}
.fitem .facts .cambiar{display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 10px;border-radius:10px;background:var(--surface-2);color:var(--ink);font-weight:800;font-size:12.5px;cursor:pointer}
.fitem .facts .cambiar:hover{background:color-mix(in srgb,var(--blue) 14%,var(--surface-2))}
.evfotos .fitem .facts .cambiar span{display:none}

/* ===== Entrega 13: chat flotante de Vanpito con voz y expresiones ===== */
#vpchat{position:fixed;z-index:70;inset:0;display:flex}
@media (min-width:900px){#vpchat{inset:auto;right:24px;bottom:24px;width:min(430px,calc(100vw - 48px));height:min(720px,calc(100vh - 48px))}}
html.vp-abierto .fab{display:none}
@media (max-width:899px){html.vp-abierto body{overflow:hidden}}
.vpanel{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--bg);overflow:hidden;animation:vpin .22s ease}
@media (min-width:900px){.vpanel{border-radius:24px;box-shadow:0 24px 60px rgba(4,32,143,.32),0 0 0 1px var(--line)}}
@keyframes vpin{from{opacity:0;transform:translateY(18px) scale(.98)}}
.vphead{position:relative;display:flex;align-items:center;gap:6px;min-height:80px;padding:12px 10px 16px 92px;padding-top:max(12px,env(safe-area-inset-top,0px));background:linear-gradient(120deg,var(--navy),#0A3FBF);color:#fff;flex:none}
.vphead::after{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;background:repeating-linear-gradient(90deg,var(--orange) 0 14px,transparent 14px 22px),linear-gradient(var(--amber),var(--amber));background-size:auto,100% 2px;background-repeat:repeat,no-repeat;background-position:0 0,0 100%}
.vpfig{position:absolute;left:12px;bottom:6px;height:88px;width:auto;filter:drop-shadow(0 6px 10px rgba(0,0,0,.35));animation:vppop .35s ease;transform-origin:50% 100%}
@keyframes vppop{0%{transform:scale(.85);opacity:.4}70%{transform:scale(1.05)}100%{transform:scale(1)}}
.vpfig.hablando{animation:vphabla .5s ease-in-out infinite alternate;cursor:pointer}
@keyframes vphabla{from{transform:translateY(0) rotate(-1deg)}to{transform:translateY(-3px) rotate(1.5deg)}}
.vpfig.escuchando{animation:vpescucha 1.4s ease-in-out infinite}
@keyframes vpescucha{50%{transform:scale(1.04)}}
@media (prefers-reduced-motion:reduce){.vpfig,.vpfig.hablando,.vpfig.escuchando{animation:none}}
.vptit{flex:1;min-width:0;display:grid}
.vptit b{font-family:var(--f-display);font-size:19px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vptit small{color:var(--on-navy-muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vpbtn{flex:none;display:inline-flex;align-items:center;gap:4px;height:36px;min-width:36px;justify-content:center;padding:0 10px;border:0;border-radius:12px;background:rgba(255,255,255,.14);color:#fff;font-weight:800;font-size:12.5px;cursor:pointer}
.vpbtn:hover{background:rgba(255,255,255,.24)}
.vpbtn.on{background:var(--orange)}
.vpbtn span{display:none}
#vpchat .chatlog{flex:1;min-height:0;overflow-y:auto;padding:14px 12px;gap:12px;overscroll-behavior:contain}
.vpbienv{display:grid;place-items:center;padding:4px 0 0}
.vpbienv img{height:150px;width:auto;filter:drop-shadow(0 10px 18px rgba(4,32,143,.18))}
@media (prefers-reduced-motion:no-preference){.vpbienv img{animation:vpola 2.4s ease-in-out infinite}@keyframes vpola{50%{transform:translateY(-6px) rotate(-2deg)}}}
#vpchat .vanav{background:#fff;border:2px solid var(--amber);object-position:50% 30%}
#vpchat .msg.van .vanbody{max-width:calc(100% - 40px)}
.typing span{font-size:13px;color:var(--muted);font-weight:700;margin-right:4px}
.typing{align-items:center}
/* Resultados en lista, como en el video: número, foto, motivo y coincidencia */
.vlist{display:grid;gap:8px}
.vrow{position:relative;display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:10px;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:8px 10px 8px 8px;color:inherit;cursor:pointer;width:100%}
.vrow:hover{border-color:var(--orange);box-shadow:0 4px 14px rgba(242,107,21,.15)}
.vnum{position:absolute;left:3px;top:3px;z-index:1;width:20px;height:20px;border-radius:50%;background:var(--orange);color:#fff;font-size:11.5px;font-weight:800;display:grid;place-items:center;box-shadow:0 0 0 2px var(--surface)}
.vth{width:54px;height:54px;border-radius:12px;overflow:hidden;background:var(--surface-2);display:block}
.vth img{width:100%;height:100%;object-fit:cover;display:block}
.vart{width:100%;height:100%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--orange),var(--amber))}
.vart.t-hotel{background:linear-gradient(135deg,var(--navy),var(--blue))}.vart.t-lugar{background:linear-gradient(135deg,#9C5B3B,#C98552)}.vart.t-artesania{background:linear-gradient(135deg,#8A5A2B,#C7964F)}.vart.t-fiesta{background:linear-gradient(135deg,#B5296A,#E04A6B)}
.vtx{display:grid;gap:1px;min-width:0}
.vtx b{font-size:14.5px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vtx small{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vtx em{font-style:normal;display:flex;gap:4px;align-items:center;font-size:11.5px;font-weight:700;color:var(--good);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vtx em .ic{width:13px;height:13px;flex:none}
.vpct{flex:none;background:var(--navy);color:#fff;font-weight:800;font-size:12px;padding:4px 8px;border-radius:999px}
.vtodos{justify-self:start;display:inline-flex;align-items:center;gap:6px;border:1px solid color-mix(in srgb,var(--amber) 60%,transparent);background:color-mix(in srgb,var(--amber) 18%,var(--surface));color:var(--ink);font-weight:800;font-size:13px;padding:7px 12px;border-radius:999px;cursor:pointer}
.oir{justify-self:start;display:inline-flex;align-items:center;gap:4px;border:0;background:none;color:var(--blue);font-weight:800;font-size:12.5px;padding:0;cursor:pointer}
.porvoz{display:inline-flex;vertical-align:-2px;margin-right:6px;opacity:.8}
/* Barra para escribir o dictar */
#vpchat .chatbar{position:static;margin:0 10px calc(10px + env(safe-area-inset-bottom,0px));flex:none;align-items:center;padding:6px}
#vpchat .chatbar input{padding:10px 4px}
.vmic{flex:none;width:44px;height:44px;border-radius:50%;border:0;display:grid;place-items:center;background:var(--surface-2);color:var(--navy);cursor:pointer}
.vmic:hover{background:color-mix(in srgb,var(--blue) 14%,var(--surface-2))}
.vmic.on{background:#E0322B;color:#fff;animation:vpmic 1.2s ease-out infinite}
@keyframes vpmic{0%{box-shadow:0 0 0 0 rgba(224,50,43,.5)}100%{box-shadow:0 0 0 14px rgba(224,50,43,0)}}
.vpnota{margin:-4px 14px 10px;font-size:12px;color:var(--muted);text-align:center}
@media (max-width:440px){.vphead{padding-left:78px;gap:4px}.vpfig{height:76px;left:8px}.vptit b{font-size:17px}.vpbtn{min-width:34px;height:34px;padding:0 8px}}

/* ===== Entrega 14: reseñas reales y avisos por WhatsApp ===== */
.btn.wa,a.btn.wa{background:#25D366;color:#073B1E;border-color:#25D366;text-decoration:none}
.btn.wa:hover{background:#1EBE5A}
.codigo{display:grid;gap:2px;justify-items:center;padding:12px 18px;border:2px dashed var(--amber);border-radius:16px;background:color-mix(in srgb,var(--amber) 10%,var(--surface))}
.codigo b{font-family:var(--f-display);font-size:28px;letter-spacing:.06em;color:var(--navy)}
.codigo small{color:var(--muted)}
.wamsg{white-space:pre-wrap;font:inherit;margin:0;background:#E7F8EE;border-color:#BFE9CF}
.rstars{color:var(--amber);letter-spacing:1px;white-space:nowrap}
.rtot{font-size:14px;color:var(--muted)}.rtot b{color:var(--ink);font-size:18px}
.rlist{display:grid;gap:4px}
.review .rhead{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.review .rhead .rstars{margin-left:auto}
.review p{margin:6px 0 2px}
.review.oculta{opacity:.6}
.tag-v{font-size:11px}
.rresp{margin-top:8px;padding:10px 12px;border-left:3px solid var(--blue);background:var(--surface-2);border-radius:0 12px 12px 0}
.rresp b{display:flex;gap:6px;align-items:center;font-size:13px;color:var(--blue)}
.rresp p{margin:4px 0 0;font-size:14px}
.rform{display:grid;gap:6px;margin-top:10px}
.rform textarea{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:8px 10px;font:inherit;background:var(--surface);color:var(--ink);resize:vertical}
.rbig{display:grid;justify-items:start;gap:2px}
.rbig b{font-family:var(--f-display);font-size:44px;line-height:1;color:var(--navy)}
.rbig .rstars{font-size:20px}
.rdist{display:grid;gap:6px;margin-top:8px}
.rdist div{display:grid;grid-template-columns:34px 1fr 26px;gap:8px;align-items:center;font-size:13px;font-weight:700}
.rdist i{height:8px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.rdist em{display:block;height:100%;background:var(--amber);border-radius:99px}
.starpick{display:flex;gap:6px}
.starpick button{border:0;background:none;font-size:38px;line-height:1;color:var(--line);cursor:pointer;padding:0 2px;transition:transform .1s}
.starpick button.on{color:var(--amber)}
.starpick button:hover{transform:scale(1.12)}
.calificar{display:flex;align-items:center;gap:12px;margin-top:18px;padding:12px 14px;border-radius:18px;background:linear-gradient(90deg,color-mix(in srgb,var(--amber) 22%,var(--surface)),var(--surface));border:1px solid color-mix(in srgb,var(--amber) 50%,transparent)}
.calificar img{width:52px;height:52px;border-radius:50%;background:#fff;flex:none}
.calificar>div{flex:1;min-width:0;display:grid}
.calificar small{color:var(--muted)}
.resv.mia{align-items:flex-start}
.mires{margin-top:6px;font-size:13.5px;color:var(--ink)}
.resv.nueva{border-left:3px solid var(--orange);padding-left:10px}
.resv .acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center;justify-content:flex-end}
.calificar{flex-wrap:wrap}
.calificar>div{min-width:170px}
@media (max-width:520px){.calificar .btn{width:100%}}

/* ===== Entrega 15: estadísticas reales y disponibilidad más clara ===== */
.kpi b .de{font-size:15px;color:var(--muted);font-weight:700}
.bars div em{position:absolute;top:-18px;left:0;right:0;text-align:center;font-style:normal;font-size:11px;font-weight:800;color:var(--ink)}
.bars.b30{gap:3px}.bars.b30 div em{display:none}
.embudo{display:grid;gap:8px}
.embudo div{width:var(--w);min-width:180px;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:linear-gradient(90deg,var(--blue),#5B9BFF);color:#fff;font-weight:700}
.embudo div:nth-child(2){background:linear-gradient(90deg,#22B573,#4FD08F)}
.embudo div:nth-child(3){background:linear-gradient(90deg,var(--orange),var(--amber))}
.embudo span{display:flex;gap:6px;align-items:center;white-space:nowrap}
.origenes{display:grid;gap:8px}
.origenes div{display:grid;grid-template-columns:minmax(150px,1.3fr) 1fr 30px;gap:8px;align-items:center;font-size:13.5px;font-weight:700}
.origenes span{display:flex;gap:6px;align-items:center}
.origenes i{height:9px;border-radius:99px;background:var(--surface-2);overflow:hidden}
.origenes em{display:block;height:100%;background:linear-gradient(90deg,var(--navy),var(--blue));border-radius:99px}
.acciones{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:12px;font-size:13px;color:var(--muted)}
.acciones span{display:inline-flex;gap:5px;align-items:center}
.acciones b{color:var(--ink)}
.vacio-est{display:flex;gap:16px;align-items:center}
.vacio-est img{width:84px;height:84px;border-radius:50%;background:#fff;flex:none}
.vacio-est h2{margin:0 0 4px}
@media (max-width:560px){.vacio-est{flex-direction:column;text-align:center}}
/* Disponibilidad */
.dispguia{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:var(--surface-2);margin-bottom:10px}
.dispguia p{margin:0;font-size:13.5px;line-height:1.45}
.ejemplo{flex:none;width:52px;height:48px;border-radius:8px;display:grid;place-items:center;position:relative;font-weight:800;align-content:center;grid-auto-flow:column}
.c2.ejemplo{background:var(--good-bg);color:var(--good)}
.cal.dispcal button.celda,.ejemplo{display:flex;align-items:baseline;justify-content:center;gap:0;padding:10px 0 12px;overflow:hidden}
.cal.dispcal button.celda b,.ejemplo b{font-size:15px}
.cal.dispcal button.celda small,.ejemplo small{font-size:10.5px;opacity:.75;font-weight:700}
.cal.dispcal button.celda i,.ejemplo i{position:absolute;left:4px;right:4px;bottom:4px;height:3px;border-radius:9px;background:rgba(0,0,0,.08)}
.cal.dispcal button.celda i::after,.ejemplo i::after{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--o);border-radius:9px;background:currentColor;opacity:.7}
.cal.dispcal .h{line-height:1.2}
.cal.dispcal .h.hoy{color:var(--blue);font-weight:800}
.ocup{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.ocup div{display:grid;justify-items:center;text-align:center;padding:8px 4px;border-radius:12px;background:var(--surface-2)}
.ocup b{font-family:var(--f-display);font-size:22px;color:var(--navy)}
.ocup small{font-size:11.5px;color:var(--muted);line-height:1.2}
.ocup div:first-child{background:var(--good-bg)}.ocup div:first-child b{color:var(--good)}

/* ===== Entrega 16: cobro de planes con Yape, Plin o transferencia ===== */
.planhoy{gap:10px}
.planhoy h2{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.mesespick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mesespick button{display:grid;justify-items:center;gap:0;padding:10px 4px;border:1.5px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);cursor:pointer}
.mesespick button b{font-family:var(--f-display);font-size:22px;line-height:1}
.mesespick button small{font-size:11.5px;color:var(--muted)}
.mesespick button span{font-weight:800;font-size:13px;margin-top:4px}
.mesespick button[aria-pressed="true"]{border-color:var(--orange);background:color-mix(in srgb,var(--orange) 10%,var(--surface));box-shadow:0 0 0 2px color-mix(in srgb,var(--orange) 35%,transparent)}
.pagodatos{display:grid;gap:10px;padding:12px;border-radius:16px;background:var(--surface-2)}
.paso{display:flex;gap:8px;align-items:center;margin:0;font-weight:700}
.paso>span{flex:none;width:24px;height:24px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:13px}
.paso b{font-size:18px;color:var(--orange)}
.yape{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.yape img{width:150px;height:150px;object-fit:contain;border-radius:14px;background:#fff;border:1px solid var(--line)}
.yape>div{display:grid;gap:4px;justify-items:start}
.yape b{font-family:var(--f-display);font-size:28px;letter-spacing:.03em;color:#742284}
.yape small{color:var(--muted);font-weight:700}
.banco{white-space:pre-wrap;font:inherit;font-weight:700;margin:0;padding:10px 12px;border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.pagorow{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.pagorow:last-child{border-bottom:0}
.pthumb{width:64px;height:64px;border-radius:12px;overflow:hidden;border:1px solid var(--line);padding:0;background:var(--surface-2);cursor:zoom-in;display:grid;place-items:center;color:var(--muted)}
.pthumb img{width:100%;height:100%;object-fit:cover}
.pthumb.vacio{cursor:default}
.qrpago{display:flex;gap:12px;align-items:center}
.qrpago img{width:96px;height:96px;object-fit:contain;border-radius:12px;background:#fff;border:1px solid var(--line)}
@media (max-width:600px){.pagorow{grid-template-columns:52px 1fr}.pagorow .acts{grid-column:1/-1;justify-content:flex-end}.pthumb{width:52px;height:52px}.mesespick{grid-template-columns:repeat(2,1fr)}}

/* ===== Entrega 17: mapa real y modo recorrido ===== */
.mapawrap{position:relative;isolation:isolate;z-index:0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--surface-2)}
.mapa{height:420px;width:100%;background:#E8EEF5}
@media (max-width:600px){.mapa{height:360px}}
.mapa.listo{background:#E8EEF5}
.mapactl{position:absolute;right:10px;top:10px;left:60px;z-index:500;display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap-reverse;pointer-events:none}
.mapactl>*{pointer-events:auto}
.mapactl .btn{box-shadow:0 4px 12px rgba(0,0,0,.18)}
.mapainfo:empty{display:none}
.mapainfo{display:inline-flex;align-items:center;gap:6px;background:var(--surface);color:var(--ink);font-weight:800;font-size:12.5px;padding:7px 10px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.leaflet-container{font-family:inherit}
.leaflet-control-attribution{font-size:10.5px}
.vp-pin span{display:grid;place-items:center;width:34px;height:34px;border-radius:50% 50% 50% 4px;transform:rotate(-45deg);background:var(--c,#04208F);border:2.5px solid #fff;box-shadow:0 4px 10px rgba(0,0,0,.3)}
.vp-pin span>*{transform:rotate(45deg);color:#fff}
.vp-pin span b{font-weight:800;font-size:15px}
.vp-pin span .ic{width:16px;height:16px}
.vp-pin.hecho span{background:#22B573}
.vp-yo i{display:block;width:18px;height:18px;margin:2px;border-radius:50%;background:#0A5BD1;border:3px solid #fff;box-shadow:0 0 0 6px rgba(10,91,209,.25),0 2px 6px rgba(0,0,0,.3)}
.vp-pop{display:grid;gap:4px;min-width:150px}
.vp-pop small{color:#5B6785}
.vp-pop .btn{justify-self:start;margin-top:4px}
.leaflet-popup-content{margin:12px 14px}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .leaflet-tile-pane{filter:brightness(.75) contrast(1.1) saturate(.8)}}
:root[data-theme="dark"] .leaflet-tile-pane{filter:brightness(.75) contrast(1.1) saturate(.8)}
.mapafull{position:fixed;inset:0;z-index:85;background:var(--bg)}
.mapafull .mapa{height:100%}
.mapacerrar{position:absolute;top:max(12px,env(safe-area-inset-top,0px));right:12px;z-index:600;box-shadow:0 4px 12px rgba(0,0,0,.25)}
/* Modo recorrido */
#recorrido{position:fixed;inset:0;z-index:75;background:var(--bg)}
html.rc-abierto body{overflow:hidden}
html.rc-abierto .fab{display:none}
.rc-mapa{position:absolute;inset:0}
.rc-top{position:absolute;z-index:600;top:max(12px,env(safe-area-inset-top,0px));left:12px;right:12px;display:flex;justify-content:space-between;align-items:center;gap:8px;pointer-events:none}
.rc-top>*{pointer-events:auto;box-shadow:0 4px 14px rgba(0,0,0,.2)}
.rc-prog{background:var(--navy);color:#fff;font-weight:700;padding:8px 14px;border-radius:999px;font-size:14px}
.rc-panel{position:absolute;z-index:600;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom,0px));max-width:560px;margin:0 auto;background:var(--surface);border-radius:22px;padding:14px;box-shadow:0 -6px 30px rgba(4,32,143,.25);display:grid;gap:10px}
.rc-card{display:flex;gap:12px;align-items:center}
.rc-cara{height:84px;width:auto;flex:none;filter:drop-shadow(0 6px 10px rgba(0,0,0,.2))}
.rc-card.llego .rc-cara{animation:vppop .5s ease}
.rc-tx{display:grid;gap:2px;min-width:0}
.rc-tx small{color:var(--muted);font-weight:800;text-transform:uppercase;font-size:11.5px;letter-spacing:.04em}
.rc-tx>b{font-family:var(--f-display);font-size:21px;line-height:1.15}
.rc-dist{font-size:15px}.rc-dist b{font-size:20px;color:var(--blue)}
.rc-err{color:var(--bad);font-weight:700;font-size:13.5px}
.rc-acts{display:flex;gap:8px;flex-wrap:wrap}
.rc-acts .btn{flex:1 1 auto}
.btn.wa-gm{background:#1A73E8;color:#fff;text-decoration:none}
.rc-nota{display:flex;gap:6px;align-items:flex-start;margin:0;font-size:12px;color:var(--muted);line-height:1.4}
.rc-nota .ic{flex:none;margin-top:1px}
.rc-fin{display:flex;gap:14px;align-items:center}
.rc-fin img{height:110px}
.rc-fin>div{display:grid;gap:6px;justify-items:start}
.rc-fin b{font-family:var(--f-display);font-size:22px}
.leaflet-bottom.leaflet-right{margin-bottom:0}
html.rc-abierto .leaflet-bottom{bottom:auto;top:70px}

/* ===== Entrega 18: idiomas y recorrido minimizado ===== */
.rc-der{display:flex;gap:8px;box-shadow:none!important}
.rc-der .btn{box-shadow:0 4px 14px rgba(0,0,0,.2)}
.rc-mintx{margin-left:4px}
@media (max-width:359px){.rc-mintx{display:none}}
.rc-prog{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
#recorrido[hidden]{display:none}
#rc-barra{position:fixed;z-index:44;left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));bottom:calc(92px + env(safe-area-inset-bottom,0px));max-width:520px;margin:0 auto;animation:vppop .35s ease}
@media (min-width:900px){#rc-barra{left:266px;right:220px;bottom:calc(20px + env(safe-area-inset-bottom,0px))}}
.rc-barra-in{width:100%;display:flex;align-items:center;gap:10px;border:0;cursor:pointer;text-align:left;font:inherit;color:#fff;background:linear-gradient(120deg,var(--navy),#0A3FBF);border-radius:20px;padding:8px 10px 8px 8px;box-shadow:0 10px 30px rgba(4,32,143,.4)}
#rc-barra.llego .rc-barra-in{background:linear-gradient(120deg,#1F8A4C,#22B573);animation:rcpulso 1.4s ease 3}
@keyframes rcpulso{50%{transform:scale(1.03)}}
.rc-barra-in img{width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:50% 20%;background:#fff;border:2px solid var(--amber);flex:none}
.rc-btx{display:grid;gap:1px;min-width:0;flex:1}
.rc-btx small{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--on-navy-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#rc-barra.llego .rc-btx small{color:#E3F5EA}
.rc-btx b{font-size:15.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-btx em{font-style:normal;font-weight:800;color:var(--amber);font-size:14px}
.rc-btx .rc-err{color:#FFD2CB;font-size:12.5px;font-weight:700}
.rc-bver{flex:none;display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,.16);border-radius:999px;padding:8px 12px;font-weight:800;font-size:13px}
@media (max-width:420px){.rc-bver>span{display:none}.rc-bver{padding:10px}}
html.rc-min .fab{bottom:calc(178px + env(safe-area-inset-bottom,0px))}
@media (min-width:900px){html.rc-min .fab{bottom:calc(24px + env(safe-area-inset-bottom,0px))}}
html.rc-min #app{padding-bottom:84px}

/* ===== Entrega 18.1: casita de inicio en la ficha y barra del recorrido ===== */
.cover .bar>.iconbtn+.iconbtn{margin-left:8px}
@media (min-width:900px){.soloMovil{display:none!important}}
/* Con el recorrido minimizado, la barra flotante se ubica encima de los botones "Agregar a mi plan / Reservar" */
body:has(.addbar) #rc-barra{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
@media (min-width:900px){body:has(.addbar) #rc-barra{bottom:calc(88px + env(safe-area-inset-bottom,0px))}}

/* ===== Entrega 19: acceso seguro e inicio con Google ===== */
.gbox{display:flex;justify-content:center;min-height:44px}
.ocorreo{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;font-weight:700}
.ocorreo::before,.ocorreo::after{content:"";flex:1;height:1px;background:var(--line)}
.gok{display:flex;gap:10px;align-items:center;padding:12px;border-radius:14px;background:var(--good-bg);color:var(--good)}
.gok>div{display:grid;gap:2px;flex:1;min-width:0}.gok span{color:var(--ink);font-size:13px;overflow-wrap:anywhere}
.reglas{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.reglas span{font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--surface-2);color:var(--muted)}
.reglas span::before{content:"○ "}
.reglas span.ok{background:var(--good-bg);color:var(--good)}.reglas span.ok::before{content:"✓ "}
.pasos-g{margin:0;padding-left:20px;display:grid;gap:8px;line-height:1.45}
.pasos-g code,.checks code{background:var(--surface-2);padding:1px 6px;border-radius:6px;font-size:12.5px;overflow-wrap:anywhere}
.checks{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.checks li{position:relative;padding-left:26px;line-height:1.4}.checks li::before{content:"✓";position:absolute;left:4px;color:var(--good);font-weight:800}
.ti.t-acceso{background:#0F766E}

/* ===== Entrega 20.1: lanzamiento ===== */
.pill.pronto{font-size:11.5px;vertical-align:middle;margin-left:6px;background:var(--warn-bg);color:var(--warn)}
.pronto-b{display:inline-block;margin-left:6px;padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.22);font-size:11.5px;font-weight:800}