.event-intro[hidden] { display:none!important; }
.event-intro { --sky:#15191b;--ink:#f5f5f4;position:fixed;inset:0;z-index:1000;display:flex;justify-content:center;background:var(--sky);height:100dvh; }
.event-intro[data-theme="day"] { --sky:#f2e2cb;--ink:#242424; }
.event-intro .intro-canvas { position:relative;width:min(100%,480px);height:100%;isolation:isolate;overflow:hidden;color:var(--ink);background:var(--sky); }
.event-intro .intro-art { position:absolute;bottom:0;left:50%;width:auto;height:auto;max-width:100%;max-height:100%;transform:translateX(-50%);object-fit:contain;object-position:center bottom;z-index:-1;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 96px);mask-image:linear-gradient(to bottom,transparent,#000 96px); }
.event-intro .brand-space { position:absolute;top:max(calc(env(safe-area-inset-top) + 12px),6%);left:20px;right:20px;display:flex;flex-direction:column;align-items:center; }
.event-intro .visually-hidden { position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
.event-intro .intro-emblem { display:block;position:relative;width:min(82vw,39.55svh,360px);aspect-ratio:1070/1082; }
.event-intro .intro-slogan { position:absolute;inset:0;animation:cbtmc-intro-arrive 680ms ease-out 120ms both; }
.event-intro .intro-slogan-image,.event-intro .intro-brand-image { display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain; }
.event-intro .intro-slogan-image { clip-path:inset(0 0 15% 0); }
.event-intro .intro-brand-image { clip-path:inset(85% 0 0 0);animation:cbtmc-intro-arrive 680ms ease-out 1050ms both; }
.event-intro .intro-seal-image { position:absolute;left:48.1308411215%;top:73.7523105360%;width:3.8317757009%;height:auto;animation:cbtmc-intro-arrive 500ms ease-out 500ms both; }
.event-intro[data-theme="day"] :is(.intro-slogan-image,.intro-brand-image) { filter:brightness(.12); }
.event-intro:not([data-ready]) :is(.intro-slogan,.intro-brand-image,.intro-seal-image) { animation:none;opacity:0; }
.event-intro button:focus-visible { outline:2px solid #f97316;outline-offset:3px; }
@keyframes cbtmc-intro-arrive { from { opacity:0;transform:translateY(10px); } to { opacity:1;transform:translateY(0); } }
@media(prefers-reduced-motion:reduce) { .event-intro :is(.intro-slogan,.intro-brand-image,.intro-seal-image) { animation:none; } }
