:root{
    --ink:#101b13;
    --bg:#f4f6f0;
    --surface:#ffffff;
    --surface-alt:#e8f0e6;
    --dark:#cc6600;
    --dark-soft:#b35900;
    --primary:#f39200;
    --primary-dark:#c97600;
    --accent:#009649;
    --red:#d62839;
    --price:#d62839;
    --line: rgba(16,27,19,0.10);
    --shadow-sm: 0 2px 12px rgba(16,27,19,0.07);
    --shadow-md: 0 14px 36px rgba(16,27,19,0.14);
    --radius: 4px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--bg);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3, .display{
    font-family:'Space Grotesk',sans-serif;
    font-weight:600;
    letter-spacing:-0.01em;
    line-height:1.08;
  }
  a{color:inherit;}
  button{font-family:inherit;cursor:pointer;}
  :focus-visible{outline:2px solid var(--primary); outline-offset:2px;}

  /* ---------- Header ---------- */
  header{
    background:rgba(204,102,0,0.75);
    backdrop-filter:blur(14px) saturate(160%);
    -webkit-backdrop-filter:blur(14px) saturate(160%);
    color:#f3f6f1;
    padding:14px 28px;
    display:flex;
    align-items:center;
    gap:24px;
    border-bottom:1px solid rgba(243,246,241,0.08);
    position:sticky; top:0; z-index:40;
    flex-wrap:wrap;
  }
  .logo{
    font-family:'Space Grotesk',sans-serif;
    font-weight:700;
    font-size:24px;
    background:linear-gradient(135deg, var(--accent), #6fd99a);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
    display:flex;
    align-items:baseline;
    gap:2px;
    white-space:nowrap;
  }
  .logo span{
    background:none;
    -webkit-text-fill-color:#f3f6f1;
    color:#f3f6f1;
  }
  .search-wrap{
    flex:1;
    min-width:220px;
    display:flex;
    background:rgba(243,246,241,0.08);
    border:1px solid rgba(243,246,241,0.16);
    border-radius:var(--radius);
    overflow:hidden;
  }
  .search-wrap select{
    border:none;
    background:transparent;
    color:#f3f6f1;
    padding:0 14px;
    font-family:'Inter',sans-serif;
    font-size:14px;
    border-right:1px solid rgba(243,246,241,0.16);
  }
  .search-wrap select option{color:var(--ink);}
  .search-wrap input{
    flex:1;
    border:none;
    padding:12px 16px;
    font-size:15px;
    font-family:'Inter',sans-serif;
    background:transparent;
    color:#f3f6f1;
    min-width:100px;
  }
  .search-wrap input::placeholder{color:rgba(243,246,241,0.5);}
  .search-wrap input:focus{outline:none;}
  .search-wrap button{
    background:var(--accent);
    border:none;
    padding:0 20px;
    font-weight:700;
    color:#fff;
  }
  .search-btn{font-size:16px; display:flex; align-items:center; justify-content:center;}
  .btn-post{
    background:var(--red);
    color:#fff;
    border:none;
    padding:12px 22px;
    border-radius:var(--radius);
    font-weight:700;
    font-size:14px;
    white-space:nowrap;
    box-shadow:0 8px 20px rgba(214,40,57,0.35);
    transition:transform .15s, box-shadow .15s;
    text-decoration:none;
    display:inline-block;
  }
  .btn-post:hover{transform:translateY(-1px); box-shadow:0 10px 26px rgba(214,40,57,0.45);}
  .btn-login{
    display:inline-block;
    background:none;
    border:1px solid rgba(243,246,241,0.3);
    color:#f3f6f1;
    padding:11px 18px;
    border-radius:var(--radius);
    font-weight:600;
    font-size:14px;
    white-space:nowrap;
    text-decoration:none;
    transition:border-color .15s, color .15s;
  }
  .btn-login:hover{border-color:var(--accent); color:var(--accent);}
  .user-chip{
    display:flex;
    align-items:center;
    gap:8px;
    background:rgba(243,246,241,0.08);
    border:1px solid rgba(243,246,241,0.18);
    padding:8px 8px 8px 16px;
    border-radius:var(--radius);
    font-size:14px;
    white-space:nowrap;
  }
  .user-chip span{font-weight:600;}
  .user-chip-name{font-weight:600; color:#f3f6f1; text-decoration:none; cursor:pointer; display:inline-flex; align-items:center; gap:6px;}
  .user-chip-name:hover{text-decoration:underline;}
  .user-chip-avatar{width:22px; height:22px; border-radius:50%; object-fit:cover; flex-shrink:0;}
  .user-chip button, .user-chip a:not(.user-chip-name){
    background:rgba(243,246,241,0.12);
    color:#f3f6f1;
    border:1px solid rgba(243,246,241,0.18);
    padding:6px 13px;
    border-radius:var(--radius);
    font-size:12.5px;
    font-weight:700;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    transition:background .15s;
  }
  .user-chip button:hover, .user-chip a:not(.user-chip-name):hover{background:rgba(243,246,241,0.22);}

  /* ---------- Mes annonces / boost ---------- */
  .mine-list{display:flex; flex-direction:column; gap:12px; margin-top:8px;}
  .mine-row{
    display:flex;
    align-items:center;
    gap:12px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:12px;
    background:var(--surface);
  }
  .mine-row .thumb{width:56px; height:56px; flex-shrink:0; border-radius:2px; font-size:24px;}
  .mine-row-body{flex:1; min-width:0;}
  .mine-badge{
    display:inline-block;
    margin-top:4px;
    font-size:11px;
    font-weight:700;
    padding:3px 9px;
    border-radius:2px;
    background:rgba(243,146,0,0.14);
    color:var(--primary-dark);
  }
  .mine-row-actions{display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end; flex-shrink:0;}
  /* ---------- Messagerie (deux volets, comme sur Leboncoin) ---------- */
  .messages-layout{
    display:grid;
    grid-template-columns:320px 1fr;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--surface);
    overflow:hidden;
    min-height:560px;
  }
  .conv-list-pane{
    border-right:1px solid var(--line);
    overflow-y:auto;
    max-height:720px;
  }
  .conv-list-pane .conv-row{border:none; border-bottom:1px solid var(--line); border-radius:0;}
  .chat-pane{
    display:flex;
    flex-direction:column;
    padding:16px;
    min-width:0;
  }
  .chat-empty{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:rgba(16,27,19,0.45);
    font-size:14px;
    padding:40px 20px;
  }
  @media (max-width:760px){
    .messages-layout{grid-template-columns:1fr; min-height:0;}
    .conv-list-pane{max-height:none;}
    .chat-pane{display:none;}
    .messages-layout.show-thread .conv-list-pane{display:none;}
    .messages-layout.show-thread .chat-pane{display:flex;}
  }
  @media (min-width:761px){
    .chat-back{display:none;}
  }
  .conv-row{
    display:flex;
    align-items:center;
    gap:12px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:12px;
    background:var(--surface);
    cursor:pointer;
    transition:background .12s, border-color .12s;
  }
  .conv-row:hover{background:var(--surface-alt);}
  .conv-row.unread{border-color:rgba(243,146,0,0.4);}
  .conv-row.active{background:var(--surface-alt);}
  .conv-row .thumb{width:52px; height:52px; flex-shrink:0; border-radius:2px; font-size:22px;}
  .conv-row-body{flex:1; min-width:0;}
  .conv-row-body .conv-title{font-size:14px; font-weight:700; margin:0 0 2px;}
  .conv-row-body .conv-other{font-size:12px; color:rgba(16,27,19,0.6); margin:0 0 2px;}
  .conv-row-body .conv-preview{
    font-size:12.5px;
    color:rgba(16,27,19,0.55);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .conv-row.unread .conv-preview{color:var(--ink); font-weight:600;}
  .conv-row-meta{text-align:right; flex-shrink:0;}
  .conv-row-meta .conv-time{font-size:11px; color:rgba(16,27,19,0.45);}
  .conv-unread-dot{
    display:inline-block;
    min-width:18px; height:18px;
    line-height:18px;
    border-radius:999px;
    background:var(--red);
    color:#fff;
    font-size:10.5px;
    font-weight:700;
    text-align:center;
    padding:0 4px;
    margin-top:4px;
  }
  .chat-header{display:flex; align-items:center; gap:10px; margin-bottom:14px;}
  .chat-back{background:var(--surface-alt); border:none; border-radius:2px; width:30px; height:30px; font-size:15px; flex-shrink:0;}
  .chat-header .thumb{width:36px; height:36px; border-radius:2px; font-size:16px; flex-shrink:0;}
  .chat-header-info{min-width:0;}
  .chat-header-info .chat-title{font-size:14.5px; font-weight:700; margin:0;}
  .chat-header-info .chat-sub{font-size:12px; color:rgba(16,27,19,0.55); margin:0;}
  .chat-listing-link{display:flex; align-items:center; gap:10px; min-width:0; cursor:pointer; flex:1;}
  .chat-listing-link:hover .chat-title{text-decoration:underline;}
  .chat-thread{
    display:flex;
    flex-direction:column;
    gap:8px;
    flex:1;
    min-height:0;
    overflow-y:auto;
    padding:4px 2px 12px;
  }
  .chat-bubble{
    max-width:78%;
    padding:9px 13px;
    border-radius:12px;
    font-size:13.5px;
    line-height:1.45;
    white-space:pre-wrap;
    word-break:break-word;
  }
  .chat-bubble.mine{
    align-self:flex-end;
    background:var(--primary);
    color:#fff;
    border-bottom-right-radius:2px;
  }
  .chat-bubble.theirs{
    align-self:flex-start;
    background:var(--surface-alt);
    color:var(--ink);
    border-bottom-left-radius:2px;
  }
  .chat-bubble time{display:block; font-size:10px; opacity:0.7; margin-top:4px;}
  .chat-form{display:flex; gap:8px; margin-top:12px;}
  .chat-form textarea{
    flex:1;
    resize:none;
    font-family:'Inter',sans-serif;
    font-size:13.5px;
    padding:10px 12px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    min-height:44px;
    max-height:100px;
  }
  .chat-form textarea:focus{border-color:var(--primary); outline:none;}
  .chat-form button{
    background:var(--primary);
    color:#fff;
    border:none;
    border-radius:var(--radius);
    padding:0 18px;
    font-weight:700;
    font-size:13.5px;
  }
  .messages-btn-badge{
    display:inline-block;
    min-width:16px; height:16px;
    line-height:16px;
    border-radius:999px;
    background:var(--red);
    color:#fff;
    font-size:10px;
    font-weight:700;
    text-align:center;
    padding:0 4px;
    margin-left:4px;
  }

  .boost-options{display:flex; flex-direction:column; gap:10px; margin-top:10px;}
  .boost-option{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:14px 16px;
    background:var(--surface);
    transition:border-color .15s, box-shadow .15s;
  }
  .boost-option:hover{border-color:rgba(243,146,0,0.4); box-shadow:var(--shadow-sm);}
  .boost-option-info{display:flex; flex-direction:column; gap:2px;}
  .boost-option-info strong{font-size:14px;}
  .boost-option-info span{font-size:12.5px; color:rgba(16,27,19,0.55);}
  .boost-option button:disabled{opacity:0.5; cursor:default;}
  .boost-photos input[type=file]{width:100%; font-size:13px;}

  /* ---------- Moyen de paiement ---------- */
  .method-picker{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin:12px 0;
    padding:14px;
    background:var(--surface-alt);
    border-radius:var(--radius);
  }
  .method-option{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13.5px;
    font-weight:600;
    cursor:pointer;
  }
  .method-option input{width:auto; padding:0; accent-color:var(--primary);}
  .method-phone{
    margin-top:4px;
    font-family:'Inter',sans-serif;
    font-size:14px;
    padding:11px 13px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    width:100%;
    background:var(--surface);
  }
  .manual-transfer-box{
    margin-top:2px;
    padding:12px;
    background:var(--surface);
    border:1px dashed var(--line);
    border-radius:var(--radius);
  }
  .manual-transfer-box p{margin:0 0 8px; font-size:13px;}
  .method-hint{margin:8px 0 0 !important; font-size:12px !important; color:rgba(16,27,19,0.55);}

  /* ---------- Détail d'annonce ---------- */
  .detail-layout{display:flex; gap:28px; align-items:flex-start; flex-wrap:wrap;}
  .detail-main{flex:1; min-width:320px;}
  .detail-sidebar{
    width:300px;
    flex-shrink:0;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
    padding:20px;
    display:flex;
    flex-direction:column;
    gap:16px;
    position:sticky;
    top:24px;
  }
  @media (max-width:760px){
    .detail-sidebar{position:static; width:100%;}
  }
  .detail-gallery{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(100px,1fr));
    gap:6px;
    margin-bottom:14px;
  }
  .detail-gallery img{width:100%; height:100px; object-fit:cover; border-radius:2px;}
  .detail-gallery img:first-child{grid-column:1/-1; height:200px;}

  .detail-section{margin:22px 0; padding-top:18px; border-top:1px solid var(--line);}
  .detail-section-title{font-size:15px; margin:0 0 10px;}
  .detail-description{
    font-size:14.5px;
    line-height:1.65;
    color:rgba(16,27,19,0.82);
    margin:0;
  }
  .listing-map{
    height:200px;
    border-radius:var(--radius);
    overflow:hidden;
    border:1px solid var(--line);
    background:var(--surface-alt);
  }

  .seller-card{display:flex; align-items:center; gap:14px; margin-bottom:14px;}
  .seller-avatar{
    width:52px;
    height:52px;
    border-radius:50%;
    overflow:hidden;
    flex-shrink:0;
    background:var(--surface-alt);
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Space Grotesk',sans-serif;
    font-weight:700;
    font-size:18px;
    color:var(--primary-dark);
  }
  .seller-avatar img{width:100%; height:100%; object-fit:cover; display:block;}
  .seller-name{font-weight:700; font-size:15px; margin:0 0 2px;}
  .seller-meta{font-size:12.5px; color:rgba(16,27,19,0.6); margin:0;}
  .seller-contact-actions{display:flex; flex-direction:column; gap:10px;}
  .seller-contact-actions button, .seller-contact-actions #sellerPhoneWrap{width:100%;}
  .seller-phone-link{
    display:block;
    text-align:center;
    font-weight:700;
    color:var(--primary-dark);
    background:var(--surface-alt);
    padding:11px 18px;
    border-radius:var(--radius);
    text-decoration:none;
    font-size:14.5px;
  }
  .review-row{border-bottom:1px solid var(--line); padding:12px 0;}
  .review-row:last-child{border-bottom:none;}
  .review-row-head{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
  .review-row-head strong{font-size:13.5px;}
  .review-stars{font-size:12px; letter-spacing:1px;}
  .review-comment{font-size:13.5px; color:rgba(16,27,19,0.75); margin:6px 0 0; line-height:1.5;}
  .report-link{
    display:block;
    text-align:center;
    font-size:12.5px;
    color:rgba(16,27,19,0.5);
    text-decoration:underline;
    cursor:pointer;
    margin-top:4px;
  }
  .report-link:hover{color:var(--red);}

  .detail-sidebar-ads{
    display:flex;
    flex-direction:column;
    gap:12px;
    padding-top:16px;
    border-top:1px solid var(--line);
  }
  .detail-ad-slot{
    background:var(--surface-alt);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:12px;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    gap:6px;
    color:rgba(16,27,19,0.55);
    font-size:12.5px;
  }
  .detail-ad-slot .ad-emoji{font-size:24px;}
  .detail-ad-slot strong{color:var(--primary-dark); font-size:13px;}
  .detail-ad-slot small{color:rgba(16,27,19,0.4); font-size:10.5px;}

  /* ---------- Modals ---------- */
  .modal-overlay{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(204,102,0,0.6);
    backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
    /* Doit dépasser le z-index par défaut des contrôles Leaflet (1000 pour
       .leaflet-top/.leaflet-bottom, qui contiennent les boutons +/- de la
       carte) : sinon, comme ces contrôles sont en position absolue dans le
       flux normal de la page, ils remontent au-dessus de la modale (pourtant
       fixed) dès qu'on défile jusqu'à leur hauteur. */
    z-index:2000;
    align-items:center;
    justify-content:center;
    padding:20px;
  }
  .modal-overlay.show{display:flex;}
  .modal-card{
    background:var(--surface);
    border-radius:6px;
    width:100%;
    max-width:420px;
    padding:32px 28px 28px;
    position:relative;
    max-height:92vh;
    overflow-y:auto;
    box-shadow:var(--shadow-md);
  }
  .modal-close{
    position:absolute;
    top:16px; right:16px;
    background:var(--surface-alt);
    border:none;
    width:28px; height:28px;
    border-radius:2px;
    font-size:15px;
    color:var(--ink);
    opacity:0.7;
    line-height:1;
    padding:0;
  }
  .modal-close:hover{opacity:1;}
  .modal-card h2{font-size:23px; margin:0 0 6px;}
  .auth-sub{font-size:13.5px; color:rgba(16,27,19,0.6); margin:0 0 20px;}
  .auth-tabs{
    display:flex;
    gap:4px;
    margin-bottom:22px;
    border-bottom:1px solid var(--line);
  }
  .auth-tab{
    background:none;
    border:none;
    padding:10px 4px 12px;
    margin-right:20px;
    font-size:14.5px;
    font-weight:700;
    color:rgba(16,27,19,0.4);
    border-bottom:2px solid transparent;
  }
  .auth-tab.active{color:var(--primary); border-bottom-color:var(--primary);}
  .auth-form{display:flex; flex-direction:column; gap:14px;}
  .auth-form label{
    font-size:13px;
    font-weight:600;
    color:rgba(16,27,19,0.72);
    display:flex;
    flex-direction:column;
    gap:6px;
  }
  .auth-form input, .auth-form select, .auth-form textarea{
    font-family:'Inter',sans-serif;
    font-size:14.5px;
    padding:11px 13px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--surface);
    color:var(--ink);
    resize:vertical;
  }
  .auth-form input:focus, .auth-form select:focus, .auth-form textarea:focus{border-color:var(--primary); outline:none;}
  .auth-error{color:var(--red); font-size:13px; min-height:4px; font-weight:600;}
  .photo-preview-grid{display:flex; gap:10px; flex-wrap:wrap;}
  .photo-preview{position:relative; width:84px; height:84px; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);}
  .photo-preview img{width:100%; height:100%; object-fit:cover; display:block;}
  .photo-preview-remove{
    position:absolute;
    top:3px; right:3px;
    width:20px; height:20px;
    border:none;
    border-radius:50%;
    background:rgba(204,102,0,0.75);
    color:#fff;
    font-size:11px;
    line-height:1;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .auth-submit{
    background:var(--primary);
    color:#fff;
    border:none;
    padding:13px;
    border-radius:var(--radius);
    font-weight:700;
    font-size:14.5px;
    margin-top:4px;
    box-shadow:0 8px 20px rgba(243,146,0,0.3);
    transition:transform .12s, box-shadow .12s, background .12s;
  }
  .auth-submit:hover{background:var(--primary-dark); transform:translateY(-1px); box-shadow:0 10px 24px rgba(243,146,0,0.4);}
  .btn-outline{
    background:#fff;
    color:var(--ink);
    border:1.5px solid var(--surface-alt);
    padding:11.5px;
    border-radius:var(--radius);
    font-weight:700;
    font-size:14.5px;
    margin-top:4px;
    transition:border-color .12s, color .12s;
  }
  .btn-outline:hover{border-color:var(--primary);}
  .btn-outline.active{background:var(--surface-alt); border-color:var(--primary); color:var(--primary-dark);}
  .auth-switch{font-size:13px; text-align:center; margin:14px 0 0; color:rgba(16,27,19,0.65);}
  .auth-switch a{color:var(--primary); font-weight:700; cursor:pointer; text-decoration:underline;}

  .btn-google{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:12px;
    font-weight:700;
    font-size:14px;
    color:var(--ink);
    transition:background .12s, box-shadow .12s;
  }
  .btn-google:hover{background:var(--surface-alt); box-shadow:var(--shadow-sm);}
  .btn-facebook{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    background:#1877F2;
    border:1px solid #1877F2;
    border-radius:var(--radius);
    padding:12px;
    font-weight:700;
    font-size:14px;
    color:#fff;
    margin-top:10px;
    transition:background .12s, box-shadow .12s;
  }
  .btn-facebook:hover{background:#166fe0; box-shadow:var(--shadow-sm);}
  .auth-divider{
    display:flex;
    align-items:center;
    gap:12px;
    margin:16px 0;
    font-size:12px;
    color:rgba(16,27,19,0.45);
    text-transform:uppercase;
    letter-spacing:0.5px;
  }
  .auth-divider::before, .auth-divider::after{content:""; flex:1; height:1px; background:var(--line);}

  /* ---------- Page de connexion / inscription (indépendante) ---------- */
  .auth-page-wrap{
    display:flex;
    justify-content:center;
    padding:56px 20px;
    background:var(--bg);
    min-height:60vh;
  }
  .auth-page-card{
    background:var(--surface);
    border-radius:6px;
    width:100%;
    max-width:420px;
    padding:36px 32px;
    box-shadow:var(--shadow-md);
    height:fit-content;
  }
  .auth-page-card h2{font-size:23px; margin:0 0 6px;}

  /* ---------- Hero ---------- */
  .hero{
    background:
      radial-gradient(600px 320px at 12% -10%, rgba(0,150,73,0.22), transparent 60%),
      radial-gradient(500px 380px at 90% 0%, rgba(243,146,0,0.4), transparent 65%),
      linear-gradient(180deg, var(--dark), var(--dark-soft));
    color:#f3f6f1;
    padding:72px 28px 52px;
    position:relative;
    overflow:hidden;
  }
  .hero-inner{max-width:920px; position:relative;}
  .hero h1{
    font-size:clamp(34px, 5.4vw, 62px);
    margin:0 0 18px;
    color:#f6f8f5;
  }
  .hero h1 em{
    font-style:normal;
    background:linear-gradient(135deg, var(--accent), #6fd99a);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .hero p{
    font-size:17px;
    max-width:520px;
    color:rgba(243,246,241,0.75);
    margin:0 0 30px;
  }
  .stats{
    display:flex;
    gap:16px;
    flex-wrap:wrap;
    margin-top:8px;
  }
  .stats div{
    background:rgba(243,246,241,0.06);
    border:1px solid rgba(243,246,241,0.14);
    border-radius:var(--radius);
    padding:14px 20px;
  }
  .stats b{display:block; font-family:'Space Grotesk',sans-serif; font-size:26px; color:#fff;}
  .stats span{font-size:12.5px; color:rgba(243,246,241,0.62);}

  /* ---------- Categories ---------- */
  .cats{
    background:var(--surface);
    padding:20px 28px;
    display:flex;
    gap:10px;
    overflow-x:auto;
    border-bottom:1px solid var(--line);
  }
  .cat-pill{
    background:var(--surface);
    border:1px solid var(--line);
    padding:9px 17px;
    border-radius:var(--radius);
    font-size:13.5px;
    font-weight:600;
    white-space:nowrap;
    transition:background .15s, color .15s, border-color .15s, box-shadow .15s;
  }
  .cat-pill.active, .cat-pill:hover{
    background:var(--primary);
    border-color:transparent;
    color:#fff;
    box-shadow:0 6px 16px rgba(243,146,0,0.3);
  }

  /* ---------- Map section ---------- */
  .map-section{
    background:var(--bg);
    padding:8px 28px 40px;
  }
  .section-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    margin:24px 0 16px;
    gap:16px;
    flex-wrap:wrap;
  }
  .section-head h2{font-size:27px; margin:0;}
  .section-head p{margin:4px 0 0; font-size:14px; color:rgba(16,27,19,0.6); max-width:460px;}
  .clear-filter{
    background:var(--surface);
    border:1px solid var(--line);
    padding:8px 16px;
    border-radius:var(--radius);
    font-size:13px;
    font-weight:600;
    display:none;
  }
  .clear-filter.show{display:inline-block;}
  #map{
    height:580px;
    width:100%;
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
  }
  .leaflet-container{background:var(--surface); outline:none;}
  .region-label{
    background:rgba(204,102,0,0.82);
    color:#f3f6f1;
    border:none;
    border-radius:2px;
    padding:5px 10px;
    font-family:'Inter',sans-serif;
    font-size:12px;
    line-height:1.4;
    text-align:center;
    box-shadow:var(--shadow-sm);
    pointer-events:none;
  }
  .region-label strong{font-family:'Space Grotesk',sans-serif; font-weight:600; color:var(--primary);}
  .region-label::before{display:none;}
  .city-label{
    background:var(--surface);
    color:var(--ink);
    border:1px solid var(--line);
    border-radius:2px;
    padding:2px 7px;
    font-family:'Inter',sans-serif;
    font-weight:600;
    font-size:10.5px;
    box-shadow:var(--shadow-sm);
    pointer-events:none;
  }
  .city-label strong{font-family:'Space Grotesk',sans-serif; color:var(--primary);}
  .city-label::before{display:none;}
  .leaflet-control-zoom a{
    color:var(--ink) !important;
    border-radius:2px !important;
  }

  /* ---------- Listings ---------- */
  .listings-section{
    background:var(--bg);
    padding:8px 28px 60px;
  }
  .grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(220px,1fr));
    gap:18px;
    margin-top:8px;
  }
  .card{
    border:1px solid var(--line);
    border-radius:var(--radius);
    overflow:hidden;
    display:flex;
    flex-direction:column;
    background:var(--surface);
    box-shadow:var(--shadow-sm);
    transition:transform .15s, box-shadow .15s;
    position:relative;
  }
  .card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
  .thumb{
    height:130px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:40px;
    overflow:hidden;
    position:relative;
  }
  .fav-btn{
    position:absolute;
    top:8px; left:8px;
    width:30px; height:30px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,0.9);
    border:1px solid var(--line);
    border-radius:2px;
    font-size:15px;
    line-height:1;
    padding:0;
    cursor:pointer;
    z-index:2;
    transition:transform .12s, background .12s;
  }
  .fav-btn:hover{transform:scale(1.08);}
  .fav-btn.active{background:#fff; border-color:#e6435c;}
  .thumb img{width:100%; height:100%; object-fit:cover; display:block;}
  .card-body{padding:14px;}
  .card-cat{
    font-size:11px;
    font-weight:700;
    color:var(--primary-dark);
    text-transform:uppercase;
    letter-spacing:0.4px;
  }
  .card-title{font-size:15px; font-weight:700; margin:6px 0 4px; line-height:1.25;}
  .card-price{font-family:'Space Grotesk',sans-serif; color:var(--price); font-size:19px; margin:2px 0;}
  .card-loc{font-size:12.5px; color:rgba(16,27,19,0.55); display:flex; align-items:center; gap:4px; margin-top:6px;}
  .empty{
    padding:40px 0;
    text-align:center;
    color:rgba(16,27,19,0.5);
    font-size:15px;
    grid-column:1/-1;
  }
  .cat-group{margin-top:32px;}
  .cat-group:first-child{margin-top:0;}
  .cat-group-head{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:12px;
    margin-bottom:4px;
  }
  .cat-group-title{font-size:18px; margin:0;}
  .cat-group-more{
    font-size:13px;
    font-weight:600;
    color:var(--primary-dark);
    text-decoration:none;
    white-space:nowrap;
  }
  .cat-group-more:hover{text-decoration:underline;}

  /* ---------- Les Bons Plans ---------- */
  .deals-section{padding:8px 28px 60px;}
  .deals-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(260px,1fr));
    gap:18px;
    margin-top:8px;
  }
  .deal-card{
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--surface);
    box-shadow:var(--shadow-sm);
    padding:18px;
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:transform .15s, box-shadow .15s;
  }
  .deal-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md);}
  .deal-type-badge{
    display:inline-flex;
    align-self:flex-start;
    align-items:center;
    gap:5px;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.4px;
    padding:4px 9px;
    border-radius:2px;
  }
  .deal-type-badge.promo{background:rgba(243,146,0,0.14); color:var(--primary-dark);}
  .deal-type-badge.offer{background:rgba(47,125,209,0.14); color:#2f7dd1;}
  .deal-type-badge.contest{background:rgba(0,150,73,0.22); color:#00612e;}
  .deal-partner{font-size:11.5px; font-weight:700; color:rgba(16,27,19,0.5); text-transform:uppercase; letter-spacing:0.3px;}
  .deal-title{font-size:15.5px; font-weight:700; margin:0;}
  .deal-desc{font-size:13px; line-height:1.5; color:rgba(16,27,19,0.7); margin:0;}
  .deal-footer{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:6px;}
  .deal-expiry{font-size:11.5px; color:rgba(16,27,19,0.45);}
  .deal-code{
    background:var(--surface-alt);
    border:1.5px dashed var(--primary);
    color:var(--primary-dark);
    font-weight:700;
    font-size:13px;
    padding:7px 12px;
    border-radius:2px;
    cursor:pointer;
    letter-spacing:0.5px;
  }
  .deal-code:hover{background:rgba(243,146,0,0.1);}

  /* ---------- Footer ---------- */
  footer{
    background:var(--dark);
    color:rgba(243,246,241,0.72);
    padding:40px 28px 28px;
    font-size:13.5px;
  }
  .foot-grid{
    display:flex;
    gap:48px;
    flex-wrap:wrap;
    max-width:1000px;
    margin:0 auto 24px;
  }
  .foot-brand{font-family:'Space Grotesk',sans-serif; font-weight:700; color:var(--accent); font-size:19px; margin-bottom:8px;}
  .foot-col h4{font-size:12.5px; color:#f3f6f1; margin:0 0 10px; text-transform:uppercase; letter-spacing:0.5px;}
  .foot-col a{display:block; margin-bottom:6px; opacity:0.82; text-decoration:none; cursor:pointer;}
  .foot-col a:hover{opacity:1; color:var(--accent);}
  .store-badges{display:flex; flex-direction:column; gap:8px;}
  .store-badge{
    display:flex !important;
    align-items:center;
    gap:10px;
    background:#000;
    border:1px solid rgba(243,246,241,0.25);
    border-radius:7px;
    padding:7px 13px;
    margin:0 !important;
    cursor:default;
    opacity:0.9;
  }
  .store-badge:hover{opacity:1; color:inherit !important; border-color:rgba(243,246,241,0.45);}
  .store-badge-icon{width:20px; height:20px; flex-shrink:0; color:#f3f6f1;}
  .store-badge-text{display:flex; flex-direction:column; line-height:1.2;}
  .store-badge-text small{font-size:9.5px; opacity:0.75; color:#f3f6f1;}
  .store-badge-text strong{font-size:13.5px; color:#f3f6f1; font-family:'Space Grotesk',sans-serif;}
  .foot-bottom{
    border-top:1px solid rgba(243,246,241,0.1);
    padding-top:16px;
    text-align:center;
    font-size:12px;
    opacity:0.55;
  }

  /* ---------- Ad slots ---------- */
  .ad-label{
    font-size:10.5px;
    color:rgba(16,27,19,0.4);
    margin:0 0 6px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:0.4px;
  }
  .ad-banner{
    background:var(--bg);
    padding:14px 28px 6px;
  }
  .ad-banner-slot{
    max-width:1100px;
    margin:0 auto;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    min-height:90px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    padding:14px 20px;
    text-align:center;
    color:rgba(16,27,19,0.55);
    font-size:13.5px;
    box-shadow:var(--shadow-sm);
  }
  .ad-banner-slot strong{color:var(--primary-dark); font-size:15px;}
  .map-columns{
    display:flex;
    gap:20px;
    align-items:flex-start;
    flex-wrap:wrap;
  }
  .map-columns #map{flex:1; min-width:300px;}
  .ad-rect{
    width:300px;
    flex-shrink:0;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:16px;
    min-height:580px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    gap:10px;
    color:rgba(16,27,19,0.55);
    font-size:13.5px;
    box-shadow:var(--shadow-sm);
  }
  .ad-rect .ad-emoji{font-size:34px;}
  .ad-rect strong{color:var(--primary-dark); font-size:15px;}
  .ad-rect small{color:rgba(16,27,19,0.4); font-size:11px;}
  .card.sponsored{
    border:1px solid rgba(0,150,73,0.6);
    box-shadow:0 0 0 3px rgba(0,150,73,0.15), var(--shadow-sm);
    position:relative;
  }
  .sponsor-badge{
    position:absolute;
    top:10px; right:10px;
    background:var(--primary);
    color:#fff;
    font-size:10.5px;
    font-weight:700;
    padding:4px 10px;
    border-radius:2px;
  }
  .card.ad-native{
    border:1px dashed rgba(16,27,19,0.22);
    background:var(--surface-alt);
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:230px;
    text-align:center;
    padding:16px;
    box-shadow:none;
  }
  .ad-native-inner strong{display:block; color:var(--primary-dark); font-size:15px; margin:6px 0 4px;}
  .ad-native-inner p{font-size:12.5px; color:rgba(16,27,19,0.55); margin:0;}
  @media (max-width:760px){
    .ad-rect{width:100%; min-height:220px;}
  }

  @media (max-width:640px){
    header{padding:14px 16px;}
    .hero{padding:48px 16px 40px;}
    .cats, .map-section, .listings-section{padding-left:16px; padding-right:16px;}
    footer{padding:32px 16px 20px;}
  }

  /* ---------- Bannière de consentement aux cookies ---------- */
  .cookie-banner{
    position:fixed;
    left:16px; right:16px; bottom:16px;
    z-index:9999;
    background:var(--dark);
    color:#fff;
    border-radius:var(--radius);
    box-shadow:var(--shadow-md);
    padding:16px 20px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:16px;
    max-width:920px;
    margin:0 auto;
  }
  .cookie-banner p{margin:0; font-size:13.5px; line-height:1.5; opacity:0.9; flex:1; min-width:220px;}
  .cookie-banner-actions{display:flex; gap:10px; flex-shrink:0;}
  .cookie-btn{
    border:none;
    border-radius:var(--radius);
    padding:9px 16px;
    font-size:13.5px;
    font-weight:600;
    cursor:pointer;
    font-family:'Inter',sans-serif;
  }
  .cookie-btn-accept{background:var(--accent); color:#fff;}
  .cookie-btn-accept:hover{background:#00a052;}
  .cookie-btn-reject{background:transparent; color:#fff; border:1px solid rgba(255,255,255,0.35);}
  .cookie-btn-reject:hover{background:rgba(255,255,255,0.1);}
  @media (max-width:480px){
    .cookie-banner{flex-direction:column; align-items:stretch;}
    .cookie-banner-actions{justify-content:flex-end;}
  }

  /* ---------- Pages de contenu (à propos, légal, solutions, FAQ) ---------- */
  .page-header{
    background:var(--dark);
    color:#f3f6f1;
    padding:16px 28px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
  }
  .page-header .logo{font-size:22px; text-decoration:none;}
  .back-link{
    color:#f3f6f1;
    opacity:0.85;
    text-decoration:none;
    font-size:13.5px;
    font-weight:600;
    border:1px solid rgba(243,246,241,0.3);
    padding:8px 14px;
    border-radius:var(--radius);
    white-space:nowrap;
  }
  .back-link:hover{opacity:1; border-color:var(--accent); color:var(--accent);}

  .page-hero{
    background:linear-gradient(180deg, var(--dark), var(--dark-soft));
    color:#f3f6f1;
    padding:48px 28px;
  }
  .page-hero h1{font-size:clamp(28px,4vw,42px); margin:0 0 10px;}
  .page-hero p{font-size:15.5px; color:rgba(243,246,241,0.75); max-width:640px; margin:0;}

  .page-content{max-width:760px; margin:0 auto; padding:48px 28px 72px;}

  /* ---------- Pavé publicitaire latéral (pages de contenu) ---------- *
     Généralise le format déjà utilisé sur l'accueil (deux pavés autour de
     la carte) : .page-content garde son propre max-width et se centre
     normalement dans .page-main-col, la colonne restante accueille le
     pavé. Masqué sous 1000px plutôt qu'empilé sous le contenu : un pavé
     300px coincé au-dessus/dessous d'un formulaire mobile serait plus
     gênant qu'utile. */
  .page-with-sidebar{
    display:grid;
    grid-template-columns:1fr 300px;
    align-items:start;
    gap:28px;
    max-width:1550px;
    margin:0 auto;
    padding:0 28px;
  }
  .page-with-sidebar .page-main-col{min-width:0;}
  .page-with-sidebar .page-content{padding-left:0; padding-right:0;}
  .page-sidebar-ad{position:sticky; top:20px;}
  @media (max-width:1000px){
    .page-with-sidebar{grid-template-columns:1fr; padding:0; max-width:none;}
    .page-sidebar-ad{display:none;}
  }
  .page-content h2{font-size:21px; margin:36px 0 14px;}
  .page-content h2:first-child{margin-top:0;}
  .page-content h3{font-size:16px; margin:22px 0 8px;}
  .page-content p{font-size:15px; line-height:1.65; color:rgba(16,27,19,0.82); margin:0 0 14px;}
  .page-content ul{margin:0 0 14px; padding-left:20px;}
  .page-content li{font-size:15px; line-height:1.65; color:rgba(16,27,19,0.82); margin-bottom:6px;}
  .page-content a{color:var(--primary-dark); font-weight:600;}
  .page-content .updated-note{font-size:12.5px; color:rgba(16,27,19,0.5); margin:-8px 0 30px;}

  /* ---------- Mon profil (/profil.html) ---------- */
  .profile-card{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
    padding:24px;
    margin-bottom:28px;
  }
  .profile-card h2{margin:0 0 16px; font-size:18px;}
  .profile-avatar-row{display:flex; align-items:center; gap:18px; margin-bottom:22px; padding-bottom:22px; border-bottom:1px solid var(--line);}
  .profile-avatar{
    width:76px;
    height:76px;
    border-radius:50%;
    overflow:hidden;
    flex-shrink:0;
    background:var(--surface-alt);
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Space Grotesk',sans-serif;
    font-weight:700;
    font-size:24px;
    color:var(--primary-dark);
  }
  .profile-avatar img{width:100%; height:100%; object-fit:cover; display:block;}
  .profile-avatar-actions{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
  .btn-outline-sm{
    display:inline-block;
    border:1.5px solid var(--surface-alt);
    background:#fff;
    color:var(--ink);
    padding:8px 14px;
    border-radius:var(--radius);
    font-weight:700;
    font-size:12.5px;
    cursor:pointer;
    text-decoration:none;
  }
  .btn-outline-sm:hover{border-color:var(--primary); color:var(--primary-dark);}
  .btn-outline-sm.danger{border-color:rgba(214,40,57,0.35); color:var(--red);}
  .btn-outline-sm.danger:hover{background:rgba(214,40,57,0.08); border-color:var(--red);}
  .profile-avatar-actions .auth-error{width:100%; min-height:0;}
  .profile-info-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:18px;}
  .profile-info-grid > div{display:flex; flex-direction:column; gap:3px;}
  .profile-label{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:rgba(16,27,19,0.5);}
  .profile-value{font-size:14.5px; font-weight:600;}
  .profile-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:22px;}
  .profile-actions a, .profile-actions button{
    border:1.5px solid var(--surface-alt);
    background:#fff;
    color:var(--ink);
    padding:10px 18px;
    border-radius:var(--radius);
    font-weight:700;
    font-size:13.5px;
    text-decoration:none;
    cursor:pointer;
  }
  .profile-actions a:hover, .profile-actions button:hover{border-color:var(--primary); color:var(--primary-dark);}
  .profile-actions .danger{border-color:rgba(214,40,57,0.35); color:var(--red);}
  .profile-actions .danger:hover{background:rgba(214,40,57,0.08); border-color:var(--red); color:var(--red);}

  .activity-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px;}
  .activity-card{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
    padding:18px;
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  .activity-card-head{display:flex; align-items:baseline; justify-content:space-between; gap:8px;}
  .activity-card-head h3{margin:0; font-size:14.5px;}
  .activity-count{font-family:'Space Grotesk',sans-serif; font-weight:700; color:var(--primary-dark); font-size:21px;}
  .activity-list{display:flex; flex-direction:column; gap:8px;}
  .activity-item{
    font-size:13px;
    color:rgba(16,27,19,0.75);
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:10px;
  }
  .activity-item span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
  .activity-item strong{color:var(--ink); font-weight:700; flex-shrink:0;}
  .activity-empty{font-size:13px; color:rgba(16,27,19,0.5); margin:0;}
  .activity-link{font-size:12.5px; font-weight:700; color:var(--primary-dark); text-decoration:none; margin-top:auto;}
  .activity-link:hover{text-decoration:underline;}

  /* ---------- Page de recherche (/recherche.html) ---------- */
  .search-hero-form{
    display:flex;
    max-width:640px;
    margin-top:22px;
    background:rgba(243,246,241,0.08);
    border:1px solid rgba(243,246,241,0.16);
    border-radius:var(--radius);
    overflow:hidden;
  }
  .search-hero-form input{
    flex:1; border:none; padding:13px 16px; font-size:15px;
    background:transparent; color:#f3f6f1; font-family:'Inter',sans-serif;
  }
  .search-hero-form input::placeholder{color:rgba(243,246,241,0.5);}
  .search-hero-form input:focus{outline:none;}
  .search-hero-form button{border:none; background:var(--accent); padding:0 22px; font-size:17px;}

  .search-layout{display:flex; gap:24px; align-items:flex-start; flex-wrap:wrap;}
  .search-filters{
    width:260px;
    flex-shrink:0;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
    padding:20px;
    display:flex;
    flex-direction:column;
    gap:14px;
    position:sticky;
    top:24px;
  }
  .search-filters h3{margin:0; font-size:15px;}
  .search-filters label{display:flex; flex-direction:column; gap:5px; font-size:12.5px; font-weight:600; color:rgba(16,27,19,0.7);}
  .search-filters input, .search-filters select{
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:9px 10px;
    font-family:'Inter',sans-serif;
    font-size:13.5px;
    color:var(--ink);
    background:var(--surface);
  }
  .search-filters input:focus, .search-filters select:focus{outline:none; border-color:var(--primary);}
  .search-filters .checkbox-row{flex-direction:row; align-items:center; gap:8px; font-weight:600;}
  .search-filters .checkbox-row input{width:auto; padding:0;}
  .search-filters .filter-actions{display:flex; gap:8px; margin-top:2px;}
  .search-filters .filter-reset, .search-filters .filter-apply{
    flex:1;
    border:none;
    border-radius:var(--radius);
    padding:10px;
    font-weight:700;
    font-size:13px;
  }
  .search-filters .filter-reset{background:var(--surface-alt); color:var(--ink);}
  .search-filters .filter-reset:hover{background:var(--line);}
  .search-filters .filter-apply{background:var(--primary); color:#fff;}
  .search-filters .filter-apply:hover{background:var(--primary-dark);}
  .search-results{flex:1; min-width:280px;}
  .search-results-count{font-size:13.5px; color:rgba(16,27,19,0.6); margin:0 0 14px;}
  @media (max-width:760px){
    .search-filters{position:static; width:100%;}
  }

  .solutions-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(220px,1fr));
    gap:16px;
    margin:20px 0 36px;
  }
  .solution-card{
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:20px;
    background:var(--surface);
    box-shadow:var(--shadow-sm);
  }
  .solution-card .solution-icon{font-size:28px; margin-bottom:10px; display:block;}
  .solution-card h3{margin:0 0 8px; font-size:16px;}
  .solution-card p{margin:0; font-size:13.5px; color:rgba(16,27,19,0.65);}
  .solution-card .solution-cta{
    display:inline-block;
    margin-top:12px;
    font-size:13px;
    font-weight:700;
    color:var(--primary-dark);
  }

  .faq-category{font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; color:var(--primary-dark); margin:32px 0 12px;}
  .faq-category:first-of-type{margin-top:0;}
  .faq-item{
    border:1px solid var(--line);
    border-radius:var(--radius);
    margin-bottom:10px;
    background:var(--surface);
    overflow:hidden;
  }
  .faq-item summary{
    padding:16px 18px;
    font-weight:700;
    font-size:14.5px;
    cursor:pointer;
    list-style:none;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::after{content:"+"; font-size:20px; color:var(--primary); font-weight:400; flex-shrink:0;}
  .faq-item[open] summary::after{content:"\2212";}
  .faq-item .faq-answer{padding:0 18px 16px; font-size:14px; line-height:1.6; color:rgba(16,27,19,0.75);}

  /* ---------- Administration ---------- */
  .admin-stats{display:flex; gap:16px; flex-wrap:wrap; margin:0 0 32px;}
  .admin-stat{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:16px 20px;
    min-width:150px;
    flex:1;
    box-shadow:var(--shadow-sm);
  }
  .admin-stat b{display:block; font-family:'Space Grotesk',sans-serif; font-size:22px; color:var(--primary-dark);}
  .admin-stat span{font-size:12px; color:rgba(16,27,19,0.6);}

  .admin-tabs{display:flex; gap:8px; margin-bottom:24px; flex-wrap:wrap;}
  .admin-tab{background:var(--surface); border:1px solid var(--line); padding:9px 16px; border-radius:var(--radius); font-size:13.5px; font-weight:600;}
  .admin-tab.active{background:var(--primary); color:#fff; border-color:transparent;}

  .admin-table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow-sm);}
  .admin-table{width:100%; border-collapse:collapse; font-size:13.5px;}
  .admin-table th{text-align:left; padding:12px 14px; background:var(--surface-alt); font-size:11px; text-transform:uppercase; letter-spacing:0.4px; color:rgba(16,27,19,0.6); white-space:nowrap;}
  .admin-table td{padding:12px 14px; border-top:1px solid var(--line); vertical-align:middle;}
  .admin-table tr:hover td{background:var(--surface-alt);}
  .admin-badge{display:inline-block; padding:3px 8px; border-radius:2px; font-size:11px; font-weight:700; white-space:nowrap;}
  .admin-badge.on{background:rgba(243,146,0,0.14); color:var(--primary-dark);}
  .admin-badge.off{background:rgba(16,27,19,0.08); color:rgba(16,27,19,0.5);}
  .admin-btn{background:none; border:1px solid var(--line); border-radius:2px; padding:5px 10px; font-size:12px; font-weight:700; cursor:pointer; white-space:nowrap;}
  .admin-btn:hover{background:var(--surface-alt);}
  .admin-btn.danger{color:var(--red); border-color:rgba(214,40,57,0.4);}
  .admin-btn.danger:hover{background:rgba(214,40,57,0.08);}
  .admin-empty{padding:30px; text-align:center; color:rgba(16,27,19,0.5); font-size:14px;}
  .admin-denied{max-width:420px; margin:80px auto; text-align:center; padding:0 20px;}
  .admin-search{margin-bottom:14px;}
  .admin-search input{
    width:100%;
    max-width:360px;
    font-family:'Inter',sans-serif;
    font-size:14px;
    padding:10px 13px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:var(--surface);
    color:var(--ink);
  }
  .admin-search input:focus{border-color:var(--primary); outline:none;}
  .admin-pagination{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    margin-top:14px;
    font-size:12.5px;
    color:rgba(16,27,19,0.6);
  }
  .admin-pagination .admin-btn:disabled{opacity:0.4; cursor:default;}
  .admin-btn.active{background:var(--primary); border-color:var(--primary); color:#fff;}
  .results-pagination{display:flex; gap:6px; flex-wrap:wrap; justify-content:center; margin-top:24px;}
  .results-pagination .admin-btn:disabled{opacity:0.4; cursor:default;}