:root {
  --ink:#1c3049;
  --muted:#566d82;
  --blue:#5267d3;
  --lavender:#e9e9ff;
  --cyan:#d8f1ec;
  --coral:#d9876d;
  --gold:#c69543;
  --paper:#f7f5ee;
  --line:rgba(28,48,73,.17);
}

/* Keep the event name dominant in the hero. */
.color-direction-mode .hero h1 { color:#1d3d65; }
.color-direction-mode .hero-event-year { color:#4b74c2; }
.color-direction-mode,
.color-direction-mode body { color:var(--ink); background:#f6f3eb; }
.color-direction-mode .site-header { background:rgba(249,247,240,.94); border-bottom-color:rgba(55,77,110,.18); box-shadow:0 10px 34px rgba(37,52,78,.08); }
.color-direction-mode .brand-symbol { color:#fff; background:linear-gradient(145deg,#5267d3,#188b8c); }
.color-direction-mode .brand-copy strong { color:#1d344f; }
.color-direction-mode .brand-copy span { color:#647b91; }
.color-direction-mode .main-nav a { color:#415873; }
.color-direction-mode .main-nav a:hover { color:#278d88; }
.color-direction-mode .main-nav .nav-cta { border-color:rgba(82,103,211,.42); background:rgba(255,255,255,.82); }
.color-direction-mode .replay { color:#536784; border-color:rgba(82,103,211,.35); }
.color-direction-mode .side-rail.left { background:linear-gradient(180deg,#1b3352,#244f68); border-right-color:rgba(231,187,104,.58); }
.color-direction-mode .side-rail.right { background:linear-gradient(180deg,#4754bd,#6751b5 58%,#277b85); border-left-color:rgba(255,255,255,.36); }
.color-direction-mode .side-rail .rail-group i { background:#e7ba68; box-shadow:0 0 12px rgba(231,186,104,.38); }
.color-direction-mode .intro { background:linear-gradient(135deg,#24395f 0%,#484ba5 56%,#157d82 120%); }
.color-direction-mode .intro-mark circle { fill:#e9bd68; }
.color-direction-mode .hero { background:radial-gradient(ellipse at 16% 12%,rgba(198,235,226,.66),transparent 43%),linear-gradient(118deg,#faf7ee,#eff0ff 58%,#edf7f3); }
.color-direction-mode .hero::before { background:linear-gradient(90deg,#faf7ee 0%,rgba(250,247,238,.97) 27%,rgba(250,247,238,.78) 43%,rgba(250,247,238,.13) 68%,transparent 80%); }
.color-direction-mode .hero h1,.color-direction-mode .section-heading h2 { color:#1f3854; }
.color-direction-mode .hero h1 .accent { color:#4b63cb; text-shadow:0 2px 18px rgba(255,255,255,.48); }
.color-direction-mode .eyebrow { color:#4e64bc; }
.color-direction-mode .event-label,.color-direction-mode .hero-lead { color:#536d83; }
.color-direction-mode .date-pill { color:#314b67; border-color:rgba(75,100,155,.34); background:rgba(255,255,255,.82); }
.color-direction-mode .location,.color-direction-mode .hero-venue { color:#426477; }
.color-direction-mode .hero-proof { border:0; border-radius:0; background:transparent; box-shadow:none; backdrop-filter:none; }
.color-direction-mode .proof-label { color:#203954; text-shadow:0 1px 14px rgba(255,255,255,.88); }
.color-direction-mode .proof-number { color:#435fca; text-shadow:0 1px 16px rgba(255,255,255,.9); }
.color-direction-mode .proof-number small { color:#203954; text-shadow:0 1px 14px rgba(255,255,255,.88); }
.proof-count { font-family:Arial, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif; font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; }
.color-direction-mode .scroll-cue { color:#536d83; }
.color-direction-mode .scroll-cue span { color:#198b83; }
.color-direction-mode .event-ribbon { color:#fff !important; background:linear-gradient(100deg,#263f62 0%,#3f4d92 58%,#28777c 100%) !important; border-color:rgba(224,184,103,.66) !important; }
.color-direction-mode .event-ribbon .ribbon-kicker { color:#f0ca76; }
.color-direction-mode .event-ribbon strong { color:#fff; }
.color-direction-mode .event-ribbon .ribbon-place { color:#e3f1f0; border-color:rgba(255,255,255,.4); }
.color-direction-mode .mid-marquee { color:#fff !important; background:linear-gradient(100deg,#20385b 0%,#4b4b9c 54%,#177c80 100%) !important; border-color:rgba(229,190,112,.75) !important; }
.color-direction-mode .mid-marquee::before,.color-direction-mode .mid-marquee::after { background:linear-gradient(90deg,transparent,rgba(224,241,255,.65) 22%,rgba(255,219,151,.78) 50%,rgba(224,241,255,.65) 78%,transparent); }
.color-direction-mode .mid-marquee-kicker { color:#d4e1fb; }
.color-direction-mode .mid-marquee-ja { color:#ffe3aa; }
.color-direction-mode .mid-marquee-group strong em,.color-direction-mode .mid-marquee-group i { color:#f4cc73; }
.color-direction-mode main > .photo-section.intro-section { background:linear-gradient(118deg,rgba(252,245,228,.76),rgba(225,242,236,.72)) !important; }
.color-direction-mode main > .photo-section.match-section { background:linear-gradient(118deg,rgba(231,237,255,.82),rgba(224,244,241,.72),rgba(249,241,225,.64)) !important; }
.color-direction-mode main > .photo-section.audience-section { background:linear-gradient(118deg,rgba(224,244,238,.78),rgba(242,244,255,.72),rgba(250,241,224,.64)) !important; }
.color-direction-mode main > .photo-section.ambience-section { background:linear-gradient(120deg,#1d3152,#3e4389 60%,#176f77) !important; }
.color-direction-mode main > .photo-section.ambience-section::before { content:"" !important; display:block !important; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(23,39,68,.86),rgba(57,58,125,.62) 56%,rgba(15,104,103,.24)),radial-gradient(ellipse at 80% 18%,rgba(239,194,107,.24),transparent 43%) !important; }
.color-direction-mode main > .editorial-section.lineup-section { background:linear-gradient(115deg,rgba(235,235,255,.82),rgba(226,245,240,.72),rgba(251,241,225,.68)) !important; }
.color-direction-mode main > .editorial-section.organizer-section { background:linear-gradient(115deg,rgba(234,235,255,.76),rgba(222,242,238,.82),rgba(249,239,227,.66)) !important; }
.color-direction-mode main > .editorial-section.faq-section { background:linear-gradient(115deg,rgba(250,243,229,.84),rgba(232,239,251,.78)) !important; }
.color-direction-mode main > .editorial-section.company-section { background:linear-gradient(115deg,rgba(221,241,237,.78),rgba(234,234,255,.82),rgba(250,241,225,.64)) !important; }
.color-direction-mode main > .photo-section.info-section#event-info { background-color:#f6f3eb !important; background-image:linear-gradient(118deg,rgba(249,239,219,.35),rgba(226,239,249,.28)),url("assets/backgrounds/desktop/10_event_info_hall.jpg") !important; }
.color-direction-mode #concept-title { color:#315ca8; }
.color-direction-mode #connections-title { color:#3c63b4; }
.color-direction-mode #audience-title { color:transparent; background-image:linear-gradient(100deg,#087f78 0%,#15956f 54%,#73a84e 100%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.color-direction-mode #ambience-title { color:#fff; text-shadow:0 4px 26px rgba(14,26,53,.25); }
.color-direction-mode #lineup-title { color:#6656a9; }
.color-direction-mode #next-creator-movie-title { color:#315d86; }
.color-direction-mode #organizer-title { color:#315d86; }
.color-direction-mode #faq-title { color:#2a7180; }
.color-direction-mode #company-title { color:#575eae; }
.color-direction-mode #event-title { color:#2a647b; }
.color-direction-mode .section-heading h2::after { content:""; display:block; width:72px; height:3px; margin:17px auto 0; border-radius:99px; background:var(--heading-accent,linear-gradient(90deg,#5267d3,#16a194,#e1ad56)); box-shadow:0 3px 13px rgba(67,94,176,.2); }
.color-direction-mode #concept { --heading-accent:linear-gradient(90deg,#d4a14d,#536bd3); }
.color-direction-mode #connections { --heading-accent:linear-gradient(90deg,#4c69d0,#28a79b); }
.color-direction-mode .audience-section { --heading-accent:linear-gradient(90deg,#22a99a,#a5c96c); }
.color-direction-mode .ambience-section { --heading-accent:linear-gradient(90deg,#f2cb75,#a8e6d8); }
.color-direction-mode .lineup-section { --heading-accent:linear-gradient(90deg,#9273d2,#4a6bd1); }
.color-direction-mode .movie-section { --heading-accent:linear-gradient(90deg,#4c69d0,#28a79b); }
.color-direction-mode .organizer-section { --heading-accent:linear-gradient(90deg,#df946f,#5e82bb); }
.color-direction-mode .faq-section { --heading-accent:linear-gradient(90deg,#36a9a0,#6984ca); }
.color-direction-mode .company-section { --heading-accent:linear-gradient(90deg,#4bb3a6,#8070cf); }
.color-direction-mode #event-info { --heading-accent:linear-gradient(90deg,#cf9840,#2b93a0); }
.color-direction-mode .section-index { color:#536ac3; }
.color-direction-mode .section-index::after { content:""; display:inline-block; width:6px; height:6px; margin-left:12px; border-radius:50%; background:currentColor; box-shadow:0 0 0 5px rgba(82,103,211,.1),0 0 12px currentColor; vertical-align:middle; }
.color-direction-mode #concept .section-index { color:#b78238; }
.color-direction-mode #connections .section-index { color:#4e68c5; }
.color-direction-mode .audience-section .section-index { color:#168d83; }
.color-direction-mode .ambience-section .section-index { color:#e9c36e; }
.color-direction-mode .lineup-section .section-index { color:#7960b7; }
.color-direction-mode .movie-section .section-index { color:#3b8192; }
.color-direction-mode .organizer-section .section-index { color:#ca775f; }
.color-direction-mode .faq-section .section-index { color:#3b8192; }
.color-direction-mode .company-section .section-index { color:#5b63b5; }
.color-direction-mode #event-info .section-index { color:#b78238; }
.color-direction-mode .section-heading p,.color-direction-mode .intro-copy p { color:#536b80; }
.color-direction-mode .section-photo { filter:saturate(1.12) contrast(1.04) brightness(1.02); }
.color-direction-mode .match-item { border-color:rgba(66,94,160,.2); background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(240,242,255,.91)); box-shadow:0 14px 34px rgba(50,67,112,.1); }
.color-direction-mode .match-item:nth-child(3n+1) { border-top:4px solid #536ad1; }
.color-direction-mode .match-item:nth-child(3n+2) { border-top:4px solid #26a392; }
.color-direction-mode .match-item:nth-child(3n) { border-top:4px solid #dda94e; }
.color-direction-mode .match-no { color:#4e63c5; }
.color-direction-mode .match-item h3 { color:#253d5a; }
.color-direction-mode .match-item p { color:#536b80; }
.color-direction-mode .audience { border-color:rgba(39,142,134,.2); border-top:4px solid #27a394; background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(231,246,241,.92)); box-shadow:0 14px 34px rgba(42,93,96,.09); }
.color-direction-mode .audience:nth-child(2n) { border-top-color:#7482d7; background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(238,237,255,.92)); }
.color-direction-mode .audience-label { color:#177f79; }
.color-direction-mode .audience:nth-child(2n) .audience-label { color:#5d62b7; }
.color-direction-mode .audience h3 { color:#243d58; }
.color-direction-mode .creator-card { border-color:rgba(72,89,154,.22); background:rgba(255,255,255,.95); box-shadow:0 16px 38px rgba(46,62,110,.11); }
.color-direction-mode .creator-card:nth-child(3n+1) { border-top:4px solid #6b6ed1; }
.color-direction-mode .creator-card:nth-child(3n+2) { border-top:4px solid #29a494; }
.color-direction-mode .creator-card:nth-child(3n) { border-top:4px solid #dda94e; }
.color-direction-mode .creator-type { color:#5368bd; }
.color-direction-mode .creator-copy h3 { color:#243b58; }
.color-direction-mode .creator-followers strong { color:#3f5dc5; }
.color-direction-mode .organizer-section .message-card { border:1px solid rgba(65,108,146,.18); border-top:4px solid #dca95a; background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(240,245,255,.94) 64%,rgba(235,248,243,.92)); box-shadow:0 18px 44px rgba(44,69,107,.11); }
.color-direction-mode .organizer-section .message-card blockquote { color:#2b4564; }
.color-direction-mode .organizer-section .message-card > p { color:#536c80; }
.color-direction-mode .organizer-profile-role { color:#21877f; }
.color-direction-mode .organizer-metric strong { color:#4c62c6; }
.color-direction-mode .organizer-instagram { color:#6670c8; }
.color-direction-mode .faq-list details { border-color:rgba(63,113,133,.22); }
.color-direction-mode .faq-list summary { color:#263e5b; }
.color-direction-mode .faq-list details[open] summary { color:#267f82; }
.color-direction-mode .faq-list details p { color:#536a80; }
.color-direction-mode .faq-inline-link { color:#4164c6; }
.color-direction-mode .company-affiliation { border-bottom:1px solid rgba(77,94,156,.2); }
.color-direction-mode .company-affiliation h3 { color:#2c4f6d; }
.color-direction-mode .company-affiliation h3 a,.color-direction-mode .company-link { color:#5366c5; }
.color-direction-mode .company-link { border-color:rgba(83,102,197,.52); }
.color-direction-mode .host-kicker { color:#b8843d; }
.color-direction-mode .host-name { color:#294563; }
.color-direction-mode .host-desc { color:#536b80; }
.color-direction-mode .host-stats span { color:#416784; border-color:rgba(40,137,133,.24); background:rgba(225,244,239,.75); }
.color-direction-mode .event-panel { border-color:rgba(74,91,160,.2); border-top:4px solid #5967c7; background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(241,240,255,.94) 64%,rgba(232,247,243,.93)); box-shadow:0 18px 48px rgba(49,65,116,.12); }
.color-direction-mode .event-panel h3 { color:#2d4e70; }
.color-direction-mode .event-row { border-color:rgba(74,91,160,.18); }
.color-direction-mode .event-row span:first-child { color:#5267c6; }
.color-direction-mode .event-row span:last-child { color:#4b687c; }
.color-direction-mode .footer { background:linear-gradient(100deg,rgba(230,235,255,.9),rgba(222,243,238,.92),rgba(250,239,219,.9)) !important; border-top-color:rgba(83,101,184,.23) !important; }
.color-direction-mode .footer-title { color:#253c5b !important; }
.color-direction-mode .footer-note { color:#50697f !important; }
.color-direction-mode .network-pointer-glow { background:radial-gradient(circle,rgba(255,255,255,.98) 0,rgba(174,237,222,.64) 7%,rgba(98,142,226,.32) 24%,rgba(154,123,219,.18) 46%,transparent 73%); }
@media (max-width:760px) {
  .color-direction-mode .hero { background:linear-gradient(180deg,rgba(33,50,81,.03),rgba(246,243,235,.98) 75%); }
  .color-direction-mode .hero::before { background:linear-gradient(180deg,rgba(23,35,57,.14),rgba(23,35,57,.05) 38%,rgba(246,243,235,.35) 68%,#f6f3eb 86%) !important; }
  .color-direction-mode .section-heading h2::after { width:48px; height:2px; margin-top:13px; }
  .color-direction-mode.center-preview .hero-gallery::before {
    background:radial-gradient(ellipse 96% 48% at 50% 47%,rgba(250,248,239,.97) 0%,rgba(250,248,239,.92) 40%,rgba(250,248,239,.72) 66%,rgba(250,248,239,.28) 86%,transparent 100%),linear-gradient(180deg,rgba(250,248,239,.2),transparent 34%,rgba(250,248,239,.2)) !important;
  }
  .color-direction-mode.center-preview .hero-message { color:#1d3d65; }
  .color-direction-mode.center-preview .hero-message .eyebrow { color:#385f9e; text-shadow:0 1px 8px rgba(255,252,244,.96); }
  .color-direction-mode.center-preview .hero-message .event-label { color:#43566e; text-shadow:0 1px 8px rgba(255,252,244,.96); }
  .color-direction-mode.center-preview .hero-message h1 { color:#1d3d65; text-shadow:0 1px 8px rgba(255,252,244,.96); }
}

/* Mobile polish: keep the rails continuously filled and simplify title movement. */
@media (max-width:760px) {
  .color-direction-mode .side-rail .rail-group {
    min-height:100vh;
    min-height:100svh;
    flex:0 0 auto;
    justify-content:space-around;
    gap:0;
    padding:16px 0;
  }
  .color-direction-mode .side-rail .rail-group span {
    font-size:7px;
    line-height:1.25;
    letter-spacing:.1em;
  }
  .color-direction-mode .side-rail .rail-group i {
    width:4px;
    height:4px;
    flex-basis:4px;
  }
  .color-direction-mode .section-heading .section-index {
    margin-bottom:17px;
    line-height:1.45;
  }
  body.title-motion-ready .section-heading h2.title-motion[data-title-motion="rise"],
  body.title-motion-ready .section-heading h2.title-motion[data-title-motion="wipe"],
  body.title-motion-ready .section-heading h2.title-motion[data-title-motion="drop"] {
    transform:translate3d(0,12px,0);
    transform-origin:center center;
    filter:none;
    clip-path:none;
  }
  .color-direction-mode #faq-title {
    position:relative;
    z-index:1;
    margin:0;
    line-height:1.28;
  }
  .color-direction-mode .faq-section .section-heading {
    row-gap:0;
  }
}

/* Animated hero event title, revealed after the opening logo transition. */
.color-direction-mode .hero h1.hero-event-title {
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  max-width:100%;
  margin:14px auto 24px;
  color:#1d3d65;
  font-size:clamp(48px,6vw,78px);
  font-weight:800;
  line-height:1.04;
  letter-spacing:-.035em;
  text-align:center;
  white-space:normal;
}
.color-direction-mode .hero-event-name {
  display:block;
  max-width:100%;
  white-space:nowrap;
  opacity:0;
  clip-path:inset(0 100% 0 0);
}
.color-direction-mode .hero-event-year {
  display:block;
  margin-top:.08em;
  padding-left:.16em;
  color:#4b74c2;
  font-size:.84em;
  line-height:1;
  letter-spacing:.16em;
  opacity:0;
  transform:translateY(.32em) scale(.9);
  filter:blur(6px);
}
body.color-direction-mode:not(.intro-playing) .hero-event-name {
  animation:event-title-wipe .88s cubic-bezier(.2,.75,.2,1) .12s both;
}
body.color-direction-mode:not(.intro-playing) .hero-event-year {
  animation:event-year-arrive .72s cubic-bezier(.16,.82,.2,1.12) .48s both;
}
@keyframes event-title-wipe {
  to { opacity:1; clip-path:inset(0 0 0 0); }
}
@keyframes event-year-arrive {
  to { opacity:1; transform:translateY(0) scale(1); filter:blur(0); }
}
@media (max-width:760px) {
  .color-direction-mode .hero h1.hero-event-title {
    margin:12px auto 0;
    font-size:clamp(18px,6.35vw,37px);
    line-height:1.08;
    letter-spacing:-.035em;
  }
  .color-direction-mode .hero-event-year {
    margin-top:.13em;
    font-size:.96em;
    letter-spacing:.14em;
  }
}
@media (prefers-reduced-motion:reduce) {
  .color-direction-mode .hero-event-name {
    opacity:1;
    clip-path:none;
  }
  .color-direction-mode .hero-event-year {
    opacity:1;
    transform:none;
    filter:none;
  }
}


/* Hero copy chosen from concept option 04. */
.hero-scale-copy {
  width:100%;
  max-width:920px;
  margin:clamp(14px,1.8vw,23px) auto 0;
  padding:clamp(12px,1.55vw,19px) clamp(14px,2.5vw,32px);
  color:#fff;
  font-family:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho","YuMincho","MS PMincho",serif;
  border-top:1px solid rgba(230,190,112,.82);
  border-bottom:1px solid rgba(230,190,112,.82);
  background:linear-gradient(108deg,rgba(21,39,66,.62),rgba(30,48,78,.68) 53%,rgba(21,45,59,.64));
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  box-shadow:0 14px 38px rgba(12,28,52,.18);
}
.hero-scale-lead {
  display:flex;
  flex-direction:column;
  align-items:baseline;
  justify-content:center;
  gap:.02em;
  margin:0;
  color:#fff;
  font-size:clamp(23px,2.55vw,36px);
  font-weight:600;
  line-height:1.28;
  letter-spacing:.015em;
  text-wrap:balance;
  line-break:strict;
}
.hero-scale-lead-line { display:block; width:100%; text-align:center; }
.hero-scale-lead-line:first-child:not(:last-child) { display:flex; align-items:baseline; justify-content:center; gap:.2em; }
.hero-scale-lead-line:last-child { letter-spacing:.08em; }
.hero-scale-lead strong {
  color:#f0c86f;
  font-size:1.14em;
  font-weight:700;
  letter-spacing:-.025em;
}
.hero-scale-categories {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:5px 13px;
  margin:8px 0 0;
  color:rgba(255,255,255,.9);
  font-size:clamp(13px,1.45vw,17px);
  font-weight:600;
  line-height:1.45;
  letter-spacing:.08em;
}
.hero-scale-categories i,
.hero-scale-stats i {
  display:inline-block;
  width:1px;
  height:1.05em;
  background:rgba(230,190,112,.88);
  transform:translateY(.12em);
}
.hero-scale-stats {
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:center;
  gap:6px 15px;
  margin:10px 0 0;
  color:#f1d38f;
  font-size:clamp(15px,1.65vw,20px);
  font-weight:700;
  line-height:1.45;
  letter-spacing:.035em;
  font-variant-numeric:tabular-nums;
}
.hero-scale-stats strong {
  margin-left:.16em;
  color:#f5d27e;
  font-size:1.22em;
  font-weight:800;
  letter-spacing:-.025em;
  white-space:nowrap;
}
body.color-direction-mode:not(.intro-playing) .hero-scale-copy {
  animation:hero-scale-reveal .78s cubic-bezier(.2,.75,.2,1) .58s both;
}
@keyframes hero-scale-reveal {
  from { opacity:0; transform:translateY(14px); }
  to { opacity:1; transform:translateY(0); }
}
@media (max-width:760px) {
  .hero-scale-copy {
    width:100%;
    margin-top:14px;
    padding:10px 8px 11px;
    background:rgba(23,40,66,.64);
    -webkit-backdrop-filter:blur(7px);
    backdrop-filter:blur(7px);
    box-shadow:0 10px 28px rgba(12,28,52,.2);
  }
  .hero-scale-lead {
    gap:.06em;
    font-size:clamp(18px,5.05vw,25px);
    line-height:1.34;
    letter-spacing:0;
  }
  .hero-scale-lead-line:last-child { letter-spacing:.04em; }
  .hero-scale-categories {
    gap:4px 7px;
    margin-top:7px;
    font-size:clamp(10px,2.85vw,12px);
    letter-spacing:.035em;
  }
  .hero-scale-stats {
    gap:5px 9px;
    margin-top:7px;
    font-size:clamp(10px,2.9vw,12px);
    letter-spacing:0;
  }
  .hero-scale-stats i { display:none; }
  .hero-scale-stats strong { margin-left:.12em; }
}
@media (prefers-reduced-motion:reduce) {
  .hero-scale-copy { animation:none !important; }
}

/* Mobile participant list: one creator per row. Later additions stay below the first three. */
@media (max-width:760px) {
  .color-direction-mode .lineup-section .creator-grid {
    grid-template-columns:minmax(0,1fr);
    gap:28px;
  }
  .color-direction-mode .lineup-section .creator-card:nth-child(1) { order:1; }
  .color-direction-mode .lineup-section .creator-card:nth-child(3) { order:2; }
  .color-direction-mode .lineup-section .creator-card:nth-child(2) { order:3; }
  .color-direction-mode .lineup-section .creator-card:nth-child(n+4) { order:99; }
}

/* Make the organizer portrait easier to see on desktop and mobile. */
.color-direction-mode .organizer-profile { grid-template-columns:160px minmax(0,1fr); }
.color-direction-mode .organizer-avatar { width:160px; }
@media (max-width:620px) {
  .color-direction-mode .organizer-profile { grid-template-columns:1fr; }
  .color-direction-mode .organizer-avatar { width:138px; }
}

/* Fill the event ticker with repeating event and connection messages. */
.color-direction-mode .event-ribbon-track { animation-duration:52s; }
.color-direction-mode .event-ribbon-inner {
  width:max-content;
  flex:0 0 max-content;
  justify-content:flex-start;
  gap:clamp(18px,2.3vw,36px);
  padding:0 clamp(36px,5vw,70px);
}
.color-direction-mode .ribbon-message {
  color:#e9f0fb;
  font-size:clamp(11px,1vw,15px);
  font-weight:600;
  letter-spacing:.04em;
  white-space:nowrap;
}
.color-direction-mode .ribbon-divider {
  color:#f0c66c;
  font-size:13px;
  font-style:normal;
}
@media (max-width:760px) {
  .color-direction-mode .event-ribbon-track { animation-duration:44s; }
  .color-direction-mode .event-ribbon-inner { gap:16px; padding:0 26px; }
  .color-direction-mode .ribbon-message { font-size:9px; letter-spacing:.02em; }
  .color-direction-mode .ribbon-divider { font-size:10px; }
}
@media (prefers-reduced-motion:reduce) {
  .color-direction-mode .event-ribbon-track { animation-duration:70s; }
}

/* Three full-width flip cards under the concept headline. */
.color-direction-mode .intro-section .concept-flip-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:13px;
  width:100%;
  margin:38px auto 0;
}
.color-direction-mode .concept-flip-card {
  display:block;
  width:100%;
  min-height:158px;
  padding:0;
  border:0;
  border-radius:9px;
  color:inherit;
  background:transparent;
  font:inherit;
  text-align:left;
  cursor:pointer;
  perspective:1200px;
  -webkit-tap-highlight-color:transparent;
}
.color-direction-mode .concept-flip-card:nth-child(1) { --concept-accent:#596cc7; --concept-accent-rgb:89,108,199; }
.color-direction-mode .concept-flip-card:nth-child(2) { --concept-accent:#218f8a; --concept-accent-rgb:33,143,138; }
.color-direction-mode .concept-flip-card:nth-child(3) { --concept-accent:#c38e3e; --concept-accent-rgb:195,142,62; }
.color-direction-mode .concept-flip-inner {
  position:relative;
  display:block;
  width:100%;
  min-height:158px;
  transform-style:preserve-3d;
  transition:transform .72s cubic-bezier(.2,.72,.18,1);
}
.color-direction-mode .concept-flip-card.is-flipped .concept-flip-inner { transform:rotateX(180deg); }
.color-direction-mode .concept-card-face {
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns:minmax(170px,220px) minmax(0,1fr) 150px;
  align-items:center;
  gap:22px;
  box-sizing:border-box;
  min-height:158px;
  padding:25px clamp(24px,3.2vw,46px);
  overflow:hidden;
  border:1px solid rgba(var(--concept-accent-rgb),.22);
  border-top:3px solid var(--concept-accent);
  border-radius:9px;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.color-direction-mode .concept-card-front {
  color:#213754;
  background:linear-gradient(108deg,rgba(255,255,255,.97),rgba(246,248,255,.94) 62%,rgba(238,247,244,.92));
  box-shadow:0 12px 32px rgba(39,57,93,.08);
}
.color-direction-mode .concept-card-category { display:flex; flex-direction:column; gap:5px; }
.color-direction-mode .concept-card-category-en {
  color:var(--concept-accent);
  font-family:Georgia,"Times New Roman",serif;
  font-size:11px;
  font-weight:700;
  letter-spacing:.16em;
}
.color-direction-mode .concept-card-category-ja { color:#62748a; font-size:12px; font-weight:600; letter-spacing:.08em; }
.color-direction-mode .concept-card-title {
  display:block;
  color:#213754;
  font-size:clamp(20px,2vw,29px);
  font-weight:750;
  line-height:1.5;
  letter-spacing:.005em;
  text-wrap:balance;
}
.color-direction-mode .concept-card-hint {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  color:#6475b8;
  font-size:9px;
  font-weight:700;
  letter-spacing:.1em;
  white-space:nowrap;
}
.color-direction-mode .concept-card-hint span { color:var(--concept-accent); font-size:20px; line-height:1; }
.color-direction-mode .concept-card-back {
  transform:rotateX(180deg);
  color:#fff;
  background:linear-gradient(105deg,#24395d 0%,#3e4789 54%,#176f76 100%);
  box-shadow:0 14px 34px rgba(31,48,82,.16);
}
.color-direction-mode .concept-card-back-category {
  color:#f0ca76;
  font-size:11px;
  font-weight:700;
  letter-spacing:.11em;
  white-space:nowrap;
}
.color-direction-mode .concept-card-copy {
  display:block;
  color:#fff;
  font-size:clamp(15px,1.3vw,19px);
  font-weight:600;
  line-height:1.8;
  letter-spacing:.025em;
  text-wrap:pretty;
}
.color-direction-mode .concept-card-back .concept-card-hint { color:#e1e8f5; }
.color-direction-mode .concept-card-back .concept-card-hint span { color:#f0ca76; }
.color-direction-mode .concept-flip-card:hover .concept-card-front { box-shadow:0 18px 42px rgba(39,57,93,.15); }
.color-direction-mode .concept-flip-card:focus-visible { outline:3px solid rgba(82,103,211,.72); outline-offset:4px; }
@media (max-width:760px) {
  .color-direction-mode .intro-section .concept-flip-grid { gap:10px; margin-top:27px; }
  .color-direction-mode .concept-flip-card,
  .color-direction-mode .concept-flip-inner,
  .color-direction-mode .concept-card-face { min-height:176px; }
  .color-direction-mode .concept-card-face {
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto 1fr auto;
    gap:9px 10px;
    padding:18px 17px;
  }
  .color-direction-mode .concept-card-category,
  .color-direction-mode .concept-card-back-category { grid-column:1/-1; }
  .color-direction-mode .concept-card-category { flex-direction:row; align-items:baseline; gap:9px; }
  .color-direction-mode .concept-card-category-en { font-size:9px; }
  .color-direction-mode .concept-card-category-ja { font-size:10px; }
  .color-direction-mode .concept-card-title,
  .color-direction-mode .concept-card-copy { grid-column:1/-1; }
  .color-direction-mode .concept-card-title { font-size:clamp(17px,4.8vw,22px); line-height:1.45; }
  .color-direction-mode .concept-card-copy { font-size:clamp(13px,3.8vw,16px); line-height:1.65; }
  .color-direction-mode .concept-card-hint { grid-column:1/-1; justify-content:flex-start; font-size:8px; }
  .color-direction-mode .concept-card-hint span { font-size:16px; }
  .color-direction-mode .concept-card-back-category { font-size:9px; }
}

/* Match the full-width hover-to-ticker interaction used by the reference strips. */
.color-direction-mode .intro-section .concept-flip-grid {
  position:relative;
  left:50%;
  width:calc(100vw - var(--rail-width) - var(--rail-width) - 15px);
  max-width:none;
  display:flex;
  flex-direction:column;
  gap:0;
  margin:clamp(28px,3.2vw,44px) 0 0;
  border-top:1px solid rgba(32,54,83,.22);
  transform:translateX(-50%);
}
.color-direction-mode .concept-flip-card {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:100%;
  min-height:clamp(112px,10vw,148px);
  border:0;
  border-radius:0;
  border-bottom:1px solid rgba(32,54,83,.22);
  background:transparent;
  box-shadow:none;
  perspective:1100px;
  cursor:pointer;
}
.color-direction-mode .concept-flip-inner {
  position:relative;
  display:block;
  width:100%;
  min-height:inherit;
  transform-style:preserve-3d;
  transition:transform .58s cubic-bezier(.2,.78,.18,1);
}
.color-direction-mode .concept-flip-card.is-flipped .concept-flip-inner { transform:rotateX(180deg); }
.color-direction-mode .concept-flip-card::before {
  position:absolute;
  z-index:0;
  inset:0;
  content:"";
  opacity:0;
  pointer-events:none;
  background:linear-gradient(105deg,#172b47 0%,#223e5d 58%,#304b69 100%);
  transform:perspective(1100px) rotateX(-76deg);
  transform-origin:top center;
  backface-visibility:hidden;
  transition:transform .58s cubic-bezier(.2,.78,.18,1),opacity .18s ease;
}
.color-direction-mode .concept-flip-card.is-flipped::before { opacity:1; transform:perspective(1100px) rotateX(0); }
.color-direction-mode .concept-card-face {
  position:absolute;
  inset:0;
  display:block;
  min-height:inherit;
  padding:clamp(19px,2.4vw,31px) clamp(20px,4.5vw,76px);
  overflow:hidden;
  border:0;
  border-top:2px solid var(--concept-accent);
  border-radius:0;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.color-direction-mode .concept-card-front {
  display:grid;
  grid-template-columns:clamp(170px,18vw,230px) minmax(0,1fr) 28px;
  align-items:center;
  gap:clamp(16px,2.8vw,42px);
  color:#213754;
  background:rgba(255,255,255,.34);
  box-shadow:none;
}
.color-direction-mode .concept-card-category { display:flex; flex-direction:column; gap:5px; }
.color-direction-mode .concept-card-category-en {
  color:var(--concept-accent);
  font-size:11px;
  font-weight:700;
  letter-spacing:.16em;
}
.color-direction-mode .concept-card-category-ja { color:#62748a; font-size:12px; font-weight:600; letter-spacing:.08em; }
.color-direction-mode .concept-card-title {
  display:block;
  color:#213754;
  font-size:clamp(20px,2vw,29px);
  font-weight:750;
  line-height:1.5;
  letter-spacing:.005em;
  text-wrap:balance;
}
.color-direction-mode .concept-card-hint {
  display:flex;
  align-items:center;
  justify-content:center;
  color:#6074cf;
  font-family:Georgia,"Times New Roman",serif;
  font-size:26px;
  line-height:1;
}
.color-direction-mode .concept-card-back {
  display:flex;
  align-items:center;
  padding:0;
  color:#fff;
  background:transparent;
  box-shadow:none;
  transform:rotateX(180deg);
}
.color-direction-mode .concept-card-marquee {
  display:flex;
  align-items:center;
  width:100%;
  height:100%;
  overflow:hidden;
  padding:0 clamp(62px,9vw,140px);
}
.color-direction-mode .concept-card-marquee-track {
  display:flex;
  width:max-content;
  flex:0 0 auto;
  will-change:transform;
}
.color-direction-mode .concept-card-marquee-group {
  display:flex;
  align-items:center;
  flex:0 0 auto;
  gap:clamp(22px,3.2vw,54px);
  padding-right:clamp(22px,3.2vw,54px);
  color:#f7f5eb;
  font-size:clamp(17px,1.8vw,25px);
  font-weight:650;
  letter-spacing:.025em;
  line-height:1.35;
  white-space:nowrap;
}
.color-direction-mode .concept-card-back-category {
  color:#e1bd76;
  font-size:11px;
  font-weight:700;
  letter-spacing:.1em;
}
.color-direction-mode .concept-card-copy { color:#fff; font-size:inherit; font-weight:inherit; line-height:inherit; }
.color-direction-mode .concept-card-marquee-group i { color:#e1bd76; font-size:.8em; font-style:normal; }
.color-direction-mode .concept-flip-card.is-flipped .concept-card-marquee-track { animation:concept-card-marquee-scroll 24s linear infinite; }
@keyframes concept-card-marquee-scroll { to { transform:translate3d(-50%,0,0); } }
.color-direction-mode .concept-flip-card:focus-visible { outline:2px solid #d9b46d; outline-offset:-4px; }
@media (max-width:760px) {
  .color-direction-mode .intro-section .concept-flip-grid {
    width:calc(100vw - var(--rail-width) - var(--rail-width));
    margin-top:24px;
  }
  .color-direction-mode .concept-flip-card,
  .color-direction-mode .concept-flip-inner { min-height:120px; }
  .color-direction-mode .concept-card-face { min-height:120px; padding:14px 16px; }
  .color-direction-mode .concept-card-front {
    grid-template-columns:minmax(0,1fr) 20px;
    grid-template-rows:auto auto;
    gap:5px 10px;
  }
  .color-direction-mode .concept-card-category {
    grid-column:1;
    grid-row:1;
    flex-direction:row;
    align-items:baseline;
    gap:9px;
  }
  .color-direction-mode .concept-card-category-en { font-size:9px; }
  .color-direction-mode .concept-card-category-ja { font-size:10px; }
  .color-direction-mode .concept-card-title { grid-column:1; grid-row:2; font-size:clamp(16px,4.6vw,20px); line-height:1.4; }
  .color-direction-mode .concept-card-hint { grid-column:2; grid-row:1 / span 2; font-size:20px; }
  .color-direction-mode .concept-card-marquee { padding-right:38px; padding-left:55px; }
  .color-direction-mode .concept-card-marquee-group { gap:17px; padding-right:17px; font-size:16px; }
  .color-direction-mode .concept-card-back-category { font-size:9px; }
}
@media (prefers-reduced-motion:reduce) {
  .color-direction-mode .concept-flip-inner,
  .color-direction-mode .concept-flip-card::before { transition:none; }
  .color-direction-mode .concept-flip-card.is-flipped .concept-card-marquee-track { animation:none; }
}

/* Keep the concept copy centered as a single, full-width band. */
.color-direction-mode .concept-card-front {
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto auto;
  align-content:center;
  justify-items:center;
  gap:8px;
  text-align:center;
}
.color-direction-mode .concept-card-category {
  grid-column:1;
  justify-content:center;
  align-items:baseline;
  flex-direction:row;
  gap:10px;
  text-align:center;
}
.color-direction-mode .concept-card-title {
  grid-column:1;
  width:min(100%,1040px);
  text-align:center;
}
.color-direction-mode .concept-card-hint {
  position:absolute;
  top:50%;
  right:clamp(18px,4vw,60px);
  transform:translateY(-50%);
}
@media (max-width:760px) {
  .color-direction-mode .concept-card-front {
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto;
    gap:7px;
    padding:14px 32px;
  }
  .color-direction-mode .concept-card-category {
    grid-column:1;
    grid-row:1;
    flex-direction:row;
    justify-content:center;
    align-items:baseline;
  }
  .color-direction-mode .concept-card-title { grid-column:1; grid-row:2; }
  .color-direction-mode .concept-card-hint {
    grid-column:auto;
    grid-row:auto;
    right:13px;
  }
}

.color-direction-mode .lineup-section .creator-followers strong {
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  font-weight:800;
  letter-spacing:0;
  font-variant-numeric:lining-nums tabular-nums;
  font-feature-settings:"lnum" 1,"tnum" 1;
}

@media (max-width:760px) {
  .color-direction-mode #concept .section-inner { padding-bottom:8px; }
  .color-direction-mode #connections .section-inner { padding-top:10px; padding-bottom:10px; }
  .color-direction-mode .audience-section .section-inner { padding-top:10px; padding-bottom:8px; }
  .color-direction-mode .ambience-section .section-inner { padding-top:28px; padding-bottom:28px; }
  .color-direction-mode .ambience-section .ambience-copy {
    width:100%;
    max-width:100%;
    padding:19px 17px 22px;
    border:1px solid rgba(255,255,255,.86);
    border-top:3px solid #d7b66f;
    border-radius:14px;
    background:rgba(250,249,245,.97);
    box-shadow:0 12px 28px rgba(9,24,49,.2);
    backdrop-filter:blur(8px);
    text-align:center;
  }
  .color-direction-mode .ambience-section .ambience-copy .section-heading { max-width:none; }
  .color-direction-mode .ambience-section .ambience-copy .section-index { color:#98743b; }
  .color-direction-mode .ambience-section .ambience-copy #ambience-title {
    color:#203653;
    font-size:clamp(23px,6.4vw,30px);
    line-height:1.42;
    text-shadow:none;
  }
}


/* Keep every connection strip on the same mobile grid. */
@media (max-width:760px) {
  .color-direction-mode.center-preview #connections .match-item {
    grid-template-columns:29px minmax(0,1fr) 19px;
    justify-items:stretch;
    align-items:center;
    gap:11px;
    padding:18px 14px;
  }
  .color-direction-mode.center-preview #connections .match-no {
    grid-column:1;
    grid-row:1;
    text-align:left;
  }
  .color-direction-mode.center-preview #connections .strip-copy {
    grid-column:2;
    grid-row:1;
    width:100%;
    text-align:center;
  }
  .color-direction-mode.center-preview #connections .strip-copy h3 { text-align:center; }
  .color-direction-mode.center-preview #connections .strip-arrow {
    position:static;
    grid-column:3;
    grid-row:1;
    align-self:center;
    transform:none;
  }
  .color-direction-mode.center-preview #connections .match-item:hover .strip-arrow,
  .color-direction-mode.center-preview #connections .match-item:focus-visible .strip-arrow { transform:translateX(4px); }
  .color-direction-mode.center-preview #event-info .host-desc br { margin-top:0; }
}

.color-direction-mode main > .editorial-section.movie-section {
  background:linear-gradient(118deg,rgba(231,237,255,.9),rgba(223,244,239,.92),rgba(249,241,225,.84));
}
.color-direction-mode .movie-section .section-heading { max-width:none; text-align:center; }
.color-direction-mode .movie-frame {
  width:min(960px,100%);
  aspect-ratio:16 / 9;
  margin:32px auto 0;
  overflow:hidden;
  border:1px solid rgba(62,87,145,.24);
  border-radius:8px;
  background:#14243a;
  box-shadow:0 22px 54px rgba(37,57,98,.2);
}
.color-direction-mode .movie-frame iframe { display:block; width:100%; height:100%; border:0; }
@media (max-width:760px) {
  .color-direction-mode .movie-section .editorial-inner { padding-top:58px; padding-bottom:62px; }
  .color-direction-mode .movie-frame { margin-top:25px; border-radius:5px; }
}

@media (max-width:620px) {
  .color-direction-mode.center-preview #organizer .organizer-profile { padding-bottom:12px; }
  .color-direction-mode.center-preview #organizer .message-signature { margin-top:12px; }
}

/* Keep the organizer's message full width and prevent its authored lines from wrapping. */
.center-preview #organizer .message-signature { width:100%; gap:15px; }
.center-preview #organizer .organizer-message {
  width:100%;
  min-width:0;
  max-width:none;
  flex:0 0 auto;
  align-self:stretch;
  margin:0 auto;
  color:#536c80;
  font-size:clamp(18px,1.75vw,21px);
  line-height:1.8;
  letter-spacing:.025em;
  text-align:center;
  text-wrap:normal;
}
.center-preview #organizer .organizer-message-line { display:inline; white-space:nowrap; }
.center-preview #organizer .organizer-message-desktop-break { display:block; }
@media (max-width:620px) {
  .center-preview #organizer .organizer-message {
    font-size:clamp(10px,3.6vw,14px);
    line-height:1.8;
    letter-spacing:0;
  }
  .center-preview #organizer .organizer-message-line { display:block; }
  .center-preview #organizer .organizer-message-desktop-break { display:none; }
}

/* Preserve the requested headline line breaks on narrow screens. */
.color-direction-mode .concept-card-title-line { display:inline; }
@media (max-width:760px) {
  .color-direction-mode .concept-card-title-line {
    display:block;
    white-space:nowrap;
  }
}