@import "https://fonts.googleapis.com/css2?family=Marcellus&family=Manrope:wght@300;400;500;600&display=swap";
:root{--ink:#0b0b0b;--ink-2:#161615;--ink-3:#201f1e;--text:#f4f2ee;--text-2:#a8a49c;--text-3:#6d6a63;--line:#f4f2ee24;--line-soft:#f4f2ee14;--ok:#4fb477;--wait:#d99133;--no:#d1595a;--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:.22em;text-transform:uppercase;color:var(--text-3);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}.logo{width:100%;max-width:250px;height:auto;margin-left:auto;margin-right:auto;display:block}.logo-sm{max-width:132px}.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-solid{background:var(--text);color:var(--ink)}.btn-ghost{border:1px solid var(--line);color:var(--text);font-weight:500}.btn-ok{background:var(--ok);color:#06210f}.btn-no{border:1px solid var(--no);color:var(--no);font-weight:500}.btn-quiet{border:1px solid var(--line-soft);color:var(--text-2);font-weight:500}.btn-quiet:active{color:var(--text)}.btn-quiet-no{border:1px solid var(--line-soft);color:var(--no);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(--text-2)}.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:#0003;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:var(--ink);z-index:1}.cell.picked .tick:before{background:var(--text);border-color:var(--text)}.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(--text-2);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(8px + env(safe-area-inset-top)) 10px 8px;color:var(--text-3);justify-content:space-between;align-items:center;font-size:12px;display:flex}.viewer-close{width:44px;height:44px;color:var(--text);justify-content:center;align-items:center;padding:0;font-size:24px;line-height:1;display:flex}.viewer-close:active{opacity:.55}.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:.16em;font-variant-numeric:tabular-nums;margin:0;font-size:58px}.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}.state{letter-spacing:.04em;align-items:center;gap:7px;font-size:12px;display:inline-flex}.state:before{content:"";background:currentColor;border-radius:50%;width:8px;height:8px}.state-wait{color:var(--wait)}.state-ok{color:var(--ok)}.state-no{color:var(--no)}.disc{border:1.5px solid;border-radius:50%;justify-content:center;align-items:center;width:76px;height:76px;font-size:32px;display:flex}@media (prefers-reduced-motion:no-preference){.disc{animation:.5s cubic-bezier(.2,.8,.3,1) pop}}@keyframes pop{0%{opacity:0;transform:scale(.6)}}.bought{grid-template-columns:repeat(3,1fr);gap:6px;width:100%;display:grid}.bought a{aspect-ratio:1;border-radius:10px;display:block;position:relative;overflow:hidden}.bought img{object-fit:cover;width:100%;height:100%;display:block}.bought a:after{content:"↓";width:22px;height:22px;color:var(--text);background:#0b0b0ba8;border-radius:50%;justify-content:center;align-items:center;font-size:12px;display:flex;position:absolute;bottom:5px;right:6px}.event-code{font-family:var(--display);letter-spacing:.22em;margin:14px 0 4px;font-size:26px}.free-tag{letter-spacing:.1em;text-transform:uppercase;background:var(--text);color:var(--ink);border-radius:99px;padding:5px 11px;font-size:12px;font-weight:600;position:absolute;bottom:6px;left:6px}.back{color:var(--text-3);padding:6px 2px;font-size:13px;text-decoration:none;display:inline-block}.back:active{color:var(--text)}.sheet{background:#fff;border:.3mm dashed #b9b9b9;grid-template-columns:repeat(2,1fr);width:200mm;margin:0 auto 8mm;display:grid}.card-print{color:#0b0b0b;aspect-ratio:105/148;text-align:center;break-inside:avoid;background:#fff;border-bottom:.3mm dashed #b9b9b9;border-right:.3mm dashed #b9b9b9;flex-direction:column;justify-content:center;align-items:center;gap:5mm;padding:10mm 8mm;display:flex}.sheet>.card-print:nth-child(2n){border-right:none}.sheet>.card-print:nth-last-child(-n+2){border-bottom:none}.sheet.small .card-print{aspect-ratio:105/59;gap:2.5mm;padding:5mm 6mm}.card-logo{width:52mm;height:auto}.sheet.small .card-logo{width:32mm}.card-line{letter-spacing:.2em;text-transform:uppercase;color:#5f5f5f;margin:0;font-size:9pt}.sheet.small .card-line{font-size:6.5pt}.card-qr{width:46mm}.sheet.small .card-qr{width:22mm}.card-qr svg{width:100%;height:auto;display:block}.card-code{font-family:var(--display);letter-spacing:.26em;text-indent:.26em;margin:0;font-size:32pt;line-height:1}.sheet.small .card-code{font-size:17pt}.card-site{letter-spacing:.06em;color:#5f5f5f;margin:0;font-size:8.5pt}.sheet.small .card-site{font-size:6pt}@media print{html,body{background:#fff}.no-print{display:none}.sheet{page-break-after:always;width:190mm;margin:0 auto}.sheet:last-of-type{page-break-after:auto}}@page{size:A4;margin:10mm}.steps{text-align:left;flex-direction:column;gap:12px;width:100%;max-width:300px;margin:6px 0 2px;padding:0;list-style:none;display:flex}.steps li{color:var(--text);align-items:center;gap:13px;font-size:15px;display:flex}.steps span{border:1px solid var(--line);width:27px;height:27px;font-family:var(--display);color:var(--text-2);border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:14px;display:flex}.howto{border:1px solid var(--line-soft);border-radius:var(--r);margin:16px 0 0;padding:12px 20px;display:inline-block}.howto-price{letter-spacing:.01em;color:var(--text);margin:0;font-size:19px;font-weight:600}.howto-hint{color:var(--text-3);margin:3px 0 0;font-size:13px}.keepsake{text-align:center;border-top:1px solid var(--line-soft);margin-top:8px;padding:40px 16px 24px}.keepsake-title{font-family:var(--display);letter-spacing:.02em;margin:6px 0 2px;font-size:24px}.keepsake-price{margin:0 0 10px;font-size:28px;font-weight:600}
