:root{--bg:#fff4e6;--ink:#1a2140;--g:#1d2b53;--o:#ff8a5b;--y:#ffc94d;--gs:#ffe2cf;--sage:#fff0c2;--line:#f0d9bd;--card:#fffdf8;--mu:#5f6478;
 --f:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold","Nunito","Helvetica Neue",system-ui,sans-serif;--sh:4px 4px 0 var(--g);--sp:cubic-bezier(.34,1.56,.64,1)}
html,body{overflow-x:clip}body{font-family:var(--f)}#app{overflow-x:clip}
h1,h2,h3,h4{font-family:var(--f);font-weight:900;letter-spacing:-.02em}
button{font-family:var(--f)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
.gh{display:flex;justify-content:flex-end;align-items:center;padding:max(14px,env(safe-area-inset-top)) 18px 6px}
.gm{width:44px;height:auto;animation:wob 3s ease-in-out infinite}
.ghr{display:flex;gap:8px;align-items:center}
.pw{background:var(--g);color:#fff4e6;border:0;border-radius:999px;padding:11px 18px;font:800 15px var(--f);cursor:pointer;box-shadow:3px 3px 0 var(--o);transition:transform .2s var(--sp)}
.pw:active,.gcta:active,.gbtn:active,.blk:active{transform:scale(.94)}
.lang{display:flex;border:2px solid var(--g);border-radius:999px;overflow:hidden;background:#fff}
.lang button{background:transparent;color:var(--g);border:0;padding:8px 12px;min-height:40px;min-width:42px;font:800 14px var(--f);cursor:pointer}
.lang button[aria-pressed=true]{background:var(--y)}
.gr{position:relative;text-align:center;padding:26px 20px 40px;max-width:720px;margin:auto}
@keyframes spin{to{transform:rotate(360deg)}}
.glogo{position:relative;width:min(52vw,210px);margin:18px auto 22px;display:block;animation:pop .9s var(--sp) both,bob 4s ease-in-out 1s infinite}
@keyframes pop{0%{transform:scale(.2) rotate(-12deg);opacity:0}100%{transform:none;opacity:1}}
@keyframes bob{50%{transform:translateY(-8px) rotate(2deg)}}
.stk{display:inline-block;background:var(--y);color:var(--g);font-weight:900;font-size:13px;letter-spacing:.04em;padding:8px 14px;border-radius:12px;transform:rotate(-3deg);box-shadow:var(--sh);margin:0 0 18px;animation:pop .7s var(--sp) .3s both}
.gr h1{font-size:clamp(46px,14vw,104px);line-height:.95;margin:0 0 16px;color:var(--g)}
.gr h1 .w{display:inline-block;overflow:visible}.gr h1 .w>span{display:inline-block;animation:jump .8s var(--sp) both}
.gr h1 .w:nth-child(1)>span{animation-delay:.35s}.gr h1 .w:nth-child(2)>span{animation-delay:.47s}.gr h1 .w:nth-child(3)>span{animation-delay:.59s;color:var(--o)}.gr h1 .w:nth-child(4)>span{animation-delay:.71s;color:var(--o)}
.gr h1 .w:last-child>span{animation:jump .8s var(--sp) .8s both,wob 2.6s ease-in-out 2s infinite}
@keyframes jump{0%{transform:translateY(60px) scale(.6);opacity:0}100%{transform:none;opacity:1}}
@keyframes wob{0%,100%{transform:rotate(0)}25%{transform:rotate(-6deg)}75%{transform:rotate(6deg)}}
.ghl{font-size:19px;font-weight:600;margin:0 auto 24px;max-width:30ch}
.gcta,.gbtn{display:inline-flex;gap:14px;align-items:center;background:var(--o);color:#fff;border:3px solid var(--g);border-radius:999px;padding:17px 26px;font:900 18px var(--f);cursor:pointer;box-shadow:var(--sh);transition:transform .2s var(--sp);animation:nudge 4s ease-in-out 2.5s infinite}
.gcta span{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fff;color:var(--g)}
@keyframes nudge{0%,88%,100%{transform:none}91%{transform:rotate(-4deg) scale(1.05)}94%{transform:rotate(4deg) scale(1.05)}97%{transform:rotate(-2deg)}}
.gcap{font-size:14px;color:var(--mu);margin:14px 0 30px}
.gpic{position:relative;max-width:440px;margin:0 auto;transform:rotate(calc(6deg - 6deg*var(--r,1))) scale(calc(.86 + .14*var(--r,1)));transition:transform .15s linear}
.gpic img{animation:pop .9s var(--sp) .9s both}
.gpic img{display:block;width:100%;height:auto;border-radius:28px;border:4px solid var(--g);box-shadow:8px 8px 0 var(--y)}
.bub{position:absolute;right:-6px;top:-18px;background:#fff;border:3px solid var(--g);border-radius:20px 20px 20px 4px;padding:8px 14px;font-weight:900;color:var(--o);font-size:18px;animation:wob 2.2s ease-in-out infinite;box-shadow:var(--sh)}
@keyframes mq{to{transform:translateX(-50%)}}
.gs{max-width:680px;margin:auto;padding:44px 20px}
.eyb{display:inline-block;font-size:13px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--g);background:#fff;border:2px solid var(--g);border-radius:999px;padding:5px 12px;margin:0 0 14px}
.gs h2{font-size:clamp(32px,9vw,52px);line-height:1.02;color:var(--g);margin:0 0 16px}
mark{background:linear-gradient(transparent 58%,var(--y) 58%);color:inherit;padding:0 .08em;background-size:0 100%;background-repeat:no-repeat;transition:background-size 1s ease .3s}
.in mark,.in>mark,h2.in mark{background-size:100% 100%}
.big{font-size:19px;line-height:1.5}
.rvl{opacity:0;transform:translateY(40px) scale(.94) rotate(-2deg);transition:transform .8s var(--sp) var(--d,0s),opacity .5s ease var(--d,0s)}
.rvl.in{opacity:1;transform:none}
.gst{display:grid;gap:18px}
.sti{position:relative;border:3px solid var(--g);border-radius:26px;padding:20px 20px 18px 20px;background:var(--y);box-shadow:var(--sh)}
.sti:nth-child(2){background:var(--o);color:#fff;transform-origin:center}.sti:nth-child(2) h3,.sti:nth-child(2) p{color:#fff}
.sti:nth-child(3){background:#fff}
.sti.in:nth-child(1){transform:rotate(-1.5deg)}.sti.in:nth-child(2){transform:rotate(1.5deg)}.sti.in:nth-child(3){transform:rotate(-1deg)}
.sn{position:absolute;right:16px;top:12px;font-weight:900;font-size:30px;opacity:.35}
.si{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:16px;background:#fff;border:2px solid var(--g);color:var(--g);margin-bottom:10px;animation:bob 3s ease-in-out infinite}
.si .ic{width:28px;height:28px}
.sti h3{font-size:23px;color:var(--g);margin:0 0 4px}.sti p{margin:0;font-size:16px;font-weight:600;color:#2b3150}
@keyframes pan{to{transform:scale(1.25) translateY(-4%)}}
.pin{position:absolute;left:50%;top:40%;width:44px;height:44px;margin-left:-22px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--o);border:3px solid #fff;color:#fff;display:grid;place-items:center;font-size:18px;animation:drop 2.4s var(--sp) infinite}
@keyframes drop{0%,100%{transform:rotate(-45deg) translate(0,0)}50%{transform:rotate(-45deg) translate(6px,-6px)}}
.gbtn{animation:none;background:var(--y);color:var(--g)}
.gwl{position:relative;background:#fff;border:3px solid var(--g);border-radius:30px;padding:24px 20px;margin:26px 0 0;box-shadow:8px 8px 0 var(--y)}
.gwl h3{font-size:28px;color:var(--g);margin:0 0 6px}.star{position:absolute;right:14px;top:-26px;font-size:46px;color:var(--o);animation:spin 6s linear infinite}
.gwl form{margin-top:12px}.gwl .blk{margin-top:14px;background:var(--o);border:3px solid var(--g);box-shadow:var(--sh);border-radius:18px;font:900 19px var(--f);transition:transform .2s var(--sp)}
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),select,textarea{border:2px solid var(--g);border-radius:16px;font-family:var(--f);transition:transform .2s var(--sp),box-shadow .2s}
input:focus,select:focus,textarea:focus{outline:0;box-shadow:4px 4px 0 var(--o);transform:translate(-2px,-2px)}
.cons{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.4;color:#343a52;margin:14px 0 0}.cons input{flex:none;width:24px;height:24px;margin:1px 0 0;accent-color:var(--o)}.cons a{color:var(--g);font-weight:800}
.wlok{animation:pop .7s var(--sp) both}.wlok h3{font-size:28px;margin-bottom:8px;color:var(--g)}.wlok p{margin:0 0 10px}
button.blk.alt{background:var(--y);color:var(--g);border:3px solid var(--g)}
.gend{text-align:center}.gend2 img{width:180px;margin:20px auto 8px;display:block;animation:bob 4s ease-in-out infinite}
.cf{position:fixed;padding:0;margin:0;border:0;width:10px;height:14px;z-index:200;pointer-events:none;border-radius:2px;animation:cf 1.4s cubic-bezier(.2,.6,.4,1) forwards}
@keyframes cf{to{transform:translate(var(--dx),var(--dy)) rotate(var(--rr));opacity:0}}
.top .lg img{height:30px;animation:bob 4s ease-in-out infinite}
.exit{font-weight:800;color:var(--g)}
.tabs{background:#fff;border-top:3px solid var(--g);gap:6px}
.tabs a{font-weight:800;color:var(--g);border-radius:16px;transition:transform .25s var(--sp)}
.tabs a.on{background:var(--y);color:var(--g);border:2px solid var(--g)}.tabs a.on .ic{animation:jump .6s var(--sp) both,wob 2.4s ease-in-out .6s infinite}
.tabs a:active{transform:scale(.9)}
.card{border:3px solid var(--g);border-radius:26px;box-shadow:6px 6px 0 var(--o);animation:pop .6s var(--sp) both}
#v .card:nth-child(2){animation-delay:.1s;box-shadow:6px 6px 0 var(--y)}#v .card:nth-child(3){animation-delay:.2s}#v .card:nth-child(4){animation-delay:.3s;box-shadow:6px 6px 0 var(--y)}
.card img{border-radius:18px}
.card h3{font-size:24px;color:var(--g)}
i{background:var(--y);color:var(--g);font-weight:800;border:1.5px solid var(--g)}
button[data-a=like],button[data-a=pick],button[data-a=cv],button[data-a=cm],#vf button,#mf button,#cf button,.blk{background:var(--o);color:#fff;border:3px solid var(--g);border-radius:18px;font-weight:900;box-shadow:3px 3px 0 var(--g);transition:transform .2s var(--sp)}
button[data-a=like]:active,.blk:active{transform:scale(.92) rotate(-2deg)}
button.ghost{border:2px solid var(--g);border-radius:16px;font-weight:800}
.card.gone{transform:scale(.6) rotate(-14deg) translateY(-30px);opacity:0;transition:.35s var(--sp)}
.mrow{animation:pop .5s var(--sp) both}.mrow:nth-child(2){animation-delay:.08s}.mrow:nth-child(3){animation-delay:.16s}.mrow:nth-child(4){animation-delay:.24s}.mrow:nth-child(5){animation-delay:.32s}
.card.mrow img{border:3px solid var(--o)}
.pd{background:var(--o)}
.stp li{border-radius:999px;font-weight:800}.stp li.on{background:var(--o);animation:wob 2s ease-in-out infinite}.stp li.done{background:var(--y);color:var(--g)}
.okc{background:var(--g);border:3px solid var(--g);border-radius:26px;box-shadow:6px 6px 0 var(--y);animation:pop .6s var(--sp) both}
.prop,.wait,.inv{border:2px dashed var(--g);background:#fff6d6}
.wait span{background:var(--o)}
.xrow output{color:var(--o);font-weight:900}
input[type=range]{accent-color:var(--o)}
.tile{border:2px solid var(--g);border-radius:20px;transition:transform .25s var(--sp)}
.tile:active{transform:scale(.93)}
.tile:has(input:checked),.pill:has(input:checked),.chk:has(input:checked){background:var(--y);border-color:var(--g);box-shadow:3px 3px 0 var(--g);transform:rotate(-2deg)}
.tile:has(input:checked) .a{animation:wob .5s ease-in-out}
.pill{border:2px solid var(--g);font-weight:800}
.sec h3::before{background:var(--o);color:#fff}
.bar span{background:var(--o)}.bar{height:8px;border:2px solid var(--g);background:#fff}
.wh h2{color:var(--g)}
#cl .me{background:var(--o);border-radius:18px 18px 4px 18px}#cl .ot{border:2px solid var(--g);border-radius:18px 18px 18px 4px}
.sh{border:3px solid var(--g);border-bottom:0;animation:up .45s var(--sp) both}@keyframes up{from{transform:translateY(100%)}}
@media(min-width:600px){.sh{border-bottom:3px solid var(--g)}}
.sh h2{color:var(--g);font-size:34px}
#toast{background:var(--g);border:3px solid var(--y);font-weight:800;border-radius:18px}#toast.on{animation:pop .4s var(--sp) both}
.mh{border:3px solid var(--g);box-shadow:4px 4px 0 var(--y)}
.vline,.vcard{border-radius:20px}
.sk{position:absolute;width:56px;height:56px;border-radius:18px;display:grid;place-items:center;border:3px solid var(--g);box-shadow:var(--sh);animation:wob 2.4s ease-in-out infinite,pop .8s var(--sp) 1.2s both}
.sk .ic{width:30px;height:30px}.sk1{left:-12px;bottom:28px;background:var(--y);color:var(--g)}.sk2{right:-10px;bottom:-18px;background:var(--o);color:#fff;animation-delay:.6s,1.4s}.sk3{left:30%;top:-24px;background:#fff;color:var(--o);animation-delay:1.1s,1.6s}
.gstory[data-at="1"] .gsti{--bgc:#ffd9c6}.gstory[data-at="2"] .gsti{--bgc:#fff0c2}.gstory[data-at="3"] .gsti{--bgc:#d9efe6}.gstory[data-at="4"] .gsti{--bgc:#ffe0cf}
.gsti::before{content:"";position:absolute;inset:0;background:var(--bgc,#ffe7d6);transition:background .6s;z-index:-1}
.gstage{position:relative;margin:6px 0 10px;transform:rotate(calc(-4deg + 8deg*var(--q,0)));transition:transform .2s linear}
.gstage .phone{--pw:min(56vw,230px);border:3px solid var(--g);box-shadow:10px 10px 0 var(--g)}
.gco{position:absolute;inset:0;pointer-events:none}
.co0{left:-40%;top:12%}.co1{right:-34%;top:22%}.co2{left:-38%;top:48%}.co3{right:-40%;top:58%}.co4{left:-30%;bottom:16%}
.co{border-width:3px;box-shadow:5px 5px 0 var(--g);font-family:var(--f)}
.gcap2{position:relative;width:100%;max-width:420px;height:128px}
.gcap2>div{position:absolute;inset:0;opacity:0;transform:translateY(20px) scale(.9);transition:opacity .4s,transform .6s var(--sp)}
.gcap2>div.on{opacity:1;transform:none}
.gcap2 b{display:inline-block;background:var(--g);color:var(--y);border-radius:8px;padding:2px 8px;font-size:13px}.gcap2 h3{font-size:25px;color:var(--g);margin:6px 0 4px}.gcap2 p{margin:0;font-weight:600;color:#343a52;font-size:15px}
.gdots{display:flex;gap:6px}.gdots i{display:block;width:10px;height:10px;margin:0;padding:0;border:2px solid var(--g);border-radius:99px;background:#fff;transition:width .4s var(--sp),background .3s}.gdots i.on{width:28px;background:var(--o)}
@media(max-width:380px){.co{font-size:12px;padding:8px 10px}}
.eyb{animation:wob 3.5s ease-in-out infinite}
html{scroll-snap-type:y proximity}
.snp{position:absolute;left:0;top:calc(var(--i)*70svh + 35svh);width:1px;height:1px;margin:0;padding:0;border:0;background:none;pointer-events:none;scroll-snap-align:start;scroll-snap-stop:always}
.gstory,.gpro{position:relative}
.pola{display:grid;grid-template-columns:1fr 1fr;gap:26px 18px;margin:34px 4px 0}
@media(min-width:640px){.pola{grid-template-columns:repeat(3,1fr)}}
.pola figure{position:relative;margin:0;background:#fffdf8;padding:9px 9px 0;border-radius:3px;box-shadow:0 14px 28px -8px rgba(29,43,83,.35),0 2px 4px rgba(29,43,83,.08)}
.pola figure::before{content:"";position:absolute;left:50%;top:-11px;width:64px;height:22px;margin-left:-32px;background:rgba(255,201,77,.75);transform:rotate(-4deg);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.pola figure:nth-child(even)::before{background:rgba(255,138,91,.6);transform:rotate(5deg)}
.pola img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:1px}
.pola figcaption{text-align:center;padding:11px 4px 14px;font:700 18px/1.1 "Marker Felt","Chalkboard SE","Bradley Hand","Segoe Print","Comic Sans MS",var(--f);color:var(--g)}
.pola figure.rvl{opacity:0;transform:translateY(-70px) rotate(calc(var(--rt)*4)) scale(1.12);transition:transform .9s var(--sp) var(--d,0s),opacity .4s ease var(--d,0s)}
.pola figure.rvl.in{opacity:1;transform:rotate(var(--rt));animation:sway 5s ease-in-out 1.4s infinite}
@keyframes sway{0%,100%{transform:rotate(var(--rt))}50%{transform:rotate(calc(var(--rt)*-.6)) translateY(-4px)}}
.pola figure:active{transform:scale(1.04) rotate(0)!important;z-index:2}
.gpro{height:calc(3*70svh + 100svh);background:linear-gradient(180deg,var(--bg),#fff0c2 18%,#fff0c2 82%,var(--bg))}
.gpi{position:sticky;top:0;height:100svh;max-width:680px;margin:auto;display:flex;flex-direction:column;justify-content:center;padding:16px 20px;overflow:hidden}
.gpi .eyb{align-self:flex-start}
.gpi h2{font-size:clamp(30px,8.6vw,50px);line-height:1.02;color:var(--g);margin:0 0 22px}
.gpc{display:grid}
.gpk{grid-area:1/1;background:#fff;border:3px solid var(--g);border-radius:26px;padding:20px 20px 22px;box-shadow:7px 7px 0 var(--o);opacity:0;transform:translateY(70px) rotate(5deg) scale(.9);transition:opacity .4s,transform .7s var(--sp)}
.gpk:nth-child(2){box-shadow:7px 7px 0 var(--y)}.gpk:nth-child(3){box-shadow:7px 7px 0 var(--g)}
.gpk.on{opacity:1;transform:rotate(-1.5deg)}
.gpn{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--o);color:#fff;font-size:20px;border:3px solid var(--g)}
.gpk h3{font-size:clamp(26px,7.4vw,38px);line-height:1.02;color:var(--g);margin:12px 0 14px}
.gpa,.gpb{margin:0;font-size:17px;line-height:1.35}
.gpa span,.gpb span{display:inline-block;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;border-radius:8px;padding:3px 8px;margin:0 8px 6px 0;vertical-align:2px}
.gpa{color:#8a8c99;font-weight:700}.gpa span{background:#ebe6dd;color:#6b6d7c}
.gpa s{text-decoration:none;background:linear-gradient(var(--o),var(--o)) 0 58%/0 3px no-repeat;transition:background-size .7s ease .6s}
.gpk.on .gpa s{background-size:100% 3px}
.gpb{margin-top:12px;font-weight:800;color:var(--g);font-size:19px;opacity:0;transform:translateY(16px) scale(.95);transition:opacity .4s ease 1.1s,transform .6s var(--sp) 1.1s}
.gpb span{background:var(--y);color:var(--g);border:2px solid var(--g)}
.gpk.on .gpb{opacity:1;transform:none}
.gpi .gdots{margin-top:22px}
.gstory{height:calc(5*70svh + 100svh);background:linear-gradient(180deg,var(--bg),#ffe7d6 15%,#ffe7d6 85%,var(--bg))}
.gsti{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 20px;overflow:hidden;text-align:center}
