:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#04050c;--ink:#ece8f6;--ink-2:#b6b4cc;--ink-3:#82819c;--line:#ffffff17;--glass:#0e0f1eb8;--glass-strong:#101122e6;--gold:#f3cf8b;--rose:#ff9dba;--danger:#ff8a8a;--radius:14px;--sans:-apple-system, "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", system-ui, sans-serif;--serif:"Songti SC", "Noto Serif SC", "Source Han Serif SC", "STSong", serif;--safe-t:env(safe-area-inset-top,0px);--safe-r:env(safe-area-inset-right,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px)}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font:15px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overscroll-behavior:none;margin:0;overflow:hidden}#app{position:fixed;inset:0}.stage{touch-action:none;position:absolute;inset:0}.stage canvas{outline:none;width:100%;height:100%;display:block}.labels,.overlay,.toasts{pointer-events:none;position:absolute;inset:0}.overlay>*,.toasts>*{pointer-events:auto}.label{white-space:nowrap;font:12px/1 var(--sans);letter-spacing:.12em;color:#c6cdff9e;text-shadow:0 0 12px #04050ce6;will-change:transform, opacity;position:absolute;top:0;left:0}.label-since{color:#ffd6a0d1}.btn{appearance:none;border:1px solid var(--line);min-height:36px;color:var(--ink);font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(12px);background:#ffffff0d;border-radius:999px;justify-content:center;align-items:center;gap:6px;padding:0 14px;font-size:14px;transition:background .2s,border-color .2s,opacity .2s;display:inline-flex}.btn:hover{background:#ffffff1a}.btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.btn:disabled{opacity:.45;cursor:default}.btn-primary{background:linear-gradient(135deg,#f3cf8b47,#ff9dba38);border-color:#f3cf8b80}.btn-primary:hover{background:linear-gradient(135deg,#f3cf8b66,#ff9dba52)}.btn-ghost{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border-color:#0000}.btn-block{width:100%;min-height:44px}.hud{top:calc(14px + var(--safe-t));left:calc(16px + var(--safe-l));right:calc(16px + var(--safe-r));pointer-events:none;justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute}.hud>*{pointer-events:auto}.hud-name-row{align-items:center;gap:10px;display:flex}.hud-name{font:500 22px/1.25 var(--serif);letter-spacing:.08em;text-shadow:0 0 18px #ffd2a040;margin:0}.hud-sub{color:var(--ink-2);letter-spacing:.04em;margin:4px 0 0;font-size:13px}.hud-conn{background:#7be3a6;border-radius:50%;width:7px;height:7px;box-shadow:0 0 8px #7be3a6}.hud-conn[data-state=retrying]{background:#f1b26a;animation:1.2s infinite blink;box-shadow:0 0 8px #f1b26a}@keyframes blink{50%{opacity:.3}}.hud-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.hud-stats{left:calc(16px + var(--safe-l));bottom:calc(12px + var(--safe-b));color:var(--ink-3);margin:0;font:12px/1.4 ui-monospace,SF Mono,Menlo,monospace;position:absolute;pointer-events:none!important}.hud-hint{right:calc(16px + var(--safe-r));bottom:calc(12px + var(--safe-b));color:var(--ink-3);letter-spacing:.06em;margin:0;font-size:12px;position:absolute;pointer-events:none!important}.panel{top:calc(84px + var(--safe-t));right:calc(16px + var(--safe-r));width:min(380px,100vw - 32px);max-height:calc(100% - 84px - 52px - var(--safe-t) - var(--safe-b));border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(18px)saturate(1.2);border-radius:18px;flex-direction:column;animation:.35s ease-out rise;display:flex;position:absolute;overflow:auto;box-shadow:0 20px 60px #00000073}.panel[hidden]{display:none}@keyframes rise{0%{opacity:0;transform:translateY(10px)}}.panel-close{z-index:1;width:32px;height:32px;color:var(--ink);cursor:pointer;background:#04050c8c;border:0;border-radius:50%;font-size:20px;line-height:1;position:absolute;top:8px;right:8px}.panel-photo{background:#0b0d1a;border-radius:18px 18px 0 0;flex-shrink:0;margin:0;position:relative;overflow:hidden}.panel-photo img{object-fit:cover;width:100%;height:100%;display:block}.panel-note{color:var(--ink-2);background:linear-gradient(#0000,#04050cd9);padding:10px 14px;font-size:12px;position:absolute;bottom:0;left:0;right:0}.panel-body{padding:14px 18px 4px}.panel-date{letter-spacing:.08em;color:var(--gold);margin:0;font-size:12px}.panel-title{font:500 20px/1.35 var(--serif);letter-spacing:.04em;margin:6px 0 0}.panel-place,.panel-by{color:var(--ink-2);margin:6px 0 0;font-size:13px}.panel-story{white-space:pre-wrap;font:15px/1.8 var(--serif);color:var(--ink);margin:10px 0 0}.panel-by{color:var(--ink-3)}.panel-nav{justify-content:space-between;align-items:center;padding:6px 8px 10px;display:flex}.panel-count{color:var(--ink-3);font-variant-numeric:tabular-nums;font-size:12px}.screen{padding:calc(24px + var(--safe-t)) 16px calc(24px + var(--safe-b));background:radial-gradient(ellipse at 50% 40%, #3c326e59, transparent 60%), var(--bg);place-items:center;display:grid;position:absolute;inset:0;overflow:auto}.card{border:1px solid var(--line);background:var(--glass-strong);border-radius:20px;width:min(420px,100%);padding:28px 24px 24px;box-shadow:0 30px 80px #00000080}.card-title{font:500 24px/1.3 var(--serif);letter-spacing:.08em;margin:0 0 6px}.card-text{color:var(--ink-2);margin:0 0 18px}.card-quiet{color:var(--ink-3);text-align:center;margin:14px 0 0;font-size:13px}.form{flex-direction:column;display:flex}.field{flex-direction:column;gap:6px;margin-bottom:14px;display:flex}.field-label{color:var(--ink-2);font-size:13px}.field-hint{color:var(--ink-3);font-size:12px}input{border:1px solid var(--line);width:100%;min-height:42px;color:var(--ink);font:inherit;background:#ffffff0a;border-radius:10px;padding:8px 12px;font-size:16px}input:focus{background:#ffffff12;border-color:#f3cf8b99;outline:none}input::-webkit-calendar-picker-indicator{filter:invert(.85)}.form-error{min-height:1.2em;color:var(--danger);margin:0 0 10px;font-size:13px}.form-error:empty{margin:0}.toasts{padding-top:calc(76px + var(--safe-t));flex-direction:column;align-items:center;gap:8px;display:flex}.toast{border:1px solid var(--line);background:var(--glass-strong);-webkit-backdrop-filter:blur(16px);border-radius:999px;align-items:center;gap:12px;max-width:min(520px,100vw - 32px);padding:10px 12px 10px 16px;font-size:14px;transition:opacity .3s,transform .3s;animation:.3s ease-out rise;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 30px #0006}.toast-out{opacity:0;transform:translateY(-6px)}.toast-action{color:var(--gold);font:inherit;cursor:pointer;background:#f3cf8b33;border:0;border-radius:999px;flex-shrink:0;padding:4px 12px;font-size:13px}.toast-bar{background:linear-gradient(90deg, var(--gold), var(--rose));transform-origin:0;width:100%;height:2px;transition:transform .2s;position:absolute;bottom:0;left:0;transform:scaleX(0)}.dialog{border:1px solid var(--line);background:var(--glass-strong);width:min(440px,100vw - 32px);color:var(--ink);border-radius:20px;padding:24px;box-shadow:0 30px 80px #0009}.dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#02030899}.dialog-title{font:500 20px/1.35 var(--serif);letter-spacing:.06em;margin:0 0 8px}.dialog-actions{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.invite-code{letter-spacing:.18em;color:var(--gold);text-align:center;margin:14px 0 0;font:600 22px/1 ui-monospace,SF Mono,Menlo,monospace}@media (max-width:640px){.hud{flex-direction:column;align-items:stretch}.hud-name{font-size:19px}.hud-actions{justify-content:flex-start}.hud-hint{display:none}.panel{top:auto;right:calc(8px + var(--safe-r));left:calc(8px + var(--safe-l));bottom:calc(8px + var(--safe-b));width:auto;max-height:62%}.panel-photo{max-height:34vh}.toasts{padding-top:calc(118px + var(--safe-t))}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.intro{z-index:5;padding:0 16px calc(8vh + var(--safe-b));pointer-events:none;text-align:center;place-items:end center;transition:opacity 1.2s;display:grid;position:absolute;inset:0}.intro.intro-done{opacity:0}.intro-in{flex-direction:column;align-items:center;gap:12px;display:flex}.intro-in p{margin:0}.intro-title{font:400 clamp(30px, 6vw, 56px) / 1.1 var(--serif);letter-spacing:.3em;text-shadow:0 0 40px #f2a7bd66;animation:4s ease-in-out infinite breathe;margin-left:.3em!important}.intro-sub{letter-spacing:.36em;color:var(--ink-2);font-size:14px;margin-left:.36em!important}.intro-tap{background:var(--glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:var(--rose);font:inherit;letter-spacing:.26em;cursor:pointer;pointer-events:auto;will-change:transform;border:1px solid #ff9dba73;border-radius:999px;margin-top:16px;padding:11px 22px;font-size:13px}.intro-skip{right:calc(22px + var(--safe-r));bottom:calc(22px + var(--safe-b));color:var(--ink-3);font:inherit;letter-spacing:.2em;cursor:pointer;pointer-events:auto;background:0 0;border:0;border-radius:999px;padding:6px 12px;font-size:12px;position:absolute}.intro-skip:hover{color:var(--ink-2)}.intro-tap:focus-visible,.intro-skip:focus-visible{outline:2px solid var(--rose);outline-offset:3px}@keyframes breathe{50%{opacity:.78}}.hud,.hud-stats,.hud-hint{transition:opacity 1.2s}.intro-on .hud,.intro-on .hud-stats,.intro-on .hud-hint{opacity:0}.intro-on .hud,.intro-on .hud *{pointer-events:none!important}