/* Landing v0.4: one small-viewport composition. Art never determines page height. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html.on-landing,html.on-landing body{height:100%;overflow:hidden}
.landing{
  width:100%;height:100vh;height:100svh;min-height:0;
  display:grid;grid-template-rows:44px minmax(0,1fr) auto;
  gap:12px;padding:max(12px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));
  background:radial-gradient(ellipse at 72% 43%,#73502235,transparent 60%),#10121b;
  overflow:hidden;isolation:isolate;
}
.landing-top{width:100%;max-width:1320px;margin:0 auto;padding:0;min-width:0;height:44px;align-items:center}
.landing-edition{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#bcb5a5}
.landing-top .quiet{display:flex;align-items:center;gap:8px;padding:8px 0 8px 14px;font-size:12px;color:#d2ccbf;min-height:44px}
.landing-top .quiet svg{width:16px;height:16px}
.landing-hero{width:100%;max-width:1240px;margin:0 auto;min-width:0;min-height:0;display:grid;grid-template-columns:.82fr 1.18fr;gap:24px;align-items:center}
.landing-title{margin:0;padding:0 0 0 10px;text-align:left;min-width:0}
.landing .league{margin:0 0 12px;font-size:15px;line-height:1;letter-spacing:.32em;font-weight:800;color:#f1ece2}
.landing-title h1{font-size:clamp(48px,7vw,100px);line-height:.92;letter-spacing:.005em;white-space:nowrap;text-shadow:0 4px 30px #0005}
.landing-title h1 span{display:block}
.landing-title .landing-tagline{margin:20px 0 0;font-size:clamp(12px,1.25vw,17px);line-height:1.4;color:#d7c7aa}
.landing .story-scene{width:100%;height:100%;min-width:0;min-height:0;max-width:none;max-height:none;margin:0;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.landing .landing-art{display:block;width:100%;height:100%;max-height:100%;min-height:0;object-fit:contain;object-position:center;filter:drop-shadow(0 12px 25px #0005)}
.landing-bottom{width:100%;max-width:1180px;margin:0 auto;padding:0;display:grid;grid-template-columns:minmax(0,1fr) 220px;column-gap:30px;align-items:center;text-align:center}
.landing-bottom nav{grid-column:1;grid-row:1 / 3;min-width:0}
.landing-bottom .button{grid-column:2;grid-row:1;min-width:0;width:100%;margin:0;min-height:52px;font-size:16px}
.landing-bottom .button svg{width:20px;height:20px}
.landing-bottom>small{grid-column:2;grid-row:2;margin:8px 0 0;font-size:9px;line-height:1.4}
.landing .chapters{gap:6px;view-transition-name:chapters}
.landing .chapter{border:0}
.landing .chapter-control{gap:7px;padding:6px 2px 5px;font-size:11px;line-height:1.25}
.landing .chapter-control strong{font-size:11px;line-height:1.3;max-width:120px;font-weight:600}
.landing .stage-icon{width:40px;height:40px;box-shadow:0 0 0 5px #10121b;background:#171925}
.landing .stage-icon svg{width:21px;height:21px}
.landing .chapter:after{top:26px;left:72%;width:60%}
@media(max-width:700px){
  .landing{grid-template-rows:36px minmax(0,1fr) auto;gap:8px;padding:max(8px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}
  .landing-top{height:36px}.landing-edition{font-size:9px;letter-spacing:.1em}.landing-top .quiet{font-size:11px;min-height:36px;padding:4px 0 4px 12px}
  .landing-hero{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:8px;align-items:stretch}
  .landing-title{padding:0;text-align:center;align-self:start}
  .landing .league{font-size:10px;line-height:1;margin:0 0 5px;letter-spacing:.25em}
  .landing-title h1{font-size:clamp(29px,9vw,46px);line-height:1;letter-spacing:0;white-space:nowrap}
  .landing-title h1 span{display:inline}
  .landing-title .landing-tagline{font-size:12px;line-height:1.3;margin:8px 0 0}
  .landing .story-scene{width:100%;height:100%;min-height:0;max-height:none;margin:0}
  .landing-bottom{display:flex;flex-direction:column;gap:0;max-width:470px}
  .landing-bottom nav{width:100%}.landing .chapters{gap:2px}
  .landing .chapter-control{padding:4px 1px 3px;gap:6px}
  .landing .chapter-control strong{font-size:9px;line-height:1.25;max-width:70px;min-height:34px;overflow-wrap:normal}
  .landing .stage-icon{width:30px;height:30px;box-shadow:0 0 0 4px #10121b}
  .landing .stage-icon svg{width:17px;height:17px}.landing .chapter:after{top:19px;left:77%;width:47%}
  .landing-bottom .button{width:100%;max-width:350px;margin:9px 0 0;min-height:48px;font-size:15px;padding:11px 20px}
  .landing-bottom>small{font-size:8px;line-height:1.25;margin:7px 0 0}
}
@media(max-width:700px) and (max-height:580px){
  .landing{grid-template-rows:32px minmax(0,1fr) auto;gap:5px;padding-top:max(5px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}
  .landing-top{height:32px}.landing-top .quiet{min-height:32px}.landing .league{font-size:9px;margin-bottom:3px}
  .landing-title h1{font-size:30px}.landing-title .landing-tagline{font-size:11px;margin-top:5px}.landing-hero{gap:5px}
  .landing .stage-icon{width:24px;height:24px}.landing .stage-icon svg{width:14px;height:14px}.landing .chapter:after{top:16px}
  .landing .chapter-control{gap:4px}.landing .chapter-control strong{font-size:8px;min-height:30px}.landing-bottom .button{margin-top:5px;min-height:44px}
}
@media(max-height:480px) and (min-width:500px){
  .landing{grid-template-rows:32px minmax(0,1fr) auto;gap:5px;padding-top:max(5px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}
  .landing-top{height:32px}.landing-hero{grid-template-columns:.85fr 1.15fr;grid-template-rows:minmax(0,1fr);gap:15px}
  .landing-title{text-align:left;align-self:center;padding-left:15px}.landing .league{font-size:10px;margin-bottom:6px}.landing-title h1{font-size:clamp(30px,6.5vw,55px)}.landing-title h1 span{display:block}.landing-title .landing-tagline{font-size:11px;margin-top:10px}
  .landing-bottom{display:grid;grid-template-columns:minmax(0,1fr) 160px;column-gap:20px;max-width:1000px}.landing-bottom nav{grid-column:1;grid-row:1 / 3}
  .landing .stage-icon{width:25px;height:25px}.landing .stage-icon svg{width:15px;height:15px}.landing .chapter-control{gap:4px}.landing .chapter-control strong{font-size:9px;min-height:23px}.landing .chapter:after{top:17px}
  .landing-bottom .button{grid-column:2;grid-row:1;margin:0;min-height:44px;font-size:13px}.landing-bottom>small{grid-column:2;grid-row:2;font-size:8px;margin-top:5px}
}