@font-face{font-family:OpeningCormorant;src:url('../assets/fonts/cormorant-garamond-latin-600-normal.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:OpeningInter;src:url('../assets/fonts/inter-latin-500-normal.woff2') format('woff2');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:OpeningInter;src:url('../assets/fonts/inter-latin-600-normal.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
.opening-recent-root{--stage:#24308a;--glow:rgba(170,195,255,.75);position:fixed;inset:0;z-index:10000;overflow:auto;background:var(--stage);color:#F4EEE6;font:500 14px OpeningInter,system-ui,sans-serif;isolation:isolate;display:flex;flex-direction:column}
.opening-recent-root[data-phase=dawn]{--stage:#3a2552;--glow:rgba(255,179,138,.9)}.opening-recent-root[data-phase=dusk]{--stage:#4a1748;--glow:rgba(255,122,69,.85)}.opening-recent-root[data-phase=night]{--stage:#05060f;--glow:rgba(150,110,255,.6)}
.opening-recent-root *{box-sizing:border-box}.opening-recent-root>*{flex-shrink:0}.opening-recent-root [hidden]{display:none!important}
.opening-recent-glow{position:absolute;inset:0;width:100%;height:100%;background:radial-gradient(circle 325px at calc(100% - 50px) 50px,var(--glow) 0%,transparent 70%);opacity:.9;z-index:-1;pointer-events:none}
.opening-recent-icon{position:relative;margin:calc(120px + env(safe-area-inset-top,0px)) auto 0;width:112px;height:112px;border-radius:26px;overflow:hidden;box-shadow:0 16px 32px rgba(0,0,0,.45);opacity:1} /* STABLE-LAYOUT-R1 (P-02): the icon is already on screen (the launch cover draws it here); it never blurs in */.opening-recent-icon img{width:100%;height:100%;display:block}
.opening-recent-hi{margin:24px 16px 0;text-align:center;font:600 32px/1.2 OpeningCormorant,Georgia,serif;opacity:0;animation:openingRise .8s 1s ease-out forwards}
.opening-recent-sub{min-height:14px;margin:8px 12px 0;text-align:center;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(244,238,230,.7);opacity:0;animation:openingRise .8s 1.4s ease-out forwards}
.opening-recent-list{width:100%;margin:30px auto 0;padding:0 24px;max-width:480px;display:flex;flex-direction:column;gap:10px}
.opening-recent-card{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:10px 14px;border-radius:16px;background:rgba(244,238,230,.1);border:1px solid rgba(244,238,230,.2);color:#F4EEE6;text-align:left;font:inherit;cursor:pointer;opacity:0;animation:openingSlide .6s var(--d) cubic-bezier(.2,.7,.2,1) forwards}
.opening-recent-card:hover{background:rgba(244,238,230,.16)}.opening-recent-card:focus-visible,.opening-recent-skip:focus-visible{outline:2px solid #F4EEE6;outline-offset:2px}
.opening-recent-kind{width:36px;height:36px;flex-shrink:0;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--c);color:#1b1a2e}.opening-recent-txt{flex-grow:1;min-width:0}.opening-recent-t1{display:block;font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.opening-recent-t2{display:block;font-size:12px;color:rgba(244,238,230,.75)}.opening-recent-go{color:rgba(244,238,230,.7);font-size:24px;flex-shrink:0}
.opening-recent-skipwrap{margin:auto auto 0;position:relative;width:100%;padding:32px 0 calc(56px + env(safe-area-inset-bottom,0px));display:flex;justify-content:center;opacity:0;animation:openingRise .6s 2.8s ease-out forwards}.opening-recent-skip{min-height:44px;padding:0 18px;border-radius:22px;border:none;background:transparent;color:rgba(244,238,230,.85);font:600 14px OpeningInter,system-ui,sans-serif;cursor:pointer}
@media(max-height:740px){.opening-recent-root{padding-bottom:0}.opening-recent-icon{margin-top:calc(48px + env(safe-area-inset-top,0px))}.opening-recent-skipwrap{padding-bottom:24px}}
@media(max-width:330px){.opening-recent-list{padding:0 12px}.opening-recent-card{padding:10px;gap:8px}.opening-recent-hi{font-size:30px}}
@keyframes openingRise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes openingSlide{from{opacity:0;transform:translateX(-24px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.opening-recent-icon,.opening-recent-hi,.opening-recent-sub,.opening-recent-card,.opening-recent-skipwrap{animation:none;opacity:1}}
.opening-media{min-height:var(--app-h,100dvh);display:flex;flex-direction:column;gap:16px;padding:24px;background:#05060f;color:#F4EEE6}.opening-media img,.opening-media video{max-width:100%;max-height:75dvh;object-fit:contain}.opening-media button{min-height:44px;align-self:flex-start}