/* ═══════════════════════════════════════════════
   MIMI & BIBI — Styles v3
   ═══════════════════════════════════════════════ */

:root {
    --primary:#FF6B8A; --primary-light:#FFB3C6; --primary-dark:#D44A6A;
    --primary-glow:rgba(255,107,138,.25); --primary-subtle:rgba(255,107,138,.08);
    --bg:#FFF9FA; --bg-card:#FFF; --bg-sidebar:#FFF;
    --text:#2D2B3A; --text-secondary:#7A7589; --text-light:#B0ABBA;
    --border:rgba(0,0,0,.06);
    --shadow-sm:0 2px 8px rgba(0,0,0,.04); --shadow-md:0 8px 30px rgba(0,0,0,.06); --shadow-lg:0 20px 60px rgba(0,0,0,.08);
    --radius:16px; --radius-sm:10px; --radius-xs:6px;
    --sidebar-w:260px; --tr:.3s cubic-bezier(.4,0,.2,1);
    --bibi-bg:rgba(147,197,253,.15); --bibi-border:rgba(147,197,253,.4);
    --mimi-bg:rgba(255,183,197,.15); --mimi-border:rgba(255,183,197,.4);
}

[data-theme="lavande"] { --primary:#9B72CF; --primary-light:#C9B3E8; --primary-dark:#7B52AF; --primary-glow:rgba(155,114,207,.25); --primary-subtle:rgba(155,114,207,.08); --bg:#FAF8FF; }
[data-theme="ocean"]   { --primary:#4EADC5; --primary-light:#A3D8E6; --primary-dark:#3090A8; --primary-glow:rgba(78,173,197,.25); --primary-subtle:rgba(78,173,197,.08); --bg:#F6FCFE; }
[data-theme="foret"]   { --primary:#5CAB7D; --primary-light:#A8D8B9; --primary-dark:#42895F; --primary-glow:rgba(92,171,125,.25); --primary-subtle:rgba(92,171,125,.08); --bg:#F6FDF9; }
[data-theme="sunset"]  { --primary:#FF8C5A; --primary-light:#FFC4A8; --primary-dark:#D96E3E; --primary-glow:rgba(255,140,90,.25); --primary-subtle:rgba(255,140,90,.08); --bg:#FFFAF6; }
[data-theme="nuit"]    { --primary:#8B7FD4; --primary-light:#B8B0E8; --primary-dark:#6B5FB4; --primary-glow:rgba(139,127,212,.3); --primary-subtle:rgba(139,127,212,.12); --bg:#1A1832; --bg-card:#252344; --bg-sidebar:#1E1C38; --text:#E8E6F0; --text-secondary:#A09BB5; --text-light:#6B6580; --border:rgba(255,255,255,.08); --shadow-sm:0 2px 8px rgba(0,0,0,.2); --shadow-md:0 8px 30px rgba(0,0,0,.3); --shadow-lg:0 20px 60px rgba(0,0,0,.4); }

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overscroll-behavior:none}
body{font-family:'Quicksand',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;transition:background var(--tr),color var(--tr);overscroll-behavior:none}
.dancing{font-family:'Dancing Script',cursive}
::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--primary-light);border-radius:3px}

/* ── SIDEBAR ── */
#sidebar{position:fixed;left:0;top:0;width:var(--sidebar-w);height:100vh;background:var(--bg-sidebar);border-right:1px solid var(--border);display:flex;flex-direction:column;z-index:100;transition:transform var(--tr),background var(--tr);overflow-y:auto}
.sidebar-header{padding:24px 24px 16px;text-align:center}
.logo-text{font-family:'Playfair Display',serif;font-size:1.8rem;font-weight:700;color:var(--text);letter-spacing:1px;display:block}
.logo-robot{font-size:1.4rem;vertical-align:middle;position:relative;top:-3px}
.logo-sub{font-size:.75rem;color:var(--text-secondary);display:block;margin-top:2px}
.nav-links{list-style:none;padding:0 12px;flex:1}
.nav-link{display:flex;align-items:center;gap:12px;padding:10px 16px;border-radius:var(--radius-sm);color:var(--text-secondary);text-decoration:none;font-size:.87rem;font-weight:500;transition:all var(--tr);margin-bottom:2px}
.nav-link:hover,.nav-link.active{background:var(--primary-subtle);color:var(--primary)}
.nav-link.active{font-weight:600}
.nav-icon{font-size:1.1rem;width:22px;text-align:center}
.nav-group{font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-light);padding:14px 16px 4px;margin-top:4px;pointer-events:none}
.sidebar-footer{padding:14px 20px;border-top:1px solid var(--border);display:flex;flex-direction:column;align-items:center;gap:8px}
.user-badge{display:flex;align-items:center;gap:8px;background:var(--primary-subtle);border:1px solid var(--primary-light);border-radius:50px;padding:6px 14px;font-size:.85rem;font-weight:600;color:var(--primary)}
.logout-btn{background:none;border:1px solid var(--border);border-radius:50px;padding:5px 14px;font-size:.8rem;cursor:pointer;color:var(--text-secondary);font-family:'Quicksand',sans-serif;transition:all var(--tr)}
.logout-btn:hover{border-color:#e53e3e;color:#e53e3e}
.footer-text{font-size:.72rem;color:var(--text-light);font-style:italic;text-align:center}

/* Admin elements */
.admin-only{display:none !important}
body.admin-mode .admin-only{display:inline-flex !important}
.admin-btn{background:var(--primary-subtle);color:var(--primary);border:1px solid var(--primary-light);border-radius:50px;padding:8px 18px;font-family:'Quicksand',sans-serif;font-size:.8rem;font-weight:600;cursor:pointer;transition:all var(--tr);margin-top:12px;display:inline-flex;align-items:center;gap:6px}
.admin-btn:hover{background:var(--primary);color:#fff}

/* ── MOBILE ── */
#menu-toggle{display:none;position:fixed;top:12px;left:12px;z-index:200;width:42px;height:42px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;box-shadow:var(--shadow-sm)}
#menu-toggle span{display:block;width:18px;height:2px;background:var(--text);border-radius:2px;transition:all var(--tr)}
#menu-toggle.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
#menu-toggle.open span:nth-child(2){opacity:0}
#menu-toggle.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
#overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:90;backdrop-filter:blur(4px)}

/* ── MODAL ── */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:500;justify-content:center;align-items:center;padding:20px;backdrop-filter:blur(4px)}
.modal-overlay.open{display:flex}
.modal{background:var(--bg-card);border-radius:var(--radius);width:100%;max-width:580px;max-height:88vh;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);animation:fadeInUp .3s ease}
.modal-header{padding:20px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.modal-header h3{font-family:'Playfair Display',serif;font-size:1.15rem}
.modal-close{background:none;border:none;font-size:1.8rem;cursor:pointer;color:var(--text-light);line-height:1}
.modal-body{padding:24px;overflow-y:auto;flex:1}
.modal-footer{padding:14px 24px;border-top:1px solid var(--border);display:flex;gap:12px;justify-content:flex-end;flex-shrink:0}
.modal-body .form-group{margin-bottom:16px}
.modal-body .input-field{width:100%}
.modal-list{display:grid;gap:6px;margin-bottom:16px;max-height:280px;overflow-y:auto}
.modal-list-item{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-xs);padding:10px 14px;display:flex;align-items:center;gap:10px;font-size:.88rem}
.item-text{flex:1;word-break:break-word;outline:none}
.item-text:focus{border-bottom:1px dashed var(--primary)}
.item-actions{display:flex;gap:4px}
.item-actions button{background:none;border:none;cursor:pointer;font-size:1rem;padding:2px;opacity:.6}
.item-actions button:hover{opacity:1}
.order-status.pending{color:#d97706;font-size:.8rem}
.order-status.done{color:#16a34a;font-size:.8rem}

/* ── MAIN CONTENT ── */
#content{margin-left:var(--sidebar-w);min-height:100vh;transition:margin var(--tr)}
.page{display:none;padding:48px 40px;max-width:920px;margin:0 auto;animation:fadeInUp .4s ease}
.page.active{display:block}
@keyframes fadeInUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.page-header{margin-bottom:32px;text-align:center}
.page-header h2{font-family:'Playfair Display',serif;font-size:1.9rem;font-weight:700;margin-bottom:8px}
.page-header h3{font-family:'Playfair Display',serif;font-size:1.2rem;margin-bottom:8px}
.page-desc{color:var(--text-secondary);font-size:.95rem}

/* ── BUTTONS ── */
.btn-primary{background:var(--primary);color:#fff;border:none;border-radius:50px;padding:13px 30px;font-family:'Quicksand',sans-serif;font-size:.93rem;font-weight:700;cursor:pointer;transition:all var(--tr);box-shadow:0 4px 15px var(--primary-glow);display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px var(--primary-glow)}
.btn-primary:active{transform:scale(.97)}
.btn-primary:disabled{opacity:.65;cursor:not-allowed;transform:none;box-shadow:none}
.btn-secondary{background:transparent;color:var(--primary);border:2px solid var(--primary-light);border-radius:50px;padding:11px 26px;font-family:'Quicksand',sans-serif;font-size:.88rem;font-weight:600;cursor:pointer;transition:all var(--tr)}
.btn-secondary:hover{background:var(--primary-subtle);border-color:var(--primary)}

/* ── FORMS ── */
.form-group{margin-bottom:22px}
.form-group label{display:block;font-weight:600;font-size:.88rem;margin-bottom:8px;color:var(--text)}
.input-field{width:100%;padding:13px 18px;border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--text);font-family:'Quicksand',sans-serif;font-size:.93rem;transition:all var(--tr);outline:none}
.input-field:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-glow)}
.input-field::placeholder{color:var(--text-light)}
select.input-field{cursor:pointer}
.status-msg{margin-top:14px;padding:12px 16px;border-radius:var(--radius-sm);font-size:.88rem;font-weight:500;display:none}
.status-msg.success{display:block;background:#e8f9ee;color:#2d8b4e;border:1px solid #b8ecc8}
.status-msg.error{display:block;background:#feeced;color:#c53030;border:1px solid #fbb6b8}
[data-theme="nuit"] .status-msg.success{background:rgba(45,139,78,.15);border-color:rgba(45,139,78,.3)}
[data-theme="nuit"] .status-msg.error{background:rgba(197,48,48,.15);border-color:rgba(197,48,48,.3)}

/* ── HERO / ACCUEIL ── */
#accueil{align-items:center;justify-content:center;min-height:100vh;position:relative;padding:24px}
#accueil.active{display:flex}
.hearts-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.floating-heart{position:absolute;opacity:0;animation:floatUp 7s ease-in infinite;line-height:1}
@keyframes floatUp{0%{opacity:0;transform:translateY(100vh) rotate(0)}10%{opacity:.6}90%{opacity:.6}100%{opacity:0;transform:translateY(-20vh) rotate(360deg)}}
.hero{text-align:center;position:relative;z-index:1;max-width:600px}
.hero-subtitle{font-size:1.3rem;color:var(--primary);margin-bottom:8px}
.hero-title{font-family:'Playfair Display',serif;font-size:3.8rem;font-weight:700;line-height:1.1;margin-bottom:4px}
.heart-pulse{display:inline-block;color:var(--primary);animation:hb 1.5s ease-in-out infinite}
@keyframes hb{0%,100%{transform:scale(1)}15%{transform:scale(1.15)}30%{transform:scale(1)}45%{transform:scale(1.1)}}
.hero-names{font-size:1rem;color:var(--text-secondary);margin-bottom:36px;letter-spacing:2px;text-transform:uppercase;font-weight:300}
.counter-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:28px 36px;box-shadow:var(--shadow-md);margin-bottom:32px}
.counter-label{font-size:.78rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:3px;font-weight:600;margin-bottom:14px}
.counter-numbers{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}
.counter-unit{text-align:center}
.counter-unit span{display:block;font-family:'Playfair Display',serif;font-size:2.4rem;font-weight:700;color:var(--primary);line-height:1;font-variant-numeric:tabular-nums lining-nums;min-width:2.2ch;text-align:center}
.counter-unit small{font-size:.68rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;font-weight:600}
.counter-sep{font-size:1.2rem;color:var(--text-light);padding-bottom:12px}
.counter-sub{margin-top:10px;font-size:.82rem;color:var(--text-light);font-style:italic}
.quick-links{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.quick-btn{background:var(--bg-card);border:1px solid var(--border);border-radius:50px;padding:11px 22px;font-family:'Quicksand',sans-serif;font-size:.88rem;font-weight:600;color:var(--text);cursor:pointer;transition:all var(--tr);box-shadow:var(--shadow-sm)}
.quick-btn:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}

/* ── MOT GENTIL ── */
.mot-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:44px 36px;text-align:center;box-shadow:var(--shadow-md);position:relative;overflow:hidden;margin-bottom:20px}
.mot-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-light),var(--primary),var(--primary-light))}
.mot-card.fallback::before{background:linear-gradient(90deg,#fbbf24,#f59e0b,#fbbf24)}
.mot-date{font-size:.75rem;color:var(--text-light);text-transform:uppercase;letter-spacing:2px;font-weight:600;margin-bottom:14px}
.mot-icon{font-size:2.4rem;margin-bottom:18px;animation:hb 2s ease-in-out infinite}
.mot-text{font-family:'Playfair Display',serif;font-size:1.45rem;font-style:italic;line-height:1.65;max-width:520px;margin:0 auto 18px}
.mot-author{font-size:.88rem;color:var(--primary);font-weight:600}
.mot-history{display:grid;gap:10px;margin-top:16px}
.mot-history-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px 18px;text-align:left}
.mh-date{font-size:.72rem;color:var(--text-light);font-weight:600;text-transform:uppercase;letter-spacing:1px}
.mh-text{font-family:'Playfair Display',serif;font-style:italic;margin-top:6px;font-size:.95rem}

/* ── DATE BOOKING ── */
.date-step{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;animation:fadeInUp .4s ease;width:100%}
.date-question-wrap{text-align:center;max-width:500px}
.date-question-title{font-size:1.2rem;color:var(--primary);margin-bottom:12px;display:block}
.date-big-q{font-family:'Playfair Display',serif;font-size:2rem;margin-bottom:32px;line-height:1.3}
.date-yn-btns{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
.date-yn-yes{background:var(--primary);color:#fff;border:none;border-radius:50px;padding:16px 40px;font-family:'Quicksand',sans-serif;font-size:1.1rem;font-weight:700;cursor:pointer;box-shadow:0 4px 20px var(--primary-glow);transition:all var(--tr)}
.date-yn-yes:hover{transform:translateY(-3px);box-shadow:0 8px 30px var(--primary-glow)}
.date-yn-no{background:var(--bg-card);color:var(--text-secondary);border:2px solid var(--border);border-radius:50px;padding:16px 40px;font-family:'Quicksand',sans-serif;font-size:1.1rem;font-weight:600;cursor:pointer;transition:background var(--tr)}
.date-non-hint{margin-top:20px;color:var(--text-secondary);font-style:italic;font-size:.9rem}
.date-form-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:32px;max-width:480px;width:100%;box-shadow:var(--shadow-sm)}
.time-picker-row{display:flex;align-items:center;gap:8px}
.time-sel{max-width:110px;flex:0 0 auto}
.time-colon{font-size:1.4rem;font-weight:700;color:var(--primary);flex-shrink:0}
.activity-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;width:100%;max-width:680px}
.activity-card{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius-sm);padding:18px 10px;text-align:center;cursor:pointer;font-family:'Quicksand',sans-serif;font-size:1.8rem;transition:all var(--tr);display:flex;flex-direction:column;align-items:center;gap:7px}
.activity-card span{font-size:.78rem;font-weight:600;color:var(--text-secondary)}
.activity-card:hover{border-color:var(--primary-light);transform:translateY(-2px)}
.activity-card.selected{border-color:var(--primary);background:var(--primary-subtle);box-shadow:0 0 0 4px var(--primary-glow)}
.date-success-wrap{text-align:center;max-width:480px}
.date-success-icon{font-size:4rem;margin-bottom:16px;animation:hb .6s ease}
.date-success-wrap h2{font-family:'Playfair Display',serif;font-size:1.8rem;margin-bottom:12px}

