/* Menu central et décor : aucun sélecteur ne vise les commandes du combat. */
.home-screen {
  min-width:0;
  min-height:0;
  background:radial-gradient(ellipse at 50% 40%,#17212b 0,#0c101a 42%,#07080e 80%);
}
.home-screen .home-content {
  height:calc(100% - 64px);
  display:flex;
  justify-content:center;
  padding:0 24px 40px;
}
.home-screen .home-copy { width:440px; max-width:100%; padding:0; text-align:center; }
.home-screen .home-copy h1 { font-size:clamp(56px,5.6vw,84px); line-height:.88; }
.home-screen .home-copy > p { margin:22px 0 28px; font-size:14px; }
.home-screen .home-eyebrow { font-size:11px; letter-spacing:.26em; }
.home-screen .home-actions { flex-direction:column; }
.home-screen .home-links { justify-content:center; margin-top:20px; }
.home-screen .home-cards { position:absolute; inset:0; pointer-events:none; }
.home-screen .home-cards::before { display:none; }
.home-screen .home-card { height:min(54vh,36vw,560px); max-height:none; top:49%; }
.home-screen .home-card-nyx { left:4%; }
.home-screen .home-card-mara { left:auto; right:4%; }
.home-screen .home-glow-a { right:-8%; top:28%; opacity:.2; }
.home-screen .home-glow-b { left:-8%; right:auto; bottom:14%; opacity:.2; }
.home-scenery { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.home-orbit {
  position:absolute; width:min(74vw,880px); aspect-ratio:1;
  left:50%; top:49%; transform:translate(-50%,-50%);
  border:1px solid #20c7db26; border-radius:50%;
  box-shadow:0 0 0 24px #20c7db05,0 0 0 25px #20c7db13,0 0 0 80px #20c7db03;
}
.home-orbit::after {
  content:""; position:absolute; inset:12px;
  border:2px dashed #20c7db20; border-radius:50%;
  animation:home-orbit-turn 90s linear infinite;
}
.home-grid-floor {
  position:absolute; bottom:-180px; left:-50%; width:200%; height:370px;
  background:repeating-linear-gradient(90deg,transparent 0 79px,#12d9f430 80px 81px),repeating-linear-gradient(0deg,transparent 0 49px,#12d9f430 50px 51px);
  transform:perspective(300px) rotateX(56deg);
  mask-image:linear-gradient(transparent,#000 80%);
}
.home-skyline { position:absolute; inset:auto 0 60px; height:200px; display:flex; align-items:end; gap:3%; opacity:.28; }
.home-skyline i {
  flex:1; height:55%; border-top:2px solid #12d9f4; border-inline:1px solid #12d9f438;
  background:repeating-linear-gradient(0deg,transparent 0 15px,#12d9f430 16px 18px),linear-gradient(#142a38,#080b12);
  clip-path:polygon(0 16px,16px 0,100% 0,100% 100%,0 100%);
}
.home-skyline i:nth-child(3n) { height:90%; border-top-color:var(--pink); }
.home-skyline i:nth-child(3n + 1) { height:72%; }
.home-skyline i:nth-child(4),.home-skyline i:nth-child(5),.home-skyline i:nth-child(6) { opacity:.2; height:30%; }
.home-side-code { position:absolute; top:22%; font:700 10px var(--display); letter-spacing:.25em; writing-mode:vertical-rl; color:#6c859b; }
.home-side-code-left { left:20px; }
.home-side-code-right { right:20px; color:#a2af61; }
.home-bottom-code { position:absolute; bottom:23px; left:4.5%; right:4.5%; display:flex; justify-content:space-between; gap:20px; color:#83949c; font:700 10px var(--display); letter-spacing:.18em; }
.home-bottom-code span:nth-child(2) { color:var(--acid); }
@keyframes home-orbit-turn { to { transform:rotate(360deg); } }

/* Interactions de l'accueil. */
.home-screen .home-actions {
  flex-wrap:wrap;
  gap:12px;
}
.home-screen .home-actions .button,
.home-screen .home-links button {
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  overflow:hidden;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transition:transform .22s cubic-bezier(.2,.8,.2,1),background-color .22s ease,color .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.home-screen .home-actions .button {
  width:100%;
  min-height:78px;
  padding:20px 30px;
  font-size:22px;
  letter-spacing:.045em;
  filter:none;
}
.home-screen .home-play {
  color:#0b1008;
  background:linear-gradient(110deg,var(--acid),#e0f526 55%,var(--yellow));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -3px 0 rgba(14,27,3,.25);
}
.home-screen .home-actions .ghost {
  color:#e7faff;
  background:rgba(16,30,39,.92);
  border:1px solid rgba(18,217,244,.42);
}
.home-screen .home-button-label,
.home-screen .home-button-arrow { position:relative; z-index:2; }
.home-screen .home-button-arrow {
  flex:none;
  font:600 21px/1 var(--body);
  transition:transform .25s cubic-bezier(.2,.8,.2,1);
}
.home-screen .home-actions .button::before {
  content:"";
  position:absolute;
  z-index:1;
  inset:-45% auto -45% -50%;
  width:35%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
  transform:skewX(-22deg);
  pointer-events:none;
}
.home-screen .home-play::after {
  content:"";
  position:absolute;
  inset:auto 16px 5px;
  height:2px;
  background:#15350c;
  opacity:.18;
  transform:scaleX(.22);
  transform-origin:left;
  pointer-events:none;
  animation:home-charge-line 4.8s ease-in-out infinite;
}
.home-screen .home-links button {
  min-height:40px;
  padding:8px 2px;
  color:#c8c5d2;
  border-bottom:1px solid rgba(255,255,255,.18);
  font-size:12px;
}
.home-screen .home-links button::after {
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:2px;
  background:var(--cyan);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
}
@media (hover:hover) and (pointer:fine) {
  .home-screen .home-actions .button:hover { transform:translateY(-4px); }
  .home-screen .home-actions .home-play:hover {
    box-shadow:inset 0 0 0 2px rgba(255,255,255,.8),inset 0 -4px 0 rgba(14,27,3,.25);
  }
  .home-screen .home-actions .ghost:hover {
    background:#153a47;
    border-color:var(--cyan);
    box-shadow:inset 0 0 18px rgba(18,217,244,.14);
  }
  .home-screen .home-actions .button:hover::before { animation:home-button-sweep .65s ease-out; }
  .home-screen button:hover > .home-button-arrow { transform:translateX(4px); }
  .home-screen .home-play:hover > .home-button-arrow { transform:translate(3px,-3px); }
  .home-screen .home-links button:hover { color:var(--cyan); }
  .home-screen .home-links button:hover::after { transform:scaleX(1); }
}
.home-screen .home-actions .button:focus-visible,
.home-screen .home-links button:focus-visible {
  outline:2px solid #fff;
  outline-offset:-4px;
  box-shadow:inset 0 0 0 4px rgba(255,255,255,.25);
}
.home-screen .home-actions .button:focus-visible::before { animation:home-button-sweep .65s ease-out; }
.home-screen .home-links button:focus-visible::after { transform:scaleX(1); }
.home-screen .home-actions .button:active,
.home-screen .home-links button:active {
  transform:translateY(1px) scale(.975);
  transition-duration:.08s;
}
@keyframes home-button-sweep {
  from { left:-50%; }
  to { left:125%; }
}
@keyframes home-charge-line {
  0%,100% { transform:scaleX(.22); opacity:.18; }
  50% { transform:scaleX(1); opacity:.4; }
}
@media (prefers-reduced-motion:reduce) {
  .home-orbit::after { animation:none; }
  .home-screen .home-actions .button,
  .home-screen .home-links button,
  .home-screen .home-button-arrow,
  .home-screen .home-links button::after { transition:none; }
  .home-screen .home-actions .button::before,
  .home-screen .home-actions .button::after { animation:none!important; }
  .home-screen .home-actions .button:hover,
  .home-screen .home-actions .button:active,
  .home-screen .home-links button:active,
  .home-screen button:hover > .home-button-arrow { transform:none; }
}
@media (max-width:1050px) {
  .home-screen .home-card { opacity:.35; height:46vh; }
  .home-screen .home-card-nyx { left:-8%; }
  .home-screen .home-card-mara { right:-8%; }
  .home-screen .home-copy { background:radial-gradient(ellipse,#0c111bec 50%,transparent 72%); }
}
@media (max-width:600px) {
  .home-screen .home-brand { gap:10px; }
  .home-screen .home-brand strong { font-size:25px; }
  .home-screen .home-brand span { font-size:8px; }
  .home-screen .home-actions .button { min-height:68px; font-size:19px; }
  .home-screen .home-side-code,.home-bottom-code span:not(:nth-child(2)) { display:none; }
  .home-bottom-code { justify-content:center; }
}
@media (max-height:720px) {
  .home-screen .home-content { height:calc(100% - 54px); padding-bottom:32px; }
  .home-screen .home-copy h1 { font-size:58px; }
  .home-screen .home-copy > p { margin:16px 0 22px; }
}
@media (max-height:560px) {
  .home-screen { overflow-y:auto; }
  .home-screen .home-content { height:auto; min-height:470px; padding-top:24px; }
  .home-bottom-code { display:none; }
}
