:root{--bg:#1b1410;--card:#2a1f18;--ink:#f6eadb;--mute:#b79f88;--cof:#c98b57;--cream:#f3d9b1;--line:#3d2d22}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);min-height:100vh;margin:0;font-family:Cairo,system-ui,sans-serif}.app{max-width:430px;margin:auto;padding:16px 16px 96px}.top{justify-content:space-between;align-items:center;padding:6px 2px 14px;display:flex}.logo{color:var(--cream);font-size:22px;font-weight:800}.logo small{color:var(--mute);font-size:11px;font-weight:400;display:block}.pill{background:var(--card);border:1px solid var(--line);color:var(--mute);border-radius:999px;padding:6px 12px;font-size:12px}.card{background:var(--card);border:1px solid var(--line);border-radius:22px;margin-bottom:14px;padding:18px}.lab{color:var(--cof);margin-bottom:6px;font-size:12px;font-weight:700}.q{color:var(--cream);font-size:21px;font-weight:800;line-height:1.55}.btn{background:var(--cof);color:#1b1410;border:0;border-radius:16px;justify-content:center;align-items:center;width:100%;min-height:48px;margin-top:10px;font-size:15px;font-weight:700;display:flex}.btn.ghost{border:1px solid var(--line);color:var(--ink);background:0 0}textarea,.field{border:1px solid var(--line);width:100%;min-height:96px;color:var(--ink);font:inherit;background:#20170f;border-radius:16px;padding:12px;font-size:15px}.row{gap:8px;display:flex}.row .btn{margin-top:10px}.chip{border:1px solid var(--line);color:var(--mute);background:#20170f;border-radius:999px;margin:0 0 6px 6px;padding:6px 12px;font-size:13px;display:inline-block}.chip.on{background:var(--cof);color:#1b1410;border-color:var(--cof)}.msg{background:#20170f;border-radius:16px;margin-bottom:8px;padding:10px 12px;font-size:15px;line-height:1.6}.msg b{color:var(--cof);font-size:12px;display:block}.nav{border-top:1px solid var(--line);background:#150f0b;justify-content:space-around;padding:8px 0 14px;display:flex;position:fixed;bottom:0;left:0;right:0}.nav div{text-align:center;min-width:64px;min-height:44px;color:var(--mute);font-size:11px}.nav div span{justify-content:center;align-items:center;height:26px;display:flex}.nav .on{color:var(--cream)}.steam{color:var(--mute);text-align:center;margin-top:10px;font-size:11px}.tag{color:var(--mute);text-align:center;padding:4px;font-size:11px}@font-face{font-family:Cairo;src:local(Cairo)}.top .pill{cursor:pointer}.err{color:#e59a8a;margin-top:8px;font-size:13px}input.field{min-height:48px;margin-bottom:8px}.msg.mine{border:1px solid var(--line);background:#2d2217}.code{letter-spacing:6px;text-align:center;color:var(--cream);direction:ltr;font-size:34px;font-weight:800}.nav button{min-width:64px;min-height:44px;font:inherit;color:var(--mute);background:0 0;border:0;flex-direction:column;align-items:center;font-size:11px;display:flex}.nav button.on{color:var(--cream)}.nav{padding:8px 0 14px}.btn.sm{min-height:40px;font-size:13px}.sub{color:var(--mute);font-size:12px}.chips button{border:1px solid var(--line);font:inherit;color:var(--mute);background:#20170f;border-radius:999px;margin:0 0 6px 6px;padding:6px 12px;font-size:13px}.chips button.on{background:var(--cof);color:#1b1410;border-color:var(--cof)}.cup{color:var(--mute);justify-content:center;display:flex}.cup.on{color:var(--cof)}.cup .steam1{opacity:0}.cup.on svg path:nth-child(3){animation:2.4s ease-in-out infinite st}@keyframes st{0%,to{opacity:.35;transform:translateY(1px)}50%{opacity:1;transform:translateY(-1px)}}@media (width>=760px){.app{zoom:1.15;max-width:560px}.nav{padding-left:calc(50% - 280px);padding-right:calc(50% - 280px)}}