/* ── SOUVENIRS (FLIP CARDS) ── */
.souvenirs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;margin-bottom:24px}
.souvenir-flip{aspect-ratio:1;perspective:1000px;cursor:pointer}
.flip-inner{position:relative;width:100%;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d;border-radius:var(--radius);box-shadow:var(--shadow-md)}
.souvenir-flip.flipped .flip-inner{transform:rotateY(180deg)}
.flip-front,.flip-back{position:absolute;inset:0;border-radius:var(--radius);backface-visibility:hidden;overflow:hidden}
.flip-front img{width:100%;height:100%;object-fit:cover}
.flip-back{background:linear-gradient(135deg,var(--primary),var(--primary-dark));display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;transform:rotateY(180deg)}
.flip-caption{color:#fff;font-family:'Playfair Display',serif;font-style:italic;font-size:1rem;text-align:center;line-height:1.5}
.souvenir-author-badge{position:absolute;top:8px;right:8px;font-size:1.2rem;background:rgba(255,255,255,.85);border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center}
.souvenir-del-btn{background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.4);border-radius:50px;color:#fff;padding:6px 14px;font-size:.78rem;cursor:pointer;margin-top:12px;transition:background .2s}
.souvenir-del-btn:hover{background:rgba(229,62,62,.6)}
.souvenir-flip:not(.flipped) .souvenir-del-btn{pointer-events:none;opacity:0}
.souvenirs-empty{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--text-light)}

