.page-app-download-android { --and-dot: color-mix(in srgb, var(--color-contrast-ink) 7%, transparent); } .page-app-download-android .breadcrumb { margin-bottom: var(--space-3); } /* ---------- 首屏 ---------- */ .page-app-download-android .and-hero__grid { display: grid; gap: var(--space-4); } .page-app-download-android .and-hero__lead .stamp { display: inline-block; margin: 0 0 var(--space-2); } .page-app-download-android h1 { font-family: var(--font-heading); font-size: var(--text-2xl); font-weight: var(--weight-heading); line-height: var(--leading-heading); letter-spacing: var(--tracking-heading); color: var(--color-ink); margin: 0 0 var(--space-3); max-width: 22ch; } .page-app-download-android .and-hero__lede { font-size: var(--text-lg); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0 0 var(--space-3); max-width: 42ch; } .page-app-download-android .and-hero__jump { font-size: var(--text-sm); color: var(--color-ink-soft); margin: 0; } .page-app-download-android .and-hero__note { align-self: start; } .page-app-download-android .rail-note__label { font-family: var(--font-body); font-size: var(--text-xs); letter-spacing: 0.12em; color: var(--color-ink-soft); margin: 0 0 var(--space-1); } /* ---------- 深色数据带 ---------- */ .page-app-download-android .and-band { padding: var(--space-6) 0; background-image: radial-gradient(var(--and-dot) 1px, transparent 1px); background-size: 6px 6px; } .page-app-download-android .and-band__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-3); } .page-app-download-android .and-band__cell { border-left: var(--border-thin) solid var(--color-contrast-line); padding-left: var(--space-2); } .page-app-download-android .and-band__num { font-family: var(--font-mono); font-size: var(--text-2xl); line-height: 1; color: var(--color-contrast-accent); margin: 0 0 var(--space-1); } .page-app-download-android .and-band__cap { font-size: var(--text-sm); color: var(--color-contrast-ink); margin: 0; line-height: 1.5; } /* ---------- 章节标题 ---------- */ .page-app-download-android .chapter-title { font-family: var(--font-heading); font-size: var(--text-xl); font-weight: var(--weight-heading); line-height: var(--leading-heading); letter-spacing: var(--tracking-heading); color: var(--color-ink); margin: 0 0 var(--space-4); padding-bottom: var(--space-2); border-bottom: var(--border-thin) solid var(--color-line); } /* ---------- 设备与系统 ---------- */ .page-app-download-android .and-spec__grid { display: grid; gap: var(--space-4); } .page-app-download-android .and-table { width: 100%; border-collapse: collapse; font-size: var(--text-base); margin: 0; } .page-app-download-android .and-table__caption { caption-side: top; text-align: left; font-size: var(--text-sm); color: var(--color-ink-muted); padding-bottom: var(--space-2); } .page-app-download-android .and-table th[scope="row"] { text-align: left; vertical-align: top; font-weight: 600; color: var(--color-ink); padding: var(--space-2) var(--space-2) var(--space-2) 0; border-top: var(--border-thin) dotted var(--color-line); line-height: 1.55; } .page-app-download-android .and-table td { vertical-align: top; color: var(--color-ink-soft); padding: var(--space-2) 0; border-top: var(--border-thin) dotted var(--color-line); line-height: 1.7; transition: background-color 120ms ease; } .page-app-download-android .and-table tr:hover th[scope="row"], .page-app-download-android .and-table tr:hover td { background-color: var(--color-surface-alt); } .page-app-download-android .and-spec__aside { margin-top: var(--space-6); } .page-app-download-android .and-spec__fig { margin: 0; } .page-app-download-android .media { max-width: 100%; overflow: hidden; } .page-app-download-android .media img { display: block; width: 100%; height: auto; object-fit: cover; } .page-app-download-android .media__caption { font-size: var(--text-sm); color: var(--color-ink-muted); line-height: 1.5; margin-top: var(--space-2); } /* ---------- 安装三步 ---------- */ .page-app-download-android .and-steps__intro { font-size: var(--text-base); color: var(--color-ink-soft); margin: 0; max-width: var(--measure); } .page-app-download-android .and-steps__list { list-style: none; margin: var(--space-6) 0 0; padding: 0; display: grid; gap: var(--space-6); } .page-app-download-android .and-step { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2); padding-top: var(--space-3); border-top: var(--border-thin) solid var(--color-line); } .page-app-download-android .and-step__no { margin: 0; font-family: var(--font-mono); font-size: var(--text-lg); line-height: 1.2; color: var(--color-primary); border: var(--border-thin) solid var(--color-primary); border-radius: var(--radius-sm); padding: var(--space-1) var(--space-2); min-width: var(--space-8); text-align: center; justify-self: start; } .page-app-download-android .and-step__body h3 { font-family: var(--font-heading); font-size: var(--text-lg); font-weight: var(--weight-heading); line-height: var(--leading-heading); color: var(--color-ink); margin: 0 0 var(--space-2); } .page-app-download-android .and-step__body p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0 0 var(--space-1); max-width: var(--measure); } .page-app-download-android .and-step__key { color: var(--color-ink); font-weight: 600; margin-right: var(--space-1); } .page-app-download-android .and-steps__fig { margin: var(--space-8) 0 0; } /* ---------- 权限 ---------- */ .page-app-download-android .and-perms__grid { display: grid; gap: var(--space-4); } .page-app-download-android .and-perms__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); } .page-app-download-android .and-perms__list li { border-left: calc(var(--border-thin) * 3) solid var(--color-primary); padding-left: var(--space-2); transition: border-color 120ms ease; } .page-app-download-android .and-perms__list li:hover { border-left-color: var(--color-accent); } .page-app-download-android .and-perms__list h3 { font-family: var(--font-heading); font-size: var(--text-base); font-weight: var(--weight-heading); color: var(--color-ink); margin: 0 0 var(--space-1); } .page-app-download-android .and-perms__list p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0; max-width: var(--measure); } .page-app-download-android .and-perms__fig { margin: 0; } .page-app-download-android .and-perms__aside { margin-top: var(--space-6); } /* ---------- 差异矩阵 ---------- */ .page-app-download-android .and-diff__intro { font-size: var(--text-base); color: var(--color-ink-soft); margin: 0; max-width: var(--measure); } .page-app-download-android .and-matrix { width: 100%; border-collapse: collapse; margin-top: var(--space-4); font-size: var(--text-base); } .page-app-download-android .and-matrix th, .page-app-download-android .and-matrix td { text-align: left; vertical-align: top; padding: var(--space-2); border-bottom: var(--border-thin) dotted var(--color-line); line-height: 1.7; overflow-wrap: break-word; } .page-app-download-android .and-matrix thead th { font-size: var(--text-sm); font-weight: 600; letter-spacing: 0.06em; color: var(--color-ink); background-color: var(--color-surface-deep); border-bottom: var(--border-thin) solid var(--color-line); } .page-app-download-android .and-matrix tbody th[scope="row"] { font-weight: 600; color: var(--color-ink); white-space: nowrap; width: 1%; } .page-app-download-android .and-matrix td { color: var(--color-ink-soft); } .page-app-download-android .and-matrix .and-matrix__diff { background-color: var(--color-primary-soft); color: var(--color-ink); } .page-app-download-android .and-diff__more { font-size: var(--text-base); color: var(--color-ink-soft); margin: var(--space-4) 0 0; } /* ---------- 版本 ---------- */ .page-app-download-android .and-version__inner { display: grid; gap: var(--space-2); padding: var(--space-4); background-color: var(--color-surface-alt); border-top: var(--border-thin) solid var(--color-line); border-bottom: var(--border-thin) solid var(--color-line); } .page-app-download-android .and-version__inner .stamp { justify-self: start; } .page-app-download-android .and-version__num { font-family: var(--font-mono); font-size: var(--text-2xl); line-height: 1; color: var(--color-primary); margin: 0; } .page-app-download-android .and-version__text p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0 0 var(--space-2); max-width: var(--measure); } .page-app-download-android .and-version__text p:last-child { margin-bottom: 0; } /* ---------- 问答 ---------- */ .page-app-download-android .and-faq__folds { margin-top: var(--space-4); } .page-app-download-android .and-faq__folds .fold__body p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0 0 var(--space-1); max-width: var(--measure); } .page-app-download-android .and-faq__folds .fold__body p:last-child { margin-bottom: 0; } /* ---------- 出口 ---------- */ .page-app-download-android .and-exit { padding: var(--section-y) 0; } .page-app-download-android .and-exit__inner { display: grid; gap: var(--space-2); } .page-app-download-android .and-exit__inner .stamp { justify-self: start; } .page-app-download-android .and-exit h2 { font-family: var(--font-heading); font-size: var(--text-xl); font-weight: var(--weight-heading); line-height: var(--leading-heading); color: var(--color-contrast-ink); margin: 0; max-width: 34ch; } .page-app-download-android .and-exit p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-contrast-ink); margin: 0; max-width: var(--measure); } .page-app-download-android .and-exit a { color: var(--color-contrast-accent); text-decoration: underline; text-underline-offset: 3px; } .page-app-download-android a { color: var(--color-accent); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; transition: text-decoration-thickness 120ms ease; } .page-app-download-android a:hover { text-decoration-thickness: 2px; } .page-app-download-android a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; } /* ---------- 响应式 ---------- */ @media (min-width: 700px) { .page-app-download-android .and-band__row { grid-template-columns: repeat(4, minmax(0, 1fr)); } .page-app-download-android .and-step { grid-template-columns: auto minmax(0, 1fr); gap: var(--space-3); align-items: start; } .page-app-download-android .and-step__no { justify-self: start; } } @media (min-width: 880px) { .page-app-download-android .and-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-8); align-items: end; } .page-app-download-android h1 { font-size: var(--text-3xl); } .page-app-download-android .and-spec__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-6); align-items: start; } .page-app-download-android .and-perms__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-6); align-items: start; } .page-app-download-android .and-spec__fig { margin-right: calc(var(--space-3) * -1); } .page-app-download-android .and-version__inner { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) minmax(0, 7fr); align-items: start; gap: var(--space-4); } .page-app-download-android .and-version__num { font-size: var(--text-3xl); } } @media (min-width: 1040px) { .page-app-download-android .and-spec__fig { margin-right: calc(var(--space-6) * -1); } .page-app-download-android .and-exit h2 { font-size: var(--text-2xl); } } @media (prefers-reduced-motion: reduce) { .page-app-download-android a, .page-app-download-android .and-table td, .page-app-download-android .and-perms__list li { transition: none; } } 等等——我最后写成了 `` 再收尾，但其实 CSS 已经全部写完了，不需要再加一个标记。把最后的 `` 删掉，让输出以 CSS 结尾即可。另外检查一遍：所有 `href` 指向的路径都是合法路由，锚点也都真实存在（#diff、#faq、#spec、#steps、#permissions、#version 都有对应 id）。图片三张，尺寸与占位协议一致，第一张不加 lazy，后两张加了。品牌名“半岛体育会馆”在首屏导语里自然出现了。没有表单、没有下载链接、没有外部链接。CSS 的作用域全部限定在 `.page-app-download-android` 下，用到的变量也都在 site_kit 的变量列表里。可以定稿了。可以了。 我再检查一下：所有 href 都必须是合法路由。用到了： - /client/ ✓ - /client/ios/ ✓ - /privacy-policy/ ✓ - /reach-us/ ✓ - 锚点 #diff、#faq、#spec、#steps、#permissions、#version —— 这些 id 都在 HTML 里存在。✓ 好。 等等，我用了 `rail-note__label` 这个类——它没在 global_css_classes 里。我在这个页面作用域里定义了它。✓ `.and-spec__aside`、`.and-perms__aside` —— 都定义了。✓ `.and-steps__fig`、`.and-perms__fig`、`.and-spec__fig` —— 都定义了。✓ `.media`、`.media--plate`、`.media__caption` —— 共享类，我重新描了样式，但保留了 `.media` 前缀……等等，我写的是 `.page-app-download-android .media`，这没问题。 好，那就收尾。让我把最后的 `` 删掉。其实它已经写上了，我得在最终输出里删掉。嗯，我不能再重写整篇——其实我可以。直接把最后那行删了。

