:root { font-family: 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif; color-scheme: dark; --bg:#151219; --panel:#251e2b; --ink:#f5edf7; --muted:#cdbed3; --line:#4e3d55; --accent:#f4b1cb; --button:#c32b53; }
:root[data-theme=light] { color-scheme: light; --bg:#faf7fb; --panel:#fff; --ink:#302735; --muted:#6e5c75; --line:#e4d9e8; --accent:#a73561; --button:#bd3158; }
* { box-sizing: border-box; } body { margin:0; background:var(--bg); color:var(--ink); font-size:16px; } a { color:inherit; text-decoration:none; text-underline-offset:4px; } button { font:inherit; cursor:pointer; } a:focus-visible, button:focus-visible, summary:focus-visible { outline:2px solid var(--accent); outline-offset:5px; } ::selection { color:#fff; background:#a73561; } header { display:flex; justify-content:space-between; align-items:center; gap:24px; width:min(1080px,100%); padding:30px 28px; margin:auto; } .brand { display:flex; gap:12px; align-items:center; font-size:23px; font-weight:600; } .brand svg { width:42px; height:42px; } #theme { min-height:44px; padding:8px 13px; border:1px solid var(--line); border-radius:8px; color:var(--muted); background:transparent; } main { display:grid; grid-template-columns:minmax(0,660px) minmax(0,280px); align-items:start; justify-content:center; gap:64px; max-width:1080px; margin:36px auto 64px; padding:0 28px; } .download-panel { background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:38px; } h1 { font-size:32px; line-height:1.65; font-weight:600; margin:0 0 18px; letter-spacing:0; } .intro { color:var(--muted); line-height:1.9; margin:0 0 30px; } .package { display:flex; gap:14px; align-items:center; padding:24px 0; border-top:1px solid var(--line); } .package-icon { display:grid; place-items:center; width:49px; height:58px; color:var(--accent); flex-shrink:0; } .package-icon svg { width:37px; height:37px; } .package strong { font-size:18px; font-weight:500; } .package p { color:var(--muted); font-size:14px; margin:9px 0 0; } .test-tag { margin-left:auto; color:var(--muted); border:1px solid var(--line); padding:5px 7px; border-radius:5px; font-size:12px; white-space:nowrap; } .download-button,.h5-button { display:flex; align-items:center; justify-content:center; width:100%; min-height:52px; padding:12px; border-radius:10px; font-size:16px; text-align:center; } .download-button { background:var(--button); color:#fff; font-weight:600; margin-top:8px; } .disabled { opacity:.55; pointer-events:none; } .h5-button { border:1px solid var(--line); color:var(--accent); margin-top:14px; gap:12px; } .facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; margin-top:30px; padding-bottom:26px; border-bottom:1px solid var(--line); } .facts span { display:block; color:var(--muted); font-size:13px; margin-bottom:9px; } .facts strong { font-size:14px; font-weight:500; } details { margin-top:26px; } summary { cursor:pointer; min-height:36px; color:var(--accent); } details p { color:var(--muted); font-size:14px; line-height:1.9; } #checksum { font-size:12px; overflow-wrap:anywhere; } .status-note { color:var(--muted); line-height:1.8; font-size:14px; } aside { padding-top:60px; } aside h2 { font-size:20px; line-height:1.7; font-weight:600; } aside p { color:var(--muted); line-height:1.9; margin:18px 0; } aside a { display:inline-flex; gap:12px; color:var(--accent); min-height:44px; align-items:center; } footer { border-top:1px solid var(--line); padding:24px; text-align:center; font-size:13px; color:var(--muted); line-height:1.8; } @media(max-width:800px) { main { grid-template-columns:minmax(0,660px); gap:28px; margin-top:14px; } aside { padding:0 10px; } } @media(max-width:450px) { header { padding:22px 20px; gap:12px; } .brand { font-size:20px; } .brand svg { width:36px; height:36px; } main { padding:0 16px; margin-bottom:36px; } .download-panel { padding:24px 20px; } h1 { font-size:25px; } .package { display:grid; grid-template-columns:49px minmax(0,1fr); } .test-tag { display:block; grid-column:2; justify-self:start; margin-left:0; } .facts { gap:8px; } .facts strong { font-size:13px; } }