/* ── TIMELINE ── */
.timeline{position:relative;padding-left:36px}
.timeline::before{content:'';position:absolute;left:13px;top:0;bottom:0;width:3px;background:linear-gradient(to bottom,var(--primary),var(--primary-light));border-radius:3px}
.timeline-item{position:relative;margin-bottom:32px;animation:fadeInUp .5s ease both}
.timeline-item::before{content:'';position:absolute;left:-29px;top:6px;width:14px;height:14px;border-radius:50%;background:var(--primary);border:3px solid var(--bg);box-shadow:0 0 0 3px var(--primary-light)}
.timeline-date{font-size:.72rem;color:var(--primary);font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:5px}
.timeline-content{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:18px 20px;box-shadow:var(--shadow-sm);position:relative}
.timeline-content h3{font-family:'Playfair Display',serif;font-size:1.05rem;margin-bottom:5px;padding-right:60px}
.timeline-content p{font-size:.88rem;color:var(--text-secondary);line-height:1.5}
.tl-added-by{position:absolute;top:10px;right:72px;font-size:1rem}
.tl-actions{position:absolute;top:8px;right:8px;display:flex;gap:4px}
.timeline-edit,.timeline-delete{background:none;border:none;cursor:pointer;font-size:.9rem;padding:3px;opacity:.4;transition:opacity var(--tr)}
.timeline-edit:hover,.timeline-delete:hover{opacity:1}

/* ── REASONS ── */
.reasons-container{display:grid;gap:10px;max-width:620px;margin:0 auto}
.reason-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px 22px;display:flex;align-items:center;gap:14px;box-shadow:var(--shadow-sm);transition:all var(--tr);animation:fadeInUp .4s ease both;position:relative}
.reason-card:hover{transform:translateX(6px);border-color:var(--primary-light)}
.reason-number{font-family:'Playfair Display',serif;font-size:1.6rem;font-weight:700;color:var(--primary-light);min-width:44px;text-align:center}
.reason-text{font-size:.93rem;line-height:1.4;flex:1}
.reason-btns{display:flex;gap:4px;flex-shrink:0;opacity:0;transition:opacity var(--tr)}
.reason-card:hover .reason-btns{opacity:1}
body.admin-mode .reason-btns{opacity:.35}
body.admin-mode .reason-card:hover .reason-btns{opacity:1}
.reason-action{background:none;border:none;cursor:pointer;font-size:.95rem;padding:4px 6px;border-radius:6px;transition:background var(--tr)}
.reason-action:hover{background:var(--primary-subtle)}

