:root {
  --bg: #fffdfb;
  --surface: rgba(255,255,255,.82);
  --surface-solid: #ffffff;
  --text: #171719;
  --muted: #6b6b74;
  --line: rgba(20,20,24,.12);
  --red: #ff2744;
  --red-deep: #e61635;
  --yellow: #ffd63d;
  --black: #111114;
  --shadow: 0 18px 60px rgba(16,16,20,.12);
  --header-h: 72px;
  --radius: 28px;
  color-scheme: light;
}

html[data-theme="dark"] {
  --bg: #09090b;
  --surface: rgba(21,21,25,.80);
  --surface-solid: #151519;
  --text: #fafafa;
  --muted: #aaaab4;
  --line: rgba(255,255,255,.12);
  --shadow: 0 22px 70px rgba(0,0,0,.42);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  overflow-x: hidden;
  transition: background-color .35s ease, color .35s ease;
}
body::before {
  content:"";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -3;
  opacity: .42;
  background-image:
    radial-gradient(circle at 15% 12%, rgba(255,39,68,.09), transparent 27%),
    radial-gradient(circle at 82% 23%, rgba(255,214,61,.11), transparent 24%),
    linear-gradient(rgba(127,127,135,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(127,127,135,.055) 1px, transparent 1px);
  background-size: auto, auto, 42px 42px, 42px 42px;
}
::selection { background: var(--yellow); color: #111; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
img { display:block; max-width:100%; }

.site-loader {
  position: fixed; inset:0; z-index:9999; display:grid; place-items:center;
  background: var(--bg); transition: opacity .45s ease, visibility .45s ease;
}
.site-loader.is-hidden { opacity:0; visibility:hidden; }
.loader-mark { font-weight:1000; letter-spacing:-.04em; font-size: clamp(38px,7vw,88px); }
.loader-mark span { color:var(--red); display:inline-block; animation: loaderPop .55s cubic-bezier(.17,.67,.25,1.35) both; }
.loader-mark span:nth-child(2) { animation-delay:.08s; color:var(--yellow); }
.loader-mark span:nth-child(3) { animation-delay:.16s; color:var(--text); }
@keyframes loaderPop { from { transform:translateY(24px) scale(.76) rotate(-4deg); opacity:0 } to { transform:none; opacity:1 } }

.pointer-glow {
  position: fixed; width:260px; height:260px; border-radius:50%; pointer-events:none; z-index:-1;
  transform:translate(-50%,-50%); background:radial-gradient(circle, rgba(255,39,68,.12), transparent 65%);
  opacity:0; transition:opacity .25s ease;
}
body.has-pointer .pointer-glow { opacity:1; }

.recruit-bar {
  position:relative; z-index:90; min-height:42px; display:flex; align-items:center; justify-content:center;
  gap:12px; padding:9px 20px; background:var(--red); color:white; font-weight:900; font-size:14px;
  overflow:hidden;
}
.recruit-bar::after { content:""; position:absolute; inset:-70% auto -70% -25%; width:30%; background:rgba(255,255,255,.18); transform:rotate(18deg); animation:shine 4.4s ease-in-out infinite; }
@keyframes shine { 0%,65%{left:-35%} 85%,100%{left:120%} }
.recruit-bar a { border-bottom:1px solid rgba(255,255,255,.65); }

.header {
  position:sticky; top:0; z-index:80; height:var(--header-h); display:flex; align-items:center;
  border-bottom:1px solid transparent; transition:background .25s ease,border .25s ease,box-shadow .25s ease;
}
.header.is-scrolled { background:color-mix(in srgb, var(--bg) 84%, transparent); backdrop-filter:blur(18px); border-color:var(--line); box-shadow:0 8px 32px rgba(0,0,0,.05); }
.header-inner { width:min(1180px, calc(100% - 40px)); margin:auto; display:flex; align-items:center; gap:28px; }
.brand { display:flex; align-items:center; gap:10px; font-weight:1000; letter-spacing:-.03em; white-space:nowrap; }
.brand img { width:42px; height:42px; border-radius:50%; box-shadow:0 6px 22px rgba(255,39,68,.16); }
.nav { margin-left:auto; display:flex; align-items:center; gap:25px; font-size:14px; font-weight:800; }
.nav a:not(.join-btn) { position:relative; color:var(--muted); }
.nav a:not(.join-btn)::after { content:""; position:absolute; left:0; right:100%; bottom:-8px; height:2px; background:var(--red); transition:right .22s ease; }
.nav a:not(.join-btn):hover { color:var(--text); }
.nav a:not(.join-btn):hover::after { right:0; }
.header-actions { display:flex; align-items:center; gap:9px; }
.icon-btn { width:42px; height:42px; border:1px solid var(--line); border-radius:14px; background:var(--surface); color:var(--text); cursor:pointer; font-size:18px; display:grid; place-items:center; transition:.2s ease; }
.icon-btn:hover { transform:translateY(-2px) rotate(5deg); border-color:color-mix(in srgb,var(--red) 50%,var(--line)); }
.join-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:0 18px; border-radius:999px; background:var(--red); color:white !important; font-weight:1000; box-shadow:0 10px 28px rgba(255,39,68,.24); transition:transform .2s ease, box-shadow .2s ease; }
.join-btn:hover { transform:translateY(-3px) scale(1.035); box-shadow:0 15px 36px rgba(255,39,68,.32); }
.mobile-menu { display:none; }

.container { width:min(1120px, calc(100% - 40px)); margin-inline:auto; }
.section { padding:108px 0; position:relative; }
.section-sm { padding:72px 0; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; color:var(--red); font-size:12px; font-weight:1000; letter-spacing:.15em; text-transform:uppercase; }
.eyebrow::before { content:""; width:26px; height:3px; border-radius:9px; background:var(--red); }
.section-title { font-size:clamp(36px,5vw,66px); line-height:1.06; letter-spacing:-.055em; margin:14px 0 20px; font-weight:1000; }
.section-title .yellow { color:#e6b700; }
html[data-theme="dark"] .section-title .yellow { color:var(--yellow); }
.section-lead { max-width:720px; color:var(--muted); line-height:2; font-size:16px; font-weight:650; }

.hero { min-height:calc(100vh - var(--header-h) - 42px); display:flex; align-items:center; padding:76px 0 96px; position:relative; overflow:hidden; }
.hero-grid { display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:58px; }
.hero-kicker { display:flex; align-items:center; gap:9px; font-size:12px; font-weight:1000; letter-spacing:.16em; color:var(--muted); margin-bottom:20px; }
.hero-kicker b { color:var(--red); }
.hero h1 { margin:0; font-size:clamp(52px,7.5vw,102px); line-height:.95; letter-spacing:-.075em; font-weight:1000; }
.hero h1 .pop-yellow, .hero h1 .pop-red { display:inline-block; }
.hero h1 .pop-yellow { color:#e3b300; }
html[data-theme="dark"] .hero h1 .pop-yellow { color:var(--yellow); }
.hero h1 .pop-red { color:var(--red); }
.hero-copy { margin:26px 0 28px; color:var(--muted); font-size:17px; font-weight:650; line-height:1.9; max-width:590px; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.primary-btn, .secondary-btn { min-height:54px; padding:0 24px; border-radius:17px; display:inline-flex; gap:10px; align-items:center; font-weight:1000; transition:.22s ease; }
.primary-btn { background:var(--red); color:#fff; box-shadow:0 15px 40px rgba(255,39,68,.25); }
.primary-btn:hover { transform:translateY(-4px) scale(1.03); box-shadow:0 20px 50px rgba(255,39,68,.33); }
.secondary-btn { border:1px solid var(--line); background:var(--surface); }
.secondary-btn:hover { transform:translateY(-3px); border-color:var(--red); }
.hero-tags { margin-top:25px; display:flex; flex-wrap:wrap; gap:8px; }
.hero-tags span { padding:8px 12px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:12px; font-weight:850; background:var(--surface); }
.hero-visual { position:relative; perspective:1000px; }
.hero-logo-wrap { position:relative; border-radius:42px; transform-style:preserve-3d; }
.hero-logo { width:min(100%,570px); margin:auto; border-radius:50%; filter:drop-shadow(0 32px 50px rgba(0,0,0,.18)); transition:transform .2s ease-out; }
.float-shape { position:absolute; display:grid; place-items:center; width:64px; height:64px; border-radius:22px; background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow); font-weight:1000; animation:float 4.5s ease-in-out infinite; backdrop-filter:blur(8px); }
.float-shape.s1 { top:3%; right:-3%; color:var(--red); transform:rotate(8deg); }
.float-shape.s2 { bottom:8%; left:-6%; color:#d9a900; animation-delay:-1.3s; }
.float-shape.s3 { top:52%; right:-7%; animation-delay:-2.2s; }
@keyframes float { 0%,100%{translate:0 0 rotate:0deg} 50%{translate:0 -12px rotate:4deg} }
.hero-orbit { position:absolute; inset:10%; border:2px dashed color-mix(in srgb,var(--red) 32%,transparent); border-radius:50%; z-index:-1; animation:spin 24s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.scroll-hint { position:absolute; bottom:20px; left:50%; translate:-50% 0; font-size:11px; color:var(--muted); font-weight:900; letter-spacing:.18em; display:flex; flex-direction:column; align-items:center; gap:9px; }
.scroll-hint i { width:1px; height:40px; background:linear-gradient(var(--red),transparent); animation:scrollPulse 1.7s ease-in-out infinite; transform-origin:top; }
@keyframes scrollPulse { 0%,100%{transform:scaleY(.3);opacity:.3} 50%{transform:scaleY(1);opacity:1} }

.reveal { opacity:0; transform:translateY(34px) scale(.98); transition:opacity .72s cubic-bezier(.2,.8,.2,1), transform .72s cubic-bezier(.2,.8,.2,1); }
.reveal.from-left { transform:translateX(-50px); }
.reveal.from-right { transform:translateX(50px); }
.reveal.is-visible { opacity:1; transform:none; }
[data-stagger] > * { opacity:0; transform:translateY(26px) scale(.96); }
[data-stagger].is-visible > * { animation:staggerIn .55s cubic-bezier(.2,.8,.2,1) forwards; }
[data-stagger].is-visible > *:nth-child(2){animation-delay:.07s}.is-visible[data-stagger]>*:nth-child(3){animation-delay:.14s}.is-visible[data-stagger]>*:nth-child(4){animation-delay:.21s}.is-visible[data-stagger]>*:nth-child(5){animation-delay:.28s}.is-visible[data-stagger]>*:nth-child(6){animation-delay:.35s}
@keyframes staggerIn { to { opacity:1; transform:none; } }

.about-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:68px; align-items:start; }
.quote-card { position:sticky; top:120px; border-radius:36px; padding:35px; border:1px solid var(--line); background:var(--surface); box-shadow:var(--shadow); overflow:hidden; }
.quote-card::before { content:"“"; position:absolute; right:18px; top:-32px; font-size:180px; font-weight:1000; color:color-mix(in srgb,var(--red) 10%,transparent); line-height:1; }
.quote-card strong { font-size:clamp(28px,4vw,48px); line-height:1.25; letter-spacing:-.04em; }
.quote-card p { color:var(--muted); line-height:1.9; font-weight:650; }

.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:42px; }
.feature-card { min-height:230px; padding:26px; border-radius:28px; border:1px solid var(--line); background:var(--surface); box-shadow:0 12px 40px rgba(0,0,0,.04); position:relative; overflow:hidden; transform-style:preserve-3d; transition:border-color .2s ease,box-shadow .2s ease; }
.feature-card::after { content:""; position:absolute; width:120px; height:120px; border-radius:50%; right:-55px; bottom:-55px; background:color-mix(in srgb,var(--red) 12%,transparent); transition:.25s ease; }
.feature-card:hover { border-color:color-mix(in srgb,var(--red) 55%,var(--line)); box-shadow:0 22px 58px rgba(255,39,68,.09); }
.feature-card:hover::after { transform:scale(1.5); }
.feature-icon { width:52px; height:52px; border-radius:17px; display:grid; place-items:center; font-size:24px; margin-bottom:32px; background:color-mix(in srgb,var(--yellow) 40%,var(--surface-solid)); border:1px solid var(--line); }
.feature-card h3 { margin:0 0 9px; font-size:23px; letter-spacing:-.04em; }
.feature-card p { margin:0; color:var(--muted); line-height:1.75; font-weight:620; }

.marquee-section { padding:44px 0; overflow:hidden; border-block:1px solid var(--line); background:color-mix(in srgb,var(--surface-solid) 60%,transparent); }
.marquee { display:flex; overflow:hidden; user-select:none; gap:18px; }
.marquee + .marquee { margin-top:14px; }
.marquee-track { flex-shrink:0; display:flex; gap:18px; min-width:max-content; animation:marquee 26s linear infinite; }
.marquee.reverse .marquee-track { animation-direction:reverse; animation-duration:31s; }
.marquee-item { font-weight:1000; font-size:clamp(20px,3vw,32px); padding:11px 18px; border-radius:999px; border:2px solid var(--text); background:var(--bg); white-space:nowrap; }
.marquee-item:nth-child(3n+1) { color:var(--red); border-color:var(--red); }
.marquee-item:nth-child(3n+2) { background:var(--yellow); color:#151515; border-color:#151515; }
@keyframes marquee { to { transform:translateX(calc(-50% - 9px)); } }

.goal-panel { border-radius:42px; padding:clamp(36px,6vw,72px); background:var(--black); color:white; position:relative; overflow:hidden; box-shadow:var(--shadow); }
.goal-panel::after { content:"AUAU"; position:absolute; right:-.04em; bottom:-.24em; font-size:clamp(130px,24vw,340px); font-weight:1000; color:rgba(255,255,255,.025); letter-spacing:-.09em; pointer-events:none; }
.goal-panel .section-title { max-width:720px; }
.goal-panel .section-lead { color:#b9b9c0; }
.goal-panel .red { color:#ff4560; }
.goal-panel .yellow { color:#ffd63d; }

.discord-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:50px; align-items:center; }
.discord-window { border:1px solid #3d3f45; border-radius:28px; overflow:hidden; background:#313338; color:#f2f3f5; box-shadow:0 28px 80px rgba(0,0,0,.26); transform:rotate(1.2deg); }
.discord-top { padding:15px 18px; display:flex; gap:8px; border-bottom:1px solid #24262a; background:#2b2d31; font-weight:800; }
.discord-dot { width:10px;height:10px;border-radius:50%;background:#ff5f57}.discord-dot:nth-child(2){background:#ffbd2e}.discord-dot:nth-child(3){background:#28c840}
.discord-body { display:grid; grid-template-columns:150px 1fr; min-height:390px; }
.discord-sidebar { padding:17px 11px; background:#2b2d31; color:#b5bac1; font-size:13px; }
.discord-channel { padding:8px 10px; border-radius:6px; font-weight:750; }
.discord-channel.active { background:#404249; color:white; }
.discord-chat { padding:18px; }
.discord-message { display:grid; grid-template-columns:38px 1fr; gap:11px; margin:0 0 20px; opacity:0; transform:translateY(12px); }
.discord-window.messages-live .discord-message { animation:messageIn .42s ease forwards; }
.discord-window.messages-live .discord-message:nth-child(2){animation-delay:.22s}.discord-window.messages-live .discord-message:nth-child(3){animation-delay:.44s}.discord-window.messages-live .discord-message:nth-child(4){animation-delay:.66s}
@keyframes messageIn { to { opacity:1; transform:none } }
.avatar { width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#ff2744,#ffd63d); }
.discord-message:nth-child(2) .avatar{background:linear-gradient(135deg,#5865f2,#a97cff)}.discord-message:nth-child(3) .avatar{background:linear-gradient(135deg,#29b6a7,#80df8b)}
.discord-name { font-size:13px; font-weight:900; }
.discord-time { color:#949ba4; font-size:10px; margin-left:6px; }
.discord-text { color:#dbdee1; font-size:14px; line-height:1.55; margin-top:4px; }

.steps { margin-top:44px; position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.steps::before { content:""; position:absolute; left:16%; right:16%; top:48px; height:4px; background:var(--line); border-radius:9px; }
.step-progress { position:absolute; left:16%; top:48px; height:4px; width:0; background:linear-gradient(90deg,var(--red),var(--yellow)); border-radius:9px; transition:width 1.3s cubic-bezier(.2,.8,.2,1); }
.steps.is-visible .step-progress { width:68%; }
.step { position:relative; text-align:center; padding:0 18px; }
.step-num { margin:auto; width:96px; height:96px; border-radius:50%; display:grid; place-items:center; background:var(--surface-solid); border:4px solid var(--line); font-size:28px; font-weight:1000; position:relative; z-index:2; box-shadow:var(--shadow); transition:.45s ease; }
.steps.is-visible .step:nth-of-type(2) .step-num { transition-delay:.3s }.steps.is-visible .step:nth-of-type(3) .step-num { transition-delay:.7s }
.steps.is-visible .step-num { border-color:var(--red); transform:scale(1.06); }
.step h3 { margin:22px 0 8px; font-size:21px; }
.step p { margin:0; color:var(--muted); line-height:1.7; font-weight:620; }

.faq { max-width:850px; margin:40px auto 0; display:grid; gap:10px; }
.faq-item { border:1px solid var(--line); background:var(--surface); border-radius:20px; overflow:hidden; }
.faq-q { width:100%; padding:20px 22px; border:0; background:transparent; color:var(--text); display:flex; align-items:center; justify-content:space-between; text-align:left; font:inherit; font-weight:900; cursor:pointer; }
.faq-plus { width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--red) 10%,transparent);color:var(--red);transition:transform .25s ease; }
.faq-item.open .faq-plus { transform:rotate(45deg); }
.faq-a { height:0; overflow:hidden; transition:height .3s ease; }
.faq-a > div { padding:0 22px 22px; color:var(--muted); line-height:1.8; font-weight:620; }

.final-cta { padding:50px 0 105px; }
.cta-box { min-height:460px; border-radius:44px; background:var(--red); color:white; display:grid; place-items:center; text-align:center; position:relative; overflow:hidden; padding:56px 28px; }
.cta-box::before { content:"あうあう"; position:absolute; white-space:nowrap; font-size:clamp(120px,25vw,360px); font-weight:1000; color:rgba(255,255,255,.07); animation:ctaMove 12s ease-in-out infinite alternate; }
@keyframes ctaMove { from { transform:translateX(-13%) rotate(-4deg) } to { transform:translateX(13%) rotate(4deg) } }
.cta-content { position:relative; z-index:2; max-width:750px; }
.cta-content h2 { font-size:clamp(45px,7vw,86px); line-height:1; letter-spacing:-.065em; margin:0 0 22px; }
.cta-content p { font-weight:750; line-height:1.8; color:rgba(255,255,255,.87); }
.cta-content .primary-btn { background:white; color:#151515; box-shadow:0 16px 42px rgba(0,0,0,.14); margin-top:12px; }

.footer { border-top:1px solid var(--line); padding:45px 0 34px; }
.footer-grid { display:grid; grid-template-columns:1fr auto; gap:30px; align-items:start; }
.footer-brand { display:flex; align-items:center; gap:12px; font-size:20px; font-weight:1000; }
.footer-brand img { width:48px;height:48px;border-radius:50%; }
.footer-copy { color:var(--muted); font-size:13px; margin-top:12px; }
.footer-nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:18px; color:var(--muted); font-size:13px; font-weight:800; }
.footer-bottom { display:flex; justify-content:space-between; gap:24px; margin-top:30px; padding-top:22px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; }

.page-hero { padding:90px 0 70px; }
.page-hero h1 { margin:10px 0 20px; font-size:clamp(50px,8vw,98px); line-height:.98; letter-spacing:-.075em; }
.page-hero p { max-width:720px; color:var(--muted); line-height:1.95; font-weight:650; }
.prose { max-width:850px; }
.prose h2 { margin:60px 0 16px; font-size:clamp(30px,4vw,47px); letter-spacing:-.05em; }
.prose p, .prose li { color:var(--muted); line-height:2; font-weight:620; }
.prose strong { color:var(--text); }
.profile-card { display:grid; grid-template-columns:220px 1fr; gap:34px; padding:34px; border:1px solid var(--line); border-radius:32px; background:var(--surface); box-shadow:var(--shadow); }
.profile-card img { width:220px; height:220px; object-fit:cover; border-radius:28px; background:#000; }
.profile-card h2 { margin:4px 0 9px; font-size:38px; letter-spacing:-.05em; }
.profile-chips { display:flex; gap:8px; flex-wrap:wrap; margin:18px 0; }
.profile-chips span { border:1px solid var(--line); border-radius:999px; padding:8px 11px; font-size:12px; font-weight:850; color:var(--muted); }
.rule-list { display:grid; gap:12px; counter-reset:rules; margin-top:34px; }
.rule { counter-increment:rules; display:grid; grid-template-columns:52px 1fr; gap:18px; padding:22px; border:1px solid var(--line); border-radius:20px; background:var(--surface); }
.rule::before { content:counter(rules, decimal-leading-zero); color:var(--red); font-weight:1000; font-size:18px; }
.rule h3 { margin:0 0 8px; }
.rule p { margin:0; color:var(--muted); line-height:1.75; font-weight:620; }

.transition-curtain { position:fixed; inset:0; z-index:10000; pointer-events:none; background:var(--red); transform:translateX(-102%); }
.transition-curtain.entering { animation:curtainIn .48s cubic-bezier(.7,0,.3,1) forwards; }
@keyframes curtainIn { to { transform:translateX(0) } }
.theme-flash { position:fixed; width:0;height:0;border-radius:50%;z-index:9998;pointer-events:none;background:var(--bg);transform:translate(-50%,-50%); }
.theme-flash.run { animation:themeBurst .55s ease-out forwards; }
@keyframes themeBurst { to { width:260vmax;height:260vmax; } }

@media (max-width: 900px) {
  :root { --header-h:64px; }
  .nav { display:none; }
  .mobile-menu { display:grid; }
  .header-inner { width:min(100% - 28px,1120px); }
  .hero { min-height:auto; padding-top:64px; }
  .hero-grid, .about-grid, .discord-layout { grid-template-columns:1fr; }
  .hero-visual { max-width:610px; margin:30px auto 0; }
  .about-grid { gap:34px; }
  .quote-card { position:relative; top:auto; }
  .cards { grid-template-columns:repeat(2,1fr); }
  .discord-layout { gap:35px; }
  .steps { grid-template-columns:1fr; gap:34px; }
  .steps::before, .step-progress { left:48px; right:auto; top:48px; width:4px; height:calc(100% - 96px); }
  .step-progress { height:0; transition:height 1.2s ease; }
  .steps.is-visible .step-progress { width:4px; height:calc(100% - 96px); }
  .step { display:grid; grid-template-columns:96px 1fr; gap:20px; text-align:left; padding:0; align-items:center; }
  .step-num { margin:0; }
  .step h3 { margin:0 0 5px; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-nav { justify-content:flex-start; }
  .profile-card { grid-template-columns:160px 1fr; }
  .profile-card img { width:160px;height:160px; }
}

@media (max-width: 620px) {
  .container { width:min(100% - 26px,1120px); }
  .recruit-bar { justify-content:flex-start; overflow:auto; white-space:nowrap; font-size:12px; }
  .brand span { display:none; }
  .header-inner { gap:10px; }
  .header-actions { margin-left:auto; }
  .join-btn.header-join { width:44px; padding:0; overflow:hidden; font-size:0; }
  .join-btn.header-join::before { content:"↗"; font-size:18px; }
  .hero h1 { font-size:clamp(50px,16vw,76px); }
  .hero-copy { font-size:15px; }
  .hero-actions > a { width:100%; justify-content:center; }
  .float-shape { width:50px;height:50px;border-radius:16px; }
  .cards { grid-template-columns:1fr; }
  .section { padding:78px 0; }
  .section-title { font-size:40px; }
  .discord-body { grid-template-columns:112px 1fr; min-height:350px; }
  .discord-sidebar { padding:12px 7px; font-size:11px; }
  .discord-chat { padding:14px 11px; }
  .discord-text { font-size:12px; }
  .footer-bottom { flex-direction:column; gap:8px; }
  .profile-card { grid-template-columns:1fr; }
  .profile-card img { width:130px;height:130px; }
  .profile-card h2 { font-size:32px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .reveal, [data-stagger] > *, .discord-message { opacity:1 !important; transform:none !important; }
}

/* ===== AUAU v2: brighter hero + stronger motion ===== */
.hero {
  background:
    radial-gradient(circle at 14% 22%, color-mix(in srgb,var(--yellow) 16%,transparent), transparent 27%),
    radial-gradient(circle at 88% 30%, color-mix(in srgb,var(--red) 12%,transparent), transparent 24%);
}
.hero::before {
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.7;
  background-image: radial-gradient(circle, color-mix(in srgb,var(--text) 13%,transparent) 1.4px, transparent 1.6px);
  background-size:30px 30px; mask-image:linear-gradient(to bottom,rgba(0,0,0,.62),transparent 88%);
  animation:dotsDrift 18s linear infinite;
}
@keyframes dotsDrift { to { background-position:60px 30px; } }
.hero-deco { position:absolute; pointer-events:none; border-radius:999px; filter:blur(.2px); opacity:.9; }
.hero-deco-a { width:270px;height:26px;left:-70px;top:19%;background:var(--red);transform:rotate(-13deg);animation:decoA 5s ease-in-out infinite alternate; }
.hero-deco-b { width:210px;height:22px;right:-55px;bottom:17%;background:var(--yellow);transform:rotate(11deg);animation:decoB 5.5s ease-in-out infinite alternate; }
@keyframes decoA { to { transform:translateX(34px) rotate(-9deg); } }
@keyframes decoB { to { transform:translateX(-28px) rotate(7deg); } }
.hero-grid { grid-template-columns:1.08fr .92fr; }
.hero-copy-col { min-width:0; }
.hero-title { font-size:clamp(50px,5.6vw,84px) !important; line-height:.96 !important; }
.hero-line { display:block; white-space:nowrap; }
.hero-title .line-two { font-size:.82em; margin-top:.12em; }
.hero-title .pop-yellow { margin-right:.16em; transform-origin:50% 80%; animation:heroYellow 2.7s ease-in-out infinite; }
.hero-title .pop-red { display:inline-block; }
@keyframes heroYellow { 0%,70%,100%{transform:rotate(0) scale(1)} 78%{transform:rotate(-3deg) scale(1.06)} 86%{transform:rotate(2deg) scale(.99)} }
.hero-logo-wrap { padding:20px; }
.hero-logo { max-width:510px; }
.hero-logo-wrap::before {
  content:""; position:absolute; inset:8%; border-radius:50%; z-index:-2;
  background:var(--surface-solid); border:1px solid var(--line); box-shadow:0 30px 80px rgba(255,39,68,.12);
  animation:logoHalo 4s ease-in-out infinite;
}
@keyframes logoHalo { 50% { transform:scale(1.035); box-shadow:0 38px 100px rgba(255,39,68,.20); } }
.hero-sticker { position:absolute; z-index:4; padding:10px 14px; border-radius:999px; background:var(--surface-solid); color:var(--text); border:2px solid var(--text); box-shadow:5px 5px 0 var(--yellow); font-size:12px; font-weight:1000; white-space:nowrap; animation:stickerFloat 4s ease-in-out infinite; }
.hero-sticker.st1 { left:-7%; top:25%; transform:rotate(-7deg); }
.hero-sticker.st2 { right:-10%; top:67%; transform:rotate(6deg); animation-delay:-1.4s; box-shadow:5px 5px 0 var(--red); }
.hero-sticker.st3 { left:8%; bottom:-1%; transform:rotate(3deg); animation-delay:-2.5s; }
@keyframes stickerFloat { 50% { translate:0 -10px; } }

/* brighter light mode */
html:not([data-theme="dark"]) body::before { opacity:.6; }
html:not([data-theme="dark"]) .header:not(.is-scrolled) { background:rgba(255,253,251,.62); backdrop-filter:blur(10px); }
html:not([data-theme="dark"]) .hero-logo { filter:drop-shadow(0 26px 36px rgba(20,20,24,.13)); }

/* Ninja AdMax placement */
.admax-section { padding:18px 0 48px; }
.admax-label { text-align:center; color:var(--muted); font-size:9px; letter-spacing:.18em; font-weight:800; margin-bottom:8px; }
.admax-frame { min-height:0; display:flex; justify-content:center; align-items:center; margin-inline:auto; overflow:hidden; }
.admax-pc { width:min(100%,728px); }
.admax-sp { display:none; width:100%; }

@media (max-width:900px) {
  .hero-grid { grid-template-columns:1fr; gap:28px; }
  .hero-copy-col { text-align:center; }
  .hero-kicker, .hero-actions, .hero-tags { justify-content:center; }
  .hero-copy { margin-left:auto; margin-right:auto; }
  .hero-title { font-size:clamp(50px,10.5vw,76px) !important; }
  .hero-title .line-two { font-size:.82em; }
  .hero-visual { width:min(82vw,570px); }
  .hero-sticker.st1 { left:-2%; top:17%; }
  .hero-sticker.st2 { right:-4%; }
}
@media (max-width:620px) {
  .hero { padding-top:48px; }
  .hero-title { font-size:clamp(42px,13vw,61px) !important; letter-spacing:-.065em !important; }
  .hero-title .line-two { font-size:.76em; }
  .hero-line { white-space:nowrap; }
  .hero-sticker { font-size:10px; padding:8px 10px; }
  .hero-sticker.st1 { left:0; top:18%; }
  .hero-sticker.st2 { right:0; top:66%; }
  .hero-sticker.st3 { left:12%; bottom:0; }
  .admax-pc { display:none; }
  .admax-sp { display:flex; }
}

/* ===== AUAU v3: clearer subpages + people/support section ===== */
:root {
  --rase-blue:#1688e8;
  --rase-blue2:#31b5ff;
}

.page-hero-compact {
  padding:78px 0 44px;
}
.page-hero-compact .container {
  position:relative;
}
.page-title-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:36px;
  align-items:end;
}
.page-badge {
  min-width:170px;
  padding:18px 20px;
  border:1px solid var(--line);
  border-radius:24px;
  background:var(--surface);
  box-shadow:var(--shadow);
  transform:rotate(2deg);
}
.page-badge span {
  display:block;
  color:var(--red);
  font-size:10px;
  font-weight:1000;
  letter-spacing:.18em;
}
.page-badge b {
  display:block;
  margin-top:5px;
  font-size:22px;
  letter-spacing:-.04em;
}
.subpage-section { padding-top:34px; }

.profile-card-v3 {
  align-items:center;
  margin-bottom:26px;
  overflow:hidden;
  position:relative;
}
.profile-card-v3::after {
  content:"";
  position:absolute;
  width:220px;
  height:220px;
  right:-80px;
  bottom:-100px;
  border-radius:50%;
  background:radial-gradient(circle,var(--yellow),transparent 68%);
  opacity:.16;
  pointer-events:none;
}
.profile-catch {
  margin:2px 0 7px;
  font-size:18px;
  font-weight:1000;
  color:var(--text);
}

.story-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:18px;
}
.story-card {
  position:relative;
  min-height:300px;
  padding:32px;
  border:1px solid var(--line);
  border-radius:30px;
  background:var(--surface);
  box-shadow:0 14px 45px rgba(0,0,0,.05);
  overflow:hidden;
}
.story-card::after {
  content:"";
  position:absolute;
  right:-45px;
  bottom:-55px;
  width:150px;
  height:150px;
  border:22px solid color-mix(in srgb,var(--red) 9%,transparent);
  border-radius:50%;
  pointer-events:none;
}
.story-card-wide { grid-column:1 / -1; min-height:0; }
.story-num {
  position:absolute;
  right:24px;
  top:22px;
  color:color-mix(in srgb,var(--text) 12%,transparent);
  font-size:54px;
  line-height:1;
  font-weight:1000;
  letter-spacing:-.06em;
}
.story-icon {
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:color-mix(in srgb,var(--red) 10%,var(--surface-solid));
  font-size:22px;
  font-weight:1000;
  margin-bottom:44px;
}
.story-card h2 {
  position:relative;
  z-index:1;
  margin:0 0 14px;
  font-size:clamp(27px,3vw,38px);
  letter-spacing:-.05em;
}
.story-card p {
  position:relative;
  z-index:1;
  margin:0 0 10px;
  color:var(--muted);
  line-height:1.95;
  font-weight:620;
}
.story-card strong { color:var(--text); }
.quote-story {
  background:linear-gradient(135deg,color-mix(in srgb,var(--red) 12%,var(--surface-solid)),var(--surface));
}
.quote-story blockquote {
  position:relative;
  z-index:1;
  margin:6px 0 0;
  max-width:900px;
  font-size:clamp(28px,4vw,48px);
  line-height:1.35;
  letter-spacing:-.045em;
  font-weight:1000;
}
.related-block,
.subpage-cta {
  margin-top:18px;
  padding:30px 32px;
  border:1px solid var(--line);
  border-radius:30px;
  background:var(--surface);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.related-block h2,
.subpage-cta h2 {
  margin:8px 0 0;
  font-size:clamp(25px,3.2vw,40px);
  line-height:1.16;
  letter-spacing:-.05em;
}
.subpage-cta p { margin:8px 0 0; color:var(--muted); font-weight:650; }

.about-summary {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:26px;
  align-items:start;
  padding:34px;
  border-radius:34px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--yellow) 12%,var(--surface-solid)),var(--surface));
  border:1px solid var(--line);
  margin-bottom:18px;
}
.big-quote {
  font-family:Georgia,serif;
  font-size:105px;
  line-height:.7;
  color:var(--yellow);
  font-weight:900;
}
.about-summary h2 {
  margin:8px 0 14px;
  font-size:clamp(34px,5vw,60px);
  line-height:1.05;
  letter-spacing:-.06em;
}
.about-summary p {
  max-width:780px;
  margin:0;
  color:var(--muted);
  line-height:1.95;
  font-weight:650;
}

.rules-notice {
  display:flex;
  align-items:flex-start;
  gap:20px;
  padding:24px 26px;
  margin-bottom:20px;
  border:1px solid color-mix(in srgb,var(--yellow) 38%,var(--line));
  border-radius:24px;
  background:color-mix(in srgb,var(--yellow) 8%,var(--surface));
}
.rules-notice > span { font-size:30px; }
.rules-notice strong { display:block; font-size:19px; }
.rules-notice p { margin:6px 0 0; color:var(--muted); line-height:1.7; font-weight:620; }
.rules-footnote {
  margin-top:18px;
  padding:22px 24px;
  border-left:4px solid var(--red);
  border-radius:0 18px 18px 0;
  background:var(--surface);
  line-height:1.8;
}

/* Rase Network support page */
.rase-eyebrow { color:var(--rase-blue); }
.rase-eyebrow::before { background:var(--rase-blue); }
.rase-page-hero {
  background:radial-gradient(circle at 85% 20%,rgba(22,136,232,.12),transparent 28%);
}
.rase-mark-card {
  width:190px;
  padding:22px;
  border-radius:30px;
  border:1px solid rgba(49,181,255,.24);
  background:#0b1219;
  box-shadow:0 22px 70px rgba(22,136,232,.16);
  transform:rotate(2deg);
}
.rase-mark-card img { width:78px; height:78px; border-radius:20px; }
.rase-mark-card span {
  display:block;
  margin-top:14px;
  color:#8ea2b8;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
}
.support-identity {
  display:grid;
  grid-template-columns:210px 1fr;
  gap:34px;
  align-items:center;
  padding:34px;
  border:1px solid rgba(49,181,255,.20);
  border-radius:34px;
  background:linear-gradient(135deg,rgba(22,136,232,.08),var(--surface));
  margin-bottom:18px;
}
.support-logo {
  min-height:210px;
  display:grid;
  place-items:center;
  border-radius:28px;
  background:#0b1219;
  box-shadow:inset 0 0 0 1px rgba(49,181,255,.18);
}
.support-logo img { width:112px; height:112px; border-radius:28px; }
.support-identity h2 {
  margin:8px 0 14px;
  font-size:clamp(34px,4.5vw,56px);
  line-height:1.08;
  letter-spacing:-.055em;
}
.support-identity p { color:var(--muted); line-height:1.9; font-weight:620; }
.rase-story .story-icon {
  background:rgba(22,136,232,.12);
  color:var(--rase-blue2);
}
.rase-story::after { border-color:rgba(22,136,232,.08); }
.rase-cta {
  margin-top:18px;
  padding:34px;
  border-radius:32px;
  background:#0b1219;
  border:1px solid rgba(49,181,255,.20);
  color:#f4f7fb;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  overflow:hidden;
  position:relative;
}
.rase-cta::after {
  content:"R";
  position:absolute;
  right:11%;
  top:50%;
  transform:translateY(-50%);
  font-size:170px;
  font-weight:1000;
  color:rgba(49,181,255,.045);
}
.rase-cta > * { position:relative; z-index:1; }
.rase-cta span { color:var(--rase-blue2); font-size:11px; font-weight:1000; letter-spacing:.17em; }
.rase-cta h2 { margin:8px 0 5px; font-size:clamp(28px,4vw,48px); letter-spacing:-.05em; }
.rase-cta p { margin:0; color:#8ea2b8; font-weight:620; }
.rase-primary { background:linear-gradient(135deg,var(--rase-blue),var(--rase-blue2)); box-shadow:0 14px 36px rgba(22,136,232,.22); white-space:nowrap; }

/* Home: operator/support cards */
.people-section {
  background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--red) 3%,transparent),transparent);
}
.people-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:36px;
}
.person-card {
  display:grid;
  grid-template-columns:150px 1fr;
  min-height:250px;
  border:1px solid var(--line);
  border-radius:30px;
  background:var(--surface);
  overflow:hidden;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.person-card:hover {
  transform:translateY(-7px) rotate(-.4deg);
  border-color:color-mix(in srgb,var(--red) 38%,var(--line));
  box-shadow:var(--shadow);
}
.person-media { padding:18px; display:grid; place-items:center; background:color-mix(in srgb,var(--yellow) 9%,var(--surface-solid)); }
.person-media img { width:112px; height:112px; object-fit:cover; border-radius:28px; }
.person-body { padding:26px 26px 24px; align-self:center; }
.person-role { color:var(--red); font-size:10px; font-weight:1000; letter-spacing:.14em; }
.person-body h3 { margin:7px 0 9px; font-size:28px; letter-spacing:-.045em; }
.person-body p { margin:0; color:var(--muted); line-height:1.75; font-size:14px; font-weight:620; }
.card-link { display:inline-block; margin-top:16px; font-size:13px; font-weight:900; }
.rase-person-media { background:#0b1219; }
.rase-person-media img { width:92px; height:92px; border-radius:22px; }
.rase-role { color:var(--rase-blue2); }
.rase-card:hover { border-color:rgba(49,181,255,.45); }
.footer-bottom a:hover { color:var(--text); }

/* Mobile readability */
@media (max-width: 900px) {
  .page-title-row { grid-template-columns:1fr; }
  .page-badge,.rase-mark-card { display:none; }
  .story-grid { grid-template-columns:1fr; }
  .story-card-wide { grid-column:auto; }
  .support-identity { grid-template-columns:150px 1fr; }
  .support-logo { min-height:150px; }
  .people-grid { grid-template-columns:1fr; }
}

@media (max-width: 620px) {
  .recruit-bar span:not(:first-child) { display:none; }
  .recruit-bar { gap:8px; padding-inline:16px; }
  .recruit-bar strong { font-size:12px; }
  .page-hero-compact { padding:54px 0 22px; }
  .page-hero h1 { font-size:clamp(44px,13vw,62px); line-height:1.03; margin-bottom:15px; }
  .page-hero p { font-size:14px; line-height:1.85; }
  .subpage-section { padding-top:18px; }
  .profile-card-v3 { padding:22px; gap:18px; }
  .profile-card-v3 img { width:112px; height:112px; border-radius:24px; }
  .profile-card h2 { font-size:29px; }
  .profile-catch { font-size:16px; }
  .story-card { min-height:0; padding:24px 22px; border-radius:24px; }
  .story-num { font-size:42px; right:18px; top:18px; }
  .story-icon { margin-bottom:30px; width:44px; height:44px; border-radius:14px; }
  .story-card h2 { font-size:28px; }
  .story-card p { font-size:14px; line-height:1.9; }
  .quote-story blockquote { font-size:28px; }
  .related-block,.subpage-cta,.rase-cta { align-items:flex-start; flex-direction:column; padding:24px 22px; border-radius:24px; }
  .related-block .secondary-btn,.subpage-cta .primary-btn,.rase-cta .primary-btn { width:100%; justify-content:center; }
  .about-summary { grid-template-columns:1fr; padding:24px 22px; border-radius:26px; }
  .big-quote { font-size:70px; height:35px; }
  .about-summary h2 { font-size:38px; }
  .rules-notice { padding:20px; border-radius:20px; }
  .rule { grid-template-columns:42px 1fr; gap:12px; padding:18px 16px; }
  .rule h3 { font-size:16px; }
  .rule p { font-size:13px; }
  .support-identity { grid-template-columns:1fr; padding:22px; gap:20px; border-radius:26px; }
  .support-logo { min-height:150px; }
  .support-logo img { width:88px; height:88px; border-radius:22px; }
  .support-identity h2 { font-size:37px; }
  .person-card { grid-template-columns:105px 1fr; min-height:210px; border-radius:24px; }
  .person-media { padding:12px; }
  .person-media img { width:82px; height:82px; border-radius:22px; }
  .rase-person-media img { width:70px; height:70px; border-radius:18px; }
  .person-body { padding:20px 16px 18px; }
  .person-body h3 { font-size:22px; }
  .person-body p { font-size:12px; line-height:1.7; }
  .card-link { font-size:12px; margin-top:12px; }
}

/* ===== v3.1 mobile/nav polish ===== */
.mobile-nav { display:none; }
@media (max-width:900px) {
  .mobile-nav {
    position:fixed; left:14px; right:14px; top:calc(var(--header-h) + 10px); z-index:79;
    padding:12px; border:1px solid var(--line); border-radius:22px;
    background:color-mix(in srgb, var(--bg) 94%, transparent); backdrop-filter:blur(20px);
    box-shadow:0 20px 50px rgba(0,0,0,.16); transform:translateY(-10px) scale(.98);
    opacity:0; pointer-events:none; transition:.22s ease;
  }
  body.menu-open .mobile-nav { display:grid; gap:6px; opacity:1; pointer-events:auto; transform:none; }
  .mobile-nav a { padding:13px 14px; border-radius:14px; font-weight:900; color:var(--text); }
  .mobile-nav a:hover { background:var(--surface); }
  .mobile-nav .mobile-nav-join { background:var(--red); color:white; text-align:center; margin-top:4px; }
}
@media (max-width:620px) {
  .recruit-bar { justify-content:center; overflow:hidden; white-space:nowrap; gap:8px; padding-inline:12px; }
  .recruit-bar .recruit-name, .recruit-bar .recruit-copy { display:none; }
  .recruit-bar strong { font-size:12px; }
  .recruit-bar a { font-size:12px; flex:0 0 auto; }
  .hero { padding-bottom:58px; }
}


/* ===== v3.2 social links / privacy ===== */
.social-links {
  display:flex; flex-wrap:wrap; gap:10px; margin-top:18px;
}
.social-link {
  display:flex; align-items:center; gap:11px; min-width:190px; padding:12px 14px;
  border:1px solid var(--line); border-radius:17px; background:var(--surface);
  color:var(--text); transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.social-link:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--red) 42%,var(--line)); box-shadow:var(--shadow); }
.social-mark { width:36px; height:36px; display:grid; place-items:center; border-radius:12px; font-weight:1000; background:var(--bg); }
.youtube-link .social-mark { color:#fff; background:#ff1838; }
.x-link .social-mark { color:#fff; background:#111; }
.social-link > span:nth-child(2) { display:grid; gap:1px; }
.social-link b { font-size:13px; }
.social-link small { color:var(--muted); font-size:10px; font-weight:750; }
.social-link i { margin-left:auto; font-style:normal; color:var(--muted); }

.privacy-layout { max-width:1050px; }
.privacy-notice {
  display:flex; align-items:flex-start; gap:18px; padding:24px 26px; margin-bottom:20px;
  border:1px solid color-mix(in srgb,var(--yellow) 36%,var(--line)); border-radius:24px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--yellow) 9%,var(--surface)),var(--surface));
}
.privacy-notice > span { font-size:30px; }
.privacy-notice strong { display:block; font-size:18px; }
.privacy-notice p { margin:6px 0 0; color:var(--muted); line-height:1.8; font-weight:620; }
.privacy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.privacy-card {
  position:relative; overflow:hidden; padding:28px; border:1px solid var(--line); border-radius:27px;
  background:var(--surface); min-height:255px;
}
.privacy-card::after { content:""; position:absolute; width:150px; height:150px; border:1px solid color-mix(in srgb,var(--red) 8%,transparent); border-radius:50%; right:-70px; bottom:-80px; }
.privacy-num { color:var(--red); font-size:11px; font-weight:1000; letter-spacing:.18em; }
.privacy-card h2 { margin:10px 0 14px; font-size:25px; letter-spacing:-.04em; }
.privacy-card p { color:var(--muted); line-height:1.9; font-weight:620; font-size:14px; }
.privacy-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:15px; }
.privacy-links a { padding:9px 11px; border:1px solid var(--line); border-radius:12px; font-size:11px; font-weight:900; }
.privacy-links a:hover { border-color:var(--red); }
.privacy-date { font-size:12px !important; }

@media (max-width:720px) {
  .social-links { display:grid; grid-template-columns:1fr; }
  .social-link { min-width:0; width:100%; }
  .privacy-grid { grid-template-columns:1fr; }
  .privacy-card { min-height:0; padding:22px; border-radius:22px; }
  .privacy-notice { padding:20px; border-radius:20px; }
}

/* ===== v3.3 launch polish: mobile hero, news, active nav, 404, ads ===== */
.nav a.is-active { color:var(--text) !important; }
.nav a.is-active::after { right:0 !important; }
.mobile-nav a.is-active { background:color-mix(in srgb,var(--red) 10%,var(--surface)); color:var(--text); }

.news-section { overflow:hidden; }
.news-head { display:flex; align-items:end; justify-content:space-between; gap:36px; margin-bottom:34px; }
.news-head p { max-width:460px; margin:0 0 12px; color:var(--muted); line-height:1.8; font-weight:650; }
.news-list { display:grid; gap:12px; }
.news-item { position:relative; display:grid; grid-template-columns:120px 64px minmax(0,1fr); gap:18px; align-items:center; padding:22px 26px; border:1px solid var(--line); border-radius:22px; background:var(--surface); overflow:hidden; transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.news-item::after { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--red); transform:scaleY(0); transform-origin:bottom; transition:transform .25s ease; }
.news-item:hover { transform:translateX(7px); border-color:color-mix(in srgb,var(--red) 38%,var(--line)); box-shadow:var(--shadow); }
.news-item:hover::after { transform:scaleY(1); }
.news-item time { color:var(--muted); font-size:12px; font-weight:900; letter-spacing:.08em; }
.news-tag { justify-self:start; padding:5px 8px; border-radius:999px; background:var(--red); color:#fff; font-size:9px; font-weight:1000; letter-spacing:.08em; }
.news-item:nth-child(2) .news-tag { background:var(--yellow); color:#111; }
.news-item h3 { margin:0; font-size:20px; letter-spacing:-.035em; }
.news-item p { grid-column:3; margin:3px 0 0; color:var(--muted); font-size:13px; line-height:1.7; font-weight:620; }

.admax-section-inline { padding:28px 0 32px; }
.admax-frame { contain:layout; }
.admax-pc { min-height:90px; }
.admax-sp { min-height:100px; }

.page-hero-compact { border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent); }
.page-hero-compact::after { content:""; display:block; width:min(1120px,calc(100% - 40px)); height:4px; margin:34px auto -44px; border-radius:99px; background:linear-gradient(90deg,var(--red) 0 18%,var(--yellow) 18% 25%,transparent 25%); opacity:.9; }

.error-page { min-height:100svh; background:var(--bg); }
.error-main { min-height:100svh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; position:relative; overflow:hidden; padding:56px 24px; }
.error-main::before { content:""; position:absolute; inset:0; z-index:-3; background:radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--red) 14%,transparent),transparent 28%),radial-gradient(circle at 36% 56%,color-mix(in srgb,var(--yellow) 10%,transparent),transparent 22%); }
.error-logo { width:118px; height:118px; border-radius:50%; margin-bottom:-8px; filter:drop-shadow(0 16px 32px rgba(255,39,68,.18)); animation:errorLogo 3.6s ease-in-out infinite; }
@keyframes errorLogo { 50% { transform:translateY(-10px) rotate(2deg); } }
.error-code { font-size:clamp(82px,15vw,158px); line-height:.9; font-weight:1000; letter-spacing:-.08em; color:var(--red); }
.error-main h1 { margin:20px 0 12px; font-size:clamp(32px,5vw,58px); line-height:1.08; letter-spacing:-.055em; }
.error-main h1 span { color:var(--yellow); }
.error-main p { margin:0; color:var(--muted); line-height:1.9; font-weight:650; }
.error-actions { display:flex; gap:12px; margin-top:28px; flex-wrap:wrap; justify-content:center; }
.error-orbit { position:absolute; width:min(70vw,680px); aspect-ratio:1; border:2px dashed color-mix(in srgb,var(--red) 24%,transparent); border-radius:50%; z-index:-1; animation:spin 28s linear infinite; }
.error-float { position:absolute; width:56px; height:56px; display:grid; place-items:center; border:1px solid var(--line); background:var(--surface); border-radius:18px; box-shadow:var(--shadow); animation:float 4.5s ease-in-out infinite; }
.error-float.e1 { left:14%; top:25%; }
.error-float.e2 { right:17%; top:28%; animation-delay:-1.4s; }
.error-float.e3 { right:20%; bottom:20%; animation-delay:-2.4s; }

@media (max-width:900px) {
  .news-head { align-items:flex-start; flex-direction:column; gap:4px; }
}
@media (max-width:620px) {
  /* Prevent "もっと / つながろう" from colliding on narrow phones. */
  .hero-title { font-size:clamp(40px,11.5vw,55px) !important; line-height:1 !important; letter-spacing:-.05em !important; }
  .hero-title .line-two { display:flex; align-items:baseline; justify-content:center; gap:.15em; font-size:.72em; margin-top:.26em; white-space:nowrap; letter-spacing:-.035em; }
  .hero-title .pop-yellow { margin-right:0; flex:0 0 auto; }
  .hero-title .pop-red { flex:0 0 auto; }
  .hero-title .pop-yellow { animation:heroYellowMobile 2.7s ease-in-out infinite; }
  @keyframes heroYellowMobile { 0%,72%,100%{transform:rotate(0) scale(1)} 82%{transform:rotate(-2deg) scale(1.025)} }
  .hero-copy { margin-top:30px; }
  .news-item { grid-template-columns:1fr auto; gap:8px 12px; padding:20px; }
  .news-item time { grid-column:1; }
  .news-tag { grid-column:2; grid-row:1; }
  .news-item h3 { grid-column:1 / -1; font-size:18px; margin-top:4px; }
  .news-item p { grid-column:1 / -1; margin:0; }
  .page-hero-compact::after { width:calc(100% - 26px); margin-top:25px; }
  .error-logo { width:92px; height:92px; }
  .error-actions { width:100%; }
  .error-actions a { width:100%; justify-content:center; }
  .error-float { width:46px; height:46px; border-radius:14px; }
  .error-float.e1 { left:5%; top:20%; }
  .error-float.e2 { right:5%; top:22%; }
  .error-float.e3 { right:8%; bottom:12%; }
}
