:root,[data-theme=blue]{--bg:#2e2bff;--on-bg:#fff;--on-bg-soft:#e4e3ff;--ink:#0d0d12;--muted:#4a4a5e;--surface:#fff;--accent:#d4ff3a;--pink:#ff4fa3;--soft:#eef0ff;color:var(--ink);background:var(--bg);font-family:Onest,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}a{color:inherit}.app{flex-direction:column;min-height:100dvh;display:flex}.top,.foot,main{width:min(880px,100% - 32px);margin:0 auto}.top{color:var(--on-bg,#fff);align-items:center;gap:12px;padding:18px 0;display:flex}.logo{font-family:Unbounded,serif;font-size:28px;font-weight:800;text-decoration:none}.grow{flex:1}.pill,.btn{border:2px solid var(--ink);background:var(--surface);color:var(--ink);cursor:pointer;border-radius:999px;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:0 16px;font-weight:700;display:inline-flex}.btn.accent{background:var(--accent)}.btn.wide{width:100%}main{flex:1}.card{background:var(--surface);border:2px solid var(--ink);box-shadow:6px 6px 0 var(--ink);border-radius:28px;margin:12px 0 28px;padding:22px}h1{color:var(--on-bg,#fff);margin:0 0 12px;font-family:Unbounded,serif;font-size:clamp(32px,6vw,52px);line-height:1.05}.hero h1{text-transform:uppercase;letter-spacing:-.04em;font-size:clamp(40px,8vw,76px);line-height:.95}.hl{background:var(--accent);color:var(--ink);border-radius:.12em;padding:0 .12em}.hero .lead{max-width:36ch;margin:18px 0}.stickers{flex-wrap:wrap;gap:12px;margin-top:22px;display:flex}.sticker{border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);border-radius:14px;padding:10px 14px;font-size:13px;font-weight:700;line-height:1.25;display:inline-block}.sticker.a1{background:var(--accent);transform:rotate(-3deg)}.sticker.a2{background:#fff;transform:rotate(2deg)}.sticker.a3{background:var(--pink);color:#fff;transform:rotate(-1deg)}.sec{padding:28px 0 8px}.sec>h2{color:var(--on-bg,#fff);text-transform:uppercase;letter-spacing:-.03em;margin:0 0 16px;font-family:Unbounded,serif;font-size:clamp(28px,5vw,44px);line-height:1}.sec>.btn{margin-top:16px}.steps{gap:14px;display:grid}.step,.cafe,.memory{margin:0}.step b{color:var(--bg);font-family:Unbounded,serif;font-size:22px}.step h3{margin:8px 0;font-family:Unbounded,serif;font-size:20px}.cafes{gap:14px;display:grid}.cafe{text-align:left;cursor:pointer;width:100%;display:block}.cafe h3{margin:0 0 6px;font-family:Unbounded,serif;font-size:22px}.chips{margin:8px 0 0;font-weight:700}.off{color:var(--on-bg-soft,#e4e3ff)}.progress{gap:6px;margin-bottom:10px;display:flex}.progress i{background:var(--soft);border-radius:99px;flex:1;height:6px}.progress i.on{background:var(--bg)}.qnav{justify-content:space-between;gap:16px;margin-top:16px;display:flex}.link{color:var(--bg);cursor:pointer;background:0 0;border:0;padding:8px 0;font-weight:700}.taste{align-items:end;gap:8px;height:72px;margin-top:16px;display:flex}.col{background:var(--soft);border-radius:8px;align-items:end;width:18px;height:64px;display:flex;overflow:hidden}.fill{background:var(--bg);width:100%}.pay{margin-top:16px}.pay img{background:#fff;border-radius:12px;margin:8px 0;display:block}[data-theme=emerald]{--bg:#007a52;--on-bg:#fff;--on-bg-soft:#d6f5e8;--accent:#ffd23f;--pink:#ff8a5b;--soft:#e6f6ef;--ink:#0b1a14}[data-theme=orange]{--bg:#ff6a13;--on-bg:#0d0d12;--on-bg-soft:#2a1305;--accent:#0d0d12;--pink:#ffe14d;--soft:#fff0e6}[data-theme=pink]{--bg:#ff3d8b;--on-bg:#0d0d12;--on-bg-soft:#2b0716;--accent:#2e2bff;--pink:#d4ff3a;--soft:#ffe8f2}[data-theme=graphite]{--bg:#1f2126;--on-bg:#f4f4f6;--on-bg-soft:#c9cad1;--accent:#d4ff3a;--pink:#8c8cff;--soft:#eff0f2}[data-theme=night]{--bg:#0e0f1a;--on-bg:#f2f2f7;--on-bg-soft:#b9bad0;--surface:#1b1d2e;--ink:#f2f2f7;--muted:#a9abc2;--accent:#7c7aff;--pink:#ff6fb5;--soft:#262840}.off s{margin-right:10px}.memory{margin-bottom:18px}@media (width>=760px){.steps,.cafes{grid-template-columns:repeat(3,1fr)}}.lead{color:var(--on-bg-soft,#e4e3ff);font-size:18px;line-height:1.45}.row{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.stack{flex-direction:column;gap:12px;margin-top:16px;display:flex}.menu{position:relative}.menu-list{z-index:5;background:var(--surface);min-width:100%;color:var(--ink);border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);border-radius:18px;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 8px);right:0}.menu-list button{text-align:left;width:100%;color:var(--ink);cursor:pointer;background:0 0;border:0;border-radius:12px;min-height:40px;padding:8px 12px;font-weight:700}.menu-list button.on{background:var(--accent)}.menu-list button:hover{background:var(--soft)}.menu-list button.on:hover{background:var(--accent)}.chev{display:block}.chev.up{transform:rotate(180deg)}.choice{text-align:left;background:var(--soft);cursor:pointer;border:2px solid #0000;border-radius:18px;width:100%;padding:14px 16px}.choice small{color:var(--muted);margin-top:4px;display:block}.q{margin:0 0 8px;font-family:Unbounded,serif;font-size:28px}.muted{color:var(--muted)}.foot{color:var(--on-bg-soft,#e4e3ff);padding-bottom:28px;font-size:13px;line-height:1.45}.score{color:var(--bg);font-family:Unbounded,serif}.drinks{flex-direction:column;gap:12px;margin:16px 0 0;padding:0;list-style:none;display:flex}.drinks li{justify-content:space-between;align-items:center;gap:16px;display:flex}.card>.btn{margin-top:18px}.err{color:#b00029}label{margin-top:12px;font-weight:700;display:block}form .btn{margin-top:22px}input,textarea{border:2px solid var(--ink);border-radius:14px;width:100%;min-height:44px;margin-top:6px;padding:8px 12px}.pass{display:block;position:relative}.pass input{padding-right:48px}.eye{cursor:pointer;width:40px;height:44px;color:var(--ink);background:0 0;border:0;padding:0;position:absolute;top:6px;right:6px}.hp{position:absolute;left:-9999px}table{border-collapse:collapse;width:100%;font-size:14px}td,th{text-align:left;vertical-align:top;border-bottom:1px solid #ddd;padding:8px 4px}