﻿@import url('/empire/assets/shared/home.css');
@import url('/empire/assets/shared/about.css');
body[data-menu="home"]{background:#060f19;overflow:auto;height:auto;min-height:100dvh}
body[data-menu="home"]>.shared-account,body[data-menu="home"]>.shared-links{display:none!important}
body[data-menu="home"] #app{height:auto;overflow:visible}
#home{display:flex;flex-direction:column;box-sizing:border-box;width:100%;height:auto;overflow-y:visible}
#home nav{justify-content:space-between;gap:18px}#home nav>b small{display:block}
#home .mode-card strong,#home .mode-card small,#home .mode-card b{display:block}
#home .navlinks #arrival-account-home{border:1px solid #d4b47744;color:#ead4a4;margin-right:10px}
#home button{cursor:pointer}#home footer{position:relative;inset:auto;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;padding:16px 0}
#home footer button,#home footer a{font-size:11px;color:#c3cdd2;background:transparent;border:0;text-decoration:none}
#home .home-effects{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
@media(max-width:760px){#home{padding:18px 16px 12px}#home nav{flex-wrap:wrap}#home .home-stage{min-height:620px}#home .hero{width:100%;max-width:none}#home .hero h1{font-size:clamp(41px,9vw,62px)}#home .home-cosmos{pointer-events:none}#home footer{padding-bottom:24px}}
@media(prefers-reduced-motion:reduce){#home *,#home *::before,#home *::after{animation:none!important;transition:none!important}}
#home::before{content:"";inset:0;pointer-events:none}#home .home-planet,#home .home-divine-hand,#home .home-orbit{pointer-events:none}body[data-menu="home"] .shared-account{display:none!important}

/* L’accueil ne doit pas hériter de la carte .hero du panneau de gestion. */
body[data-menu="home"] #home .hero{height:auto;min-height:0;overflow:visible;border:0;border-radius:0;background:none;flex:none}
body[data-menu="home"] #home .home-stage{flex:1 0 auto;min-height:min(740px,calc(100dvh - 150px))}
#modal{font:15px/1.6 "Segoe UI",sans-serif;width:min(760px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);padding:26px;border:1px solid #c5a76b66;border-radius:16px;overflow:auto;background:linear-gradient(135deg,#132837,#081723);color:#eef0ec}
#modal:has(.empire-shop){width:min(1360px,calc(100vw - 48px))}
#modal:has(.about-layout){width:min(960px,calc(100vw - 32px))}
#modal:has(.account-panel){width:min(780px,calc(100vw - 32px))}
#dialogContent> .row:first-child{position:sticky;top:-26px;z-index:3;background:#102431;padding:12px 0;border-bottom:1px solid #c5a76b33;margin-bottom:20px}
#modal #close-dialog{width:44px;height:44px;padding:0;flex:none;font-size:23px;float:right;position:relative;z-index:5}
#modal h2{font:26px/1.25 Georgia,serif;color:#f2dfb8}
#modal p{font-size:14px;line-height:1.75;color:#c8d5dd}
#modal button,#modal input,#modal select{min-height:44px;font-size:14px}
#modal .empire-shop{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
#modal .pack-card>img{height:270px}
#modal .pack-card>div{padding:18px}
#modal .pack-card h3{font:25px/1.2 Georgia,serif;min-height:60px;margin:14px 0}
#modal .pack-card p{min-height:100px}
#modal .about-layout{grid-template-columns:36% minmax(0,1fr)}
#modal .about-copy{padding:32px 30px}
#modal .about-copy h2{font-size:34px}
#modal .about-portrait{min-height:530px}
@media(max-width:1050px){#modal .empire-shop{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){body[data-menu="home"] #home .home-stage{min-height:0}#modal{padding:16px;width:calc(100vw - 20px);max-height:calc(100dvh - 20px)}#modal:has(.empire-shop){width:calc(100vw - 20px)}#modal .empire-shop{grid-template-columns:1fr}#modal .pack-card>img{height:230px}#modal .pack-card h3,#modal .pack-card p{min-height:0}#modal .about-layout{display:block}#modal .about-portrait{min-height:0;height:260px}#modal .about-copy{padding:14px 6px}#modal .about-copy h2{font-size:27px}#dialogContent>.row:first-child{top:-16px}}
