@import"https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600;700&family=Source+Han+Sans+SC:wght@400;500;600&display=swap";:root{color-scheme:dark;font-family:Source Han Sans SC,PingFang SC,Microsoft YaHei,sans-serif;color:#f7f0df;background:#03091b;font-synthesis:none;--gold:#f5d59a;--muted:#a8abc0;--panel:#111a3ae8;--line:#ffffff18}*{box-sizing:border-box}html{background:#03091b;scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 72% -5%,#242764 0,transparent 25%),#03091b}button,input,textarea{font:inherit}button{color:inherit}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.app-shell{min-height:100vh;padding-bottom:100px;overflow:hidden}.app-shell>audio{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.site-header{height:112px;padding:24px clamp(22px,5vw,64px);display:flex;justify-content:space-between;align-items:flex-start;position:relative;z-index:5;background:linear-gradient(180deg,#03091bf2,transparent)}.brand strong{display:block;font-family:"Noto Serif SC",serif;color:#fff1ce;font-size:clamp(36px,7vw,54px);font-weight:500;letter-spacing:-3px;line-height:1}.brand span{display:block;margin-top:10px;font-family:"Noto Serif SC",serif;font-size:13px;letter-spacing:3px;color:#d8c9aa}.header-actions{display:flex;gap:10px}.icon-button{width:44px;height:44px;border:0;background:transparent;display:grid;place-items:center;border-radius:50%;cursor:pointer}.icon-button:hover{background:#ffffff12}.icon-button svg{width:26px;height:26px}.date-section{padding:4px clamp(20px,5vw,64px) 18px;position:relative;z-index:4}.month-row{max-width:720px;margin:auto;display:flex;align-items:center;justify-content:center;gap:28px;font-family:"Noto Serif SC",serif}.month-row strong{font-size:18px;font-weight:500}.month-row button{width:36px;height:36px;background:transparent;border:0;display:grid;place-items:center;cursor:pointer;color:#c6bfd0}.date-strip{max-width:720px;margin:12px auto 0;display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.date-strip button{min-width:0;height:66px;border:0;border-radius:34px;color:#ddd8d4;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;cursor:pointer}.date-strip b{font-family:"Noto Serif SC",serif;font-size:21px;font-weight:500}.date-strip span{font-size:11px;color:#aaa9b5}.date-strip button.active{color:#051029;background:radial-gradient(circle at 35% 28%,#fff8df,#e7bd75 75%);box-shadow:0 8px 28px #d3a86442}.date-strip button.active span{color:#534425}.content-grid{max-width:1180px;margin:auto}.hero{min-height:700px;background-size:cover;background-position:center;position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:42px 24px 28px}.hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(3,8,25,.3),transparent 70%);pointer-events:none}.hero-copy,.player-card{position:relative;z-index:1}.hero-copy{max-width:520px}.eyebrow{display:inline-flex;padding:7px 14px;border:1px solid #e8c47d;border-radius:999px;color:#f2cf8b;font-size:13px}.hero h1{margin:18px 0 14px;max-width:7em;font-family:"Noto Serif SC",serif;font-size:clamp(40px,10vw,66px);font-weight:500;line-height:1.24;letter-spacing:2px}.hero p{margin:0;max-width:34em;font-family:"Noto Serif SC",serif;font-size:15px;line-height:2;color:#e4e1e0}.story-meta{display:flex;gap:14px;align-items:center;margin-top:16px;color:#e0ceb0;font-size:13px}.story-meta i{width:1px;height:15px;background:#ffffff40}.player-card{display:grid;grid-template-columns:60px 1fr 48px;align-items:center;gap:13px;margin-top:28px;padding:14px;border:1px solid #a9a8d055;border-radius:22px;background:linear-gradient(145deg,#1a2247e8,#0c1430f2);box-shadow:0 18px 50px #0008;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.play-main{width:58px;height:58px;border:0;border-radius:50%;display:grid;place-items:center;color:#081229;background:radial-gradient(circle at 35% 25%,#fff7d7,#e9b965);cursor:pointer;box-shadow:0 8px 28px #dcae6652}.play-main svg{width:22px;height:22px}.waveform{height:34px;display:flex;align-items:center;gap:2px;min-width:0;overflow:hidden}.waveform i{flex:1;max-width:4px;min-width:1px;border-radius:2px;background:#8990a759}.waveform i.active{background:#f0c979;box-shadow:0 0 6px #f0c97988}.waveform-wrap{position:relative}.waveform-wrap input[type=range]{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:34px;margin:0;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;touch-action:none}.waveform-wrap input[type=range]::-webkit-slider-runnable-track{height:34px;background:transparent}.waveform-wrap input[type=range]::-webkit-slider-thumb{width:12px;height:12px;margin-top:11px;border:2px solid #fff4d0;border-radius:50%;-moz-appearance:none;appearance:none;-webkit-appearance:none;background:#eabf72;box-shadow:0 0 10px #eabf72aa}.waveform-wrap input[type=range]::-moz-range-track{height:34px;background:transparent}.waveform-wrap input[type=range]::-moz-range-thumb{width:12px;height:12px;border:2px solid #fff4d0;border-radius:50%;background:#eabf72;box-shadow:0 0 10px #eabf72aa}.waveform-wrap:focus-within{border-radius:7px;outline:2px solid var(--gold);outline-offset:3px}.player-progress>div{display:flex;justify-content:space-between;color:#ddd9d7;font-size:11px}.player-progress small{display:block;margin-top:3px;color:#ffd2aa;font-size:10px;white-space:nowrap}.queue-button{background:transparent;border:0;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:10px;color:#d7d2d0;cursor:pointer}.queue-button svg{width:24px;height:24px}.timeline-section{padding:32px 22px 28px;background:linear-gradient(180deg,#071027,#03091b)}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-title h2{margin:0;font-family:"Noto Serif SC",serif;font-size:22px;font-weight:500}.section-title button{display:flex;align-items:center;gap:2px;color:#9698a8;border:0;background:transparent;cursor:pointer;font-size:13px}.timeline-list{position:relative}.timeline-list:before{content:"";position:absolute;left:72px;top:26px;bottom:28px;width:1px;background:linear-gradient(#e7bf75,#6f748b 22%,#6f748b 80%,transparent)}.timeline-list article{min-height:100px;display:grid;grid-template-columns:54px 14px 88px 1fr 34px;gap:10px;align-items:center;position:relative;cursor:pointer;border-bottom:1px solid var(--line)}.timeline-date{display:flex;flex-direction:column;gap:5px}.timeline-date b{font-family:"Noto Serif SC",serif;font-size:16px;color:#e6d6b3}.timeline-date span,.timeline-copy span{color:#8f93a6;font-size:12px}.timeline-dot{width:10px;height:10px;border:2px solid #74798d;border-radius:50%;background:#071027;position:relative;z-index:1}article.active .timeline-dot{border-color:#ffe0a0;background:#ffe0a0;box-shadow:0 0 13px #ffc96f}.timeline-list img{width:88px;height:68px;object-fit:cover;border-radius:13px;border:1px solid #8388a05c}.timeline-copy{min-width:0}.timeline-copy h3{margin:0 0 7px;font-family:"Noto Serif SC",serif;font-size:15px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.timeline-list article>button{width:32px;height:32px;border-radius:50%;border:1px solid #9498aa;background:transparent;display:grid;place-items:center;cursor:pointer;color:#d8d9df}.timeline-list article>button .waveform{width:26px;gap:1px}.timeline-list article>button .waveform i{min-width:2px}.bottom-nav{position:fixed;z-index:20;left:0;right:0;bottom:0;height:82px;padding:8px 8px max(8px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,1fr);align-items:end;border-top:1px solid #ffffff13;background:#060d20f4;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}.bottom-nav button{height:58px;border:0;background:transparent;display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;color:#9497a8;cursor:pointer;font-size:11px}.bottom-nav svg{width:24px;height:24px}.bottom-nav .active{color:#f5cf8b}.bottom-nav .upload-nav{color:#ede6dd;overflow:visible}.bottom-nav .upload-nav i{width:50px;height:50px;margin-top:-28px;display:grid;place-items:center;color:#071026;border-radius:50%;background:linear-gradient(145deg,#fff1c5,#e6ae59);box-shadow:0 8px 24px #0008}.bottom-nav .upload-nav i svg{width:30px;height:30px}.modal-backdrop{position:fixed;z-index:50;top:0;right:0;bottom:0;left:0;padding:16px;display:flex;align-items:flex-end;justify-content:center;background:#01040db8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.upload-modal{width:min(100%,560px);max-height:92vh;overflow:auto;border:1px solid #8d8db24f;border-radius:28px 28px 20px 20px;background:linear-gradient(160deg,#151d40,#080f27 72%);box-shadow:0 28px 80px #000b;animation:slideUp .32s ease-out}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}}.modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:22px 22px 12px}.modal-header span{color:#d8bc83;font-size:12px;letter-spacing:2px}.modal-header h2{margin:5px 0 0;font-family:"Noto Serif SC",serif;font-size:26px;font-weight:500}.steps{padding:0 22px 18px;display:flex;align-items:center;gap:7px;color:#777b90;font-size:12px}.steps i{width:24px;height:24px;border:1px solid #6f748a;border-radius:50%;display:grid;place-items:center;font-style:normal}.steps i.done,.steps i.active{border-color:#e7bd72;background:#e7bd72;color:#071027}.steps em{flex:1;height:1px;background:#454a62}.steps span.active{color:#f3dcad}.form-body,.audio-body{padding:4px 22px 20px}.form-body{display:grid;gap:16px}.form-body label{display:grid;gap:8px;color:#bbb9c5;font-size:13px}.form-body input,.form-body textarea{width:100%;border:1px solid #74789352;border-radius:12px;background:#070d22b8;color:#f5f0e6;padding:13px 14px;resize:none}.form-body input::placeholder,.form-body textarea::placeholder{color:#6f7386}.dropzone{width:100%;min-height:144px;border:1px dashed #d6b67278;border-radius:18px;background:#0a112b;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:pointer;color:#ddd9d2}.dropzone svg{width:34px;height:34px;color:#e7c37e}.dropzone strong{font-weight:500}.dropzone span{color:#81869b;font-size:11px}.file-list{margin-top:16px}.file-list-title{display:flex;justify-content:space-between;margin-bottom:8px;color:#9699a9;font-size:11px}.audio-file{display:grid;grid-template-columns:18px 30px 1fr 34px;align-items:center;gap:8px;min-height:60px;border-top:1px solid var(--line)}.audio-file>svg{color:#686d82;cursor:grab}.track-number{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#222b4c;color:#e9c984;font-size:12px}.audio-file div{min-width:0;display:flex;flex-direction:column;gap:4px}.audio-file strong{font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.audio-file div span{color:#878b9e;font-size:11px}.audio-file button{border:0;background:transparent;color:#9498aa;cursor:pointer}.modal-actions{position:sticky;bottom:0;display:flex;gap:10px;padding:14px 22px 20px;border-top:1px solid var(--line);background:#091027f5}.modal-actions button{min-height:48px;border-radius:14px;padding:0 18px;cursor:pointer}.modal-actions .primary{flex:1;border:0;color:#061027;font-weight:600;background:linear-gradient(145deg,#fff0bf,#e4ad59)}.modal-actions .primary:disabled{filter:grayscale(1);opacity:.4;cursor:not-allowed}.modal-actions .secondary{border:1px solid #767b92;background:transparent;color:#d0d0d6}@media(min-width:820px){.app-shell{padding-bottom:90px}.site-header{max-width:1180px;height:132px;margin:auto;padding-left:0;padding-right:0}.date-section{max-width:1180px;margin:auto;padding-left:0;padding-right:0}.content-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,.78fr);border:1px solid #ffffff12;border-radius:28px;overflow:hidden;box-shadow:0 40px 100px #0008}.hero{min-height:690px;padding:50px}.timeline-section{padding:36px 26px}.timeline-list article{grid-template-columns:48px 12px 72px 1fr 32px}.timeline-list:before{left:64px}.timeline-list img{width:72px;height:58px}.bottom-nav{left:50%;right:auto;top:22px;bottom:auto;transform:translate(-50%);width:min(620px,56vw);height:68px;border:1px solid #ffffff20;border-radius:22px}.bottom-nav .upload-nav i{width:46px;height:46px;margin-top:0}.modal-backdrop{align-items:center}.upload-modal{border-radius:28px}}@media(max-width:420px){.site-header{height:102px;padding:20px 18px}.brand strong{font-size:35px}.brand span{font-size:11px;letter-spacing:2px}.header-actions{gap:0}.date-section{padding-left:10px;padding-right:10px}.date-strip b{font-size:18px}.hero{min-height:470px;padding:24px 20px 18px}.hero h1{margin:12px 0 8px;font-size:36px;line-height:1.2}.hero p{font-size:13px;line-height:1.75}.story-meta{margin-top:10px}.player-card{margin-top:14px;padding:10px}.timeline-section{padding-left:16px;padding-right:16px}.timeline-list article{grid-template-columns:48px 12px 72px 1fr 30px;gap:7px}.timeline-list:before{left:59px}.timeline-list img{width:72px;height:56px}.timeline-copy h3{font-size:14px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}}