/*
 * theme.css — Identité Jules & Jenn partagée par TOUS les dashboards J&J.
 * Copié à l'identique dans les 4 repos (competitor / GEO / GSC / sanity check).
 * Structure : tokens de couleurs/typo puis harmonisation header + sidebar + xnav
 * (patron repris du système Alma pour cohérence de l'expérience cross-dashboards).
 */
:root {
  /* ── Marque ── */
  --site-name:        "Jules & Jenn";
  --logo-url:         url('https://julesjenn.com/cdn/shop/files/jules_jenn-logo-noir-baseline-europe.svg');
  --logo-height:      32px;

  /* ── Couleurs principales (palette J&J : noir + beige sable + crème) ── */
  --color-primary:    #000000;
  --color-accent:     #d4a574;
  --color-brand:      #000000;
  --color-secondary:  #d4a574;
  --color-success:    #38a169;
  --color-warning:    #dd6b20;
  --color-danger:     #e53e3e;
  --color-neutral:    #6b7280;
  --color-client:     #d4a574;

  --color-bg:         #f7f5f0;
  --color-card:       #ffffff;
  --color-border:     #e5e0d5;

  --header-bg:        var(--color-primary);
  --header-text:      #ffffff;

  --tab-active-bg:    var(--color-primary);
  --tab-active-text:  #ffffff;
  --tab-inactive-bg:  #ffffff;
  --tab-inactive-text: var(--color-primary);

  --table-header-bg:  var(--color-primary);
  --table-header-text:#ffffff;
  --table-row-alt:    #faf8f3;
  --table-row-hover:  #f5efe4;

  --font-family:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-display:     'Fraunces', Georgia, 'Times New Roman', serif;
  --font-size-base:   14px;

  --chart-color-1:    #d4a574;
  --chart-color-2:    #000000;
  --chart-color-3:    #6b8e8f;
  --chart-color-4:    #c97b63;
  --chart-color-5:    #f59e0b;
  --chart-color-6:    #4a4a4a;
  --chart-color-7:    #8b8b8b;
}
html { color-scheme: light; }

