/* Узел B: «милый» стиль в духе kawaii (розовый, бантики, сердечки, фон из зайчиков).
   Только общие мотивы, нарисованные вручную; никаких персонажей и логотипов Sanrio.
   Подключается последним; все правила действуют только при html[data-theme="bunny"] (тема «Зайчики»). */

html[data-theme="bunny"] {
  color-scheme: light;
  --bg: #FFF0F5;
  --bg-glow: radial-gradient(ellipse 70% 50% at 10% 0%, #FFE4EC 0%, transparent 60%),
             radial-gradient(ellipse 60% 45% at 95% 100%, #FFE4EC 0%, transparent 55%);
  --bunny-tile: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='150' height='150' viewBox='0 0 150 150'><g transform='translate(32 40) rotate(-12) scale(1)'><ellipse cx='-5.5' cy='-15' rx='3.6' ry='9' fill='%23FFD3E1' transform='rotate(-10 -5.5 -15)'/><ellipse cx='5.5' cy='-15' rx='3.6' ry='9' fill='%23FFD3E1' transform='rotate(10 5.5 -15)'/><ellipse cx='0' cy='0' rx='12' ry='10.5' fill='%23FFD3E1'/><circle cx='-4.2' cy='-1' r='1.3' fill='%23F7B6CB'/><circle cx='4.2' cy='-1' r='1.3' fill='%23F7B6CB'/><ellipse cx='0' cy='2.2' rx='1.4' ry='1' fill='%23F7B6CB'/></g><g transform='translate(104 30) rotate(14) scale(0.85)'><ellipse cx='-5.5' cy='-15' rx='3.6' ry='9' fill='%23FFD3E1' transform='rotate(-10 -5.5 -15)'/><ellipse cx='5.5' cy='-15' rx='3.6' ry='9' fill='%23FFD3E1' transform='rotate(10 5.5 -15)'/><ellipse cx='0' cy='0' rx='12' ry='10.5' fill='%23FFD3E1'/><circle cx='-4.2' cy='-1' r='1.3' fill='%23F7B6CB'/><circle cx='4.2' cy='-1' r='1.3' fill='%23F7B6CB'/><ellipse cx='0' cy='2.2' rx='1.4' ry='1' fill='%23F7B6CB'/></g><g transform='translate(72 104) rotate(4) scale(1.05)'><ellipse cx='-5.5' cy='-15' rx='3.6' ry='9' fill='%23FFD3E1' transform='rotate(-10 -5.5 -15)'/><ellipse cx='5.5' cy='-15' rx='3.6' ry='9' fill='%23FFD3E1' transform='rotate(10 5.5 -15)'/><ellipse cx='0' cy='0' rx='12' ry='10.5' fill='%23FFD3E1'/><circle cx='-4.2' cy='-1' r='1.3' fill='%23F7B6CB'/><circle cx='4.2' cy='-1' r='1.3' fill='%23F7B6CB'/><ellipse cx='0' cy='2.2' rx='1.4' ry='1' fill='%23F7B6CB'/></g><g transform='translate(130 118) rotate(-20) scale(0.7)'><ellipse cx='-5.5' cy='-15' rx='3.6' ry='9' fill='%23FFD3E1' transform='rotate(-10 -5.5 -15)'/><ellipse cx='5.5' cy='-15' rx='3.6' ry='9' fill='%23FFD3E1' transform='rotate(10 5.5 -15)'/><ellipse cx='0' cy='0' rx='12' ry='10.5' fill='%23FFD3E1'/><circle cx='-4.2' cy='-1' r='1.3' fill='%23F7B6CB'/><circle cx='4.2' cy='-1' r='1.3' fill='%23F7B6CB'/><ellipse cx='0' cy='2.2' rx='1.4' ry='1' fill='%23F7B6CB'/></g><path transform='translate(70 50) scale(1.1)' d='M0 3.2C-6-1.6-3.6-7 0-3.9C3.6-7 6-1.6 0 3.2Z' fill='%23FFC4D6'/><path transform='translate(20 112) scale(0.9)' d='M0 3.2C-6-1.6-3.6-7 0-3.9C3.6-7 6-1.6 0 3.2Z' fill='%23FFC4D6'/><path transform='translate(128 76) scale(0.8)' d='M0 3.2C-6-1.6-3.6-7 0-3.9C3.6-7 6-1.6 0 3.2Z' fill='%23FFC4D6'/><g transform='translate(100 76) scale(0.9)' fill='%23FFC0D3'><path d='M0 0L-6-4.2Q-7.4 0-6 4.2Z'/><path d='M0 0L6-4.2Q7.4 0 6 4.2Z'/><circle r='1.8'/></g><g transform='translate(40 82) scale(0.7)' fill='%23FFC0D3'><path d='M0 0L-6-4.2Q-7.4 0-6 4.2Z'/><path d='M0 0L6-4.2Q7.4 0 6 4.2Z'/><circle r='1.8'/></g></svg>");
  --ink: #45193A;            /* тёмная слива: 12:1 на #FFF0F5 */
  --muted: #84466A;          /* 6:1 на белом */
  --accent: #FF5C8A;
  --accent-dark: #FF8FB1;
  --accent-ink: #3B0F2A;     /* тёмный текст на розовой кнопке: AA */
  --accent-text: #C2185B;    /* розовый для текста/ссылок: 5.6:1 на белом */
  --accent-soft: #FFE4EC;
  --bow: #E8364F;
  --panel: rgba(255, 255, 255, 0.97);
  --line: #FFD3E0;
  --hover: #FFE4EC;
  --soft: #FFF5F8;
  --zebra: #FFF3F7;
  --nav-text: #45193A;
  --nav-border: #FFD3E0;
  --input-bg: #FFFFFF;
  --input-border: #F5B8CB;
  --focus-ring: rgba(255, 92, 138, 0.35);
  --overlay: rgba(69, 25, 58, 0.32);
  --dialog-shadow: 0 24px 60px rgba(214, 51, 108, 0.22);
  --shadow: 0 10px 30px rgba(255, 92, 138, 0.14), 0 2px 6px rgba(255, 92, 138, 0.08);
  --tile-hover-shadow: 0 14px 34px rgba(255, 92, 138, 0.2);
  --card-border: 1px solid #FFD3E0;
  --glass: none;
  --error-bg: #FFE3E6; --error-ink: #A3122E;
  --ok-bg: #E6F7EC;    --ok-ink: #17643A;
  --danger-bg: #FFF1F3; --danger-ink: #B0102F; --danger-line: #F3A3B3;
  --radius: 20px; --radius-sm: 14px; --pill: 999px;
  --st-solid: #FFFFFF;
  --st-sticky-bg: #FFF0F5;
  --st-empty-bg: #FFF7FA;
  --bunny-fur: #FFFFFF; --bunny-line: #7A3D61; --bunny-ear: #FFB3C9; --bunny-cheek: #FF9DBA; --bunny-eye: #3B0F2A;
}

/* ---------- шрифт ---------- */

html[data-theme="bunny"] body { font-family: var(--ui-font, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif); letter-spacing: 0; }

html[data-theme="bunny"] h1, html[data-theme="bunny"] h2, html[data-theme="bunny"] .brand, html[data-theme="bunny"] .brand-text, html[data-theme="bunny"] .login-card h1, html[data-theme="bunny"] .month-title { font-family: var(--ui-font, system-ui, sans-serif); letter-spacing: -0.01em; }

html[data-theme="bunny"] h1 { font-weight: 700; }

html[data-theme="bunny"] h2 { font-weight: 700; }

/* ---------- фон: повторяющийся узор из зайчиков (слой position:fixed — без background-attachment) ---------- */

html[data-theme="bunny"] body { background: var(--bg-glow), var(--bg); }

html[data-theme="bunny"] body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 1;
  background-image: var(--bunny-tile);
  background-size: 150px 150px;
  background-position: 0 0;
  background-repeat: repeat;
  will-change: auto;
}

/* ---------- бренд с бантиком ---------- */

html[data-theme="bunny"] .brand-mark {
  position: relative; border-radius: 50%; width: 2.1rem; height: 2.1rem;
  background: linear-gradient(145deg, #FF8FB1, #FF5C8A); color: #3B0F2A; font-weight: 800;
  box-shadow: 0 3px 10px rgba(255, 92, 138, 0.35);
}

html[data-theme="bunny"] .brand-mark::after {
  content: ""; position: absolute; top: -8px; right: -10px; width: 22px; height: 15px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='-12 -8 24 16'><path d='M0 0L-10-6.5Q-12.5 0-10 6.5Z' fill='%23E8364F'/><path d='M0 0L10-6.5Q12.5 0 10 6.5Z' fill='%23E8364F'/><path d='M-2 0L-7 -3.4Q-8 0-7 3.4Z M2 0L7-3.4Q8 0 7 3.4Z' fill='%23FF8FB1' opacity='.65'/><circle r='2.6' fill='%23C81E3A'/></svg>") center / contain no-repeat; transform: rotate(18deg); pointer-events: none;
}

html[data-theme="bunny"] .brand { color: var(--ink); font-weight: 700; }

/* ---------- меню: сердечки ---------- */

html[data-theme="bunny"] .sidebar, html[data-theme="bunny"] .mobile-bar { background: var(--panel); border: var(--card-border); box-shadow: var(--shadow); backdrop-filter: none; -webkit-backdrop-filter: none; }

html[data-theme="bunny"] .sidebar { border-radius: 24px; }

html[data-theme="bunny"] .nav-label { color: var(--muted); font-weight: 700; }

html[data-theme="bunny"] .nav-label::before { content: "\2661"; margin-right: 0.35rem; color: var(--accent); }

html[data-theme="bunny"] .sidebar a { border-radius: 999px; padding: 0.5rem 0.8rem; }

html[data-theme="bunny"] .sidebar a:hover { background: var(--hover); text-decoration: none; }

html[data-theme="bunny"] .sidebar a.active { background: var(--accent-soft); color: var(--accent-text); font-weight: 700; }

html[data-theme="bunny"] .sidebar a.active::after { content: "\2665"; margin-left: auto; color: var(--bow); font-size: 0.95rem; }

html[data-theme="bunny"] .nav-children { border-left-color: var(--line); }

/* ---------- поверхности ---------- */

html[data-theme="bunny"] .panel, html[data-theme="bunny"] .apt-card, html[data-theme="bunny"] .stat-card, html[data-theme="bunny"] .pt-day, html[data-theme="bunny"] .att-row, html[data-theme="bunny"] .login-card, html[data-theme="bunny"] .settle-panel, html[data-theme="bunny"] .district-jump, html[data-theme="bunny"] table, html[data-theme="bunny"] .ts-scroll {
  backdrop-filter: none; -webkit-backdrop-filter: none;
}

html[data-theme="bunny"] .panel { border-radius: 22px; background: var(--panel); box-shadow: var(--shadow); }

html[data-theme="bunny"] .stat-card { border-radius: 18px; background: var(--panel); box-shadow: var(--shadow); }

html[data-theme="bunny"] .apt-card { border-radius: 18px; background: var(--panel); border: var(--card-border); }

html[data-theme="bunny"] .settle-apt { background: var(--soft); }

html[data-theme="bunny"] table { border-radius: 20px; background: var(--panel); }

html[data-theme="bunny"] .table-scroll { border-radius: 20px; }

html[data-theme="bunny"] th { background: var(--accent-soft); color: var(--ink); font-weight: 700; }

html[data-theme="bunny"] tbody tr:nth-child(even) > td, html[data-theme="bunny"] tbody tr:nth-child(even) > th { background-color: var(--zebra); }

html[data-theme="bunny"] tbody tr:hover > td { background-color: var(--hover); }

html[data-theme="bunny"] .sticky-first tbody tr:nth-child(even) td:first-child { background: var(--st-sticky-bg); }

html[data-theme="bunny"] .staff-table thead th { position: sticky; top: 0; z-index: 3; }

html[data-theme="bunny"] .ts-scroll { border-radius: 20px; background: var(--panel); }

html[data-theme="bunny"] .ts-grid tbody tr:nth-child(even) > td.ts-cellwrap { background-color: var(--zebra); }

html[data-theme="bunny"] .ts-grid tbody tr:nth-child(even) > .ts-name { background: var(--st-sticky-bg); }

html[data-theme="bunny"] .ts-grid thead th { background: var(--st-sticky-bg); }

html[data-theme="bunny"] .error, html[data-theme="bunny"] .ok { border-radius: 18px; }

html[data-theme="bunny"] .alert-pop, html[data-theme="bunny"] .checkout-dialog, html[data-theme="bunny"] .toast { border-radius: 22px; border: 2px solid var(--line); }

html[data-theme="bunny"] .toast .button-link { color: var(--accent-text); }

/* ---------- кнопки и поля ---------- */

html[data-theme="bunny"] button, html[data-theme="bunny"] .primary, html[data-theme="bunny"] a.primary, html[data-theme="bunny"] .button-link { border-radius: 999px; }

html[data-theme="bunny"] button.primary, html[data-theme="bunny"] a.primary, html[data-theme="bunny"] .button-link.primary {
  background: linear-gradient(135deg, #FF5C8A, #FF8FB1); border-color: #FF5C8A; color: var(--accent-ink); font-weight: 700;
  box-shadow: 0 6px 16px rgba(255, 92, 138, 0.28);
}

html[data-theme="bunny"] button.primary:hover, html[data-theme="bunny"] .button-link.primary:hover { background: linear-gradient(135deg, #FF6E97, #FFA0BE); color: var(--accent-ink); }

html[data-theme="bunny"] button.danger { background: var(--bow); border-color: var(--bow); color: #fff; }

html[data-theme="bunny"] button.danger-outline { border-radius: 999px; }

html[data-theme="bunny"] input, html[data-theme="bunny"] select, html[data-theme="bunny"] textarea { border-radius: 14px; border-color: var(--input-border); background: var(--input-bg); }

html[data-theme="bunny"] input:focus, html[data-theme="bunny"] select:focus, html[data-theme="bunny"] textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--focus-ring); }

html[data-theme="bunny"] input[type=checkbox], html[data-theme="bunny"] input[type=radio] { accent-color: #FF5C8A; }

/* элементы, которым круглая «таблетка» не подходит */

html[data-theme="bunny"] .ts-cell { border-radius: 9px; }

html[data-theme="bunny"] button.att-btn { border-radius: 18px; }

html[data-theme="bunny"] button.att-date { border-radius: 18px; }

html[data-theme="bunny"] button.emp-chip { border-radius: 14px; }

html[data-theme="bunny"] button.settle-head { border-radius: 18px; }

html[data-theme="bunny"] button.panel-toggle { border-radius: 0; }

html[data-theme="bunny"] button.seg-btn { border-radius: 14px; }

html[data-theme="bunny"] .stepper button, html[data-theme="bunny"] .month-switch button, html[data-theme="bunny"] .theme-toggle { border-radius: 50%; }

html[data-theme="bunny"] .fold-panel > summary::after { color: var(--accent-text); }

html[data-theme="bunny"] button.tab.active, html[data-theme="bunny"] button.ts-tab.active, html[data-theme="bunny"] button.att-date.on, html[data-theme="bunny"] button.chip-option.on, html[data-theme="bunny"] label.chip-option.on {
  background: linear-gradient(135deg, #FF5C8A, #FF8FB1); border-color: #FF5C8A; color: #3B0F2A;
}

html[data-theme="bunny"] button.att-date.on small { color: inherit; opacity: 0.8; }

/* ---------- Табель: вкладки и бейджи ---------- */

html[data-theme="bunny"] button.ts-tab { border-radius: 999px; background: var(--panel); border: var(--card-border); color: var(--ink); }

html[data-theme="bunny"] button.ts-tab.active .ts-tab-count { opacity: 0.9; }

html[data-theme="bunny"] .notif-badge { border-color: var(--st-solid); font-weight: 800; }

html[data-theme="bunny"] .notif-badge::after { content: none; }

html[data-theme="bunny"] .notif-badge.inline::after { content: none; }

/* ---------- Явка ---------- */

html[data-theme="bunny"] .att-row { border-radius: 20px; background: var(--panel); box-shadow: var(--shadow); }

html[data-theme="bunny"] button.att-all { border-radius: 999px; box-shadow: 0 6px 16px rgba(34, 163, 90, 0.25); }

html[data-theme="bunny"] .att-progress { border-radius: 999px; background: var(--accent-soft); }

html[data-theme="bunny"] .att-progress > span { background: linear-gradient(90deg, #FF8FB1, #22a35a); }

/* ---------- Заселение / жильё ---------- */

html[data-theme="bunny"] .district-jump { background: var(--panel); border-radius: 22px; }

html[data-theme="bunny"] button.jump-chip { background: var(--soft); }

html[data-theme="bunny"] button.settle-head.lvl-1 { background: var(--panel); box-shadow: var(--shadow); }

html[data-theme="bunny"] button.settle-head.lvl-1 .grow::before { content: "\2665"; color: var(--bow); margin-right: 0.45rem; font-size: 0.9em; }

html[data-theme="bunny"] .settle-panel { border-radius: 22px; background: var(--panel); }

html[data-theme="bunny"] .bed-slot { border-radius: 16px; }

html[data-theme="bunny"] .pick-bar { border-radius: 999px; }

html[data-theme="bunny"] .housing-district-title::before { content: "\2665"; color: var(--bow); }

html[data-theme="bunny"] .bed-dot { border-radius: 50%; }

/* ---------- вход ---------- */

html[data-theme="bunny"] .login-card { border-radius: 26px; background: var(--panel); border: 2px solid var(--line); box-shadow: var(--dialog-shadow); position: relative; }

html[data-theme="bunny"] .login-card::after {
  content: ""; position: absolute; top: -14px; left: 50%; width: 44px; height: 30px; margin-left: -22px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='16' viewBox='-12 -8 24 16'><path d='M0 0L-10-6.5Q-12.5 0-10 6.5Z' fill='%23E8364F'/><path d='M0 0L10-6.5Q12.5 0 10 6.5Z' fill='%23E8364F'/><path d='M-2 0L-7 -3.4Q-8 0-7 3.4Z M2 0L7-3.4Q8 0 7 3.4Z' fill='%23FF8FB1' opacity='.65'/><circle r='2.6' fill='%23C81E3A'/></svg>") center / contain no-repeat; pointer-events: none;
}

html[data-theme="bunny"] .login-card h1 { text-align: center; }

html[data-theme="bunny"] .login-card .lead { text-align: center; color: var(--muted); }

html[data-theme="bunny"] .login-form button.primary { width: 100%; min-height: 48px; }

/* ---------- зайчик-призрак при перетаскивании — тот же стиль ---------- */

html[data-theme="bunny"] .bunny-svg .b-bow path, html[data-theme="bunny"] .bunny-svg .b-bow circle { fill: #E8364F; stroke: none; }

html[data-theme="bunny"] .bunny-svg .b-ears ellipse, html[data-theme="bunny"] .bunny-svg .b-body, html[data-theme="bunny"] .bunny-svg .b-head { stroke-width: 1.4; }

html[data-theme="bunny"] .bunny-ghost .bunny-label { border-radius: 999px; }

@media (max-width: 860px) {
  html[data-theme="bunny"] .sidebar { border-radius: 24px; }
  html[data-theme="bunny"] .mobile-bar { border-radius: 0 0 22px 22px; }
  html[data-theme="bunny"] .settle-panel { border-radius: 22px 22px 0 0; }
}