:root {
    --acct-bg-deep: #070b14;
    --acct-card: rgba(18, 22, 38, .70);
    --acct-card-hover: rgba(25, 30, 50, .82);
    --acct-sidebar: rgba(10, 14, 26, .58);
    --acct-border: rgba(255, 255, 255, .07);
    --acct-border-strong: rgba(255, 255, 255, .12);
    --acct-text: #f0f4fc;
    --acct-muted: #a8b5c8;
    --acct-soft: #6f7d94;
    --acct-accent: #7c8cf8;
    --acct-accent-2: #a78bfa;
    --acct-danger: #f87171;
    --acct-success: #4ade80;
    --acct-radius-xl: 2rem;
    --acct-radius-lg: 1.4rem;
    --acct-radius-md: .9rem;
    --acct-transition: all .28s cubic-bezier(.4, 0, .2, 1);
}

body.nf-account-body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background:
        radial-gradient(ellipse at 20% 20%, rgba(99,102,241,.12) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 70%, rgba(168,85,247,.10) 0%, transparent 60%),
        radial-gradient(ellipse at 50% 50%, rgba(15,20,38,.82) 0%, var(--acct-bg-deep) 100%);
    color: var(--acct-text);
    letter-spacing: -.01em;
    -webkit-font-smoothing: antialiased;
}

body.nf-account-body > main,
body.nf-account-body main.auth-main {
    flex: 1;
}

