:root {
  --bg:#0f1b2d; --panel:#16263d; --panel2:#1d3552; --line:#26405e;
  --text:#e8eef6; --muted:#9fb3c8; --accent:#36c5b0; --accent2:#2aa593;
  --green:#2ecc71; --orange:#f39c12; --red:#e74c3c; --grey:#7f8c9b;
}
* { box-sizing:border-box; }
body { margin:0; font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  background:radial-gradient(1200px 600px at 50% -10%, #163049, #0c1626 60%); color:var(--text); min-height:100vh; }
a { color:var(--accent); }

header { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap;
  gap:12px; padding:20px 24px 0; max-width:1100px; margin:0 auto; }
.brand h1 { margin:0; font-size:1.8rem; letter-spacing:.5px; }
#build-tag { font-size:.62rem; vertical-align:middle; background:var(--accent); color:#06231e; padding:2px 7px; border-radius:999px; font-weight:700; letter-spacing:0; }
.tagline { color:var(--muted); margin:2px 0 0; font-size:.9rem; }
nav { display:flex; gap:4px; background:var(--panel); padding:5px; border-radius:12px; border:1px solid var(--line); }
nav button { background:transparent; border:none; color:var(--muted); padding:9px 16px; border-radius:9px;
  cursor:pointer; font-size:.95rem; font-weight:600; }
nav button:hover { color:var(--text); }
nav button.active { background:var(--accent); color:#06231e; }

main { max-width:1100px; margin:0 auto; padding:18px 24px 70px; }
.tab { display:none; } .tab.active { display:block; }
.hidden { display:none !important; }
.muted { color:var(--muted); } .small { font-size:.85rem; }

/* picker / search */
.picker-row { display:flex; gap:10px; }
#search { flex:1; padding:14px 16px; font-size:1rem; border-radius:12px; background:var(--panel); color:var(--text); border:1px solid var(--line); }
#search:focus { outline:none; border-color:var(--accent); }
.ghost { background:var(--panel); color:var(--text); border:1px solid var(--line); border-radius:12px; padding:0 16px; cursor:pointer; font-weight:600; }
.ghost:hover { border-color:var(--accent); }
.results { list-style:none; margin:8px 0 0; padding:0; background:var(--panel); border-radius:12px; overflow:hidden; border:1px solid var(--line); }
.results li { padding:12px 16px; cursor:pointer; border-bottom:1px solid var(--line); }
.results li:last-child { border-bottom:none; } .results li:hover { background:var(--panel2); }
.results li .reg { color:var(--muted); font-size:.85rem; }
.results li .dist { float:right; color:var(--accent); font-size:.85rem; }

/* forecast */
.forecast { margin-top:16px; }
.wb-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.wb-head h2 { margin:0; font-size:1.5rem; }
.maps-btn { background:var(--accent); color:#06231e; font-weight:700; text-decoration:none; padding:10px 16px; border-radius:10px; white-space:nowrap; }
.conditions { background:var(--panel); padding:12px 16px; border-radius:12px; margin:14px 0; border:1px solid var(--line); }
.cards { display:flex; gap:14px; overflow-x:auto; padding-bottom:10px; scroll-snap-type:x proximity; }
.cards .card { flex:0 0 210px; scroll-snap-align:start; }
.card { background:var(--panel); border-radius:16px; overflow:hidden; border:1px solid var(--line); display:flex; flex-direction:column; transition:transform .12s, border-color .12s; cursor:pointer; }
.lg-dot { display:inline-block; width:11px; height:11px; border-radius:50%; vertical-align:middle; margin:0 3px 0 8px; }
.score-legend { font-size:.82rem; color:var(--muted); margin:2px 0 12px; }
.map-legend { font-size:.8rem; color:var(--muted); background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:9px 12px; margin:8px 0; line-height:2; }
.lg-cl { display:inline-block; min-width:22px; height:22px; line-height:22px; text-align:center; border-radius:50%; color:#06231e; font-weight:700; font-size:.72rem; margin:0 2px; }
.lg-cl-s { background:#8fd98f; } .lg-cl-m { background:#f0c14b; } .lg-cl-l { background:#f0a04b; }
.card:hover { transform:translateY(-3px); border-color:var(--accent); }
.card img { width:100%; height:140px; object-fit:cover; background:#0b1422; }
.card .body { padding:14px; display:flex; flex-direction:column; gap:9px; }
.card h3 { margin:0; font-size:1.1rem; } .card .sci { color:var(--muted); font-size:.78rem; font-style:italic; margin-top:-7px; }
.score-row { display:flex; align-items:center; gap:10px; }
.score { font-size:1.9rem; font-weight:800; line-height:1; }
.gauge { flex:1; height:8px; background:#0b1422; border-radius:6px; overflow:hidden; }
.gauge>span { display:block; height:100%; border-radius:6px; }
.badge { display:inline-block; padding:4px 10px; border-radius:999px; font-size:.78rem; font-weight:700; }
.badge.ok { background:rgba(46,204,113,.18); color:var(--green); }
.badge.release { background:rgba(54,197,176,.18); color:var(--accent); }
.badge.prohib { background:rgba(231,76,60,.18); color:var(--red); }
.window b { color:var(--accent); } .window,.meta-line,.drivers { font-size:.86rem; } .drivers { color:var(--muted); }
.disclaimer { color:var(--muted); font-size:.82rem; line-height:1.45; margin:18px auto 0; max-width:680px; text-align:center;
  background:rgba(240,192,64,.08); border:1px solid rgba(240,192,64,.28); border-radius:10px; padding:9px 13px; }
.disclaimer a { color:var(--accent); text-decoration:underline; white-space:nowrap; }
.pf-disclaimer { margin-top:8px; }

/* map */
.weather-ctrl { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:10px 14px; margin:8px 0; font-size:.9rem; }
.weather-ctrl label { flex-direction:row; align-items:center; gap:5px; color:var(--text); cursor:pointer; }
.weather-ctrl label em { color:var(--muted); font-style:italic; }
.weather-ctrl .wsep { flex:1 1 auto; min-width:8px; }
.weather-ctrl #rv-play { padding:6px 12px; }
.weather-ctrl #rv-slider { width:140px; }
.weather-ctrl #rv-time { min-width:96px; }
.weather-ctrl .owm-key { background:#0b1422; border:1px solid var(--line); border-radius:8px; padding:7px 10px; color:var(--text); width:260px; font-size:.82rem; }
.weather-credit { font-size:.72rem; }
#map { height:62vh; min-height:420px; border-radius:16px; border:1px solid var(--line); margin-top:6px; }
.leaflet-popup-content { font-family:inherit; }

/* species */
.species-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; }
.sp-card { background:var(--panel); border-radius:14px; overflow:hidden; border:1px solid var(--line); cursor:pointer; transition:transform .12s,border-color .12s; }
.sp-card:hover { transform:translateY(-3px); border-color:var(--accent); }
.sp-card img { width:100%; height:110px; object-fit:cover; background:#0b1422; }
.sp-card .n { padding:9px 11px; } .sp-card .n b { display:block; } .sp-card .n span { color:var(--muted); font-size:.8rem; font-style:italic; }
.sp-card .tier { display:inline-block; margin-top:4px; font-size:.7rem; padding:2px 7px; border-radius:999px; }
.tier.scored { background:rgba(54,197,176,.18); color:var(--accent); } .tier.catalogued { background:rgba(127,140,155,.18); color:var(--grey); }

/* appâts */
.baits-cat { margin:18px 0 8px; color:var(--accent); }
.baits-row { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px; }
.bait-card { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:15px; }
.bait-card h4 { margin:0 0 6px; font-size:1.1rem; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.fav-btn { background:none; border:none; color:var(--grey); font-size:1.25rem; cursor:pointer; padding:0 2px; line-height:1; }
.fav-btn:hover { color:#f1c40f; } .fav-btn.on { color:#f1c40f; }
.baits-filter { margin:6px 0 4px; } .baits-filter label { flex-direction:row; gap:6px; align-items:center; color:var(--text); cursor:pointer; }
.bait-tip { margin:0 0 10px; font-size:.9rem; color:var(--text); }
.bait-sp { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.sp-chip { background:rgba(54,197,176,.16); color:var(--accent); border-radius:999px; padding:3px 10px; font-size:.82rem; cursor:pointer; }
.sp-chip:hover { background:rgba(54,197,176,.3); }
.bait-recipe { margin-top:10px; border-top:1px solid var(--line); padding-top:8px; }
.bait-recipe summary { cursor:pointer; color:var(--accent); font-weight:600; font-size:.9rem; }
.bait-recipe p { font-size:.88rem; line-height:1.55; margin:8px 0; color:var(--text); }

/* modal (fiche espèce) */
.modal { position:fixed; inset:0; background:rgba(4,10,18,.75); display:flex; align-items:center; justify-content:center; padding:20px; z-index:1000; }
.modal-card { background:var(--panel); border:1px solid var(--line); border-radius:18px; max-width:560px; width:100%; max-height:88vh; overflow:auto; }
.modal-card img { width:100%; height:230px; object-fit:cover; border-radius:18px 18px 0 0; }
.modal-body { padding:20px; }
.modal-body h2 { margin:0 0 2px; } .modal-body .sci { color:var(--muted); font-style:italic; margin:0 0 12px; }
.kv { display:grid; grid-template-columns:auto 1fr; gap:6px 14px; font-size:.92rem; margin:12px 0; }
.kv b { color:var(--muted); font-weight:600; }
.close-x { float:right; cursor:pointer; color:var(--muted); font-size:1.4rem; line-height:1; }
.attrib { color:var(--muted); font-size:.72rem; margin-top:10px; }

/* carnet */
.auth-forms { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:12px; }
.auth-forms form, .catch-form { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:16px; display:flex; flex-direction:column; gap:10px; }
.auth-forms h3, .catch-form h3 { margin:0 0 4px; }
input, select, textarea { background:#0b1422; color:var(--text); border:1px solid var(--line); border-radius:9px; padding:10px 12px; font-size:.95rem; font-family:inherit; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--accent); }
button { background:var(--accent); color:#06231e; border:none; border-radius:10px; padding:11px 16px; font-weight:700; cursor:pointer; }
button:hover { background:var(--accent2); }
label { display:flex; flex-direction:column; gap:5px; font-size:.85rem; color:var(--muted); }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.log-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.log-head .ghost { padding:8px 14px; }
.gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px; margin-top:8px; }
.catch-item { background:var(--panel); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.catch-item img { width:100%; height:150px; object-fit:cover; background:#0b1422; }
.catch-item .ci { padding:11px; font-size:.88rem; } .catch-item .ci b { font-size:1rem; }
.vis { font-size:.72rem; padding:2px 7px; border-radius:999px; float:right; }
.vis.private { background:rgba(127,140,155,.2); color:var(--grey); } .vis.friends { background:rgba(54,197,176,.18); color:var(--accent); }

/* ───────── Sélecteur de langue ───────── */
.lang-sel { background:#0b1422; color:var(--text); border:1px solid var(--line); border-radius:9px; padding:7px 8px; font-weight:700; cursor:pointer; }

/* ───────── QUIZZ ───────── */
.quiz-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.quiz-head h2 { margin:0; }
.quiz-head-left { display:flex; align-items:center; gap:10px; }
.quiz-mascotte { width:48px; height:48px; object-fit:contain; filter:drop-shadow(0 4px 10px rgba(0,0,0,.3)); animation:lpmFloat 3.2s ease-in-out infinite; }
/* État vide avec mascotte (Pescou) */
.empty-state { text-align:center; padding:30px 16px; }
.empty-state img { width:150px; max-width:55%; height:auto; margin:0 auto 8px; display:block; filter:drop-shadow(0 10px 22px rgba(0,0,0,.4)); animation:lpmFloat 3.2s ease-in-out infinite; }
.empty-state.sm img { width:100px; }
.empty-state p { color:var(--muted); margin:0; }
@media (prefers-reduced-motion: reduce){ .quiz-mascotte, .empty-state img { animation:none; } }
.quiz-score { color:var(--accent); font-weight:700; }
.quiz-card { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:22px; margin:14px 0 22px; }
.quiz-q { font-size:1.25rem; font-weight:600; margin:0 0 16px; }
.quiz-choices { display:grid; gap:12px; }
.quiz-choices button { text-align:left; background:#0b1422; color:var(--text); border:1.5px solid var(--line); border-radius:12px; padding:15px 16px; font-size:1.05rem; cursor:pointer; transition:border-color .12s, background .12s; }
.quiz-choices button:hover:not(:disabled) { border-color:var(--accent); }
.quiz-choices button.good { border-color:var(--green); background:rgba(46,204,113,.16); color:var(--green); font-weight:700; }
.quiz-choices button.bad { border-color:var(--red); background:rgba(231,76,60,.16); color:var(--red); }
.quiz-feedback { margin-top:16px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.quiz-feedback .fb { font-weight:700; } .quiz-feedback .fb.ok { color:var(--green); } .quiz-feedback .fb.no { color:var(--red); }

.quiz-board { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:18px; }
.board-tabs { display:flex; gap:6px; background:#0b1422; padding:5px; border-radius:10px; width:fit-content; margin-bottom:16px; }
.board-tabs button { background:transparent; border:none; color:var(--muted); padding:8px 16px; border-radius:8px; cursor:pointer; font-weight:600; }
.board-tabs button.active { background:var(--accent); color:#06231e; }
.podium { display:flex; align-items:flex-end; justify-content:center; gap:10px; margin:10px 0 18px; min-height:130px; }
.podium .col { display:flex; flex-direction:column; align-items:center; gap:6px; width:30%; max-width:130px; }
.podium .medal { font-size:1.6rem; } .podium .pname { font-weight:700; font-size:.9rem; text-align:center; }
.podium .ppts { color:var(--accent); font-size:.85rem; }
.podium .bar { width:100%; border-radius:10px 10px 0 0; background:linear-gradient(180deg,var(--panel2),#0b1422); border:1px solid var(--line); border-bottom:none; display:flex; align-items:flex-start; justify-content:center; padding-top:8px; font-weight:800; }
.podium .p1 .bar { height:96px; border-color:#f1c40f; } .podium .p2 .bar { height:70px; } .podium .p3 .bar { height:52px; }
.me-card { align-self:center; width:100%; max-width:340px; margin:0 auto; text-align:center; background:linear-gradient(180deg,var(--panel2),#0b1422); border:1px solid var(--line); border-radius:16px; padding:22px 18px; }
.me-card .mc-title { color:var(--muted); font-weight:600; font-size:.9rem; }
.me-card .mc-pts { color:var(--accent); font-weight:800; font-size:2.2rem; margin:6px 0 4px; }
.me-card .mc-sub { color:var(--muted); font-size:.9rem; }
.lb-list { list-style:none; margin:0; padding:0; counter-reset:r; }
.lb-list li { display:flex; align-items:center; gap:10px; padding:9px 10px; border-bottom:1px solid var(--line); }
.lb-list li.me { background:rgba(54,197,176,.12); border-radius:8px; }
.lb-list .rk { width:26px; color:var(--muted); font-weight:700; }
.lb-list .nm { flex:1; } .lb-list .pt { color:var(--accent); font-weight:700; }

/* ───────── LOGIN GATE ───────── */
.gate { position:fixed; inset:0; z-index:2000; overflow-y:auto;
  display:flex; flex-direction:column;
  background:radial-gradient(900px 500px at 50% 0%, #163049, #0a1320 70%); }
.gate-lang-row { position:fixed; top:14px; right:16px; z-index:120; }
.gate-card { background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:30px; width:calc(100% - 32px); max-width:380px; text-align:center; margin:auto; }
.lp-back { display:inline-block; margin:0 0 12px; cursor:pointer; background:none; border:none; color:var(--accent); font-weight:600; }

/* ───────── Page d'accueil (landing premium) ───────── */
#hero-canvas { position:fixed; inset:0; z-index:0; pointer-events:none; }
.lp-vignette { position:fixed; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(ellipse at center, transparent 32%, rgba(4,12,22,.62) 100%); }
.landing { position:relative; z-index:2; width:100%; }
.lp-hero { position:relative; min-height:100vh; display:flex; align-items:center; padding:90px 22px; overflow:hidden; }
.lp-scene { position:absolute; inset:0; width:100%; height:100%; }
.lp-scene-scrim { position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg, rgba(7,15,24,.88) 0%, rgba(7,15,24,.55) 36%, rgba(7,15,24,0) 64%),
             linear-gradient(to bottom, rgba(7,15,24,.35), transparent 26%, transparent 80%, var(--bg)); }
.lp-hero-txt { position:relative; z-index:2; max-width:560px; margin-left:clamp(8px,5vw,80px); text-align:left;
  text-shadow:0 2px 20px rgba(4,10,18,.55); }
/* Panneau auth superposé sur la photo (2 colonnes verre) */
.lp-auth { position:relative; z-index:2; width:100%; max-width:900px; margin:0 auto;
  display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:center;
  background:rgba(9,18,30,.74); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.14); border-radius:22px; padding:30px 34px; box-shadow:0 24px 60px rgba(0,0,0,.5);
  animation:lpFade .4s ease-out; }
.lp-auth-left { text-align:left; }
.lp-auth-eyebrow { display:inline-block; padding:5px 12px; border-radius:99px; background:rgba(54,197,176,.14); border:1px solid rgba(54,197,176,.4); color:var(--accent); font-size:.68rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; }
.lp-auth-title { font-size:clamp(1.5rem,2.6vw,2.1rem); font-weight:800; letter-spacing:-.02em; margin:14px 0 10px; line-height:1.1; }
.lp-auth-intro { color:var(--muted); font-size:.94rem; line-height:1.5; margin:0 0 18px; }
.lp-auth .gate-tabs { margin-bottom:12px; }
.lp-auth .lp-back { display:inline-block; margin:0; }
.lp-auth-right .gate-form { gap:12px; }
@media (max-width:760px){
  .lp-auth { grid-template-columns:1fr; gap:16px; padding:24px 20px; max-width:440px; }
  .lp-auth-intro { display:none; }
}
.lp-title { font-size:clamp(2.3rem,5.2vw,4.3rem); font-weight:800; letter-spacing:-.03em; line-height:1.06; margin:0 0 1.1rem;
  opacity:0; transform:translateY(16px); animation:lpFade .8s .15s ease-out forwards; }
.lp-grad { background:linear-gradient(90deg,var(--accent),#7ef0d3 55%,#4aa3df); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
@keyframes lpFade { to{opacity:1;transform:translateY(0);} }
.lp-pitch { font-size:clamp(1.02rem,1.5vw,1.22rem); line-height:1.55; color:var(--muted); max-width:46ch; margin:0 0 2rem;
  opacity:0; transform:translateY(16px); animation:lpFade .8s .35s ease-out forwards; }
.lp-cta { display:flex; gap:14px; flex-wrap:wrap; justify-content:flex-start; opacity:0; transform:translateY(16px); animation:lpFade .8s .5s ease-out forwards; }
/* ── Héro photo + effets animés en surcouche ── */
.lp-photo { position:absolute; inset:-3%; overflow:hidden; transition:transform .25s ease-out; will-change:transform; }
.lp-photo-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  animation:lpKen 26s ease-in-out infinite alternate; will-change:transform; }
@keyframes lpKen { from { transform:scale(1.04) translate(0,0); } to { transform:scale(1.12) translate(-1.6%,-1.2%); } }
.lp-fx { position:absolute; pointer-events:none; mix-blend-mode:screen; }
/* halo de soleil qui respire (positionné sur le soleil de la photo) */
.lp-fx-sun { left:62%; top:30%; width:30%; height:40%; transform:translate(-50%,-50%); border-radius:50%;
  background:radial-gradient(circle, rgba(255,214,130,.38), rgba(255,150,90,.12) 55%, transparent 72%); animation:lpSun 5.5s ease-in-out infinite; }
@keyframes lpSun { 0%,100%{ opacity:.55; transform:translate(-50%,-50%) scale(1);} 50%{ opacity:1; transform:translate(-50%,-50%) scale(1.14);} }
/* scintillement qui balaie l'eau */
.lp-fx-shimmer { left:0; right:0; bottom:0; height:58%;
  background:linear-gradient(108deg, transparent 42%, rgba(255,240,205,.10) 50%, transparent 58%); background-size:260% 100%; animation:lpShimSweep 7s ease-in-out infinite; }
@keyframes lpShimSweep { 0%{ background-position:125% 0;} 100%{ background-position:-45% 0;} }
/* ondes subtiles sur le poisson qui saute (côté droit de la photo) */
.lp-fx-ripple { left:76%; top:74%; width:120px; height:36px; transform:translate(-50%,-50%); }
.lp-fx-ripple span { position:absolute; inset:0; border:2px solid rgba(210,255,244,.5); border-radius:50%; opacity:0; animation:lpRing 4.6s ease-out infinite; }
.lp-fx-ripple span:nth-child(2){ animation-delay:.6s; }
@keyframes lpRing { 0%{ transform:scale(.25); opacity:0;} 14%{ opacity:.5;} 100%{ transform:scale(1.9); opacity:0;} }
@media (prefers-reduced-motion: reduce){
  .lp-photo-img,.lp-fx-sun,.lp-fx-shimmer,.lp-fx-ripple span { animation:none; }
  .lp-fx-ripple span { opacity:0; }
}
.lp-btn { display:inline-flex; align-items:center; gap:9px; padding:14px 26px; border-radius:9999px; font-weight:700; font-size:1rem; cursor:pointer; border:none; transition:transform .2s, box-shadow .2s, background .2s; font-family:inherit; }
.lp-btn.primary { background:linear-gradient(135deg,var(--accent),#4aa3df); color:#04121a; box-shadow:0 6px 24px -8px rgba(54,197,176,.6); animation:lpCtaPulse 3s ease-in-out infinite; }
@keyframes lpCtaPulse { 0%,100%{box-shadow:0 6px 24px -8px rgba(54,197,176,.6),0 0 0 0 rgba(54,197,176,.4);} 50%{box-shadow:0 6px 24px -8px rgba(54,197,176,.7),0 0 0 13px rgba(54,197,176,0);} }
.lp-btn.primary:hover { transform:translateY(-2px) scale(1.02); }
.lp-btn.ghost { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16); color:var(--text); }
.lp-btn.ghost:hover { background:rgba(255,255,255,.14); transform:translateY(-2px); }
.lp-arrow { transition:transform .2s; } .lp-btn:hover .lp-arrow { transform:translateX(4px); }
.lp-stats { display:flex; gap:30px; flex-wrap:wrap; justify-content:center; margin-top:42px; opacity:0; animation:lpFade 1s 1.7s ease-out forwards; }
.lp-stat .n { font-size:1.5rem; font-weight:800; color:var(--accent); }
.lp-stat .lbl { font-size:.66rem; color:var(--muted); letter-spacing:2px; text-transform:uppercase; }
.lp-scroll { position:absolute; bottom:18px; left:50%; transform:translateX(-50%); color:var(--muted); font-size:.72rem; letter-spacing:2px;
  opacity:0; animation:lpFade 1s 2.1s ease-out forwards, lpBounce 2s 3s ease-in-out infinite; }
@keyframes lpBounce { 0%,100%{transform:translateX(-50%) translateY(0);} 50%{transform:translateX(-50%) translateY(5px);} }
.lp-feats { position:relative; z-index:3; background:var(--bg); padding:74px 22px 30px; }
.lp-feats::before { content:""; position:absolute; left:0; right:0; top:-70px; height:70px; pointer-events:none; background:linear-gradient(to bottom, transparent, var(--bg)); }
.lp-feats-head { text-align:center; max-width:680px; margin:0 auto 50px; }
.lp-kicker { color:var(--accent); font-size:.74rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; margin-bottom:10px; }
.lp-feats-head h2 { font-size:clamp(1.8rem,4vw,2.7rem); font-weight:800; letter-spacing:-.02em; margin:0 0 12px; }
.lp-feats-head p { color:var(--muted); font-size:1.05rem; line-height:1.5; margin:0; }
.lp-row { max-width:980px; margin:0 auto 56px; display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:center;
  opacity:0; transform:translateY(36px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.lp-row.visible { opacity:1; transform:none; }
.lp-row.reverse { direction:rtl; } .lp-row.reverse > * { direction:ltr; }
.lp-num { display:inline-block; padding:4px 11px; border-radius:99px; background:rgba(54,197,176,.12); border:1px solid rgba(54,197,176,.3); color:var(--accent); font-weight:800; font-size:.72rem; letter-spacing:1.5px; margin-bottom:13px; }
.lp-row h3 { font-size:clamp(1.4rem,2.4vw,2rem); font-weight:800; letter-spacing:-.02em; line-height:1.15; margin:0 0 11px; }
.lp-row p { color:var(--muted); font-size:1.02rem; line-height:1.6; margin:0; }
.lp-viz { aspect-ratio:4/3; border-radius:18px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(54,197,176,.18);
  background:linear-gradient(135deg, rgba(54,197,176,.10), rgba(74,163,223,.08)); }
.lp-viz .lp-emoji { font-size:clamp(3rem,8vw,5rem); filter:drop-shadow(0 6px 20px rgba(0,0,0,.4)); }
.lp-viz.v2 { background:linear-gradient(135deg, rgba(74,163,223,.12), rgba(54,197,176,.07)); }
.lp-viz.v3 { background:linear-gradient(135deg, rgba(54,197,176,.10), rgba(126,240,211,.08)); }
.lp-viz.v4 { background:linear-gradient(135deg, rgba(74,163,223,.10), rgba(54,197,176,.10)); }
.lp-viz.v5 { background:linear-gradient(135deg, rgba(126,240,211,.10), rgba(74,163,223,.08)); }
.lp-viz.v6 { background:linear-gradient(135deg, rgba(54,197,176,.08), rgba(74,163,223,.12)); }
/* Images des vignettes (photos) avec léger Ken-Burns */
.lp-viz { overflow:hidden; }
.lp-viz-img { width:100%; height:100%; object-fit:cover; display:block; animation:lpKenSlow 22s ease-in-out infinite alternate; will-change:transform; }
.lp-viz.v2 .lp-viz-img, .lp-viz.v4 .lp-viz-img, .lp-viz.v6 .lp-viz-img { animation-duration:26s; animation-direction:alternate-reverse; }
@keyframes lpKenSlow { from { transform:scale(1.02); } to { transform:scale(1.09); } }
@media (prefers-reduced-motion: reduce){ .lp-viz-img { animation:none; } }
/* Mini-maquettes des modules dans les panneaux features */
.lp-mock { width:80%; max-width:250px; background:rgba(8,18,30,.72); border:1px solid var(--line); border-radius:14px; padding:14px; box-shadow:0 14px 34px rgba(0,0,0,.4); }
.m-score .ms-top { display:flex; justify-content:space-between; align-items:center; }
.m-score .ms-ic { font-size:1.5rem; } .m-score .ms-ok { color:var(--accent); font-weight:800; background:rgba(54,197,176,.18); border-radius:6px; padding:1px 8px; font-size:.82rem; }
.m-score .ms-score { font-size:2.5rem; font-weight:800; color:var(--accent); line-height:1.05; margin-top:6px; }
.m-score .ms-gauge { height:7px; background:rgba(255,255,255,.08); border-radius:99px; overflow:hidden; margin:7px 0 10px; }
.m-score .ms-gauge i { display:block; height:100%; width:86%; background:linear-gradient(90deg,var(--accent),#4aa3df); border-radius:99px; }
.m-score .ms-win { font-size:.78rem; color:var(--muted); }
.m-time { text-align:center; }
.m-time .mt-bars { display:flex; align-items:flex-end; justify-content:center; gap:6px; height:96px; }
.m-time .mt-bars i { width:15px; background:rgba(255,255,255,.12); border-radius:4px 4px 0 0; }
.m-time .mt-bars i.hi { background:linear-gradient(180deg,var(--accent),#4aa3df); box-shadow:0 0 12px rgba(54,197,176,.5); }
.m-time .mt-cap { margin-top:9px; font-size:1.1rem; }
.m-map { position:relative; width:80%; max-width:250px; aspect-ratio:3/2; padding:0; overflow:hidden;
  background:radial-gradient(circle at 30% 35%, rgba(74,163,223,.16), transparent 60%), linear-gradient(135deg, rgba(54,197,176,.10), rgba(74,163,223,.06)); }
.m-map .mm-dot { position:absolute; width:9px; height:9px; border-radius:50%; background:var(--accent); box-shadow:0 0 9px var(--accent); transform:translate(-50%,-50%); }
.m-map .mm-dot.b { background:#4aa3df; box-shadow:0 0 9px #4aa3df; }
.m-map .mm-pin { position:absolute; transform:translate(-50%,-92%); font-size:1.4rem; }
.m-fiche { display:flex; gap:13px; align-items:center; }
.m-fiche .mf-photo { width:58px; height:58px; border-radius:12px; background:linear-gradient(135deg, rgba(54,197,176,.28), rgba(74,163,223,.2)); display:flex; align-items:center; justify-content:center; font-size:1.9rem; flex-shrink:0; }
.m-fiche .mf-body { flex:1; display:flex; flex-direction:column; gap:8px; }
.m-fiche .mf-l { height:8px; border-radius:99px; background:rgba(255,255,255,.14); } .m-fiche .mf-l.w1 { width:82%; } .m-fiche .mf-l.w2 { width:55%; background:rgba(255,255,255,.09); }
.m-fiche .mf-tag { align-self:flex-start; font-size:.72rem; color:var(--accent); border:1px solid rgba(54,197,176,.4); border-radius:6px; padding:1px 8px; }
.m-log { display:flex; flex-direction:column; gap:11px; }
.m-log .ml-streak { align-self:flex-start; background:rgba(243,156,18,.16); color:#f39c12; font-weight:800; border-radius:99px; padding:3px 13px; font-size:.95rem; }
.m-log .ml-entry { display:flex; align-items:center; gap:10px; }
.m-log .ml-th { width:36px; height:36px; border-radius:9px; background:rgba(54,197,176,.16); display:flex; align-items:center; justify-content:center; }
.m-log .ml-l { flex:1; height:8px; border-radius:99px; background:rgba(255,255,255,.12); } .m-log .ml-tag { font-size:.74rem; color:var(--accent); }
.m-legal { display:flex; flex-wrap:wrap; gap:9px; align-items:center; justify-content:center; }
.m-legal .mg { font-size:1.5rem; } .m-legal .mg-maille { width:100%; text-align:center; font-size:.78rem; color:var(--muted); margin-top:5px; }
/* ── Animations des maquettes (donnent vie aux modules) ── */
.m-score .ms-gauge i { box-shadow:0 0 10px rgba(54,197,176,.45); }
.m-time { position:relative; overflow:hidden; }
.m-time .mt-bars i.hi { animation:lpmBar 1.8s ease-in-out infinite; }
.m-time .mt-bars i.hi:nth-of-type(4){ animation-delay:.2s; }
@keyframes lpmBar { 0%,100%{ filter:brightness(1); } 50%{ filter:brightness(1.45); } }
.m-time::after { content:""; position:absolute; top:0; bottom:38px; left:-45%; width:45%; pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(54,197,176,.16),transparent); animation:lpmScan 2.8s linear infinite; }
@keyframes lpmScan { to { left:115%; } }
.m-map .mm-dot { animation:lpmPing 2.4s ease-out infinite; }
.m-map .mm-dot:nth-child(2){ animation-delay:.5s; } .m-map .mm-dot:nth-child(3){ animation-delay:1s; }
.m-map .mm-dot:nth-child(4){ animation-delay:1.5s; } .m-map .mm-dot:nth-child(5){ animation-delay:.8s; }
@keyframes lpmPing { 0%{ box-shadow:0 0 0 0 rgba(54,197,176,.5); } 70%,100%{ box-shadow:0 0 0 11px rgba(54,197,176,0); } }
.m-map .mm-pin { animation:lpmBob 2.2s ease-in-out infinite; }
@keyframes lpmBob { 0%,100%{ transform:translate(-50%,-92%); } 50%{ transform:translate(-50%,-112%); } }
.m-fiche .mf-photo { animation:lpmFloat 3s ease-in-out infinite; }
@keyframes lpmFloat { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-5px); } }
.m-fiche .mf-l { position:relative; overflow:hidden; }
.m-fiche .mf-l::after { content:""; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent); animation:lpmShim 2.2s ease-in-out infinite; }
.m-fiche .mf-l.w2::after { animation-delay:.3s; }
@keyframes lpmShim { 0%{ transform:translateX(-100%); } 60%,100%{ transform:translateX(120%); } }
.m-log .ml-streak { animation:lpmGlow 1.7s ease-in-out infinite; }
@keyframes lpmGlow { 0%,100%{ box-shadow:0 0 0 0 rgba(243,156,18,0); transform:scale(1); } 50%{ box-shadow:0 0 14px 0 rgba(243,156,18,.5); transform:scale(1.06); } }
.m-log .ml-th { animation:lpmFloat 2.6s ease-in-out infinite; }
.m-legal .mg { animation:lpmPop 3s ease-in-out infinite; }
.m-legal .mg:nth-child(2){ animation-delay:.45s; } .m-legal .mg:nth-child(3){ animation-delay:.9s; }
@keyframes lpmPop { 0%,30%,100%{ transform:scale(1); filter:brightness(.85); } 12%{ transform:scale(1.22); filter:brightness(1.35) drop-shadow(0 0 8px rgba(54,197,176,.6)); } }
@media (prefers-reduced-motion: reduce){
  .m-time .mt-bars i.hi, .m-time::after, .m-map .mm-dot, .m-map .mm-pin, .m-fiche .mf-photo, .m-fiche .mf-l::after, .m-log .ml-streak, .m-log .ml-th, .m-legal .mg { animation:none; }
}
.lp-final { position:relative; z-index:3; background:var(--bg); padding:60px 22px 90px; text-align:center; }
.lp-final h2 { font-size:clamp(1.7rem,3vw,2.3rem); font-weight:800; letter-spacing:-.02em; margin:0 auto 22px; max-width:20ch; line-height:1.2; }
.lp-reassure { margin-top:20px; display:flex; gap:20px; justify-content:center; flex-wrap:wrap; color:var(--muted); font-size:.85rem; }
.lp-sources { margin-top:26px; font-size:.9rem; opacity:.92; }
/* Sources & méthode (Profil + modale d'accueil) */
.src-list { list-style:none; padding:0; margin:12px 0; display:grid; gap:9px; }
.src-list li { background:rgba(54,197,176,.06); border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:9px; padding:9px 12px; font-size:.9rem; line-height:1.4; }
.src-list li b { color:var(--accent); }
.src-score { margin:12px 0 0; font-size:.9rem; font-style:italic; color:var(--text); }
.src-modal h2 { margin-bottom:10px; }
.src-disc { margin:14px 0 0; font-size:.9rem; }
.src-disc a { color:var(--accent); text-decoration:underline; cursor:pointer; }
/* Avertissement légal (modale d'ouverture) */
.disc-modal h3 { margin:0 0 10px; color:#f0c040; font-size:1.15rem; line-height:1.3; }
.disc-modal p { margin:0 0 16px; font-size:.95rem; line-height:1.55; color:var(--text); }
.disc-modal p b { color:var(--accent); }
.disc-ack { width:100%; background:var(--accent); color:#06231e; border:none; border-radius:12px; padding:13px; font-weight:800; font-size:1.05rem; cursor:pointer; }
.disc-ack:hover { filter:brightness(1.05); }
/* Notifications push (opt-in, Profil) */
.pf-notif { margin-top:10px; }
.pf-notif .pn-on { color:var(--accent); font-weight:600; margin:0 0 10px; }
.pn-actions { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }
.pn-actions .btn-primary { width:auto; }
@media (prefers-reduced-motion: reduce){
  .lp-title,.lp-pitch,.lp-cta,.lp-stats,.lp-scroll,.lp-btn.primary { opacity:1; transform:none; animation:none; }
  .lp-scene .sc-glow,.lp-scene .sc-rays,.lp-scene .sc-shimmer,.lp-scene .sc-reflect,.lp-scene .sc-steam,.lp-scene .sc-clouds,.lp-scene .sc-birds,
  .lp-scene .sc-fish,.lp-scene .rp1,.lp-scene .rp2,.lp-scene .b1,.lp-scene .b2,.lp-scene .b3,.lp-scene .b4 { animation:none; }
  .lp-scene .sc-fish,.lp-scene .rp,.lp-scene .bb { opacity:0; }
  .lp-row { opacity:1; transform:none; transition:none; }
}
@media (max-width:820px){
  .lp-hero { padding:96px 18px 76px; }
  .lp-hero-txt { text-align:center; max-width:620px; margin:0 auto; }
  .lp-cta { justify-content:center; } .lp-pitch { margin-left:auto; margin-right:auto; }
  .lp-scene-scrim { background:linear-gradient(to bottom, rgba(7,15,24,.5), rgba(7,15,24,.3) 38%, rgba(7,15,24,.72) 74%, var(--bg)); }
}
@media (max-width:760px){
  .lp-row { grid-template-columns:1fr; gap:22px; margin-bottom:44px; } .lp-row.reverse { direction:ltr; }
  .lp-viz { aspect-ratio:16/9; }
}
.gate-card h1 { margin:0; font-size:2rem; } .gate-card .tagline { color:var(--muted); margin:4px 0 18px; }
.gate-tabs { display:flex; gap:4px; background:#0b1422; padding:5px; border-radius:12px; margin-bottom:16px; }
.gate-tabs button { flex:1; background:transparent; border:none; color:var(--muted); padding:9px; border-radius:9px; cursor:pointer; font-weight:600; }
.gate-tabs button.active { background:var(--accent); color:#06231e; }
.gate-form { display:flex; flex-direction:column; gap:11px; }
.gate-form button { margin-top:4px; }
.logout { padding:8px 12px !important; font-size:1rem; }

/* ───────── CARNET MANUSCRIT ───────── */
.notebook {
  background:
    linear-gradient(#fbf7ec, #fbf7ec) padding-box,
    repeating-linear-gradient(#fbf7ec, #fbf7ec 30px, #d9e4ec 31px) padding-box;
  background-color:#fbf7ec; color:#243; border-radius:10px; padding:26px 26px 30px 58px;
  position:relative; border:1px solid #cdb; box-shadow:0 14px 40px rgba(0,0,0,.35);
}
.notebook::before { content:""; position:absolute; top:0; bottom:0; left:38px; width:2px; background:#e7a3a3; }
.notebook h3, .notebook .hand-title { font-family:"Caveat",cursive; font-size:1.9rem; color:#7a3b2e; margin:6px 0 12px; font-weight:700; }
.notebook .log-head { color:#6b7a66; font-family:"Patrick Hand",cursive; }
.catch-form { background:transparent !important; border:none !important; padding:0 !important; box-shadow:none; }
.notebook label { color:#5b6b58; font-family:"Patrick Hand",cursive; font-size:1.05rem; gap:7px; }
.notebook input, .notebook select, .notebook textarea {
  background:#fffdf6; color:#243; border:1.5px solid #cdbf9e; border-radius:9px; font-family:"Patrick Hand",cursive;
  font-size:1.2rem; padding:14px 14px; min-height:52px; width:100%;
}
.notebook textarea { min-height:84px; }
.notebook .grid2 { gap:16px; }
.notebook button { padding:16px; font-size:1.5rem; margin-top:6px; }
.notebook input[type=file] { padding:11px 14px; font-size:1rem; }
.notebook input:focus, .notebook select:focus, .notebook textarea:focus { border-color:#7a3b2e; outline:none; }
.notebook button { background:#7a3b2e; color:#fdf6e6; font-family:"Caveat",cursive; font-size:1.25rem; font-weight:700; }
.notebook button:hover { background:#8f4a3a; }
.notebook #catch-msg { color:#6b7a66; }

.gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:22px 16px; margin-top:10px; }
.catch-item {
  background:#fff; padding:10px 10px 0; border-radius:3px; box-shadow:0 6px 16px rgba(0,0,0,.25);
  transform:rotate(var(--rot,-1.4deg)); transition:transform .15s;
}
.catch-item:nth-child(even){ --rot:1.6deg; } .catch-item:nth-child(3n){ --rot:-.8deg; }
.catch-item:hover { transform:rotate(0) scale(1.03); z-index:2; }
.catch-item img { width:100%; height:150px; object-fit:cover; background:#eee; border-radius:2px; }
.catch-item .ci { padding:8px 4px 14px; color:#243; font-family:"Patrick Hand",cursive; font-size:.95rem; }
.catch-item .ci b { font-family:"Caveat",cursive; font-size:1.5rem; color:#7a3b2e; display:block; line-height:1.1; }
.catch-item .ci .muted { color:#7d8a76; }
.vis { font-size:.7rem; padding:2px 7px; border-radius:999px; float:right; font-family:system-ui; }
.vis.private { background:#e5e0cf; color:#7d8a76; } .vis.friends { background:#cdeee7; color:#2a8e7c; }

/* mini-prévision dans la modale (clic carte) */
.mini-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:10px; margin-top:12px; }
.mini { background:#0b1422; border:1px solid var(--line); border-radius:10px; padding:10px; text-align:center; }
.mini-img { width:100%; height:72px; object-fit:cover; border-radius:8px; margin-bottom:6px; background:#16263d; }
.mini .s { font-size:1.5rem; font-weight:800; } .mini .nm { font-size:.85rem; }
.spot-kv { font-size:.9rem; } .spot-kv div { padding:3px 0; border-bottom:1px solid var(--line); }

/* panneau de détail SOUS la carte */
.map-detail { background:var(--panel); border:1px solid var(--accent); border-radius:16px; padding:18px 20px; margin-top:10px; }
.map-detail .detail-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.map-detail .detail-head h2 { margin:0; font-size:1.4rem; }
.map-detail .sci { color:var(--muted); font-style:italic; margin:2px 0 12px; }
.map-detail .detail-actions { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.map-detail .detail-actions .maps-btn { padding:8px 14px; white-space:nowrap; }
.map-detail .close-x { cursor:pointer; color:var(--muted); font-size:1.4rem; line-height:1; }
@media (max-width:680px){
  .map-detail .detail-head { flex-direction:column; }
  .map-detail .detail-actions { width:100%; }
  .map-detail .detail-actions .maps-btn { flex:1; text-align:center; }
}

.desc { line-height:1.5; margin:10px 0; }
.insights { margin:12px 0; } .insights li { margin:4px 0; }
.src-link { font-size:.8rem; }

@media (max-width:680px){
  header { flex-direction:column; align-items:stretch; padding:14px 12px 0; gap:8px; }
  .brand h1 { font-size:1.5rem; }
  nav { width:100%; overflow-x:auto; justify-content:flex-start; }
  nav button { padding:9px 13px; white-space:nowrap; }
  main { padding:12px 12px 60px; }
  .grid2 { grid-template-columns:1fr; }
  .cards .card { flex-basis:82%; }                      /* une carte + aperçu de la suivante (swipe) */
  .picker-row { flex-wrap:wrap; }
  #geo-btn { flex:1; padding:12px; }
  .wb-head { flex-direction:column; align-items:flex-start; }
  .maps-btn { width:100%; text-align:center; }
  #map { height:56vh; min-height:340px; }
  .species-grid { grid-template-columns:repeat(auto-fill,minmax(46%,1fr)); }
  .notebook { padding:18px 16px 24px 40px; }
  .notebook::before { left:24px; }
  .gallery { grid-template-columns:1fr 1fr; gap:16px 10px; }   /* 2 polaroïds par ligne */
  .catch-item img { height:120px; }
  .modal { padding:0; align-items:flex-end; }                 /* feuille modale en bas */
  .modal-card { max-width:100%; max-height:92vh; border-radius:18px 18px 0 0; }
  .modal-card img { height:180px; border-radius:18px 18px 0 0; }
  .mini-cards { grid-template-columns:1fr 1fr; }
}
@media (max-width:380px){ .gallery { grid-template-columns:1fr; } .species-grid { grid-template-columns:1fr; } }

/* Note de transparence : espèces masquées car incompatibles avec le type de plan d'eau */
.hidden-note { margin: .4rem 0 0; font-size: .85rem; }
.hidden-note summary { cursor: pointer; color: var(--muted, #6b7c8f); user-select: none; }
.hidden-note > div { margin-top: .3rem; font-style: italic; }

/* Filtre opt-in de l'onglet Espèces (par type de plan d'eau) */
.sp-filter { display:flex; align-items:center; gap:.45rem; margin:.2rem 0 .7rem; font-size:.9rem; color:var(--muted,#6b7c8f); cursor:pointer; }
.sp-filter input { accent-color:var(--accent,#36c5b0); }

/* Favoris : spots (header + acces rapide "Mes spots") et especes */
.wb-head-actions { display:flex; align-items:center; gap:10px; }
.wb-head-actions .fav-btn { font-size:1.6rem; }
.my-spots { margin-top:8px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.my-spots:empty { display:none; }
.my-spots-lbl { color:var(--muted); font-size:.82rem; }
.spot-chip { cursor:pointer; background:var(--panel2); border:1px solid var(--line); color:inherit; border-radius:999px; padding:5px 11px; font-size:.85rem; }
.spot-chip:hover { border-color:var(--accent); color:var(--accent); }
.sp-card { position:relative; }
.sp-fav { position:absolute; top:6px; right:6px; background:rgba(6,20,34,.55); border-radius:50%; width:30px; height:30px; display:flex; align-items:center; justify-content:center; }
@media (max-width:600px) { .wb-head-actions { width:100%; } .wb-head-actions .maps-btn { flex:1; } }

/* Tri "autorises d'abord" : les especes interdites (en fin de liste) sont attenuees */
.card.is-prohib { opacity:.62; }
.card.is-prohib:hover { opacity:1; }

/* Panneau Techniques de leurres (onglet Appats) */
.lure-tech { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:6px 14px; margin:6px 0 14px; }
.lure-tech > summary { cursor:pointer; font-weight:700; padding:8px 0; color:var(--accent); list-style:none; }
.lure-tech > summary::-webkit-details-marker { display:none; }
.lt-body { padding:4px 2px 10px; }
.lt-axis { margin-top:10px; }
.lt-axis h5 { margin:0 0 4px; font-size:.92rem; color:var(--text); border-bottom:1px solid var(--line); padding-bottom:4px; }
.lt-item { margin:6px 0; font-size:.88rem; color:var(--muted); line-height:1.45; }
.lt-item b { color:var(--text); }

/* Badge presence reelle (carnet) sur les cartes Aujourd'hui */
.seen-slot:empty { display:none; }
.seen-badge { display:inline-block; background:rgba(46,204,113,.16); color:var(--green); border:1px solid rgba(46,204,113,.35); border-radius:999px; padding:2px 9px; font-size:.74rem; font-weight:700; }

/* Le saviez-vous ? (carte fait du jour) + quota quizz */
.fact-card { background:linear-gradient(135deg, rgba(54,197,176,.14), rgba(54,197,176,.05)); border:1px solid rgba(54,197,176,.35); border-radius:14px; padding:12px 16px; margin:0 0 12px; }
.fact-title { font-weight:700; color:var(--accent); font-size:.92rem; margin-bottom:4px; }
.fact-text { margin:2px 0 6px; font-size:1.02rem; line-height:1.4; }
.quiz-quota { margin:0 0 10px; font-size:.86rem; }
.quota-done { color:var(--orange); font-weight:700; margin-top:6px; font-size:.9rem; }

/* Le saviez-vous ? — portrait multi-lignes */
.fact-head { margin:2px 0 6px; }
.fact-sp { font-size:1.08rem; font-weight:800; cursor:pointer; color:var(--text); }
.fact-sp:hover { color:var(--accent); }
.fact-sp i { font-weight:400; font-size:.85rem; color:var(--muted); }
.fact-lines { list-style:none; margin:6px 0 8px; padding:0; display:flex; flex-direction:column; gap:5px; }
.fact-lines li { font-size:.92rem; line-height:1.35; }
.fact-lines .ft-ic { display:inline-block; width:1.4em; }
.fact-lines b { color:var(--accent); font-weight:600; }

/* Serie quotidienne (streak) */
.quiz-head-right { display:flex; align-items:center; gap:12px; }
.streak-badge { font-weight:700; color:#f39c12; font-size:.95rem; white-space:nowrap; }
.streak-celebrate { background:rgba(243,156,18,.16); border:1px solid rgba(243,156,18,.45); color:#f39c12; font-weight:700; border-radius:12px; padding:10px 14px; margin:0 0 12px; text-align:center; }

/* Parrainage (Carnet) */
.friends-panel:empty { display:none; }
.friends-panel { background:linear-gradient(135deg, rgba(54,197,176,.10), rgba(54,197,176,.03)); border:1px solid rgba(54,197,176,.25); border-radius:14px; padding:14px 16px; margin:0 0 16px; }
.fr-add-row { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.fr-add-row input { flex:1; min-width:180px; background:#fffdf6; color:#243; border:1.5px solid #cdbf9e; border-radius:10px; padding:11px 13px; font-family:"Patrick Hand",cursive; font-size:1.1rem; min-height:auto; }
.fr-add-row input::placeholder { color:#9a8f74; }
.fr-add-row input:focus { outline:none; border-color:#7a3b2e; }
.fr-msg { margin:6px 0 0; min-height:1.1em; }
.fr-sec { margin:14px 0 4px; font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); }
.fr-list { list-style:none; margin:0; padding:0; }
.fr-row { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--line); }
.fr-row:last-child { border-bottom:none; }
.fr-nm { flex:1; font-weight:600; }
.fr-act { display:flex; gap:6px; flex-shrink:0; }
.fr-act .ghost { padding:5px 12px; font-size:.85rem; }
.fr-empty { padding:8px 0; border:none; }
.referral-panel:empty { display:none; }
.referral-panel { background:linear-gradient(135deg, rgba(54,197,176,.12), rgba(54,197,176,.04)); border:1px solid rgba(54,197,176,.3); border-radius:14px; padding:14px 16px; margin:0 0 16px; }
.ref-title { font-weight:800; color:var(--accent); font-size:1.02rem; }
.ref-sub { margin:4px 0 10px; font-size:.86rem; color:var(--muted); line-height:1.4; }
.ref-code-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.ref-code { background:#0b1422; border:1px dashed var(--accent); color:var(--accent); font-size:1.05rem; font-weight:800; letter-spacing:1px; padding:7px 14px; border-radius:10px; }
.ref-stats { margin:10px 0 0; font-size:.9rem; }
.ref-badge { margin:8px 0 0; font-size:1rem; }
.ref-badge.none { font-size:.86rem; color:var(--muted); }

/* Bouton flottant feedback */
.fab-feedback { position:fixed; right:18px; bottom:18px; z-index:50; width:52px; height:52px; border-radius:50%; border:none; background:var(--accent); color:#06231e; font-size:1.5rem; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,.35); }
.fab-feedback:hover { transform:scale(1.06); }
.fb-form { display:flex; flex-direction:column; gap:10px; margin-top:8px; }
.fb-form select, .fb-form textarea { background:#0b1422; color:var(--text); border:1px solid var(--line); border-radius:10px; padding:10px; font-size:.95rem; font-family:inherit; }
.fb-form label { display:flex; flex-direction:column; gap:4px; color:var(--muted); font-size:.85rem; }

/* Admin : metriques */
.metrics-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px; margin:6px 0 18px; }
.metric { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:14px; }
.m-val { font-size:1.8rem; font-weight:800; color:var(--accent); line-height:1; }
.m-lbl { margin-top:5px; font-weight:600; font-size:.9rem; }
.m-hint { color:var(--muted); font-size:.78rem; margin-top:3px; }
.spark { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:12px 14px; margin-bottom:18px; }
.spark-lbl { color:var(--muted); font-size:.82rem; margin-bottom:8px; }
.spark-bars { display:flex; align-items:flex-end; gap:8px; height:44px; }
.spark-bar { flex:1; background:var(--accent); border-radius:4px 4px 0 0; min-height:6px; }

/* Admin : feedback */
.admin-feedback { display:flex; flex-direction:column; gap:10px; }
.fb-item { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px 14px; }
.fb-item.fb-done { opacity:.55; } .fb-item.fb-rejected { opacity:.4; }
.fb-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:.82rem; color:var(--muted); margin-bottom:6px; }
.fb-tag { font-weight:700; border-radius:999px; padding:2px 9px; font-size:.75rem; }
.fb-tag.idea { background:rgba(54,197,176,.18); color:var(--accent); }
.fb-tag.bug { background:rgba(231,76,60,.18); color:var(--red); }
.fb-who { font-weight:600; color:var(--text); }
.fb-text { font-size:.95rem; line-height:1.4; }
.fb-actions { display:flex; gap:6px; margin-top:8px; flex-wrap:wrap; }
.fb-actions button { background:#0b1422; border:1px solid var(--line); color:var(--muted); border-radius:8px; padding:4px 10px; font-size:.78rem; cursor:pointer; }
.fb-actions button.on { background:var(--accent); color:#06231e; font-weight:700; border-color:var(--accent); }

/* Lien discret (mot de passe oublie) */
.linkish { background:none !important; border:none !important; color:var(--accent); cursor:pointer; font-size:.85rem; padding:4px; text-decoration:underline; }

/* Modal feedback soigne */
.fb-modal { padding-top:6px; }
.fb-modal .fb-h { margin:0 0 4px; font-size:1.3rem; }
.fb-intro { color:var(--muted); font-size:.9rem; margin:0 0 14px; line-height:1.4; }
.fb-seg { display:flex; gap:8px; margin-bottom:12px; }
.fb-seg-btn { flex:1; padding:11px; border-radius:11px; border:1px solid var(--line); background:#0b1422; color:var(--muted); cursor:pointer; font-weight:700; font-size:.92rem; transition:all .12s; }
.fb-seg-btn:hover { border-color:var(--accent); }
.fb-seg-btn.on { background:var(--accent); color:#06231e; border-color:var(--accent); }
.fb-modal textarea { width:100%; box-sizing:border-box; background:#0b1422; color:var(--text); border:1px solid var(--line); border-radius:11px; padding:12px 14px; font-family:inherit; font-size:.95rem; resize:vertical; line-height:1.45; }
.fb-modal textarea:focus { outline:none; border-color:var(--accent); }
.btn-primary { width:100%; margin-top:14px; padding:13px; border:none; border-radius:11px; background:var(--accent); color:#06231e; font-weight:800; font-size:1rem; cursor:pointer; transition:background .12s; }
.btn-primary:hover { background:var(--accent2); }
.fb-status { text-align:center; margin:10px 0 0; min-height:1.1em; font-weight:600; }
/* Profil (onglet) */
.profile { max-width:560px; margin:0 auto; }
.pf-head { display:flex; align-items:center; gap:14px; margin:4px 0 18px; }
.pf-avatar { font-size:2rem; background:var(--panel); width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); }
.pf-head h2 { margin:0; }
.pf-role { display:inline-block; margin-top:5px; font-size:.78rem; font-weight:700; padding:2px 10px; border-radius:999px; background:#1d2c3f; color:var(--muted); }
.pf-role.is-admin { background:var(--accent); color:#06231e; }
.pf-card { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:16px 18px; margin-bottom:14px; }
.pf-card h3 { margin:0 0 10px; font-size:1.1rem; }
.pf-card input, .pf-card select { width:100%; box-sizing:border-box; margin-top:8px; background:#0b1422; color:var(--text); border:1px solid var(--line); border-radius:11px; padding:12px 14px; font-family:inherit; font-size:.95rem; }
.pf-card input:focus, .pf-card select:focus { outline:none; border-color:var(--accent); }
.pf-card input:disabled { opacity:.6; cursor:not-allowed; }
.pf-field { display:block; margin-bottom:4px; }
.pf-field > span { font-size:.85rem; color:var(--muted); }

/* Admin : liste utilisateurs */
.admin-users { display:flex; flex-direction:column; gap:8px; margin-bottom:18px; }
.usr-item { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:11px 14px; }
.usr-item.is-admin { border-color:rgba(54,197,176,.5); background:linear-gradient(135deg, rgba(54,197,176,.08), transparent); }
.usr-main { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.usr-badge { background:var(--accent); color:#06231e; font-weight:800; font-size:.68rem; padding:2px 8px; border-radius:999px; letter-spacing:.5px; }
.usr-mail { color:var(--muted); font-size:.82rem; }
.usr-meta { color:var(--muted); font-size:.78rem; margin-top:4px; }
.usr-actions { margin-top:8px; }
.usr-actions button { background:#0b1422; border:1px solid var(--line); color:var(--accent); border-radius:8px; padding:5px 12px; font-size:.8rem; cursor:pointer; font-weight:600; }
.usr-actions button.danger { color:var(--red); border-color:rgba(231,76,60,.4); }