/* ============================================================
   LTD LITTLE SEOUL — shell-v3.css (29/10/2026, DA « LTD V2 »)
   Enveloppe du site public : en-tête, menu du haut, menu « Mon compte », pied de page.
   Chargé après public.css sur toutes les pages publiques. Tout est limité à body.public.
   Les jetons de couleur et de police viennent de ltd-da.css.
   ============================================================ */

body.public{--v3-bar:rgba(17,17,23,.86)}

/* ---------- En-tête ---------- */
body.public .site-header{height:72px;background:var(--v3-bar);border-bottom:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
body.public .site-header.is-moving,body.public .site-header.is-scrolled{background:var(--v3-bar);border-bottom-color:var(--line)}
body.public .site-header::after{display:none}
body.public .site-header .container{gap:24px}
body.public .brand{gap:12px;flex:0 0 auto}
body.public .brand svg,body.public .brand img{width:38px;height:38px;border-radius:9px!important}
body.public .brand .txt{gap:0}
body.public .brand .t1{font-family:var(--font-display);font-weight:700;font-size:17px;letter-spacing:.14em;text-transform:uppercase}
body.public .brand .t2{display:none!important}

/* Menu du haut : capitales espacées, trait rose sous la page courante */
@media (min-width:761px){
  body.public .top-nav{margin:0 auto;gap:0}
  body.public .top-nav a,body.public .top-nav a.nav-glow{display:inline-flex;align-items:center;height:36px;margin:0 12px;padding:6px 0;border-radius:0!important;font-family:var(--font-display);font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--txt-2)!important;background:none!important;border:0!important;border-bottom:2px solid transparent!important;box-shadow:none!important;animation:none!important;position:relative;box-sizing:border-box;transition:.2s}
  body.public .top-nav a:hover,body.public .top-nav a.nav-glow:hover{color:var(--txt)!important;border-bottom-color:var(--accent)!important}
  body.public .top-nav a.is-active,body.public .top-nav a.nav-glow.is-active{color:var(--txt)!important;border-bottom-color:var(--accent)!important}
  body.public .top-nav a.is-active::after{display:none}
  /* Fidélité ressort par le dégradé de la maison et un reflet lent ; au survol et sur sa page, elle redevient comme les autres. */
  body.public .top-nav a.nav-glow{color:transparent!important;background:var(--sunset-h) 0 0/220% 100%!important;-webkit-background-clip:text!important;background-clip:text!important;animation:navShine 4s ease-in-out infinite alternate!important}
}
@keyframes navShine{to{background-position:100% 0}}
@media (min-width:761px) and (max-width:1040px){
  body.public .site-header .container{gap:14px}
  body.public .top-nav a,body.public .top-nav a.nav-glow{margin:0 8px;font-size:12px;letter-spacing:.1em}
  body.public .acct-label{display:none}
  body.public .acct-btn{padding:0 10px}
}

/* Bouton « Mon compte » (pilule fantôme) et son menu */
body.public .acct-btn{min-height:40px;padding:0 16px 0 14px;border-radius:999px;border:0;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3);background:transparent;font-family:var(--font-display);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--txt)}
body.public .acct-btn:hover{box-shadow:inset 0 0 0 1.5px var(--accent);color:var(--accent);background:transparent;transform:none}
body.public .acct-btn > .ico{color:inherit}
body.public .acct-caret{opacity:.6}
body.public .acct-av{width:24px;height:24px;border-color:var(--line-2)}
body.public .acct-menu{min-width:256px;padding:8px;border-radius:16px;background:var(--ink-800);border:0;box-shadow:inset 0 0 0 1px var(--line),0 24px 48px -16px rgba(0,0,0,.8)}
body.public .acct-menu a,body.public .acct-menu .acct-logout{gap:10px;padding:10px 12px;border-radius:10px;font-family:var(--font-display);font-size:13.5px;font-weight:600;color:var(--txt-2)}
body.public .acct-menu a svg{color:var(--txt-3)}
body.public .acct-menu a:hover,body.public .acct-menu a:focus-visible{background:rgba(var(--accent-rgb),.1);color:var(--txt);transform:none}
body.public .acct-menu a:hover svg{color:var(--accent)}
body.public .acct-menu .acct-logout svg{color:var(--txt-3)}
body.public .acct-menu .acct-logout:hover,body.public .acct-menu .acct-logout:focus-visible{background:rgba(var(--accent-rgb),.1);color:var(--accent);transform:none}
body.public .acct-menu .acct-logout:hover svg{color:var(--accent)}
body.public .acct-head{padding:8px 12px 12px;margin-bottom:4px;border-bottom:1px solid var(--line)}
body.public .acct-head b{font-size:14px}
body.public .acct-head span{font-size:12px}
body.public .acct-av--lg{border-radius:12px}
body.public .acct-sep{margin:4px 6px;background:var(--line)}