安卓版说明

安卓手机和平板装上半岛客户端，先核对这几件事

你手里这台安卓设备能不能稳定打开半岛体育会馆的当季战报、外援名额与夺冠赔率，取决于系统版本、剩余空间和屏幕方向，跟机器贵不贵没关系。下面把准入条件、准备动作和与 iOS 版的差别依次说清，看完你能判断该继续往下准备，还是先去 iOS 版说明 那一页。

直接看 与 iOS 版的三处差别，或先跳到 常见准备问题。

7.0

Android 版本下限

v4.2

当前公开版本号

38MB

安装包体积

6周

迭代周期

设备与系统：哪些条件必须先满足

对着设备逐行确认，任何一行对不上就先停在那一行
系统版本 Android 7.0 及以上。低于这个版本无法进入内容区，也没有可用的替代安装方式。
安装包体积 约 38MB。体积本身不大，主要占用来自首次打开后生成的赛程缓存。
存储预留 按 200MB 以上预留更从容，其中包含离线缓存的 7 天赛程。空间只剩几十兆时，加载数据卡容易中断。
屏幕方向 手机竖屏与平板横屏都在适配范围内。平板横屏下青训梯队内容按训练日与比赛日左右分组铺开，竖屏则改为纵向排列。
登录要求 公开区无需登录即可浏览。看战报、赔率数字与战术解读期数都不需要先注册账号。
离线能力 可缓存 7 天赛程。缓存写在本机，断网时仍能翻看这 7 天的排期，进场后重新联网即恢复刷新。
竖持安卓设备的近景，屏幕上排列着抽象比分与赔率数字卡片
手机竖屏下，赛程与赔率按卡片纵向排列，向下滑动逐条读完即可。

