/* Гороскоп privorot.com. Базовые шрифты и цвета — /site-design.css. */
.hs-main { max-width: 920px; margin: 0 auto; padding: 16px 24px 40px; }
.hs-kicker { font: 12px Arial, sans-serif; letter-spacing: .19em; text-transform: uppercase; color: #8fd7f1; }
.hs-intro { text-align: center; padding: 16px 0 34px; }
.hs-intro .preview { color: #86c6e2; font: 14px/1.5 Arial, sans-serif; margin-bottom: 24px; }
.hs-intro h1 { font-weight: 400; font-size: clamp(38px, 6vw, 58px); line-height: 1.1; margin-top: 12px; }
.hs-date { display: block; color: #8fd7f1; margin: 16px 0 18px; font-size: 25px; }
.hs-intro-text { max-width: 720px; margin: 0 auto; font-size: 21px; line-height: 1.6; color: #e6e6e6; }
.hs-today { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; margin-top: 22px; padding: 10px 20px; border: 1px solid rgba(143,215,241,.35); border-radius: 99px; font-size: 17px; color: #e6e6e6; text-decoration: none; }
.hs-today:hover { border-color: #8fd7f1; }
.hs-today b { font-weight: 400; color: #8fd7f1; }

.hs-sym { font-family: "Segoe UI Symbol", "Noto Sans Symbols 2", "Noto Sans Symbols", "DejaVu Sans", "Apple Symbols", sans-serif; color: #8fd7f1; font-weight: 400; }

.hs-zodiac { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin: 0 0 34px; }
.hs-zodiac a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px 4px 10px; border: 1px solid rgba(143,215,241,.28); border-radius: 10px; text-decoration: none; color: #fff; font-size: 17px; line-height: 1.2; text-align: center; }
.hs-zodiac a .hs-sym { font-size: 26px; line-height: 1.1; }
.hs-zodiac a small { font: 11px Arial, sans-serif; color: #8ea3b9; }
.hs-zodiac a:hover { border-color: #8fd7f1; background: #0d1a2c; }
.hs-zodiac a[aria-current="true"] { border-color: #8fd7f1; background: #10223a; }
.hs-zodiac a:focus-visible { outline: 2px solid #8fd7f1; outline-offset: 3px; }

.hs-forecast { padding: 34px 0 30px; border-top: 1px solid rgba(143,215,241,.28); scroll-margin-top: 16px; }
.hs-js .hs-forecast { border-top: 0; padding-top: 6px; }
.hs-forecast[hidden] { display: none; }
.hs-title { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 20px; }
.hs-title h2 { font-size: 40px; font-weight: 400; line-height: 1.1; }
.hs-title h2 .hs-sym { margin-right: 10px; }
.hs-title small { font: 14px Arial, sans-serif; color: #8ea3b9; }

.hs-scores { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 26px; }
.hs-score { border: 1px solid rgba(143,215,241,.25); border-radius: 12px; padding: 14px 16px; background: #0a1626; min-width: 0; }
.hs-score span { display: block; font: 12px Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #9fb3c8; }
.hs-score strong { display: block; font-size: 26px; font-weight: 400; margin-top: 6px; }
.hs-score.love strong { color: #e8a0a8; }
.hs-score.time strong { font-size: 21px; color: #8fd7f1; }
.hs-bar { display: block; height: 4px; margin-top: 10px; border-radius: 2px; background: #262626; overflow: hidden; }
.hs-bar i { display: block; height: 100%; background: #8fd7f1; border-radius: 2px; }
.hs-score.love .hs-bar i { background: #d9808b; }

.hs-block { margin-bottom: 22px; }
.hs-block h3 { font: 13px Arial, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: #8fd7f1; margin: 0 0 8px; }
.hs-block.love h3 { color: #e8a0a8; }
.hs-block p { font-size: 21px; line-height: 1.6; color: #eee; }
.hs-block.love p { font-size: 22px; color: #fff; }

.hs-advice { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 22px 24px; background: #0c182a; border: 1px solid rgba(143,215,241,.2); border-radius: 12px; margin-top: 6px; }
.hs-advice p { font-size: 19px; line-height: 1.5; }
.hs-advice strong { display: block; font: 12px Arial, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #8fd7f1; margin-bottom: 8px; }

.hs-cta { margin-top: 22px; padding: 22px 24px; border-radius: 12px; background: #0f2136; border: 1px solid rgba(143,215,241,.22); color: #e3ecf3; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px 24px; }
.hs-cta p { font-size: 19px; line-height: 1.45; max-width: 520px; }
.hs-cta div { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.hs-cta .hs-btn { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:12px 22px; background:#12263c; color:#f2f6fa; border:1px solid rgba(143,215,241,.45); border-radius:8px; font:18px Forum,Georgia,serif; text-decoration:none; transition:border-color .2s,color .2s; }
.hs-cta .hs-btn:hover { border-color:#8fd7f1; color:#8fd7f1; background:#12263c; }
.hs-cta .hs-link { color: #8fd7f1; font-size: 16px; }

.hs-back { display: inline-block; margin-top: 18px; color: #86c6e2; font-size: 17px; }
.hs-js .hs-back { display: none; }
.hs-others { display: none; margin-top: 26px; text-align: center; }
.hs-js .hs-others { display: block; }
.hs-others button { display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:12px 22px; background:#12263c; color:#f2f6fa; border:1px solid rgba(143,215,241,.45); border-radius:8px; font:18px Forum,Georgia,serif; text-decoration:none; cursor:pointer; transition:border-color .2s,color .2s; }
.hs-others button:hover { border-color:#8fd7f1; color:#8fd7f1; background:#12263c; }

.hs-more { margin-top: 56px; }
.hs-more h2 { font-size: 32px; font-weight: 400; text-align: center; margin-bottom: 20px; }
.hs-more-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.hs-more-links a:last-child:nth-child(odd) { grid-column: 1 / -1; }
.hs-more-links a { display: block; padding: 18px 20px; border: 1px solid rgba(143,215,241,.35); border-radius: 10px; text-decoration: none; }
.hs-more-links a:hover { border-color: #8fd7f1; }
.hs-more-links strong { display: block; font-size: 22px; font-weight: 400; }
.hs-more-links span { display: block; margin-top: 4px; font: 14px/1.5 Arial, sans-serif; color: #9fb3c8; }

.hs-note { margin-top: 44px; border-top: 1px solid rgba(143,215,241,.2); padding-top: 22px; color: #8a9db2; font-size: 16px; line-height: 1.5; }

@media (max-width: 760px) {
  .hs-zodiac { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .hs-scores { grid-template-columns: 1fr 1fr; }
  .hs-score.time { grid-column: 1 / -1; }
  .hs-more-links { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .hs-main { padding-inline: 16px; }
  .hs-intro-text { font-size: 19px; }
  .hs-zodiac { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .hs-zodiac a { font-size: 15px; padding: 10px 2px 8px; }
  .hs-title h2 { font-size: 34px; }
  .hs-block p { font-size: 19px; }
  .hs-block.love p { font-size: 20px; }
  .hs-advice { grid-template-columns: 1fr; gap: 16px; padding: 18px; }
  .hs-cta { padding: 20px 18px; }
}

/* ===== Плавный переход между страницами сайта =====
   Браузеры Chrome, Edge, Яндекс, Opera и Safari 18+ мягко растворяют старую
   страницу в новой; шапка с меню при этом остаётся на месте. Остальные
   браузеры просто открывают страницу как обычно. */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .45s; animation-timing-function: ease; }
header.site-header { view-transition-name: site-header; }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}

/* Единый стиль окошек других разделов (как на всех страницах сайта) */
.more-links a, .hs-more-links a { display:block; padding:18px 20px; background:#0f2136; border:1px solid rgba(143,215,241,.35); border-radius:8px; text-decoration:none; transition:border-color .2s; }
.more-links a:hover, .hs-more-links a:hover { border-color:#8fd7f1; }
.more-links strong, .hs-more-links strong { display:block; font:22px Forum,Georgia,serif; font-weight:400; color:#fff; }
.more-links span, .hs-more-links span { display:block; margin-top:4px; font:15px/1.4 Forum,Georgia,serif; color:#9fb3c8; }

/* Пока подставляется выпуск по дате посетителя (см. goroskop.js) */
.hs-intro-text, .hs-today, .hs-date, .hs-forecast { transition: opacity .35s ease; }
.hs-loading .hs-intro-text, .hs-loading .hs-today, .hs-loading .hs-date, .hs-loading .hs-forecast { opacity: 0; }


/* ===== Тёмно-синее оформление и значки знаков как в аддоне «Главная» ===== */
.hs-score, .hs-cta, .hs-advice { border-radius: 6px; }
.hs-cta .hs-btn { min-height: 0; padding: 9px 18px; background: #1f6fa6; border-color: transparent; color: #fff; border-radius: 4px; font-size: 17px; }
.hs-cta .hs-btn:hover { background: #1f6fa6; color: #fff; filter: brightness(1.1); border-color: transparent; }
.hs-others button { min-height: 0; padding: 9px 18px; border-radius: 4px; font-size: 17px; background: rgba(255,255,255,.03); }
.hs-zodiac a { border-radius: 6px; transition: border-color .2s, background-color .2s; }
.hs-zodiac a:hover { background: rgba(143,215,241,.06); }
.hs-zodiac a[aria-current="true"] { background: rgba(143,215,241,.10); }
.hs-zi svg { display: block; width: 100%; height: 100%; overflow: visible; }
.hs-zodiac a .hs-zi { display: block; width: 38px; height: 38px; margin: 0 auto 4px; font-size: 0; line-height: 0; transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.hs-zodiac a .hs-zi svg { transform-origin: 50% 70%; animation: hs-z-sway 5.2s ease-in-out infinite; }
.hs-zodiac a:nth-child(3n+2) .hs-zi svg { animation-duration: 6.1s; animation-delay: -1.3s; animation-direction: reverse; }
.hs-zodiac a:nth-child(3n) .hs-zi svg { animation-duration: 4.7s; animation-delay: -3.1s; }
.hs-zodiac a:hover .hs-zi { transform: scale(1.15); }
.hs-zodiac a[aria-current="true"] .hs-zi { transform: scale(1.12); filter: drop-shadow(0 0 5px rgba(143,215,241,.75)); }
.hs-title h2 { display: flex; align-items: center; }
.hs-title h2 .hs-zi { margin-right: 12px; }
.hs-title h2 .hs-zi { display: inline-block; width: 44px; height: 44px; flex: none; font-size: 0; line-height: 0; }
@keyframes hs-z-sway { 0%,100% { transform: rotate(-7deg) translateY(0); } 50% { transform: rotate(7deg) translateY(-2px); } }
@media (prefers-reduced-motion: reduce) { .hs-zodiac a .hs-zi svg, .hs-zodiac a .hs-zi { animation: none; transition: none; } }

/* ===== Тёмно-синее оформление (как окна аддона «Главная» на форуме) ===== */
body { background: #0a1726; }
.more-links a, .hs-more-links a { background: #0f2136; border: 1px solid rgba(143,215,241,.22); border-radius: 8px; transition: border-color .2s, background-color .2s; }
.more-links a:hover, .hs-more-links a:hover { border-color: #8fd7f1; background: #0e1d30; }
.more-links span, .hs-more-links span { color: #9fb3c8; }
.button-soft { background: rgba(255,255,255,.03); color: #f2f6fa; border: 1px solid rgba(143,215,241,.45); border-radius: 8px; }
.button-soft:hover { background: rgba(255,255,255,.03); border-color: #8fd7f1; color: #e9f7ff; box-shadow: 0 0 22px rgba(143,215,241,.18); }
a:focus-visible, button:focus-visible { outline-color: #8fd7f1; }