/* 查手机 · 微信/相册 样板页样式。原创实现，视觉上贴近大家熟悉的 iOS 系统 App 观感
   （状态栏 + 居中标题导航栏 + 微信聊天气泡配色 + 相簿黑底九宫格），独立样式表，不混进 ta.css */

.wechat-app, .album-app, .map-app, .music-app, .browser-app, .notes-app, .wallet-app, .clock-app { position: absolute; inset: 0; z-index: 9; overflow: hidden auto; -webkit-overflow-scrolling: touch; }
.wechat-app[hidden], .album-app[hidden], .map-app[hidden], .music-app[hidden], .browser-app[hidden], .notes-app[hidden], .wallet-app[hidden], .clock-app[hidden] { display: none; }

/* ---------- 状态栏（时间 / 电量，纯文字，不抄任何具体图标资源） ---------- */

.ios-statusbar { display: flex; align-items: center; justify-content: space-between; padding: max(6px, env(safe-area-inset-top)) 22px 2px; font-size: 14px; font-weight: 600; color: #101014; letter-spacing: .2px; }
.ios-statusbar-dark { color: #fff; }
.ios-statusbar-battery::after { content: ""; display: inline-block; width: 20px; height: 10px; margin-left: 5px; border: 1.4px solid currentColor; border-radius: 3px; vertical-align: middle; }

/* ---------- 微信：浅色主题，贴近真实微信配色 ---------- */

.wechat-app { background: #ededed; color: #1a1a1a; }
.phoneapp-toolbar { position: relative; display: flex; align-items: center; justify-content: center; height: 46px; padding: 0 50px; background: #ededed; }
.phoneapp-toolbar button { position: absolute; left: 6px; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; border: 0; background: transparent; color: #1a1a1a; font: 26px/1 Arial; display: grid; place-items: center; }
.phoneapp-toolbar h1 { margin: 0; font-size: 17px; font-weight: 600; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.phoneapp-toolbar > span { display: none; }
.wechat-signature-line { margin: 0; padding: 0 20px 6px; text-align: center; font-size: 11.5px; color: #8a8a8a; }

.phoneapp-tabs { display: flex; gap: 0; padding: 0 16px 8px; border-bottom: 1px solid #dcdcdc; }
.phoneapp-tab { flex: 1; border: 0; background: transparent; padding: 8px 0 10px; font-size: 14.5px; font-weight: 500; color: #8a8a8a; border-bottom: 2px solid transparent; }
.phoneapp-tab.active { color: #1a1a1a; font-weight: 600; border-bottom-color: #07c160; }

.phoneapp-body { padding: 0 0 calc(30px + var(--safe-bottom)); }
.phoneapp-empty { text-align: center; color: #9a9a9a; font-size: 13px; padding: 60px 20px; }

.phoneapp-loading { display: grid; place-items: center; align-content: center; gap: 14px; min-height: min(50vh, 360px); color: #9a9a9a; font-size: 13px; }
.phoneapp-loading .spin { width: 26px; height: 26px; border-radius: 50%; border: 2px solid rgb(0 0 0 / 12%); border-top-color: #07c160; animation: phoneappspin .8s linear infinite; }
@keyframes phoneappspin { to { transform: rotate(360deg); } }
.phoneapp-retry { margin-top: 2px; border: 0; background: #07c160; color: #fff; font-size: 12.5px; font-weight: 600; padding: 8px 18px; border-radius: 18px; }

/* ---------- 微信 · 聊天列表 ---------- */

.wechat-thread-list { display: flex; flex-direction: column; background: #fff; }
.wechat-thread-item { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border: 0; background: transparent; color: inherit; text-align: left; border-bottom: .5px solid #ebebeb; }
.wechat-thread-avatar { position: relative; width: 46px; height: 46px; border-radius: 6px; flex: none; display: grid; place-items: center; font-size: 17px; font-weight: 600; color: #fff; background: linear-gradient(135deg, #6fa8dc, #4a86c5); }
.wechat-thread-main { flex: 1; min-width: 0; }
.wechat-thread-main .row1 { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.wechat-thread-main strong { font-size: 16px; font-weight: 500; color: #1a1a1a; }
.wechat-thread-main .tag { font-size: 10.5px; color: #b0b0b0; margin-left: 6px; font-weight: 400; }
.wechat-thread-main .time { font-size: 11.5px; color: #b0b0b0; flex: none; }
.wechat-thread-main .preview { margin-top: 3px; font-size: 13.5px; color: #8a8a8a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wechat-thread-unread { position: absolute; top: -4px; right: -4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: #fa5151; color: #fff; font-size: 10px; font-weight: 700; display: grid; place-items: center; }

/* ---------- 微信 · 聊天气泡详情 ---------- */

.wechat-thread-body { background: #ededed; padding: 12px 12px calc(24px + var(--safe-bottom)); min-height: calc(100% - 46px); }
.wechat-bubble-view { display: flex; flex-direction: column; gap: 10px; }
.wechat-bubble-row { display: flex; }
.wechat-bubble-row.me { justify-content: flex-end; }
.wechat-bubble { position: relative; max-width: 72%; padding: 9px 12px; border-radius: 6px; font-size: 15.5px; line-height: 1.45; background: #fff; color: #1a1a1a; box-shadow: 0 1px 0 rgb(0 0 0 / 4%); }
.wechat-bubble::before { content: ""; position: absolute; top: 12px; width: 0; height: 0; border: 6px solid transparent; }
.wechat-bubble-row:not(.me) .wechat-bubble::before { left: -8px; border-right-color: #fff; }
.wechat-bubble-row.me .wechat-bubble { background: #95ec69; }
.wechat-bubble-row.me .wechat-bubble::before { right: -8px; border-left-color: #95ec69; }

/* ---------- 微信 · 朋友圈 ---------- */

.moments-list { display: flex; flex-direction: column; background: #fff; }
.moment-card { padding: 14px 16px; border-bottom: .5px solid #ebebeb; }
.moment-card .moment-time { font-size: 11.5px; color: #b0b0b0; }
.moment-card .moment-text { margin: 6px 0 10px; font-size: 15px; line-height: 1.55; color: #1a1a1a; }
.moment-scene { height: 150px; border-radius: 6px; margin-bottom: 10px; }
.moment-scene.warm { background: linear-gradient(135deg, #e8b56a, #d97757); }
.moment-scene.cool { background: linear-gradient(135deg, #5b8fd8, #3d5ba0); }
.moment-scene.mono { background: linear-gradient(135deg, #8a8f98, #4a4d54); }
.moment-scene.soft { background: linear-gradient(135deg, #d89bd8, #9b7fd8); }
.moment-foot { display: flex; align-items: center; justify-content: space-between; }
.moment-stats { font-size: 12px; color: #576b95; }
.moment-peek-btn { border: 0; background: #f5f5f5; color: #576b95; font-size: 11.5px; padding: 5px 11px; border-radius: 10px; }
.moment-truemood { margin-top: 10px; padding: 9px 11px; border-radius: 8px; background: #f7f7f7; font-size: 12.5px; color: #6a6a6a; font-style: italic; border-left: 2px solid #07c160; }
.moment-truemood[hidden] { display: none; }

/* ---------- 相册：深色主题，贴近 iOS 相簿 App ---------- */

.album-app { background: #000; color: #fff; }
.phoneapp-toolbar-dark { background: #000; }
.phoneapp-toolbar-dark button, .phoneapp-toolbar-dark h1 { color: #0a84ff; }
.phoneapp-toolbar-dark h1 { color: #fff; }
#album-grid-back { font-size: 16px !important; font-weight: 400; width: auto !important; white-space: nowrap; }

.album-list { display: flex; flex-direction: column; padding-top: 6px; }
.album-item { display: flex; align-items: center; gap: 12px; padding: 8px 16px; border: 0; background: transparent; color: inherit; text-align: left; }
.album-cover { width: 56px; height: 56px; border-radius: 6px; flex: none; }
.album-item strong { font-size: 16px; font-weight: 400; display: block; color: #fff; }
.album-item span { font-size: 13px; color: #8a8a8a; }

.photo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5px; padding-top: 1.5px; }
.photo-cell { aspect-ratio: 1; border: 0; padding: 0; position: relative; overflow: hidden; }
.photo-cell::after { content: attr(data-caption); position: absolute; left: 0; right: 0; bottom: 0; padding: 5px 6px; font-size: 10px; line-height: 1.3; color: rgb(255 255 255 / 92%); background: linear-gradient(to top, rgb(0 0 0 / 55%), transparent); text-align: left; }
.photo-cell.warm { background: linear-gradient(135deg, #e8b56a, #d97757); }
.photo-cell.cool { background: linear-gradient(135deg, #5b8fd8, #3d5ba0); }
.photo-cell.mono { background: linear-gradient(135deg, #8a8f98, #4a4d54); }
.photo-cell.soft { background: linear-gradient(135deg, #d89bd8, #9b7fd8); }

.photo-detail-shade { position: fixed; inset: 0; background: rgb(0 0 0 / 80%); z-index: 20; }
.photo-detail-shade[hidden] { display: none; }
.photo-detail { position: fixed; left: 0; right: 0; bottom: 0; z-index: 21; background: #1c1c1e; border-radius: 18px 18px 0 0; padding: 16px 18px calc(18px + var(--safe-bottom)); color: #fff; }
.photo-detail[hidden] { display: none; }
.photo-detail .photo-detail-scene { height: 220px; border-radius: 12px; margin-bottom: 14px; }
.photo-detail strong { font-size: 16px; font-weight: 600; display: block; margin-bottom: 6px; }
.photo-detail p { margin: 0 0 4px; font-size: 13px; color: rgb(255 255 255 / 60%); }
.photo-detail-close { margin-top: 12px; width: 100%; border: 0; padding: 11px 0; border-radius: 12px; background: rgb(255 255 255 / 12%); color: #fff; font-size: 14px; font-weight: 600; }

/* ---------- 地图：浅色主题，贴近 iOS 地图“收藏地点”列表 ---------- */

.map-app { background: #f2f2f7; color: #1a1a1a; }
.map-place-list { display: flex; flex-direction: column; padding-top: 6px; background: #fff; margin: 10px 12px; border-radius: 12px; overflow: hidden; }
.map-place-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-bottom: .5px solid #ececec; }
.map-place-item:last-child { border-bottom: 0; }
.map-place-pin { width: 34px; height: 34px; border-radius: 50%; flex: none; display: grid; place-items: center; font-size: 15px; color: #fff; }
.map-place-pin.home { background: #34c759; }
.map-place-pin.work { background: #0a84ff; }
.map-place-pin.shop { background: #ff9f0a; }
.map-place-pin.outdoor { background: #30b0c7; }
.map-place-pin.other { background: #8e8e93; }
.map-place-main { flex: 1; min-width: 0; }
.map-place-main .row1 { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.map-place-main strong { font-size: 15.5px; font-weight: 600; }
.map-place-main .tag { font-size: 11px; color: #8e8e93; }
.map-place-main p { margin: 3px 0 0; font-size: 13px; color: #6a6a6a; }

/* ---------- 音乐：深色主题，贴近 Apple Music ---------- */

.music-app { background: #121212; color: #fff; }
.music-app .phoneapp-toolbar { background: #121212; }
.music-app .phoneapp-toolbar button, .music-app .phoneapp-toolbar h1 { color: #fff; }
.music-now { margin: 14px 16px; padding: 18px; border-radius: 16px; background: linear-gradient(135deg, #fa2d48, #6f2cff); display: flex; align-items: center; gap: 14px; }
.music-now-art { width: 56px; height: 56px; border-radius: 8px; background: rgb(255 255 255 / 20%); flex: none; display: grid; place-items: center; font-size: 22px; }
.music-now-info strong { display: block; font-size: 16px; font-weight: 700; }
.music-now-info span { font-size: 12.5px; color: rgb(255 255 255 / 75%); }
.music-section-title { margin: 18px 16px 8px; font-size: 13px; font-weight: 600; color: rgb(255 255 255 / 65%); }
.music-track-list { margin: 0 12px; }
.music-track-item { display: flex; align-items: center; gap: 12px; padding: 9px 4px; border-bottom: .5px solid rgb(255 255 255 / 8%); }
.music-track-art { width: 40px; height: 40px; border-radius: 6px; flex: none; background: linear-gradient(135deg, #5b8fd8, #3d5ba0); }
.music-track-info { flex: 1; min-width: 0; }
.music-track-info strong { display: block; font-size: 14.5px; font-weight: 500; }
.music-track-info span { font-size: 12px; color: rgb(255 255 255 / 55%); }
.music-track-time { font-size: 11.5px; color: rgb(255 255 255 / 40%); flex: none; }
.music-playlist-row { display: flex; gap: 12px; margin: 0 12px; overflow-x: auto; padding-bottom: 10px; }
.music-playlist-card { flex: none; width: 110px; }
.music-playlist-cover { width: 110px; height: 110px; border-radius: 10px; background: linear-gradient(135deg, #d89bd8, #9b7fd8); margin-bottom: 6px; }
.music-playlist-card strong { display: block; font-size: 13px; font-weight: 500; }
.music-playlist-card span { font-size: 11px; color: rgb(255 255 255 / 50%); }

/* ---------- 浏览器：浅色主题，贴近 Safari 起始页 ---------- */

.browser-app { background: #f2f2f7; color: #1a1a1a; }
.browser-app .phoneapp-toolbar { background: #f2f2f7; }
.browser-searchbar { margin: 10px 16px 4px; padding: 9px 14px; border-radius: 10px; background: #e2e2e6; color: #8a8a8e; font-size: 14px; display: flex; align-items: center; gap: 6px; }
.browser-app .phoneapp-tabs { background: #f2f2f7; }
.browser-list { margin: 8px 12px; background: #fff; border-radius: 12px; overflow: hidden; }
.browser-history-item, .browser-bookmark-item { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-bottom: .5px solid #ececec; }
.browser-history-item:last-child, .browser-bookmark-item:last-child { border-bottom: 0; }
.browser-history-icon { width: 26px; height: 26px; border-radius: 50%; flex: none; background: #e2e2e6; display: grid; place-items: center; font-size: 12px; color: #8a8a8e; }
.browser-history-main { flex: 1; min-width: 0; }
.browser-history-main strong { display: block; font-size: 14.5px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.browser-history-main span { font-size: 11.5px; color: #8a8a8e; }
.browser-bookmark-icon { width: 30px; height: 30px; border-radius: 8px; flex: none; background: linear-gradient(135deg, #0a84ff, #5ac8fa); }
.browser-bookmark-main strong { display: block; font-size: 14.5px; font-weight: 500; }
.browser-bookmark-main span { font-size: 11.5px; color: #8a8a8e; }

/* ---------- 备忘录：浅色纸感，贴近 iOS 备忘录 ---------- */

.notes-app { background: #fff; color: #1a1a1a; }
.notes-app .phoneapp-toolbar { background: #fff; border-bottom: .5px solid #ececec; }
.notes-list { display: flex; flex-direction: column; }
.note-item { padding: 12px 16px; border-bottom: .5px solid #ececec; }
.note-item-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.note-item-head strong { font-size: 15.5px; font-weight: 600; }
.note-item-head span { font-size: 11.5px; color: #b0a34a; flex: none; }
.note-preview { margin: 4px 0 0; font-size: 13px; color: #8a8a8a; white-space: pre-wrap; }
.note-item.expanded .note-preview { color: #3a3a3a; }

/* ---------- 钱包：深色主题，贴近 Apple Wallet ---------- */

.wallet-app { background: #000; color: #fff; }
.wallet-app .phoneapp-toolbar { background: #000; }
.wallet-app .phoneapp-toolbar button, .wallet-app .phoneapp-toolbar h1 { color: #fff; }
.wallet-card { margin: 16px; padding: 22px 20px; border-radius: 16px; background: linear-gradient(135deg, #2c2c2e, #1c1c1e); box-shadow: 0 6px 20px rgb(0 0 0 / 40%); }
.wallet-card small { font-size: 12px; color: rgb(255 255 255 / 55%); }
.wallet-card strong { display: block; margin-top: 6px; font-size: 30px; font-weight: 700; letter-spacing: .5px; }
.wallet-tx-list { margin: 0 12px; }
.wallet-tx-item { display: flex; align-items: center; gap: 12px; padding: 11px 4px; border-bottom: .5px solid rgb(255 255 255 / 8%); }
.wallet-tx-main { flex: 1; min-width: 0; }
.wallet-tx-main strong { display: block; font-size: 14.5px; font-weight: 500; }
.wallet-tx-main span { font-size: 11.5px; color: rgb(255 255 255 / 50%); }
.wallet-tx-amount { font-size: 15px; font-weight: 600; flex: none; }
.wallet-tx-amount.out { color: rgb(255 255 255 / 85%); }
.wallet-tx-amount.in { color: #30d158; }

/* ---------- 时钟：深色主题，贴近 iOS 时钟闹钟列表 ---------- */

.clock-app { background: #000; color: #fff; }
.clock-app .phoneapp-toolbar { background: #000; }
.clock-app .phoneapp-toolbar button, .clock-app .phoneapp-toolbar h1 { color: #fff; }
.clock-alarm-list { margin: 8px 16px; }
.clock-alarm-item { display: flex; align-items: center; justify-content: space-between; padding: 14px 4px; border-bottom: .5px solid rgb(255 255 255 / 10%); }
.clock-alarm-item.disabled .clock-alarm-time, .clock-alarm-item.disabled .clock-alarm-label { color: rgb(255 255 255 / 35%); }
.clock-alarm-time { font-size: 30px; font-weight: 300; }
.clock-alarm-label { display: block; font-size: 12.5px; color: rgb(255 255 255 / 55%); margin-top: 2px; }
.clock-toggle { width: 46px; height: 26px; border-radius: 13px; border: 0; background: rgb(255 255 255 / 18%); position: relative; flex: none; transition: background .15s; }
.clock-toggle::after { content: ""; position: absolute; top: 2px; left: 2px; width: 22px; height: 22px; border-radius: 50%; background: #fff; transition: transform .15s; }
.clock-toggle.on { background: #30d158; }
.clock-toggle.on::after { transform: translateX(20px); }

/* ---------- 刷新弹窗 app 勾选列表（registry 驱动，沿用 .refresh-app 既有样式） ---------- */

.refresh-app { cursor: pointer; }
.refresh-app.disabled { opacity: .45; pointer-events: none; }
.refresh-app .soon-tag { display: block; font-size: 10px; font-weight: 400; color: var(--ink-3); }
.refresh-radio { transition: background .15s, border-color .15s; }
.refresh-radio.selected { border-color: var(--ink); background: var(--ink); box-shadow: inset 0 0 0 2px var(--neutral-surface, #fff); }