:root{--bg:#fff4e8;--surface:#fff;--ink:#3b1f17;--muted:#7a5a4f;--pink:#f7a9c2;--pink-soft:#fde0ea;--mint:#bfe3c6;--line:#f0d2c0;--btn:#3b1f17;--btnink:#fff4e8;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#2a1a16;--surface:#3a2520;--ink:#fff1e6;--muted:#d9b9aa;--pink-soft:#4b2c36;--line:#5a3a33;--btn:#f7a9c2;--btnink:#3b1f17}}
:root[data-theme="dark"]{--bg:#2a1a16;--surface:#3a2520;--ink:#fff1e6;--muted:#d9b9aa;--pink-soft:#4b2c36;--line:#5a3a33;--btn:#f7a9c2;--btnink:#3b1f17}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:500 17px/1.6 Nunito,system-ui,sans-serif}
h1,h2,h3{font-family:'Baloo 2',system-ui,sans-serif;line-height:1.05;margin:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--pink);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.hero{background:var(--pink-soft);border-radius:0 0 48px 48px;padding:48px 0 64px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:center}
.logo{width:100%;max-width:420px;border-radius:36px;justify-self:center;box-shadow:0 14px 0 var(--pink);animation:hop 1.1s 2.5s cubic-bezier(.3,1.6,.5,1) both}
@keyframes hop{0%{transform:translateY(-60px) scale(.8) rotate(-6deg);opacity:0}100%{transform:none;opacity:1}}
.hero h1{font-size:clamp(2.4rem,6vw,4.2rem);font-weight:800}
.hero p{font-size:1.2rem;color:var(--muted);max-width:30ch;margin:14px 0 26px}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-block;padding:14px 24px;border-radius:999px;background:var(--btn);color:var(--btnink);font-weight:700;text-decoration:none}
.btn.alt{background:transparent;color:var(--ink);border:2px solid var(--ink)}
section{padding:64px 0}
h2{font-size:clamp(2rem,5vw,3rem);font-weight:800;margin-bottom:8px}
.sub{color:var(--muted);margin:0 0 24px}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}
.chip{font:700 1rem Nunito,sans-serif;padding:9px 18px;border-radius:999px;border:2px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:22px}
.card{background:var(--surface);border-radius:28px;overflow:hidden;border:2px solid var(--line);text-align:center;padding-bottom:16px;transition:transform .2s}
.card:hover{transform:rotate(-1.5deg) scale(1.02)}
.card img{width:100%;display:block;aspect-ratio:200/135;object-fit:cover}
.tag{display:inline-block;margin-top:12px;padding:6px 16px;border-radius:14px;font:800 1.05rem 'Baloo 2',sans-serif;color:#3b1f17}
.info{background:var(--mint);color:#2c3a2d;border-radius:40px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.info h3{font-size:2rem}
.info p{margin:6px 0 0}
footer{padding:40px 0 56px;text-align:center;color:var(--muted)}
footer img{width:90px;border-radius:20px}
@media(max-width:720px){.hero .wrap,.info{grid-template-columns:1fr}.hero{padding-top:32px}.hero .wrap>div{text-align:center}.hero p{margin-inline:auto}.btns{justify-content:center}}
@media(prefers-reduced-motion:reduce){.logo{animation:none}.card{transition:none}}

[hidden]{display:none!important}
#ld{position:fixed;inset:0;z-index:100;background:var(--pink-soft);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;animation:ldout .5s 2.4s forwards}
#ld img{width:170px;border-radius:30px;animation:bob .9s ease-in-out infinite alternate}
#ld p{margin:0;font-weight:700}
.tr{width:min(260px,70vw);height:14px;border-radius:99px;background:var(--surface);border:2px solid var(--ink);overflow:hidden}
.tr i{display:block;height:100%;width:0;background:var(--pink);animation:fill 2.2s cubic-bezier(.4,0,.2,1) forwards}
@keyframes fill{to{width:100%}}@keyframes ldout{to{opacity:0;visibility:hidden}}@keyframes bob{to{transform:translateY(-12px) rotate(3deg)}}
.st{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:12px}
.st button{width:42px;height:42px;border-radius:50%;border:2px solid var(--ink);background:var(--surface);color:var(--ink);font:800 1.4rem 'Baloo 2',sans-serif;cursor:pointer;line-height:1}
.st output{min-width:1.6em;font:800 1.3rem 'Baloo 2',sans-serif}
.order{margin-top:36px;background:var(--surface);border:2px solid var(--line);border-radius:32px;padding:28px;max-width:560px}
.order ul{list-style:none;margin:12px 0;padding:0}
.order li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px dashed var(--line)}
.order .empty{color:var(--muted);border:0}
.tt{font-size:1.3rem;display:flex;justify-content:space-between;margin:12px 0}
.hint{color:var(--muted);font-size:.95rem;margin:0 0 16px}
#bar{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--ink);color:var(--bg);display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 20px calc(12px + env(safe-area-inset-bottom,0px))}
#bar .btn{background:var(--pink);color:#3b1f17}
.evt{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.evt table{border-collapse:collapse;margin-top:16px;width:100%}
.evt th,.evt td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
.box{background:var(--surface);border:2px solid var(--line);border-radius:32px;padding:28px}
label{display:block;font-weight:700;margin:0 0 14px}
input{display:block;width:100%;margin-top:6px;padding:12px 14px;border-radius:14px;border:2px solid var(--line);background:var(--bg);color:var(--ink);font:500 1rem Nunito,sans-serif}
.res{font:800 1.9rem 'Baloo 2',sans-serif;margin:4px 0 16px}
.btn[aria-disabled="true"]{opacity:.4;pointer-events:none}
dialog{border:0;border-radius:32px;background:var(--surface);color:var(--ink);padding:30px;width:calc(100% - 32px);max-width:430px}
dialog::backdrop{background:rgba(59,31,23,.55)}
dialog h3{font-size:1.9rem;margin-bottom:8px}
.x{position:absolute;top:12px;right:14px;border:0;background:none;color:var(--ink);font-size:1.3rem;cursor:pointer}
.err{color:#c0392b;font-weight:700}
footer .btn{margin-top:8px}
footer{padding-bottom:110px}
@media(max-width:720px){.evt{grid-template-columns:1fr}}