body.nf-account-body main.auth-main {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.nf-account-body .auth-card.nf-profile-shell {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.nf-account-body .auth-card.nf-profile-shell::after {
    display: none !important;
}

.nf-profile-page,
.nf-alerts-page,
.nf-account-page {
    width: min(1200px, calc(100% - 2rem)) !important;
    min-height: min(850px, calc(100vh - 150px));
    margin: 34px auto !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 280px minmax(0, 1fr) !important;
    gap: 0 !important;
    align-items: stretch !important;
    background: rgba(14, 18, 30, .65);
    backdrop-filter: blur(30px) saturate(180%);
    -webkit-backdrop-filter: blur(30px) saturate(180%);
    border: 1px solid rgba(255,255,255,.07);
    border-radius: var(--acct-radius-xl);
    box-shadow:
        0 30px 60px -20px rgba(0,0,0,.7),
        0 0 0 1px rgba(255,255,255,.03) inset,
        0 0 80px -20px rgba(99,102,241,.08);
    overflow: hidden;
}

.nf-profile-page > aside,
.nf-alerts-page > aside,
.nf-account-page > aside {
    align-self: stretch !important;
    height: 100% !important;
    min-height: inherit !important;
}

.nf-profile-page > section,
.nf-alerts-page > section,
.nf-account-page > section {
    align-self: stretch !important;
    min-height: 0;
}

.nf-profile-side,
.nf-alerts-side,
.nf-account-side {
    background: var(--acct-sidebar) !important;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 0 !important;
    border-right: 1px solid var(--acct-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 1.8rem 1.1rem !important;
    position: relative;
    overflow: hidden !important;
    min-height: 100% !important;
}

.nf-profile-side::after,
.nf-alerts-side::after,
.nf-account-side::after {
    content: "";
    position: absolute;
    right: 0;
    top: 10%;
    height: 80%;
    width: 1px;
    background: linear-gradient(transparent, rgba(255,255,255,.06), transparent);
    pointer-events: none;
}

.nf-profile-side-title,
.nf-alerts-side-title,
.nf-account-side-title {
    margin: 0 0 1.4rem !important;
    padding: 1rem !important;
    background: rgba(25,30,50,.50);
    border: 1px solid rgba(255,255,255,.05) !important;
    border-radius: 1.1rem;
    color: var(--acct-text) !important;
    font-size: 1.05rem !important;
    font-weight: 800 !important;
}

.nf-profile-nav,
.nf-alerts-nav,
.nf-account-nav {
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.nf-profile-nav a,
.nf-alerts-nav a,
.nf-account-nav a {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    gap: .8rem !important;
    padding: .8rem 1rem !important;
    border: 1px solid transparent !important;
    border-radius: .85rem !important;
    color: #8e9bb5 !important;
    background: transparent !important;
    text-decoration: none !important;
    font-size: .88rem !important;
    font-weight: 650 !important;
    transition: var(--acct-transition);
}

.nf-pm-nav-count {
    margin-left: auto;
    min-width: 24px;
    height: 22px;
    padding: 0 .45rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #6366f1, #a855f7);
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
    box-shadow: 0 6px 16px rgba(99,102,241,.28);
}

.nf-profile-nav a:nth-child(1)::before,
.nf-alerts-nav a:nth-child(1)::before,
.nf-account-nav a:nth-child(1)::before { content: "\f007"; font-family: "Font Awesome 6 Free"; font-weight: 900; width: 20px; text-align: center; opacity: .75; }
.nf-profile-nav a:nth-child(2)::before,
.nf-alerts-nav a:nth-child(2)::before,
.nf-account-nav a:nth-child(2)::before { content: "\f0f3"; font-family: "Font Awesome 6 Free"; font-weight: 900; width: 20px; text-align: center; opacity: .75; }
.nf-profile-nav a:nth-child(3)::before,
.nf-alerts-nav a:nth-child(3)::before,
.nf-account-nav a:nth-child(3)::before { content: "\f02e"; font-family: "Font Awesome 6 Free"; font-weight: 900; width: 20px; text-align: center; opacity: .75; }
.nf-profile-nav a:nth-child(4)::before,
.nf-alerts-nav a:nth-child(4)::before,
.nf-account-nav a:nth-child(4)::before { content: "\f0e0"; font-family: "Font Awesome 6 Free"; font-weight: 900; width: 20px; text-align: center; opacity: .75; }
.nf-profile-nav a:nth-child(5)::before,
.nf-alerts-nav a:nth-child(5)::before,
.nf-account-nav a:nth-child(5)::before { content: "\f023"; font-family: "Font Awesome 6 Free"; font-weight: 900; width: 20px; text-align: center; opacity: .75; }
.nf-profile-nav a:nth-child(6)::before,
.nf-alerts-nav a:nth-child(6)::before,
.nf-account-nav a:nth-child(6)::before { content: "\f08b"; font-family: "Font Awesome 6 Free"; font-weight: 900; width: 20px; text-align: center; opacity: .75; }

.nf-profile-nav a:hover,
.nf-alerts-nav a:hover,
.nf-account-nav a:hover {
    background: rgba(255,255,255,.035) !important;
    color: #c8d2e0 !important;
}

.nf-profile-nav a.is-active,
.nf-alerts-nav a.is-active,
.nf-account-nav a.is-active {
    background: linear-gradient(135deg, rgba(99,102,241,.20), rgba(168,85,247,.15)) !important;
    color: #fff !important;
    border-color: rgba(139,140,248,.30) !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.30);
}

.nf-profile-nav a.is-active::before,
.nf-alerts-nav a.is-active::before,
.nf-account-nav a.is-active::before {
    opacity: 1;
    filter: drop-shadow(0 0 6px rgba(129,140,248,.50));
}

.nf-profile-main,
.nf-alerts-main,
.nf-account-main {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 2rem 2.2rem !important;
    overflow-y: auto !important;
    min-width: 0;
}

.nf-profile-main::-webkit-scrollbar,
.nf-alerts-main::-webkit-scrollbar,
.nf-account-main::-webkit-scrollbar { width: 4px; }
.nf-profile-main::-webkit-scrollbar-track,
.nf-alerts-main::-webkit-scrollbar-track,
.nf-account-main::-webkit-scrollbar-track { background: transparent; }
.nf-profile-main::-webkit-scrollbar-thumb,
.nf-alerts-main::-webkit-scrollbar-thumb,
.nf-account-main::-webkit-scrollbar-thumb { background: rgba(255,255,255,.06); border-radius: 20px; }

.nf-profile-panel-head,
.nf-alerts-toolbar,
.nf-account-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 0 0 2rem !important;
    padding: 0 !important;
    gap: 1rem !important;
    border: 0 !important;
    background: transparent !important;
    min-height: auto !important;
}

.nf-profile-panel-head h1,
.nf-profile-panel-head h2,
.nf-alerts-toolbar h1,
.nf-account-head h1,
.nf-account-head h2 {
    margin: 0 !important;
    color: #f1f5f9 !important;
    font-size: 1.8rem !important;
    font-weight: 800 !important;
    letter-spacing: -.4px;
    position: relative;
}

.nf-profile-panel-head h1::after,
.nf-profile-panel-head h2::after,
.nf-alerts-toolbar h1::after,
.nf-account-head h1::after,
.nf-account-head h2::after {
    content: "";
    position: absolute;
    bottom: -7px;
    left: 0;
    width: 35%;
    height: 2.5px;
    background: linear-gradient(90deg, #6366f1, transparent);
    border-radius: 10px;
}

.nf-profile-section,
.nf-account-section,
.nf-alerts-row,
.nf-watch-row,
.nf-pm-row,
.nf-pm-message {
    background: var(--acct-card) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--acct-border) !important;
    border-radius: var(--acct-radius-lg) !important;
    box-shadow: 0 12px 28px -10px rgba(0,0,0,.50);
}

.nf-profile-section,
.nf-account-section {
    padding: 1.8rem !important;
}

.nf-profile-main .auth-form,
.nf-account-main .auth-form {
    max-width: 720px;
    gap: 1.1rem;
}

.nf-profile-main input,
.nf-account-main input,
.nf-profile-main .auth-field input,
.nf-account-main .auth-field input {
    width: 100% !important;
    background: rgba(10,14,24,.60) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: .8rem !important;
    padding: .85rem 1rem !important;
    color: #eef2f8 !important;
    transition: var(--acct-transition);
    outline: none;
}

.nf-profile-main input:focus,
.nf-account-main input:focus {
    border-color: #818cf8 !important;
    box-shadow: 0 0 0 3px rgba(129,140,248,.20) !important;
    background: rgba(12,17,28,.80) !important;
}

.nf-profile-main label,
.nf-account-main label,
.nf-profile-main legend,
.nf-account-main legend {
    color: #a0adc2 !important;
    font-size: .8rem !important;
    font-weight: 750 !important;
    margin-bottom: .5rem !important;
}

.nf-profile-main .auth-btn,
.nf-account-main .auth-btn {
    width: 100% !important;
    border: 1px solid rgba(139,140,248,.40) !important;
    border-radius: .9rem !important;
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%) !important;
    color: #fff !important;
    box-shadow: 0 6px 18px -6px rgba(99,102,241,.40);
    transition: var(--acct-transition);
}

.nf-profile-main .auth-btn:hover,
.nf-account-main .auth-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px -8px rgba(99,102,241,.50);
}

