@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800;900&family=Nunito+Sans:wght@400;500;600;700;800;900&display=swap');
/* Path: assets/css/nita-theme.css
   Nita-inspired pastel app UI for Abqary Live.
   Brand, PHP behavior, database operations, gifts, WebRTC and TURN remain owned by existing files. */

body.app-nita {
    --bg: #f2fff9;
    --surface: #ffffff;
    --surface-2: #e7faf3;
    --text: #202833;
    --muted: #72808a;
    --line: rgba(52, 88, 80, .13);
    --purple: #7564eb;
    --pink: #ff83b8;
    --gold: #ffc95a;
    --mint: #42cba8;
    --app-glass: rgba(255, 255, 255, .94);
    --app-card: #ffffff;
    --app-card-border: rgba(50, 95, 81, .12);
    --app-elevated: #f9fffc;
    --app-muted: #71808a;
    color: #202833;
    background: #f3fff9;
    font-family: "Nunito Sans", "Cairo", Tahoma, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
body.app-nita *, body.app-nita *::before, body.app-nita *::after { box-sizing: border-box; }
body.app-nita a { color: inherit; text-decoration: none; text-underline-offset: .15em; }
body.app-nita main { min-height: 68vh; }
body.app-nita .wrap { width: min(1120px, calc(100% - 36px)); }
body.app-nita :where(input, select, textarea) {
    color: #202833;
    background: #fff;
    border: 1px solid #dcebe5;
    border-radius: 15px;
    box-shadow: inset 0 1px 1px rgba(33, 65, 54, .025);
}
body.app-nita :where(input, select, textarea)::placeholder { color: #9aa6a8; }
body.app-nita :where(input, select, textarea):focus {
    border-color: #65d6b8;
    outline: none;
    box-shadow: 0 0 0 3px rgba(66, 203, 168, .18);
}
body.app-nita .flash { border-radius: 17px; border-color: #dbeae4; background: #fff; color: #303a43; box-shadow: 0 6px 22px rgba(69, 105, 92, .06); }
body.app-nita .flash-success { background: #e8fff4; color: #176e55; border-color: #b3ead4; }
body.app-nita .flash-warning { background: #fff8df; color: #86620a; border-color: #f5df9a; }
body.app-nita .flash-error, body.app-nita .form-errors { background: #fff0f4; color: #9c3155; border-color: #ffc4d7; }

/* App top bar */
body.app-nita .site-header {
    position: sticky; top: 0; z-index: 50;
    min-height: 72px; height: auto;
    background: rgba(255, 255, 255, .94);
    border-bottom: 1px solid rgba(48, 88, 73, .09);
    box-shadow: 0 6px 24px rgba(45, 96, 75, .055);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
}
body.app-nita .header-inner { min-height: 72px; gap: clamp(10px, 1.4vw, 22px); }
body.app-nita .brand { gap: 9px; }
body.app-nita .brand-mark {
    border-radius: 16px; color: #25312b;
    background: linear-gradient(135deg, #ffe47d 0%, #ffa4c9 52%, #8be9d1 100%);
    box-shadow: 0 6px 16px rgba(91, 208, 177, .2);
}
body.app-nita .brand-copy strong { color: #26312d; font-weight: 900; letter-spacing: -.3px; }
body.app-nita .brand-copy strong b { color: #40b998; }
body.app-nita .brand-copy small { color: #899797; }
body.app-nita .main-nav { gap: clamp(8px, 1.1vw, 17px); }
body.app-nita .nav-link { min-height: 39px; color: #66757b; font-size: 12px; font-weight: 800; text-decoration: none !important; }
body.app-nita .nav-link:hover, body.app-nita .nav-link:focus-visible { color: #20a987; }
body.app-nita .nav-link[aria-current="page"] { color: #169b7a; }
body.app-nita .nav-badge { background: #ff719f; color: #fff; }
body.app-nita .header-actions { gap: 6px; }
body.app-nita .user-chip, body.app-nita .coin-chip, body.app-nita .sound-settings > summary {
    color: #37433f; border: 1px solid #e4eee9; background: #f8fffc; border-radius: 13px;
}
body.app-nita .user-chip { padding: 4px 9px 4px 5px; }
body.app-nita .coin-chip { min-height: 37px; padding-inline: 10px; color: #8a6607; background: #fff8df; border-color: #f6e8b7; }
body.app-nita .sound-settings > summary { padding: 8px 10px; }
body.app-nita .sound-settings-popover { color: #27332f; background: #fff; border: 1px solid #e2eee8; border-radius: 18px; box-shadow: 0 22px 60px rgba(35, 70, 56, .17); }
body.app-nita .sound-settings-popover p, body.app-nita .sound-settings-status { color: #74827e; }
body.app-nita .sound-settings-popover :where(input, button) { max-width: 100%; }
body.app-nita .pwa-install-button:not([hidden]) { white-space: nowrap; }

/* Friendly pill buttons, pastel accents */
body.app-nita .button {
    min-height: 42px; border-radius: 999px; padding: 10px 17px;
    font-weight: 900; border-width: 1px; box-shadow: none;
}
body.app-nita .button-primary {
    color: #28332e;
    background: linear-gradient(110deg, #ffe27a, #ffc977 55%, #ffa5c7);
    border-color: transparent;
    box-shadow: 0 6px 15px rgba(249, 189, 94, .18);
}
body.app-nita .button-primary:hover { box-shadow: 0 9px 20px rgba(249, 189, 94, .25); filter: saturate(1.04); }
body.app-nita .button-outline { color: #49665d; background: #fff; border-color: #dbece4; }
body.app-nita .button-outline:hover { background: #f0fff8; border-color: #a8e7d2; }
body.app-nita .button-text { color: #628078; }
body.app-nita .button-glass { color: #344b42; background: rgba(255,255,255,.75); border-color: #d8eee5; }
body.app-nita .button-light { color: #25332e; background: #fff; }
body.app-nita .button-small { min-height: 34px; padding: 7px 12px; }
body.app-nita :where(.room-card, .gift-card, .svip-card, .profile-card, .panel, .auth-panel, .admin-panel, .admin-stat-card, .admin-shortcuts > a, .message-card, .notification-card, .wallet-card, .settings-card, .voice-room-card, .home-ranking-panel, .home-gifts-panel) {
    color: #25312e; background: #fff; border-color: #e0eee7; border-radius: 20px;
    box-shadow: 0 8px 24px rgba(58, 100, 83, .065);
}
body.app-nita :where(.room-card, .gift-card, .svip-card, .admin-stat-card, .admin-shortcuts > a):hover {
    transform: translateY(-2px); border-color: #a8e7d2; box-shadow: 0 12px 28px rgba(58, 100, 83, .105);
}
body.app-nita :where(.section-heading h2, .panel-heading h2) { color: #26342e; letter-spacing: -.35px; }
body.app-nita :where(.section-heading p, .panel-heading p) { color: #7b8984; }
body.app-nita .section-kicker { color: #22a887; }
body.app-nita .text-link { color: #199f7d; }
body.app-nita .category-tag { color: #348e77; background: #e8fbf4; border-color: #c9f0e2; border-radius: 999px; }
body.app-nita .empty-state { color: #34433d; background: #fff; border-color: #d5ede2; box-shadow: 0 8px 24px rgba(58, 100, 83, .05); }
body.app-nita .empty-state p { color: #82908a; }
body.app-nita .setup-notice { color: #34433d; background: #fff; border-color: #b9e7d6; }
body.app-nita .setup-notice p { color: #74847c; }
body.app-nita .notice-icon { color: #1fa883; background: #e5faf2; }
body.app-nita .site-footer { color: #677771; background: #f4fff9; border-top: 1px solid #e1efe8; }
body.app-nita .footer-copy, body.app-nita .footer-inner > p { color: #8b9993; }

/* Nita-like discovery home */
body.app-nita.app-home main { display: flex; flex-direction: column; padding-top: 12px; }
.nita-home-hero {
    position: relative; isolation: isolate; overflow: hidden;
    display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(220px, .75fr);
    align-items: center; gap: 22px; min-height: 215px; padding: 23px 30px;
    border: 1px solid #d7f1e6; border-radius: 28px;
    background: linear-gradient(112deg, #d4fff0 0%, #edfff6 46%, #fff4c9 100%);
    box-shadow: 0 12px 32px rgba(76, 173, 139, .08);
}
.nita-home-hero::before, .nita-home-hero::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.nita-home-hero::before { width: 190px; height: 190px; right: -44px; top: -83px; background: rgba(255,255,255,.42); }
.nita-home-hero::after { width: 130px; height: 130px; left: 37%; bottom: -94px; background: rgba(255, 201, 90, .18); }
.nita-home-hero-copy { min-width: 0; position: relative; z-index: 2; }
.nita-eyebrow { display: inline-flex; align-items: center; gap: 7px; padding: 5px 10px; border-radius: 999px; color: #1d8e70; background: rgba(255,255,255,.75); border: 1px solid rgba(95, 200, 161, .2); font-size: 10px; font-weight: 900; }
.nita-eyebrow i { width: 7px; height: 7px; border-radius: 50%; background: #3acba3; box-shadow: 0 0 0 4px rgba(58,203,163,.14); }
.nita-home-hero h1 { margin: 10px 0 5px; max-width: 690px; color: #26322e; font-size: clamp(23px, 3vw, 34px); font-weight: 1000; line-height: 1.35; letter-spacing: -.7px; }
.nita-home-hero h1 span { color: #f16b9e; }
.nita-home-hero p { max-width: 640px; margin: 0; color: #607b70; font-size: 12px; line-height: 1.9; }
.nita-home-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 13px; }
.nita-home-actions .button { min-height: 38px; padding-inline: 15px; font-size: 11px; }
.nita-hero-art { min-height: 160px; position: relative; display: grid; place-items: center; }
.nita-art-disc { width: 132px; height: 132px; display: grid; place-items: center; border-radius: 42% 58% 55% 45%; background: linear-gradient(135deg, #fff4a6 0%, #ffc4dc 55%, #b9f6e4 100%); border: 7px solid rgba(255,255,255,.75); box-shadow: 0 14px 25px rgba(109,185,157,.2); transform: rotate(-8deg); }
.nita-art-disc span { display: grid; place-items: center; width: 71px; height: 71px; border-radius: 23px; background: linear-gradient(145deg, #8a76f5, #ff85b3); color: white; font-size: 43px; box-shadow: 0 8px 18px rgba(132, 103, 225, .23); transform: rotate(8deg); }
.nita-art-orbit { position: absolute; border: 1px dashed rgba(86, 181, 149, .5); border-radius: 50%; }
.nita-art-orbit-one { width: 185px; height: 95px; transform: rotate(-24deg); }
.nita-art-orbit-two { width: 165px; height: 130px; transform: rotate(33deg); border-color: rgba(245, 163, 189, .55); }
.nita-art-star { position: absolute; color: #efa3c5; font-size: 28px; text-shadow: 0 4px 6px rgba(220,120,158,.12); }
.nita-art-star-one { top: 10px; right: 20px; color: #ffd052; }
.nita-art-star-two { bottom: 8px; left: 19px; color: #62cdb1; font-size: 34px; }
.nita-art-bubble { position: absolute; display: grid; place-items: center; width: 43px; height: 43px; background: #fff; border: 3px solid rgba(255,255,255,.75); border-radius: 16px; box-shadow: 0 6px 16px rgba(77,145,119,.13); font-size: 20px; }
.nita-art-bubble-one { top: 0; left: 25px; transform: rotate(-12deg); }
.nita-art-bubble-two { bottom: 6px; right: 25px; transform: rotate(12deg); }
.nita-explore { padding-top: 22px; }
.nita-feed-heading { display: flex; align-items: end; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.nita-kicker { display: block; margin-bottom: 2px; color: #24ad89; font-size: 9px; font-weight: 1000; letter-spacing: .7px; }
.nita-feed-heading h2 { margin: 0; color: #26342e; font-size: 22px; font-weight: 1000; line-height: 1.5; letter-spacing: -.4px; }
.nita-feed-heading p { margin: 1px 0 0; color: #7c8b84; font-size: 11px; }
.nita-more-link { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; color: #239e7d; font-size: 11px; font-weight: 900; }
.nita-more-link span { font-size: 16px; }
.nita-filter-row { display: flex; align-items: center; gap: 8px; margin: 13px 0 16px; overflow-x: auto; padding: 2px 1px 6px; scrollbar-width: none; }
.nita-filter-row::-webkit-scrollbar { display: none; }
.nita-filter { flex: 0 0 auto; min-height: 34px; padding: 6px 15px; border: 1px solid #dcece5; border-radius: 999px; background: #fff; color: #74827b; font-size: 11px; font-weight: 900; cursor: pointer; transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease; }
.nita-filter:hover { transform: translateY(-1px); border-color: #a8e5d0; }
.nita-filter.is-active { color: #203c32; border-color: transparent; background: linear-gradient(100deg, #b4f3df, #e2ffb9); box-shadow: 0 4px 10px rgba(90, 198, 158, .11); }
.nita-room-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.nita-room-item { display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: 14px; align-items: stretch; min-width: 0; min-height: 145px; padding: 10px; border: 1px solid #e0eee7; border-radius: 21px; background: #fff; box-shadow: 0 7px 20px rgba(58, 100, 83, .055); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.nita-room-item:hover { transform: translateY(-2px); border-color: #b7e8d6; box-shadow: 0 12px 24px rgba(58, 100, 83, .10); }
.nita-room-item[hidden] { display: none !important; }
.nita-room-cover { position: relative; min-height: 123px; align-self: stretch; display: grid; place-items: center; overflow: hidden; border-radius: 15px; background: radial-gradient(circle at 78% 19%, rgba(255,255,255,.72), transparent 28%), linear-gradient(140deg, color-mix(in srgb, var(--nita-cover) 60%, white), var(--nita-cover)); }
.nita-room-cover::before, .nita-room-cover::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid rgba(255,255,255,.57); }
.nita-room-cover::before { width: 92px; height: 92px; right: -28px; top: -24px; box-shadow: 0 0 0 12px rgba(255,255,255,.16); }
.nita-room-cover::after { width: 73px; height: 73px; left: -28px; bottom: -27px; border-color: rgba(255,255,255,.4); }
.nita-room-art-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 61px; height: 61px; border-radius: 22px; background: rgba(255,255,255,.72); color: #6d65d4; box-shadow: 0 10px 22px rgba(78, 95, 104, .12); font-size: 35px; transform: rotate(-7deg); }
.nita-room-live { position: absolute; z-index: 2; top: 7px; right: 7px; display: inline-flex; align-items: center; gap: 4px; padding: 3px 7px; border-radius: 999px; color: #296d59; background: rgba(255,255,255,.83); font-size: 8px; font-weight: 900; }
.nita-room-live i { width: 5px; height: 5px; border-radius: 50%; background: #3fcca6; box-shadow: 0 0 0 3px rgba(63,204,166,.12); }
.nita-room-copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 2px 0; }
.nita-room-topline { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.nita-room-category { display: inline-flex; max-width: 75%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 3px 8px; border-radius: 999px; color: #579584; background: #edfbf5; font-size: 9px; font-weight: 900; }
.nita-room-open { color: #97a8a0; font-size: 15px; }
.nita-room-copy h3 { margin: 5px 0 2px; overflow-wrap: anywhere; color: #28352f; font-size: 14px; font-weight: 1000; line-height: 1.5; }
.nita-room-copy p { display: -webkit-box; margin: 0; overflow: hidden; color: #7f8b85; font-size: 10px; line-height: 1.7; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.nita-room-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 9px; padding-top: 8px; border-top: 1px solid #eef4f0; }
.nita-host { display: flex; align-items: center; gap: 6px; min-width: 0; color: #8b9891; font-size: 9px; }
.nita-host > span:last-child { min-width: 0; }
.nita-host strong { display: block; max-width: 94px; overflow: hidden; color: #596c63; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; }
.nita-host-avatar { display: grid; place-items: center; width: 26px; height: 26px; flex: 0 0 26px; border-radius: 10px; color: #fff; background: linear-gradient(145deg, #78d9c0, #8e80f1); font-weight: 1000; font-size: 11px; }
.nita-room-members { display: inline-flex; align-items: center; gap: 4px; flex-shrink: 0; color: #789087; font-size: 9px; white-space: nowrap; }
.nita-room-members span { color: #42b899; }
.nita-filter-empty { padding: 22px; border-radius: 16px; background: #fff; border: 1px dashed #cfe9dd; color: #71867b; text-align: center; }
.nita-stats-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; padding-top: 24px; }
.nita-stat-card { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px 17px; border: 1px solid #e0eee7; border-radius: 18px; background: #fff; box-shadow: 0 6px 18px rgba(58,100,83,.035); }
.nita-stat-card > span { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; border-radius: 14px; font-size: 20px; }
.nita-stat-mint > span { color: #1f9878; background: #dcf9ef; }
.nita-stat-yellow > span { color: #a97b13; background: #fff1bd; }
.nita-stat-pink > span { color: #ce5186; background: #ffe4ef; }
.nita-stat-card strong, .nita-stat-card small { display: block; }
.nita-stat-card strong { color: #2b3932; font-size: 20px; font-weight: 1000; line-height: 1.3; }
.nita-stat-card small { color: #849189; font-size: 9px; }
.nita-shortcuts-section { padding-top: 32px; }
body.app-nita .home-feature-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
body.app-nita .home-feature-card { min-width: 0; padding: 17px; border-radius: 19px; border: 1px solid #e0eee7; background: #fff; box-shadow: 0 7px 19px rgba(58,100,83,.045); }
body.app-nita .home-feature-card::before { opacity: .9; }
body.app-nita .home-feature-card h3 { color: #2d3934; font-size: 14px; }
body.app-nita .home-feature-card p { color: #7a8982; font-size: 10px; }
body.app-nita .home-feature-tag { color: #7d9388; }
body.app-nita .home-feature-icon { border-radius: 16px; }
body.app-nita .feature-link { color: #21a783; }
body.app-nita .home-social-grid { padding-top: 24px; }
body.app-nita .home-ranking-panel, body.app-nita .home-gifts-panel { padding: 21px; border: 1px solid #e0eee7; border-radius: 22px; }
body.app-nita .home-leader-row { border-bottom-color: #edf4f0; }
body.app-nita .home-leader-row:hover { background: #f4fff9; }
body.app-nita .home-leader-name strong { color: #34443b; }
body.app-nita .home-leader-name small { color: #8a9890; }
body.app-nita .leader-coins { color: #a87b12; }
body.app-nita .home-gift-item { background: #f6fff9; border-color: #e1f2e9; border-radius: 17px; }
body.app-nita .home-gift-art { border-radius: 14px; background: #fff0c7; }
body.app-nita .gift-panel-cta { color: #159e7b; }
.nita-agent-cta, .nita-bottom-cta { display: flex; align-items: center; gap: 17px; margin-top: 19px; margin-bottom: 19px; padding: 21px 23px; border: 1px solid #d9eee5; border-radius: 22px; background: linear-gradient(110deg, #e1fff2, #fff3cb 72%, #ffe6f1); }
.nita-agent-icon { display: grid; place-items: center; width: 52px; height: 52px; flex: 0 0 52px; border-radius: 18px; background: #fff; color: #d9a42b; font-size: 25px; box-shadow: 0 6px 16px rgba(76,145,113,.1); }
.nita-agent-cta > div, .nita-bottom-cta > div { flex: 1; min-width: 0; }
.nita-agent-cta h2, .nita-bottom-cta h2 { margin: 1px 0 3px; color: #2b3932; font-size: 19px; font-weight: 1000; }
.nita-agent-cta p, .nita-bottom-cta p { margin: 0; color: #73887e; font-size: 11px; }
.nita-bottom-cta { margin-bottom: 34px; }

/* Other content pages */
body.app-nita .page-hero { color: #293832; border-bottom-color: #deeee6; background: linear-gradient(120deg, #d9fff1, #fff7d2 75%, #ffe9f2); }
body.app-nita .page-hero h1 { color: #26342e; }
body.app-nita .page-hero h1 span { color: #e972a6; background: none; -webkit-text-fill-color: initial; }
body.app-nita .page-hero p { color: #70867a; }
body.app-nita .create-room-panel, body.app-nita .room-info-panel, body.app-nita .room-detail-main, body.app-nita .auth-panel { background: #fff; border: 1px solid #e0eee7; box-shadow: 0 9px 25px rgba(58,100,83,.06); color: #25352d; }
body.app-nita .create-room-form label, body.app-nita .form-stack label { color: #52685c; }
body.app-nita .create-room-form input, body.app-nita .create-room-form textarea, body.app-nita .create-room-form select, body.app-nita .form-stack input { background: #fbfffd; border-color: #dcebe4; color: #25352d; }
body.app-nita .create-room-form select option { background: #fff; color: #26342e; }
body.app-nita .room-detail-description { color: #71827a; }
body.app-nita .room-info-panel h3, body.app-nita .room-info-panel .info-row strong { color: #2c3932; }
body.app-nita .info-row { border-bottom-color: #eaf2ed; color: #7e8d85; }
body.app-nita .feature-coming { background: #ecfbf4; }
body.app-nita .feature-coming p { color: #75877d; }
body.app-nita .auth-aside h1, body.app-nita .auth-panel-heading h2 { color: #25342d; }
body.app-nita .auth-aside > p, body.app-nita .auth-panel-heading p, body.app-nita .auth-switch { color: #7b8a83; }
body.app-nita .auth-feature strong { color: #36483e; }
body.app-nita .auth-feature small { color: #85938a; }
body.app-nita .auth-feature > span { color: #1b9d7d; background: #e4faf1; }
body.app-nita .auth-quote { border-color: #deeee6; background: #f7fffb; }
body.app-nita .auth-quote p { color: #66786e; }
body.app-nita .auth-switch a { color: #149d7b; }
body.app-nita .profile-card { color: #273730; background: #fff; border-color: #e0eee7; }
body.app-nita .profile-main h2 { color: #293a31; }
body.app-nita .profile-main p, body.app-nita .profile-stats span { color: #819087; }
body.app-nita .owned-room-list { border-color: #dfede6; }
body.app-nita .owned-room-row { border-bottom-color: #e9f2ec; }
body.app-nita .owned-room-row:hover { background: #f3fff9; }
body.app-nita .owned-room-text strong { color: #34443b; }
body.app-nita .owned-room-text small { color: #829087; }
body.app-nita .voice-lobby-hero { border-color: #d7eee5; border-radius: 25px; background: linear-gradient(120deg, #d7fff1, #fff6d0 74%, #ffe8f2); color: #293832; box-shadow: 0 10px 24px rgba(60,125,96,.06); }
body.app-nita .voice-lobby-hero h1, body.app-nita .voice-lobby-toolbar h2 { color: #27372f; }
body.app-nita .voice-lobby-hero p, body.app-nita .voice-lobby-toolbar p { color: #73857a; }
body.app-nita .voice-lobby-note { color: #347b66; background: rgba(255,255,255,.75); border-color: #cbeee0; }
body.app-nita .voice-room-card { background: #fff; border-color: #e0eee7; }
body.app-nita .voice-room-card-body h3 { color: #2b3932; }
body.app-nita .voice-room-card-body p, body.app-nita .voice-room-card-meta { color: #7e8c84; }
body.app-nita .voice-room-card-art { border-radius: 18px 18px 0 0; }
body.app-nita .voice-room-card .button-outline { background: #fff; }
body.app-nita .voice-lobby-limit { color: #75867d; background: #fff; border-color: #deeee6; }
body.app-nita .settings-card, body.app-nita .wallet-card, body.app-nita .message-card, body.app-nita .notification-card { background: #fff; color: #27362f; border-color: #e0eee7; }
body.app-nita .message-card p, body.app-nita .notification-card p { color: #708178; }
body.app-nita .message-card:hover, body.app-nita .notification-card:hover { background: #f6fff9; }
body.app-nita .gift-card { color: #2b3932; background: #fff; border-color: #e0eee7; }
body.app-nita .svip-card { color: #2b3932; background: #fff; border-color: #e0eee7; }
body.app-nita .svip-card p, body.app-nita .gift-card p { color: #7a8a81; }

/* Administration also becomes light and friendly, not the social dark theme */
body.app-nita.app-admin .admin-page { color: #25342d; }
body.app-nita.app-admin .admin-page :where(h1,h2,h3,h4,label,strong) { color: #293a32; }
body.app-nita.app-admin .admin-page :where(p,small,.admin-muted,.muted) { color: #728279; }
body.app-nita.app-admin .admin-title-row h1 { color: #293a32; }
body.app-nita.app-admin .admin-status, body.app-nita.app-admin .admin-count { background: #e7fbf2; border-color: #d0f0e1; color: #248666; }
body.app-nita.app-admin .admin-stat-card, body.app-nita.app-admin .admin-panel, body.app-nita.app-admin .admin-shortcuts > a, body.app-nita.app-admin .admin-empty { color: #2b3932; background: #fff; border: 1px solid #deeee6; box-shadow: 0 7px 22px rgba(58,100,83,.05); }
body.app-nita.app-admin .admin-stat-card > strong { color: #263a30; }
body.app-nita.app-admin .admin-stat-icon { background: #e7fbf3; color: #209b7a; }
body.app-nita.app-admin .admin-table-wrap { border: 1px solid #e0eee7; border-radius: 16px; background: #fff; }
body.app-nita.app-admin .admin-table { color: #34433a; }
body.app-nita.app-admin .admin-table th { color: #496157; background: #eefbf5; border-bottom-color: #dceee5; }
body.app-nita.app-admin .admin-table td { color: #52655a; border-bottom-color: #ecf3ef; }
body.app-nita.app-admin .admin-table tr:hover td { background: #f7fffb; }
body.app-nita.app-admin .admin-form-grid input, body.app-nita.app-admin .admin-form-grid select, body.app-nita.app-admin .admin-inline-form select, body.app-nita.app-admin .admin-search input, body.app-nita.app-admin .admin-adjust-form input, body.app-nita.app-admin .admin-adjust-form select { background: #fbfffd; border-color: #dcebe4; color: #27362f; }
body.app-nita.app-admin .admin-shortcuts > a:hover { background: #f3fff9; border-color: #a8e6d1; }
body.app-nita.app-admin .admin-page a:not(.button) { color: #178f71; }
body.app-nita.app-admin .admin-badge, body.app-nita.app-admin .admin-pill { border-radius: 999px; }

/* Nita room screenshots use an immersive dark voice/game surface, separate from the mint lobby */
body.app-nita.app-live-room {
    --bg: #12131c; --surface: #20222e; --surface-2: #2b2d3b;
    --text: #f7f7fb; --muted: #bbbcca; --line: rgba(255,255,255,.11);
    color: #f7f7fb; background: #12131c;
}
body.app-nita.app-live-room .site-header { position: relative; background: #171923; border-color: rgba(255,255,255,.08); box-shadow: none; }
body.app-nita.app-live-room .brand-copy strong { color: #fff; }
body.app-nita.app-live-room .brand-copy small { color: #b8bccb; }
body.app-nita.app-live-room .nav-link { color: #bec2cf; }
body.app-nita.app-live-room .user-chip, body.app-nita.app-live-room .coin-chip, body.app-nita.app-live-room .sound-settings > summary { color: #f5f5fa; background: #242633; border-color: #353847; }
body.app-nita.app-live-room :where(.voice-room-hero, .video-room-hero) { color: #fff; }
body.app-nita.app-live-room .app-bottom-nav { display: none !important; }
body.app-nita.app-live-room .site-footer { display: none; }

/* Bottom navigation, like a native social app */
body.app-nita .app-bottom-nav { background: rgba(255,255,255,.97); border-top: 1px solid #deeee6; box-shadow: 0 -7px 22px rgba(57,99,81,.08); }
body.app-nita .app-nav-item { color: #82928a; border-radius: 16px; }
body.app-nita .app-nav-item.is-active { color: #1a8f70; background: linear-gradient(150deg, #d7fff0, #efffd4); }
body.app-nita .app-nav-item.is-active .app-nav-icon { color: #1b9a79; }
body.app-nita .app-nav-icon { font-size: 21px; }
body.app-nita .app-nav-label { font-size: 9px; font-weight: 900; }

@media (min-width: 761px) {
    body.app-nita .app-bottom-nav { display: none; }
}
@media (max-width: 1050px) {
    body.app-nita .header-inner { gap: 10px; }
    body.app-nita .main-nav { gap: 9px; }
    body.app-nita .nav-link { font-size: 11px; }
    body.app-nita .header-actions { gap: 4px; }
}
@media (max-width: 760px) {
    body.app-nita { padding-bottom: 0; }
    body.app-nita main { padding-bottom: 17px; }
    body.app-nita .wrap { width: calc(100% - 22px); }
    body.app-nita .site-header { min-height: 61px; }
    body.app-nita .header-inner { min-height: 61px; width: calc(100% - 20px); padding-block: 7px; flex-wrap: nowrap; gap: 7px; }
    body.app-nita .brand { gap: 7px; }
    body.app-nita .brand-mark, body.app-nita .brand img { width: 36px !important; height: 36px !important; flex-basis: 36px !important; border-radius: 13px; }
    body.app-nita .brand-copy strong { max-width: 35vw; font-size: 13px; }
    body.app-nita .brand-copy small { font-size: 8px; }
    body.app-nita .main-nav { display: none !important; }
    body.app-nita .header-actions { margin-inline-start: auto; gap: 4px; }
    body.app-nita .header-actions .inline-form { display: none; }
    body.app-nita .header-actions .user-chip { padding: 2px; background: transparent; border: 0; }
    body.app-nita .header-actions .avatar { width: 32px; height: 32px; }
    body.app-nita .header-actions .coin-chip { display: none; }
    body.app-nita .header-actions .button-small { min-height: 32px; padding: 5px 8px; font-size: 9px; }
    body.app-nita .sound-settings > summary { width: 32px; height: 32px; padding: 0; display: grid; place-items: center; font-size: 0; }
    body.app-nita .sound-settings > summary span:first-child { font-size: 17px; }
    body.app-nita .pwa-install-button:not([hidden]) { max-width: 100px; overflow: hidden; text-overflow: ellipsis; }
    body.app-nita .section { padding-block: 25px; }
    .nita-home-hero { grid-template-columns: minmax(0, 1fr) 105px; gap: 3px; min-height: 154px; padding: 15px 14px; border-radius: 22px; }
    .nita-home-hero h1 { margin-top: 7px; font-size: 21px; line-height: 1.35; }
    .nita-home-hero p { display: -webkit-box; overflow: hidden; font-size: 10px; line-height: 1.65; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
    .nita-home-actions { gap: 6px; margin-top: 9px; }
    .nita-home-actions .button { min-height: 32px; padding: 5px 9px; font-size: 9px; }
    .nita-hero-art { min-height: 112px; transform: scale(.77); }
    .nita-art-disc { width: 116px; height: 116px; }
    .nita-art-disc span { width: 62px; height: 62px; font-size: 37px; }
    .nita-art-orbit-one { width: 150px; height: 80px; }
    .nita-art-orbit-two { width: 138px; height: 113px; }
    .nita-art-bubble { width: 34px; height: 34px; font-size: 16px; border-radius: 13px; }
    .nita-explore { padding-top: 21px; }
    .nita-feed-heading { margin-bottom: 10px; }
    .nita-feed-heading h2 { font-size: 20px; }
    .nita-feed-heading p { font-size: 10px; }
    .nita-filter-row { gap: 6px; margin: 10px 0 12px; }
    .nita-filter { min-height: 32px; padding: 5px 12px; font-size: 10px; }
    .nita-room-list { grid-template-columns: minmax(0, 1fr); gap: 9px; }
    .nita-room-item { grid-template-columns: 94px minmax(0,1fr); gap: 10px; min-height: 125px; padding: 8px; border-radius: 18px; }
    .nita-room-cover { min-height: 109px; border-radius: 13px; }
    .nita-room-art-icon { width: 49px; height: 49px; border-radius: 18px; font-size: 28px; }
    .nita-room-copy h3 { margin-top: 3px; font-size: 12px; }
    .nita-room-copy p { font-size: 9px; line-height: 1.5; }
    .nita-room-foot { margin-top: 6px; padding-top: 5px; }
    .nita-host { font-size: 8px; }
    .nita-host strong { max-width: 100px; font-size: 8px; }
    .nita-host-avatar { width: 23px; height: 23px; flex-basis: 23px; border-radius: 9px; }
    .nita-room-members { font-size: 8px; }
    .nita-stats-strip { gap: 7px; padding-top: 18px; }
    .nita-stat-card { gap: 7px; padding: 10px 8px; border-radius: 14px; }
    .nita-stat-card > span { width: 31px; height: 31px; flex-basis: 31px; border-radius: 11px; font-size: 16px; }
    .nita-stat-card strong { font-size: 17px; }
    .nita-stat-card small { font-size: 8px; }
    body.app-nita .home-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    body.app-nita .home-feature-card { padding: 13px; border-radius: 17px; }
    body.app-nita .home-feature-card h3 { font-size: 12px; }
    body.app-nita .home-feature-card p { font-size: 9px; }
    body.app-nita .home-feature-icon { width: 41px; height: 41px; }
    body.app-nita .home-social-grid { grid-template-columns: minmax(0,1fr); gap: 12px; padding-top: 16px; }
    body.app-nita .home-ranking-panel, body.app-nita .home-gifts-panel { padding: 15px; border-radius: 19px; }
    .nita-agent-cta, .nita-bottom-cta { flex-wrap: wrap; gap: 11px; padding: 15px; border-radius: 18px; }
    .nita-agent-icon { width: 41px; height: 41px; flex-basis: 41px; border-radius: 14px; font-size: 21px; }
    .nita-agent-cta h2, .nita-bottom-cta h2 { font-size: 16px; }
    .nita-agent-cta p, .nita-bottom-cta p { font-size: 10px; }
    .nita-agent-cta > .button, .nita-bottom-cta > .button { width: 100%; }
    body.app-nita .site-footer { padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
    body.app-nita .footer-inner { flex-wrap: wrap; padding-block: 14px; gap: 8px; }
    body.app-nita .footer-inner > p { flex-basis: 100%; margin: 0; }
    body.app-nita .footer-copy { margin-inline-start: auto; }
    body.app-nita .app-bottom-nav { display: grid; padding: 7px 7px calc(7px + env(safe-area-inset-bottom, 0px)); }
    body.app-nita:not(.app-live-room) { padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); }
    body.app-nita:not(.app-live-room) .site-footer { margin-bottom: calc(64px + env(safe-area-inset-bottom, 0px)); }
    body.app-nita.app-live-room { padding-bottom: 0; }
    body.app-nita.app-live-room .site-header { position: relative; }
    body.app-nita.app-admin .admin-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.app-nita.app-admin .admin-shortcuts { grid-template-columns: repeat(2, minmax(0,1fr)); }
    body.app-nita.app-admin .admin-table { font-size: 10px; }
}
@media (max-width: 390px) {
    body.app-nita .header-actions { gap: 3px; }
    body.app-nita .header-actions .button-primary { padding-inline: 7px; }
    .nita-home-hero { grid-template-columns: minmax(0, 1fr) 78px; padding-inline: 11px; }
    .nita-hero-art { transform: scale(.59); margin-inline: -12px; }
    .nita-home-hero h1 { font-size: 19px; }
    .nita-room-item { grid-template-columns: 84px minmax(0,1fr); }
    .nita-room-cover { min-height: 105px; }
    .nita-room-members { display: none; }
    .nita-stat-card { flex-direction: column; align-items: flex-start; }
    .nita-stat-card > span { width: 28px; height: 28px; flex-basis: 28px; }
}
@media (prefers-reduced-motion: reduce) {
    body.app-nita *, body.app-nita *::before, body.app-nita *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}