/* MoodleMaster — compléments d'application à mm.css.
   mm.css est copié tel quel depuis moodlemaster-design/ et n'est jamais modifié. Ce fichier ne
   fait que ce que les maquettes statiques ne pouvaient pas faire : polices servies localement,
   un seul DOM pour mobile et bureau, défilement, focus clavier, états manquants (mauvaise
   réponse), radios dans les puces. Il n'utilise que les jetons et valeurs de mm.css. */

/* ---------- Polices (servies par le site, comme le DSFR d'emargement : pas de CDN tiers) ---------- */
@font-face{font-family:Unbounded;font-style:normal;font-weight:500;font-display:swap;src:url(fonts/unbounded-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:Unbounded;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/unbounded-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Unbounded;font-style:normal;font-weight:800;font-display:swap;src:url(fonts/unbounded-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:Figtree;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/figtree-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:Figtree;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/figtree-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:Figtree;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/figtree-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:Figtree;font-style:normal;font-weight:800;font-display:swap;src:url(fonts/figtree-latin-800-normal.woff2) format("woff2")}

/* ---------- Base ---------- */
html{background:#0b0a14}
html:has(body.light){background:#f1f0f7}
body.mm{min-height:100vh;min-height:100dvh}
.mm main:focus{outline:none}
.mm fieldset{border:0;margin:0;padding:0;min-width:0}
.mm legend{padding:0;margin:0 0 6px}
.mm [hidden]{display:none!important}

/* ---------- Clavier : mm.css n'a pas d'état :focus ---------- */
.mm :focus-visible{outline:3px solid var(--ac);outline-offset:3px}
.mm .inp:focus{outline:none;border-color:var(--ac);box-shadow:0 0 0 3px color-mix(in srgb,var(--ac) 35%,transparent)}
.mm .inp.err:focus{border-color:var(--ko);box-shadow:0 0 0 3px color-mix(in srgb,var(--ko) 35%,transparent)}
.mm a.slot:focus-visible{outline:none}
.mm a.slot:focus-visible .card{outline:.18em solid var(--tx);outline-offset:.24em}
.skip{position:absolute;left:16px;top:-80px;z-index:100}
.skip:focus{top:16px}

/* ---------- États absents de mm.css ---------- */
.ans.bad{border-color:var(--ko);box-shadow:inset 0 0 0 2px var(--ko)}

/* Pastille : une demande d'ami, un message ou la guilde attend (layout.notif, social.pending) */
.notif{display:inline-block;position:relative;top:-6px;width:8px;height:8px;margin-left:4px;border-radius:50%;background:var(--ac);flex:none}
.mm a.on .notif{background:var(--act)}
/* Radios habillées en puces (.chip) ou en onglets internes (.seg) */
.chip-radio{position:relative}
.chip-radio input,.seg-radio input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.chip-radio:has(input:checked){background:var(--tx);color:var(--bg);border-color:var(--tx)}
.chip-radio:has(input:focus-visible),.seg-radio label:has(input:focus-visible){outline:3px solid var(--ac);outline-offset:3px}
.seg-radio label{position:relative;flex:1;min-height:44px;display:flex;align-items:center;justify-content:center;border-radius:10px;font-weight:700;font-size:13px;color:var(--mu);cursor:pointer}
.seg-radio label:has(input:checked){background:var(--pn2);color:var(--tx);box-shadow:inset 0 0 0 1px var(--ln)}

/* ---------- Mise en page commune ---------- */
.app>.tabs{display:none}
.flash{border-color:var(--ac)}
.pg-title{font-size:30px}
.pg-solde{height:44px;font-size:14px;padding:0 16px}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:14px}
.fav-row{gap:24px;font-size:10px}
.form-col{max-width:520px}
.prof-name{overflow-wrap:anywhere}

/* ---------- Profil public (routes_player.py) : un pseudo mène au joueur ---------- */
.mm a.plink{text-decoration:underline;text-decoration-color:var(--ln);text-underline-offset:3px;text-decoration-thickness:1px}
.mm a.plink:hover{text-decoration-color:currentColor}
.ava-link{display:inline-flex;flex:none;border-radius:50%}
.player-actions{align-items:center}
.player-actions form{display:contents}
.player-h2h{padding:14px 18px;align-items:center}
.player-ach{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}
main.bare{display:block}
.narrow{max-width:440px;margin:0 auto;padding:40px 20px;display:flex;flex-direction:column;gap:20px;min-height:100vh;min-height:100dvh}
.narrow>.logo{align-self:flex-start}
body:has(main.bare){background:radial-gradient(900px 520px at 75% 20%,var(--halo),transparent),var(--bg)}

/* ---------- Cartes : les vrais intitulés d'UE sont plus longs que ceux des maquettes ---------- */
.card .name{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- Légendaires : en plus de mm.css (cadre arc-en-ciel, rayons, reflet) ----------
   léger halo derrière la carte, étoiles qui scintillent, film holographique, et la carte qui
   s'incline sous le pointeur avec un reflet qui le suit (app.js pose .tilt et --rx/--ry/--mx/--my).
   Rien sur une carte pas encore possédée (.miss). */
@keyframes lgaura{0%,100%{opacity:.35}50%{opacity:.6}}
@keyframes lgstar{0%,100%{opacity:.1;transform:scale(.9)}50%{opacity:1;transform:scale(1)}}
@keyframes lgfoil{from{background-position:0 0,0% 0%}to{background-position:0 0,100% 100%}}
.slot:not(.miss):has(>.card.r6){isolation:isolate}
.slot:not(.miss):has(>.card.r6)::before{content:"";position:absolute;inset:.8em .5em;z-index:-1;border-radius:1.2em;background:linear-gradient(160deg,#ff6ad5,#b78bff 50%,#6ad0ff);filter:blur(1em);animation:lgaura 4s ease-in-out infinite;pointer-events:none}
.slot:not(.miss):has(>.card.tilt){z-index:2}
.slot:not(.miss) .r6 .in::before,.slot:not(.miss) .r6 .fx::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background-repeat:no-repeat;filter:drop-shadow(0 0 .15em #fff) drop-shadow(0 0 .5em #ffd36a) drop-shadow(0 0 .9em #ff6ad5);animation:lgstar 2.2s ease-in-out infinite}
.slot:not(.miss) .r6 .in::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 9 15 11 24 12C15 13 13 15 12 24C11 15 9 13 0 12C9 11 11 9 12 0Z' fill='white'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 9 15 11 24 12C15 13 13 15 12 24C11 15 9 13 0 12C9 11 11 9 12 0Z' fill='white'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 9 15 11 24 12C15 13 13 15 12 24C11 15 9 13 0 12C9 11 11 9 12 0Z' fill='white'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 9 15 11 24 12C15 13 13 15 12 24C11 15 9 13 0 12C9 11 11 9 12 0Z' fill='white'/%3E%3C/svg%3E");background-position:10% 8%,90% 30%,16% 60%,84% 88%;background-size:1.35em,.8em,.65em,1.05em}
.slot:not(.miss) .r6 .fx::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 9 15 11 24 12C15 13 13 15 12 24C11 15 9 13 0 12C9 11 11 9 12 0Z' fill='white'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 9 15 11 24 12C15 13 13 15 12 24C11 15 9 13 0 12C9 11 11 9 12 0Z' fill='white'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 9 15 11 24 12C15 13 13 15 12 24C11 15 9 13 0 12C9 11 11 9 12 0Z' fill='white'/%3E%3C/svg%3E");background-position:68% 6%,6% 40%,64% 72%;background-size:.7em,1.15em,.8em;animation-delay:1.1s}
.slot:not(.miss) .r6 .fx::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.45;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.6) 0,rgba(255,255,255,.12) 14%,transparent 34%),
  repeating-linear-gradient(118deg,transparent 0 10%,rgba(255,106,213,.7) 13%,rgba(255,211,106,.7) 15%,rgba(125,255,176,.7) 17%,rgba(106,208,255,.7) 19%,rgba(183,139,255,.6) 21%,transparent 24% 34%);
  background-size:0 0,260% 260%;animation:lgfoil 6s ease-in-out infinite alternate;transition:opacity .3s}
.slot:not(.miss) .card.r6{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.slot:not(.miss) .card.r6.tilt{transform:perspective(40em) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(1.04);transition:transform .1s linear}
.slot:not(.miss) .card.r6.tilt .fx::after{opacity:.75;animation:none;background-size:100% 100%,260% 260%;background-position:0 0,var(--mx) var(--my)}
@media (prefers-reduced-motion:reduce){.slot:has(>.card.r6)::before,.r6 .in::before,.r6 .fx::before,.r6 .fx::after{animation:none!important}.card.r6.tilt{transform:none}}

/* ---------- Album (M03, D-Album) ---------- */
.album-track{height:12px}
.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:28px 20px;padding-top:6px;font-size:10px}
.fdrops{position:relative}
.fdrop{position:static}
.fdrop>summary{list-style:none}
.fdrop>summary::-webkit-details-marker{display:none}
.fdrop[open]>summary{background:var(--pn2)}
.fdrop-menu{position:absolute;z-index:30;top:calc(100% + 6px);left:0;right:0;display:flex;flex-wrap:wrap;gap:8px;box-shadow:0 14px 30px -12px #000}

/* ---------- Détail d'une carte (M04, D-Carte) ---------- */
.detail{gap:56px;padding-top:12px}
.detail-card{font-size:22px}
.detail-info{flex:1 1 360px;min-width:0;max-width:520px}
.detail-rows{padding:18px}

/* ---------- Tirage (M02, D-Tirage) ---------- */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pack-hero{gap:56px;padding:32px 0}
.pack-lg{width:240px;height:348px}
.pack-lg b{font-size:28px}
.pack-text{flex:0 1 380px;text-align:left;align-items:flex-start}
.pack-lede{font-size:17px}
.today-row{gap:20px;font-size:10px}
.wait-cta{flex-direction:row;flex-wrap:wrap}
.wait-cta .btn.blk{display:inline-flex;width:auto}
.reveal-main{overflow:hidden;position:relative}
.reveal-hd{position:relative;z-index:6}
.reveal-body{gap:72px;justify-content:center;padding:48px 0;position:relative}
.reveal-side{flex:0 1 340px;position:relative;z-index:6}
.reveal-rn{font-size:40px}
.reveal-line{font-size:17px}
.reveal-slot{flex:none}
/* Mouvement réduit : reveal.css (copié des maquettes) coupe déjà tremblement, flash et rayons ;
   le libellé n'attend pas non plus la fin d'une animation qui n'a pas lieu. */
@media (prefers-reduced-motion:reduce){.lbl.open{transition:none}}

/* ---------- Marché : échanges (M05, D-Echange) ---------- */
.market-seg{width:320px;max-width:100%}
.trade-list{gap:12px}
.ava.trade-ava{width:52px;height:52px;font-size:14px}
.trade-title{font-size:26px}
.trade-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"mine nego theirs";gap:20px;align-items:stretch}
.trade-mine{grid-area:mine}.trade-theirs{grid-area:theirs}.trade-nego{grid-area:nego;min-width:0}
.trade-side{padding:18px}
.trade-cards{gap:18px;font-size:9px}
.trade-card{align-items:center}
.trade-gone .slot{opacity:.45;filter:grayscale(.8)}
.trade-x{min-height:36px;padding:0 10px;font-size:12px}
.trade-sys{text-align:center;font-size:12px}
.trade-msgs{max-height:420px;overflow-y:auto}
.coins-edit>summary{cursor:pointer;list-style:none}
.coins-edit>summary::-webkit-details-marker{display:none}
.coins-edit[open]>summary{margin-bottom:8px}
.pick-btn{all:unset;cursor:pointer;display:block;border-radius:1.1em}
.pick-btn:focus-visible{outline:3px solid var(--ac);outline-offset:3px}
.pick{align-items:center}
.s-pick{font-size:5px}

/* ---------- Marché : enchères (M06, D-Marche) ---------- */
.market-cols{gap:24px;align-items:flex-start}
.market-list{flex:1 1 420px;min-width:0}
.auction-panel{flex:1 1 380px;min-width:0;padding:20px}
.auction-card{font-size:12px}
.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* D-Marche : la vente ouverte dans le panneau de droite est surlignée dans la liste (bureau seulement) */
@media (min-width:900px){
  .rowi.sel-d{border-color:var(--ac);box-shadow:inset 0 0 0 1px var(--ac)}
  /* D-Marche : historique compact dans le panneau (« Inès · il y a 4 min ») */
  .auction-panel .rowi{background:none;border:0;box-shadow:none;padding:0;min-height:0}
  .auction-panel .rowi .gr{display:flex;align-items:baseline;gap:8px}
}
.bid-form{align-items:flex-end;flex-wrap:wrap}
/* Enchères : carte qui manque à l'album du joueur (routes_auction._view, missing) */
.miss-tag{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:11px;background:color-mix(in srgb,var(--ok) 16%,transparent);border:1px solid color-mix(in srgb,var(--ok) 45%,transparent);color:var(--ok);font-size:11px;font-weight:800;white-space:nowrap}
.bid-form .btn{margin-bottom:5px}

/* ---------- Duels (M07, D-Duel) ---------- */
.duel-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:18px 14px;font-size:8px;max-height:min(62vh,640px);overflow-y:auto;overscroll-behavior:contain;padding:6px;margin:0 -6px}
.duel-pick-search{margin-bottom:10px}
.duel-pick-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;padding:6px;border-radius:14px}
.duel-pick-item input{position:absolute;opacity:0;width:1px;height:1px}
.duel-pick-item:has(input:checked){outline:2px solid var(--ac);outline-offset:2px;background:var(--pn)}
.duel-pick-item:has(input:focus-visible){outline:3px solid var(--ac);outline-offset:3px}
/* Accueil (M07-Duels-Accueil, refonte) : adversaires et cartes en rails, barre « Lancer » collée en bas */
.mm .duel-hd-n{color:var(--tx)}
.duel-adv-meta,.duel-adv-meta .ro{gap:0}
.duel-lobby{gap:12px}
.duel-lobby>*{flex-shrink:0}
.duel-defi{padding:8px 10px}
.mm .duel-accept{background:var(--ac);color:var(--act);border-color:transparent}
.duel-rail{display:flex;gap:10px;padding:4px 0;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.duel-rail::-webkit-scrollbar{display:none}
.duel-opp{position:relative;flex:none;width:66px;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 0;border-radius:14px;color:var(--tx);font-size:12px;font-weight:700;cursor:pointer}
.duel-opp input,.duel-card-pick input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.duel-opp .av{position:relative;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--pn2);border:1px solid var(--ln);font-family:Unbounded,system-ui,sans-serif;font-weight:700;font-size:13px}
.duel-opp .av i{position:absolute;right:-1px;bottom:-1px;width:14px;height:14px;border-radius:50%;background:var(--ok);border:3px solid var(--bg)}
.duel-opp-name{max-width:100%;padding:0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.duel-opp.off{color:var(--mu)}
.duel-opp.off .av{opacity:.55}
.duel-opp.off .av i{background:var(--mu)}
.duel-opp:has(input:checked){background:var(--pn)}
.duel-opp:has(input:checked) .av{border:2px solid var(--ac);box-shadow:0 0 0 3px color-mix(in srgb,var(--ac) 35%,transparent)}
.duel-opp:has(input:focus-visible),.duel-card-pick:has(input:focus-visible){outline:3px solid var(--ac);outline-offset:2px}
/* Joueurs en attente d'un adversaire au hasard (M07-Duels-Accueil) : ligne « Affronter », pastilles */
@keyframes livep{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 70%,transparent)}100%{box-shadow:0 0 0 10px transparent}}
.live{width:12px;height:12px;border-radius:50%;background:var(--ok);flex:none;margin:0 8px 0 6px;animation:livep 1.6s ease-out infinite}
.bdg{position:absolute;top:-5px;right:-8px;min-width:20px;height:20px;padding:0 5px;box-sizing:border-box;border-radius:10px;background:var(--ok);color:var(--act);font-family:Figtree,system-ui,sans-serif;font-weight:800;font-size:12px;display:grid;place-items:center;border:2px solid var(--bg)}
.tab{position:relative}
.tab .bdg{top:-6px;right:0;border-color:var(--bg2)}
.nav a .bdg{position:static;margin-left:auto;border-color:transparent}
@media (prefers-reduced-motion:reduce){.live{animation:none}}
.duel-pseudo{display:none}
.duel-lobby:has([data-opp-pseudo]:checked) .duel-pseudo{display:flex}
.mm .duel-all{color:var(--ac)}
/* the rail scrolls sideways, so it clips: room above and below for the Ultra rare / Légendaire glow */
.duel-card-rail{gap:6px;isolation:isolate;padding-top:14px;padding-bottom:14px;margin-top:-10px;margin-bottom:-10px}
.duel-card-pick{position:relative;flex:none;display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px 6px 6px;border-radius:14px;color:var(--mu);cursor:pointer}
.duel-card-pick .num{font-size:12px}
.duel-card-pick:has(input:checked){background:var(--pn);box-shadow:inset 0 0 0 2px var(--ac);color:var(--tx)}
.duel-hist{min-height:48px;padding:6px 10px}
.duel-hist-t{color:inherit}
.duel-res{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;font-family:Unbounded,system-ui,sans-serif;font-weight:800;font-size:13px;flex:none}
.duel-res.d{background:color-mix(in srgb,var(--ko) 22%,transparent);color:var(--ko)}
.duel-res.v{background:color-mix(in srgb,var(--ok) 22%,transparent);color:var(--ok)}
.duel-cta{position:sticky;bottom:16px;z-index:10;display:flex;flex-direction:column;gap:10px;margin-top:4px;padding:12px 16px;background:var(--bg2);border:1px solid var(--ln);border-radius:16px;box-shadow:0 -18px 24px -12px var(--bg)}
.duel-cta-line{margin:0;text-align:center}
/* Recherche d'un adversaire (M07-Duels-Attente) : radar autour de la carte, chrono, annuler */
@keyframes radar{0%{transform:scale(.45);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.duel-attente{flex:1 0 auto;gap:14px;width:100%;max-width:480px;margin:0 auto;text-align:center;overflow-x:clip}
.duel-attente>*{flex-shrink:0}
.duel-radar{position:relative;width:260px;height:260px;display:grid;place-items:center}
.duel-radar i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--ac);animation:radar 2.7s ease-out infinite}
.duel-radar i:nth-child(2){animation-delay:.9s}
.duel-radar i:nth-child(3){animation-delay:1.8s}
.duel-radar-card{position:relative}
.duel-attente-t{font-size:22px}
.duel-attente-p{max-width:310px}
.duel-attente-pan{width:100%;padding:10px 14px}
.duel-attente-pan .gr{text-align:left}
.duel-attente-quit{width:100%}
@media (prefers-reduced-motion:reduce){.duel-radar i{animation:none;opacity:.3}}
/* Choix de la carte (M07-Duels-Choix-Carte) : feuille montante */
.duel-sheet{position:fixed;inset:70px 0 0;width:auto;max-width:none;height:auto;max-height:none;margin:0;padding:0;border:0;border-top:1px solid var(--ln);border-radius:24px 24px 0 0;background:var(--bg2);color:var(--tx);box-shadow:0 -30px 60px rgba(0,0,0,.6);flex-direction:column;overflow:hidden}
.duel-sheet[open]{display:flex}
.duel-sheet::backdrop{background:rgba(5,4,12,.65)}
.duel-grip{flex:none;width:44px;height:5px;border-radius:3px;background:var(--ln);margin:10px auto 2px}
.duel-sheet-hd{flex:none;gap:12px;padding:8px 16px 10px}
.duel-sheet-body{flex:1;min-height:0;gap:12px;padding:6px 16px 16px;overflow-y:auto;overscroll-behavior:contain}
.duel-sheet-body>*{flex-shrink:0}
.duel-chips{margin:0 -16px;padding:0 16px;overflow-x:auto;scrollbar-width:none}
.duel-chips::-webkit-scrollbar{display:none}
.duel-chips .chip{flex:none}
.duel-sheet-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 6px}
.duel-sheet-grid .duel-card-pick{padding:8px 0 6px}
.duel-sheet-ft{flex:none;padding:12px 16px calc(20px + env(safe-area-inset-bottom));border-top:1px solid var(--ln);background:var(--bg2)}
@media (min-width:900px){
  .duel-sheet{inset:0;margin:auto;width:min(560px,92vw);height:min(760px,88vh);border:1px solid var(--ln);border-radius:24px}
  .duel-sheet-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .duel-grip{display:none}
}
.faceoff{gap:12px;flex:1 0 auto}
.faceoff-card{font-size:9px}
.faceoff-card-opp{transform:rotate(3deg)}
.faceoff-card-me{transform:rotate(-3deg)}
.faceoff-vs{font-size:40px}
.faceoff-cta{width:100%;max-width:420px;align-items:stretch;text-align:center}
.duel-quiz{display:flex;flex-direction:column;gap:22px;flex:1 0 auto}
.duel-board{gap:32px;align-items:flex-start;justify-content:center}
.duel-side{flex:none}
.duel-card{font-size:14px}
.duel-card-me{transform:rotate(-3deg)}
.duel-card-opp{transform:rotate(3deg)}
.duel-center{flex:1 1 380px;min-width:0}
.duel-timer{font-size:28px;min-width:70px}
.duel-track{height:12px}
.duel-question{padding:22px}
.duel-prompt{font-size:24px}
.duel-answers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:10px}
.duel-validate{justify-content:flex-end}
.duel-burst{top:380px;width:1000px;height:1000px;margin:-500px 0 0 -500px}
.duel-result{gap:64px;justify-content:center;padding:32px 0}
.duel-result-card{font-size:16px;transform:rotate(-4deg)}
.duel-result-card.lost{filter:grayscale(.85);opacity:.7;transform:rotate(-6deg)}
.duel-result-text{flex:0 1 400px}
.duel-result-title{font-size:64px}
.duel-result-score{font-size:40px}
.duel-result-line{font-size:17px}
.duel-recap>summary{cursor:pointer}
.duel-recap-list{list-style:none;margin:10px 0 0;padding:0}
@media (min-width:900px){
  /* D-Duel : en face-à-face, ta carte à gauche, VS au centre, l'adversaire à droite */
  .faceoff{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"me . opp" "mecard vs oppcard" "cta cta cta";justify-items:center;align-items:center;gap:24px 48px;padding-top:24px}
  .faceoff-me{grid-area:me}.faceoff-opp{grid-area:opp}.faceoff-card-me{grid-area:mecard;font-size:14px}
  .faceoff-card-opp{grid-area:oppcard;font-size:14px}.faceoff-vs{grid-area:vs;font-size:56px}
  .faceoff>.gr{display:none}.faceoff-cta{grid-area:cta}
}

