/* ============================================================
   BOULANGERIE v3 — Coquette x Kawaii x Y2K Pink
   Palette : rose pale · rose vif · lavande · or · blanc nacre
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&family=Poppins:wght@300;400;500;600;700&family=Dancing+Script:wght@500;700&family=Great+Vibes&display=swap');

:root {
  --pink:      #F472B6;
  --hot:       #E8559A;
  --deep:      #C2457E;
  --pink-lt:   #FBCFE8;
  --blush:     #FDF2F8;
  --lav:       #C4B5FD;
  --lav-lt:    #EDE9FE;
  --gold:      #F59E0B;
  --gold-lt:   #FDE68A;
  --text:      #4A1942;
  --text-2:    #7C3973;
  --muted:     #BE89B0;
  --white:     #FFFFFF;
  --grad:      linear-gradient(135deg,#E8559A 0%,#F472B6 50%,#C084FC 100%);
  --grad-soft: linear-gradient(135deg,#FBCFE8 0%,#EDE9FE 100%);
  --sh-btn:    0 4px 0 #C2457E, 0 8px 24px rgba(232,85,154,.35);
  --sh-card:   0 4px 24px rgba(196,181,253,.2), 0 2px 8px rgba(232,85,154,.12);
  --r:   20px;
  --rsm: 12px;
  --rxs: 6px;
}

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}

body {
  font-family:'Poppins',sans-serif;
  font-size:15px; color:var(--text);
  min-height:100vh; line-height:1.65;
  overflow-x:hidden; position:relative;
  background:
    radial-gradient(ellipse 80% 60% at 15% 15%,rgba(232,85,154,.16) 0%,transparent 55%),
    radial-gradient(ellipse 60% 50% at 85% 75%,rgba(196,181,253,.2) 0%,transparent 55%),
    #FDF2F8;
}

body::before {
  content:''; position:fixed; inset:0; z-index:-2;
  background:
    radial-gradient(circle 500px at 10% 20%,rgba(232,85,154,.1) 0%,transparent 70%),
    radial-gradient(circle 400px at 90% 80%,rgba(196,181,253,.15) 0%,transparent 70%);
  animation:blob 14s ease-in-out infinite alternate;
}
@keyframes blob{0%{transform:scale(1)}100%{transform:scale(1.06) rotate(-2deg)}}

body::after {
  content:''; position:fixed; inset:0; z-index:-1;
  pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cpath d='M22 22C15 14 5 17 7 24c2 7 11 4 15-2z' fill='%23E8559A'/%3E%3Cpath d='M22 22c7-8 17-5 15 2-2 7-11 4-15-2z' fill='%23E8559A'/%3E%3Ccircle cx='22' cy='22' r='3.5' fill='%23F472B6'/%3E%3Cline x1='22' y1='25.5' x2='22' y2='33' stroke='%23E8559A' stroke-width='1.5'/%3E%3Cpolygon points='100,8 103,17 112,17 105,22 108,31 100,26 92,31 95,22 88,17 97,17' fill='%23F59E0B' opacity='.85'/%3E%3Cpath d='M68 108c0 0-14-9-14-19 0-6 5-10 9-7 2 1 5 4 5 4s3-3 5-4c4-3 9 1 9 7 0 10-14 19-14 19z' fill='%23F472B6'/%3E%3Cpath d='M112 72l1.5 5 4.5-5-4.5-5z' fill='%23C084FC' opacity='.9'/%3E%3Cpath d='M22 112c-5-6-13-4-11 1 2 5 9 3 11-1z' fill='%23C084FC'/%3E%3Cpath d='M22 112c5-6 13-4 11 1-2 5-9 3-11-1z' fill='%23C084FC'/%3E%3Ccircle cx='22' cy='112' r='2.5' fill='%23E8559A'/%3E%3Cpolygon points='62,28 63,31 66,31 64,33 65,36 62,34 59,36 60,33 58,31 61,31' fill='%23F59E0B' opacity='.6'/%3E%3C/svg%3E");
  background-size:140px 140px;
}

h1,h2,h3,h4{font-family:'Playfair Display',serif;color:var(--text);line-height:1.25}
h1{font-size:clamp(1.8rem,4vw,2.6rem)} h2{font-size:clamp(1.3rem,3vw,1.9rem)} h3{font-size:1.2rem}
a{color:var(--hot);text-decoration:none;transition:color .2s} a:hover{color:var(--pink)}

/* HEADER */
.site-header {
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border-bottom:2px solid rgba(244,114,182,.28);
  position:sticky; top:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:0 24px; height:64px; gap:16px;
  overflow-x:auto; min-width:0;
}
.site-header .logo {
  display:flex; align-items:center; gap:6px;
  text-decoration:none; white-space:nowrap; flex-shrink:0;
}
/* Petite rose SVG à côté du texte */
.logo-rose {
  width:18px; height:18px; flex-shrink:0;
  transition:transform .2s;
}
.site-header .logo:hover .logo-rose { transform:rotate(15deg) scale(1.15) }
/* Texte principal */
.logo-main {
  font-family:'Great Vibes', cursive; font-size:1.65rem; font-weight:400;
  background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
  white-space:nowrap; line-height:1;
  letter-spacing:.01em;
}
.header-nav{display:flex;align-items:center;gap:6px;flex-shrink:0}
.nav-pill{color:var(--text-2);font-weight:500;font-size:.88rem;padding:7px 14px;border-radius:50px;transition:all .2s;white-space:nowrap;flex-shrink:0}
.nav-pill:hover{background:var(--pink-lt);color:var(--hot)}
.nav-pill.active{background:var(--grad);color:#fff}
.user-badge{display:flex;align-items:center;gap:6px;background:rgba(244,114,182,.12);border:1.5px solid rgba(244,114,182,.25);border-radius:50px;padding:5px 14px;font-size:.88rem;font-weight:600;color:var(--text-2)}

/* SPACE NAV */
.space-nav{display:flex;gap:6px;flex-wrap:wrap;padding:4px;max-width:960px;margin:0 auto}
.space-btn {
  flex:1; min-width:110px;
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:9px 16px; border-radius:50px;
  font-family:'Poppins',sans-serif; font-size:.84rem; font-weight:600;
  color:rgba(255,255,255,.88);
  background:rgba(255,255,255,.18); border:1.5px solid rgba(255,255,255,.38);
  transition:all .2s; white-space:nowrap; cursor:pointer; text-decoration:none;
}
.space-btn:hover{background:rgba(255,255,255,.28);color:#fff;transform:translateY(-1px)}
.space-btn.active{background:#fff;color:var(--hot);border-color:#fff;box-shadow:0 3px 14px rgba(0,0,0,.14)}

/* TOOLBAR */
.toolbar {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:12px 24px;
  background:rgba(255,255,255,.65); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(244,114,182,.15);
  position:sticky; top:64px; z-index:90;
}
.toolbar-label{font-size:.78rem;font-weight:700;color:var(--muted);white-space:nowrap}
.chip{display:inline-flex;align-items:center;gap:5px;padding:6px 14px;border-radius:50px;font-size:.8rem;font-weight:500;color:var(--text-2);background:rgba(244,114,182,.1);border:1.5px solid rgba(244,114,182,.2);transition:all .2s;cursor:pointer;text-decoration:none;white-space:nowrap}
.chip:hover{background:var(--pink-lt);border-color:var(--pink);color:var(--hot)}
.chip.active{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 2px 10px rgba(232,85,154,.3)}
.search-wrap{flex:1;min-width:160px;max-width:300px}
.search-input{width:100%;padding:8px 16px;border:1.5px solid rgba(244,114,182,.3);border-radius:50px;font-family:'Poppins',sans-serif;font-size:.88rem;color:var(--text);background:rgba(255,255,255,.85);outline:none;transition:all .2s}
.search-input:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(244,114,182,.18)}
.search-input::placeholder{color:var(--muted);opacity:.75}

/* GALLERY */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px;padding:24px}

.pain-card{background:#fff;border-radius:var(--r);overflow:hidden;border:1.5px solid rgba(244,114,182,.18);box-shadow:var(--sh-card);transition:transform .25s,box-shadow .25s;cursor:pointer;position:relative}
.pain-card:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 16px 48px rgba(232,85,154,.25)}
.card-img-wrap{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--grad-soft)}
.card-img{width:100%;height:100%;object-fit:cover;display:block}
.card-img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:4rem;background:var(--grad-soft);position:relative;z-index:1}
.card-gradient{position:absolute;inset:0;background:linear-gradient(to top,rgba(74,25,66,.72) 0%,transparent 55%);z-index:0}
.card-cat-ribbon{position:absolute;top:10px;left:10px}
.cat-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:50px;font-size:.72rem;font-weight:700;background:rgba(255,255,255,.92);color:var(--hot);border:1px solid rgba(244,114,182,.3);backdrop-filter:blur(6px);box-shadow:0 2px 8px rgba(0,0,0,.1)}
.card-score{position:absolute;top:10px;right:10px;background:var(--grad);color:#fff;font-weight:700;font-size:.83rem;padding:4px 10px;border-radius:50px;box-shadow:0 2px 10px rgba(232,85,154,.4)}
.card-voter-badge{position:absolute;bottom:10px;right:10px;background:rgba(255,255,255,.85);backdrop-filter:blur(4px);font-size:.72rem;font-weight:600;color:var(--text-2);padding:3px 8px;border-radius:50px}
.card-body{padding:14px 16px}
.card-name{font-family:'Playfair Display',serif;font-size:1.05rem;font-weight:700;color:var(--text);margin-bottom:4px}
.card-meta{font-size:.78rem;color:var(--muted);margin-bottom:6px}
.card-creator-link{color:var(--muted);text-decoration:none;font-weight:600;transition:color .15s}
.card-creator-link:hover{color:var(--hot)}
.card-stars{margin-bottom:6px}

.tag{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:50px;font-size:.72rem;font-weight:500;background:rgba(244,114,182,.1);color:var(--hot);border:1px solid rgba(244,114,182,.2);margin:2px 2px 0 0}
.tag-red{background:#FEE2E2;color:#991B1B;border-color:#FCA5A5}
.tag-green{background:#D1FAE5;color:#065F46;border-color:#6EE7B7}

.empty-state{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:60px 24px}
.empty-icon{font-size:4rem;margin-bottom:16px}
.empty-state h2{font-family:'Playfair Display',serif;font-size:1.4rem;font-style:italic;color:var(--text);margin-bottom:8px}
.empty-state p{font-size:.9rem;color:var(--muted);max-width:340px;margin:0 auto 20px}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:11px 22px;border-radius:50px;font-family:'Poppins',sans-serif;font-weight:600;font-size:.875rem;cursor:pointer;border:none;transition:all .2s;white-space:nowrap;text-decoration:none;line-height:1}
.btn-primary{background:var(--grad);color:#fff;box-shadow:var(--sh-btn)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--deep),0 12px 32px rgba(232,85,154,.45);filter:brightness(1.05)}
.btn-primary:active{transform:translateY(2px);box-shadow:0 2px 0 var(--deep)}
.btn-outline{background:transparent;color:var(--hot);border:2px solid var(--pink)}
.btn-outline:hover{background:var(--pink-lt);transform:translateY(-1px)}
.btn-ghost{background:rgba(244,114,182,.1);color:var(--hot);border:1.5px solid rgba(244,114,182,.25)}
.btn-ghost:hover{background:rgba(244,114,182,.2)}
.btn-danger{background:linear-gradient(135deg,#F87171,#EF4444);color:#fff;box-shadow:0 4px 0 #B91C1C,0 8px 20px rgba(239,68,68,.3)}
.btn-danger:hover{transform:translateY(-2px);filter:brightness(1.05)}
.btn-sm{padding:6px 14px;font-size:.8rem} .btn-lg{padding:14px 30px;font-size:1rem}

.fab{position:fixed;bottom:28px;right:28px;width:58px;height:58px;border-radius:50%;background:var(--grad);color:#fff;font-size:1.6rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 0 var(--deep),0 8px 32px rgba(232,85,154,.5);cursor:pointer;border:none;transition:all .2s;z-index:50}
.fab:hover{transform:translateY(-4px) scale(1.06)}

/* MODAL / OVERLAY */
.overlay{position:fixed;inset:0;z-index:200;background:rgba(74,25,66,.42);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:16px;animation:fadeIn .2s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.modal{background:rgba(255,255,255,.97);border:1.5px solid rgba(244,114,182,.25);border-radius:24px;width:100%;max-width:520px;max-height:90vh;overflow-y:auto;box-shadow:0 24px 80px rgba(232,85,154,.25),0 8px 32px rgba(196,181,253,.2);animation:slideUp .25s ease;position:relative}
.modal-lg{max-width:640px}
@keyframes slideUp{from{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.modal::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad);border-radius:24px 24px 0 0}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 0;gap:12px}
.modal-title{font-family:'Playfair Display',serif;font-size:1.3rem;font-style:italic;color:var(--text);font-weight:700}
.modal-close{width:32px;height:32px;border-radius:50%;background:rgba(244,114,182,.12);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1rem;color:var(--muted);transition:all .2s;flex-shrink:0}
.modal-close:hover{background:rgba(244,114,182,.25);color:var(--hot);transform:scale(1.1)}
.modal-body{padding:20px 24px 24px}

.steps-bar{display:flex;gap:4px;margin-bottom:10px}
.step-seg{flex:1;height:5px;border-radius:10px;background:rgba(244,114,182,.2);transition:all .3s}
.step-seg.done{background:var(--pink)}
.step-seg.active{background:var(--grad);box-shadow:0 0 6px rgba(232,85,154,.4)}
.step-label{font-size:.83rem;font-weight:600;color:var(--text-2);text-align:center;margin-bottom:18px}
.step-nav{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}

/* FORMS */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-group{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.form-label{font-size:.8rem;font-weight:600;color:var(--text-2);letter-spacing:.02em}

.form-input,.form-select,.form-textarea,.form-control{width:100%;padding:10px 15px;border:1.5px solid rgba(244,114,182,.3);border-radius:var(--rsm);font-family:'Poppins',sans-serif;font-size:.88rem;color:var(--text);background:rgba(255,255,255,.88);transition:all .2s;outline:none}
.form-input:focus,.form-select:focus,.form-textarea:focus,.form-control:focus{border-color:var(--pink);background:#fff;box-shadow:0 0 0 3px rgba(244,114,182,.2)}
.form-input::placeholder,.form-textarea::placeholder,.form-control::placeholder{color:var(--muted);opacity:.75}
.form-textarea{resize:vertical;min-height:80px} .form-select{cursor:pointer}

.photo-drop{border:2.5px dashed rgba(244,114,182,.4);border-radius:var(--r);padding:30px 20px;text-align:center;cursor:pointer;transition:all .2s;background:rgba(244,114,182,.04);position:relative;overflow:hidden}
.photo-drop:hover{border-color:var(--pink);background:rgba(244,114,182,.09)}
.photo-preview-img{width:100%;max-height:240px;object-fit:cover;border-radius:var(--rsm);display:none}

.visibility-picker{display:flex;flex-direction:column;gap:10px}
.vis-option{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:var(--rsm);border:2px solid rgba(244,114,182,.2);cursor:pointer;transition:all .2s;background:#fff}
.vis-option:has(input:checked){border-color:var(--hot);background:rgba(244,114,182,.07);box-shadow:0 0 0 3px rgba(232,85,154,.15)}
.vis-option input{display:none}
.vis-label{display:flex;flex-direction:column;gap:2px}
.vis-icon{font-size:1.4rem;flex-shrink:0}
.vis-name{font-weight:700;font-size:.9rem;color:var(--text)}
.vis-desc{font-size:.75rem;color:var(--muted)}

.rating-block{margin-bottom:6px}
.rating-row{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:4px}
.rating-label-text{font-weight:600;font-size:.88rem;color:var(--text)}
.rating-desc-text{font-size:.73rem;color:var(--muted);margin-top:1px}
.rating-val{font-weight:700;font-size:.85rem;color:var(--hot);white-space:nowrap;flex-shrink:0}

input[type=range]{-webkit-appearance:none;width:100%;height:6px;border-radius:10px;background:linear-gradient(to right,var(--hot) 0%,var(--hot) var(--val,50%),rgba(244,114,182,.2) var(--val,50%),rgba(244,114,182,.2) 100%);outline:none;cursor:pointer;margin-bottom:14px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--grad);border:2px solid #fff;box-shadow:0 2px 8px rgba(232,85,154,.45);cursor:grab;transition:transform .15s}
input[type=range]::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.2)}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--grad);border:2px solid #fff;cursor:grab}

.section-title{font-weight:700;font-size:.9rem;color:var(--text);margin-bottom:10px}
.flags-grid{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px}
.flag-item{display:inline-flex;align-items:center;gap:5px;cursor:pointer;user-select:none}
.flag-item input{display:none}
.flag-chip{display:inline-flex;align-items:center;padding:5px 12px;border-radius:50px;font-size:.78rem;font-weight:500;border:1.5px solid rgba(244,114,182,.25);background:rgba(255,255,255,.7);color:var(--text-2);transition:all .2s}
.flag-item:hover .flag-chip{border-color:var(--pink);background:var(--pink-lt)}
.flag-item input:checked ~ .flag-chip{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 2px 10px rgba(232,85,154,.3)}
.flag-item.red input:checked ~ .flag-chip{background:linear-gradient(135deg,#F87171,#EF4444)}
.flag-item.green input:checked ~ .flag-chip{background:linear-gradient(135deg,#34D399,#10B981);color:#fff}

.custom-flag-wrap{display:flex;gap:8px;margin-top:8px;margin-bottom:6px}
.custom-flag-input{flex:1;padding:7px 12px;border:1.5px solid rgba(244,114,182,.3);border-radius:50px;font-family:'Poppins',sans-serif;font-size:.82rem;color:var(--text);background:#fff;outline:none;transition:all .2s}
.custom-flag-input:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(244,114,182,.18)}
.custom-flag-input::placeholder{color:var(--muted);opacity:.75}
.custom-flags-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}

/* FOLLOW */
.user-card{display:flex;align-items:center;gap:12px;padding:12px 16px;background:rgba(255,255,255,.75);border:1px solid rgba(244,114,182,.18);border-radius:var(--rsm);margin-bottom:10px}
.user-avatar{width:42px;height:42px;border-radius:50%;background:var(--grad-soft);display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;border:2px solid rgba(244,114,182,.3);overflow:hidden}
.user-info{flex:1;min-width:0}
.user-name{font-weight:600;font-size:.9rem;color:var(--text)}
.user-sub{font-size:.77rem;color:var(--muted)}

/* ALERTS / TOAST */
.alert{padding:13px 18px;border-radius:var(--rsm);font-size:.88rem;font-weight:500;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.alert-success{background:#D1FAE5;color:#065F46;border:1px solid #6EE7B7}
.alert-error{background:#FEE2E2;color:#991B1B;border:1px solid #FCA5A5}
.alert-info{background:var(--lav-lt);color:#5B21B6;border:1px solid var(--lav)}
.alert-pink{background:var(--pink-lt);color:var(--hot);border:1px solid rgba(244,114,182,.4)}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--grad);color:#fff;padding:10px 22px;border-radius:50px;font-size:.88rem;font-weight:600;box-shadow:0 4px 20px rgba(232,85,154,.45);z-index:999;animation:toastIn .25s ease;pointer-events:none}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%,0)}}

/* AUTH */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.auth-card{background:rgba(255,255,255,.92);backdrop-filter:blur(20px);border:1.5px solid rgba(244,114,182,.25);border-radius:28px;padding:40px 36px;width:100%;max-width:440px;box-shadow:0 24px 80px rgba(232,85,154,.2);position:relative;overflow:hidden}
.auth-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad)}
.auth-logo{text-align:center;font-family:'Dancing Script',cursive;font-size:2.4rem;font-weight:700;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:6px}
.auth-subtitle{text-align:center;font-size:.85rem;color:var(--muted);margin-bottom:26px}

/* MISC */
.progress{height:8px;background:rgba(244,114,182,.15);border-radius:50px;overflow:hidden}
.progress-bar{height:100%;background:var(--grad);border-radius:50px;transition:width .4s}
.score-big{font-size:2.8rem;font-weight:900;font-family:'Playfair Display',serif;line-height:1;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.score-label{font-size:.8rem;color:var(--muted);margin-top:2px}
.badge{display:inline-block;padding:3px 10px;border-radius:50px;font-size:.73rem;font-weight:600;background:var(--pink-lt);color:var(--hot)}
.badge-lav{background:var(--lav-lt);color:#7C3AED} .badge-gold{background:var(--gold-lt);color:#92400E} .badge-green{background:#D1FAE5;color:#065F46}
.divider{border:none;height:1.5px;margin:20px 0;background:linear-gradient(90deg,transparent,rgba(244,114,182,.3) 30%,rgba(244,114,182,.3) 70%,transparent)}

::-webkit-scrollbar{width:7px;height:7px} ::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(244,114,182,.35);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:rgba(244,114,182,.6)}

.text-center{text-align:center} .text-muted{color:var(--muted)} .text-pink{color:var(--hot)}
.text-sm{font-size:.83rem} .fw-bold{font-weight:700} .italic{font-style:italic}
.d-flex{display:flex} .align-center{align-items:center}
.gap-8{gap:8px} .gap-12{gap:12px} .gap-16{gap:16px} .flex-1{flex:1}
.mt-8{margin-top:8px} .mb-8{margin-bottom:8px}
.mt-16{margin-top:16px} .mb-16{margin-bottom:16px}
.mt-24{margin-top:24px} .mb-24{margin-bottom:24px}
.hidden{display:none!important}

/* RESPONSIVE */
@media(max-width:768px){
  .site-header{height:auto;flex-wrap:wrap;padding:10px 16px;gap:10px}
  .logo-main{font-size:1.35rem}
  .logo-rose{width:15px;height:15px}
  .header-nav{gap:4px} .nav-pill{padding:6px 10px;font-size:.82rem}
  .space-btn{min-width:90px;font-size:.78rem;padding:7px 12px}
  .gallery{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;padding:16px}
  .toolbar{padding:10px 16px;position:static}
  .modal-body{padding:16px} .form-row{grid-template-columns:1fr}
}
@media(max-width:480px){
  .gallery{grid-template-columns:1fr 1fr;gap:10px;padding:12px}
  .btn-lg{padding:12px 20px;font-size:.92rem}
}

/* ============================================================
   ADMIN PAGE
============================================================ */
.admin-page { max-width:1100px; margin:0 auto; padding:28px 24px 60px }

/* Stats grid */
.admin-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
  gap:16px; margin-bottom:28px;
}
.stat-card {
  background:rgba(255,255,255,.88);
  border:1.5px solid rgba(244,114,182,.18);
  border-radius:var(--r); padding:20px 14px;
  text-align:center;
  box-shadow:var(--sh-card);
  backdrop-filter:blur(10px);
  transition:transform .2s,box-shadow .2s;
  position:relative; overflow:hidden;
}
.stat-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:var(--grad);
}
.stat-card:hover { transform:translateY(-3px); box-shadow:0 10px 32px rgba(232,85,154,.2) }
.stat-icon { font-size:1.8rem; margin-bottom:6px }
.stat-num {
  font-family:'Playfair Display',serif; font-size:2rem; font-weight:900; line-height:1;
  background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.stat-lbl { font-size:.75rem; font-weight:600; color:var(--muted); margin-top:4px }

/* Flash messages */
.flash {
  padding:13px 18px; border-radius:var(--rsm); font-size:.9rem; font-weight:500;
  margin-bottom:20px; display:flex; align-items:center; gap:10px;
}
.flash-success { background:#D1FAE5; color:#065F46; border:1.5px solid #6EE7B7 }
.flash-error   { background:#FEE2E2; color:#991B1B; border:1.5px solid #FCA5A5 }

/* Badges rôle */
.badge-admin { background:linear-gradient(135deg,#FDE68A,#F59E0B); color:#78350F; font-weight:700 }
.badge-user  { background:var(--lav-lt); color:#5B21B6 }

/* Table */
.table-wrap {
  background:rgba(255,255,255,.9);
  border:1.5px solid rgba(244,114,182,.15);
  border-radius:var(--r); overflow-x:auto;
  box-shadow:var(--sh-card);
  -webkit-overflow-scrolling:touch;
}
.data-table { width:100%; min-width:640px; border-collapse:collapse; font-size:.88rem }
.data-table thead { background:var(--grad) }
.data-table thead th {
  color:#fff; font-weight:700; font-size:.78rem; text-transform:uppercase;
  letter-spacing:.05em; padding:13px 16px; text-align:left; white-space:nowrap;
}
.data-table tbody tr {
  border-bottom:1px solid rgba(244,114,182,.1);
  transition:background .15s;
}
.data-table tbody tr:last-child { border-bottom:none }
.data-table tbody tr:hover { background:rgba(244,114,182,.05) }
.data-table tbody td { padding:12px 16px; color:var(--text); vertical-align:middle }

/* Full-width button */
.btn-full { width:100%; justify-content:center }

/* Admin table action icon buttons */
.admin-action-btn {
  width:34px; height:34px; border-radius:10px;
  border:1.5px solid rgba(244,114,182,.25);
  background:#fff; font-size:1rem; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  transition:all .15s; flex-shrink:0;
}
.admin-action-btn:hover { background:var(--pink-lt); border-color:var(--pink); transform:scale(1.08) }
.admin-action-danger:hover { background:rgba(239,68,68,.08); border-color:#fca5a5 }

/* Admin tabs */
.admin-tabs {
  display:flex; gap:8px; margin-bottom:24px; flex-wrap:wrap;
}

/* Admin user detail view */
.admin-user-detail {
  background:#fff;
  border-radius:var(--r);
  box-shadow:var(--shadow);
  overflow:hidden;
  margin-bottom:24px;
}
.aud-header {
  display:flex;
  align-items:flex-start;
  gap:18px;
  padding:28px 28px 22px;
  background:linear-gradient(135deg,#fff5fa,#f8f0ff);
  border-bottom:1px solid rgba(244,114,182,.12);
  flex-wrap:wrap;
}
.aud-avatar {
  font-size:52px;
  line-height:1;
  flex-shrink:0;
}
.aud-info { flex:1; min-width:160px }
.aud-info h2 {
  font-family:'Playfair Display',serif;
  font-size:22px;
  color:var(--text);
  margin-bottom:4px;
}
.aud-info p { color:var(--muted); font-size:13px }
.aud-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  margin-left:auto;
}
.aud-stats {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(100px,1fr));
  gap:1px;
  background:rgba(244,114,182,.08);
  border-bottom:1px solid rgba(244,114,182,.08);
}
.aud-stat { background:#fff; padding:18px 14px; text-align:center }
.aud-stat span {
  display:block;
  font-size:26px;
  font-weight:800;
  color:var(--hot);
  font-family:'Playfair Display',serif;
  line-height:1;
  margin-bottom:4px;
}
.aud-stat small {
  font-size:11px;
  color:var(--muted);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.admin-user-detail .table-wrap,
.admin-user-detail h3 { padding-left:24px; padding-right:24px }
.admin-user-detail h3 { padding-top:22px }

/* Crop modal */
.crop-modal {
  background:#fff;
  border-radius:20px;
  max-width:540px;
  width:100%;
  overflow:hidden;
  box-shadow:0 20px 80px rgba(255,20,147,.25);
  display:flex;
  flex-direction:column;
  max-height:90vh;
}
.crop-modal-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 22px 14px;
  border-bottom:1px solid rgba(244,114,182,.15);
  font-family:'Playfair Display',serif;
  font-size:17px;
  font-weight:700;
  color:var(--text);
  flex-shrink:0;
}
.crop-modal-canvas {
  background:#1a1a1a;
  flex:1;
  min-height:240px;
  max-height:380px;
  overflow:hidden;
}
.crop-modal-canvas img { display:block; max-width:100% }
.crop-modal-ratios {
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  padding:12px 16px;
  border-top:1px solid rgba(244,114,182,.1);
  border-bottom:1px solid rgba(244,114,182,.1);
  flex-shrink:0;
}
.crop-modal-footer {
  display:flex;
  gap:10px;
  padding:14px 20px;
  justify-content:flex-end;
  flex-shrink:0;
}

/* Emoji picker */
.emoji-picker-wrap { position:relative }
.emoji-grid {
  display:flex; flex-wrap:wrap; gap:6px;
  padding:12px; margin-top:8px;
  background:#fff; border:1.5px solid rgba(244,114,182,.25);
  border-radius:var(--rsm); box-shadow:0 4px 20px rgba(232,85,154,.15);
}
.emoji-opt {
  width:36px; height:36px; border-radius:10px; border:1.5px solid transparent;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; cursor:pointer; transition:all .15s;
  background:transparent;
}
.emoji-opt:hover  { background:var(--pink-lt); border-color:var(--pink); transform:scale(1.15) }
.emoji-opt.chosen { background:var(--grad); border-color:transparent; box-shadow:0 2px 8px rgba(232,85,154,.4) }

/* ============================================================
   MON JOURNAL — Section privée par pain
============================================================ */
.journal-section {
  background:#fff;
  border:1.5px solid rgba(244,114,182,.2);
  border-radius:var(--r);
  box-shadow:var(--sh-card);
  margin-bottom:28px;
  overflow:hidden;
}

.journal-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 22px;
  background:linear-gradient(135deg,rgba(251,207,232,.4) 0%,rgba(237,233,254,.4) 100%);
  cursor:pointer; user-select:none;
  transition:background .2s;
}
.journal-header:hover { background:linear-gradient(135deg,rgba(251,207,232,.6) 0%,rgba(237,233,254,.6) 100%) }

.journal-title {
  font-family:'Playfair Display',serif;
  font-size:1.15rem; font-weight:700;
  color:var(--deep);
  display:flex; align-items:center; gap:10px;
}

.journal-private-badge {
  font-family:'Poppins',sans-serif;
  font-size:11px; font-weight:600;
  background:rgba(196,181,253,.3);
  color:var(--text-2);
  padding:3px 10px; border-radius:20px;
  letter-spacing:.3px;
}

.journal-toggle-icon {
  font-size:13px; color:var(--muted);
  transition:transform .25s;
}
.journal-toggle-icon.open { transform:rotate(180deg) }

.journal-body { padding:22px }

.journal-intro {
  font-size:13px; color:var(--muted);
  margin-bottom:18px; font-style:italic;
  text-align:center;
}

/* ─── Bouton afficher/cacher le formulaire ─── */
.journal-add-btn {
  display:flex; align-items:center; gap:8px;
  background:var(--grad);
  color:#fff; border:none;
  padding:10px 20px; border-radius:var(--rsm);
  font-size:13px; font-weight:600;
  cursor:pointer; margin-bottom:20px;
  box-shadow:var(--sh-btn);
  transition:transform .15s, box-shadow .15s;
}
.journal-add-btn:hover { transform:translateY(-2px) }

/* ─── Formulaire guidé ─── */
.journal-form {
  background:var(--grad-soft);
  border-radius:var(--rsm);
  padding:20px;
  margin-bottom:22px;
  border:1.5px solid rgba(244,114,182,.15);
}

.journal-form-header {
  font-size:14px; font-weight:700;
  color:var(--deep); margin-bottom:16px;
  display:flex; align-items:center; gap:6px;
}

.journal-form-row {
  display:grid; grid-template-columns:1fr 1fr; gap:14px;
  margin-bottom:14px;
}
@media(max-width:540px){ .journal-form-row { grid-template-columns:1fr } }

.journal-question { margin-bottom:14px }

.journal-q-label {
  display:block;
  font-size:12px; font-weight:600;
  color:var(--text-2);
  margin-bottom:6px;
  letter-spacing:.2px;
}

.journal-libre {
  background:rgba(255,255,255,.7);
  border:1.5px dashed rgba(244,114,182,.35);
  border-radius:var(--rsm);
  width:100%; padding:12px;
  font-family:'Poppins',sans-serif;
  font-size:13px; color:var(--text);
  resize:vertical; min-height:90px;
  transition:border-color .2s;
}
.journal-libre:focus {
  outline:none;
  border-color:var(--pink);
  border-style:solid;
  background:#fff;
}

/* ─── Timeline des entrées ─── */
.journal-timeline { display:flex; flex-direction:column; gap:16px }

/* ─── Entry card ─── */
.journal-entry {
  background:#fff;
  border:1.5px solid rgba(244,114,182,.18);
  border-radius:var(--rsm);
  padding:0 18px;
  position:relative;
  transition:box-shadow .2s;
  overflow:hidden;
}
.journal-entry:hover { box-shadow:0 4px 16px rgba(232,85,154,.1) }
.journal-entry::before {
  content:''; position:absolute; left:0; top:0; bottom:0;
  width:4px; border-radius:var(--rsm) 0 0 var(--rsm);
  background:var(--grad);
}

/* ─── Collapsed summary row ─── */
.journal-entry-summary {
  display:flex; align-items:center; justify-content:space-between;
  padding:13px 0; cursor:pointer; user-select:none; gap:8px;
}
.journal-entry-summary-left {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap; flex:1;
}
.journal-event-badge {
  font-size:12px; font-weight:600; padding:3px 12px; border-radius:20px;
  background:var(--grad); color:#fff; letter-spacing:.3px; white-space:nowrap;
}
.journal-entry-date { font-size:12px; color:var(--muted) }
.journal-moods-preview { font-size:1rem; letter-spacing:1px }
.journal-entry-toggle { font-size:12px; color:var(--muted); flex-shrink:0 }

/* ─── Expanded details ─── */
.journal-entry-details {
  padding:12px 0 16px;
  border-top:1px solid rgba(244,114,182,.15);
}
.journal-qa { margin-bottom:10px }
.journal-q {
  font-size:11px; font-weight:700; color:var(--text-2);
  text-transform:uppercase; letter-spacing:.5px; margin-bottom:3px;
}
.journal-a { font-size:13px; color:var(--text); line-height:1.65 }
.journal-libre-block {
  margin-top:10px; padding-top:10px;
  border-top:1px dashed rgba(244,114,182,.2);
}

/* ─── Actions (edit / delete) ─── */
.journal-entry-actions {
  display:flex; gap:10px; margin-top:14px; padding-top:12px;
  border-top:1px solid rgba(244,114,182,.1);
}
.journal-edit-btn {
  background:var(--grad-soft); border:1.5px solid rgba(244,114,182,.25);
  color:var(--deep); border-radius:var(--rsm); padding:6px 16px;
  font-size:12px; font-weight:600; cursor:pointer; transition:all .15s;
}
.journal-edit-btn:hover { background:var(--pink-lt); border-color:var(--pink) }
.journal-del-btn {
  background:none; border:1.5px solid rgba(196,181,253,.3);
  color:var(--muted); border-radius:var(--rsm); padding:6px 12px;
  font-size:12px; font-weight:600; cursor:pointer; transition:all .15s;
}
.journal-del-btn:hover { background:rgba(255,0,0,.06); border-color:#fca5a5; color:#e05 }

/* ─── Inline edit form ─── */
.journal-edit-form {
  padding:16px; background:var(--grad-soft);
  border-radius:var(--rsm); margin:8px 0;
}
.journal-cancel-btn {
  background:none; border:1.5px solid rgba(196,181,253,.5);
  color:var(--muted); border-radius:var(--rsm); padding:5px 12px;
  font-size:12px; cursor:pointer; transition:all .15s;
}
.journal-cancel-btn:hover { border-color:var(--lav); color:var(--deep) }

/* ─── Mood multiple-choice ─── */
.mood-selector { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px }
.mood-btn {
  padding:6px 12px; border-radius:20px;
  border:1.5px solid rgba(244,114,182,.25);
  background:#fff; font-size:12px; cursor:pointer; transition:all .15s;
  white-space:nowrap;
}
.mood-btn:hover { border-color:var(--pink); background:var(--pink-lt) }
.mood-btn.mood-active {
  background:var(--grad); color:#fff; border-color:transparent;
  box-shadow:0 2px 8px rgba(232,85,154,.3);
}

/* ─── Single choice row ─── */
.choice-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:6px }
.choice-btn {
  padding:7px 16px; border-radius:var(--rsm);
  border:1.5px solid rgba(244,114,182,.25);
  background:#fff; font-size:13px; cursor:pointer; transition:all .15s;
}
.choice-btn:hover { border-color:var(--pink); background:var(--pink-lt) }
.choice-btn.choice-active {
  background:var(--grad); color:#fff; border-color:transparent;
  box-shadow:0 2px 8px rgba(232,85,154,.3);
}

/* ─── Heart intensity scale ─── */
.heart-scale { display:flex; gap:6px; margin-top:6px; align-items:center }
.heart-btn {
  font-size:1.5rem; border:none; background:none; padding:2px;
  cursor:pointer; transition:transform .15s; line-height:1;
}
.heart-btn:hover { transform:scale(1.35) }

/* ─── Empty / loading states ─── */
.journal-empty {
  text-align:center; padding:30px;
  color:var(--muted); font-size:13px; font-style:italic;
}
.journal-empty span { font-size:2rem; display:block; margin-bottom:8px }
.journal-loading {
  text-align:center; padding:20px;
  color:var(--muted); font-size:13px;
  animation:pulse 1.4s ease-in-out infinite;
}
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

/* ============================================================
   LIVE SEARCH DROPDOWN
============================================================ */
.search-wrap { position:relative }

.search-dropdown {
  position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:500;
  background:#fff;
  border-radius:var(--r);
  box-shadow:0 8px 40px rgba(232,85,154,.15), 0 2px 12px rgba(196,181,253,.2);
  border:1.5px solid rgba(244,114,182,.2);
  overflow:hidden;
  max-height:440px; overflow-y:auto;
}

.search-section-hdr {
  font-size:11px; font-weight:700; color:var(--muted);
  text-transform:uppercase; letter-spacing:.5px;
  padding:10px 16px 6px;
  background:var(--grad-soft);
  position:sticky; top:0;
}

.search-row {
  display:flex; align-items:center; gap:12px;
  padding:10px 16px; cursor:pointer; transition:background .15s;
  border-bottom:1px solid rgba(244,114,182,.07);
}
.search-row:hover { background:var(--pink-lt) }
.search-row:last-child { border-bottom:none }

.search-thumb {
  width:36px; height:36px; border-radius:50%;
  background:var(--grad-soft);
  display:flex; align-items:center; justify-content:center;
  font-size:1.1rem; flex-shrink:0; overflow:hidden;
}

.search-row-info { flex:1; min-width:0 }
.search-row-name {
  font-weight:600; font-size:13px; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.search-row-sub { font-size:11px; color:var(--muted); margin-top:1px }

.search-empty {
  padding:22px; text-align:center;
  font-size:13px; color:var(--muted); font-style:italic;
}

.search-see-all {
  padding:10px 16px; text-align:center;
  font-size:12px; font-weight:700; color:var(--hot);
  cursor:pointer; transition:background .15s;
  border-top:1px solid rgba(244,114,182,.1);
}
.search-see-all:hover { background:var(--pink-lt) }

/* Follow actions in search results */
.srch-follow-btn {
  background:var(--grad); color:#fff; border:none;
  padding:5px 14px; border-radius:20px;
  font-size:12px; font-weight:600; cursor:pointer;
  white-space:nowrap; transition:opacity .15s;
  flex-shrink:0;
}
.srch-follow-btn:disabled { opacity:.6; cursor:default }
.srch-follow-badge {
  font-size:12px; font-weight:600; white-space:nowrap;
  padding:4px 10px; border-radius:20px; flex-shrink:0;
}
.srch-follow-badge.accepted { background:rgba(52,211,153,.15); color:#059669 }
.srch-follow-badge.pending  { background:rgba(245,158,11,.15);  color:#D97706 }

/* Notification badge (follow requests) */
.follow-notif-badge {
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--hot); color:#fff; border-radius:50%;
  width:17px; height:17px; font-size:10px; font-weight:700;
  margin-left:5px; line-height:1; flex-shrink:0;
}

/* Follow modal sections */
.follow-section-label {
  font-size:12px; font-weight:700; color:var(--text-2);
  text-transform:uppercase; letter-spacing:.5px;
  margin-bottom:10px;
}

/* ============================================================
   LOGO ANIMATION
============================================================ */
@keyframes logoPop {
  0%   { transform:scale(1) rotate(0deg) }
  25%  { transform:scale(1.18) rotate(-4deg) }
  50%  { transform:scale(1.22) rotate(4deg) }
  75%  { transform:scale(1.12) rotate(-2deg) }
  100% { transform:scale(1) rotate(0deg) }
}
@keyframes logoShimmer {
  0%,100% { filter:brightness(1) drop-shadow(0 0 0px rgba(232,85,154,0)) }
  50%      { filter:brightness(1.15) drop-shadow(0 0 12px rgba(232,85,154,.6)) }
}
.logo-pop {
  animation:logoPop .5s cubic-bezier(.36,.07,.19,.97), logoShimmer .5s ease !important;
}

/* ============================================================
   PROFILE PAGE
============================================================ */
.profile-page {
  max-width:860px;
  margin:0 auto;
  padding:0 16px 60px;
}

/* Hero card */
.profile-hero {
  background:#fff;
  border-radius:24px;
  box-shadow:var(--shadow);
  overflow:hidden;
  margin-bottom:28px;
  position:relative;
}
.profile-hero-bg {
  height:120px;
  background:linear-gradient(135deg, var(--pink) 0%, #c084fc 50%, #f472b6 100%);
  position:relative;
}
.profile-hero-bg::after {
  content:'';
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.08'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.profile-hero-content {
  display:flex;
  gap:22px;
  padding:0 28px 24px;
  align-items:flex-start;
  flex-wrap:wrap;
}
.profile-photo-wrap {
  width:110px;
  height:110px;
  border-radius:50%;
  border:4px solid #fff;
  box-shadow:0 4px 20px rgba(255,20,147,.2);
  margin-top:-50px;
  flex-shrink:0;
  overflow:hidden;
  position:relative;
  background:linear-gradient(135deg,#fce7f3,#ede9fe);
  cursor:pointer;
}
.profile-photo-img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.profile-photo-emoji {
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:52px;
}
.profile-photo-edit-hint {
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  opacity:0;
  transition:opacity .2s;
  border-radius:50%;
}
.profile-photo-wrap:hover .profile-photo-edit-hint { opacity:1 }

.profile-hero-info {
  flex:1;
  padding-top:16px;
  min-width:200px;
}
.profile-name-row {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:6px;
}
.profile-name {
  font-family:'Playfair Display',serif;
  font-size:24px;
  color:var(--text);
  font-style:italic;
  margin:0;
}

/* Stars display */
.profile-stars-display {
  display:flex;
  align-items:center;
  gap:2px;
  margin-bottom:12px;
  flex-wrap:wrap;
}
.profile-star {
  font-size:20px;
  line-height:1;
  transition:transform .15s;
}
.profile-star.star-full  { color:#f59e0b }
.profile-star.star-half  { color:#f59e0b; filter:opacity(.6) }
.profile-star.star-empty { color:#d1d5db }
.profile-stars-label {
  font-size:13px;
  font-weight:600;
  color:var(--text);
  margin-left:6px;
}

/* Bio */
.profile-bio {
  font-size:14px;
  color:var(--text);
  line-height:1.6;
  margin-bottom:12px;
}
.profile-bio p { margin:0 }
.profile-bio-placeholder {
  color:var(--muted);
  font-style:italic;
  cursor:pointer;
}
.profile-bio-placeholder:hover { color:var(--hot) }
.profile-edit-bio-btn {
  background:none;
  border:none;
  color:var(--muted);
  font-size:12px;
  cursor:pointer;
  padding:0;
  margin-top:4px;
  display:block;
}
.profile-edit-bio-btn:hover { color:var(--hot) }

.profile-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

/* Rate section */
.profile-rate-section {
  border-top:1px solid rgba(244,114,182,.12);
  padding:16px 28px 20px;
  text-align:center;
}
.profile-rate-label {
  font-size:13px;
  font-weight:600;
  color:var(--muted);
  margin-bottom:10px;
}
.profile-rate-stars {
  display:flex;
  justify-content:center;
  gap:6px;
  margin-bottom:8px;
}
.profile-rate-star {
  font-size:36px;
  background:none;
  border:none;
  cursor:pointer;
  color:#d1d5db;
  line-height:1;
  transition:transform .12s, color .12s;
  padding:0 2px;
}
.profile-rate-star.rate-active { color:#f59e0b }
.profile-rate-star.rate-hover  { color:#fbbf24; transform:scale(1.2) }
.profile-rate-hint {
  font-size:13px;
  color:var(--muted);
  min-height:18px;
  font-style:italic;
}

/* Pains section */
.profile-pains-section { padding-top:4px }
.profile-section-title {
  font-family:'Playfair Display',serif;
  font-size:20px;
  color:var(--text);
  font-style:italic;
  margin-bottom:18px;
}
.profile-pains-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));
  gap:16px;
}
.profile-empty {
  text-align:center;
  padding:40px 20px;
  color:var(--muted);
  font-size:15px;
  background:#fff;
  border-radius:var(--r);
  box-shadow:var(--shadow);
}

/* Pain detail — creator link & voter pills */
.detail-creator-link {
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:13px;
  font-weight:600;
  color:var(--muted);
  text-decoration:none;
  background:rgba(244,114,182,.08);
  border:1px solid rgba(244,114,182,.2);
  padding:4px 12px;
  border-radius:50px;
  transition:all .15s;
}
.detail-creator-link:hover {
  background:var(--pink-lt);
  color:var(--hot);
  border-color:var(--pink);
}
.voters-row {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
  margin-bottom:16px;
}
.voter-pill {
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 12px;
  border-radius:50px;
  background:rgba(244,114,182,.08);
  border:1px solid rgba(244,114,182,.15);
  font-size:12px;
  font-weight:600;
  color:var(--text);
}
.voter-pill-link {
  text-decoration:none;
  cursor:pointer;
  transition:all .15s;
}
.voter-pill-link:hover {
  background:var(--pink-lt);
  color:var(--hot);
  border-color:var(--pink);
  transform:translateY(-1px);
}

@media (max-width:520px) {
  .profile-hero-content { padding:0 16px 20px }
  .profile-rate-section { padding:14px 16px 18px }
  .profile-photo-wrap { width:88px; height:88px; margin-top:-40px }
  .profile-name { font-size:20px }
}

/* ── Groups grid & cards ─────────────────────────────────────── */
.groups-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:16px;
  padding:4px 0 8px;
}
.group-card {
  background:#fff;
  border-radius:var(--r);
  border:1.5px solid rgba(244,114,182,.18);
  box-shadow:var(--sh-card);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  transition:transform .15s, box-shadow .15s;
}
.group-card:hover {
  transform:translateY(-2px);
  box-shadow:0 8px 32px rgba(232,85,154,.18);
}
.group-card-inner {
  padding:20px 18px 14px;
  display:flex;
  flex-direction:column;
  gap:6px;
  flex:1;
}
.group-card-icon {
  font-size:28px;
}
.group-card-name {
  font-weight:700;
  font-size:15px;
  color:var(--text);
}
.group-owner-badge {
  display:inline-block;
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  background:var(--grad);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.group-card-stats {
  display:flex;
  gap:10px;
  font-size:12px;
  color:var(--muted);
  font-weight:600;
  margin-top:4px;
}
.group-card-actions {
  padding:10px 14px 14px;
  display:flex;
  gap:8px;
  border-top:1px solid rgba(244,114,182,.1);
}
.group-card-add {
  border-style:dashed;
  cursor:pointer;
  min-height:120px;
  justify-content:center;
  align-items:center;
  opacity:.7;
  transition:opacity .15s, transform .15s;
}
.group-card-add:hover { opacity:1; transform:translateY(-2px); }

/* ── Profile questionnaire ───────────────────────────────────── */
.profile-questionnaire-section {
  max-width:720px;
  margin:0 auto 24px;
  padding:0 16px;
}
.profile-section-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:16px;
}
.profile-q-empty {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  padding:28px;
  border-radius:var(--r);
  border:2px dashed rgba(244,114,182,.3);
  text-align:center;
  cursor:pointer;
  color:var(--muted);
  font-size:14px;
  transition:background .15s;
}
.profile-q-empty:hover { background:rgba(244,114,182,.05); }
.profile-q-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:14px;
}
.profile-q-card {
  background:#fff;
  border-radius:var(--r);
  border:1.5px solid rgba(244,114,182,.15);
  box-shadow:var(--sh-card);
  padding:16px 16px 18px;
  display:flex;
  flex-direction:column;
  gap:6px;
  transition:transform .15s, box-shadow .15s;
}
.profile-q-card:hover {
  transform:translateY(-2px);
  box-shadow:0 6px 24px rgba(232,85,154,.15);
}
.profile-q-emoji {
  font-size:22px;
  line-height:1;
}
.profile-q-label {
  font-size:11px;
  font-weight:700;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.04em;
  line-height:1.3;
}
.profile-q-answer {
  font-size:14px;
  font-weight:600;
  color:var(--text);
  line-height:1.45;
}