:root{--night:#0b1424;--night-2:#13213a;--snow:#f4f7fb;--gold:#f2c14e;--holly:#c8102e;--accent:#c8102e;--accent-ink:#fff;--ink-soft:#f4f7fbbd;--glass:#0b1424b8;--glass-edge:#f4f7fb24;--paper:#fbf7ee;--paper-ink:#2a2118;--paper-soft:#6f6253;--display:"Fraunces Variable", "Fraunces", Georgia, "Times New Roman", serif;--body:"Nunito Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--night);height:100%;color:var(--snow);font-family:var(--body);margin:0;overflow:hidden}button{font:inherit}[hidden]{display:none!important}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}#scene{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}.hud{top:calc(env(safe-area-inset-top,0px) + 16px);pointer-events:none;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:fixed;left:16px;right:16px}.hud-title{text-shadow:0 1px 10px #0009;min-width:0}.hud h1{font-family:var(--display);letter-spacing:.005em;margin:0;font-size:clamp(20px,3.4vw,32px);font-weight:700}.counter{color:var(--ink-soft);font-variant-numeric:tabular-nums;margin:4px 0 0;font-size:14px}.tools{pointer-events:auto}.search{width:min(280px,100vw - 32px);position:relative}.search input{border:1px solid var(--glass-edge);background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);width:100%;color:var(--snow);font:15px var(--body);border-radius:999px;padding:10px 14px}.search input::placeholder{color:var(--ink-soft)}.search input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.search-results{background:var(--glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-edge);border-radius:14px;max-height:50vh;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow-y:auto}.search-results li{cursor:pointer;border-radius:10px;gap:2px;padding:8px 10px;display:grid}.search-results li:hover,.search-results li[aria-selected=true]{background:#f4f7fb1f}.search-results li span{color:var(--ink-soft);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.search-results .search-empty{color:var(--ink-soft);cursor:default}.hover-label{background:var(--glass);border:1px solid var(--glass-edge);pointer-events:none;white-space:nowrap;border-radius:999px;padding:5px 10px;font-size:13px;font-weight:600;position:fixed;top:0;left:0}.card{left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 20px);background:var(--paper);width:min(460px,100vw - 32px);color:var(--paper-ink);box-shadow:0 18px 50px #00000073, inset 0 0 0 1px #c9a24a8c, inset 0 0 0 6px var(--paper), inset 0 0 0 7px #c9a24a59;border-radius:18px;gap:8px;padding:22px 24px 18px;display:grid;position:fixed;transform:translate(-50%)}.card-in{animation:.45s cubic-bezier(.2,.8,.2,1) card-in}@keyframes card-in{0%{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%)}}.card-close{width:44px;height:44px;color:var(--paper-soft);cursor:pointer;background:0 0;border:0;border-radius:50%;font-size:24px;line-height:1;position:absolute;top:8px;right:10px}.card-close:hover{background:#2a21180f}.card-meta{color:var(--paper-soft);letter-spacing:.02em;align-items:center;gap:8px;font-size:13px;display:flex}.swatch{border-radius:50%;width:12px;height:12px;box-shadow:inset 0 0 0 1px #0003}.card-name{font-family:var(--display);text-wrap:balance;overflow-wrap:anywhere;margin:0;font-size:28px;font-weight:700;line-height:1.1}.card-message{overflow-wrap:anywhere;margin:0;font-size:17px;line-height:1.5}.card-status{color:#34507a;background:#eef3fb;border-radius:10px;margin:0;padding:8px 10px;font-size:13px}.card-actions{flex-wrap:wrap;gap:8px;margin-top:6px;display:flex}.btn{color:var(--paper-ink);cursor:pointer;background:0 0;border:1px solid #2a21182e;border-radius:999px;padding:9px 14px;font-size:14px;font-weight:600}.btn:hover{background:#2a21180f}.btn:focus-visible,.card-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.toasts{left:50%;top:calc(env(safe-area-inset-top,0px) + 84px);pointer-events:none;justify-items:center;gap:8px;width:min(480px,100vw - 32px);display:grid;position:fixed;transform:translate(-50%)}.toast{background:var(--glass);border:1px solid var(--glass-edge);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);text-align:center;overflow-wrap:anywhere;border-radius:999px;padding:10px 16px;font-size:14px;transition:opacity .4s}.toast-out{opacity:0}.loading{background:var(--night);color:var(--ink-soft);font-family:var(--display);place-items:center;font-size:18px;transition:opacity .6s;display:grid;position:fixed;inset:0}.loading.done{opacity:0;pointer-events:none}.debug{left:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:10px;gap:8px;min-width:220px;padding:12px 14px;font-size:13px;display:grid;position:fixed}.debug label{gap:4px;display:grid}.debug output{font-variant-numeric:tabular-nums;color:var(--gold)}.debug .row{align-items:center;gap:8px;display:flex}@media (prefers-reduced-motion:reduce){.card-in{animation:none}}.hang-button{left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 24px);background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 88%, #fff), color-mix(in srgb, var(--accent) 80%, #000));color:var(--accent-ink);font:700 17px var(--body);letter-spacing:.01em;box-shadow:0 10px 30px color-mix(in srgb, var(--accent) 45%, transparent), inset 0 1px 0 #ffffff40;cursor:pointer;border:0;border-radius:999px;max-width:calc(100vw - 32px);padding:15px 28px;position:fixed;transform:translate(-50%)}.hang-button:hover{filter:brightness(1.08)}.hang-button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.hang-button:disabled{background:var(--glass);box-shadow:none;cursor:default;font-weight:600}.sheet-backdrop{z-index:10;background:#050a1473;place-items:end center;display:grid;position:fixed;inset:0}@media (min-width:720px){.sheet-backdrop{place-items:center}}.sheet{width:min(620px,100vw);max-height:min(92dvh,860px);padding:24px 22px calc(env(safe-area-inset-bottom,0px) + 22px);background:var(--paper);color:var(--paper-ink);border-radius:22px 22px 0 0;animation:.35s cubic-bezier(.2,.8,.2,1) sheet-in;position:relative;overflow-y:auto;box-shadow:0 -10px 40px #00000059}@media (min-width:720px){.sheet{border-radius:22px;padding-bottom:24px}}@keyframes sheet-in{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.sheet h2{font-family:var(--display);margin:0 0 14px;font-size:26px}.sheet-close{width:40px;height:40px;color:var(--paper-soft);cursor:pointer;background:0 0;border:0;border-radius:50%;font-size:26px;position:absolute;top:12px;right:12px}.sheet form{gap:16px;display:grid}.sheet fieldset{border:0;min-width:0;margin:0;padding:0}.sheet legend{margin-bottom:8px;padding:0;font-size:14px;font-weight:700}.hang-top{grid-template-columns:150px 1fr;align-items:start;gap:14px;display:grid}@media (max-width:460px){.hang-top{grid-template-columns:1fr}.hang-preview{justify-self:center}}.hang-preview{background:radial-gradient(circle at 50% 40%,#1d3354,#0b1424 75%);border-radius:16px;width:150px;height:150px}.type-grid{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px;display:grid}.type-opt,.swatch-opt{cursor:pointer;position:relative}.type-opt input,.swatch-opt input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.type-opt span{text-align:center;border:1px solid #2a211829;border-radius:10px;padding:8px 10px;font-size:14px;display:block}.type-opt input:checked+span{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, #fff);font-weight:700}.type-opt input:focus-visible+span,.swatch-opt input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}.swatches{flex-wrap:wrap;gap:8px;display:flex}.swatch-opt>span{background:var(--c);border-radius:50%;width:36px;height:36px;display:block;box-shadow:inset 0 0 0 1px #0003}.swatch-opt input:checked+span{box-shadow:0 0 0 3px var(--paper), 0 0 0 5px var(--paper-ink)}.field{gap:6px;display:grid}.field-label{justify-content:space-between;font-size:14px;font-weight:700;display:flex}.count{color:var(--paper-soft);font-variant-numeric:tabular-nums;font-weight:400}.field input,.field textarea{width:100%;color:var(--paper-ink);font:16px var(--body);resize:vertical;background:#fff;border:1px solid #2a211840;border-radius:10px;padding:11px 12px}.field input:focus-visible,.field textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.field [aria-invalid=true]{border-color:var(--holly)}.field-error{color:var(--holly);min-height:0;font-size:13px}.field-error:empty{display:none}.privacy{color:var(--paper-soft);margin:0;font-size:13px;line-height:1.45}.form-error{color:#8a1020;background:#fdecee;border-radius:10px;margin:0;padding:10px 12px;font-size:14px}.btn-primary{background:linear-gradient(180deg, color-mix(in srgb, var(--accent) 88%, #fff), color-mix(in srgb, var(--accent) 80%, #000));color:var(--accent-ink);font:700 17px var(--body);cursor:pointer;border:0;border-radius:999px;padding:14px 20px}.btn-primary:disabled{opacity:.7;cursor:progress}.btn-primary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}@media (prefers-reduced-motion:reduce){.sheet{animation:none}}.tools{flex-wrap:wrap;justify-content:flex-end;align-items:flex-start;gap:8px;display:flex}.play-button{background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--gold);font:700 15px var(--body);cursor:pointer;white-space:nowrap;border:1px solid #f2c14e8c;border-radius:999px;padding:10px 16px}.play-button:hover{background:#f2c14e24}.play-button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}body.playing .hang-button,body.playing .search,body.playing .play-button,body.playing .card,body.playing .hover-label,body.playing .debug{display:none!important}body.playing:after{content:"";pointer-events:none;background:radial-gradient(at 50% 45%,#0000 45%,#0308128c 100%);position:fixed;inset:0}.play-card{left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 92px);width:min(640px,100vw - 32px);color:var(--paper-ink);z-index:5;background:#fbf7eef5;border-radius:20px;gap:6px;padding:20px 26px 16px;display:grid;position:fixed;transform:translate(-50%);box-shadow:0 20px 60px #00000080,inset 0 0 0 1px #c9a24a99,inset 0 0 0 6px #fbf7eef5,inset 0 0 0 7px #c9a24a59}.play-card-in{animation:.6s cubic-bezier(.2,.8,.2,1) play-in}.play-card-out{animation:.35s forwards play-out}@keyframes play-in{0%{opacity:0;transform:translate(-50%,24px)scale(.97)}to{opacity:1;transform:translate(-50%)scale(1)}}@keyframes play-out{to{opacity:0;transform:translate(-50%,12px)}}.play-badge{background:var(--accent);color:var(--accent-ink);border-radius:999px;justify-self:start;margin:0;padding:3px 10px;font-size:13px;font-weight:700}.play-name{font-family:var(--display);text-wrap:balance;overflow-wrap:anywhere;margin:0;font-size:clamp(28px,4.4vw,40px);line-height:1.05}.play-message{overflow-wrap:anywhere;min-height:2.9em;margin:0;font-size:clamp(17px,2.2vw,21px);line-height:1.45}.play-meta{color:var(--paper-soft);font-variant-numeric:tabular-nums;justify-content:space-between;gap:12px;margin:4px 0 0;font-size:13px;display:flex}.play-bar{left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 20px);background:var(--glass);border:1px solid var(--glass-edge);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:6;border-radius:999px;align-items:center;gap:4px;max-width:calc(100vw - 24px);padding:6px;display:flex;position:fixed;overflow-x:auto;transform:translate(-50%)}.play-bar button,.play-bar select{min-width:44px;height:44px;color:var(--snow);font:600 16px var(--body);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:0 12px}.play-bar select{background:#f4f7fb14;font-size:14px}.play-bar button:hover{background:#f4f7fb1a}.play-bar button:focus-visible,.play-bar select:focus-visible{outline:2px solid var(--gold);outline-offset:1px}.play-bar .play-text{font-size:14px}.play-bar .off{opacity:.45;text-decoration:line-through}.banner{left:50%;top:calc(env(safe-area-inset-top,0px) + 96px);color:#3a2a08;width:max-content;max-width:calc(100vw - 32px);font:700 clamp(16px, 2.4vw, 22px) var(--display);text-align:center;z-index:7;background:linear-gradient(#f6d27a,#d9a93a);border-radius:16px;padding:14px 22px;position:fixed;transform:translate(-50%);box-shadow:0 16px 40px #0006}.banner-in{animation:6s forwards banner}@keyframes banner{0%{opacity:0;transform:translate(-50%,-12px)scale(.9)}8%{opacity:1;transform:translate(-50%)scale(1.03)}12%{transform:translate(-50%)scale(1)}88%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.play-card-in,.play-card-out,.banner-in{animation:none}}.privacy-link{right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);color:var(--ink-soft);text-shadow:0 1px 6px #0009;font-size:12px;text-decoration:none;position:fixed}.privacy-link:hover,.privacy-link:focus-visible{color:var(--snow);text-decoration:underline}.privacy a{color:var(--holly)}body.playing .privacy-link{display:none}body.capture .hud,body.capture .hang-button,body.capture .privacy-link,body.capture .play-bar,body.capture .toasts,body.capture .card,body.capture .hover-label,body.capture .debug{display:none!important}body.capture.capture-title .hud{display:flex!important}body.capture.capture-title .tools,body.capture.capture-title .counter,body.capture.playing:after{display:none}.gate{z-index:20;background:radial-gradient(circle at 50% 40%,#1d3354eb,#0b1424f7 70%);place-items:center;padding:16px;display:grid;position:fixed;inset:0}.gate-card{background:var(--paper);width:min(440px,100%);color:var(--paper-ink);text-align:center;border-radius:20px;gap:10px;padding:28px 26px 24px;display:grid;box-shadow:0 20px 60px #00000073}.gate-card h1{font:700 28px/1.15 var(--display);text-wrap:balance;margin:0}.gate-card p{margin:0}.gate-icon{font-size:44px}.gate-form{gap:10px;margin-top:6px;display:grid}.gate-form input{color:var(--paper-ink);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font:17px var(--body);text-align:center;background:#fff;border:1px solid #2a211840;border-radius:12px;padding:12px 14px}.gate-form input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.gate-error{color:var(--holly);min-height:1.2em;font-size:14px}.gate-link{color:var(--accent);margin-top:4px;font-weight:700}.hud-logo{object-fit:contain;filter:drop-shadow(0 2px 8px #00000073);max-width:min(200px,40vw);max-height:52px;margin-bottom:8px;display:block}.made-with{left:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 12px);color:var(--ink-soft);text-shadow:0 1px 6px #0009;font-size:12px;text-decoration:none;position:fixed}.made-with:hover,.made-with:focus-visible{color:var(--snow);text-decoration:underline}body.playing .made-with{display:none}@media (max-width:520px){.made-with{bottom:calc(env(safe-area-inset-bottom,0px) + 84px)}}.welcome-card{gap:10px}.welcome-card .card-name{padding-right:0}.welcome-card .card-message{white-space:pre-wrap}.welcome-card .btn-primary{padding:12px 20px;font-size:16px}body.capture .made-with,body.capture .welcome-card{display:none!important}.card-report{color:var(--paper-soft);font:600 13px var(--body);text-underline-offset:2px;cursor:pointer;background:0 0;border:0;align-self:center;margin-left:auto;padding:8px 4px;text-decoration:underline}.card-report:hover,.card-report:focus-visible{color:var(--paper-ink)}.card-report-form{gap:10px;display:grid}.card-report-form fieldset{border:0;min-width:0;margin:0;padding:0}.card-report-form legend{margin-bottom:8px;padding:0;font-weight:700}.card-report-reasons{gap:6px;font-size:15px;display:grid}.card-report-reasons label{cursor:pointer;align-items:center;gap:8px;display:flex}.card-report-reasons input{width:18px;height:18px;accent-color:var(--accent);margin:0}.btn-primary.btn-small{padding:9px 18px;font-size:14px}
