/* ============================================================
   星港 STARPORT · 页面样式 v1
   只补充页面级布局与细节，token / 基础组件全部复用 design-system.css。
   ============================================================ */

/* ---------- 通用补充 ---------- */
.page-head { margin-bottom: 24px; }
.page-head__main { min-width: 0; }
.page-head__meta { margin-top: 10px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; font-size: 11.5px; color: var(--text-3); }
.page-head__meta .mono { font-size: 11px; }
.eyebrow .sep { color: var(--text-3); opacity: .45; margin: 0 8px; letter-spacing: .1em; }

.field__err { display: flex; align-items: flex-start; gap: 6px; font-size: 12px; line-height: 1.6; color: #FF9494; }
.field__err[hidden] { display: none; }
.field__err svg { flex: none; margin-top: 2px; }
.input.is-invalid, .input.is-invalid:hover, .input.is-invalid:focus { border-color: rgba(255, 107, 107, .55); box-shadow: 0 0 0 3px rgba(255, 107, 107, .08); }
.otp.is-err input { border-color: rgba(255, 107, 107, .42); background: rgba(255, 107, 107, .04); }

.btn.is-loading { position: relative; color: transparent !important; pointer-events: none; }
.btn.is-loading svg { opacity: 0; }
.btn.is-loading::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 15px; height: 15px; margin: -7.5px 0 0 -7.5px;
  border-radius: 50%; border: 2px solid rgba(4, 20, 15, .28); border-top-color: #04140F; animation: sp-spin .7s linear infinite;
}
.btn--ghost.is-loading::after, .btn--quiet.is-loading::after { border-color: rgba(233, 240, 255, .18); border-top-color: var(--ion); }
@keyframes sp-spin { to { transform: rotate(360deg); } }

.btn--dock {
  color: #20050F; background: linear-gradient(120deg, var(--flux), #FF9A6B);
  box-shadow: 0 0 0 1px rgba(255, 92, 147, .32), 0 12px 30px -16px rgba(255, 92, 147, .72);
}
.btn--dock:hover { filter: brightness(1.06); box-shadow: 0 0 0 1px rgba(255, 92, 147, .5), 0 16px 36px -16px rgba(255, 92, 147, .85); }
.btn--danger-ghost { color: #FF9FAD; border: 1px solid rgba(255, 107, 107, .3); background: rgba(255, 107, 107, .05); }
.btn--danger-ghost:hover { color: #FFC2C2; border-color: rgba(255, 107, 107, .55); background: rgba(255, 107, 107, .09); }

.linkbtn { font-size: 12px; color: var(--text-3); transition: color .18s; white-space: nowrap; }
.linkbtn:hover { color: var(--ion); }
.linkbtn[disabled] { opacity: .55; pointer-events: none; }

.seg { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255, 255, 255, .015); }
.seg__btn { height: 30px; padding: 0 12px; border-radius: 7px; font-size: 12px; color: var(--text-3); transition: .16s var(--ease); white-space: nowrap; }
.seg__btn:hover { color: var(--text-2); }
.seg__btn.is-on { color: var(--text); background: rgba(53, 232, 210, .1); box-shadow: inset 0 0 0 1px rgba(53, 232, 210, .28); }
.seg__btn.is-on-hot { color: #FFC2D5; background: rgba(255, 92, 147, .1); box-shadow: inset 0 0 0 1px rgba(255, 92, 147, .3); }

.skel-stack { display: flex; flex-direction: column; gap: 10px; padding: 6px 0; }
.term__msg b { color: var(--text); font-weight: 500; }
.tl__tag { margin-left: 8px; font-size: 9.5px; letter-spacing: .1em; color: var(--text-3); }
.tl__item--dim::before { border-color: var(--line-2); }

/* ============================================================
   登录 /login
   ============================================================ */
.auth { display: grid; grid-template-columns: minmax(0, 46fr) minmax(0, 54fr); min-height: 100vh; }

.auth__aside { position: relative; display: flex; flex-direction: column; padding: 36px 44px 28px; border-right: 1px solid var(--line); overflow: hidden; }
.auth__aside::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(560px 560px at 16% 32%, rgba(53, 232, 210, .06), transparent 62%),
    radial-gradient(460px 460px at 84% 84%, rgba(139, 124, 255, .07), transparent 64%);
}
.auth__aside::after {
  content: ""; position: absolute; left: 44px; right: 44px; top: 30%; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(150, 180, 235, .16) 18%, rgba(150, 180, 235, .16) 82%, transparent);
}
.auth__brand { position: relative; z-index: 1; }

.auth__art { position: relative; z-index: 1; flex: 1; display: grid; place-items: center; min-height: 300px; padding: 26px 0; }
.orbitx { position: relative; width: min(30vw, 330px); min-width: 220px; aspect-ratio: 1; display: grid; place-items: center; }
.orbitx__ring { position: absolute; inset: 0; border: 1px solid var(--line-2); border-radius: 50%; }
.orbitx__ring--dash { inset: 11%; border-style: dashed; border-color: rgba(150, 180, 235, .17); animation: sp-orbit 64s linear infinite; }
.orbitx__ring--inner { inset: 30%; border-color: rgba(53, 232, 210, .32); box-shadow: 0 0 44px -18px rgba(53, 232, 210, .45), inset 0 0 44px -24px rgba(53, 232, 210, .55); }
.orbitx__axis { position: absolute; left: -16%; right: -16%; top: 50%; height: 1px; background: linear-gradient(90deg, transparent, rgba(150, 180, 235, .18), transparent); }
.orbitx__axis--v { left: 50%; right: auto; top: -12%; bottom: -12%; width: 1px; height: auto; background: linear-gradient(180deg, transparent, rgba(150, 180, 235, .13), transparent); }
.orbitx__spin { position: absolute; inset: 0; animation: sp-orbit 64s linear infinite; }
.orbitx__spin--rev { inset: 11%; animation-duration: 46s; animation-direction: reverse; }
.orbitx__sat { position: absolute; left: 50%; top: 0; width: 5px; height: 5px; margin: -2.5px 0 0 -2.5px; border-radius: 50%; background: var(--text); box-shadow: 0 0 12px rgba(233, 240, 255, .7); }
.orbitx__sat--hot { background: var(--flux); box-shadow: 0 0 12px rgba(255, 92, 147, .8); }
.orbitx__core { width: 7px; height: 7px; border-radius: 50%; background: var(--ion); box-shadow: 0 0 0 5px rgba(53, 232, 210, .09), 0 0 26px rgba(53, 232, 210, .85); }
.orbitx__label { position: absolute; right: -2%; top: -26px; font-size: 9.5px; letter-spacing: .2em; color: var(--text-3); white-space: nowrap; }
.orbitx__label--b { right: auto; left: 0; top: auto; bottom: -26px; }
@keyframes sp-orbit { to { transform: rotate(360deg); } }

.auth__say { position: relative; z-index: 1; }
.auth__quote { font-size: clamp(20px, 1.7vw, 24px); line-height: 1.78; font-weight: 500; letter-spacing: .01em; color: var(--text); }
.auth__modules { display: flex; align-items: center; gap: 12px; margin-top: 18px; font-size: 10.5px; letter-spacing: .24em; color: var(--text-3); text-transform: uppercase; }
.auth__modules i { width: 16px; height: 1px; background: var(--line-2); }
.auth__foot { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 16px; margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--line); font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .14em; color: var(--text-3); text-transform: uppercase; }

.auth__main { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 56px 40px 40px; }
.auth__panel { width: 100%; max-width: 404px; }
.auth__title { margin-top: 14px; font-size: 27px; font-weight: 600; letter-spacing: -.015em; line-height: 1.3; }
.auth__sub { margin-top: 10px; font-size: 12.5px; line-height: 1.75; color: var(--text-3); }
.auth__mail { color: var(--text-2); font-size: 12px; }