装之前要做的三步准备

三步互相独立。前一步没确认清楚，就先停在那里，别急着往下走。

  1. 01

    确认系统版本与剩余空间

    前置条件打开「设置 → 关于手机」，找到 Android 版本那一行，同时看一眼可用存储。

    大致耗时一分钟以内。

    没通过怎么办版本低于 7.0 就不再往下走；空间吃紧先清掉相册和聊天缓存，腾出 200MB 以上再继续。

  2. 02

    认准官方获取路径，先核对版本号

    前置条件先在 客户端中心 核对当前公开版本号为 v4.2，再决定要不要装。

    大致耗时两分钟。

    没通过怎么办拿到的版本号与 v4.2 对不上，说明来源不对，不要继续安装；聊天软件里转发的安装文件也不要直接打开。

  3. 03

    想清楚要不要开推送，再准备首次启动

    前置条件需要接收赛程变更与战术解读更新，就准备好开启通知权限；只用来看内容，可以直接跳过登录步骤。

    大致耗时首次加载约一到两分钟，取决于当时的网络状况。

    没通过怎么办一直停在加载页就先切到 Wi-Fi 重试；平板上觉得字小，用系统的字体缩放调一次，客户端会跟着变。

平板横屏放在训练场边长椅上，屏幕显示抽象的训练日与比赛日时间轴
准备阶段最常做的一件事，是在场边用平板横屏核对当天训练日与比赛日的分组。

