@import "https://fonts.googleapis.com/css2?family=Marcellus&family=Manrope:wght@300;400;500;600&display=swap";
:root{--ink:#0b0b0b;--ink-2:#171715;--gold:#d4af37;--text:#efede7;--text-2:#a5a096;--text-3:#6e6a62;--line:#d4af3729;--r:16px;--display:"Marcellus", Georgia, serif;--ui:"Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{background:var(--ink);color:var(--text);font-family:var(--ui);-webkit-font-smoothing:antialiased;overscroll-behavior-y:none;margin:0;padding:0;font-weight:300}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none}input{font:inherit;color:inherit}.wrap{max-width:720px;margin:0 auto;padding:0 16px}.eyebrow{letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:0;font-size:10px}.title{font-family:var(--display);letter-spacing:.02em;margin:4px 0 2px;font-size:24px}.sub{color:var(--text-3);margin:0;font-size:13px}.muted{color:var(--text-2);margin:0;font-size:13px;line-height:1.6}.btn{letter-spacing:.01em;border-radius:14px;justify-content:center;align-items:center;gap:8px;width:100%;height:50px;font-size:15px;font-weight:600;transition:transform .12s,opacity .12s;display:flex}.btn:active{transform:scale(.985)}.btn:disabled{opacity:.4;cursor:default}.btn-gold{background:var(--gold);color:#100e06}.btn-ghost{border:1px solid var(--line);color:var(--text);font-weight:500}.field{border:1px solid var(--line);letter-spacing:.22em;text-align:center;background:0 0;border-radius:14px;outline:none;width:100%;height:50px;padding:0 16px}.field:focus{border-color:var(--gold)}.center-screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:18px;min-height:100dvh;padding:24px;display:flex}.grid{grid-template-columns:repeat(3,1fr);gap:3px;display:grid}@media (min-width:560px){.grid{grid-template-columns:repeat(4,1fr);gap:5px}}.cell{aspect-ratio:1;background:var(--ink-2);border-radius:3px;position:relative;overflow:hidden}.cell-open{width:100%;height:100%;padding:0;display:block}.cell img{object-fit:cover;width:100%;height:100%;transition:transform .18s;animation:.4s both fade-in;display:block}@keyframes fade-in{0%{opacity:0}}.cell.picked img{transform:scale(.93)}.tick{color:#0000;justify-content:center;align-items:center;width:34px;height:34px;padding:0;font-size:12px;display:flex;position:absolute;top:0;right:0}.tick:before{content:"";background:#0000002e;border:1.5px solid #ffffffa6;border-radius:50%;width:22px;height:22px;position:absolute;top:6px;right:6px}.tick>*{position:relative}.cell.picked .tick{color:#100e06;z-index:1}.cell.picked .tick:before{background:var(--gold);border-color:var(--gold)}.dock{padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(to top, var(--ink) 62%, transparent);z-index:20;flex-direction:column;gap:8px;display:flex;position:fixed;bottom:0;left:0;right:0}.dock-inner{flex-direction:column;gap:8px;width:100%;max-width:720px;margin:0 auto;display:flex}.hint{color:var(--gold);text-align:center;margin:0;font-size:12px}.viewer{background:var(--ink);z-index:40;flex-direction:column;display:flex;position:fixed;inset:0}.viewer-stage{touch-action:pan-y;flex:1;min-height:0;overflow:hidden}.track{will-change:transform;width:300%;height:100%;display:flex}.slide{justify-content:center;align-items:center;width:33.3333%;height:100%;display:flex}.slide img{object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;max-width:100%;max-height:100%}.viewer-bar{padding:calc(12px + env(safe-area-inset-top)) 16px 12px;color:var(--text-3);justify-content:space-between;align-items:center;font-size:12px;display:flex}.viewer-foot{padding:12px 16px calc(16px + env(safe-area-inset-bottom));flex-direction:column;gap:10px;width:100%;max-width:720px;margin:0 auto;display:flex}.code{font-family:var(--display);letter-spacing:.14em;color:var(--gold);font-variant-numeric:tabular-nums;margin:0;font-size:46px}.card{background:var(--ink-2);border-radius:var(--r);width:100%;padding:16px}.row{justify-content:space-between;align-items:center;gap:12px;display:flex}.check{border:1.5px solid var(--gold);width:72px;height:72px;color:var(--gold);border-radius:50%;justify-content:center;align-items:center;font-size:30px;display:flex}@media (prefers-reduced-motion:no-preference){.check{animation:.5s cubic-bezier(.2,.8,.3,1) pop}}@keyframes pop{0%{opacity:0;transform:scale(.6)}}