/* 晴蓝 · 友邻：将设计包映射到正式论坛组件，保留业务结构。 */
body{font-family:var(--font-ui);line-height:1.7;background:var(--bg)}
body::before{background:transparent url('assets/background-light.svg') center 90px/1920px auto no-repeat}
body.admin-site::before{display:none}
button,a,input,select,textarea{touch-action:manipulation}
button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:var(--radius-control);font-size:14px;line-height:1.5;background:#285ed6;box-shadow:0 4px 10px #285ed61c;transition:background .16s,box-shadow .16s,transform .16s}
button:hover,.button:hover{background:#204eb6;filter:none}
button:active,.button:active{transform:translateY(1px);background:#193f96}
.secondary{border-color:var(--field-line);background:var(--paper);color:var(--blue);box-shadow:none}
.secondary:hover,.secondary:active{background:var(--soft)}
.danger{background:var(--red-bg);color:var(--red);border-color:var(--red);box-shadow:none}
.danger:hover,.danger:active{background:var(--red-bg);color:var(--red)}
.quiet,.link{background:transparent;color:var(--blue);box-shadow:none;font-weight:400}
.quiet:hover,.link:hover,.quiet:active,.link:active{background:transparent;text-decoration:underline}
.link{padding:6px 0;min-height:40px;font-size:inherit}
button:disabled{background:var(--bg);border-color:var(--line);color:var(--muted);cursor:not-allowed;box-shadow:none;transform:none}
input,select,textarea{border-color:var(--field-line);border-radius:var(--radius-control);padding:10px 12px;min-width:0}
input::placeholder,textarea::placeholder{color:var(--muted)}
input:focus,select:focus,textarea:focus,a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true]{border-color:var(--red)}
h1{font-size:32px;line-height:1.45;letter-spacing:-.8px;overflow-wrap:anywhere}
h2{font-size:20px;line-height:1.55;overflow-wrap:anywhere}
.localbar{background:var(--soft);color:var(--muted)}
.nav{min-height:92px;gap:28px;padding:18px 24px}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);font-size:22px;line-height:1.4}
.brand:hover{text-decoration:none}
.brand img{width:40px;height:40px;flex-shrink:0}
.brand small{font-size:10px;letter-spacing:1px;line-height:1.1;margin-top:4px}
.search{align-items:center;gap:10px;padding:0 12px;background:var(--bg);border-radius:10px;overflow:visible}
.search input{background:transparent;padding:10px 0;width:100%}
.search .quiet{padding:6px 0;flex-shrink:0}
.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.search .icon{color:var(--muted)}
.account-nav{font-size:14px;gap:16px}
.account-menu{border-radius:10px}
.container{padding:30px 24px 48px}
.page-heading{gap:18px;margin-bottom:26px}
.page-heading h1{font-size:32px}
.page-heading p.muted{font-size:14px}
.eyebrow{font-size:11px;font-weight:650}
.soft-label{display:flex;align-items:center;gap:10px;padding:0;border:0;background:none;font-size:13px}
.soft-label::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--green)}
.columns{grid-template-columns:minmax(0,1fr) 280px;gap:24px}
.panel{border-radius:var(--radius-card);box-shadow:var(--shadow)}
.filters{padding:20px 24px}
.category-desktop{gap:6px}
.category-desktop span{padding:9px 12px;min-height:40px;border-color:transparent;border-radius:8px;color:var(--muted);font-size:13px}
.category-desktop label:hover span{background:var(--bg)}
.category-desktop input:checked+span{background:var(--soft);border-color:transparent;color:var(--blue);font-weight:650}
.category-desktop input:focus-visible+span{outline:3px solid var(--focus);outline-offset:3px}
.filter-row{gap:14px;align-items:center}
.filter-row label{font-size:12px}
.filter-row select,.filter-row input{font-size:12px;min-height:36px;padding:7px 9px}
.filter-row input[type=checkbox]{min-height:0}
.list-title{padding:15px 24px;font-size:12px}
.post-row{padding:23px 24px}
.post-row:hover{background:var(--bg)}
.post-row h2{margin:10px 0 6px}
.post-row h2 a:hover{color:var(--blue)}
.post-row .row-between{flex-wrap:wrap}
.post-tags{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.tag{display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:2px 7px;border-radius:5px;line-height:1.8}
.tag.help{color:var(--blue);background:var(--soft)}
.tag.paid,.tag.sample{color:var(--amber);background:var(--amber-bg)}
.tag.talk{color:var(--purple);background:var(--purple-bg)}
.tag.solved{color:var(--green);background:var(--green-bg)}
.tag.open::before,.tag.solved::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor}
.reply-count{display:inline-flex;align-items:center;gap:6px;font-size:12px;margin-left:auto;white-space:nowrap}
.reply-count .icon{width:15px;height:15px}
.excerpt{font-size:13px;line-height:1.7;margin-bottom:15px}
.meta{font-size:12px}
.welcome-guide{padding:0;overflow:hidden}
.guide-art{height:156px;background:var(--soft) url('assets/conversation.svg') center/260px auto no-repeat}
.guide-body{padding:22px}
.welcome-guide h2{font-size:19px}
.welcome-guide ol{list-style:none;margin:20px 0;padding:0;counter-reset:steps}
.welcome-guide li{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;margin:14px 0;padding:0;counter-increment:steps}
.welcome-guide li::before{content:'0' counter(steps);font-size:11px;font-weight:600;color:var(--blue);border:1px solid var(--line);width:25px;height:25px;border-radius:50%;display:grid;place-items:center;flex-shrink:0}
.guide .hint{margin-top:20px;padding-top:16px;font-size:12px;line-height:1.8}
.side-note{padding:2px 12px;font-size:12px;line-height:1.9}
.side-note strong{font-size:14px}
.aside-link{font-size:12px}
.post-body h1{font-size:28px}
.prose{font-size:16px;line-height:1.95}
.sample-note{border-radius:10px;padding:13px 16px;font-size:13px}
.detail-aside dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px 10px;font-size:13px}
.detail-aside dt,.detail-aside dd{margin:0}
.detail-aside dd{text-align:right;overflow-wrap:anywhere}
.empty img{display:block;width:130px;max-width:100%;height:auto;margin:0 auto 12px}
.empty.compact img{width:116px}
.empty p{font-size:13px}
.advert{background:var(--paper);border:1px dashed var(--field-line);border-radius:12px}
.form-page{max-width:760px}
.stack-form label{font-size:14px;margin-bottom:8px}
.stack-form p{margin-bottom:24px}
.stack-form label.required::after{content:' *';color:var(--red)}
.stack-form input[type=file]{border:1px dashed var(--field-line);background:var(--bg);padding:20px;font-size:12px}
.helptext{font-size:12px;line-height:1.8}
.errorlist{color:var(--red);background:var(--red-bg);border-radius:10px}
.message{color:var(--green);background:var(--green-bg);border-color:var(--green);border-radius:10px}
.message.error{color:var(--red);background:var(--red-bg);border-color:var(--red)}
.admin-layout{grid-template-columns:180px minmax(0,1fr);gap:30px}
.admin-sidebar nav a{border-radius:8px;color:var(--muted);padding:12px;font-size:13px}
.admin-sidebar nav a:hover{background:var(--soft);text-decoration:none}
.admin-work h1{font-size:27px}
.metrics strong{font-size:30px}
.table-wrap{max-width:100%;overflow-x:auto}
.table-wrap table{min-width:580px}
th,td{padding:15px 12px}
.dashboard-columns .panel details{overflow-x:auto}
.admin-work .row-between{flex-wrap:wrap}
footer{font-size:11px;color:var(--muted);padding:24px 24px 30px}
@media(max-width:1050px){.nav{gap:18px}.columns{grid-template-columns:minmax(0,1fr) 250px}.category-desktop{gap:2px}.category-desktop span{padding:8px}.dashboard-columns{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){
 body::before{background-size:1100px auto;background-position:center 90px}
 .container{padding:24px 16px 35px}.nav{gap:12px;padding:16px;min-height:0}
 .brand{font-size:19px;gap:8px}.brand img{width:34px;height:34px}.brand small{display:none}
 .nav>.button{margin-left:auto;padding:9px 12px;font-size:12px}.account-nav{font-size:12px;gap:10px}
 .search{min-width:0}.search .icon{width:18px;height:18px}
 .page-heading{margin-bottom:20px}.page-heading h1{font-size:28px}.page-heading p.muted{font-size:12px}.soft-label{display:none}
 .columns{display:flex;flex-direction:column;gap:0}.panel{border-radius:13px;padding:20px}.list-panel,.welcome-guide{padding:0}
 .filters{padding:16px}.filter-row{gap:10px}.filter-row select{min-height:44px}
 .list-title{padding:13px 16px;flex-wrap:wrap}.list-title .muted{font-size:11px}
 .post-row{padding:20px 16px}.post-row h2{font-size:17px}.post-row .row-between.meta{font-size:11px}
 .guide-art{height:120px;background-size:230px}.guide-body{padding:20px}.welcome-guide{margin-top:16px}
 .post-body h1{font-size:23px}.prose{font-size:15px}.mobile-info{padding:12px}
 .form-page .panel{padding:20px}.form-page h1{font-size:26px}
 .admin-layout{display:block}.admin-sidebar nav a{padding:10px 6px;font-size:12px}
 .metrics .panel{padding:15px}.metrics strong{font-size:27px}
 .admin-work .filter-row label{max-width:100%}.admin-work .filter-row input{max-width:100%}
 footer{padding:24px 16px}.form-links{flex-wrap:wrap;gap:12px}
}
@media(max-width:360px){.nav{gap:8px}.brand{font-size:17px;gap:6px}.brand img{width:28px;height:28px}.nav>.button{padding:9px 10px}.account-nav{gap:8px}.filter-row label{max-width:100%}.child-reply{margin-left:0}.row-between{flex-wrap:wrap}}
@media(prefers-color-scheme:dark){
 body::before{background-image:url('assets/background-dark.svg')}
 button,.button{background:#386ce0;color:white}button:hover,.button:hover{background:#3263d1}button:active,.button:active{background:#2856bd}
 .secondary,.secondary:hover,.secondary:active{background:var(--paper);color:var(--blue)}
 .quiet,.link,.quiet:hover,.link:hover,.quiet:active,.link:active{background:transparent;color:var(--blue)}
 .danger,.danger:hover,.danger:active{background:var(--red-bg);color:var(--red);border-color:var(--red)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* 风景暖橙 v1：鲜艳风景与暖橙操作按钮，正文仍使用不透明面板。 */
:root{--action:#c2410c;--action-hover:#a9360b;--action-pressed:#8f2e0a;--action-text:#a9360b;--action-soft:#fff2e9}
body::before,body.admin-site::before{display:block;background:#219cc2 url('assets/landscape-v1.png') center/cover no-repeat}
button:not(.secondary):not(.danger):not(.quiet):not(.link):not(:disabled),.button:not(.secondary):not(.danger):not(.quiet):not(.link){background:var(--action);color:#fff;box-shadow:0 4px 12px #c2410c26}
button:not(.secondary):not(.danger):not(.quiet):not(.link):not(:disabled):hover,.button:not(.secondary):not(.danger):not(.quiet):not(.link):hover{background:var(--action-hover)}
button:not(.secondary):not(.danger):not(.quiet):not(.link):not(:disabled):active,.button:not(.secondary):not(.danger):not(.quiet):not(.link):active{background:var(--action-pressed)}
.secondary{color:var(--action-text);border-color:var(--action-text);background:var(--action-soft)}
.secondary:hover,.secondary:active{color:var(--action-text);background:var(--action-soft);border-color:var(--action)}
.quiet,.link,.quiet:hover,.link:hover,.quiet:active,.link:active{color:var(--action-text)}
.category-desktop input:checked+span{background:var(--action-soft);color:var(--action-text)}
.page-heading{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-card);padding:22px 24px}
.side-note{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-card);padding:18px 20px}
.back{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:7px 12px}
footer{background:var(--paper);border:1px solid var(--line);border-radius:16px 16px 0 0}
.admin-layout{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-card);padding:24px}
@media(max-width:700px){.page-heading{padding:18px 20px}.admin-layout{padding:16px}.side-note{padding:16px}.page-heading h1{margin-top:4px}}
@media(prefers-color-scheme:dark){
 :root{--action-text:#fdba74;--action-soft:#40291c}
 body::before,body.admin-site::before{background-image:linear-gradient(#10192766,#10192766),url('assets/landscape-v1.png')}
 .secondary,.secondary:hover,.secondary:active{background:var(--action-soft);color:var(--action-text);border-color:var(--action-text)}
}

/* 内容底图：留白托住文字，山湖细节在卡片边缘自然衔接页面风景。 */
.public-site .page-heading{background:#fff9 url('assets/content-landscape-v1.png') center 69%/cover no-repeat}
.public-site .list-panel{background:#fff url('assets/content-landscape-v1.png') center/100% 100% no-repeat}
.public-site .list-panel .filters,.public-site .list-panel .list-title{background:#fffffff0}
.public-site .list-panel .post-row{background:#ffffffda}
.public-site .list-panel .post-row:hover{background:#ffffffed}
.public-site .welcome-guide .guide-body{background:linear-gradient(#ffffffd6,#ffffffd6),url('assets/content-landscape-v1.png') center bottom/cover no-repeat}
.public-site .side-note{background:linear-gradient(#ffffffe6,#ffffffe6),url('assets/content-landscape-v1.png') center bottom/cover no-repeat}
@media(prefers-color-scheme:dark){
 .public-site .page-heading,.public-site .list-panel{background-image:linear-gradient(#192538de,#192538de),url('assets/content-landscape-v1.png')}
 .public-site .list-panel .filters,.public-site .list-panel .list-title{background:#192538ed}
 .public-site .list-panel .post-row{background:#192538df}
 .public-site .list-panel .post-row:hover{background:#192538f2}
 .public-site .welcome-guide .guide-body,.public-site .side-note{background-image:linear-gradient(#192538e6,#192538e6),url('assets/content-landscape-v1.png')}
}

/* 内容底图 v2：湖蓝铺满卡片，降低白色覆盖；页面风景与正文仍有明确层次。 */
.public-site{--muted:#4d6178}
.public-site header{background:#eaf5f8}
.public-site .search{background:#e1f1f5}
.public-site .panel{background:linear-gradient(#d3eaf0c9,#d3eaf0c9),url('assets/content-landscape-v2.png') center/cover no-repeat}
.public-site .page-heading{background:linear-gradient(#ffffff22,#ffffff22),url('assets/content-landscape-v2.png') center 69%/cover no-repeat}
.public-site .list-panel{background:url('assets/content-landscape-v2.png') center/100% 100% no-repeat}
.public-site .list-panel .filters,.public-site .list-panel .list-title{background:#d3eaf0db}
.public-site .list-panel .post-row{background:#d3eaf0cb}
.public-site .list-panel .post-row:hover{background:#e4f3f4ef}
.public-site .welcome-guide .guide-body,.public-site .side-note{background:linear-gradient(#d3eaf0cf,#d3eaf0cf),url('assets/content-landscape-v2.png') center bottom/cover no-repeat}
.public-site footer{background:linear-gradient(#d3eaf0df,#d3eaf0df),url('assets/content-landscape-v2.png') center/cover no-repeat}
@media(prefers-color-scheme:dark){
 .public-site{--muted:#adbbcf}
 .public-site header{background:var(--paper)}
 .public-site .search{background:var(--bg)}
 .public-site .panel,.public-site .page-heading,.public-site .list-panel{background-image:linear-gradient(#192538e3,#192538e3),url('assets/content-landscape-v2.png')}
 .public-site .list-panel .filters,.public-site .list-panel .list-title{background:#192538d9}
 .public-site .list-panel .post-row{background:#192538d1}
 .public-site .list-panel .post-row:hover{background:#192538ec}
 .public-site .welcome-guide .guide-body,.public-site .side-note{background-image:linear-gradient(#192538d9,#192538d9),url('assets/content-landscape-v2.png')}
 .public-site footer{background-image:linear-gradient(#192538e3,#192538e3),url('assets/content-landscape-v2.png')}
}
