:root {
    --bg: #0a0a0a;
    --bg-dark: #0a0a0a;
    --panel: #171717;
    --card-dark: #171717;
    --line: #2a2a2a;
    --orange: #ff793f;
    --chiong-orange: #ff793f;
    --muted: #a8a8a8;
    --text-white: #ffffff;
    --text-gray: #a8a8a8;
    --danger: #ff4d67;
    --success: #29d67d;
}

* {
    box-sizing: border-box;
}

body {
    background: var(--bg) !important;
    color: var(--text-white) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    letter-spacing: 0;
}

h1, h2, h3 {
    letter-spacing: 0 !important;
}

a {
    color: inherit;
}

input, textarea, select {
    border-radius: 8px !important;
    border: 1px solid var(--line) !important;
    background: #101010 !important;
    color: #fff !important;
    font: inherit !important;
}

input:focus, textarea:focus, select:focus {
    border-color: var(--orange) !important;
    outline: none !important;
}

button,
.btn,
.save,
.post-btn,
.mini-btn,
.btn-action,
.action,
.warning-actions button,
.match-box a,
.match-box button,
.ice-btn {
    min-height: 46px;
    border-radius: 8px !important;
    border: 1px solid var(--line) !important;
    font: inherit !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    cursor: pointer;
}

button,
.save,
.post-btn,
.primary,
.btn-yes,
.btn-dating,
.like,
.warning-actions .ok,
.match-box a {
    background: var(--orange) !important;
    color: #080808 !important;
    border-color: var(--orange) !important;
}

.btn,
.secondary,
.btn-no,
.btn-fz,
.no,
.dislike,
.warning-actions .no,
.match-box button,
.ice-btn {
    background: #202020 !important;
    color: #fff !important;
    border-color: var(--line) !important;
}

.btn.active,
.mode-nav a.active,
.bottom-nav a.active,
.nav-item.active {
    background: rgba(255, 121, 63, 0.14) !important;
    color: var(--orange) !important;
    border-color: rgba(255, 121, 63, 0.45) !important;
}

.no,
.dislike {
    color: var(--danger) !important;
}

.friend,
.btn-fz {
    color: var(--success) !important;
}

.container,
.panel,
.profile-card,
.post-input-box,
.post,
.place-card,
.info-box,
.comment,
.preview,
.match-box,
.warning-box,
.arena-cta,
.vibe-banner,
.card,
.person,
.tag,
.msg,
.live-tag,
.input-box {
    border-radius: 8px !important;
}

.bottom-nav {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 70px !important;
    padding: 0 8px !important;
    background: #080808 !important;
    border-top: 1px solid var(--line) !important;
    display: flex !important;
    justify-content: space-around !important;
    align-items: center !important;
    z-index: 20 !important;
}

.bottom-nav a,
.nav-item {
    min-width: 48px !important;
    height: 44px !important;
    padding: 0 8px !important;
    border-radius: 8px !important;
    display: grid !important;
    place-items: center !important;
    color: #777 !important;
    text-decoration: none !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.bottom-nav a.active,
.bottom-nav a[style*="chiong-orange"],
.bottom-nav a[style*="--orange"],
.nav-item.active,
.nav-item[style*="chiong-orange"] {
    color: var(--orange) !important;
    background: #151515 !important;
}

.mode-nav {
    gap: 8px !important;
    padding: 8px 10px !important;
}

.mode-nav a {
    min-height: 40px !important;
    border-radius: 8px !important;
    display: grid !important;
    place-items: center !important;
}

.actions {
    gap: 12px !important;
}

.actions button,
.btn-action {
    min-width: 86px !important;
    height: 52px !important;
    border-radius: 8px !important;
    padding: 0 14px !important;
}

.send-btn {
    width: auto !important;
    min-width: 72px !important;
    height: 46px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
}

.choice-btn {
    width: 112px !important;
    height: 56px !important;
    border-radius: 8px !important;
    background: #202020 !important;
    color: #fff !important;
    font-size: 15px !important;
}

.back-btn,
.back-link {
    background: transparent !important;
    border-color: transparent !important;
    border-radius: 8px !important;
    color: var(--orange) !important;
    text-decoration: none !important;
    font-weight: 800 !important;
    padding: 8px 10px !important;
}

@media (max-width: 430px) {
    .bottom-nav a,
    .nav-item {
        min-width: 44px !important;
        padding: 0 4px !important;
        font-size: 11px !important;
    }

    .actions button,
    .btn-action {
        min-width: 72px !important;
        padding: 0 10px !important;
        font-size: 12px !important;
    }
}
