/*
    Charte graphique claire — Top 10 Geek
    Parti pris : fond blanc impératif. On garde l'énergie "geek/BD" de la
    mascotte mais on la transpose dans un langage éditorial de fiche technique
    (papier ivoire, encre fine, une seule couleur flash) plutôt que le comic-punk
    sur fond sombre de la V1. Choix assumé de rester mono-thème (clair) : pas de
    bascule sombre, le fond blanc est une contrainte du brief, pas un défaut.
  */
  :root{
    --bg:#FFFFFF;                 /* fond — blanc impératif */
    --paper:#F7F6F1;              /* surface carte — ivoire chaud */
    --paper-alt:#EFECE3;          /* surface carte secondaire / en-têtes */
    --ink:#15171C;                /* texte principal */
    --ink-muted:#5A5E6B;
    --ink-faint:#9297A3;
    --line:#15171C;               /* traits fins "encre" */
    --line-soft:#E3E0D6;
    --accent:#FF3B57;             /* flash unique — CTA, liens actifs */
    --accent-ink:#FFFFFF;
    --highlight:#FFC93D;          /* jaune signal — usage très ponctuel */
    --cat-bureau:#1D5FD6;
    --cat-creation:#C2410C;
    --cat-gaming:#1F9E6E;
    --cat-poly:#9A2E7A;
    --cat-lowcost:#B78900;
    color-scheme: light;
  }

  *{box-sizing:border-box;}
  body{background:var(--bg);color:var(--ink);font-family:"Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;-webkit-font-smoothing:antialiased;padding-inline:20px;}
  @media (prefers-reduced-motion: reduce){ *{animation:none !important; transition:none !important;} }

  a{color:inherit;}
  .wrap{max-width:1160px;margin-inline:auto;}
  .mono{font-family:"IBM Plex Mono", ui-monospace, monospace;}
  h1,h2,h3{font-family:"Bricolage Grotesque","Plus Jakarta Sans",sans-serif;font-weight:800;letter-spacing:-0.01em;text-wrap:balance;margin:0;line-height:1.04;}
  .eyebrow-label{font-family:"IBM Plex Mono",monospace;font-size:0.68rem;font-weight:600;letter-spacing:0.07em;text-transform:uppercase;}

  /* ---------- Top bar ---------- */
  .topbar{display:flex;align-items:center;justify-content:space-between;padding-block:22px;border-bottom:1.5px solid var(--line);position:relative;gap:12px;}
  .brand-lockup{display:flex;align-items:center;gap:11px;}
  .brand-mark{width:40px;height:40px;border-radius:10px;border:1.5px solid var(--line);background:var(--paper);object-fit:cover;object-position:top;flex:none;}
  .brand-text{display:flex;flex-direction:column;line-height:1;}
  .brand{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:1.32rem;letter-spacing:-0.01em;}
  .brand .dot{color:var(--accent);}
  .baseline{font-family:"IBM Plex Mono",monospace;font-size:0.6rem;letter-spacing:0.03em;color:var(--ink-faint);text-transform:uppercase;margin-top:4px;}
  .topnav{display:flex;gap:24px;font-size:0.85rem;font-weight:600;}
  .topnav a{text-decoration:none;color:var(--ink-muted);border-bottom:2px solid transparent;padding-bottom:3px;}
  .topnav a:hover{color:var(--ink);border-color:var(--accent);}
  .topbar-actions{display:flex;align-items:center;gap:10px;}
  .topnav-toggle{display:none;background:var(--paper);border:1.5px solid var(--line-soft);color:var(--ink);padding:7px 14px;border-radius:20px;font-size:0.8rem;font-family:inherit;font-weight:700;}
  @media (max-width:680px){
    .topnav{display:none;}
    .topnav.open{display:flex;flex-direction:column;gap:16px;position:absolute;left:0;right:0;top:66px;background:var(--bg);border:1.5px solid var(--line);border-radius:14px;padding:20px;z-index:10;box-shadow:0 10px 30px rgba(21,23,28,0.1);}
    .topnav-toggle{display:inline-block;}
  }

  /* ---------- Intro ---------- */
  .intro{padding-block:60px 44px;border-bottom:1.5px solid var(--line);}
  .intro-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:center;}
  @media (max-width:820px){ .intro-grid{grid-template-columns:1fr;} }
  .eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:"IBM Plex Mono",monospace;font-size:0.7rem;font-weight:600;letter-spacing:0.06em;color:var(--ink);background:var(--highlight);padding:5px 12px;border-radius:20px;margin-bottom:20px;}
  .intro h1{font-size:clamp(2.15rem, 4.4vw, 3.5rem);max-width:17ch;color:var(--ink);}
  .intro h1 .flash{color:var(--accent);}
  .intro p{color:var(--ink-muted);font-size:1.06rem;line-height:1.65;max-width:54ch;margin-top:20px;font-weight:500;}

  .spec-row{display:flex;margin-top:28px;flex-wrap:wrap;border-top:1.5px solid var(--line);border-bottom:1.5px solid var(--line);width:fit-content;}
  .spec-row div{font-size:0.78rem;color:var(--ink-muted);padding:12px 20px 12px 0;border-right:1px dashed var(--line-soft);margin-right:20px;}
  .spec-row div:last-child{border-right:none;margin-right:0;padding-right:0;}
  .spec-row strong{display:block;font-family:"IBM Plex Mono",monospace;font-weight:700;font-size:1.15rem;color:var(--ink);font-variant-numeric:tabular-nums;}

  .hero-visual{position:relative;width:100%;aspect-ratio:1/0.9;overflow:hidden;background:var(--bg);}
  @media (max-width:820px){ .hero-visual{max-width:340px;margin-inline:auto;} }
  .hero-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:bottom;display:block;padding:18px;}
  .hero-visual .hv-cap{position:absolute;top:14px;left:14px;font-family:"IBM Plex Mono",monospace;font-size:0.6rem;letter-spacing:0.04em;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:20px;padding:4px 11px;z-index:2;}

  /* ---------- Comparator ---------- */
  .comparator{padding-block:56px;border-bottom:1.5px solid var(--line);}
  .comparator-head{display:flex;align-items:flex-start;gap:24px;justify-content:space-between;flex-wrap:wrap;}
  .comparator-head h2{font-size:1.95rem;}
  .comparator-sub{color:var(--ink-muted);max-width:60ch;line-height:1.62;margin-top:10px;font-size:0.97rem;}
  .comparator-pose{width:88px;height:88px;object-fit:contain;flex:none;}
  @media (max-width:640px){ .comparator-pose{width:60px;height:60px;} }

  .usage-filter{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px;}
  .pill{display:inline-flex;align-items:center;gap:7px;font-family:"Plus Jakarta Sans",sans-serif;font-size:0.82rem;font-weight:700;color:var(--ink);background:#fff;border:1.5px solid var(--line-soft);border-radius:20px;padding:8px 15px;cursor:pointer;transition:border-color .15s ease, background .15s ease, color .15s ease;}
  .pill:hover{border-color:var(--ink);}
  .pill .pdot{width:9px;height:9px;border-radius:50%;flex:none;background:var(--ink-faint);}
  .pill[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink);}
  .pill[aria-pressed="true"] .pdot{background:#fff;}
  .pill[aria-pressed="true"].f-bureau{background:var(--cat-bureau);border-color:var(--cat-bureau);}
  .pill[aria-pressed="true"].f-creation{background:var(--cat-creation);border-color:var(--cat-creation);}
  .pill[aria-pressed="true"].f-gaming{background:var(--cat-gaming);border-color:var(--cat-gaming);}
  .pill[aria-pressed="true"].f-polyvalent{background:var(--cat-poly);border-color:var(--cat-poly);}
  .pill[aria-pressed="true"].f-lowcost{background:var(--cat-lowcost);border-color:var(--cat-lowcost);}
  .bubble.dimmed{opacity:0.08;pointer-events:none;}
  table.data-table tbody tr.row-hidden{display:none;}

  .comparator-grid{display:grid;grid-template-columns:360px 1fr;gap:22px;margin-top:30px;align-items:stretch;}
  @media (max-width:900px){ .comparator-grid{grid-template-columns:1fr;} }

  .chart-col{display:flex;flex-direction:column;border:1.5px solid var(--line);border-radius:16px;background:var(--paper);overflow:hidden;}
  .chart-pane{padding:20px 16px 6px;}
  .chart-pane svg{width:100%;height:auto;overflow:visible;display:block;}
  .axis-label{font-family:"IBM Plex Mono",monospace;font-size:8.5px;fill:var(--ink-muted);}
  .grid-line{stroke:rgba(21,23,28,0.09);stroke-width:1;}
  .axis-line{stroke:var(--ink);stroke-width:1.2;}
  .bubble{stroke:#fff;stroke-width:2;cursor:pointer;transition:opacity .15s ease, stroke-width .15s ease;}
  .bubble:hover{opacity:0.82;}
  .bubble:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
  .bubble.selected{stroke:var(--ink);stroke-width:2.5;}

  .legend-strip{border-top:1.5px solid var(--line);padding:16px 18px 20px;display:flex;flex-direction:column;gap:14px;flex:1;justify-content:space-between;}
  .legend-title{font-family:"IBM Plex Mono",monospace;font-size:0.62rem;font-weight:700;letter-spacing:0.05em;color:var(--ink-muted);margin-bottom:8px;text-transform:uppercase;}
  .legend-cats{display:flex;flex-wrap:wrap;gap:10px 16px;}
  .legend-cat{display:flex;align-items:center;gap:8px;font-size:0.83rem;color:var(--ink);font-weight:600;}
  .dot{width:10px;height:10px;border-radius:50%;flex:none;}
  .dot.bureau{background:var(--cat-bureau);}
  .dot.creation{background:var(--cat-creation);}
  .dot.gaming{background:var(--cat-gaming);}
  .dot.polyvalent{background:var(--cat-poly);}
  .dot.lowcost{background:var(--cat-lowcost);}
  .legend-size{display:flex;align-items:center;gap:16px;}
  .legend-size .ex{display:flex;flex-direction:column;align-items:center;gap:4px;font-family:"IBM Plex Mono",monospace;font-size:0.68rem;color:var(--ink-muted);}
  .legend-note{font-size:0.79rem;color:var(--ink-muted);line-height:1.5;}

  /* ---------- Detail card ---------- */
  .detail-col{display:flex;flex-direction:column;}
  .featured{display:grid;grid-template-columns:1fr;border:1.5px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;flex:1;}
  .cat-label-inline{font-family:"IBM Plex Mono",monospace;font-size:0.66rem;font-weight:700;letter-spacing:0.06em;color:var(--ink-muted);margin-bottom:9px;text-transform:uppercase;}

  .art{position:relative;min-height:150px;overflow:hidden;background:var(--paper);display:flex;align-items:center;justify-content:center;border-bottom:1.5px solid var(--line);}
  .art-generic{position:relative;z-index:1;width:132px;height:auto;}
  .art-generic .ag-screen, .art-generic .ag-dot{fill:var(--ink-faint);transition:fill .15s ease;}
  .art.cat-bureau .ag-screen, .art.cat-bureau .ag-dot{fill:var(--cat-bureau);}
  .art.cat-creation .ag-screen, .art.cat-creation .ag-dot{fill:var(--cat-creation);}
  .art.cat-gaming .ag-screen, .art.cat-gaming .ag-dot{fill:var(--cat-gaming);}
  .art.cat-polyvalent .ag-screen, .art.cat-polyvalent .ag-dot{fill:var(--cat-poly);}
  .art.cat-lowcost .ag-screen, .art.cat-lowcost .ag-dot{fill:var(--cat-lowcost);}
  .art-tag{position:absolute;bottom:12px;left:12px;font-family:"IBM Plex Mono",monospace;font-size:0.58rem;letter-spacing:0.03em;color:var(--ink-muted);background:#fff;border:1.5px solid var(--line);border-radius:20px;padding:4px 10px;z-index:2;text-transform:uppercase;}

  .featured-body{display:flex;flex-direction:column;padding:22px 24px;min-width:0;}
  .fbadge{display:inline-flex;align-items:center;gap:6px;font-family:"IBM Plex Mono",sans-serif;font-size:0.62rem;font-weight:700;letter-spacing:0.03em;color:#fff;background:var(--accent);border-radius:20px;padding:5px 12px;width:fit-content;margin-bottom:14px;text-transform:uppercase;}
  .fbadge.alt{color:var(--ink);background:var(--paper-alt);}
  .featured-title{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;}
  .featured-title h3{font-size:1.42rem;}
  .featured-title .score{font-family:"IBM Plex Mono",monospace;font-size:1.4rem;font-weight:700;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums;background:var(--paper-alt);border-radius:10px;padding:3px 10px;}
  .featured-title .score span{color:var(--ink-muted);font-size:0.82rem;font-weight:500;}

  .verdict-bubble{position:relative;background:var(--paper);border:1.5px solid var(--line-soft);border-radius:12px;padding:14px 16px;margin-top:14px;font-size:0.92rem;line-height:1.55;}

  .strengths{display:flex;flex-direction:column;gap:9px;margin-top:20px;padding-top:16px;border-top:1px dashed var(--line-soft);}
  .strengths .s{font-size:0.85rem;color:var(--ink);font-weight:600;display:flex;align-items:baseline;gap:8px;}
  .strengths .s::before{content:"—";color:var(--accent);font-weight:700;}
  .featured-footer{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:18px;gap:12px;flex-wrap:wrap;}
  .price-tag{display:inline-block;font-family:"IBM Plex Mono",monospace;font-weight:700;font-size:1.05rem;color:var(--ink);}
  .price-from{display:block;font-size:0.68rem;color:var(--ink-faint);font-family:"Plus Jakarta Sans",sans-serif;margin-top:4px;font-weight:500;}
  .cta{font-family:"Plus Jakarta Sans",sans-serif;font-size:0.85rem;font-weight:700;text-decoration:none;background:var(--ink);color:#fff;padding:11px 20px;border-radius:24px;transition:background .15s ease, transform .1s ease;display:inline-block;}
  .cta:hover{background:var(--accent);transform:translateY(-1px);}
  .cta:active{transform:translateY(0);}

  /* ---------- Data table ---------- */
  .data-table-wrap{overflow-x:auto;margin-top:26px;border:1.5px solid var(--line);border-radius:16px;background:#fff;}
  table.data-table{width:100%;border-collapse:collapse;font-size:0.85rem;min-width:600px;}
  table.data-table th{text-align:left;font-family:"IBM Plex Mono",monospace;font-size:0.65rem;font-weight:700;letter-spacing:0.04em;color:var(--ink-muted);background:var(--paper-alt);padding:12px 18px;text-transform:uppercase;}
  table.data-table th[data-sort]{cursor:pointer;user-select:none;white-space:nowrap;}
  table.data-table th[data-sort]:hover{color:var(--ink);}
  table.data-table th .sort-arrow{display:inline-block;margin-left:4px;opacity:0.35;font-size:0.6rem;}
  table.data-table th[aria-sort="ascending"] .sort-arrow, table.data-table th[aria-sort="descending"] .sort-arrow{opacity:1;color:var(--accent);}
  .table-note{font-size:0.79rem;color:var(--ink-muted);margin-top:12px;line-height:1.5;}
  table.data-table td{padding:12px 18px;border-bottom:1px solid var(--line-soft);}
  table.data-table tr:last-child td{border-bottom:none;}
  table.data-table td.num{font-family:"IBM Plex Mono",monospace;font-variant-numeric:tabular-nums;font-weight:600;}
  table.data-table .name-cell{display:flex;align-items:center;gap:9px;font-weight:600;}
  table.data-table tbody tr{cursor:pointer;}
  table.data-table tbody tr:hover{background:var(--paper);}
  table.data-table tbody tr.selected{background:rgba(255,59,87,0.07);box-shadow:inset 3px 0 0 var(--accent);}
  table.data-table tbody tr:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;}

  /* ---------- Method strip ---------- */

  .divider{display:flex;align-items:center;justify-content:center;gap:10px;margin:44px 0;}
  .divider span{width:6px;height:6px;border-radius:50%;background:var(--cat-bureau);}
  .divider span:nth-child(2){background:var(--cat-creation);}
  .divider span:nth-child(3){background:var(--cat-gaming);}
  .divider span:nth-child(4){background:var(--cat-poly);}
  .divider span:nth-child(5){background:var(--cat-lowcost);}

  /* ---------- Usage sections ---------- */
  .section{padding-block:58px;border-bottom:1.5px solid var(--line);}
  .section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px;flex-wrap:wrap;}
  .section-head h2{font-size:1.95rem;display:flex;align-items:center;gap:16px;}
  .section-badge{width:50px;height:50px;object-fit:contain;flex:none;}
  .section-head .tag{font-family:"IBM Plex Mono",sans-serif;font-size:0.66rem;letter-spacing:0.03em;color:#fff;background:var(--ink);border-radius:20px;padding:6px 12px;white-space:nowrap;}
  .section-intro{color:var(--ink-muted);max-width:60ch;line-height:1.6;margin-bottom:26px;font-size:0.97rem;font-weight:500;}
  .runners{display:flex;flex-direction:column;margin-top:14px;}
  .runner{display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:18px;padding:17px 4px;border-top:1px dashed var(--line-soft);}
  @media (max-width:680px){ .runner{grid-template-columns:1fr auto;row-gap:8px;} .runner .r-price{grid-column:1/2;} .runner .r-link{grid-column:2/3;} }
  .runner .r-name{font-weight:700;font-size:0.98rem;color:var(--ink);}
  .runner .r-note{color:var(--ink-muted);font-size:0.83rem;margin-top:3px;line-height:1.45;}
  .runner .r-score{font-family:"IBM Plex Mono",monospace;color:var(--ink);font-variant-numeric:tabular-nums;font-size:0.94rem;font-weight:700;}
  .runner .r-price{font-family:"IBM Plex Mono",monospace;color:var(--ink-muted);font-size:0.88rem;white-space:nowrap;}
  .runner .r-link{font-size:0.76rem;font-weight:700;text-decoration:none;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:20px;padding:7px 14px;cursor:pointer;font-family:"Plus Jakarta Sans",sans-serif;}
  .runner .r-link:hover{background:var(--ink);color:#fff;border-color:var(--ink);}

  .faq-list{display:flex;flex-direction:column;gap:12px;margin-top:14px;}
  .faq-item{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:4px 20px;}
  .faq-item summary{font-family:"Bricolage Grotesque","Plus Jakarta Sans",sans-serif;font-weight:700;color:var(--ink);font-size:1.03rem;padding:16px 0;cursor:pointer;list-style:none;position:relative;padding-right:30px;}
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::after{content:"+";position:absolute;right:2px;top:13px;font-family:"IBM Plex Mono",monospace;font-size:1.25rem;color:var(--accent);}
  .faq-item[open] summary::after{content:"–";}
  .faq-item p{color:var(--ink-muted);font-size:0.92rem;line-height:1.6;margin:0 0 18px;}

  footer{padding-block:44px 60px;}
  .disclosure{font-size:0.82rem;color:var(--ink-faint);line-height:1.6;max-width:70ch;border-top:1.5px solid var(--line);padding-top:24px;}
  .foot-row{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-size:0.78rem;color:var(--ink-faint);flex-wrap:wrap;gap:8px;}
  .foot-sig{display:flex;align-items:center;gap:10px;}
  .foot-sig img{width:32px;height:32px;border-radius:8px;border:1.5px solid var(--line);object-fit:cover;object-position:top;flex:none;background:var(--paper);}

  /* =====================================================================
     Extensions site multi-pages (même charte que l'artefact)
     ===================================================================== */
  html{scroll-behavior:smooth;}
  body{margin:0;line-height:1.5;}
  .brand-lockup{text-decoration:none;color:inherit;}
  .topnav a.active{color:var(--ink);border-color:var(--accent);}
  .crumb{font-family:"IBM Plex Mono",monospace;font-size:0.7rem;letter-spacing:0.03em;color:var(--ink-faint);padding-top:26px;text-transform:uppercase;}
  .crumb a{color:var(--ink-muted);text-decoration:none;}
  .crumb a:hover{color:var(--accent);}

  /* Hero page usage */
  .usage-hero{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:center;padding-block:26px 44px;border-bottom:1.5px solid var(--line);}
  .usage-hero h1{font-size:clamp(2rem,4vw,3.1rem);max-width:20ch;}
  .usage-hero h1 .flash{color:var(--accent);}
  .usage-hero p{color:var(--ink-muted);font-size:1.02rem;line-height:1.65;max-width:62ch;margin-top:16px;font-weight:500;}
  .usage-hero .hero-badge{width:190px;height:190px;object-fit:contain;}
  .usage-hero .hero-badge.tall{width:170px;height:260px;}
  @media (max-width:720px){ .usage-hero{grid-template-columns:1fr;} .usage-hero .hero-badge{width:120px;height:120px;order:-1;} .usage-hero .hero-badge.tall{width:110px;height:170px;} }

  /* Bulles sans note presse */
  .bubble.nopress{fill-opacity:0.18;stroke-width:1.6;stroke-dasharray:3 2;}
  .bubble.nopress.selected{stroke-width:2.5;stroke-dasharray:none;}

  /* Carte détail : mascotte d'usage */
  .art img.art-badge{position:relative;z-index:1;width:130px;height:130px;object-fit:contain;}
  .metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:14px;}
  .metric{background:var(--paper);border:1.5px solid var(--line-soft);border-radius:10px;padding:8px 10px;}
  .metric .k{font-family:"IBM Plex Mono",monospace;font-size:0.58rem;font-weight:700;letter-spacing:0.05em;color:var(--ink-muted);text-transform:uppercase;display:block;}
  .metric .v{font-family:"IBM Plex Mono",monospace;font-weight:700;font-size:1.02rem;color:var(--ink);font-variant-numeric:tabular-nums;}
  .metric .v small{font-size:0.66rem;color:var(--ink-muted);font-weight:500;}
  .metric.press{border-color:var(--ink);}
  .metric .none{font-size:0.72rem;color:var(--ink-faint);font-weight:600;}

  /* Pastille note presse dans les tableaux */
  .press-chip{display:inline-flex;align-items:baseline;gap:4px;font-family:"IBM Plex Mono",monospace;font-weight:700;}
  .press-chip small{font-size:0.66rem;color:var(--ink-faint);font-weight:500;}
  .muted{color:var(--ink-faint);font-weight:500;}

  /* Cartes usages (accueil) */
  .usage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:8px;}
  .usage-card{display:flex;flex-direction:column;background:#fff;border:1.5px solid var(--line);border-radius:16px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .15s ease, box-shadow .15s ease;}
  .usage-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(21,23,28,0.08);}
  .usage-card .uc-art{background:var(--paper);border-bottom:1.5px solid var(--line);display:flex;justify-content:center;padding:14px;}
  .usage-card .uc-art img{width:110px;height:110px;object-fit:contain;}
  .usage-card .uc-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1;}
  .usage-card h3{font-size:1.15rem;display:flex;align-items:center;gap:8px;}
  .usage-card .uc-tag{font-family:"IBM Plex Mono",monospace;font-size:0.6rem;letter-spacing:0.04em;text-transform:uppercase;color:var(--ink-muted);}
  .usage-card .uc-pick{font-size:0.8rem;color:var(--ink-muted);line-height:1.45;flex:1;}
  .usage-card .uc-pick b{color:var(--ink);}
  .usage-card .uc-go{font-size:0.8rem;font-weight:800;color:var(--accent);}

  /* Fiches du top 10 */
  .top-list{display:flex;flex-direction:column;gap:16px;margin-top:6px;}
  .fiche{display:grid;grid-template-columns:54px 1fr 200px;gap:20px;background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:20px 22px;scroll-margin-top:20px;}
  .fiche.top{box-shadow:inset 0 0 0 2px var(--accent);border-color:var(--accent);}
  .fiche .rank{font-family:"Bricolage Grotesque",sans-serif;font-weight:900;font-size:2rem;line-height:1;color:var(--ink);}
  .fiche .rank small{display:block;font-family:"IBM Plex Mono",monospace;font-size:0.56rem;font-weight:600;color:var(--ink-faint);letter-spacing:0.05em;margin-top:4px;}
  .fiche h3{font-size:1.2rem;margin-top:8px;}
  .fiche .verdict-bubble{margin-top:10px;}
  .fiche .strengths{margin-top:12px;padding-top:12px;}
  .fiche .f-side{display:flex;flex-direction:column;gap:8px;}
  .fiche .f-side .metric{padding:7px 10px;}
  .fiche .f-side .cta{text-align:center;margin-top:4px;}
  .fiche details{margin-top:12px;font-size:0.82rem;}
  .fiche summary{cursor:pointer;font-weight:700;color:var(--ink);font-size:0.8rem;}
  .fiche summary:hover{color:var(--accent);}
  .fiche .notes-list{list-style:none;padding:0;margin:10px 0 6px;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:3px 16px;}
  .fiche .notes-list li{display:flex;justify-content:space-between;border-bottom:1px dashed var(--line-soft);color:var(--ink-muted);padding:2px 0;}
  .fiche .notes-list b{font-family:"IBM Plex Mono",monospace;color:var(--ink);}
  .fiche .src{color:var(--ink-muted);margin:4px 0 0;}
  .fiche .src a{color:var(--ink);}
  @media (max-width:760px){
    .fiche{grid-template-columns:1fr;gap:12px;}
    .fiche .rank{font-size:1.4rem;}
    .fiche .f-side{display:grid;grid-template-columns:1fr 1fr;}
    .fiche .f-side .cta{grid-column:1/-1;}
  }

  /* Encadré méthode */
  .method-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-top:10px;}
  .method-card{background:var(--paper);border:1.5px solid var(--line);border-radius:14px;padding:16px 18px;}
  .method-card h3{font-size:1.05rem;margin-bottom:8px;}
  .method-card p{color:var(--ink-muted);font-size:0.88rem;line-height:1.55;margin:0;}
  .method-card .mono-big{font-family:"IBM Plex Mono",monospace;font-size:1.5rem;font-weight:700;color:var(--accent);display:block;margin-bottom:6px;}

  /* Pages texte (méthode, légal) */
  .prose{max-width:760px;padding-block:20px 50px;}
  .prose h1{font-size:clamp(1.9rem,3.6vw,2.7rem);margin:10px 0 18px;}
  .prose h2{font-size:1.3rem;margin:30px 0 10px;}
  .prose p,.prose li{color:var(--ink-muted);line-height:1.7;font-size:0.97rem;}
  .prose b,.prose strong{color:var(--ink);}
  .prose .fill{background:var(--highlight);color:var(--ink);font-weight:700;padding:0 5px;border-radius:4px;}
  .prose-hero{display:grid;grid-template-columns:1fr 200px;gap:30px;align-items:end;}
  .prose-hero img{width:200px;height:auto;}
  @media (max-width:700px){ .prose-hero{grid-template-columns:1fr;} .prose-hero img{width:130px;} }

  .foot-links{display:flex;gap:14px;flex-wrap:wrap;}
  .foot-links a{color:var(--ink-muted);text-decoration:none;}
  .foot-links a:hover{color:var(--accent);}
  .section-head h2 a{text-decoration:none;}
  .see-all{font-size:0.85rem;font-weight:800;color:var(--accent);text-decoration:none;}
  .see-all:hover{text-decoration:underline;}

  /* ===================== v4 ===================== */
  .deal-zone{fill:var(--highlight);fill-opacity:0.22;stroke:var(--highlight);stroke-width:1.2;stroke-dasharray:4 3;}
  .deal-label{font-family:"IBM Plex Mono",monospace;font-size:8px;font-weight:700;fill:#8a6400;letter-spacing:0.04em;}
  .bubble.dimmed{opacity:0.08;pointer-events:none;}
  .filter-label{font-family:"IBM Plex Mono",monospace;font-size:0.66rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;color:var(--ink-muted);align-self:center;margin-right:4px;}
  .pill:disabled{opacity:0.35;cursor:not-allowed;}
  .ref{font-family:"IBM Plex Mono",monospace;font-size:0.66rem;color:var(--ink-faint);margin-top:5px;line-height:1.4;}

  /* note presse en vedette dans la carte détail */
  .score.big-press{display:flex;flex-direction:column;align-items:flex-end;background:var(--ink);color:#fff;border-radius:12px;padding:8px 12px;min-width:92px;}
  .score.big-press .pn{font-size:1.9rem;font-weight:800;line-height:1;}
  .score.big-press .pd{font-size:0.8rem;color:#c9ccd4;}
  .score.big-press .pc{font-size:0.56rem;letter-spacing:0.04em;text-transform:uppercase;color:#c9ccd4;margin-top:4px;text-align:right;}
  .score.big-press.none{background:var(--paper-alt);color:var(--ink-muted);}
  .score.big-press.none .pc{color:var(--ink-muted);}
  .metrics.m4{grid-template-columns:repeat(4,1fr);}
  @media (max-width:560px){ .metrics.m4{grid-template-columns:repeat(2,1fr);} }
  .metric .v{font-size:0.9rem;}
  .pc-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px;}
  @media (max-width:560px){ .pc-grid{grid-template-columns:1fr;} }
  .strengths.weak .s::before{content:"–";color:var(--ink-faint);}
  .strengths.weak .s{font-weight:500;color:var(--ink-muted);}
  .pc-t{font-family:"IBM Plex Mono",monospace;font-size:0.6rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;}
  .pc-t.pro{color:var(--cat-gaming);} .pc-t.con{color:var(--accent);}
  .cta-row{display:flex;align-items:center;gap:14px;}

  /* fiches top 10 v4 */
  .fiche{grid-template-columns:62px 1fr 210px;}
  .fiche[hidden]{display:none;}
  .fiche h3{margin-top:10px;}
  .fiche .ref{margin-top:4px;}
  .fiche .pc-grid{margin-top:12px;padding-top:12px;border-top:1px dashed var(--line-soft);}
  .fiche .pc-grid .strengths{margin-top:0;padding-top:0;border-top:none;gap:6px;}
  .fiche .rank small{letter-spacing:0.04em;}
  .fiche.top .rank small{color:var(--accent);}
  .press-big{background:var(--ink);color:#fff;border-radius:12px;padding:12px 14px;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 4px;}
  .press-big .pn{font-family:"IBM Plex Mono",monospace;font-size:2.1rem;font-weight:700;line-height:1;}
  .press-big .pd{font-family:"IBM Plex Mono",monospace;color:#c9ccd4;font-size:0.85rem;}
  .press-big .pc{flex-basis:100%;font-family:"IBM Plex Mono",monospace;font-size:0.58rem;letter-spacing:0.04em;text-transform:uppercase;color:#c9ccd4;margin-top:4px;}
  .press-big .pn.none{color:#8d919c;}
  .fiche .mini{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dashed var(--line-soft);padding:5px 2px;font-size:0.8rem;}
  .fiche .mini .k{font-family:"IBM Plex Mono",monospace;font-size:0.6rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;color:var(--ink-muted);align-self:center;}
  .fiche .mini .v{font-family:"IBM Plex Mono",monospace;font-weight:700;text-align:right;}
  .fiche .mini .v small{color:var(--ink-faint);font-weight:500;}
  .none{color:var(--ink-faint);font-weight:500;font-size:0.72rem;}
  .configs{margin-top:12px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
  .configs .k{font-family:"IBM Plex Mono",monospace;font-size:0.6rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;color:var(--ink-muted);margin-right:4px;}
  .configs a{display:inline-flex;gap:8px;align-items:baseline;border:1.5px solid var(--line-soft);border-radius:20px;padding:4px 11px;font-size:0.76rem;text-decoration:none;color:var(--ink);background:var(--paper);}
  .configs a b{font-family:"IBM Plex Mono",monospace;font-size:0.72rem;}
  .configs a:hover{border-color:var(--ink);}
  .src.small{margin-top:10px;font-size:0.78rem;}
  .empty-note{color:var(--ink-muted);font-size:0.9rem;padding:14px 0;}
  table.data-table .name-cell span:last-child{white-space:nowrap;}
  @media (max-width:760px){
    .fiche{grid-template-columns:1fr;}
    .fiche .f-side{display:flex;flex-direction:column;}
  }
  .featured-title .score.big-press span{color:#c9ccd4;}
  .featured-title .score.big-press .pn{color:#fff;font-size:1.9rem;}
  .featured-title .score.big-press.none .pn{color:var(--ink-muted);}
  .featured-title .score.big-press.none span{color:var(--ink-muted);}

  /* ===================== v5 ===================== */
  .lead-line{font-size:0.92rem;line-height:1.55;color:var(--ink-muted);margin:10px 0 0;}
  .lead-line b{color:var(--ink);}
  .featured .lead-line{margin-top:14px;}
  .metrics.m4 .metric[hidden]{display:none;}
  .metrics.m4{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));}
  .bar{display:block;height:8px;border-radius:6px;background:var(--line-soft);overflow:hidden;margin-top:7px;min-width:70px;}
  .bar i{display:block;height:100%;background:var(--ink);border-radius:6px;}
  .fiche .mini.mbar .v{flex:1;display:flex;justify-content:flex-end;align-items:center;}
  .fiche .mini.mbar .bar{width:90px;margin-top:0;}
  .hero-links{font-size:0.88rem!important;margin-top:12px!important;}
  .hero-links a{color:var(--ink);font-weight:700;text-decoration:none;border-bottom:2px solid var(--accent);}

  /* Guide d'achat */
  .guide{padding-block:48px;border-bottom:1.5px solid var(--line);}
  .guide-intro{color:var(--ink-muted);font-size:1rem;line-height:1.7;max-width:72ch;margin:0 0 24px;}
  .guide-intro b{color:var(--ink);}
  .g-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;}
  .g-card{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:16px 18px;}
  .g-num{font-family:"IBM Plex Mono",monospace;font-weight:700;color:var(--accent);font-size:0.8rem;}
  .g-card h3{font-size:1.08rem;margin:6px 0 8px;}
  .g-card p{color:var(--ink-muted);font-size:0.88rem;line-height:1.6;margin:0;}
  .g-bottom{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;margin-top:14px;}
  @media (max-width:820px){ .g-bottom{grid-template-columns:1fr;} }
  .g-box{background:var(--paper);border:1.5px solid var(--line-soft);border-radius:14px;padding:16px 18px;}
  .g-pieges{margin:0;padding-left:18px;color:var(--ink-muted);font-size:0.88rem;line-height:1.6;}
  .g-pieges li{margin-bottom:6px;}
  .g-pieges li::marker{color:var(--accent);}
  .g-tiers{display:flex;flex-direction:column;gap:8px;}
  .g-tier{display:grid;grid-template-columns:130px 1fr;gap:10px;align-items:baseline;border-bottom:1px dashed var(--line-soft);padding-bottom:7px;}
  .g-tier:last-child{border-bottom:none;}
  .g-tier strong{font-family:"IBM Plex Mono",monospace;font-size:0.85rem;}
  .g-tier span{color:var(--ink-muted);font-size:0.86rem;line-height:1.45;}
  .guide-go{margin:22px 0 0;}