/* ── BUCKET LIST & WATCHLIST ── */
.bucket-input-row{display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap}
.bucket-input-row .input-field{flex:1;min-width:180px}
.bucket-list-items{display:grid;gap:8px}
.bucket-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px 18px;display:flex;align-items:center;gap:12px;transition:all var(--tr);animation:fadeInUp .3s ease;flex-wrap:wrap}
.bucket-item.done{opacity:.6}
.bucket-item.done .bucket-text{text-decoration:line-through}
.bucket-by-bibi{background:var(--bibi-bg);border-color:var(--bibi-border)}
.bucket-by-mimi{background:var(--mimi-bg);border-color:var(--mimi-border)}
.bucket-check{width:24px;height:24px;border:2px solid var(--primary-light);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.8rem;transition:all var(--tr);flex-shrink:0;background:transparent;color:transparent}
.bucket-item.done .bucket-check{background:var(--primary);border-color:var(--primary);color:#fff}
.bucket-text{flex:1;font-size:.93rem}
.bucket-type{font-size:1.1rem;flex-shrink:0}
.bucket-meta{font-size:.72rem;color:var(--text-light);flex-shrink:0}
.bucket-delete{background:none;border:none;color:var(--text-light);cursor:pointer;font-size:1.1rem;padding:4px;transition:color var(--tr);flex-shrink:0}
.bucket-delete:hover{color:#e53e3e}

/* ── WATCHLIST extras ── */
.watchlist-add-row{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.watchlist-add-row .input-field{flex:1;min-width:160px}
.watch-type-sel{max-width:140px;flex-shrink:0}
.watch-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.watch-filter{background:transparent;border:2px solid var(--border);border-radius:50px;padding:7px 16px;font-family:'Quicksand',sans-serif;font-size:.82rem;font-weight:600;cursor:pointer;transition:all var(--tr);color:var(--text-secondary)}
.watch-filter.active,.watch-filter:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-subtle)}

/* ── WHEEL ── */
.wheel-container{display:flex;flex-direction:column;align-items:center;gap:20px;margin-bottom:28px}
.wheel-wrapper{position:relative;display:flex;align-items:center;justify-content:center}
.wheel-pointer{position:absolute;top:-16px;font-size:1.8rem;color:var(--primary);z-index:2;text-shadow:0 2px 6px rgba(0,0,0,.15);filter:drop-shadow(0 2px 4px var(--primary-glow))}
#wheel-canvas{border-radius:50%;display:block;max-width:100%;height:auto}
.wheel-spin-btn{margin-top:8px}
.wheel-result{text-align:center;font-family:'Playfair Display',serif;font-size:1.7rem;color:var(--primary);min-height:48px;display:flex;align-items:center;justify-content:center}
.wheel-options h3{font-size:.95rem;margin-bottom:14px;color:var(--text-secondary)}
.wheel-options-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.wheel-option-tag{background:var(--primary-subtle);border:1px solid var(--primary-light);border-radius:50px;padding:7px 14px;font-size:.83rem;display:flex;align-items:center;gap:7px}
.wheel-option-remove{background:none;border:none;color:var(--primary);cursor:pointer;font-size:1rem;line-height:1}

/* ── MIMI COINS ── */
.coin-inline{width:18px;height:18px;vertical-align:middle;margin:0 2px}
.coin-lg{width:40px;height:40px;vertical-align:middle;margin-right:8px}
.coins-balance-card{background:linear-gradient(135deg,var(--primary),var(--primary-dark));border-radius:var(--radius);padding:28px 32px;text-align:center;color:#fff;margin-bottom:28px;box-shadow:0 8px 30px var(--primary-glow)}
.coins-balance-label{font-size:.8rem;text-transform:uppercase;letter-spacing:2px;opacity:.85;margin-bottom:8px}
.coins-balance-val{display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:2.8rem;font-weight:700}
.shop-title{font-family:'Playfair Display',serif;font-size:1.2rem;margin-bottom:20px}
.coupons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.coupon{background:var(--bg-card);border:2px dashed var(--primary-light);border-radius:var(--radius);padding:24px 20px;text-align:center;position:relative;transition:all var(--tr)}
.coupon:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.coupon.out-of-stock{opacity:.55;border-style:solid;border-color:var(--border)}
.coupon-admin-bar{display:flex;justify-content:flex-end;gap:4px;margin-bottom:8px}
.cpbtn{background:none;border:none;cursor:pointer;font-size:.85rem;padding:3px 6px;opacity:.6;font-family:'Quicksand',sans-serif;transition:opacity var(--tr)}
.cpbtn:hover{opacity:1}
.coupon-icon{font-size:2.4rem;margin-bottom:10px}
.coupon-title{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:700;margin-bottom:5px}
.coupon-desc{font-size:.82rem;color:var(--text-secondary);margin-bottom:12px;line-height:1.4}
.coupon-price{display:flex;align-items:center;justify-content:center;gap:4px;font-weight:700;color:var(--primary);margin-bottom:12px;font-size:.95rem}
.coupon-btn{background:var(--primary);color:#fff;border:none;border-radius:50px;padding:9px 22px;font-family:'Quicksand',sans-serif;font-size:.82rem;font-weight:700;cursor:pointer;transition:all var(--tr)}
.coupon-btn:hover{box-shadow:0 4px 15px var(--primary-glow);transform:translateY(-1px)}
.coupon-btn:disabled{opacity:.5;cursor:not-allowed}
.coupon-oos-label{color:var(--text-light);font-size:.85rem;font-style:italic}

/* ── SECRET ── */
.secret-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:32px;max-width:620px;margin:0 auto;box-shadow:var(--shadow-sm)}
.secret-btns{display:flex;gap:12px;margin-bottom:22px;flex-wrap:wrap}

/* ── PETIT BAC reject ── */
.pb-ans.rejected{opacity:.5;text-decoration:line-through}
.pb-reject-btn{background:none;border:none;cursor:pointer;font-size:.82rem;padding:2px 4px;margin-left:4px;vertical-align:middle}

/* ── GAMES ── */
.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:28px}
.game-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:28px 20px;text-align:center;cursor:pointer;transition:all var(--tr);box-shadow:var(--shadow-sm)}
.game-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--primary-light)}
.game-icon{font-size:2.4rem;margin-bottom:10px;display:block}
.game-card h3{font-family:'Playfair Display',serif;font-size:1.05rem;margin-bottom:4px}
.game-card p{font-size:.83rem;color:var(--text-secondary)}
.game-area{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:28px 24px;animation:fadeInUp .4s ease}
.game-area h3{font-family:'Playfair Display',serif;font-size:1.25rem;margin-bottom:20px;text-align:center}
.game-session-setup,.game-session-play{text-align:center;max-width:520px;margin:0 auto}
.game-code-display{background:var(--primary-subtle);border:1px solid var(--primary-light);border-radius:var(--radius-sm);padding:10px 20px;font-size:.95rem;margin-bottom:16px;display:inline-block;font-weight:600}
.game-status{font-weight:600;color:var(--primary);margin:12px 0;font-size:.95rem}
.game-setup-cards{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:start;margin-bottom:16px}
.game-setup-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px 16px;text-align:center}
.game-setup-card-title{font-family:'Playfair Display',serif;font-size:1rem;font-weight:700;margin-bottom:6px;color:var(--text)}
.game-setup-card-desc{font-size:.8rem;color:var(--text-light);margin-bottom:14px}
.game-setup-divider{display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;color:var(--text-light);padding-top:60px}
.game-setup-back{margin-top:4px}
.game-play-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
@media(max-width:600px){
  .game-setup-cards{grid-template-columns:1fr;gap:12px}
  .game-setup-divider{padding-top:0;padding:4px 0}
}
.morpion-board{display:grid;grid-template-columns:repeat(3,88px);gap:6px;justify-content:center;margin:18px auto}
.morpion-cell{width:88px;height:88px;background:var(--primary-subtle);border:2px solid var(--border);border-radius:var(--radius-xs);font-size:2.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--tr)}
.morpion-cell:hover:not(.taken){background:var(--primary-light);transform:scale(1.05)}
.morpion-cell.taken{cursor:default}
.morpion-score{margin:10px 0;font-size:.9rem;color:var(--text-secondary)}
.pb-cats-manage{margin-bottom:20px;text-align:left}
.pb-cats-manage label{font-weight:600;font-size:.88rem;margin-bottom:10px;display:block}
.pb-letter-display{font-family:'Playfair Display',serif;font-size:5rem;font-weight:700;color:var(--primary);text-align:center;margin:16px 0;text-shadow:0 4px 20px var(--primary-glow)}
.pb-form{display:grid;gap:12px;max-width:400px;margin:0 auto;text-align:left}
.pb-field label{font-size:.82rem;font-weight:600;margin-bottom:4px;display:block}
.pb-results-table{max-width:500px;margin:0 auto;display:grid;gap:8px}
.pb-result-row{display:grid;grid-template-columns:120px 1fr 1fr;gap:8px;padding:10px;background:var(--bg);border-radius:var(--radius-xs);font-size:.88rem}
.pb-cat{font-weight:600;color:var(--text-secondary)}
.pb-ans{padding:4px 8px;border-radius:4px}
.pb-ans.shared{background:#fef9c3;color:#713f12}
.pb-scores{margin:12px 0;font-size:.9rem;font-weight:600;color:var(--text-secondary)}

/* ── SCORES ── */
.scores-summary-row{display:flex;align-items:center;justify-content:center;gap:24px;padding:28px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:28px;box-shadow:var(--shadow-sm)}
.score-champ{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.score-emoji{font-size:2rem}
.score-name{font-weight:700;font-size:.9rem}
.score-count{font-family:'Playfair Display',serif;font-size:2.5rem;font-weight:700;color:var(--primary);line-height:1}
.score-champ small{font-size:.72rem;color:var(--text-light);text-transform:uppercase;letter-spacing:1px}
.score-vs{font-family:'Playfair Display',serif;font-size:1.5rem;color:var(--text-light);font-style:italic}
.scores-list{display:grid;gap:8px}
.user-select{display:flex;gap:12px;margin-bottom:16px}
.user-btn{flex:1;padding:12px 8px;border:2px solid var(--border);border-radius:var(--radius);background:var(--bg-card);cursor:pointer;font-family:'Quicksand',sans-serif;font-size:.88rem;font-weight:600;color:var(--text-secondary);transition:all var(--tr);text-align:center}
.user-btn:hover{border-color:var(--primary-light);color:var(--primary)}
.user-btn.active{border-color:var(--primary);background:var(--primary-subtle);color:var(--primary)}

/* ── SETTINGS ── */
.settings-group{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:26px 28px;margin-bottom:18px;box-shadow:var(--shadow-sm)}
.settings-group h3{font-family:'Playfair Display',serif;font-size:1.05rem;margin-bottom:14px}
.settings-hint{font-size:.83rem;color:var(--text-secondary);margin-bottom:14px;line-height:1.4}
.settings-group .input-field{margin-bottom:10px}
.theme-picker{display:flex;gap:10px;flex-wrap:wrap}
.theme-btn{width:50px;height:50px;border-radius:50%;border:3px solid var(--border);cursor:pointer;font-size:1.4rem;display:flex;align-items:center;justify-content:center;transition:all var(--tr);background:var(--bg-card)}
.theme-btn:hover{transform:scale(1.15)}
.theme-btn.active{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-glow);transform:scale(1.1)}

/* ── ATTRIBUTION badges ── */
.badge-bibi{background:var(--bibi-bg);border:1px solid var(--bibi-border)}
.badge-mimi{background:var(--mimi-bg);border:1px solid var(--mimi-border)}

/* ── TOAST ── */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--text);color:#fff;padding:12px 24px;border-radius:50px;font-size:.9rem;font-weight:600;z-index:9999;opacity:0;transition:all .3s ease;pointer-events:none;white-space:nowrap}
.toast.toast-show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── CONFETTI ── */
@keyframes confettiFall{from{transform:translateY(-20px) rotate(0)}to{transform:translateY(105vh) rotate(720deg)}}

