*{margin:0;padding:0}html,body{background:#1b1b1b;width:100%;max-width:100vw;height:100%;overflow:clip}#app,#app>div{max-width:100vw;max-height:100dvh;overflow:clip}.postcard{top:0;left:0;position:fixed!important}#app{cursor:grab;position:fixed;inset:0}#app.dragging{cursor:grabbing}#app.card-hidden{opacity:0;pointer-events:none}#app.reveal-fade{opacity:0}#app.reveal-fade.revealed{opacity:1;transition:opacity .35s ease-out}#grain{z-index:10;pointer-events:none;mix-blend-mode:overlay;opacity:.55;position:fixed;inset:0}body>.postcard{visibility:hidden}.postcard{backface-visibility:hidden;box-shadow:0 40px 80px #00000073,inset 0 0 2px #1b1b1b38}#share-btn{z-index:15;letter-spacing:-.19px;color:#fff;cursor:pointer;-webkit-font-smoothing:antialiased;background-color:#1546e3;background-image:linear-gradient(#0000,#00000014);border:none;border-radius:999px;align-items:center;gap:8px;padding:12px 22px 12px 18px;font-family:Camera Plain,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:18px;font-weight:700;line-height:1.5;display:inline-flex;position:fixed;top:24px;right:24px;box-shadow:0 2px 2px #2200981f,0 4px 4px #2200981f,inset 0 1px #f5f9ff29,inset 0 -1px #f5f9ff14,inset 0 .5px #ffffff14,inset 0 -.5px #00000029}#share-btn:hover{opacity:.85}#share-btn:active,#share-btn:focus-visible{opacity:1;text-shadow:0 -1px 1px #020f5066;background-image:linear-gradient(#00000014,#0000);box-shadow:0 1px 1px #2200981f,0 2px 2px #2200981f,inset 0 -1px #f5f9ff29,inset 0 1px #f5f9ff14,inset 0 -.5px #ffffff14,inset 0 .5px #00000029,inset 0 2px 6px #020f5059}#share-btn:disabled{opacity:.5;cursor:wait}#share-btn svg{flex:none;width:18px;height:18px}#theme-btn{z-index:15;box-sizing:border-box;color:#f7f4ed;cursor:pointer;background:#000000e0;border:none;border-radius:999px;justify-content:space-between;align-items:center;gap:6px;width:88px;height:50px;padding:0 13px;transition:opacity .15s;display:flex;position:fixed;top:24px;left:24px;overflow:hidden}#theme-btn:before{content:"";pointer-events:none;background:linear-gradient(#0000,#00000070);border-radius:999px;position:absolute;inset:0}#theme-btn .theme-knob{pointer-events:none;background:#f7f4ed24;border-radius:999px;width:40px;height:40px;transition:transform .22s cubic-bezier(.4,0,.2,1);position:absolute;top:5px;left:5px}#theme-btn.is-dark .theme-knob{transform:translate(38px)}#theme-btn .theme-ic{opacity:.4;flex:none;width:21px;height:21px;transition:opacity .2s;position:relative}#theme-btn .theme-ic--sun{opacity:1}#theme-btn.is-dark .theme-ic--sun{opacity:.4}#theme-btn.is-dark .theme-ic--moon{opacity:1}#theme-btn:hover{opacity:.82}#intro{z-index:20;box-sizing:border-box;color:#f7f4ed;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding-bottom:14vh;font-family:Camera Plain,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700;transition:opacity .5s;display:flex;position:fixed;inset:0}#intro.intro-done,#intro.intro-hidden{opacity:0;pointer-events:none}#intro.booting .intro-form,#intro.booting .intro-options,#intro.booting .intro-paginate{opacity:.45;pointer-events:none;animation:1.2s ease-in-out infinite intro-booting}@keyframes intro-booting{0%,to{opacity:.45}50%{opacity:.7}}.intro-paginate{align-items:center;display:flex}.intro-paginate i{box-sizing:content-box;cursor:pointer;background:#f7f4ed padding-box content-box;border-radius:999px;width:6px;height:6px;padding:5px;transition:width .2s;display:block}.intro-paginate i.current{width:12px}.intro-q{font-size:34px}.intro-options{gap:12px;margin-top:6px;display:flex}.intro-options[hidden]{display:none}.intro-options button{color:#f7f4ed;height:64px;font:inherit;cursor:pointer;background:#2e2d2a;border:none;border-radius:999px;padding:0 26px;font-size:19px;transition:background .15s}.intro-options button:hover{background:#3a3835}.intro-form{margin-top:6px;position:relative}.intro-form[hidden]{display:none}.intro-form input{color:#f7f4ed;width:440px;height:72px;font:inherit;box-sizing:border-box;background:#2e2d2a;border:none;border-radius:999px;outline:none;padding:0 120px 0 34px;font-size:22px}.intro-form input::placeholder{color:#6f6d68}.intro-count{color:#6f6d68;opacity:0;pointer-events:none;margin-top:8px;font-size:13px;transition:opacity .2s,color .2s;position:absolute;top:100%;right:12px}.intro-count.show{opacity:1}.intro-count.full{color:#f7f4ed}.intro-form button{color:#f7f4ed;font:inherit;cursor:pointer;background:#1b1b1b;border:none;border-radius:999px;padding:10px 22px;font-size:22px;transition:opacity .15s;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.intro-form button:hover{opacity:.8}.intro-form button.send{color:#fff;-webkit-font-smoothing:antialiased;background-color:#1546e3;background-image:linear-gradient(#0000,#00000014);box-shadow:0 2px 2px #2200981f,0 4px 4px #2200981f,inset 0 1px #f5f9ff29,inset 0 -1px #f5f9ff14,inset 0 .5px #ffffff14,inset 0 -.5px #00000029}.intro-form button.send:active,.intro-form button.send:focus-visible{opacity:1;text-shadow:0 -1px 1px #020f5066;background-image:linear-gradient(#00000014,#0000);box-shadow:0 1px 1px #2200981f,0 2px 2px #2200981f,inset 0 -1px #f5f9ff29,inset 0 1px #f5f9ff14,inset 0 -.5px #ffffff14,inset 0 .5px #00000029,inset 0 2px 6px #020f5059}#debug-panel{z-index:30;color:#f7f4ed;-webkit-user-select:none;user-select:none;background:#111110eb;border:1px solid #f7f4ed26;border-radius:10px;width:250px;padding:14px 16px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;line-height:1.5;position:fixed;top:16px;right:16px}#debug-panel h2{text-transform:uppercase;letter-spacing:.1em;opacity:.6;margin-bottom:10px;font-size:11px}#debug-panel label{justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;display:flex}#debug-panel label span{flex:none;width:72px}#debug-panel input[type=range]{accent-color:#ffa517;flex:1}#debug-panel .stamp-row{gap:6px;margin:8px 0 10px;display:flex}#debug-panel .stamp-row button{color:inherit;font:inherit;cursor:pointer;background:#f7f4ed1a;border:1px solid #f7f4ed33;border-radius:6px;flex:1;padding:4px 0}#debug-panel .stamp-row button:hover{background:#f7f4ed33}#debug-panel .hint{opacity:.55}#debug-panel h2{margin-top:12px}#debug-panel .light-box{border-top:1px solid #f7f4ed1a;padding:6px 0}#debug-panel .light-title{opacity:.75;margin-bottom:4px}#debug-panel input[type=color]{cursor:pointer;background:0 0;border:1px solid #f7f4ed40;border-radius:4px;width:26px;height:18px;padding:0}.editable-active{outline-offset:3px;cursor:text;outline:1px dashed #3466d3a6}.intro-form--pick{align-items:center;gap:12px;display:flex}.intro-form--pick[hidden]{display:none}.intro-form--pick button[type=submit]{background:#2e2d2a;height:72px;padding:0 30px;position:static;transform:none}.pick{box-sizing:border-box;background:#2e2d2a;border-radius:999px;flex:none;align-items:center;gap:14px;height:72px;padding:0 22px 0 26px;display:flex}.pick.nudge{animation:.3s pick-nudge}@keyframes pick-nudge{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.intro-form .pick-num{color:#f7f4ed;width:34px;font:inherit;text-align:center;font-variant-numeric:tabular-nums;caret-color:#f7f4ed;background:0 0;border:none;outline:none;padding:0;font-size:22px;line-height:1}.intro-form .pick-num::placeholder{color:#6f6d68;opacity:1}.intro-form .pick-num--3{width:50px}.intro-form .pick-num:focus,.intro-form .pick-num:focus-visible{box-shadow:none;outline:none}.intro-form .pick-num::selection{color:#f7f4ed;background:#f7f4ed2e}.pick-select{position:relative}.intro-form .pick-unit{color:#f7f4ed;height:auto;font:inherit;cursor:pointer;background:0 0;border:none;border-radius:0;outline:none;align-items:center;gap:8px;padding:0;font-size:22px;display:flex;position:static;transform:none}.pick-chev{opacity:.7;width:12px;height:12px;transition:transform .18s}.pick-select.open .pick-chev{transform:rotate(180deg)}.pick-menu{z-index:5;background:#2e2d2a;border:1px solid #f7f4ed1a;border-radius:12px;min-width:calc(100% + 24px);margin:0;padding:4px;list-style:none;position:absolute;top:calc(100% + 8px);left:0;box-shadow:0 8px 20px #00000038}.pick-menu[hidden]{display:none}.pick-menu li{color:#f7f4ed;white-space:nowrap;cursor:pointer;border-radius:8px;padding:9px 12px;font-size:18px;transition:background .12s}.pick-menu li[aria-selected=true]{background:#f7f4ed24}.pick-menu li:hover{background:#f7f4ed14}.intro-form .pick-unit--static{cursor:default;color:#6f6d68}#app,#draw-canvas{touch-action:none}html,body{overscroll-behavior:none}@media (width<=640px){#intro{gap:14px;padding:0 20px 16vh}.intro-q{text-align:center;text-wrap:balance;font-size:clamp(22px,6.4vw,28px)}.intro-form{width:100%}.intro-form input{width:100%;height:60px;padding:0 104px 0 24px;font-size:19px}.intro-form button{min-height:44px;font-size:19px}.intro-options button{height:56px;min-height:44px;font-size:18px}.intro-form--pick{flex-direction:column;align-items:stretch;gap:14px;width:100%}.pick{justify-content:center;height:60px;padding:0 22px}.intro-form--pick button[type=submit]{width:100%;height:56px;min-height:44px;padding:0}.pick-menu li{box-sizing:border-box;align-items:center;min-height:44px;padding:12px 14px;display:flex}#share-btn{min-height:44px;top:16px;right:16px}#theme-btn{top:16px;left:16px}}#flip-btn{z-index:15;color:#f7f4ed;cursor:pointer;background:#000000e0;border:none;border-radius:999px;align-items:center;gap:8px;min-height:44px;padding:0 18px;font-family:Camera Plain,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:16px;font-weight:700;display:flex;position:fixed;bottom:24px;right:24px}#flip-btn svg{flex:none;width:19px;height:19px;transition:transform .3s cubic-bezier(.4,0,.2,1)}#flip-btn.is-flipped svg{transform:rotate(180deg)}
