/* 本页专用布局；公共配色、组件与动效开关沿用 base.css / motion.js。 */
.inner-page .daily-svg-defs { position:absolute; pointer-events:none }
.inner-page .icon-ink,.inner-page .small-icon { fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round }
.inner-page main { position:relative; isolation:isolate }
.inner-page main::before { content:""; position:absolute; inset:360px 0 170px; z-index:-1; pointer-events:none; background:url('../img/art/daily/landscape-v2.webp') right top / auto 900px repeat-y; opacity:.21; mask-image:linear-gradient(90deg,#000,transparent 28%,transparent 74%,#000),repeating-linear-gradient(to bottom,transparent,#000 130px,#000 760px,transparent 900px); mask-composite:intersect }
.inner-page .sec { padding:30px 0 }
.inner-page .sec-head { margin-bottom:24px }
.inner-page .sec-head h2 { font-size:clamp(28px,3.1vw,40px) }
.inner-page .sec-head h2::before,.inner-page .sec-head h2::after { width:clamp(20px,6vw,85px) }
.inner-page main .card { border-radius:2px; box-shadow:0 3px 16px rgba(70,50,20,.045) }
.page-hero { position:relative; isolation:isolate; overflow:hidden; border-bottom:1px solid var(--gold-line) }
.page-scene { position:absolute; inset:-12px 0 -34px; z-index:-3; will-change:transform }
.page-scene>img,.page-water,.page-water img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:65% center }
.page-water { pointer-events:none; filter:url(#lj-water); mask-image:radial-gradient(24% 15% at 55% 78%,#000 25%,transparent) }
.page-water img { animation:page-river 3.8s ease-in-out -.6s infinite alternate; will-change:transform }
@keyframes page-river { from { transform:translate3d(-6px,-1px,0) scale(1.015) } to { transform:translate3d(6px,2px,0) scale(1.015) } }
.page-mist { position:absolute; inset:25% -15% 0; pointer-events:none; z-index:-2; background:radial-gradient(ellipse at 30% 45%,rgba(251,247,238,.7),transparent 65%); animation:page-mist 26s ease-in-out -10s infinite alternate }
@keyframes page-mist { from { transform:translateX(-3%); opacity:.25 } to { transform:translateX(4%); opacity:.6 } }
.page-hero__inner { position:relative; min-height:380px; padding-top:50px; padding-bottom:48px }
.page-hero h1 { font:400 clamp(70px,7.5vw,100px)/1.15 var(--brush); letter-spacing:.025em; max-width:800px }
.page-slogan { font-size:29px; margin:14px 0 8px; line-height:1.45 }
.page-intro { color:var(--ink-2); font-size:19px; margin-bottom:22px; max-width:34em }
.breadcrumbs { display:flex; gap:12px; color:var(--ink-3); font-size:16px; margin-bottom:14px }
.breadcrumbs a { text-decoration:none }
.paper-note { display:inline-block; padding:3px 13px; border:1px solid var(--gold-line); border-radius:3px; background:rgba(239,230,212,.75); font-size:16px; color:var(--gold) }
.three-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px }
.info-card { padding:24px; position:relative; isolation:isolate; overflow:hidden; display:flex; gap:18px; min-height:158px }
.info-card h3 { font-size:24px; margin-bottom:9px }
.info-card p { font-size:16px; color:var(--ink-2); max-width:20em }
.info-card>img { position:absolute; right:0; bottom:0; width:75%; height:100%; object-fit:cover; object-position:right center; opacity:.25; z-index:-1; mask-image:linear-gradient(135deg,transparent 20%,#000) }
.faq-list { max-width:1000px; margin:auto; display:grid; gap:12px }
.faq-item { padding:0 20px; background:rgba(251,247,238,.94) }
.faq-item::before,.faq-item::after { display:none }
.faq-item summary { display:flex; align-items:center; gap:12px; position:relative; padding:15px 25px 15px 0; font-size:18px; font-weight:700; list-style:none; cursor:pointer }
.faq-item summary::-webkit-details-marker { display:none }
.faq-item summary::before { content:"问"; display:grid; place-items:center; width:26px; height:26px; flex:none; border-radius:50%; color:var(--paper-card); background:var(--gold); font-size:15px }
.faq-item summary::after { content:""; position:absolute; right:2px; top:24px; width:8px; height:8px; border-right:1px solid var(--gold); border-bottom:1px solid var(--gold); transform:rotate(45deg); transition:transform .2s }
.faq-item[open] summary::after { transform:rotate(225deg) }
.faq-item p { padding:0 0 18px 38px; font-size:16px; color:var(--ink-2) }
.faq-item[open] p { animation:page-faq .25s ease }
@keyframes page-faq { from { opacity:0; transform:translateY(-3px) } to { opacity:1; transform:none } }
.notice-strip { display:flex; align-items:center; gap:15px; padding:17px 24px; background:rgba(239,230,212,.8); color:var(--ink-2); font-size:16px }
.notice-strip .small-icon { width:25px; height:25px; flex:none; color:var(--gold) }
.inner-page .end-band { padding:35px 16px 38px }
.page-end-art { position:absolute; inset:-35px 0; width:100%; height:calc(100% + 70px); object-fit:cover; object-position:center 72%; z-index:-2; mask-image:linear-gradient(transparent,#000 30%) }
.inner-page .end-band::before { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse,rgba(251,247,238,.97),rgba(251,247,238,.6) 40%,transparent 72%) }
.inner-page .end-band h2 { font-size:39px }
.inner-page .end-band p { color:var(--ink-2); margin-bottom:16px }
.page-cta { text-align:center; margin-top:22px }
@media (max-width:1000px) { .info-card { padding:20px 18px; gap:12px } .info-card h3 { font-size:21px } .info-card .icon-ink { width:32px } }
@media (max-width:767px) {
 .page-hero__inner { min-height:455px; padding-top:172px; padding-bottom:40px }
 .page-hero__inner::before { content:""; position:absolute; inset:130px -20px 0; z-index:-1; background:radial-gradient(ellipse,rgba(251,247,238,.97),rgba(251,247,238,.8) 43%,transparent 76%) }
 .page-hero h1 { font-size:clamp(50px,12.5vw,76px) }
 .page-slogan { font-size:25px; margin-top:12px }
 .page-intro { font-size:17px; max-width:25em }
 .page-scene>img,.page-water img { object-position:72% center }
 .page-water { mask-image:radial-gradient(43% 13% at 38% 73%,#000 30%,transparent) }
 .inner-page .sec { padding:25px 0 }
 .inner-page .sec-head { margin-bottom:20px }
 .inner-page .sec-head h2 { font-size:27px; letter-spacing:0; gap:8px }
 .inner-page .sec-head h2::before,.inner-page .sec-head h2::after { width:17px }
 .inner-page .sec-head p { max-width:22em; margin-left:auto; margin-right:auto }
 .three-cards { grid-template-columns:minmax(0,1fr); gap:16px }
 .info-card { min-height:150px; padding:22px; gap:17px }
 .info-card>img { width:55% }
 .faq-item { padding:0 14px }
 .faq-item summary { font-size:17px; align-items:flex-start; line-height:1.7; gap:10px }
 .faq-item p { padding-left:0 }
 .notice-strip { padding:16px; align-items:flex-start }
 .inner-page .end-band h2 { font-size:31px }
 .page-end-art { opacity:.65; object-position:65% center }
 .inner-page .site-footer { padding-bottom:78px }
}
@media (max-width:360px) { .inner-page .sec-head h2 { font-size:24px; gap:5px } .page-slogan { font-size:23px } }
html.motion-off .inner-page *,html.no-js .inner-page * { transition:none }
html.motion-off .inner-page .faq-item[open] p { animation:none; opacity:1; transform:none }
html.no-js .page-water,html.no-js .inner-page .motion-toggle { display:none }
html.no-js .page-mist { animation:none }
@media (prefers-reduced-motion:reduce) { .inner-page * { transition:none } .inner-page .faq-item[open] p { animation:none } }

.about-page .page-hero h1 { font-size:clamp(65px,7vw,94px) }
.about-page .page-hero__inner { padding-top:48px; min-height:392px }
.about-page .page-intro { max-width:31em; font-size:18px }
.about-story { border-bottom:1px solid var(--gold-line); overflow:hidden }
.about-story__inner { position:relative; isolation:isolate; padding-top:38px; padding-bottom:38px }
.about-story__copy { width:56%; position:relative; z-index:1 }
.about-story h2 { font:400 37px/1.3 var(--brush); margin-bottom:20px }
.about-story p { font-size:17px; line-height:1.8 }
.about-story .story-lead { font-size:19px; font-weight:700; margin-top:19px; margin-bottom:6px }
.story-art { position:absolute; inset:0 0 0 auto; width:59%; height:100%; object-fit:cover; object-position:87% center; z-index:-1; mask-image:linear-gradient(90deg,transparent,#000 38%) }
.about-features { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px }
.feature-link { position:relative; isolation:isolate; display:flex; flex-direction:column; align-items:flex-start; overflow:hidden; text-decoration:none; min-height:300px; padding:24px 22px; transition:transform .25s,box-shadow .25s }
.feature-link .icon-ink { width:38px; height:38px; margin-bottom:14px }
.feature-link h3 { font-size:25px }
.feature-kicker { font-size:16px; color:var(--gold); display:block; margin-top:3px }
.feature-link p { font-size:16px; color:var(--ink-2); margin-top:12px }
.feature-more { display:flex; justify-content:space-between; gap:8px; width:100%; font-size:16px; margin-top:auto; padding-top:24px; color:var(--cinnabar-dark); font-weight:700 }
.feature-link>img { position:absolute; inset:35% 0 0; width:100%; height:65%; object-fit:cover; object-position:right; opacity:.18; mask-image:linear-gradient(transparent,#000); z-index:-1 }
.feature-link:hover { transform:translateY(-4px); box-shadow:0 9px 24px rgba(70,50,20,.12) }
.getting-started { list-style:none; margin:38px 0 0; padding:34px 14px 24px; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)) }
.getting-started li { padding:4px 17px; border-right:1px solid var(--gold-line); position:relative }
.getting-started li:last-child { border:0 }
.getting-started .step-number { position:absolute; top:-52px; left:17px; display:grid; place-items:center; width:36px; height:36px; border-radius:50%; color:var(--paper-card); background:var(--gold); font-size:19px; border:3px solid var(--paper) }
.getting-started .icon-ink { width:34px; height:34px; margin:0 0 15px }
.getting-started h3 { font-size:18px; margin-bottom:10px }
.getting-started p { color:var(--ink-2); font-size:16px }
.about-help { display:grid; grid-template-columns:1.18fr 1fr; gap:24px; align-items:start }
.help-questions h2 { font:400 32px/1.2 var(--brush); margin-bottom:18px }
.help-cards { display:grid; gap:20px }
.help-card { display:flex; align-items:flex-start; gap:20px; padding:28px; position:relative; isolation:isolate; overflow:hidden; min-height:212px }
.help-card h3 { font-size:25px; margin-bottom:9px }
.help-card p { font-size:16px; max-width:23em; margin-bottom:17px }
.help-card>img { position:absolute; width:60%; height:100%; right:0; bottom:0; object-fit:cover; object-position:right; z-index:-1; opacity:.22; mask-image:linear-gradient(110deg,transparent,#000) }
.privacy-card { display:flex; gap:22px; padding:26px 30px; align-items:flex-start }
.privacy-card h2 { font:400 29px/1.35 var(--brush); margin-bottom:10px }
.privacy-card p { color:var(--ink-2); font-size:16px; line-height:1.8 }
.privacy-card p+p { margin-top:7px }
.about-page .about-privacy { padding-top:0 }
@media (max-width:1000px) { .about-features { grid-template-columns:repeat(2,minmax(0,1fr)) } .feature-link { min-height:260px } .getting-started { grid-template-columns:repeat(3,minmax(0,1fr)); gap:54px 0 } .getting-started li:nth-child(3) { border:0 } .about-story__copy { width:65% } .story-art { opacity:.55 } .about-help { grid-template-columns:minmax(0,1fr) } .help-cards { grid-template-columns:repeat(2,minmax(0,1fr)) } .help-card { padding:22px; gap:14px } }
@media (max-width:767px) {
 .about-page .page-hero__inner { padding-top:172px; min-height:490px }
 .about-page .page-hero h1 { font-size:clamp(45px,11.5vw,74px) }
 .about-page .page-intro { font-size:17px; max-width:22em }
 .about-story__inner { padding-top:30px; padding-bottom:175px }
 .about-story__copy { width:100% }
 .about-story h2 { font-size:31px }
 .about-story .story-lead { font-size:18px }
 .story-art { top:auto; width:100%; height:230px; opacity:.8; object-position:right 70%; mask-image:linear-gradient(transparent,#000 65%) }
 .about-features { gap:14px }
 .feature-link { padding:21px 16px; min-height:310px }
 .feature-link h3 { font-size:24px }
 .feature-more { font-size:16px; padding-top:20px; gap:3px }
 .getting-started { grid-template-columns:repeat(2,minmax(0,1fr)); gap:52px 0; padding:32px 6px 22px }
 .getting-started li { padding:4px 13px }
 .getting-started li:nth-child(3) { border-right:1px solid var(--gold-line) }
 .getting-started li:nth-child(even) { border:0 }
 .getting-started h3 { font-size:18px }
 .getting-started .step-number { left:13px }
 .help-cards { grid-template-columns:minmax(0,1fr) }
 .help-card { padding:23px 20px; gap:17px }
 .privacy-card { gap:14px; padding:22px 18px }
 .privacy-card .icon-ink { width:28px; height:28px }
 .privacy-card h2 { font-size:26px }
}
@media (max-width:360px) { .about-features { grid-template-columns:minmax(0,1fr) } .feature-link { min-height:235px } }
