:root{color-scheme:light;--red:#961e13;--cream:#faeed7;--paper:#f8eedb;--serif:"Songti SC","STSong","SimSun",serif;--sans:"PingFang SC","Microsoft YaHei",system-ui,sans-serif}
*{box-sizing:border-box}html{min-width:280px;background:var(--paper)}body{margin:0;color:var(--red);font-family:var(--serif);-webkit-font-smoothing:antialiased}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,video:focus-visible{outline:3px solid #bd842d;outline-offset:7px}[hidden]{display:none!important}h1,h2,p{margin:0}img{display:block;max-width:100%;height:auto}::selection{background:var(--red);color:var(--cream)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.showcase{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow:hidden}.scenery{position:absolute;inset:0;z-index:-2;pointer-events:none}.scenery img{width:100%;height:100%;object-fit:cover;object-position:center bottom}.presentation{display:grid;grid-template-columns:32% minmax(0,1fr);gap:4.8%;align-items:center;width:min(91%,1660px);margin:0 auto;padding-top:clamp(82px,12.5vh,160px);padding-bottom:195px;flex:1;align-content:start}.heading{text-align:center;min-width:0}.festival{width:79%;margin:0 auto 16px}.festival img{width:100%}h1{width:100%;font-size:inherit;line-height:0}h1 picture,h1 img{display:block;width:100%}.subtitle{width:83%;margin:7px auto 0;line-height:0}.subtitle img{width:100%}
.video-section{min-width:0;position:relative}.video-frame{padding:5px;border:1px solid #c59a54;border-radius:5px;background:#f6e4bd;box-shadow:0 0 0 1px #f9eddb,0 2px 16px #78492208}.video-stage{position:relative;aspect-ratio:16/9;background:#801b14;overflow:hidden;border:1px solid #d3b371;border-radius:2px}.video-stage video{width:100%;height:100%;display:block;object-fit:contain;background:#18100d}.video-cover{border:0;color:#f9e5bd;position:absolute;inset:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#8c1c15 url("assets/video-poster.webp") center/cover;padding:16px;transition:filter .2s}.video-cover:hover{filter:brightness(1.06)}.video-cover:focus-visible{outline-offset:-8px;outline-color:#fae7bd}.video-title{display:block;width:47%;line-height:0}.video-title img{width:100%}.video-title.custom-title{width:90%;font-family:"STKaiti","KaiTi",var(--serif);font-size:clamp(24px,3.3vw,52px);line-height:1.4;overflow-wrap:anywhere}.play-button{display:grid;place-items:center;width:clamp(64px,7.55vw,132px);aspect-ratio:1;border-radius:50%;margin:clamp(13px,1.3vw,25px) 0 8px;background:linear-gradient(135deg,#fff3d1,#e5d1ad);box-shadow:0 4px 25px #3e080915;transition:transform .2s,box-shadow .2s}.play-button>span{display:block;width:0;height:0;border-top:clamp(13px,1.7vw,29px) solid transparent;border-bottom:clamp(13px,1.7vw,29px) solid transparent;border-left:clamp(21px,2.8vw,48px) solid #920d07;margin-left:8%}.video-cover:hover .play-button{transform:scale(1.045);box-shadow:0 4px 30px #facb7630}.play-label{display:block;width:19%;font-size:clamp(13px,1.4vw,24px);line-height:1.4;white-space:nowrap}.play-label img{width:100%}.loading-status{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);padding:10px 18px;border-radius:4px;background:#291309cc;color:#fff1d8;font-family:var(--sans);font-size:12px;pointer-events:none}.video-feedback{position:absolute;top:calc(100% + 9px);left:8px;right:8px;display:flex;align-items:center;justify-content:center;gap:14px;color:#89533a;font-family:var(--sans);font-size:11px;line-height:1.8;text-align:center}.video-feedback p{padding:2px 7px;background:#fcf2dacf;border-radius:2px}.video-feedback button{border:0;background:#f8eddbd9;color:var(--red);font-size:11px;padding:7px 4px;white-space:nowrap;text-decoration:underline;text-underline-offset:4px}
.closing{position:relative;margin:auto auto 0;width:100%;display:flex;align-items:center;flex-direction:column;padding:20px 20px max(25px,env(safe-area-inset-bottom));background:linear-gradient(transparent,#f8eedb4f)}.closing p{width:min(37vw,650px);line-height:0}.closing p img{width:100%}.closing>picture{display:block;width:min(23vw,400px);margin-top:5px;line-height:0}.closing .anniversary{width:100%}
.video-dialog{width:min(420px,calc(100% - 36px));max-height:calc(100svh - 40px);padding:35px 30px 28px;color:#744b32;background:#fbf2e1;border:1px solid #d6b37a;border-radius:5px;box-shadow:0 16px 60px #2512094f;text-align:center}.video-dialog::backdrop{background:#28170f99;backdrop-filter:blur(5px)}.close-dialog{position:absolute;right:8px;top:7px;width:38px;height:38px;border:0;background:none;font:29px/1 var(--sans);color:#9a7353}.close-dialog:hover{color:var(--red)}.dialog-star{color:#aa7034;font-size:20px;display:block;margin-bottom:15px}.video-dialog h2{font-size:25px;font-weight:400;line-height:1.5}.video-dialog p{font-family:var(--sans);font-size:12px;line-height:1.9;margin:15px 0 23px}.choose-button{display:block;min-height:46px;width:100%;background:var(--red);color:#fff0d2;border:1px solid var(--red);border-radius:3px;font-family:var(--sans);font-size:13px;letter-spacing:1px}.choose-button:hover{background:#7a1b11}.video-dialog small{font-family:var(--sans);font-size:10px;line-height:1.8;display:block;margin-top:16px;color:#9c7e5b}
@media(min-width:761px) and (max-height:760px){.presentation{padding-top:60px;padding-bottom:150px}.festival{margin-bottom:10px}.subtitle{margin-top:2px}.closing{padding-block:15px}}
@media(min-width:761px) and (max-width:1050px){.presentation{width:92%;gap:3.5%;grid-template-columns:34% minmax(0,1fr);padding-top:90px}.festival{margin-bottom:10px}.subtitle{margin-top:5px}.play-button{width:7.5vw;margin-block:13px 6px}.closing p{width:49vw}.closing>picture{width:30vw}}
@media(max-width:760px){.showcase{min-height:max(100svh,176vw)}.scenery img{object-fit:cover;object-position:center bottom}.presentation{display:flex;flex-direction:column;align-items:stretch;flex:none;width:89%;padding-top:clamp(34px,8.5vw,58px);padding-bottom:0;gap:0}.heading{width:100%;margin-bottom:clamp(22px,5.4vw,40px)}.festival{width:58%;margin-bottom:20px}h1{width:100%}h1 img{aspect-ratio:852/184}.subtitle{width:85%;margin-top:13px}.subtitle img{aspect-ratio:639/44}.video-frame{padding:4px;border-radius:3px}.video-stage{aspect-ratio:16/9}.video-title{width:52%}.video-title.custom-title{font-size:clamp(22px,6vw,40px)}.video-cover{padding:10px}.play-button{width:clamp(48px,13vw,88px);margin:clamp(9px,2.5vw,17px) 0 clamp(6px,1.5vw,10px)}.play-button>span{border-top:clamp(12px,3.1vw,20px) solid transparent;border-bottom:clamp(12px,3.1vw,20px) solid transparent;border-left:clamp(19px,5vw,33px) solid #920d07}.play-label{width:22%;font-size:12px}.video-feedback{font-size:9px;line-height:1.8;gap:7px;top:calc(100% + 7px);left:0;right:0}.video-feedback p{padding:2px 5px}.video-feedback button{font-size:9px}.closing{margin-top:auto;padding:24px 12px max(21px,env(safe-area-inset-bottom))}.closing p{width:min(93vw,620px)}.closing>picture{width:clamp(140px,42vw,250px);margin-top:5px}.closing .anniversary{aspect-ratio:287/65}.video-dialog{padding:32px 23px 25px}.video-dialog h2{font-size:23px}.loading-status{font-size:10px;white-space:nowrap}}
@media(max-width:360px){.presentation{width:90%;padding-top:33px}.festival{margin-bottom:17px}.subtitle{margin-top:11px}.heading{margin-bottom:21px}.play-button{width:43px;margin:8px 0 6px}.play-label{font-size:10px}.closing{padding-bottom:18px}}
@media(max-height:480px) and (min-width:761px){.showcase{min-height:590px}.presentation{padding-top:52px;padding-bottom:100px}.closing{padding-block:15px}.scenery img{object-position:center bottom}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}