:root {
  --ink: #09050f;
  --ink-soft: #130b20;
  --paper: #fcfbff;
  --muted: #afa7bd;
  --pink: #ff2bd6;
  --pink-dark: #9b178e;
  --cyan: #20e7f5;
  --blue: #596aff;
  --violet: #9958ff;
  --yellow: #fff04a;
  --line: rgba(255,255,255,.22);
  --sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; overflow-x: hidden; color: var(--paper); background: var(--ink); font-family: var(--sans); line-height: 1.7; }
a { color: inherit; text-decoration: none; } button, a { font: inherit; } img { max-width: 100%; } 
.page-noise { position: fixed; z-index: 30; inset: 0; pointer-events: none; opacity: .06; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); mix-blend-mode: screen; }
.skip-link { position: fixed; z-index: 100; top: -4rem; left: 1rem; padding: .6rem 1rem; color: var(--ink); background: var(--cyan); }.skip-link:focus { top: 1rem; }

.site-header { position: fixed; z-index: 50; top: 0; left: 0; display: flex; align-items: center; justify-content: space-between; width: 100%; height: 74px; padding: 0 clamp(1rem, 4vw, 4.5rem); border-bottom: 1px solid rgba(255,255,255,.1); background: linear-gradient(180deg, rgba(7,4,13,.94), rgba(7,4,13,.57)); backdrop-filter: blur(13px); }
.brand { display: inline-flex; align-items: center; gap: .8rem; }.brand-mark { position: relative; display: grid; place-items: center; width: 38px; height: 38px; overflow: hidden; border: 1px solid var(--pink); color: var(--cyan); font-size: .72rem; font-weight: 1000; letter-spacing: -.07em; transform: skew(-9deg); }.brand-mark i { position: absolute; left: -7px; bottom: -10px; width: 47px; height: 18px; border: 1px solid var(--pink); border-radius: 50%; transform: rotate(-12deg); }.brand-copy { display: flex; gap: .35rem; align-items: baseline; color: white; font-size: clamp(.57rem, 1vw, .78rem); letter-spacing: .1em; white-space: nowrap; }.brand-copy b:last-child { color: var(--cyan); }.brand-copy em { color: var(--pink); font-style: normal; }
.menu-toggle { display: inline-flex; align-items: center; gap: .75rem; min-height: 44px; padding: .4rem 0 .4rem 1rem; border: 0; color: white; background: transparent; font-size: .68rem; font-weight: 900; letter-spacing: .17em; }.menu-toggle i, .menu-toggle i::before, .menu-toggle i::after { display: block; width: 29px; height: 2px; background: var(--cyan); transition: transform .25s, background .25s; }.menu-toggle i { position: relative; }.menu-toggle i::before, .menu-toggle i::after { content: ""; position: absolute; left: 0; }.menu-toggle i::before { top: -8px; }.menu-toggle i::after { top: 8px; }.menu-toggle[aria-expanded="true"] i { background: transparent; }.menu-toggle[aria-expanded="true"] i::before { top: 0; background: var(--pink); transform: rotate(45deg); }.menu-toggle[aria-expanded="true"] i::after { top: 0; background: var(--pink); transform: rotate(-45deg); }
.menu-panel { position: fixed; z-index: 45; top: 74px; left: 0; display: grid; justify-content: end; width: 100%; padding: 1.3rem clamp(1rem, 4vw, 4.5rem) 2rem; border-bottom: 1px solid var(--pink); background: rgba(9,5,15,.98); transform: translateY(-125%); transition: transform .35s cubic-bezier(.2,.8,.2,1); }.menu-panel.is-open { transform: translateY(0); }.menu-panel > * { width: min(100%, 670px); }.menu-panel > p { margin: 0 0 .5rem; color: var(--cyan); font-size: .61rem; font-weight: 900; letter-spacing: .2em; }.menu-panel > a:not(.menu-discord) { display: flex; gap: 1rem; padding: .52rem 0; border-bottom: 1px solid rgba(255,255,255,.13); font-size: clamp(1rem, 2vw, 1.35rem); font-weight: 800; transition: color .15s, padding-left .15s; }.menu-panel > a:not(.menu-discord):hover { padding-left: .55rem; color: var(--cyan); }.menu-panel > a span { color: var(--pink); font-size: .68rem; }.menu-discord { display: inline-flex; justify-content: space-between; align-items: center; margin-top: 1.2rem; padding: .77rem 1rem; color: var(--ink); background: var(--yellow); font-size: .82rem; font-weight: 1000; }.menu-discord b { font-size: 1.2rem; }