/* ===== Harmonisation header + sidebar (commun aux 4 dashboards J&J) ===== */
/* Patron repris tel quel de la stack Alma pour uniformité de l'expérience. */
header{background:var(--header-bg);color:var(--header-text);padding:0 22px;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;height:56px;flex-shrink:0;gap:16px}
header>.brand{justify-self:start;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
header>.xnav{justify-self:center}
header>.hright{justify-self:end;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
header .brand{font-family:'Fraunces',Georgia,'Times New Roman',serif;font-size:1.15rem;font-weight:600;display:flex;align-items:center;gap:10px;letter-spacing:-.01em;color:#fff;white-space:nowrap}
header .brand .dot{width:26px;height:26px;border-radius:8px;background:#fff;color:var(--color-primary);display:grid;place-items:center;font-weight:800;font-size:.9rem;font-family:'Fraunces',Georgia,serif}
header .brand small{font-weight:500;opacity:.85;font-size:.78rem;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;letter-spacing:0}
header .last-crawl,header .upd{font-size:.76rem;opacity:.85;color:#fff;white-space:nowrap}

.xnav{display:flex;gap:3px;align-items:center;flex-wrap:nowrap}
.xnav a{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:8px;font-size:.8rem;font-weight:600;line-height:1;color:#fff;text-decoration:none;opacity:.68;transition:background .15s,opacity .15s;white-space:nowrap}
.xnav a:hover{opacity:1;background:rgba(255,255,255,.16)}
.xnav a.active{opacity:1;background:rgba(255,255,255,.24);cursor:default}
.xnav a i{font-size:.9em}
.xnav-sep{width:1px;height:15px;background:rgba(255,255,255,.32);flex-shrink:0;margin:0 4px}
.hright{display:flex;align-items:center;gap:12px}
.market-sel{appearance:none;-webkit-appearance:none;background-color:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.32);border-radius:7px;padding:5px 26px 5px 10px;font-family:inherit;font-size:.8rem;font-weight:600;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='white'%3E%3Cpath d='M3 4.5L6 8l3-3.5z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:10px}
.market-sel:hover{background-color:rgba(255,255,255,.26)}
.market-sel option{color:#000;background:#fff}

.layout{display:flex;flex:1;min-height:0}
.sidebar{width:220px;flex-shrink:0;background:var(--color-card);border-right:1px solid var(--color-border);display:flex;flex-direction:column;overflow-y:auto}
.sidebar-nav{padding:16px 0;flex:1}
.nav-section{font-size:.66rem;text-transform:uppercase;letter-spacing:.6px;color:var(--color-neutral);padding:14px 18px 6px;font-weight:700}
.nav-btn{display:flex;align-items:center;gap:11px;width:100%;padding:9px 18px;border:none;background:none;font-family:var(--font-family);font-size:.84rem;color:var(--color-primary);opacity:.6;cursor:pointer;text-align:left;border-left:3px solid transparent;transition:all .15s;line-height:1.25}
.nav-btn:hover{opacity:1;background:var(--color-bg)}
.nav-btn.active{opacity:1;border-left-color:var(--tab-active-bg);color:var(--tab-active-bg);font-weight:600;background:var(--color-bg)}
.nav-btn .nav-icon{font-size:.85rem;width:18px;text-align:center;flex-shrink:0;display:inline-block}

/* Typographie de marque : gros chiffres et titres en Fraunces */
.card .value,.card.wide .value,.ptitle{font-family:var(--font-display);font-weight:600}
.card{border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.07)}

/* Bloc Récap ✦ (identique cross-dashboards) */
.ai-block{background:var(--color-card);border-radius:8px;padding:22px 24px;box-shadow:0 1px 3px rgba(0,0,0,.06);border-left:4px solid var(--color-accent);margin-bottom:22px}
.ai-block .ai-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px}
.ai-block .ai-title{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--color-accent)}
.ai-block .ai-date{font-size:.73rem;color:var(--color-neutral);white-space:nowrap}
.ai-block .ai-body{font-size:.85rem;line-height:1.7;color:var(--color-primary)}
.ai-block .ai-loading{color:var(--color-neutral);font-style:italic}
.ai-block .recap-list{list-style:none;padding:0;margin:0}
.ai-block .recap-list li{padding:5px 0 5px 18px;position:relative;line-height:1.55}
.ai-block .recap-list li::before{content:"→";position:absolute;left:0;color:var(--color-accent);opacity:.7}

/* ===== Layout global commun aux sections SPA ===== */
*, *::before, *::after { box-sizing: border-box; }
body { font-family: var(--font-family); font-size: var(--font-size-base); background: var(--color-bg); color: var(--color-primary); display: flex; flex-direction: column; height: 100vh; overflow: hidden; margin:0; }
.main { flex: 1; overflow-y: auto; min-height: 0; }
.container { max-width: 1280px; margin: 0 auto; padding: 24px 28px; }

/* Modal shared (used by any section) */
#modal { border:none; border-radius:12px; padding:0; max-width:min(920px,92vw); width:100%; box-shadow:0 20px 60px rgba(0,0,0,.25); }
#modal::backdrop { background:rgba(0,0,0,.45); }
#modal .m-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:16px 20px; border-bottom:1px solid var(--color-border); }
#modal .m-head .mt { font-family:var(--font-display); font-size:1.1rem; font-weight:600; }
#modal .m-head .ms { font-size:.78rem; color:var(--color-neutral); margin-top:2px; }
#modal .m-close { background:none; border:none; font-size:1.6rem; line-height:1; cursor:pointer; color:var(--color-neutral); padding:0 4px; }
#modal .m-body { padding:16px 20px 22px; max-height:70vh; overflow-y:auto; }

/* ===== Section « Concurrents » (scopée) ===== */
/* Tous les selectors ci-dessous sont préfixés par .competitors-section pour
   éviter les collisions avec les autres modules (GEO/GSC/Crawl). */
.competitors-section .container h2.section { font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--color-primary); margin: 24px 0 12px; padding-bottom: 6px; border-bottom: 2px solid var(--color-border); }
.competitors-section .container h2.section:first-child { margin-top: 0; }
.competitors-section .container p.hint { font-size: .8rem; color: var(--color-neutral); margin-bottom: 14px; line-height: 1.5; }
.competitors-section .container p.hint strong { color: #1a1a1a; }

.competitors-section .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 24px; }
.competitors-section .card { background: var(--color-card); border-radius: 8px; padding: 16px 18px; box-shadow: 0 1px 3px rgba(0,0,0,.06); border-top: 3px solid transparent; position: relative; }
.competitors-section .card.client { border-top-color: var(--color-client); }
.competitors-section .card.competitor { border-top-color: var(--color-primary); }
.competitors-section .card .label { font-size: .7rem; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin-bottom: 7px; font-weight: 600; }
.competitors-section .card .value { font-size: 1.8rem; font-weight: 700; line-height: 1; }
.competitors-section .card .sub { display: flex; align-items: center; gap: 5px; margin-top: 7px; font-size: .75rem; color: var(--color-neutral); }
.competitors-section .card .pill-client { position: absolute; top: 10px; right: 10px; padding: 2px 7px; border-radius: 10px; background: var(--color-client); color: #fff; font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; }
.competitors-section .delta-good { color: var(--color-success); font-weight: 600; }
.competitors-section .delta-bad  { color: var(--color-danger);  font-weight: 600; }
.competitors-section .delta-zero { color: var(--color-neutral); }

.competitors-section .charts { display: grid; grid-template-columns: repeat(auto-fit, minmax(460px, 1fr)); gap: 16px; margin-bottom: 24px; }
.competitors-section .chart-box { background: var(--color-card); border-radius: 8px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.competitors-section .chart-box.full { grid-column: 1 / -1; }
.competitors-section .chart-box h2 { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin-bottom: 14px; }
.competitors-section canvas { max-height: 320px; }

.competitors-section .tables-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 16px; margin-bottom: 24px; }
.competitors-section .table-box { background: var(--color-card); border-radius: 8px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(0,0,0,.06); overflow-x: auto; }
.competitors-section .table-box.full { grid-column: 1 / -1; }
.competitors-section .table-box h2 { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin-bottom: 12px; }
.competitors-section .table-box h3 { font-size: .83rem; font-weight: 600; margin-bottom: 8px; color: var(--color-primary); }
.competitors-section table { width: 100%; border-collapse: collapse; font-size: .81rem; }
.competitors-section thead tr { background: var(--table-header-bg); color: var(--table-header-text); }
.competitors-section th { padding: 8px 10px; text-align: left; font-weight: 600; font-size: .73rem; white-space: nowrap; }
.competitors-section td { padding: 7px 10px; border-top: 1px solid var(--color-border); }
.competitors-section td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.competitors-section td.url { max-width: 340px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .78rem; }
.competitors-section td.url a { color: var(--color-primary); text-decoration: none; }
.competitors-section td.url a:hover { text-decoration: underline; }
.competitors-section tbody tr:nth-child(even) td { background: var(--table-row-alt); }
.competitors-section tbody tr:hover td { background: #fff4f0; }
.competitors-section tbody tr.client-row td { background: #f0f3ff; font-weight: 600; }

.competitors-section .pill { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: .68rem; background: #f3f4f6; color: #4b5563; }
.competitors-section .intent-tag { display: inline-block; padding: 2px 7px; border-radius: 3px; font-size: .68rem; font-weight: 600; text-transform: uppercase; }
.competitors-section .intent-transactional { background: #d1fae5; color: #065f46; }
.competitors-section .intent-commercial    { background: #fef3c7; color: #92400e; }
.competitors-section .intent-informational { background: #dbeafe; color: #1e40af; }
.competitors-section .intent-navigational  { background: #e0e7ff; color: #3730a3; }
.competitors-section .intent-unknown       { background: #f3f4f6; color: #6b7280; }
.competitors-section .feature-tag { display: inline-block; padding: 2px 6px; border-radius: 3px; font-size: .64rem; font-weight: 700; }
.competitors-section .feature-tag.ai { background: #7c3aed; color: #fff; }
.competitors-section .feature-tag.fs { background: #d97706; color: #fff; }

.competitors-section .cat-tag { display: inline-block; padding: 2px 7px; border-radius: 4px; font-size: .68rem; font-weight: 600; background: #eef2ff; color: #3730a3; white-space: nowrap; }
.competitors-section .gender-tag { display: inline-block; padding: 2px 7px; border-radius: 4px; font-size: .68rem; font-weight: 600; }
.competitors-section .gender-Femme  { background: #fce7f3; color: #9d174d; }
.competitors-section .gender-Homme  { background: #dbeafe; color: #1e40af; }
.competitors-section .gender-Enfant { background: #fef3c7; color: #92400e; }
.competitors-section .gender-Mixte  { background: #f3f4f6; color: #4b5563; }

.competitors-section .loading { text-align: center; padding: 80px; color: var(--color-neutral); }
.competitors-section .error   { text-align: center; padding: 80px; color: var(--color-danger); }

.competitors-section .tldr {
  background: linear-gradient(135deg, var(--color-primary) 0%, #333 100%);
  color: #fff; border-radius: 10px; padding: 20px 24px;
  margin-bottom: 20px; box-shadow: 0 2px 8px rgba(0,0,0,.1);
}
.competitors-section .tldr h2 { font-size: .68rem; text-transform: uppercase; letter-spacing: .8px; opacity: .7; margin-bottom: 12px; font-weight: 700; color:#fff; border:none; padding:0; }
.competitors-section .tldr ul { list-style: none; padding: 0; }
.competitors-section .tldr li { padding: 6px 0; font-size: .88rem; line-height: 1.45; position: relative; padding-left: 18px; }
.competitors-section .tldr li::before { content: "→"; position: absolute; left: 0; opacity: .5; }
.competitors-section .tldr a { color: #fff; opacity: .8; font-size: .78rem; text-decoration: underline; }

.competitors-section .health-strip { display: flex; gap: 4px; margin-top: 8px; }
.competitors-section .health-cell { flex: 1; height: 18px; border-radius: 3px; background: var(--color-border); position: relative; cursor: help; }
.competitors-section .health-cell.ok { background: var(--color-success); }
.competitors-section .health-cell.partial { background: #facc15; }
.competitors-section .health-cell.ko { background: var(--color-danger); }
.competitors-section .health-cell::after { content: attr(data-w); position: absolute; bottom: -18px; left: 50%; transform: translateX(-50%); font-size: .62rem; color: var(--color-neutral); white-space: nowrap; }

.competitors-section .move-pos { display: inline-block; min-width: 26px; padding: 2px 6px; border-radius: 4px; font-size: .72rem; font-variant-numeric: tabular-nums; background: #eee; color: #555; text-align: center; }
.competitors-section .move-pos.top3 { background: #16a34a; color: #fff; }
.competitors-section .move-pos.top10 { background: #84cc16; color: #fff; }
.competitors-section .move-arrow { font-size: .74rem; margin-left: 4px; }
.competitors-section .move-up { color: var(--color-success); }
.competitors-section .move-down { color: var(--color-danger); }

/* Categories tab : heatmap-like matrix */
.competitors-section .heat-table th, .competitors-section .heat-table td { border-right: 1px solid var(--color-border); }
.competitors-section .heat-table th:last-child, .competitors-section .heat-table td:last-child { border-right: none; }
.competitors-section .heat-cell { display: inline-block; padding: 3px 8px; border-radius: 4px; font-variant-numeric: tabular-nums; min-width: 60px; text-align: center; font-weight: 600; font-size: .78rem; }
.competitors-section .heat-empty { color: #aaa; font-weight: 400; }
.competitors-section .heat-scale-0 { background: #f3f4f6; color: #6b7280; }
.competitors-section .heat-scale-1 { background: #dbeafe; color: #1e40af; }
.competitors-section .heat-scale-2 { background: #93c5fd; color: #1e3a8a; }
.competitors-section .heat-scale-3 { background: #3b82f6; color: #fff; }
.competitors-section .heat-scale-4 { background: #1d4ed8; color: #fff; }
.competitors-section .heat-champion { outline: 2px solid var(--color-success); }

/* Explorer tab : filters + master table */
.competitors-section .explorer-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 16px; background: var(--color-card); padding: 14px 18px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.competitors-section .filter-group { display: flex; flex-direction: column; gap: 4px; }
.competitors-section .filter-group label { font-size: .68rem; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); font-weight: 600; }
.competitors-section .filter-group select, .competitors-section .filter-group input { padding: 6px 8px; border: 1px solid var(--color-border); border-radius: 4px; font-family: inherit; font-size: .82rem; background: #fff; }
.competitors-section .filter-group select:focus, .competitors-section .filter-group input:focus { outline: none; border-color: var(--color-primary); }
.competitors-section .explorer-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; gap: 12px; flex-wrap: wrap; }
.competitors-section .explorer-count { font-size: .82rem; color: var(--color-neutral); }
.competitors-section .explorer-count strong { color: #1a1a1a; }
.competitors-section .btn { padding: 6px 12px; border-radius: 4px; border: 1px solid var(--color-primary); background: #fff; color: var(--color-primary); font-family: inherit; font-size: .78rem; font-weight: 600; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.competitors-section .btn:hover { background: var(--color-primary); color: #fff; }
.competitors-section .btn-secondary { border-color: var(--color-neutral); color: var(--color-neutral); }
.competitors-section .btn-secondary:hover { background: var(--color-neutral); color: #fff; }
.competitors-section .explorer-wrap {
  max-height: 70vh;
  overflow: auto;
  position: relative;
  isolation: isolate;
  background: var(--color-card);
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(0,0,0,.06);
}
.competitors-section .explorer-table { border-collapse: separate; border-spacing: 0; width: 100%; min-width: 1100px; }
.competitors-section .explorer-table thead th {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--table-header-bg);
  color: var(--table-header-text);
  padding: 10px 10px;
  font-size: .73rem;
  font-weight: 600;
  text-align: left;
  white-space: nowrap;
  box-shadow: 0 2px 4px rgba(0,0,0,.15);
}
.competitors-section .explorer-table tbody td {
  padding: 7px 10px;
  border-top: 0;
  border-bottom: 1px solid var(--color-border);
  background: var(--color-card);
}
.competitors-section .explorer-table tbody tr:nth-child(even) td { background: var(--table-row-alt); }
.competitors-section .explorer-table tbody tr:hover td { background: #fff4f0; }

@media (max-width: 820px) {
  .competitors-section .charts { grid-template-columns: 1fr; }
}

/* ===== Section « GEO IA » (scopée) ===== */
/* Styles portés depuis julesjenn-geo-watch/dashboard/index.html (bloc <style> inline). */
/* Tous les selectors ci-dessous sont préfixés par .geo-section pour éviter les
   collisions avec les autres modules (competitors / GSC / crawl). */
.geo-section .ptitle { font-family: var(--font-display); font-size: 1.5rem; font-weight: 600; margin-bottom: 4px; }
.geo-section .psub { font-size: .84rem; color: var(--color-neutral); margin-bottom: 18px; line-height: 1.55; }

.geo-section .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(185px, 1fr)); gap: 12px; margin-bottom: 22px; }
.geo-section .card { background: var(--color-card); border-radius: 10px; padding: 16px 18px; box-shadow: 0 1px 3px rgba(80,40,10,.07); border-top: 3px solid transparent; }
.geo-section .card.coral  { border-top-color: var(--color-accent); }
.geo-section .card.yellow { border-top-color: var(--color-secondary); }
.geo-section .card.green  { border-top-color: var(--color-success); }
.geo-section .card.orange { border-top-color: var(--color-warning); }
.geo-section .card.red    { border-top-color: var(--color-danger); }
.geo-section .card.gray   { border-top-color: var(--color-neutral); }
.geo-section .card .label { font-size: .67rem; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin-bottom: 7px; font-weight: 600; }
.geo-section .card .value { font-family: var(--font-display); font-size: 1.7rem; font-weight: 600; line-height: 1.15; }
.geo-section .card .foot  { font-size: .72rem; color: var(--color-neutral); margin-top: 6px; line-height: 1.4; }

.geo-section .box { background: var(--color-card); border-radius: 10px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(80,40,10,.07); margin-bottom: 16px; overflow-x: auto; }
.geo-section .box h2 { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.geo-section .grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 16px; }
.geo-section canvas { max-height: 230px; }

.geo-section table { width: 100%; border-collapse: collapse; font-size: .82rem; }
.geo-section thead tr { background: var(--table-header-bg); color: var(--table-header-text); }
.geo-section th { padding: 8px 10px; text-align: left; font-weight: 600; font-size: .72rem; white-space: nowrap; }
.geo-section td { padding: 8px 10px; border-top: 1px solid var(--color-border); vertical-align: top; }
.geo-section tbody tr:nth-child(even) td { background: var(--table-row-alt); }
.geo-section tbody tr:hover td { background: var(--table-row-hover); }
.geo-section th .hint { font-weight: 400; color: var(--color-neutral); font-size: .9em; }

.geo-section .badge { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: .7rem; font-weight: 700; white-space: nowrap; }
.geo-section .b-yes         { background: rgba(31,157,85,.15); color: var(--color-success); }
.geo-section .b-no          { background: rgba(138,125,117,.16); color: var(--color-neutral); }
.geo-section .b-durable     { background: rgba(31,157,85,.15); color: var(--color-success); }
.geo-section .b-intermittente { background: rgba(224,138,0,.16); color: var(--color-warning); }
.geo-section .b-one-shot    { background: rgba(217,58,43,.14); color: var(--color-danger); }
.geo-section .b-absente     { background: rgba(138,125,117,.16); color: var(--color-neutral); }
.geo-section .b-a-etablir   { background: rgba(250,80,34,.12); color: var(--color-accent); }
.geo-section .b-type        { background: rgba(250,80,34,.12); color: var(--color-accent); text-transform: capitalize; }

.geo-section .bar { position: relative; height: 18px; background: var(--color-border); border-radius: 5px; overflow: hidden; min-width: 110px; display: inline-block; vertical-align: middle; }
.geo-section .bar > i { position: absolute; top: 0; left: 0; height: 100%; background: var(--color-accent); opacity: .9; }
.geo-section .bar > u { position: absolute; top: 0; height: 100%; border-left: 2px solid var(--color-primary); border-right: 2px solid var(--color-primary); opacity: .4; }
.geo-section .clickable { cursor: pointer; }

.geo-section .note { font-size: .78rem; color: var(--color-neutral); margin-top: 10px; line-height: 1.6; border-left: 3px solid var(--color-border); padding-left: 12px; }
.geo-section .note b { color: var(--color-primary); }
.geo-section .empty { text-align: center; padding: 50px; color: var(--color-neutral); }

/* Modal drill-down (partagé avec les autres sections via #modal ; classes internes utilisées pour Prompt & réponses) */
#modal .resp { border: 1px solid var(--color-border); border-radius: 9px; padding: 12px 14px; margin-bottom: 12px; }
#modal .resp .rh { display: flex; align-items: center; gap: 7px; margin-bottom: 8px; font-weight: 700; font-size: .84rem; flex-wrap: wrap; }
#modal .resp .rtext { font-size: .8rem; line-height: 1.6; max-height: 280px; overflow: auto; background: var(--color-bg); border-radius: 7px; padding: 10px 13px; }
#modal .rtext > *:first-child { margin-top: 0; }
#modal .rtext > *:last-child  { margin-bottom: 0; }
#modal .rtext p { margin: .5em 0; }
#modal .rtext h1, #modal .rtext h2, #modal .rtext h3, #modal .rtext h4 { font-family: var(--font-display); font-weight: 600; margin: .7em 0 .3em; line-height: 1.3; }
#modal .rtext h1 { font-size: 1.05rem; }
#modal .rtext h2 { font-size: .98rem; }
#modal .rtext h3 { font-size: .9rem; }
#modal .rtext h4 { font-size: .84rem; }
#modal .rtext ul, #modal .rtext ol { margin: .4em 0 .4em 1.2em; }
#modal .rtext li { margin: .2em 0; }
#modal .rtext strong { font-weight: 700; }
#modal .rtext em { font-style: italic; }
#modal .rtext a { color: var(--color-accent); text-decoration: none; }
#modal .rtext a:hover { text-decoration: underline; }
#modal .rtext code { background: var(--color-border); padding: 1px 5px; border-radius: 4px; font-size: .9em; }
#modal .rtext table { border-collapse: collapse; margin: .6em 0; font-size: .92em; width: auto; min-width: 60%; }
#modal .rtext th, #modal .rtext td { border: 1px solid var(--color-border); padding: 5px 9px; text-align: left; white-space: normal; }
#modal .rtext thead tr { background: var(--color-accent); color: #fff; }
#modal .rtext tbody tr:nth-child(even) { background: var(--color-card); }
#modal .rtext blockquote { border-left: 3px solid var(--color-border); margin: .5em 0; padding-left: 10px; color: var(--color-neutral); }
#modal .resp .sub { font-size: .72rem; color: var(--color-neutral); margin: 9px 0 4px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; }
#modal .chip { display: inline-block; font-size: .72rem; border: 1px solid var(--color-border); border-radius: 6px; padding: 2px 8px; margin: 2px 3px 2px 0; }
#modal .chip.cited { border-color: var(--color-success); color: var(--color-success); font-weight: 700; }
#modal .chip.brand { background: var(--color-accent); color: #fff; border-color: var(--color-accent); font-weight: 700; }
#modal .srcs a { color: var(--color-accent); text-decoration: none; font-size: .75rem; }
#modal .srcs a:hover { text-decoration: underline; }
#modal .ci { display: inline-block; margin-left: 8px; font-size: .72rem; color: var(--color-neutral); white-space: nowrap; }
#modal .modal-hint { font-size: .78rem; line-height: 1.55; color: var(--color-primary); background: var(--color-bg); border-radius: 8px; padding: 10px 13px; margin-bottom: 14px; }
#modal .resp .rh .reps { font-weight: 400; color: var(--color-neutral); font-size: .75rem; }
#modal .rep-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0 10px; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--color-neutral); }
#modal .rep-tab { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--color-border); background: var(--color-card); border-radius: 6px; padding: 3px 10px; cursor: pointer; font-family: inherit; font-size: .78rem; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--color-primary); }
#modal .rep-tab.active { border-color: var(--color-accent); color: var(--color-accent); background: var(--color-bg); }
#modal .dot-m { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #c9bcb2; flex-shrink: 0; }
#modal .dot-m.men { background: var(--color-success); }
#modal .dot-m.cit { background: var(--color-accent); }
#modal .dot-m.non { background: #c9bcb2; }
#modal .rep-leg { display: inline-flex; gap: 9px; align-items: center; margin-left: 4px; color: var(--color-neutral); font-size: .72rem; white-space: nowrap; }
#modal .rep-panel { display: none; }
#modal .rep-panel.active { display: block; }
#modal .rh2 { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 2px 0 4px; }
#modal .badge { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: .7rem; font-weight: 700; white-space: nowrap; }
#modal .badge.b-yes { background: rgba(31,157,85,.15); color: var(--color-success); }
#modal .badge.b-no  { background: rgba(138,125,117,.16); color: var(--color-neutral); }
#modal .tag { font-size: .68rem; background: var(--color-bg); border: 1px solid var(--color-border); border-radius: 6px; padding: 1px 7px; color: var(--color-neutral); }

/* Sources (geo) */
.geo-section .src-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 14px; }
.geo-section .src-col h3 { font-size: .82rem; font-weight: 700; margin-bottom: 6px; display: flex; align-items: baseline; gap: 8px; }
.geo-section .src-col h3 .reps { font-weight: 400; color: var(--color-neutral); font-size: .72rem; }
.geo-section .src-col ol { list-style: none; padding: 0; margin: 0; }
.geo-section .src-col li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 5px 0; border-top: 1px solid var(--color-border); font-size: .8rem; }
.geo-section .src-col li b { color: var(--color-neutral); font-weight: 700; flex-shrink: 0; }
.geo-section .dom { word-break: break-all; }
.geo-section .dom.marque { color: var(--color-accent); font-weight: 700; }
.geo-section .dom.concurrent { color: var(--color-primary); font-weight: 600; }
.geo-section .dtag { display: inline-block; font-size: .6rem; padding: 1px 6px; border-radius: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; vertical-align: middle; }
.geo-section .dtag.marque { background: rgba(250,80,34,.13); color: var(--color-accent); }
.geo-section .dtag.concurrent { background: rgba(138,125,117,.16); color: var(--color-neutral); }
.geo-section #geo-srcTable td { font-variant-numeric: tabular-nums; }

/* Roadmap (geo) */
.geo-section .todo-item { border: 1px solid var(--color-border); border-radius: 9px; padding: 11px 14px; margin-bottom: 9px; border-left: 4px solid var(--color-neutral); }
.geo-section .todo-item.pri-haute   { border-left-color: var(--color-danger); }
.geo-section .todo-item.pri-moyenne { border-left-color: var(--color-warning); }
.geo-section .todo-item.pri-basse   { border-left-color: var(--color-neutral); }
.geo-section .todo-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.geo-section .todo-task { font-size: .87rem; font-weight: 600; flex: 1; min-width: 55%; }
.geo-section .todo-meta { font-size: .76rem; color: var(--color-neutral); margin-top: 6px; line-height: 1.5; }
.geo-section .todo-meta .k { font-weight: 700; color: var(--color-primary); }
.geo-section .chantier { border-top: 1px solid var(--color-border); padding: 11px 0; }
.geo-section .chantier:first-child { border-top: none; padding-top: 0; }
.geo-section .ch-head { display: flex; align-items: center; gap: 8px; font-size: .86rem; }
.geo-section .ch-obj  { font-size: .8rem; color: var(--color-neutral); margin: 4px 0 2px; }
.geo-section .chantier ul { margin: 5px 0 0 18px; font-size: .8rem; line-height: 1.55; }
.geo-section .risk-list { margin: 0; padding-left: 18px; font-size: .82rem; line-height: 1.7; }
.geo-section .risk-list li { margin-bottom: 5px; }
.geo-section .tag { font-size: .68rem; background: var(--color-bg); border: 1px solid var(--color-border); border-radius: 6px; padding: 1px 7px; color: var(--color-neutral); }
.geo-section .tag.src { background: var(--color-bg); color: var(--color-accent); border-color: var(--color-border); }
.geo-section .pri { padding: 2px 9px; border-radius: 20px; font-size: .66rem; font-weight: 800; text-transform: uppercase; }
.geo-section .pri.haute   { background: rgba(217,58,43,.14); color: var(--color-danger); }
.geo-section .pri.moyenne { background: rgba(224,138,0,.16); color: var(--color-warning); }
.geo-section .pri.basse   { background: rgba(138,125,117,.16); color: var(--color-neutral); }

/* Actions (geo) */
.geo-section .diag { background: #fff8f2; border-left: 4px solid var(--color-accent); border-radius: 9px; padding: 16px 20px; margin-bottom: 18px; font-size: .9rem; line-height: 1.65; box-shadow: 0 1px 3px rgba(80,40,10,.07); }
.geo-section .action { background: var(--color-card); border-radius: 10px; padding: 14px 18px; margin-bottom: 10px; box-shadow: 0 1px 3px rgba(80,40,10,.07); border-left: 4px solid var(--color-neutral); }
.geo-section .action.haute   { border-left-color: var(--color-danger); }
.geo-section .action.moyenne { border-left-color: var(--color-warning); }
.geo-section .action.basse   { border-left-color: var(--color-neutral); }
.geo-section .action .ah { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 6px; }
.geo-section .action .ah .t { font-weight: 700; font-size: .9rem; }
.geo-section .action p { font-size: .82rem; line-height: 1.6; margin: 3px 0; }
.geo-section .action .k { color: var(--color-neutral); font-weight: 700; }

/* Méthode / Glossaire (geo) */
.geo-section .law { background: var(--color-card); border-radius: 10px; padding: 16px 20px; margin-bottom: 12px; box-shadow: 0 1px 3px rgba(80,40,10,.07); border-top: 3px solid var(--color-accent); }
.geo-section .law h3 { font-family: var(--font-display); font-size: 1.1rem; font-weight: 600; margin-bottom: 6px; }
.geo-section .law p  { font-size: .83rem; line-height: 1.65; }
.geo-section .law .src { font-size: .73rem; color: var(--color-neutral); margin-top: 6px; }
.geo-section .glo { font-size: .83rem; line-height: 1.85; }
.geo-section .glo b { color: var(--color-accent); }

/* Detail (Prompts & réponses) : code identifiant du prompt */
.geo-section code.pid { cursor: pointer; color: var(--color-accent); border-bottom: 1px dashed var(--color-accent); padding-bottom: 1px; }
.geo-section code.pid:hover { background: var(--color-bg); }

/* Info popover (i icon avec tooltip inline) */
.geo-section .info { position: relative; display: inline-block; margin-left: 7px; cursor: help; color: var(--color-neutral); vertical-align: middle; }
.geo-section .info > .dot-i { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; border: 1.4px solid currentColor; font-size: .64rem; font-weight: 700; font-style: normal; line-height: 1; }
.geo-section .info:hover > .dot-i,
.geo-section .info:focus > .dot-i,
.geo-section .info:focus-within > .dot-i { color: var(--color-accent); }
.geo-section .info .pop { display: none; position: absolute; left: 0; top: 150%; z-index: 30; width: min(360px, 80vw); background: var(--color-card); border: 1px solid var(--color-border); border-radius: 9px; box-shadow: 0 8px 28px rgba(40,20,5,.18); padding: 13px 15px; font-size: .78rem; font-weight: 400; line-height: 1.6; color: var(--color-primary); text-transform: none; letter-spacing: 0; white-space: normal; }
.geo-section .info:hover .pop,
.geo-section .info:focus .pop,
.geo-section .info:focus-within .pop { display: block; }
.geo-section .info .pop b { color: var(--color-accent); }

@media (max-width: 820px) {
  .geo-section .grid2 { grid-template-columns: 1fr; }
  .geo-section .cards { grid-template-columns: repeat(auto-fit, minmax(45%, 1fr)); }
  .geo-section .ptitle { font-size: 1.3rem; }
}
@media (max-width: 480px) {
  .geo-section .cards { grid-template-columns: 1fr; }
}

/* ===== Section « GSC » (scopée) ===== */
/* Styles portés depuis julesjenn-gsc-watch/dashboard/index.html (bloc <style> inline). */
/* Tous les selectors ci-dessous sont préfixés par .gsc-section pour éviter les
   collisions avec les autres modules (competitors / geo / crawl). */
.gsc-section .gsc-block { margin-bottom: 28px; }
.gsc-section .gsc-block:last-child { margin-bottom: 0; }
.gsc-section .gsc-block h2 { font-size: .9rem; font-weight: 600; color: var(--color-primary); margin-bottom: 10px; text-transform: uppercase; letter-spacing: .04em; }

/* Filters bar (in-page, remplace la sidebar filtres du dashboard standalone) */
.gsc-section .gsc-filters { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: flex-end; margin-bottom: 22px; padding: 14px 16px; background: var(--color-card); border: 1px solid var(--color-border); border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.gsc-section .gsc-fgroup { display: flex; flex-direction: column; gap: 5px; min-width: 150px; }
.gsc-section .gsc-fgroup-wide { flex: 1; min-width: 220px; }
.gsc-section .gsc-flabel { font-size: .68rem; font-weight: 700; color: var(--color-neutral); text-transform: uppercase; letter-spacing: .06em; }
.gsc-section .seg { display: inline-flex; border: 1px solid var(--color-border); border-radius: 6px; overflow: hidden; }
.gsc-section .seg button { background: var(--color-card); border: 0; padding: 6px 12px; font-size: .8rem; cursor: pointer; color: var(--color-primary); border-right: 1px solid var(--color-border); font-family: inherit; }
.gsc-section .seg button:last-child { border-right: 0; }
.gsc-section .seg button.active { background: var(--color-primary); color: #fff; }
.gsc-section .gsc-filter-input { padding: 6px 10px; border: 1px solid var(--color-border); border-radius: 6px; font-size: .82rem; width: 100%; font-family: inherit; }
.gsc-section .gsc-filter-hint { font-size: .68rem; color: var(--color-neutral); margin-top: 4px; line-height: 1.4; }
.gsc-section .gsc-filter-hint.active { color: var(--color-success); font-weight: 500; }

/* GSC filters when injected in the SPA sidebar : stacked vertically, compact */
.sidebar-extra { padding: 14px 18px; border-top: 1px solid var(--color-border); margin-top: 8px; display: flex; flex-direction: column; gap: 10px; }
.sidebar-extra .gsc-filters { display: flex; flex-direction: column; gap: 12px; padding: 0; margin: 0; background: transparent; border: none; box-shadow: none; }
.sidebar-extra .gsc-fgroup { display: flex; flex-direction: column; gap: 4px; min-width: 0; width: 100%; }
.sidebar-extra .gsc-flabel { font-size: .62rem; font-weight: 700; color: var(--color-neutral); text-transform: uppercase; letter-spacing: .06em; }
.sidebar-extra .seg { display: flex; flex-wrap: wrap; width: 100%; border: 1px solid var(--color-border); border-radius: 6px; overflow: hidden; }
.sidebar-extra .seg button { flex: 1 1 auto; background: var(--color-card); border: 0; padding: 5px 6px; font-size: .72rem; cursor: pointer; color: var(--color-primary); border-right: 1px solid var(--color-border); font-family: inherit; min-width: 0; }
.sidebar-extra .seg button:last-child { border-right: 0; }
.sidebar-extra .seg button.active { background: var(--color-primary); color: #fff; }
.sidebar-extra .gsc-filter-input { padding: 6px 8px; border: 1px solid var(--color-border); border-radius: 6px; font-size: .78rem; width: 100%; font-family: inherit; box-sizing: border-box; }
.sidebar-extra .gsc-filter-hint { font-size: .64rem; color: var(--color-neutral); margin-top: 2px; }

/* Coverage banner (Anonymized) */
.gsc-section .coverage { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: center; padding: 12px 16px; border-radius: 8px; margin-bottom: 20px; border: 1px solid; font-size: .82rem; line-height: 1.45; }
.gsc-section .coverage .badge { font-size: 1.6rem; font-weight: 700; min-width: 64px; text-align: center; padding: 4px 0; border-radius: 6px; }
.gsc-section .coverage .body strong { font-weight: 700; }
.gsc-section .coverage .body .tier { display: inline-block; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 2px 7px; border-radius: 3px; vertical-align: middle; margin-left: 6px; }
.gsc-section .coverage.good   { background: #ecfdf3; border-color: #abefc6; color: #166534; }
.gsc-section .coverage.good   .badge { background: #16a34a; color: #fff; }
.gsc-section .coverage.good   .tier  { background: #16a34a; color: #fff; }
.gsc-section .coverage.normal { background: #f5f7fb; border-color: #d4dae6; color: #3a3f4d; }
.gsc-section .coverage.normal .badge { background: #5b6478; color: #fff; }
.gsc-section .coverage.normal .tier  { background: #5b6478; color: #fff; }
.gsc-section .coverage.warn   { background: #fff8eb; border-color: #f5d68b; color: #7c4a03; }
.gsc-section .coverage.warn   .badge { background: #d68b13; color: #fff; }
.gsc-section .coverage.warn   .tier  { background: #d68b13; color: #fff; }
.gsc-section .coverage.alert  { background: #fef2f2; border-color: #fca5a5; color: #991b1b; }
.gsc-section .coverage.alert  .badge { background: #dc2626; color: #fff; }
.gsc-section .coverage.alert  .tier  { background: #dc2626; color: #fff; }

/* Grids */
.gsc-section .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 980px) { .gsc-section .grid-2 { grid-template-columns: 1fr; } }
.gsc-section .portfolio-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 16px; align-items: stretch; }
@media (max-width: 980px) { .gsc-section .portfolio-grid { grid-template-columns: 1fr; } }
.gsc-section .portfolio-cards { display: flex; flex-direction: column; gap: 12px; }
.gsc-section .portfolio-cards .card { flex: 1; }
.gsc-section .portfolio-cards .card .value { font-size: 1.9rem; }

/* Cards */
.gsc-section .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.gsc-section .card { background: var(--color-card); border: 1px solid var(--color-border); border-radius: 8px; padding: 14px 16px; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.gsc-section .card .label { font-size: .68rem; color: var(--color-neutral); text-transform: uppercase; letter-spacing: .04em; }
.gsc-section .card .value { font-size: 1.55rem; font-weight: 700; margin-top: 4px; line-height: 1.1; font-family: var(--font-display); }
.gsc-section .card .delta { font-size: .76rem; margin-top: 4px; display: inline-block; }
.gsc-section .card .sub { font-size: .68rem; color: var(--color-neutral); margin-top: 2px; }
.gsc-section .delta.up   { color: var(--color-success); }
.gsc-section .delta.down { color: var(--color-danger); }
.gsc-section .delta.flat { color: var(--color-neutral); }

/* Chart boxes */
.gsc-section .chart-box { background: var(--color-card); border: 1px solid var(--color-border); border-radius: 8px; padding: 14px; }
.gsc-section .chart-box h3 { font-size: .78rem; font-weight: 600; color: var(--color-neutral); margin-bottom: 8px; text-transform: uppercase; letter-spacing: .04em; }
.gsc-section .chart-box canvas { max-height: 260px; }

/* Tables */
.gsc-section .table-card { background: var(--color-card); border: 1px solid var(--color-border); border-radius: 8px; overflow: hidden; }
.gsc-section .table-card h3 { font-size: .8rem; font-weight: 600; color: var(--color-neutral); padding: 14px 18px 0; text-transform: uppercase; letter-spacing: .04em; }
.gsc-section .table-card .note { font-size: .76rem; color: var(--color-neutral); padding: 6px 18px 14px; line-height: 1.5; }
.gsc-section .table-card h3 + .table-scroll, .gsc-section .table-card h3:last-child { padding-top: 0; }
.gsc-section .table-card h3:only-child { padding-bottom: 14px; }
.gsc-section .table-scroll { overflow: auto; max-height: 480px; }
.gsc-section .table-scroll table thead th { position: sticky; top: 0; z-index: 4; }
.gsc-section .table-scroll table thead th:first-child { z-index: 5; }
.gsc-section table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .8rem; }
.gsc-section th, .gsc-section td { padding: 7px 10px; text-align: left; border-bottom: 1px solid var(--color-border); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 380px; background: var(--color-card); }
.gsc-section th { background: var(--table-header-bg); color: var(--table-header-text); cursor: pointer; user-select: none; font-weight: 600; font-size: .75rem; }
/* Sticky first column for horizontal scroll */
.gsc-section th:first-child, .gsc-section td:first-child { position: sticky; left: 0; z-index: 2; box-shadow: 2px 0 4px -2px rgba(0,0,0,.08); }
.gsc-section thead th:first-child { z-index: 3; background: var(--table-header-bg); }
.gsc-section tbody tr:nth-child(even) td { background: var(--table-row-alt); }
.gsc-section tbody tr:nth-child(even) td:first-child { background: var(--table-row-alt); }
.gsc-section .drill td { background: #f0eee9 !important; }
.gsc-section .drill td:first-child { background: #f0eee9 !important; }
.gsc-section th.sortable::after { content: " \2195"; opacity: .4; font-size: .8em; }
.gsc-section th.sorted-asc::after { content: " \2191"; opacity: 1; }
.gsc-section th.sorted-desc::after { content: " \2193"; opacity: 1; }
.gsc-section td.num { text-align: right; font-variant-numeric: tabular-nums; }
.gsc-section .brand-tag { display: inline-block; padding: 1px 6px; border-radius: 3px; font-size: .68rem; background: var(--color-accent); color: #fff; vertical-align: middle; }
.gsc-section td.delta-cell.up   { color: var(--color-success); }
.gsc-section td.delta-cell.down { color: var(--color-danger); }

.gsc-section .query-row { cursor: pointer; }
.gsc-section .query-row:hover { background: rgba(0,0,0,.04); }
.gsc-section .drill { background: #f0eee9; }
.gsc-section .drill td { padding: 0; }
.gsc-section .drill ul { list-style: none; padding: 8px 16px 8px 32px; font-size: .76rem; }
.gsc-section .drill li { padding: 3px 0; color: var(--color-neutral); }
.gsc-section .drill li a { color: var(--color-primary); text-decoration: none; }
.gsc-section .drill li a:hover { text-decoration: underline; }

.gsc-section .row-count { padding: 8px 14px; background: var(--color-card); border-top: 1px solid var(--color-border); font-size: .72rem; color: var(--color-neutral); text-align: right; font-variant-numeric: tabular-nums; }

.gsc-section .empty { padding: 32px; text-align: center; color: var(--color-neutral); font-size: .85rem; }

@media (max-width: 820px) {
  .gsc-section .gsc-filters { padding: 12px; gap: 10px 14px; }
  .gsc-section .gsc-fgroup { min-width: 130px; }
  .gsc-section .grid-2, .gsc-section .portfolio-grid { grid-template-columns: 1fr; }
}

@media(max-width:820px){
  header{height:auto;min-height:52px;flex-wrap:wrap;gap:8px 12px;padding:9px 16px}
  header .brand{font-size:1.06rem}
  .hright{margin-left:auto;gap:8px}
  .xnav{order:3;flex-basis:100%;width:100%;flex-wrap:nowrap;overflow-x:auto;gap:5px;padding:1px 0;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .xnav::-webkit-scrollbar{display:none}
  .xnav a{flex-shrink:0;padding:7px 12px;font-size:.78rem;background:rgba(255,255,255,.1);opacity:.9}
  .xnav a span{display:inline}
  .xnav a:hover{background:rgba(255,255,255,.2)}
  .xnav a.active{opacity:1;background:rgba(255,255,255,.26)}
  .xnav-sep{display:none}
  header .last-crawl,header .upd{display:none}
  body{height:auto;overflow:visible}
  .layout{flex-direction:column}
  .sidebar{width:100%;height:auto;border-right:none;border-bottom:1px solid var(--color-border);overflow-y:visible}
  .sidebar-nav{display:flex;overflow-x:auto;padding:0;scrollbar-width:none}
  .sidebar-nav::-webkit-scrollbar{display:none}
  .nav-section{display:none}
  .nav-btn{width:auto;flex-shrink:0;padding:10px 14px;border-left:none;border-bottom:3px solid transparent;white-space:nowrap}
  .nav-btn.active{border-left-color:transparent;border-bottom-color:var(--tab-active-bg);background:none}
  .container{padding:20px 16px 64px}
  .cards{grid-template-columns:repeat(2,1fr)}
  .grid2,.charts,.tables-grid,.overview-grid,.overview-meta{grid-template-columns:1fr}
}
@media(max-width:480px){
  header{padding:8px 13px}
  header .brand{font-size:1rem}
  .xnav a{padding:6px 10px;font-size:.74rem}
  .container{padding:16px 14px 60px}
  .cards{grid-template-columns:1fr}
  .card{padding:14px 16px}
  .card .value{font-size:1.5rem}
  .card.wide{grid-column:span 1}
  .card.wide .value{font-size:1.9rem}
}

/* ===== Section « Crawl SEO » (scopée) ===== */
/* Styles portés depuis sanity-check-julesjenn/index.html (bloc <style> inline). */
/* Tous les selectors ci-dessous sont préfixés par .crawl-section pour éviter les
   collisions avec les autres modules (competitors / geo / gsc). */

/* Cards */
.crawl-section .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 24px; }
.crawl-section .card { background: var(--color-card); border-radius: 8px; padding: 16px 18px; box-shadow: 0 1px 3px rgba(0,0,0,.06); border-top: 3px solid transparent; }
.crawl-section .card.blue   { border-top-color: var(--color-accent); }
.crawl-section .card.green  { border-top-color: var(--color-success); }
.crawl-section .card.orange { border-top-color: var(--color-warning); }
.crawl-section .card.red    { border-top-color: var(--color-danger); }
.crawl-section .card .label { font-size: .7rem; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin-bottom: 7px; }
.crawl-section .card .value { font-size: 1.8rem; font-weight: 700; line-height: 1; }
.crawl-section .card .comparison { display: flex; align-items: center; gap: 5px; margin-top: 7px; font-size: .75rem; }
.crawl-section .prev { color: var(--color-neutral); }
.crawl-section .delta-good { color: var(--color-success); font-weight: 600; }
.crawl-section .delta-bad  { color: var(--color-danger);  font-weight: 600; }
.crawl-section .delta-zero { color: var(--color-neutral); }

/* Charts */
.crawl-section .charts { display: grid; grid-template-columns: repeat(auto-fit, minmax(460px, 1fr)); gap: 16px; margin-bottom: 24px; }
.crawl-section .chart-box { background: var(--color-card); border-radius: 8px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.crawl-section .chart-box.full { grid-column: 1 / -1; }
.crawl-section .chart-box h2 { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin-bottom: 14px; }
.crawl-section canvas { max-height: 200px; }

/* Tables */
.crawl-section .tables-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin-bottom: 24px; }
.crawl-section .table-box { background: var(--color-card); border-radius: 8px; padding: 18px 20px; box-shadow: 0 1px 3px rgba(0,0,0,.06); overflow-x: auto; }
.crawl-section .table-box.full { grid-column: 1 / -1; }
.crawl-section .table-box h2 { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin-bottom: 12px; }
.crawl-section table { width: 100%; border-collapse: collapse; font-size: .81rem; }
.crawl-section thead tr { background: var(--table-header-bg); color: var(--table-header-text); }
.crawl-section th { padding: 8px 10px; text-align: left; font-weight: 600; font-size: .73rem; white-space: nowrap; }
.crawl-section td { padding: 7px 10px; border-top: 1px solid var(--color-border); white-space: nowrap; }
.crawl-section tbody tr:nth-child(even) td { background: var(--table-row-alt); }
.crawl-section tbody tr:hover td { background: #f0f4ff; }
.crawl-section .history-table tbody tr:first-child td { font-weight: 600; }
.crawl-section td.url { max-width: 340px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .78rem; }
.crawl-section td.url a { color: var(--color-accent); text-decoration: none; }
.crawl-section td.url a:hover { text-decoration: underline; }

/* AI Analysis blocks (récap + expert) */
.crawl-section .ai-block { background: var(--color-card); border-radius: 8px; padding: 22px 24px; box-shadow: 0 1px 3px rgba(0,0,0,.06); border-left: 4px solid var(--color-accent); margin-bottom: 32px; }
.crawl-section .ai-block.expert { border-left-color: var(--color-primary); }
.crawl-section .ai-block .ai-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.crawl-section .ai-block .ai-title { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--color-accent); }
.crawl-section .ai-block.expert .ai-title { color: var(--color-primary); }
.crawl-section .ai-block .ai-date { font-size: .73rem; color: var(--color-neutral); }
.crawl-section .ai-block .ai-body { font-size: .85rem; line-height: 1.7; color: var(--color-primary); }
.crawl-section .ai-loading { color: var(--color-neutral); font-size: .83rem; font-style: italic; }

/* Cards wide (Issues / Warnings avec lien) */
.crawl-section .card.wide { grid-column: span 2; display: flex; flex-direction: column; justify-content: space-between; }
.crawl-section .card.wide .value { font-size: 2.4rem; }
.crawl-section .card-link { display: inline-block; margin-top: 10px; font-size: .73rem; font-weight: 600; color: var(--color-accent); text-decoration: none; cursor: pointer; border: none; background: none; font-family: var(--font-family); padding: 0; }
.crawl-section .card-link:hover { text-decoration: underline; }

/* Crawl Overview sections */
.crawl-section .overview-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-bottom: 24px; }
.crawl-section .meta-item { background: var(--color-card); border-radius: 8px; padding: 12px 16px; box-shadow: 0 1px 3px rgba(0,0,0,.06); display: flex; justify-content: space-between; align-items: center; }
.crawl-section .meta-item .mk { font-size: .78rem; color: var(--color-neutral); }
.crawl-section .meta-item .mv { font-size: .88rem; font-weight: 600; }
.crawl-section .section-title { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--header-bg); background: var(--color-bg); padding: 6px 0 4px; margin: 18px 0 8px; border-bottom: 2px solid var(--color-border); }
.crawl-section .overview-section table td:first-child { font-size: .8rem; color: var(--color-primary); max-width: 280px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crawl-section .overview-section table td:nth-child(2) { font-weight: 600; text-align: right; }
.crawl-section .overview-section table td:nth-child(3) { color: var(--color-neutral); font-size: .78rem; text-align: right; }

/* Issues filters bar */
.crawl-section .filter-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.crawl-section .filter-btn { padding: 5px 14px; border-radius: 20px; border: 1px solid var(--color-border); background: var(--color-card); font-family: var(--font-family); font-size: .78rem; cursor: pointer; font-weight: 500; transition: all .15s; }
.crawl-section .filter-btn:hover { border-color: var(--color-accent); color: var(--color-accent); }
.crawl-section .filter-btn.active { background: var(--color-primary); color: #fff; border-color: var(--color-primary); }
.crawl-section .badge { display: inline-block; padding: 1px 7px; border-radius: 10px; font-size: .7rem; font-weight: 700; margin-left: 4px; }
.crawl-section .badge-issue   { background: #fee2e2; color: var(--color-danger); }
.crawl-section .badge-warning { background: #fef3c7; color: #92400e; }
.crawl-section .badge-opport  { background: #dbeafe; color: #1e40af; }
.crawl-section td.issue-type-issue   { color: var(--color-danger);  font-weight: 600; font-size: .75rem; }
.crawl-section td.issue-type-warning { color: var(--color-warning); font-weight: 600; font-size: .75rem; }
.crawl-section td.issue-type-opport  { color: var(--color-accent);  font-weight: 600; font-size: .75rem; }
.crawl-section td.priority-high   { color: var(--color-danger);  font-size: .75rem; }
.crawl-section td.priority-medium { color: var(--color-warning); font-size: .75rem; }
.crawl-section td.priority-low    { color: var(--color-neutral); font-size: .75rem; }
.crawl-section .issue-name { font-size: .81rem; }
.crawl-section .issue-desc { font-size: .73rem; color: var(--color-neutral); max-width: 400px; white-space: normal; line-height: 1.35; }
.crawl-section .clickable-row { cursor: pointer; }
.crawl-section .clickable-row:hover td { background: #eef2ff !important; }

/* Crawl modal drill-down (piggy-backs shared #modal, prefixed classes to avoid clashes) */
#modal .crawl-badge { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: .7rem; font-weight: 700; margin-right: 6px; }
#modal .crawl-badge-issue   { background: #fee2e2; color: var(--color-danger); }
#modal .crawl-badge-warning { background: #fef3c7; color: #92400e; }
#modal .crawl-badge-opport  { background: #dbeafe; color: #1e40af; }
#modal .crawl-badge-neutral { background: #f3f4f6; color: #374151; }
#modal .crawl-modal-h4 { font-size: .72rem; text-transform: uppercase; letter-spacing: .5px; color: var(--color-neutral); margin: 4px 0 8px; font-weight: 700; }
#modal .crawl-modal-p  { font-size: .84rem; line-height: 1.65; color: var(--color-primary); margin-bottom: 16px; white-space: pre-wrap; }
#modal .crawl-modal-p:last-child { margin-bottom: 0; }

@media (max-width: 820px) {
  .crawl-section .charts { grid-template-columns: 1fr; }
  .crawl-section .card.wide { grid-column: span 2; }
  .crawl-section .issue-desc { display: none; }
}
@media (max-width: 480px) {
  .crawl-section .cards { grid-template-columns: 1fr; }
  .crawl-section .card.wide { grid-column: span 1; }
}