.rainy-journey{position:fixed;inset:0;margin:0;padding:0;width:100vw;height:100dvh;max-width:none;max-height:none;border:0;background:#070b0e;color:#f5f0e4;overflow:hidden;font:12px/1.5 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;isolation:isolate}
.rainy-journey::backdrop{background:#070b0e}
.rainy-journey [hidden]{display:none!important}
.rainy-film-frame{--film-ratio:2.39;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(100vw,calc(100dvh * var(--film-ratio)));aspect-ratio:var(--film-ratio);max-height:100dvh;isolation:isolate}
.rainy-film{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#070b0e;outline:none}
.rainy-subtitles{position:absolute;z-index:1;left:8%;right:8%;bottom:7%;pointer-events:none;text-align:center;color:#fff6dd;text-shadow:0 1px 2px #000,0 0 5px #000b;filter:drop-shadow(0 1px 1px #0007)}
.rainy-subtitles p{margin:0;line-height:1.35;font-weight:400}
.rainy-subtitles [lang=zh-CN]{font-family:'Songti SC','Noto Serif CJK SC','STSong',serif;font-size:clamp(12px,1.7vw,24px);letter-spacing:.06em}
.rainy-subtitles [lang=en]{margin-top:4px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(11px,1.4vw,20px);font-style:italic;letter-spacing:.01em}
.rainy-film::cue{opacity:0}
.rainy-journey button{font:inherit;letter-spacing:.01em;color:inherit;cursor:pointer;min-height:44px;border:1px solid #e2dac12b;border-radius:4px;background:#09121680;backdrop-filter:blur(12px);padding:10px 16px;transition:background .25s,border-color .25s}
.rainy-journey button:hover{background:#304044b8;border-color:#e4d4b86b}
.rainy-journey button:focus-visible{outline:2px solid #e2cba4;outline-offset:4px}
.rainy-toolbar{position:absolute;top:max(24px,env(safe-area-inset-top));left:max(28px,env(safe-area-inset-left));right:max(28px,env(safe-area-inset-right));display:flex;justify-content:space-between;align-items:center;gap:20px;z-index:3;pointer-events:none;transition:opacity .7s}
.rainy-toolbar button{pointer-events:auto}
.rainy-journey .rainy-icon{width:44px;padding:11px;line-height:1;font-size:17px}
.rainy-icon svg{width:20px;height:20px;display:block}
.rainy-toolbar [aria-pressed=true] .rainy-mute,.rainy-toolbar [aria-pressed=false] .rainy-waves{display:none}
.rainy-film-controls{position:absolute;bottom:max(24px,env(safe-area-inset-bottom));right:max(28px,env(safe-area-inset-right));display:flex;align-items:center;gap:18px;z-index:3;transition:opacity .7s}
.rainy-progress{height:2px;width:min(180px,30vw);background:#e7ddd22b;overflow:hidden}
.rainy-progress i{display:block;height:100%;width:100%;background:#e4d3b4;transform:scaleX(0);transform-origin:left;transition:transform .2s linear}
.rainy-journey.is-quiet .rainy-toolbar:not(:focus-within),.rainy-journey.is-quiet .rainy-film-controls:not(:focus-within){opacity:0;pointer-events:none}
.rainy-journey.is-quiet .rainy-toolbar:not(:focus-within) button{pointer-events:none}
.rainy-film-center,.rainy-film-end,.rainy-film-error{position:absolute;inset:0;z-index:2;display:flex;justify-content:center;align-items:center;gap:14px;background:linear-gradient(0deg,#02070b66,#02070b0d)}
.rainy-film-center button{display:flex;align-items:center;gap:13px;min-height:56px;padding:12px 24px;border-color:#e2dac14d;border-radius:40px;background:#13202a9c}
.rainy-film-center svg{width:19px;height:19px;fill:currentColor}
.rainy-film-end{background:#060b11aa}
.rainy-film-end button{min-width:115px}
.rainy-film-error{flex-direction:column;background:#0b131a}
.rainy-film-error p{font:16px/1.6 Georgia,serif;color:#d6d4cb}
.rainy-film-loading{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none;background:#08111b26}
.rainy-film-loading>span:first-child{width:54px;height:1px;background:linear-gradient(90deg,transparent,#d8c29d,transparent);animation:rainy-loading 1.5s ease-in-out infinite}
@keyframes rainy-loading{50%{opacity:.2;transform:scaleX(.55)}}
.rainy-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:700px){.rainy-toolbar{top:max(14px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right))}.rainy-film-controls{right:max(14px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom))}.rainy-progress{width:100px}.rainy-toolbar button{font-size:11px}.rainy-film-end{gap:10px}}
@media(prefers-reduced-motion:reduce){.rainy-toolbar,.rainy-film-controls,.rainy-progress i{transition:none}.rainy-film-loading>span:first-child{animation:none}}
