/* bosqich 2-4 (2026-11-07): weather chip, side links, toast, reyting / sovgʻa sheets, card neighbours. Same palette as city3d.css. */
.tab b { font: inherit; }
#sovgaBtn.live { color: var(--gold); }
#sovgaBtn.live span { animation: lp 1.6s ease-in-out infinite; }
#sovgaBtn { position: relative; }
#sovgaBtn.live::after { content: ""; position: absolute; top: 4px; right: calc(50% - 18px); width: 9px; height: 9px; border-radius: 50%; background: #ff4d6d; box-shadow: 0 0 0 2px var(--ink); }

.havo { position: fixed; top: calc(var(--safe-t) + 66px); right: 10px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--glass); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #fff; font: 800 13px var(--font); box-shadow: 0 6px 18px rgba(0,0,0,.25); }

.side .lang { font: 900 13px var(--font); letter-spacing: .04em; }
.side .sidelink { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: var(--glass); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  display: grid; place-items: center; text-decoration: none; font-size: 19px; box-shadow: 0 6px 18px rgba(0,0,0,.25); }
.side .sidelink:hover, .side button:hover { border-color: rgba(255, 207, 63, .6); }
.side button:focus-visible, .side .sidelink:focus-visible, .tab:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

.toast3d { position: fixed; left: 50%; top: calc(var(--safe-t) + 112px); transform: translateX(-50%); max-width: min(92vw, 520px); padding: 12px 18px; border: 0; border-radius: 16px;
  background: linear-gradient(90deg, #ffcf3f, #ffb347); color: var(--ink); font: 900 15px var(--font); box-shadow: 0 10px 30px rgba(224,160,0,.45); z-index: 9;
  animation: toastIn .45s cubic-bezier(.2,1.4,.4,1); cursor: pointer; }
@keyframes toastIn { from { transform: translate(-50%, -16px) scale(.92); opacity: 0; } to { transform: translate(-50%, 0) scale(1); opacity: 1; } }

/* card extras */
.card .extras { color: #7a3fc0 !important; font-weight: 800 !important; font-size: 13px; }
.card .near { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: 13px; color: #4a4470; }
.card .near b { font-weight: 900; color: var(--ink); }
.card .near button { border: 0; border-radius: 999px; padding: 5px 10px; background: #f1ecfb; color: var(--ink); font: 800 12px var(--font); }
.card .near button:hover { background: #e3d9fb; }
.card .near span { font-weight: 700; color: #8a84a8; }

/* sheets reuse .saylov; these are the parts they add */
.sheet h3 { margin: 16px 0 6px; font-size: 15px; font-weight: 900; color: var(--ink); }
.sheet hr { border: 0; border-top: 2px dashed #ece6fa; margin: 18px 0 12px; }
.rtabs { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px; margin: 4px -4px 8px; padding-left: 4px; scrollbar-width: none; }
.rtabs button { flex: 0 0 auto; border: 0; border-radius: 999px; padding: 8px 12px; background: #ece6fa; color: var(--ink); font: 800 13px var(--font); }
.rtabs button[aria-selected="true"] { background: var(--ink); color: var(--gold); }
.rlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.rlist li { display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 12px; background: #fff; border: 1px solid #f0eafb; cursor: pointer; }
.rlist li:hover { border-color: var(--gold); }
.rlist li:nth-child(-n+3) { background: linear-gradient(90deg, #fff6d6, #fff); }
.rlist li b { font-weight: 900; text-align: center; font-size: 15px; }
.rlist li span { font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rlist li em { font-style: normal; font-weight: 800; font-size: 12px; color: #7a3fc0; white-space: nowrap; }
.rlist li.empty { display: block; cursor: default; color: #6b6390; font-weight: 700; }

.streak { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin: 14px 0 6px; }
.streak i { font-style: normal; display: grid; place-items: center; aspect-ratio: 1; border-radius: 12px; background: #ece6fa; color: #8a84a8; font-weight: 900; }
.streak i.on { background: linear-gradient(160deg, #ffcf3f, #ff8a00); color: var(--ink); box-shadow: 0 4px 12px rgba(255,140,0,.35); }
.ladder { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.ladder li { padding: 9px 12px; border-radius: 12px; background: #f6f2fd; font-weight: 700; color: #6b6390; }
.ladder li.got { background: #e8fbef; color: #1d6b3c; }
.sheet button:disabled { opacity: .75; }

@media (prefers-reduced-motion: reduce) { .toast3d, #sovgaBtn.live span { animation: none; } }