/* ═══════════════════════════════════════════════════════
   INSTANT. — Shared design system
   Used by every page. Edit here = propagates everywhere.
═══════════════════════════════════════════════════════ */
:root{
  --paper:#F4F1EA; --paper2:#ECE6D8; --card:#FCFAF5;
  --ink:#23201A; --ink-soft:#5B5447; --muted:#8B8273;
  --night:#1E1B16; --night2:#16140F;
  --gold:#B89060; --gold-ink:#8A6526; --champ:#E6D9C0;
  --line:#E0D9CA; --line2:#CFC6B3;
  --green:#3C6E4A;
  --sec:clamp(64px,9vh,108px);
  --maxw:1140px;
  --r:16px; --r-sm:11px;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Archivo',system-ui,sans-serif;background:var(--paper);color:var(--ink);
     -webkit-font-smoothing:antialiased;line-height:1.5}
em{font-family:'Spectral',serif;font-style:italic;font-weight:400}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

/* ── type ── */
.h1{font-weight:900;font-size:clamp(2.6rem,5.2vw,4.7rem);line-height:1.0;letter-spacing:-.035em}
.h2{font-weight:800;font-size:clamp(2rem,3.5vw,3.25rem);line-height:1.05;letter-spacing:-.028em}
.h3{font-weight:700;font-size:1.32rem;letter-spacing:-.018em;line-height:1.15}
.over{font-size:.66rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);
      display:inline-flex;align-items:center;gap:.7rem}
.over::before{content:"";width:22px;height:1.5px;background:var(--gold);display:block}
.over.ctr{justify-content:center}
.over.ctr::after{content:"";width:22px;height:1.5px;background:var(--gold);display:block}
.lead{font-size:1.06rem;line-height:1.62;color:var(--ink-soft);max-width:46ch}
.muted{color:var(--muted)}
.eyebrow{font-size:.78rem;font-weight:600;color:var(--ink-soft)}

/* ── layout ── */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 34px}
.sec{padding:var(--sec) 0}
.bg2{background:var(--paper2)}
.bg-night{background:var(--night);color:#F4F1EA}

/* ── pill / ticks ── */
.pill{display:inline-flex;align-items:center;gap:.5rem;font-size:.72rem;font-weight:600;letter-spacing:.02em;
      border:1px solid var(--line2);border-radius:100px;padding:.4rem .85rem;background:var(--card)}
.pill .s{color:var(--gold)}
.ticks{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.tick{display:inline-flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--ink-soft);font-weight:500}
.tick .c{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold-ink);
         display:grid;place-items:center;font-size:.62rem;font-weight:800;flex-shrink:0}
.dvr{width:1px;height:14px;background:var(--line2)}

/* ── buttons ── */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-family:inherit;font-weight:700;font-size:.92rem;
     padding:.85rem 1.5rem;border-radius:12px;border:1.5px solid transparent;cursor:pointer;
     transition:transform .25s var(--ease),background .25s,box-shadow .25s;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--gold);color:#fff;box-shadow:0 8px 22px -8px rgba(184,144,96,.7)}
.btn-primary:hover{background:#a87f4f}
.btn-dark{background:var(--ink);color:var(--paper)}
.btn-dark:hover{background:#000}
.btn-ghost{background:transparent;border-color:var(--line2);color:var(--ink)}
.btn-ghost:hover{border-color:var(--ink);background:var(--ink);color:var(--paper)}
.btn-light{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#F4F1EA}
.btn-light:hover{background:rgba(255,255,255,.16);transform:translateY(-2px)}
.btn-sm{font-size:.8rem;padding:.62rem 1.1rem}
.lnk{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
     border-bottom:1.5px solid var(--line2);padding-bottom:.2rem;transition:border-color .2s}
.lnk:hover{border-color:var(--gold)}

/* ── nav ── */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:blur(12px);
     border-bottom:1px solid var(--line)}
.nav-in{max-width:var(--maxw);margin:0 auto;padding:.85rem 34px;display:flex;align-items:center;gap:1.6rem}
.logo{display:inline-flex;align-items:center;gap:.5rem;font-weight:900;font-size:1.12rem;letter-spacing:-.02em}
.logo .mk{width:26px;height:26px;border-radius:7px;background:var(--ink);display:grid;place-items:center;flex-shrink:0}
.logo .dot{color:var(--gold);margin-left:-.5rem}
.nav-links{display:flex;gap:1.5rem;margin-left:1rem}
.nav-links a{font-size:.82rem;font-weight:500;color:var(--ink-soft);transition:color .2s;position:relative}
.nav-links a:hover{color:var(--ink)}
.nav-links a.active{color:var(--ink);font-weight:700}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1.5px;background:var(--gold)}
.nav-sp{flex:1}
@media(max-width:880px){.nav-links{display:none}}

/* ── mobile nav (injected by widget.js) ── */
.nav-burger{display:none;width:42px;height:42px;border:1.5px solid var(--line2);border-radius:11px;background:var(--card);
  cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex-shrink:0;margin-left:.4rem}
.nav-burger span{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;transition:transform .25s var(--ease),opacity .2s}
.nav-open .nav-burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-open .nav-burger span:nth-child(2){opacity:0}
.nav-open .nav-burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav-mobile{position:fixed;top:58px;left:0;right:0;z-index:49;background:var(--card);border-bottom:1px solid var(--line);
  box-shadow:0 18px 36px -18px rgba(35,32,26,.3);padding:.6rem 18px 1.1rem;
  transform:translateY(-12px);opacity:0;pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease);
  max-height:calc(100vh - 58px);overflow-y:auto}
.nav-open .nav-mobile{transform:none;opacity:1;pointer-events:auto}
.nav-mobile a.nm-link{display:flex;align-items:center;justify-content:space-between;padding:.85rem .3rem;font-size:1rem;font-weight:600;
  color:var(--ink);border-bottom:1px solid var(--line)}
.nav-mobile a.nm-link::after{content:"→";color:var(--gold);opacity:.6}
.nav-mobile a.nm-link.active{color:var(--gold-ink)}
.nav-mobile .nm-cta{display:flex;flex-direction:column;gap:.6rem;margin-top:1rem}
.nav-mobile .nm-cta .btn{width:100%;justify-content:center;font-size:.92rem;padding:.85rem}
@media(max-width:880px){
  .nav-burger{display:flex}
  .nav .btn-ghost.btn-sm{display:none}      /* "Mon espace" moves into the menu */
}

