*,:before,:after{box-sizing:border-box}:root{--ink:#14191f;--ink-soft:#4a5560;--paper:#d7e1e8;--paper-2:#eef3f6;--red:#d63a2f;--red-deep:#9f241c;--line:rgba(20,25,31,.14);--font-brand:"Ma Shan Zheng", "ZCOOL XiaoWei", serif;--font-display:"ZCOOL XiaoWei", "Noto Serif SC", "Songti SC", serif;--font-write:"Noto Serif SC", "ZCOOL XiaoWei", "Songti SC", serif;--font-sans:"Noto Sans SC", "PingFang SC", sans-serif;--font-num:"Syne", "Noto Sans SC", sans-serif;--page-x:clamp(16px, 4vw, 7vw);--page-y:clamp(32px, 6vw, 88px);--nav-h:52px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}html,body{min-height:100%;margin:0}body{color:var(--ink);font-family:var(--font-sans);background-color:#cfd9e0;background-image:radial-gradient(rgba(20,25,31,.05) .7px,transparent .8px);background-size:8px 8px}#root{min-height:100svh}a{color:inherit;text-decoration:none}h1,h2,h3{font-family:var(--font-display);letter-spacing:.02em;margin:0;font-weight:400}p{margin:0}button,input,textarea{font:inherit}.nav{z-index:20;min-height:var(--nav-h);padding:calc(10px + var(--safe-top)) var(--page-x) 10px;color:#f4f7f9;mix-blend-mode:normal;justify-content:space-between;align-items:center;display:flex;position:fixed;top:0;bottom:auto;left:0;right:0}.nav.is-solid{color:var(--ink);border-bottom:1px solid var(--line);background:rgba(207,217,224,.92)}.nav-brand{font-family:var(--font-brand);font-size:max(24px,min(6vw,32px));line-height:1}.nav-links{gap:max(14px,min(4vw,28px));font-size:14px;display:flex}.nav-links a[aria-current=page]{box-shadow:inset 0 -2px}.hero{color:#f4f7f9;position:relative;overflow:hidden}.hero-image{object-fit:cover;object-position:center 42%;filter:saturate(.72)contrast(1.05);width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}.hero:after{content:"";background:rgba(12,16,22,.5);position:absolute;top:0;bottom:0;left:0;right:0}.hero-copy{z-index:1;min-height:200px;padding:calc(var(--nav-h) + var(--safe-top) + 12px) var(--page-x) 20px;flex-direction:column;justify-content:center;gap:10px;max-width:920px;display:flex;position:relative}.hero h1{max-width:16em;font-size:max(18px,min(4.2vw,28px));line-height:1.35;animation:.9s both rise}.lede{opacity:.85;font-size:13px;line-height:1.45;animation:.9s .1s both rise}.cta-row{margin-top:4px;animation:.9s .2s both rise}.cta-note{opacity:.8;margin-top:8px;font-size:13px;line-height:1.45}@keyframes rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}.btn-primary{background:var(--red);color:#fff8f6;cursor:pointer;border:0;border-radius:2px;justify-content:center;align-items:center;min-height:44px;padding:0 18px;font-size:15px;display:inline-flex}.btn-primary:disabled{opacity:.55;cursor:wait}.btn-secondary{border:1px solid var(--ink);min-height:40px;color:var(--ink);cursor:pointer;background:0 0;border-radius:2px;justify-content:center;align-items:center;padding:0 16px;font-size:14px;display:inline-flex}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.shop-link{margin-top:12px;text-decoration:none}.pay-block{border-top:1px solid var(--line);margin:18px 0;padding-top:6px}.pay-block h2{margin-bottom:6px;font-size:max(17px,min(4.2vw,22px))}.pay-line{color:var(--ink-soft);font-size:14px;line-height:1.5}.voucher-ok{color:var(--red-deep);margin-top:8px;font-size:14px}.download-row{flex-wrap:wrap;gap:16px;display:flex}.btn-ghost,.btn-text{cursor:pointer;color:var(--ink);background:0 0;border:0;margin-top:12px;padding:0;display:inline-flex}.btn-ghost{border-bottom:1px solid var(--ink);border-radius:0;min-height:auto}.section{padding:var(--page-y) var(--page-x)}.section h2{font-size:max(22px,min(5vw,44px));line-height:1.25}.section-line{color:var(--ink-soft);margin-top:6px;font-size:14px;line-height:1.5}.scenes-section{background:var(--paper-2)}.scene-index{border-top:1px solid var(--line);margin:24px 0 0;padding:0;list-style:none}.scene-index a{border-bottom:1px solid var(--line);grid-template-columns:minmax(88px,.35fr) 1fr;align-items:baseline;gap:10px 14px;padding:14px 0;display:grid}.scene-name{font-family:var(--font-display);font-size:max(20px,min(5vw,28px))}.scene-line{color:var(--ink-soft);font-size:14px;line-height:1.45}.scene-index a:hover .scene-name{color:var(--red)}.letter-section{background:#e4ecf1 repeating-linear-gradient(transparent,transparent 31px,rgba(20,40,60,.08) 32px)}.three-blanks{gap:12px;margin:24px 0 0;padding:0;list-style:none;display:grid}.three-blanks li{font-family:var(--font-write);align-items:baseline;gap:12px;font-size:max(18px,min(4.2vw,28px));line-height:1.35;display:flex}.three-blanks em{font-family:var(--font-sans);color:var(--red);letter-spacing:.04em;font-size:13px;font-style:normal;font-weight:600}.price-section{background:var(--paper-2);justify-content:center;display:flex}.price-card{border:1px solid var(--line);text-align:center;background:#fff;border-radius:14px;width:100%;max-width:420px;padding:20px 18px 18px;box-shadow:0 8px 24px rgba(20,25,31,.06)}.price-kicker{color:var(--red);letter-spacing:.08em;background:rgba(214,58,47,.1);border-radius:999px;margin:0 0 8px;padding:3px 10px;font-size:12px;font-weight:600;display:inline-block}.price-title{font-family:var(--font-write);color:var(--ink);margin:0;font-size:max(22px,min(5vw,28px));font-weight:500;line-height:1.35}.price-desc{color:var(--ink-soft);margin:8px 0 16px;font-size:14px;line-height:1.6}.price-row{background:#f7f9fb;border-radius:10px;justify-content:center;align-items:center;gap:16px;margin-bottom:16px;padding:14px 12px;display:flex}.price-amount-wrap{color:var(--red);align-items:baseline;gap:4px;display:flex}.price-amount{font-family:var(--font-write);letter-spacing:-.02em;font-size:max(40px,min(12vw,52px));font-weight:600;line-height:1}.price-yuan{font-size:16px;font-weight:500}.price-meta{text-align:left;flex-direction:column;align-items:flex-start;gap:6px;display:flex}.price-badge{color:var(--ink);background:rgba(20,25,31,.06);border-radius:4px;padding:2px 8px;font-size:12px;font-weight:500;display:inline-block}.price-was{color:var(--ink-soft);opacity:.75;font-size:13px;text-decoration:line-through}.price-cta{margin-top:4px}.price-wechat{border-top:1px dashed var(--line);flex-direction:column;align-items:center;gap:8px;margin-top:18px;padding-top:16px;display:flex}.price-qr{border:1px solid var(--line);background:#fff;border-radius:10px;width:168px;height:168px;display:block}.price-wechat-title{color:var(--ink);margin:0;font-size:14px;font-weight:600}.price-wechat-link{color:var(--ink-soft);word-break:break-all;text-align:center;font-size:12px;line-height:1.45}.price-wechat-link:hover{color:var(--red)}.price-note{color:var(--ink-soft);margin:12px 0 0;font-size:12px;line-height:1.5}.write-page{padding:calc(var(--nav-h) + var(--safe-top) + 10px) var(--page-x) calc(88px + var(--safe-bottom));background:var(--paper-2);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}.write-page-paid{padding-top:calc(var(--nav-h) + var(--safe-top) + 6px)}.write-shell{flex-direction:column;gap:8px;max-width:480px;margin:0 auto;display:flex}.write-page-paid .write-shell{gap:6px}.write-card .write-head{border-bottom:1px solid var(--line);margin-bottom:10px;padding:0 0 10px}.write-page-paid .write-card .write-head{margin-bottom:8px;padding:0 0 8px}.write-head{padding:0}.write-scene{color:var(--red);font-family:var(--font-sans);letter-spacing:.06em;white-space:nowrap;background:rgba(214,58,47,.1);border-radius:4px;flex-shrink:0;padding:3px 9px;font-size:13px;font-weight:500;line-height:1.4;text-decoration:none;display:inline-block}.write-scene-nav{flex-wrap:wrap;gap:4px;margin-bottom:0;display:flex}.write-paid-tag{color:var(--red-deep);text-align:center;background:rgba(214,58,47,.08);border:1px solid rgba(214,58,47,.18);border-radius:6px;margin:0 0 6px;padding:5px 8px;font-size:12px;font-weight:600;line-height:1.35}.write-ref-hint{color:var(--ink-soft);text-align:center;margin:-2px 0 6px;font-size:11px;line-height:1.35}.write-scene:not(.write-scene-active){color:var(--ink-soft);background:rgba(20,25,31,.05)}.write-scene:not(.write-scene-active):hover{color:var(--red);background:rgba(214,58,47,.08)}.write-scene-active{font-weight:600}.write-scene-more{cursor:pointer;font:inherit;border:0}.write-scene-nav-more{border-top:1px dashed var(--line);margin-top:4px;padding-top:4px}.scene-more-toggle{border:1px solid var(--line);color:var(--ink-soft);font:inherit;cursor:pointer;background:#fff;border-radius:999px;align-items:center;margin-top:12px;padding:6px 12px;font-size:13px;display:inline-flex}.scene-more-toggle:hover{color:var(--red);border-color:rgba(214,58,47,.35)}.write-head h1{font-family:var(--font-write);letter-spacing:.04em;color:var(--ink);margin:8px 0 4px;font-size:max(20px,min(4.8vw,28px));font-weight:500;line-height:1.35}.write-lead{font-family:var(--font-write);color:#3d4854;letter-spacing:.02em;margin:0;font-size:13px;line-height:1.5}.write-badge{color:var(--red-deep);text-align:center;background:rgba(214,58,47,.08);border:1px solid rgba(214,58,47,.2);border-radius:8px;padding:8px 12px;font-size:13px}.write-badge-ref{border-color:var(--line);color:var(--ink-soft);background:rgba(20,25,31,.04)}.write-alert{border:1px solid var(--line);border-left:3px solid var(--red);background:#fff;border-radius:8px;padding:10px 12px;font-size:14px}.write-alert p{color:var(--ink-soft);margin-top:4px;font-size:13px;line-height:1.45}.write-card{border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px;box-shadow:0 1px 3px rgba(20,25,31,.06)}.write-page-paid .write-card{padding:10px 12px}.step-card+.step-card,.step-card+.write-submit,.write-submit{border-top:1px solid var(--line);margin-top:8px;padding-top:8px}.write-page-paid .step-form{border-top:0;margin-top:0;padding-top:0}.step-head{align-items:center;gap:8px;margin-bottom:8px;display:flex}.step-num{background:var(--ink);color:#fff;width:22px;height:22px;font-family:var(--font-num);border-radius:50%;flex-shrink:0;place-items:center;font-size:12px;font-weight:700;display:grid}.step-head h2{font-family:var(--font-write);letter-spacing:.03em;color:var(--ink);font-size:17px;font-weight:500;line-height:1.35}.step-line,.step-tip{color:#56616d;margin-bottom:10px;font-size:14px;line-height:1.65}.step-tip{color:var(--red-deep);margin-top:-4px}.field{gap:4px;margin-bottom:8px;display:grid}.write-page-paid .field{margin-bottom:6px}.field-label{font-family:var(--font-write);letter-spacing:.03em;color:#2f3842;font-size:13px;font-weight:500}.field-input{border:1px solid var(--line);width:100%;color:var(--ink);font-family:var(--font-sans);background:#f7f9fb;border-radius:8px;padding:9px 11px;font-size:14px;font-weight:400;line-height:1.45;transition:border-color .15s,background .15s}.write-page-paid .field-input{padding:8px 10px}.field-input::placeholder{color:rgba(74,85,96,.48);font-weight:400}.field-input:focus{border-color:var(--red);background:#fff;outline:none}.field-input:disabled{opacity:.55}.field-textarea{resize:vertical;min-height:56px;line-height:1.5}.field-textarea-message{min-height:80px;line-height:1.55}.write-page-paid .field-textarea{min-height:48px}.write-page-paid .field-textarea-message{min-height:68px}.btn-block{width:100%}.btn-compact{min-height:38px;padding:0 14px}.btn-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.verify-ok{color:var(--red-deep);font-size:13px;font-weight:500}.style-chips{flex-wrap:wrap;gap:6px;display:flex}.style-chip{border:1px solid var(--line);font-family:var(--font-sans);color:var(--ink);cursor:pointer;background:#f7f9fb;border-radius:999px;padding:5px 12px;font-size:13px;font-weight:500}.style-chip.is-on{border-color:var(--red);color:var(--red);background:rgba(214,58,47,.08)}.style-chip:disabled{opacity:.5;cursor:not-allowed}.write-submit{border-top:0;padding-top:4px}.write-output{margin-top:4px}.write-output .result h2{font-size:20px}.songs-page{padding:calc(var(--nav-h) + var(--safe-top) + 16px) var(--page-x) calc(40px + var(--safe-bottom));max-width:760px;display:block}.letter{padding:0}.letter-scene{color:var(--red);letter-spacing:.18em;font-size:13px}.letter h1,.songs-page h1{margin:4px 0 8px;font-size:max(24px,min(6vw,52px));line-height:1.2}.letter-lead{color:var(--ink-soft);margin-bottom:16px;font-size:14px;line-height:1.5}.letter label{color:var(--ink-soft);gap:4px;margin-bottom:14px;font-size:13px;display:grid}.letter input,.letter textarea{border:1px solid var(--line);width:100%;color:var(--ink);resize:vertical;background:#f7f9fb;border-radius:8px;padding:10px 12px;font-size:16px}.letter input:focus,.letter textarea:focus{border-color:var(--red);background:#fff;outline:none}.style-field{border:0;margin:4px 0 16px;padding:0}.style-field legend{color:var(--ink-soft);margin-bottom:8px;padding:0;font-size:13px}.style-list{flex-wrap:wrap;gap:6px 12px;display:flex}.style-list label{color:var(--ink);cursor:pointer;align-items:center;gap:5px;margin:0;font-size:14px;display:flex}.style-list input{width:auto;accent-color:var(--red)}.style-list .is-on{color:var(--red)}.form-hint,.waiting-sub,.result-note,.side-empty,.footer-note{color:var(--ink-soft);margin-top:8px;font-size:13px;line-height:1.45}.form-error{color:var(--red);margin-bottom:8px;font-size:14px}.waiting{text-align:center;padding:12px 0}.vinyl{aspect-ratio:1;object-fit:cover;border-radius:50%;width:min(160px,55%);animation:8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.result h2{font-size:max(22px,min(5vw,36px));line-height:1.25}.track-list{gap:10px;margin:16px 0;display:grid}.player{border-top:1px solid var(--line);grid-template-columns:auto 1fr;align-items:center;gap:10px;padding:8px 0;display:grid}.play-btn{border:1px solid var(--ink);cursor:pointer;background:0 0;border-radius:2px;flex-shrink:0;width:44px;height:44px;font-size:14px}.player-meta{justify-content:space-between;gap:12px;font-size:14px;display:flex}.player-meta span{color:var(--ink-soft)}.player-bar{background:var(--line);height:2px;margin-top:8px}.player-bar i{background:var(--red);height:100%;display:block}.lyrics{white-space:pre-wrap;font-family:var(--font-sans);color:var(--ink-soft);margin-top:16px;font-size:13px;line-height:1.65}.pay-layer{z-index:30;background:rgba(12,16,22,.45);place-items:end center;display:grid;position:fixed;top:0;bottom:0;left:0;right:0}.pay-sheet{background:var(--paper-2);width:min(520px,100%);padding:20px var(--page-x) calc(24px + var(--safe-bottom))}.pay-sheet h2{margin-bottom:8px;font-size:max(20px,min(5vw,28px))}.song-list{margin:16px 0 0;padding:0;list-style:none}.song-item{border-top:1px solid var(--line);padding:16px 0}.song-head{justify-content:space-between;gap:16px;margin-bottom:8px;display:flex}.song-head span,.empty{color:var(--ink-soft)}.empty a{border-bottom:1px solid var(--ink);margin-left:8px}.site-footer{padding:28px var(--page-x) calc(32px + var(--safe-bottom));border-top:1px solid var(--line);font-size:14px;line-height:1.5}.footer-brand{font-family:var(--font-brand);margin-bottom:6px;font-size:max(26px,min(7vw,36px))}.wx-banner{background:var(--paper-2);border:1px solid var(--line);border-left:3px solid var(--red);margin-bottom:6px;padding:10px 12px;font-size:14px}.wx-banner p{color:var(--ink-soft);margin-top:4px;font-size:13px;line-height:1.45}.wx-tip,.wx-share-hint{color:var(--ink-soft);margin-top:10px;font-size:14px;line-height:1.5}.paste-row{flex-wrap:wrap;align-items:center;gap:10px;margin-top:8px;display:flex}.paste-tip{color:var(--ink-soft);font-size:13px}.share-panel{border-top:1px solid var(--line);margin-top:16px;padding-top:14px}.share-panel.is-compact{margin-top:12px;padding-top:12px}.share-panel h3{margin-bottom:6px;font-size:max(17px,min(4vw,22px))}.share-lead{color:var(--ink-soft);margin-bottom:10px;font-size:13px;line-height:1.45}.share-referral-hint{color:var(--red-deep);background:rgba(214,58,47,.06);border:1px solid rgba(214,58,47,.14);border-radius:8px;margin:0 0 10px;padding:8px 10px;font-size:12px;line-height:1.5}.share-url-row{grid-template-columns:1fr auto;align-items:center;gap:8px;display:grid}.share-field{margin-bottom:10px}.share-intro{min-height:96px}.share-url-input{font-size:14px}.share-actions{grid-template-columns:1fr 1fr;gap:8px;margin-top:4px;display:grid}.share-actions .btn-ghost{grid-column:1/-1}.share-tip{color:var(--red-deep);background:rgba(214,58,47,.08);border:1px solid rgba(214,58,47,.18);border-radius:8px;margin:8px 0 0;padding:8px 10px;font-size:13px;line-height:1.5}.share-tip-info{border-color:var(--line);color:var(--ink-soft);background:rgba(20,25,31,.04)}.share-url{border:1px solid var(--line);background:var(--paper-2);width:100%;color:var(--ink-soft);padding:10px;font-size:13px}.share-qr-block{text-align:center;margin-top:12px}.share-qr-block img{border:1px solid var(--line);max-width:min(160px,42vw);height:auto;display:inline-block}.share-page{min-height:100svh;padding:calc(20px + var(--safe-top)) var(--page-x) calc(32px + var(--safe-bottom));max-width:640px}.share-page.has-share-cta{padding-bottom:calc(88px + var(--safe-bottom))}.share-cta-card{border:1px solid var(--line);text-align:center;background:#fff;border-radius:12px;margin:20px 0 16px;padding:16px}.share-cta-lead{font-family:var(--font-write);color:var(--ink);margin-bottom:12px;font-size:15px;line-height:1.5}.share-cta-note{margin-top:10px;margin-bottom:0}.share-write-cta{text-align:center;justify-content:center;align-items:center;min-height:44px;line-height:1.2;display:inline-flex}.share-cta-bar{display:none}.share-kicker{color:var(--red);letter-spacing:.12em;font-size:13px}.share-page h1{margin:6px 0;font-size:max(24px,min(6.5vw,48px));line-height:1.2}.share-message{color:var(--ink-soft);margin-bottom:16px;font-size:15px;line-height:1.55}.songs-note{margin-top:4px;margin-bottom:16px}.inline-link{border-bottom:1px solid var(--ink);margin-left:6px}.mp-pay-hint{grid-column:1/-1}.write-side{min-width:0}@media (max-width:860px){:root{--nav-h:48px;--page-y:36px}.hero-copy{gap:8px;min-height:168px;padding-bottom:16px}.hero h1{max-width:none;font-size:17px}.hero .cta-row .btn-primary{width:100%}.scene-index a{grid-template-columns:1fr;gap:2px;padding:12px 0}.write-page{padding-bottom:calc(96px + var(--safe-bottom))}.write-page-paid{padding-top:calc(var(--nav-h) + var(--safe-top) + 4px)}.write-page-paid .write-card .write-head{margin-bottom:6px;padding-bottom:6px}.write-page-paid .write-scene{padding:3px 8px;font-size:12px}.write-submit{z-index:15;padding:10px var(--page-x) calc(10px + var(--safe-bottom));border-top:1px solid var(--line);backdrop-filter:blur(6px);background:rgba(238,243,246,.96);margin:0;position:fixed;bottom:0;left:0;right:0}.write-submit .form-hint{text-align:center;margin-top:6px}.write-page .wx-banner,.write-alert{margin:0}.share-url-row{grid-template-columns:1fr}.download-row{gap:10px}.write-page .btn-primary[type=submit],.letter .shop-link,.write-card .shop-link{width:100%}.share-page.has-share-cta{padding-bottom:calc(96px + var(--safe-bottom))}.share-cta-bar{z-index:15;padding:10px var(--page-x) calc(10px + var(--safe-bottom));border-top:1px solid var(--line);backdrop-filter:blur(8px);background:rgba(238,243,246,.96);display:block;position:fixed;bottom:0;left:0;right:0}.share-cta-card .share-write-cta{display:none}}@media (min-width:861px){.hero-copy{flex-flow:wrap;align-items:center;gap:8px 20px;min-height:220px}.hero h1{flex:280px;margin:0}.hero .lede{flex:200px;margin:0}.hero .cta-row{flex:none;margin:0}.nav{padding-top:calc(22px + var(--safe-top));padding-bottom:22px}.btn-primary{min-height:48px;padding:0 22px}.btn-secondary{min-height:44px;font-size:inherit;padding:0 18px}.play-btn{width:52px;height:52px}.vinyl{width:min(240px,70%)}}