/* ===== Сегменты-переключатели ===== */
.seg-toggle { display: flex; background: rgba(255,255,255,0.45); -webkit-backdrop-filter: blur(16px) saturate(180%); backdrop-filter: blur(16px) saturate(180%); border: 1px solid var(--glass-border); border-radius: 999px; padding: 0.3rem; }
.seg-btn { flex: 1; padding: 0.75rem 0.5rem; border: none; background: transparent; border-radius: 999px; font-size: 0.9rem; font-weight: 600; color: var(--text-2); cursor: pointer; transition: all 0.25s; }
.seg-btn.active { background: #0a84ff; color: white; box-shadow: 0 4px 14px rgba(10,132,255,0.35); }

/* ===== ЛЕНТА: крупно и читаемо ===== */
.feed-container { scroll-snap-type: y proximity; }
.feed-item { height: auto; min-height: calc(100vh - 210px); }
.feed-item.half { min-height: 45vh; justify-content: center; }

.feed-avatar { width: 52px; height: 52px; font-size: 1.15rem; }
.feed-meta h3 { font-size: 1.1rem; }
.feed-content h4 { font-size: 1.7rem; font-weight: 800; }
.feed-content p { font-size: 1.2rem; }

/* Крупная оценка */
.feed-grade-big { font-size: 6.5rem; font-weight: 800; line-height: 1; margin: 0.5rem 0; }
.gv-5 { color: #30d158; } .gv-4 { color: #0a84ff; } .gv-3 { color: #ff9f0a; } .gv-2 { color: #ff453a; } .gv-1 { color: #8e2323; }

/* Персональные карточки */
.personal-head { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 1rem; }
.personal-head svg { width: 28px; height: 28px; color: #0a84ff; }
.personal-head h4 { font-size: 1.35rem; font-weight: 800; }
.personal-text { font-size: 1.25rem; line-height: 1.5; }
.personal-days { font-size: 3.5rem; font-weight: 800; color: #0a84ff; }
.personal-days span { font-size: 1rem; color: var(--text-2); margin-left: 0.4rem; }
.personal-list { display: flex; flex-direction: column; gap: 0.5rem; }
.personal-row { display: flex; justify-content: space-between; padding: 0.8rem 1rem; background: rgba(255,255,255,0.55); border-radius: 12px; font-size: 1.05rem; }

/* Сердечки */
.like-btn.liked { color: #ff375f; border-color: #ff375f; }
.like-btn.liked svg { fill: #ff375f; }

/* Карандашик на оценке */
.grade-badge { position: relative; }
.edit-pencil { position: absolute; top: -4px; right: -4px; font-size: 0.7rem; background: white; color: #0a84ff; border-radius: 50%; width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 4px rgba(0,0,0,0.2); }

/* Большая галочка */
.big-check { display: flex !important; align-items: center; gap: 0.7rem; margin: 1rem 0; cursor: pointer; font-size: 1rem !important; font-weight: 600; color: var(--text) !important; }
.big-check input { display: none; }
.big-check-box { width: 24px; height: 24px; border: 2px solid var(--glass-border); background: rgba(255,255,255,0.5); border-radius: 7px; position: relative; flex-shrink: 0; transition: all 0.2s; }
.big-check input:checked + .big-check-box { background: #0a84ff; border-color: #0a84ff; }
.big-check input:checked + .big-check-box::after { content: '✓'; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: white; font-weight: 700; }

/* Просмотр оценок */
.student-grades-card { background: rgba(255,255,255,0.55); border-radius: 16px; padding: 1rem; margin-bottom: 0.7rem; }
.student-grades-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.6rem; }

/* Превью файла */
.file-preview { max-width: 100%; max-height: 180px; border-radius: 12px; margin: 0.5rem 0; display: block; object-fit: cover; }
.file-preview-name { padding: 0.6rem 0.9rem; background: rgba(255,255,255,0.5); border-radius: 10px; font-size: 0.9rem; margin: 0.5rem 0; display: inline-block; }

@media (prefers-color-scheme: dark) {
    .seg-toggle { background: rgba(255,255,255,0.1); }
    .personal-row, .student-grades-card, .file-preview-name { background: rgba(255,255,255,0.07); }
    .big-check-box { background: rgba(255,255,255,0.1); }
    .edit-pencil { background: #1c1c1e; }
}

/* Превью файла с кнопкой удаления */
.file-preview-wrap {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0.5rem 0;
}

.file-preview-wrap .file-preview { margin: 0; }

/* ===== Версия и меню ===== */
.version-badge {
    padding: 0.3rem 0.8rem;
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid var(--glass-border);
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--text-2);
    white-space: nowrap;
}

.header-menu {
    position: absolute;
    top: 100%;
    right: 12px;
    background: rgba(255, 255, 255, 0.8);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    backdrop-filter: blur(24px) saturate(180%);
    border: 1px solid var(--glass-border);
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    z-index: 200;
    min-width: 200px;
}

.header-menu-item {
    display: block;
    width: 100%;
    padding: 0.9rem 1.2rem;
    background: none;
    border: none;
    text-align: left;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    color: var(--text);
}

.header-menu-item:hover { background: rgba(10, 132, 255, 0.1); }
.header-menu-item.danger { color: #ff453a; }

.support-tg {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.9rem 1.4rem;
    background: #229ED9;
    color: white;
    border-radius: 14px;
    text-decoration: none;
    font-weight: 700;
    margin-top: 0.5rem;
}

.support-tg svg { width: 22px; height: 22px; }

/* ===== Редактор профиля ===== */
.edit-profile-btn {
    position: absolute;
    top: 12px;
    left: 12px;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: rgba(10, 132, 255, 0.12);
    color: #0a84ff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.edit-profile-btn svg { width: 17px; height: 17px; }

.color-swatches { display: flex; gap: 0.6rem; flex-wrap: wrap; }

.color-swatch {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 3px solid transparent;
    cursor: pointer;
    transition: transform 0.15s;
}

.color-swatch.active { border-color: var(--text); transform: scale(1.15); }

/* ===== Перетаскивание уроков ===== */
.drag-handle {
    cursor: grab;
    touch-action: none;
    color: var(--text-2);
    padding: 0.3rem;
}

.drag-handle svg { width: 18px; height: 18px; }

.drag-ghost {
    position: fixed;
    z-index: 2000;
    pointer-events: none;
    opacity: 0.9;
    transform: translate(-50%, -50%);
    width: 230px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.3);
}

.day-edit.drag-over { outline: 2px dashed #0a84ff; border-radius: 12px; }

/* ===== ТЁМНАЯ ТЕМА ===== */
@media (prefers-color-scheme: dark) {
    :root {
        --text: #f2f2f7;
        --text-2: rgba(235, 235, 245, 0.6);
        --glass-bg: rgba(28, 28, 30, 0.6);
        --glass-border: rgba(255, 255, 255, 0.12);
        --glass-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    }

    body { background: #0e1013; }
    body::before { background: #0d2b52; opacity: 0.3; }
    body::after { background: #3a1150; opacity: 0.3; }

    .glass, .glass-card, .auth-form, .app-header, .bottom-nav, .modal-content,
    .subject-card, .homework-card, .profile-card, .create-post, .feed-item,
    .day-column, .seg-toggle, .quarter-tabs, .role-selector, .header-menu {
        background: rgba(30, 30, 33, 0.7);
        border-color: rgba(255, 255, 255, 0.12);
    }

    .glass::before, .glass-card::before { background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0) 32%); }

    .auth-form input, .role-form input, .form-group input, .form-group select,
    .form-group textarea, .create-post textarea, .gselect-btn, .gselect-menu {
        background: rgba(255, 255, 255, 0.08);
        color: var(--text);
        border-color: rgba(255, 255, 255, 0.15);
    }

    .lesson-item, .personal-row, .student-grades-card, .my-post-item,
    .class-code-item, .day-column, .subject-checkbox, .file-preview-name {
        background: rgba(255, 255, 255, 0.07);
    }

    .action-btn, .btn-glass, .file-input-label, .subject-chip, .class-chip span,
    .feed-type-badge, .icon-btn, .version-badge {
        background: rgba(255, 255, 255, 0.1);
        color: var(--text);
        border-color: rgba(255, 255, 255, 0.15);
    }

    .role-btn.active, .quarter-tab.active { background: rgba(255, 255, 255, 0.16); color: var(--text); }
    .header-menu-item { color: var(--text); }
    .header-menu-item:hover { background: rgba(255, 255, 255, 0.08); }
    .edit-profile-btn { background: rgba(10, 132, 255, 0.25); }
    .big-check-box { background: rgba(255, 255, 255, 0.1); }
    .edit-pencil { background: #1c1c1e; }
}

/* ===== Размер иконок в карточках объявлений ===== */
.birthday-countdown svg {
    width: 18px;
    height: 18px;
    vertical-align: -3px;
}

/* ===== Карандаш справа ===== */
.edit-profile-btn {
    left: auto;
    right: 12px;
}

/* ===== Аватарки ===== */
.profile-avatar { overflow: hidden; }

.avatar-img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

.avatar-preview {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    margin-top: 0.5rem;
    display: block;
}

/* ===== Кружочки дней недели (ДЗ ученика) ===== */
.week-nav {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 1rem;
}

.day-circles {
    display: flex;
    gap: 0.35rem;
    flex: 1;
    justify-content: space-between;
    overflow-x: auto;
}

.day-circle {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    min-width: 38px;
    padding: 0.45rem 0.3rem;
    border-radius: 999px;
    border: 1px solid var(--glass-border);
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all 0.2s;
}

.day-circle.active {
    background: #0a84ff;
    border-color: #0a84ff;
    color: white;
    box-shadow: 0 4px 12px rgba(10, 132, 255, 0.35);
}

.day-circle-label { font-size: 0.62rem; font-weight: 700; }
.day-circle-num { font-size: 0.9rem; font-weight: 700; }

.week-arrow {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid var(--glass-border);
    background: rgba(255, 255, 255, 0.5);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
    color: var(--text);
}

/* ===== Кнопки перемещения уроков ===== */
.lesson-btns {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.btn-mini {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 50%;
    background: rgba(10, 132, 255, 0.12);
    color: #0a84ff;
    font-size: 0.85rem;
    cursor: pointer;
}

/* ===== Предосмотр аватарки ===== */
.avatar-full {
    width: 100%;
    border-radius: 20px;
    display: block;
}

/* ===== Тёмная тема для новых элементов ===== */
@media (prefers-color-scheme: dark) {
    .day-circle, .week-arrow {
        background: rgba(255, 255, 255, 0.1);
        border-color: rgba(255, 255, 255, 0.15);
        color: var(--text);
    }
    .day-circle.active { background: #0a84ff; color: white; }
    .btn-mini { background: rgba(10, 132, 255, 0.25); }
}

/* ===== Аватарки в ленте ===== */
.feed-avatar {
    overflow: hidden;
    flex-shrink: 0;
}

.feed-avatar-img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
}

/* ===== Админ панель ===== */
.admin-chart { width: 100%; height: 90px; display: block; }
.admin-chart-box { margin-top: 0.5rem; }
.admin-chart-label { font-size: 0.85rem; color: var(--text-2); margin-top: 0.3rem; }

.config-editor {
    width: 100%;
    min-height: 320px;
    font-family: 'Courier New', monospace;
    font-size: 0.8rem;
    white-space: pre;
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    padding: 1rem;
    margin-top: 0.75rem;
}

@media (prefers-color-scheme: dark) {
    .config-editor { background: rgba(255, 255, 255, 0.08); color: var(--text); }
}

/* ===== Онлайн-огонёк ===== */
.online-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    background: #30d158;
    border-radius: 50%;
    margin-left: 7px;
    box-shadow: 0 0 8px #30d158;
    vertical-align: 1px;
}

/* ===== Тултип на графиках ===== */
.admin-chart-box { position: relative; }

.chart-tip {
    position: absolute;
    top: -6px;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.78);
    color: white;
    font-size: 0.7rem;
    padding: 3px 8px;
    border-radius: 7px;
    pointer-events: none;
    white-space: nowrap;
    z-index: 10;
}

/* ===== СТРАХОВКА: показ активной вкладки ===== */
.view.active {
    display: block !important;
}

/* ===== Интро-видео ===== */
.intro-overlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    background: rgba(0, 0, 0, 0.92);
    display: flex;
    align-items: center;
    justify-content: center;
}

.intro-title {
    position: absolute;
    top: calc(24px + env(safe-area-inset-top, 0));
    left: 0;
    right: 0;
    text-align: center;
    color: white;
    font-size: 1.5rem;
    font-weight: 800;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.7);
    z-index: 2;
    padding: 0 1rem;
}

.intro-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ===== Статистика в админке ===== */
.stats-row { display: flex; gap: 0.6rem; margin-top: 0.7rem; }

.stat-card {
    flex: 1;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 14px;
    padding: 0.9rem 0.5rem;
    text-align: center;
}

.stat-num { font-size: 1.7rem; font-weight: 800; color: #0a84ff; }

@media (prefers-color-scheme: dark) {
    .stat-card { background: rgba(255, 255, 255, 0.08); }
}

/* ===== Кастомное уведомление ===== */
.app-notice {
    position: fixed;
    top: -140px;
    left: 12px;
    right: 12px;
    max-width: 480px;
    margin: 0 auto;
    z-index: 4000;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.9rem 1rem;
    background: rgba(255, 255, 255, 0.94);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 18px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
    transition: top 0.35s ease;
}

.app-notice.show { top: calc(12px + env(safe-area-inset-top, 0)); }
.app-notice.closing { top: -160px; }

.app-notice-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    flex-shrink: 0;
    object-fit: cover;
}

.app-notice-body { flex: 1; min-width: 0; }
.app-notice-title { font-size: 0.75rem; font-weight: 700; color: var(--text-2); }
.app-notice-text { font-size: 0.95rem; font-weight: 600; }
.app-notice-text a { color: #0a84ff; }

.app-notice-close {
    border: none;
    background: rgba(0, 0, 0, 0.08);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: pointer;
    flex-shrink: 0;
    font-size: 0.8rem;
}

@media (prefers-color-scheme: dark) {
    .app-notice { background: rgba(40, 40, 44, 0.94); border-color: rgba(255, 255, 255, 0.15); }
    .app-notice-close { background: rgba(255, 255, 255, 0.12); color: #fff; }
}

/* ===== Оценка "Н" ===== */
.grade-n { background: #8e8e93 !important; cursor: default; box-shadow: none; }
.gv-n { color: #8e8e93; }

/* ===== Колокольчик ===== */
.profile-card { position: relative; }

.bell-btn {
    position: absolute;
    top: 12px;
    right: 56px;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 159, 10, 0.15);
    color: #ff9f0a;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bell-btn svg { width: 17px; height: 17px; }

.bell-badge {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    background: #ff453a;
    color: white;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (prefers-color-scheme: dark) {
    .bell-btn { background: rgba(255, 159, 10, 0.25); }
}

/* ===== Пикер оценок ===== */
.grade-picker { display: flex; gap: 0.5rem; margin: 0.5rem 0; flex-wrap: wrap; }

.grade-pick {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: none;
    font-size: 1.4rem;
    font-weight: 800;
    color: white;
    cursor: pointer;
    opacity: 0.5;
    transition: all 0.15s;
}

.grade-pick.active { opacity: 1; transform: scale(1.12); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25); }

.gp-5 { background: #30d158; } .gp-4 { background: #0a84ff; } .gp-3 { background: #ff9f0a; }
.gp-2 { background: #ff453a; } .gp-n { background: #8e8e93; }

.quarter-picker { display: flex; gap: 0.4rem; }

.quarter-pick {
    padding: 0.4rem 1rem;
    border-radius: 999px;
    border: 1px solid var(--glass-border);
    background: rgba(255, 255, 255, 0.5);
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
}

.quarter-pick.active { background: #0a84ff; color: white; border-color: #0a84ff; }

/* ===== АКВАРИУМ в профиле ===== */
.aquarium { overflow: hidden; }

.aquarium > *:not(.aqua-water) { position: relative; z-index: 1; }

.aqua-water {
    position: absolute;
    left: -25%;
    right: -25%;
    top: 45%;
    bottom: -40%;
    background: linear-gradient(180deg, rgba(10, 132, 255, 0.28), rgba(10, 132, 255, 0.5));
    border-radius: 45% 45% 0 0 / 70px;
    transform: rotate(var(--tilt, 0deg));
    transition: transform 0.25s ease, top 0.25s ease;
    animation: aquaWave 7s ease-in-out infinite;
    pointer-events: none;
}

@keyframes aquaWave {
    0%, 100% { border-radius: 45% 45% 0 0 / 70px; }
    50% { border-radius: 50% 50% 0 0 / 95px; }
}

.aqua-fish { position: absolute; animation: swim 9s linear infinite; }
.aqua-fish .fish-svg { width: 30px; display: block; }
.f1 { top: 30%; }
.f2 { top: 55%; animation-duration: 13s; animation-delay: -5s; }
.f2 .fish-svg { width: 22px; }
.f3 { top: 75%; animation-duration: 16s; animation-delay: -9s; }
.f3 .fish-svg { width: 17px; }

@keyframes swim {
    0% { left: -15%; transform: scaleX(1); }
    49% { transform: scaleX(1); }
    50% { left: 105%; transform: scaleX(-1); }
    99% { transform: scaleX(-1); }
    100% { left: -15%; transform: scaleX(1); }
}

.aqua-bubble {
    position: absolute;
    bottom: 0;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    animation: bubble 5s linear infinite;
}

.b1 { left: 20%; } .b2 { left: 50%; animation-delay: -2s; } .b3 { left: 75%; animation-delay: -3.5s; }

@keyframes bubble {
    0% { transform: translateY(0); opacity: 0; }
    20% { opacity: 0.8; }
    100% { transform: translateY(-150px); opacity: 0; }
}

/* ===== АКВАРИУМ v2: рыбки лежат на дне ===== */
/* Плавный наклон воды (без transition — сглаживание делает JS) */
.aqua-water {
    transform: translateX(var(--shiftX, 0px)) rotate(var(--tilt, 0deg));
    transition: none;
}

/* Рыбки тоже плавно (через переменную --rock) */
.aqua-fish {
    transition: none;
    transform: rotate(var(--rock, 0deg));
}

.aqua-fish {
    animation: none;
    bottom: 5%;
    top: auto;
    transform: rotate(var(--rock, 0deg));
    transform-origin: bottom center;
    transition: transform 0.2s ease;
    animation: idleRock 3.5s ease-in-out infinite;
}

.f1 { left: 12%; }
.f1 .fish-svg { width: 30px; }
.f2 { left: 45%; animation-delay: -1.2s; }
.f2 .fish-svg { width: 24px; transform: scaleX(-1); }
.f3 { left: 74%; animation-delay: -2.1s; }
.f3 .fish-svg { width: 19px; }

@keyframes idleRock {
    0%, 100% { transform: rotate(calc(var(--rock, 0deg) - 3deg)); }
    50% { transform: rotate(calc(var(--rock, 0deg) + 3deg)); }
}

/* ===== АКВАРИУМ FINAL + КОЛОКОЛЬЧИК FIX ===== */
.profile-card { position: relative; }

.bell-btn {
    position: absolute !important;
    top: 12px !important;
    right: 56px !important;
    left: auto !important;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 159, 10, 0.15);
    color: #ff9f0a;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
}

.bell-btn svg { width: 17px; height: 17px; }

.bell-badge {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    background: #ff453a;
    color: white;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Рыбки лежат на дне видимой части карточки */
.aqua-fish {
    position: absolute;
    top: auto !important;
    animation: idleRock 3.5s ease-in-out infinite !important;
    transform-origin: bottom center;
}

.f1 { left: 12% !important; bottom: 44% !important; }
.f2 { left: 45% !important; bottom: 42% !important; }
.f3 { left: 74% !important; bottom: 45% !important; }

.aqua-fish .fish-svg { display: block; }
.f1 .fish-svg { width: 30px; }
.f2 .fish-svg { width: 24px; transform: scaleX(-1); }
.f3 .fish-svg { width: 19px; }

@keyframes idleRock {
    0%, 100% { transform: rotate(calc(var(--rock, 0deg) - 3deg)); }
    50% { transform: rotate(calc(var(--rock, 0deg) + 3deg)); }
}

/* Брызги при касании воды */
.aqua-splash {
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);
    pointer-events: none;
    z-index: 2;
    animation: splashUp 0.7s ease-out forwards;
}

@keyframes splashUp {
    0% { transform: translate(0, 0) scale(1); opacity: 0.9; }
    100% { transform: translate(var(--dx, 0px), -36px) scale(0.35); opacity: 0; }
}

/* ===== АКВАРИУМ FINAL v3 ===== */

/* Карандаш рядом с колокольчиком (справа) */
.edit-profile-btn {
    position: absolute !important;
    top: 12px !important;
    right: 56px !important;
    left: auto !important;
    z-index: 3;
}

.bell-btn {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    left: auto !important;
    z-index: 3;
}

/* Брызги НЕ в потоке документа (убирает дёргание) */
.aquarium > *:not(.aqua-water):not(.aqua-splash) {
    position: relative;
    z-index: 1;
}

.aqua-splash {
    position: absolute !important;
    pointer-events: none;
    z-index: 2;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.9);
    animation: splashUp 0.7s ease-out forwards;
}

/* Рыбки: нормальный размер, лежат на дне, не плавают */
.aqua-fish {
    position: absolute !important;
    top: auto !important;
    animation: idleRock 3.5s ease-in-out infinite !important;
    transform-origin: bottom center;
}

.f1 { left: 10% !important; bottom: 44% !important; }
.f2 { left: 44% !important; bottom: 42% !important; }
.f3 { left: 72% !important; bottom: 45% !important; }

.f1 .fish-svg { width: 46px !important; }
.f2 .fish-svg { width: 36px !important; transform: scaleX(-1); }
.f3 .fish-svg { width: 28px !important; }

.fish-svg {
    display: block;
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.25));
}

@keyframes idleRock {
    0%, 100% { transform: rotate(calc(var(--rock, 0deg) - 3deg)); }
    50% { transform: rotate(calc(var(--rock, 0deg) + 3deg)); }
}

@keyframes splashUp {
    0% { transform: translate(0, 0) scale(1); opacity: 0.9; }
    100% { transform: translate(var(--dx, 0px), -36px) scale(0.35); opacity: 0; }
}



/* ===== АКВАРИУМ v4: плавный, инвертированный, без дёрганий ===== */
.aquarium { overflow: hidden; pointer-events: auto; }

.aqua-water {
    pointer-events: none;
    transition: none;
    z-index: 0;
}

.aqua-fishes {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    height: 80px;
    z-index: 1;
    pointer-events: none;
    transform: rotate(var(--fish-tilt, 0deg));
    transform-origin: bottom center;
    transition: none;
}

.aqua-fish {
    position: absolute;
    bottom: 0;
    transform-origin: bottom center;
    animation: fishIdle 3.5s ease-in-out infinite;
    transition: none;
}

@keyframes fishIdle {
    0%, 100% { transform: rotate(-4deg); }
    50% { transform: rotate(4deg); }
}

.f1 { left: 10%; animation-delay: 0s; }
.f2 { left: 44%; animation-delay: -1.2s; }
.f3 { left: 72%; animation-delay: -2.1s; }

.f1 .fish-svg { width: 46px; }
.f2 .fish-svg { width: 36px; transform: scaleX(-1); }
.f3 .fish-svg { width: 28px; }

/* Кнопки карандаша и колокольчика всегда кликабельны */
.edit-profile-btn,
.bell-btn {
    pointer-events: auto !important;
    z-index: 5 !important;
}

/* Убираем индикатор угла (на всякий случай) */
.aqua-debug { display: none !important; }
