/* Тема «Конфета»: весь текстово-кнопочный слой поверх 3D-города.
   Подключается после style.css и только перекрашивает и перерисовывает формы — разметка и 3D не меняются.
   Фиолетовые шапки и выбранное, коралловые главные кнопки со свечением, белые карточки с мягкой сиреневой тенью,
   шрифты Nunito (текст) и Unbounded (заголовки, крупные суммы). */
:root {
  --ink: #2f2847;
  --muted: #8e86a3;
  --panel: #fffaf8;
  --line: #efe7f4;
  --accent: #7b4dff;
  --accent-ink: #fff;
  --good: #1fa77a;
  --bad: #ef5a6f;
  --violet: #7b4dff;
  --lilac: #b56cff;
  --coral: #ff7a7a;
  --peach: #ffa36c;
  --mint: #5ed9ba;
  --sun: #ffd76a;
  --soft: #f3eefb;          /* сиреневая подложка: вкладки, неактивные кнопки */
  --grad: linear-gradient(135deg, var(--violet), var(--lilac));
  --grad-hot: linear-gradient(135deg, var(--coral), var(--peach));
  --shadow-sm: 0 4px 12px rgba(70, 44, 120, .08);
  --shadow: 0 10px 28px rgba(70, 44, 120, .14), 0 3px 8px rgba(70, 44, 120, .06);
  --glow: 0 8px 20px rgba(255, 122, 122, .38);
  --glow-v: 0 8px 20px rgba(123, 77, 255, .34);
  --title: 'Unbounded', 'Nunito', system-ui, sans-serif;
}

html, body { font: 600 15px/1.4 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }
b, strong { font-weight: 800; }