.hero { position: relative; isolation: isolate; display: flex; align-items: stretch; min-height: min(900px, 100svh); padding: 118px clamp(1rem, 5vw, 6rem) 88px; overflow: hidden; background: #09050f; }.hero-image { position: absolute; z-index: -5; inset: 0; background: url('/manus-storage/hero-stage-cascade_e601c67a.png') center right / cover no-repeat; }.hero-gradient { position: absolute; z-index: -4; inset: 0; background: linear-gradient(90deg, #08040e 0%, rgba(8,4,14,.98) 22%, rgba(8,4,14,.63) 49%, rgba(8,4,14,.12) 77%, rgba(8,4,14,.7) 100%); }.hero-arc { position: absolute; z-index: -2; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; transform: scaleY(.23) rotate(-16deg); }.arc-a { top: 11%; right: -3%; width: 52rem; height: 52rem; border-color: var(--pink); box-shadow: 0 0 20px rgba(255,43,214,.55); }.arc-b { bottom: 4%; right: 10%; width: 38rem; height: 38rem; border-color: var(--cyan); box-shadow: 0 0 16px rgba(32,231,245,.55); }.hero-grid { position: absolute; z-index: -1; right: -5%; bottom: -47%; width: 73%; height: 72%; opacity: .4; background-image: linear-gradient(rgba(32,231,245,.33) 1px, transparent 1px), linear-gradient(90deg, rgba(255,43,214,.24) 1px, transparent 1px); background-size: 44px 44px; transform: perspective(520px) rotateX(61deg) rotateZ(-7deg); }
.hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(310px, .88fr) minmax(165px, .35fr); gap: clamp(1.5rem, 8vw, 9rem); align-items: end; width: min(100%, 1420px); min-height: 630px; margin: 0 auto; }.hero-copy { padding-bottom: clamp(0rem, 4vw, 3rem); }.hero-label, .section-label { display: flex; gap: .6rem; align-items: center; margin: 0; color: var(--cyan); font-size: .65rem; font-weight: 900; letter-spacing: .13em; }.hero-label span { padding: .17rem .48rem; color: var(--ink); background: var(--cyan); }.hero-kicker { margin: 1.1rem 0 .25rem; color: var(--yellow); font-size: .6rem; font-weight: 900; letter-spacing: .2em; }.hero h1 { position: relative; margin: 0; font-size: clamp(4.65rem, 11.7vw, 10.6rem); font-weight: 1000; letter-spacing: -.14em; line-height: .74; text-shadow: 5px 6px 0 #210a31, 9px 10px 0 var(--pink-dark), 0 0 30px rgba(255,43,214,.38); transform: skewY(-4deg); }.hero h1 em { color: var(--cyan); font-style: normal; background: linear-gradient(100deg, #ffd4f6 10%, var(--pink) 47%, var(--cyan) 86%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }.hero h1::after { content: "SING IT LOUD"; position: absolute; top: -1.45rem; right: .3rem; color: var(--cyan); font-size: clamp(.49rem, 1vw, .72rem); letter-spacing: .21em; text-shadow: none; transform: rotate(-3deg) skewY(4deg); }.hero-text { max-width: 570px; margin: 1.6rem 0; color: white; font-size: clamp(.93rem, 1.6vw, 1.15rem); font-weight: 700; line-height: 1.85; text-shadow: 0 3px 14px rgba(0,0,0,.9); }.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }.button { display: inline-flex; gap: .75rem; align-items: center; justify-content: center; min-height: 52px; padding: .75rem 1.15rem; border: 1px solid transparent; font-size: .84rem; font-weight: 1000; letter-spacing: .03em; transition: transform .2s, box-shadow .2s, background .2s; }.button:hover { transform: translateY(-4px); }.button-primary { color: var(--ink); background: var(--yellow); box-shadow: 6px 6px 0 var(--pink); }.button-primary:hover { box-shadow: 9px 9px 0 var(--pink); }.button-primary span { font-size: 1.1rem; }.button-quiet { border-color: rgba(255,255,255,.55); color: white; background: rgba(13,7,24,.54); backdrop-filter: blur(5px); }.button-quiet:hover { border-color: var(--cyan); color: var(--cyan); }
.entry-window { display: grid; grid-template-columns: 1fr auto 1.3fr; gap: .8rem; align-items: center; max-width: 640px; margin-top: 2.35rem; padding: .85rem 1rem; border: 1px solid rgba(255,255,255,.45); background: rgba(6,3,12,.52); backdrop-filter: blur(8px); }.entry-window p { margin: 0; }.entry-window span { display: block; color: var(--pink); font-size: .52rem; font-weight: 900; letter-spacing: .16em; }.entry-window strong { display: block; font-size: clamp(.75rem, 1.5vw, .96rem); }.entry-window i { color: var(--cyan); font-size: .67em; font-style: normal; }.entry-window > b { color: var(--yellow); font-size: 1.2rem; }.hero-pass { position: relative; align-self: end; justify-self: end; width: min(100%, 240px); margin-bottom: 1.8rem; padding: 1.25rem 1rem 1rem; color: var(--ink); background: var(--cyan); clip-path: polygon(0 0, 100% 0, 100% 84%, 80% 100%, 0 100%); box-shadow: 10px 11px 0 var(--pink); transform: rotate(-5deg); }.hero-pass::before { content: ""; position: absolute; inset: 8px; border: 1px solid rgba(9,5,15,.65); }.hero-pass p, .hero-pass strong, .hero-pass span, .hero-pass i { position: relative; z-index: 1; display: block; }.hero-pass p { margin: 0; font-size: .52rem; font-weight: 900; letter-spacing: .18em; }.hero-pass strong { margin: .8rem 0; font-size: clamp(2.35rem, 4vw, 3.6rem); line-height: .73; letter-spacing: -.1em; }.hero-pass span { font-size: .56rem; font-weight: 900; line-height: 1.45; letter-spacing: .08em; }.hero-pass i { position: absolute; right: .65rem; bottom: -.02rem; color: var(--pink); font-size: 3rem; font-style: normal; line-height: 1; }.hero-scroll { position: absolute; left: clamp(1rem, 5vw, 6rem); bottom: 1.25rem; display: inline-flex; gap: .65rem; align-items: center; color: var(--muted); font-size: .57rem; font-weight: 900; letter-spacing: .18em; }.hero-scroll span { width: 42px; height: 1px; background: var(--pink); }
.signal-line { position: relative; z-index: 2; overflow: hidden; color: var(--ink); border-top: 1px solid var(--pink); border-bottom: 1px solid var(--pink); background: linear-gradient(90deg, var(--pink), var(--cyan), var(--pink)); }.signal-line > div { display: flex; gap: 1.4rem; align-items: center; width: max-content; min-width: 100%; padding: .45rem 0; font-size: .65rem; font-weight: 1000; letter-spacing: .14em; white-space: nowrap; animation: signalFlow 30s linear infinite; }.signal-line i { color: white; font-style: normal; }

.section { position: relative; padding: clamp(5rem, 11vw, 10rem) clamp(1rem, 7vw, 9rem); }.chapter-mark { display: inline-flex; flex-direction: column; gap: .12rem; }.chapter-mark span { color: var(--pink); font-size: .68rem; font-weight: 1000; letter-spacing: .11em; }.chapter-mark small { color: var(--muted); font-size: .55rem; font-weight: 900; letter-spacing: .2em; }.section h2 { margin: .4rem 0 0; font-size: clamp(2.45rem, 5.4vw, 5.8rem); font-weight: 1000; letter-spacing: -.08em; line-height: .96; }.section h2 em { color: var(--cyan); font-style: normal; text-shadow: 0 0 24px rgba(32,231,245,.28); }
.story { display: grid; grid-template-columns: auto minmax(280px, .86fr) minmax(260px, .62fr); gap: clamp(1.4rem, 5vw, 5.5rem); align-items: center; max-width: 1510px; margin: 0 auto; }.story-copy { max-width: 650px; }.story-copy p:not(.section-label) { margin: 1.25rem 0 0; color: #d7cfdf; font-size: .96rem; }.story-orbit { position: relative; display: grid; place-items: center; width: min(100%, 390px); aspect-ratio: 1; margin: 0 auto; }.orbit-ring { position: absolute; border: 1px solid var(--pink); border-radius: 50%; transform: rotate(-20deg) scaleY(.34); box-shadow: 0 0 22px rgba(255,43,214,.35); }.ring-one { width: 100%; height: 100%; }.ring-two { width: 78%; height: 78%; border-color: var(--cyan); transform: rotate(37deg) scaleY(.33); }.orbit-core { display: grid; place-items: center; width: 39%; aspect-ratio: 1; border: 1px solid var(--cyan); border-radius: 50%; color: white; background: radial-gradient(circle, #33206c, #0b0614 70%); box-shadow: 0 0 34px rgba(32,231,245,.24); font-size: clamp(1.6rem, 3vw, 2.6rem); font-weight: 1000; line-height: .73; letter-spacing: -.08em; text-align: center; }.orbit-core span { color: var(--pink); font-size: .29em; letter-spacing: .15em; }.story-orbit > p { position: absolute; right: 0; bottom: 9%; margin: 0; color: var(--yellow); font-size: .56rem; font-weight: 900; letter-spacing: .14em; line-height: 1.7; text-align: right; }.story-note { grid-column: 2 / -1; display: flex; align-items: center; gap: 1rem; padding: .8rem 1rem; border-left: 2px solid var(--yellow); background: linear-gradient(90deg, rgba(255,240,74,.13), transparent); }.story-note span { color: var(--yellow); font-size: .57rem; font-weight: 900; letter-spacing: .15em; }.story-note strong { font-size: .93rem; line-height: 1.2; }.story-note strong small { color: var(--cyan); font-size: .63em; letter-spacing: .12em; }.story-note i { margin-left: auto; color: var(--muted); font-size: .7rem; font-style: normal; }
.entry { overflow: hidden; background: radial-gradient(circle at 77% 42%, rgba(255,43,214,.25), transparent 20rem), radial-gradient(circle at 13% 78%, rgba(32,231,245,.16), transparent 22rem), #10071f; }.entry::before { content: ""; position: absolute; inset: 0; opacity: .25; background-image: linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(to bottom, transparent, #000 15%, #000 85%, transparent); }.entry-top, .entry-heading, .entry-route, .entry-action { position: relative; z-index: 1; max-width: 1420px; margin-right: auto; margin-left: auto; }.entry-top { display: flex; align-items: end; justify-content: space-between; }.entry-heading { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(230px, .45fr); gap: 3rem; margin-top: 1rem; }.entry-heading p { align-self: end; margin: 0; color: #d5ccdf; font-size: .91rem; }.entry-route { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 1rem; align-items: center; margin-top: clamp(2.5rem, 6vw, 5rem); }.entry-route article { min-height: 208px; padding: 1.2rem; border: 1px solid rgba(255,255,255,.35); background: rgba(9,5,15,.72); backdrop-filter: blur(7px); transition: transform .2s, border-color .2s; }.entry-route article:hover { border-color: var(--cyan); transform: translateY(-5px); }.entry-route small { display: block; color: var(--pink); font-size: .63rem; font-weight: 1000; }.entry-route b { display: block; margin-top: 1.1rem; color: var(--cyan); font-size: clamp(1.25rem, 2.5vw, 2.2rem); letter-spacing: .08em; }.entry-route p { margin: .55rem 0 0; color: white; font-size: .83rem; line-height: 1.65; }.entry-route > i { color: var(--yellow); font-size: 1.6rem; font-style: normal; }.entry-action { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 1.5rem; padding: 1rem 1.25rem; border: 1px solid rgba(32,231,245,.55); background: rgba(9,5,15,.58); }.entry-action p { margin: 0; color: #d7d0df; font-size: .78rem; }
.mission { background: #09050f; }.mission-header { display: flex; gap: clamp(1rem, 5vw, 5rem); align-items: flex-start; max-width: 1500px; margin: 0 auto; }.mission-track { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; max-width: 1500px; margin: clamp(2.5rem, 6vw, 5rem) auto 0; }.mission-track::before { content: ""; position: absolute; z-index: 0; top: 24%; left: 15%; width: 70%; height: 1px; background: linear-gradient(90deg, var(--pink), var(--cyan)); }.mission-card { position: relative; z-index: 1; min-height: 300px; padding: 1.25rem; overflow: hidden; border: 1px solid rgba(255,255,255,.24); background: linear-gradient(150deg, rgba(37,17,61,.94), rgba(10,6,18,.98)); }.mission-card::after { content: ""; position: absolute; right: -2.5rem; bottom: -2.8rem; width: 8rem; aspect-ratio: 1; border: 11px solid rgba(255,43,214,.13); border-radius: 50%; }.mission-card:nth-child(2)::after { border-color: rgba(32,231,245,.16); }.mission-card > span { display: block; color: var(--pink); font-size: .67rem; font-weight: 1000; }.mission-card:nth-child(2) > span { color: var(--cyan); }.mission-icon { display: grid; place-items: center; width: 62px; height: 62px; margin: 1.15rem 0; border: 1px solid var(--pink); color: var(--pink); background: rgba(255,43,214,.1); }.mission-card:nth-child(2) .mission-icon { border-color: var(--cyan); color: var(--cyan); background: rgba(32,231,245,.1); }.mic-icon::after { content: ""; width: 19px; height: 29px; border: 3px solid currentColor; border-radius: 11px 11px 7px 7px; box-shadow: 0 17px 0 -8px currentColor; }.play-icon::after { content: ""; margin-left: 4px; border-top: 12px solid transparent; border-bottom: 12px solid transparent; border-left: 18px solid currentColor; }.hash-icon { font-size: 2rem; font-weight: 900; }.mission-card h3 { margin: 0; font-size: 1.55rem; }.mission-card p { position: relative; z-index: 1; max-width: 280px; margin: .65rem 0 0; color: #d6cfde; font-size: .82rem; }.mission-card p b { color: var(--yellow); }.mission-after { display: flex; justify-content: space-between; align-items: center; gap: 1rem; max-width: 1500px; margin: 1rem auto 0; padding: 1rem 1.2rem; border-left: 3px solid var(--yellow); background: rgba(255,255,255,.06); }.mission-after p { margin: 0; font-size: .81rem; }.mission-after a { color: var(--cyan); font-size: .78rem; font-weight: 900; white-space: nowrap; }.mission-after a span { padding-left: .3rem; font-size: 1.2em; }
.rules { overflow: hidden; background: linear-gradient(180deg, #0b0614, #160a2b); }.rules-heading { display: flex; gap: clamp(1rem, 5vw, 5rem); align-items: flex-start; max-width: 1500px; margin: 0 auto; }.rules-shell { position: relative; max-width: 1500px; margin: 3rem auto 0; padding: 1.3rem; border: 1px solid rgba(32,231,245,.65); background: rgba(7,4,13,.78); box-shadow: 12px 12px 0 rgba(255,43,214,.46); }.rules-shell::before { content: ""; position: absolute; top: 0; right: -15%; width: 45%; height: 100%; opacity: .22; background: repeating-linear-gradient(125deg, transparent 0 15px, rgba(255,255,255,.12) 15px 16px); transform: skewX(-18deg); }.rules-topline { position: relative; z-index: 1; margin: 0 0 1rem; color: var(--cyan); font-size: .6rem; font-weight: 900; letter-spacing: .2em; }.rules-list { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 0; padding: 0; list-style: none; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.18); }.rules-list li { display: flex; gap: 1rem; min-height: 130px; padding: 1rem; background: rgba(18,10,32,.96); }.rules-list li > b { color: var(--pink); font-size: 1.2rem; line-height: 1; }.rules-list li:nth-child(even) > b { color: var(--cyan); }.rules-list strong { display: block; font-size: .92rem; }.rules-list p { margin: .33rem 0 0; color: #cdc5d8; font-size: .72rem; line-height: 1.62; }.rules-discord { position: relative; z-index: 1; display: inline-flex; gap: .65rem; align-items: center; margin-top: 1rem; padding: .7rem 1rem; color: var(--ink); background: var(--cyan); font-size: .78rem; font-weight: 1000; }.rules-discord span { font-size: 1rem; }
.prizes { background: #09050f; }.prizes-heading { display: flex; gap: clamp(1rem, 5vw, 5rem); align-items: flex-start; max-width: 1500px; margin: 0 auto; }.grand-prize { position: relative; display: grid; grid-template-columns: auto 1fr auto; gap: clamp(1.1rem, 3vw, 3rem); align-items: center; max-width: 1500px; min-height: 390px; margin: 3rem auto 0; padding: clamp(1.5rem, 5vw, 4rem); overflow: hidden; border: 2px solid var(--yellow); background: radial-gradient(circle at 80% 20%, rgba(255,240,74,.22), transparent 17rem), linear-gradient(135deg, #271b12, #100a16 76%); }.grand-prize::before { content: ""; position: absolute; inset: 0; opacity: .24; background-image: linear-gradient(90deg, rgba(255,240,74,.14) 1px, transparent 1px), linear-gradient(rgba(255,240,74,.14) 1px, transparent 1px); background-size: 28px 28px; }.grand-prize > * { position: relative; z-index: 1; }.grand-number { color: var(--yellow); font-size: clamp(6rem, 13vw, 11rem); font-weight: 1000; line-height: .7; text-shadow: 4px 4px 0 #72551b; }.grand-main > p { margin: 0; color: var(--yellow); font-size: .62rem; font-weight: 900; letter-spacing: .16em; }.grand-main h3 { margin: .2rem 0 .9rem; font-size: clamp(2.5rem, 5vw, 5rem); line-height: .8; }.grand-main strong { display: block; font-size: clamp(.9rem, 1.6vw, 1.2rem); line-height: 1.6; }.grand-main > span { display: block; margin-top: 1rem; color: #f2e6d3; font-size: .77rem; }.grand-orbit { display: grid; place-items: center; width: 125px; aspect-ratio: 1; border: 1px solid var(--yellow); border-radius: 50%; color: var(--yellow); font-size: .58rem; font-weight: 900; letter-spacing: .12em; line-height: 1.4; text-align: center; transform: rotate(-16deg); box-shadow: 0 0 0 10px rgba(255,240,74,.06); }.reward-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; max-width: 1500px; margin: 1rem auto 0; }.reward { min-height: 170px; padding: 1rem; border: 1px solid rgba(255,255,255,.32); background: #130b22; }.reward span { color: var(--cyan); font-size: 2.5rem; font-weight: 1000; line-height: .8; }.reward:nth-child(2) span { color: #f4a879; }.reward:nth-child(3) span { color: var(--pink); }.reward h3 { margin: .7rem 0 .4rem; font-size: .97rem; }.reward p { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.55; }.everyone-pass { display: flex; gap: 1rem; align-items: center; max-width: 1500px; margin: 1rem auto 0; padding: 1rem clamp(1rem, 3vw, 2rem); border: 1px solid var(--cyan); background: linear-gradient(90deg, rgba(32,231,245,.2), rgba(255,43,214,.08)); }.everyone-pass > span { color: var(--cyan); font-size: 2.3rem; font-weight: 1000; line-height: 1; }.everyone-pass div { flex: 1; }.everyone-pass p { margin: 0; color: var(--cyan); font-size: .55rem; font-weight: 900; letter-spacing: .15em; }.everyone-pass h3 { margin: .1rem 0; font-size: 1.2rem; }.everyone-pass small { color: #d4cddd; font-size: .7rem; }.everyone-pass > b { padding: .45rem .65rem; color: var(--ink); background: var(--cyan); font-size: .65rem; line-height: 1.1; text-align: center; }
.live { display: grid; grid-template-columns: minmax(260px, .9fr) minmax(260px, .55fr); gap: clamp(2rem, 10vw, 10rem); align-items: center; overflow: hidden; background: radial-gradient(circle at 71% 52%, rgba(255,43,214,.27), transparent 17rem), #150a2b; }.live-copy { position: relative; z-index: 1; max-width: 720px; }.live-copy .chapter-mark { margin-bottom: 1.7rem; }.live-copy > p:last-child { max-width: 500px; color: #d7cde2; }.live-ticket { position: relative; z-index: 1; justify-self: center; width: min(100%, 420px); padding: clamp(1.8rem, 5vw, 3.7rem) 1.35rem; border: 2px solid var(--cyan); background: rgba(8,4,15,.7); box-shadow: 13px 13px 0 var(--pink), inset 0 0 42px rgba(32,231,245,.1); text-align: center; }.live-ticket::before, .live-ticket::after { content: ""; position: absolute; width: 14px; height: 14px; border: 2px solid var(--yellow); }.live-ticket::before { top: 9px; left: 9px; border-right: 0; border-bottom: 0; }.live-ticket::after { right: 9px; bottom: 9px; border-top: 0; border-left: 0; }.live-ticket p { margin: 0; color: var(--cyan); font-size: .61rem; font-weight: 900; letter-spacing: .2em; }.live-ticket strong { display: block; margin: .5rem 0; font-size: clamp(3.3rem, 7vw, 6rem); line-height: .85; letter-spacing: -.08em; }.live-ticket strong span { color: var(--pink); font-size: .25em; vertical-align: top; letter-spacing: .04em; }.live-ticket div { display: flex; justify-content: center; gap: .6rem; align-items: baseline; color: var(--yellow); font-size: 1.2rem; }.live-ticket div i { color: white; font-style: normal; }.live-ticket small { display: block; margin-top: .5rem; font-size: .63rem; font-weight: 900; letter-spacing: .16em; }.live-rings i { position: absolute; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; transform: rotate(-19deg) scaleY(.2); }.live-rings i:nth-child(1) { right: -15%; top: 11%; width: 50rem; height: 50rem; border-color: var(--pink); }.live-rings i:nth-child(2) { right: -5%; bottom: 2%; width: 37rem; height: 37rem; border-color: var(--cyan); }.live-rings i:nth-child(3) { left: -21%; bottom: 20%; width: 40rem; height: 40rem; border-color: rgba(255,240,74,.5); }
.final-call { position: relative; overflow: hidden; padding: clamp(5rem, 11vw, 10rem) clamp(1rem, 7vw, 9rem); background: linear-gradient(135deg, var(--pink-dark), #35208a 50%, #07113f); }.final-call::before { content: ""; position: absolute; inset: 13px; border: 1px solid rgba(255,255,255,.58); pointer-events: none; }.final-grid { position: absolute; right: -10%; bottom: -48%; width: 85%; height: 95%; opacity: .35; background-image: linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px); background-size: 38px 38px; transform: perspective(450px) rotateX(64deg) rotateZ(-5deg); }.final-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto; gap: 1rem 3rem; align-items: end; max-width: 1500px; margin: 0 auto; }.final-inner p { grid-column: 1 / -1; margin: 0; color: var(--yellow); font-size: .65rem; font-weight: 900; letter-spacing: .18em; }.final-inner h2 { margin: 0; font-size: clamp(2.75rem, 6vw, 6.3rem); font-weight: 1000; letter-spacing: -.08em; line-height: .9; }.final-inner h2 em { color: var(--yellow); font-style: normal; }.final-inner > span { grid-column: 1 / 2; color: rgba(255,255,255,.9); font-size: .9rem; }.final-inner .button { grid-column: 2; grid-row: 2 / 4; align-self: center; min-width: 220px; }
.site-footer { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 1rem 3rem; padding: 2.7rem clamp(1rem, 7vw, 9rem) 4rem; background: #060309; }.footer-brand { display: flex; align-items: center; gap: .7rem; }.footer-brand > span { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--pink); color: var(--cyan); font-size: .75rem; font-weight: 1000; }.footer-brand p, .site-footer > p { margin: 0; color: var(--muted); font-size: .7rem; line-height: 1.5; }.footer-brand b { color: white; font-size: .84rem; }.site-footer > p { align-self: center; }.site-footer small { grid-column: 1 / -1; padding-top: 1.2rem; border-top: 1px solid rgba(255,255,255,.13); color: #69616f; font-size: .55rem; letter-spacing: .1em; }.mobile-cta { display: none; }

@keyframes signalFlow { to { transform: translateX(-50%); } }
@keyframes orbitFloat { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: no-preference) { .js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }.js .reveal.is-visible { opacity: 1; transform: none; }.hero-image { animation: heroBreathe 12s ease-in-out infinite alternate; }.arc-a { animation: orbitFloat 28s linear infinite; }.arc-b { animation: orbitFloat 20s linear infinite reverse; }.story-orbit .ring-one { animation: orbitFloat 17s linear infinite; }.story-orbit .ring-two { animation: orbitFloat 22s linear infinite reverse; } @keyframes heroBreathe { to { transform: scale(1.045); } } }

@media (max-width: 1020px) { .hero { min-height: auto; }.hero-inner { grid-template-columns: minmax(300px, 1fr) auto; min-height: 540px; }.hero-pass { margin-bottom: 1rem; }.story { grid-template-columns: auto 1fr; }.story-orbit { grid-column: 2; width: min(100%, 360px); }.story-note { grid-column: 2; }.entry-heading { grid-template-columns: 1fr 1fr; }.reward-grid { grid-template-columns: repeat(2, 1fr); }.live { grid-template-columns: 1fr 1fr; }.final-inner { grid-template-columns: 1fr auto; } }
@media (max-width: 720px) { body { padding-bottom: 63px; }.site-header { height: 62px; padding: 0 1rem; }.brand-mark { width: 32px; height: 32px; font-size: .62rem; }.brand-copy { display: none; }.menu-panel { top: 62px; padding: 1.25rem 1rem 1.5rem; }.hero { min-height: auto; padding: 91px 1rem 66px; }.hero-image { background-position: 61% center; }.hero-gradient { background: linear-gradient(180deg, rgba(8,4,14,.62), rgba(8,4,14,.88) 42%, rgba(8,4,14,.98) 76%), linear-gradient(90deg, rgba(8,4,14,.83), rgba(8,4,14,.18)); }.hero-inner { display: flex; flex-direction: column; align-items: stretch; min-height: 0; gap: 1.5rem; }.hero-copy { padding-bottom: 0; }.hero-label { font-size: .55rem; }.hero-kicker { margin-top: .8rem; font-size: .49rem; }.hero h1 { font-size: clamp(4.1rem, 20.7vw, 6.3rem); }.hero h1::after { top: -1.15rem; font-size: .41rem; }.hero-text { margin: 1.25rem 0; font-size: .9rem; }.hero-actions { display: grid; grid-template-columns: 1fr; }.button { width: 100%; min-height: 49px; }.entry-window { gap: .35rem; margin-top: 1.8rem; padding: .7rem; }.entry-window strong { font-size: .66rem; }.entry-window span { font-size: .45rem; }.hero-pass { align-self: flex-end; width: min(62%, 215px); margin: 0 .45rem 0 0; padding: 1rem .8rem .85rem; transform: rotate(-4deg); }.hero-pass strong { font-size: 2.5rem; }.hero-scroll { display: none; }.hero-grid { right: -43%; bottom: -17%; width: 130%; height: 46%; }.signal-line > div { font-size: .55rem; }.section { padding: 4.35rem 1rem; }.section h2 { font-size: clamp(2.3rem, 11vw, 3.55rem); }.story { grid-template-columns: 1fr; gap: 1.5rem; }.story-orbit { grid-column: auto; width: min(100%, 300px); }.story-note { grid-column: auto; display: grid; gap: .3rem; }.story-note i { margin-left: 0; }.entry-heading { grid-template-columns: 1fr; gap: .8rem; }.entry-route { grid-template-columns: 1fr; gap: .65rem; margin-top: 2rem; }.entry-route > i { display: none; }.entry-route article { min-height: 0; padding: 1rem; }.entry-route b { margin-top: .45rem; font-size: 1.45rem; }.entry-action { display: grid; gap: .75rem; }.entry-action p { font-size: .72rem; }.mission-header, .rules-heading, .prizes-heading { gap: .8rem; }.chapter-mark { min-width: 46px; }.mission-track { grid-template-columns: 1fr; gap: .65rem; margin-top: 2.1rem; }.mission-track::before { display: none; }.mission-card { min-height: 0; padding: 1rem; }.mission-card .mission-icon { float: right; margin: -.3rem 0 .4rem 1rem; }.mission-card h3 { padding-top: .3rem; }.mission-card p { clear: both; max-width: none; }.mission-after { display: block; }.mission-after a { display: inline-block; margin-top: .5rem; }.rules-shell { margin-top: 2rem; padding: .9rem; box-shadow: 7px 7px 0 rgba(255,43,214,.46); }.rules-list { grid-template-columns: 1fr; }.rules-list li { min-height: 0; padding: .9rem; }.grand-prize { grid-template-columns: auto 1fr; gap: .8rem; min-height: 0; margin-top: 2.1rem; padding: 1.2rem; }.grand-number { font-size: 5.3rem; }.grand-main h3 { font-size: 2.8rem; }.grand-main strong { font-size: .8rem; }.grand-main > span { font-size: .67rem; }.grand-orbit { display: none; }.reward-grid { grid-template-columns: 1fr 1fr; gap: .6rem; }.reward { min-height: 148px; padding: .8rem; }.reward span { font-size: 2rem; }.reward h3 { font-size: .86rem; }.reward p { font-size: .63rem; }.everyone-pass { align-items: flex-start; gap: .65rem; }.everyone-pass > span { font-size: 1.7rem; }.everyone-pass h3 { font-size: .94rem; }.everyone-pass small { font-size: .62rem; }.everyone-pass > b { align-self: center; font-size: .56rem; }.live { grid-template-columns: 1fr; gap: 2.5rem; }.live-ticket { width: calc(100% - 13px); }.final-call { padding: 4.8rem 1rem; }.final-inner { display: flex; flex-direction: column; align-items: stretch; gap: 1rem; }.final-inner h2 { font-size: clamp(2.7rem, 12vw, 4rem); }.final-inner .button { min-width: 0; }.site-footer { grid-template-columns: 1fr; gap: 1rem; padding-bottom: 2.6rem; }.mobile-cta { position: fixed; z-index: 40; bottom: 0; left: 0; display: block; width: 100%; padding: .5rem 1rem; border-top: 1px solid var(--pink); background: rgba(8,4,14,.95); backdrop-filter: blur(9px); }.mobile-cta a { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 42px; padding: .55rem .8rem; color: var(--ink); background: var(--yellow); font-size: .75rem; font-weight: 1000; }.mobile-cta span { font-size: 1.1rem; } }
@media (max-width: 380px) { .hero h1 { font-size: 3.9rem; }.entry-window { grid-template-columns: 1fr auto 1.08fr; }.entry-window strong { font-size: .59rem; } }


/* Championship-first hero title */
.hero h1 { max-width: 880px; font-size: clamp(3.55rem, 7.7vw, 7.55rem); letter-spacing: -.115em; line-height: .73; }
.hero h1 span, .hero h1 em { display: block; white-space: nowrap; }
.hero h1 span { color: #ffe0f8; }
.hero h1 em { margin-left: .62em; color: var(--cyan); font-size: 1.18em; }
.hero h1::after { content: "DOUBLE LARIAT / 2026"; top: -1.2rem; right: auto; left: 0; color: var(--yellow); }
.hero-title-tagline { margin: 1.15rem 0 0 .15rem; color: var(--cyan); font-size: clamp(1rem, 1.7vw, 1.32rem); font-weight: 1000; letter-spacing: .1em; line-height: 1.2; text-shadow: 0 0 18px rgba(32,231,245,.4); }
.hero-title-tagline + .hero-text { margin-top: .85rem; }
@media (max-width: 720px) {
  .hero h1 { font-size: clamp(3.05rem, 15.3vw, 5.65rem); letter-spacing: -.115em; }
  .hero h1 em { margin-left: .42em; }
  .hero h1::after { top: -1.05rem; font-size: .38rem; }
  .hero-title-tagline { margin-top: .9rem; font-size: .94rem; }
}

/* Keep the event name dominant without clipping on compact screens. */
.hero h1::after { content: none; }
@media (max-width: 720px) {
  .hero h1 { font-size: clamp(2.48rem, 11.5vw, 4.55rem); letter-spacing: -.13em; }
  .hero h1 em { margin-left: .36em; font-size: 1.13em; }
}

.hero-title-tagline { margin-top: 1.5rem; }
@media (max-width: 720px) { .hero-title-tagline { margin-top: 1.22rem; } }


/* Exhibition-poster hero: an original, airy opening for the championship. */
.gallery-header { border-bottom-color: rgba(40, 31, 69, .14); color: #231735; background: linear-gradient(180deg, rgba(250,250,255,.92), rgba(250,250,255,.34)); backdrop-filter: blur(12px); }
.gallery-header .brand-mark { border-color: var(--pink); color: #211536; background: rgba(255,255,255,.44); }.gallery-header .brand-copy { color: #20142f; }.gallery-header .menu-toggle { color: #211536; }.gallery-header .menu-toggle i, .gallery-header .menu-toggle i::before, .gallery-header .menu-toggle i::after { background: var(--pink-dark); }
.gallery-hero { min-height: min(940px, 100svh); color: #1d1430; background: linear-gradient(120deg, #f8fbff, #efeaff 56%, #eaf4ff); }.gallery-hero .gallery-hero-image { background: linear-gradient(90deg, rgba(249,251,255,.12) 0%, rgba(247,250,255,0) 43%), linear-gradient(135deg, #f8fbff, #eaf3ff); background-position: center right; background-size: cover; }.gallery-hero .hero-gradient { background: linear-gradient(90deg, rgba(250,252,255,.98) 0%, rgba(249,251,255,.94) 31%, rgba(246,249,255,.57) 50%, rgba(246,249,255,.04) 77%); }.gallery-hero .hero-grid { right: -16%; bottom: -55%; width: 67%; opacity: .18; background-image: linear-gradient(rgba(59,52,106,.38) 1px, transparent 1px), linear-gradient(90deg, rgba(255,43,214,.3) 1px, transparent 1px); }.gallery-hero .hero-arc { z-index: -1; opacity: .42; }.gallery-hero .arc-a { top: 5%; right: -13%; border-color: var(--pink); box-shadow: none; }.gallery-hero .arc-b { right: 4%; bottom: 12%; border-color: var(--cyan); box-shadow: none; }
.gallery-hero .hero-inner { grid-template-columns: minmax(330px, .86fr) minmax(130px, .26fr); min-height: 650px; }.gallery-hero .hero-copy { padding: 2rem 0 0; }.gallery-hero .hero-label { color: #342752; }.gallery-hero .hero-label span { color: #fff; background: var(--pink-dark); }.gallery-hero .hero-kicker { margin-top: 1.55rem; color: var(--pink-dark); letter-spacing: .24em; }.gallery-hero h1 { max-width: 910px; color: #201534; font-size: clamp(3.8rem, 8vw, 8.25rem); letter-spacing: -.15em; line-height: .71; text-shadow: none; transform: none; }.gallery-hero h1 span { color: #241638; }.gallery-hero h1 em { margin-left: .44em; background: linear-gradient(115deg, #ff278b 8%, #a654df 43%, #00bfd3 90%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }.gallery-hero .hero-title-tagline { margin-top: 1.55rem; color: #312455; font-family: Georgia, "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: clamp(1.05rem, 1.9vw, 1.58rem); font-weight: 500; letter-spacing: .13em; text-shadow: none; }.gallery-hero .hero-text { max-width: 520px; color: #3b3450; font-size: .94rem; font-weight: 700; text-shadow: none; }.gallery-hero .button-primary { color: #fff; background: #2c1b43; box-shadow: 6px 6px 0 var(--pink); }.gallery-hero .button-quiet { border-color: rgba(42,28,65,.45); color: #302044; background: rgba(255,255,255,.39); }.gallery-hero .entry-window { border-color: rgba(48,32,78,.42); color: #251937; background: rgba(255,255,255,.5); backdrop-filter: blur(10px); }.gallery-hero .entry-window span { color: var(--pink-dark); }.gallery-hero .entry-window i { color: #007a8a; }.gallery-hero .entry-window > b { color: var(--pink-dark); }.gallery-hero .hero-pass { width: min(100%, 202px); margin-bottom: 3rem; color: #24173b; background: rgba(255,255,255,.84); box-shadow: 9px 10px 0 var(--pink); clip-path: polygon(0 0, 100% 0, 100% 88%, 86% 100%, 0 100%); transform: rotate(-6deg); }.gallery-hero .hero-pass::before { border-color: rgba(33,23,57,.42); }.gallery-hero .hero-pass p { color: var(--pink-dark); }.gallery-hero .hero-pass strong { color: #28183f; }.gallery-hero .hero-pass i { color: var(--pink); }.gallery-hero .hero-scroll { color: #3f3654; }.gallery-hero .hero-scroll span { background: var(--pink-dark); }
.gallery-spark { position: absolute; z-index: -1; width: 90px; height: 90px; border-radius: 50%; mix-blend-mode: multiply; filter: blur(10px); }.gallery-spark.spark-one { top: 20%; right: 37%; background: rgba(255,43,214,.29); }.gallery-spark.spark-two { right: 10%; bottom: 22%; background: rgba(32,231,245,.29); }
@media (max-width: 720px) { .gallery-header { background: rgba(250,251,255,.91); }.gallery-hero { padding-top: 91px; background: #f2f4ff; }.gallery-hero .gallery-hero-image { background-position: 61% center; }.gallery-hero .hero-gradient { background: linear-gradient(180deg, rgba(250,252,255,.7), rgba(250,252,255,.89) 43%, rgba(250,252,255,.96) 76%), linear-gradient(90deg, rgba(250,252,255,.96), rgba(250,252,255,.16)); }.gallery-hero .hero-copy { padding-top: 1rem; }.gallery-hero .hero-label { font-size: .53rem; }.gallery-hero .hero-kicker { margin-top: 1rem; color: var(--pink-dark); font-size: .48rem; }.gallery-hero h1 { font-size: clamp(2.92rem, 14vw, 5.1rem); letter-spacing: -.145em; }.gallery-hero h1 em { margin-left: .35em; }.gallery-hero .hero-title-tagline { margin-top: 1.35rem; font-size: 1rem; }.gallery-hero .hero-text { color: #362e4b; }.gallery-hero .hero-pass { align-self: flex-end; width: min(59%, 194px); margin-bottom: 0; }.gallery-hero .hero-grid { right: -43%; bottom: -17%; width: 130%; }.gallery-spark.spark-one { right: 20%; }.gallery-spark.spark-two { right: -8%; bottom: 22%; } }

@media (max-width: 720px) { .gallery-hero h1 { font-size: clamp(2.75rem, 12.6vw, 4.75rem); } }


/* Double Lariat hero: a spinning figure, its widening radius, city and Earth. */
.gallery-hero .gallery-hero-image {
  background-image: linear-gradient(90deg, rgba(251,250,244,.06) 0%, rgba(251,250,244,0) 43%), url('/manus-storage/hero-double-lariat-radius_23d48443.png');
  background-position: center center;
}
.gallery-hero .hero-gradient {
  background: linear-gradient(90deg, rgba(252,251,246,.99) 0%, rgba(252,251,246,.96) 28%, rgba(252,251,246,.68) 46%, rgba(252,251,246,.09) 72%, rgba(252,251,246,0) 100%);
}
.gallery-hero .hero-arc,
.gallery-hero .hero-grid,
.gallery-hero .gallery-spark { display: none; }
.gallery-hero .hero-title-tagline { color: #30214b; }
.gallery-hero .hero-text { color: #353044; }
@media (max-width: 720px) {
  .gallery-hero .gallery-hero-image { background-position: 62% center; }
  .gallery-hero .hero-gradient {
    background: linear-gradient(180deg, rgba(252,251,246,.72) 0%, rgba(252,251,246,.9) 43%, rgba(252,251,246,.97) 77%), linear-gradient(90deg, rgba(252,251,246,.95), rgba(252,251,246,.12));
  }
}

@media (max-width: 720px) {
  .gallery-hero .hero-gradient {
    background: linear-gradient(180deg, rgba(252,251,246,.57) 0%, rgba(252,251,246,.74) 43%, rgba(252,251,246,.84) 76%, rgba(252,251,246,.58) 100%), linear-gradient(90deg, rgba(252,251,246,.91), rgba(252,251,246,.10));
  }
}


/* Featured artist portrait: supplied Agoaniki photo integrated into the radius-and-Earth hero. */
.gallery-hero { isolation: isolate; }
.gallery-hero .agoaniki-portrait {
  position: absolute;
  z-index: 1;
  top: max(94px, 10vh);
  right: clamp(1.5rem, 6vw, 7rem);
  bottom: clamp(2.7rem, 7vh, 5.5rem);
  width: clamp(220px, 24vw, 370px);
  margin: 0;
  overflow: hidden;
  background: #090710;
  box-shadow: 14px 14px 0 rgba(255, 43, 214, .82), -1px -1px 0 rgba(32, 231, 245, .65);
  clip-path: polygon(0 0, 100% 0, 100% 91%, 88% 100%, 0 100%);
  transform: rotate(2.2deg);
}
.gallery-hero .agoaniki-portrait::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(155deg, rgba(32, 231, 245, .19), transparent 32%, rgba(255, 43, 214, .17) 88%), linear-gradient(0deg, rgba(5, 3, 12, .35), transparent 42%);
  mix-blend-mode: screen;
}
.gallery-hero .agoaniki-portrait img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 51% 47%;
  filter: saturate(.93) contrast(1.08);
}
.gallery-hero .agoaniki-portrait figcaption {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  display: grid;
  gap: .15rem;
  min-width: 61%;
  padding: .7rem .85rem;
  color: #241738;
  background: rgba(253, 253, 250, .96);
  border-top: 2px solid var(--cyan);
}
.gallery-hero .agoaniki-portrait figcaption span { color: var(--pink-dark); font-size: .46rem; font-weight: 1000; letter-spacing: .18em; }
.gallery-hero .agoaniki-portrait figcaption strong { font-size: 1.05rem; letter-spacing: .06em; }
.gallery-hero .hero-inner { position: relative; z-index: 2; }
.gallery-hero .hero-pass { z-index: 3; }
@media (max-width: 720px) {
  .gallery-hero .agoaniki-portrait {
    top: 94px;
    right: -1rem;
    bottom: auto;
    width: min(40vw, 190px);
    height: 282px;
    opacity: .94;
    box-shadow: 7px 7px 0 rgba(255, 43, 214, .72), -1px -1px 0 rgba(32, 231, 245, .65);
    transform: rotate(2.2deg);
  }
  .gallery-hero .agoaniki-portrait figcaption { min-width: 72%; padding: .42rem .52rem; }
  .gallery-hero .agoaniki-portrait figcaption span { font-size: .35rem; }
  .gallery-hero .agoaniki-portrait figcaption strong { font-size: .68rem; }
  .gallery-hero .hero-copy { position: relative; z-index: 2; }
  .gallery-hero .hero-title-tagline, .gallery-hero .hero-text { max-width: 85%; }
}

@media (max-width: 720px) {
  .gallery-hero .agoaniki-portrait {
    top: 88px;
    right: -.85rem;
    width: min(34vw, 142px);
    height: 232px;
    background: transparent;
    box-shadow: 4px 5px 0 rgba(255, 43, 214, .48), -1px -1px 0 rgba(32, 231, 245, .48);
  }
  .gallery-hero .agoaniki-portrait img { opacity: .5; }
  .gallery-hero .agoaniki-portrait::after { opacity: .55; }
  .gallery-hero .agoaniki-portrait figcaption { display: none; }
  .gallery-hero h1 { position: relative; z-index: 3; text-shadow: 0 1px 0 rgba(252,251,246,.9), 0 0 13px rgba(252,251,246,.7); }
}

@media (max-width: 720px) {
  .gallery-hero .agoaniki-portrait {
    top: 246px;
    right: -.55rem;
    width: min(31vw, 128px);
    height: 205px;
  }
  .gallery-hero .agoaniki-portrait img { opacity: .72; }
  .gallery-hero .hero-title-tagline,
  .gallery-hero .hero-text { max-width: 64%; }
}

@media (max-width: 720px) {
  .gallery-hero .hero-title-tagline,
  .gallery-hero .hero-text { max-width: 70%; }
}

@media (max-width: 720px) {
  .gallery-hero h1 em {
    color: #e92d9c;
    background: none;
    -webkit-text-fill-color: #e92d9c;
    text-shadow: 2px 2px 0 rgba(75, 36, 107, .2);
  }
}


/* Mobile preference: transparent overlay header, hamburger only. */
@media (max-width: 720px) {
  .gallery-header {
    height: 58px;
    justify-content: flex-end;
    padding: 0 .75rem;
    border-bottom: 0;
    background: transparent;
    backdrop-filter: none;
    pointer-events: none;
  }
  .gallery-header .brand { display: none; }
  .gallery-header .menu-toggle {
    position: relative;
    pointer-events: auto;
    justify-content: center;
    width: 44px;
    min-height: 44px;
    padding: 0;
    border: 1px solid rgba(41, 23, 66, .26);
    border-radius: 999px;
    background: rgba(255, 255, 255, .42);
    box-shadow: 0 4px 18px rgba(39, 20, 68, .1);
    backdrop-filter: blur(8px);
  }
  .gallery-header .menu-toggle span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
  .gallery-header .menu-toggle i,
  .gallery-header .menu-toggle i::before,
  .gallery-header .menu-toggle i::after { width: 21px; background: #3a2155; }
  .menu-panel { top: 58px; }
  .gallery-hero { padding-top: 76px; }
}


/* Pre-event special interview: invitation before the Discord participation chapter. */
.interview { overflow: hidden; background: radial-gradient(circle at 75% 15%, rgba(32, 231, 245, .15), transparent 25rem), radial-gradient(circle at 10% 78%, rgba(255, 43, 214, .17), transparent 28rem), #0c0615; }
.interview-rings { position: absolute; inset: -28% -12% auto auto; width: min(72vw, 920px); aspect-ratio: 1; pointer-events: none; opacity: .38; }
.interview-rings i { position: absolute; inset: 0; border: 1px solid rgba(32,231,245,.4); border-radius: 50%; transform: rotate(-23deg) scaleY(.33); }.interview-rings i:nth-child(2) { inset: 14%; border-color: rgba(255,43,214,.55); }.interview-rings i:nth-child(3) { inset: 28%; border-color: rgba(255,240,74,.48); }
.interview-heading { position: relative; z-index: 1; display: grid; grid-template-columns: auto minmax(280px, 760px); gap: clamp(1.4rem, 6vw, 6rem); max-width: 1420px; margin: 0 auto; }.interview-heading > div:last-child > p:last-child { max-width: 670px; margin: 1.25rem 0 0; color: #d9d0e2; font-size: .95rem; line-height: 1.8; }
.interview-video { position: relative; z-index: 1; max-width: 1120px; margin: clamp(2.5rem, 6vw, 5.4rem) auto 0; }.video-frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid rgba(255,255,255,.6); background: #050308; box-shadow: 16px 16px 0 rgba(255,43,214,.74), -1px -1px 0 rgba(32,231,245,.68); }.video-frame::before { content: "SPECIAL INTERVIEW"; position: absolute; z-index: 1; top: .75rem; left: .75rem; padding: .28rem .48rem; color: var(--ink); background: var(--yellow); font-size: .52rem; font-weight: 1000; letter-spacing: .15em; pointer-events: none; }.video-frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.interview-meta { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-top: 1.55rem; padding: .9rem 0 0; border-top: 1px solid rgba(255,255,255,.25); }.interview-meta span { display: block; color: var(--cyan); font-size: .55rem; font-weight: 1000; letter-spacing: .18em; }.interview-meta strong { display: block; margin-top: .35rem; font-size: clamp(1rem, 2vw, 1.42rem); line-height: 1.35; }.interview-meta a { display: inline-flex; gap: .55rem; align-items: center; padding: .68rem .85rem; border: 1px solid var(--pink); color: white; background: rgba(255,43,214,.08); font-size: .76rem; font-weight: 1000; white-space: nowrap; transition: background .2s, transform .2s; }.interview-meta a:hover { background: var(--pink-dark); transform: translateY(-3px); }.interview-meta b { font-size: 1.15rem; }
@media (max-width: 720px) { .interview-heading { grid-template-columns: 1fr; gap: .8rem; }.interview-rings { top: -3%; right: -72%; width: 145vw; }.interview-video { margin-top: 2.3rem; }.video-frame { box-shadow: 8px 8px 0 rgba(255,43,214,.72), -1px -1px 0 rgba(32,231,245,.65); }.video-frame::before { top: .5rem; left: .5rem; font-size: .42rem; }.interview-meta { display: grid; gap: 1rem; margin-top: 1.1rem; }.interview-meta a { justify-content: space-between; }.interview-heading > div:last-child > p:last-child { font-size: .88rem; } }


/* Mobile poster hero: rebuilt from the supplied layout's information architecture, not its artwork. */
.poster-hero { position: relative; isolation: isolate; min-height: min(980px, 100svh); padding: 116px clamp(1.2rem, 7vw, 8rem) 4.5rem; overflow: hidden; color: #171638; background: radial-gradient(circle at 78% 14%, rgba(108,142,235,.22), transparent 16rem), linear-gradient(132deg, #f8f9ff 0%, #edf0f9 55%, #dce7f6 100%); }
.poster-hero::before { content: ""; position: absolute; z-index: -5; inset: 0; opacity: .44; background-image: radial-gradient(circle at 6% 17%, #20204d 0 2px, transparent 2.5px), radial-gradient(circle at 93% 11%, #20204d 0 3px, transparent 3.5px), radial-gradient(circle at 4% 74%, #20204d 0 3px, transparent 3.7px), radial-gradient(circle at 80% 91%, #e72b88 0 2px, transparent 2.7px); background-size: 49px 43px, 67px 73px, 61px 53px, 57px 61px; }
.poster-splatter { position: absolute; z-index: -3; width: 28rem; aspect-ratio: 1; opacity: .85; background: radial-gradient(circle at 48% 46%, rgba(27,27,67,.88) 0 3%, transparent 3.5%), radial-gradient(circle at 61% 35%, rgba(27,27,67,.76) 0 1.7%, transparent 2.1%), radial-gradient(circle at 27% 70%, rgba(27,27,67,.76) 0 1.4%, transparent 1.9%), radial-gradient(circle at 72% 74%, rgba(229,35,126,.7) 0 1.2%, transparent 1.8%), radial-gradient(circle at 40% 82%, rgba(28,33,88,.65) 0 2%, transparent 2.4%); filter: blur(.15px); }.splatter-top { top: -13rem; right: -12rem; transform: rotate(15deg); }.splatter-bottom { bottom: -16rem; left: -13rem; transform: rotate(-25deg); }
.poster-orbit { position: absolute; z-index: -2; border: clamp(14px, 2.5vw, 35px) solid rgba(25,30,76,.93); border-right-color: rgba(117,75,180,.75); border-bottom-color: rgba(230,44,146,.82); border-radius: 50%; filter: drop-shadow(0 5px 0 rgba(255,255,255,.88)); transform: rotate(-18deg) scaleY(.34); }.orbit-wide { top: 17%; left: -10%; width: min(100vw, 1120px); height: min(100vw, 1120px); }.orbit-small { right: -14%; bottom: 8%; width: min(68vw, 720px); height: min(68vw, 720px); border-width: clamp(9px, 1.6vw, 22px); transform: rotate(20deg) scaleY(.32); }
.poster-portrait { position: absolute; z-index: 0; top: 7.5%; right: clamp(1rem, 5vw, 6rem); width: min(34vw, 470px); height: 82%; margin: 0; overflow: hidden; border: 1px solid rgba(26,26,61,.66); background: #13131d; box-shadow: 12px 14px 0 rgba(43,50,121,.75), -5px -5px 0 rgba(255,255,255,.7); transform: rotate(1.7deg); }.poster-portrait::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(165deg, transparent 50%, rgba(244,38,156,.28)), repeating-linear-gradient(125deg, transparent 0 19px, rgba(255,255,255,.09) 19px 20px); mix-blend-mode: screen; }.poster-portrait img { width: 100%; height: 100%; object-fit: cover; object-position: 48% 20%; filter: contrast(1.08) saturate(.78); }.poster-portrait figcaption { position: absolute; z-index: 1; right: 0; bottom: 1.15rem; min-width: 68%; padding: .7rem .9rem; color: #191735; background: rgba(248,249,255,.94); box-shadow: -5px 5px 0 var(--pink); transform: rotate(-2deg); }.poster-portrait figcaption span { display: block; color: #b3227f; font-size: .51rem; font-weight: 1000; letter-spacing: .15em; }.poster-portrait figcaption strong { display: block; margin-top: .1rem; font-size: 1rem; }
.poster-inner { position: relative; z-index: 2; width: min(67%, 850px); }.poster-brandline { display: flex; gap: clamp(.55rem, 1.5vw, 1.2rem); align-items: center; margin: 0; color: #20204c; font-size: clamp(.7rem, 1.2vw, 1.05rem); font-weight: 1000; letter-spacing: .07em; }.poster-brandline strong { font-size: 1.18em; }.poster-brandline span { color: #212153; font-size: 1.6em; font-weight: 400; }.poster-brandline b { font-size: 1.1em; }.poster-message { display: inline-block; margin: clamp(2.4rem, 7vh, 5.4rem) 0 clamp(1.7rem, 5vh, 3.6rem); padding: .35rem 1.4rem .45rem .4rem; color: #1f214d; background: rgba(255,255,255,.85); box-decoration-break: clone; font-family: Georgia, "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: clamp(1.35rem, 2.6vw, 2.6rem); font-weight: 700; line-height: 1.42; letter-spacing: .09em; transform: rotate(-5deg) skewX(-9deg); box-shadow: 0 .45rem 0 rgba(255,255,255,.45); }.poster-title > p { margin: 0 0 .42rem .3rem; color: #b2207c; font-size: clamp(.55rem, .86vw, .75rem); font-weight: 1000; letter-spacing: .19em; }.poster-title h1 { margin: 0; color: #171638; font-size: clamp(3.6rem, 8.8vw, 9rem); font-weight: 1000; letter-spacing: -.17em; line-height: .72; text-shadow: none; transform: rotate(-2.5deg) skewY(-2deg); }.poster-title h1 span { display: block; color: #171638; white-space: nowrap; }.poster-title h1 em { display: inline-block; margin: .1em 0 0 .48em; padding: .08em .18em .12em .08em; color: #fdfdff; background: linear-gradient(100deg, #262a75, #374fa5 62%, #7552c7); font-size: .76em; font-style: normal; line-height: .76; -webkit-text-fill-color: currentColor; clip-path: polygon(3% 17%, 96% 0, 100% 78%, 7% 100%, 0 40%); }.poster-tagline { width: fit-content; margin: 1.2rem 0 0 .3rem; padding: .3rem .8rem .35rem; color: #fff; background: #22265d; font-family: Georgia, "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: clamp(1.05rem, 1.95vw, 1.75rem); font-weight: 600; letter-spacing: .11em; line-height: 1.35; transform: skewX(-7deg); }
.poster-facts { display: flex; gap: clamp(.6rem, 2vw, 1.4rem); margin: clamp(2rem, 6vh, 4.2rem) 0 1.45rem; }.poster-facts div { display: grid; place-items: center; align-content: center; width: clamp(118px, 13.8vw, 190px); aspect-ratio: 1; padding: .85rem; border: 2px solid rgba(255,255,255,.72); border-radius: 50%; color: #fff; background: radial-gradient(circle at 30% 25%, #353872, #17183f 72%); box-shadow: 0 6px 0 rgba(43,37,90,.25), inset 0 0 0 6px rgba(255,255,255,.04); text-align: center; }.poster-facts div:nth-child(2) { background: radial-gradient(circle at 30% 25%, #3e4180, #1c1a4b 72%); }.poster-facts div:nth-child(3) { background: radial-gradient(circle at 30% 25%, #3a3678, #191640 72%); }.poster-facts dt { color: #ff4aa3; font-size: clamp(.45rem, .7vw, .62rem); font-weight: 1000; letter-spacing: .06em; }.poster-facts dd { display: grid; justify-items: center; margin: .15rem 0 0; font-weight: 1000; line-height: 1; }.poster-facts dd small { font-size: .48em; letter-spacing: .08em; }.poster-facts dd b { font-size: clamp(1.65rem, 3.2vw, 3.2rem); letter-spacing: -.1em; }.poster-facts dd span { margin-top: .27rem; font-size: clamp(.5rem, .75vw, .68rem); font-weight: 900; letter-spacing: .06em; }.poster-facts div:last-child dd b { font-size: clamp(1.4rem, 2.3vw, 2.4rem); letter-spacing: -.08em; }
.poster-cta { display: grid; grid-template-columns: auto 1fr auto; gap: .85rem; align-items: center; width: min(100%, 620px); padding: .68rem 1.15rem .68rem .9rem; border: 2px solid #fff; border-radius: 99px; color: #fff; background: linear-gradient(105deg, #4f59e8, #804cdb 50%, #f338a4); box-shadow: 0 7px 0 rgba(23,22,67,.78), 0 12px 25px rgba(56,36,143,.3); transition: transform .2s, box-shadow .2s; }.poster-cta:hover { box-shadow: 0 10px 0 rgba(23,22,67,.78), 0 15px 30px rgba(56,36,143,.36); transform: translateY(-3px); }.poster-cta-mark { display: grid; place-items: center; width: 46px; aspect-ratio: 1; border-radius: 50%; background: rgba(255,255,255,.95); color: #5965e8; font-size: 1.35rem; }.poster-cta small, .poster-cta strong { display: block; line-height: 1.2; }.poster-cta small { font-size: clamp(.6rem, .9vw, .76rem); font-weight: 900; letter-spacing: .04em; }.poster-cta strong { margin-top: .1rem; font-size: clamp(1.1rem, 1.7vw, 1.5rem); font-weight: 1000; }.poster-cta > b { font-size: clamp(2rem, 4vw, 3.8rem); font-weight: 400; line-height: .75; }
@media (max-width: 720px) { .poster-hero { min-height: 955px; padding: 78px 1rem 90px; background: radial-gradient(circle at 78% 14%, rgba(110,143,221,.18), transparent 12rem), linear-gradient(138deg, #fbfcff 0%, #edf0f8 61%, #e7ebf7 100%); }.poster-splatter { width: 18rem; }.splatter-top { top: -8rem; right: -10rem; }.splatter-bottom { bottom: -10rem; left: -10rem; }.poster-orbit { border-width: 14px; }.orbit-wide { top: 21%; left: -35%; width: 128vw; height: 128vw; }.orbit-small { right: -46%; bottom: 2%; width: 112vw; height: 112vw; }.poster-portrait { top: 4.25rem; right: -.25rem; width: 44vw; height: 44%; border-width: 0; box-shadow: none; transform: rotate(1.6deg); }.poster-portrait::after { background: linear-gradient(165deg, transparent 42%, rgba(236,40,150,.31)), repeating-linear-gradient(125deg, transparent 0 15px, rgba(255,255,255,.08) 15px 16px); }.poster-portrait img { object-position: 48% 18%; }.poster-portrait figcaption { right: .2rem; bottom: .8rem; min-width: 80%; padding: .32rem .48rem; box-shadow: -3px 3px 0 var(--pink); }.poster-portrait figcaption span { font-size: .37rem; }.poster-portrait figcaption strong { font-size: .72rem; }.poster-inner { width: 100%; }.poster-brandline { padding-right: 3.4rem; font-size: .58rem; letter-spacing: .045em; }.poster-message { max-width: 70%; margin: 2.65rem 0 2.25rem; padding: .28rem .7rem .35rem .25rem; font-size: 1.3rem; letter-spacing: .065em; }.poster-title > p { margin-bottom: .35rem; font-size: .5rem; }.poster-title h1 { font-size: clamp(3.25rem, 15.4vw, 4.65rem); letter-spacing: -.15em; line-height: .76; }.poster-title h1 em { margin-left: .34em; padding-right: .15em; font-size: .77em; }.poster-tagline { margin-top: .82rem; padding: .25rem .46rem .3rem; font-size: .95rem; letter-spacing: .08em; }.poster-facts { justify-content: space-between; gap: .25rem; margin: 2.4rem 0 1.55rem; }.poster-facts div { width: 30.6vw; min-width: 0; padding: .45rem; }.poster-facts dt { font-size: .38rem; }.poster-facts dd b { font-size: 1.65rem; }.poster-facts dd span { font-size: .42rem; }.poster-facts div:last-child dd b { font-size: 1.38rem; }.poster-cta { gap: .55rem; padding: .65rem .85rem .65rem .6rem; }.poster-cta-mark { width: 37px; font-size: 1rem; }.poster-cta small { font-size: .53rem; }.poster-cta strong { font-size: 1.1rem; }.poster-cta > b { font-size: 2.25rem; } }
@media (max-width: 370px) { .poster-hero { min-height: 918px; }.poster-message { margin-top: 2.2rem; font-size: 1.14rem; }.poster-title h1 { font-size: 3.14rem; }.poster-facts dd b { font-size: 1.48rem; }.poster-facts div:last-child dd b { font-size: 1.2rem; }.poster-cta strong { font-size: 1rem; } }


/* Keep the title legible while it overlaps the guest portrait on narrow screens. */
.poster-cta-mark { font-size: .58rem; font-weight: 1000; letter-spacing: -.06em; }
@media (max-width: 720px) {
  .poster-title h1 span { position: relative; z-index: 1; width: fit-content; padding: .04em .08em .08em 0; background: linear-gradient(100deg, rgba(255,255,255,.96) 0 88%, rgba(255,255,255,0) 100%); clip-path: polygon(0 6%, 98% 0, 100% 86%, 0 100%); filter: drop-shadow(0 3px 0 rgba(255,255,255,.46)); }
  .poster-cta-mark { font-size: .5rem; }
}


/* The title is stacked on phones so every character remains clear over the portrait. */
.poster-title h1 .title-double,
.poster-title h1 .title-lariat { display: inline-block; }
.poster-title h1 .title-double { margin-right: .06em; }
.poster-title h1 em { display: block; width: fit-content; }
@media (max-width: 720px) {
  .poster-title h1 { font-size: clamp(3.05rem, 14.2vw, 4.25rem); line-height: .73; }
  .poster-title h1 .title-double,
  .poster-title h1 .title-lariat { display: block; width: fit-content; }
  .poster-title h1 .title-lariat { margin-top: .02em; margin-left: .18em; }
  .poster-title h1 em { margin-top: .15em; margin-left: .76em; }
}


/* On wider screens, keep the participation action in the first visual without changing the mobile poster flow. */
@media (min-width: 721px) {
  .poster-hero .poster-cta { position: absolute; right: clamp(1rem, 5vw, 6rem); bottom: 4.4rem; z-index: 4; width: min(31vw, 430px); }
  .poster-portrait figcaption { bottom: 10.4rem; }
}


@media (min-width: 721px) {
  .poster-inner { position: static; }
  .poster-inner > :not(.poster-cta) { position: relative; z-index: 2; }
  .poster-hero .poster-cta { right: clamp(1rem, 5vw, 6rem); left: auto; }
}


@media (min-width: 721px) {
  .poster-hero .poster-cta { bottom: 12rem; }
  .poster-portrait figcaption { bottom: 13.7rem; }
}


/* Direct-use poster hero: the user-supplied artwork is displayed without visual alteration. */
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.direct-poster-hero { display: grid; place-items: center; min-height: 0; padding: 0; overflow: visible; background: #f4f6fa; }
.direct-poster { position: relative; width: min(100%, 720px); margin: 0; line-height: 0; box-shadow: 0 22px 55px rgba(19, 22, 61, .17); }
.direct-poster img { display: block; width: 100%; height: auto; }
.direct-poster-cta { position: absolute; z-index: 2; right: 4.7%; bottom: 4%; left: 4.7%; height: 11.1%; border-radius: 999px; outline-offset: 4px; }
.direct-poster-cta:focus-visible { outline: 3px solid #fff04a; box-shadow: 0 0 0 7px #25276b; }
@media (min-width: 721px) { .direct-poster-hero { min-height: min(100svh, 1050px); padding: 0 1.5rem; }.direct-poster { width: auto; height: min(100svh, 1050px); max-width: 100%; }.direct-poster img { width: auto; height: 100%; max-width: 100%; object-fit: contain; } }
@media (max-width: 720px) { body { padding-bottom: 0; }.poster-header { display: none; }.direct-poster { width: 100%; box-shadow: none; }.mobile-cta { display: none; } }


/* Deadline correction: updates only the deadline digits printed in the supplied poster. */
.poster-deadline-correction { position: absolute; z-index: 1; top: 73.6%; left: 35.2%; display: grid; place-content: center; width: 29.6%; height: 10.1%; color: #fff; border-radius: 50%; background: radial-gradient(circle at 50% 52%, #1d2054 0 63%, rgba(28, 29, 76, .99) 66%, rgba(28, 29, 76, 0) 70%); font-family: var(--sans); font-weight: 1000; line-height: .93; text-align: center; pointer-events: none; }
.poster-deadline-correction strong { display: block; font-size: clamp(1.95rem, 8.8vw, 4.7rem); letter-spacing: -.12em; }.poster-deadline-correction span { display: block; margin-top: .18em; font-size: clamp(.42rem, 2vw, 1.08rem); font-weight: 900; letter-spacing: .03em; }
@media (min-width: 721px) { .poster-deadline-correction strong { font-size: clamp(2rem, 5.3vw, 4.7rem); }.poster-deadline-correction span { font-size: clamp(.48rem, 1.15vw, 1.08rem); } }