/* 家装家居 · 工具箱 统一风格（as-*，第 4 批专属）
   设计语言：像回家一样踏实——暖木色 + 莫兰迪绿，圆角大、阴影柔，数字不刺眼但一目了然。
   与 AI 算力（科技青）、政策社保系列区分；深浅双主题。 */

.as-page { --hs-wood:#a06a3f; --hs-terra:#c96f4a; --hs-sage:#6f8a63; --hs-bg:#f6f1ea; --hs-card:#fffdf9; --hs-border:#e8ddcf; --hs-text:#2b2118; --hs-sub:#5c5042; --hs-muted:#9a8c7a; --hs-num:#a06a3f; --hs-grid:rgba(160,106,63,.05); --hs-ok:#4d7c3f; --hs-okbg:#eef4e9; --hs-warn:#a5641f; --hs-warnbg:#faf1e2; --hs-bad:#b0402e; --hs-badbg:#f9ecea; --hs-shadow:0 1px 2px rgba(43,33,24,.04), 0 12px 32px -18px rgba(43,33,24,.16);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif; color:var(--hs-text); background:var(--hs-bg); min-height:100vh; padding-bottom:60px; }
[data-theme="dark"] .as-page { --hs-wood:#d9a06f; --hs-terra:#e09a6a; --hs-sage:#9aac8c; --hs-bg:#15110d; --hs-card:#1e1812; --hs-border:#33291d; --hs-text:#ece3d7; --hs-sub:#b3a594; --hs-muted:#7d7263; --hs-num:#d9a06f; --hs-grid:rgba(217,160,111,.05); --hs-ok:#8fbf7e; --hs-okbg:rgba(143,191,126,.09); --hs-warn:#d9a05f; --hs-warnbg:rgba(217,160,95,.09); --hs-bad:#d98a7a; --hs-badbg:rgba(217,138,122,.09); --hs-shadow:0 1px 2px rgba(0,0,0,.35), 0 14px 36px -18px rgba(0,0,0,.55); }
.as-page .container { max-width:920px; margin:0 auto; padding:0 16px; }

/* 面包屑 */
.as-crumb { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:16px 0 0; font-size:13px; color:var(--hs-muted); }
.as-crumb a { color:var(--hs-sub); text-decoration:none; }
.as-crumb a:hover { color:var(--hs-wood); }
.as-crumb .sep { opacity:.45; }
.as-crumb .cur { color:var(--hs-wood); font-weight:600; }

/* 首屏 Hero */
.as-hero { position:relative; margin-top:16px; padding:28px 30px 24px; border-radius:22px; background:radial-gradient(600px 240px at 92% -20%, rgba(201,111,74,.10), transparent 60%), var(--hs-card); border:1px solid var(--hs-border); box-shadow:var(--hs-shadow); overflow:hidden; }
.as-hero::before { content:''; position:absolute; inset:0; background-image:radial-gradient(var(--hs-grid) 1px, transparent 1px); background-size:24px 24px; pointer-events:none; }
.as-hero-tag { position:relative; display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:700; letter-spacing:.5px; color:var(--hs-wood); border:1px solid color-mix(in srgb,var(--hs-wood) 38%,transparent); background:color-mix(in srgb,var(--hs-wood) 8%,transparent); padding:4px 12px; border-radius:999px; margin-bottom:14px; }
.as-hero-tag i { width:7px; height:7px; border-radius:50%; background:var(--hs-terra); box-shadow:0 0 8px var(--hs-terra); animation:hs-pulse 2.4s ease-in-out infinite; }
@keyframes hs-pulse { 50% { opacity:.4; } }
.as-hero-head { position:relative; display:flex; align-items:center; gap:16px; margin-bottom:10px; }
.as-hero-emoji { flex-shrink:0; width:62px; height:62px; border-radius:18px; display:flex; align-items:center; justify-content:center; font-size:33px; background:linear-gradient(135deg,color-mix(in srgb,var(--hs-wood) 14%,transparent),color-mix(in srgb,var(--hs-sage) 14%,transparent)); border:1px solid color-mix(in srgb,var(--hs-wood) 24%,var(--hs-border)); }
.as-hero h1 { position:relative; font-size:26px; font-weight:800; letter-spacing:-.3px; margin:0; color:var(--hs-text); line-height:1.35; }
.as-hero h1 b { background:linear-gradient(90deg,var(--hs-terra),var(--hs-sage)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.as-hero p { position:relative; font-size:14.5px; line-height:1.85; color:var(--hs-sub); margin:0 0 14px; max-width:720px; }
.as-hero p b { color:var(--hs-text); }
.as-hero p code { font-family:ui-monospace,Consolas,monospace; font-size:13px; color:var(--hs-terra); background:color-mix(in srgb,var(--hs-terra) 9%,transparent); padding:1px 7px; border-radius:6px; }
.as-hero-points { position:relative; display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none; }
.as-hero-points li { font-size:12.5px; font-weight:600; color:var(--hs-sub); display:inline-flex; align-items:center; gap:6px; background:color-mix(in srgb,var(--hs-sage) 6%,transparent); border:1px solid color-mix(in srgb,var(--hs-sage) 24%,var(--hs-border)); border-radius:999px; padding:5px 13px; }
.as-hero-points li::before { content:'✓'; color:var(--hs-sage); font-weight:800; }

/* 双栏计算器 */
.as-calc { margin-top:16px; display:grid; grid-template-columns:1.02fr 0.98fr; gap:16px; align-items:stretch; }
.as-card { background:var(--hs-card); border:1px solid var(--hs-border); border-radius:20px; padding:20px 22px; box-shadow:var(--hs-shadow); }
.as-card-t { display:flex; align-items:center; gap:9px; font-size:15.5px; font-weight:800; color:var(--hs-text); margin-bottom:16px; padding-bottom:12px; border-bottom:1px dashed var(--hs-border); }
.as-card-t .em { font-size:18px; line-height:1; }
.as-card-t .as-mini-btn { margin-left:auto; font-weight:600; }
.as-panel { margin-top:16px; background:var(--hs-card); border:1px solid var(--hs-border); border-radius:20px; padding:22px 24px; box-shadow:var(--hs-shadow); }
.as-panel > .as-card-t { margin-bottom:12px; }
.as-panel-title { display:flex; align-items:center; gap:8px; font-size:13px; font-weight:700; letter-spacing:1px; color:var(--hs-muted); margin-bottom:18px; }

/* 表单 */
.as-form { display:grid; grid-template-columns:repeat(2,1fr); gap:16px 22px; }
.as-field { display:flex; flex-direction:column; gap:6px; }
.as-field.wide { grid-column:1 / -1; }
.as-field > label { font-size:13px; font-weight:600; color:var(--hs-sub); display:flex; align-items:baseline; gap:7px; }
.as-field > label .as-fno { font-style:normal; font-size:10.5px; font-weight:700; color:var(--hs-wood); background:color-mix(in srgb,var(--hs-wood) 11%,transparent); border-radius:5px; padding:1px 6px; transform:translateY(-1px); }
.as-field > label .hint { font-weight:400; color:var(--hs-muted); font-size:11.5px; }
.as-io { display:flex; align-items:center; gap:8px; border:1.5px solid var(--hs-border); border-radius:12px; padding:0 13px; background:color-mix(in srgb,var(--hs-wood) 2%,var(--hs-card)); transition:border-color .15s, box-shadow .15s; }
.as-io:focus-within { border-color:var(--hs-wood); box-shadow:0 0 0 3.5px color-mix(in srgb,var(--hs-wood) 13%,transparent); }
.as-io input, .as-io select, .as-io textarea { flex:1; min-width:0; border:0; outline:none; background:transparent; font-size:15px; font-weight:600; color:var(--hs-text); padding:11px 0; font-family:inherit; }
.as-io textarea { resize:vertical; min-height:88px; line-height:1.7; padding:11px 0; font-weight:400; }
.as-io .u { font-size:12px; color:var(--hs-muted); white-space:nowrap; }
.as-io select { cursor:pointer; }
[data-theme="dark"] .as-io select option { background:#1e1812; color:#ece3d7; }

/* 结果 */
.as-results { display:flex; flex-direction:column; gap:12px; }
.as-res-hero { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:18px 22px; border-radius:16px; background:linear-gradient(95deg,color-mix(in srgb,var(--hs-wood) 11%,transparent),color-mix(in srgb,var(--hs-sage) 11%,transparent)); border:1px solid color-mix(in srgb,var(--hs-wood) 28%,var(--hs-border)); }
.as-res-hero .k { font-size:13.5px; color:var(--hs-sub); font-weight:700; }
.as-res-hero .v { font-family:ui-monospace,Consolas,monospace; font-size:32px; font-weight:800; color:var(--hs-num); font-variant-numeric:tabular-nums; line-height:1.05; }
.as-res-hero .v small { font-size:14px; font-weight:600; color:var(--hs-muted); margin-left:3px; }

.as-verdict { display:flex; gap:12px; align-items:flex-start; border-radius:14px; padding:13px 16px; font-size:13.5px; line-height:1.7; animation:hs-in .25s ease; }
@keyframes hs-in { from { opacity:0; transform:translateY(4px); } }
.as-verdict .ic { font-size:18px; line-height:1.4; }
.as-verdict b { font-size:14px; display:block; margin-bottom:2px; }
.as-verdict p { margin:0; opacity:.88; }
.as-verdict.good { background:var(--hs-okbg); border:1px solid color-mix(in srgb,var(--hs-ok) 35%,transparent); color:var(--hs-ok); }
.as-verdict.warn { background:var(--hs-warnbg); border:1px solid color-mix(in srgb,var(--hs-warn) 35%,transparent); color:var(--hs-warn); }
.as-verdict.bad { background:var(--hs-badbg); border:1px solid color-mix(in srgb,var(--hs-bad) 35%,transparent); color:var(--hs-bad); }
[data-theme="dark"] .as-verdict.good { color:#bcdcae; }
[data-theme="dark"] .as-verdict.warn { color:#ecd0a3; }
[data-theme="dark"] .as-verdict.bad { color:#edb7ad; }

.as-actions { border:1px solid var(--hs-border); border-radius:14px; padding:14px 16px; }
.as-actions-t { font-size:13px; font-weight:800; color:var(--hs-text); margin-bottom:9px; display:flex; align-items:center; gap:6px; }
.as-actions-t::before { content:'🛠'; }
.as-action { display:flex; gap:8px; font-size:13px; line-height:1.7; color:var(--hs-sub); padding:4px 0; }
.as-action i { font-style:normal; color:var(--hs-terra); flex-shrink:0; }

.as-rows { display:flex; flex-direction:column; }
.as-row { display:flex; align-items:baseline; justify-content:space-between; gap:14px; padding:10px 4px; border-bottom:1px dashed var(--hs-border); font-size:13.5px; }
.as-row:last-child { border-bottom:0; }
.as-row .k { color:var(--hs-sub); }
.as-row .k .sub { color:var(--hs-muted); font-size:12px; }
.as-row .v { font-family:ui-monospace,Consolas,monospace; font-weight:700; color:var(--hs-text); text-align:right; white-space:nowrap; }
.as-row .v.ok { color:var(--hs-ok); }
.as-row .v.warn { color:var(--hs-warn); }
.as-row .v.bad { color:var(--hs-bad); }

.as-table { width:100%; border-collapse:collapse; font-size:13.5px; }
.as-table th, .as-table td { text-align:left; padding:9px 10px; border-bottom:1px solid var(--hs-border); font-variant-numeric:tabular-nums; }
.as-table th { font-size:12px; color:var(--hs-muted); font-weight:600; }
.as-table td.num, .as-table th.num { text-align:right; font-family:ui-monospace,Consolas,monospace; }
.as-table tr.hl td { background:color-mix(in srgb,var(--hs-wood) 9%,transparent); color:var(--hs-num); font-weight:700; }
.as-table-sm th, .as-table-sm td { padding:7px 8px; font-size:12.5px; }
.as-table-sm td small { display:block; font-size:11px; color:var(--hs-muted); font-family:ui-monospace,Consolas,monospace; }
.as-table-sm td small.big { color:var(--hs-warn); font-weight:700; }
.as-sens-top { color:var(--hs-terra); font-weight:700; }

.as-sens { margin-top:14px; border:1px dashed color-mix(in srgb,var(--hs-wood) 42%,var(--hs-border)); border-radius:14px; padding:14px 16px; }
.as-sens-t { font-size:13px; font-weight:800; color:var(--hs-text); margin-bottom:4px; }
.as-sens-t span { font-weight:400; font-size:11.5px; color:var(--hs-muted); margin-left:8px; }

.as-scen { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.as-scen-t { font-size:12px; font-weight:700; color:var(--hs-muted); }
.as-cmp { display:inline-flex; align-items:center; gap:8px; font-size:12.5px; color:var(--hs-sub); background:color-mix(in srgb,var(--hs-sage) 8%,transparent); border-radius:999px; padding:5px 12px; }
.as-cmp b { color:var(--hs-sage); font-family:ui-monospace,Consolas,monospace; }

.as-mini-btn { border:1px solid var(--hs-border); background:var(--hs-card); color:var(--hs-sub); border-radius:8px; padding:4px 11px; font-size:12px; font-weight:600; cursor:pointer; transition:all .13s; white-space:nowrap; }
.as-mini-btn:hover { border-color:var(--hs-wood); color:var(--hs-wood); }
.as-mini-btn.has { border-color:color-mix(in srgb,var(--hs-sage) 45%,transparent); color:var(--hs-sage); }
.as-tools { display:flex; justify-content:flex-end; }

.as-formula { margin-top:18px; font-size:12.5px; line-height:1.9; color:var(--hs-muted); border-left:3px solid color-mix(in srgb,var(--hs-wood) 45%,transparent); padding:2px 0 2px 13px; position:relative; }
.as-formula .as-fx-tag { position:absolute; left:-3px; top:-10px; transform:translateX(-50%); font-size:10px; font-weight:700; color:#fff; background:var(--hs-wood); border-radius:5px; padding:1px 6px; letter-spacing:1px; }
.as-formula code { font-family:ui-monospace,Consolas,monospace; font-size:12px; color:var(--hs-terra); background:color-mix(in srgb,var(--hs-terra) 8%,transparent); padding:1px 6px; border-radius:5px; }
.as-formula b { color:var(--hs-sub); }

/* AI */
.as-ai { margin-top:16px; background:var(--hs-card); border:1px solid var(--hs-border); border-radius:20px; padding:18px 22px; box-shadow:var(--hs-shadow); }
.as-ai-below { border-top:2px solid color-mix(in srgb,var(--hs-sage) 35%,transparent); }
.as-ai-head { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.as-ai-head .t { font-size:13.5px; font-weight:700; color:var(--hs-text); display:flex; align-items:center; gap:7px; }
.as-ai-head .t::before { content:'✦'; color:var(--hs-sage); }
.as-ai-tip { font-size:11.5px; color:var(--hs-muted); margin-top:5px; }
.as-ai-btn { border:0; cursor:pointer; font-size:13.5px; font-weight:700; color:#fff; background:linear-gradient(135deg,var(--hs-sage),var(--hs-terra)); border-radius:10px; padding:9px 18px; transition:transform .1s, box-shadow .15s, opacity .15s; }
.as-ai-btn:hover { box-shadow:0 6px 18px color-mix(in srgb,var(--hs-terra) 30%,transparent); }
.as-ai-btn:active { transform:scale(.97); }
.as-ai-btn:disabled { opacity:.55; cursor:not-allowed; }
.as-ai-out { margin-top:14px; display:none; font-size:13.5px; line-height:1.9; color:var(--hs-sub); background:color-mix(in srgb,var(--hs-sage) 5%,transparent); border-radius:10px; padding:12px 14px; white-space:pre-wrap; word-break:break-word; }
.as-ai-out.show { display:block; }
.as-ai-out.err { color:var(--hs-bad); }

/* 知识区 */
.as-info-grid { margin-top:16px; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.as-info { background:var(--hs-card); border:1px solid var(--hs-border); border-radius:18px; padding:20px 22px; box-shadow:var(--hs-shadow); }
.as-info h2 { font-size:15px; font-weight:800; margin:0 0 10px; color:var(--hs-text); display:flex; align-items:center; gap:8px; }
.as-info ul { margin:0; padding:0; list-style:none; }
.as-info li { position:relative; font-size:13px; line-height:1.75; color:var(--hs-sub); padding:4px 0 4px 18px; }
.as-info li::before { content:''; position:absolute; left:2px; top:13px; width:6px; height:6px; border-radius:2px; background:var(--hs-terra); }
.as-info li b { color:var(--hs-text); }
.as-info.wide { grid-column:1 / -1; }

.as-steps { margin-top:16px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.as-step { background:var(--hs-card); border:1px solid var(--hs-border); border-radius:16px; padding:16px; position:relative; }
.as-step .no { font-size:22px; font-weight:800; color:transparent; -webkit-text-stroke:1.2px var(--hs-wood); line-height:1; }
.as-step h3 { font-size:13.5px; font-weight:700; margin:8px 0 5px; color:var(--hs-text); }
.as-step p { font-size:12.5px; line-height:1.7; color:var(--hs-muted); margin:0; }

.as-pit { display:flex; gap:10px; padding:9px 0; border-bottom:1px dashed var(--hs-border); font-size:13px; line-height:1.7; color:var(--hs-sub); }
.as-pit:last-child { border-bottom:0; }
.as-pit .em { flex-shrink:0; }
.as-pit b { color:var(--hs-text); }

.as-faq-item { border-bottom:1px dashed var(--hs-border); padding:11px 0; }
.as-faq-item:last-child { border-bottom:0; }
.as-faq-item dt { font-size:13.5px; font-weight:700; color:var(--hs-text); margin-bottom:4px; }
.as-faq-item dd { margin:0; font-size:13px; line-height:1.75; color:var(--hs-sub); }

.as-rel { margin-top:16px; display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.as-rel a { display:flex; flex-direction:column; gap:3px; padding:13px 15px; border-radius:14px; text-decoration:none; background:var(--hs-card); border:1px solid var(--hs-border); transition:border-color .15s, transform .12s, box-shadow .15s; }
.as-rel a:hover { border-color:var(--hs-wood); transform:translateY(-2px); box-shadow:var(--hs-shadow); }
.as-rel a b { font-size:13px; color:var(--hs-text); }
.as-rel a small { font-size:11.5px; color:var(--hs-muted); line-height:1.5; }
.as-rel a::after { content:'→'; color:var(--hs-terra); }

@media (max-width: 900px) {
    .as-calc { grid-template-columns:1fr; }
}
@media (max-width: 640px) {
    .as-form { grid-template-columns:1fr; }
    .as-hero { padding:22px 18px 20px; }
    .as-hero h1 { font-size:22px; }
    .as-hero-emoji { width:50px; height:50px; font-size:27px; border-radius:14px; }
    .as-hero-head { gap:12px; }
    .as-card, .as-panel { padding:16px; }
    .as-rel { grid-template-columns:1fr; }
    .as-res-hero .v { font-size:26px; }
    .as-info-grid { grid-template-columns:1fr; }
    .as-steps { grid-template-columns:1fr; }
}
@media print {
    .as-crumb, .as-ai, .as-rel, .as-scen, .as-tools, .as-mini-btn { display:none; }
    .as-panel, .as-info, .as-step { box-shadow:none; }
}