/* МАКЕТ 05.11: тест по схемам Янга (60_test.js). Не в git. */
.ts-c--rose   { --c: #F0708F; } .ts-c--sun { --c: #F5A524; } .ts-c--mint { --c: #3FB884; } .ts-c--sky { --c: #4DA3F0; } .ts-c--violet { --c: #7B6CFF; }

/* роза */
.ts-rose { display: block; }
.ts-rose__bg { fill: color-mix(in srgb, var(--ink) 7%, transparent); }
.ts-rose__v { fill: color-mix(in srgb, var(--c) 38%, transparent); }
.ts-rose__v.is-top { fill: var(--c); }
.ts-rose--blur .ts-rose__v { filter: blur(1.6px); }
.ts-rose--blur .ts-rose__v.is-top { filter: none; }

.ts-eyebrow { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent-ink); }
.ts-meta { margin: 0; font-size: 13px; color: var(--ink-3); }
.ts-price { font-size: 13px; font-weight: 700; color: var(--ink-2); white-space: nowrap; }
.ts-price s { color: var(--ink-3); font-weight: 400; margin-right: 4px; }
.ts-price--big { font-family: var(--font-display); font-size: 24px; color: var(--ink); font-weight: 400; }

/* карточка на главной */
.ts-home { margin: var(--s-4) 0 0; padding: var(--s-5) var(--s-5) var(--s-4); border-radius: var(--r-1); position: relative; overflow: hidden;
  background: radial-gradient(120% 90% at 100% 0%, rgba(255,178,62,.35), transparent 60%), linear-gradient(135deg, var(--t-sunset-a), var(--t-sunset-m) 55%, var(--t-sunset-b));
  color: #fff; display: grid; gap: var(--s-4); box-shadow: 0 10px 30px rgba(47,40,150,.25); }
.ts-home__in { display: grid; grid-template-columns: 1fr auto; gap: var(--s-3); align-items: center; }
.ts-home .ts-eyebrow { color: #FFD9B8; }
.ts-home__title { margin: 6px 0 4px; font-family: var(--font-display); font-weight: 400; font-size: 22px; line-height: 1.2; color: #fff; }
.ts-home__text { margin: 0; font-size: 14px; line-height: 1.45; color: #F3EEFF; }
.ts-home .ts-rose__bg { fill: rgba(255,255,255,.14); }
.ts-home .ts-rose__v { fill: rgba(255,255,255,.45); }
.ts-home .ts-rose__v.is-top { fill: #FFB23E; }
.ts-home__btn { margin: 0; }

/* общий лист теста */
.ts .ts-tone .ld-section__body { display: grid; gap: var(--s-4); }
.ts-card { padding: var(--s-4) var(--s-5); }
.ts-sci { display: flex; gap: 8px; align-items: flex-start; margin: 0; font-size: 13px; line-height: 1.45; color: var(--ink-2); }
.ts-sci .ic { flex: none; margin-top: 1px; color: var(--accent-ink); }
.ts-actions { display: grid; gap: var(--s-3); text-align: center; margin-top: var(--s-2); }

/* вопрос */
.ts--q { display: flex; flex-direction: column; gap: var(--s-4); padding-bottom: var(--s-5); }
.ts-bar { display: flex; gap: 4px; justify-content: center; }
.ts-bar i { width: 28px; height: 5px; border-radius: 3px; background: var(--line); }
.ts-bar i.on { background: linear-gradient(90deg, #FFB23E, var(--accent)); }
.ts-q { padding: var(--s-2) var(--s-4) 0; }
.ts-q__text { font-family: var(--font-display); font-weight: 400; font-size: 24px; line-height: 1.3; margin: 6px 0 8px; color: var(--ink); text-wrap: balance; }
.ts-q__hint { margin: 0; font-size: 14px; color: var(--ink-3); }
.ts-ans { padding: 0 var(--s-4); }
.ts-guide { padding: 0 var(--s-4); }
.ts--q .ts-actions { padding: 0 var(--s-4); margin-top: auto; }

/* результат */
.ts-map { display: grid; justify-items: center; gap: var(--s-3); padding: var(--s-5) var(--s-4) var(--s-4); }
.ts-map__note { margin: 0; font-size: 13px; line-height: 1.45; color: var(--ink-3); text-align: center; }
.ts-h { margin: var(--s-2) 0 0; font-family: var(--font-display); font-weight: 400; font-size: 20px; color: var(--ink); }
.ts-tops { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); }
.ts-top { display: flex; gap: var(--s-3); align-items: flex-start; background: var(--surface); border-radius: 18px; padding: var(--s-3) var(--s-4); border: 1px solid var(--card-border); }
.ts-top__n { flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--c); color: #fff; font-weight: 700; font-size: 14px; display: grid; place-items: center; }
.ts-top__t { display: grid; gap: 2px; font-size: 14px; line-height: 1.4; color: var(--ink-2); }
.ts-top__t b { font-size: 16px; color: var(--ink); }
.ts-sess { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-4); text-decoration: none; color: var(--ink); }
.ts-sess__ic { flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; }
.ts-sess__t { flex: 1; display: grid; gap: 2px; }
.ts-sess__t small { font-size: 12px; color: var(--ink-3); }
.ts-sess > .ic { color: var(--ink-3); }

.ts-offer { padding: var(--s-5); display: grid; gap: var(--s-3); }
.ts-offer__head { display: flex; justify-content: space-between; gap: var(--s-3); align-items: center; flex-wrap: wrap; }
.ts-offer__title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 20px; line-height: 1.25; color: var(--ink); }
.ts-offer__text { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink-2); }
.ts-offer__foot { display: flex; align-items: baseline; justify-content: space-between; gap: var(--s-3); flex-wrap: wrap; }
.ts-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 14px; line-height: 1.4; color: var(--ink-2); }
.ts-list li { display: flex; gap: 8px; align-items: flex-start; }
.ts-list .ic { flex: none; color: #3FB884; margin-top: 2px; }
.ts-maria { display: flex; gap: var(--s-3); align-items: center; }
.ts-maria__ava { flex: none; width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
.ts-care { margin: 0; font-size: 13px; line-height: 1.45; color: var(--ink-3); text-align: center; }

/* v2 06.11 */
.ts-rose__v.is-now { animation: ts-blink 1.4s ease-in-out infinite; }
@keyframes ts-blink { 50% { opacity: .35; } }
.ts-bloom { display: block; overflow: visible; }
.ts-bloom__p { stroke: var(--c); stroke-width: 7; stroke-linecap: round; animation: ts-glow 2.8s ease-in-out infinite alternate; animation-delay: var(--d); }
.ts-bloom__spin { transform-origin: 50% 50%; animation: ts-spin 40s linear infinite; }
.ts-bloom__core { fill: #FFD15C; filter: drop-shadow(0 0 6px rgba(255,209,92,.9)); }
@keyframes ts-spin { to { transform: rotate(360deg); } }
@keyframes ts-glow { from { opacity: .55; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .ts-bloom__p, .ts-bloom__spin, .ts-rose__v.is-now { animation: none; } }

.ts--q { gap: var(--s-3); }
.ts-qmap { display: grid; justify-items: center; gap: 4px; padding-top: var(--s-1); }
.ts-qmap__cap { margin: 0; font-size: 13px; color: var(--ink-3); }
.ts-qcard { margin: 0 var(--s-4) var(--s-3); padding: var(--s-5); border-radius: var(--r-1); position: relative;
  background: var(--surface); border: 1px solid var(--card-border);
  box-shadow: 0 8px 0 -3px color-mix(in srgb, var(--c) 30%, var(--surface)), 0 16px 0 -7px color-mix(in srgb, var(--c) 16%, var(--surface)); }
.ts-qcard::before { content: ""; position: absolute; left: 0; top: 20px; bottom: 20px; width: 4px; border-radius: 0 4px 4px 0; background: var(--c); }
.ts-qcard__dom { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 3px 10px; border-radius: 999px;
  color: var(--c); background: color-mix(in srgb, var(--c) 14%, transparent); }
.ts-qcard .ts-q__text { margin: 10px 0 0; font-size: 22px; }
.ts-scale { padding: var(--s-3) var(--s-4) 0; display: grid; gap: var(--s-2); }
.ts-scale__dots { display: flex; align-items: center; justify-content: space-between; min-height: 60px; }
.btn.ts-dot { width: var(--d, 40px); height: var(--d, 40px); min-height: 0; min-width: 0; padding: 0; border-radius: 50%; flex: none; background: transparent; transition: transform .15s, background .15s; }
.btn.ts-dot--yes { border: 2.5px solid #F28A3D; }
.btn.ts-dot--no { border: 2.5px solid #7B6CFF; }
.btn.ts-dot--yes.is-on { background: #F28A3D; box-shadow: 0 0 0 6px rgba(242,138,61,.2); }
.btn.ts-dot--no.is-on { background: #7B6CFF; box-shadow: 0 0 0 6px rgba(123,108,255,.2); }
.ts-scale__ends { display: flex; justify-content: space-between; font-size: 13px; font-weight: 700; }
.ts-scale__ends span:first-child { color: #E0702A; }
.ts-scale__ends span:last-child { color: #7B6CFF; }
.ts-scale__pick { margin: var(--s-2) 0 0; text-align: center; font-size: 15px; color: var(--ink-3); min-height: 22px; }
.ts-scale__pick.is-on { color: var(--ink); font-weight: 700; }

.ts-strip { display: flex; align-items: center; gap: var(--s-3); margin: var(--s-4); padding: var(--s-3) var(--s-4); border-radius: 20px; text-decoration: none; color: #fff;
  background: linear-gradient(135deg, var(--t-sunset-a), var(--t-sunset-m) 60%, var(--t-sunset-b)); box-shadow: 0 8px 22px rgba(47,40,150,.22); }
.ts-strip__art { flex: none; width: 40px; height: 40px; }
.ts-strip__art .ts-bloom__p { stroke-width: 3.5; }
.ts-strip__art .ts-bloom__core { filter: none; }
.ts-strip__t { flex: 1; display: grid; gap: 1px; font-size: 13px; color: #F3EEFF; }
.ts-strip__t b { font-size: 15px; color: #fff; }
.ts-strip > .ic { color: #FFD9B8; }
.ts-home__time { margin: 8px 0 0; display: flex; align-items: center; gap: 6px; font-size: 13px; color: #FFD9B8; }

/* v3 06.11 */
.ts-home__art .ts-rose { width: 112px; height: 112px; }
.ts-strip { margin: var(--s-4) 0; border-radius: var(--r-1); }
.ts-strip__art { width: 44px; height: 44px; }
.ts-strip .ts-rose__bg { fill: rgba(255,255,255,.16); }
.ts-strip .ts-rose__v { fill: rgba(255,255,255,.45); }
.ts-strip .ts-rose__v.is-top { fill: #FFB23E; }
.ts-place { display: grid; gap: var(--s-4); padding: var(--s-4); }
.ts-place .ts-strip { margin: 0; }

/* v4 06.11: роза на главной и в плашке в цветах групп */
.ts-home .ts-rose__v, .ts-strip .ts-rose__v { fill: var(--c); opacity: .6; }
.ts-home .ts-rose__v.is-top, .ts-strip .ts-rose__v.is-top { fill: var(--c); opacity: 1; filter: drop-shadow(0 0 4px color-mix(in srgb, var(--c) 70%, transparent)); }
.ts-price--big { letter-spacing: -.01em; }
.ts-home .ts-rose--blur .ts-rose__v, .ts-strip .ts-rose__v { filter: none; opacity: .85; }
.ts-home .ts-rose__bg { fill: rgba(255,255,255,.12); }