/* --- метки на карте: только шрифт и форма плашек (цвета и сами значки — как были) --- */
.lbl-name { font: 800 12px/1.1 'Nunito', system-ui, sans-serif; }
.lbl-badge { font: 900 11px/1 'Nunito', system-ui, sans-serif; border-radius: 9px; padding: 5px 9px; }
.street-name { font-family: 'Nunito', system-ui, sans-serif; font-weight: 900; }
/* герой и маршрут остаются оранжевыми — их цвет держим явно, раз акцент стал фиолетовым */
.hero-pin { background: radial-gradient(circle at 35% 30%, #ffc56b, #f2a541 60%, #e08a1e); }
.hero-ring { border-color: #f2a541; }
.route { stroke: #f2a541; }
.lbl.selected .lbl-ico { box-shadow: 0 0 0 3px var(--violet), 0 2px 8px rgba(0, 0, 0, .3); }

/* --- шапка: стеклянные капсулы --- */
.hud-item, .hud-btn, .hud-pill {
  background: rgba(255, 255, 255, .9); border: 1px solid rgba(255, 255, 255, .95); border-radius: 16px;
  box-shadow: 0 7px 18px rgba(58, 36, 88, .14); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.hud-value { font-weight: 900; font-size: 17px; letter-spacing: -.2px; }
.hud-debt { color: var(--bad); font-size: 14px; }
.hud-biz { color: var(--violet); font-weight: 800; }
.hud-btn { color: var(--violet); font-weight: 900; }

/* --- кнопка телефона: фиолетовая конфета со свечением --- */
.dock-phone { background: var(--grad); border: 3px solid #fff; box-shadow: var(--glow-v); }
.phone-badge { background: var(--coral); }

/* --- панель героя: белая стеклянная карточка вместо тёмной --- */
.status.dock {
  background: rgba(255, 255, 255, .9); color: var(--ink); border-radius: 26px; border: 1px solid rgba(255, 255, 255, .95);
  box-shadow: var(--shadow); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
.dock-face { border-radius: 18px; border: 3px solid #fff; background: linear-gradient(145deg, #fff1a9, #ffb479);
  box-shadow: 0 6px 14px rgba(255, 140, 90, .3); }
.status-text { font-weight: 900; font-size: 14px; }
.need i { height: 8px; background: #e8e0f5; }
.dock-clock { font-weight: 900; color: var(--ink); }
.status-btns { background: var(--soft); border-radius: 14px; padding: 3px; gap: 2px; }
.st-btn { background: transparent; color: var(--ink); border-radius: 11px; font-weight: 900; height: 30px; }
.st-btn.on { background: var(--grad); color: #fff; box-shadow: 0 3px 8px rgba(123, 77, 255, .3); }
.st-btn.st-stop { background: var(--grad-hot); color: #fff; box-shadow: var(--glow); }

/* --- круговое меню здания --- */
.pie { background: rgba(47, 40, 71, .16); }
.pie-center span { border: 3px solid #fff; background: linear-gradient(145deg, #fff, #efe6ff); box-shadow: var(--glow-v); border-radius: 20px; }
.pie-center b { background: var(--grad); border-radius: 11px; font-weight: 900; padding: 4px 11px; box-shadow: var(--glow-v); }
.pie-ico { background: #fff; border: 2px solid #fff; box-shadow: var(--shadow); }
.pie-item:hover .pie-ico, .pie-item:focus-visible .pie-ico { background: linear-gradient(145deg, #fff, #ece3ff); }
.pie-label { background: rgba(255, 255, 255, .96); border-radius: 10px; font-weight: 900; padding: 3px 8px; box-shadow: var(--shadow-sm); }
.pie-label small { font-weight: 700; }

/* --- кнопки масштаба карты и внутри зданий --- */
.map-controls button { border-radius: 15px; border: 1px solid rgba(255, 255, 255, .95); background: rgba(255, 255, 255, .9);
  box-shadow: 0 6px 16px rgba(58, 36, 88, .14); color: var(--violet); font-weight: 900; }
.in-btn { border: 1px solid rgba(255, 255, 255, .95); border-radius: 16px; background: rgba(255, 255, 255, .94); font-weight: 900; box-shadow: var(--shadow); }
.in-btn.primary { background: var(--grad-hot); border-color: transparent; color: #fff; box-shadow: var(--glow); }
.in-btn.round .in-ico, .q-ico { background: #fff; border: 2px solid #fff; box-shadow: var(--shadow); }
.in-btn.round.primary .in-ico { background: var(--grad-hot); box-shadow: var(--glow); }
.in-btn.round .in-cap, .q-cap { background: rgba(47, 40, 71, .82); border-radius: 9px; font-weight: 900; }
.live-chip { background: rgba(47, 40, 71, .82); border-radius: 14px; font-weight: 700; }

/* --- шторка --- */
.backdrop { background: rgba(47, 40, 71, .28); }
.sheet { background: var(--panel); border-radius: 30px 30px 0 0; box-shadow: 0 -16px 38px rgba(59, 40, 85, .18); }
@media (min-width: 820px) { .sheet { border-radius: 30px; } }
.sheet-grip { background: #dfd6e7; }
.sheet-close { border-radius: 12px; background: var(--soft); color: #6f657c; font-weight: 900; }

.s-icon { flex: none; width: 58px; height: 58px; border-radius: 20px; display: grid; place-items: center; font-size: 32px;
  background: linear-gradient(145deg, #fff0af, #ffb6ba); box-shadow: 0 8px 18px rgba(255, 122, 122, .2); }
.s-title { font: 700 19px/1.15 var(--title); letter-spacing: -.2px; }
.s-addr { font-weight: 700; }
.s-tag { font-weight: 900; font-size: 12px; padding: 4px 10px; border-radius: 10px; background: var(--soft); color: #6f5bb0; }
.s-tag.mine { background: #e3faf2; color: #1f8a68; }
.s-tag.here { background: #fff0da; color: #d0782a; }
.s-text { color: #5f5878; background: #fff; border-radius: 18px; padding: 10px 14px; box-shadow: var(--shadow-sm); font-weight: 600; }
.s-section { color: var(--violet); font-weight: 900; letter-spacing: .6px; font-size: 12px; }
.note { font-weight: 600; }

/* строки фактов — белая карточка без серых линий сверху */
.s-facts { background: #fff; border: 1px solid #f2ebf2; border-radius: 20px; padding: 2px 14px; box-shadow: var(--shadow-sm); }
.s-facts li { border-bottom: 1px solid #f4eff8; }
.s-facts li:last-child { border-bottom: 0; }
.s-facts span:last-child { font-weight: 900; }

/* --- кнопки действий --- */
.act { border: 1px solid #f1eaf6; border-radius: 18px; background: #fff; box-shadow: var(--shadow-sm); font-weight: 800; }
.act .act-sub { font-weight: 600; color: var(--muted); opacity: 1; }
.act .act-price { font-weight: 900; color: var(--violet); }
.act.primary { background: var(--grad-hot); border-color: transparent; color: #fff; box-shadow: var(--glow); font-weight: 900; }
.act.primary .act-sub { color: rgba(255, 255, 255, .88); }
.act.primary .act-price { color: #fff; }
.act.danger { color: var(--bad); background: #fff5f6; border-color: #ffe3e7; }
.act:disabled { opacity: .5; box-shadow: none; }
.actions.seg .act { border-radius: 14px; }
/* сегменты и вкладки — сиреневая дорожка, выбранное — белое с фиолетовым текстом */
.actions.seg.tabs { background: var(--soft); padding: 4px; border-radius: 16px; }
.actions.seg.tabs .act { border: 0; box-shadow: none; background: transparent; border-radius: 12px; }
.actions.seg.tabs .act.primary, .actions.seg.tabs .act.on { background: #fff; color: var(--violet); box-shadow: var(--shadow-sm); }
.act.dl-btn { border-radius: 11px; font-weight: 800; }
.act.ph-back { border-radius: 14px; background: var(--soft); border: 0; box-shadow: none; color: var(--violet); font-weight: 900; }

/* --- уведомление --- */
.toast { background: rgba(255, 255, 255, .95); border-left: 0; border-radius: 20px; font-weight: 700; box-shadow: var(--shadow);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.toast-ico { border-radius: 14px; background: linear-gradient(145deg, #f3ecff, #e4d8ff); }

/* --- старт --- */
.intro { background: rgba(47, 40, 71, .55); }
.intro-card { border-radius: 30px; box-shadow: var(--shadow); }
.intro-card h1 { font: 700 23px/1.2 var(--title); }
.intro-sub { color: #5f5878; }
.intro-choice button, .intro-next { border-radius: 18px; border: 1px solid #f1eaf6; font-weight: 900; box-shadow: var(--shadow-sm); }
.intro-next { background: var(--grad-hot); color: #fff; border-color: transparent; box-shadow: var(--glow); }
.cl-form input { border-radius: 14px; border-color: #ece3f3; }

/* --- телефон --- */
.ph-home { background: linear-gradient(160deg, #8a5cff 0%, #b56cff 55%, #ff9fcb 120%); border-radius: 30px; box-shadow: var(--glow-v); }
.ph-ico { border-radius: 20px; box-shadow: 0 8px 16px rgba(47, 40, 71, .22), inset 0 2px 0 rgba(255, 255, 255, .35);
  background-image: linear-gradient(160deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, 0) 55%); }
.act.ph-app { font-weight: 800; }
.ph-ico i, .ph-chat-side i { background: var(--coral); }
.ph-title { font: 700 18px/1.2 var(--title); }
.ph-chats { border-top: 0; background: #fff; border-radius: 20px; padding: 0 12px; box-shadow: var(--shadow-sm); }
.act.ph-chat { border-bottom-color: #f4eff8; box-shadow: none; }
.act.ph-chat:last-child { border-bottom: 0; }
.ph-ava { background: linear-gradient(145deg, #f3ecff, #e4d8ff); border-radius: 15px; }
.ph-thread { background: var(--soft); border-radius: 22px; }
.ph-bubble { border-radius: 6px 18px 18px 18px; box-shadow: var(--shadow-sm); }
.act.ph-go { color: var(--violet); }

/* --- карточки, плитки, таблицы, сообщения --- */
.kpi, .an-block, .goalbox, .dep, .loan, .xfer, .rv, .msg, .bk-box, .act.bk-week, .bk-sum > div {
  background: #fff; border: 1px solid #f2ebf2; border-radius: 20px; box-shadow: var(--shadow-sm);
}
.an-tbl { border: 1px solid #f2ebf2; border-radius: 20px; box-shadow: var(--shadow-sm); }
.an-tbl th, .an-tbl td { border-bottom-color: #f4eff8; }
.goalbox.ok { background: #effbf7; border-color: #d4f3e8; }
.goalbox b, .kpi b, .bk-sum b, .bk-week-nums b { font-family: var(--title); font-weight: 700; letter-spacing: -.3px; }
.goalbox b small { font-family: 'Nunito', sans-serif; }
.gm { background: var(--soft); }
.biz-ico, .ph-ava { border-radius: 15px; }
.biz-ico { background: linear-gradient(145deg, #fff0af, #ffb6ba); }
.biz-spark i { background: var(--lilac); }
.msg.unread, .rv.rv-new { border-color: var(--violet); box-shadow: 0 0 0 1px var(--violet) inset, var(--shadow-sm); }
.msg.ad { background: #fdf9ff; }
.rv-reply { border-left-color: var(--lilac); background: var(--soft); border-radius: 0 12px 12px 0; }
.reserved { background: #e9fbf5; border-color: var(--mint); border-radius: 16px; }
.wk-days .dl-btn.on { background: var(--grad); color: #fff; }
.xfer-chips button { background: var(--soft); border-color: transparent; color: var(--violet); font-weight: 900; }
.loan input[type=range], .xfer input[type=range] { accent-color: var(--violet); }
.loan select { border-radius: 10px; border-color: #ece3f3; }
.dep-term span, .dep-head span { font-weight: 900; }

/* --- колесо ответа и конец игры --- */
.wheel-ov { background: rgba(47, 40, 71, .55); }
.wheel-box { background: var(--panel); border-radius: 30px; box-shadow: var(--shadow); }
.wheel-pin { border-top-color: var(--violet); }
.wheel-x { border-radius: 12px; background: var(--soft); color: #6f657c; font-weight: 900; }
.go-box h2 { font: 700 22px/1.2 var(--title); }

/* --- банк --- */
.bk-tabs, .bk-seg { background: var(--soft); border-radius: 16px; }
.bk-tabs .act, .bk-seg .act { box-shadow: none; border: 0; background: transparent; color: var(--muted); font-weight: 900; }
.bk-tabs .act.on, .bk-seg .act.on { background: #fff; color: var(--violet); box-shadow: var(--shadow-sm); }
.bk-card { background: var(--grad); border-radius: 26px; box-shadow: var(--glow-v); }
.bk-card::before { content: ''; position: absolute; right: 26px; bottom: -60px; width: 150px; height: 150px; border-radius: 50%;
  border: 26px solid rgba(255, 255, 255, .09); pointer-events: none; }
.bk-cash { font: 700 30px/1.15 var(--title); letter-spacing: -.8px; }
.bk-mini span { border-radius: 14px; background: rgba(255, 255, 255, .16); }
.act.bk-more { background: var(--soft); border-color: transparent; color: var(--violet); box-shadow: none; }
.act.bk-cat { box-shadow: none; border: 0; }
.act.bk-cat.on { background: var(--soft); }
.act.bk-dbar { box-shadow: none; }
.bk-dbar i { background: linear-gradient(180deg, var(--peach), var(--coral)); border-radius: 6px 6px 2px 2px; }
.bk-box-title, .bk-day { color: var(--violet); }
.bk-op-ico { border-radius: 14px; box-shadow: inset 0 2px 0 rgba(255, 255, 255, .3); }
.bk-stack, .bk-bar { background: var(--soft); }
.bk-alert { border-color: var(--bad); box-shadow: 0 0 0 1px var(--bad) inset, var(--shadow-sm); }
.bk-score b { font-family: var(--title); font-weight: 700; }

/* --- отклик на нажатие --- */
button.is-pressed:not(:disabled), button:active:not(:disabled) { scale: .96; filter: brightness(.97) saturate(1.1); }
/* переключатели «один из нескольких» (валюта, фильтр отзывов): выбранный — белый на сиреневой дорожке */
.actions.seg.cur-seg { background: var(--soft); padding: 4px; border-radius: 16px; gap: 4px; }
.actions.seg.cur-seg .act { border: 0; box-shadow: none; background: transparent; color: var(--muted); }
.actions.seg.cur-seg .act.primary { background: #fff; color: var(--violet); box-shadow: var(--shadow-sm); }