:root{--brand: #1e3326;--brand-ink: #f3f1e7;--accent: #c8a95e;--bg: #ffffff;--fg: #020817;--muted: #64748b;--border: #e2e8f0;--surface: #f1f5f9;--ok: #16a34a;--danger: #dc2626;--warn-bg: #fef3c8;--warn-fg: #b45309;--radius: 12px;--radius-lg: 16px;--sheet: 24px}*{box-sizing:border-box;margin:0;padding:0}html{background:var(--brand)}body{background:var(--bg);color:var(--fg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased;min-height:100dvh}#app{display:flex;flex-direction:column;min-height:100dvh}.num{font-variant-numeric:tabular-nums}.brandtop{background:var(--brand);color:var(--brand-ink);padding:max(20px,env(safe-area-inset-top)) 24px 26px}.brandtop .kicker{font-size:18px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.brandtop .who{font-size:13px;color:color-mix(in srgb,var(--brand-ink) 70%,transparent);margin-top:2px}.brandtop .lead{font-size:14px;color:color-mix(in srgb,var(--brand-ink) 80%,transparent);margin-top:6px}.balance{display:flex;align-items:baseline;gap:8px;margin-top:14px}.balance b{font-size:40px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.balance span{font-size:15px;color:color-mix(in srgb,var(--brand-ink) 70%,transparent)}.tier{display:inline-block;margin-top:8px;padding:3px 12px;border-radius:999px;background:color-mix(in srgb,var(--accent) 22%,transparent);color:var(--accent);font-size:12px;font-weight:600}.sheet{background:var(--bg);border-radius:var(--sheet) var(--sheet) 0 0;margin-top:-12px;padding:22px 20px calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px;flex:1}.page{padding:max(20px,env(safe-area-inset-top)) 20px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:16px;min-height:100dvh}.page h1{font-size:22px;font-weight:600;letter-spacing:-.01em}.sub{font-size:14px;color:var(--muted)}.grow{flex:1}.footnote{font-size:12px;color:var(--muted);text-align:center}button{font:inherit;cursor:pointer}.btn{border:0;border-radius:var(--radius);padding:15px 16px;font-size:15px;font-weight:600;width:100%;text-align:center;display:block;text-decoration:none}.btn.brand{background:var(--brand);color:var(--brand-ink)}.btn.outline{background:var(--bg);color:var(--fg);border:1px solid var(--border)}.btn.ghost{background:none;color:var(--muted);font-weight:500}.btn:disabled{opacity:.55;cursor:default}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:13px;font-weight:500;color:var(--muted)}input[type=text],input[type=tel],input[type=date]{font:inherit;width:100%;padding:13px 14px;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--fg)}input:focus-visible,button:focus-visible,a:focus-visible,[role=button]:focus-visible{outline:2px solid var(--brand);outline-offset:1px;border-color:transparent}.error{color:var(--danger);font-size:13px;min-height:1.2em}.consent{display:flex;gap:10px;align-items:flex-start;font-size:13px}.consent input{width:20px;height:20px;margin:0;flex:none;accent-color:var(--brand)}.consent input:not(:checked)+span{color:var(--muted)}.benefit{display:flex;align-items:center;gap:14px;background:var(--surface);border-radius:var(--radius);padding:14px 16px}.benefit b{font-size:20px;font-weight:700;color:var(--brand);white-space:nowrap}.benefit span{font-size:13px}.code-row{display:flex;gap:8px;justify-content:center}.code-cell{flex:0 1 48px;min-width:0;width:48px;height:72px;border-radius:14px;background:var(--surface);border:2px solid transparent;display:grid;place-items:center;font-size:28px;font-weight:700;font-variant-numeric:tabular-nums}.code-cell.active{border-color:var(--brand)}.code-input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}.code-wrap{position:relative;cursor:text}.okmark{width:72px;height:72px;border-radius:999px;background:color-mix(in srgb,var(--ok) 14%,white);color:var(--ok);font-size:34px;font-weight:700;display:grid;place-items:center;margin:10px auto 0}.minicard{border-radius:var(--radius-lg);padding:18px 20px;color:var(--brand-ink);background:linear-gradient(145deg,var(--brand),color-mix(in srgb,var(--brand) 65%,black))}.minicard .kicker{font-size:14px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}.minicard .mini-note{margin-top:6px;font-size:12.5px;color:var(--accent)}.qr-wrap{background:var(--surface);border-radius:var(--radius-lg);padding:14px;align-self:center}.qr-wrap canvas{display:block;border-radius:8px}.barcode-wrap{background:#fff;border-radius:var(--radius-lg);padding:10px 14px;align-self:center;max-width:100%;overflow-x:auto}.barcode-wrap canvas{display:block}.serial{text-align:center;font-size:15px;font-weight:600;letter-spacing:.18em;font-variant-numeric:tabular-nums}.hint-center{text-align:center;font-size:13px;color:var(--muted)}.progress .labels{display:flex;justify-content:space-between;font-size:12px;margin-bottom:6px}.progress .labels span:first-child{color:var(--muted)}.progress .labels span:last-child{font-weight:600}.bar{height:8px;border-radius:999px;background:var(--surface);overflow:hidden}.bar>i{display:block;height:100%;border-radius:999px;background:var(--brand)}.note{background:var(--surface);border-radius:var(--radius);padding:10px 14px;font-size:12px;color:var(--muted);display:flex;flex-direction:column;gap:2px}.note.warn{background:var(--warn-bg);color:var(--warn-fg)}.note.warn b{font-size:15px}.note .ok{color:var(--ok)}.note b{color:var(--fg);font-size:13px;margin-bottom:4px}.stamps{display:flex;flex-direction:column;gap:12px;align-items:center}.stamps .row{display:flex;gap:12px}.stamp{width:54px;height:54px;border-radius:999px;display:grid;place-items:center;font-size:15px;font-weight:600;background:var(--surface);border:1.5px solid var(--border);color:var(--muted)}.stamp.done{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-size:20px}.reward{background:color-mix(in srgb,var(--brand) 12%,white);border-radius:var(--radius-lg);padding:14px 16px;display:flex;flex-direction:column;gap:2px}.reward b{font-size:12px;font-weight:600;color:var(--brand)}.reward span{font-size:13px}h2{font-size:17px;font-weight:600;margin-top:6px}.offer{border:1px solid var(--border);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}.offer .who{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em}.offer .title{font-size:15px;font-weight:600}.offer .cond{font-size:12px;color:var(--muted)}.ops{display:flex;flex-direction:column}.op{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid var(--border)}.op:last-child{border-bottom:0}.op .what{font-size:14px}.op .when{font-size:12px;color:var(--muted)}.op .amount{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}.op .amount.plus{color:var(--ok)}.op .amount.minus{color:var(--danger)}.op .amount.muted{color:var(--muted);font-weight:500}.empty{font-size:13px;color:var(--muted)}.refcode{background:var(--surface);border-radius:14px;padding:16px;text-align:center;font-size:26px;font-weight:700;letter-spacing:.18em;font-variant-numeric:tabular-nums}.refactions{display:flex;flex-direction:column;gap:8px}.invited{border:1px solid var(--border);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}.invited .cap{font-size:12px;font-weight:600;color:var(--muted)}.invited .row{display:flex;justify-content:space-between;align-items:center;gap:12px}.invited .who{font-size:14px;font-weight:500}.invited .state{font-size:12px;color:var(--muted)}.invited .pts{font-size:14px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}.invited .pts.earned{color:var(--ok)}.notif{display:flex;flex-direction:column;gap:10px}.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);font-size:14px;cursor:pointer}.toggle:last-of-type{border-bottom:0}.toggle.disabled{color:var(--muted);cursor:default}.toggle input{position:absolute;opacity:0;pointer-events:none}.toggle .track{flex:none;width:46px;height:28px;border-radius:999px;background:var(--border);padding:2px;display:flex;justify-content:flex-start;transition:background .15s ease}.toggle .track i{display:block;width:24px;height:24px;border-radius:999px;background:#fff;transition:transform .15s ease}.toggle input:checked+.track{background:var(--brand)}.toggle input:checked+.track i{transform:translate(18px)}.toggle input:disabled+.track{opacity:.5}.toggle input:focus-visible+.track{outline:2px solid var(--brand);outline-offset:2px}.invite-note{background:color-mix(in srgb,var(--accent) 18%,white);border-radius:var(--radius);padding:12px 14px;font-size:13px;display:flex;flex-direction:column;gap:2px}.invite-note b{font-size:14px}.center{min-height:100dvh;display:grid;place-items:center;padding:24px;text-align:center;color:var(--muted)}.rules{padding:max(20px,env(safe-area-inset-top)) 20px calc(32px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:18px;max-width:640px;margin:0 auto}.rules h1{font-size:24px;line-height:1.25;margin:2px 0 0}.rules-section{display:flex;flex-direction:column;gap:6px}.rules-section h2{font-size:15px;margin:0}.rules-section p{margin:0;font-size:13.5px;line-height:1.5;color:var(--muted)}.rules .btn{margin-top:4px}.footnote.link{color:var(--brand, var(--muted));text-decoration:underline;text-underline-offset:3px}
