:root{
  --sage:#24241f;
  --ink:#11110f;
  --muted:#69675f;
  --paper:#fffdf8;
  --paper-deep:#f8f4e9;
  --yellow:#fff1bd;
  --yellow-strong:#ffe9a3;
  --line:#dedbd2;
  --white:#fff;
  --shadow:0 24px 55px rgba(17,17,15,.12);
  --display:"Archivo Black",sans-serif;
  --hand:"Kalam",cursive;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--paper);font-family:"DM Sans",sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.018;background-image:radial-gradient(#111 0.55px,transparent .55px);background-size:17px 17px;z-index:50}
a{color:inherit}
button,input,textarea{font:inherit}
.nav{height:86px;max-width:1320px;margin:auto;padding:0 38px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:28px;position:relative;z-index:20}
.nav:after{content:"";position:absolute;left:38px;right:38px;bottom:0;height:1px;background:var(--line)}
.brand{display:flex;align-items:center;text-decoration:none;justify-self:start}.brand-logo{width:72px;height:72px;display:block;object-fit:contain}
.nav nav{display:flex;align-items:center;gap:34px}.nav nav a{color:var(--ink);text-decoration:none;font-size:13px;font-weight:700;padding:12px 0;position:relative}.nav nav a.active:after{content:"";position:absolute;left:0;right:0;bottom:3px;height:4px;background:var(--yellow-strong);border-radius:50%;transform:rotate(-1deg)}
.nav-subscribe{justify-self:end;background:var(--ink);color:#fff;text-decoration:none;border-radius:7px;padding:12px 18px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;gap:8px;box-shadow:0 5px 0 rgba(0,0,0,.08)}
.page{max-width:1320px;margin:auto;padding-left:38px;padding-right:38px}
.hero{position:relative;min-height:820px;display:grid;grid-template-columns:190px minmax(500px,1fr) 310px;grid-template-rows:1fr auto;column-gap:30px;align-items:center;padding-top:48px;padding-bottom:64px;isolation:isolate}
.hero:before{content:"";position:absolute;z-index:-2;width:720px;height:720px;border-radius:50%;left:49%;top:65px;transform:translateX(-50%);background:radial-gradient(circle,#fff9df 0 52%,rgba(255,236,165,.36) 67%,transparent 74%)}
.hero-side-note{align-self:start;margin-top:112px;display:flex;flex-direction:column;gap:2px;font-family:var(--hand);font-size:24px;line-height:1.05;transform:rotate(-2deg)}
.hero-side-note b{font-family:var(--hand);font-size:42px;font-weight:400;margin-top:12px}
.scroll-note{position:absolute;left:50px;bottom:98px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:9px;letter-spacing:.18em;font-weight:700;display:flex;gap:10px;align-items:center}.scroll-note span{font-size:18px;letter-spacing:0}
.quote-stage{position:relative;align-self:center;justify-self:center;width:min(100%,640px);padding:40px 15px 0}
.yellow-blob{position:absolute;z-index:-1;width:360px;height:260px;right:-35px;bottom:-5px;background:var(--yellow-strong);border-radius:57% 43% 54% 46% / 45% 58% 42% 55%;transform:rotate(-5deg);opacity:.9}
.dot-spray{position:absolute;z-index:-1;right:-3px;bottom:95px;width:150px;height:150px;opacity:.7;background-image:radial-gradient(var(--ink) 1.2px,transparent 1.2px);background-size:13px 13px;clip-path:circle(50% at 50% 50%)}
.quote-card{position:relative;background:#fffef9;border:1px solid #e7e1d4;box-shadow:var(--shadow);padding:64px 68px 48px;transform:rotate(-1.15deg);min-height:570px;display:flex;flex-direction:column;justify-content:space-between;overflow:visible}
.quote-card:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.72),transparent 35%,rgba(247,239,219,.15));pointer-events:none}
.tape{position:absolute;right:-45px;top:-24px;width:150px;height:42px;background:rgba(255,220,88,.92);transform:rotate(10deg);clip-path:polygon(3% 12%,96% 0,100% 82%,0 100%);filter:drop-shadow(0 4px 5px rgba(17,17,15,.07))}
.quote-top{display:flex;justify-content:space-between;align-items:center;gap:15px;position:relative;z-index:1}.quote-label{font-family:var(--display);text-transform:uppercase;color:#bfa44a;font-size:13px;letter-spacing:.1em;display:flex;align-items:center;gap:9px}.sun-mark{font-family:Georgia,serif;font-size:23px;line-height:1}.date-pill{border:1px solid #d9d5ca;border-radius:999px;padding:7px 10px;color:var(--muted);font-size:10px;font-weight:700;white-space:nowrap}
.quote-card blockquote{font-family:var(--display);font-size:clamp(46px,5vw,72px);line-height:1.02;letter-spacing:-.045em;margin:52px 0 14px;max-width:530px;position:relative;z-index:1}.quote-author{font-size:12px;color:var(--muted);font-weight:600;position:relative;z-index:1;margin:0}.quote-signoff{position:relative;z-index:1;margin-top:35px;padding-top:20px;border-top:2px solid var(--ink);width:max-content;min-width:180px;display:flex;gap:32px;align-items:center;font-weight:700;font-size:13px}.quote-signoff span:last-child{font-family:var(--hand);font-size:28px;font-weight:400;color:#bfa44a}
.card-actions{display:flex;gap:16px;margin-top:28px;position:relative;z-index:4}.btn{border:0;cursor:pointer;padding:14px 19px;border-radius:8px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:transform .18s,box-shadow .18s,background .18s}.btn:hover{transform:translateY(-2px)}.btn.dark{background:var(--ink);color:#fff;box-shadow:0 5px 0 rgba(0,0,0,.08)}.btn.light{background:#fff;border:1px solid #d9d6cd;color:var(--ink);box-shadow:0 4px 12px rgba(17,17,15,.05)}.btn.yellow{background:var(--yellow-strong);color:var(--ink);box-shadow:0 4px 0 #d9bc43}.button-icon{font-size:16px;line-height:1}.chevron{font-size:14px;margin-left:3px}.share-menu{position:relative}.share-dropdown{position:absolute;left:0;top:calc(100% + 9px);width:170px;background:#fff;border:1px solid #ddd8cc;box-shadow:0 15px 30px rgba(17,17,15,.12);padding:6px;border-radius:8px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:.18s;z-index:20}.share-dropdown.open{opacity:1;visibility:visible;transform:translateY(0)}.share-dropdown button{width:100%;border:0;background:transparent;text-align:left;padding:11px 10px;border-radius:5px;cursor:pointer;font-size:12px;font-weight:700;display:flex;align-items:center;gap:10px}.share-dropdown button:hover{background:var(--paper-deep)}.menu-icon{width:22px;text-align:center;color:#777}.hero-email-card,.hero-submit-card{align-self:end;margin-bottom:95px}.quick-card{background:rgba(255,255,255,.8);border:1px solid #dedbd2;padding:28px 28px 30px;border-radius:10px;box-shadow:0 12px 30px rgba(17,17,15,.045);backdrop-filter:blur(4px)}.hero-submit-card{margin-bottom:0;margin-top:24px}.quick-icon{width:44px;height:44px;border-radius:50%;background:var(--yellow-strong);display:grid;place-items:center;font-size:20px;margin-bottom:20px}.quick-icon.heart{font-size:18px}.emoji-icon{font-family:inherit;line-height:1}.quick-card h2{font-family:var(--display);font-size:25px;line-height:1.05;letter-spacing:-.025em;margin:0 0 12px}.quick-card p{font-size:12px;line-height:1.65;color:var(--muted);margin:0 0 22px}.text-link{font-size:11px;font-weight:800;text-decoration:none;border-bottom:2px solid var(--yellow-strong);padding-bottom:4px}.text-link:hover{border-bottom-color:var(--ink)}
.band{background:var(--yellow);border-top:1px solid rgba(17,17,15,.06);border-bottom:1px solid rgba(17,17,15,.06)}.band-inner{max-width:1320px;margin:auto;padding:22px 38px;display:grid;grid-template-columns:1fr 1px 1fr 1px 1fr;align-items:center;gap:28px}.band-divider{height:56px;background:rgba(17,17,15,.14)}.band-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}.band-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.65);font-size:17px}.band-item strong{display:block;font-family:var(--display);font-size:13px;line-height:1.2}.band-item small{display:block;font-size:10px;color:#5f5a49;margin-top:4px}.band-item a{font-size:10px;font-weight:800;text-decoration:none;white-space:nowrap}.band-item-last{grid-template-columns:auto 1fr}
.section{padding-top:120px;padding-bottom:120px}.subscribe-section{display:grid;grid-template-columns:1fr 450px;gap:110px;align-items:center}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:#a9944b;margin-bottom:16px}.section-copy h2,.submit-copy h2{font-family:var(--display);font-size:clamp(48px,6vw,76px);line-height:.98;letter-spacing:-.045em;margin:0 0 24px;max-width:700px}.section-copy h2 span,.submit-copy h2 span{color:#aa9440}.section-copy p,.submit-copy p{max-width:630px;color:var(--muted);font-size:14px;line-height:1.8;margin:0}.hand-note{font-family:var(--hand);font-size:18px;margin-top:28px;transform:rotate(-1.5deg);width:max-content;max-width:100%}.hand-note span{color:#b59c43;margin-left:5px}.form-card{background:#fff;border:1px solid var(--line);padding:34px;border-radius:10px;box-shadow:0 16px 40px rgba(17,17,15,.06)}.form-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);font-size:22px;margin-bottom:18px}.form-icon.heart{font-size:20px}.form-card h3{font-family:var(--display);font-size:27px;line-height:1.05;margin:0 0 10px}.form-card>p{font-size:12px;line-height:1.65;color:var(--muted);margin:0 0 24px}.form-card label{display:block;font-size:11px;font-weight:700;margin:15px 0;color:#49473f}.form-card input,.form-card textarea{width:100%;margin-top:7px;border:1px solid #d8d5cd;background:#fffdf8;padding:13px 14px;border-radius:7px;outline:none;color:var(--ink);font-size:12px}.form-card textarea{min-height:145px;resize:vertical;line-height:1.55}.form-card input:focus,.form-card textarea:focus{border-color:#c8aa36;box-shadow:0 0 0 4px rgba(255,220,88,.2)}.wide{width:100%}.form-message{min-height:18px;color:#776526;font-size:11px!important;font-weight:700!important;margin:10px 0 0!important}.privacy-note{display:block!important;text-align:center!important;color:#969187!important;font-size:10px!important;margin-top:12px!important}.optional{font-weight:400;color:#9b988e}.submit-section{background:#f5f1e5}.submit-inner{display:grid;grid-template-columns:1fr 450px;gap:110px;align-items:center}
footer{max-width:1320px;margin:auto;padding:30px 38px 42px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;color:var(--muted);font-size:11px}.footer-brand img{width:62px;height:62px;display:block}.footer-tagline{font-family:var(--hand);font-size:18px;color:var(--ink)}.footer-tagline span{color:#b59c43}.footer-links{justify-self:end;display:flex;gap:18px}.footer-links a{text-decoration:none}.footer-links a:hover{text-decoration:underline;text-decoration-color:var(--yellow-strong);text-decoration-thickness:3px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 17px;border-radius:7px;font-size:12px;opacity:0;pointer-events:none;transition:.25s;z-index:100}.toast.show{opacity:1;transform:translate(-50%,0)}
/* Admin styling retained */
.admin-body{background:var(--paper)}.admin-main{max-width:1120px;margin:auto;padding:50px 28px 120px}.admin-login{padding-top:30px}.admin-login h1,.admin-heading h1{font-family:var(--display);font-size:clamp(48px,6vw,68px);line-height:1;letter-spacing:-.035em;margin:0 0 28px}.admin-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:30px}.admin-heading .eyebrow{margin-bottom:10px}.stats{color:var(--muted);font-size:13px;font-weight:600}.admin-login-form{max-width:380px;background:white;border:1px solid var(--line);padding:30px;border-radius:6px;box-shadow:var(--shadow)}.admin-login-form input{margin-bottom:12px}.admin-button{width:100%;border:0;border-radius:4px;padding:12px 17px;background:var(--yellow-strong);color:var(--ink);font:700 13px "DM Sans";cursor:pointer}.admin-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:26px;overflow:auto}.admin-tabs button{border:0;background:transparent;color:var(--muted);font:600 13px "DM Sans";padding:12px 15px;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}.admin-tabs button.active{color:var(--ink);border-bottom-color:var(--ink)}.admin-tabs span{display:inline-grid;place-items:center;min-width:20px;height:20px;border-radius:20px;background:var(--sage);font-size:10px;margin-left:5px}.panel-intro{margin-bottom:18px}.panel-intro h2{font-size:36px;margin-bottom:7px}.panel-intro p{color:var(--muted);font-size:13px;margin:0;line-height:1.6}.admin-list{display:grid;gap:12px}.admin-card{background:white;border:1px solid var(--line);border-radius:6px;padding:18px;display:grid;grid-template-columns:1fr auto;gap:15px;align-items:center}.admin-quote{font-family:"Playfair Display",serif;font-size:20px;line-height:1.35}.admin-meta{color:var(--muted);font-size:12px;margin-top:6px}.admin-actions{display:flex;gap:8px;flex-wrap:wrap}.admin-actions button{border:1px solid var(--line);background:#fffdf8;padding:8px 11px;border-radius:4px;font:600 11px "DM Sans";cursor:pointer}.admin-actions button.primary{background:var(--yellow-strong);border-color:#dfc859}.subscriber-row{background:#fff;border:1px solid var(--line);padding:14px 16px;border-radius:6px;display:flex;justify-content:space-between;gap:15px}.subscriber-row strong{font-size:13px}.subscriber-row span{color:var(--muted);font-size:11px}.admin-empty{padding:30px;border:1px dashed #cfc9b7;color:var(--muted);text-align:center;background:#fffdf8}
@media(max-width:1050px){
  .hero{grid-template-columns:100px minmax(430px,1fr) 260px;column-gap:20px}.hero-side-note{font-size:20px}.quote-card{padding:52px 48px 40px}.quick-card{padding:22px}.quick-card h2{font-size:21px}.subscribe-section,.submit-inner{gap:60px}
}
@media(max-width:850px){
  .nav{grid-template-columns:1fr auto; padding:0 22px}.nav:after{left:22px;right:22px}.nav nav{display:none}.nav-subscribe{padding:10px 13px}.brand-logo{width:62px;height:62px}
  .hero{min-height:auto;display:grid;grid-template-columns:1fr;grid-template-rows:auto;gap:0;padding-top:46px;padding-bottom:70px}.hero:before{width:560px;height:560px;top:30px;left:50%}.hero-side-note{display:none}.scroll-note{display:none}.quote-stage{order:1;width:min(100%,650px);padding-top:30px}.hero-email-card,.hero-submit-card{order:2;margin:30px auto 0;width:min(100%,650px)}.hero-submit-card{margin-top:14px}.quote-card{min-height:0;padding:52px 48px 42px}.quote-card blockquote{font-size:clamp(42px,8vw,62px)}.band-inner{grid-template-columns:1fr;gap:18px;padding:24px 24px}.band-divider{display:none}.band-item{grid-template-columns:auto 1fr auto}.band-item-last{display:none}.section,.submit-section{padding-top:85px;padding-bottom:85px}.subscribe-section,.submit-inner{grid-template-columns:1fr;gap:55px}.submit-inner{padding-left:24px;padding-right:24px}.form-card{max-width:650px;width:100%;margin:auto}.footer-links{display:none}footer{grid-template-columns:1fr auto;padding-left:24px;padding-right:24px}
}
@media(max-width:560px){
  .nav{height:70px;padding:0 16px}.nav:after{left:16px;right:16px}.brand-logo{width:54px;height:54px}.nav-subscribe{font-size:10px;padding:9px 11px}.nav-subscribe span{font-size:12px}
  .page{padding-left:18px;padding-right:18px}.hero{padding-top:25px;padding-bottom:55px}.hero:before{width:440px;height:440px;top:10px}.quote-stage{padding:20px 6px 0}.yellow-blob{width:250px;height:180px;right:-8px;bottom:-4px}.dot-spray{width:100px;height:100px;right:0;bottom:82px;background-size:10px 10px}.quote-card{padding:36px 24px 32px;transform:rotate(-.7deg)}.tape{right:-21px;top:-18px;width:110px;height:34px}.quote-top{align-items:flex-start}.quote-label{font-size:9px;letter-spacing:.08em}.sun-mark{font-size:17px}.date-pill{font-size:8px;padding:6px 8px}.quote-card blockquote{font-size:39px;line-height:1.03;margin-top:45px}.quote-author{font-size:10px}.quote-signoff{font-size:11px;min-width:150px;margin-top:28px;padding-top:14px}.quote-signoff span:last-child{font-size:23px}.card-actions{gap:8px;margin-top:23px}.btn{padding:12px 13px;font-size:10px}.share-dropdown{width:150px}.hero-email-card,.hero-submit-card{margin-top:22px}.quick-card{padding:22px}.quick-card h2{font-size:21px}.quick-card p{font-size:11px}.band-item{grid-template-columns:auto 1fr}.band-item a{grid-column:2;margin-top:5px}.section-copy h2,.submit-copy h2{font-size:47px}.section-copy p,.submit-copy p{font-size:13px}.hand-note{font-size:16px}.form-card{padding:25px 20px}.form-card h3{font-size:24px}.footer-brand img{width:52px;height:52px}.footer-tagline{font-size:15px}footer{gap:12px}
}

/* V7: homepage quick cards live in a stable row beneath the quote. */
.hero{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:auto;padding-top:42px;padding-bottom:72px}
.hero:before{left:50%;top:20px;width:780px;height:780px}
.hero-side-note{position:absolute;left:38px;top:150px;margin:0;z-index:2}
.scroll-note{left:38px;bottom:82px}
.quote-stage{width:min(100%,760px);padding-top:48px}
.quote-card{min-height:560px}
.hero-quick-row{width:min(100%,980px);display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:58px;position:relative;z-index:5}
.hero-quick-row .quick-card{margin:0;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;text-decoration:none;color:inherit;transition:transform .18s,box-shadow .18s,border-color .18s}
.hero-quick-row .quick-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(17,17,15,.09);border-color:#cfc9b7}
.hero-quick-row .quick-card h2{margin-top:1px}
.inner-hero{min-height:650px;padding-top:100px;padding-bottom:100px;display:grid;grid-template-columns:1fr 450px;gap:110px;align-items:center;position:relative;isolation:isolate}
.inner-hero:before{content:"";position:absolute;z-index:-1;width:600px;height:600px;right:4%;top:35px;border-radius:50%;background:radial-gradient(circle,#fff8dc 0 50%,rgba(255,236,165,.42) 67%,transparent 75%)}
.inner-intro h1{font-family:var(--display);font-size:clamp(52px,6vw,82px);line-height:.96;letter-spacing:-.045em;margin:0 0 26px;max-width:760px}
.inner-intro h1 span{color:#aa9440}.inner-intro>p{max-width:650px;color:var(--muted);font-size:15px;line-height:1.85;margin:0}.inner-form{position:relative;z-index:2}.inner-form h2{font-family:var(--display);font-size:31px;line-height:1.02;margin:0 0 10px}.inner-note-section{background:var(--yellow);padding:78px 38px}.inner-note{max-width:850px;margin:auto;text-align:center}.note-mark{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#fff9df;margin:0 auto 20px;font-size:22px}.inner-note h2{font-family:var(--display);font-size:clamp(34px,4vw,52px);line-height:1;letter-spacing:-.035em;margin:0 auto 15px}.inner-note p{max-width:580px;margin:0 auto 25px;color:#5f5a49;font-size:14px;line-height:1.7}.inner-note .btn{display:inline-flex}

@media(max-width:1050px){
  .hero-side-note{left:22px}.scroll-note{left:22px}.quote-stage{width:min(100%,700px)}.hero-quick-row{width:min(100%,900px)}.inner-hero{grid-template-columns:1fr 410px;gap:60px}.inner-intro h1{font-size:clamp(48px,6vw,72px)}
}
@media(max-width:850px){
  .hero{padding-top:28px;padding-bottom:60px}.hero-side-note,.scroll-note{display:none}.hero:before{width:620px;height:620px;top:20px}.quote-stage{padding-top:34px;width:min(100%,680px)}.hero-quick-row{grid-template-columns:1fr;width:min(100%,650px);margin-top:44px}.hero-quick-row .quick-card{grid-template-columns:auto 1fr}.inner-hero{grid-template-columns:1fr;gap:55px;min-height:auto;padding-top:75px;padding-bottom:75px}.inner-hero:before{width:500px;height:500px;right:-100px;top:20px}.inner-intro h1{font-size:clamp(48px,9vw,72px)}.inner-note-section{padding-left:24px;padding-right:24px}
}
@media(max-width:560px){
  .hero{padding-top:12px}.hero:before{width:440px;height:440px;top:5px}.quote-stage{padding:20px 6px 0}.hero-quick-row{margin-top:38px;gap:14px}.hero-quick-row .quick-card{padding:21px}.inner-hero{padding-top:55px;padding-bottom:65px;gap:40px}.inner-intro h1{font-size:47px}.inner-intro>p{font-size:13px;line-height:1.75}.inner-note-section{padding-top:60px;padding-bottom:60px}.inner-note h2{font-size:35px}.inner-note p{font-size:13px}
}

/* V11: the homepage already links to Daily Joy and Spread the Joy above, so the bottom yellow link band is intentionally removed. */
.band{display:none!important}

/* V11: sharing belongs to the Joy Jar card so the dropdown never collides with the quick links below. */
.quote-card{overflow:visible}
.quote-share{position:relative;z-index:12;margin-top:24px}
.quote-share .share-menu{position:relative;width:max-content}
.quote-share .share-dropdown{z-index:30;top:auto;bottom:calc(100% + 9px);left:0}
.card-actions{justify-content:center;margin-top:24px;z-index:6}
.shuffle-btn{border:1px solid #d9d6cd;background:rgba(255,255,255,.88);color:var(--ink);cursor:pointer;padding:12px 18px;border-radius:999px;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 4px 12px rgba(17,17,15,.05);transition:transform .18s,box-shadow .18s,background .18s}
.shuffle-btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(17,17,15,.08);background:#fff}
.shuffle-icon{font-size:18px;line-height:1;color:#8e7d39}
@media(max-width:560px){
  .quote-share{margin-top:20px}
  .shuffle-btn{font-size:10px;padding:11px 15px}
}

/* Admin authentication is deliberately separate from the moderation dashboard. */
.admin-login-page{min-height:100vh;background:var(--paper)}
.admin-login-shell{max-width:1120px;margin:auto;padding:34px 28px 80px;min-height:100vh;display:flex;flex-direction:column}
.admin-back-link{color:var(--muted);font-size:12px;text-decoration:none;width:max-content}.admin-back-link:hover{color:var(--ink)}
.admin-login-card{width:min(430px,100%);margin:auto;padding-bottom:8vh}
.admin-login-card h1{font-family:var(--display);font-size:clamp(48px,6vw,68px);line-height:1;letter-spacing:-.035em;margin:10px 0 12px}
.admin-login-subtitle{color:var(--muted);font-size:14px;line-height:1.6;margin:0 0 26px}
.login-message{min-height:18px;color:#8a4b3f;font-size:12px;margin:12px 0 0}
.moderation-header{max-width:1120px;margin:auto;padding:30px 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.moderation-brand{display:flex;align-items:baseline;gap:10px;color:var(--ink);font-size:12px;font-weight:700;letter-spacing:.02em}.moderation-brand .eyebrow{margin:0}
.moderation-header .nav-links{display:flex;gap:24px}.moderation-header .nav-links a{color:var(--ink);text-decoration:none;font-size:12px;font-weight:600}.moderation-header .nav-links a:hover{text-decoration:underline;text-underline-offset:4px}
.moderation-page .admin-main{padding-top:55px}
@media(max-width:760px){
 .admin-login-shell{padding:24px 20px 60px}.admin-login-card{margin-top:auto;margin-bottom:auto}.moderation-header{padding:24px 20px;align-items:flex-start;gap:20px}.moderation-header .nav-links{gap:14px}.moderation-page .admin-main{padding:42px 20px 80px}
}


/* Version 13 — stable Joy Jar + dynamic quote typography */
.joy-letter {
  min-height: 520px;
  height: 520px;
  display: flex;
  flex-direction: column;
}
.letter-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#dailyQuote {
  transition: font-size .22s ease, line-height .22s ease;
  max-height: 245px;
  overflow: hidden;
  margin-top: 16px;
}
#dailyQuote.quote-fit-xl { font-size: clamp(38px, 4vw, 50px); line-height: 1.14; }
#dailyQuote.quote-fit-lg { font-size: clamp(32px, 3.5vw, 42px); line-height: 1.15; }
#dailyQuote.quote-fit-md { font-size: clamp(27px, 3vw, 35px); line-height: 1.18; }
#dailyQuote.quote-fit-sm { font-size: clamp(23px, 2.6vw, 30px); line-height: 1.2; }
#dailyQuote.quote-fit-xs { font-size: clamp(20px, 2.3vw, 25px); line-height: 1.22; }

@media (max-width: 760px) {
  .joy-letter { min-height: 500px; height: 500px; }
  #dailyQuote { max-height: 220px; }
  #dailyQuote.quote-fit-xl { font-size: 34px; }
  #dailyQuote.quote-fit-lg { font-size: 30px; }
  #dailyQuote.quote-fit-md { font-size: 27px; }
  #dailyQuote.quote-fit-sm { font-size: 24px; }
  #dailyQuote.quote-fit-xs { font-size: 21px; }
}

/* Secondary-page headings/labels should read as charcoal, not metallic gold. */
.secondary-page .eyebrow,
.secondary-page h1,
.secondary-page h2,
.secondary-page .page-title,
.secondary-page .section-title {
  color: var(--sage) !important;
}

/* Version 14 — explicit quote state controls */
.quote-status{display:inline-block;margin-top:9px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.status-enabled{color:#4f7a52}.status-disabled{color:#8a6660}
.admin-actions .state-btn{min-width:82px;border:1px solid transparent;padding:8px 11px;border-radius:4px;font:600 11px "DM Sans";cursor:pointer}.admin-actions .state-btn:disabled{cursor:default;opacity:1}
.state-enable{background:#dfeee1!important;color:#315d36;border-color:#bfd8c2!important}.state-disable{background:#f3e6cf!important;color:#725a2b;border-color:#e1cca1!important}.state-selected-enabled{background:#4f7a52!important;color:#fff;border-color:#4f7a52!important}.state-selected-disabled{background:#8a6660!important;color:#fff;border-color:#8a6660!important}
.admin-actions .delete-btn{background:#c94b4b!important;color:#fff;border-color:#b83e3e!important}.admin-actions .delete-btn:hover{background:#ae3838!important}

/* Version 15 — moderation actions */
.admin-actions .approve-btn {
  background: #4f8a57;
  color: #fff;
  border: 1px solid #43784a;
}
.admin-actions .approve-btn:hover {
  background: #3f7447;
}
.admin-actions .deny-btn {
  background: #c94b4b;
  color: #fff;
  border: 1px solid #b83e3e;
}
.admin-actions .deny-btn:hover {
  background: #ae3838;
}

/* Remove the old gold treatment from "Find You" / "Your Words" style
   secondary-page text wherever those shared styles are used. */
.secondary-page .eyebrow,
.secondary-page h1,
.secondary-page h2,
.secondary-page h3,
.secondary-page .page-title,
.secondary-page .section-title,
.secondary-page .highlight,
.secondary-page .accent,
.secondary-page .gold,
.secondary-page .gold-text,
.secondary-page [class*="gold"],
.secondary-page [class*="accent"] {
  color: var(--sage) !important;
}
.secondary-page a {
  color: var(--ink);
}

/* Version 16 — sage accent and warmer wording */
.secondary-page .eyebrow,
.secondary-page .highlight,
.secondary-page .accent,
.secondary-page .gold,
.secondary-page .gold-text,
.secondary-page [class*="gold"],
.secondary-page [class*="accent"] {
  color: var(--sage) !important;
}
.secondary-page .page-title,
.secondary-page .section-title {
  color: var(--ink) !important;
}
.sage-accent,
.accent-text,
.highlight-text {
  color: var(--sage) !important;
}

/* Version 17 — neutral charcoal text treatment */
.secondary-page .eyebrow,
.secondary-page .highlight,
.secondary-page .accent,
.secondary-page .gold,
.secondary-page .gold-text,
.secondary-page [class*="gold"],
.secondary-page [class*="accent"],
.sage-accent,
.accent-text,
.highlight-text {
  color: var(--ink) !important;
}

/* Version 18 — make subscribe CTA text explicitly white */
.subscribe-section .dark-button,
.subscribe-form .dark-button,
.subscribe-section button[type="submit"],
.subscribe-form button[type="submit"] {
  background: var(--ink) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
.subscribe-section .dark-button:hover,
.subscribe-form .dark-button:hover {
  color: #fff !important;
}

/* Version 19 — explicit moderation action colours */
.admin-actions .approve-btn {
  background-color: #4f8a57 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid #3f7447 !important;
}
.admin-actions .approve-btn:hover {
  background-color: #3f7447 !important;
  color: #ffffff !important;
}
.admin-actions .deny-btn,
.admin-actions .delete-btn {
  background-color: #c94b4b !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid #ae3838 !important;
}
.admin-actions .deny-btn:hover,
.admin-actions .delete-btn:hover {
  background-color: #ae3838 !important;
  color: #ffffff !important;
}

/* Version 20 — Waiting for Review buttons */
#pendingPanel .admin-actions .approve-btn {
  background-color: #3f8a4b !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid #32733d !important;
  border-radius: 2px;
  padding: 9px 14px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
#pendingPanel .admin-actions .approve-btn:hover {
  background-color: #32733d !important;
}
#pendingPanel .admin-actions .deny-btn {
  background-color: #d13f3f !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid #b72f2f !important;
  border-radius: 2px;
  padding: 9px 14px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
#pendingPanel .admin-actions .deny-btn:hover {
  background-color: #b72f2f !important;
}

/* Version 21 — simple section counts */
.admin-heading .stats {
  display: none !important;
}
.admin-tabs span {
  display: none !important;
}
.panel-intro h2 {
  display: flex;
  align-items: center;
  gap: 9px;
}
.section-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 25px;
  height: 25px;
  padding: 0 7px;
  border-radius: 999px;
  background: #f1f0e8;
  color: var(--ink);
  font-family: "DM Sans", sans-serif;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

/* Version 22 — subscriber removal */
.subscriber-row {
  align-items: center;
}
.subscriber-row > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.subscriber-date {
  color: var(--muted);
  font-size: 11px;
}
.subscriber-delete-btn {
  background: #d13f3f !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border: 1px solid #b72f2f !important;
  padding: 9px 13px;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  border-radius: 2px;
}
.subscriber-delete-btn:hover {
  background: #b72f2f !important;
}

/* Version 25 functionality: quote edit action */
.edit-btn{
  background:#e7e5dc !important;
  color:var(--ink) !important;
  -webkit-text-fill-color:var(--ink) !important;
  border:1px solid #d2d0c5 !important;
}
.edit-btn:hover{background:#dcd9cc !important}

/* Version 35 — copy sharing icon */
.share-dropdown button .share-option-icon{
  display:inline-flex;
  width:20px;
  margin-right:8px;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
  vertical-align:-2px;
}
.copy-icon{font-weight:600;}

/* Version 39 — simplify the public navigation and make the secondary-page highlights feel more joyful. */
.nav-subscribe{display:none!important}
.secondary-page .inner-intro h1 span,
.secondary-page .section-copy h2 span,
.secondary-page .submit-copy h2 span{
  color:var(--yellow-strong)!important;
  -webkit-text-stroke:1.2px var(--ink);
  text-shadow:1px 1px 0 var(--ink), -1px -1px 0 var(--ink), 1px -1px 0 var(--ink), -1px 1px 0 var(--ink);
}
/* Version 41 — centre the homepage content properly on mobile.
   The desktop hero keeps its three-column layout; mobile collapses it to one centred column. */
@media(max-width:850px){
  .hero{
    grid-template-columns:1fr;
    grid-template-rows:auto auto;
    justify-items:center;
  }
  .quote-stage{
    order:0;
    grid-column:1;
    width:min(100%,680px);
  }
  .hero-quick-row{
    order:1;
    grid-column:1;
    width:min(100%,650px);
  }
}


/* Version 42 — prevent any horizontal page movement on mobile. */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}
@media(max-width:850px){
  .page,
  .hero,
  .quote-stage,
  .hero-quick-row{
    max-width:100%;
  }
  .hero{
    overflow-x:hidden;
  }
}

/* Version 43 — keep the Spread the Joy heading fully visible on narrow screens. */
.submit-page-hero .inner-intro h1{
  max-width:100%;
  overflow-wrap:break-word;
  word-break:normal;
}
@media(max-width:560px){
  .submit-page-hero .inner-intro h1{
    font-size:clamp(34px,10.5vw,47px);
    line-height:.98;
  }
}


/* Version 44 — keep secondary-page content inside the mobile viewport. */
@media(max-width:850px){
  .inner-hero{
    grid-template-columns:minmax(0,1fr);
  }
  .inner-intro,
  .inner-form{
    min-width:0;
    width:100%;
  }
  .submit-page-hero .inner-intro h1,
  .submit-page-hero .inner-intro > p,
  .submit-page-hero .hand-note{
    max-width:100%;
    min-width:0;
  }
}
@media(max-width:560px){
  .submit-page-hero .inner-intro h1{
    font-size:clamp(30px,9.5vw,40px);
    line-height:1;
    letter-spacing:-.04em;
  }
}


/* Version 45 — add a compact mobile navigation menu. */
.mobile-menu-toggle{
  display:none;
  border:0;
  background:transparent;
  width:42px;
  height:42px;
  padding:8px;
  cursor:pointer;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  z-index:31;
}
.mobile-menu-toggle span{
  display:block;
  width:21px;
  height:2px;
  background:var(--ink);
  border-radius:2px;
  transition:transform .18s ease, opacity .18s ease;
}
.mobile-menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mobile-menu-toggle.is-open span:nth-child(2){opacity:0}
.mobile-menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{
  display:none;
}
@media(max-width:850px){
  .nav{position:relative}
  .mobile-menu-toggle{display:flex;justify-self:end}
  .mobile-menu{
    position:absolute;
    top:70px;
    left:16px;
    right:16px;
    background:var(--paper);
    border:1px solid var(--line);
    border-top:0;
    padding:10px 0 12px;
    z-index:30;
    box-shadow:0 10px 22px rgba(0,0,0,.08);
  }
  .mobile-menu:not([hidden]){display:flex;flex-direction:column}
  .mobile-menu a{
    color:var(--ink);
    text-decoration:none;
    font-size:14px;
    font-weight:700;
    padding:14px 20px;
  }
  .mobile-menu a:hover,.mobile-menu a:focus{background:rgba(255,238,168,.45)}
}
@media(max-width:560px){
  .mobile-menu-toggle{width:40px;height:40px}
  .mobile-menu{top:70px;left:16px;right:16px}
}

/* Version 46 — refined minimalist joy card and mobile-first homepage hierarchy. */
.hero{display:flex;flex-direction:column;align-items:center;min-height:0;padding-top:78px;padding-bottom:90px}
.hero:before{width:760px;height:760px;left:50%;top:150px}
.hero-intro{max-width:820px;text-align:center;margin:0 auto 44px;position:relative;z-index:2}
.hero-intro .eyebrow{margin-bottom:14px}
.hero-intro h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(50px,6vw,78px);line-height:.98;letter-spacing:-.045em;margin:0 0 20px;font-weight:700}
.hero-intro h1 span{color:#d7b82f;font-family:var(--hand);font-size:1.05em;font-weight:400;margin-left:6px}
.hero-intro p{max-width:650px;margin:0 auto;color:var(--muted);font-size:15px;line-height:1.75}
.hero-side-note,.scroll-note{display:none!important}
.quote-stage{width:min(100%,760px);padding:0;position:relative}
.yellow-blob{width:300px;height:210px;right:-40px;bottom:-20px;opacity:.65}
.dot-spray{width:120px;height:120px;right:-10px;bottom:105px;opacity:.45}
.quote-card{background:rgba(255,255,255,.92);border:1px solid #e8e2d5;box-shadow:0 20px 45px rgba(17,17,15,.08);padding:30px 36px 28px;transform:none;min-height:0;border-radius:16px;display:flex;flex-direction:column;justify-content:flex-start;overflow:visible}
.quote-card:after{border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.55),transparent 45%,rgba(247,239,219,.1));}
.tape,.quote-top,.quote-signoff{display:none!important}
.quote-heart{width:54px;height:54px;border-radius:50%;background:var(--yellow-strong);display:grid;place-items:center;font-size:21px;position:relative;z-index:2;margin-bottom:24px}
.quote-card blockquote{font-family:Georgia,"Times New Roman",serif;font-size:clamp(30px,4vw,46px);line-height:1.08;letter-spacing:-.025em;text-align:center;margin:10px auto 14px;max-width:600px;min-height:0}
.quote-author{font-size:13px;color:var(--muted);font-weight:500;text-align:center;margin:0;position:relative;z-index:1}
.quote-actions{display:flex;align-items:center;justify-content:center;gap:18px;border-top:1px solid #e4dfd3;margin-top:28px;padding-top:20px;position:relative;z-index:4}
.shuffle-btn{border:0;cursor:pointer;padding:13px 20px;border-radius:999px;background:var(--yellow-strong);color:var(--ink);font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 3px 0 #dec45a;transition:transform .18s,box-shadow .18s}
.shuffle-btn:hover{transform:translateY(-2px);box-shadow:0 5px 0 #dec45a}
.shuffle-icon{font-size:19px;line-height:1}
.quote-actions .share-menu{position:relative}
.quote-actions .share-toggle{border-radius:999px;padding:12px 18px;background:#fff;border:1px solid #d9d6cd;color:var(--ink);box-shadow:none}
.quote-actions .share-dropdown{left:auto;right:0;top:calc(100% + 9px)}
.hero-quick-row{width:min(100%,900px);margin-top:55px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hero-quick-row .quick-card{height:100%}
@media(max-width:850px){
  .hero{padding-top:42px;padding-bottom:65px}
  .hero:before{width:560px;height:560px;top:120px}
  .hero-intro{padding:0 8px;margin-bottom:30px}
  .hero-intro .eyebrow{font-size:9px;margin-bottom:12px}
  .hero-intro h1{font-size:clamp(40px,10vw,56px);line-height:1.02;margin-bottom:16px}
  .hero-intro p{font-size:13px;line-height:1.65}
  .quote-stage{width:100%;padding:0 4px}
  .quote-card{padding:24px 20px 22px;border-radius:14px}
  .quote-heart{width:48px;height:48px;font-size:19px;margin-bottom:18px}
  .quote-card blockquote{font-size:clamp(26px,7vw,36px);line-height:1.1;margin:5px auto 12px}
  .quote-author{font-size:11px}
  .quote-actions{gap:8px;margin-top:22px;padding-top:16px}
  .shuffle-btn{padding:11px 13px;font-size:10px;white-space:nowrap}
  .quote-actions .share-toggle{padding:10px 13px;font-size:10px;white-space:nowrap}
  .hero-quick-row{grid-template-columns:1fr;width:100%;margin-top:34px;gap:14px}
}
@media(max-width:390px){
  .hero-intro h1{font-size:39px}
  .quote-card{padding-left:16px;padding-right:16px}
  .quote-card blockquote{font-size:25px}
  .quote-actions{gap:6px}
  .shuffle-btn{padding-left:11px;padding-right:11px}
  .quote-actions .share-toggle{padding-left:11px;padding-right:11px}
}

/* Version 47 — simplify the joy card, keep its size stable, and improve mobile scrolling. */
.quote-card{
  height:420px;
  min-height:420px;
}
/* Version 48 — bring today's date back into the quote card without changing its fixed size. */
.quote-date{
  position:absolute;
  top:18px;
  right:22px;
  z-index:3;
}
.quote-date span{
  display:inline-block;
  border:1px solid #d9d6cd;
  border-radius:999px;
  padding:7px 10px;
  color:var(--muted);
  background:rgba(255,255,255,.8);
  font-size:10px;
  font-weight:700;
  white-space:nowrap;
}
.quote-card blockquote{
  height:150px;
  min-height:150px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.quote-heart{display:none!important}
.hero-intro h1 span{display:none!important}
.quote-actions .share-dropdown{
  top:auto;
  bottom:calc(100% + 9px);
}
html,body{
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior-x:none;
}
body{
  min-height:100vh;
  touch-action:pan-y;
}
@media(max-width:850px){
  .quote-date{top:13px;right:16px}
  .quote-date span{font-size:8px;padding:6px 8px}
  .quote-card{
    height:315px;
    min-height:315px;
  }
  .quote-card blockquote{
    height:115px;
    min-height:115px;
  }
  .quote-actions .share-dropdown{
    bottom:calc(100% + 8px);
  }
}
@media(max-width:390px){
  .quote-card{
    height:300px;
    min-height:300px;
  }
  .quote-card blockquote{
    height:105px;
    min-height:105px;
  }
}


/* Version 49 — robust quote fitting, matching share icon, and natural page scrolling. */
#dailyQuote{
  overflow:hidden;
  overflow-wrap:break-word;
  word-break:normal;
  max-width:100%;
}
.quote-actions .share-toggle .button-icon{
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 18px;
}
.share-symbol svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
html{
  overflow-x:hidden;
  overflow-y:auto;
  scroll-behavior:auto;
}
body{
  overflow-x:hidden;
  overflow-y:auto;
  min-height:100%;
  touch-action:auto;
  -webkit-overflow-scrolling:touch;
}
main{overflow:visible;}
@media(max-width:850px){
  .hero{overflow:visible;min-height:auto;}
  .hero-quick-row{align-items:start;}
  .hero-quick-row .quick-card{height:auto;min-height:0;}
  .quote-card{overflow:visible;}
}

/* Version 50 — keep mobile quick cards in normal document flow. */
@media(max-width:850px){
  .hero-quick-row{height:auto;}
  .hero-quick-row .quick-card{height:auto;align-self:start;}
  footer{position:relative;z-index:1;margin-top:0;clear:both;}
}


/* Version 51 — fresh random quote on each visit and a simple line share icon. */
.share-symbol{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
}
.share-symbol svg{
  width:18px;
  height:18px;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Version 52 — align the secondary public pages with the refined homepage style. */
.secondary-page .inner-hero{
  min-height:0;
  padding-top:78px;
  padding-bottom:88px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:38px;
  position:relative;
}
.secondary-page .inner-hero:before{
  width:760px;
  height:760px;
  right:auto;
  left:50%;
  top:120px;
  transform:translateX(-50%);
  background:radial-gradient(circle,#fff9df 0 52%,rgba(255,236,165,.36) 67%,transparent 74%);
}
.secondary-page .inner-intro{
  width:min(100%,820px);
  text-align:center;
  position:relative;
  z-index:2;
}
.secondary-page .inner-intro .eyebrow{
  margin-bottom:14px;
}
.secondary-page .inner-intro h1{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(50px,6vw,78px);
  line-height:.98;
  letter-spacing:-.045em;
  margin:0 0 20px;
  max-width:none;
}
.secondary-page .inner-intro h1 span{
  color:var(--ink)!important;
  -webkit-text-stroke:0;
  text-shadow:none;
}
.secondary-page .inner-intro>p{
  max-width:650px;
  margin:0 auto;
  color:var(--muted);
  font-size:15px;
  line-height:1.75;
}
.secondary-page .hand-note{
  margin:26px auto 0;
  font-size:18px;
}
.secondary-page .inner-form{
  width:min(100%,620px);
  background:rgba(255,255,255,.92);
  border:1px solid #e8e2d5;
  border-radius:16px;
  box-shadow:0 20px 45px rgba(17,17,15,.08);
  padding:34px 38px 36px;
  position:relative;
  z-index:3;
}
.secondary-page .inner-form .form-icon{
  margin:0 auto 18px;
}
.secondary-page .inner-form h2{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(30px,4vw,42px);
  line-height:1.02;
  letter-spacing:-.025em;
  text-align:center;
  margin:0 0 10px;
}
.secondary-page .inner-form>p{
  text-align:center;
  max-width:480px;
  margin-left:auto;
  margin-right:auto;
}
.secondary-page .inner-form label{
  text-align:left;
}
.secondary-page .inner-note-section{
  background:var(--yellow);
  padding:72px 38px;
}
.secondary-page .inner-note{
  max-width:760px;
}
.secondary-page .inner-note h2{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:700;
}

@media(max-width:850px){
  .secondary-page .inner-hero{
    padding-top:42px;
    padding-bottom:65px;
    gap:30px;
  }
  .secondary-page .inner-hero:before{
    width:560px;
    height:560px;
    top:110px;
  }
  .secondary-page .inner-intro{
    padding:0 8px;
  }
  .secondary-page .inner-intro h1{
    font-size:clamp(40px,10vw,56px);
    line-height:1.02;
    margin-bottom:16px;
  }
  .secondary-page .inner-intro>p{
    font-size:13px;
    line-height:1.65;
  }
  .secondary-page .hand-note{
    font-size:16px;
  }
  .secondary-page .inner-form{
    width:100%;
    padding:28px 22px 30px;
    border-radius:14px;
  }
  .secondary-page .inner-form h2{
    font-size:32px;
  }
  .secondary-page .inner-note-section{
    padding:58px 22px;
  }
}

/* Version 52 — give the quote a little more visual presence while retaining automatic fitting. */
.quote-card blockquote{
  font-size:clamp(32px,4.2vw,48px);
}
@media(max-width:850px){
  .quote-card blockquote{
    font-size:clamp(29px,7.5vw,39px);
  }
}
@media(max-width:390px){
  .quote-card blockquote{
    font-size:28px;
  }
}

/* Version 53 — reset quote fitting from the CSS base size on every refresh. */
#dailyQuote{max-width:100%;}

/* Version 54 — make quote fitting use a real fixed text area inside the fixed card. */
.quote-card blockquote{
  width:100%;
  box-sizing:border-box;
  height:235px;
  min-height:235px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
@media(max-width:850px){
  .quote-card blockquote{
    height:235px;
    min-height:235px;
    width:100%;
  }
}
@media(max-width:390px){
  .quote-card blockquote{
    height:235px;
    min-height:235px;
  }
}


/* Version 55 — keep the fixed quote card compact enough to contain date, quote, author and actions. */
.quote-card{height:420px;min-height:420px;box-sizing:border-box;}
.quote-card blockquote{height:170px;min-height:170px;margin-top:42px;margin-bottom:8px;}
@media(max-width:850px){
  .quote-card{height:420px;min-height:420px;padding-top:24px;padding-bottom:18px;}
  .quote-card blockquote{height:165px;min-height:165px;margin-top:42px;margin-bottom:6px;}
  .quote-author{margin-top:0;}
  .quote-actions{margin-top:14px;padding-top:14px;}
}
@media(max-width:390px){
  .quote-card{height:420px;min-height:420px;}
  .quote-card blockquote{height:155px;min-height:155px;margin-top:42px;}
  .quote-actions{margin-top:12px;padding-top:12px;}
}

/* Version 55 — prevent the browser from serving stale public assets during local testing. */

/* Version 56 — reduce the mobile quote card height while keeping all quote content inside. */
@media(max-width:850px){
  .quote-card{
    height:360px;
    min-height:360px;
  }
  .quote-card blockquote{
    height:145px;
    min-height:145px;
    margin-top:36px;
    margin-bottom:4px;
  }
  .quote-actions{
    margin-top:10px;
    padding-top:12px;
  }
}
@media(max-width:390px){
  .quote-card{
    height:360px;
    min-height:360px;
  }
  .quote-card blockquote{
    height:140px;
    min-height:140px;
    margin-top:34px;
  }
}

/* Version 60 — pencil icon for Spread the Joy */
.form-icon.pencil{font-size:26px;line-height:1}.pencil-mark{font-size:24px!important;}


/* Version 61 — replace emoji-style public icons with simple line icons. */
.quick-icon svg, .form-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: var(--ink);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.quick-icon.envelope-icon svg, .form-icon.envelope-icon svg { width: 22px; height: 22px; }
.quick-icon.pencil-icon svg { width: 21px; height: 21px; }
.footer-heart { display:inline-block; vertical-align:-2px; margin-left:3px; font-family:inherit; line-height:1; }
.form-icon.envelope-icon { font-size:0; }
.quick-icon.envelope-icon, .quick-icon.pencil-icon { font-size:0; }


/* Version 63 — remove decorative icons from the bottom note sections. */
.secondary-page .inner-note .note-mark{display:none;}

.admin-email-test{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:center;margin-bottom:28px;padding:26px 28px;}
.admin-email-test .eyebrow{margin-bottom:8px;}
.admin-email-test h2{font-family:var(--display);font-size:32px;line-height:1.05;margin:0 0 8px;}
.admin-email-test p{color:var(--muted);font-size:12px;line-height:1.6;margin:0;}
.admin-email-test-form label{display:block;font-size:11px;font-weight:700;color:#49473f;}
.admin-email-test-form input{width:100%;margin-top:7px;border:1px solid #d8d5cd;background:#fffdf8;padding:13px 14px;border-radius:7px;outline:none;color:var(--ink);font-size:12px;box-sizing:border-box;}
.admin-email-test-form input:focus{border-color:#c8aa36;box-shadow:0 0 0 4px rgba(255,220,88,.2);}
.admin-email-test-form .admin-button{margin-top:10px;}
.admin-email-test-form .admin-button:disabled{opacity:.65;cursor:wait;}
@media(max-width:700px){.admin-email-test{grid-template-columns:1fr;gap:18px;padding:22px 20px;}}


.weekly-send-actions { display:flex; flex-direction:column; align-items:flex-start; gap:10px; min-width:220px; }
.weekly-send-actions .form-message { margin:0; }
@media (max-width:700px){ .weekly-send-actions { min-width:0; width:100%; } }


/* Subscription email heads-up */
.email-note{
  margin:20px 0 0;
  padding:18px 18px 16px;
  border:1px solid #eee9d8;
  border-radius:16px;
  background:#fffdf5;
  text-align:left;
  font-size:13px;
  line-height:1.6;
}
.email-note strong{
  display:block;
  margin:0 auto 8px;
  text-align:center;
  font-size:14px;
  line-height:1.3;
}
.email-note p{
  margin:0 0 9px;
}
.email-note p:last-child{
  margin-bottom:0;
}