/* The home page on paper; the colour tokens of both themes live in app.css. */
.wordmark{font-family:var(--font-serif);font-weight:400}
.brand-spark{font-size:22px;margin-right:3px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.is-home .workspace{position:relative}
.is-home .site-header{position:absolute;z-index:2;left:0;right:0;height:88px;width:min(100% - 80px,1180px);max-width:none;border-bottom:1px solid var(--line)}
.is-home .site-header>.wordmark{color:var(--ink);font-size:28px}

.is-home .header-caption{display:none}
.is-home .profile-avatar{margin-left:auto;background:var(--soft);color:var(--accent);box-shadow:none}
.is-home .main,.onboarding.is-home .main{width:100%;max-width:none;margin:0;min-height:0}
.is-home .site-footer{max-width:1180px;width:min(100% - 80px,1180px);margin-top:36px}
.moon-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--bg);color:var(--ink);min-height:0}
/* The home as the server sends it (views/app.php): the heading, the lead and the cover on a full screen of paper until app.js adds the form. */
.main[aria-busy=true] .moon-hero{min-height:100vh}

.moon-hero-inner{width:min(100% - 80px,1180px);margin:auto;padding:137px 0 43px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);column-gap:48px;align-items:start}.moon-hero-inner>*{grid-column:1/-1}.moon-hero-inner>h1,.moon-lead{grid-column:1}
.moon-hero h1{font-size:64px;line-height:1.05;color:var(--accent);max-width:760px;font-weight:700;overflow-wrap:normal}
.moon-hero h1>span{display:block;font-size:28px;line-height:1.35;font-weight:400;color:var(--ink);margin-top:8px}
.moon-lead{font-size:18px;line-height:1.6;max-width:560px;color:var(--ink);margin-top:22px}.moon-note{max-width:790px;margin-top:20px;font-size:17px;line-height:1.5;color:var(--muted)}.moon-cover{grid-column:2;grid-row:1/span 2;align-self:center;display:block;width:100%;height:auto}
/* The form card stays light in both themes: its own copy of the light tokens. */
.moon-form{--form-muted:#52485e;--accent:#7a2140;--accent-hover:#5f1831;--accent-ink:#fff;--link:#2e4a9a;--soft:#f5e8e4;color-scheme:light;background:var(--white);border:1px solid #e6dccd;border-radius:var(--radius);padding:13px;margin:26px 0 0;max-width:790px;box-shadow:none;color:#2a2140}
.moon-form-fields{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr) minmax(0,1.25fr);gap:12px;align-items:stretch}
.moon-name,.moon-birthday{background:#fffdfa;border:1px solid #948675;border-radius:var(--radius-s);padding:8px 12px 7px;min-width:0;margin:0}
.moon-form .field-label{display:block;font-size:16px;line-height:1.4;color:var(--form-muted);margin:0 0 2px;padding:0}
.moon-form .field-label small{font-size:16px;color:var(--form-muted);margin-left:3px}
.moon-birthday{position:relative;padding-top:25px}
.moon-birthday legend{float:left;position:absolute;top:8px;left:12px;width:auto}
.moon-form input{border:0;width:100%;min-width:0;min-height:27px;background:transparent;color:#2a2140;padding:0;border-radius:var(--radius-s);font-size:16px;line-height:1.5;outline-offset:2px}
.moon-form input::placeholder{color:var(--form-muted);opacity:1}
.moon-birth-fields{display:grid;grid-template-columns:40px 8px 48px 8px minmax(52px,1fr);gap:2px;align-items:end;max-width:200px}.moon-birth-fields>label{display:flex;flex-direction:column;min-width:0}
.moon-birth-fields>span{color:var(--form-muted);line-height:27px;text-align:center}
.moon-form .birth-part{color:var(--form-muted)}
.moon-submit{white-space:nowrap;padding:12px;min-height:60px}
.moon-submit svg{width:18px;height:18px}
.moon-form .consent-field{grid-column:1/-1;order:1;margin:-4px 3px 0;color:#52485e;font-size:16px}.moon-form .help{grid-column:1/-1;order:1;margin:0 3px}.moon-form .consent-field input{width:20px;height:20px;min-height:0}.moon-form .consent-field small{color:var(--form-muted);font-size:16px}.moon-form .consent-field a{color:var(--link)}
.moon-form .form-error:empty{display:none}
.moon-form .form-error{margin:10px 3px 0;font-size:16px;color:#9c3155}
.home-content{width:min(100% - 80px,1080px);margin:auto}
.home-daily{padding-top:58px;scroll-margin-top:24px}
.home-section-heading h2{font-size:36px;line-height:1.2;color:var(--ink)}
.home-section-heading>.eyebrow{margin-bottom:12px}
.home-section-heading>p{font-size:16px;color:var(--muted);margin-top:10px;max-width:650px}
.love-layout{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:70px;align-items:center;margin-top:28px}
.love-card-column{min-width:0}
.love-card-meta{font-size:16px;color:var(--muted);margin-bottom:12px;display:flex;gap:8px}
.love-card{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)}
.love-card-image{display:block;width:100%;height:auto;aspect-ratio:4/5}
.love-card-image[hidden],.love-card-loading[hidden]{display:none}
.love-card-link{display:block;position:relative;color:var(--ink);text-decoration:none;aspect-ratio:4/5;background:var(--paper)}
.love-card-link:focus-visible{outline:3px solid var(--accent);outline-offset:-5px;border-radius:var(--radius-s)}
.love-card-loading{display:grid;place-items:center;text-align:center;min-height:100%;padding:32px;font-size:16px;line-height:1.6;color:var(--muted);background:var(--paper)}
.friend-card-entry{margin-top:22px;max-width:100%;white-space:normal}
.friend-card-entry svg{flex-shrink:0}
.person-item{flex-wrap:wrap}
.person-gift-button{flex-basis:100%;justify-content:center;border-top:1px solid var(--line);padding-top:12px;margin-top:4px;min-height:44px;font-size:16px}
.gift-portrait-page{max-width:760px;margin:auto}
/* /p/: the card (at most ~280px tall), at once the date form, then the reading. */
.main[data-page^="gift/p/"]{margin-top:18px}
.gift-portrait-card{width:min(100%,460px);margin:0 auto 34px}
.gift-portrait-card>.love-card{width:224px;max-width:100%;margin:0 auto}
.gift-portrait-card>.gift-date-form{margin-top:16px;scroll-margin-top:16px}
@media(max-height:700px){.gift-portrait-card>.love-card{width:160px}}
.gift-portrait-page>.page-heading{margin-bottom:20px}
.gift-reshare{margin:24px 0 0}
/* A returning visitor's /gift/ card: the block alone, without the home hero and its date form. */
.gift-known .home-daily{padding-top:0}
.home-section-heading h1{font-size:36px;line-height:1.2;color:var(--ink)}
.gift-portrait-summary>h2,.gift-portrait-details>h2,.gift-own-invitation>h2{font-family:var(--font-serif);font-size:28px;line-height:1.25;font-weight:400;margin-top:9px}
.gift-portrait-summary>.portrait-insights{margin-top:20px}
.gift-portrait-details{margin-top:38px}
.gift-reading{border-bottom:1px solid var(--line)}
.gift-reading>summary{font-family:var(--font-serif);cursor:pointer;font-size:22px;line-height:1.4;padding:22px 0;min-height:64px;overflow-wrap:anywhere;display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none}.gift-reading>summary::-webkit-details-marker{display:none}.gift-reading>summary:after{content:"";width:18px;height:18px;flex-shrink:0;background:var(--accent);-webkit-mask:var(--icon-plus) center/contain no-repeat;mask:var(--icon-plus) center/contain no-repeat}.gift-reading[open]>summary:after{-webkit-mask-image:var(--icon-minus);mask-image:var(--icon-minus)}
.gift-reading>div{padding-bottom:20px}
.gift-reading-intro{font-size:18px;line-height:1.6;color:var(--ink);max-width:62ch;margin-bottom:20px}
.gift-reading-owner-note{color:var(--muted);font-size:16px;line-height:1.6;margin-top:14px;margin-bottom:8px}
.gift-reading .content-section{margin-top:23px}
.gift-reading .content-section p{white-space:pre-line}
.gift-own-invitation{margin-top:36px;padding:26px;border:1px solid var(--line);border-radius:var(--radius);background:var(--soft)}
.gift-own-invitation>p{color:var(--muted);line-height:1.6;margin-top:12px;margin-bottom:20px}
.gift-own-invitation>.text-button{display:flex;margin-top:15px}
.gift-date-form{margin-top:22px;padding:22px;border:1px solid var(--line);border-radius:var(--radius);background:var(--soft)}
.gift-date-form>h2{font-family:var(--font-serif);font-size:22px;line-height:1.3;font-weight:400;margin:0;overflow-wrap:anywhere}
.gift-date-form>p:not(.form-error):not(.field-hint){color:var(--muted);line-height:1.6;margin:10px 0 0}
.gift-date-fields{border:0;padding:0;margin:16px 0 0;min-width:0}
.gift-date-fields>.field-label{margin:0 0 7px;padding:0}
.gift-birth-fields{display:grid;grid-template-columns:minmax(0,1fr) 8px minmax(0,1fr) 8px minmax(0,1.6fr);gap:4px;align-items:end}.gift-birth-fields>label{display:flex;flex-direction:column;gap:4px;min-width:0}
.gift-birth-fields>span{color:var(--muted);text-align:center;line-height:52px}
.gift-birth-fields .field{min-height:52px;padding-inline:6px;font-size:18px;text-align:center}
.gift-date-form>.button{width:100%;margin-top:14px}
.gift-date-form>.field-hint{text-align:center}
@media(max-width:650px){.gift-portrait-card{margin-bottom:30px}.gift-portrait-summary>h2,.gift-portrait-details>h2,.gift-own-invitation>h2{font-size:28px}.gift-reading>summary{font-size:22px;padding-block:19px}.gift-own-invitation{padding:20px}.gift-own-invitation>.button{width:100%;font-size:16px;padding-inline:10px}
  .gift-portrait-card>.gift-date-form{padding:16px 16px 14px;margin-top:14px}.gift-date-form>h2{font-size:22px}.gift-date-form>p:not(.form-error):not(.field-hint){font-size:16px;line-height:1.55;margin-top:6px}.gift-date-fields{margin-top:12px}.gift-date-form .consent-field{margin-top:8px;font-size:16px}.gift-date-form>.button{margin-top:10px}.gift-date-form>.field-hint{margin-top:6px}
  .home-section-heading h1{font-size:28px}}
.love-actions{display:grid;margin-top:18px}
.love-share{min-height:51px}
.love-beta-note{font-size:16px;line-height:1.6;color:var(--muted);margin-top:10px;text-align:center}
.love-beta-note{margin-top:5px;opacity:.9}
.love-star{display:block;line-height:1;color:var(--accent);margin-bottom:24px}.love-star svg{width:36px;height:36px}
.love-story h3{font-family:var(--font-serif);font-size:36px;font-weight:400;line-height:1.3;color:var(--love-heading);font-style:italic;max-width:420px}
.love-story>p{font-size:16px;color:var(--muted);line-height:1.6;margin-top:22px;max-width:370px}
.love-story>.text-button{margin-top:19px;font-size:16px}
.home-discover{border-top:1px solid var(--line);padding-top:42px;margin-top:56px}
/* «За каждым числом…»: a contents list without frames — a heading, one line and where it leads (README «Оформление»). */
.home-contents{max-width:760px;margin:20px 0 0;padding:0;list-style:none;border-top:1px solid var(--line)}.home-contents button{display:grid;gap:6px;width:100%;padding:18px 0;border:0;border-bottom:1px solid var(--line);background:none;color:var(--ink);text-align:left}.home-contents strong{font-family:var(--font-serif);font-size:22px;font-weight:400;line-height:1.25}.home-contents-text{font-size:17px;line-height:1.5;color:var(--muted)}.home-contents-link{display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:var(--accent)}.home-contents-link svg{width:16px;height:16px}.home-contents button:hover strong{color:var(--accent)}
.home-shortcuts{display:flex;flex-wrap:wrap;gap:10px 30px;margin-top:23px}
.home-shortcuts .text-button{font-size:16px}
@media(min-width:1000px){.is-home .workspace{padding-bottom:20px}.onboarding .toast{left:50%;max-width:calc(100vw - 50px)}}
@media(max-width:999px){.is-home .site-header{width:calc(100% - 40px);height:76px}.moon-hero{min-height:0}.moon-hero-inner{width:calc(100% - 40px);padding:112px 0 32px;display:block}.moon-cover{width:min(100%,300px);margin:20px auto 0}.moon-hero h1{font-size:48px;max-width:650px}.moon-hero h1>span{font-size:22px}.moon-lead{max-width:530px}.home-content{width:calc(100% - 40px)}.love-layout{gap:35px;grid-template-columns:minmax(0,360px) minmax(0,1fr)}.love-story h3{font-size:28px}.is-home .site-footer{width:calc(100% - 40px)}}
@media(max-width:650px){
  .is-home .site-header{height:69px}.is-home .profile-avatar{width:40px;height:40px;min-height:44px}
  
  .moon-hero-inner{padding-top:95px;padding-bottom:27px}
  .moon-hero h1{font-size:36px;line-height:1.07}
  .moon-hero h1>span{font-size:18px;line-height:1.3;max-width:360px;margin-top:7px}
  .moon-lead{margin-top:17px;max-width:410px}.moon-cover{width:min(100%,250px);margin-top:16px}
  .moon-form{margin-top:22px;padding:10px;max-width:450px}
  .moon-form-fields{grid-template-columns:1fr;gap:8px}
  .moon-form .consent-field,.moon-form .help{order:0}.moon-form .consent-field{margin:0 3px}
  .moon-name{padding:7px 11px}.moon-birthday{padding:23px 11px 6px}.moon-birthday legend{top:7px;left:11px}
  .moon-birth-fields{grid-template-columns:44px 8px 52px 8px minmax(64px,1fr);max-width:260px;gap:4px}
  .moon-submit{min-height:50px}
  .home-daily{padding-top:35px}
  .home-section-heading h2{font-size:28px}.home-section-heading>.eyebrow{margin-bottom:9px}
  .home-section-heading>p{font-size:16px;line-height:1.65;margin-top:9px}
  .love-layout{display:flex;flex-direction:column;gap:25px;margin-top:22px;align-items:stretch}
  .love-card-column{max-width:420px;width:100%;align-self:center}.love-card-meta{margin-bottom:11px}
  .love-actions{margin-top:14px}.love-share{min-height:49px}
  .love-story{padding:22px 0 0;border-top:1px solid var(--line)}
  .love-star,.love-story h3{display:none}.love-story>p{font-size:16px;line-height:1.6;margin-top:0;max-width:none}
  .love-story>.text-button{margin-top:9px}
  .home-discover{padding-top:30px;margin-top:32px}
  .home-shortcuts{gap:4px 18px}
  .is-home .site-footer{line-height:1.6;margin-top:25px;padding-top:18px}
}

@media(max-width:359px){.is-home .site-header,.moon-hero-inner,.home-content,.is-home .site-footer{width:calc(100% - 32px)}}.gift-own-invitation,.gift-date-form{border:1px solid var(--card-border);background:var(--paper);box-shadow:var(--card-shadow)}
