/* BURNING CORE TOYAMA */
html, body { margin: 0; }
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
/* Layout: a sticky full-screen canvas plays one scene per chapter as you scroll; static sections follow. Single dark look by choice (night, furnace light). */
:root {
  --bg: #0B0A09;
  --surface: #141210;
  --line: #2A2522;
  --ink: #F4EFE8;
  --muted: #C9C2B8;
  --faint: #A39A8F;
  --ember: #FF6A2B;
  --ember-deep: #A8461B;
  --ember-dim: #7A3416;
  --snow: #BFD6E6;
  --plate: #FFFFFF;
  --display: "Anton", "Arial Narrow", sans-serif;
  --sans: "Zen Kaku Gothic New", "Hiragino Sans", "Noto Sans JP", "Yu Gothic", system-ui, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;
  --mincho: "Shippori Mincho B1", "Hiragino Mincho ProN", "Yu Mincho", serif;
  color-scheme: dark;
}
html { background: var(--bg); }
body { background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.7; overflow-x: clip; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 40; background: var(--bg); }
a { color: var(--ember); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--ember); outline-offset: 3px; }
img { max-width: 100%; }
.gutter { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }

/* chrome */
.brand { position: fixed; z-index: 30; top: calc(env(safe-area-inset-top, 0px) + 16px); left: max(16px, calc(env(safe-area-inset-left, 0px) + 2vw)); display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 14px 6px 8px; border-radius: 999px; background: rgb(11 10 9 / 0.66); backdrop-filter: blur(8px); text-decoration: none; }
.brand__mark { width: 36px; height: 36px; margin: -6px -6px -4px -8px; object-fit: contain; filter: drop-shadow(0 0 8px rgb(255 120 50 / .45)); }
.brand__name { font: 400 1.05rem/1 var(--display); letter-spacing: .08em; color: var(--ink); }
.grad { font-weight: 400; background: linear-gradient(0deg, #FF5A1F 0%, #FF8A3D 45%, #FFC15A 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.bc-flame { transform-box: view-box; transform-origin: 32px 28px; animation: bc-flicker 1.7s ease-in-out infinite; }
.bc-flame-in { transform-box: view-box; transform-origin: 32px 26px; animation: bc-flicker 1.1s ease-in-out infinite reverse; }
@keyframes bc-flicker { 0%, 100% { transform: scaleY(1) skewX(0deg); } 30% { transform: scaleY(1.07) skewX(-2.5deg); } 65% { transform: scaleY(.95) skewX(2deg); } }
.pill { position: fixed; z-index: 30; right: max(16px, calc(env(safe-area-inset-right, 0px) + 20px)); bottom: calc(env(safe-area-inset-bottom, 0px) + 20px); display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 20px; border-radius: 999px; background: var(--ember); color: var(--bg); font-weight: 700; text-decoration: none; box-shadow: 0 8px 28px rgb(255 106 43 / 0.3); transition: transform .2s ease; }
.pill:hover { transform: translateY(-2px); }
.progress { position: fixed; z-index: 31; top: env(safe-area-inset-top, 0px); left: 0; right: 0; height: 2px; background: rgb(244 239 232 / 0.12); }
.progress span { display: block; height: 100%; background: var(--ember); transform-origin: left; transform: scaleX(0); }
.route { position: fixed; z-index: 30; top: calc(env(safe-area-inset-top, 0px) + 20px); right: max(16px, calc(env(safe-area-inset-right, 0px) + 2vw)); display: flex; gap: 2px; }
.route button { min-height: 44px; padding: 0 10px; border: 0; background: transparent; color: var(--faint); font: 600 11px/1 var(--mono); letter-spacing: .12em; cursor: pointer; }
.route button:hover, .route button[aria-current="step"] { color: var(--ink); }
.route button[aria-current="step"] { text-decoration: underline; text-decoration-color: var(--ember); text-decoration-thickness: 2px; text-underline-offset: 6px; }

/* journey */
.journey { position: relative; }
.stage { position: sticky; top: 0; height: 100vh; height: 100svh; margin-bottom: -100vh; margin-bottom: -100svh; overflow: hidden; background: var(--bg); }
.stage canvas { display: block; width: 100%; height: 100%; }
.stage::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(11 10 9 / .35) 0%, transparent 22%, transparent 70%, rgb(11 10 9 / .55) 100%); pointer-events: none; }
.chapter { position: relative; z-index: 2; }
.chapter__pin { position: sticky; top: 0; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; padding-block: 110px 90px; box-sizing: border-box; }
.chapter[data-align="right"] .chapter__pin { justify-content: flex-end; }
.copy { position: relative; width: 100%; max-width: calc(38rem + 10vw); padding-left: max(16px, calc(env(safe-area-inset-left, 0px) + 5vw)); padding-right: max(16px, calc(env(safe-area-inset-right, 0px) + 5vw)); box-sizing: border-box; }
.copy::before { content: ""; position: absolute; z-index: -1; inset: -3rem 0; background: radial-gradient(ellipse at center, rgb(11 10 9 / .86) 0%, rgb(11 10 9 / .55) 50%, transparent 76%); }
.kicker { margin: 0 0 14px; font: 600 12px/1.6 var(--mono); letter-spacing: .16em; color: var(--ember); }
.kicker--snow { color: var(--snow); }
.title--display { font-family: var(--display) !important; font-weight: 400 !important; font-size: clamp(3rem, 7vw, 6rem) !important; line-height: 1 !important; }
.title { margin: 0; font-weight: 900; font-size: clamp(2rem, 4.4vw, 4.2rem); line-height: 1.2; letter-spacing: .01em; text-wrap: balance; word-break: auto-phrase; }
.body { margin: 20px 0 0; max-width: 34em; color: var(--muted); font-size: clamp(1rem, 1.3vw, 1.15rem); line-height: 1.9; word-break: auto-phrase; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
.tags li { padding: 6px 12px; border: 1px solid rgb(244 239 232 / .22); font-size: 13px; line-height: 1.5; background: rgb(11 10 9 / .4); }
.tags li.note { border-style: dashed; color: var(--faint); }
.hero-title { margin: 0; font: 400 clamp(3.6rem, 10vw, 9.5rem)/.94 var(--display); letter-spacing: .01em; color: var(--ink); }
.burn { display: inline-block; background: linear-gradient(0deg, #B8360B 0%, #FF5A1F 30%, #FF9A3C 62%, #FFE3A1 100%); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 28px rgb(255 106 43 / .38)); }
.core { display: inline-flex; align-items: flex-end; color: var(--ink); }
.core-o { width: 1.3em; height: 1.3em; margin: 0 -.27em -.02em -.25em; object-fit: contain; filter: drop-shadow(0 0 26px rgb(255 110 40 / .5)); }
.v-title { font-family: var(--mincho); font-weight: 800; }

/* static sections */
.wrap { max-width: 1280px; margin: 0 auto; }
.section { position: relative; z-index: 2; background: var(--bg); padding-block: clamp(72px, 9vw, 128px); border-top: 1px solid var(--line); }
.eyebrow { margin: 0 0 14px; font: 600 12px/1.6 var(--mono); letter-spacing: .18em; color: var(--ember); }
.h2 { margin: 0; font-size: clamp(1.9rem, 4vw, 3.3rem); font-weight: 900; line-height: 1.25; text-wrap: balance; }
.lead { margin: 18px 0 0; max-width: 38em; color: var(--muted); font-size: 1.05rem; line-height: 1.9; }
.src { margin-left: 2px; font: 400 .7em var(--mono); vertical-align: super; color: var(--faint); text-decoration: none; }
.src:hover { color: var(--ember); }
.market { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 24px; margin-top: 44px; }
.chart { margin: 0; padding: clamp(20px, 3vw, 36px); background: var(--surface); border: 1px solid var(--line); }
.chart figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-weight: 700; }
.chart figcaption span { font: 400 12px var(--mono); color: var(--faint); }
.bars { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; gap: clamp(12px, 3vw, 32px); height: 300px; margin-top: 28px; border-bottom: 1px solid var(--line); }
.bar { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 10px; height: 100%; }
.bar__val { font: 400 clamp(1.2rem, 2.4vw, 1.8rem) var(--display); font-variant-numeric: tabular-nums; }
.bar:nth-child(1) .bar__col { height: 150px; }
.bar:nth-child(2) .bar__col { height: 176px; }
.bar:nth-child(3) .bar__col { height: 193px; }
.bar:nth-child(4) .bar__col { height: 240px; }
.bar__col { width: 100%; max-width: 104px; background: var(--ember-dim); }
.bar:nth-child(2) .bar__col { background: var(--ember-deep); }
.bar:nth-child(3) .bar__col { background: var(--ember); }
.bar--f .bar__col { background: transparent; border: 2px dashed var(--ember); box-sizing: border-box; }
.axis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 3vw, 32px); margin-top: 12px; font: 400 13px var(--mono); color: var(--muted); text-align: center; }
.kpis { display: grid; gap: 24px; align-content: start; }
.kpi { display: grid; gap: 6px; padding: 24px; background: var(--surface); border: 1px solid var(--line); }
.kpi__num { font: 400 clamp(2.2rem, 4vw, 3.2rem)/1 var(--display); font-variant-numeric: tabular-nums; }
.kpi__num small { margin-left: 3px; font: 900 .45em var(--sans); }
.kpi__label { color: var(--muted); font-size: .95rem; line-height: 1.6; }
.note { margin: 24px 0 0; max-width: 60em; color: var(--faint); font-size: .85rem; line-height: 1.8; }
.teams { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin-top: 44px; }
.team { display: grid; gap: 10px; align-content: start; }
.team__art { aspect-ratio: 3 / 4; display: grid; place-items: end center; overflow: hidden; border: 1px solid var(--line); background: radial-gradient(ellipse 70% 60% at 50% 70%, #5A1E08 0%, #2A0F06 50%, var(--surface) 85%); }
.team__art svg { width: 62%; height: auto; }
.team h3 { margin: 0; font: 400 1.3rem/1.15 var(--display); letter-spacing: .03em; }
.team p { margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.6; }
.team p.tbd { color: var(--faint); }
.partners { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: clamp(32px, 5vw, 64px); }
.vertical { margin: 0; height: 9.5em; writing-mode: vertical-rl; font: 800 clamp(2rem, 4vw, 3.2rem)/1.5 var(--mincho); }
.pkgs { margin: 32px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.pkg { display: grid; grid-template-columns: 9rem minmax(0, 1fr) auto; gap: 16px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--line); }
.pkg b { font: 400 1.4rem var(--display); letter-spacing: .04em; }
.pkg span { color: var(--muted); line-height: 1.7; }
.pkg em { font: normal 400 13px var(--mono); color: var(--faint); white-space: nowrap; }
.logos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: 32px; background: var(--line); border: 1px solid var(--line); }
.logos div { min-height: 84px; display: grid; place-items: center; padding: 12px; text-align: center; font-size: 13px; color: var(--faint); background: var(--bg); }
.contact__title { margin: 0; font: 400 clamp(3rem, 9vw, 7.5rem)/.95 var(--display); }
.contact__title span { color: var(--ember); }
.types { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.types li { padding: 6px 12px; border: 1px solid var(--line); color: var(--muted); font-size: 14px; }
.contact__link { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; margin-top: 28px; color: var(--ink); font-size: 1.1rem; font-weight: 700; text-decoration: underline; text-decoration-color: var(--ember); text-decoration-thickness: 2px; text-underline-offset: 7px; }
.contact__link:hover { color: var(--ember); }
.news { margin: 32px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.news li { display: flex; gap: 32px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.news time { flex: none; width: 7.5rem; font-family: var(--mono); color: var(--faint); font-variant-numeric: tabular-nums; }
.sources { margin: 32px 0 0; padding: 0; list-style: none; columns: 2 22rem; column-gap: 48px; font-size: .88rem; line-height: 1.7; }
.sources li { break-inside: avoid; padding: 5px 0; color: var(--muted); }
.sources b { margin-right: 8px; font-family: var(--mono); color: var(--ink); }
footer { position: relative; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-block: 40px 110px; border-top: 1px solid var(--line); color: var(--faint); font-size: 13px; background: var(--bg); }
.footer__logo { display: inline-flex; align-items: center; gap: 10px; font: 400 1.1rem var(--display); letter-spacing: .08em; color: var(--ink); }
.footer__logo img { width: 34px; height: 34px; margin: -6px -4px -4px -6px; object-fit: contain; }

@media (max-width: 860px) {
  .route { display: none; }
  .market, .partners { grid-template-columns: minmax(0, 1fr); }
  .teams { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pkg { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .vertical { height: auto; writing-mode: horizontal-tb; }
  .logos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news li { flex-direction: column; gap: 4px; }
  .bars { height: 220px; }
  .bar:nth-child(1) .bar__col { height: 108px; }
  .bar:nth-child(2) .bar__col { height: 127px; }
  .bar:nth-child(3) .bar__col { height: 139px; }
  .bar:nth-child(4) .bar__col { height: 173px; }
  .chapter__pin { align-items: flex-end; padding-block: 100px 110px; }
  .brand__name { font-size: .9rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pill { transition: none; }
  .bc-flame, .bc-flame-in { animation: none; }
}