/* Generated by scripts/build-camp.mjs from mockup/camp.html: edit the mockup or scripts/camp/live.css, not this file. */
#camp{
/* Layout: a horizontal row of phone screens in funnel order; the screens keep the booking platform's own light look, the page around them follows the viewer's theme. */
&{
  /* booking platform (screens): fixed, they mirror the live site */
  --navy:#16224a;--teal:#0f766e;--teal-tint:#e6f2f0;--orange:#ec9431;--orange-tint:#fdf1e3;--orange-deep:#8a4b08;--ink:#0b0f1c;
  --paper:#ffffff;--mist:#f5f6f9;--hair:#e8eaf0;--body:#3a4258;--muted:#6d7489;--alert:#b4232a;--alert-tint:#f8e9e9;--wa:#1fa855;
  --scrim:#080b14;--scrim-fg:#f4f5f8;
  /* page chrome: themed */
  --ground:#eef0f4;--surface:#ffffff;--text:#16224a;--text-2:#5f6880;--line:#dfe2ea;--bezel:#0f1424;
  --display:var(--font-display);--sans:var(--font-sans);
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
&{margin:0;padding:0 16px 56px;background:var(--ground);color:var(--text);font:15px/1.5 var(--sans)}
h1,h2,h3{font-family:var(--display);margin:0;text-wrap:balance}
button{font:inherit}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* page chrome */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--ground);display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding-block:16px 12px;border-bottom:1px solid var(--line)}
.top h1{font-size:17px;font-weight:700;letter-spacing:-.01em}.top h1 small{display:block;font:600 12px var(--sans);color:var(--text-2);letter-spacing:0}
.status{margin-left:auto;font-size:12px;font-weight:700;color:var(--text-2)}.status.err{color:var(--alert)}
.seg{position:relative;display:inline-flex;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:3px}
.seg button{position:relative;z-index:1;border:0;background:transparent;color:var(--text-2);padding:6px 14px;border-radius:999px;font-weight:700;font-size:13px;cursor:pointer;transition:color .3s var(--ease)}
.seg button[aria-pressed="true"]{color:#fff}
.seg i{position:absolute;top:3px;bottom:3px;left:3px;border-radius:999px;background:var(--navy);transition:transform .35s var(--ease),width .35s var(--ease)}
.hint{color:var(--text-2);font-size:14px;max-width:78ch;margin:14px 0 0}
.banner{background:var(--orange-tint);color:var(--orange-deep);border-radius:12px;padding:10px 14px;font-weight:700;font-size:14px;margin:12px 0 0}

.flow{display:flex;gap:28px;overflow-x:auto;padding:26px 4px 30px;scroll-snap-type:x proximity;align-items:flex-start}
.flow.swap .scr{animation:camp-swap .45s var(--ease)}
.step{flex:0 0 auto;width:380px;max-width:calc(100vw - 32px);scroll-snap-align:start;display:flex;flex-direction:column;gap:12px}
.boot .step{animation:camp-rise .8s var(--ease) both;animation-delay:calc(var(--i) * 70ms)}
.step>h2{font:700 11px var(--sans);color:var(--text-2);text-transform:uppercase;letter-spacing:.14em;display:flex;align-items:center;gap:10px}
.step>h2 b{font:600 12px var(--display);color:var(--text);letter-spacing:0;font-variant-numeric:tabular-nums}
.step>h2 em{font-style:normal;color:var(--orange);font-size:10px;letter-spacing:.12em}
.frame{background:var(--paper);color:var(--body);border-radius:42px;border:7px solid var(--bezel);overflow:hidden;min-height:780px;display:flex;flex-direction:column;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 30px 60px -30px rgba(11,16,32,.35)}
.note{font-size:13px;color:var(--text-2);padding:0 6px;margin:0}
.note b{color:var(--text)}

/* the screen */
.scr{display:flex;flex-direction:column;gap:16px;padding:22px 22px 26px;flex:1}
.scr.bleed{padding-top:0}
.bar{display:flex;align-items:center;gap:10px;font:700 10px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.bar span:first-child{font-variant-numeric:tabular-nums}
.bar i{display:block;height:2px;border-radius:2px;background:var(--hair);flex:1;overflow:hidden}
.bar i b{display:block;height:100%;background:var(--teal);transform-origin:left;animation:camp-fill 1s var(--ease) both;animation-delay:.25s}
.eyebrow{font:700 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
.scr h1{font-size:26px;line-height:1.12;font-weight:700;letter-spacing:-.025em;color:var(--navy)}
.sub{font-weight:600;color:var(--muted);margin:0;font-size:14.5px}
.card{border-radius:20px;padding:16px;background:var(--mist);display:flex;flex-direction:column;gap:6px;position:relative}
.card.pick{border:1px solid var(--hair);background:var(--paper);transition:border-color .3s var(--ease),background .3s var(--ease),transform .25s var(--ease)}
.card.pick:active{transform:scale(.985)}
.card.on{border-color:var(--teal);background:var(--teal-tint);box-shadow:0 0 0 1px var(--teal) inset}
.card h3{font-size:15.5px;font-weight:700;letter-spacing:-.01em;color:var(--navy)}.card p{margin:0;font-size:14px;font-weight:600;color:var(--muted)}
.tag{position:absolute;top:14px;right:14px;background:var(--orange);color:var(--ink);font-size:10.5px;font-weight:800;padding:4px 9px;border-radius:999px;letter-spacing:.02em}
.tag.soft{background:transparent;border:1px solid var(--hair);color:var(--muted)}
.price{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.02em;color:var(--navy);font-variant-numeric:tabular-nums}.price small{font:600 13px var(--sans);color:var(--muted);letter-spacing:0}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid var(--hair);font-size:14px;font-weight:700;color:var(--navy)}.row:first-child{border-top:0}
.row .left{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}.row small{font-weight:600;color:var(--muted)}
.left-n{font-size:11.5px;font-weight:800;padding:4px 9px;border-radius:999px;background:var(--teal-tint);color:var(--teal);white-space:nowrap}.left-n.low{background:var(--orange-tint);color:var(--orange-deep)}.left-n.full{background:var(--alert-tint);color:var(--alert)}
.chk{width:20px;height:20px;border-radius:6px;border:1.5px solid var(--hair);display:inline-flex;align-items:center;justify-content:center;color:#fff;flex:none;transition:background .3s var(--ease),border-color .3s var(--ease)}
.chk.on{background:var(--teal);border-color:var(--teal)}
.chk svg{width:12px;height:12px;stroke-dasharray:20;stroke-dashoffset:20;animation:camp-tick .5s var(--ease) forwards;animation-delay:calc(.4s + var(--d,0) * 90ms)}
.btn{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:8px;height:52px;border-radius:999px;background:var(--orange);color:var(--ink);font-weight:800;font-size:15px;cursor:pointer;transition:transform .25s var(--ease),filter .25s var(--ease)}
.btn:hover{filter:brightness(1.04)}.btn:active{transform:scale(.98)}
.btn.ghost{margin-top:0;background:var(--paper);border:1px solid var(--hair);color:var(--navy);height:48px}
.btn.wa{background:var(--wa);color:#fff}
.btn .arr{transition:transform .3s var(--ease)}.btn:hover .arr{transform:translateX(3px)}
.lk{position:relative;cursor:pointer;display:block}
.lk::after{content:"";position:absolute;top:-4px;right:-4px;width:9px;height:9px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px var(--paper)}
span.lk{display:inline-block}
.ed{outline:none;border-radius:5px;cursor:text;min-width:1ch}.ed:hover{box-shadow:0 0 0 2px rgba(236,148,49,.5)}.ed:focus{box-shadow:0 0 0 2px var(--teal);background:rgba(15,118,110,.07)}.ed.changed{box-shadow:inset 0 -2px 0 var(--orange)}
.ed:empty{display:inline-block;min-width:12ch;min-height:1.5em;padding:2px 8px;border-radius:8px;box-shadow:inset 0 0 0 1.5px var(--hair);background:var(--mist)}
.ed:empty::before{content:attr(data-ph);color:var(--muted);font-weight:600;opacity:.75}
.ed:empty:focus::before{content:""}
.foot{margin-top:auto;font-size:12px;font-weight:600;color:var(--muted);text-align:center}
.summary{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:var(--body)}.summary div{display:flex;justify-content:space-between;gap:10px}
.summary .tot{font-family:var(--display);font-weight:700;color:var(--navy);font-size:16px;border-top:1px solid var(--hair);padding-top:10px;margin-top:4px;font-variant-numeric:tabular-nums}
.mission{display:grid;grid-template-columns:auto 1fr;gap:7px 12px;font-size:13px;font-weight:600;color:var(--body)}.mission b{color:var(--teal);font:600 11px var(--display);font-variant-numeric:tabular-nums;padding-top:2px}

/* media on the screens */
.ph{display:block;width:100%;height:100%;object-fit:cover;background:var(--mist)}
.hero{position:relative;margin:0 -22px;height:300px;overflow:hidden;background:var(--navy)}
.hero img{animation:camp-drift 22s ease-in-out infinite alternate}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,15,28,.35) 0%,rgba(11,15,28,0) 30%,rgba(11,15,28,0) 55%,rgba(11,15,28,.7) 100%)}
.hero .brand{position:absolute;z-index:1;top:18px;left:22px;font:700 10px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#fff}
.play{position:absolute;z-index:1;left:22px;bottom:18px;display:flex;align-items:center;gap:12px;border:0;background:none;color:#fff;cursor:pointer;padding:0;text-align:left}
.play i{width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.18);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.45);display:flex;align-items:center;justify-content:center;position:relative}
.play i::before{content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid rgba(255,255,255,.6);animation:camp-ping 2.4s var(--ease) infinite}
.play svg{width:14px;height:14px;margin-left:3px}
.play b{font:700 14px var(--display);letter-spacing:-.01em;display:block}.play small{font:600 12px var(--sans);opacity:.8}
.next{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:center;padding:14px 0;border-block:1px solid var(--hair)}
.next h3{font-size:15px;color:var(--navy);font-weight:700}.next p{margin:0;font-size:13px;font-weight:600;color:var(--muted);grid-column:1}
.next .tag{position:static;grid-row:1/3;grid-column:2;align-self:center}
.camps{display:flex;flex-direction:column;gap:10px}
.track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;border-radius:22px}
.track::-webkit-scrollbar{display:none}
.slot{flex:0 0 100%;scroll-snap-align:start;position:relative;padding-top:40px}
.slot svg.art{position:absolute;z-index:0;pointer-events:none}
.slot .ninja{width:52px;height:40px;top:6px;right:104px;animation:camp-peek 5.5s var(--ease) infinite}
.slot .hands{width:52px;height:9px;top:35px;right:104px;z-index:2}
.slot .chimney{width:46px;height:46px;top:2px;right:104px}
.slot .chimney .legs{transform-box:fill-box;transform-origin:50% 100%;animation:camp-kick 1.4s ease-in-out infinite}
.slide .snow{position:absolute;inset:0;pointer-events:none}
.slide .snow i{position:absolute;top:-6px;width:4px;height:4px;border-radius:50%;background:#fff;opacity:.85;animation:camp-fall linear infinite}
.slide{position:relative;z-index:1;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:var(--navy);color:#fff;border-radius:18px;min-height:64px}
.slide.alt{background:var(--teal)}
.sinfo{display:flex;flex-direction:column;gap:3px;min-width:0;text-align:left}
.sinfo h3{font-size:15.5px;font-weight:700;letter-spacing:-.01em;color:#fff}
.sinfo .yr{font:800 9.5px var(--sans);letter-spacing:.22em;color:var(--orange)}
.slide.alt .sinfo .yr{color:#fff;opacity:.75}
.sinfo .yr .ed:empty{background:transparent;box-shadow:none;min-width:4ch}
.dtile{display:flex;align-items:center;flex:none;line-height:1}
.drow{display:flex;align-items:flex-start;gap:8px}
.dp{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:34px}
.dp b{font:700 20px var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.dp>span{font:800 8.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--orange)}
.slide.alt .dp>span{color:#fff;opacity:.8}
.dtile .dash{font:500 16px/20px var(--display);opacity:.45}
.dots{display:flex;gap:6px;justify-content:center}
.dots button{width:6px;height:6px;padding:0;border:0;border-radius:3px;background:var(--hair);cursor:pointer;transition:width .4s var(--ease),background .4s var(--ease)}
.dots button.on{width:20px;background:var(--navy)}
.wkc{position:relative;aspect-ratio:16/10;max-width:100%;overflow:hidden;background:var(--mist)}
.wkc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.04);transition:opacity 1s ease,transform 4.5s ease-out}
.wkc img.on{opacity:1;transform:scale(1)}
.wkdots{position:absolute;z-index:1;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:5px}
.wkdots i{width:5px;height:5px;border-radius:3px;background:rgba(255,255,255,.55);transition:width .4s var(--ease),background .4s var(--ease)}
.wkdots i.on{width:16px;background:#fff}
.wk{border:1px solid var(--hair);border-radius:22px;overflow:hidden;background:var(--paper)}
.wkph{aspect-ratio:16/9;max-width:100%;background:repeating-linear-gradient(135deg,var(--mist) 0 12px,#eef0f5 12px 24px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--muted);font:700 11px var(--sans);letter-spacing:.04em;text-align:center;padding:12px}
.wkph svg{width:28px;height:28px;opacity:.7}
.wkb{padding:16px;display:flex;flex-direction:column;gap:10px}
.wkb h3{font-size:17px;font-weight:700;letter-spacing:-.015em;color:var(--navy)}.wkb>p{margin:0;font-size:14px;font-weight:600;color:var(--muted)}
.disc{list-style:none;margin:2px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.disc li{aspect-ratio:1;border-radius:18px;background:var(--mist);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:8px 4px;text-align:center;transition:transform .3s var(--ease),background .3s var(--ease)}
.disc li:hover{transform:translateY(-2px);background:var(--teal-tint)}
.disc svg{width:46px;height:46px;flex:none}
.disc li b{font:700 11.5px/1.15 var(--display);color:var(--navy);letter-spacing:-.01em}
.strip{display:flex;gap:8px;overflow-x:auto;margin:0 -22px;padding:0 22px 4px;scroll-snap-type:x mandatory;scrollbar-width:none}
.strip::-webkit-scrollbar{display:none}
.strip button{flex:0 0 auto;width:86px;height:116px;border-radius:14px;overflow:hidden;border:0;padding:0;cursor:zoom-in;scroll-snap-align:start;position:relative;background:var(--mist)}
.strip button img{transition:transform .6s var(--ease)}.strip button:hover img{transform:scale(1.06)}
.strip .more{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:var(--mist);color:var(--navy);font:700 12px var(--sans)}
.strip .more b{font:700 18px var(--display)}
.label{display:flex;justify-content:space-between;align-items:baseline;font:700 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.label button{border:0;background:none;color:var(--teal);font:800 12px var(--sans);letter-spacing:0;text-transform:none;cursor:pointer;padding:0}
.thumb{width:56px;height:56px;border-radius:14px;overflow:hidden;flex:none;border:0;padding:0;cursor:zoom-in;background:var(--mist)}
.card.pick.media{flex-direction:row;align-items:center;gap:14px;padding:12px 14px 12px 12px}
.card.pick.media .thumb{width:72px;height:84px;border-radius:14px}
.card.pick.media>div{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.card.pick.media .tag{position:static;align-self:flex-start;margin-bottom:2px}
.cpeek{position:absolute;top:-20px;right:44px;width:40px;height:20px;overflow:hidden;pointer-events:none}
.cp-head{display:block;width:40px;height:31px;animation:camp-peek 5.5s var(--ease) infinite;animation-delay:1.2s}
.cp-hands{position:absolute;top:-4px;right:44px;width:40px;height:7px;pointer-events:none}
.cp-star{position:absolute;right:14px;bottom:12px;width:16px;height:16px;opacity:.85;pointer-events:none;animation:camp-spin 6s linear infinite}

.cpeek2{position:absolute;top:-25px;right:44px;width:36px;height:25px;overflow:hidden;pointer-events:none}
.cp-chim{display:block;width:36px;height:36px}
.cp-chim .legs{transform-box:fill-box;transform-origin:50% 100%;animation:camp-kick 1.4s ease-in-out infinite}
.cp-flake{position:absolute;right:14px;bottom:12px;width:16px;height:16px;opacity:.8;pointer-events:none;animation:camp-spin 9s linear infinite}
.card.past{border:1px solid var(--hair);background:var(--paper);gap:12px;padding:14px}
.past-h{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.past-h .tag{position:static;flex:none}
.tag.done{display:inline-flex;align-items:center;gap:5px;background:#e3f4e8;color:#1c7a3d;border:1px solid #bfe3c9}
.tag.done svg{width:11px;height:11px}
.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.th{border-radius:14px;padding:6px 6px 9px;display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;overflow:hidden}
.th svg{display:block;width:100%;height:auto;margin-bottom:4px}
.th b{font:700 11px/1.15 var(--display);color:var(--navy);letter-spacing:-.01em}
.th>span{font-size:10.5px;font-weight:700;color:var(--muted)}
.th1{background:#eaf5eb}.th2{background:#f8efe2}.th3{background:var(--teal-tint)}
.th2 svg{margin:-6px -6px 4px;width:calc(100% + 12px)}
.card.pick.media.xmas{background:linear-gradient(135deg,#fdf0ef 0%,#ffffff 50%,#edf7f0 100%)}
.card.xmas>.thumb,.card.xmas>div{position:relative;z-index:1}
.card.xmas>.cp-flake{z-index:1}
.xbg{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
.xbg .wire{position:absolute;left:0;top:0;width:100%;height:16px}
.xbg i{position:absolute;width:6px;height:9px;margin-left:-3px;border-radius:50% 50% 45% 45%;box-shadow:0 0 6px currentColor;animation:camp-twinkle 1.8s ease-in-out infinite alternate}
.xbg i::before{content:"";position:absolute;top:-2px;left:1.5px;width:3px;height:3px;border-radius:1px;background:#5b6b5e}
.xbg b{position:absolute;top:-6px;width:4px;height:4px;border-radius:50%;background:#bcd0e4;opacity:.9;animation:camp-fall2 linear infinite}


.card.pick.media.ninj{background:linear-gradient(135deg,#e6f2f0 0%,#f6fbfa 55%,#fdf3e6 100%)}
.card.ninj>.thumb,.card.ninj>div{position:relative;z-index:1}
.card.ninj>.cp-star{z-index:1}
.nbg{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
.nbg .brush{position:absolute;inset:0;width:100%;height:100%}
.nbg .fly{position:absolute;left:-14%;display:flex;align-items:center;opacity:0;animation:camp-fly var(--t) var(--d) infinite}
.nbg .trail{display:block;width:34px;height:1.5px;border-radius:1px;background:linear-gradient(90deg,transparent,rgba(22,34,74,.35));margin-right:-2px;animation:camp-trail var(--t) var(--d) infinite}
.nbg .spinr{display:block;width:var(--sz);height:var(--sz);opacity:.6;animation:camp-strike var(--t) var(--d) infinite}
.nbg .spinr svg{display:block;width:100%;height:100%}



.tip{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:16px;background:var(--orange-tint);color:var(--orange-deep);position:relative}
.tip-ic{flex:none;width:30px;height:30px;border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--orange)}
.tip-ic svg{width:17px;height:17px}
.tip-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;padding-right:22px}
.tip-l{font:800 10px var(--sans);letter-spacing:.16em;text-transform:uppercase}
.tip-t{display:grid}
.tip-t p{grid-area:1/1;margin:0;font-size:13.5px;font-weight:700;color:var(--orange-deep);opacity:0;transform:translateY(4px);transition:opacity .6s var(--ease),transform .6s var(--ease);pointer-events:none}
.tip-t p.on{opacity:1;transform:none;pointer-events:auto}
.tip-dots{position:absolute;top:14px;right:14px;display:flex;gap:4px}
.tip-dots i{width:5px;height:5px;border-radius:3px;background:rgba(138,75,8,.25);transition:width .4s var(--ease),background .4s var(--ease)}
.tip-dots i.on{width:12px;background:var(--orange-deep)}
.wks{display:flex;flex-direction:column;gap:8px}
.wkcard{border:1px solid var(--hair);border-radius:18px;background:var(--paper);overflow:hidden;transition:border-color .3s var(--ease),box-shadow .3s var(--ease)}
.wkcard.on{border-color:var(--teal);box-shadow:0 0 0 1px var(--teal) inset}
.wkcard.full{opacity:.55}
.wkhead{display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;position:relative}
.wkhead [data-wchk]{display:flex}
.wkinfo{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.wkno{font:800 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.wkinfo b{font:700 14.5px var(--display);color:var(--navy);letter-spacing:-.01em}
.wkprice{display:flex;flex-direction:column;align-items:flex-end;gap:1px;text-align:right}
.wkprice>span{font:700 15px var(--display);color:var(--navy);font-variant-numeric:tabular-nums}
.wkprice small{font-size:11px;font-weight:700;color:var(--muted)}
.caret{width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg) translateY(-2px);transition:transform .3s var(--ease);flex:none}
.wkcard.open .caret{transform:rotate(225deg) translate(-2px,0)}
.wkdays{display:flex;flex-direction:column;border-top:1px solid var(--hair);background:var(--mist);padding:4px 14px}
.wkdays.opening{animation:camp-drop .35s var(--ease)}
.dayrow{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;padding:8px 0;font:inherit;cursor:pointer;text-align:left;border-top:1px solid var(--hair)}
.dayrow:first-child{border-top:0}
.dname{flex:1;font-size:13.5px;font-weight:700;color:var(--navy)}
.dayrow small{font-size:11.5px;font-weight:700;color:var(--muted)}
.seltot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;background:var(--navy);color:#fff}
.seltot>div{display:flex;flex-direction:column;gap:2px}
.tlabel{font:800 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--orange)}
.seltot small{font-size:12px;font-weight:600;opacity:.8}
.seltot b{font:700 22px var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}

.kids{display:flex;flex-direction:column;gap:8px}
.kid{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--hair);border-radius:18px;background:var(--paper);position:relative}
.kav{flex:none;width:40px;height:40px;border-radius:50%;background:var(--c);color:#fff;display:flex;align-items:center;justify-content:center;font:700 16px var(--display);text-transform:uppercase}
.kav.sm{width:22px;height:22px;font-size:10px}
.kf{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0;padding-right:22px}
.kin{font:700 15px var(--sans);color:var(--navy);border:1px solid var(--hair);border-radius:10px;padding:7px 10px;background:var(--mist);width:100%;min-width:0}
.kin:focus{outline:2px solid var(--teal);outline-offset:0;background:#fff}
.krow{display:flex;align-items:center;gap:10px}
.kage{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}
.kage .kin{width:56px;padding:5px 8px;font-size:14px}
.kmem{display:flex;align-items:center;gap:6px;border:0;background:none;font:700 12px var(--sans);color:var(--muted);cursor:pointer;padding:0}
.kmem.on{color:var(--teal)}
.krm{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;border:0;background:var(--mist);color:var(--muted);cursor:pointer;font-size:15px;line-height:1}
.kchips{display:flex;gap:4px;margin-top:3px}
.kchip{display:inline-flex;align-items:center;gap:4px;padding:2px 7px 2px 2px;border-radius:999px;background:var(--mist);font:800 10.5px var(--sans);color:var(--navy)}
.kchip b{width:16px;height:16px;border-radius:50%;background:var(--c);color:#fff;display:flex;align-items:center;justify-content:center;font:700 9px var(--display);text-transform:uppercase}
.mode{display:flex;background:#fff;border:1px solid var(--hair);border-radius:999px;padding:3px;margin:8px 0 4px}
.mode button{flex:1;border:0;background:none;border-radius:999px;padding:6px 8px;font:700 12px var(--sans);color:var(--muted);cursor:pointer;transition:background .3s var(--ease),color .3s var(--ease)}
.mode button[aria-pressed="true"]{background:var(--navy);color:#fff}
.grid{display:grid;grid-template-columns:1fr repeat(var(--n),minmax(46px,auto));align-items:center;gap:2px 6px;padding:4px 0 8px}
.gh{display:flex;flex-direction:column;align-items:center;gap:3px;font:800 10px var(--sans);color:var(--navy);padding-bottom:4px;text-align:center}
.gd{font-size:13px;font-weight:700;color:var(--navy);padding:7px 0;border-top:1px solid var(--hair)}
.cell{display:flex;justify-content:center;align-items:center;border:0;border-top:1px solid var(--hair);background:none;padding:7px 0;cursor:pointer}
.cell .chk.on{background:var(--c);border-color:var(--c)}
.pkg{display:flex;flex-direction:column;gap:10px}
.pks{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pkc{position:relative;border:1px solid var(--hair);border-radius:18px;padding:12px;display:flex;flex-direction:column;gap:2px;background:var(--paper);opacity:.6;transition:opacity .4s var(--ease),border-color .4s var(--ease),background .4s var(--ease)}
.pkc.act{opacity:1;border-color:var(--teal);background:var(--teal-tint)}
.pkc.pkw.act{border-color:var(--orange);background:var(--orange-tint)}
.pkl{font:800 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.pkc b{font:700 18px var(--display);color:var(--navy);letter-spacing:-.02em}.pkc b small{font:600 12px var(--sans);color:var(--muted);letter-spacing:0}
.pkc>small{font-size:11.5px;font-weight:700;color:var(--teal)}
.pkc.pkw>small{color:var(--orange-deep)}
.badge{position:absolute;top:-8px;right:-6px;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#d6372e;color:#fff;font:800 12px/22px var(--sans);text-align:center;box-shadow:0 0 0 3px var(--paper)}
.pkc.bump{animation:camp-pkbump .6s var(--ease)}
.pkc.bump .badge{animation:camp-badgepop .6s var(--ease)}


.offer{display:flex;flex-direction:column;gap:10px}
.ocards{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:stretch}
.ocard{position:relative;border:1px solid var(--hair);border-radius:18px;padding:14px 12px 12px;display:flex;flex-direction:column;gap:4px;background:var(--paper)}
.ocard b{font:700 19px var(--display);color:var(--navy);letter-spacing:-.02em}.ocard b small{font:600 12px var(--sans);color:var(--muted);letter-spacing:0}
.ocard p{margin:0;font-size:12px;font-weight:600;color:var(--muted);line-height:1.35}
.ocard.best{border:1.5px solid var(--orange);background:linear-gradient(160deg,#fff 0%,var(--orange-tint) 100%);box-shadow:0 10px 24px -14px rgba(236,148,49,.7);transform:translateY(-2px)}
.ribbon{position:absolute;top:-9px;left:12px;background:var(--orange);color:var(--ink);font:800 9.5px var(--sans);letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:999px}
.save{align-self:flex-start;margin-top:4px;font:800 11px var(--sans);color:#1c7a3d;background:#e3f4e8;padding:3px 8px;border-radius:999px}
.obanner{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:var(--navy);color:#fff;font-size:13px;font-weight:700}
.obanner svg{width:18px;height:18px;flex:none;color:var(--orange)}
.nudge{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;border:1.5px dashed var(--orange);background:var(--orange-tint);color:var(--orange-deep);font-size:13px;font-weight:700;cursor:pointer;animation:camp-drop .4s var(--ease)}
.nudge b{margin-left:auto;flex:none;background:var(--orange);color:var(--ink);font:800 12px var(--sans);padding:5px 10px;border-radius:999px}
.nudge.ok{border-style:solid;border-color:#bfe3c9;background:#e3f4e8;color:#1c7a3d;cursor:default}
.nd-ic{flex:none;width:22px;height:22px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}
.frame{position:relative}
.upop{position:absolute;inset:0;z-index:30;display:flex;align-items:flex-end}
.upop-bg{position:absolute;inset:0;background:rgba(11,15,28,.45);opacity:0;transition:opacity .3s var(--ease)}
.upop-card{position:relative;width:100%;background:#fff;border-radius:28px 28px 0 0;padding:26px 22px 24px;display:flex;flex-direction:column;gap:8px;transform:translateY(100%);transition:transform .45s var(--ease);box-shadow:0 -20px 40px -20px rgba(11,15,28,.4)}
.upop.show .upop-bg{opacity:1}.upop.show .upop-card{transform:none}
.upop-x{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:50%;border:0;background:var(--mist);color:var(--muted);font-size:18px;cursor:pointer}
.upop-ic{width:44px;height:44px;border-radius:14px;background:var(--orange-tint);color:var(--orange);display:flex;align-items:center;justify-content:center}
.upop-ic svg{width:22px;height:22px}
.upop-l{font:800 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--orange-deep);margin-top:4px}
.upop-card h3{font-size:21px;font-weight:700;letter-spacing:-.02em;color:var(--navy)}
.upop-card p{margin:0;font-size:14.5px;font-weight:600;color:var(--body)}
.upop-b{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.upop-b .btn{margin-top:0;width:100%;border:0;font:inherit;font-weight:800}
.upop-b .btn.ghost{border:1px solid var(--hair)}
.acc{font-variant-numeric:tabular-nums;letter-spacing:.02em;color:var(--navy)}
.accbox{display:flex;flex-direction:column;align-items:flex-end;gap:1px;text-align:right}.accbox small{font-size:11px;font-weight:700;color:var(--muted)}
.obanner{position:relative;padding-right:40px}
.obanner .tip-t{flex:1;min-width:0}
.obanner .tip-t p{color:#fff;font-size:13px;font-weight:700}
.obanner .tip-dots{top:50%;right:12px;transform:translateY(-50%);flex-direction:column}
.obanner .tip-dots i{background:rgba(255,255,255,.3);width:5px;height:5px}
.obanner .tip-dots i.on{background:var(--orange);width:5px;height:12px}
.ocard{padding:10px 12px 9px !important;gap:1px !important;border-radius:14px !important}
.ocard b{font-size:16px !important}
.ocard.best{transform:none !important}
.ocard .ribbon{top:-8px;font-size:8.5px;padding:2px 7px}
.odesc{position:relative;padding:2px 34px 0 2px}
.odesc .tip-t p{font-size:12.5px;font-weight:600;color:var(--muted)}
.odesc .tip-t p b{color:var(--navy);font-weight:800}
.odesc .tip-dots{top:6px;right:4px}
.odesc .tip-dots i{background:var(--hair)}.odesc .tip-dots i.on{background:var(--navy)}
.film{position:relative;border-radius:22px;overflow:hidden;height:210px;border:0;padding:0;cursor:pointer;background:var(--navy);display:block;width:100%}
.film img{transition:transform 1.2s var(--ease)}.film:hover img{transform:scale(1.04)}
.film::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,15,28,0) 40%,rgba(11,15,28,.72))}
.film .play{bottom:16px;left:16px}
.film .len{position:absolute;z-index:1;top:14px;right:14px;font:800 10.5px var(--sans);letter-spacing:.06em;color:#fff;background:rgba(11,15,28,.45);padding:4px 9px;border-radius:999px}
.tl{display:flex;flex-direction:column}
.tl .row{align-items:center;padding:8px 0;gap:10px;font-size:13px}
.tl .thumb{width:34px;height:34px;border-radius:10px}
.tl .left{line-height:1.25}.tl time{font:600 12px var(--display);color:var(--teal);width:42px;flex:none;font-variant-numeric:tabular-nums}
.mosaic{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:92px;gap:6px}
.mosaic button{border:0;padding:0;border-radius:12px;overflow:hidden;cursor:zoom-in;position:relative;background:var(--mist)}
.mosaic button:first-child{grid-row:span 2}
.mosaic button img{transition:transform .6s var(--ease)}.mosaic button:hover img{transform:scale(1.06)}
.mosaic .plus::after{content:attr(data-more);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(11,15,28,.5);color:#fff;font:700 18px var(--display)}
.upsell{background:var(--navy);color:#fff;border-radius:22px;overflow:hidden;display:flex;flex-direction:column}
.upsell .img{height:130px;position:relative}
.upsell .img .tag{z-index:1}
.upsell>div:last-child{padding:16px;display:flex;flex-direction:column;gap:6px}
.upsell h3{color:#fff;font-size:16px}.upsell p{margin:0;color:rgba(255,255,255,.78);font-weight:600;font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.chips .left-n{padding:7px 12px;font-size:12px}

/* popover for links */
.pop{position:fixed;z-index:9;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);width:min(420px,calc(100vw - 32px));background:var(--navy);color:#fff;border-radius:18px;padding:16px 18px;display:grid;gap:10px;box-shadow:0 20px 50px -20px rgba(0,0,0,.5);animation:camp-up .35s var(--ease)}
.pop b{font-family:var(--display);font-weight:600}.pop code{background:rgba(255,255,255,.12);padding:3px 8px;border-radius:8px;font-size:13px;word-break:break-all}
.pop button{border:0;border-radius:999px;padding:8px 14px;font-weight:800;cursor:pointer;background:rgba(255,255,255,.15);color:#fff;justify-self:start}

/* overlays: film player and photo viewer */
.ov{position:fixed;inset:0;z-index:20;background:var(--scrim);color:var(--scrim-fg);display:flex;align-items:center;justify-content:center;padding:calc(16px + env(safe-area-inset-top,0px)) 16px calc(16px + env(safe-area-inset-bottom,0px));animation:camp-fadein .35s var(--ease)}
.ov .x{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:14px;z-index:3;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;font-size:20px;line-height:1}
.stage{position:relative;height:min(86vh,820px);aspect-ratio:9/16;max-width:100%;border-radius:22px;overflow:hidden;background:#000;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.stage video{width:100%;height:100%;object-fit:cover;display:block}
.stage .layer{position:absolute;inset:0;opacity:0;transition:opacity .9s ease}
.stage .layer.show{opacity:1}
.stage .layer img{width:100%;height:100%;object-fit:cover;display:block}
.stage .layer.show img{animation:camp-kb 4.2s linear both}
.stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,0) 22%,rgba(0,0,0,0) 62%,rgba(0,0,0,.7))}
.segs{position:absolute;z-index:2;top:12px;left:12px;right:12px;display:flex;gap:4px}
.segs i{flex:1;height:2.5px;border-radius:2px;background:rgba(255,255,255,.3);overflow:hidden}
.segs i b{display:block;height:100%;width:100%;background:#fff;transform:scaleX(0);transform-origin:left}
.who{position:absolute;z-index:2;top:26px;left:14px;display:flex;align-items:center;gap:8px;font:700 12px var(--sans)}
.who span{width:26px;height:26px;border-radius:50%;background:var(--orange);color:var(--ink);display:flex;align-items:center;justify-content:center;font:700 11px var(--display)}
.cap{position:absolute;z-index:2;left:18px;right:18px;bottom:20px;display:grid;gap:4px}
.cap small{font:700 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;opacity:.75}
.cap b{font:700 22px/1.15 var(--display);letter-spacing:-.02em;animation:camp-capin .6s var(--ease) both}
.endcard{position:absolute;inset:0;z-index:3;background:rgba(8,11,20,.82);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:28px 22px;animation:camp-fadein .5s var(--ease)}
.endcard h3{font-size:24px;letter-spacing:-.02em;font-weight:700}.endcard p{margin:0;opacity:.8;font-weight:600}
.endcard .btn{margin-top:6px}
.endcard .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
.endcard a{color:#fff;font-weight:700;font-size:13px;opacity:.85}
.ig{position:absolute;z-index:2;right:14px;top:22px;font:700 11.5px var(--sans);color:#fff;background:rgba(255,255,255,.14);padding:6px 11px;border-radius:999px;text-decoration:none}
.lbwrap{display:flex;flex-direction:column;align-items:center;gap:14px;max-width:100%}
.lbimg{max-width:min(92vw,1100px);max-height:76vh;border-radius:14px;display:block;animation:camp-lbin .45s var(--ease)}
.lbbar{display:flex;align-items:center;gap:16px;font-weight:700;font-size:14px}
.lbbar span{font-variant-numeric:tabular-nums;opacity:.6;font-size:12px}
.nav{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;cursor:pointer;font-size:18px}

aside.notes{max-width:78ch;display:grid;gap:10px;margin-top:4px}
aside.notes label{font:700 11px var(--sans);color:var(--text-2);letter-spacing:.14em;text-transform:uppercase}
textarea{width:100%;font:inherit;border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--surface);color:var(--text);min-height:110px}















@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.stage .layer.show{opacity:1}}
}
@keyframes camp-spin{to{transform:rotate(360deg)}}
@keyframes camp-twinkle{from{opacity:1;filter:brightness(1.15)}to{opacity:.45;filter:brightness(.9)}}
@keyframes camp-fall2{to{transform:translate(10px,190px)}}
@keyframes camp-fly{0%{left:-14%;opacity:0;animation-timing-function:cubic-bezier(.3,0,.9,.6)}6%{opacity:1}30%{left:calc(100% - 34px - var(--sz) / 2);opacity:1}82%{left:calc(100% - 34px - var(--sz) / 2);opacity:1}92%,100%{left:calc(100% - 34px - var(--sz) / 2);opacity:0}}
@keyframes camp-trail{0%,28%{opacity:1}31%,100%{opacity:0}}
@keyframes camp-strike{0%{transform:rotate(0)}30%{transform:translateX(0) rotate(1800deg)}32%{transform:translateX(2px) rotate(1806deg)}34%{transform:translateX(-1px) rotate(1797deg)}36%{transform:translateX(1px) rotate(1801deg)}38%,100%{transform:translateX(0) rotate(1800deg)}}
@keyframes camp-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes camp-pkbump{0%{transform:scale(1)}35%{transform:scale(1.05)}100%{transform:scale(1)}}
@keyframes camp-badgepop{0%{transform:scale(.3)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
@keyframes camp-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes camp-swap{from{opacity:.35}to{opacity:1}}
@keyframes camp-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes camp-tick{to{stroke-dashoffset:0}}
@keyframes camp-drift{from{transform:scale(1.02)}to{transform:scale(1.12) translate(-1.5%,-1%)}}
@keyframes camp-ping{0%{transform:scale(1);opacity:.8}80%,100%{transform:scale(1.6);opacity:0}}
@keyframes camp-kb{from{transform:scale(1.02)}to{transform:scale(1.12)}}
@keyframes camp-capin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes camp-fadein{from{opacity:0}to{opacity:1}}
@keyframes camp-up{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes camp-peek{0%,8%{transform:translateY(18px)}22%,72%{transform:translateY(0)}86%,100%{transform:translateY(18px)}}
@keyframes camp-kick{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes camp-fall{to{transform:translate(8px,84px)}}
@keyframes camp-lbin{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
/* Live page: one screen at a time inside the funnel's card, no phone bezel, real controls instead of the mockup's labels. */
#camp{display:flex;flex-direction:column;flex:1;padding:0;background:var(--paper);color:var(--body)}
#camp .flow{display:block;overflow:visible;padding:0}
#camp .step{display:block;width:auto;max-width:none;--i:0}
#camp .scr{min-height:60vh}
#camp .bar .back{flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-right:2px;border:0;border-radius:50%;background:var(--mist);color:var(--navy);font-size:14px;line-height:1;cursor:pointer}
#camp .label .lbl{border:0;background:none;padding:0;color:var(--muted);font:700 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;text-align:left}
#camp button.slide{width:100%;border:0;color:#fff;font:inherit;text-align:left;cursor:pointer}
#camp button.card{width:100%;color:var(--body);font:inherit;text-align:left;cursor:pointer}
#camp .thumb{display:block}
#camp .btn{box-sizing:border-box;width:100%;border:0;text-decoration:none}
#camp .btn:disabled,#camp .btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;filter:none;transform:none}
#camp .wchk{display:flex;border:0;background:none;padding:0;cursor:pointer}
#camp .wchk:disabled{cursor:not-allowed}
#camp .dayrow:disabled,#camp .cell:disabled{opacity:.45;cursor:not-allowed}
#camp .pcard{flex-direction:column;align-items:stretch}
#camp .pcard .kf{padding-right:0}
#camp .pl{font:800 10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
#camp .ps{margin:0;font-size:12.5px;font-weight:600;color:var(--muted)}
#camp .kin[aria-invalid="true"]{border-color:var(--alert);background:var(--alert-tint)}
#camp .alert{margin:0;color:var(--alert);font-weight:700;font-size:13.5px}
#camp .copy{margin-top:4px;border:0;border-radius:999px;background:var(--teal-tint);color:var(--teal);font:800 11px var(--sans);padding:4px 9px;cursor:pointer}
#camp .summary div>span:last-child{white-space:nowrap}
#camp .pnote{margin:0;font-size:12px;font-weight:600;color:var(--muted)}
#camp .upop{position:fixed;inset:0;z-index:40}
#camp .upop-card{max-width:430px;margin:0 auto}
@media (min-width:768px){#camp .upop{align-items:center;padding:16px}#camp .upop-card{border-radius:28px}}
#camp .ov{z-index:50}
