/* Colorivinette Espace Client — the protected daily content stays the priority. */
.customer-page main{padding-top:28px}
.portal-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:30px}
.customer-page h1{font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:1.06;margin:4px 0 14px;max-width:760px}
.customer-page h1 .hl{color:var(--violet)}
.welcome{font-size:1.08rem;color:var(--ink-soft);margin:0}
/* Once signed in, the heading shrinks so the card of the day comes first. */
main[data-state=active] .portal-heading{margin-bottom:18px}
main[data-state=active] .portal-heading h1{font-size:clamp(1.5rem,2.6vw,2rem)}
main[data-state=active] .welcome{display:none}

.login-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:36px;align-items:center;padding:34px;max-width:1040px;margin-inline:auto}
.login-card h2{margin-top:4px}
.login-card form button{width:100%;margin:10px 0 18px}
.login-card #recovery-link{display:block;text-align:center;font-weight:750}
.login-card #code{font-family:ui-monospace,"Cascadia Mono",Consolas,monospace;font-size:1.08rem;letter-spacing:.03em}
.login-visual{position:relative}
.login-visual img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 75%;border-radius:26px}
.login-visual::before{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:var(--sun);top:-18px;right:-14px;z-index:-1}
.login-visual-note{position:absolute;left:14px;top:14px;margin:0;background:var(--paper);border-radius:999px;padding:8px 16px;font-weight:800;font-size:.9rem;display:flex;align-items:center;gap:8px;box-shadow:0 10px 24px rgba(27,42,92,.15)}
.dot{width:12px;height:12px;border-radius:50%;flex:none}.dot-pink{background:var(--pink)}

.subscription-card{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 30px;background:var(--mint);border-radius:var(--radius);border:1px solid #bfe6d8}
.subscription-card h2{margin:4px 0 8px;font-size:1.5rem}
.subscription-card p{margin:0}
.subscription-card .end-date{max-width:360px;text-align:right}
.subscription-status{display:inline-flex;gap:8px;align-items:center;background:#fff;padding:5px 14px;border-radius:999px;font-size:.9rem;font-weight:850;color:var(--success)}
.subscription-status::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--teal)}
.day-heading{font-size:.95rem;font-weight:750;color:var(--ink-soft);margin:26px 0 14px}
.daily-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:24px;align-items:start}
.reading-stack{display:grid;gap:24px}
.daily-grid .card{padding:30px;border-radius:var(--radius);overflow-wrap:anywhere}
.daily-grid h2{font-size:1.7rem;margin:8px 0 18px}
.card-kicker{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;font-weight:850;margin:0;color:var(--ink-soft);display:flex;align-items:center;gap:10px}
.kicker-num{display:inline-grid;place-items:center;min-width:34px;height:34px;border-radius:12px;color:#fff;font-size:.85rem;letter-spacing:0}
.coloring-card .kicker-num{background:var(--violet)}.riddle-card .kicker-num{background:#a65200}.yesterday-card .kicker-num{background:#0a7363}
.coloring-card{border-top:6px solid var(--violet)}
.riddle-card{background:var(--peach);border-color:#f5d2b8}
.yesterday-card{background:var(--lavender);border-color:#d9cffb}
.riddle-question{font-size:1.4rem;font-weight:800;line-height:1.5;white-space:pre-wrap}
.riddle-note{font-size:.95rem;border-top:2px dashed #e9bf9c;padding-top:16px;margin:22px 0 0;color:#6a4a33}
.content-date{font-size:.88rem;color:var(--ink-soft);font-weight:700;margin:0 0 10px}
.coloring-title{font-size:1.05rem;font-weight:800;margin:0}
.preview-shell{background:#f6f3ec;border-radius:22px;padding:16px;margin:16px 0 18px;min-height:160px;display:grid;place-items:center;gap:12px}
.customer-page .coloring-preview{max-height:440px;max-width:100%;width:auto;object-fit:contain;margin:0 auto;border-radius:12px;box-shadow:0 8px 24px rgba(27,42,92,.10)}
.preview-fallback{margin:0;text-align:center;padding:30px 10px;font-size:.95rem}
.download-button{width:100%;min-height:54px;font-size:1.05rem}
.download-feedback{font-size:.92rem;font-weight:700;min-height:1.5em;margin:10px 0 0}
.print-note{font-size:.88rem;color:var(--ink-soft);margin:6px 0 0}
.yesterday-question{white-space:pre-wrap;margin-bottom:14px}
.yesterday-solution{font-size:1.2rem;font-weight:800;white-space:pre-wrap;background:#fff;border-radius:16px;padding:14px 16px;margin:0}
.solution-label{display:block;font-size:.78rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em;color:#0a6a5b;margin-bottom:4px}
.portal-session{display:flex;gap:20px;align-items:center;justify-content:space-between;margin-top:26px;font-size:.92rem;color:var(--ink-soft)}
.portal-notice{padding:26px 30px;background:var(--butter);border:2px solid #f0d27a;border-radius:24px;margin-bottom:26px;overflow-wrap:anywhere}
.portal-notice h2{font-size:1.45rem;margin:0 0 8px}
.portal-notice p{margin:8px 0}
.portal-notice .actions:empty{display:none}
main[data-state=invalid] .portal-notice,main[data-state=revoked] .portal-notice{background:#fff0eb;border-color:#efb4a3}
.portal-feedback{min-height:1.5em;font-size:.95rem;font-weight:750;color:var(--success);margin:18px 0}
.help-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:42px;padding:32px;border:1px solid var(--line);border-radius:var(--radius);margin-top:44px;background:var(--paper)}
.help-card h2{font-size:1.5rem;margin:6px 0 12px}
.help-card p{font-size:.95rem}
.help-details details{border-bottom:1px solid var(--line-strong);padding:16px 0}
.help-details summary{font-weight:800;cursor:pointer;min-height:28px}
.help-details form button{margin-top:14px}
#contact-note:focus{outline:3px solid var(--focus);outline-offset:3px}
@media(max-width:900px){.daily-grid{gap:20px}.daily-grid .card{padding:24px}.help-card{gap:26px}.login-card{gap:24px;padding:28px}}
@media(max-width:700px){
  .customer-page main{padding-top:20px}
  .portal-heading{margin-bottom:22px}
  .welcome{font-size:1rem}
  .daily-grid,.help-card,.login-card{grid-template-columns:minmax(0,1fr)}
  .login-visual img{aspect-ratio:16/9}
  .login-visual::before{display:none}
  .subscription-card{flex-direction:column;align-items:flex-start;gap:14px;padding:22px}
  .subscription-card .end-date{text-align:left}
  .daily-grid .card{padding:22px}
  .daily-grid h2{font-size:1.45rem}
  .portal-session{align-items:flex-start;flex-direction:column;gap:12px}
  .help-card{padding:22px;gap:8px}
  .login-card{padding:22px}
  .portal-notice{padding:22px}
  .day-heading{margin-top:22px}
  .riddle-question{font-size:1.22rem}
}
@media(prefers-reduced-motion:reduce){.customer-page *, .customer-page *::before, .customer-page *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