.nf-alerts-row,
.nf-watch-row,
.nf-pm-row,
.nf-pm-message {
    display: flex !important;
    align-items: flex-start !important;
    gap: 1rem !important;
    margin: 0 0 .65rem !important;
    padding: .95rem 1.2rem !important;
    color: var(--acct-text) !important;
    text-decoration: none !important;
    transition: var(--acct-transition);
}

.nf-watch-row {
    align-items: center !important;
    justify-content: space-between !important;
}

.nf-alerts-row:hover,
.nf-watch-row:hover,
.nf-pm-row:hover {
    background: var(--acct-card-hover) !important;
    border-color: rgba(255,255,255,.12) !important;
    transform: translateY(-1px);
}

.nf-alerts-avatar {
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 10px rgba(0,0,0,.40);
}

.nf-alerts-cat {
    background: rgba(99,102,241,.15) !important;
    color: #b4c0f8 !important;
    border-radius: 20px !important;
    padding: .16rem .6rem !important;
    font-size: .68rem !important;
}

.nf-alerts-text strong,
.nf-alerts-text em,
.nf-watch-link,
.nf-pm-link {
    color: #d6e0f0 !important;
    font-weight: 850 !important;
}

.nf-alerts-text,
.nf-watch-meta,
.nf-alerts-time,
.nf-pm-meta,
.nf-pm-note {
    color: var(--acct-muted) !important;
}