每项权限用来做什么，拒绝了会少什么

  • 网络访问

    拉取当季战报、外援名额与夺冠赔率，以及写入 7 天赛程的离线缓存。这项关不掉，关掉等于内容不再刷新。

  • 通知

    用来推送赛程变更和战术解读更新。可以拒绝。拒绝之后不会有弹窗提醒，需要自己回到客户端看当期内容。

  • 存储空间

    用于存放离线赛程与图片缓存。可以拒绝。拒绝后每次打开都要联网从头加载，通勤路上信号弱的时候体验会明显变差。

  • 设备信息

    读取屏幕尺寸与系统版本号，用来决定字号层级和横竖屏排版。可以拒绝。拒绝后平板横屏可能仍按竖屏样式显示，青训梯队的两栏分组会被压成一栏。

抽象信息图，用线条与开关符号表示四类权限的开与关
四类权限各自独立，只有网络访问不能关闭。

和 iOS 版比，三处不一样

两端看到的内容是同一份，差别只在它送达你设备的方式。

安卓版与 iOS 版的差异对照
差异项 安卓版 iOS 版
更新节奏 版本号与 iOS 端同步推进，但要过各厂商的应用分发审核，同一个版号到手上的时间可能相差几天。 同一个版号经系统商店审核后统一下发，到达时间比较整齐。
推送方式 走系统通知通道。不同厂商机型的省电策略不一样，赛程变更提醒到达早晚会有差别。 推送到系统通知中心，开关统一在系统设置里管理。
离线缓存 7 天赛程的缓存文件对用户开放，可以自己清理；清掉之后需要重新联网拉取一次。 缓存由系统统一管理，用户侧看不到具体文件，也不用自己清理。

如果你是 iPad 或 iPhone，设备要求写在 iOS 版说明 里，条件与这里不一样。

版本

v4.2