/* ---------- Accueil (M01-Accueil, D-Accueil) ---------- */
.landing{max-width:1160px;margin:0 auto;padding:24px 32px 56px;display:flex;flex-direction:column;gap:40px}
.landing-title{font-size:clamp(34px,4.4vw,54px)}
.landing-lede{font-size:18px;max-width:480px}
.landing-fan{position:relative;height:460px}
.landing-fan .slot{position:absolute}
.fan-l{font-size:14px;left:4%;top:110px;transform:rotate(-12deg)}
.fan-r{font-size:14px;right:4%;top:110px;transform:rotate(12deg)}
.fan-c{font-size:18px;left:50%;margin-left:-135px;top:30px}

/* ---------- Social (M08-*, D-Social, E-Amis-Vide) ---------- */
.social{display:flex;flex-direction:column;gap:20px}
.social-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:20px;align-items:start}
.social-panel{padding:18px;min-width:0}
.guild-all>summary{cursor:pointer}
.msg-list{gap:12px}
.chat-msgs{display:flex;flex-direction:column;gap:8px;max-height:360px;overflow-y:auto}
.chat-msgs .bub{overflow-wrap:anywhere;white-space:pre-line;position:relative}
.bub-del{position:absolute;top:50%;right:calc(100% + 4px);transform:translateY(-50%)}
.bub:not(.me) .bub-del{right:auto;left:calc(100% + 4px)}
.bub-del button{background:none;border:0;color:var(--mu);cursor:pointer;font:inherit;font-size:16px;width:28px;height:28px;padding:0;border-radius:50%;opacity:0}
.bub:hover .bub-del button,.bub-del button:focus-visible{opacity:1}
@media (hover:none){.bub-del button{opacity:.6}}
.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.conv{gap:12px}
.conv-title{font-size:16px}
.conv-menu{position:relative}
.conv-menu>summary{list-style:none;cursor:pointer}
.conv-menu>summary::-webkit-details-marker{display:none}
.conv-menu-list{position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:200px;padding:10px}
.add-friend.when-asked{display:none}
.add-friend.when-asked:target{display:flex}
@media (min-width:900px){
  .social-guild .rowi,.social-friends .rowi{background:none;border:0;box-shadow:none;padding:0;min-height:0!important}
  .guild-head{background:none;border:0;padding:0}
  .ava.guild-ava{width:52px;height:52px;font-size:14px}
  .msg-list .rowi{background:var(--pn2)}
  .guild-sub-m{display:none}
}