.nf-alerts-mark,
.nf-watch-btn,
.nf-pm-btn {
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: .7rem !important;
    background: rgba(255,255,255,.025) !important;
    color: #b0bdd0 !important;
    padding: .55rem .8rem !important;
    font-weight: 800 !important;
    cursor: pointer;
    transition: var(--acct-transition);
}

.nf-alerts-mark:hover,
.nf-watch-btn:hover,
.nf-pm-btn:hover {
    background: rgba(255,255,255,.06) !important;
    color: #fff !important;
    transform: translateY(-1px);
}

.nf-account-empty,
.nf-alerts-empty,
.nf-profile-empty,
.nf-pm-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 180px;
    padding: 3rem !important;
    color: #6b7a90 !important;
    background: rgba(20,25,42,.40) !important;
    border-radius: 1.2rem !important;
    border: 1px dashed rgba(255,255,255,.06) !important;
    text-align: center;
}

.nf-account-status,
.nf-alerts-status,
.auth-error,
.auth-success {
    border-radius: .9rem !important;
    border: 1px solid var(--acct-border) !important;
}

.nf-pm-layout {
    display: grid;
    grid-template-columns: minmax(260px, .85fr) minmax(0, 1.35fr);
    gap: 1rem;
}

.nf-pm-list,
.nf-pm-thread,
.nf-pm-compose {
    min-width: 0;
}

.nf-pm-row {
    justify-content: space-between;
    text-decoration: none !important;
}

.nf-pm-row.is-active,
.nf-pm-row.is-unread {
    border-color: rgba(129,140,248,.32) !important;
    background: linear-gradient(135deg, rgba(99,102,241,.16), rgba(168,85,247,.10)) !important;
}

.nf-pm-link {
    text-decoration: none;
    display: block;
}

.nf-pm-meta,
.nf-pm-note {
    display: block;
    margin-top: .35rem;
    font-size: .82rem;
}

.nf-pm-badge {
    min-width: 22px;
    height: 22px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #6366f1;
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
}

.nf-pm-thread-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    margin-bottom: 1rem;
}

.nf-pm-thread-head h2 {
    margin: 0 !important;
    color: var(--acct-text) !important;
    font-size: 1.15rem !important;
}

.nf-pm-message {
    display: block !important;
    margin-bottom: .75rem !important;
}

.nf-pm-message.is-admin {
    border-color: rgba(129,140,248,.24) !important;
}

.nf-pm-author {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    color: #eef2f8;
    font-weight: 850;
    margin-bottom: .55rem;
}

.nf-pm-body {
    color: #d8e0ed;
    line-height: 1.55;
    white-space: pre-wrap;
    word-break: break-word;
}

.nf-pm-compose textarea,
.nf-account-main textarea {
    width: 100% !important;
    min-height: 130px;
    resize: vertical;
    background: rgba(10,14,24,.60) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-radius: .8rem !important;
    padding: .85rem 1rem !important;
    color: #eef2f8 !important;
    font: inherit;
    outline: none;
}

.nf-pm-compose textarea:focus,
.nf-account-main textarea:focus {
    border-color: #818cf8 !important;
    box-shadow: 0 0 0 3px rgba(129,140,248,.20) !important;
}

@media (max-width: 980px) {
    .nf-pm-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .nf-profile-page,
    .nf-alerts-page,
    .nf-account-page {
        grid-template-columns: 1fr !important;
        min-height: auto;
        width: min(100% - 1rem, 1200px) !important;
    }

    .nf-profile-side,
    .nf-alerts-side,
    .nf-account-side {
        border-right: 0 !important;
        border-bottom: 1px solid var(--acct-border) !important;
    }

    .nf-profile-nav,
    .nf-alerts-nav,
    .nf-account-nav {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .nf-profile-side-title,
    .nf-alerts-side-title,
    .nf-account-side-title {
        display: none;
    }

    .nf-profile-main,
    .nf-alerts-main,
    .nf-account-main {
        padding: 1.4rem !important;
    }

    .nf-watch-row {
        align-items: flex-start !important;
        flex-direction: column !important;
    }
}