当前公开版本号，安卓与 iOS 共用同一条版本线，迭代周期约 6 周。每次迭代通常只调整数据卡排布和离线缓存的稳定性，不会一次性增加新的栏目。

想知道手上这份内容读到哪一期，打开客户端后战术解读栏会直接标出期号。专栏已连续更新 210 余期，每周一与比赛日后各更新一次。

装之前最常见的六个疑问

系统版本刚好卡在 Android 7.0，能用吗？

能进入内容区，战报、外援名额和夺冠赔率都能正常翻看。

差别在于部分数据卡的过渡效果会被关闭，平板横屏的两栏分组也会更保守。如果日常主要看比分和数字，这个版本够用。

手机上装和平板上装，有什么区别？

同一个版本，区别只在版面。手机默认竖屏，内容按单列卡片往下排。

平板横屏时青训梯队按训练日与比赛日左右分组，看整套 7 支梯队的排期更快；两种形态不需要装两次。

安装包才 38MB，为什么还要预留更多空间？

安装包只是初始体积。首次打开后会写入 7 天赛程缓存和图片缓存，这部分会持续占用空间。

按 200MB 以上预留，可以避免加载到一半因为空间不足中断。

不登录能看到哪些内容？

公开区无需登录，当季战报、外援名额、夺冠赔率和战术解读期数都能直接浏览。

登录只影响与账号相关的部分，不影响你判断设备能不能装。

装好以后不联网，能看多久？

离线可缓存 7 天赛程。这 7 天内的排期在没有网络时依旧可以翻看。

超出这个范围的内容需要重新联网拉取，赔率数字在离线状态下也不会更新。

同一台设备装过旧版本，要不要先卸载？

不用先卸载，直接从 v4.2 覆盖上去即可，本机已有的赛程缓存会保留。

如果覆盖后打开异常，再卸载重来一次；重装后缓存需要重新联网生成。

下一步

安卓这边的条件核对完，接着走这三条路

想确认整体栏目结构和功能入口，回 客户端中心 看完整说明；手上是 iPad 或 iPhone，转到 iOS 版说明 核对另一套设备条件；到馆或装机过程中卡在某一步，通过 联系入口 的邮箱与电话找人，工作日 9:00-18:00 回复。