/* ---------- Classement et succès (M09-Classement, D-Classement) ---------- */
.ach-toast{border-color:var(--gold)}
.ach-toast .medal{width:44px;height:44px;font-size:13px;flex:none}

/* Popup « X te défie » (<dialog>, app.js) et recherche de joueur de l'admin */
.defi-pop{color:var(--tx);border-color:var(--ac);padding:20px;width:min(440px,calc(100vw - 32px));margin:auto}
.defi-pop::backdrop{background:rgba(5,4,12,.6)}
.defi-pop .ava{width:48px;height:48px;font-size:14px}
.defi-pop form{margin:0}
.credit-pop{position:relative;overflow:hidden;color:var(--tx);border-color:var(--gold);padding:28px 22px 22px;width:min(400px,calc(100vw - 32px));margin:auto;text-align:center;box-shadow:0 0 0 1px var(--gold),0 0 60px -10px var(--gold)}
.credit-pop[open]{animation:credit-in .45s cubic-bezier(.2,1.4,.4,1)}
.credit-pop::backdrop{background:rgba(5,4,12,.7)}
.credit-burst{width:520px;height:520px;top:110px;margin:-260px 0 0 -260px;pointer-events:none}
.credit-body{position:relative}
.credit-coin{perspective:400px}
.credit-coin .coin{width:84px;height:84px;box-shadow:inset 0 0 0 3px rgba(0,0,0,.18),0 0 34px -4px var(--gold);animation:credit-flip 2.6s ease-in-out infinite}
.credit-amount{font-size:44px;line-height:1.1}
.credit-msgs{max-height:40vh;overflow-y:auto}
.auction-pop-card{display:flex;justify-content:center;margin-bottom:4px}
.auction-pop-card .slot{transform:rotate(-3deg)}
.credit-msg{margin:0;padding:12px 14px;border-radius:14px;background:var(--pn2);border:1px solid var(--ln);text-align:left;white-space:pre-line;overflow-wrap:anywhere}
.admin-credit-msg{min-height:88px;padding-top:12px;padding-bottom:12px;resize:vertical;font:inherit;line-height:1.45}
@keyframes credit-in{from{transform:scale(.8) translateY(20px);opacity:0}}
@keyframes credit-flip{0%,60%{transform:rotateY(0)}100%{transform:rotateY(360deg)}}
@media (prefers-reduced-motion:reduce){.credit-pop[open],.credit-coin .coin{animation:none}}
.admin-search{position:relative}
.admin-hits{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.admin-hits button{width:100%;text-align:left;cursor:pointer;font:inherit;color:inherit}
.admin-hits button[aria-selected=true]{border-color:var(--ac);box-shadow:inset 0 0 0 1px var(--ac)}
.rank-wrap{gap:32px;align-items:flex-start}
.podium,.ach-grid{list-style:none;margin:0;padding:0}
.rank-players{flex:1 1 460px;min-width:0}
.podium{align-items:flex-end;max-width:520px}
.podium-step{width:100%;padding:8px}
.rank-gap{text-align:center;letter-spacing:.3em}
.rank-seg{width:320px;max-width:100%}
.rank-gname{overflow-wrap:anywhere;text-align:center}
.rowi .rank-gname{text-align:left}
.guild-rest{margin-top:8px}
.invite-card{padding:28px 20px;text-align:center}
.invite-card .btn,.invite-card form{align-self:stretch}
.invite-name{overflow-wrap:anywhere}
.invite-copy{align-self:stretch}
.ach-panel{flex:1 1 320px;min-width:0;padding:20px}
.ach-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 10px}
.ach-item{text-align:center}
.ach-item .sm{line-height:1.25}
.ach-hint{font-size:11px}

