/* Mini program UI specification V1.0, pages 2–5 and 12.
   Desktop composition and headline treatment are retained. */
@font-face{font-family:Din;src:url('assets/numbers-medium.woff2') format('woff2');font-weight:500;font-display:swap}
:root{
  --ink:#253d35;--green:#254c3b;--deep:#254c3b;
  --primary:#254c3b;--primary-hover:#1d4031;--brand:#427a5b;
  --muted:#7d8a83;--paper:#f8f9f5;--sage:#e8f0df;
  --soft:#f3f7ed;--line:#e1e7d8;--card-line:#e1e7d8;
  --card-icon:#427a5b;--lime:#aec79b;
  --radius-card:22px;--radius-button:13px;--radius-small:10px;
}
body{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;line-height:1.55;color:var(--ink);background:var(--paper)}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #aec79b;outline-offset:4px}
.site-header{background:#254c3bf5;border-bottom-color:#ffffff14}
.site-header .header-inner{height:76px}
.site-header nav a{display:inline-flex;align-items:center;min-height:44px;font-size:13px}
.hero-background,.questions-screen{background-color:var(--deep)}
.hero-background{background-image:linear-gradient(#e8f0df08 1px,transparent 1px),linear-gradient(90deg,#e8f0df08 1px,transparent 1px)}
.hero-background:before{border-color:#e8f0df12}
.hero-copy .highlight:after{background:#aec79b55}
.hero-actions .launch-status,.hero-actions .launch-status:hover{background:var(--lime);color:var(--deep);border-radius:var(--radius-button)}
.hero-art .art-label{color:#e8f0df99}
.hero-art .phone{background:var(--paper);color:var(--ink);box-shadow:12px 24px 42px #102c232b}
.phone-island{background:var(--deep)}
.phone-greeting h2{font-weight:500}
.phone-greeting small,.phone-main-number small,.phone-progress-top,.phone-metrics span{color:var(--muted)}
.phone-greeting>.icon{color:var(--brand)}
.phone-progress{background:linear-gradient(130deg,#f3f7ed,#e8f0df);border:1px solid #dde6d1;border-radius:22px}
.phone-progress-top>span:last-child{background:var(--sage);color:var(--brand)}
.phone-main-number>div>span,.phone-main-number p{color:var(--brand)}
.phone-main-number strong{font-family:Din,sans-serif;font-weight:500;font-variant-numeric:tabular-nums;color:var(--ink)}
.phone-metrics,.phone-metrics>div+div{border-color:var(--line)}
.phone-metrics strong{font-family:Din,sans-serif;font-weight:500;font-variant-numeric:tabular-nums;color:var(--ink)}
.phone-metrics .phone-unit{font-family:-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;font-weight:400}
.phone-help{background:var(--primary);border-radius:13px;color:#fff;box-shadow:none}
.phone-help .icon{color:#aec79b}
.phone-help small{color:#e8f0dfb8}
.phone-people{color:var(--muted)}
.phone-nav{border-color:var(--line)}
.phone-nav>span{color:#9aa59a}
.phone-nav .active{color:var(--brand)}
.floating-note{border:1px solid var(--line);background:var(--paper);border-radius:13px;box-shadow:none}
.floating-note small{color:var(--muted)}
.note-check{background:var(--sage);color:var(--brand)}
.note-sun{background:#f6eee3;color:var(--brand)}
.sparkle{color:var(--brand)}
.features-screen{background:#fff;--card-line:#e1e7d8;--card-icon:#427a5b}
.features-screen .section-intro h2{font-weight:500;line-height:1.55}
.features-screen .section-intro h2 span{color:var(--brand)}
.features-screen .section-intro>p{color:var(--muted);font-size:13px;line-height:1.7}
.features-screen .feature-card{border:1px solid var(--line);border-radius:22px;background:var(--soft);box-shadow:none;padding:24px}
.features-screen .feature-breath{background:var(--sage)}
.features-screen .feature-icon,.features-screen .feature-icon .icon,.features-screen .breath-mini-ring .icon{color:var(--brand)}
.features-screen .feature-icon .icon{stroke-width:1.6}
.features-screen .feature-icon>span{font-family:Din,sans-serif;font-weight:500;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.features-screen .feature-card h3{font-size:18px;font-weight:500;line-height:1.55;color:var(--ink)}
.features-screen .feature-card>p{font-size:13px;line-height:1.7;color:var(--muted)}
.features-screen .feature-caption{font-size:12px;line-height:1.55;color:var(--muted);border-top:1px solid var(--line);padding-top:18px}
.calendar-illustration{font-size:11px;color:var(--muted)}
.calendar-illustration>span{color:var(--muted)}
.calendar-illustration i{background:var(--sage);color:var(--brand)}
.calendar-illustration .today{background:var(--primary);color:white;box-shadow:0 0 0 3px #aec79b;font-weight:500}
.calendar-illustration .future{color:#9aa59a}
.breath-mini-ring{background:#dce8cd;color:var(--brand);box-shadow:0 0 0 9px #e8f0df,0 0 0 17px #f3f7ed}
.breath-preview>span:last-child{font-size:13px;color:var(--brand)}
.breath-preview small{font-size:11px;color:var(--muted)}
.features-screen .chat-illustration p,.features-screen .chat-illustration>div:last-child p{border:1px solid var(--line);font-size:10px;line-height:1.55;padding:8px 10px;border-radius:10px 10px 10px 0;background:#fcfdf9;color:var(--ink)}
.features-screen .chat-illustration>div:last-child p{background:var(--sage);border-radius:10px 10px 0 10px}
.chat-illustration>div:first-child>span{background:#f6eee3;color:#7d8a83}
.chat-illustration>div:last-child>span{background:#dce8cd;color:var(--brand)}
.features-screen .steps article{border-color:var(--line)}
.features-screen .steps article:before{background:#aec79b}
.features-screen .steps article>span{font-family:Din,sans-serif;font-weight:500;color:var(--brand)}
.features-screen .steps h3{font-size:18px;font-weight:500;color:var(--ink);line-height:1.55}
.features-screen .steps p{font-size:13px;line-height:1.7;color:var(--muted)}
.questions-layout{gap:64px}
.questions-screen .faq-section h2{font-weight:500;line-height:1.55}
.questions-screen .faq-section>div:first-child>p:last-child{font-size:13px;line-height:1.7;color:#e8f0dfc7}
.questions-screen .faq-list summary{min-height:56px;font-size:15px;font-weight:500;padding:16px 0}
.questions-screen .faq-list details>p{font-size:13px;line-height:1.7;color:#e8f0dfc7;padding-bottom:24px}
.questions-screen .faq-list details,.questions-screen .faq-list details:last-child{border-color:#e1e7d833}
.questions-art .large-leaf>span{color:#e8f0dfb8;font-size:12px;letter-spacing:1px}
.questions-art .large-leaf{z-index:0}
.questions-art .large-leaf>svg>path:first-child{fill:#aec79b}
.questions-art .large-leaf>svg>path:not(:first-child){stroke:var(--deep)}
@media(min-width:801px){
 .features-screen .section-intro{margin-bottom:32px}
 .features-screen .features-section{padding-top:32px;padding-bottom:32px}
 .features-screen .feature-card{grid-template-rows:28px 32px 68px 112px minmax(42px,auto);gap:8px}
 .features-screen .breath-preview,.features-screen .chat-illustration{height:112px}
 .features-screen .steps{gap:32px;margin-top:32px}
}
@media(min-width:621px) and (max-width:1000px){
 .features-screen .feature-card{padding:20px 16px}
 .features-screen .feature-card h3{font-size:15px}
 .features-screen .feature-card>p{font-size:12px}
 .features-screen .feature-caption{font-size:11px}
 .features-screen .breath-preview>span:last-child{font-size:11px}
 .features-screen .breath-preview small{font-size:10px}
 .features-screen .chat-illustration p,.features-screen .chat-illustration>div:last-child p{font-size:8px;padding:7px 5px}
}
@media(max-width:800px){.site-header .header-inner{height:66px}}
@media(min-width:621px) and (max-width:800px){
 .features-screen .feature-card{grid-template-rows:28px minmax(48px,auto) minmax(88px,auto) 122px minmax(54px,auto)}
 .features-screen .feature-caption{white-space:normal}
 .features-screen .breath-preview{gap:20px}
 .features-screen .breath-mini-ring{flex-shrink:0}
 .features-screen .breath-preview>span:last-child{font-size:10px}
}
@media(max-width:620px){
 .site-header .header-inner{height:62px}
 .site-header nav a{font-size:11px}
 .features-screen .features-section{padding-top:48px;padding-bottom:48px}
 .features-screen .feature-card{padding:24px}
 .features-screen .feature-card>p{min-height:0}
 .features-screen .feature-caption{font-size:12px}
 .features-screen .breath-preview{gap:40px}
 .features-screen .chat-illustration p,.features-screen .chat-illustration>div:last-child p{font-size:10px}
 .questions-screen{padding:48px 0}
 .questions-screen .faq-list summary{font-size:14px}
 .questions-layout{gap:24px}
 .questions-art .large-leaf>span{font-size:11px}
}
