:root{font-family:"PingFang SC","Microsoft YaHei",sans-serif;color:#234e51;background:#e6ede9;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:18px}.stage{width:min(1440px,100%);aspect-ratio:16/9;position:relative;overflow:hidden;border-radius:20px;background:#e8f0e3;box-shadow:0 22px 70px #244b4c20;container-type:inline-size}.scenery{position:absolute;inset:0;pointer-events:none}.coastal-scene{width:100%;height:100%;object-fit:cover}.wash{position:absolute;inset:0;background:linear-gradient(#eef4e7f2 0%,#eef4e7d9 60%,#eef4e780 80%,transparent)}header{position:absolute;top:5.5%;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:1cqw;font-weight:700;letter-spacing:.22em;color:#62847d}h1{margin:.65cqw 0 0;font-size:3cqw;letter-spacing:.04em;font-weight:650}h1 span{font-size:1.45cqw;display:inline-block;margin-left:1.4cqw;padding-left:1.4cqw;border-left:1px solid #a4bbae;font-weight:400}.period{font-size:1.15cqw;line-height:1.8;text-align:right;color:#617f79}.period strong{display:block;color:#325f5c;font-size:1.25cqw;font-weight:500;letter-spacing:.05em}.members{position:absolute;top:23%;left:5%;right:5%;height:55%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:1cqw}.member{position:relative;background:#ffffffd9;border:1px solid #ffffffed;border-radius:1cqw;padding:1cqw;display:grid;grid-template-columns:3.7cqw minmax(0,1fr);gap:.8cqw;align-content:center;box-shadow:0 4px 18px #36625a08;transition:background .7s,box-shadow .7s,transform .7s}.member img{width:3.7cqw;height:3.7cqw;object-fit:cover;border-radius:50%;border:2px solid #fff;box-shadow:0 2px 8px #36625a20}.member h2{font-size:1.3cqw;margin:0 0 .38cqw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650}.counts{font-size:1.03cqw;line-height:1.75;white-space:nowrap;color:#4e716b}.counts b{font-weight:650;color:#28554f}.member .line{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #dce8df;padding-top:.45cqw;margin-top:.15cqw;font-size:.91cqw;color:#718980}.member .line strong{color:#317266;font-weight:600}.member.lit{background:#fff6da;box-shadow:0 0 0 2px #e5be6880,0 8px 25px #c59b3020;transform:translateY(-2px)}footer{position:absolute;left:5%;right:5%;bottom:5%;display:flex;justify-content:space-between;align-items:center}.foot-copy>span{font-size:1.45cqw;font-weight:600}.foot-copy p{margin:.55cqw 0 0;font-size:.85cqw;color:#657c6e}.mvp{text-align:right;padding:1cqw 1.5cqw;border-left:2px solid #cba852;background:#fff9e6bb;border-radius:0 .6cqw .6cqw 0}.mvp span{display:block;font-size:.8cqw;letter-spacing:.2em;color:#a1823f}.mvp strong{display:block;font-size:1.3cqw;font-weight:500;margin-top:.3cqw}.controls{position:absolute;right:5%;bottom:1%;display:flex;gap:.8cqw;opacity:.6;transition:opacity .2s}.controls:hover,.controls:focus-within{opacity:1}button{font:inherit;font-size:.85cqw;border:0;border-radius:20px;padding:.35cqw .8cqw;color:#315c53;background:#ffffffc9;cursor:pointer}button:focus-visible{outline:2px solid #315c53;outline-offset:2px}.orientation{display:none;font-size:13px;color:#5d7d71}.stage:fullscreen{width:min(100vw,177.7778vh);height:auto;aspect-ratio:16/9;margin:auto;border-radius:0}.stage::backdrop{background:#e6ede9}#rider{transform:translate(900px,353px) scale(.23);transform-box:view-box}#shadow{opacity:0}.scenery #birds,.scenery #clouds{opacity:.45}
#rider{transform:translate(460px,465px) scale(.23)}
.intro{position:absolute;inset:0;z-index:8;padding:7% 6%;background:linear-gradient(90deg,#eaf1e4e8 0%,#eef3e4a8 43%,transparent 72%);transition:opacity .8s ease,visibility .8s}.intro-copy{max-width:44%}.intro-kicker{font-size:1.05cqw;letter-spacing:.24em;font-weight:700;color:#4c7b70}.intro h2{margin:1.25cqw 0 .8cqw;font-size:4.7cqw;line-height:1.12;letter-spacing:.02em;color:#214f50}.intro p{font-size:1.25cqw;color:#557a70}.enter{position:absolute;left:6%;bottom:8%;display:flex;align-items:flex-start;flex-direction:column;gap:.3cqw;padding:1cqw 1.55cqw;border-radius:999px;background:#245f59;color:#fff;box-shadow:0 12px 30px #17453c33;font-size:1.05cqw;opacity:1}.enter small{font-size:.72cqw;color:#d9ece5;letter-spacing:.05em}.stage.is-ready header,.stage.is-ready .members,.stage.is-ready footer,.stage.is-ready .controls{opacity:0;visibility:hidden}.stage.is-ready #rider{transform:translate(290px,120px) scale(.72)}.stage.is-ready .wash{background:linear-gradient(90deg,#eef4e7c9,transparent 75%)}.stage.is-playing .intro{opacity:0;visibility:hidden}.stage.is-playing header,.stage.is-playing .members,.stage.is-playing footer,.stage.is-playing .controls{animation:revealWall .9s 4.3s both}.stage.is-playing .member{opacity:0;transform:translateY(18px);animation:cardIn .65s both}.stage.is-playing #rider{animation:pelicanOpening 4.1s cubic-bezier(.22,.65,.35,1) both}.stage.is-playing .wash{animation:washIn 1s 3.8s both}@keyframes pelicanOpening{0%{transform:translate(-520px,110px) scale(.72)}12%{transform:translate(-350px,105px) scale(.72)}75%{transform:translate(350px,105px) scale(.72)}100%{transform:translate(460px,465px) scale(.23)}}@keyframes revealWall{from{opacity:0;visibility:visible;transform:translateY(12px)}to{opacity:1;visibility:visible;transform:none}}@keyframes cardIn{to{opacity:1;transform:none}}@keyframes washIn{from{background:transparent}to{background:linear-gradient(#eef4e7f2 0%,#eef4e7d9 60%,#eef4e780 80%,transparent)}}.stage.show-wall .intro{display:none}.stage.show-wall header,.stage.show-wall .members,.stage.show-wall footer,.stage.show-wall .controls{opacity:1;visibility:visible}.stage.show-wall #rider{transform:translate(460px,465px) scale(.23)}
@media(orientation:portrait){body{padding:12px}.stage{width:100%}.orientation{display:block;text-align:center;line-height:1.5}button{font-size:12px;padding:5px 8px}.controls{bottom:auto;top:100%;margin-top:10px;right:0;left:0;justify-content:center}.stage{overflow:visible}.scenery,.wash{overflow:hidden;border-radius:20px}.orientation{margin-top:52px}body.landscape-mode{padding:0;overflow:hidden;background:#e6ede9}body.landscape-mode .stage{position:fixed;left:50%;top:50%;width:min(100svh,177.7778vw);max-width:none;transform:translate(-50%,-50%) rotate(90deg);overflow:hidden;border-radius:0}body.landscape-mode .scenery,body.landscape-mode .wash{border-radius:0}body.landscape-mode .controls{left:auto;right:5%;top:auto;bottom:1%;margin-top:0}body.landscape-mode .orientation{display:none}}@media(orientation:landscape){body.landscape-mode{padding:0;overflow:hidden}body.landscape-mode .stage{width:min(100vw,177.7778svh);border-radius:0}body.landscape-mode .orientation{display:none}}@media(prefers-reduced-motion:reduce){.member{transition:none}}
.journey-signs,.story-lines{position:absolute;inset:0;z-index:7;pointer-events:none}.road-sign{position:absolute;display:flex;align-items:center;gap:.65cqw;padding:.48cqw .95cqw .48cqw .52cqw;border:1px solid #efd08a;border-radius:999px;background:#fff8ddf2;box-shadow:0 .55cqw 1.4cqw #345b4d24;color:#345c57;font-size:1cqw;font-weight:650;opacity:0;white-space:nowrap}.road-sign img{width:2.2cqw;height:2.2cqw;border-radius:50%;object-fit:cover;border:2px solid #fff}.stage.is-playing .intro{pointer-events:none;animation:introOut .65s 1.75s both}.stage.is-playing .enter{opacity:0}.stage.is-playing header,.stage.is-playing .members,.stage.is-playing footer,.stage.is-playing .controls{animation-delay:8.9s}.stage.is-playing #rider{animation-name:pelicanJourney;animation-duration:8.5s}.stage.is-playing .wash{animation-delay:8.35s}.stage.is-playing .road-sign{animation:signGlow 2.15s var(--delay) both}.story-lines span{position:absolute;padding:.72cqw 1.35cqw;border-radius:999px;background:#245f59e8;color:#fff;font-size:1.12cqw;font-weight:600;letter-spacing:.03em;box-shadow:0 .6cqw 1.8cqw #1b50452e;opacity:0}.story-lines span:nth-child(1){left:7%;top:18%}.story-lines span:nth-child(2){right:7%;top:25%}.story-lines span:nth-child(3){left:12%;top:38%}.story-lines span:nth-child(4){right:10%;top:43%}.stage.is-playing .story-lines span{animation:storyFloat 1.8s both}.stage.is-playing .story-lines span:nth-child(1){animation-delay:3s}.stage.is-playing .story-lines span:nth-child(2){animation-delay:4.15s}.stage.is-playing .story-lines span:nth-child(3){animation-delay:5.3s}.stage.is-playing .story-lines span:nth-child(4){animation-delay:6.45s}.stage.show-wall .journey-signs,.stage.show-wall .story-lines{display:none}@keyframes introOut{to{opacity:0;visibility:hidden}}@keyframes pelicanJourney{0%{transform:translate(-520px,110px) scale(.72)}18%{transform:translate(-350px,105px) scale(.72)}78%{transform:translate(380px,105px) scale(.72)}100%{transform:translate(460px,465px) scale(.23)}}@keyframes signGlow{0%{opacity:0;transform:translateY(18px) scale(.94)}22%,70%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-9px) scale(.98)}}@keyframes storyFloat{0%{opacity:0;transform:translateX(-18px)}18%,72%{opacity:1;transform:none}100%{opacity:0;transform:translateX(14px)}}
.mvp{transition:transform .2s,background .2s}.mvp:hover,.mvp:focus-visible{transform:translateY(-2px);background:#fff2c7}.orientation-button{padding:10px 22px;background:#245f59;color:#fff;font-size:15px;font-weight:650;box-shadow:0 8px 22px #17453c26}.mvp-preview{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:#183f3bd9;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}.mvp-preview.is-visible{opacity:1;visibility:visible}.mvp-preview>div{text-align:center;padding:4cqw 7cqw;border:1px solid #f0cf7e;background:#fff8dd;color:#315c53;box-shadow:0 2cqw 6cqw #102f2a50}.mvp-preview span{display:block;font-size:1cqw;letter-spacing:.28em;color:#a1823f}.mvp-preview strong{display:block;margin-top:1cqw;font-size:3cqw;font-weight:650}.mvp-preview p{margin:1cqw 0 1.6cqw;font-size:1.25cqw}.mvp-preview button{background:#245f59;color:#fff;padding:.65cqw 1.2cqw}
@media(orientation:portrait){body{padding:20px 12px 12px;justify-content:flex-start}.orientation{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:56px}.orientation-button{font-size:15px;padding:10px 22px}}