/* ---------- Assistance (pas de maquette : composants de mm.css) ---------- */
.support-wrap{gap:24px;align-items:flex-start}
.support-form{flex:1 1 420px;min-width:0;max-width:640px;padding:20px}
.support-list{flex:1 1 300px;min-width:0}
.support-body{min-height:140px;padding-top:12px;padding-bottom:12px;resize:vertical;font:inherit;line-height:1.45}
.support-ticket{max-width:720px}
.ticket-msgs{max-height:none;overflow:visible}
.ticket-msgs .bub{max-width:88%}
.ticket-when{opacity:.7}
.support-thread{flex:1 1 460px;min-width:0;max-width:760px}
.support-info{flex:0 1 280px;min-width:0;padding:18px}
.support-admin-link{max-width:640px}

@media (min-width:900px){.m-only{display:none!important}}

/* ---------- Fusion (moodlemaster-design/fusion.html ; animation dans fusion.css) ---------- */
.fusion-page{max-width:420px;margin:0 auto;gap:14px;text-align:center}
.fusion-text,.fusion-go{position:relative;width:100%}
.fusion-text .p{max-width:310px}
.fusion-cta{border-color:var(--gold);gap:14px;box-shadow:0 0 28px -14px var(--gold)}
.fusion-cta .big{font-size:28px;flex:none}
.slot:has(.fzb){margin-bottom:.9em}

