@import"https://fonts.googleapis.com/css2?family=Great+Vibes&family=Dancing+Script:wght@400;600&family=Playfair+Display:ital,wght@0,400;0,600;1,400&display=swap";:root{--cream: #fdf3f5;--cream-deep: #f2dde3;--gold: #d9a441;--gold-light: #f2d79a;--gold-deep: #936a24;--rose: #e0778f;--rose-deep: #8e2b3f;--wine: #6e1a28;--ink: #46202c;--ink-soft: #8a5a68;--shadow-lg: 0 24px 60px rgba(62, 12, 28, .32);--shadow-md: 0 12px 32px rgba(62, 12, 28, .24);--font-serif: "Times New Roman", Georgia, "Songti SC", "SimSun", serif;--font-sans: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:#14101a;color:var(--ink);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}#app{position:fixed;inset:0}#scene{position:absolute;inset:0;width:100%;height:100%;display:block}button{font-family:inherit;cursor:pointer}input,textarea{font-family:inherit}.loader{position:absolute;inset:0;z-index:90;display:grid;place-items:center;background:radial-gradient(circle at 50% 42%,#2a2135,#140f1c 55%,#0b0812);transition:opacity .8s ease,visibility .8s ease}.loader.is-done{opacity:0;visibility:hidden;pointer-events:none}.loader-card{width:min(360px,82vw);text-align:center}.loader-mark{font-size:34px;color:var(--gold-light);text-shadow:0 0 26px rgba(240,220,174,.55);animation:pulse 2.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.75;transform:translateY(0)}50%{opacity:1;transform:translateY(-5px)}}.loader-title{margin:10px 0 4px;font-family:var(--font-serif);font-size:30px;font-weight:400;letter-spacing:2px;color:var(--gold-light)}.loader-sub{margin:0 0 22px;font-size:13px;color:#f6efe19e;letter-spacing:1px}.loader-bar{height:3px;border-radius:3px;background:#f6efe124;overflow:hidden}.loader-bar i{display:block;height:100%;width:0%;border-radius:3px;background:linear-gradient(90deg,var(--gold-deep),var(--gold-light));transition:width .28s cubic-bezier(.22,.8,.3,1)}.loader-pct{margin:12px 0 0;font-family:var(--font-serif);font-size:13px;color:#f6efe180;letter-spacing:2px}.loader-pct em{font-style:normal;font-size:10px;opacity:.6}.hud-top{position:absolute;top:calc(16px + var(--safe-t));left:18px;right:18px;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none;transition:opacity .45s ease,transform .45s ease,padding-right .45s ease}.hud-top>*{pointer-events:auto}.brand{display:inline-flex;align-items:center;gap:9px;padding:9px 20px 9px 16px;border-radius:999px;background:#faf4e8e6;backdrop-filter:blur(10px);box-shadow:var(--shadow-md);border:1px solid rgba(201,161,94,.32)}.brand-mark{color:var(--gold);font-size:15px}.brand-text{font-family:var(--font-serif);font-size:19px;letter-spacing:.6px;color:#4b3418}.brand-sub{padding-left:9px;margin-left:2px;border-left:1px solid rgba(201,161,94,.42);font-size:11.5px;letter-spacing:1.2px;color:#4b34189e;white-space:nowrap}.top-actions{display:flex;gap:8px}.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:999px;border:1px solid transparent;font-size:13.5px;line-height:1;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,opacity .18s}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn-ghost{background:#faf4e8eb;color:#4b3418;border-color:#c9a15e4d;box-shadow:var(--shadow-md);backdrop-filter:blur(10px)}.btn-ghost:hover{box-shadow:0 14px 36px #3a240e42}.btn-ghost.is-on{background:linear-gradient(135deg,#fff0d2e6,#ffdeafd1);border-color:#c9a15e9e;color:#5a421c}.btn-dark{background:linear-gradient(135deg,#fff0d238,#ffdcb421),linear-gradient(180deg,#2c1b0b80,#1a0f0599);color:#fff6e8f0;border-color:#ffd7a04d;backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);box-shadow:0 8px 24px #8c5a1e2e,inset 0 1px #ffffff29;text-shadow:0 1px 2px rgba(34,16,2,.45)}.btn-dark:hover{background:linear-gradient(135deg,#fff0d24d,#ffdcb433),linear-gradient(180deg,#301e0c8f,#1e1206a8);border-color:#ffd7a073}.btn-primary{background:linear-gradient(135deg,var(--gold-deep),var(--gold));color:#fff8ea;box-shadow:0 10px 26px #8e6a2e61}.btn-primary:hover{box-shadow:0 14px 32px #8e6a2e75}.btn .ico{font-size:13px;opacity:.85}.btn-pure{position:absolute;right:70px;bottom:calc(22px + var(--safe-b));z-index:20;background:#faf4e8db;color:#5a421c;border-color:#c9a15e4d;box-shadow:var(--shadow-md);backdrop-filter:blur(10px);transition:opacity .45s ease,transform .45s ease}.btn-pure:hover{transform:translateY(-1px)}.btn-pure.is-on{background:#c9a15eeb;color:#fff6e6}.btn-pure{white-space:nowrap}body.is-pure .hud-top{opacity:0;pointer-events:none;transform:translateY(8px)}body.is-pure .btn-pure{opacity:1;pointer-events:auto;transform:translateY(0);background:#c9a15eeb;color:#fff6e6;border-color:#ffe2b473;box-shadow:0 8px 26px #5a3c1452}body.is-pure .btn-pure:hover{transform:translateY(-1px)}.bgm-btn{position:absolute;right:18px;bottom:calc(22px + var(--safe-b));z-index:46;width:42px;height:42px;padding:0;border-radius:50%;border:1px solid rgba(201,161,94,.34);background:#faf4e8e6;color:#5a421c;font-size:17px;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-md);backdrop-filter:blur(10px);transition:transform .18s ease,background .18s ease,border-color .18s ease}.bgm-btn:hover{transform:translateY(-2px);background:#fffbf2f5}.bgm-btn.is-muted{background:#c9a15e2e;color:#8a6a32;border-color:#c9a15e85}.bgm-btn .ico{font-size:17px}body.is-pure .bgm-btn{opacity:1;pointer-events:auto}.card-overlay{position:absolute;inset:0;z-index:40;overflow:hidden;background:radial-gradient(circle at 50% 44%,#2a1a2e,#1a1020 72%);opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s ease}.card-overlay.is-open{opacity:1;visibility:visible}.card-scene{position:absolute;inset:0;overflow:hidden;--env-drop: 80px}.card-bloom{position:absolute;border-radius:50%;background:#ffb6c1;opacity:.15;filter:blur(70px);pointer-events:none}.card-bloom-a{width:360px;height:360px;left:5%;top:3%}.card-bloom-b{width:300px;height:300px;right:1%;bottom:9%}.card-bloom-c{width:230px;height:230px;left:37%;top:49%}.card-motes{position:absolute;inset:0;opacity:0;transition:opacity 1.4s ease .5s;pointer-events:none}.card-scene.is-letter .card-motes{opacity:1}.card-mote{position:absolute;display:block;line-height:1;color:#ffb6c1;opacity:0;animation:card-mote-drift linear infinite;will-change:transform,opacity}.card-mote-petal{width:7px;height:10px;border-radius:60% 0;background:linear-gradient(140deg,#ffb6c1d9,#e2607f8c)}@keyframes card-mote-drift{0%{transform:translate3d(0,26px,0) rotate(0);opacity:0}16%{opacity:.55}78%{opacity:.3}to{transform:translate3d(var(--mote-drift, 30px),-150px,0) rotate(190deg);opacity:0}}.card-stage{position:absolute;left:50%;top:50%;width:320px;height:220px;transform:translate(-50%,calc(-50% + var(--env-drop)));perspective:1200px}.letter{position:absolute;left:50%;top:50%;z-index:2;width:min(280px,84vw);height:min(380px,58vh);padding:28px 40px 52px;overflow:hidden;border-radius:48% 42% 52% 46%/55% 48% 52% 45%;background:repeating-linear-gradient(to bottom,rgba(180,150,100,.08) 0 1px,transparent 1px 2px),#fff8e7;box-shadow:0 12px 40px #0000002e;opacity:0;transform:translate(-50%,-50%) translateY(0) rotate(0);transition:transform 1.2s cubic-bezier(.2,.8,.2,1),opacity .55s ease .2s}.card-scene.is-letter .letter{z-index:6;opacity:1;transform:translate(-50%,-50%) translateY(calc(var(--env-drop) * -1)) rotate(-2deg)}.card-scene.has-paper-image .letter{width:min(340px,84vw);height:min(497px,62vh);padding:0;border-radius:0;background:#f3ecf8 url(../letterpaper.png) center / cover no-repeat;box-shadow:0 18px 48px #2e1c4e61}.letter-type{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(var(--type-scale, 1));width:280px;height:320px;opacity:0;pointer-events:none;font-family:Georgia,Times New Roman,Songti SC,PingFang SC,Microsoft YaHei,serif;color:#4a3f5c;text-align:center}.card-scene.is-letter .letter-type{opacity:1}.tw-line{display:block}.tw-title{font-size:32px;font-style:italic;line-height:1.25;color:#7b5ea7}.tw-names{font-size:22px;line-height:1.3;letter-spacing:1px;color:#4a3f5c}.tw-date{font-size:13px;line-height:1.4;letter-spacing:1px;color:#9b8aa5;margin-top:4px}.tw-body{font-size:15px;line-height:1.9;color:#4a3f5c;margin-top:16px}.tw-para{margin:0}.tw-sign{font-size:14px;font-style:italic;line-height:1.4;color:#7b5ea7;text-align:right;margin-top:14px}.tw-cursor{color:#7b5ea7;animation:tw-blink .8s steps(1,end) infinite}@keyframes tw-blink{0%,49%{opacity:1}50%,to{opacity:0}}.card-scene.has-paper-image .letter-title,.card-scene.has-paper-image .letter-names,.card-scene.has-paper-image .letter-date,.card-scene.has-paper-image .letter-body,.card-scene.has-paper-image .letter-sign,.card-scene.has-paper-image .letter-tail{display:none}.letter-title{margin:0 0 4px;font-family:Great Vibes,Dancing Script,Brush Script MT,cursive,Georgia,italic;font-size:28px;font-weight:400;line-height:1.15;color:#c44536;text-align:center}.letter-names{margin:0 0 2px;font-size:16px;line-height:1.2;letter-spacing:2px;color:#8b5a3c;text-align:center}.letter-date{margin:0 0 8px;font-size:12px;line-height:1.2;letter-spacing:1px;color:#8b5a3c99;text-align:center}.letter-body{max-width:240px;margin:0 auto;font-size:15px;line-height:1.9;color:#2d2d2d;text-align:center}.letter-line{display:block}.letter-sign{display:flex;align-items:center;justify-content:flex-end;gap:9px;max-width:240px;margin:10px auto 0}.letter-sig{font-family:Great Vibes,Dancing Script,Brush Script MT,cursive,Georgia,italic;font-size:15px;line-height:1;color:#c44536}.letter-kiss{flex:none;width:17px;height:15px;border-radius:58% 42% 52% 48%/52% 58% 42% 48%;background:radial-gradient(circle at 44% 40%,rgba(196,69,54,.55),rgba(196,69,54,.2) 58%,transparent 76%);transform:rotate(-9deg)}.letter-tail{margin:6px 0 0;font-family:Dancing Script,Great Vibes,cursive;font-size:12px;line-height:1.2;letter-spacing:2px;text-align:center;color:#8b5a3c80}.letter-title,.letter-names,.letter-date,.letter-sign,.letter-tail,.letter-body>.letter-line{opacity:0;transform:translateY(8px);transition:opacity .5s ease,transform .5s ease;transition-delay:calc(var(--i, 0) * .15s)}.card-scene.is-letter .letter-title,.card-scene.is-letter .letter-names,.card-scene.is-letter .letter-date,.card-scene.is-letter .letter-sign,.card-scene.is-letter .letter-tail,.card-scene.is-letter .letter-body>.letter-line{opacity:1;transform:none}.envelope{position:absolute;inset:0;z-index:3;width:320px;height:220px;padding:0;border:0;border-radius:6px;background:none;perspective:1200px;box-shadow:0 10px 26px #0000004d;opacity:0;transform:translateY(var(--env-y, 0px)) scale(var(--env-scale, 1)) rotateX(var(--env-rot, 0deg));transition:transform .8s ease-in-out,opacity .3s ease}.card-overlay.is-open .envelope{opacity:1}.card-scene.has-envelope-image .envelope{background:url(../envelope.png) center / cover no-repeat;border-radius:0;box-shadow:0 14px 34px #2e1c4e57}.card-scene.has-envelope-image .env-back,.card-scene.has-envelope-image .env-wing,.card-scene.has-envelope-image .env-inner,.card-scene.has-envelope-image .env-front,.card-scene.has-envelope-image .env-flap,.card-scene.has-envelope-image .env-seal{display:none}.card-scene:not(.is-unsealing) .envelope:hover{--env-y: -4px;box-shadow:0 18px 40px #0000006b;transition:transform .45s ease,opacity .3s ease}.card-scene.is-unsealing .envelope{pointer-events:none;--env-rot: 90deg}.card-scene.is-unsealed .envelope{opacity:0}.env-back,.env-inner,.env-front,.env-flap,.env-wing{position:absolute;display:block}.env-back{inset:0;z-index:1;border-radius:6px;background:repeating-linear-gradient(118deg,rgba(160,130,90,.05) 0 2px,transparent 2px 6px),linear-gradient(158deg,#fdf6e7,#f6ead3 48%,#eddfc4);box-shadow:inset 0 0 0 1px #9e7a4e33}.env-wing{z-index:2;top:50%;width:40px;height:58px;margin-top:-29px;background:linear-gradient(200deg,#f3e4c6,#e4cfa6);transition:transform .8s cubic-bezier(.45,.05,.2,1)}.env-wing-l{left:-30px;clip-path:polygon(100% 0,100% 100%,0 50%);transform-origin:100% 50%;transform:rotate(0)}.env-wing-r{right:-30px;clip-path:polygon(0 0,0 100%,100% 50%);transform-origin:0% 50%;transform:rotate(0)}.env-inner{inset:0;z-index:3;clip-path:polygon(0 0,100% 0,50% 52%);background:linear-gradient(172deg,#efe0c2,#e4d0ab)}.env-front{inset:0;z-index:4;clip-path:polygon(0 0,50% 52%,100% 0,100% 100%,0 100%);background:linear-gradient(168deg,#fbf2df,#f3e5c8 54%,#e9d7b2);filter:drop-shadow(0 -1px 1.5px rgba(122,90,52,.3))}.env-flap{inset:0;z-index:5;clip-path:polygon(0 0,100% 0,50% 52%);transform-origin:top center;transform:rotateX(0);background:linear-gradient(170deg,#fef9ec,#f6ead2 60%,#ecd9b6);filter:drop-shadow(0 2px 2px rgba(122,90,52,.32))}.env-seal{position:absolute;z-index:6;left:50%;top:52%;width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:50%;display:grid;place-items:center;font-size:14px;line-height:1;color:#ffeee6eb;background:radial-gradient(circle at 36% 30%,#d4574a,#c44536 52%,#9c3025);box-shadow:inset 0 2px 4px #0000004d,inset 0 -2px 4px #ffffff29,0 3px 8px #00000057;transition:transform .42s ease,opacity .42s ease}.card-scene.is-unsealing .env-seal{transform:translateY(-26px) scale(1.28);opacity:0}.card-hint{position:absolute;left:50%;top:calc(50% + var(--env-drop) + 110px + 16px);transform:translate(-50%);margin:0;font-size:14px;letter-spacing:1px;white-space:nowrap;color:#ffffffb3;transition:opacity .4s ease}.card-scene.is-unsealing .card-hint{opacity:0}.card-replay{position:absolute;left:50%;bottom:52px;transform:translate(-50%);padding:7px 18px;border-radius:999px;border:1px solid rgba(255,255,255,.26);background:#ffffff0f;color:#ffffffd1;font-size:12px;letter-spacing:2px;transition:background .25s ease,border-color .25s ease,color .25s ease}.card-replay[hidden]{display:none}.card-replay:hover{background:#ffffff24;border-color:#ffffff73;color:#fff}.card-close-hint{position:absolute;left:50%;bottom:20px;transform:translate(-50%);margin:0;font-size:11px;letter-spacing:2px;white-space:nowrap;color:#ffffff4d}.card-scene.is-resetting .envelope,.card-scene.is-resetting .env-flap,.card-scene.is-resetting .env-wing,.card-scene.is-resetting .env-seal,.card-scene.is-resetting .letter,.card-scene.is-resetting .letter-title,.card-scene.is-resetting .letter-names,.card-scene.is-resetting .letter-date,.card-scene.is-resetting .letter-sign,.card-scene.is-resetting .letter-tail,.card-scene.is-resetting .letter-body>.letter-line{transition:none!important}@media(max-width:420px){.envelope{--env-k: .84}.letter{padding:24px 30px 46px}.letter-title{font-size:24px}.letter-names{font-size:15px}.letter-body{font-size:14px;line-height:1.8}.card-scene.has-paper-image .letter{width:min(300px,86vw);height:min(438px,60vh)}}@media(max-height:640px){.card-scene{--env-drop: 56px}.letter{height:min(340px,54vh);padding:22px 34px 44px}.card-scene.has-paper-image .letter{width:min(280px,60vw);height:min(400px,66vh)}}.card-story{position:absolute;inset:0;z-index:7;opacity:0;pointer-events:none;transition:opacity .45s ease}.card-scene.is-story .card-story{opacity:1}.story-panel{position:absolute;top:0;right:0;bottom:0;width:min(392px,42vw);padding:30px 28px 26px;overflow-y:auto;overscroll-behavior:contain;pointer-events:none;opacity:0;transform:translate(26px);transition:transform .75s cubic-bezier(.2,.8,.2,1),opacity .5s ease .1s;background:linear-gradient(168deg,#ffeef521,#9670c326 55%,#54388433);border-left:1px solid rgba(255,206,223,.2);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:-20px 0 50px #0000004d;color:#f3e8f3}.card-scene.is-story .story-panel{opacity:1;transform:translate(0);pointer-events:auto}.story-panel::-webkit-scrollbar{width:4px}.story-panel::-webkit-scrollbar-thumb{border-radius:2px;background:#ffd6e647}.story-head{margin-bottom:18px}.story-kicker{margin:0 0 6px;font:600 11px/1 Georgia,Times New Roman,serif;letter-spacing:.34em;color:#ffcadab8}.story-title{margin:0;font:400 26px/1.3 Songti SC,PingFang SC,Microsoft YaHei,serif;color:#fff3f7}.story-days{display:flex;align-items:baseline;gap:10px;padding:14px 16px;margin:0 0 16px;border-radius:14px;background:linear-gradient(120deg,#ffb6c12e,#ffd6961f);border:1px solid rgba(255,206,223,.22)}.story-days[hidden],.story-days.is-fallback .story-days-num{display:none}.story-days-label{margin:0;font-size:13px;letter-spacing:1px;color:#ffeef4d6}.story-days-num{margin:0 0 0 auto;font:700 34px/1 Georgia,Times New Roman,serif;color:#ffd9a0;text-shadow:0 2px 12px rgba(255,190,120,.28)}.story-days-num em{font-style:normal;font-size:13px;margin-left:4px;color:#ffe2ecd1}.story-voice{margin:0 0 18px}.story-voice[hidden]{display:none}.voice-btn{display:flex;align-items:center;gap:10px;width:100%;padding:12px 16px;border-radius:999px;border:1px solid rgba(255,206,223,.3);background:linear-gradient(120deg,#e2607f57,#9664c84d);color:#fff5f8;font:inherit;font-size:14px;letter-spacing:1px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .3s ease}.voice-btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px #00000052}.voice-btn.is-playing{background:linear-gradient(120deg,#e2607f99,#9664c885)}.voice-btn.is-missing,.voice-btn:disabled{cursor:default;background:linear-gradient(120deg,#ffffff12,#ffffff0a);border-color:#ffcedf29;color:#ffecf49e;box-shadow:none;transform:none}.voice-btn.is-missing:hover,.voice-btn:disabled:hover{transform:none;box-shadow:none}.voice-btn.is-missing .voice-ico{opacity:.65}.voice-ico{font-size:15px;line-height:1}.voice-bar{height:3px;margin-top:10px;border-radius:2px;overflow:hidden;background:#ffffff29}.voice-bar i{display:block;width:0;height:100%;background:linear-gradient(90deg,#ffb6c1,#ffd9a0);transition:width .2s linear}.voice-time{margin:6px 0 0;font-size:11px;letter-spacing:1px;text-align:right;color:#ffecf499}.story-timeline{list-style:none;position:relative;margin:0;padding:0 0 0 20px}.story-timeline[hidden]{display:none}.story-timeline:before{content:"";position:absolute;left:4px;top:8px;bottom:10px;width:1px;background:linear-gradient(180deg,#ffb6c199,#ffb6c10d)}.story-tl-item{position:relative;padding:0 0 18px 4px}.story-tl-item:last-child{padding-bottom:0}.story-tl-item:before{content:"";position:absolute;left:-20px;top:6px;width:9px;height:9px;border-radius:50%;background:#ffb6c1;box-shadow:0 0 0 3px #ffb6c12e}.story-tl-date{margin:0;font:600 11px/1.4 Georgia,Times New Roman,serif;letter-spacing:.14em;color:#ffcedfd9}.story-tl-title{margin:3px 0;font-size:15px;font-weight:600;color:#fff4f8}.story-tl-toggle{display:flex;align-items:center;gap:8px;width:100%;margin:3px 0 0;padding:0;border:none;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:color .2s ease}.story-tl-toggle .story-tl-title{margin:0;transition:color .2s ease}.story-tl-toggle:hover .story-tl-title{color:#ffdbe7}.story-tl-caret{flex:none;margin-left:auto;font-style:normal;font-size:11px;line-height:1;color:#ffcedfb3;transition:transform .25s ease}.story-tl-item.is-open .story-tl-caret{transform:rotate(180deg)}.story-tl-bubble{position:relative;margin:8px 0 0;padding:9px 12px;border-radius:12px;background:linear-gradient(140deg,#ffc8d82b,#966ec824);border:1px solid rgba(255,206,223,.2);box-shadow:0 8px 20px #0000003d;animation:story-bubble-in .28s ease both}.story-tl-bubble[hidden]{display:none}.story-tl-bubble:before{content:"";position:absolute;left:14px;top:-5px;width:10px;height:10px;transform:rotate(45deg);background:#ffc8d82b;border-left:1px solid rgba(255,206,223,.2);border-top:1px solid rgba(255,206,223,.2)}@keyframes story-bubble-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}.story-tl-desc{margin:0;font-size:12.5px;line-height:1.7;color:#f0e2f0c7}@media(min-width:900px){.card-scene.is-story .letter{transform:translate(-50%,-50%) translate(-150px,calc(var(--env-drop) * -1)) rotate(-2deg)}}@media(max-width:899px){.story-panel{top:auto;left:0;right:0;width:auto;height:min(62vh,520px);padding:24px 22px 20px;border-left:none;border-top:1px solid rgba(255,206,223,.2);border-radius:20px 20px 0 0;transform:translateY(26px);box-shadow:0 -18px 46px #00000057}.card-scene.is-story .story-panel{transform:translateY(0)}.card-scene.is-story .card-replay{bottom:auto;top:14px}.card-scene.is-story .card-close-hint{bottom:auto;top:52px}}.panel{position:absolute;top:0;right:0;bottom:0;z-index:60;width:min(392px,94vw);display:flex;flex-direction:column;background:#faf6ecf7;backdrop-filter:blur(18px);box-shadow:-18px 0 50px #281a0a38;transform:translate(102%);transition:transform .42s cubic-bezier(.22,.85,.3,1)}.panel.is-open{transform:translate(0)}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 14px;border-bottom:1px solid rgba(201,161,94,.24)}.panel-head h2{margin:0;font-family:var(--font-serif);font-size:18px;font-weight:500;letter-spacing:1px;color:#4a3417;display:flex;align-items:center;gap:8px}.panel-mark{color:var(--gold)}.icon-btn{width:30px;height:30px;border-radius:50%;border:1px solid rgba(201,161,94,.34);background:transparent;color:#6d5330;font-size:13px;transition:background .18s ease,transform .18s ease}.icon-btn:hover{background:#c9a15e29;transform:rotate(90deg)}.panel-body{flex:1;overflow-y:auto;padding:6px 20px 30px}.panel-body::-webkit-scrollbar{width:6px}.panel-body::-webkit-scrollbar-thumb{background:#c9a15e57;border-radius:3px}.pblock{padding:16px 0 4px;border-bottom:1px dashed rgba(201,161,94,.26)}.pblock:last-child{border-bottom:0}.pblock h3{margin:0 0 12px;font-size:12.5px;letter-spacing:2px;color:#a8813f;font-weight:600}.fields{display:flex;flex-direction:column;gap:11px}.field{display:flex;flex-direction:column;gap:5px}.field label{font-size:12px;color:#7a6340;letter-spacing:.4px}.text-input,.field input,.field textarea{width:100%;padding:9px 11px;border-radius:8px;border:1px solid rgba(201,161,94,.4);background:#fffdf8eb;color:#42301b;font-size:13.5px;outline:none;transition:border-color .18s ease,box-shadow .18s ease}.field textarea{resize:vertical;line-height:1.7}.text-input:focus,.field input:focus,.field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px #c9a15e29}.photo-row{display:flex;gap:14px;align-items:flex-start}.photo-preview{width:88px;height:110px;flex:none;border-radius:7px;overflow:hidden;background:#2b211a;box-shadow:inset 0 0 0 1px #c9a15e66}.photo-preview img{width:100%;height:100%;object-fit:cover;display:block}.photo-preview img:not([src]){display:none}.photo-actions{flex:1;display:flex;flex-direction:column;gap:8px;min-width:0}.file-btn{display:inline-block;text-align:center;padding:8px 14px;border-radius:999px;background:linear-gradient(135deg,var(--gold-deep),var(--gold));color:#fff8ea;font-size:13px;cursor:pointer;transition:box-shadow .18s ease}.file-btn:hover{box-shadow:0 8px 20px #8e6a2e52}.photo-btns{display:flex;align-items:center;gap:8px}.ghost-btn{flex:none;padding:8px 14px;border-radius:999px;border:1px solid rgba(156,76,94,.4);background:transparent;color:#9c4a5e;font-size:13px;line-height:1.2;cursor:pointer;transition:background .16s ease,border-color .16s ease}.ghost-btn:hover{background:#9c4c5e1f;border-color:#9c4c5e9e}.music-list{display:flex;flex-direction:column;gap:7px;margin-bottom:12px}.music-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:9px;border:1px solid rgba(201,161,94,.26);background:#fffdf8b3;cursor:pointer;transition:border-color .18s ease,background .18s ease}.music-item:hover{border-color:#c9a15e8c}.music-item.is-active{border-color:var(--gold);background:#c9a15e24}.music-item .m-emoji{font-size:17px}.music-item .m-name{font-size:13.5px;color:#4b3519;font-weight:500}.music-item .m-desc{font-size:11.5px;color:#96794b;margin-top:1px}.row-label{display:flex;align-items:center;gap:10px;font-size:12.5px;color:#7a6340;margin-bottom:10px}.row-label input[type=range]{flex:1;accent-color:var(--gold)}.row-label em{font-style:normal;font-size:12px;color:#a8813f;min-width:38px;text-align:right}.switch-row{display:flex;flex-wrap:wrap;gap:10px 18px}.switch{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:#6b5433;cursor:pointer}.switch input{accent-color:var(--gold);width:15px;height:15px}.pnote{margin:10px 0 0;font-size:11.5px;line-height:1.75;color:#96805c}.pnote code{background:#c9a15e24;padding:1px 5px;border-radius:4px;font-size:11px}.pblock .btn{width:100%;margin-bottom:8px;justify-content:center}.pblock .btn:not(.btn-primary){background:#fffdf8e6;border-color:#c9a15e66;color:#5d4522}.toast{position:absolute;left:50%;bottom:calc(120px + var(--safe-b));transform:translate(-50%,14px);width:max-content;z-index:80;padding:11px 22px;border-radius:999px;background:#221912e6;color:#fdf6e8;font-size:13px;letter-spacing:.6px;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease;backdrop-filter:blur(8px);max-width:86vw;text-align:center}.toast.is-show{opacity:1;transform:translate(-50%)}@media(max-width:720px){.hud-top{top:calc(10px + var(--safe-t));left:12px;right:12px}.brand{padding:7px 15px 7px 12px}.brand-text{font-size:16px}.brand-sub{display:none}.btn{padding:8px 12px;font-size:12.5px}.top-actions .txt{display:none}.top-actions .btn{padding:9px 12px}.top-actions .ico{font-size:15px}.hud-bottom{bottom:calc(24px + var(--safe-b))}.open-card{padding:13px 24px;font-size:15.5px;gap:11px}.open-hint{font-size:11.5px}.btn-pure{right:62px;bottom:calc(14px + var(--safe-b))}.btn-pure .txt{display:none}.bgm-btn{right:12px;bottom:calc(14px + var(--safe-b));width:38px;height:38px}.bgm-btn .ico{font-size:15px}.card-inner{padding:28px 22px 24px}.card-photo{width:140px}.panel{width:100%}.toast{bottom:calc(96px + var(--safe-b))}}@media(max-height:560px){.hud-bottom{bottom:calc(14px + var(--safe-b));gap:6px}.open-hint{display:none}}.hint-panel{position:fixed;top:53px;left:0;z-index:1000;min-width:220px;padding:0;border-radius:14px;background:linear-gradient(135deg,#fff5dc38,#ffdcb41f),#24160a52;border:1px solid rgba(255,220,170,.25);box-shadow:0 12px 40px #78502833;backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);color:#fffaf0d9;overflow:hidden;opacity:0;transform:translateY(-8px);transform-origin:top left;transition:opacity .25s ease-out,transform .25s ease-out}.hint-panel.is-open{opacity:1;transform:translateY(0)}.hint-panel[hidden]{display:none}.hint-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px 8px;border-bottom:1px solid rgba(232,200,122,.15)}.hint-title{margin:0;font-family:Great Vibes,Playfair Display,cursive;font-size:14px;font-weight:500;letter-spacing:2px;color:#e8c87a;text-shadow:0 1px 3px rgba(34,18,2,.5)}.hint-close{flex:none;width:22px;height:22px;padding:0;border:none;border-radius:50%;background:transparent;color:#fff0d273;font-size:16px;line-height:1;cursor:pointer;transition:color .2s ease,background .2s ease,transform .2s ease}.hint-close:hover{color:#ffc896d9;background:#ffd7a024;transform:scale(1.08)}.hint-list{margin:0;padding:6px 0;list-style:none;display:flex;flex-direction:column;gap:2px}.hint-list li{display:flex;align-items:center;gap:9px;height:32px;padding:0 14px;font-size:12px;letter-spacing:.3px;color:#fffaf0d9;text-shadow:0 1px 2px rgba(34,16,2,.5);transition:background .2s ease,color .2s ease}.hint-list li:hover{background:#ffd7a02e;color:#fffcf4}.hint-ico{flex:none;width:16px;text-align:center;font-size:14px;line-height:1}.hint-foot{padding:6px 14px 0}.hint-make{width:100%;padding:8px 12px;border:1px solid rgba(201,168,74,.5);border-radius:10px;background:linear-gradient(135deg,#c9a84a59,#d4af3740);color:#e6c87a;font-family:var(--font-serif);font-size:12px;font-weight:500;letter-spacing:1.2px;text-shadow:0 1px 2px rgba(34,16,2,.5);cursor:pointer;transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease}.hint-make:hover{background:#c9a84a80;border-color:#c9a84ab3;box-shadow:0 0 12px #c9a84a33;transform:translateY(-1px);color:#fff1cd;text-shadow:0 1px 3px rgba(48,28,4,.65)}.hint-make:active{transform:scale(.98)}.hint-tip{margin:8px 0 0;padding-bottom:10px;text-align:center;font-size:10px;letter-spacing:.4px;color:#ffdcb473}.side-tools{position:absolute;right:18px;bottom:calc(78px + var(--safe-b));z-index:20;display:flex;flex-direction:column;gap:9px;transition:opacity .45s ease,transform .45s ease}.round-btn{width:42px;height:42px;border-radius:50%;border:1px solid rgba(201,161,94,.34);background:#faf4e8e6;color:#5a421c;font-size:17px;line-height:1;display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md);backdrop-filter:blur(10px);transition:transform .18s ease,background .18s ease,box-shadow .18s ease,opacity .18s}.round-btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px #3a240e3d}.round-btn:active{transform:translateY(0)}.round-btn.is-on{background:linear-gradient(135deg,var(--gold-deep),var(--gold));color:#fff6e6;border-color:#ffffff47}.round-btn.is-hidden{display:none}.joystick{position:absolute;left:22px;bottom:calc(26px + var(--safe-b));z-index:22;width:118px;height:118px;display:none;align-items:center;justify-content:center;touch-action:none}.joystick.is-on{display:flex}.joy-ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(201,161,94,.42);background:radial-gradient(circle at 50% 50%,#faf4e829,#1c15206b);backdrop-filter:blur(6px);transition:border-color .2s ease,box-shadow .2s ease}.joystick.is-active .joy-ring{border-color:#f0dcaee6;box-shadow:0 0 24px #f0dcae52}.joy-knob{position:relative;width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,#f7e9c8,#d9b87e);box-shadow:0 6px 18px #140c0473;transition:transform .06s linear}.gallery-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}.gallery-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;padding:7px 9px;border-radius:9px;border:1px solid rgba(201,161,94,.26);background:#fffdf8b3}.gallery-row .g-index{flex:none;width:20px;height:20px;border-radius:50%;background:#c9a15e33;color:#7a5c28;font-size:11px;display:inline-flex;align-items:center;justify-content:center}.gallery-row input{flex:1;min-width:0;padding:6px 9px;font-size:12.5px}.gallery-row input.g-cap{order:9;flex:1 1 100%;margin-left:28px}.gallery-row .g-del{flex:none;width:24px;height:24px;border-radius:50%;border:1px solid rgba(156,76,94,.34);background:transparent;color:#9c4a5e;font-size:12px;line-height:1}.gallery-row .g-del:hover{background:#9c4c5e1f}.gallery-row input[type=file]{display:none}.gallery-row .g-thumb{flex:none;width:30px;height:30px;border-radius:6px;overflow:hidden;border:1px solid rgba(201,161,94,.34);background:#2b211a;display:inline-flex;align-items:center;justify-content:center;font-size:13px;color:#c9a15ee6}.gallery-row .g-thumb img{width:100%;height:100%;object-fit:cover;display:block}.gallery-row .g-upload{flex:none;width:24px;height:24px;border-radius:50%;border:1px solid rgba(201,161,94,.42);background:transparent;color:#8a6c3c;font-size:12px;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .16s ease,border-color .16s ease,transform .16s ease}.gallery-row .g-upload:hover{background:#c9a15e29;border-color:#c9a15eb3;transform:translateY(-1px)}.gallery-row .g-clear{flex:none;width:24px;height:24px;border-radius:50%;border:1px solid rgba(201,161,94,.42);background:transparent;color:#8a6c3c;font-size:13px;line-height:1;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .16s ease,border-color .16s ease}.gallery-row .g-clear:hover{background:#c9a15e29;border-color:#c9a15eb3}.gallery-add{margin-top:4px;padding:7px 12px;border-radius:999px;border:1px dashed rgba(201,161,94,.5);background:transparent;color:#8a6c3c;font-size:12.5px;align-self:flex-start}.gallery-add:hover{background:#c9a15e1f}.text-input.select{flex:1;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#8a6c3c 50%),linear-gradient(135deg,#8a6c3c 50%,transparent 50%);background-position:calc(100% - 16px) 50%,calc(100% - 11px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}body.is-pure .side-tools,body.is-pure .hint-panel,body.is-pure .joystick{opacity:0;pointer-events:none}.photo-overlay{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;color:#f6efe1;touch-action:none;-webkit-tap-highlight-color:transparent}.photo-overlay.is-open,.photo-overlay.is-closing{display:flex}.po-scrim{position:absolute;inset:0;background:#000000d9;opacity:0;transition:opacity .26s ease}.photo-overlay.is-open .po-scrim{opacity:1}.po-stage{position:absolute;left:0;top:0;margin:0;z-index:2;transform-origin:0 0;will-change:transform;filter:drop-shadow(0 18px 42px rgba(0,0,0,.55))}.po-img{display:block;width:100%;height:100%;object-fit:contain;border-radius:10px;background:#ffffff0a;opacity:1;transition:opacity .18s ease;transform-origin:center center;user-select:none;-webkit-user-drag:none}.po-btn{position:absolute;z-index:3;display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,215,140,.35);border-radius:999px;background:#160f0873;backdrop-filter:blur(6px);color:#ffe9c2;font-size:22px;line-height:1;cursor:pointer;transition:background .18s ease,opacity .2s ease}.po-btn:hover{background:#402a149e}.po-btn:active{transform:scale(.94)}.po-btn:focus{outline:none}.po-close{top:calc(16px + var(--safe-t));right:16px;width:42px;height:42px;font-size:18px}.po-nav{top:50%;width:46px;height:46px;font-size:26px;transform:translateY(-50%)}.po-nav:active{transform:translateY(-50%) scale(.94)}.po-prev{left:16px}.po-next{right:16px}.photo-overlay.is-single .po-nav{display:none}.po-cap{position:absolute;z-index:3;left:50%;bottom:calc(32px + var(--safe-b));transform:translate(-50%);margin:0;padding:6px 16px;max-width:86vw;border-radius:999px;background:#160f086b;font-size:13px;letter-spacing:.12em;color:#fff0d6eb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.po-count{position:absolute;z-index:3;left:50%;bottom:calc(10px + var(--safe-b));transform:translate(-50%);font-size:12px;letter-spacing:.16em;color:#ffebc8b8}@media(max-width:720px){.side-tools{right:12px;bottom:calc(66px + var(--safe-b))}.round-btn{width:38px;height:38px;font-size:16px}.hint-title{font-size:13px;letter-spacing:1.4px}.hint-list li{height:30px;font-size:11.5px}.hint-ico{font-size:13px}.hint-make{font-size:11.5px}.joystick{width:96px;height:96px;left:16px;bottom:calc(118px + var(--safe-b))}.joy-knob{width:40px;height:40px}}.edge-cannons{position:absolute;inset:0;z-index:15;pointer-events:none}.edge-cannon{position:absolute;top:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;width:42px;height:42px;padding:0;margin:0;border:1px solid rgba(255,214,120,.34);border-radius:50%;background:linear-gradient(165deg,#7e582080,#26180c75);box-shadow:0 12px 30px #0000004d,inset 0 1px #ffecc242;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);color:#ffe9b4;cursor:pointer;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:transform .3s cubic-bezier(.22,.8,.3,1),border-color .3s ease,box-shadow .3s ease}.edge-cannon:focus{outline:none}.edge-cannon .ec-ico{font-size:20px;line-height:1;filter:drop-shadow(0 2px 7px rgba(255,196,84,.5))}.edge-cannon:hover{transform:translateY(-50%) scale(1.06);border-color:#ffd678b8;box-shadow:0 16px 36px #00000057,0 0 26px #ffc44842,inset 0 1px #ffecc257}.edge-cannon:active{transform:translateY(-50%) scale(.97)}.edge-cannon[data-edge=left]{left:14px;transform:translateY(-50%)}.edge-cannon[data-edge=right]{right:14px;transform:translateY(-50%)}.edge-cannon[data-edge=left]:hover,.edge-cannon[data-edge=right]:hover{transform:translateY(-50%) scale(1.06)}body.is-pure .edge-cannons{display:none}@media(max-width:720px){.edge-cannon{width:38px;height:38px}.edge-cannon .ec-ico{font-size:17px}.edge-cannon[data-edge=left]{left:8px}.edge-cannon[data-edge=right]{right:8px}}@media(max-width:720px){.po-close{width:38px;height:38px;font-size:16px;top:calc(10px + var(--safe-t));right:10px}.po-nav{width:38px;height:38px;font-size:22px}.po-prev{left:8px}.po-next{right:8px}.po-cap{font-size:12px;bottom:calc(26px + var(--safe-b))}.po-count{bottom:calc(8px + var(--safe-b))}}@media(max-width:900px){.hint-list li{height:30px}}