.auth__steps { display: flex; align-items: center; gap: 12px; margin: 28px 0 22px; }
.auth__step { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-3); transition: color .2s; }
.auth__step .mono { display: grid; place-items: center; min-width: 22px; height: 18px; padding: 0 4px; border: 1px solid var(--line); border-radius: 4px; font-size: 9.5px; letter-spacing: .08em; color: var(--text-3); transition: .2s; }
.auth__step.is-on { color: var(--text); }
.auth__step.is-on .mono { background: var(--ion); border-color: var(--ion); color: #04140F; box-shadow: 0 0 16px -4px rgba(53, 232, 210, .8); }
.auth__step.is-done .mono { color: var(--ion); border-color: rgba(53, 232, 210, .35); }
.auth__step-line { flex: 1; max-width: 64px; height: 1px; background: var(--line); }
.auth__step-line.is-on { background: linear-gradient(90deg, rgba(53, 232, 210, .5), var(--line)); }

.auth__form { display: flex; flex-direction: column; gap: 16px; }
.auth__form .field { gap: 9px; }
.auth__meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; font-size: 11px; color: var(--text-3); }
.auth__meta .mono { font-size: 10px; letter-spacing: .14em; }
.auth .otp { justify-content: flex-start; gap: 10px; }
.auth .otp input { width: 46px; min-width: 0; height: 56px; font-size: 23px; }

