/* Shared light palette for the home page and all five editorial pages. */
:root,html{color-scheme:light;--page:#fff;--surface:#f5f6f8;--ink:#20232b;--muted:#5b6270;--line:#e2e5eb;--accent:#d51b55;--bs-body-color:#20232b;--bs-body-bg:#fff;--bs-heading-color:#20232b}
html,body,body.intent-page,.start-page,.start-page .content{background:var(--page);color:var(--ink)}
::selection{background:#fbd8e3;color:#64102c}
.content-box,.text-content,.hero-title .headline-sub{color:var(--ink)}
.second-box,.third-box,.fourth-box,.editorial-guides{background:var(--page);color:var(--ink)}
.first-box{background-color:#fff;background-image:url('/img-webp/img_bg_h.webp')}
/* Keep the header white; use a subtle shade over the photograph for legible text. */
.first-box:before{background:linear-gradient(180deg,#fff 0,#fff 78px,rgba(12,17,25,.06) 78px,rgba(12,17,25,.14) 40%,rgba(12,17,25,.5) 100%);z-index:0}
.first-box .content-box{position:relative;z-index:1}
.first-box .hero-title .brand-text{background:none;color:#fff}
.first-box .hero-title .headline-sub,.first-box .inShot-introduce,.first-box .page-scroll-cue{color:#fff}
.first-box .hero-title{text-shadow:0 2px 18px #0005}
.first-box .inShot-introduce{text-shadow:0 1px 8px #0006}
.hero-title .brand-text,.intent-page .brand-text,.guide-copy h2 span{background-image:linear-gradient(105deg,#ce1851,#e24545)}
.try-button,.ma-download-list a{background:linear-gradient(105deg,#d83255,#d8165b);box-shadow:0 5px 22px #d8165b22}
.try-button:hover{box-shadow:0 9px 30px #d8165b33}
a.try-button,a.try-button:hover,a.try-button:focus{color:#fff}
button:focus-visible,a:focus-visible,[role=button]:focus-visible,summary:focus-visible{outline-color:var(--accent)}

/* Persistent navigation, with the same content alignment as each page. */
.site-header,.intent-header{position:fixed;inset:0 0 auto;z-index:1000;width:100%;max-width:none;margin:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 3px 18px #20232b08}
.site-header{height:78px;padding:0 max(16px,calc((100% - 1320px)/2))}
.intent-header{height:92px;padding:0 max(32px,calc((100% - 1200px)/2))}
body.intent-page{padding-top:92px}
html{scroll-padding-top:108px}
.start-page .content{scroll-padding-top:94px}
@media(max-width:800px){.intent-header{height:82px;padding-inline:20px}body.intent-page{padding-top:82px}html{scroll-padding-top:98px}}
@media(max-width:768px){.site-header{height:72px;padding:0 20px}.start-page .content{scroll-padding-top:88px}}

/* Original home-page sections and interactive states. */
.made-box>.col-md-5,.second-box .d-flex.flex-column-reverse{color:var(--ink)!important}
.second-box h6.font-regular,.activity-text h5.font-regular{color:var(--muted)!important}
.tag-btn,.tag-more-btn{background:var(--surface);color:#414956;border:1px solid var(--line)}
.tag-btn.active,.tag-btn-hover,.tag-btn:hover,.tag-more-btn:hover{background:#fce7ed;color:#ac1545;border-color:#f4b3c7}
.carousel-dots,.dot{color:var(--muted)}
.pc-icon{background-color:#7b8492}
.dot.active .pc-icon,.dot[role=button]:hover .pc-icon,.dot.active:after{background-color:var(--accent)}
#smooth-arrow-prev,#smooth-arrow-next{filter:brightness(.3)}
.comments-carousel__card{background:#f7f8fa;border:1px solid var(--line);color:var(--ink)}
.comments-carousel__card .text-color,.card-desc p:nth-child(2),.text-color,.user-name{color:var(--muted)}
.music-card{background:var(--surface);border:1px solid var(--line);color:var(--ink)}
.music-card-hover,.music-card:hover{background:#fff0f4;border-color:#f0c0cf}
.activity-box{background:#fff0f4;border:1px solid #f4d7e1;color:var(--ink)}
.ma-overlay{background:linear-gradient(to top,#fff 0,#fff 70%,#ffffff00 100%)}
.ma-overlay.expanded{background:#fff}
.app-name,.app-description{color:var(--ink)}
.ma-card{box-shadow:0 0 0 1px var(--line)}

/* Informational blocks and intent pages. */
.guide-section+.guide-section,.section,.faq-item,.faq-item:first-of-type,.cta-section{border-color:var(--line)}
.guide-copy h3,.faq-question{color:var(--ink)}
.guide-intro,.guide-steps p,.guide-tips p,.hero-description,.intent-page p,.faq-answer p,.cta-section p{color:var(--muted)}
.guide-eyebrow,.guide-step-number,.intent-page .eyebrow,.section-number,.steps-list li>span,.prompt-label{color:#b81c50}
.guide-tips>div,.tips-grid article,.choice-grid article{border-color:#efbacb}
.guide-visual,.hero-visual{background:#edf0f4;box-shadow:0 12px 35px #2632480c}
.hero-visual figcaption,.guide-visual figcaption{color:#fff}
.hero-tags{color:var(--muted)}
.workflow-section{background:#f6f7f9}
.prompt-example{background:linear-gradient(135deg,#fff1f6,#f9f5ff);border-color:#edcbd9}
.prompt-example blockquote{color:#34313d}
.prompt-example p{color:#675969}
.faq-question[aria-expanded=true]{color:#bd164c}
.plus:before,.plus:after{background:#697181}
.faq-question[aria-expanded=true] .plus:before,.faq-question[aria-expanded=true] .plus:after{background:#bd164c}
.site-footer.compact-footer{background:#f6f7f9;border-color:var(--line);color:var(--muted)}
.compact-footer a{color:#596171}
.compact-footer a:hover,.compact-footer a[aria-current=page]{color:#b51a4c}
.compact-footer a:focus-visible{outline-color:var(--accent)}
.download-dialog{background:#fff;border-color:var(--line);color:var(--ink);box-shadow:0 30px 100px #26324833}
.download-dialog p,.dialog-close,.store-option small{color:var(--muted)}
.store-option{background:#fff;border-color:var(--line);color:var(--ink)}
.store-option:hover{background:#fff0f4;border-color:#edb5c9;color:var(--ink)}
@media(max-width:768px){.dot,.dot.active{color:transparent}.dot{background-color:#c5cad3}.dot.active{background-color:var(--accent)}}
@media(max-width:768px){.first-box{background-image:url('/img-webp/img_bg_v.webp')}.first-box:before{background:linear-gradient(180deg,#fff 0,#fff 72px,rgba(12,17,25,.05) 72px,rgba(12,17,25,.18) 40%,rgba(12,17,25,.56) 100%)}}