.ts-home-maze { padding-top: 16px; padding-bottom: 24px; }
.ts-maze-promo { --promo-bg: #102b3d; --promo-ink: #f3fbf8; --promo-muted: #bdcfd7; --promo-path: #57e5be; --promo-wall: #7694a4; position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: center; gap: 28px; padding: 24px 32px; margin: 8px 0 16px; overflow: hidden; background: var(--promo-bg); border: 1px solid #456273; border-radius: 24px; }
.ts-maze-promo .ts-maze-promo-copy { position: relative; z-index: 1; min-width: 0; overflow-wrap: anywhere; }
.ts-maze-promo .ts-maze-promo-copy h2 { margin: 0 0 10px; color: var(--promo-ink); font-size: clamp(24px, 3vw, 32px); font-weight: 700; line-height: 1.2; letter-spacing: -.025em; }
.ts-maze-promo .ts-maze-promo-copy p { max-width: 60ch; margin: 0 0 16px; color: var(--promo-muted); font-size: 14px; line-height: 1.65; }
.ts-maze-promo .ts-maze-feature-play { display: inline-flex; align-items: center; justify-content: center; gap: 32px; min-height: 44px; padding: 10px 18px; color: #072c23; background: #57e5be; border: 1px solid transparent; border-radius: 12px; font-size: 15px; font-weight: 700; text-decoration: none; transition: background-color 160ms ease, transform 160ms cubic-bezier(.23, 1, .32, 1); }
.ts-maze-promo .ts-maze-feature-play:focus-visible { outline: 3px solid var(--promo-path); outline-offset: 5px; }
.ts-maze-promo .ts-maze-feature-play:active { transform: translateY(1px); }
.ts-maze-promo-art { width: min(100%, 180px); justify-self: end; }
.ts-maze-promo-art svg { display: block; width: 100%; height: auto; overflow: visible; }
.ts-maze-promo-walls { fill: none; stroke: var(--promo-wall); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ts-maze-promo-route { fill: none; stroke: var(--promo-path); stroke-opacity: .22; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.ts-maze-promo-dot { fill: var(--promo-path); stroke: var(--promo-bg); stroke-width: 3; }
.ts-maze-promo-exit { fill: var(--promo-path); }
.white-mode .ts-maze-promo { --promo-bg: #edf6f2; --promo-ink: #123e36; --promo-muted: #48665f; --promo-path: #0b8063; --promo-wall: #739a8f; border-color: #c1d9d0; }
.white-mode .ts-maze-promo .ts-maze-feature-play { background: #106f57; color: #fff; }
.ts-maze-promo ::selection { background: #57e5be; color: #072c23; }
@media (hover: hover) and (pointer: fine) {
    .ts-maze-promo .ts-maze-feature-play:hover { background: #80f1d1; transform: translateY(-2px); }
    .white-mode .ts-maze-promo .ts-maze-feature-play:hover { background: #095641; }
}
@media (max-width: 767px) {
    .ts-home-maze { padding-top: 12px; padding-bottom: 20px; }
    .ts-maze-promo { grid-template-columns: minmax(0, 1fr) 76px; grid-template-areas: 'title art' 'text art' 'button art'; padding: 18px 16px; gap: 10px 12px; border-radius: 16px; }
    .ts-maze-promo .ts-maze-promo-copy { display: contents; }
    .ts-maze-promo .ts-maze-promo-copy h2 { grid-area: title; font-size: 24px; margin: 0; overflow-wrap: anywhere; }
    .ts-maze-promo .ts-maze-promo-copy p { grid-area: text; font-size: 13px; margin: 0; }
    .ts-maze-promo .ts-maze-feature-play { grid-area: button; justify-self: start; }
    .ts-maze-promo-art { grid-area: art; width: 76px; }
}
@media (prefers-reduced-motion: reduce) {
    .ts-maze-promo .ts-maze-promo-dot { animation: none !important; }
    .ts-maze-promo .ts-maze-feature-play { transition: none; transform: none !important; }
}
/* Generated maze route */
.ts-maze-promo-dot { transform: translate(43.33333333333333px, 43.33333333333333px); }
@media (prefers-reduced-motion: no-preference) { .ts-maze-promo.is-visible .ts-maze-promo-dot { animation: maze-promo-journey 4.8s linear 1 forwards; } }
@keyframes maze-promo-journey {
    0.000% { transform: translate(43.33333333333333px, 43.33333333333333px); }
    10.000% { transform: translate(43.33333333333333px, 90px); }
    20.000% { transform: translate(43.33333333333333px, 136.66666666666666px); }
    30.000% { transform: translate(90px, 136.66666666666666px); }
    40.000% { transform: translate(136.66666666666666px, 136.66666666666666px); }
    50.000% { transform: translate(136.66666666666666px, 183.33333333333331px); }
    60.000% { transform: translate(136.66666666666666px, 230px); }
    70.000% { transform: translate(183.33333333333331px, 230px); }
    80.000% { transform: translate(230px, 230px); }
    90.000% { transform: translate(230px, 276.66666666666663px); }
    100.000% { transform: translate(276.66666666666663px, 276.66666666666663px); }
}
