@font-face{font-family:Jost;src:url('/fonts/jost-400.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Jost;src:url('/fonts/jost-600.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Jost;src:url('/fonts/jost-700.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Jost;src:url('/fonts/jost-800.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url('/fonts/poppins-400.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url('/fonts/poppins-600.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url('/fonts/poppins-700.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}

:root{
  --pink:#cc3366;
  --pink-deep:#ad214f;
  --pink-soft:#fff1f5;
  --green:#99cc99;
  --green-deep:#5c9468;
  --green-soft:#f2f8f3;
  --ink:#39464e;
  --muted:#6f777c;
  --paper:#fff;
  --soft:#f7f7f5;
  --line:#e2e5e6;
  --shadow:0 12px 34px rgba(57,70,78,.09);
}

*{box-sizing:border-box}
html{color:var(--ink);background:var(--paper);font-family:Poppins,"Trebuchet MS",sans-serif}
body{margin:0;min-height:100vh;background:#fff}
button,input,select{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
.hidden{display:none!important}
.app-shell{width:min(100%,760px);margin:0 auto;padding:0 18px 118px}

.brand-header{display:flex;min-height:92px;align-items:center;justify-content:space-between;gap:18px;margin:0 -18px 34px;padding:12px 24px;border-bottom:1px solid #edf0f1;background:#fff}
.brand{display:flex;align-items:center;text-decoration:none}
.brand-logo{display:block;width:91px;height:auto}
.header-actions{display:flex;align-items:center;gap:18px}
.program-label{color:var(--pink);font-family:Jost,sans-serif;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.admin-link{color:var(--ink);font-size:11px;font-weight:600;text-decoration:underline;text-underline-offset:4px}

h1,h2,h3{font-family:Jost,"Trebuchet MS",sans-serif;color:var(--ink)}
.welcome-card{overflow:hidden;border-top:16px solid var(--pink);border-radius:4px;background:#fff;box-shadow:var(--shadow);animation:rise .5s ease both}
.welcome-copy{padding:34px 24px 31px}
.welcome-card h1,.screen>h1{max-width:650px;margin:10px 0 22px;font-size:clamp(40px,11vw,61px);font-weight:600;line-height:1;letter-spacing:-.025em;text-transform:uppercase}
.welcome-card h1 span{display:inline}
.accent-pink{color:var(--pink)}
.accent-green{color:var(--green)}
.welcome-copy>p:not(.eyebrow){max-width:580px;margin:0 0 27px;color:var(--muted);font-size:15px;line-height:1.7}
.eyebrow{margin:0 0 8px;color:var(--pink);font-family:Jost,sans-serif;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.welcome-actions{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:10px}

.button{min-height:50px;border:2px solid transparent;border-radius:5px;padding:12px 18px;font-family:Poppins,sans-serif;font-size:13px;font-weight:700;text-align:center;text-decoration:none;transition:transform .18s ease,background .18s ease,color .18s ease}
.button:hover{transform:translateY(-1px)}
.button-primary{border-color:var(--pink);color:#fff;background:var(--pink)}
.button-primary:hover{border-color:var(--pink-deep);background:var(--pink-deep)}
.button-secondary{border-color:var(--ink);color:var(--ink);background:#fff}
.button-secondary:hover{color:#fff;background:var(--ink)}
.button-quiet{border-color:var(--line);color:var(--ink);background:#fff}
.button.disabled{pointer-events:none;opacity:.5}

.registration-panel{margin:0;padding:32px 24px 38px;border-top:1px solid var(--line);background:var(--green-soft)}
.registration-panel h2{margin:4px 0 9px;font-size:29px;font-weight:600;line-height:1.12;text-transform:uppercase}
.form-stack{display:grid;gap:19px}
.form-intro,.privacy-hint{margin:0;color:var(--muted);font-size:12px;line-height:1.65}
.privacy-hint a{color:var(--ink);font-weight:600;text-underline-offset:3px}
.form-grid{display:grid;gap:14px}
label{display:grid;gap:7px;color:var(--ink);font-size:12px;font-weight:600}
label small{color:var(--muted);font-weight:400}
input,select{width:100%;min-height:48px;border:1px solid #cfd5d7;border-radius:4px;padding:11px 13px;color:var(--ink);background:#fff;outline:none}
input:focus,select:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(204,51,102,.12)}
.birth-date-field input{font-size:18px;font-weight:600;letter-spacing:.04em}
.birth-date-field small{margin-top:-2px;color:var(--muted);font-size:11px;font-weight:400}
.consent-box{display:grid;gap:11px;margin:0;border:0;border-left:6px solid var(--green);border-radius:0 4px 4px 0;padding:18px;background:#fff}
.consent-box legend{padding:0 0 8px;color:var(--ink);font-family:Jost,sans-serif;font-size:17px;font-weight:700}
.check{display:flex;grid-template:none;align-items:flex-start;gap:10px;font-weight:400;line-height:1.45}
.check input{flex:0 0 auto;width:19px;min-height:19px;margin:1px 0 0;accent-color:var(--pink)}
.message{min-height:18px;margin:0;padding:0 24px 17px;color:var(--pink-deep);font-size:12px;font-weight:600}

.screen{display:none;animation:rise .35s ease both}
.screen.active{display:block}
.hello{margin:2px 0 0;color:var(--pink);font-family:Jost,sans-serif;font-size:18px;font-weight:600}
.screen-intro{margin:4px 0 27px;color:var(--muted);font-size:14px;line-height:1.6}
.wallet-hero{position:relative;overflow:hidden;display:grid;gap:5px;margin:0;padding:27px 24px 28px;border-top:16px solid var(--green);border-radius:4px;color:var(--ink);background:var(--green-soft);box-shadow:var(--shadow)}
.wallet-hero>span{font-family:Jost,sans-serif;font-size:18px;font-weight:600;text-transform:uppercase}
.wallet-hero strong{color:var(--pink);font-family:Jost,sans-serif;font-size:clamp(52px,16vw,76px);font-weight:700;line-height:1}
.wallet-hero small{color:var(--muted);font-size:11px}
.last-earned{width:max-content;max-width:100%;margin:12px 0 0;padding:8px 11px;border-radius:4px;color:#fff;background:var(--green-deep);font-size:11px;font-weight:700}
.loyalty-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;margin-top:22px;padding:24px;border-top:16px solid var(--pink);border-radius:4px;background:linear-gradient(135deg,#fff 0%,var(--pink-soft) 100%);box-shadow:var(--shadow)}
.loyalty-card h2{margin:4px 0 8px;font-size:29px;font-weight:650;text-transform:uppercase}
.loyalty-card-copy>p:not(.eyebrow){max-width:410px;margin:0 0 8px;color:var(--ink);font-size:13px;line-height:1.55}
.loyalty-card-copy small{color:var(--muted);font-size:10px;line-height:1.45}
.loyalty-qr-wrap{display:grid;place-items:center;gap:7px;padding:12px;border:1px solid var(--line);border-radius:4px;background:#fff}
.loyalty-qr{width:164px;height:164px}
.loyalty-qr svg{display:block;width:100%;height:100%}
.loyalty-card-code{color:var(--muted);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.content-section{margin-top:42px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:17px}
.section-heading h2{margin:0;font-size:28px;font-weight:600;text-transform:uppercase}
.card-list{display:grid;gap:13px}
.benefit-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:19px;border:1px solid var(--line);border-radius:4px;background:#fff}
.benefit-card>div{display:grid;gap:3px}
.benefit-card .tag{width:max-content;margin-bottom:5px;padding:4px 8px;border-radius:3px;color:#fff;background:var(--pink);font-size:9px;font-weight:700;text-transform:uppercase}
.benefit-card h3{margin:0;font-size:19px;font-weight:600}
.benefit-card p{margin:0;color:var(--muted);font-size:11px}
.benefit-card strong{color:var(--pink);font-family:Jost,sans-serif;font-size:25px;white-space:nowrap}
.benefit-card.muted{opacity:.58}
.review-card{position:relative;display:grid;gap:22px;overflow:hidden;margin-top:34px;padding:26px;border-top:16px solid var(--pink);border-radius:4px;background:linear-gradient(135deg,#fff 0%,var(--pink-soft) 58%,var(--green-soft) 100%);box-shadow:0 16px 34px rgba(57,70,78,.12)}
.review-card::after{content:"";position:absolute;right:-52px;bottom:-76px;width:170px;height:170px;border:28px solid rgba(204,51,102,.08);border-radius:50%;pointer-events:none}
.review-card>div,.review-card .button{position:relative;z-index:1}
.review-stars{display:flex;gap:5px;margin-bottom:12px;color:var(--pink);font-size:24px;line-height:1}
.review-stars span{animation:star-pop .45s both}
.review-stars span:nth-child(2){animation-delay:.07s}.review-stars span:nth-child(3){animation-delay:.14s}.review-stars span:nth-child(4){animation-delay:.21s}.review-stars span:nth-child(5){animation-delay:.28s}
.review-card .eyebrow{color:var(--pink)}
.review-card h2{max-width:520px;margin:4px 0 8px;font-size:29px;font-weight:650;line-height:1.08;text-transform:uppercase}
.review-card p:not(.eyebrow){max-width:540px;margin:0;color:var(--anthracite);font-size:13px;line-height:1.55}
.review-card .review-time{margin-top:8px;font-weight:650}
.review-card .button{align-self:center;min-height:54px;background:var(--pink);color:#fff;box-shadow:0 10px 20px rgba(204,51,102,.22)}

.benefits-wallet{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:24px 0 38px;padding:22px;border-top:16px solid var(--green);border-radius:4px;background:var(--green-soft)}
.benefits-wallet div{display:grid;gap:4px}
.benefits-wallet span{font-family:Jost,sans-serif;font-size:17px;font-weight:600;text-transform:uppercase}
.benefits-wallet small{color:var(--muted)}
.benefits-wallet strong{color:var(--pink);font-family:Jost,sans-serif;font-size:30px;white-space:nowrap}
.timeline{display:grid;gap:11px;margin-top:25px}
.purchase-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:19px;border:1px solid var(--line);border-radius:4px;background:#fff}
.purchase-main{display:grid;gap:4px}
.purchase-date{color:var(--pink);font-size:10px;font-weight:700;text-transform:uppercase}
.purchase-place{font-size:15px}
.purchase-wallet{color:var(--green-deep);font-size:11px;font-weight:700}
.purchase-total{font-family:Jost,sans-serif;font-size:20px;white-space:nowrap}
.profile-card{margin-top:24px;padding:23px;border-top:16px solid var(--green);border-radius:4px;background:var(--green-soft)}
.privacy-card{margin-top:18px;padding:23px;border-top:16px solid var(--pink);border-radius:4px;background:var(--pink-soft)}
.privacy-card h2{margin:0;font-size:25px;font-weight:600;text-transform:uppercase}
.privacy-card>p{color:var(--muted);font-size:12px;line-height:1.65}
.privacy-actions{display:flex;flex-wrap:wrap;gap:15px}
.text-button{border:0;padding:0;color:var(--ink);background:transparent;font-size:12px;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.text-button.danger{color:var(--pink-deep)}
.empty{padding:20px;color:var(--muted);border:1px dashed #cbd1d3;border-radius:4px;background:#fff}

.bottom-nav{position:fixed;z-index:10;left:50%;bottom:max(10px,env(safe-area-inset-bottom));transform:translateX(-50%);display:grid;grid-template-columns:repeat(4,1fr);width:min(calc(100% - 18px),650px);padding:6px;border:1px solid var(--line);border-radius:6px;background:rgba(255,255,255,.97);box-shadow:0 12px 35px rgba(57,70,78,.16);backdrop-filter:blur(14px)}
.bottom-nav button{display:grid;place-items:center;gap:3px;min-height:57px;border:0;border-radius:4px;padding:4px 2px;color:#727b80;background:transparent;font-size:9px;font-weight:600}
.bottom-nav span{font-size:19px;line-height:1}
.bottom-nav button.active{color:#fff;background:var(--pink)}

@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes star-pop{from{opacity:0;transform:translateY(6px) scale(.7)}to{opacity:1;transform:none}}
@media(min-width:620px){
  .app-shell{padding:0 24px 125px}
  .brand-header{margin-inline:-24px;padding-inline:30px}
  .welcome-copy{padding:52px}
  .registration-panel{padding:40px 52px 48px}
  .form-grid{grid-template-columns:1fr 1fr}
  .review-card{grid-template-columns:1fr 225px;align-items:center}
}
@media(max-width:520px){
  .app-shell{padding-inline:15px}
  .brand-header{min-height:82px;margin-inline:-15px;margin-bottom:24px;padding:9px 18px}
  .brand-logo{width:78px}
  .program-label{font-size:10px}
  .admin-link{display:none}
  .welcome-actions{grid-template-columns:1fr}
  .review-card{padding:23px 20px}
  .review-card h2{font-size:25px}
  .review-card .button{width:100%}
  .welcome-card h1,.screen>h1{font-size:40px}
  .wallet-hero strong{font-size:56px}
  .benefit-card{align-items:flex-start}
  .benefit-card strong{font-size:21px}
  .benefits-wallet{align-items:flex-start;flex-direction:column}
  .loyalty-card{grid-template-columns:1fr;text-align:center}
  .loyalty-card-copy>p:not(.eyebrow){margin-inline:auto}
  .loyalty-qr-wrap{justify-self:center}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Corrections visuelles validees par Benoit - 2026-09-11 */
.hello {
  color: #000000;
}

.last-earned {
  background: #99cc99;
  color: #ffffff;
}

.purchase-wallet {
  color: #99cc99;
  font-weight: 700;
}

.google-review-title {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.google-review-title .google-g-logo {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
}

.review-rating-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.review-stars span {
  color: #fbbc04;
  opacity: 1;
}

.review-count {
  color: #39464e;
  font-weight: 700;
}

.review-card #review-link {
  background: #4285f4;
  border: 1px solid #4285f4;
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(66, 133, 244, 0.22);
}

.registration-privacy-notice {
  margin: 1rem 0;
  color: #39464e;
  font-size: 0.88rem;
  line-height: 1.5;
}

.registration-notification-step {
  padding: 1.5rem 0 0.5rem;
  text-align: center;
}

.registration-notification-step h2 {
  margin: 0.75rem 0;
  color: #39464e;
}

.registration-notification-step p {
  margin: 0 auto 1.25rem;
  max-width: 32rem;
}

.registration-notification-step .button {
  width: 100%;
}

.registration-notification-step .registration-skip {
  display:block;
  margin:14px auto 0;
  color:var(--muted);
}

.registration-step-number {
  color: #cc3366;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#export-data[hidden] {
  display: none !important;
}

.brand-logo {
  width: 108px;
  height: auto;
}

@media (max-width: 640px) {
  .brand-logo {
    width: 92px;
    height: auto;
  }

  .google-review-title {
    align-items: flex-start;
  }

  .google-review-title .google-g-logo {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
  }
}

/* Mode caisse CCU */
.cashier-body{min-height:100vh;background:linear-gradient(145deg,var(--green-soft),#fff 52%,var(--pink-soft))}
.cashier-shell{width:min(100% - 28px,720px);margin:0 auto;padding:22px 0 52px}
.cashier-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.cashier-header .brand-logo{width:118px}
.cashier-kicker{margin:0;color:var(--pink);font-family:Jost,sans-serif;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.cashier-panel{padding:26px;border-top:16px solid var(--pink);border-radius:4px;background:#fff;box-shadow:var(--shadow)}
.cashier-panel h1{margin:4px 0 8px;font-size:clamp(34px,7vw,52px);line-height:1;text-transform:uppercase}
.cashier-lead{margin:0 0 24px;color:var(--muted);line-height:1.55}
.cashier-settings{display:grid;grid-template-columns:1fr 1fr auto;align-items:end;gap:12px;margin-bottom:24px;padding:18px;border-left:6px solid var(--green);background:var(--green-soft)}
.cashier-settings .button{min-height:48px}
.cashier-scan-form{display:grid;gap:10px}
.cashier-scan-input{min-height:64px;border:2px solid var(--ink);font-size:18px;text-align:center}
.cashier-status{display:grid;place-items:center;min-height:245px;margin-top:22px;padding:28px;border:2px dashed var(--line);border-radius:4px;text-align:center;background:var(--soft)}
.cashier-status.success{border:0;border-top:16px solid var(--green);color:#fff;background:var(--green)}
.cashier-status.matched{border:0;border-top:16px solid var(--pink);color:#fff;background:var(--pink)}
.cashier-status.error{border-color:var(--pink);color:var(--pink-deep);background:var(--pink-soft)}
.cashier-status h2{margin:0 0 6px;color:inherit;font-size:34px;text-transform:uppercase}
.cashier-status p{margin:0;line-height:1.5}
.cashier-actions{display:flex;justify-content:center;margin-top:16px}
@media(max-width:620px){.cashier-settings{grid-template-columns:1fr}.cashier-panel{padding:21px}.cashier-status{min-height:210px}}
.bottom-nav {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

#screen-second-life textarea,
#screen-second-life select {
  width: 100%;
}