/* ---------- Grand Quiz (pas de maquette : composants de mm.css) ---------- */
/* Accès au Grand Quiz : bandeau du Tirage (M12-Grand-Quiz-Acces), bandeau des Duels (M07-Duels-Accueil), point doré */
.quiz-evt{position:relative;overflow:hidden;display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:18px;background:radial-gradient(180px 120px at 12% 50%,#5a3f0c,transparent),#0c0a06;border:1px solid #b8770a;box-shadow:inset 0 0 0 1px rgba(255,229,138,.25),0 0 30px -12px #ffc94a;color:#eeedf8;text-align:left;flex-shrink:0}
.quiz-evt::after,.quiz-strip::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,229,138,.22) 45%,transparent 60%);background-size:200% 100%;animation:sweep 3.6s linear infinite;pointer-events:none}
.quiz-evt-crown{font-size:26px;color:#ffd36a;line-height:1;width:40px;text-align:center;flex:none}
.mm .quiz-evt-k{color:#ffd36a}
.quiz-evt-t{font-size:16px;line-height:1.2}
.quiz-evt-s{color:#c9c6e0}
.mm .quiz-evt-go{background:linear-gradient(180deg,#fff0a8,#e0a52a);color:#201400;border-color:transparent;flex:none}
.quiz-strip{position:relative;overflow:hidden;display:flex;align-items:center;gap:10px;min-height:46px;padding:6px 14px;border-radius:14px;background:radial-gradient(160px 80px at 8% 50%,#5a3f0c,transparent),#0c0a06;border:1px solid #b8770a;box-shadow:inset 0 0 0 1px rgba(255,229,138,.22),0 0 24px -12px #ffc94a;color:#eeedf8;font-size:14px;flex-shrink:0}
.quiz-strip-crown{font-size:20px;color:#ffd36a;line-height:1}
.quiz-strip-s{display:block;color:#c9c6e0}
.mm .quiz-strip-go{color:#ffd36a}
.tdot{position:absolute;top:4px;right:10px;width:10px;height:10px;border-radius:50%;background:#ffd36a;border:2px solid var(--bg2)}
.tab:has(.bdg:not([hidden])) .tdot{right:auto;left:10px}
.nav a .tdot{position:static;margin-left:8px;border:0}
.seg-dot{color:#ffd36a;margin-left:6px}
@media (prefers-reduced-motion:reduce){.quiz-evt::after,.quiz-strip::after{animation:none}}
.quiz-wrap{gap:32px;align-items:flex-start}
.quiz-main{flex:1 1 420px;min-width:0;max-width:640px}
.quiz-side{flex:1 1 300px;min-width:0}
.quiz-title{font-size:30px}
/* Félicitations au vainqueur de la carte Champion (M12-Grand-Quiz-Victoire) : plein écran */
@keyframes cfall{0%{transform:translateY(-40px) rotate(0);opacity:0}10%{opacity:1}100%{transform:translateY(900px) rotate(720deg);opacity:.9}}
@keyframes winpop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.04);opacity:1}100%{transform:scale(1)}}
.quiz-win{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:transparent;color:#eeedf8;overflow:hidden}
.quiz-win[open]{display:flex;flex-direction:column}
.quiz-win::backdrop{background:rgba(4,3,8,.6)}
.quiz-win-veil{position:absolute;inset:0;background:radial-gradient(360px 360px at 50% 40%,#4a3408,transparent),rgba(4,3,8,.94)}
.quiz-win-burst{position:absolute;width:820px;height:820px;left:50%;top:330px;margin:-410px 0 0 -410px;border-radius:50%;background:repeating-conic-gradient(rgba(255,229,138,.3) 0 6deg,transparent 6deg 15deg);animation:rays 20s linear infinite;-webkit-mask:radial-gradient(#000 16%,transparent 66%);mask:radial-gradient(#000 16%,transparent 66%)}
.quiz-cf{position:absolute;top:0;width:8px;height:14px;border-radius:2px;animation:cfall 4.2s linear infinite}
.quiz-win-pop{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:14px;width:100%;max-width:440px;margin:0 auto;padding:44px 20px calc(24px + env(safe-area-inset-bottom));text-align:center;overflow-y:auto;animation:winpop .6s cubic-bezier(.2,1.3,.4,1) both}
.quiz-win-pop>*{flex-shrink:0}
.mm .quiz-win-k,.mm .quiz-win-gold{color:#ffd36a}
.quiz-win-t{margin:0;font-size:38px;background-image:linear-gradient(90deg,#fff6c0,#ffd36a,#fff,#e0a52a,#fff6c0)}
.quiz-win-p{color:#c9c6e0;max-width:300px}
.quiz-win-soft{color:#ffe9a8}
.quiz-win-gain{width:100%;border-radius:16px;border:1px solid #b8770a;background:rgba(20,14,4,.8);padding:4px 14px}
.quiz-win-gain>div{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px}
.quiz-win-gain>div+div{border-top:1px solid rgba(255,229,138,.25)}
.mm .quiz-win-share{color:#eeedf8;border-color:#3a3526}
@media (prefers-reduced-motion:reduce){.quiz-cf,.quiz-win-burst,.quiz-win-pop{animation:none!important}}
/* Page du Grand Quiz (M12-Grand-Quiz) : la carte Champion en vitrine, gains, classement */
.quiz-main,.quiz-side{gap:14px}
.quiz-main>*,.quiz-side>*{flex-shrink:0}
.quiz-left{font-size:18px}
.mm .quiz-gold{color:var(--gold)}
.quiz-prize{position:relative;overflow:hidden;border-radius:20px;padding:20px 16px 18px;background:radial-gradient(260px 220px at 50% 34%,#5a3f0c,transparent),#0c0a06;border:1px solid #b8770a;box-shadow:inset 0 0 0 1px rgba(255,229,138,.25),0 0 40px -14px #ffc94a;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;color:#eeedf8}
.mm .quiz-prize .quiz-gold{color:#ffd36a}
.quiz-prize-t{font-size:20px;background-image:linear-gradient(90deg,#fff6c0,#ffd36a,#fff,#e0a52a,#fff6c0)}
.quiz-prize-p{color:#c9c6e0;max-width:300px}
.quiz-ex{--chip:linear-gradient(90deg,#fff6c0,#e0a52a)}
.quiz-score{border-color:var(--ac);box-shadow:inset 0 0 0 1px var(--ac)}
.quiz-place{--chip:var(--pn2);color:var(--tx)}
.quiz-prizes{padding:6px 14px}
.quiz-rw{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px}
.quiz-rw+.quiz-rw{border-top:1px solid var(--ln)}
.quiz-rk{width:26px;font-family:Unbounded,system-ui,sans-serif;font-weight:800;color:var(--mu);flex:none;text-align:center}
.rowi.quiz-top1{border-color:#b8770a;background:linear-gradient(90deg,rgba(255,211,106,.16),transparent 70%),var(--pn);box-shadow:inset 0 0 0 1px rgba(255,229,138,.35)}
.rowi.quiz-top1 .quiz-rk{color:var(--gold)}
.quiz-top1 .ava{border-color:#b8770a}
.quiz-all summary{list-style:none}
.quiz-all summary::-webkit-details-marker{display:none}
.quiz-all[open] summary{display:none}
.quiz-rules{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;color:var(--mu);font-size:14px}
.quiz-play{max-width:760px;margin:0 auto;width:100%}
.quiz-feedback{border-color:var(--ac)}
.trophy{width:1em;height:1em;display:block;flex:none}
.quiz-trophy{display:inline-flex;align-items:center;gap:2px;padding:4px;margin:-4px 0;border:0;border-radius:8px;background:none;color:var(--gold);font:inherit;font-size:20px;cursor:pointer;filter:drop-shadow(0 0 .25em rgba(255,211,106,.45));transition:transform .15s}
.quiz-trophy:hover{transform:scale(1.15) rotate(-6deg)}
.quiz-trophy-n{font-size:11px;font-weight:800}
.quiz-pop-trophy{font-size:84px;filter:drop-shadow(0 0 .3em rgba(255,211,106,.55));animation:lgfloat 4s ease-in-out infinite}
.trophy-pop{text-align:center;border-color:var(--gold)}
.quiz-hall-title{margin-top:20px}
.trophy-line{font-size:17px;line-height:1.4;margin:0}
.trophy-list{list-style:none;margin:0;padding:0;text-align:left}
@media (prefers-reduced-motion:reduce){.quiz-pop-trophy{animation:none}.quiz-trophy:hover{transform:none}}

/* ---------- Mobile : barre d'onglets en bas, comme les écrans M* ---------- */
@media (max-width:899px){
  .quiz-wrap{flex-direction:column;flex-wrap:nowrap;gap:20px;align-items:stretch}
  .quiz-main,.quiz-side{flex:none;max-width:none}
  .quiz-title{font-size:24px}
  .app{flex-direction:column;flex-wrap:nowrap;min-height:100dvh;background:radial-gradient(500px 300px at 80% -5%,var(--halo),transparent),var(--bg)}
  .side{display:none}
  .main{flex:1 0 auto;padding:16px 16px 20px;gap:16px}
  .app>.tabs{display:flex;position:sticky;bottom:0;z-index:20;padding-bottom:calc(14px + env(safe-area-inset-bottom))}
  .d-only{display:none!important}
  .prof-sub{font-size:13px}
  .pg-title{font-size:20px;line-height:1.15}
  .pg-solde{height:36px;font-size:12px;padding:0 12px}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .fav-row{font-size:7.3px;gap:14px}
  .album-count{font-size:13px}
  .album-track{height:10px}
  .album-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 14px;font-size:7.3px}
  .detail{flex:1 0 auto;flex-direction:column;flex-wrap:nowrap;gap:16px;padding-top:0}
  .detail-card{font-size:14px;align-self:center}
  .detail-info{flex:1 0 auto;width:100%;max-width:none}
  .detail-rows{padding:14px;font-size:13px}
  .detail-actions{margin-top:auto}
  .detail-title{font-size:20px;line-height:1.15}
  .detail-actions{flex-wrap:nowrap}
  .detail-actions .gr-m{flex:1;min-width:0;padding:0 12px}
  /* .mini-m : la variante mini de mm.css, appliquée seulement sur mobile (grilles M*) */
  .mini-m .name,.mini-m .meta,.mini-m .stats,.mini-m .rar i{display:none}
  .mini-m .code{font-size:1.5em}
  .mini-m .rar{font-size:1.3em}
  .mini-m .top{flex-direction:column;align-items:flex-start;gap:.3em}

  .pack-hero{flex-direction:column;flex-wrap:nowrap;justify-content:center;gap:20px;padding:0;flex:1 0 auto;text-align:center}
  .pack-lg{width:200px;height:290px}
  .pack-lg b{font-size:24px}
  .pack-text{display:contents;text-align:center}
  .pack-kicker{order:-1}
  .pack-title{font-size:20px;line-height:1.15}
  .pack-lede{font-size:15px;max-width:300px}
  .pack-cta{width:100%}
  .pack-cta .btn{display:flex;width:100%}
  .today-row{gap:14px 12px;font-size:6px}
  .wait-cta{flex-direction:column;margin-top:auto}
  .wait-cta .btn.blk{display:flex;width:100%}
  .reveal-count{font-size:12px;letter-spacing:.04em;color:var(--mu);text-transform:uppercase;font-weight:700}
  .reveal-body{flex:1 0 auto;flex-direction:column;flex-wrap:nowrap;align-items:center;gap:18px;padding:0}
  .reveal-side{flex:1 0 auto;width:100%;align-items:center;text-align:center;gap:18px}
  .reveal-rn{font-size:28px}
  .reveal-line{font-size:15px}
  .reveal-cta{margin-top:auto;width:100%}
  .blk-m{display:flex;width:100%}
  .list-cta{margin-top:auto}
  .duel-pick{grid-template-columns:repeat(3,minmax(0,1fr));font-size:6px}
  /* M07-Duels-Accueil : rails bord à bord, barre « Lancer » pleine largeur juste au-dessus des onglets */
  .duel-rail{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}
  .duel-cta{bottom:calc(66px + env(safe-area-inset-bottom));margin:4px -16px -20px;border-width:1px 0 0;border-radius:0}
  .app:has(.duel-cta)>.tabs{border-top:0}
  .faceoff-cta{max-width:none}
  .duel-quiz{gap:16px}
  .duel-score{align-items:center}
  .duel-board{flex-direction:column;flex-wrap:nowrap;gap:16px;flex:1 0 auto}
  .duel-center{flex:1 0 auto;width:100%}
  .duel-timer{font-size:28px;min-width:64px}
  .duel-track{height:10px}
  .duel-question{padding:18px}
  .duel-prompt{font-size:20px}
  .duel-answers{grid-template-columns:1fr;gap:8px}
  .duel-validate{margin-top:auto}
  .duel-burst{top:300px;width:700px;height:700px;margin:-350px 0 0 -350px}
  .duel-result{flex-direction:column;flex-wrap:nowrap;align-items:center;gap:14px;padding:0;text-align:center}
  .duel-result-card{font-size:10px;order:1}
  .duel-result-text{display:contents}
  .duel-result-title{font-size:44px}
  .duel-result-score{font-size:28px}
  .duel-result-line{font-size:15px}
  .duel-result-text>.pan{order:2;width:100%;text-align:left}
  .duel-result-text>.ro.wr{order:3;width:100%;flex-direction:column}
  .duel-result-text>.ro.wr .btn,.duel-result-text>.ro.wr form{width:100%;display:flex}
  .duel-result-text>.duel-recap{order:4;width:100%;text-align:left}
  .auction-panel{background:none;border:0;padding:0;flex:none;width:100%}
  .auction-card{font-size:10px}
  .market-seg{flex:1;width:auto}
  .rank-seg{width:auto}
  .trade-title{font-size:16px}
  .ava.trade-ava{width:36px;height:36px;font-size:11px;border-width:1px}
  .trade-hd{flex-wrap:nowrap;align-items:flex-start}
  .trade-hd>.ro{flex:1;min-width:0}
  .trade-x{min-height:32px;padding:0 8px;font-size:11px}
  .trade-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"mine theirs" "nego nego";gap:12px}
  .trade-side{padding:12px}
  .trade-cards{gap:12px 8px;font-size:5px}
  .trade-msgs{max-height:none}
  .narrow{padding:28px 20px}
  .landing{padding:28px 20px;gap:20px;min-height:100dvh}
  .landing-top-btn,.landing-kicker,.landing-panels{display:none!important}
  .landing-top .logo{font-size:18px!important}
  .landing-hero{flex:1;flex-direction:column;flex-wrap:nowrap;gap:20px!important}
  .landing-fan{order:-1;flex:none!important;width:100%;height:290px}
  .landing-text{flex:1!important;gap:20px}
  .landing-title{font-size:30px}
  .landing-lede{font-size:15px}
  .landing-cta{margin-top:auto}
  .landing-cta .btn{display:flex;width:100%}
  .fan-l{font-size:9px;left:6px;top:56px}
  .fan-r{font-size:9px;right:6px;top:56px}
  .fan-c{font-size:12px;margin-left:-90px;top:8px}
  .m-hide{display:none!important}
  .social{flex:1 0 auto;gap:12px}
  .social-top{display:flex;flex-direction:column;gap:16px}
  .social-grid{display:flex;flex-direction:column;align-items:stretch;flex:1 0 auto}
  .social-panel{background:none;border:0;padding:0;gap:12px;flex:1 0 auto}
  .msg-list{flex:1 0 auto}
  .msg-list .rowi.me.m-plain{border-color:var(--ln);box-shadow:none}
  .chat-msgs{max-height:none;overflow:visible}
  .bub-del{right:auto;left:-32px}
  .bub:not(.me) .bub-del{left:auto;right:-32px}
  .social-conv-mode .social-top,.social-conv-mode .msg-list{display:none}
  .conv{flex:1 0 auto;gap:10px}
  .conv-hd{margin:-16px -16px 4px;padding:16px 16px 10px;border-bottom:1px solid var(--ln);flex-wrap:nowrap}
  .conv-msgs{flex:1 0 auto;gap:10px}
  .conv-form{position:sticky;bottom:0;background:var(--bg);padding:8px 0 calc(8px + env(safe-area-inset-bottom));margin-bottom:-20px}
  .rank-wrap{flex-direction:column;flex-wrap:nowrap;gap:12px;align-items:stretch}
  .rank-players{flex:none;gap:12px}
  .podium{gap:8px;max-width:none}
  .podium-step.p1{height:92px!important}
  .podium-step.p2{height:64px!important}
  .podium-step.p3{height:48px!important}
  .podium .big{font-size:20px!important}
  .podium .p1 .big{font-size:26px!important}
  .podium .p3 .big{font-size:18px!important}
  .podium-step:not(.p1) .num{display:none}
  .podium .b{font-size:13px}
  .ach-panel{flex:none;background:none;border:0;padding:0;gap:12px}
  .ach-title{font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--mu);text-transform:uppercase}
  .podium .ava.lg{width:52px;height:52px;font-size:14px}
  .ach-grid{gap:12px 8px}
  .support-wrap{flex-direction:column;flex-wrap:nowrap;align-items:stretch}
  .support-form{flex:none;max-width:none;background:none;border:0;padding:0}
  .support-list,.support-thread,.support-info{flex:none}
}