/* ==================================================================
   RISE TCG COMPAGNON : styles de l'application
   Palette et typographies reprises de riseswiss.ch (site.css)
   ================================================================== */
:root{
  --ink:#0C0809; --void:#170F11; --panel:#201417; --panel-2:#2C1B1D;
  --line:rgba(237,209,185,.15);
  --copper:#A76953; --copper-dk:#884934; --copper-lt:#EDD1B9;
  --ember:#C4442A; --ether:#2FBFB6; --paper:#F2EAE6; --muted:#A2908C;
  --passif:#2E8FC4; --actif:#C4442A; --phase:#4BAE6E; --faq:#8B5CF6;
  --display:'Big Shoulders Display',system-ui,-apple-system,sans-serif;
  --body:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,monospace;
  --safe-t:env(safe-area-inset-top,0px);
  --safe-b:env(safe-area-inset-bottom,0px);
  --maxw:760px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:var(--ink);color:var(--paper);font-family:var(--body);min-height:100dvh;-webkit-tap-highlight-color:transparent}
a{color:var(--copper-lt);text-decoration:none}
img{max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

#app{display:flex;flex-direction:column;min-height:100dvh}

/* ---------- entete ---------- */
.ahdr{position:sticky;top:0;z-index:20;
  padding:calc(10px + var(--safe-t)) 18px 10px;background:rgba(12,8,9,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.ahdr__in{width:100%;max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center}
.brandlogo{height:26px;width:auto;display:block}
.hdrright{display:flex;flex-direction:row;align-items:center;gap:8px;flex:none}
.sitebtn{display:flex;align-items:center;justify-content:center;width:32px;height:30px;border:1px solid var(--line);border-radius:8px;color:var(--muted)}
.sitebtn:active{color:var(--copper-lt);border-color:var(--copper)}
.langs{display:flex;gap:5px}
.lang{font-family:var(--mono);font-size:11px;padding:5px 8px;border-radius:6px;border:1px solid var(--line);color:var(--muted)}
.lang[aria-current="true"]{background:var(--copper);border-color:var(--copper);color:#fff}

/* ---------- vue ---------- */
.view{flex:1;width:100%;max-width:var(--maxw);margin:0 auto;padding:16px 18px calc(86px + var(--safe-b))}
.secttl{font-family:var(--display);font-weight:700;font-size:17px;text-transform:uppercase;letter-spacing:.8px;margin:20px 0 10px;color:var(--copper-lt)}
.crumb{font-family:var(--mono);font-size:11px;color:var(--muted);margin:2px 0 10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.crumb a{color:var(--copper)}
.pgttl{font-family:var(--display);font-weight:800;font-size:clamp(24px,6vw,32px);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}
.lede{color:var(--muted);font-size:13.5px;line-height:1.6;margin-bottom:14px}

/* ---------- recherche ---------- */
.search{display:flex;align-items:center;gap:9px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:4px 6px 4px 13px}
.search svg{flex:none;color:var(--muted)}
.search input{flex:1;background:none;border:0;outline:0;color:var(--paper);font:inherit;font-size:15px;padding:9px 0;min-width:0}
.search input::placeholder{color:var(--muted)}
.search:focus-within{border-color:var(--copper)}
.micbtn{flex:none;width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.micbtn.listening{color:#fff;background:var(--ember);animation:pulse 1.2s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(196,68,42,.5)}50%{box-shadow:0 0 0 8px rgba(196,68,42,0)}}
.michint{font-size:11.5px;color:var(--muted);margin-top:7px;line-height:1.5}
.rescount{font-family:var(--mono);font-size:11px;color:var(--muted);margin:14px 0 10px}
.res{display:block;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:10px}
.res:active{background:var(--panel-2)}
.res .where{font-family:var(--mono);font-size:9.5px;color:var(--copper);text-transform:uppercase;letter-spacing:.8px}
.res .where.faq{color:#B9A0F5}
.res .where.charte{color:#7CC1E8}
.res b{display:block;font-size:14px;margin:4px 0 3px;color:var(--paper)}
.res p{font-size:12.5px;color:var(--muted);line-height:1.5}
mark{background:rgba(167,105,83,.35);color:var(--copper-lt);border-radius:3px;padding:0 2px}
.noresult{color:var(--muted);font-size:13.5px;line-height:1.6;margin-top:16px}

/* ---------- accueil ---------- */
.bigcard{display:block;margin-top:14px;background:linear-gradient(145deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:16px;padding:16px;position:relative;overflow:hidden;color:var(--paper)}
.bigcard::after{content:'';position:absolute;inset:0;background:radial-gradient(420px 140px at 110% -20%,rgba(167,105,83,.22),transparent);pointer-events:none}
.bigcard h3{font-family:var(--display);font-weight:700;font-size:20px;text-transform:uppercase;letter-spacing:.6px}
.bigcard p{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.5;max-width:85%}
.bigcard .cnt{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:11px;color:var(--copper-lt);background:rgba(167,105,83,.18);border:1px solid rgba(167,105,83,.4);padding:3px 8px;border-radius:20px}
.bigcard .cnt.violet{color:#B9A0F5;background:rgba(139,92,246,.14);border-color:rgba(139,92,246,.4)}
.bigcard .cnt.bleu{color:#7CC1E8;background:rgba(46,143,196,.14);border-color:rgba(46,143,196,.4)}
.chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:4px}
.chip{font-size:12.5px;padding:7px 12px;border-radius:20px;border:1px solid var(--line);background:var(--panel);color:var(--copper-lt)}
.offline{display:flex;align-items:center;gap:8px;margin-top:18px;font-size:11.5px;color:var(--muted);font-family:var(--mono)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--phase);box-shadow:0 0 8px var(--phase);flex:none}
.dot.off{background:var(--muted);box-shadow:none}
.swissref{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted);line-height:1.7}
.swissref a{color:var(--copper)}

/* ---------- listes de chapitres ---------- */
.chap{display:flex;align-items:center;gap:12px;padding:13px 4px;border-bottom:1px solid var(--line);color:var(--paper)}
.chap .n{font-family:var(--mono);font-size:11px;color:var(--copper);width:24px;flex:none}
.chap .t{font-size:14.5px;font-weight:600;flex:1}
.chap .ar{color:var(--muted);flex:none}

/* ---------- blocs de regles ---------- */
.rp{font-size:14px;line-height:1.65;margin:10px 0}
.rh{font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:.6px;text-transform:uppercase;color:var(--copper-lt);margin:18px 0 5px}
.callout{border-left:3px solid var(--ether);background:rgba(47,191,182,.08);padding:11px 13px;border-radius:0 10px 10px 0;font-size:13px;line-height:1.6;margin:12px 0}
.callout.warn{border-color:var(--ember);background:rgba(196,68,42,.09)}
.rlist{margin:10px 0 10px 4px;list-style:none}
.rlist li{position:relative;padding-left:18px;font-size:13.5px;line-height:1.6;margin:7px 0}
.rlist li::before{content:'';position:absolute;left:0;top:9px;width:7px;height:7px;border-radius:2px;background:var(--copper);transform:rotate(45deg)}
.step{display:flex;gap:12px;margin:12px 0}
.step .sn{flex:none;width:26px;height:26px;border-radius:50%;background:rgba(75,174,110,.15);border:1px solid var(--phase);color:var(--phase);font-family:var(--mono);font-size:12px;display:flex;align-items:center;justify-content:center;margin-top:1px}
.step .st b{display:block;font-size:14px;margin-bottom:2px}
.step .st p{font-size:13px;color:var(--muted);line-height:1.55}
.apt{display:flex;gap:12px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;margin:10px 0}
.apt img{width:44px;height:44px;flex:none;border-radius:8px}
.apt b{font-size:14px}
.apt .tag{display:inline-block;font-family:var(--mono);font-size:9.5px;padding:2px 7px;border-radius:10px;margin-left:7px;vertical-align:1px;white-space:nowrap}
.tag.pas{background:rgba(46,143,196,.16);border:1px solid var(--passif);color:#7CC1E8}
.tag.act{background:rgba(196,68,42,.16);border:1px solid var(--actif);color:#E8917C}
.apt p{font-size:12.5px;color:var(--muted);line-height:1.55;margin-top:3px}
.prevnext{display:flex;justify-content:space-between;gap:10px;margin-top:26px}
.prevnext a{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:11px 13px;font-size:12.5px;color:var(--copper-lt)}
.prevnext a.next{text-align:right}
.prevnext a span{display:block;font-family:var(--mono);font-size:9.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.8px;margin-bottom:3px}

/* ---------- FAQ ---------- */
.fchips{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 14px}
.fchip{font-size:12px;padding:6px 12px;border-radius:20px;border:1px solid var(--line);color:var(--muted)}
.fchip[aria-pressed="true"]{background:var(--copper);border-color:var(--copper);color:#fff}
.qa{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;overflow:hidden;background:var(--panel)}
.qa .q{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 14px;font-size:14px;font-weight:700;width:100%;text-align:left}
.qa .plus{color:var(--copper);font-family:var(--mono);flex:none;font-size:15px}
.qa .a{display:none;padding:12px 14px;font-size:13px;color:var(--muted);line-height:1.65;border-top:1px solid var(--line)}
.qa[data-open="1"] .a{display:block}
.qa .src{font-family:var(--mono);font-size:9.5px;color:var(--copper);margin-top:9px;text-transform:uppercase;letter-spacing:.6px}
.notice{border-left:3px solid var(--copper);background:rgba(167,105,83,.1);padding:10px 13px;border-radius:0 10px 10px 0;font-size:12.5px;color:var(--muted);line-height:1.55;margin:12px 0}

/* ---------- segments (arbitrage / charte) ---------- */
.segbar{display:flex;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:4px;margin-bottom:14px}
.seg{flex:1;font-size:13px;font-weight:700;padding:9px 6px;border-radius:9px;text-align:center;color:var(--muted)}
.seg[aria-current="true"]{background:var(--copper);color:#fff}

/* ---------- a propos ---------- */
.about p{font-size:13px;color:var(--muted);line-height:1.7;margin:10px 0}
.about b{color:var(--paper)}
.verline{font-family:var(--mono);font-size:11px;color:var(--copper-lt);margin-top:14px}
.doclink{display:block;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:10px 0;font-size:13.5px;color:var(--copper-lt)}

/* ---------- barre d'onglets ---------- */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;justify-content:center;gap:0;
  border-top:1px solid var(--line);background:rgba(23,15,17,.96);backdrop-filter:blur(10px);
  padding:8px 6px calc(10px + var(--safe-b))}
.tab{flex:1;max-width:190px;text-align:center;font-size:10.5px;color:var(--muted);display:flex;flex-direction:column;gap:4px;align-items:center;padding:2px 0}
.tab svg{opacity:.75}
.tab[aria-current="true"]{color:var(--copper-lt)}
.tab[aria-current="true"] svg{opacity:1;filter:drop-shadow(0 0 6px rgba(167,105,83,.8))}

/* ---------- accessibilite ---------- */
:focus-visible{outline:2px solid var(--copper);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
}
@media (min-width:700px){
  .view{padding-top:24px}
}

/* ---------- CTA boutique ---------- */
.shopcta{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:16px;min-height:48px;
  background:linear-gradient(100deg,var(--copper-lt),var(--copper) 55%,var(--copper-dk));
  color:#2A1108;font-weight:800;font-size:14.5px;padding:13px 18px;border-radius:12px;
  box-shadow:0 8px 26px -12px rgba(167,105,83,.95)}
.shopcta svg{flex:none}

.res--shop{border-color:rgba(167,105,83,.5);background:linear-gradient(145deg,var(--panel-2),var(--panel))}
.res .where.shop{color:var(--copper-lt)}
.view > .shopcta{margin-top:26px}

.chap--ref .n{color:var(--ether);font-size:13px}
.chip--ref{border-color:rgba(47,191,182,.4);color:var(--ether)}
.res .where.ref{color:#7FD8D2}

.res--ref{border-color:rgba(47,191,182,.45)}
.res--ref p{color:var(--paper)}
.ressrc{display:block;font-family:var(--mono);font-size:9.5px;color:var(--ether);margin-top:8px;text-transform:uppercase;letter-spacing:.6px}

/* ---------------- v1.4.0 : galerie des pictogrammes ---------------- */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:8px;margin:10px 0}
.ptile{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--panel);
  border:1px solid var(--line);border-radius:12px;padding:10px 4px 8px;color:var(--paper);cursor:pointer}
.ptile img{width:40px;height:40px;border-radius:8px}
.ptile span{font-size:10.5px;line-height:1.25;text-align:center;color:var(--copper-lt);
  overflow-wrap:break-word;max-width:100%}
.ptile[aria-pressed="true"]{border-color:var(--copper);background:var(--panel-2);
  box-shadow:0 0 0 1px var(--copper)}
.pdetail{display:flex;gap:12px;align-items:flex-start;background:var(--panel-2);
  border:1px solid var(--copper);border-radius:12px;padding:12px;margin:2px 0 14px}
.pdetail img{width:44px;height:44px;flex:none;border-radius:8px}
.pdetail b{font-size:14px}
.pdetail p{font-size:12.5px;color:var(--muted);line-height:1.55;margin:3px 0 6px}
.pdetail a{font-family:var(--mono);font-size:11px;color:var(--ether)}
.chip--picto{border-color:rgba(167,105,83,.55);color:var(--copper-lt);background:rgba(167,105,83,.14)}

/* ---------------- v1.4.0 : cartes dans la recherche ---------------- */
.res--card{cursor:default}
.res .where.card{color:#E8B86F}
.noplaytag{display:inline-block;font-family:var(--mono);font-size:9.5px;color:#E8B86F;
  border:1px solid rgba(232,184,111,.45);border-radius:10px;padding:2px 7px;margin-left:4px;
  vertical-align:1px;white-space:nowrap}

/* ---------------- v1.4.0 : controle du cache hors-ligne ---------------- */
.offcheck{margin:14px 0}
.offbtn{display:block;width:100%;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;padding:12px 14px;font-size:13.5px;color:var(--copper-lt);cursor:pointer;
  font-family:var(--body)}
.offbtn--fix{margin-top:8px;border-color:rgba(232,184,111,.45);color:#E8B86F}
.offstatus{font-family:var(--mono);font-size:11.5px;color:var(--muted);margin:8px 2px 0;line-height:1.6}
.offstatus.ok{color:var(--phase)}
.offstatus.warn{color:#E8B86F}
.dot.warn{background:#E8B86F;box-shadow:0 0 8px rgba(232,184,111,.7)}

/* ---- fiche carte (v1.5.0) ---- */
.cardttl{text-transform:none;letter-spacing:0}
.cardfr{margin-top:-4px}
.cardsheet{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.cs-row{display:flex;gap:10px;align-items:flex-start;padding:7px 0;border-bottom:1px solid var(--line)}
.cs-row:last-of-type{border-bottom:0}
.cs-k{flex:0 0 34%;font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.7px;color:var(--copper);padding-top:3px}
.cs-v{flex:1;font-size:13px;color:var(--paper);display:flex;flex-wrap:wrap;gap:5px}
.chip{display:inline-block;font-size:11.5px;line-height:1;padding:5px 8px;border-radius:999px;border:1px solid var(--line);background:var(--panel-2);color:var(--paper)}
.chip--ok{border-color:rgba(126,200,140,.6);background:rgba(126,200,140,.14);color:#9FE0AE}
.chip--ban{border-color:rgba(226,107,107,.6);background:rgba(226,107,107,.14);color:#F0A3A3}
.chip--tbc{border-color:rgba(230,180,90,.6);background:rgba(230,180,90,.14);color:#F2CB86}
.notice--warn{border-left-color:#E6B45A;background:rgba(230,180,90,.1)}
.cardsheet .rh{margin:12px 0 6px}
.settab{width:100%;border-collapse:collapse;font-size:12.5px;margin-bottom:4px}
.settab th,.settab td{text-align:left;vertical-align:top;padding:7px 6px 7px 0;border-bottom:1px solid var(--line)}
.settab thead th{font-family:var(--mono);font-size:9.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);font-weight:400}
.settab tbody th{font-weight:600;color:var(--paper)}
.settab .num{font-family:var(--mono);white-space:nowrap}
.settab .meta{font-family:var(--mono);font-size:11px;color:var(--muted);white-space:nowrap}
.setcode{display:block;font-family:var(--mono);font-size:9.5px;color:var(--muted);letter-spacing:.5px;margin-top:2px}
.cs-nodata{font-size:12px;color:var(--muted);margin:12px 0 4px;font-style:italic}
.cardsheet .src{font-family:var(--mono);font-size:9.5px;color:var(--copper);margin-top:8px;line-height:1.5}
@media (max-width:420px){.settab .meta{display:none}.settab thead th:last-child{display:none}}