.auth__dev { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; padding: 9px 11px; border: 1px solid rgba(255, 200, 87, .26); border-radius: 8px; background: rgba(255, 200, 87, .05); font-size: 11.5px; line-height: 1.5; color: #F0D9A6; }
.auth__dev-tag { flex: none; padding: 4px 6px; border: 1px solid rgba(255, 200, 87, .32); border-radius: 4px; font: 600 9px/1 var(--font-display); letter-spacing: .16em; text-transform: uppercase; color: var(--flare); }
.auth__dev-text { min-width: 0; }
.auth__dev-text b { color: #FFE1A8; font-size: 12.5px; letter-spacing: .12em; }
.auth__dev-fill { flex: none; margin-left: auto; padding-bottom: 1px; border-bottom: 1px solid rgba(255, 200, 87, .35); font-size: 11.5px; color: var(--flare); }
.auth__dev-fill:hover { color: #FFE1A8; }
.auth__footrow { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 16px; }
.auth__legal { margin-top: 44px; max-width: 404px; text-align: center; font-size: 11px; line-height: 1.9; color: var(--text-3); }

@media (max-width: 1100px) {
  .auth { grid-template-columns: minmax(0, 44fr) minmax(0, 56fr); }
  .auth__aside { padding: 30px 32px 24px; }
  .auth__quote { font-size: 20px; }
}
@media (max-width: 900px) {
  .auth { grid-template-columns: 1fr; }
  .auth__aside { flex: none; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 14px; padding: 20px 22px 18px; border-right: 0; border-bottom: 1px solid var(--line); }
  .auth__aside::after { display: none; }
  .auth__art { display: none; }
  .auth__say { order: 3; width: 100%; }
  .auth__quote { font-size: 16px; line-height: 1.7; }
  .auth__quote br { display: none; }
  .auth__modules, .auth__foot { display: none; }
  .auth__main { flex: 1; justify-content: center; padding: 32px 22px 44px; }
  .auth .otp { gap: 8px; }
  .auth .otp input { width: 44px; height: 54px; font-size: 21px; }
  .auth__panel { max-width: 440px; }
  .auth__title { font-size: 24px; }
  .auth__legal { margin-top: 30px; }
  .auth__steps { margin: 24px 0 20px; }
}

/* ============================================================
   总览 /console
   ============================================================ */
.console__kpis { margin-bottom: 20px; }
.console__body { align-items: start; }
.console__left { min-width: 0; }
.console__hint { margin-top: 14px; font-size: 11.5px; line-height: 1.7; color: var(--text-3); }

.sec-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.sec-head h2 { display: flex; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 600; letter-spacing: .01em; }
.sec-head h2 .micro { font-size: 9.5px; font-weight: 600; }
.sec-head__meta { font-size: 10.5px; letter-spacing: .14em; color: var(--text-3); }

.accounts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.accounts--empty { display: block; }
.acc { min-height: 254px; padding: 18px; display: flex; flex-direction: column; cursor: pointer; transition: border-color .18s var(--ease), transform .18s var(--ease), opacity .18s; }
.acc:hover { border-color: var(--line-2); transform: translateY(-2px); }
.acc:focus-visible { outline: 2px solid var(--ion); outline-offset: 2px; }
.acc--off { opacity: .9; }
.acc--off:hover { opacity: 1; }
.acc--skel { cursor: default; }
.acc--skel:hover { transform: none; border-color: var(--line); }
.acc__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.acc__id { font-size: 10px; letter-spacing: .18em; color: var(--text-3); }
.acc__who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.acc__who h3 { font-size: 15.5px; font-weight: 600; letter-spacing: -.005em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc__who .mono { font-size: 10.5px; letter-spacing: 0; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc__now { flex: 1; min-width: 0; margin-top: 16px; }
.acc__now-label { display: block; margin-bottom: 7px; font-size: 9.5px; letter-spacing: .16em; }
.acc__app { font-size: 23px; font-weight: 600; letter-spacing: -.01em; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc__app--dim { font-size: 18px; font-weight: 500; color: var(--text-2); }
.acc__pkg { margin-top: 5px; font-size: 10.5px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acc__castcopy { min-height: 41px; font-size: 12.5px; line-height: 1.65; color: var(--text-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.acc__meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 10.5px; color: var(--text-3); }
.acc__meta .sep-dot { width: 2px; height: 2px; border-radius: 50%; background: var(--text-3); opacity: .5; }
.acc__foot { display: flex; gap: 8px; margin-top: 14px; }
.acc__foot .btn--dock { flex: 1; }
.acc__foot .btn--ghost { padding: 0 11px; }

.console__right { display: flex; flex-direction: column; gap: 14px; position: sticky; top: calc(var(--topbar-h) + 16px); }
.feed { display: flex; flex-direction: column; }
.feed__live { display: flex; align-items: center; gap: 6px; font-size: 9.5px; letter-spacing: .2em; color: var(--ion); }
.feed__live::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--ion); box-shadow: 0 0 8px var(--ion); animation: pulse 2.4s var(--ease) infinite; }
.feed__list { max-height: 408px; overflow-y: auto; margin: 0 -6px; padding: 2px 6px 2px 0; }
.feed .term__row { align-items: baseline; gap: 9px; padding: 5px 0; border-bottom: 1px solid rgba(150, 180, 235, .06); }
.feed .term__row:last-child { border-bottom: 0; }
.feed .term__t { flex: none; width: 52px; font-size: 10px; color: var(--text-3); }
.feed .term__tag { width: 40px; font-size: 9px; letter-spacing: .1em; }
.feed .term__msg { font-size: 11.5px; line-height: 1.65; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.feed__foot { display: flex; justify-content: space-between; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 10.5px; color: var(--text-3); }
.feed__foot .mono { font-size: 9.5px; letter-spacing: .12em; }
.feed__empty { padding: 30px 0; text-align: center; font-size: 12px; color: var(--text-3); }
.srv .kv { padding: 9px 0; font-size: 12.5px; }
.srv .kv b { font-size: 12px; }

/* 弹层内表单 */
.mform { display: flex; flex-direction: column; gap: 16px; }
.mform__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.mform__readout { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-height: 46px; }
.mform .hint { margin: 0; }
.is-spin { animation: sp-spin .9s linear infinite; }

@media (max-width: 1200px) {
  .accounts { grid-template-columns: minmax(0, 1fr); }
  .console__right { position: static; }
}
@media (max-width: 900px) {
  .console__kpis { margin-bottom: 16px; }
  .acc { min-height: 240px; }
  .acc__app { font-size: 21px; }
  .acc__foot .btn { height: 38px; }
  .feed__list { max-height: 330px; }
  .page-head__actions { width: 100%; flex-wrap: wrap; gap: 8px; padding-bottom: 0; }
  .page-head__actions .sync { margin-right: auto; font-size: 11px; }
}
@media (max-width: 600px) {
  .mform__row { grid-template-columns: minmax(0, 1fr); }
}

/* ============================================================
   账户详情 /account/:id
   ============================================================ */
.btn--dock-ghost { color: #FFB0C6; border: 1px solid rgba(255, 92, 147, .28); background: rgba(255, 92, 147, .055); }
.btn--dock-ghost:hover { color: #FFD0DE; border-color: rgba(255, 92, 147, .5); background: rgba(255, 92, 147, .1); }
.btn--dock-ghost svg { color: var(--flux); }
.acc__foot .btn--dock-ghost { flex: 1; }

.sep-dot { width: 2px; height: 2px; border-radius: 50%; background: var(--text-3); opacity: .5; display: inline-block; flex: none; }

.acc-skel-head { margin-bottom: 26px; }
.backlink { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 16px; font-size: 12px; color: var(--text-3); transition: color .18s; }
.backlink:hover { color: var(--text); }
.backlink svg { width: 14px; height: 14px; }
.acc-head__bar { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.acc-head__id { min-width: 0; }
.acc-head__title { display: flex; align-items: center; gap: 14px; margin-top: 10px; }
.acc-head__title .page-title { font-size: clamp(26px, 2.5vw, 34px); }
.acc-head__meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; font-size: 11px; color: var(--text-3); }
.acc-head__actions { display: flex; align-items: center; gap: 12px; padding-bottom: 4px; flex: none; }
.acc-head__actions .sync { font-size: 11px; color: var(--text-3); }
.acc-head__actions .sync b { color: var(--text-2); font-weight: 400; }

.dockbar { position: relative; display: flex; align-items: center; gap: 16px; padding: 15px 18px 15px 20px; margin-bottom: 18px; overflow: hidden;
  border: 1px solid rgba(255, 92, 147, .28); border-radius: var(--r-card);
  background: linear-gradient(90deg, rgba(255, 92, 147, .1), rgba(255, 92, 147, .025) 42%, transparent 78%), rgba(11, 16, 24, .72); }
.dockbar::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 2px; border-radius: 2px; background: var(--flux); box-shadow: 0 0 14px var(--flux); }
.dockbar__icon { width: 38px; height: 38px; flex: none; display: grid; place-items: center; border-radius: 10px; border: 1px solid rgba(255, 92, 147, .26); color: var(--flux); background: rgba(255, 92, 147, .07); }
.dockbar__body { min-width: 0; flex: 1; }
.dockbar__top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.dockbar__tag { font: 600 10px/1 var(--font-display); letter-spacing: .16em; text-transform: uppercase; color: #FFB0C6; }
.dockbar__meta { font-size: 10px; letter-spacing: .03em; color: rgba(255, 176, 198, .72); }
.dockbar__text { margin-top: 6px; font-size: 13.5px; line-height: 1.65; color: var(--text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.dockbar__btn { flex: none; }

.acc-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 18px; align-items: start; }
.acc-left { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.acc-right { min-width: 0; position: sticky; top: calc(var(--topbar-h) + 16px); }

/* 设备 */
.dev__hero { margin-top: 2px; }
.dev__model { font-size: 24px; font-weight: 600; letter-spacing: -.015em; line-height: 1.3; }
.dev__sub { margin-top: 4px; font-size: 11px; color: var(--text-3); }
.dev__specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 22px; margin-top: 18px; padding-top: 22px; border-top: 1px solid var(--line); }
.spec { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.spec .micro { font-size: 9.5px; }
.spec b { font-size: 15px; font-weight: 500; color: var(--text); }
.spec__sub { font-size: 10.5px; color: var(--text-3); }
.meter { margin-top: 5px; width: 76px; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .07); overflow: hidden; }
.meter i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--ion), #6FE7FF); }
.dev__perm-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0 4px; }
.dev__perm-warn { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--flare); }
.dev__perm-ok { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ion); }
.perms { margin-top: 2px; }
.perm { display: grid; grid-template-columns: auto minmax(0, 1.05fr) minmax(0, 1.7fr) auto; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.perm:last-child { border-bottom: 0; }
.perm .dot { margin-top: 1px; }
.perm__name { font-size: 12.5px; color: var(--text); }
.perm__need { font-size: 11px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.perm.is-missing .perm__name { color: #FFD9A0; }
.perm .pill { height: 22px; padding: 0 8px; font-size: 10.5px; }
.dev__warn { display: flex; align-items: flex-start; gap: 8px; margin-top: 14px; padding: 10px 12px; border: 1px solid rgba(255, 200, 87, .24); border-radius: 8px; background: rgba(255, 200, 87, .05); font-size: 11.5px; line-height: 1.7; color: #F0D9A6; }
.dev__warn svg { flex: none; margin-top: 2px; color: var(--flare); }
.dev__note { margin-top: 12px; font-size: 11px; line-height: 1.7; color: var(--text-3); }
.dev__unbound { padding-top: 8px; }

/* 正在使用 */
.now__app { margin-top: 2px; }
.now__name { font-size: 26px; font-weight: 600; letter-spacing: -.015em; line-height: 1.3; }
.now__pkg { margin-top: 5px; font-size: 11px; color: var(--text-3); }
.now__meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.now__idle { display: flex; align-items: flex-start; gap: 10px; padding: 10px 0 2px; font-size: 12.5px; line-height: 1.7; color: var(--text-3); }
.now__idle .dot { margin-top: 6px; }

/* 停靠记录 */
.hist__tl { margin-top: 2px; }
.hist .tl__item { padding-bottom: 14px; }
.hist__empty { padding: 14px 0 4px; font-size: 12px; line-height: 1.9; color: var(--text-3); }

/* 监护人 */
.prow-list { display: flex; flex-direction: column; }
.prow { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.prow:last-child { border-bottom: 0; }
.prow__mail { flex: 1; min-width: 0; font-size: 11.5px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.prow__rm { font-size: 11px; }
.prow .pill { height: 20px; padding: 0 8px; font-size: 10px; }
.prow--empty { font-size: 12px; color: var(--text-3); }
.parents .hint { margin-top: 12px; }

/* 危险操作 */
.dz { border-color: rgba(255, 107, 107, .16); }
.dz .hint { line-height: 1.8; }
.dz .btn { margin-top: 14px; }

/* 停靠编辑台 */
.editor { display: flex; flex-direction: column; gap: 18px; }
.editor__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.editor__live { display: inline-flex; align-items: center; gap: 7px; flex: none; padding-top: 3px; font-size: 9.5px; letter-spacing: .18em; color: #FFB0C6; }
.editor__block { display: flex; flex-direction: column; gap: 10px; }
.editor__textarea { min-height: 94px; resize: vertical; font-size: 13.5px; line-height: 1.7; }
.editor .field__hint.is-warn, .editor .field__hint.is-warn b { color: var(--flare); }
.editor .assets { padding-bottom: 2px; }
.editor .asset { width: 80px; }
.editor__tracks .track { padding: 9px 10px; }
.editor .track__meta { font-size: 10px; }
.editor__empty { padding: 14px; border: 1px dashed var(--line); border-radius: 10px; font-size: 12px; text-align: center; color: var(--text-3); }
.seg--wide { display: flex; width: 100%; }
.seg--wide .seg__btn { flex: 1; height: 34px; font-size: 12px; }
.seg--sm .seg__btn { height: 26px; padding: 0 10px; font-size: 11px; }
.editor__preview-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.editor__preview-head .field__label { flex: 1; }
.preview-body { display: grid; place-items: center; padding: 4px 0 2px; }
.preview-body .phone { width: min(100%, 196px); }
.preview-body.is-real { display: block; max-height: 424px; overflow: auto; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .01); }
.preview-body.is-real .phone { width: var(--dp-w, 393px); margin: 0 auto; }
.editor__note { font-size: 10.5px; line-height: 1.7; text-align: center; color: var(--text-3); }
.editor__foot { display: flex; flex-direction: column; gap: 10px; margin-top: 2px; padding-top: 16px; border-top: 1px solid var(--line); }
.editor__hint { text-align: center; font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-3); }
.cast-copy.is-empty { color: rgba(255, 255, 255, .5); }
.evt-modal { max-height: 54vh; overflow: auto; }
.evt-modal .term__row { border-bottom: 1px solid rgba(150, 180, 235, .06); padding: 4px 0; }
.evt-modal .term__msg { white-space: normal; }

@media (max-width: 1200px) {
  .acc-grid { grid-template-columns: minmax(0, 1fr); }
  .acc-right { position: static; }
  .preview-body .phone { width: min(100%, 232px); }
}
@media (max-width: 900px) {
  .acc-head__bar { flex-direction: column; align-items: flex-start; gap: 14px; }
  .acc-head__actions { width: 100%; justify-content: space-between; }
  .acc-head__title { gap: 10px; }
  .dev__specs { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
  .dockbar { flex-wrap: wrap; padding: 14px 14px 14px 18px; }
  .dockbar__icon { width: 32px; height: 32px; }
  .dockbar__body { flex: 1 1 calc(100% - 48px); }
  .dockbar__btn { width: 100%; margin-top: 4px; }
  .perm { grid-template-columns: auto minmax(0, 1fr) auto; gap: 9px; }
  .perm__need { display: none; }
  .preview-body .phone { width: min(100%, 208px); }
  .editor { gap: 16px; }
  .seg--wide .seg__btn { height: 38px; }
}
@media (max-width: 600px) {
  .dev__specs { grid-template-columns: minmax(0, 1fr); }
}

/* 移动端顶栏收紧（壳层在 design-system 中，页面侧补充） */
@media (max-width: 900px) {
  .topbar__crumbs { flex: 1; min-width: 0; overflow: hidden; }
  .topbar__crumbs a.eyebrow, .topbar__crumbs .sep { display: none; }
  .topbar__crumbs > .eyebrow { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .topbar__right { gap: 10px; flex: none; }
  .topbar__user { padding: 4px 7px 4px 4px; gap: 6px; }
  .topbar__user .dim { display: none; }
}

/* ============================================================
   素材库 /library
   ============================================================ */
.lib-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.lib-toolbar .seg b { margin-left: 4px; font-family: var(--font-mono); font-size: 10px; font-weight: 400; color: var(--text-3); }
.lib-toolbar .seg__btn.is-on b { color: var(--ion); }
.lib-toolbar__hint { font-size: 9.5px; letter-spacing: .14em; color: var(--text-3); }

.drop { display: flex; align-items: center; gap: 16px; margin-bottom: 26px; padding: 15px 18px; cursor: pointer; user-select: none;
  border: 1px dashed var(--line-2); border-radius: var(--r-card); background: rgba(255, 255, 255, .012); transition: .18s var(--ease); }
.drop:hover { border-color: rgba(53, 232, 210, .38); background: rgba(53, 232, 210, .022); }
.drop.is-over { border-color: var(--ion); background: rgba(53, 232, 210, .06); box-shadow: inset 0 0 0 1px rgba(53, 232, 210, .18); }
.drop__icon { width: 38px; height: 38px; flex: none; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 10px; color: var(--text-3); }
.drop.is-over .drop__icon { color: var(--ion); border-color: rgba(53, 232, 210, .4); }
.drop__main { flex: 1; min-width: 0; }
.drop__main b { display: block; font-size: 13.5px; font-weight: 500; color: var(--text); }
.drop__main span { display: block; margin-top: 3px; font-size: 11.5px; color: var(--text-3); }
.drop__cta { flex: none; padding-bottom: 1px; border-bottom: 1px solid rgba(53, 232, 210, .3); font-size: 12px; color: var(--ion); }

.lib-section { margin-bottom: 30px; }
.lib-section.hide { display: none; }
.lib-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 18px 14px; }
.lib-grid--empty { display: block; }
.lib-cell { min-width: 0; }
.lib-cell .asset { width: 100%; border-radius: 12px; }
.lib-tile { width: 100%; aspect-ratio: 9 / 16; border-radius: 12px; border: 1px solid var(--line); overflow: hidden; background: var(--panel-2); transition: .18s var(--ease); }
.lib-tile:hover { border-color: var(--line-2); transform: translateY(-2px); }
.lib-tile:focus-visible { outline: 2px solid var(--ion); outline-offset: 2px; }
.lib-tile__hover { position: absolute; top: 8px; right: 8px; z-index: 3; display: flex; gap: 6px; opacity: 0; transform: translateY(-4px); transition: .18s var(--ease); }
.lib-tile:hover .lib-tile__hover, .lib-tile:focus-within .lib-tile__hover { opacity: 1; transform: none; }
.lib-tile__btn { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 7px; border: 1px solid rgba(255, 255, 255, .14);
  background: rgba(6, 9, 15, .74); color: var(--text-2); backdrop-filter: blur(6px); }
.lib-tile__btn:hover { color: var(--text); border-color: rgba(255, 255, 255, .3); }
.lib-tile__btn--del:hover { color: #FFB0B0; border-color: rgba(255, 107, 107, .5); }
.lib-cell__meta { margin-top: 7px; font-size: 10px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lib-grid--empty .empty { padding: 46px 20px; }
.lib-empty { grid-column: 1 / -1; }
.lib-tracks .lib-track { padding: 12px 14px; }
.lib-track__del { margin-left: 2px; }
.lib-track__del:hover { color: var(--danger); }
.lib-foot { margin-top: 6px; }
.lib-error .empty { padding: 40px 20px; }

.lib-preview { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 20px; align-items: start; }
.lib-preview__frame { aspect-ratio: 9 / 16; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #000; }
.lib-preview__frame img { width: 100%; height: 100%; object-fit: cover; }

.asset.is-uploading { display: flex; flex-direction: column; border-color: rgba(53, 232, 210, .38); background: linear-gradient(180deg, rgba(53, 232, 210, .06), rgba(255, 255, 255, .01)); }
.asset.is-uploading::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .06), transparent); animation: shimmer 1.4s infinite; }
.upl__body { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 0 10px; text-align: center; }
.upl__pct { font-size: 13px; color: var(--ion); }
.asset .upl__pct { font-family: var(--font-mono); }
.upl__name { max-width: 100%; font-size: 10.5px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.upl__bar { position: absolute; left: 8px; right: 8px; bottom: 8px; z-index: 2; height: 2px; border-radius: 2px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.upl__bar i { display: block; height: 100%; border-radius: 2px; background: var(--ion); transition: width .22s linear; box-shadow: 0 0 8px rgba(53, 232, 210, .6); }
.upl__bar--wide { position: static; margin-top: 7px; height: 2px; }
.lib-track--upl { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid rgba(53, 232, 210, .24); border-radius: 10px; background: rgba(53, 232, 210, .03); }
.is-uploading-icon { color: var(--ion); border-color: rgba(53, 232, 210, .3); }
.lib-track--upl .upl__pct { font-size: 11px; color: var(--ion); }

@media (hover: none) {
  .lib-tile__hover { opacity: 1; transform: none; }
}
@media (max-width: 900px) {
  .lib-toolbar { flex-wrap: wrap; gap: 10px; }
  .lib-toolbar__hint { display: none; }
  .drop { padding: 13px 14px; gap: 12px; }
  .drop__cta { display: none; }
  .drop__icon { width: 32px; height: 32px; }
  .lib-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 14px 10px; }
  .lib-cell__meta { font-size: 9.5px; }
  .lib-preview { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .lib-preview__frame { width: 168px; }
}

/* ============================================================
   设置 /settings（仅 super）
   ============================================================ */
.set-wrap { display: flex; flex-direction: column; gap: 16px; max-width: 940px; }
.set-card .card__head { margin-bottom: 18px; }
.set-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 18px; }
.set-form .field--wide { grid-column: 1 / -1; }
.set-form .field__label { font-size: 12px; }
.set-form .input, .set-form .select { height: 44px; }
.set-note { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 11.5px; line-height: 1.8; color: var(--text-3); }
.set-note b { color: var(--text-2); font-weight: 500; }
.set-note .mono { font-size: 11px; }
.set-status { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--text-3); }
.set-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.set-row:last-child { border-bottom: 0; }
.set-row__main { min-width: 0; }
.set-row__title { font-size: 13px; color: var(--text); font-weight: 500; }
.set-row__desc { margin-top: 4px; font-size: 11.5px; line-height: 1.7; color: var(--text-3); }
.set-row__desc b { color: var(--text-2); font-weight: 500; }
.set-switch { flex: none; cursor: pointer; }
.set-readonly { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.set-readonly .mono { font-size: 12.5px; color: var(--text); }
.set-readonly .pill { height: 22px; font-size: 10.5px; padding: 0 8px; }
.set-defaults { display: flex; flex-direction: column; gap: 18px; }
.set-defaults .assets { padding-bottom: 4px; }
.set-defaults .asset { width: 78px; }
.set-counter { font-family: var(--font-mono); font-size: 10.5px; color: var(--text-3); }
.set-counter.is-warn { color: var(--flare); }
.set-playground { min-height: 46px; display: flex; align-items: center; }

.savebar { position: sticky; bottom: 16px; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-top: 4px; padding: 12px 16px; border: 1px solid var(--line-2); border-radius: var(--r-card);
  background: rgba(12, 18, 28, .92); backdrop-filter: blur(16px); box-shadow: var(--shadow); }
.savebar__state { display: flex; align-items: center; gap: 9px; font-size: 12px; color: var(--text-2); }
.savebar__state.is-clean { color: var(--text-3); }
.savebar__actions { display: flex; align-items: center; gap: 8px; flex: none; }

@media (max-width: 900px) {
  .set-form { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .set-wrap { max-width: none; }
  .savebar { bottom: 78px; padding: 10px 12px; }
  .savebar__state { font-size: 11px; }
  .set-row { flex-wrap: wrap; gap: 10px; }
}

/* ============================================================
   超级控制台 /super
   ============================================================ */
.super__kpis { margin-bottom: 20px; }
.super__body { align-items: start; }
.super__left { min-width: 0; }
.super__right { display: flex; flex-direction: column; gap: 14px; position: sticky; top: calc(var(--topbar-h) + 16px); }
.sc-tablecard__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.sc-tablewrap { overflow-x: auto; }
.stable th { padding: 10px 14px; font-size: 10px; }
.stable td { padding: 12px 14px; vertical-align: middle; }
.stable__who { display: flex; flex-direction: column; gap: 2px; }
.stable__who b { font-size: 13px; font-weight: 600; color: var(--text); }
.stable__who .mono { font-size: 10.5px; }
.stable__app { display: flex; flex-direction: column; gap: 1px; }
.stable__app b { font-size: 12.5px; font-weight: 500; color: var(--text-2); }
.stable__app .mono { max-width: 190px; font-size: 10px; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stable__acts { display: flex; justify-content: flex-end; align-items: center; gap: 12px; }
.stable__cast { color: #FFB0C6; }
.stable__cast:hover { color: #FFD0DE; }
.stable__rel { color: var(--text-2); }
.t-right { text-align: right; }
.sc-server .kv { padding: 9px 0; }
.sc-super-mail { font-size: 10.5px !important; }
.sc-users__list { display: flex; flex-direction: column; }
.urow { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.urow:last-child { border-bottom: 0; }
.urow__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.urow__mail { font-size: 11px; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.urow__meta { font-size: 10px; color: var(--text-3); }
.urow .pill { height: 20px; padding: 0 8px; font-size: 10px; }
.sc-users__empty { padding: 18px 0; text-align: center; font-size: 12px; color: var(--text-3); }
.scards { display: none; padding: 12px; }
.scard { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.scard + .scard { margin-top: 10px; }
.scard__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.scard__top .mono { font-size: 10px; color: var(--text-3); letter-spacing: .14em; }
.scard__who { display: flex; flex-direction: column; gap: 2px; }
.scard__who b { font-size: 14px; font-weight: 600; }
.scard__who .mono { font-size: 10.5px; color: var(--text-3); }
.scard__kv { display: flex; justify-content: space-between; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 11.5px; color: var(--text-2); }
.scard__acts { display: flex; gap: 8px; margin-top: 12px; }
.scard__acts .btn { flex: 1; }

@media (max-width: 1200px) {
  .super__right { position: static; }
}
@media (max-width: 900px) {
  .sc-tablewrap { display: none; }
  .scards { display: block; }
  .sc-tablecard__head { padding: 14px 16px; }
}

/* ============================================================
   下载页 /app（裸页）
   ============================================================ */
.app { display: flex; flex-direction: column; flex: 1; min-height: 100vh; }
.app__nav { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 68px;
  padding: 0 max(40px, calc((100vw - 1160px) / 2)); border-bottom: 1px solid var(--line); background: rgba(6, 9, 15, .72); backdrop-filter: blur(14px); }
.app__brand { display: inline-flex; }
.app__nav-links { display: flex; align-items: center; gap: 18px; }
.app__back { display: inline-flex; align-items: center; gap: 5px; }
.app__main { width: 100%; max-width: 1160px; margin: 0 auto; padding: 0 40px 40px; flex: 1; }

.app-hero { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 40px; align-items: center; padding: 64px 0 56px; }
.app-hero__text .eyebrow { letter-spacing: .22em; }
.app-hero__title { margin-top: 18px; font-size: clamp(38px, 4.6vw, 58px); font-weight: 600; line-height: 1.08; letter-spacing: -.025em; }
.app-hero__desc { margin-top: 22px; max-width: 42ch; font-size: 14px; line-height: 1.85; color: var(--text-2); }
.app-hero__actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }
.app-hero__meta { margin-top: 26px; font-size: 10px; letter-spacing: .16em; color: var(--text-3); text-transform: uppercase; }
.app-hero__visual { position: relative; display: grid; place-items: center; min-height: 460px; }
.app-orbit { position: absolute; width: min(430px, 82%); aspect-ratio: 1; display: grid; place-items: center; pointer-events: none; }
.app-orbit i { position: absolute; inset: 0; border: 1px solid var(--line); border-radius: 50%; }
.app-orbit i:nth-child(2) { inset: 12%; border-style: dashed; border-color: rgba(150, 180, 235, .16); animation: sp-orbit 72s linear infinite; }
.app-orbit i:nth-child(3) { inset: 26%; border-color: rgba(255, 92, 147, .18); }
.app-orbit__sat { position: absolute; top: 6%; left: 50%; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background: var(--flux); box-shadow: 0 0 12px rgba(255, 92, 147, .8); }
.app-phone { position: relative; z-index: 1; width: min(248px, 46vw); transform: rotate(-2deg); }
.app-phone__bg { background-image: radial-gradient(120% 90% at 28% 12%, #123b63 0%, #0b1a2c 46%, #05070c 100%); }

.app-version { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr) auto; gap: 32px; align-items: center; padding: 22px 24px; }
.app-version__left { min-width: 0; }
.app-version__num { margin-top: 10px; font-size: 28px; line-height: 1; letter-spacing: -.02em; color: var(--text); }
.app-version__sub { margin-top: 8px; font-size: 11px; color: var(--text-3); }
.app-version__specs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; padding: 0 8px; border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
.app-version__specs .spec b { font-size: 14px; }
.app-version__cta { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; text-align: right; }
.app-version__cta .hint { font-size: 10.5px; max-width: 24ch; }

.app-sec { margin-top: 60px; padding-top: 38px; border-top: 1px solid var(--line); }
.app-sec__head { max-width: 760px; margin-bottom: 26px; }
.app-sec__head .eyebrow b { color: var(--ion); }
.app-sec__title { margin-top: 14px; font-size: clamp(22px, 2.2vw, 28px); font-weight: 600; letter-spacing: -.015em; line-height: 1.35; }
.app-sec__desc { margin-top: 12px; font-size: 13px; line-height: 1.85; color: var(--text-2); max-width: 68ch; }

.app-perms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 44px; }
.app-perm { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.app-perm__no { font-size: 10.5px; color: var(--text-3); letter-spacing: .1em; padding-top: 3px; }
.app-perm__top { display: flex; align-items: center; gap: 10px; }
.app-perm__top b { font-size: 14px; font-weight: 600; }
.app-perm__top .pill { height: 20px; padding: 0 8px; font-size: 10px; }
.app-perm__desc { margin-top: 6px; font-size: 12.5px; line-height: 1.75; color: var(--text-3); }
.app-perm__path { margin-top: 8px; font-size: 10px; letter-spacing: .02em; color: rgba(150, 180, 235, .5); }

.app-steps { display: flex; flex-direction: column; max-width: 780px; }
.app-step { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 16px; padding: 12px 0 18px; }
.app-step::before { content: ""; position: absolute; left: 19px; top: 44px; bottom: 4px; width: 1px; background: var(--line); }
.app-step:last-child::before { display: none; }
.app-step__no { position: relative; z-index: 1; width: 38px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; background: var(--ink-1); font-size: 10.5px; color: var(--text-2); }
.app-step__body b { font-size: 14px; font-weight: 600; }
.app-step__body p { margin-top: 5px; font-size: 12.5px; line-height: 1.8; color: var(--text-3); }

.app-term { max-width: 780px; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--panel); }
.app-term .term__msg { white-space: normal; word-break: break-all; }
.app-note { display: flex; align-items: flex-start; gap: 9px; max-width: 780px; margin-top: 16px; padding: 12px 14px; border: 1px solid rgba(255, 200, 87, .22); border-radius: 9px; background: rgba(255, 200, 87, .045); font-size: 12px; line-height: 1.8; color: #F0D9A6; }
.app-note svg { flex: none; margin-top: 2px; color: var(--flare); }

.app-limits { display: flex; flex-direction: column; max-width: 840px; }
.app-limits li { display: flex; align-items: flex-start; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 12.5px; line-height: 1.8; color: var(--text-2); }
.app-limits li:last-child { border-bottom: 0; }
.app-limits li svg { flex: none; margin-top: 7px; color: var(--text-3); }

.app-download { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 30px; padding: 22px 24px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--panel); }
.app-download__title { font-size: 16px; font-weight: 600; }
.app-download .hint { margin-top: 6px; max-width: 52ch; }

.app__foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 40px; padding: 26px max(40px, calc((100vw - 1160px) / 2));
  border-top: 1px solid var(--line); color: var(--text-3); }
.app__foot-meta { font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); }

@media (max-width: 1100px) {
  .app-hero { grid-template-columns: minmax(0, 1fr); gap: 30px; padding: 44px 0 40px; }
  .app-hero__visual { min-height: 0; order: 2; }
  .app-orbit { width: min(360px, 78%); }
  .app-version { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .app-version__specs { border-left: 0; border-right: 0; padding: 0; }
  .app-version__cta { align-items: flex-start; text-align: left; }
}
@media (max-width: 900px) {
  .app__nav { height: 60px; padding: 0 20px; }
  .app__nav .wordmark__text i { display: none; }
  .app__nav-links { gap: 12px; }
  .app__back span { display: none; }
  .app__main { padding: 0 20px 30px; }
  .app-hero__title { font-size: 38px; }
  .app-hero__desc { font-size: 13px; }
  .app-hero__actions .btn { flex: 1; }
  .app-phone { width: min(210px, 56vw); }
  .app-version__specs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .app-perms { grid-template-columns: minmax(0, 1fr); }
  .app-sec { margin-top: 44px; padding-top: 30px; }
  .app-download { flex-direction: column; align-items: flex-start; }
  .app__foot { flex-direction: column; align-items: flex-start; gap: 12px; padding: 22px 20px; }
}

/* 素材库音乐列表：宽屏两列 */
.lib-tracks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.lib-tracks .empty { grid-column: 1 / -1; }
@media (max-width: 760px) {
  .lib-tracks { grid-template-columns: minmax(0, 1fr); }
}

/* ============================================================
   走查修正（v2）
   ============================================================ */
/* 设置页：保存条固定到视口底部，与内容左右对齐 */
.savebar {
  position: fixed; left: var(--rail-w); right: 0; bottom: 0; z-index: 25;
  margin: 0; padding: 12px max(40px, calc((100vw - var(--rail-w) - 1320px) / 2 + 40px));
  border: 0; border-top: 1px solid var(--line-2); border-radius: 0;
  background: rgba(5, 7, 12, .86);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 -22px 44px -34px rgba(0, 0, 0, .95);
}
.savebar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: 1320px; margin: 0 auto; }
.set { padding-bottom: 84px; }
.set-wrap { margin: 0 auto; }

@media (max-width: 900px) {
  .savebar { left: 0; bottom: 64px; padding: 10px 16px; }
  .savebar__inner { gap: 10px; }
  .savebar__state { font-size: 11px; }
  .savebar__actions .btn { height: 34px; }
  .set { padding-bottom: 150px; }
}

/* 账户预览：1:1 = 设备真实像素，横向滚动；适配 = 完整显示整台手机 */
.preview-body { align-items: center; }
.preview-body .phone { width: min(100%, 196px); max-width: none; }
.preview-body .phone__screen { max-height: none; }
.preview-body.is-real { display: flex; justify-content: flex-start; align-items: flex-start; max-height: 430px; overflow: auto; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255, 255, 255, .012); }
.preview-body.is-real .phone { width: var(--real-w, 1080px); margin: 0; flex: none; }
.preview-body.is-real::-webkit-scrollbar { width: 6px; height: 6px; }

/* 超级台：全站事件 */
.sc-events__list { max-height: 250px; overflow-y: auto; margin-top: 2px; }
.sc-events__list .term__row { padding: 4px 0; border-bottom: 1px solid rgba(150, 180, 235, .06); align-items: baseline; }
.sc-events__list .term__row:last-child { border-bottom: 0; }
.sc-events__list .term__t { flex: none; width: 52px; font-size: 10px; }
.sc-events__list .term__tag { width: 40px; font-size: 9px; }
.sc-events__list .term__msg { font-size: 11px; line-height: 1.65; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* 预览尺寸：桌面 232（真实观感与可读性的折中），移动 208 */
.preview-body .phone { width: min(100%, 232px); }
.preview-body.is-real .phone { width: var(--real-w, 1080px); }
@media (max-width: 900px) {
  .preview-body .phone { width: min(100%, 208px); }
  .preview-body.is-real .phone { width: var(--real-w, 1080px); }
}

/* 走查修正 v3 */
.savebar { display: block; }
.savebar__inner { width: 100%; }
.super__left { display: flex; flex-direction: column; gap: 14px; }
.super__left > .card { min-width: 0; }

/* 设置：双栏布局（左：邮件服务 + 默认停靠；右：安全 + 部署信息） */
.set-wrap { display: block; max-width: none; margin: 0; }
.set-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 16px; align-items: start; }
.set-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.set-col--side { position: sticky; top: calc(var(--topbar-h) + 16px); }
.set-deploy .kv { padding: 10px 0; }
.set-deploy .kv b { font-size: 12px; }
.set-deploy__hint { margin-top: 12px; }
.set-col--side .set-row { flex-direction: column; align-items: flex-start; gap: 10px; }
.set-col--side .set-row__main { width: 100%; }
.set-col--side .set-readonly,
.set-col--side .set-playground,
.set-col--side .set-switch { margin-top: 2px; }
@media (max-width: 1200px) {
  .set-grid { grid-template-columns: minmax(0, 1fr); }
  .set-col--side { position: static; }
}

/* ============================================================
   v1.1：公共（账户选择 / 保存状态 / 署名 / 进度条 / chips）
   ============================================================ */
.acct-pick { display: inline-flex; align-items: center; gap: 8px; }
.acct-pick-slot { display: inline-flex; }
.acct-pick .micro { flex: none; font-size: 9.5px; }
.acct-pick__select {
  width: auto; min-width: 128px; max-width: 190px; height: 32px; padding: 0 30px 0 10px;
  font-size: 12px; border-radius: 8px;
  background-position: calc(100% - 13px) 13px, calc(100% - 8px) 13px;
}
.save-state { display: inline-flex; align-items: center; gap: 7px; font-size: 11.5px; color: var(--text-3); white-space: nowrap; }
.save-state.is-dirty { color: var(--flare); }

.credits { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 10.5px; letter-spacing: .06em; color: var(--text-3); }
.credits b { color: var(--text-2); font-weight: 500; letter-spacing: .08em; }
.credits em { font-style: normal; font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--text-3); margin-bottom: 2px; }
.credits--inline { flex-direction: row; flex-wrap: wrap; gap: 10px; font-size: 10px; }
.credits--inline i { width: 14px; height: 1px; background: var(--line-2); }
.auth__credits { display: flex; justify-content: center; width: 100%; max-width: 404px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.app__foot-credits { font-size: 10px; color: var(--text-3); }

.chip {
  height: 28px; padding: 0 10px; border-radius: 7px; border: 1px solid var(--line);
  background: rgba(255, 255, 255, .015); font-size: 11.5px; color: var(--text-2);
  transition: .16s var(--ease); white-space: nowrap;
}
.chip:hover { border-color: var(--line-2); color: var(--text); }
.chip.is-on { border-color: rgba(53, 232, 210, .45); background: rgba(53, 232, 210, .08); color: #8CF5E6; }
.chip[disabled] { opacity: .38; pointer-events: none; }

.meter--lg { width: 100%; height: 6px; border-radius: 4px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.meter--lg i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, rgba(53, 232, 210, .85), rgba(111, 231, 255, .5)); box-shadow: 0 0 12px -2px rgba(53, 232, 210, .5); }
.meter--over i { background: linear-gradient(90deg, var(--flux), #FF9A6B); box-shadow: 0 0 12px -2px rgba(255, 92, 147, .6); }

/* ============================================================
   使用报告 /report
   ============================================================ */
.report-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: center; padding: 22px 24px; margin-bottom: 16px; }
.report-today .micro { display: block; margin-bottom: 10px; }
.report-today__num { font-family: var(--font-mono); font-size: clamp(28px, 3vw, 40px); font-weight: 500; line-height: 1.02; letter-spacing: -.03em; color: var(--text); }
.report-today__num small { font-size: 13px; font-weight: 500; letter-spacing: 0; color: var(--text-3); margin: 0 5px 0 2px; }
.report-today__meta { margin-top: 10px; font-size: 11.5px; color: var(--text-3); }
.report-today__meta b { color: var(--text-2); font-weight: 500; }
.report-limit { border-left: 1px solid var(--line); padding-left: 28px; }
.report-limit__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.report-limit .meter--lg { margin-bottom: 10px; }
.report-limit__meta { font-size: 11.5px; color: var(--text-3); }
.report-limit__meta b { color: var(--text-2); font-weight: 500; }
.report-limit__empty { font-size: 12px; line-height: 1.8; color: var(--text-3); }
.report-grid { align-items: start; }
.report-main, .report-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.chart-card .chart { margin-top: 6px; overflow: hidden; }
.chart svg { display: block; max-width: 100%; }
.chart__bar { transition: fill .18s var(--ease); }
.chart__bar:hover { fill: rgba(53, 232, 210, .42); }

.rank { display: flex; flex-direction: column; }
.rank__row { display: grid; grid-template-columns: 26px minmax(0, 1fr) 42px; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.rank__row:last-child { border-bottom: 0; }
.rank__idx { font-size: 10px; color: var(--text-3); letter-spacing: .08em; }
.rank__main { min-width: 0; }
.rank__top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.rank__top b { font-size: 12.5px; font-weight: 500; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rank__top .mono { flex: none; font-size: 10.5px; color: var(--text-3); }
.rank__track { margin-top: 6px; height: 4px; border-radius: 3px; background: rgba(255, 255, 255, .05); overflow: hidden; }
.rank__track i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, rgba(53, 232, 210, .85), rgba(53, 232, 210, .32)); }
.rank__pct { font-size: 10.5px; color: var(--text-3); text-align: right; }
.rank-empty { padding: 26px 0; font-size: 12px; line-height: 1.9; text-align: center; color: var(--text-3); }

.dock-count__num { margin-top: 2px; font-family: var(--font-mono); font-size: 34px; line-height: 1; letter-spacing: -.02em; }
.dock-count__num small { margin-left: 6px; font-size: 12px; color: var(--text-3); }
.dock-count__meta { margin-top: 8px; font-size: 11.5px; color: var(--text-3); }
.dock-count__events { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.dock-count__row { display: flex; gap: 10px; font-size: 11px; line-height: 1.6; color: var(--text-2); }
.dock-count__row .mono { flex: none; padding-top: 1px; font-size: 10px; color: var(--text-3); }
.dock-count__row span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.report-note .kv { padding: 9px 0; }
.report-note .hint { margin-top: 12px; }

/* ============================================================
   应用管理 /apps
   ============================================================ */
.apps-grid, .plan-grid { align-items: start; }
.apps-main, .apps-side { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.policy-card .card__head { margin-bottom: 14px; }
.policy-seg .seg__btn { height: 36px; }
.policy-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.policy-stat { display: flex; flex-direction: column; gap: 6px; }
.policy-stat b { font-size: 20px; font-weight: 500; letter-spacing: -.02em; color: var(--text); }
.policy-stat span { font-size: 10.5px; letter-spacing: .04em; color: var(--text-3); }
.policy-stat.is-warn b { color: var(--flux); }
.policy-card .hint { margin-top: 14px; }

.apps-toolbar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.apps-search { position: relative; flex: 1; min-width: 200px; }
.apps-search .input { height: 38px; padding-left: 36px; font-size: 12.5px; }
.apps-search__icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--text-3); pointer-events: none; }
.apps-system { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--text-3); cursor: pointer; user-select: none; }
.apps-count { font-size: 10px; letter-spacing: .1em; color: var(--text-3); }
.apps-list { margin-top: 4px; }
.app-row { display: flex; align-items: center; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--line); }
.app-row:last-child { border-bottom: 0; }
.app-ico { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--line-2); background: rgba(255, 255, 255, .03); font-family: var(--font-mono); font-size: 13px; color: var(--text-2); }
.app-ico--sys { opacity: .65; border-style: dashed; }
.app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.app-name { font-size: 12.5px; font-weight: 500; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.app-pkg { font-size: 10px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.app-pkg em { margin-left: 6px; padding: 1px 4px; border: 1px solid var(--line); border-radius: 3px; font-style: normal; font-size: 9px; color: var(--text-3); }
.app-flag { flex: none; min-width: 26px; text-align: right; font-size: 10px; letter-spacing: .04em; color: var(--text-3); }
.app-flag:not(.is-on) { color: var(--flare); }
.app-switch { flex: none; }
.app-row.is-locked { opacity: .62; }
.app-row.is-locked .app-switch { cursor: not-allowed; }
.apps-empty .empty { padding: 42px 16px; }
.apps-empty__text { padding: 26px 0; text-align: center; font-size: 12px; color: var(--text-3); }
.apps-empty #apps-show-sys { display: block; margin: 0 auto; }
.apps-sync .kv { padding: 9px 0; }
.apps-note .card__head { margin-bottom: 12px; }
.steps-mini { display: flex; flex-direction: column; gap: 14px; }
.steps-mini li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 10px; }
.steps-mini .mono { padding-top: 2px; font-size: 10px; color: var(--text-3); }
.steps-mini b { font-size: 12.5px; font-weight: 500; color: var(--text); }
.steps-mini p { margin-top: 3px; font-size: 11.5px; line-height: 1.7; color: var(--text-3); }

/* ============================================================
   作息与限额 /plan
   ============================================================ */
.plan-main { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.plan-side { min-width: 0; position: sticky; top: calc(var(--topbar-h) + 16px); }
.limit-body { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 4px; }
.limit-value { display: flex; align-items: center; gap: 8px; }
.limit-input { width: 96px; height: 44px; text-align: center; font-family: var(--font-mono); font-size: 18px; }
.limit-unit { font-size: 11.5px; color: var(--text-3); }
.quick-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.limit-usage { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.limit-usage__head { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 8px; font-size: 11.5px; color: var(--text-3); }
.limit-usage__head b { color: var(--text-2); font-weight: 500; }
.limit-usage .meter--lg { margin-bottom: 8px; }
.limit-usage__meta { font-size: 11px; color: var(--text-3); }
.limit-usage__meta b { color: var(--text-2); font-weight: 500; }
.limit-card.is-off .limit-body, .limit-card.is-off .limit-usage { opacity: .55; }
.limit-card .hint, .schedule-card .hint { margin-top: 14px; }

.schedule-body { display: flex; flex-direction: column; gap: 16px; margin-top: 4px; }
.weekday-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.weekday-quick { display: flex; gap: 12px; }
.weekdays { display: flex; gap: 6px; flex-wrap: wrap; }
.chip--day { min-width: 52px; justify-content: center; }
.schedule-times { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.schedule-times .field { flex: 1; min-width: 128px; }
.time-sep { padding-bottom: 14px; color: var(--text-3); }
.time-hint { padding-bottom: 14px; font-size: 10.5px; color: var(--text-3); }
.schedule-card.is-off .schedule-body { opacity: .55; }

.plan-preview .plan-phone-wrap { display: grid; place-items: center; padding: 4px 0 10px; }
.plan-phone { width: min(100%, 158px); }
.plan-bg { background: radial-gradient(120% 90% at 28% 12%, #123b63 0%, #0b1a2c 46%, #05070c 100%); }
.plan-rules { display: flex; flex-direction: column; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); }
.plan-rule { display: flex; flex-direction: column; gap: 3px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.plan-rule:last-child { border-bottom: 0; }
.plan-rule b { font-size: 12px; font-weight: 500; line-height: 1.5; color: var(--text-2); }
.plan-preview .hint { margin-top: 10px; }

/* ============================================================
   账户增量：快捷入口 + 今日使用
   ============================================================ */
.acc-quick { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.acc-quick .btn { padding: 0 10px; }
.usage-mini .card__head { margin-bottom: 12px; }
.usage-mini__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.usage-mini__num { font-family: var(--font-mono); font-size: 26px; line-height: 1; letter-spacing: -.02em; }
.usage-mini__num small { margin: 0 3px 0 1px; font-size: 11px; letter-spacing: 0; color: var(--text-3); }
.usage-mini .meter { width: 100%; height: 4px; margin-top: 12px; border-radius: 3px; }
.usage-mini__apps { display: flex; flex-direction: column; gap: 9px; margin-top: 14px; }
.usage-app { display: grid; grid-template-columns: minmax(0, 1fr) 84px 64px; align-items: center; gap: 10px; font-size: 11.5px; color: var(--text-2); }
.usage-app__name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.usage-app__bar { height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.usage-app__bar i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, rgba(53, 232, 210, .8), rgba(53, 232, 210, .3)); }
.usage-app__time { text-align: right; font-size: 10px; color: var(--text-3); }
.usage-mini__none { font-size: 11.5px; }
.usage-mini__empty { font-size: 11.5px; line-height: 1.75; color: var(--text-3); }

/* ---------- 响应式 ---------- */
@media (max-width: 1200px) {
  .report-limit { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); padding-top: 16px; }
  .report-hero { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .plan-side { position: static; }
}
@media (max-width: 900px) {
  .report-today__num { font-size: 32px; }
  .policy-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .apps-search { min-width: 100%; }
  .apps-toolbar { gap: 10px; }
  .app-row { gap: 10px; }
  .app-ico { width: 30px; height: 30px; }
  .usage-app { grid-template-columns: minmax(0, 1fr) 58px 56px; }
  .acc-quick { width: 100%; }
  .acc-head__actions { flex-wrap: wrap; }
  .plan-phone { width: min(100%, 150px); }
  .rank__row { grid-template-columns: 22px minmax(0, 1fr) 38px; gap: 9px; }
  .schedule-times .time-hint { display: none; }
  .page-head__actions .acct-pick { flex: 1 1 auto; }
  .page-head__actions .acct-pick__select { flex: 1; max-width: none; }
}

/* v1.1 细节修整 */
.chart-card .card__head > .mono { white-space: nowrap; }
.chart-card .card__head { flex-wrap: wrap; row-gap: 6px; }

.plan-phone .cast-copy { padding: 34px 16px 80px; }
.plan-phone .cast-meta { left: 10px; right: 10px; bottom: 10px; }
.plan-phone .cast-chip { max-width: 88%; padding: 4px 8px; font-size: 9px; gap: 5px; }
.plan-phone .cast-chip svg { width: 10px; height: 10px; }
.plan-phone .cast-lock { display: none; }
.plan-phone .cast-status { padding: 9px 12px 0; font-size: 8.5px; }

@media (max-width: 900px) {
  .acct-pick .micro { display: none; }
  .acct-pick__select { min-width: 112px; }
  .report-today__num small { font-size: 12px; }
  .save-state { font-size: 11px; }
}
@media (max-width: 600px) {
  .app-flag { display: none; }
  .apps-count { display: none; }
  .page-head__actions .acct-pick__select { min-width: 0; }
  .plan-rule b { font-size: 11.5px; }
}

/* fixed 保存条与壳层页脚共存（设置页） */
.shell-foot.has-savebar { padding-bottom: 82px; }
@media (max-width: 900px) {
  .shell-foot.has-savebar { padding-bottom: 132px; }
}

/* 今日使用：应用行改为上下两行 */
.usage-app { display: flex; flex-direction: column; gap: 5px; }
.usage-app__top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; font-size: 11.5px; color: var(--text-2); }
.usage-app__bar { display: block; width: 100%; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.usage-app__bar i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, rgba(53, 232, 210, .8), rgba(53, 232, 210, .3)); }
.usage-app__time { flex: none; font-size: 10px; color: var(--text-3); }

/* ================= v1.2 停靠视觉控件 ================= */
.field__label-right{display:flex;align-items:center;gap:10px}
.field__upload{font-size:11.5px;color:var(--ion);border-bottom:1px solid rgba(53,232,210,.3);padding:2px 0;transition:border-color .18s}
.field__upload:hover{border-color:var(--ion)}
.tpl-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.tpl-chip{font-size:11.5px;color:var(--text-2);border:1px solid var(--line);border-radius:999px;padding:5px 12px;background:rgba(255,255,255,.015);transition:all .16s}
.tpl-chip:hover{color:var(--text);border-color:var(--line-2);background:rgba(255,255,255,.04)}

.visual-row{display:flex;gap:18px;flex-wrap:wrap;margin-top:12px}
.visual-col{display:flex;flex-direction:column;gap:8px;min-width:158px;flex:1}
.visual-col--clock{flex:0 0 auto;align-items:flex-start}
.swatches{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.swatch{width:26px;height:26px;border-radius:8px;background:var(--sw);border:1px solid rgba(255,255,255,.18);padding:0;transition:transform .15s}
.swatch:hover{transform:translateY(-1px)}
.swatch.is-on{box-shadow:0 0 0 2px var(--ink-0),0 0 0 3px var(--ion)}
.swatch--custom{display:grid;place-items:center;overflow:hidden;background:linear-gradient(135deg,#ff5c93,#35e8d2);position:relative}
.swatch--custom input{opacity:0;position:absolute;inset:0;width:100%;height:100%;cursor:pointer;border:0}
.visual-col .range{height:26px;margin-top:2px}

/* 预览：主题层 / 时钟 */
.cast-theme{position:absolute;inset:0;z-index:2;pointer-events:none}
.cast-clock{position:absolute;top:11px;right:15px;z-index:5;font-family:var(--font-mono);font-size:11px;
  letter-spacing:.08em;color:rgba(255,255,255,.85);text-shadow:0 1px 10px rgba(0,0,0,.55)}
.phone__screen.theme-orbit .cast-theme{
  background:radial-gradient(80% 58% at 50% 16%,rgba(53,232,210,.16),transparent 62%),
             radial-gradient(90% 70% at 50% 112%,rgba(255,92,147,.12),transparent 60%)}
.phone__screen.theme-minimal .scanline{display:none}
.phone__screen.theme-minimal .cast-theme{display:none}
.phone__screen.theme-minimal .cast-shade{background:linear-gradient(180deg,rgba(4,6,10,.34),rgba(4,6,10,.18) 42%,rgba(4,6,10,.9))}
.phone__screen.theme-grid .cast-theme{
  background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);
  background-size:22px 22px;opacity:.55}
.phone__screen.theme-grid .scanline{opacity:.25}

@media (max-width:900px){
  .visual-row{gap:14px}
  .visual-col{min-width:132px}
}

/* ================= v1.3.1 解除撤销期 ================= */
.unlock-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin:0 0 16px;padding:14px 16px;border:1px solid rgba(255,92,147,.34);border-radius:12px;
  background:linear-gradient(120deg,rgba(255,92,147,.10),rgba(255,92,147,.03))}
.unlock-banner__main{display:flex;gap:12px;align-items:flex-start;font-size:13px;color:var(--text);min-width:240px;flex:1}
.unlock-banner__main svg{flex:none;margin-top:2px;color:var(--flux)}
.unlock-banner b{font-weight:600;letter-spacing:.01em}
.unlock-banner .hint{margin-top:5px;font-size:11.5px;line-height:1.65}
.unlock-banner #unlock-count{color:var(--flux);font-size:15px}
.unlock-banner--applied{border-color:rgba(255,200,87,.3);background:linear-gradient(120deg,rgba(255,200,87,.09),transparent 70%)}
.unlock-banner--applied .unlock-banner__main svg{color:var(--flare)}
.unlock-confirm .input{margin-top:12px}
.danger-actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}