:root {
  --ink: #211b32;
  --muted: #6f687e;
  --paper: #fbfaf7;
  --white: #ffffff;
  --purple: #6c4cf1;
  --purple-dark: #5232d0;
  --purple-soft: #eee9ff;
  --coral: #ff7959;
  --coral-soft: #fff0e9;
  --mint: #6fd5b0;
  --mint-soft: #e9faf4;
  --yellow: #ffdc71;
  --line: #e8e3ef;
  --danger: #c63c54;
  --shadow: 0 20px 60px rgba(49, 35, 82, .1);
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; overflow-x: hidden; background: var(--paper); color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.55; }
body::before { content: ""; position: fixed; inset: 0; z-index: -2; background-image: radial-gradient(rgba(108, 76, 241, .08) .8px, transparent .8px); background-size: 24px 24px; mask-image: linear-gradient(to bottom, #000, transparent 75%); }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
main { min-height: calc(100vh - 190px); }
.shell { width: min(1160px, calc(100% - 40px)); margin-inline: auto; }
.narrow-shell { width: min(960px, calc(100% - 40px)); }
.ambient { position: fixed; z-index: -1; width: 420px; height: 420px; border-radius: 50%; filter: blur(2px); opacity: .55; pointer-events: none; }
.ambient-one { right: -250px; top: 110px; background: radial-gradient(circle, #e4dcff, transparent 68%); }
.ambient-two { left: -280px; top: 620px; background: radial-gradient(circle, #dff8ef, transparent 68%); }

.site-header { width: min(1240px, calc(100% - 40px)); height: 86px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 25px; font-weight: 850; letter-spacing: -.8px; }
.brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; background: var(--purple); color: #fff2a7; font-size: 21px; box-shadow: 0 8px 18px rgba(108, 76, 241, .2); }
.nav { display: flex; align-items: center; gap: 28px; font-size: 14px; font-weight: 700; }
.nav a:not(.button), .nav-button { transition: color .2s; }
.nav a:not(.button):hover, .nav-button:hover { color: var(--purple); }
.nav form { margin: 0; }
.nav-button { border: 0; background: none; cursor: pointer; padding: 0; }

.button { display: inline-flex; align-items: center; justify-content: center; gap: 16px; min-height: 52px; padding: 0 24px; border: 0; border-radius: 15px; background: var(--purple); color: white; font-weight: 800; cursor: pointer; box-shadow: 0 12px 25px rgba(108, 76, 241, .22); transition: transform .2s, background .2s, box-shadow .2s; }
.button:hover { transform: translateY(-2px); background: var(--purple-dark); box-shadow: 0 16px 30px rgba(108, 76, 241, .28); }
.button-small { min-height: 42px; padding: 0 17px; border-radius: 12px; }
.button-light { background: white; color: var(--purple-dark); box-shadow: 0 12px 25px rgba(25, 15, 60, .18); }
.button-light:hover { background: #fff8dd; }
.button-soft { border: 1px solid var(--line); background: var(--purple-soft); color: var(--purple); box-shadow: none; }
.button-soft:hover { background: var(--purple); color: #fff; box-shadow: 0 12px 25px rgba(108,76,241,.18); }
.button-full { width: 100%; }
.text-link { display: inline-flex; align-items: center; gap: 10px; color: var(--purple); font-weight: 800; }
.back-link { display: inline-flex; margin-bottom: 24px; color: var(--muted); font-size: 14px; font-weight: 750; }
.back-link:hover { color: var(--purple); }

.hero { min-height: 610px; padding: 72px 0 86px; display: grid; grid-template-columns: 1.05fr .95fr; gap: 40px; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--purple); font-size: 12px; font-weight: 850; letter-spacing: 1.2px; text-transform: uppercase; }
.eyebrow.light { color: #dcd4ff; }
.hero h1 { max-width: 700px; margin: 18px 0 22px; font-size: clamp(47px, 6vw, 76px); line-height: .98; letter-spacing: -4.5px; }
.hero h1 em { color: var(--purple); font-style: normal; }
.hero-lead { max-width: 590px; margin: 0; color: var(--muted); font-size: 18px; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 32px; }
.trust-row { display: flex; gap: 23px; margin-top: 28px; color: var(--muted); font-size: 13px; font-weight: 650; }
.trust-row b { color: #18976e; }
.hero-art { position: relative; height: 460px; }
.gift-card { position: absolute; display: flex; flex-direction: column; border-radius: 28px; box-shadow: 0 28px 60px rgba(44, 30, 81, .18); }
.gift-front { left: 50%; top: 50%; z-index: 3; width: 300px; height: 360px; padding: 35px 28px; transform: translate(-48%, -49%) rotate(3deg); align-items: center; background: #fff; border: 1px solid #ede8f4; text-align: center; }
.gift-front::before { content: ""; position: absolute; inset: 10px; border: 2px dashed #e8e1f5; border-radius: 21px; }
.gift-front > * { position: relative; z-index: 1; }
.gift-front .mini-label { margin-bottom: 27px; color: var(--purple); font-size: 11px; font-weight: 850; letter-spacing: 1px; text-transform: uppercase; }
.gift-front .avatar { display: grid; place-items: center; width: 86px; height: 86px; margin-bottom: 18px; border-radius: 50%; background: var(--coral-soft); color: var(--coral); font-size: 32px; font-weight: 900; border: 7px solid #fff; box-shadow: 0 0 0 2px var(--coral); }
.gift-front strong { font-size: 24px; }
.gift-front small { max-width: 190px; margin-top: 9px; color: var(--muted); }
.gift-front i { margin-top: auto; font-size: 37px; font-style: normal; }
.gift-back { left: 6%; top: 19%; width: 205px; height: 245px; padding: 28px; transform: rotate(-11deg); background: var(--mint); color: #174e40; }
.gift-back > span { margin-bottom: auto; font-size: 42px; }
.gift-back small { font-weight: 700; opacity: .75; }
.gift-back strong { font-size: 30px; }
.orbit { position: absolute; border: 2px dashed rgba(108, 76, 241, .16); border-radius: 50%; }
.orbit-one { inset: 13px 20px 20px 40px; transform: rotate(-18deg); }
.orbit-two { inset: 55px -20px 50px 80px; transform: rotate(21deg); }
.spark { position: absolute; z-index: 5; color: var(--yellow); font-size: 29px; }
.spark-a { right: 10%; top: 13%; }.spark-b { left: 18%; bottom: 10%; color: var(--coral); }.spark-c { right: 5%; bottom: 25%; color: var(--mint); font-size: 18px; }

.section { padding: 88px 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 35px; margin-bottom: 38px; }
.section-heading h2 { margin: 8px 0 0; font-size: clamp(34px, 4vw, 50px); line-height: 1.05; letter-spacing: -2px; }
.section-heading > p { max-width: 400px; margin: 0; color: var(--muted); }
.section-heading.compact { margin-bottom: 45px; }
.tool-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.tool-card { position: relative; min-height: 330px; padding: 30px; border-radius: var(--radius); background: #fff; border: 1px solid var(--line); box-shadow: 0 12px 35px rgba(50, 38, 78, .05); transition: transform .25s, box-shadow .25s; }
.tool-card.featured:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.tool-card h3 { margin: 30px 0 10px; font-size: 26px; }
.tool-card p { margin: 0; color: var(--muted); line-height: 1.7; }
.tool-card > a { position: absolute; bottom: 28px; color: var(--purple); font-weight: 850; }
.tool-card > a span { margin-left: 8px; }
.tool-card.muted { opacity: .7; box-shadow: none; }
.tool-icon { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 17px; font-size: 29px; }
.tool-icon.coral { background: var(--coral-soft); }.tool-icon.mint { background: var(--mint-soft); }.tool-icon.lilac { background: var(--purple-soft); }
.pill { display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 99px; background: #f1eff4; color: var(--muted); font-size: 10px; font-weight: 850; letter-spacing: .7px; text-transform: uppercase; }
.tool-card .pill { position: absolute; right: 25px; top: 25px; }
.pill-live { background: #e4f8f0; color: #167859; }

.steps-section { padding-top: 50px; }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 35px; }
.steps article { position: relative; padding: 12px 18px; }
.steps article > span { position: absolute; right: 20px; top: 0; color: #e7e1f1; font-size: 44px; font-weight: 900; }
.step-icon { display: grid; place-items: center; width: 66px; height: 66px; border-radius: 20px; background: var(--purple-soft); font-size: 30px; transform: rotate(-3deg); }
.steps article:nth-child(2) .step-icon { background: var(--coral-soft); transform: rotate(3deg); }.steps article:nth-child(3) .step-icon { background: var(--mint-soft); }
.steps h3 { margin: 24px 0 8px; font-size: 21px; }.steps p { margin: 0; color: var(--muted); }
.cta { margin-top: 60px; margin-bottom: 90px; min-height: 250px; padding: 48px 58px; border-radius: 30px; display: flex; align-items: center; justify-content: space-between; gap: 30px; background: var(--purple); color: white; overflow: hidden; position: relative; }
.cta::after { content: "✦"; position: absolute; right: 25%; top: -90px; color: rgba(255,255,255,.08); font-size: 260px; }
.cta h2 { margin: 8px 0; font-size: 42px; letter-spacing: -1.7px; }.cta p { margin: 0; color: #dcd4ff; }.cta > * { position: relative; z-index: 1; }

.site-footer { min-height: 160px; padding: 38px max(20px, calc((100% - 1160px) / 2)); display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 5px 30px; border-top: 1px solid var(--line); background: rgba(255,255,255,.5); }
.brand-footer { grid-row: 1 / 3; }.site-footer p { margin: 0; text-align: right; color: var(--muted); font-size: 14px; }.footer-note { font-size: 12px !important; }

.flash-stack { position: fixed; z-index: 20; top: 95px; right: 24px; width: min(410px, calc(100% - 48px)); display: grid; gap: 10px; }
.flash { padding: 15px 18px; border-radius: 14px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); font-size: 14px; font-weight: 700; animation: slide-in .35s ease-out; }
.flash-success { border-left: 5px solid #2cb789; }.flash-warning { border-left: 5px solid #eda92f; }.flash-error { border-left: 5px solid var(--danger); }.flash-info { border-left: 5px solid var(--purple); }
@keyframes slide-in { from { opacity: 0; transform: translateX(20px); } }

.auth-shell { min-height: calc(100vh - 210px); margin-top: 30px; margin-bottom: 70px; display: grid; grid-template-columns: .9fr 1.1fr; border: 1px solid var(--line); border-radius: 30px; background: #fff; overflow: hidden; box-shadow: var(--shadow); }
.auth-panel { padding: clamp(35px, 6vw, 75px); }
.auth-visual { display: flex; flex-direction: column; justify-content: center; background: var(--purple); color: #fff; position: relative; overflow: hidden; }
.auth-visual::after { content: "✦"; position: absolute; right: -80px; bottom: -150px; font-size: 340px; color: rgba(255,255,255,.07); }
.register-visual { background: #2b7e68; }.auth-visual h1 { margin: 18px 0; font-size: clamp(40px, 5vw, 62px); line-height: 1.02; letter-spacing: -3px; }.auth-visual > p { color: #ded8f7; font-size: 17px; }.register-visual > p { color: #d8f3eb; }
.auth-bubble { position: relative; z-index: 1; margin-top: 45px; display: flex; gap: 14px; padding: 17px; border-radius: 15px; background: rgba(255,255,255,.12); font-size: 23px; }.auth-bubble span { font-size: 13px; font-weight: 750; align-self: center; }
.auth-form-panel { max-width: 650px; width: 100%; margin: auto; }.auth-form-panel h2 { margin: 35px 0 2px; font-size: 38px; letter-spacing: -1.5px; }.muted-text { color: var(--muted); margin: 0 0 28px; }
.form-stack { display: grid; gap: 17px; }.form-stack label, .form-grid label { display: grid; gap: 7px; font-size: 13px; font-weight: 800; }.form-stack label small, .form-grid label small { color: var(--muted); font-weight: 500; }
input, textarea, select { width: 100%; border: 1px solid #ddd7e6; border-radius: 12px; background: #fdfcfe; color: var(--ink); outline: none; transition: border .2s, box-shadow .2s, background .2s; }
input, select { height: 49px; padding: 0 14px; } textarea { padding: 12px 14px; resize: vertical; }
input:focus, textarea:focus, select:focus { border-color: var(--purple); background: #fff; box-shadow: 0 0 0 4px rgba(108, 76, 241, .11); }
.auth-switch { margin: 24px 0 0; text-align: center; color: var(--muted); font-size: 14px; }.auth-switch a { color: var(--purple); font-weight: 800; }
.form-error { margin: 18px 0; padding: 14px 16px; border-radius: 12px; background: #fff0f2; border: 1px solid #ffd0d8; color: #9e2940; font-size: 14px; font-weight: 700; }

.page-shell { padding-top: 54px; padding-bottom: 100px; }.page-header { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-bottom: 42px; }.page-header h1 { margin: 8px 0 5px; font-size: clamp(40px, 5vw, 58px); line-height: 1; letter-spacing: -2.7px; }.page-header p { margin: 0; color: var(--muted); }.wave { display: inline-block; transform: rotate(-10deg); font-size: .8em; }
.page-header-actions { display: flex; align-items: center; gap: 12px; }
.empty-state { max-width: 630px; margin: 40px auto; padding: 60px 35px; border: 1px solid var(--line); border-radius: 25px; background: #fff; text-align: center; box-shadow: 0 12px 35px rgba(50,38,78,.05); }.empty-icon { font-size: 52px; }.empty-state h1, .empty-state h2 { margin: 15px 0 8px; font-size: 31px; }.empty-state p { margin: 0 auto 25px; color: var(--muted); }
.event-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }.event-card { display: block; padding: 25px; border: 1px solid var(--line); border-radius: 21px; background: #fff; box-shadow: 0 10px 30px rgba(50,38,78,.05); transition: transform .2s, box-shadow .2s; }.event-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }.event-card-top, .event-meta { display: flex; justify-content: space-between; align-items: center; }.event-emoji { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--coral-soft); font-size: 23px; }.event-card h2 { margin: 22px 0 3px; font-size: 23px; }.event-card > p { margin: 0; color: var(--muted); font-size: 14px; }.event-progress { height: 7px; margin: 25px 0 12px; border-radius: 99px; background: #efedf2; overflow: hidden; }.event-progress div { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--purple), #9b85f9); }.event-meta { color: var(--muted); font-size: 12px; font-weight: 700; }.event-meta b { color: var(--purple); }

.create-header { align-items: flex-end; }.progress-dots { display: flex; gap: 8px; }.progress-dots b, .progress-dots span { width: 42px; height: 6px; border-radius: 99px; background: #ded9e6; }.progress-dots b { background: var(--purple); }.event-form { display: grid; gap: 22px; }.form-card { padding: 31px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 10px 30px rgba(50,38,78,.04); }.soft-card { background: #f8f6fd; box-shadow: none; }.form-card-heading { display: flex; gap: 15px; align-items: flex-start; margin-bottom: 27px; }.form-card-heading h2 { margin: 0; font-size: 23px; }.form-card-heading p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }.number-badge { flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: var(--purple-soft); color: var(--purple); font-weight: 900; }.mint-badge { background: var(--mint-soft); color: #218264; }.coral-badge { background: var(--coral-soft); color: #d65235; }.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }.span-two { grid-column: span 2; }
.participant-list { display: grid; gap: 11px; }.participant-row { display: grid; grid-template-columns: 36px 1fr 1.35fr 38px; gap: 11px; align-items: end; }.participant-row label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 800; }.participant-number { align-self: center; display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; background: var(--mint-soft); color: #23795f; font-size: 12px; font-weight: 900; }.icon-button { display: inline-grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--muted); cursor: pointer; font-size: 20px; transition: color .2s, border .2s; }.participant-row .icon-button { margin-bottom: 5px; }.icon-button:hover { color: var(--danger); border-color: #f3a5b2; }.icon-button:disabled { opacity: .25; cursor: not-allowed; }.add-button { margin-top: 18px; padding: 8px 0; border: 0; background: none; color: var(--purple); font-size: 13px; font-weight: 850; cursor: pointer; }.add-button span { display: inline-grid; place-items: center; width: 25px; height: 25px; margin-right: 7px; border-radius: 8px; background: var(--purple-soft); }.coral-link { color: #c94c31; }.coral-link span { background: var(--coral-soft); }.exclusion-list { display: grid; gap: 10px; }.exclusion-row { display: grid; grid-template-columns: 1fr auto 1fr 38px; align-items: center; gap: 10px; }.exclusion-row > span { color: var(--muted); font-size: 12px; font-weight: 700; }.form-submit-row { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 17px 8px; }.form-submit-row p { margin: 0; color: var(--muted); font-size: 12px; }.form-submit-row p b { color: var(--ink); }

.event-hero { padding: 35px 38px; margin-bottom: 22px; display: flex; justify-content: space-between; align-items: center; border-radius: 24px; background: linear-gradient(135deg, #fff, #f6f2ff); border: 1px solid var(--line); }.event-title-line { display: flex; gap: 12px; align-items: center; }.event-emoji.large { width: 52px; height: 52px; font-size: 27px; }.event-hero h1 { margin: 17px 0 2px; font-size: 39px; letter-spacing: -1.7px; }.event-hero p { margin: 0; color: var(--muted); }.event-stat { min-width: 140px; text-align: center; }.event-stat strong { display: block; color: var(--purple); font-size: 48px; line-height: 1; }.event-stat small { font-size: 24px; color: #aaa1b8; }.event-stat span { color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px; }
.notice { display: flex; gap: 15px; margin-bottom: 22px; padding: 17px 20px; border: 1px solid #f0d28a; border-radius: 15px; background: #fff9e7; font-size: 13px; }.notice > span { font-size: 23px; }.notice p { margin: 2px 0 0; color: #756546; }.notice code { padding: 2px 5px; border-radius: 5px; background: rgba(255,255,255,.7); }
.launch-card { margin-bottom: 22px; padding: 35px; display: flex; align-items: center; justify-content: space-between; gap: 28px; border-radius: 23px; background: var(--purple); color: #fff; }.launch-card h2 { margin: 8px 0 7px; font-size: 30px; }.launch-card p { max-width: 610px; margin: 0; color: #ddd6ff; font-size: 14px; }.launch-card form { flex: 0 0 auto; }
.participant-status-card { padding: 0; overflow: hidden; }.status-heading { margin: 0; padding: 26px 29px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }.counter { display: grid; place-items: center; min-width: 35px; height: 30px; padding: 0 10px; border-radius: 99px; background: var(--purple-soft); color: var(--purple); font-size: 12px; font-weight: 900; }.status-list { display: grid; }.status-row { min-height: 78px; padding: 13px 28px; display: grid; grid-template-columns: 44px 1fr auto auto; align-items: center; gap: 14px; border-bottom: 1px solid #f0edf3; }.status-row:last-child { border: 0; }.avatar-small { display: grid; place-items: center; width: 41px; height: 41px; border-radius: 13px; background: var(--purple-soft); color: var(--purple); font-weight: 900; }.avatar-small.color-2 { background: var(--coral-soft); color: #d45539; }.avatar-small.color-3 { background: var(--mint-soft); color: #278066; }.avatar-small.color-4 { background: #fff8d9; color: #a77a06; }.status-person { display: grid; }.status-person span { color: var(--muted); font-size: 12px; }.delivery-status { display: inline-flex; align-items: center; gap: 7px; min-width: 93px; color: var(--muted); font-size: 11px; font-weight: 800; }.delivery-status i { width: 7px; height: 7px; border-radius: 50%; background: #bdb7c5; }.delivery-status small { padding: 1px 5px; border-radius: 8px; background: #eeebf2; }.status-sent, .status-logged { color: #23795f; }.status-sent i, .status-logged i { background: var(--mint); box-shadow: 0 0 0 3px var(--mint-soft); }.status-failed { color: var(--danger); }.status-failed i { background: var(--danger); box-shadow: 0 0 0 3px #ffe8ed; }.row-actions { display: flex; align-items: center; gap: 8px; }.row-actions .icon-button { font-size: 15px; }.row-actions form { margin: 0; }.resend-button { height: 38px; padding: 0 13px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--purple); font-size: 11px; font-weight: 850; cursor: pointer; }.resend-button:hover { background: var(--purple-soft); }

.preview-shell { max-width: 760px; }.confidential-banner { margin-bottom: 18px; padding: 13px; border-radius: 12px; background: #fff4cc; color: #765a05; text-align: center; font-size: 13px; font-weight: 800; }.mail-preview { border-radius: 24px; background: #fff; border: 1px solid var(--line); overflow: hidden; box-shadow: var(--shadow); }.mail-preview-header { display: flex; align-items: center; gap: 10px; padding: 22px 30px; background: var(--purple); color: white; font-size: 21px; font-weight: 900; }.mail-preview-header .brand-mark { background: rgba(255,255,255,.15); }.mail-preview-body { padding: clamp(30px, 6vw, 55px); }.mail-preview-body h1 { margin: 18px 0; font-size: 38px; line-height: 1.12; letter-spacing: -1.5px; }.mail-preview-body p { color: var(--muted); }.reveal-box { margin: 23px 0; padding: 24px; border: 2px dashed var(--coral); border-radius: 17px; background: var(--coral-soft); color: #c7472d; text-align: center; font-size: 29px; font-weight: 900; }.preview-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 20px 0; }.preview-meta span { display: grid; padding: 15px; border-radius: 13px; background: var(--purple-soft); }.preview-meta span:last-child { background: var(--mint-soft); }.preview-meta b { font-size: 11px; text-transform: uppercase; letter-spacing: .6px; }

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; padding-top: 45px; }.hero-copy { text-align: center; }.hero-lead { margin-inline: auto; }.hero-actions, .trust-row { justify-content: center; }.hero-art { max-width: 560px; width: 100%; margin: 0 auto; }
  .tool-grid, .event-grid { grid-template-columns: 1fr 1fr; }.tool-card:last-child { grid-column: span 2; }.steps { gap: 12px; }
  .auth-shell { grid-template-columns: 1fr; }.auth-visual { min-height: 400px; }.auth-form-panel { max-width: none; }
}

@media (max-width: 680px) {
  .shell, .narrow-shell { width: min(100% - 24px, 1160px); }.site-header { width: calc(100% - 24px); height: 72px; }.nav > a[href="/#outils"], .nav > a[href="/modeles-email"] { display: none; }.nav { gap: 13px; }.nav a:not(.button), .nav-button { font-size: 12px; }.brand { font-size: 21px; }.brand-mark { width: 31px; height: 31px; }
  .hero { padding: 45px 0 50px; min-height: auto; }.hero h1 { font-size: 49px; letter-spacing: -3px; }.hero-lead { font-size: 16px; }.hero-actions { flex-direction: column; gap: 18px; }.trust-row { flex-wrap: wrap; gap: 8px 18px; }.hero-art { height: 390px; }.gift-front { width: 260px; height: 330px; }.gift-back { left: -2%; width: 170px; }
  .section { padding: 60px 0; }.section-heading { align-items: flex-start; flex-direction: column; }.tool-grid, .steps, .event-grid { grid-template-columns: 1fr; }.tool-card:last-child { grid-column: auto; }.steps { gap: 35px; }.cta { margin-bottom: 45px; padding: 38px 28px; flex-direction: column; align-items: flex-start; }.cta h2 { font-size: 36px; }.site-footer { grid-template-columns: 1fr; text-align: center; }.brand-footer { grid-row: auto; justify-content: center; }.site-footer p { text-align: center; }
  .auth-shell { width: calc(100% - 24px); margin-top: 12px; }.auth-panel { padding: 32px 24px; }.auth-visual { min-height: 350px; }.auth-visual h1 { font-size: 43px; }
  .page-shell { padding-top: 35px; }.page-header { align-items: flex-start; flex-direction: column; }.page-header .button { width: 100%; }.page-header-actions { width: 100%; flex-direction: column; align-items: stretch; }.page-header h1 { font-size: 44px; }.form-card { padding: 23px 17px; }.form-grid { grid-template-columns: 1fr; }.span-two { grid-column: auto; }
  .participant-row { grid-template-columns: 30px 1fr 38px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }.participant-row .email-field { grid-column: 2 / 3; }.participant-row .icon-button { grid-column: 3; grid-row: 1 / 3; align-self: center; }.participant-number { grid-row: 1 / 3; align-self: center; }.exclusion-row { grid-template-columns: 1fr 38px; }.exclusion-row > span { text-align: center; }.exclusion-row select, .exclusion-row > span { grid-column: 1; }.exclusion-row .icon-button { grid-column: 2; grid-row: 1 / 4; align-self: center; }.form-submit-row { flex-direction: column; align-items: stretch; }.form-submit-row .button { width: 100%; }
  .event-hero { padding: 25px 21px; align-items: flex-start; }.event-hero h1 { font-size: 31px; }.event-stat { min-width: auto; }.event-stat strong { font-size: 38px; }.event-stat span { display: none; }.launch-card { padding: 28px 22px; flex-direction: column; align-items: stretch; }.launch-card .button { width: 100%; }.status-row { padding: 14px 16px; grid-template-columns: 41px 1fr auto; }.delivery-status { grid-column: 2; }.row-actions { grid-column: 3; grid-row: 1 / 3; flex-direction: column; }.row-actions .resend-button { width: 38px; padding: 0; font-size: 0; }.row-actions .resend-button::after { content: "↻"; font-size: 18px; }.mail-preview-body h1 { font-size: 31px; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }

.theme-toggle { display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--white); color: var(--ink); cursor: pointer; box-shadow: 0 5px 15px rgba(49,35,82,.07); transition: transform .2s, border-color .2s, background .2s; }
.theme-toggle:hover { transform: translateY(-2px); border-color: var(--purple); }
.theme-toggle span { grid-area: 1 / 1; font-size: 19px; line-height: 1; }
.theme-sun { display: none; }

html[data-theme="dark"] { color-scheme: dark; --ink: #f7f3ff; --muted: #aaa3ba; --paper: #12101a; --white: #1c1827; --purple: #9278ff; --purple-dark: #8064f4; --purple-soft: #2b2442; --coral: #ff8c70; --coral-soft: #3b241f; --mint: #70d7b2; --mint-soft: #17372f; --yellow: #ffe080; --line: #393243; --danger: #ff7189; --shadow: 0 20px 60px rgba(0,0,0,.32); }
html[data-theme="dark"] body::before { background-image: radial-gradient(rgba(146,120,255,.13) .8px, transparent .8px); }
html[data-theme="dark"] .ambient-one { background: radial-gradient(circle, #2b2347, transparent 68%); }
html[data-theme="dark"] .ambient-two { background: radial-gradient(circle, #17342d, transparent 68%); }
html[data-theme="dark"] .theme-sun { display: block; }
html[data-theme="dark"] .theme-moon { display: none; }
html[data-theme="dark"] .tool-card,
html[data-theme="dark"] .event-card,
html[data-theme="dark"] .form-card,
html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .auth-shell,
html[data-theme="dark"] .auth-form-panel,
html[data-theme="dark"] .participant-status-card,
html[data-theme="dark"] .gift-front,
html[data-theme="dark"] .flash,
html[data-theme="dark"] .icon-button,
html[data-theme="dark"] .resend-button { background: var(--white); }
html[data-theme="dark"] .gift-front::before { border-color: #40384f; }
html[data-theme="dark"] .gift-back { color: #102e27; }
html[data-theme="dark"] .site-footer { background: rgba(20,17,28,.7); }
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select { background: #17131f; border-color: #443b51; }
html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus { background: #1d1828; }
html[data-theme="dark"] .soft-card { background: #17141f; }
html[data-theme="dark"] .event-hero { background: linear-gradient(135deg, #211c2d, #191520); }
html[data-theme="dark"] .notice { background: #2b2518; border-color: #665224; }
html[data-theme="dark"] .notice p { color: #c6b98e; }
html[data-theme="dark"] .notice code { background: rgba(0,0,0,.22); }
html[data-theme="dark"] .event-progress { background: #332d3d; }
html[data-theme="dark"] .status-row { border-color: #312b3a; }
html[data-theme="dark"] .delivery-status small { background: #302a3a; }
html[data-theme="dark"] .form-error { background: #3b1f27; border-color: #6e3040; color: #ff9aac; }
html[data-theme="dark"] .mail-preview { background: #fff; color: #211b32; }
html[data-theme="dark"] .mail-preview .eyebrow { color: #6c4cf1; }
html[data-theme="dark"] .mail-preview p { color: #6f687e; }
html[data-theme="dark"] .mail-preview .preview-meta { color: #211b32; }
html[data-theme="dark"] .button-light { background: #fff; color: #5232d0; }
html[data-theme="dark"] .resend-button:disabled { opacity: .45; cursor: not-allowed; }

@media (max-width: 680px) {
  .theme-toggle { width: 34px; height: 34px; }
}

/* Email customizer */
.theme-badge { background: #fff3cf; color: #9b6800; }
.theme-picker { min-width: 0; margin: 0 0 30px; padding: 0; border: 0; }
.theme-picker legend { margin-bottom: 12px; color: var(--ink); font-size: 13px; font-weight: 850; }
.theme-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.theme-option { position: relative; display: grid; align-content: start; min-height: 190px; padding: 13px; border: 2px solid var(--line); border-radius: 17px; background: var(--white); cursor: pointer; transition: transform .2s, border-color .2s, box-shadow .2s; }
.theme-option:hover { transform: translateY(-2px); border-color: var(--purple); }
.theme-option input { position: absolute; opacity: 0; pointer-events: none; }
.theme-option:has(input:checked) { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(108,76,241,.11); }
.theme-option-art { position: relative; height: 66px; margin-bottom: 12px; display: grid; place-items: center; overflow: hidden; border-radius: 12px; background: #6c4cf1; color: white; }
.theme-option-art b { position: relative; z-index: 2; font-size: 28px; }
.theme-option-art i { position: absolute; width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,.13); }
.theme-option-art i:first-of-type { left: -13px; top: -15px; }.theme-option-art i:last-of-type { right: -15px; bottom: -18px; }
.theme-option-art-image { display: block; padding: 0; }
.theme-option-art-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.theme-option-santa .theme-option-art { background: #c1272c; }.theme-option-halloween .theme-option-art { background: #24102f; color: #ffb35c; }.theme-option-easter .theme-option-art { background: #7d5ab5; }
.theme-option > strong { font-size: 14px; }.theme-option > small { margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.theme-option > em { margin-top: auto; padding-top: 10px; color: var(--purple); font-size: 11px; font-style: normal; font-weight: 850; }
.theme-option:has(input:checked) > em::before { content: "✓ "; }

.message-builder { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr); gap: 22px; align-items: start; }
.message-library { min-width: 0; }
.library-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.library-heading div { display: grid; gap: 3px; }.library-heading div > strong { font-size: 14px; }.library-heading small { color: var(--muted); font-size: 11px; line-height: 1.4; }
.library-heading div > a { width: fit-content; margin-top: 3px; color: var(--purple); font-size: 10px; font-weight: 850; }
.library-heading > span { flex: 0 0 auto; padding: 6px 9px; border-radius: 99px; background: var(--purple-soft); color: var(--purple); font-size: 10px; font-weight: 850; }.library-heading > span.is-empty { background: #fff0f2; color: var(--danger); }
.template-group { margin-bottom: 13px; border: 1px solid var(--line); border-radius: 15px; background: var(--paper); overflow: hidden; }
.template-group-title { min-height: 46px; padding: 8px 12px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); }
.template-group-title strong { font-size: 12px; }.template-group-title button { margin-left: auto; padding: 5px; border: 0; background: transparent; color: var(--purple); cursor: pointer; font-size: 10px; font-weight: 800; }
.template-list { display: grid; }
.template-option { position: relative; min-height: 57px; padding: 10px 42px 10px 12px; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); cursor: pointer; }
.template-option:last-child { border-bottom: 0; }.template-option:hover { background: var(--purple-soft); }
.template-option input { position: absolute; opacity: 0; }.template-option > span { display: grid; gap: 2px; }.template-option strong { font-size: 12px; }.template-option small { color: var(--muted); font-size: 10px; line-height: 1.35; }
.template-option strong em { margin-left: 4px; padding: 2px 5px; border-radius: 6px; background: var(--coral-soft); color: var(--coral); font-size: 8px; font-style: normal; text-transform: uppercase; }
.template-option > i { position: absolute; right: 13px; display: grid; place-items: center; width: 21px; height: 21px; border: 1px solid var(--line); border-radius: 7px; color: transparent; font-size: 11px; font-style: normal; }
.template-option:has(input:checked) { background: var(--purple-soft); }.template-option:has(input:checked) > i { border-color: var(--purple); background: var(--purple); color: white; }

.email-live-preview { --mail-header: #6c4cf1; --mail-surface: #fff; --mail-ink: #201936; --mail-muted: #625b70; --mail-accent: #ff7657; --mail-soft: #fff0e9; position: sticky; top: 92px; overflow: hidden; border: 1px solid var(--line); border-radius: 19px; background: var(--mail-surface); color: var(--mail-ink); box-shadow: 0 16px 35px rgba(43,31,67,.12); }
.email-live-preview[data-theme-preview="santa"] { --mail-header: #c1272c; --mail-ink: #193d39; --mail-muted: #4d5d59; --mail-accent: #c1272c; --mail-soft: #fbe7e3; }
.email-live-preview[data-theme-preview="santa-storybook"] { --mail-header: #c1272c; --mail-ink: #193d39; --mail-muted: #4d5d59; --mail-accent: #c1272c; --mail-soft: #fbe7e3; }
.email-live-preview[data-theme-preview="santa-sketch"] { --mail-header: #9f443b; --mail-ink: #302b27; --mail-muted: #69615a; --mail-accent: #a3443c; --mail-soft: #f8ebe6; }
.email-live-preview[data-theme-preview="halloween"] { --mail-header: #24102f; --mail-ink: #2b172f; --mail-muted: #69566d; --mail-accent: #e65f16; --mail-soft: #ffead5; }
.email-live-preview[data-theme-preview="halloween-storybook"] { --mail-header: #24102f; --mail-ink: #2b172f; --mail-muted: #69566d; --mail-accent: #e65f16; --mail-soft: #ffead5; }
.email-live-preview[data-theme-preview="halloween-sketch"] { --mail-header: #4a3946; --mail-ink: #332d31; --mail-muted: #6d6269; --mail-accent: #bb672d; --mail-soft: #f9eee2; }
.email-live-preview[data-theme-preview="easter"] { --mail-header: #7d5ab5; --mail-ink: #35284a; --mail-muted: #70637d; --mail-accent: #db6c91; --mail-soft: #fde8ef; }
.email-live-preview[data-theme-preview="easter-storybook"] { --mail-header: #7d5ab5; --mail-ink: #35284a; --mail-muted: #70637d; --mail-accent: #db6c91; --mail-soft: #fde8ef; }
.email-live-preview[data-theme-preview="easter-sketch"] { --mail-header: #766a7d; --mail-ink: #39343d; --mail-muted: #716a74; --mail-accent: #9778a7; --mail-soft: #f3edf5; }
.email-preview-toolbar { height: 34px; padding: 0 12px; display: flex; align-items: center; gap: 5px; background: #f0edf4; color: #746d80; }.email-preview-toolbar span { width: 7px; height: 7px; border-radius: 50%; background: #c6bfce; }.email-preview-toolbar b { margin-left: auto; font-size: 9px; text-transform: uppercase; letter-spacing: .7px; }
.email-preview-hero { min-height: 90px; padding: 17px; display: grid; place-items: center; background: var(--mail-header); color: white; text-align: center; }.email-preview-hero > span { font-size: 25px; }.email-preview-hero small { font-size: 9px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.email-preview-hero img { display: block; width: 100%; height: auto; }
.email-preview-hero img[hidden] { display: none; }
.email-live-preview[data-theme-preview$="-storybook"] .email-preview-hero, .email-live-preview[data-theme-preview$="-sketch"] .email-preview-hero { min-height: 0; padding: 0; display: block; }
.email-live-preview[data-theme-preview$="-storybook"] .email-preview-hero small, .email-live-preview[data-theme-preview$="-sketch"] .email-preview-hero small { display: block; padding: 8px 12px; background: var(--mail-header); }
.email-preview-content { padding: 21px; }.email-preview-kicker { color: var(--mail-accent); font-size: 8px; font-weight: 850; letter-spacing: .8px; text-transform: uppercase; }.email-preview-content h3 { margin: 6px 0 11px; color: var(--mail-ink); font-size: 21px; line-height: 1.15; }.email-preview-content > p { min-height: 42px; margin: 0 0 13px; color: var(--mail-muted); font-size: 10px; line-height: 1.45; }
.email-preview-personal { margin: 0 0 12px; padding: 10px; display: grid; gap: 3px; border: 1px solid var(--mail-accent); border-radius: 9px; background: var(--mail-soft); color: var(--mail-ink); font-size: 9px; line-height: 1.4; }.email-preview-personal strong { color: var(--mail-accent); font-size: 8px; text-transform: uppercase; letter-spacing: .4px; }.email-preview-personal.is-placeholder { border-style: dashed; opacity: .62; }
.email-preview-receiver { padding: 13px; border: 2px dashed var(--mail-accent); border-radius: 11px; background: var(--mail-soft); color: var(--mail-accent); text-align: center; font-size: 16px; font-weight: 900; }
.email-preview-meta { margin-top: 9px; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }.email-preview-meta span { padding: 9px; display: grid; gap: 2px; border-radius: 9px; background: #eee9ff; color: var(--mail-ink); }.email-preview-meta span:last-child { background: #e6f5ed; }.email-preview-meta small { color: var(--mail-muted); font-size: 7px; font-weight: 800; text-transform: uppercase; }.email-preview-meta b { font-size: 11px; }
.custom-note { position: relative; margin-top: 25px; }.custom-note > small { margin-left: 4px; color: var(--muted); font-weight: 500; }.custom-note > span { position: absolute; right: 11px; bottom: 8px; color: var(--muted); font-size: 9px; }.custom-note textarea { padding-bottom: 25px; }

/* Message template library */
.template-library-page { max-width: 1100px; }.template-workspace { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(300px, .8fr); gap: 22px; align-items: start; }.template-creator label { display: grid; gap: 7px; font-size: 13px; font-weight: 800; }.template-body-label { margin-top: 18px; }.template-body-label textarea { min-height: 245px; line-height: 1.6; }.placeholder-tools { margin: 11px 0 9px; display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }.placeholder-tools > span { margin-right: 3px; color: var(--muted); font-size: 11px; font-weight: 800; }.placeholder-tools button { padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--purple-soft); color: var(--purple); cursor: pointer; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; font-weight: 800; }.placeholder-tools button:hover { border-color: var(--purple); }.form-hint { margin: 0 0 20px; color: var(--muted); font-size: 11px; line-height: 1.5; }.template-guide { position: sticky; top: 92px; background: linear-gradient(155deg, var(--white), var(--purple-soft)); }.template-guide h2 { margin: 10px 0 20px; font-size: 28px; line-height: 1.12; }.template-guide ol { margin: 0; padding: 0; display: grid; gap: 14px; list-style: none; counter-reset: template-step; }.template-guide li { display: grid; grid-template-columns: 28px 1fr; gap: 2px 10px; counter-increment: template-step; }.template-guide li::before { content: counter(template-step); grid-row: 1 / 3; display: grid; place-items: center; width: 25px; height: 25px; border-radius: 8px; background: var(--purple); color: white; font-size: 11px; font-weight: 900; }.template-guide li b { font-size: 12px; }.template-guide li span { color: var(--muted); font-size: 10px; line-height: 1.4; }.personal-message-demo { margin-top: 23px; padding: 15px; display: grid; gap: 5px; border: 2px solid var(--coral); border-radius: 13px; background: var(--coral-soft); }.personal-message-demo strong { color: var(--coral); font-size: 10px; text-transform: uppercase; letter-spacing: .5px; }.personal-message-demo span { font-size: 12px; }.template-section { padding-top: 62px; }.compact-heading { align-items: center; margin-bottom: 22px; }.compact-heading h2 { font-size: 35px; }.compact-heading p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }.empty-template-list { padding: 24px; display: flex; align-items: center; gap: 16px; border: 1px dashed var(--line); border-radius: 17px; background: var(--white); }.empty-template-list > span { font-size: 30px; }.empty-template-list strong { font-size: 14px; }.empty-template-list p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }.reading-group { margin-top: 27px; }.reading-group > h3 { margin: 0 0 10px; font-size: 16px; }.template-reading-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.reading-card { border: 1px solid var(--line); border-radius: 16px; background: var(--white); overflow: hidden; }.reading-card[open] { box-shadow: 0 12px 30px rgba(50,38,78,.06); }.reading-card summary { min-height: 78px; padding: 15px 17px; display: flex; align-items: center; gap: 11px; cursor: pointer; list-style: none; }.reading-card summary::-webkit-details-marker { display: none; }.reading-card summary > span { font-size: 22px; }.reading-card summary > div { display: grid; gap: 2px; }.reading-card summary strong { font-size: 13px; }.reading-card summary small { color: var(--muted); font-size: 10px; line-height: 1.35; }.reading-card summary em { margin-left: auto; color: var(--purple); font-size: 9px; font-style: normal; font-weight: 850; text-transform: uppercase; }.reading-card[open] summary { border-bottom: 1px solid var(--line); }.reading-card-body { padding: 18px; color: var(--muted); font-size: 12px; line-height: 1.65; }.reading-card-body p { margin: 0 0 11px; }.reading-card-body p:last-child { margin-bottom: 0; }.reading-card-body strong { color: var(--ink); }.rich-copy { white-space: normal; }

.event-theme-summary { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }.event-theme-summary span { padding: 5px 9px; border-radius: 99px; background: var(--purple-soft); color: var(--purple); font-size: 10px; font-weight: 800; }
.preview-context { margin-bottom: 14px; padding: 15px 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid var(--line); border-radius: 15px; background: var(--white); }.preview-context > div { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 9px; }.preview-context strong { font-size: 13px; }.preview-context small { grid-column: 2; color: var(--muted); font-size: 10px; }.preview-context > span { color: var(--muted); font-size: 10px; }.theme-chip { grid-row: 1 / 3; padding: 8px 10px; border-radius: 10px; background: var(--purple-soft); color: var(--purple); font-size: 11px; font-weight: 850; }
.mail-preview-frame-wrap { padding: 9px; border: 1px solid var(--line); border-radius: 24px; background: #e9e5ef; box-shadow: var(--shadow); }.mail-preview-frame { display: block; width: 100%; height: 920px; border: 0; border-radius: 17px; background: #fff; }

html[data-theme="dark"] .theme-option { background: #211c2b; }
html[data-theme="dark"] .theme-option:has(input:checked) { border-color: #a28cff; box-shadow: 0 0 0 3px rgba(146,120,255,.15); }
html[data-theme="dark"] .template-group { background: #17141f; }
html[data-theme="dark"] .library-heading > span.is-empty { background: #3b1f27; }
html[data-theme="dark"] .email-live-preview { border-color: #554b61; }
html[data-theme="dark"] .email-preview-toolbar { background: #dcd7e2; }
html[data-theme="dark"] .preview-context { background: #211c2b; }
html[data-theme="dark"] .mail-preview-frame-wrap { border-color: #494151; background: #24202b; }
html[data-theme="dark"] .event-hero p { color: #bbb3c9; }
html[data-theme="dark"] .template-guide { background: linear-gradient(155deg, #211c2b, #2b2442); }
html[data-theme="dark"] .reading-card,
html[data-theme="dark"] .empty-template-list { background: #211c2b; }

@media (max-width: 900px) {
  .theme-grid { grid-template-columns: 1fr 1fr; }
  .message-builder { grid-template-columns: 1fr; }
  .email-live-preview { position: relative; top: auto; max-width: 420px; width: 100%; margin: 0 auto; }
  .template-workspace { grid-template-columns: 1fr; }.template-guide { position: static; }
}

@media (max-width: 680px) {
  .theme-grid { grid-template-columns: 1fr; }
  .theme-option { min-height: 126px; grid-template-columns: 88px 1fr; grid-template-rows: auto auto 1fr; column-gap: 12px; }
  .theme-option-art { grid-row: 1 / 4; height: 98px; margin: 0; }.theme-option > em { padding-top: 4px; }
  .preview-context { align-items: flex-start; flex-direction: column; }.preview-context > span { padding-left: 2px; }
  .mail-preview-frame { height: 820px; }
  .template-reading-grid { grid-template-columns: 1fr; }.template-section { padding-top: 44px; }.compact-heading { flex-direction: row; align-items: center; }.reading-card summary { min-height: 70px; }
}