/* Тема оформления (theme-kit). */
/* Тёмные правила модулей, которые раньше включались только по системной теме. Повторяем их для выбранной вручную тёмной. */
:root[data-theme="dark"]{--gold-1:#2a2411;--gold-2:#3a2f0d;--gold-line:#6b5414;--gold-ink:#ffd45c;--gold-mut:#c9a94e;--pre:#f0a640;--pre-soft:#3a2a12;--pre-ink:#f0a640;--rv-up:#3fbf72;--rv-up-soft:#173325;--rv-bgg:#6f7078}
:root[data-theme="dark"] .mb{background:color-mix(in srgb,var(--c) 22%,var(--surface));color:color-mix(in srgb,var(--c) 42%,#fff)}
:root[data-theme="dark"] .ctg-pill{background:color-mix(in srgb,var(--c) 26%,transparent);color:color-mix(in srgb,var(--c) 55%,#fff)}
:root[data-theme="dark"] .xp-plan-now:not(.bad){background:#3a2c10;color:#ffcf7a}

/* Переключатель в подвале */
.th-sw{display:inline-flex;gap:2px;padding:2px;border:1px solid var(--line);border-radius:99px;background:var(--surface);margin:0;vertical-align:middle}
.th-sw button{display:inline-flex;align-items:center;justify-content:center;width:28px;height:24px;border:0;border-radius:99px;background:none;color:var(--faint);cursor:pointer;padding:0}
.th-sw button:hover{color:var(--fg)}
.th-sw button.on{background:var(--surface-2);color:var(--fg)}
.th-sw button:focus-visible{outline:2px solid var(--red);outline-offset:1px}
.th-sw svg{width:15px;height:15px}
.foot .th-foot{display:flex;align-items:center;gap:8px}

/* Вкладка «Оформление» */
.th-guest{max-width:760px;width:100%}
.th-guest .page-t{margin:0 0 10px}
.th-form{margin:0}
.th-opts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:640px}
.th-opt{position:relative;display:flex;flex-direction:column;gap:6px;padding:10px 10px 12px;border:1.5px solid var(--line);border-radius:var(--r);cursor:pointer;background:var(--surface);transition:border-color .15s}
.th-opt:hover{border-color:var(--faint)}
.th-opt:has(input:checked){border-color:var(--red);box-shadow:0 0 0 1px var(--red)}
.th-opt input{position:absolute;opacity:0;pointer-events:none}
.th-opt:has(input:focus-visible){outline:2px solid var(--red);outline-offset:2px}
.th-opt-t{display:flex;align-items:center;gap:7px;margin-top:4px;font-size:14px}
.th-opt-t b{font-weight:600}
.th-ic{width:17px;height:17px;flex:none;color:var(--muted)}
.th-opt:has(input:checked) .th-ic{color:var(--red)}
.th-opt small{color:var(--muted);font-size:12.5px;line-height:1.4}
.th-saved{min-height:1.4em;margin:10px 0 0}
.th-tip{margin-top:6px}
/* мини-страница в карточке варианта: цвета свои, от темы сайта не зависят */
.th-mini{--a:#f2f2f3;--b:#fff;--c:#e2e2e6;--d:#c9c9cf;display:block;aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:var(--a);border:1px solid rgba(127,127,127,.25)}
.th-mini i{display:block;font-style:normal}
.th-mini-dark,.th-mini-auto .th-m-body{--a:#111113;--b:#1b1b1e;--c:#2d2d32;--d:#45454c}
.th-mini-auto{background:linear-gradient(90deg,#f2f2f3 50%,#111113 50%)}
.th-mini-auto .th-m-top{background:linear-gradient(90deg,#fff 50%,#1b1b1e 50%)}
.th-mini-auto .th-m-body{background:linear-gradient(90deg,#f2f2f3 50%,#111113 50%)}
.th-mini-auto .th-m-card{background:linear-gradient(90deg,#fff 50%,#1b1b1e 50%)}
.th-mini-auto .th-m-side{background:#e2e2e6}
.th-mini-auto .th-m-card i{background:linear-gradient(90deg,#c9c9cf 50%,#45454c 50%)}
.th-m-top{height:16%;background:var(--b);display:flex!important;align-items:center;gap:6%;padding:0 7%}
.th-m-top i{height:34%;border-radius:2px;background:#e0211b;width:14%}
.th-m-top i+i{background:var(--c);width:40%;border-radius:99px}
.th-m-body{display:flex!important;gap:6%;padding:7%;height:84%;background:var(--a)}
.th-m-side{width:22%;border-radius:4px;background:var(--c);opacity:.7}
.th-m-card{flex:1;border-radius:5px;background:var(--b);padding:8%;display:flex!important;flex-direction:column;gap:12%}
.th-m-card i{height:10%;border-radius:2px;background:var(--d)}
.th-m-card i:first-child{width:60%;background:#e0211b;height:12%}
.th-m-card i:last-child{width:80%}
@media (max-width:560px){
  .th-opts{grid-template-columns:1fr;gap:8px}
  .th-opt{display:grid;grid-template-columns:92px 1fr;grid-template-rows:auto 1fr;column-gap:12px;row-gap:2px;align-items:start;padding:10px}
  .th-mini{grid-row:1/3}
  .th-opt-t{margin-top:2px}
}
@media (prefers-reduced-motion:reduce){.th-opt{transition:none}}
/* шесть вкладок настроек помещаются в карточку на компьютере */
@media (min-width:561px){.col .stg-head,.col .stg-head~.card{max-width:840px}.stg-tabs{gap:0}.stg-tabs a{padding-left:9px;padding-right:9px}}