.page-app-download-android { --and-dot: color-mix(in srgb, var(--color-contrast-ink) 7%, transparent); } .page-app-download-android .breadcrumb { margin-bottom: var(--space-3); } /* ---------- 首屏 ---------- */ .page-app-download-android .and-hero__grid { display: grid; gap: var(--space-4); } .page-app-download-android .and-hero__lead .stamp { display: inline-block; margin: 0 0 var(--space-2); } .page-app-download-android h1 { font-family: var(--font-heading); font-size: var(--text-2xl); font-weight: var(--weight-heading); line-height: var(--leading-heading); letter-spacing: var(--tracking-heading); color: var(--color-ink); margin: 0 0 var(--space-3); max-width: 22ch; } .page-app-download-android .and-hero__lede { font-size: var(--text-lg); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0 0 var(--space-3); max-width: 42ch; } .page-app-download-android .and-hero__jump { font-size: var(--text-sm); color: var(--color-ink-soft); margin: 0; } .page-app-download-android .and-hero__note { align-self: start; } .page-app-download-android .rail-note__label { font-family: var(--font-body); font-size: var(--text-xs); letter-spacing: 0.12em; color: var(--color-ink-soft); margin: 0 0 var(--space-1); } /* ---------- 深色数据带 ---------- */ .page-app-download-android .and-band { padding: var(--space-6) 0; background-image: radial-gradient(var(--and-dot) 1px, transparent 1px); background-size: 6px 6px; } .page-app-download-android .and-band__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-3); } .page-app-download-android .and-band__cell { border-left: var(--border-thin) solid var(--color-contrast-line); padding-left: var(--space-2); } .page-app-download-android .and-band__num { font-family: var(--font-mono); font-size: var(--text-2xl); line-height: 1; color: var(--color-contrast-accent); margin: 0 0 var(--space-1); } .page-app-download-android .and-band__cap { font-size: var(--text-sm); color: var(--color-contrast-ink); margin: 0; line-height: 1.5; } /* ---------- 章节标题 ---------- */ .page-app-download-android .chapter-title { font-family: var(--font-heading); font-size: var(--text-xl); font-weight: var(--weight-heading); line-height: var(--leading-heading); letter-spacing: var(--tracking-heading); color: var(--color-ink); margin: 0 0 var(--space-4); padding-bottom: var(--space-2); border-bottom: var(--border-thin) solid var(--color-line); } /* ---------- 设备与系统 ---------- */ .page-app-download-android .and-spec__grid { display: grid; gap: var(--space-4); } .page-app-download-android .and-table { width: 100%; border-collapse: collapse; font-size: var(--text-base); margin: 0; } .page-app-download-android .and-table__caption { caption-side: top; text-align: left; font-size: var(--text-sm); color: var(--color-ink-muted); padding-bottom: var(--space-2); } .page-app-download-android .and-table th[scope="row"] { text-align: left; vertical-align: top; font-weight: 600; color: var(--color-ink); padding: var(--space-2) var(--space-2) var(--space-2) 0; border-top: var(--border-thin) dotted var(--color-line); line-height: 1.55; } .page-app-download-android .and-table td { vertical-align: top; color: var(--color-ink-soft); padding: var(--space-2) 0; border-top: var(--border-thin) dotted var(--color-line); line-height: 1.7; transition: background-color 120ms ease; } .page-app-download-android .and-table tr:hover th[scope="row"], .page-app-download-android .and-table tr:hover td { background-color: var(--color-surface-alt); } .page-app-download-android .and-spec__aside { margin-top: var(--space-6); } .page-app-download-android .and-spec__fig { margin: 0; } .page-app-download-android .media { max-width: 100%; overflow: hidden; } .page-app-download-android .media img { display: block; width: 100%; height: auto; object-fit: cover; } .page-app-download-android .media__caption { font-size: var(--text-sm); color: var(--color-ink-muted); line-height: 1.5; margin-top: var(--space-2); } /* ---------- 安装三步 ---------- */ .page-app-download-android .and-steps__intro { font-size: var(--text-base); color: var(--color-ink-soft); margin: 0; max-width: var(--measure); } .page-app-download-android .and-steps__list { list-style: none; margin: var(--space-6) 0 0; padding: 0; display: grid; gap: var(--space-6); } .page-app-download-android .and-step { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2); padding-top: var(--space-3); border-top: var(--border-thin) solid var(--color-line); } .page-app-download-android .and-step__no { margin: 0; font-family: var(--font-mono); font-size: var(--text-lg); line-height: 1.2; color: var(--color-primary); border: var(--border-thin) solid var(--color-primary); border-radius: var(--radius-sm); padding: var(--space-1) var(--space-2); min-width: var(--space-8); text-align: center; justify-self: start; } .page-app-download-android .and-step__body h3 { font-family: var(--font-heading); font-size: var(--text-lg); font-weight: var(--weight-heading); line-height: var(--leading-heading); color: var(--color-ink); margin: 0 0 var(--space-2); } .page-app-download-android .and-step__body p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0 0 var(--space-1); max-width: var(--measure); } .page-app-download-android .and-step__key { color: var(--color-ink); font-weight: 600; margin-right: var(--space-1); } .page-app-download-android .and-steps__fig { margin: var(--space-8) 0 0; } /* ---------- 权限 ---------- */ .page-app-download-android .and-perms__grid { display: grid; gap: var(--space-4); } .page-app-download-android .and-perms__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); } .page-app-download-android .and-perms__list li { border-left: calc(var(--border-thin) * 3) solid var(--color-primary); padding-left: var(--space-2); transition: border-color 120ms ease; } .page-app-download-android .and-perms__list li:hover { border-left-color: var(--color-accent); } .page-app-download-android .and-perms__list h3 { font-family: var(--font-heading); font-size: var(--text-base); font-weight: var(--weight-heading); color: var(--color-ink); margin: 0 0 var(--space-1); } .page-app-download-android .and-perms__list p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0; max-width: var(--measure); } .page-app-download-android .and-perms__fig { margin: 0; } .page-app-download-android .and-perms__aside { margin-top: var(--space-6); } /* ---------- 差异矩阵 ---------- */ .page-app-download-android .and-diff__intro { font-size: var(--text-base); color: var(--color-ink-soft); margin: 0; max-width: var(--measure); } .page-app-download-android .and-matrix { width: 100%; border-collapse: collapse; margin-top: var(--space-4); font-size: var(--text-base); } .page-app-download-android .and-matrix th, .page-app-download-android .and-matrix td { text-align: left; vertical-align: top; padding: var(--space-2); border-bottom: var(--border-thin) dotted var(--color-line); line-height: 1.7; overflow-wrap: break-word; } .page-app-download-android .and-matrix thead th { font-size: var(--text-sm); font-weight: 600; letter-spacing: 0.06em; color: var(--color-ink); background-color: var(--color-surface-deep); border-bottom: var(--border-thin) solid var(--color-line); } .page-app-download-android .and-matrix tbody th[scope="row"] { font-weight: 600; color: var(--color-ink); white-space: nowrap; width: 1%; } .page-app-download-android .and-matrix td { color: var(--color-ink-soft); } .page-app-download-android .and-matrix .and-matrix__diff { background-color: var(--color-primary-soft); color: var(--color-ink); } .page-app-download-android .and-diff__more { font-size: var(--text-base); color: var(--color-ink-soft); margin: var(--space-4) 0 0; } /* ---------- 版本 ---------- */ .page-app-download-android .and-version__inner { display: grid; gap: var(--space-2); padding: var(--space-4); background-color: var(--color-surface-alt); border-top: var(--border-thin) solid var(--color-line); border-bottom: var(--border-thin) solid var(--color-line); } .page-app-download-android .and-version__inner .stamp { justify-self: start; } .page-app-download-android .and-version__num { font-family: var(--font-mono); font-size: var(--text-2xl); line-height: 1; color: var(--color-primary); margin: 0; } .page-app-download-android .and-version__text p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0 0 var(--space-2); max-width: var(--measure); } .page-app-download-android .and-version__text p:last-child { margin-bottom: 0; } /* ---------- 问答 ---------- */ .page-app-download-android .and-faq__folds { margin-top: var(--space-4); } .page-app-download-android .and-faq__folds .fold__body p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-ink-soft); margin: 0 0 var(--space-1); max-width: var(--measure); } .page-app-download-android .and-faq__folds .fold__body p:last-child { margin-bottom: 0; } /* ---------- 出口 ---------- */ .page-app-download-android .and-exit { padding: var(--section-y) 0; } .page-app-download-android .and-exit__inner { display: grid; gap: var(--space-2); } .page-app-download-android .and-exit__inner .stamp { justify-self: start; } .page-app-download-android .and-exit h2 { font-family: var(--font-heading); font-size: var(--text-xl); font-weight: var(--weight-heading); line-height: var(--leading-heading); color: var(--color-contrast-ink); margin: 0; max-width: 34ch; } .page-app-download-android .and-exit p { font-size: var(--text-base); line-height: var(--leading-body); color: var(--color-contrast-ink); margin: 0; max-width: var(--measure); } .page-app-download-android .and-exit a { color: var(--color-contrast-accent); text-decoration: underline; text-underline-offset: 3px; } .page-app-download-android a { color: var(--color-accent); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; transition: text-decoration-thickness 120ms ease; } .page-app-download-android a:hover { text-decoration-thickness: 2px; } .page-app-download-android a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; } /* ---------- 响应式 ---------- */ @media (min-width: 700px) { .page-app-download-android .and-band__row { grid-template-columns: repeat(4, minmax(0, 1fr)); } .page-app-download-android .and-step { grid-template-columns: auto minmax(0, 1fr); gap: var(--space-3); align-items: start; } .page-app-download-android .and-step__no { justify-self: start; } } @media (min-width: 880px) { .page-app-download-android .and-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-8); align-items: end; } .page-app-download-android h1 { font-size: var(--text-3xl); } .page-app-download-android .and-spec__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-6); align-items: start; } .page-app-download-android .and-perms__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-6); align-items: start; } .page-app-download-android .and-spec__fig { margin-right: calc(var(--space-3) * -1); } .page-app-download-android .and-version__inner { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) minmax(0, 7fr); align-items: start; gap: var(--space-4); } .page-app-download-android .and-version__num { font-size: var(--text-3xl); } } @media (min-width: 1040px) { .page-app-download-android .and-spec__fig { margin-right: calc(var(--space-6) * -1); } .page-app-download-android .and-exit h2 { font-size: var(--text-2xl); } } @media (prefers-reduced-motion: reduce) { .page-app-download-android a, .page-app-download-android .and-table td, .page-app-download-android .and-perms__list li { transition: none; } }