/* ── RESPONSIVE ── */
@media(max-width:768px){
    #sidebar{transform:translateX(-100%)}
    #sidebar.open{transform:translateX(0)}
    #menu-toggle{display:flex}
    #content{margin-left:0}
    .page{padding:72px 18px 36px}
    .hero-title{font-size:2.6rem}
    .counter-unit span{font-size:1.8rem}
    .activity-grid{grid-template-columns:repeat(3,1fr)}
    .morpion-board{grid-template-columns:repeat(3,72px)}
    .morpion-cell{width:72px;height:72px;font-size:1.8rem}
    #wheel-canvas{width:300px!important;height:300px!important}
    .bucket-input-row{flex-wrap:wrap}
    .watchlist-add-row{flex-wrap:wrap}
    .modal{max-width:96vw}
    .date-big-q{font-size:1.5rem}
    .counter-card{padding:20px 16px}
    .coupons-grid{grid-template-columns:1fr}
    .scores-summary-row{gap:12px}
    .score-count{font-size:2rem}
    .pb-result-row{grid-template-columns:80px 1fr 1fr;font-size:.8rem}
    input,textarea,select{font-size:16px!important}
    input[type="date"],input[type="time"]{max-width:100%;box-sizing:border-box}
}
@media(max-width:480px){
    .hero-title{font-size:2rem}
    .counter-unit span{font-size:1.4rem}
    .quick-links{flex-direction:column;align-items:center}
    .activity-grid{grid-template-columns:repeat(2,1fr)}
    .souvenirs-grid{grid-template-columns:repeat(2,1fr)}
    .games-grid{grid-template-columns:1fr 1fr}
    .date-yn-yes,.date-yn-no{padding:14px 28px;font-size:1rem}
}

/* ── COMPTES À REBOURS ── */
.cd-grid{width:100%}
.cd-list{display:flex;flex-direction:column;gap:12px}
.cd-item{display:flex;flex-direction:row;align-items:center;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px 24px;box-shadow:var(--shadow-sm);gap:16px;flex-wrap:wrap}
.cd-item-left{flex:1;min-width:120px}
.cd-item-title{font-family:'Playfair Display',serif;font-size:1.1rem;font-weight:700;color:var(--text)}
.cd-item-date{font-size:.76rem;color:var(--text-light);margin-top:4px}
.cd-timer-wrap{flex-shrink:0}
.cd-timer-wrap .counter-numbers .counter-unit span{font-variant-numeric:tabular-nums lining-nums;min-width:2ch}
.cd-item-actions{display:flex;gap:4px;flex-shrink:0}
.cd-action-btn{background:none;border:none;cursor:pointer;font-size:.9rem;padding:4px 6px;border-radius:6px;opacity:.5;transition:all var(--tr)}
.cd-action-btn:hover{opacity:1;background:var(--primary-subtle)}
.cd-past{font-size:.92rem;color:var(--primary);font-style:italic;padding:4px 0}
.cd-empty{text-align:center;padding:60px 20px;color:var(--text-light)}

