/* 【codex】App 首页主题预览，沿用官网紫夜配色。 */
.theme-gallery { --theme-accent: #b3a0ff; }
.theme-gallery-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(240px, .9fr); gap: clamp(28px, 6vw, 90px); align-items: center; }
.theme-gallery-kicker { color: var(--theme-accent); font-size: 13px; letter-spacing: .16em; }
.theme-gallery h2 { margin: 16px 0; }
.theme-gallery-intro { color: var(--muted); line-height: 1.9; max-width: 32em; }
.theme-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 28px 0 18px; }
.theme-choice-link { display: flex; align-items: center; gap: 12px; min-height: 88px; padding: 16px; border: 1px solid rgba(179,160,255,.18); border-radius: 18px; background: rgba(179,160,255,.035); color: inherit; text-decoration: none; }
.theme-choice-link:hover, .theme-choice-link[aria-current="true"] { border-color: var(--theme-accent); background: rgba(179,160,255,.12); }
.theme-choice-link:focus-visible, .theme-gallery button:focus-visible, .theme-dialog button:focus-visible { outline: 3px solid var(--theme-accent, #b3a0ff); outline-offset: 4px; }
.theme-choice-link strong, .theme-choice-link small { display: block; }
.theme-choice-link strong { font-size: 15px; }
.theme-choice-link small { margin-top: 5px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.theme-swatch { width: 28px; height: 38px; flex: 0 0 28px; border-radius: 10px; border: 1px solid rgba(255,255,255,.3); background: linear-gradient(145deg,#171d3b,#756598); }
[data-theme-preview="cute"] .theme-swatch { background: linear-gradient(145deg,#ffe4eb,#bb5985); }
[data-theme-preview="doggo"] .theme-swatch { background: linear-gradient(145deg,#d4ecff,#d6a85c); }
[data-theme-preview="mint"] .theme-swatch { background: linear-gradient(145deg,#e4f4e8,#649a7b); }
[data-theme-preview="rainy"] .theme-swatch { background: linear-gradient(145deg,#d5f4fa,#639ba7); }
[data-theme-preview="morandi"] .theme-swatch { background: linear-gradient(145deg,#f7dce3,#ae7d99); }
.theme-gallery-note { font-size: 13px; color: var(--muted); line-height: 1.8; }
.theme-gallery-preview { margin: 0; text-align: center; }
.theme-gallery-phone { display: block; width: min(100%, 286px); height: auto; aspect-ratio: 780 / 1688; margin: 0 auto; border-radius: 30px; border: 6px solid #242138; box-shadow: 0 28px 80px rgba(0,0,0,.3); background: #0b0f1c; }
.theme-gallery-preview figcaption { margin-top: 18px; font-size: 14px; color: var(--muted); }
.theme-gallery-zoom { margin-top: 14px; padding: 10px 20px; border: 1px solid rgba(179,160,255,.4); border-radius: 999px; background: rgba(179,160,255,.08); color: inherit; font: inherit; font-size: 13px; cursor: pointer; }
.theme-gallery-zoom[hidden] { display: none; }
.theme-dialog { max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); padding: 18px; border: 1px solid #5c4b83; border-radius: 22px; background: #100e20; color: #f0ebff; overflow: auto; }
.theme-dialog::backdrop { background: rgba(5,4,14,.88); }
/* 【codex】原生模态框位于顶层，页面星光光标无法覆盖它；打开时恢复系统指针。 */
body.rs-no-cursor:has(.theme-dialog[open]),
body.rs-no-cursor:has(.theme-dialog[open]) * { cursor: auto !important; }
body.rs-no-cursor .theme-dialog[open] button { cursor: pointer !important; }
.theme-dialog::backdrop { cursor: auto; }
body:has(.theme-dialog[open]) { overflow: hidden; }
body:has(.theme-dialog[open]) .rs-cursor-layer,
body:has(.theme-dialog[open]) .rs-trail { visibility: hidden; }
.theme-dialog:not([open]) { display: none; }
.theme-dialog img { display: block; width: auto; max-width: 100%; height: auto; max-height: 73dvh; margin: 12px auto; border-radius: 16px; }
.theme-dialog-title { margin: 0; text-align: center; font-size: 15px; }
.theme-dialog-controls { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.theme-dialog button { min-height: 44px; padding: 10px 18px; border: 1px solid #5c4b83; border-radius: 12px; background: #241c38; color: #f0ebff; font: inherit; cursor: pointer; }
@media (max-width: 720px) {
  .theme-gallery-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .theme-choice-link { padding: 12px 10px; gap: 9px; min-height: 82px; }
  .theme-choice-link strong { font-size: 14px; }
  .theme-gallery-phone { width: min(100%, 290px); }
}