/* HyperOS 前端业务样式。风格令牌由插件在 注入 :root，这里只用变量。 */ .hos-wrap{max-width:1200px;margin:0 auto;padding:0 20px} .hos-eyebrow{display:inline-block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--hos-brand,#ff5c00);font-weight:600} .hos-sec-head{margin:0 0 20px} .hos-sec-head h2{font-size:24px;margin:6px 0 0} .hos-empty{padding:36px;text-align:center;color:var(--hos-ink-3,#9096a1);border:1px dashed var(--hos-line,#e9ebef);border-radius:12px} .hos-empty code{background:var(--hos-bg-alt,#f6f7f9);padding:2px 6px;border-radius:5px;font-size:.9em} /* ---- 头条区 ---- */ .hos-lead{padding:28px 0} .hos-lead-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:20px} .hos-hero{position:relative;display:block;padding:28px;border-radius:var(--hos-radius,16px);overflow:hidden;text-decoration:none;color:#fff;min-height:320px;background:var(--hos-ink,#0c0d10)} .hos-hero-bg{position:absolute;inset:0;background:linear-gradient(135deg,var(--hos-brand,#ff5c00),transparent);opacity:.85} .hos-hero .hos-kicker,.hos-hero h1,.hos-hero p{position:relative;z-index:1} .hos-kicker{font-size:12px;opacity:.9;text-transform:uppercase;letter-spacing:.1em} .hos-hero h1{font-size:30px;margin:10px 0 12px;line-height:1.25} .hos-hero p{margin:0;opacity:.92;font-size:15px} .hos-side{display:flex;flex-direction:column;border:1px solid var(--hos-line,#e9ebef);border-radius:var(--hos-radius,16px);padding:8px 4px} .hos-side-h{padding:10px 16px;font-weight:600;font-size:14px;color:var(--hos-ink-2,#565b66)} .hos-side-item{display:flex;gap:12px;align-items:baseline;padding:12px 16px;text-decoration:none;color:inherit;border-top:1px solid var(--hos-line,#e9ebef)} .hos-side-item:hover h3{color:var(--hos-brand,#ff5c00)} .hos-rank{font-weight:700;color:var(--hos-brand,#ff5c00);font-variant-numeric:tabular-nums} .hos-side-item h3{margin:0;font-size:15px;font-weight:500;line-height:1.4} /* ---- 版本脉络时间线 ---- */ .hos-timeline{padding:32px 0;background:var(--hos-bg-alt,#f6f7f9)} .hos-tl-head{display:flex;align-items:baseline;gap:12px;margin-bottom:20px} .hos-tl-head h2{margin:0;font-size:22px} .hos-tl-head span{color:var(--hos-ink-3,#9096a1);font-size:13px} .hos-tl-track{display:flex;gap:0;overflow-x:auto;padding-bottom:8px} .hos-tl-node{position:relative;flex:0 0 auto;min-width:120px;padding:20px 16px 0;border-top:2px solid var(--hos-line,#e9ebef)} .hos-dot{position:absolute;top:-7px;left:16px;width:12px;height:12px;border-radius:50%;background:var(--hos-brand,#ff5c00)} .hos-tl-node b{font-size:16px} /* ---- 工具卡片区 ---- */ .hos-tools{padding:36px 0} .hos-tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px} .hos-tool-card{display:block;padding:24px;border:1px solid var(--hos-line,#e9ebef);border-radius:var(--hos-radius,16px);text-decoration:none;color:inherit;transition:.2s} .hos-tool-card:hover{border-color:var(--hos-brand,#ff5c00);transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.06)} .hos-tool-card h3{margin:0 0 8px;font-size:18px} .hos-tool-card p{margin:0 0 14px;color:var(--hos-ink-2,#565b66);font-size:14px} .hos-go{color:var(--hos-brand,#ff5c00);font-weight:600;font-size:14px} /* ---- 通用列表卡 ---- */ .hos-list{padding:32px 0} .hos-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px} .hos-card{display:block;padding:18px;border:1px solid var(--hos-line,#e9ebef);border-radius:var(--hos-radius,16px);text-decoration:none;color:inherit;transition:.2s} .hos-card:hover{border-color:var(--hos-brand,#ff5c00);transform:translateY(-2px)} .hos-card h3{margin:0 0 6px;font-size:17px} .hos-card p{margin:0;color:var(--hos-ink-2,#565b66);font-size:14px} /* ---- 机型库 ---- */ .hos-devices{padding:32px 0;background:var(--hos-bg-alt,#f6f7f9)} .hos-dev-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px} .hos-dev-card{display:flex;flex-direction:column;gap:6px;padding:16px;background:var(--hos-bg,#fff);border:1px solid var(--hos-line,#e9ebef);border-radius:12px;text-decoration:none;color:inherit} .hos-dev-card:hover{border-color:var(--hos-brand,#ff5c00)} .hos-dev-card h4{margin:0;font-size:15px} .hos-ver{font-size:13px;color:var(--hos-ink-3,#9096a1);font-variant-numeric:tabular-nums} /* ---- 生态延展色块 ---- */ .hos-eco{padding:36px 0} .hos-eco-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px} .hos-eco-card{display:block;padding:28px 20px;border-radius:var(--hos-radius,16px);text-decoration:none;color:#fff;min-height:150px} .hos-eco-card h3{margin:0 0 8px;font-size:18px} .hos-eco-card p{margin:0;font-size:13px;opacity:.9} .hos-eco-phone{background:linear-gradient(135deg,#ff5c00,#ff8a3d)} .hos-eco-car{background:linear-gradient(135deg,#1f5eff,#5b8bff)} .hos-eco-iot{background:linear-gradient(135deg,#0d9488,#2dd4bf)} .hos-eco-wear{background:linear-gradient(135deg,#7c3aed,#a78bfa)} /* ---- 工具页 ---- */ .hos-tool-page{max-width:760px;margin:0 auto;padding:16px 0} .hos-tool-hero{text-align:center;margin-bottom:28px} .hos-tool-hero h1{font-size:28px;margin:8px 0 10px} .hos-tool-hero p{color:var(--hos-ink-2,#565b66);margin:0} .hos-query-card{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px;padding:22px;border:1px solid var(--hos-line,#e9ebef);border-radius:var(--hos-radius,16px);background:var(--hos-bg-alt,#f6f7f9)} .hos-field{display:flex;flex-direction:column;gap:6px;flex:1;min-width:160px} .hos-field span{font-size:13px;color:var(--hos-ink-2,#565b66)} .hos-field select{padding:10px 12px;border:1px solid var(--hos-line,#e9ebef);border-radius:10px;background:var(--hos-bg,#fff);color:inherit;font-size:15px} .hos-vs{align-self:center;padding-bottom:10px;color:var(--hos-ink-3,#9096a1)} .hos-btn{padding:11px 22px;border:0;border-radius:10px;background:var(--tool-accent,var(--hos-brand,#ff5c00));color:#fff;font-size:15px;font-weight:600;cursor:pointer} .hos-btn:hover{filter:brightness(1.05)} .hos-verdict{margin-top:18px;padding:18px 20px;border-radius:12px;font-size:16px;border-left:4px solid var(--hos-line,#e9ebef);background:var(--hos-bg-alt,#f6f7f9)} .hos-verdict-ok{border-left-color:#16a34a;background:rgba(22,163,74,.08)} .hos-verdict-no,.hos-verdict-eol{border-left-color:#9096a1;background:rgba(144,150,161,.1)} .hos-tool-detail{margin-top:16px;border:1px solid var(--hos-line,#e9ebef);border-radius:12px;overflow:hidden} .hos-kv{display:flex;justify-content:space-between;padding:12px 18px;border-bottom:1px solid var(--hos-line,#e9ebef)} .hos-kv:last-child{border-bottom:0} .hos-kv span{color:var(--hos-ink-2,#565b66)} .hos-more,.hos-note{display:block;padding:14px 18px;color:var(--tool-accent,var(--hos-brand,#ff5c00));text-decoration:none} .hos-tool-disc{margin-top:20px;font-size:12px;color:var(--hos-ink-3,#9096a1);text-align:center} .hos-cmp-sec{padding:16px 18px;border-bottom:1px solid var(--hos-line,#e9ebef)} .hos-cmp-sec:last-child{border-bottom:0} .hos-cmp-sec h4{margin:0 0 10px;font-size:14px;color:var(--hos-ink-2,#565b66)} .hos-cmp-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px} .hos-cmp-list li{font-size:14px;line-height:1.5;padding-left:2px} .hos-cmp-tag{display:inline-block;margin-right:6px;padding:0 7px;border-radius:20px;font-size:11px;background:rgba(22,163,74,.14);color:#16a34a;font-weight:600} .hos-cmp-new{font-weight:500} .hos-cmp-links{display:flex;gap:16px;flex-wrap:wrap;padding:12px 18px} /* ---- 聚合页 ---- */ .hos-tracker h1,.hos-devices-page h1,.hos-tools-index h1{font-size:26px;margin:0 0 6px} .hos-sub{color:var(--hos-ink-3,#9096a1);margin:0 0 20px} .hos-track-list{display:flex;flex-direction:column;border:1px solid var(--hos-line,#e9ebef);border-radius:var(--hos-radius,16px);overflow:hidden} .hos-track-row{display:grid;grid-template-columns:110px 1fr auto auto;gap:14px;align-items:center;padding:14px 18px;text-decoration:none;color:inherit;border-top:1px solid var(--hos-line,#e9ebef)} .hos-track-row:first-child{border-top:0} .hos-track-row:hover{background:var(--hos-bg-alt,#f6f7f9)} .hos-track-date{color:var(--hos-ink-3,#9096a1);font-variant-numeric:tabular-nums;font-size:13px} .hos-track-dev{font-weight:500} .hos-track-ver{color:var(--hos-ink-2,#565b66);font-variant-numeric:tabular-nums} .hos-track-status{font-size:12px;padding:2px 10px;border-radius:20px;background:var(--hos-bg-alt,#f6f7f9);color:var(--hos-ink-2,#565b66)} .hos-st-rolling{background:rgba(255,92,0,.12);color:var(--hos-brand,#ff5c00)} .hos-st-stable{background:rgba(22,163,74,.12);color:#16a34a} /* ---- 单篇 / 版本情报 / 机型档案 ---- */ .hos-art-head{margin-bottom:24px} .hos-art-terms{margin-bottom:10px} .hos-chip{display:inline-block;padding:3px 12px;border-radius:20px;background:var(--hos-bg-alt,#f6f7f9);color:var(--hos-ink-2,#565b66);font-size:13px;margin-right:6px} .hos-art-head h1{font-size:30px;margin:0 0 8px;line-height:1.3} .hos-art-meta{color:var(--hos-ink-3,#9096a1);font-size:14px} .hos-art-body{font-size:16px;line-height:1.8} .hos-release-meta,.hos-device-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;background:var(--hos-line,#e9ebef);border:1px solid var(--hos-line,#e9ebef);border-radius:var(--hos-radius,16px);overflow:hidden;margin:20px 0} .hos-rm{display:flex;flex-direction:column;gap:4px;padding:14px 16px;background:var(--hos-bg,#fff)} .hos-rm span{font-size:12px;color:var(--hos-ink-3,#9096a1)} .hos-rm b{font-size:16px;font-variant-numeric:tabular-nums} .hos-downloads{margin:24px 0;padding:20px;border:1px solid var(--hos-line,#e9ebef);border-radius:var(--hos-radius,16px)} .hos-downloads h3{margin:0 0 12px;font-size:16px} .hos-dl{display:inline-block;margin:0 8px 8px 0;padding:8px 16px;border:1px solid var(--hos-line,#e9ebef);border-radius:10px;text-decoration:none;color:var(--hos-brand,#ff5c00);font-size:14px} .hos-dl.dead{color:var(--hos-ink-3,#9096a1);text-decoration:line-through;pointer-events:none} .hos-dl-note{margin:12px 0 0;font-size:12px;color:var(--hos-ink-3,#9096a1)} .page-title{font-size:28px;margin:0 0 8px} .hos-arch-desc{color:var(--hos-ink-2,#565b66);margin-bottom:16px} .hos-pager{margin-top:28px;display:flex;gap:6px;justify-content:center} .hos-pager a,.hos-pager .current{padding:6px 12px;border:1px solid var(--hos-line,#e9ebef);border-radius:8px;text-decoration:none;color:inherit} .hos-pager .current{background:var(--hos-brand,#ff5c00);color:#fff;border-color:var(--hos-brand,#ff5c00)} /* ---- 响应式 ---- */ @media(max-width:900px){ .hos-lead-grid{grid-template-columns:1fr} .hos-tools-grid{grid-template-columns:1fr} .hos-eco-grid{grid-template-columns:repeat(2,1fr)} } @media(max-width:560px){ .hos-eco-grid{grid-template-columns:1fr} .hos-track-row{grid-template-columns:1fr auto;row-gap:4px} .hos-track-date{grid-column:1/-1} .hos-query-card{flex-direction:column;align-items:stretch} } /* 推广位 / 广告位 */ .hos-ads{margin:20px 0;display:flex;flex-direction:column;gap:14px} .hos-sec-ads .hos-ads{margin:0} .hos-ad{position:relative;border:1px solid var(--hos-line);border-radius:var(--hos-radius,12px);overflow:hidden;background:var(--hos-card,#fff)} .hos-ad-img a,.hos-ad-img{display:block;line-height:0} .hos-ad-img img{width:100%;height:auto;display:block} .hos-ad-html{padding:14px;line-height:1.6} .hos-ad-badge{position:absolute;top:8px;right:8px;z-index:2;font-size:10px;line-height:1;padding:3px 6px;border-radius:4px;background:rgba(0,0,0,.55);color:#fff;letter-spacing:.03em;font-weight:600} .hos-ads-content_top{margin-top:0} .hos-ads-content_bottom{margin-bottom:0} .hos-ads-in_content{margin:22px 0} /* 投稿页 Vditor 编辑器宿主 */ .hos-vditor-host{border-radius:var(--hos-radius,12px);overflow:hidden} .hos-vditor-host:empty{display:none}