/* ── CARTE ── */
#map-container{height:420px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-sm);margin-bottom:20px;position:relative;z-index:0;isolation:isolate}
#map-container.add-mode{cursor:crosshair;outline:3px dashed var(--primary)}
.map-search-row{display:flex;gap:10px;margin-bottom:12px}
.map-search-row .input-field{flex:1}
.map-search-row .btn-primary{flex-shrink:0;padding:13px 18px}
.map-add-hint{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:8px 18px;border-radius:50px;font-size:.82rem;font-weight:600;z-index:1000;pointer-events:none;white-space:nowrap}
.pin-list{display:grid;gap:8px;margin-top:4px}
.pin-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 16px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:all var(--tr);max-width:100%;overflow:hidden;word-break:break-word}
.pin-item:hover{border-color:var(--primary-light);background:var(--primary-subtle);transform:translateX(4px)}
.pin-item-emoji{font-size:1.5rem;flex-shrink:0}
.pin-item-info{flex:1;min-width:0}
.pin-item-title{font-weight:600;font-size:.9rem;color:var(--text)}
.pin-item-desc{font-size:.78rem;color:var(--text-secondary);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pin-cat-badge{font-size:.7rem;font-weight:600;background:var(--primary-subtle);color:var(--primary);border-radius:50px;padding:2px 8px;flex-shrink:0}
.pin-edit-btn{background:none;border:none;cursor:pointer;color:var(--text-light);font-size:1rem;padding:4px;transition:color var(--tr);flex-shrink:0}
.pin-edit-btn:hover{color:var(--primary)}
.pin-del-btn{background:none;border:none;cursor:pointer;color:var(--text-light);font-size:1rem;padding:4px;transition:color var(--tr);flex-shrink:0}
.pin-del-btn:hover{color:#e53e3e}
.leaflet-div-icon{background:none;border:none}
.pin-marker{font-size:1.8rem;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3));cursor:pointer}
.map-bubble-pin{width:40px;height:40px;background:var(--primary);border:3px solid #fff;border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:0 3px 12px rgba(0,0,0,.3);display:flex;align-items:center;justify-content:center}
.map-bubble-pin span{transform:rotate(45deg);font-size:20px;line-height:1}

/* ── RECETTES ── */
.recipe-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.recipe-filter{background:transparent;border:2px solid var(--border);border-radius:50px;padding:7px 16px;font-family:'Quicksand',sans-serif;font-size:.82rem;font-weight:600;cursor:pointer;transition:all var(--tr);color:var(--text-secondary)}
.recipe-filter.active,.recipe-filter:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-subtle)}
.recipes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.recipe-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:all var(--tr);cursor:pointer;position:relative}
.recipe-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.recipe-card-header{background:var(--primary-subtle);padding:20px;text-align:center;font-size:2.8rem}
.recipe-card-body{padding:16px}
.recipe-name{font-family:'Playfair Display',serif;font-size:1rem;font-weight:700;margin-bottom:8px;color:var(--text)}
.recipe-meta{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.recipe-badge{font-size:.7rem;font-weight:600;background:var(--primary-subtle);color:var(--primary);border-radius:50px;padding:2px 8px}
.recipe-badge-done{background:#e8f9ee;color:#2d8b4e}
.recipe-badge-todo{background:rgba(0,0,0,.04);color:var(--text-secondary)}
.recipe-admin-bar{position:absolute;top:8px;right:8px;display:flex;gap:4px;opacity:0;transition:opacity var(--tr)}
.recipe-card:hover .recipe-admin-bar{opacity:1}
.recipe-admin-btn{background:rgba(255,255,255,.85);border:none;cursor:pointer;font-size:.85rem;padding:3px 6px;border-radius:6px;transition:all var(--tr)}
.recipe-admin-btn:hover{background:#fff;box-shadow:var(--shadow-sm)}
.recipe-detail-section{margin-bottom:16px}
.recipe-detail-section h4{font-weight:700;font-size:.88rem;margin-bottom:8px;color:var(--text);text-transform:uppercase;letter-spacing:.5px}
.recipe-ingredients{list-style:none;display:grid;gap:4px}
.recipe-ingredients li{font-size:.88rem;color:var(--text-secondary);padding:4px 8px;background:var(--bg);border-radius:6px}
.recipe-steps{list-style:none;display:grid;gap:8px;counter-reset:steps}
.recipe-steps li{font-size:.88rem;line-height:1.5;color:var(--text);padding:8px 8px 8px 36px;background:var(--bg);border-radius:6px;position:relative;counter-increment:steps}
.recipe-steps li::before{content:counter(steps);position:absolute;left:10px;top:8px;width:18px;height:18px;background:var(--primary);color:#fff;border-radius:50%;font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.recipe-notes{font-size:.85rem;color:var(--text-secondary);font-style:italic;background:var(--primary-subtle);padding:10px 14px;border-radius:var(--radius-sm);border-left:3px solid var(--primary)}
.recipe-done-btn{width:100%;margin-top:16px}
.recipes-empty{grid-column:1/-1;text-align:center;padding:60px 20px;color:var(--text-light)}

/* ── PUISSANCE 4 ── */
#p4-board-container{margin:16px auto;max-width:360px}
#p4-col-hints{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:4px}
.p4-col-hint{background:none;border:none;cursor:pointer;font-size:1.1rem;padding:4px;border-radius:var(--radius-xs);transition:background var(--tr);color:var(--primary)}
.p4-col-hint:hover{background:var(--primary-subtle)}
.p4-col-hint:disabled{opacity:.2;cursor:not-allowed}
#p4-board{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;background:var(--primary);padding:8px;border-radius:var(--radius);box-shadow:var(--shadow-md)}
.p4-cell{width:100%;aspect-ratio:1;border-radius:50%;background:var(--bg);transition:background .3s}
.p4-cell.bibi{background:#FF6B8A}
.p4-cell.mimi{background:#FFD700}
.p4-score{text-align:center;font-weight:600;margin-top:8px;font-size:.95rem}

@media(max-width:768px){
    .cd-grid{width:100%}
    #map-container{height:300px}
    .recipes-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
    #p4-board-container{max-width:280px}
}

/* ── PENDU ── */
.pendu-masked{font-family:'Playfair Display',serif;font-size:2rem;letter-spacing:.5em;text-align:center;margin:20px 0;color:var(--text)}
.pendu-figure{font-family:monospace;font-size:.85rem;line-height:1.4;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 20px;display:inline-block;margin:12px auto;white-space:pre}
.pendu-letters{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:16px 0;max-width:400px;margin-left:auto;margin-right:auto}
.pendu-letter-btn{width:40px;height:40px;border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-card);cursor:pointer;font-weight:700;font-size:.9rem;transition:all var(--tr)}
.pendu-letter-btn:hover:not(:disabled){border-color:var(--primary);color:var(--primary)}
.pendu-letter-btn:disabled{opacity:.3;cursor:not-allowed}
.pendu-letter-btn.wrong{background:#fee2e2;border-color:#f87171;color:#ef4444}
.pendu-letter-btn.correct{background:var(--primary-subtle);border-color:var(--primary);color:var(--primary)}

/* ── YAMS ── */
.yams-dice{display:flex;gap:12px;justify-content:center;margin:16px 0;flex-wrap:wrap}
.yams-die{width:64px;height:64px;border-radius:10px;background:white;border:2px solid var(--border);box-shadow:0 4px 12px rgba(0,0,0,.15);display:grid;padding:8px;cursor:pointer;transition:all var(--tr);position:relative}
.yams-die.kept{border-color:var(--primary);background:var(--primary-subtle);transform:translateY(-6px);box-shadow:0 8px 20px var(--primary-glow)}
.yams-die:not(.kept):hover{transform:translateY(-3px)}
.yams-die:disabled{cursor:not-allowed;opacity:.5}
.pip{width:10px;height:10px;border-radius:50%;background:#c0392b}
.yams-scorecard{width:100%;border-collapse:collapse;font-size:.85rem;margin-top:16px}
.yams-scorecard th{background:var(--primary-subtle);padding:8px;border:1px solid var(--border);font-weight:600}
.yams-scorecard td{padding:8px;border:1px solid var(--border);text-align:center;cursor:pointer;transition:background var(--tr)}
.yams-scorecard td.mine:hover{background:var(--primary-subtle)}
.yams-scorecard td.filled{cursor:default;font-weight:700;color:var(--primary)}
.yams-scorecard td.potential{color:var(--text-light);font-style:italic}
.yams-scorecard tr.separator td{background:var(--bg);font-weight:600;cursor:default}
.yams-scorecard td.bonus-ok{color:#16a34a;font-weight:700}

/* ── BATAILLE NAVALE ── */
.bs-grids{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:16px 0}
@media(max-width:600px){.bs-grids{grid-template-columns:1fr}}
.bs-grid-label{font-weight:600;font-size:.85rem;text-align:center;margin-bottom:6px;color:var(--text-sec)}
.bs-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:2px}
.bs-cell{aspect-ratio:1;border:1px solid rgba(0,0,0,.1);border-radius:3px;background:linear-gradient(135deg,#e0f2fe,#bae6fd);cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;font-size:.8rem}
.bs-cell:hover:not(.no-cursor){background:rgba(255,107,138,.2);border-color:var(--primary)}
.bs-cell.ship{background:linear-gradient(135deg,#64748b,#475569);border-color:#334155}
.bs-cell.preview{background:linear-gradient(135deg,#fbbf24,#f59e0b);border:2px dashed #d97706}
.bs-cell.preview.invalid{background:linear-gradient(135deg,#f87171,#ef4444);border-color:#dc2626}
.bs-cell.hit{background:linear-gradient(135deg,#ef4444,#b91c1c);color:white}
.bs-cell.miss{background:linear-gradient(135deg,#cbd5e1,#94a3b8);cursor:default}
.bs-cell.sunk{background:linear-gradient(135deg,#7f1d1d,#450a0a);color:white}
.bs-cell.no-cursor{cursor:default}
.bs-ships-list{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:12px 0}
.bs-ship-btn{padding:8px 14px;border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-card);cursor:pointer;font-size:.82rem;font-weight:600;transition:all var(--tr)}
.bs-ship-btn.active{border-color:var(--primary);background:var(--primary-subtle);color:var(--primary)}
.bs-ship-btn.placed{opacity:.4;text-decoration:line-through;cursor:default}
.bs-orient-btn{padding:6px 14px;border:1px solid var(--border);border-radius:50px;background:var(--bg-card);cursor:pointer;font-size:.82rem;transition:all var(--tr)}

/* ── MÉMOIRE ── */
.memoire-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;max-width:520px;margin:0 auto}
@media(max-width:500px){.memoire-grid{grid-template-columns:repeat(6,1fr);gap:4px}}
.memoire-card{aspect-ratio:1;border:2px solid var(--border);border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));cursor:pointer;font-size:1.6rem;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 8px rgba(0,0,0,.1);color:white;font-weight:700}
.memoire-card:not(.revealed):not(.matched){font-size:0;background:repeating-linear-gradient(45deg,var(--primary) 0,var(--primary) 3px,var(--primary-dark) 3px,var(--primary-dark) 10px)}
.memoire-card:not(.revealed):not(.matched)::before{content:'';display:none}
.memoire-card:hover:not(.matched):not(.no-flip){transform:scale(1.08);box-shadow:0 8px 20px rgba(0,0,0,.15)}
.memoire-card.revealed{background:var(--bg-card);border-color:var(--primary);box-shadow:0 4px 16px var(--primary-glow);color:var(--text)}
.memoire-card.matched{background:#f0fdf4;border-color:#86efac;opacity:.75;cursor:default;box-shadow:none}
.memoire-card.no-flip{cursor:not-allowed}

/* ── UNO ── */
.uno-play-area{display:flex;flex-direction:column;align-items:center;gap:16px}
.uno-top-card{width:70px;height:100px;border-radius:10px;border:3px solid white;box-shadow:var(--shadow-md);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;color:white;gap:4px}
.uno-color-dot{width:24px;height:24px;border-radius:50%;border:2px solid rgba(255,255,255,.5)}
.uno-hand{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;max-width:600px}
.uno-card{width:64px;height:96px;border-radius:10px;border:3px solid rgba(255,255,255,.4);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;font-weight:800;color:white;transition:all var(--tr);box-shadow:0 4px 12px rgba(0,0,0,.2);text-align:center;line-height:1.1;padding:4px;position:relative;flex-shrink:0}
.uno-card::before{content:'';position:absolute;inset:5px;border-radius:6px;background:rgba(255,255,255,.15)}
.uno-card:hover:not(.unplayable){transform:translateY(-12px) scale(1.08);box-shadow:0 12px 24px rgba(0,0,0,.3)}
.uno-card.unplayable{opacity:.45;cursor:not-allowed;filter:grayscale(.3)}
.uno-card.unplayable:hover{transform:none}
.uno-card[data-color="red"]{background:#ef4444}
.uno-card[data-color="yellow"]{background:#eab308;color:#1a1a1a}
.uno-card[data-color="green"]{background:#22c55e}
.uno-card[data-color="blue"]{background:#3b82f6}
.uno-card[data-color="wild"]{background:linear-gradient(135deg,#ef4444,#eab308,#22c55e,#3b82f6)}
.uno-opp-info{font-size:.95rem;font-weight:600;color:var(--text-sec);text-align:center}

/* ── SKYJO ── */
.skyjo-area{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;margin:16px 0}
.skyjo-player-area{text-align:center}
.skyjo-player-label{font-weight:700;font-size:.88rem;margin-bottom:8px;color:var(--text-sec)}
.skyjo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.skyjo-cell{width:52px;height:52px;border-radius:var(--radius-sm);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;cursor:pointer;transition:all var(--tr)}
.skyjo-cell:hover:not(.revealed):not(.removed){border-color:var(--primary);transform:scale(1.05)}
.skyjo-cell.hidden{background:var(--primary);color:white;font-size:1.2rem}
.skyjo-cell.removed{background:transparent;border-color:transparent;cursor:default}
.skyjo-cell[data-v="-2"]{background:#86efac;color:#14532d}
.skyjo-cell[data-v="0"]{background:#fef08a;color:#713f12}
.skyjo-cell[data-range="low"]{background:#bfdbfe;color:#1e3a8a}
.skyjo-cell[data-range="mid"]{background:#fed7aa;color:#7c2d12}
.skyjo-cell[data-range="high"]{background:#fecaca;color:#7f1d1d}
.skyjo-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:12px 0}
.skyjo-drawn{background:var(--bg-card);border:3px solid var(--primary);border-radius:var(--radius-sm);padding:8px 16px;font-weight:700;font-size:1.1rem;text-align:center;margin:8px auto;display:inline-block}
.skyjo-card-visual{width:52px;height:72px;border-radius:8px;border:2px solid rgba(0,0,0,.1);display:inline-flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:800;box-shadow:0 4px 12px rgba(0,0,0,.15);transition:all var(--tr);vertical-align:middle}
.skyjo-card-back{background:var(--primary);color:white}

/* ── GAMES general polish ── */
.game-area{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px 20px;animation:fadeInUp .4s ease;box-shadow:var(--shadow-md)}
.game-status{font-weight:700;color:var(--primary);margin:12px 0;font-size:1rem;text-align:center;min-height:28px}
.game-code-display{background:linear-gradient(135deg,var(--primary-subtle),rgba(255,179,198,.15));border:1px solid var(--primary-light);border-radius:var(--radius-sm);padding:10px 20px;font-size:.9rem;margin-bottom:16px;display:inline-block;font-weight:700;letter-spacing:.05em;color:var(--primary)}
.game-setup-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:24px 20px;text-align:center;box-shadow:var(--shadow-md);transition:all var(--tr)}
.game-setup-card:hover{border-color:var(--primary-light);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.1)}
.game-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:28px 20px;text-align:center;cursor:pointer;transition:all var(--tr);box-shadow:var(--shadow-md);animation:fadeInUp .4s ease both}
.game-card:hover{transform:translateY(-6px);border-color:var(--primary-light);box-shadow:0 16px 40px rgba(0,0,0,.12)}
.game-icon{font-size:3rem;display:block;margin-bottom:12px;transition:transform .3s}
.game-card:hover .game-icon{transform:scale(1.15) rotate(-5deg)}
.game-card h3{font-family:'Playfair Display',serif;font-size:1.05rem;margin-bottom:6px;font-weight:700}
.game-card p{font-size:.8rem;color:var(--text-secondary)}
.skyjo-spectator-info{display:flex;gap:16px;align-items:flex-end;justify-content:center;flex-wrap:wrap;margin:8px 0}
.skyjo-info-block{text-align:center}
.skyjo-info-label{font-size:.72rem;font-weight:600;color:var(--text-light);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}

/* ── RÈGLEMENT INTÉRIEUR ── */
.rule-card{display:flex;align-items:flex-start;gap:14px;border-radius:var(--radius);border:1px solid var(--border);padding:16px 20px;margin-bottom:10px;animation:fadeInUp .35s ease both;transition:all var(--tr);position:relative}
.rule-card.by-bibi{background:var(--bibi-bg);border-color:var(--bibi-border)}
.rule-card.by-mimi{background:var(--mimi-bg);border-color:var(--mimi-border)}
.rule-card:hover{transform:translateX(4px)}
.rule-number{font-family:'Playfair Display',serif;font-size:1.4rem;font-weight:700;color:var(--primary-light);min-width:36px;line-height:1;padding-top:2px}
.rule-text{flex:1;font-size:.93rem;line-height:1.5;color:var(--text)}
.rule-author{font-size:.72rem;font-weight:600;margin-top:4px}
.rule-author.bibi{color:#3b82f6}
.rule-author.mimi{color:var(--primary)}
.rule-actions{display:flex;gap:4px;opacity:0;transition:opacity var(--tr);flex-shrink:0}
.rule-card:hover .rule-actions{opacity:1}
.rule-action-btn{background:none;border:none;cursor:pointer;font-size:.9rem;padding:4px 6px;border-radius:6px;transition:background var(--tr)}
.rule-action-btn:hover{background:rgba(0,0,0,.06)}
.rules-empty{text-align:center;padding:48px 20px;color:var(--text-light)}
.rules-empty .empty-icon{font-size:3rem;margin-bottom:12px}

/* ── JOURNAL ── */
.journal-filters{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.journal-filter{background:var(--bg-card);border:1px solid var(--border);border-radius:50px;padding:7px 18px;font-family:'Quicksand',sans-serif;font-size:.83rem;font-weight:600;cursor:pointer;transition:all var(--tr);color:var(--text-sec)}
.journal-filter.active,.journal-filter:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.journal-entry{border-radius:var(--radius);border:1px solid var(--border);padding:20px 24px;margin-bottom:12px;animation:fadeInUp .35s ease both;position:relative;transition:all var(--tr)}
.journal-entry.by-bibi{background:var(--bibi-bg);border-color:var(--bibi-border)}
.journal-entry.by-mimi{background:var(--mimi-bg);border-color:var(--mimi-border)}
.journal-entry-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.journal-entry-date{font-family:'Playfair Display',serif;font-size:.82rem;color:var(--text-light)}
.journal-author-badge{font-size:.75rem;font-weight:700;padding:3px 10px;border-radius:50px}
.journal-author-badge.bibi{background:rgba(147,197,253,.3);color:#1e40af}
.journal-author-badge.mimi{background:rgba(255,183,197,.4);color:#be185d}
.journal-entry-text{font-size:.93rem;line-height:1.6;color:var(--text);white-space:pre-wrap;word-break:break-word}
.journal-entry-actions{position:absolute;top:12px;right:12px;display:flex;gap:4px;opacity:0;transition:opacity var(--tr)}
.journal-entry:hover .journal-entry-actions{opacity:1}
.journal-action-btn{background:none;border:none;cursor:pointer;font-size:.9rem;padding:4px 6px;border-radius:6px;transition:background var(--tr)}
.journal-action-btn:hover{background:rgba(0,0,0,.06)}
.journal-empty{text-align:center;padding:48px 20px;color:var(--text-light)}
.journal-empty .empty-icon{font-size:3rem;margin-bottom:12px}