/* ── hero ── */
.hero{background:var(--night);color:#F4F1EA;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(680px 420px at 88% -8%,rgba(184,144,96,.16),transparent 60%)}
.hero-in{max-width:var(--maxw);margin:0 auto;padding:clamp(56px,8vh,96px) 34px clamp(60px,9vh,104px);
         display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(32px,5vw,72px);align-items:center;position:relative}
.hero-txt{max-width:540px}
.hero .pill{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#EDE7DC}
.hero h1{margin:1.5rem 0 1.25rem;color:#FBF8F1}
.hero h1 em{color:var(--champ);display:block}
.hero .lead{color:rgba(244,241,234,.62);margin-bottom:1.6rem}
.hero .ticks{margin-bottom:1.9rem}
.hero .tick{color:rgba(244,241,234,.78)}
.hero .tick .c{border-color:rgba(184,144,96,.7);color:var(--champ)}
.hero .dvr{background:rgba(255,255,255,.14)}
.hero-btns{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.hero-micro{margin-top:1.15rem;font-size:.78rem;color:rgba(244,241,234,.4)}
.hero-micro b{color:var(--champ);font-weight:600}
@media(max-width:780px){.hero-in{grid-template-columns:1fr;gap:40px}.hero-demo{order:-1}}

/* ── player demo (matches final player UI) ── */
.phone{width:300px;max-width:100%;margin:0 auto;background:linear-gradient(155deg,#322D25,#15130F 62%);border-radius:44px;padding:6px;
       box-shadow:0 38px 80px -34px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.07),inset 0 0 0 1px rgba(0,0,0,.5);position:relative}
.scr{background:#0C0B09;border-radius:38px;overflow:hidden}

/* browser bar */
.pl-top{background:#0C0B09;padding:.6rem .85rem;display:flex;align-items:center;gap:.4rem;border-bottom:1px solid rgba(255,255,255,.05)}
.pl-top .d{width:8px;height:8px;border-radius:50%}
.pl-url{margin:0 auto;font-size:.58rem;font-family:'Spectral',serif;color:rgba(255,255,255,.32);letter-spacing:.03em}

/* event banner */
.pl-banner{height:66px;position:relative;display:flex;align-items:flex-end;padding:.55rem .85rem;
  background:linear-gradient(135deg,#DCC6A0 0%,#C9A87C 52%,#A8814E 100%)}
.pl-banner .emo{position:absolute;top:46%;left:50%;transform:translate(-50%,-50%);font-size:1.7rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.25))}
.pl-banner .evt{position:relative;font-weight:800;font-size:.82rem;color:#fff;text-shadow:0 1px 5px rgba(0,0,0,.4);letter-spacing:-.01em}

/* body */
.pl-body{padding:.85rem .85rem 1rem}

/* event row */
.pl-evt{display:flex;align-items:center;gap:.55rem;padding-bottom:.7rem;border-bottom:1px solid rgba(255,255,255,.07);margin-bottom:.8rem}
.pl-av{width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);display:grid;place-items:center;font-size:1rem;flex-shrink:0}
.pl-ev-n{font-size:.74rem;font-weight:800;color:#F4F1EA;letter-spacing:-.01em}
.pl-ev-s{font-size:.58rem;color:rgba(255,255,255,.38);margin-top:.06rem}
.pl-live{margin-left:auto;display:inline-flex;align-items:center;gap:.32rem;font-size:.54rem;font-weight:800;letter-spacing:.1em;
  color:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.2);padding:.2rem .5rem;border-radius:100px;flex-shrink:0}
.pl-live i{width:5px;height:5px;border-radius:50%;background:var(--gold);display:block;animation:bl 1.4s infinite}
@keyframes bl{0%,100%{opacity:1}50%{opacity:.25}}

/* progress + timer */
.pl-prog{display:flex;align-items:center;gap:.6rem;margin-bottom:.9rem}
.pl-bar{flex:1;height:5px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.pl-bar i{display:block;height:100%;width:40%;background:linear-gradient(90deg,#C9A87C,#B89060);border-radius:3px}
.pl-timer{font-size:.66rem;font-weight:800;color:#E6D9C0;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);
  padding:.22rem .6rem;border-radius:100px;flex-shrink:0}

/* question */
.pl-q{font-size:1.02rem;font-weight:800;letter-spacing:-.015em;line-height:1.25;color:#F6F2EA;margin:.1rem 0 .85rem}

/* options */
.pl-opts{display:flex;flex-direction:column;gap:.5rem}
.pl-opt{display:flex;align-items:center;gap:.65rem;padding:.7rem .75rem;border:1.5px solid rgba(255,255,255,.1);
  border-radius:13px;font-size:.84rem;font-weight:500;color:rgba(255,255,255,.86);background:rgba(255,255,255,.025);
  transition:all .3s;font-family:inherit;text-align:left;width:100%;cursor:pointer}
.pl-opt .pl-ol{width:24px;height:24px;border-radius:7px;background:rgba(255,255,255,.08);display:grid;place-items:center;
  font-size:.62rem;font-weight:800;color:rgba(255,255,255,.5);flex-shrink:0}
.pl-opt.sel{border-color:var(--gold);background:rgba(184,144,96,.14);color:#fff;font-weight:700}
.pl-opt.sel .pl-ol{background:var(--gold);color:#fff}
.pl-opt.ok{border-color:#5FB87B;background:rgba(60,140,90,.16);color:#fff;font-weight:700}
.pl-opt.ok .pl-ol{background:#3C8C5A;color:#fff}
.pl-opt.no{border-color:#C0563B;background:rgba(192,86,59,.12);opacity:.72}
button.pl-opt:hover{border-color:rgba(184,144,96,.5)}

/* footer */
.pl-foot{display:flex;align-items:center;justify-content:space-between;margin-top:.9rem;padding-top:.8rem;
  border-top:1px solid rgba(255,255,255,.07);font-size:.72rem;font-weight:800;color:#F4F1EA}
.pl-foot .muted{color:rgba(255,255,255,.4);font-weight:600}
.pl-foot .rank{color:rgba(255,255,255,.6)}
/* results / classement screen */
.pl-result{text-align:center}
.pl-result .rh{font-size:1.05rem;font-weight:800;color:#F6F2EA;margin-bottom:.15rem}
.pl-result .rs{font-size:.7rem;color:rgba(255,255,255,.45);margin-bottom:.9rem}
.pl-ranks{display:flex;flex-direction:column;gap:.4rem;text-align:left}
.pl-rk{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem;border-radius:11px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07)}
.pl-rk .pos{width:22px;height:22px;border-radius:7px;background:rgba(255,255,255,.08);display:grid;place-items:center;
  font-size:.64rem;font-weight:800;color:rgba(255,255,255,.55);flex-shrink:0}
.pl-rk.you{border-color:var(--gold);background:rgba(184,144,96,.14)}
.pl-rk.you .pos{background:var(--gold);color:#fff}
.pl-rk .nm{font-size:.82rem;font-weight:700;color:#F4F1EA}
.pl-rk .pts{margin-left:auto;font-size:.8rem;font-weight:800;color:var(--champ)}
.pl-replay{margin-top:.9rem;width:100%;padding:.7rem;border-radius:11px;border:1.5px solid var(--gold);
  background:var(--gold);color:#fff;font-family:inherit;font-weight:800;font-size:.82rem;cursor:pointer;transition:background .2s}
.pl-replay:hover{background:#a87f4f}

/* ── marquee ── */
.mq{background:var(--ink);color:rgba(244,241,234,.5);overflow:hidden;padding:.8rem 0;
    border-block:1px solid rgba(255,255,255,.06)}
.mq-tr{display:flex;gap:0;white-space:nowrap;animation:mq 34s linear infinite;width:max-content}
.mq-tr span{font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:0 1.6rem;
            display:inline-flex;align-items:center;gap:1.6rem}
.mq-tr span::after{content:"✦";color:var(--gold)}
@keyframes mq{to{transform:translateX(-50%)}}

/* ── feature strip (trust band) ── */
.strip{background:var(--card);border-block:1px solid var(--line);padding:1.1rem 0}
.strip-in{max-width:var(--maxw);margin:0 auto;padding:0 34px;display:flex;align-items:center;
          justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.strip-it{display:flex;align-items:center;gap:.55rem;font-size:.8rem;color:var(--ink-soft)}
.strip-it b{color:var(--ink);font-weight:700}
.strip-it .ic{font-size:1.05rem}

/* ── section head ── */
.shead{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:clamp(34px,5vh,58px);flex-wrap:wrap}
.shead.ctr{justify-content:center;text-align:center;flex-direction:column;align-items:center;gap:1rem}
.shead .t{max-width:620px}
.shead .over{margin-bottom:1.1rem}
.shead h2{margin-top:.2rem}

/* ── how it works ── */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3.4vw,48px);--gap:clamp(24px,3.4vw,48px)}
.step{position:relative;z-index:1}
.step:not(:last-child)::after{content:"";position:absolute;top:26px;left:26px;width:calc(100% + var(--gap));
               height:1.5px;background:linear-gradient(90deg,var(--gold),var(--line2));z-index:0}
.step .n{width:52px;height:52px;border-radius:50%;background:var(--ink);color:var(--paper);
         display:grid;place-items:center;font-weight:900;font-size:1.1rem;margin-bottom:1.3rem;
         box-shadow:0 0 0 7px var(--paper);position:relative;z-index:1}
.step h3{margin-bottom:.55rem}
.step p{font-size:.92rem;line-height:1.65;color:var(--ink-soft);max-width:30ch}
.bg2 .step .n{box-shadow:0 0 0 7px var(--paper2)}
/* centered steps variant */
.steps.ctr .step{display:flex;flex-direction:column;align-items:center;text-align:center}
.steps.ctr .step .n{margin-inline:auto}
.steps.ctr .step p{margin-inline:auto}
.steps.ctr .step:not(:last-child)::after{left:50%}
@media(max-width:780px){.steps{grid-template-columns:1fr;gap:1.8rem}.step:not(:last-child)::after{display:none}
  .step .n{box-shadow:0 0 0 7px var(--paper2)}}

/* ── image placeholder ── */
.ph{position:relative;border-radius:var(--r);overflow:hidden;background:var(--paper2);
    border:1px solid var(--line2);display:grid;place-items:center}
.ph::before{content:"";position:absolute;inset:0;opacity:.5;
  background:repeating-linear-gradient(135deg,transparent 0 11px,rgba(139,130,115,.09) 11px 12px)}
.ph .cap{position:relative;font-family:'Spectral',serif;font-style:italic;font-size:.82rem;color:var(--muted);
         background:var(--card);border:1px solid var(--line2);border-radius:100px;padding:.35rem .9rem}
.ph.on-dark{background:#1A1812;border-color:rgba(255,255,255,.08)}
.ph.on-dark::before{background:repeating-linear-gradient(135deg,transparent 0 11px,rgba(255,255,255,.05) 11px 12px)}
.ph.on-dark .cap{background:#0F0E0B;color:rgba(244,241,234,.5);border-color:rgba(255,255,255,.1)}

/* ── activities ── */
.acts{display:grid;grid-template-columns:1.55fr 1fr;gap:18px}
.act{border-radius:var(--r);border:1px solid var(--line2);background:var(--card);padding:26px;display:flex;flex-direction:column}
.act .tag{font-size:.64rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:1.1rem}
.act .ico{font-size:1.7rem;margin-bottom:.7rem}
.act h3{margin-bottom:.6rem}
.act p{font-size:.92rem;line-height:1.65;color:var(--ink-soft);margin-bottom:1.3rem}
.act .ph{margin-top:auto;height:170px}
.act.dark{background:var(--night);color:#F4F1EA;border-color:#000}
.act.dark .tag{color:var(--champ)}
.act.dark p{color:rgba(244,241,234,.6)}
@media(max-width:780px){.acts{grid-template-columns:1fr}}

/* ── personnalisation / feature cards ── */
.perso-flag{display:inline-flex;align-items:center;gap:.5rem;font-weight:800;font-size:.72rem;letter-spacing:.04em;
   text-transform:uppercase;color:#fff;background:var(--gold);border-radius:100px;padding:.5rem 1.05rem;
   box-shadow:0 8px 20px -8px rgba(184,144,96,.7)}
.hl{background:linear-gradient(transparent 58%,rgba(184,144,96,.32) 0);padding:0 .12em;font-weight:600}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.fc{background:var(--card);border:1px solid var(--line2);border-radius:var(--r);padding:24px;
    transition:transform .3s var(--ease),box-shadow .3s;position:relative}
.fc:hover{transform:translateY(-4px);box-shadow:0 22px 40px -24px rgba(35,32,26,.4)}
.fc.dark{background:var(--night);border-color:#000;color:#F4F1EA}
.fc.dark p{color:rgba(244,241,234,.55)}
.fc .ftag{display:inline-flex;align-items:center;gap:.35rem;font-size:.6rem;font-weight:800;letter-spacing:.1em;
   text-transform:uppercase;padding:.26rem .6rem;border-radius:100px;margin-bottom:1rem}
.ftag.quiz{background:rgba(184,144,96,.12);color:var(--gold-ink);border:1px solid rgba(184,144,96,.3)}
.ftag.gal{background:rgba(74,124,89,.1);color:#3C6E4A;border:1px solid rgba(74,124,89,.25)}
.ftag.both{background:var(--paper2);color:var(--muted);border:1px solid var(--line2)}
.fc.dark .ftag.quiz{background:rgba(230,217,192,.12);color:var(--champ);border-color:rgba(230,217,192,.25)}
.fc .fico{font-size:1.7rem;margin-bottom:.7rem}
.fc h3{font-size:1.1rem;margin-bottom:.5rem}
.fc p{font-size:.86rem;line-height:1.62;color:var(--ink-soft)}
.fc .edit{position:absolute;top:18px;right:18px;font-size:.8rem;color:var(--gold);opacity:.55}
@media(max-width:860px){.fgrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.fgrid{grid-template-columns:1fr}}

/* ── pricing ── */
.prices{display:grid;grid-template-columns:1fr 1.08fr 1fr;gap:16px;align-items:stretch}
.pc{background:var(--card);border:1px solid var(--line2);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;gap:.8rem;
  transition:transform .3s var(--ease),box-shadow .3s,border-color .3s}
.pc:hover{transform:translateY(-4px);box-shadow:0 24px 44px -26px rgba(35,32,26,.42)}
.pc.hot{border-color:var(--gold);background:var(--night);color:#F4F1EA;
  box-shadow:0 26px 50px -28px rgba(184,144,96,.5);position:relative}
.pc.hot .plan{color:var(--champ)}
.pc.hot .price{color:#fff}
.pc.hot .pnote{color:rgba(244,241,234,.6)}
.pc.hot .pnote .gold{color:var(--champ)}
.pc.hot li{color:rgba(244,241,234,.74)}
.pc.hot li strong{color:#fff}
.pc.hot li .ck{border-color:var(--gold);color:var(--champ)}
.pc.hot li.off{opacity:.45}
.pc.hot li.off .ck{border-color:rgba(255,255,255,.25);color:rgba(255,255,255,.4)}
.pc.hot .micro{color:rgba(244,241,234,.42)}
.pc.hot:hover{transform:translateY(-8px);box-shadow:0 38px 66px -30px rgba(184,144,96,.6)}
.pc .badge{position:absolute;top:-12px;left:26px;font-size:.6rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
   background:var(--gold);color:#fff;padding:.28rem .7rem;border-radius:100px}
.pc .plan{font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.pc .price{font-weight:900;font-size:2.6rem;letter-spacing:-.03em;line-height:.95}
.pc .price sup{font-size:.42em;font-weight:800;vertical-align:super;margin-right:.05em}
.pc .pnote{font-size:.78rem;color:var(--ink-soft)}
.pc .gold{color:var(--gold-ink);font-weight:700}
.pc ul{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin:.3rem 0}
.pc li{display:flex;gap:.55rem;font-size:.86rem;color:var(--ink-soft);line-height:1.4}
.pc li .ck{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold-ink);
   display:grid;place-items:center;font-size:.55rem;font-weight:800;flex-shrink:0;margin-top:.1rem}
.pc li.off{opacity:.4}.pc li.off .ck{border-color:var(--line2);color:var(--muted)}
.pc .pcta{margin-top:auto;display:block;text-align:center;padding:.85rem;border-radius:12px;font-weight:800;
   font-size:.84rem;border:1.5px solid var(--line2);transition:all .25s}
.pc .pcta:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pc.hot .pcta{background:var(--gold);color:#fff;border-color:var(--gold)}
.pc.hot .pcta:hover{background:#a87f4f}
.pc .micro{font-size:.7rem;color:var(--muted);text-align:center}
@media(max-width:820px){.prices{grid-template-columns:1fr;max-width:430px;margin:0 auto}}

/* ── single price hero (feature pages) ── */
.price-focus{text-align:center;max-width:540px;margin:0 auto}
.price-focus .big{display:flex;align-items:baseline;justify-content:center;gap:.4rem;margin:1.4rem 0 .5rem}
.price-focus .big .cur{font-weight:900;font-size:1.8rem;color:var(--muted);align-self:flex-start;margin-top:.5rem}
.price-focus .big .num{font-weight:900;font-size:4.4rem;letter-spacing:-.04em;line-height:1}
.price-focus .big .from{font-size:.78rem;color:var(--muted);text-align:left;align-self:flex-end;margin-bottom:.5rem;line-height:1.3}
.price-list{display:flex;flex-direction:column;gap:.55rem;max-width:380px;margin:1.6rem auto 2rem;text-align:left}
.price-list .pl{display:flex;align-items:center;gap:.65rem;font-size:.86rem;color:var(--ink-soft)}
.price-list .pl .c{width:18px;height:18px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:.55rem;font-weight:800;flex-shrink:0}

/* ── faq ── */
.faq{display:flex;flex-direction:column;gap:0}
.faq-i{border-bottom:1px solid var(--line2)}
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 0;cursor:pointer;
       font-weight:700;font-size:1rem;letter-spacing:-.01em}
.faq-tog{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--line2);position:relative;
         font-size:0;flex-shrink:0;transition:transform .3s var(--ease),background .2s,color .2s,border-color .2s}
.faq-tog::before,.faq-tog::after{content:"";position:absolute;top:50%;left:50%;width:9px;height:1.6px;
         background:currentColor;border-radius:2px;transform:translate(-50%,-50%)}
.faq-tog::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq-i.open .faq-tog{transform:rotate(45deg);background:var(--gold);color:#fff;border-color:var(--gold)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease),padding .35s var(--ease);
       font-size:.92rem;line-height:1.7;color:var(--ink-soft)}
.faq-i.open .faq-a{max-height:240px;padding-bottom:1.1rem}

/* ── demo (interactive playground) ── */
.demo-wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,56px);align-items:start}
.demo-card{background:#0F0E0B;border:1px solid rgba(255,255,255,.08);border-radius:var(--r);padding:1.3rem;
           box-shadow:0 30px 60px -34px rgba(0,0,0,.6)}
.demo-meta{font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin-bottom:.9rem;
           display:flex;align-items:center;gap:.5rem;font-weight:700}
.demo-meta .live-d{width:6px;height:6px;border-radius:50%;background:#1F8A4C;animation:bl 1.4s infinite}
.dq{font-family:'Spectral',serif;font-size:1.3rem;font-weight:400;color:#F8F4EC;line-height:1.3;margin-bottom:1.1rem}
.dopts{display:flex;flex-direction:column;gap:.5rem}
.dopt{display:flex;align-items:center;gap:.7rem;padding:.75rem .9rem;border:1.5px solid rgba(255,255,255,.12);
      border-radius:11px;font-size:.9rem;color:rgba(255,255,255,.82);cursor:pointer;background:rgba(255,255,255,.02);
      transition:all .25s;font-family:inherit;text-align:left;width:100%}
.dopt:hover{border-color:rgba(184,144,96,.5);background:rgba(184,144,96,.07)}
.dopt .dl{width:24px;height:24px;border-radius:7px;background:rgba(255,255,255,.07);display:grid;place-items:center;
          font-size:.66rem;font-weight:800;color:rgba(255,255,255,.5);flex-shrink:0}
.dopt.ok{border-color:var(--green);background:rgba(60,110,74,.16)}
.dopt.ok .dl{background:var(--green);color:#fff}
.dopt.no{border-color:#C0563B;background:rgba(192,86,59,.12);opacity:.7}
.dres{margin-top:1rem;text-align:center;font-size:.84rem;font-weight:700;min-height:1.4rem;font-family:inherit}
.dres.ok{color:#5FB87B}.dres.no{color:#D9795F}
.dlb{margin-top:1rem;background:rgba(255,255,255,.04);border-radius:9px;padding:.6rem .8rem;font-size:.66rem;
     color:rgba(255,255,255,.5);text-align:center}
@media(max-width:820px){.demo-wrap{grid-template-columns:1fr}}

/* ── testimonials ── */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.tc{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:var(--r);padding:26px}
.tc .stars{display:flex;gap:.18rem;margin-bottom:1.1rem;color:var(--gold)}
.tc q{display:block;font-family:'Spectral',serif;font-style:italic;font-size:1.02rem;line-height:1.6;
      color:rgba(244,241,234,.82);margin-bottom:1.4rem;quotes:none}
.tc .who{display:flex;align-items:center;gap:.7rem}
.tc .av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--champ),var(--gold));
        display:grid;place-items:center;font-size:.74rem;font-weight:800;color:var(--ink)}
.tc .nm{font-size:.82rem;font-weight:700;color:#F4F1EA}
.tc .ev{font-size:.68rem;color:rgba(244,241,234,.4)}
@media(max-width:780px){.tgrid{grid-template-columns:1fr}}

/* ── cta ── */
.cta{text-align:center}
.cta .stats{display:flex;justify-content:center;align-items:center;gap:2.4rem;flex-wrap:wrap;margin-bottom:2.4rem}
.cta .stat .v{font-weight:900;font-size:2.1rem;letter-spacing:-.02em}
.cta .stat .l{font-size:.76rem;color:var(--muted)}
.cta .stat-d{width:1px;height:38px;background:var(--line2)}
.cta h2{margin-bottom:1.1rem}
.cta .lead{margin:0 auto 2.2rem;text-align:center}
.cta .row{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}

/* ── how-it-works: product duo ── */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.duo-card{background:var(--card);border:1px solid var(--line2);border-radius:var(--r);padding:30px;display:flex;flex-direction:column}
.duo-card.dark{background:var(--night);border-color:#000;color:#F4F1EA}
.duo-ico{font-size:2rem;margin-bottom:1rem}
.duo-tag{display:inline-block;align-self:flex-start;font-size:.6rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  padding:.28rem .65rem;border-radius:100px;margin-bottom:.9rem;background:rgba(184,144,96,.12);color:var(--gold-ink);border:1px solid rgba(184,144,96,.3)}
.duo-card.dark .duo-tag{background:rgba(230,217,192,.12);color:var(--champ);border-color:rgba(230,217,192,.25)}
.duo-tag.gal{background:rgba(74,124,89,.1);color:#3C6E4A;border-color:rgba(74,124,89,.25)}
.duo-name{font-weight:800;font-size:1.5rem;letter-spacing:-.02em;margin-bottom:.6rem}
.duo-desc{font-size:.92rem;line-height:1.6;color:var(--ink-soft);margin-bottom:1.4rem}
.duo-card.dark .duo-desc{color:rgba(244,241,234,.6)}
.duo-b{display:flex;gap:.7rem;padding:.6rem 0;border-top:1px solid var(--line);font-size:.86rem;line-height:1.5;color:var(--ink-soft)}
.duo-card.dark .duo-b{border-color:rgba(255,255,255,.08);color:rgba(244,241,234,.7)}
.duo-b .bi{flex-shrink:0;font-size:1rem}
.duo-b strong{color:var(--ink);font-weight:700}
.duo-card.dark .duo-b strong{color:#F4F1EA}
@media(max-width:780px){.duo{grid-template-columns:1fr}}

/* ── vertical timeline ── */
.tl{display:flex;flex-direction:column}
.tl-step{display:grid;grid-template-columns:48px 1fr;gap:1.4rem;padding-bottom:2.6rem;position:relative}
.tl-step:last-child{padding-bottom:0}
.tl-num{width:48px;height:48px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;
  font-weight:900;font-size:.9rem;z-index:1;position:relative}
.tl-step:not(:last-child)::before{content:"";position:absolute;left:23.5px;top:52px;bottom:6px;width:1.5px;
  background:linear-gradient(var(--gold),var(--line2))}
.tl-time{font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.4rem}
.tl-title{font-weight:800;font-size:1.25rem;letter-spacing:-.018em;margin-bottom:.5rem}
.tl-desc{font-size:.92rem;line-height:1.65;color:var(--ink-soft);max-width:60ch;margin-bottom:.9rem}
.tags{display:flex;flex-wrap:wrap;gap:.45rem}
.tg{font-size:.66rem;font-weight:700;padding:.32rem .7rem;border-radius:100px;border:1px solid var(--line2);background:var(--card);color:var(--ink-soft)}
.tg.q{background:rgba(184,144,96,.1);color:var(--gold-ink);border-color:rgba(184,144,96,.28)}
.tg.g{background:rgba(74,124,89,.09);color:#3C6E4A;border-color:rgba(74,124,89,.22)}
.tl-mock{margin-top:1.1rem;background:var(--night);border:1px solid #000;border-radius:var(--r);padding:1rem;display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.tl-mock .mk-lbl{font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:.5rem;font-weight:700}
.tl-mock .mk-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:.7rem}
.mk-rk{display:flex;justify-content:space-between;font-size:.66rem;color:rgba(255,255,255,.6);padding:.16rem 0}
.mk-rk b{color:var(--champ);font-weight:800}
.mk-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:3px}
.mk-grid div{aspect-ratio:1;border-radius:4px;display:grid;place-items:center;font-size:.7rem}
@media(max-width:560px){.tl-mock{grid-template-columns:1fr}}

/* ── guest experience ── */
.guest{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.guest-col{background:var(--card);border:1px solid var(--line2);border-radius:var(--r);padding:26px}
.gbadge{display:inline-flex;align-items:center;gap:.4rem;font-size:.66rem;font-weight:800;letter-spacing:.04em;
  padding:.4rem .85rem;border-radius:100px;margin-bottom:1.4rem;background:rgba(184,144,96,.12);color:var(--gold-ink);border:1px solid rgba(184,144,96,.3)}
.gbadge.gal{background:rgba(74,124,89,.1);color:#3C6E4A;border-color:rgba(74,124,89,.25)}
.gstep{display:flex;gap:.85rem;align-items:flex-start}
.gstep .gi{width:36px;height:36px;border-radius:11px;background:var(--paper2);border:1px solid var(--line2);display:grid;place-items:center;font-size:1.05rem;flex-shrink:0}
.gstep-t{font-weight:700;font-size:.95rem;margin-bottom:.2rem}
.gstep-d{font-size:.84rem;line-height:1.55;color:var(--ink-soft)}
.gsep{height:.9rem;margin-left:18px;border-left:1.5px dashed var(--line2)}
@media(max-width:780px){.guest{grid-template-columns:1fr}}

/* ── occasions grid ── */
.occ{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.occ-cell{border:1px solid var(--line2);border-radius:var(--r-sm);padding:20px 18px;text-align:center;background:var(--card);
  transition:transform .25s var(--ease),box-shadow .25s}
.occ-cell:hover{transform:translateY(-3px);box-shadow:0 16px 30px -22px rgba(35,32,26,.4)}
.occ-ico{font-size:1.6rem;margin-bottom:.6rem}
.occ-name{font-weight:800;font-size:.98rem;margin-bottom:.35rem}
.occ-detail{font-size:.74rem;line-height:1.5;color:var(--muted)}
@media(max-width:860px){.occ{grid-template-columns:repeat(2,1fr)}}

/* ── photo gallery feature ── */
.gphone{width:300px;max-width:100%;margin:0 auto;background:linear-gradient(155deg,#322D25,#15130F 62%);border-radius:44px;padding:6px;
  box-shadow:0 38px 80px -34px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.07),inset 0 0 0 1px rgba(0,0,0,.5)}
.gphone .scr{background:#0C0B09}
.gphone .gpcount{padding:.4rem .85rem;font-size:.56rem;color:rgba(255,255,255,.3);font-weight:600;border-bottom:1px solid rgba(255,255,255,.05)}
.gphone .gpgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2px;padding:2px;background:#0C0B09;min-height:236px}
.gphone .gpgrid .cell{aspect-ratio:1;display:grid;place-items:center;font-size:1.2rem;transition:filter .5s var(--ease)}
/* generic gpgrid (dashboard preview, outside .gphone) */
.gpgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2px;padding:2px;background:#0C0B09}
.gpgrid .cell{aspect-ratio:1;display:grid;place-items:center;font-size:1.2rem;position:relative;overflow:hidden;transition:filter .5s var(--ease)}
.gpgrid .cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gphone .gpfilters{border-top:1px solid rgba(255,255,255,.07);padding:.55rem .7rem;display:flex;gap:.35rem;overflow-x:auto}
.gchip{flex-shrink:0;font-size:.58rem;font-weight:700;padding:.3rem .65rem;border-radius:100px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);color:rgba(255,255,255,.6);cursor:pointer;white-space:nowrap;transition:all .2s;font-family:inherit}
.gchip.on{background:var(--gold);border-color:var(--gold);color:#fff}

/* interactive filter demo (light section) */
.fdemo{background:var(--card);border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;box-shadow:0 30px 60px -40px rgba(35,32,26,.4)}
.fdemo-top{display:flex;align-items:center;gap:.5rem;padding:.7rem 1rem;background:var(--paper2);border-bottom:1px solid var(--line2)}
.fdemo-top .d{width:9px;height:9px;border-radius:50%}
.fdemo-url{margin-left:.4rem;font-family:'Spectral',serif;font-size:.7rem;color:var(--muted)}
.fdemo-body{display:grid;grid-template-columns:1.5fr 1fr;gap:0}
.fdemo-gal{padding:1.4rem}
.fdemo-galhead{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}
.fdemo-galt{font-weight:800;font-size:1.05rem;letter-spacing:-.01em}
.fdemo-galm{font-size:.72rem;color:var(--muted);margin-top:.15rem}
.fdemo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.fdemo-grid .ph-cell{aspect-ratio:1;border-radius:10px;display:grid;place-items:center;font-size:1.8rem;transition:filter .5s var(--ease);border:1px solid var(--line);position:relative;overflow:hidden}
.fdemo-up{display:inline-flex;align-items:center;gap:.4rem;font-size:.74rem;font-weight:700;color:var(--gold-ink);cursor:pointer;
  border:1.5px solid var(--line2);border-radius:100px;padding:.5rem .9rem;background:var(--card);transition:border-color .2s;white-space:nowrap}
.fdemo-up:hover{border-color:var(--gold)}
.fdemo-up input{display:none}
.fdemo-galhead{align-items:center}
.fdemo-stats{display:flex;gap:.7rem;margin-top:1rem;flex-wrap:wrap}
.fdemo-stat{background:var(--paper2);border:1px solid var(--line);border-radius:var(--r-sm);padding:.6rem .85rem;min-width:92px}
.fdemo-stat .v{font-weight:900;font-size:1.15rem;color:var(--gold-ink);line-height:1}
.fdemo-stat .l{font-size:.58rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:700;margin-top:.25rem}
.fdemo-panel{background:var(--night);color:#F4F1EA;padding:1.4rem;display:flex;flex-direction:column;gap:1rem}
.fdemo-pt{font-weight:800;font-size:.95rem}
.fdemo-ps{font-size:.74rem;color:rgba(244,241,234,.5);line-height:1.5}
.fdemo-filters{display:flex;flex-direction:column;gap:.45rem}
.ffilter{display:flex;align-items:center;gap:.7rem;padding:.6rem .8rem;border:1.5px solid rgba(255,255,255,.1);border-radius:11px;
  cursor:pointer;transition:all .2s;background:rgba(255,255,255,.02)}
.ffilter:hover{border-color:rgba(184,144,96,.5)}
.ffilter.on{border-color:var(--gold);background:rgba(184,144,96,.14)}
.ffilter .sw{width:30px;height:30px;border-radius:8px;flex-shrink:0;border:1px solid rgba(255,255,255,.15)}
.ffilter .fn{font-weight:700;font-size:.82rem;color:#F4F1EA}
.ffilter .fd{font-size:.62rem;color:rgba(244,241,234,.45)}
@media(max-width:820px){.fdemo-body{grid-template-columns:1fr}}

/* ── contact ── */
.cwrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:0;max-width:var(--maxw);margin:0 auto;
  border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;box-shadow:0 40px 80px -50px rgba(35,32,26,.5)}
.cleft{background:var(--night);color:#F4F1EA;padding:clamp(32px,4vw,52px)}
.cleft h2{color:#F4F1EA;margin:1.1rem 0 .8rem}
.cleft .lead{color:rgba(244,241,234,.5)}
.cmeans{display:flex;flex-direction:column;gap:.6rem;margin-top:2.4rem}
.cmean{display:flex;align-items:center;gap:.9rem;padding:.85rem 1rem;border:1px solid rgba(255,255,255,.1);border-radius:11px;
  transition:border-color .2s,background .2s}
.cmean:hover{border-color:rgba(184,144,96,.5);background:rgba(255,255,255,.03)}
.cmean .ci{font-size:1.1rem;flex-shrink:0}
.cmean .ct{font-size:.86rem;font-weight:700;color:#F4F1EA}
.cmean .cd{font-size:.66rem;color:rgba(244,241,234,.4);margin-top:.1rem}
.cright{background:var(--card);padding:clamp(32px,4vw,52px)}
.cright .ftitle{font-weight:800;font-size:1.15rem;letter-spacing:-.01em;margin-bottom:1.4rem}
.fg{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}
.fr2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.fl{font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft)}
.fi,.fs,.fta{font-family:inherit;font-size:.92rem;color:var(--ink);background:var(--paper);border:1.5px solid var(--line2);
  border-radius:10px;padding:.7rem .85rem;transition:border-color .2s,box-shadow .2s;width:100%}
.fi:focus,.fs:focus,.fta:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(184,144,96,.15)}
.fta{resize:vertical;min-height:108px;line-height:1.5}
.fs{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238B8273' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .9rem center}
.fsent{margin-top:.4rem;font-size:.8rem;font-weight:700;color:var(--green);min-height:1.2rem}
@media(max-width:780px){.cwrap{grid-template-columns:1fr}}

/* ── auth (login / signup) ── */
.auth{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.auth-brand{background:var(--night);color:#F4F1EA;padding:clamp(36px,5vw,72px);display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.auth-brand::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 420px at 82% 2%,rgba(184,144,96,.18),transparent 60%)}
.auth-brand>*{position:relative}
.auth-logo{display:inline-flex;align-items:center;gap:.5rem;font-weight:900;font-size:1.05rem;margin-bottom:2.4rem;color:#F4F1EA}
.auth-logo .mk{width:30px;height:30px;border-radius:8px;background:rgba(255,255,255,.1);display:grid;place-items:center;flex-shrink:0}
.auth-logo .dot{color:var(--gold);margin-left:-.5rem}
.auth-brand h2{font-weight:800;font-size:clamp(1.8rem,2.6vw,2.7rem);line-height:1.1;letter-spacing:-.025em;color:#FBF8F1;margin-bottom:.9rem}
.auth-brand h2 em{color:var(--champ)}
.auth-brand .sub{font-size:.92rem;color:rgba(244,241,234,.5);line-height:1.6;max-width:34ch;margin-bottom:2.2rem}
.auth-feats{display:flex;flex-direction:column;gap:.85rem}
.auth-feat{display:flex;align-items:center;gap:.7rem;font-size:.88rem;color:rgba(244,241,234,.78)}
.auth-feat .fdot{width:7px;height:7px;border-radius:50%;background:var(--gold);flex-shrink:0}
.auth-trial{margin-top:2rem;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:1rem 1.1rem;background:rgba(255,255,255,.03)}
.auth-trial .tt{font-size:.78rem;font-weight:800;color:var(--champ);margin-bottom:.3rem}
.auth-trial .td{font-size:.74rem;color:rgba(244,241,234,.45);line-height:1.5}
.auth-form{background:var(--card);padding:clamp(32px,5vw,72px);display:flex;flex-direction:column;justify-content:center}
.auth-inner{width:100%;max-width:392px;margin:0 auto}
.auth-mlogo{display:none;align-items:center;gap:.5rem;font-weight:900;font-size:1.05rem;margin-bottom:2rem}
.auth-mlogo .mk{width:28px;height:28px;border-radius:7px;background:var(--ink);display:grid;place-items:center}
.auth-mlogo .dot{color:var(--gold);margin-left:-.5rem}
.auth-title{font-weight:800;font-size:1.6rem;letter-spacing:-.02em;margin-bottom:.4rem}
.auth-sw{font-size:.84rem;color:var(--ink-soft);margin-bottom:1.7rem}
.auth-sw a{color:var(--gold-ink);font-weight:700;cursor:pointer}
.sb-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;margin-bottom:1.2rem}
.sb-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;font-family:inherit;font-weight:700;font-size:.84rem;
  padding:.7rem;border:1.5px solid var(--line2);border-radius:10px;background:var(--paper);cursor:pointer;transition:border-color .2s,background .2s}
.sb-btn:hover{border-color:var(--ink)}
.or{display:flex;align-items:center;gap:.8rem;margin:1.2rem 0;color:var(--muted);font-size:.72rem}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line2)}
.auth-sub2{font-size:.7rem;color:var(--ink-soft);text-align:right;margin-top:-.2rem;margin-bottom:.6rem}
.auth-sub2 a{color:var(--muted);text-decoration:underline}
.auth-tos{font-size:.66rem;color:var(--muted);text-align:center;margin-top:1rem;line-height:1.5}
.auth-tos a{color:var(--gold-ink)}
.auth-back{display:inline-block;margin-top:1.6rem;font-size:.72rem;color:var(--muted);text-align:center;width:100%}
.auth-back:hover{color:var(--ink)}
@media(max-width:820px){.auth{grid-template-columns:1fr}.auth-brand{display:none}.auth-mlogo{display:inline-flex}}

/* signup wizard */
.suprog{display:flex;align-items:center;gap:.5rem;margin-bottom:1.8rem}
.suprog .s{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.8rem;flex-shrink:0;
  border:1.5px solid var(--line2);color:var(--muted);background:var(--paper);transition:all .3s}
.suprog .s.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.suprog .s.done{background:var(--gold);color:#fff;border-color:var(--gold)}
.suprog .l{flex:1;height:1.5px;background:var(--line2);transition:background .3s}
.suprog .l.done{background:var(--gold)}
.sustep{display:none}
.sustep.on{display:block;animation:revUp .5s var(--ease) both}
.evtypes{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.6rem;margin-bottom:1rem}
.evtype{border:1.5px solid var(--line2);border-radius:11px;padding:.9rem .5rem;text-align:center;cursor:pointer;transition:all .2s;background:var(--paper)}
.evtype:hover{border-color:var(--gold)}
.evtype.on{border-color:var(--gold);background:rgba(184,144,96,.1)}
.evtype .i{font-size:1.4rem;margin-bottom:.35rem}
.evtype .n{font-size:.72rem;font-weight:700}
.suq{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1rem}
.suq-item{border:1px solid var(--line2);border-radius:10px;padding:.75rem .9rem;background:var(--paper)}
.suq-item .qn{font-size:.58rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.25rem}
.suq-item .qt{font-size:.86rem;font-weight:600;line-height:1.3}
.skip{background:none;border:none;color:var(--muted);font-size:.78rem;cursor:pointer;font-family:inherit;display:block;margin:.4rem auto 0}
.skip:hover{color:var(--ink)}

/* ── toast ── */
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--paper);
  font-size:.84rem;font-weight:600;padding:.7rem 1.2rem;border-radius:100px;box-shadow:0 16px 36px -12px rgba(0,0,0,.5);
  opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:200}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── app shell (trial space) ── */
.app{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.aside{background:var(--night);color:#F4F1EA;padding:1.3rem 1rem;display:flex;flex-direction:column;gap:1.1rem;position:sticky;top:0;height:100vh;overflow-y:auto}
.aside-logo{display:inline-flex;align-items:center;gap:.5rem;font-weight:900;font-size:1rem;padding:.2rem .4rem}
.aside-logo .mk{width:26px;height:26px;border-radius:7px;background:rgba(255,255,255,.1);display:grid;place-items:center;flex-shrink:0}
.aside-logo .dot{color:var(--gold);margin-left:-.5rem}
.tbadge{border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:.95rem 1rem;background:rgba(255,255,255,.03)}
.tbadge .t{font-size:.74rem;font-weight:800;color:var(--champ);margin-bottom:.25rem}
.tbadge .d{font-size:.68rem;color:rgba(244,241,234,.45);line-height:1.45;margin-bottom:.7rem}
.tbadge .lim{font-size:.62rem;color:rgba(244,241,234,.55);font-weight:700;margin-bottom:.35rem}
.tbar{height:6px;background:rgba(255,255,255,.1);border-radius:3px;overflow:hidden}
.tbar i{display:block;height:100%;width:0%;background:var(--gold);border-radius:3px;transition:width .4s var(--ease)}
.anav{display:flex;flex-direction:column;gap:.15rem}
.anav .lbl{font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.25);font-weight:700;padding:.7rem .75rem .25rem}
.nb{display:flex;align-items:center;gap:.6rem;padding:.6rem .75rem;border-radius:9px;border:none;background:none;color:rgba(244,241,234,.6);
  font-family:inherit;font-size:.84rem;font-weight:600;cursor:pointer;text-align:left;width:100%;transition:background .2s,color .2s}
.nb:hover{background:rgba(255,255,255,.05);color:#F4F1EA}
.nb.on{background:rgba(184,144,96,.16);color:var(--champ)}
.nb .i{font-size:.95rem;width:18px;text-align:center}
.aside-up{margin-top:auto;display:block;text-align:center;padding:.8rem;border-radius:11px;background:var(--gold);color:#fff;
  font-weight:800;font-size:.82rem;border:none;cursor:pointer;font-family:inherit;transition:background .2s}
.aside-up:hover{background:#a87f4f}
.amain{padding:clamp(24px,3.2vw,48px);background:var(--paper);overflow-y:auto}
.amain-in{max-width:760px}
.apnl{display:none}
.apnl.on{display:block;animation:revUp .5s var(--ease) both}
#filterChips{flex-wrap:wrap}
#filterChips .chip{flex:0 0 auto}
.atop{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.6rem;flex-wrap:wrap}
.atitle{font-weight:800;font-size:1.55rem;letter-spacing:-.02em}
.asub{font-size:.82rem;color:var(--ink-soft);margin-top:.25rem}
.qed{display:flex;flex-direction:column;gap:.7rem;margin-bottom:1.3rem}
.qcard{background:var(--card);border:1px solid var(--line2);border-radius:12px;padding:1rem 1.1rem;display:flex;gap:.9rem;align-items:flex-start}
.qcard .qnum{width:26px;height:26px;border-radius:8px;background:var(--ink);color:var(--paper);display:grid;place-items:center;font-weight:800;font-size:.72rem;flex-shrink:0}
.qcard .qbody{flex:1}
.qcard .qq{font-weight:700;font-size:.92rem;margin-bottom:.5rem;line-height:1.3}
.qcard .qopts{display:flex;flex-wrap:wrap;gap:.4rem}
.qchip{font-size:.7rem;padding:.25rem .6rem;border-radius:100px;border:1px solid var(--line2);background:var(--paper);color:var(--ink-soft)}
.qchip.ok{border-color:var(--gold);background:rgba(184,144,96,.12);color:var(--gold-ink);font-weight:700}
.qcard .qdel{background:none;border:none;color:var(--muted);cursor:pointer;font-size:1rem;flex-shrink:0}
.qcard .qdel:hover{color:#C0563B}
.launch{background:var(--night);color:#F4F1EA;border-radius:14px;padding:1.2rem 1.4rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.launch .lt{font-weight:800;font-size:.92rem}
.launch .ls{font-size:.74rem;color:rgba(244,241,234,.5);margin-top:.15rem}
.upsell{background:var(--paper2);border:1px solid var(--line2);border-radius:12px;padding:1.1rem 1.3rem;margin-top:1rem;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.upsell .ut{font-weight:800;font-size:.84rem;margin-bottom:.2rem}
.upsell .ud{font-size:.76rem;color:var(--ink-soft);line-height:1.5}
.sharebox{display:flex;flex-direction:column;gap:1.1rem;max-width:420px}
.sharelink{display:flex;align-items:center;gap:.5rem;border:1.5px solid var(--line2);border-radius:11px;padding:.5rem .5rem .5rem .9rem;background:var(--card)}
.sharelink .u{flex:1;font-family:'Spectral',serif;font-size:.84rem;color:var(--ink-soft)}
.qrbox{align-self:center;width:150px;height:150px;border-radius:16px;background:var(--card);border:1px solid var(--line2);
  display:grid;place-items:center;box-shadow:0 16px 36px -20px rgba(35,32,26,.4)}
.limit-note{font-size:.78rem;color:var(--ink-soft);line-height:1.7;background:var(--paper2);border:1px solid var(--line2);border-radius:11px;padding:1rem 1.1rem}
@media(max-width:780px){.app{grid-template-columns:1fr}.aside{position:static;height:auto;flex-direction:column}}

/* ── payment ── */
.pay{display:grid;grid-template-columns:.85fr 1.15fr;min-height:100vh}
.pay-left{background:var(--night);color:#F4F1EA;padding:clamp(32px,4vw,56px);display:flex;flex-direction:column;justify-content:center}
.pay-left-in{max-width:380px;margin-left:auto;width:100%}
.pstep{display:flex;align-items:center;gap:.5rem;margin-bottom:2rem;font-size:.7rem}
.pstep .st{display:flex;align-items:center;gap:.4rem;color:rgba(244,241,234,.45);font-weight:700}
.pstep .st .n{width:24px;height:24px;border-radius:50%;border:1.5px solid rgba(255,255,255,.2);display:grid;place-items:center;font-size:.66rem}
.pstep .st.on{color:#F4F1EA}.pstep .st.on .n{background:var(--gold);border-color:var(--gold);color:#fff}
.pstep .st.done .n{background:rgba(184,144,96,.3);border-color:var(--gold);color:var(--champ)}
.pstep .pl{flex:1;height:1.5px;background:rgba(255,255,255,.15)}
.pstep .pl.done{background:var(--gold)}
.pcard{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:1.3rem;background:rgba(255,255,255,.03);margin-bottom:1rem;position:relative}
.pcard .pbadge{font-size:.58rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--champ);margin-bottom:.5rem}
.pcard .pname{font-weight:900;font-size:1.5rem;letter-spacing:-.02em}
.pcard .pprice{font-weight:900;font-size:2.4rem;letter-spacing:-.03em;margin:.2rem 0}
.pcard .pprice sup{font-size:.4em;vertical-align:super}
.pcard .pper{font-size:.72rem;color:rgba(244,241,234,.45);margin-bottom:.9rem}
.pcard ul{list-style:none;display:flex;flex-direction:column;gap:.45rem}
.pcard li{display:flex;gap:.5rem;font-size:.78rem;color:rgba(244,241,234,.7)}
.pcard li .ck{color:var(--gold);font-weight:800}
.pcard .pchange{display:inline-block;margin-top:.9rem;font-size:.72rem;color:rgba(244,241,234,.45);text-decoration:underline}
.precap{display:flex;justify-content:space-between;font-size:.74rem;padding:.18rem 0}
.precap .k{color:rgba(244,241,234,.45)}
.precap .v{color:#F4F1EA;font-weight:700;text-align:right;max-width:62%;word-break:break-word}
.pguar{margin-top:1rem;display:flex;flex-direction:column;gap:.55rem;align-items:center}
.pguar .gi{display:flex;align-items:center;justify-content:center;gap:.6rem;font-size:.72rem;color:rgba(244,241,234,.5);text-align:center}
.pright{background:var(--card);padding:clamp(32px,4vw,56px);display:flex;flex-direction:column;justify-content:center}
.pright-in{max-width:420px;width:100%}
.psec-lbl{font-size:.62rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:1.4rem 0 .7rem}
.psec-lbl:first-of-type{margin-top:0}
.paddon{display:flex;align-items:center;gap:.8rem;border:1.5px dashed rgba(184,144,96,.4);background:rgba(184,144,96,.06);
  border-radius:12px;padding:.9rem 1rem;margin-bottom:1.4rem;cursor:pointer;transition:border-color .2s,background .2s}
.paddon:hover{border-color:var(--gold)}
.paddon.on{border-style:solid;background:rgba(184,144,96,.14)}
.paddon .pa-i{font-size:1.3rem}
.paddon .pa-t{font-weight:800;font-size:.84rem}
.paddon .pa-d{font-size:.72rem;color:var(--ink-soft);line-height:1.4}
.paddon .pa-p{margin-left:auto;font-weight:800;color:var(--gold-ink);white-space:nowrap}
.paddon .pa-ck{width:22px;height:22px;border-radius:6px;border:1.5px solid var(--line2);display:grid;place-items:center;flex-shrink:0;font-size:.7rem;color:#fff}
.paddon.on .pa-ck{background:var(--gold);border-color:var(--gold)}
.ptotal{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line2);margin-top:1.4rem;padding-top:1.2rem}
.ptotal .tl{font-weight:700;color:var(--ink-soft)}
.ptotal .tv{font-weight:900;font-size:1.8rem;letter-spacing:-.02em}
.ptrust{display:flex;justify-content:center;gap:1.4rem;margin-top:1.1rem}
.ptrust .ti{display:flex;align-items:center;gap:.35rem;font-size:.68rem;color:var(--muted);font-weight:600}
.ptos{font-size:.66rem;color:var(--muted);text-align:center;margin-top:.9rem;line-height:1.5}
.ptos a{color:var(--ink);text-decoration:underline}
.psuccess{position:fixed;inset:0;background:var(--paper);display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:5vw;z-index:300}
.psuccess.on{display:flex;animation:revUp .5s var(--ease) both}
.psuccess .ps-ico{width:78px;height:78px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:2.4rem;margin-bottom:1.4rem}
.pfork{min-height:100vh;display:none;flex-direction:column;align-items:center;justify-content:center;gap:2rem;padding:6vh 5vw;text-align:center}
.pfork.on{display:flex}
.pfork-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;max-width:680px;width:100%}
.pfork-card{background:var(--card);border:1.5px solid var(--line2);border-radius:16px;padding:1.8rem 1.5rem;cursor:pointer;text-align:left;transition:all .25s var(--ease)}
.pfork-card:hover{border-color:var(--gold);transform:translateY(-4px);box-shadow:0 20px 40px -24px rgba(35,32,26,.4)}
.pfork-card .fi{font-size:2rem;margin-bottom:.6rem}
.pfork-card .fn{font-weight:900;font-size:1.1rem;margin-bottom:.3rem}
.pfork-card .fd{font-size:.8rem;color:var(--ink-soft);line-height:1.5}
@media(max-width:820px){.pay{grid-template-columns:1fr}.pfork-cards{grid-template-columns:1fr}}

/* ── organizer dashboard (account) ── */
.acc-plan{border:1px solid rgba(255,255,255,.12);border-radius:11px;padding:.7rem .85rem;background:rgba(255,255,255,.03);margin-bottom:.3rem}
.acc-plan .po{font-size:.54rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(244,241,234,.35);font-weight:700}
.acc-plan .pn{font-weight:900;font-size:1rem;color:var(--champ);margin-top:.15rem}
.acc-plan .pc{font-size:.66rem;color:rgba(244,241,234,.5);margin-top:.1rem}
.asec{font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.25);font-weight:700;padding:.8rem .75rem .25rem}
.nb .nbadge{margin-left:auto;font-size:.54rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;padding:.12rem .45rem;border-radius:100px;background:rgba(184,144,96,.2);color:var(--champ)}
.nb .lockb{margin-left:auto;font-size:.54rem;font-weight:700;color:rgba(244,241,234,.35)}
.nb.locked{opacity:.5}
.dbanner{background:linear-gradient(100deg,rgba(184,144,96,.16),rgba(184,144,96,.05));border:1px solid rgba(184,144,96,.3);border-radius:14px;
  padding:1rem 1.3rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.6rem}
.dbanner .bb{font-size:.7rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-ink)}
.dbanner .bt{font-size:.8rem;color:var(--ink-soft);margin-top:.2rem}
.dhero{margin-bottom:1.6rem}
.dhero .k{font-size:.66rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.7rem}
.dhero h1{font-weight:800;font-size:clamp(1.6rem,2.6vw,2.3rem);letter-spacing:-.025em;line-height:1.08;margin-bottom:.5rem}
.dhero p{font-size:.92rem;color:var(--ink-soft);max-width:52ch;line-height:1.6}
.dactions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1.2rem}
.planswitch{background:var(--card);border:1px solid var(--line2);border-radius:14px;padding:1.2rem 1.3rem;margin-bottom:1.4rem}
.planswitch .pt{font-weight:800;font-size:.92rem;margin-bottom:.5rem}
.planswitch p{font-size:.78rem;color:var(--ink-soft);line-height:1.6;margin-bottom:.9rem}
.chips{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.chip{font-family:inherit;font-size:.76rem;font-weight:700;padding:.5rem .9rem;border-radius:100px;border:1.5px solid var(--line2);
  background:var(--paper);color:var(--ink-soft);cursor:pointer;transition:all .2s}
.chip:hover{border-color:var(--gold)}
.chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.dstats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:1.4rem}
.dstat{background:var(--card);border:1px solid var(--line2);border-radius:12px;padding:1rem 1.1rem}
.dstat .v{font-weight:900;font-size:1.5rem;letter-spacing:-.02em;color:var(--ink)}
.dstat .l{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:700;margin-top:.25rem}
.dcard{background:var(--card);border:1px solid var(--line2);border-radius:14px;padding:1.3rem;margin-bottom:1.2rem}
.dcard-t{font-weight:800;font-size:.95rem;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}
.appgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.appcard{border:1px solid var(--line2);border-radius:12px;padding:1.2rem;background:var(--paper);position:relative;transition:border-color .2s}
.appcard.locked{opacity:.62}
.appcard .at{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem}
.appcard .aico{font-size:1.6rem}
.appcard .ast{font-size:.58rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:.2rem .55rem;border-radius:100px;background:rgba(184,144,96,.15);color:var(--gold-ink)}
.appcard.locked .ast{background:var(--paper2);color:var(--muted)}
.appcard h3{font-size:1.05rem;font-weight:800;margin-bottom:.4rem}
.appcard p{font-size:.82rem;color:var(--ink-soft);line-height:1.55;margin-bottom:.9rem}
.appcard .ameta{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1rem}
.appcard .ameta span{font-size:.64rem;color:var(--muted);background:var(--paper2);border:1px solid var(--line);border-radius:100px;padding:.18rem .55rem}
.chk{display:flex;gap:.8rem;padding:.6rem 0;border-top:1px solid var(--line)}
.chk:first-of-type{border-top:none}
.chk .cn{width:24px;height:24px;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;font-weight:800;font-size:.72rem;flex-shrink:0}
.chk strong{font-size:.86rem}
.chk p{font-size:.76rem;color:var(--ink-soft);margin-top:.15rem;line-height:1.45}
.glink{font-family:'Spectral',serif;font-size:.92rem;color:var(--ink-soft);background:var(--paper2);border:1px solid var(--line2);border-radius:10px;padding:.7rem .9rem;word-break:break-all}
.dgrid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:900px){.dstats{grid-template-columns:1fr 1fr}.appgrid,.dgrid2{grid-template-columns:1fr}}

/* config */
.cfg2{display:grid;grid-template-columns:1fr .8fr;gap:18px;align-items:start}
.cfg-fg{margin-bottom:.8rem}
.cfg-in{font-family:inherit;font-size:.9rem;width:100%;border:1.5px solid var(--line2);border-radius:10px;padding:.65rem .8rem;background:var(--paper);color:var(--ink)}
.cfg-in:focus{outline:none;border-color:var(--gold)}
.slval{font-weight:900;font-size:1.6rem;color:var(--gold-ink);margin-bottom:.4rem}
.slider{width:100%;-webkit-appearance:none;height:6px;border-radius:3px;background:var(--line2);outline:none}
.slider::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--gold);cursor:pointer;border:3px solid var(--card);box-shadow:0 2px 6px rgba(0,0,0,.2)}
.slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--gold);cursor:pointer;border:3px solid var(--card)}
.sllabels{display:flex;justify-content:space-between;font-size:.64rem;color:var(--muted);margin-top:.5rem}
.tog-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem 0;border-top:1px solid var(--line)}
.tog-row:first-child{border-top:none}
.tog-info strong{font-size:.86rem}
.tog-info span{display:block;font-size:.72rem;color:var(--muted);margin-top:.1rem}
.tog{width:42px;height:24px;border-radius:100px;background:var(--line2);border:none;cursor:pointer;position:relative;transition:background .2s;flex-shrink:0}
.tog::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.tog.on{background:var(--gold)}
.tog.on::after{transform:translateX(18px)}

/* live dashboard */
.live2{display:grid;grid-template-columns:1.1fr .9fr;gap:14px}
.lvcard{background:var(--card);border:1px solid var(--line2);border-radius:14px;padding:1.2rem}
.lvcard.dark{background:var(--night);color:#F4F1EA;border-color:#000}
.lvcard-t{font-weight:800;font-size:.88rem;margin-bottom:.9rem;display:flex;align-items:center;gap:.5rem}
.lvcard.dark .lvcard-t{color:#F4F1EA}
.lvrank{display:flex;align-items:center;gap:.7rem;padding:.55rem .7rem;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);margin-bottom:.45rem}
.lvrank .pos{font-size:1rem;width:24px;text-align:center}
.lvrank .nm{font-weight:700;font-size:.84rem;color:#F4F1EA}
.lvrank .pts{margin-left:auto;font-weight:800;color:var(--champ)}
.lvwall{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.lvwall div{aspect-ratio:1;border-radius:7px;display:grid;place-items:center;font-size:1.2rem}
.qctrl{display:flex;flex-direction:column;gap:.7rem}
.qctrl-q{font-weight:700;font-size:.95rem;line-height:1.3}
.qctrl-bar{display:flex;gap:.5rem;flex-wrap:wrap}
.locked-panel{position:relative}
.locked-veil{background:var(--paper2);border:1px dashed var(--line2);border-radius:14px;padding:3rem 2rem;text-align:center}
.locked-veil .li{font-size:2rem;margin-bottom:.7rem}
.locked-veil h3{font-weight:800;font-size:1.1rem;margin-bottom:.4rem}
.locked-veil p{font-size:.85rem;color:var(--ink-soft);max-width:44ch;margin:0 auto 1.2rem;line-height:1.6}
.themes{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.theme{border:2px solid var(--line2);border-radius:12px;padding:.5rem;cursor:pointer;transition:border-color .2s}
.theme.on{border-color:var(--gold)}
.theme .sw{height:54px;border-radius:8px;margin-bottom:.5rem}
.theme .tn{font-size:.74rem;font-weight:700;text-align:center}
@media(max-width:900px){.cfg2,.live2{grid-template-columns:1fr}.themes{grid-template-columns:1fr 1fr}}

/* ── guest app (mobile player) ── */
.gapp{--th-bg:#16130E;--th-surf:#211D16;--th-bd:rgba(255,255,255,.1);--th-text:#F4F1EA;--th-sub:rgba(244,241,234,.5);--th-acc:#C9A87C;--th-acc-ink:#221a10;--th-me:rgba(201,168,124,.14);--th-radius:16px;
  background:var(--th-bg);color:var(--th-text);min-height:100vh}

/* ── THÈME B · FÊTE (clair & festif) ── */
.gapp[data-theme="fete"]{--th-bg:#FBF4E7;--th-surf:#FFFFFF;--th-bd:rgba(42,32,23,.16);--th-text:#2A2017;--th-sub:rgba(42,32,23,.55);--th-acc:#E8674C;--th-acc-ink:#FFFFFF;--th-me:rgba(232,103,76,.12);--th-radius:18px;
  font-family:'Poppins',system-ui,sans-serif}
.gapp[data-theme="fete"] .ghead em{font-family:'Poppins',sans-serif;font-style:normal;color:var(--th-acc)}
.gapp[data-theme="fete"] .gcard,.gapp[data-theme="fete"] .gopt,.gapp[data-theme="fete"] .grankrow{box-shadow:3px 3px 0 rgba(42,32,23,.12)}
.gapp[data-theme="fete"] .gbtn{box-shadow:4px 4px 0 #2A2017;border:2px solid #2A2017}
.gapp[data-theme="fete"] .gtimer{background:#2A2017;color:#FFE08A;border-radius:50%;width:44px;height:44px;display:grid;place-items:center;font-size:1rem;min-width:0}
.gapp[data-theme="fete"] .ghd{background:rgba(255,255,255,.92)}
.gapp[data-theme="fete"] .ghd-mk{background:rgba(42,32,23,.08)}
.gapp[data-theme="fete"] .gprog{background:rgba(42,32,23,.1)}

/* ── THÈME C · MINUIT (nuit chic) ── */
.gapp[data-theme="minuit"]{--th-bg:#121A30;--th-surf:rgba(255,255,255,.045);--th-bd:rgba(255,255,255,.13);--th-text:#E7ECF7;--th-sub:rgba(231,236,247,.55);--th-acc:#8FA6FF;--th-acc-ink:#0E1424;--th-me:rgba(143,166,255,.12);--th-radius:14px;
  font-family:'Space Grotesk',system-ui,sans-serif}
.gapp[data-theme="minuit"],.gapp[data-theme="minuit"] .gshell{background:
  linear-gradient(168deg,#1C2440 0%,#121A30 60%,#0E1424 100%)}
.gapp[data-theme="minuit"] .ghead em{font-family:'Space Grotesk',sans-serif;font-style:normal;color:var(--th-acc)}
.gapp[data-theme="minuit"] .gcard,.gapp[data-theme="minuit"] .gopt,.gapp[data-theme="minuit"] .grankrow,.gapp[data-theme="minuit"] .ginput{backdrop-filter:blur(6px)}
.gapp[data-theme="minuit"] .gbtn{background:var(--th-acc);color:var(--th-acc-ink)}
.gapp[data-theme="minuit"] .gtimer{color:var(--th-acc)}
.gapp[data-theme="minuit"] .ghd{background:rgba(18,26,48,.9)}

.gapp .gcard,.gapp .gopt,.gapp .ginput,.gapp .grankrow,.gapp .gbtn{border-radius:var(--th-radius)}

/* ── dashboard: experience-theme picker cards ── */
.theme-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.theme-card{display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.7rem .4rem .65rem;
  border:1.5px solid var(--line,rgba(0,0,0,.12));border-radius:14px;background:transparent;cursor:pointer;
  transition:border-color .2s,box-shadow .2s;font-family:inherit}
.theme-card:hover{border-color:var(--gold)}
.theme-card.on{border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 22%,transparent)}
.theme-card .tc-prev{width:100%;height:46px;border-radius:9px;display:grid;place-items:center;margin-bottom:.35rem}
.theme-card .tc-prev b{font-size:1.05rem;font-weight:800}
.tc-boudoir{background:linear-gradient(150deg,#241C12,#16120C);color:#C9A87C}
.tc-boudoir b{font-family:'Spectral',serif;font-style:italic;font-weight:500}
.tc-fete{background:#FBF4E7;color:#E8674C;border:1.5px solid #2A2017}
.tc-fete b{font-family:'Poppins',sans-serif;font-weight:800}
.tc-minuit{background:linear-gradient(150deg,#1C2440,#0E1424);color:#8FA6FF}
.tc-minuit b{font-family:'Space Grotesk',sans-serif;font-weight:600}
.theme-card .tc-nm{font-size:.78rem;font-weight:800}
.theme-card .tc-d{font-size:.6rem;opacity:.6;font-weight:600}

/* ── live preview reacts to selected experience theme ── */
#themeScr[data-theme="fete"]{background:#FBF4E7;font-family:'Poppins',sans-serif}
#themeScr[data-theme="fete"] .pl-ev-n,#themeScr[data-theme="fete"] .pl-q{color:#2A2017}
#themeScr[data-theme="fete"] .pl-ev-s{color:rgba(42,32,23,.5)}
#themeScr[data-theme="fete"] .pl-av{background:#fff;border-color:rgba(42,32,23,.18)}
#themeScr[data-theme="fete"] .pl-evt{border-bottom-color:rgba(42,32,23,.12)}
#themeScr[data-theme="fete"] .pl-opt{background:#fff;border-color:#2A2017;color:#2A2017;box-shadow:2px 2px 0 rgba(42,32,23,.12)}
#themeScr[data-theme="fete"] .pl-opt .pl-ol{background:#FFE9C2;color:#B9772A}
#themeScr[data-theme="minuit"]{background:linear-gradient(168deg,#1C2440,#0E1424);font-family:'Space Grotesk',sans-serif}
#themeScr[data-theme="minuit"] .pl-opt{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.12)}
.gshell{max-width:480px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;background:var(--th-bg);
  box-shadow:0 0 80px rgba(0,0,0,.4)}
.gcover{height:200px;position:relative;background:linear-gradient(135deg,#DCC6A0,#A8814E);display:flex;align-items:flex-end;overflow:hidden}
.gcover .cph{position:absolute;inset:0;display:grid;place-items:center;font-size:3.5rem;opacity:.45}
.gcover .grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.55),transparent 62%)}
.gcover-info{position:relative;padding:1.3rem;display:flex;align-items:center;gap:.7rem;width:100%}
.gcover .glogo{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);display:grid;place-items:center;font-weight:800;flex-shrink:0;border:1px solid rgba(255,255,255,.25)}
.gev-name{font-weight:800;font-size:1.15rem;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.45);letter-spacing:-.01em}
.gev-date{font-size:.7rem;color:rgba(255,255,255,.72)}
.gbody{flex:1;padding:1.4rem;display:flex;flex-direction:column;gap:1.1rem}
.ggreet{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--th-acc);font-weight:700}
.ghead{font-weight:800;font-size:1.5rem;letter-spacing:-.02em;line-height:1.15}
.ghead em{color:var(--th-acc);font-family:'Spectral',serif}
.gcard{background:var(--th-surf);border:1px solid var(--th-bd);border-radius:16px;padding:1.3rem;transition:border-color .2s,transform .2s}
.gcard.clk{cursor:pointer}
.gcard.clk:hover{border-color:var(--th-acc);transform:translateY(-2px)}
.gcard-h{display:flex;gap:.9rem;align-items:flex-start;margin-bottom:1rem}
.gcard-ico{font-size:1.7rem}
.gcard-t{font-weight:800;font-size:1rem;margin-bottom:.2rem}
.gcard-d{font-size:.74rem;color:var(--th-sub);line-height:1.5}
.gtag{display:inline-flex;align-items:center;gap:.35rem;margin-top:.5rem;font-size:.56rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--th-acc)}
.gtag .gd{width:6px;height:6px;border-radius:50%;background:#5FB87B;animation:bl 1.5s infinite}
.gtag.soon{color:var(--th-sub)}
.gbtn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;font-family:inherit;font-weight:800;font-size:.86rem;
  padding:.9rem 1.2rem;border-radius:12px;border:none;background:var(--th-acc);color:var(--th-acc-ink);cursor:pointer;transition:filter .2s}
.gbtn:hover{filter:brightness(1.07)}
.gbtn.wait{background:var(--th-surf);color:var(--th-sub);border:1px solid var(--th-bd);cursor:default}
.gbtn.sec{background:transparent;border:1px solid var(--th-bd);color:var(--th-text)}
.gfoot{padding:1.4rem;text-align:center;font-size:.66rem;color:var(--th-sub)}
.gfoot b{color:var(--th-acc);font-weight:800}
.gdot3{display:flex;justify-content:center;gap:.4rem}
.gdot3 i{width:8px;height:8px;border-radius:50%;background:var(--th-acc);display:block;animation:bl 1.4s infinite}
/* confetti */
.confetti{position:fixed;top:-14px;width:9px;height:14px;border-radius:2px;z-index:400;pointer-events:none;animation:cfall linear forwards}
@keyframes cfall{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(108vh) rotate(620deg);opacity:.65}}
.ghd{position:sticky;top:0;z-index:5;background:rgba(22,19,14,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--th-bd);
  padding:.9rem 1.2rem;display:flex;align-items:center;justify-content:space-between}
.ghd-l{display:flex;align-items:center;gap:.6rem}
.ghd-mk{width:30px;height:30px;border-radius:8px;background:rgba(255,255,255,.1);display:grid;place-items:center;font-weight:800;flex-shrink:0}
.ghd-ev{font-weight:800;font-size:.84rem}
.ghd-meta{font-size:.62rem;color:var(--th-sub)}
.gback{font-size:.72rem;color:var(--th-sub);cursor:pointer;font-weight:600}
.gback:hover{color:var(--th-text)}
.gprog{height:3px;background:rgba(255,255,255,.07)}
.gprog i{display:block;height:100%;background:var(--th-acc);transition:width .4s var(--ease)}
.ginput{width:100%;padding:1rem 1.2rem;background:var(--th-surf);border:1.5px solid var(--th-bd);border-radius:12px;color:var(--th-text);
  font-family:inherit;font-size:.92rem;font-weight:600;text-align:center;outline:none;transition:border-color .2s}
.ginput:focus{border-color:var(--th-acc)}
.gopt{display:flex;align-items:center;gap:.7rem;padding:.85rem 1rem;border:1.5px solid var(--th-bd);border-radius:12px;background:var(--th-surf);
  cursor:pointer;transition:all .2s;font-family:inherit;color:var(--th-text);font-size:.9rem;width:100%;text-align:left}
.gopt:hover{border-color:var(--th-acc)}
.gopt .l{width:26px;height:26px;border-radius:7px;background:rgba(255,255,255,.08);display:grid;place-items:center;font-weight:800;font-size:.7rem;flex-shrink:0}
.gopt.ok{border-color:#5FB87B;background:rgba(60,140,90,.18)}
.gopt.ok .l{background:#3C8C5A;color:#fff}
.gopt.no{border-color:#C0563B;background:rgba(192,86,59,.14);opacity:.72}
.gscreen{display:none}.gscreen.on{display:block;animation:revUp .5s var(--ease) both}
.gtimer{font-weight:900;font-size:1.4rem;color:var(--th-acc);min-width:46px;text-align:right}
.grankrow{display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;border-radius:10px;background:var(--th-surf);border:1px solid var(--th-bd)}
.grankrow.me{border-color:var(--th-acc);background:rgba(201,168,124,.14)}
.grankrow .p{width:24px;text-align:center;font-weight:800}
.grankrow .n{font-weight:700;font-size:.84rem}
.grankrow .s{margin-left:auto;font-weight:800;color:var(--th-acc)}
.gup{margin:1.2rem;border:1.5px dashed var(--th-bd);border-radius:16px;padding:1.6rem;text-align:center;cursor:pointer;display:block;transition:border-color .2s}
.gup:hover{border-color:var(--th-acc)}
.gup input{display:none}
.gup .ui{font-size:1.8rem;margin-bottom:.4rem}
.gup .ut{font-weight:800;font-size:.84rem}
.gup .us{font-size:.66rem;color:var(--th-sub);margin-top:.2rem}
.ggrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;padding:0 1.2rem 1.2rem}
.ggrid .gcell{aspect-ratio:1;border-radius:8px;width:100%;display:grid;place-items:center;font-size:1.5rem;overflow:hidden}
.ggrid .gcell img{width:100%;height:100%;object-fit:cover}
.ggrid .gcell{position:relative}
.gdel{position:absolute;top:4px;right:4px;width:24px;height:24px;border-radius:50%;border:none;background:rgba(0,0,0,.6);color:#fff;font-size:.74rem;cursor:pointer;opacity:0;transition:opacity .2s;display:grid;place-items:center;z-index:2}
.gcell:hover .gdel{opacity:1}

/* ── projection (big screen — true 16:9 letterboxed stage) ── */
.proj-stage{position:fixed;inset:0;background:#000;display:grid;place-items:center;overflow:hidden}
.proj{container-type:size;width:min(100vw,calc(100vh * 16 / 9));height:min(100vh,calc(100vw * 9 / 16));aspect-ratio:16/9;background:radial-gradient(60% 70% at 50% -10%,color-mix(in srgb,var(--th-acc) 16%,transparent),transparent),var(--th-bg,#0F0D0A);color:var(--th-text,#F4F1EA);display:flex;flex-direction:column;padding:3% 3%;overflow:hidden}
.proj-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.6cqh}
.proj-logo{display:flex;align-items:center;gap:.6rem;font-weight:900;font-size:1.9cqw}
.proj-logo .mk{width:2.4cqw;height:2.4cqw;min-width:22px;min-height:22px;border-radius:9px;background:var(--th-acc);display:grid;place-items:center}
.proj-logo .dot{color:var(--th-acc);margin-left:-.3rem}
.proj-live{display:inline-flex;align-items:center;gap:.5rem;font-size:1.4cqw;font-weight:700;color:#5FB87B;border:1px solid rgba(95,184,123,.3);background:rgba(95,184,123,.1);padding:.45rem 1rem;border-radius:100px}
.proj-live i{width:9px;height:9px;border-radius:50%;background:#5FB87B;display:block;animation:bl 1.4s infinite}
.proj-grid{flex:1;display:grid;grid-template-columns:1.1fr .9fr;gap:2.4cqw;min-height:0}
.proj-panel{background:var(--th-surf);border:1px solid var(--th-bd);border-radius:20px;padding:2.2cqw;overflow:hidden;display:flex;flex-direction:column}
.proj-pt{display:flex;align-items:center;gap:.7rem;font-size:2.3cqw;font-weight:800;margin-bottom:.7cqh}
.proj-pt .ico{font-size:2.6cqw}
.proj-rank{display:flex;align-items:center;gap:1.2rem;padding:.75cqh 1.5cqw;border-radius:14px;background:var(--th-surf);margin-bottom:.45cqh;border:1px solid var(--th-bd)}
.proj-rank.top{background:linear-gradient(100deg,color-mix(in srgb,var(--th-acc) 24%,transparent),color-mix(in srgb,var(--th-acc) 5%,transparent));border-color:color-mix(in srgb,var(--th-acc) 45%,transparent)}
.proj-rank .pos{font-size:2.6cqw;width:46px;text-align:center}
.proj-rank .nm{font-weight:800;font-size:2cqw;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.proj-rank .pts{margin-left:auto;font-weight:900;font-size:2.2cqw;color:var(--th-acc)}
.proj-wall{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.7cqw;flex:1;min-height:0}
.proj-wall div{border-radius:12px;display:grid;place-items:center;font-size:2.4cqw;overflow:hidden;position:relative}
.proj-wall div img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.proj-foot{margin-top:2.6cqh;display:flex;justify-content:space-between;align-items:center;font-size:1.4cqw;color:var(--th-sub)}
.proj-foot b{color:var(--th-acc)}
.proj-qr{width:6cqw;height:6cqw;min-width:58px;min-height:58px;border-radius:12px;background:#fff;display:grid;place-items:center;padding:.3cqw}
.proj-qr svg{width:100%;height:100%}
.proj-qr canvas{width:100%;height:100%;display:block;border-radius:6px}
@media(max-width:760px){.proj-grid{grid-template-columns:1fr}}

/* ── activity real visuals (home) ── */
.actshot-lead{margin-top:auto;background:var(--night);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:6px;border:1px solid #000}
.actshot-lead .hd{font-size:.6rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--champ);margin-bottom:3px;display:flex;align-items:center;gap:.4rem}
.actshot-lead .ql{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.05)}
.actshot-lead .ql.top{background:linear-gradient(100deg,rgba(184,144,96,.24),rgba(184,144,96,.04));border:1px solid rgba(184,144,96,.3)}
.actshot-lead .ql .p{width:20px;text-align:center;font-size:.92rem}
.actshot-lead .ql .n{font-weight:700;font-size:.78rem;color:#F4F1EA}
.actshot-lead .ql .s{margin-left:auto;font-weight:800;font-size:.78rem;color:var(--champ)}
.actshot-grid{margin-top:auto;display:grid;grid-template-columns:1fr 1fr 1fr;gap:3px;border-radius:12px;overflow:hidden;height:172px}
.actshot-grid .c{position:relative;overflow:hidden;display:grid;place-items:center;font-size:1.1rem}
.actshot-grid .c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:sepia(.15) saturate(1.08) brightness(1.03)}

/* ── per-question photo (dashboard editor) ── */
.qe-photo{display:inline-flex;align-items:center;gap:.45rem;margin-top:.55rem;font-size:.72rem;font-weight:700;color:var(--gold-ink);
  cursor:pointer;border:1.5px dashed var(--line2);border-radius:8px;padding:.4rem .7rem;transition:border-color .2s}
.qe-photo:hover{border-color:var(--gold)}
.qe-photo input{display:none}
.qe-thumb{display:flex;align-items:center;gap:.6rem;margin-top:.55rem}
.qe-thumb img{width:48px;height:48px;border-radius:8px;object-fit:cover;border:1px solid var(--line2)}
.qe-thumb .rm{font-size:.68rem;color:var(--note);cursor:pointer;font-weight:700}

/* ── legal pages ── */
.legal{max-width:760px;margin:0 auto;padding:clamp(40px,7vh,84px) 34px}
.legal-k{font-size:.66rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:1rem}
.legal h1{font-weight:800;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.03em;line-height:1.05;margin-bottom:1rem}
.legal h1 em{color:var(--gold)}
.legal-intro{font-size:1.02rem;line-height:1.6;color:var(--ink-soft);max-width:56ch}
.legal-date{font-size:.78rem;color:var(--muted);margin-top:1rem;padding-bottom:1.6rem;border-bottom:1px solid var(--line2)}
.lsec{padding:2rem 0;border-bottom:1px solid var(--line)}
.lsec h2{display:flex;align-items:baseline;gap:.7rem;font-weight:800;font-size:1.2rem;letter-spacing:-.01em;margin-bottom:.9rem}
.lsec h2 .ln{font-size:.78rem;font-weight:800;color:var(--gold);font-variant-numeric:tabular-nums}
.lsec h3{font-weight:700;font-size:.95rem;margin:1.2rem 0 .5rem}
.lsec p{font-size:.9rem;line-height:1.75;color:var(--ink-soft);margin-bottom:.8rem}
.lsec ul{list-style:none;display:flex;flex-direction:column;gap:.5rem;margin:.4rem 0 .8rem}
.lsec li{font-size:.9rem;line-height:1.6;color:var(--ink-soft);padding-left:1.2rem;position:relative}
.lsec li::before{content:"–";position:absolute;left:0;color:var(--gold)}
.lsec strong{color:var(--ink);font-weight:700}
.lsec a{color:var(--gold-ink);font-weight:600;text-decoration:underline}
.ltable{width:100%;border-collapse:collapse;margin:.6rem 0 .4rem;font-size:.82rem}
.ltable th,.ltable td{text-align:left;padding:.6rem .7rem;border:1px solid var(--line2);color:var(--ink-soft);line-height:1.4}
.ltable th{background:var(--paper2);color:var(--ink);font-weight:700;font-size:.74rem}
.lcallout{background:rgba(184,144,96,.08);border:1px solid rgba(184,144,96,.3);border-radius:12px;padding:1rem 1.2rem;margin:.4rem 0 .8rem}
.lcallout p{margin:0}
.lnav{display:flex;flex-wrap:wrap;gap:1.4rem;padding-top:2rem;font-size:.82rem;font-weight:700}
.lnav a{color:var(--gold-ink)}
.lnav a:hover{text-decoration:underline}

/* dashboard extras (config richness) */
.aistrip{display:flex;align-items:center;gap:.9rem;background:linear-gradient(100deg,rgba(184,144,96,.16),rgba(184,144,96,.04));
  border:1px solid rgba(184,144,96,.3);border-radius:12px;padding:1rem 1.1rem;margin-bottom:1.2rem;flex-wrap:wrap}
.aistrip .ai-i{font-size:1.5rem}
.aistrip .ai-x{flex:1;min-width:150px}
.aistrip .ai-t{font-weight:800;font-size:.86rem}
.aistrip .ai-d{font-size:.74rem;color:var(--ink-soft);line-height:1.45}
.coverup{border:1.5px dashed var(--line2);border-radius:12px;cursor:pointer;display:block;transition:border-color .2s;position:relative;overflow:hidden;height:130px}
.coverup:hover{border-color:var(--gold)}
.coverup input{display:none}
.coverup .cu-img{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;z-index:0}
.coverup .cu-in{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;text-align:center;padding:1rem}
.coverup.has .cu-in{background:rgba(0,0,0,.35);color:#fff}
.coverup .cu-t{font-weight:800;font-size:.82rem}
.coverup .cu-s{font-size:.66rem;opacity:.8}
.fontpick{display:flex;flex-direction:column;gap:.5rem}
.fontopt{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.7rem .9rem;border:1.5px solid var(--line2);
  border-radius:10px;background:var(--paper);cursor:pointer;transition:border-color .2s}
.fontopt:hover{border-color:var(--gold)}
.fontopt.on{border-color:var(--gold);background:rgba(184,144,96,.1)}
.fontopt .fo-n{font-weight:700;font-size:.86rem}
.fontopt .fo-s{font-size:1.05rem;color:var(--ink-soft)}
.stepper{display:inline-flex;align-items:center;gap:.5rem;border:1.5px solid var(--line2);border-radius:10px;padding:.3rem;background:var(--paper)}
.stepper button{width:30px;height:30px;border-radius:7px;border:none;background:var(--paper2);font-weight:800;font-size:1.05rem;cursor:pointer;color:var(--ink);line-height:1}
.stepper button:hover{background:var(--gold);color:#fff}
.stepper button:disabled{opacity:.35;cursor:default}
.stepper .qv{min-width:64px;text-align:center;font-weight:800;font-size:.88rem}
.aside-ev{display:flex;align-items:center;gap:.6rem;padding:.5rem;border-radius:10px;background:rgba(255,255,255,.04);margin-bottom:.3rem}
.aside-ev .thumb{width:38px;height:38px;border-radius:9px;background:linear-gradient(135deg,#C9A87C,#A8814E);display:grid;place-items:center;font-size:1.1rem;flex-shrink:0;overflow:hidden}
.aside-ev .thumb img{width:100%;height:100%;object-fit:cover}
.aside-ev .en{font-weight:800;font-size:.82rem;color:#F4F1EA;line-height:1.2}
.aside-ev .ed{font-size:.62rem;color:rgba(244,241,234,.45)}
/* question editor */
.qe-card{background:var(--paper);border:1px solid var(--line2);border-radius:11px;padding:.9rem;margin-bottom:.7rem}
.qe-top{display:flex;gap:.5rem;margin-bottom:.6rem;align-items:center}
.qe-sel{font-family:inherit;font-size:.74rem;font-weight:700;border:1.5px solid var(--line2);border-radius:8px;padding:.42rem .5rem;background:var(--card);color:var(--ink);cursor:pointer}
.qe-q{flex:1;min-width:0;font-family:inherit;font-size:.86rem;font-weight:600;border:1.5px solid var(--line2);border-radius:8px;padding:.45rem .6rem;background:var(--card);color:var(--ink)}
.qe-q:focus,.qe-sel:focus,.qe-ans input:focus{outline:none;border-color:var(--gold)}
.qe-ans{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem}
.qe-ans .rad{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--line2);flex-shrink:0;cursor:pointer;display:grid;place-items:center}
.qe-ans .rad.on{border-color:var(--gold);background:var(--gold)}
.qe-ans .rad.on::after{content:"";width:7px;height:7px;border-radius:50%;background:#fff}
.qe-ans input[type=text]{flex:1;min-width:0;font-family:inherit;font-size:.82rem;border:1px solid var(--line2);border-radius:7px;padding:.4rem .55rem;background:var(--card);color:var(--ink)}
.qe-ans .x{background:none;border:none;color:var(--muted);cursor:pointer;font-size:.8rem;flex-shrink:0}
.qe-ans .x:hover{color:#C0563B}
.qe-del{background:none;border:none;color:var(--muted);cursor:pointer;font-size:.95rem;flex-shrink:0}
.qe-del:hover{color:#C0563B}
.qe-mini{font-size:.7rem;color:var(--gold-ink);background:none;border:none;cursor:pointer;font-weight:700;font-family:inherit;padding:.2rem 0;margin-top:.2rem}
.qe-mini:hover{text-decoration:underline}
.qe-cor-lbl{font-size:.62rem;color:var(--muted);font-weight:600}
/* post-event export grid */
.expgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.exp-cell{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;display:grid;place-items:center;font-size:1.6rem;border:1px solid var(--line2)}
.exp-cell .dl{position:absolute;top:5px;right:5px;width:26px;height:26px;border-radius:8px;border:none;background:rgba(0,0,0,.55);color:#fff;cursor:pointer;opacity:0;transition:opacity .2s;display:grid;place-items:center;font-size:.78rem}
.exp-cell:hover .dl{opacity:1}

/* ── assistant widget ── */
.ia-fab{position:fixed;right:20px;bottom:20px;z-index:90;width:46px;height:46px;border-radius:50%;border:none;cursor:pointer;
  background:var(--ink);color:#fff;box-shadow:0 10px 26px -8px rgba(0,0,0,.5);display:grid;place-items:center;font-size:1.15rem;
  transition:transform .22s var(--ease)}
.ia-fab:hover{transform:scale(1.06)}
.ia-fab .cl{display:none}
.ia-open .ia-fab .op{display:none}
.ia-open .ia-fab .cl{display:block}
.ia-fab .badge{position:absolute;top:-3px;right:-3px;width:16px;height:16px;border-radius:50%;background:var(--gold);color:#fff;
  font-size:.56rem;font-weight:800;display:grid;place-items:center;border:2px solid var(--paper)}
.ia-panel{position:fixed;right:20px;bottom:74px;z-index:91;width:380px;max-width:calc(100vw - 32px);max-height:min(620px,calc(100vh - 110px));
  background:var(--card);border-radius:20px;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.45),0 0 0 1px var(--line);
  opacity:0;transform:translateY(16px) scale(.98);pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease)}
.ia-open .ia-panel{opacity:1;transform:none;pointer-events:auto}
.ia-hd{background:var(--ink);color:#fff;padding:1.1rem 1.2rem;display:flex;align-items:center;gap:.8rem}
.ia-hd .mk{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.1);display:grid;place-items:center;flex-shrink:0;
  font-family:'Spectral',serif;font-style:italic;font-weight:500;font-size:1.3rem}
.ia-hd .nm{font-weight:800;font-size:1.05rem;letter-spacing:-.01em}
.ia-hd .sub{font-size:.72rem;color:rgba(255,255,255,.5);margin-top:.05rem}
.ia-hd .on{margin-left:auto;display:inline-flex;align-items:center;gap:.4rem;font-size:.72rem;color:rgba(255,255,255,.6);font-weight:500}
.ia-hd .on i{width:8px;height:8px;border-radius:50%;background:#3FBF6A;display:block;box-shadow:0 0 0 0 rgba(63,191,106,.5);animation:iaPulse 2s infinite}
@keyframes iaPulse{0%{box-shadow:0 0 0 0 rgba(63,191,106,.5)}70%{box-shadow:0 0 0 6px rgba(63,191,106,0)}100%{box-shadow:0 0 0 0 rgba(63,191,106,0)}}
.ia-body{flex:1;overflow-y:auto;padding:1.3rem 1.2rem;display:flex;flex-direction:column;gap:.8rem;background:var(--card)}
.ia-msg{max-width:84%;padding:.85rem 1.05rem;border-radius:16px;font-size:.9rem;line-height:1.5;animation:revUp .4s var(--ease) both}
.ia-msg.bot{align-self:flex-start;background:var(--paper2);color:var(--ink);border-bottom-left-radius:5px}
.ia-msg.me{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:5px}
.ia-msg a{color:var(--gold-ink);font-weight:700;text-decoration:underline}
.ia-msg.bot strong{font-weight:700}
.ia-chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:.2rem 0 .1rem}
.ia-chip{font-family:inherit;font-size:.82rem;font-weight:600;color:var(--ink);background:var(--card);border:1.5px solid var(--line2);
  border-radius:100px;padding:.5rem .9rem;cursor:pointer;transition:all .18s;display:inline-flex;align-items:center;gap:.4rem}
.ia-chip:hover{border-color:var(--gold);background:rgba(184,144,96,.07)}
.ia-typing{align-self:flex-start;display:flex;gap:.3rem;padding:.85rem 1.05rem;background:var(--paper2);border-radius:16px;border-bottom-left-radius:5px}
.ia-typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);display:block;animation:iaBlink 1.2s infinite}
.ia-typing i:nth-child(2){animation-delay:.2s}.ia-typing i:nth-child(3){animation-delay:.4s}
@keyframes iaBlink{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.ia-foot{padding:.85rem 1rem;border-top:1px solid var(--line);background:var(--card);display:flex;align-items:center;gap:.6rem}
.ia-in{flex:1;border:1.5px solid var(--line2);border-radius:100px;padding:.7rem 1.1rem;font-family:inherit;font-size:.88rem;
  background:var(--paper);color:var(--ink);outline:none;transition:border-color .18s}
.ia-in:focus{border-color:var(--gold)}
.ia-send{width:44px;height:44px;border-radius:50%;border:none;background:var(--ink);color:#fff;cursor:pointer;flex-shrink:0;
  display:grid;place-items:center;transition:background .18s}
.ia-send:hover{background:#000}
@media(max-width:480px){.ia-panel{right:12px;left:12px;bottom:86px;width:auto}}

/* sober validation box (dashboard) */
.vbox{position:fixed;left:50%;bottom:30px;transform:translate(-50%,18px);z-index:95;
  display:flex;align-items:center;gap:.7rem;background:var(--ink);color:#F4F1EA;
  padding:.85rem 1.3rem;border-radius:12px;box-shadow:0 18px 40px -14px rgba(0,0,0,.5);
  font-size:.9rem;font-weight:600;opacity:0;pointer-events:none;transition:opacity .25s var(--ease),transform .25s var(--ease);max-width:90vw}
.vbox.show{opacity:1;transform:translate(-50%,0)}
.vbox .vk{width:24px;height:24px;border-radius:50%;background:#3FBF6A;color:#fff;display:grid;place-items:center;font-size:.8rem;font-weight:800;flex-shrink:0;animation:vPop .35s var(--ease) both}
@keyframes vPop{0%{transform:scale(0)}60%{transform:scale(1.2)}100%{transform:scale(1)}}

/* ── hero phone: animated quiz ↔ album (CSS-only crossfade) ── */
.pl-stack{position:relative;min-height:384px}
.pl-screen{position:absolute;inset:0;opacity:0}
@media (prefers-reduced-motion:no-preference){
  #scrQuiz{animation:heroSwapA 9s var(--ease) infinite}
  #scrAlbum{animation:heroSwapB 9s var(--ease) infinite}
}
@media (prefers-reduced-motion:reduce){ #scrQuiz{opacity:1} }
@keyframes heroSwapA{0%,40%{opacity:1}48%,90%{opacity:0}98%,100%{opacity:1}}
@keyframes heroSwapB{0%,40%{opacity:0}48%,90%{opacity:1}98%,100%{opacity:0}}
.pl-tabs{display:flex;gap:.3rem;padding:.5rem .85rem 0}
.pl-tab{flex:1;text-align:center;font-size:.6rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  padding:.4rem;border-radius:8px;color:rgba(255,255,255,.4);background:transparent;transition:all .3s}
.pl-tab.on{background:rgba(255,255,255,.08);color:var(--champ)}
@media (prefers-reduced-motion:no-preference){
  #tabQuiz{animation:tabA 9s step-end infinite}
  #tabAlbum{animation:tabB 9s step-end infinite}
}
@keyframes tabA{0%,44%{background:rgba(255,255,255,.08);color:var(--champ)}45%,100%{background:transparent;color:rgba(255,255,255,.4)}}
@keyframes tabB{0%,44%{background:transparent;color:rgba(255,255,255,.4)}45%,94%{background:rgba(255,255,255,.08);color:var(--champ)}95%,100%{background:transparent;color:rgba(255,255,255,.4)}}
.pl-album{display:grid;grid-template-columns:1fr 1fr 1fr;gap:3px;padding:.55rem .85rem .85rem}
.pl-album .ph-img{position:relative;aspect-ratio:1;border-radius:7px;overflow:hidden;display:grid;place-items:center;font-size:1.05rem}
.pl-album .ph-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:sepia(.18) saturate(1.08) brightness(1.03)}
.pl-album .ph-img.new::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 2px var(--champ);border-radius:7px;animation:photoIn 2.4s var(--ease)}
@keyframes photoIn{0%{opacity:1}100%{opacity:0}}

/* generic Unsplash image w/ gradient fallback (img hides on error → bg shows) */
.imgfill{position:relative;overflow:hidden}
.imgfill>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.imgfill>.cap{position:relative;z-index:2}

/* ── footer ── */
.ft{background:var(--night2);color:rgba(244,241,234,.6);padding:4rem 0 2rem}
.ft-in{max-width:var(--maxw);margin:0 auto;padding:0 34px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2.5rem;
       border-bottom:1px solid rgba(255,255,255,.07);padding-bottom:2.4rem}
.ft .logo{color:#F4F1EA;margin-bottom:.8rem}
.ft-tag{font-size:.82rem;line-height:1.7;color:rgba(244,241,234,.4);max-width:24ch}
.ft-col h4{font-size:.66rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,241,234,.35);margin-bottom:1rem}
.ft-col a{display:block;font-size:.86rem;color:rgba(244,241,234,.55);margin-bottom:.55rem;transition:color .2s}
.ft-col a:hover{color:#F4F1EA}
.ft-bot{max-width:var(--maxw);margin:1.6rem auto 0;padding:0 34px;display:flex;justify-content:space-between;
        font-size:.74rem;color:rgba(244,241,234,.3);flex-wrap:wrap;gap:.5rem}
@media(max-width:780px){.ft-in{grid-template-columns:1fr 1fr}}

/* reveal — content visible by default; animation is progressive enhancement */
@keyframes revUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.rev.in{animation:revUp .8s var(--ease) both}
.rev.d1.in{animation-delay:.08s}.rev.d2.in{animation-delay:.16s}.rev.d3.in{animation-delay:.24s}
@media(prefers-reduced-motion:reduce){.rev.in{animation:none}.mq-tr,.live i,.demo-meta .live-d{animation:none}}

/* ═══════════ MOBILE POLISH (pre-launch responsive pass) ═══════════ */
@media(max-width:560px){
  /* tighter gutters everywhere */
  .nav-in,.wrap,.strip-in,.ft-in,.ft-bot{padding-left:18px;padding-right:18px}
  .hero-in{padding-left:18px;padding-right:18px}
  /* footer: single column, readable */
  .ft-in{grid-template-columns:1fr 1fr;gap:1.6rem}
  .ft-bot{flex-direction:column;align-items:flex-start;text-align:left}
  /* section rhythm a touch tighter */
  :root{--sec:clamp(48px,7vh,80px)}
  /* shead stacks cleanly */
  .shead{flex-direction:column;align-items:flex-start;gap:1rem}
  .shead.ctr{align-items:center}
  /* legal tables scroll instead of overflowing */
  .ltable{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
  .ltable th,.ltable td{padding:.5rem .6rem;font-size:.78rem}
  .legal{padding-left:20px;padding-right:20px}
  /* sitemap one column */
  .sm-grid{grid-template-columns:1fr}
}

/* dashboard / app shell on phones: sidebar becomes a compact top bar */
@media(max-width:780px){
  .app{grid-template-columns:1fr}
  .aside{position:static;height:auto;flex-direction:column;gap:.8rem;padding:1rem}
  .anav{flex-direction:row;flex-wrap:wrap;gap:.4rem}
  .anav .asec,.anav .lbl{width:100%;padding:.3rem .2rem 0}
  .nb{flex:0 0 auto;font-size:.78rem;padding:.5rem .7rem}
  .aside-up{margin-top:.4rem}
  .amain{padding:20px 16px}
  /* config & live previews: stack and center */
  .cfg2,.live2{gap:18px}
  .cfg2 .phone,.live2 .phone{margin-inline:auto}
}

/* auth wizard padding on phones */
@media(max-width:480px){
  .auth-form{padding:1.5rem 1.2rem}
  .pay-left,.pright{padding:1.4rem 1.2rem}
}



/* ════════════════════════════════════════════════════════════════
   MODÉRATION PHOTOS (Account.html)
   ════════════════════════════════════════════════════════════════ */
.mod-toggle-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.2rem;
  background: rgba(184,144,96,.06);
  border: 1px solid rgba(184,144,96,.2);
  border-radius: 12px;
  margin-bottom: 1rem;
}
.mod-toggle-row .mod-info { flex: 1; }
.mod-toggle-row .mod-info-t {
  font-weight: 700; font-size: .92rem; margin-bottom: .2rem;
  display: flex; align-items: center; gap: .4rem;
}
.mod-toggle-row .mod-info-d {
  font-size: .76rem; color: var(--muted, #8B8579); line-height: 1.5;
}
.mod-switch {
  position: relative;
  width: 52px; height: 28px;
  flex-shrink: 0;
  cursor: pointer;
}
.mod-switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.mod-switch .slider {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.15);
  border-radius: 28px;
  transition: .25s;
}
.mod-switch .slider::before {
  content: ''; position: absolute;
  width: 22px; height: 22px; left: 3px; bottom: 3px;
  background: #fff; border-radius: 50%; transition: .25s;
}
.mod-switch input:checked + .slider { background: var(--gold, #B89060); }
.mod-switch input:checked + .slider::before { transform: translateX(24px); }

.mod-pending-section {
  margin-top: 1.5rem;
  padding: 1.2rem;
  background: var(--th-surf, #FBFAF5);
  border-radius: 14px;
  border: 1px solid rgba(184,144,96,.15);
}
.mod-pending-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 1rem;
}
.mod-pending-head .t {
  font-weight: 700; font-size: .95rem;
  display: flex; align-items: center; gap: .5rem;
}
.mod-pending-count {
  background: var(--gold, #B89060); color: #fff;
  font-size: .7rem; font-weight: 800;
  padding: .2rem .6rem; border-radius: 100px;
}
.mod-pending-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: .8rem;
}
.mod-card {
  background: #fff; border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px; overflow: hidden;
  transition: transform .2s;
}
.mod-card-img {
  width: 100%; aspect-ratio: 1; object-fit: cover; display: block;
}
.mod-card-meta {
  padding: .55rem .7rem;
  font-size: .72rem; color: var(--muted);
  display: flex; justify-content: space-between;
}
.mod-card-actions {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  border-top: 1px solid rgba(0,0,0,.06);
}
.mod-card-btn {
  padding: .65rem; border: 0;
  font-size: .72rem; font-weight: 700;
  cursor: pointer; transition: .2s;
}
.mod-card-btn.approve { background: rgba(74,124,89,.15); color: #2F6B43; }
.mod-card-btn.approve:hover { background: rgba(74,124,89,.3); }
.mod-card-btn.reject { background: rgba(220,38,38,.1); color: #B22A2A; border-left: 1px solid rgba(0,0,0,.06); }
.mod-card-btn.reject:hover { background: rgba(220,38,38,.2); }

.mod-empty {
  text-align: center; padding: 2.5rem 1rem;
  color: var(--muted); font-style: italic; font-family: Spectral, serif;
}

/* Bouton "Lancer projection" dans le dashboard */
.btn-projection {
  width: 100%;
  justify-content: center;
  background: #0D0C0A !important;
  color: #fff !important;
  font-weight: 700 !important;
  margin-top: .5rem;
}
.btn-projection:hover { background: #1F1E1B !important; }


/* ─── Safety : empêche le canvas QR de déborder de sa .qrbox ─── */
.qrbox canvas, .qrbox svg, .qrbox img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}
.qrbox { overflow: hidden; }

/* ── a11y & mobile tap-target polish ── */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
.chip:focus-visible,.gchip:focus-visible,.tog:focus-visible,.nb:focus-visible,.faq-q:focus-visible,.ffilter:focus-visible{
  outline:2px solid var(--gold);outline-offset:2px;border-radius:6px}
@media(max-width:560px){
  .nav-links a,.ft-col a{padding-block:.3rem}
  .chip,.gchip,.btn-sm{min-height:42px}
  .chip,.gchip{display:inline-flex;align-items:center}
  .faq-q{min-height:46px}
  .tog{min-width:46px;min-height:26px}
}

/* editable suggested questions (signup step 3) */
.suq-item .qt-edit{width:100%;border:1px solid transparent;background:transparent;font:inherit;color:inherit;border-radius:8px;padding:.4rem .55rem;margin:-.2rem -.55rem;transition:border-color .2s,background .2s}
.suq-item .qt-edit:hover{border-color:var(--line2)}
.suq-item .qt-edit:focus{outline:none;border-color:var(--gold);background:var(--card)}

/* ── GOLDEN HOUR grade — étalonnage chaud commun à toutes les photos événement ── */
.lap-cover img, .lap-ph img, .imgfill > img, .gcover img,
.proj-wall img, .lvwall img, .pl-album .ph-img img, .pl-banner img{
  filter:sepia(.14) saturate(1.08) brightness(1.03) contrast(1.02);
}


/* ════ FIX Phone previews sticky CENTRÉS + UNIFIÉS ════ */
.cfg2, .live2, .theme-preview-grid, [class*="phone-col"] {
  align-items: flex-start !important;
}
/* Wrappers des phone previews (colonne droite) : taille uniforme */
.cfg2 > div:nth-child(2),
.live2 > div:nth-child(2),
.theme-preview-col {
  width: 280px !important;
  max-width: 280px !important;
  flex-shrink: 0 !important;
  position: sticky !important;
  top: 84px !important;
  align-self: flex-start !important;
}
/* Les phone elements eux-mêmes : taille uniforme inside */
.cfg2 .phone, 
.live2 .phone, 
.theme-preview-col .phone,
[class*="phone-preview"] .phone, 
.preview-iphone,
.phone[style*="width:264px"],
.phone[style*="width: 264px"] {
  width: 280px !important;
  max-width: 280px !important;
  height: auto !important;
  position: static !important;
  margin: 0 !important;
}
/* L'écran à l'intérieur du phone : hauteur cohérente */
.cfg2 .phone .scr, 
.live2 .phone .scr, 
.theme-preview-col .phone .scr {
  min-height: 460px !important;
  max-height: 560px !important;
}
@media (max-width: 900px) {
  .cfg2 .phone, .live2 .phone, .theme-preview-col .phone,
  [class*="phone-preview"] .phone, .preview-iphone {
    position: static;
    margin: 1rem auto;
  }
}


/* ════ Animation "joueur rejoint" — sur tel et projection ════ */
.join-notifs {
  position: fixed;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9000;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  pointer-events: none;
  max-width: 90vw;
}
.join-pop {
  background: var(--th-acc, #B89060);
  color: #fff;
  padding: .7rem 1.2rem;
  border-radius: 100px;
  font-weight: 700;
  font-size: .9rem;
  box-shadow: 0 8px 28px -8px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.15);
  white-space: nowrap;
  animation: joinPopAnim 3.5s cubic-bezier(.34,1.4,.4,1) forwards;
  display: flex;
  align-items: center;
  gap: .5rem;
}
.join-pop::before {
  content: '✦';
  animation: joinSparkle 1s ease-in-out infinite alternate;
}
@keyframes joinPopAnim {
  0%   { opacity: 0; transform: translateY(40px) scale(0.6); }
  10%  { opacity: 1; transform: translateY(0) scale(1.08); }
  18%  { transform: translateY(0) scale(1); }
  75%  { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-20px) scale(0.95); }
}
@keyframes joinSparkle {
  0%   { transform: scale(1) rotate(0); }
  100% { transform: scale(1.4) rotate(180deg); }
}

/* Variante mode projection : plus grand, plus de présence */
.proj .join-pop {
  font-size: 1.6rem;
  padding: 1.1rem 2.2rem;
  border-radius: 999px;
  box-shadow: 0 16px 50px -16px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.15), 0 0 80px rgba(var(--th-acc-rgb,184,144,96), .4);
}

/* Compteur joueurs animé */
.player-count-bump {
  animation: countBump .6s cubic-bezier(.34,1.4,.4,1);
}
@keyframes countBump {
  0%   { transform: scale(1); }
  40%  { transform: scale(1.3); color: var(--th-acc, #B89060); }
  100% { transform: scale(1); }
}


.qitem, [data-q-idx] { cursor: grab; transition: opacity .2s, transform .2s; }
.qitem.dragging, [data-q-idx].dragging { opacity: .4; cursor: grabbing; }
.qitem.drag-over, [data-q-idx].drag-over { border-top: 3px solid var(--th-acc, #B89060) !important; padding-top: calc(.7rem - 3px) !important; }


/* ════════════════════════════════════════════════════════════════
   📱 MOBILE-FIRST DASHBOARD (< 900px)
   Transforme le dashboard en app-like avec bottom nav
   ════════════════════════════════════════════════════════════════ */

@media (max-width: 900px) {
  /* Masque la sidebar desktop */
  .aside, aside.aside { display: none !important; }
  
  /* Main prend toute la largeur */
  .amain, main.amain { padding: 1rem .8rem 5.5rem !important; max-width: 100% !important; }
  
  /* Topbar mobile minimaliste */
  .atopbar, header.atopbar {
    position: sticky; top: 0; z-index: 100;
    padding: .8rem 1rem !important;
    background: var(--th-bg, #15130F) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--th-border, rgba(255,255,255,.06));
  }
  
  /* Panels : padding réduit, full width */
  .apnl {
    padding: 0 !important;
    margin-top: 1rem;
  }
  .atop {
    padding: 0 !important;
    margin-bottom: 1rem;
    flex-direction: column;
    align-items: flex-start !important;
    gap: .5rem;
  }
  .atitle { font-size: 1.5rem !important; }
  
  /* Cards : marges minimales, border-radius plus marqué */
  .dcard, .acard {
    margin-bottom: 1rem !important;
    border-radius: 14px !important;
    padding: 1rem !important;
  }
  
  /* Phone preview : VISIBLE sur mobile, empilé sous les réglages et centré */
  .cfg2, .live2 { grid-template-columns: 1fr !important; display: block !important; }
  .cfg2 > div:nth-child(2),
  .live2 > div:nth-child(2),
  .theme-preview-col {
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    top: auto !important;
    display: flex !important;
    justify-content: center;
    margin-top: 1.2rem;
  }
  .cfg2 .phone, .live2 .phone, .theme-preview-col .phone,
  [class*="phone-preview"] .phone, .preview-iphone {
    position: static !important;
    width: min(280px, 78vw) !important;
    max-width: min(280px, 78vw) !important;
    margin: 0 auto !important;
  }
  
  /* Bottom navigation */
  .mobile-bottom-nav {
    display: flex !important;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--th-bg, #15130F);
    border-top: 1px solid var(--th-border, rgba(255,255,255,.08));
    z-index: 1000;
    padding: .5rem .3rem calc(.5rem + env(safe-area-inset-bottom));
    justify-content: space-around;
    box-shadow: 0 -4px 16px rgba(0,0,0,.15);
  }
  .mobile-bottom-nav .mbn-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .15rem;
    background: none;
    border: none;
    color: var(--th-sub, #888);
    padding: .4rem .2rem;
    cursor: pointer;
    font-size: .65rem;
    font-weight: 600;
    font-family: inherit;
    transition: all .2s;
  }
  .mobile-bottom-nav .mbn-item .mbn-icon {
    font-size: 1.4rem;
    line-height: 1;
  }
  .mobile-bottom-nav .mbn-item.active {
    color: var(--th-acc, #B89060);
  }
  .mobile-bottom-nav .mbn-item.active .mbn-icon {
    transform: scale(1.15);
    transition: transform .2s cubic-bezier(.34,1.4,.4,1);
  }
  
  /* Touch-friendly */
  button, .btn, .nb { min-height: 44px; }
  input, textarea, select { min-height: 44px; font-size: 16px !important; } /* 16px = no zoom iOS */
  
  /* Stats grid : 2 colonnes au lieu de 4 */
  #statsOverview { grid-template-columns: repeat(2, 1fr) !important; }
  
  /* Template packs : full width */
  #templatePacks .btn { flex: 1 1 calc(50% - .25rem); min-width: 0; }
}

/* Bottom nav cachée par défaut sur desktop */
.mobile-bottom-nav { display: none; }

/* iOS / Android specific PWA standalone fixes */
@media (display-mode: standalone) {
  body { user-select: none; -webkit-user-select: none; }
  /* Pas de pull-to-refresh */
  html, body { overscroll-behavior-y: contain; }
}

@keyframes slideUpSheet { from { transform: translateY(100%); } to { transform: translateY(0); } }


/* Drag handles pour les questions du quiz */
.qe-card[draggable="true"] {
  cursor: grab;
  transition: opacity .2s, border-color .2s, transform .2s;
}
.qe-card[draggable="true"]:active {
  cursor: grabbing;
}
.qe-card.dragging {
  opacity: .4;
}
.qe-card.drag-over {
  border-top: 3px solid var(--th-acc, #B89060) !important;
}


/* Sous-étiquette des cartes de thème (Naturel/Vibrant/Sobre) */
.theme .ts {
  font-size: .65rem;
  color: var(--th-sub);
  opacity: .7;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 700;
  margin-top: .15rem;
}


/* ╔════════════════════════════════════════════════════════════╗
   ║  GUEST POLISH — transitions, micro-animations, podium      ║
   ╚════════════════════════════════════════════════════════════╝ */

/* ─── Transitions entre écrans du quiz ─── */
.gscreen.on { animation: screenIn .45s cubic-bezier(.2,.9,.3,1) both; }
@keyframes screenIn {
  from { opacity: 0; transform: translateY(16px) scale(.985); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ─── Options : entrée en cascade ─── */
#qOpts .gopt {
  animation: optIn .42s cubic-bezier(.2,.9,.3,1) both;
  transition: transform .15s ease, border-color .2s ease, background .2s ease, box-shadow .25s ease;
}
#qOpts .gopt:active { transform: scale(.97); }
@keyframes optIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ─── Feedback réponse ─── */
.gopt.ok {
  animation: okPulse .7s cubic-bezier(.2,.9,.3,1);
  box-shadow: 0 0 0 3px rgba(95,184,123,.25), 0 8px 24px -8px rgba(95,184,123,.45);
}
@keyframes okPulse {
  0% { transform: scale(1); }
  35% { transform: scale(1.045); }
  100% { transform: scale(1); }
}
.gopt.no { animation: noShake .5s cubic-bezier(.36,.07,.19,.97); }
@keyframes noShake {
  10%, 90% { transform: translateX(-2px); }
  20%, 80% { transform: translateX(4px); }
  30%, 50%, 70% { transform: translateX(-6px); }
  40%, 60% { transform: translateX(6px); }
}

/* ─── Points flottants ─── */
.pts-float {
  position: fixed; left: 50%; top: 46%;
  transform: translate(-50%, 0) scale(.6);
  font-size: 2.2rem; font-weight: 900;
  color: #5FB87B; z-index: 9500; pointer-events: none;
  text-shadow: 0 6px 24px rgba(95,184,123,.5);
  animation: ptsUp 1.2s cubic-bezier(.2,1.2,.4,1) forwards;
}
.pts-float.zero { color: var(--th-sub, #9A937F); text-shadow: none; font-size: 1.5rem; }
@keyframes ptsUp {
  0%   { opacity: 0; transform: translate(-50%, 10px) scale(.6); }
  18%  { opacity: 1; transform: translate(-50%, -10px) scale(1.12); }
  30%  { transform: translate(-50%, -16px) scale(1); }
  75%  { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -64px) scale(.92); }
}

/* ─── Flash écran sur bonne réponse ─── */
.flash-ok {
  position: fixed; inset: 0; z-index: 9400; pointer-events: none;
  background: radial-gradient(80% 80% at 50% 50%, rgba(95,184,123,.18), transparent 70%);
  animation: flashFade .8s ease-out forwards;
}
@keyframes flashFade { from { opacity: 1; } to { opacity: 0; } }

/* ─── Timer urgent ─── */
.gtimer { transition: color .3s ease, transform .3s ease; }
.gtimer.urgent {
  color: #FF7B6B !important;
  animation: timerPulse 1s ease-in-out infinite;
}
@keyframes timerPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.14); }
}

/* ─── Écran d'attente : avatars des joueurs ─── */
.wait-avatars {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: .5rem; margin: 1.4rem auto 0; max-width: 320px;
}
.wav {
  display: flex; align-items: center; gap: .45rem;
  background: var(--th-surf, rgba(255,255,255,.04));
  border: 1px solid var(--th-bd, rgba(255,255,255,.09));
  padding: .35rem .75rem .35rem .4rem; border-radius: 100px;
  font-size: .76rem; font-weight: 600;
  animation: wavIn .55s cubic-bezier(.2,1.3,.4,1) both;
}
.wav .wa-i {
  width: 1.55rem; height: 1.55rem; border-radius: 50%;
  display: grid; place-items: center;
  color: #fff; font-weight: 800; font-size: .68rem;
  text-transform: uppercase;
}
@keyframes wavIn {
  from { opacity: 0; transform: scale(.5) translateY(8px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}
.wait-count { margin-top: 1.2rem; font-size: .8rem; color: var(--th-sub); }
.wait-count b { color: var(--th-acc); font-size: 1rem; display: inline-block; }
.wait-count b.bump { animation: countBump .5s cubic-bezier(.34,1.5,.4,1); }

/* ─── Podium final ─── */
.podium {
  display: flex; align-items: flex-end; justify-content: center;
  gap: .6rem; margin: 1.2rem auto 1.6rem; max-width: 320px; min-height: 180px;
}
.pod-col {
  flex: 1; display: flex; flex-direction: column; align-items: center; gap: .4rem;
  opacity: 0; transform: translateY(26px);
}
.pod-col.reveal { animation: podIn .7s cubic-bezier(.2,1.1,.35,1) forwards; }
@keyframes podIn {
  from { opacity: 0; transform: translateY(26px) scale(.9); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.pod-ava {
  width: 2.6rem; height: 2.6rem; border-radius: 50%;
  display: grid; place-items: center;
  color: #fff; font-weight: 800; font-size: 1rem; text-transform: uppercase;
  border: 2px solid var(--th-bd, rgba(255,255,255,.15));
}
.pod-name { font-size: .72rem; font-weight: 700; max-width: 5.5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pod-pts { font-size: .66rem; color: var(--th-sub); font-weight: 600; }
.pod-bar {
  width: 100%; border-radius: .6rem .6rem 0 0;
  display: grid; place-items: center;
  font-weight: 900; font-size: 1.5rem; color: rgba(0,0,0,.35);
}
.pod-col.p1 .pod-bar { height: 86px; background: linear-gradient(180deg, var(--th-acc, #D4B896), color-mix(in srgb, var(--th-acc, #D4B896) 70%, #000)); }
.pod-col.p2 .pod-bar { height: 62px; background: linear-gradient(180deg, #B9B2A4, #8E887C); }
.pod-col.p3 .pod-bar { height: 44px; background: linear-gradient(180deg, #A8795A, #7E5A43); }
.pod-col.p1 .pod-ava { border-color: var(--th-acc, #D4B896); box-shadow: 0 0 22px rgba(212,184,150,.4); }
.pod-col.p1.reveal .pod-crown { animation: crownDrop .6s cubic-bezier(.2,1.4,.4,1) .25s both; }
.pod-crown { font-size: 1.3rem; line-height: 1; }
@keyframes crownDrop {
  from { opacity: 0; transform: translateY(-14px) rotate(-18deg); }
  to   { opacity: 1; transform: translateY(0) rotate(0); }
}
.pod-wait-label {
  text-align: center; font-size: .72rem; color: var(--th-sub);
  letter-spacing: .14em; text-transform: uppercase; font-weight: 700;
  margin-bottom: .6rem; min-height: 1em;
}

/* ─── Confettis ─── */
.cf {
  position: fixed; top: -3vh; z-index: 9300;
  width: 8px; height: 13px; pointer-events: none;
  animation: cfFall var(--d, 2.6s) ease-in var(--dl, 0s) forwards;
  opacity: 0;
}
@keyframes cfFall {
  0%   { opacity: 1; transform: translateY(0) rotate(0) translateX(0); }
  100% { opacity: .1; transform: translateY(110vh) rotate(680deg) translateX(var(--dx, 0px)); }
}

/* ─── Galerie : cellule en cours d'upload ─── */
.lap-ph.uploading img { filter: blur(2px) brightness(.6) saturate(.8); transform: scale(1.04); }
.lap-ph .up-state {
  position: absolute; inset: 0; z-index: 3;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .5rem; color: #fff; font-size: .68rem; font-weight: 700;
}
.up-spin {
  width: 1.8rem; height: 1.8rem; border-radius: 50%;
  border: 3px solid rgba(255,255,255,.25);
  border-top-color: #fff;
  animation: upSpin .8s linear infinite;
}
@keyframes upSpin { to { transform: rotate(360deg); } }
.lap-ph .up-done {
  position: absolute; inset: 0; z-index: 3;
  display: grid; place-items: center;
  background: rgba(95,184,123,.28);
  animation: upDone 1.1s ease forwards;
}
.lap-ph .up-done span {
  width: 2.4rem; height: 2.4rem; border-radius: 50%;
  background: #5FB87B; color: #fff;
  display: grid; place-items: center; font-size: 1.2rem; font-weight: 900;
  animation: okPulse .55s cubic-bezier(.2,1.4,.4,1);
}
@keyframes upDone { 0%, 70% { opacity: 1; } 100% { opacity: 0; } }
.lap-ph.failed { animation: noShake .5s; }
.lap-ph.failed::after {
  content: 'Échec ✕'; position: absolute; inset: 0; z-index: 3;
  display: grid; place-items: center;
  background: rgba(160,40,40,.55); color: #fff;
  font-size: .75rem; font-weight: 800;
}
.lap-ph.just-added { animation: cellPop .6s cubic-bezier(.2,1.2,.4,1); }
@keyframes cellPop {
  from { opacity: 0; transform: scale(.82); }
  to   { opacity: 1; transform: scale(1); }
}


/* Bouton Mettre en live / pause : toujours lisible quel que soit le thème */
#activateLiveBtn {
  background: linear-gradient(135deg, var(--th-acc, #D4B896), color-mix(in srgb, var(--th-acc, #D4B896) 75%, #fff)) !important;
  color: #15130F !important;
  border: none !important;
  font-weight: 800 !important;
}
#activateLiveBtn:disabled { opacity: .45; }


/* ════ PREVIEW STICKY V2 : à droite + suit le scroll ════ */
@media (min-width: 901px) {
  /* sticky exige qu'aucun ancêtre ne clippe */
  .amain, .apnl, .cfg2, .live2 { overflow: visible !important; }
  .cfg2, .live2 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 300px !important;
    gap: 1.8rem !important;
    align-items: start !important;
  }
  .cfg2 > div:nth-child(2),
  .live2 > div:nth-child(2),
  .theme-preview-col {
    position: sticky !important;
    top: 84px !important;
    width: 300px !important;
    max-width: 300px !important;
    justify-self: end !important;
    align-self: start !important;
  }
}


/* ─── Classement final : révélation en cascade + scroll si nombreux ─── */
#fList { max-height: 42vh; overflow-y: auto; padding-right: 4px; }
#fList::-webkit-scrollbar { width: 5px; }
#fList::-webkit-scrollbar-thumb { background: var(--th-bd); border-radius: 10px; }
.grankrow.rank-anim { opacity: 0; transform: translateX(-14px); animation: rankIn .5s cubic-bezier(.2,.9,.3,1) forwards; }
@keyframes rankIn { to { opacity: 1; transform: none; } }