body {
    margin: 0;
    background: black;
    font-family: 'Press Start 2P', cursive;
    color: white;
}

/* Контейнер */
.container {
    max-width: 390px;
    margin: 0 auto;
    padding: 20px;
}

/* Title */
.title {
    text-align: center;
    font-size: 18px;
}

.title span {
    background: #eaff4f;
    color: black;
    padding: 1px 7px;
    margin-left: -26px;
    font-size: 10px;
    border-radius: 10px;
}

/* Duck */
.duck {
    width: 150px;
    display: block;
    margin: auto;
    image-rendering: pixelated;
}

/* Buttons */
.top-buttons {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 20px;
}

.btn {
    flex: 1;
    padding: 12px;
    font-size: 12px;
    font-family: 'Press Start 2P', cursive;
    border: none;
    cursor: pointer;
    box-shadow: 4px 4px 0px #222;
    border-radius: 10px;
    color: black;
}

/* Colors */
.news { background: #3d5aa8; }
.airdrop { background: #d63b34; }
.launchpool { background: #f3c34c; color: black; }

/* Card */
.card {
    border: 2px solid #333;
    padding: 15px;
    border-radius: 10px;
    background: #111;
}

.card-title {
    margin-bottom: 15px;
    font-size: 12px;
}

/* Items */
.item {
    display: flex;
    align-items: center;
    gap: 10px;
    border-top: 1px solid #333;
    padding: 12px 0;
}

.item:first-child {
    border-top: none;
}

.icon {
    font-size: 18px;
}

/* Bottom Nav */
.bottom-nav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    max-width: 390px;
    margin: 0 auto;
    background: black;
    display: flex;
    justify-content: space-around;
    padding: 10px 0;
    border-top: 1px solid #333;
}

.nav-icon {
    font-size: 20px;
}

/* Натиск кнопки (ефект) */
.btn:active {
    transform: translate(2px, 2px);
    box-shadow: none;
}

.news-card {
    border: 2px solid #333;
    padding: 15px;
    margin-bottom: 15px;
    background: #111;
    border-radius: 10px;
}

.news-card.critical { border-color: red; }
.news-card.important { border-color: gold; }
.news-card.info {border-color: #4CAF50; }

.tag {
    font-size: 8px;
    padding: 4px 8px;
    margin-bottom: 8px;
    display: inline-block;
}

.card-title {
    font-size: 12px;
    margin: 10px 0;
}

.source {
    font-size: 8px;
    color: #aaa;
}

.link {
    font-size: 8px;
    color: #5da9ff;
    padding: 3px;
    border-radius: 5px;
    
}

.filters {
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
}

.filter-btn {
    flex: 1;
    padding: 8px;
    font-size: 8px;
    border: none;
    cursor: pointer;
    border-radius: 8px;
    background: #222;
    color: white;
}

.filter-btn.active {
    background: #5da9ff;
}

.filter-wrapper {
    position: relative;
    margin-bottom: 15px;
}

.filter-main {
    width: 100%;
    padding: 10px;
    background: #222;
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    font-family: 'Press Start 2P', cursive;
}

.filter-menu {
    position: absolute;
    top: 45px;
    width: 100%;
    background: #111;
    border: 1px solid #333;
    border-radius: 10px;
    overflow: hidden;
}

.filter-menu div {
    padding: 10px;
    border-bottom: 1px solid #333;
    cursor: pointer;
}

.filter-menu div:hover {
    background: #333;
}

.summary {
    font-size: 9px;
    color: #ccc;
    margin: 5px 0;
}

/* база */
.btn {
    border: 2px solid transparent;
    transition: 0.2s;
}

/* 🔵 News */
.btn.news.active {
    border-color: #5da9ff;
    box-shadow: 0 0 10px #5da9ff, 0 0 20px #5da9ff;
}

/* 🔴 Airdrop */
.btn.airdrop.active {
    border-color: #ff4d4d;
    box-shadow: 0 0 10px #ff4d4d, 0 0 20px #ff4d4d;
}

.btn:hover {
    transform: translateY(-2px);
}

.refresh-btn {
    width: 100%;
    padding: 10px;
    margin-bottom: 10px;
    background: #222;
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
        font-family: 'Press Start 2P', cursive;
}

.refresh-btn:active {
    transform: scale(0.97);
}

/* Стилі для карток Launchpool */
.launchpool-card {
    border-left: 4px solid #eaff4f !important;
}

.launchpool-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.launchpool-tag {
    margin: 0 !important;
    background: #eaff4f !important;
    color: black !important;
}

.status-active { color: #4CAF50; }
.status-finished { color: #ff4f4f; }

.launchpool-info {
    color: white;
    font-size: 10px;
    margin: 10px 0;
}

.info-row {
    margin-top: 5px;
}

.accent-yellow { color: #ffcc00; }
.accent-green { color: #4CAF50; }

.requirements-box {
    margin-top: 10px;
    padding: 10px;
    background: #111;
    border-radius: 5px;
}

.requirements-title {
    color: #5da9ff;
    margin-bottom: 5px;
    font-size: 9px;
    font-weight: bold;
}

.requirement-item {
    margin-bottom: 3px;
    font-size: 9px;
}

.btn-participate {
    margin-top: 10px;
    display: block;
    text-align: center;
    padding: 3px;
    border-radius: 5px;
}

/* 💎 Gems */
.btn.gems { background: #ffcc00; color:black; }

.btn.gems.active {
    border-color: #ffdf61;
    box-shadow: 0 0 10px #ffdf61, 0 0 20px #ffdf61;
}

/* ⚖️ Arbitrage */
.btn.arbitrage { background: #00e5ff; color: black; }

.btn.arbitrage.active {
    border-color: #00e5ff;
    box-shadow: 0 0 10px #00e5ff, 0 0 20px #00e5ff;
}

.arbitrage-card {
    border-left: 4px solid #00e5ff !important;
}

.exchange-row {
    display: flex;
    justify-content: space-between;
    margin: 5px 0;
    font-size: 10px;
}

.btn.whales { background: #0088cc; color: white; } /* Колір Telegram */

.whales-card {
    border-left: 4px solid #0088cc !important;
    font-size: 11px !important;
    line-height: 1.4;
}

.whale-source {
    font-weight: bold;
    color: #0088cc;
    margin-bottom: 5px;
    display: block;
}

/* Всі 6 категорій з кольоровими рамками */
.news-card.critical      { border-color: #ff4f4f; }   /* червоний */
.news-card.regulation    { border-color: #ff9800; }   /* помаранчевий */
.news-card.institutional { border-color: #9c27b0; }   /* фіолетовий */
.news-card.listing       { border-color: #2196F3; }   /* синій */
.news-card.important     { border-color: gold; }       /* золотий */
.news-card.info          { border-color: #4CAF50; }   /* зелений */