/* Téléphone : ligne 1 = logo + compte, ligne 2 = liens qui défilent (surcharge des règles !important de public.css). */
@media (max-width:760px){
  html body.public .site-header{height:auto!important;min-height:0!important;padding:0 16px!important;display:block!important;align-items:stretch!important}
  html body.public .site-header > .container{display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:space-between!important;row-gap:0!important;gap:10px!important;padding:0!important;width:100%!important;min-height:0!important;height:auto!important}
  html body.public .site-header .brand{order:1!important;flex:1 1 auto!important;min-height:56px;align-self:center!important;margin:0!important}
  html body.public .site-header .brand img,html body.public .site-header .brand svg{width:30px!important;height:30px!important}
  html body.public .site-header .brand .t1{font-size:13px;letter-spacing:.12em}
  html body.public .site-header .header-actions{order:2!important;flex:none!important;align-self:center!important;margin:0!important}
  html body.public .site-header .acct-btn{min-height:34px!important;height:34px!important;padding:0 10px!important;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3)}
  html body.public .site-header .top-nav{order:3!important;flex:0 0 100%!important;width:100%!important;display:flex!important;gap:4px!important;margin:0!important;padding:0 0 10px!important;min-width:0;overflow-x:auto!important;scrollbar-width:none;border:0}
  html body.public .site-header .top-nav::-webkit-scrollbar{display:none}
  html body.public .site-header .top-nav a{flex:none!important;display:inline-flex!important;align-items:center;justify-content:center;height:32px!important;padding:0 12px!important;margin:0!important;border-radius:999px!important;font-family:var(--font-display);font-size:11.5px!important;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-2)!important;background:none!important;border:0!important;box-shadow:inset 0 0 0 1px var(--line)!important;animation:none!important}
  html body.public .site-header .top-nav a.is-active{color:var(--accent-ink)!important;background:var(--accent)!important;box-shadow:none!important}
  html body.public .site-header .top-nav a[href*="packs.html"],html body.public .site-header .top-nav a[href*="stations.html"]{display:inline-flex!important}
  /* Téléphone du jeu (lb-phone, voir utils.js) : barre d'état réservée en haut (72 px), en-tête fixe. */
  html.in-game-phone body.public .site-header{padding-top:72px!important;padding-bottom:0!important}
  html.in-game-phone body.public{padding-top:170px!important}
}
html body.public #burger{box-shadow:0 10px 26px rgba(0,0,0,.55)!important;background:var(--accent)!important;color:var(--accent-ink)!important}
/* Page de connexion (html.auth-dedicated) : pas d'en-tête ni de pied de page du site, quelle que soit la taille d'écran. */
html.auth-dedicated body.public .site-header,html.auth-dedicated body.public .site-footer{display:none!important}
html.in-game-phone.auth-dedicated body.public{padding-top:0!important}

/* ---------- Pied de page (maquette : une ligne marque + menu, puis contact, puis légal) ---------- */
body.public .site-footer{padding:clamp(48px,6vw,72px) 0 44px;margin-top:40px;background:transparent;border-top:1px solid var(--line);color:var(--txt-3);font-size:14px}
body.public .site-footer::before,body.public .site-footer::after{display:none}
body.public .site-footer .container{position:relative;z-index:1}
body.public .ft-row{display:flex;justify-content:space-between;gap:20px 28px;flex-wrap:wrap;align-items:center}
body.public .ft-row + .ft-row{margin-top:28px;padding-top:24px;border-top:1px solid var(--line)}
body.public .site-footer .brand{display:inline-flex;flex:none}
body.public .site-footer .brand .t1{font-size:15px}
body.public .ft-nav{display:flex;gap:8px 26px;flex-wrap:wrap;font-family:var(--font-display);letter-spacing:.14em;text-transform:uppercase;font-size:12px;font-weight:600}
body.public .ft-nav a{color:var(--txt-3);text-decoration:none;transition:color .2s}
body.public .ft-nav a:hover{color:var(--accent)}
body.public .ft-contact{display:flex;gap:10px 28px;flex-wrap:wrap;align-items:center}
body.public .ft-contact > *{display:inline-flex;align-items:center;gap:8px;color:var(--txt-2);text-decoration:none;font:inherit;background:none;border:0;padding:0;cursor:pointer;transition:color .2s}
body.public .ft-contact > *:hover{color:var(--accent)}
body.public .ft-contact svg{color:var(--accent);flex:none}
body.public .ft-contact em{font-style:normal;color:var(--txt-3)}
body.public .ft-social{display:flex;gap:8px}
body.public .ft-social a{width:34px;height:34px;border-radius:999px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.3);display:grid;place-items:center;color:var(--txt-2);transition:.2s}
body.public .ft-social a:hover{color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)}
body.public .ft-legal{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:12.5px}
body.public .ft-legal a{color:var(--txt-3);text-decoration:none;transition:color .2s}
body.public .ft-legal a:hover{color:var(--accent)}
body.public .ft-copy{font-size:12.5px}
body.public .ft-credit{margin:14px 0 0;font-size:12px;color:var(--txt-3)}
body.public .ft-credit b{font-weight:600;color:var(--txt-2)}
@media (max-width:760px){
  body.public .site-footer{padding-top:40px;margin-top:20px}
  body.public .ft-row{flex-direction:column;align-items:flex-start;gap:16px}
  body.public .ft-nav{gap:8px 18px;font-size:11.5px}
  body.public .ft-contact{flex-direction:column;align-items:flex-start;gap:10px}
}