/* Reset & Global Styles */
:root {
    --site-header-height: 52px;
    --nuzler-logo-font: "Sora", "Outfit", sans-serif;
}

body, h1, h2, p, ul, li, button {
    font-family: "Outfit", sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    font-family: "Outfit", sans-serif;
    background: #0a0a2a;
    color: #c0c0e0;
    line-height: 1.6;
}

body.nuzler-preload-lock {
    overflow: hidden;
}

.nuzler-firstload {
    --nf-progress: 0.01;
    position: fixed;
    inset: 0;
    z-index: 30000;
    background: radial-gradient(120% 90% at 50% 50%, rgba(20, 26, 38, 0.98) 0%, rgba(8, 10, 16, 0.98) 70%, rgba(6, 7, 12, 1) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

body.nuzler-firstload-done .nuzler-firstload {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.nuzler-firstload-inner {
    position: relative;
    z-index: 1;
    width: min(360px, 78vw);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 14px;
}

.nuzler-firstload-line-track {
    position: relative;
    width: 100%;
    height: 1px;
    border-radius: 999px;
    overflow: visible;
    background: rgba(220, 230, 245, 0.08);
}

.nuzler-firstload-line-bar {
    position: absolute;
    inset: 0 auto 0 0;
    width: calc(var(--nf-progress, 0.01) * 100%);
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(141, 178, 255, 0.0) 0%, rgba(180, 205, 255, 0.85) 35%, #f4f7ff 100%);
    box-shadow: 0 0 10px rgba(180, 205, 255, 0.35);
    transition: width 0.18s cubic-bezier(0.22, 0.61, 0.36, 1);
    overflow: hidden;
}

.nuzler-firstload-line-bar::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.55) 50%, transparent 100%);
    transform: translateX(-100%);
    animation: nuzlerLoadShimmer 2.2s ease-in-out infinite;
}

.nuzler-firstload-line-bar::before {
    content: "";
    position: absolute;
    top: 50%;
    right: -2px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #ffffff;
    transform: translate(50%, -50%);
    box-shadow: 0 0 12px rgba(220, 232, 255, 0.9), 0 0 24px rgba(141, 178, 255, 0.55);
    opacity: 0.95;
    animation: nuzlerLoadPulse 1.8s ease-in-out infinite;
}

.nuzler-firstload-progress {
    margin: 0;
    color: rgba(230, 240, 255, 0.92);
    font-family: "Space Grotesk", "Outfit", sans-serif;
    font-size: 0.78rem;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.18em;
    text-align: center;
    font-variant-numeric: tabular-nums;
    text-transform: uppercase;
    opacity: 0.85;
}

@keyframes nuzlerFirstLoadSpin {
    to { transform: rotate(360deg); }
}

@keyframes nuzlerLoadShimmer {
    0%   { transform: translateX(-100%); }
    60%  { transform: translateX(100%); }
    100% { transform: translateX(100%); }
}

@keyframes nuzlerLoadPulse {
    0%, 100% { opacity: 0.7; transform: translate(50%, -50%) scale(0.9); }
    50%      { opacity: 1;   transform: translate(50%, -50%) scale(1.15); }
}
a {
    text-decoration: none;
    color: inherit;
}

/* Mobile-First Responsive Utilities */
@media (max-width: 768px) {
    body {
        font-size: 14px;
        overflow-x: hidden;
        width: 100%;
        max-width: 100vw;
    }
    
    /* Prevent any element from breaking screen boundaries */
    * {
        max-width: 100%;
        box-sizing: border-box;
    }
    
    /* Container width control */
    .container,
    .main-container {
        width: 100%;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
        margin: 0 auto;
    }
    
    /* Add padding to search and tabs for mobile full-width posts */
    .search-container {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    .tabs {
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media (max-width: 480px) {
    body {
        font-size: 13px;
    }
    
    .container,
    .main-container {
        padding-left: 0;
        padding-right: 0;
    }
    
    /* Smaller padding for search and tabs on very small screens */
    .search-container {
        padding-left: 5px;
        padding-right: 5px;
    }
    
    .tabs {
        padding-left: 5px;
        padding-right: 5px;
    }
}

html {
    scroll-padding-top: calc(var(--site-header-height) + 16px);
}

/* Header — compact bar, proportional type; slogan centered in middle column */
header.site-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px 12px;
    padding: 5px 14px;
    min-height: 0;
    background: linear-gradient(90deg, #1e3a8a, #3b82f6);
    color: white;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
    position: sticky;
    top: 0;
    z-index: 1000;
}

header.site-header .logo {
    grid-column: 1;
    justify-self: start;
}

header.site-header .slogan {
    grid-column: 2;
    justify-self: center;
    width: 100%;
    max-width: min(28rem, min(52vw, 100%));
    margin: 0 auto;
}

header.site-header .header-actions {
    grid-column: 3;
    justify-self: end;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 0;
}

header.site-header .header-actions .profile-email {
    margin-left: 0;
}

/* Mobile Header Optimization */
@media (max-width: 768px) {
    header.site-header {
        padding: 5px 12px;
        gap: 8px;
        min-height: 0;
    }
}

@media (max-width: 480px) {
    /* site-header uses grid; keep two columns (logo | profile) on small phones */
    header.site-header {
        padding: 5px 10px;
        gap: 4px;
        align-items: center;
    }
}

.logo {
    font-family: "Space Grotesk", sans-serif;
    font-weight: 700;
    font-size: 1.35rem;
    line-height: 1.1;
    letter-spacing: -0.03em;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    color: white;
    text-decoration: none;
}

/* Mobile Logo Optimization */
@media (max-width: 768px) {
    .logo {
        font-size: 1.2rem;
    }
}

@media (max-width: 480px) {
    header.site-header .logo {
        font-size: 1.1rem;
    }
}

.logo span {
    color: #facc15;
}
.beta-tag {
    font-size: 0.58em;
    margin-left: 6px;
    padding: 1px 5px;
    border-radius: 3px;
    border: 1px solid rgba(250, 204, 21, 0.85);
    color: #fde68a;
    font-weight: 700;
    letter-spacing: 0.08em;
    display: inline-block;
    vertical-align: middle;
    animation: shake 0.5s ease-in-out 1;
}

/* Mobile Beta Tag */
@media (max-width: 480px) {
    .beta-tag {
        font-size: 0.55em;
        margin-left: 5px;
        padding: 1px 4px;
    }
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20% { transform: translateX(-2px); }
    40% { transform: translateX(2px); }
    60% { transform: translateX(-2px); }
    80% { transform: translateX(2px); }
}
.slogan {
    display: block;
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 1.35;
    text-align: center;
    min-width: 0;
    min-height: 1.25em;
    margin: 0 auto;
    color: rgba(255, 255, 255, 0.88);
}

/* Mobile Slogan Optimization */
@media (max-width: 768px) {
    .slogan {
        font-size: 0.7rem;
        max-width: none;
    }
}

@media (max-width: 480px) {
    header.site-header .slogan {
        font-size: 0.68rem;
        letter-spacing: 0.03em;
    }
}

.typing-text {
    display: inline-block;
    border-right: 1px solid rgba(250, 204, 21, 0.75);
    padding-right: 2px;
    animation: blink-caret 0.75s step-end infinite;
}
@keyframes blink-caret {
    from, to { border-color: transparent }
    50% { border-color: #facc15; }
}
.profile-email {
    position: relative;
    font-size: 0.8125rem;
    cursor: pointer;
    margin-left: auto;
    padding: 6px 10px;
    font-weight: 600;
    white-space: nowrap;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    font-family: inherit;
    line-height: 1.2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    max-width: min(220px, 34vw);
}

/* Publisher link styling - inherits profile-email styles */
.profile-email.publisher-link {
    text-decoration: none;
    color: inherit;
    display: inline-flex;
}

.profile-email.publisher-link:hover,
.profile-email.publisher-link:focus-visible,
.profile-email:hover,
.profile-email:focus-visible,
.profile-email[aria-expanded="true"] {
    color: #facc15;
    text-decoration: none;
    border-color: rgba(250, 204, 21, 0.7);
    background: rgba(10, 10, 42, 0.22);
    outline: none;
}

.profile-trigger-name {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Dropdown arrow indicator */
.dropdown-arrow {
    font-size: 0.72em;
    margin-left: 2px;
    opacity: 0.7;
    transition: opacity 0.2s ease, transform 0.2s ease;
    flex: 0 0 auto;
}

.profile-email.publisher-link:hover .dropdown-arrow,
.profile-email[aria-expanded="true"] .dropdown-arrow {
    opacity: 1;
    transform: translateY(1px);
}

/* Mobile Profile Email Optimization */
@media (max-width: 768px) {
    .profile-email {
        font-size: 0.78rem;
        padding: 4px 6px;
    }
}

@media (max-width: 480px) {
    .profile-email {
        font-size: 0.75rem;
        padding: 3px 4px;
    }
}

.profile-menu {
    display: none;
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    background: linear-gradient(180deg, rgba(17, 24, 48, 0.99), rgba(10, 10, 42, 0.99));
    backdrop-filter: blur(18px);
    color: #fff;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.58);
    border-radius: 8px;
    border: 1px solid rgba(147, 197, 253, 0.32);
    overflow: hidden;
    width: min(390px, calc(100vw - 24px));
    box-sizing: border-box;
    z-index: 1001;
    font-family: 'Outfit', sans-serif;
    padding: 14px;
}

@media (min-width: 769px) {
    .profile-menu {
        width: 410px;
        max-height: none;
        overflow: visible;
    }
}

/* Mobile Profile Menu Optimization - TOP DROPDOWN */
@media (max-width: 768px) {
    .profile-menu {
        /* Compact dropdown below the site header. */
        position: fixed;
        top: calc(var(--site-header-height, 52px) + 8px);
        left: 12px;
        right: 12px;
        width: auto;
        height: auto;
        max-height: calc(100dvh - var(--site-header-height, 52px) - 24px);
        overflow-y: auto;
        background: linear-gradient(180deg, #111827, #0a0a2a);
        z-index: 2000;
        transition: opacity 0.2s ease, transform 0.2s ease;
        display: none;
        flex-direction: column;
        border-radius: 8px;
        border: 1px solid rgba(147, 197, 253, 0.38);
        box-shadow: 0 16px 42px rgba(0, 0, 0, 0.7);
        padding: 14px;
        font-family: 'Outfit', sans-serif;
        opacity: 0;
        transform: translateY(-6px);
    }
    
    .profile-menu.show {
        display: flex;
        opacity: 1;
        transform: translateY(0);
    }
    
    /* Hide original guest menu (for non-logged in users) on mobile */
    .profile-menu .guest-menu:not(.mobile-guest-menu) {
        display: none !important;
    }

    .profile-menu.profile-menu-logged-in .mobile-guest-menu {
        display: none !important;
    }

    .profile-menu.profile-menu-logged-in .profile-name {
        display: flex !important;
    }

    .profile-menu.profile-menu-logged-in .profile-menu-user {
        display: flex !important;
    }

    .profile-menu.profile-menu-logged-in .profile-status {
        display: block !important;
    }

    .profile-menu.profile-menu-logged-in .profile-options {
        display: flex !important;
    }

    .profile-menu.profile-menu-guest .mobile-guest-menu {
        display: block !important;
        padding: 14px;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .profile-menu {
        padding: 12px;
    }
}

.profile-menu.show {
    display: flex;
    flex-direction: column;
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
    animation: profileMenuSlideIn 0.22s ease both;
}

@keyframes profileMenuSlideIn {
    from {
        opacity: 0;
        transform: translateX(14px) translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateX(0) translateY(0);
    }
}

@media (max-width: 768px) {
    .profile-menu.show {
        display: flex;
        animation: profileMenuMobileSlideIn 0.22s ease both;
    }
}

@keyframes profileMenuMobileSlideIn {
    from {
        opacity: 0;
        transform: translateY(-12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Remove mobile backdrop - not needed for top dropdown */
.profile-menu-backdrop {
    display: none !important;
}

/* Close button for mobile dropdown */
.profile-menu-close {
    display: none;
    position: absolute;
    top: 14px;
    right: 14px;
    width: 32px;
    height: 32px;
    background: rgba(15, 23, 42, 0.88);
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 8px;
    color: #cbd5e1;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s ease;
    z-index: 2001;
    justify-content: center;
    align-items: center;
    line-height: 1;
}

.profile-menu-close:hover {
    background: rgba(96, 165, 250, 0.16);
    border-color: rgba(96, 165, 250, 0.55);
    color: #fff;
}

@media (max-width: 768px) {
    .profile-menu-close {
        display: flex;
    }
}

@media (min-width: 769px) {
    .profile-email:hover .profile-menu,
    .profile-email:focus-within .profile-menu,
    .profile-menu:hover {
        display: flex;
        flex-direction: column;
        opacity: 1;
        transform: translateY(0);
        pointer-events: all;
    }
}
.profile-menu > div {
    padding: 0;
    border-bottom: 0;
}
.profile-menu > div:last-child {
    border-bottom: none;
}
.profile-name {
    display: flex;
    align-items: center;
}
.profile-name img {
    border-radius: 8px !important;
    width: 30px;
    height: 30px;
    margin-right: 10px;
    object-fit: cover;
}
.profile-menu-user {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: 16px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.78);
    border: 1px solid rgba(147, 197, 253, 0.32);
    margin-bottom: 10px;
    color: #fff;
    min-width: 0;
    padding-right: 16px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

@media (max-width: 768px) {
    .profile-menu-user {
        padding-right: 48px;
    }
}

.profile-menu-user:hover {
    background: rgba(96, 165, 250, 0.14);
    border-color: rgba(96, 165, 250, 0.42);
}

.profile-menu-user-main {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    outline: none;
}

.profile-menu-user-main:hover,
.profile-menu-user-main:focus-visible {
    color: #fff;
    outline: none;
}

.profile-menu-user .initials-avatar {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border-radius: 8px;
}

.profile-menu-user-copy {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    min-width: 0;
    flex: 1 1 auto;
    text-align: left;
}

.profile-menu-user-name {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

.profile-menu-user-name {
    color: #f8fafc;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.15;
}

.profile-menu-user-hint {
    color: rgba(203, 213, 225, 0.72);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1;
}

.profile-name-email {
    display: flex;
    width: 100%;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(2, 6, 23, 0.36);
    border: 1px solid rgba(148, 163, 184, 0.16);
    color: rgba(203, 213, 225, 0.9);
    font-size: 0.8rem;
    font-weight: 500;
    box-sizing: border-box;
    overflow: visible;
}

.profile-menu-address-label {
    flex: 0 0 auto;
    color: #facc15;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1;
    text-transform: uppercase;
}

.profile-menu-address-value {
    min-width: 0;
    max-width: 100%;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.25;
    color: #e2e8f0;
}
.profile-copy-address {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "label action"
        "value action";
    align-items: center;
    gap: 5px 12px;
    padding: 11px 12px;
    border: 1px solid rgba(217, 179, 95, 0.24);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(217, 179, 95, 0.13), rgba(72, 213, 151, 0.08)),
        rgba(2, 6, 23, 0.38);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    box-sizing: border-box;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.profile-copy-address .profile-menu-address-label {
    grid-area: label;
}

.profile-copy-address .profile-menu-address-value {
    grid-area: value;
    color: rgba(248, 250, 252, 0.95);
    font-size: 0.92rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.2;
}

.profile-copy-action {
    grid-area: action;
    align-self: stretch;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 68px;
    padding: 0 10px;
    border-radius: 8px;
    background: rgba(217, 179, 95, 0.18);
    border: 1px solid rgba(217, 179, 95, 0.3);
    color: #f2d99b;
    font-size: 0.78rem;
    font-weight: 900;
    line-height: 1;
}

.profile-copy-address:hover,
.profile-copy-address:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(217, 179, 95, 0.52);
    background:
        linear-gradient(135deg, rgba(217, 179, 95, 0.2), rgba(72, 213, 151, 0.12)),
        rgba(2, 6, 23, 0.48);
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.22);
    outline: none;
}

.profile-copy-address.copied {
    border-color: rgba(72, 213, 151, 0.56);
    background:
        linear-gradient(135deg, rgba(72, 213, 151, 0.18), rgba(217, 179, 95, 0.11)),
        rgba(2, 6, 23, 0.5);
}

.profile-copy-address.copied .profile-copy-action {
    background: rgba(72, 213, 151, 0.18);
    border-color: rgba(72, 213, 151, 0.42);
    color: #d9ffe9;
}

.profile-copy-feedback {
    min-height: 1em;
    margin-top: -6px;
    color: rgba(72, 213, 151, 0.92);
    font-size: 0.76rem;
    font-weight: 800;
    line-height: 1;
    text-align: right;
}
.profile-status {
    background: rgba(15, 23, 42, 0.62);
    text-align: center;
    font-weight: 700;
    transition: background 0.2s ease;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    margin-bottom: 12px;
    line-height: 1.2;
}
.profile-status:hover {
    background: rgba(255, 255, 255, 0.08);
}
.profile-options {
    padding: 0 !important;
    background: transparent !important;
    border-bottom: none !important;
    display: flex;
    flex-direction: column;
    gap: 9px;
}
.profile-options a {
    color: #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 15px;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 600;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    border-radius: 8px;
    margin: 0;
    text-align: left;
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.58);
    cursor: pointer;
    position: relative;
    min-height: 44px;
}
.profile-options a:hover,
.profile-options a:focus-visible {
    background: rgba(37, 99, 235, 0.24);
    color: #f8fafc;
    border-color: rgba(147, 197, 253, 0.5);
    outline: none;
}

.profile-options a.profile-menu-danger {
    color: #fecaca;
    border-color: rgba(248, 113, 113, 0.28);
}

.profile-options a.profile-menu-danger:hover,
.profile-options a.profile-menu-danger:focus-visible {
    background: rgba(239, 68, 68, 0.18);
    border-color: rgba(248, 113, 113, 0.55);
    color: #fff;
}
.menu-counter {
    background-color: #facc15;
    color: #111137;
    border-radius: 8px;
    padding: 2px 8px;
    font-size: 0.75em;
    font-weight: 700;
    margin-left: 8px;
    display: inline-block;
    vertical-align: middle;
    min-width: 16px;
    text-align: center;
    line-height: 1.2;
}
.hamburger-menu {
    display: none;
    flex-direction: column;
    cursor: pointer;
}
.hamburger-menu div {
    width: 25px;
    height: 3px;
    background: white;
    margin: 4px;
}

/* Main Container */
.main-container {
    padding: 20px;
    max-width: 800px;
    margin: 0 auto;
}

/* Search Box */
.search-container {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
}
.search-bar {
    display: block;
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    box-sizing: border-box;
    border: 2px solid #b388ff;
    border-radius: 8px;
    background-color: #1a1a1a;
    color: #ffffff;
    font-size: 16px;
    transition: all 0.3s ease;
    -webkit-user-select: text;
    user-select: text;
    line-height: 1.35;
    appearance: none;
    -webkit-appearance: none;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    -webkit-tap-highlight-color: transparent;
}
.search-bar:focus {
    outline: none;
    border-color: #facc15;
    box-shadow: 0 0 5px rgba(250, 204, 21, 0.3);
}
.search-bar::placeholder {
    color: #888;
}

/* Tabs */
.tabs {
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
    position: relative;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

/* Mobile Tabs Optimization */
@media (max-width: 768px) {
    .tabs {
        margin-bottom: 15px;
        padding: 0 10px;
        justify-content: flex-start;
        gap: 20px;
    }
}

@media (max-width: 480px) {
    .tabs {
        margin-bottom: 12px;
        padding: 0 5px;
        gap: 15px;
    }
}

.add-tab {
    position: relative;
}

.tabs::-webkit-scrollbar {
    display: none;
}
.tab {
    flex: 1;
    padding: 10px 0;
    cursor: pointer;
    text-align: center;
    color: #ddd;
    transition: all 0.3s;
}

/* Mobile Tab Optimization */
@media (max-width: 768px) {
    .tab {
        flex: none;
        padding: 12px 16px;
        min-width: auto;
        white-space: nowrap;
        font-size: 14px;
        border-radius: 8px;
    }
}

@media (max-width: 480px) {
    .tab {
        padding: 10px 14px;
        font-size: 13px;
        border-radius: 6px;
    }
}

.tab.active {
    color: #fff;
    font-weight: bold;
    position: relative;
}

/* Mobile Active Tab - scoped to non-feed pages */
@media (max-width: 768px) {
    .tab.active:not(.tier-tab) {
        background: none;
        border: none;
    }
}

.tab.active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(145deg, #3b82f6, #facc15);
    border-radius: 5px;
}


.tab:hover {
    color: #fff;
}

/* Disable hover effects on mobile */
@media (max-width: 768px) {
    .tab:hover {
        color: #ddd;
    }
    
    .tab.active:hover {
        color: #fff;
    }
}
.add-tab {
    flex: none;
    color: #ddd;
    cursor: pointer;
    font-size: 1.5em;
    transition: all 0.3s;
    padding: 0 10px;
    position: relative;
}
.add-tab:hover {
    color: #facc15;
    transform: scale(1.1);
}
/* Desktop-only dropdown menu - SIMPLE & WORKING */
.add-tab-menu {
    display: none;
    position: absolute;
    top: 40px;
    right: 0;
    background: #ffffff;
    color: #333333;
    border: 2px solid #333333;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    width: 250px;
    max-height: 400px;
    overflow-y: auto;
    z-index: 10000;
    padding: 0;
}

.add-tab-menu.visible {
    display: block;
}

.add-tab-menu .menu-title {
    background: #3b82f6;
    color: white;
    padding: 12px;
    margin: 0;
    text-align: center;
    font-weight: bold;
    border-bottom: 1px solid #ddd;
}

.add-tab-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.add-tab-menu li {
    padding: 10px 15px;
    cursor: pointer;
    border-bottom: 1px solid #eee;
    display: flex;
    align-items: center;
    font-size: 14px;
    transition: background-color 0.2s;
}

.add-tab-menu li:hover {
    background: #f5f5f5;
}

.add-tab-menu li span {
    margin-right: 10px;
    font-weight: bold;
    color: #ff4444;
}

.add-tab-menu li.selected {
    background: #e8f5e8;
    border-left: 4px solid #4ade80;
}

.add-tab-menu li.selected span {
    color: #4ade80;
}

.add-tabs-button {
    background: linear-gradient(145deg, #3b82f6, #f7b42c);
    color: white;
    border: none;
    padding: 12px;
    width: 100%;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 0 0 6px 6px;
    transition: all 0.3s ease;
}

.add-tabs-button:hover {
    background: linear-gradient(145deg, #f7b42c, #3b82f6);
}

/* Post Section */
.post,
.nuzler-post {
    position: relative;
}

.post {
    background: linear-gradient(145deg, rgba(22, 28, 50, 0.9) 0%, rgba(13, 17, 38, 0.95) 100%);
    backdrop-filter: blur(16px);
    border-radius: 20px;
    border: 1px solid rgba(148, 163, 184, 0.08);
    border-left: 4px solid #3b82f6;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25), 0 1px 0 rgba(255, 255, 255, 0.04) inset;
    margin-bottom: 32px;
    padding: 0;
    transition: all 0.25s ease;
    cursor: pointer;
}

/* Mobile Post Optimization - Full Width Cards */
@media (max-width: 768px) {
    .post {
        margin-bottom: 24px;
        padding: 0;
        border-radius: 18px;
        margin-left: 0;
        margin-right: 0;
        background: linear-gradient(135deg, rgba(20, 25, 45, 0.85) 0%, rgba(12, 12, 35, 0.95) 100%);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(100, 116, 139, 0.15);
        border-left: 3px solid #3b82f6;
        overflow: hidden;
        width: 100%;
    }
    
    .post:hover {
        transform: none;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
    }
}

@media (max-width: 480px) {
    .post {
        margin-bottom: 10px;
        border-radius: 10px;
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }
    
    .post-header .subscribe-button {
        width: 32px;
        height: 32px;
    }
    
    .post-header .subscribe-button:before {
        font-size: 18px;
    }
    
    .post-header .subscribe-button.subscribed:before {
        font-size: 14px;
    }
}

.post:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
    border-color: rgba(100, 116, 139, 0.3);
}

@media (max-width: 768px) {
    .post:hover {
        transform: none;
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
    }
}

.post.active {
    border-color: #facc15;
}
/* Desktop Post Header */
.post-header {
    display: grid;
    grid-template-columns: 56px 1fr auto;
    grid-template-areas: "pic info button";
    align-items: center;
    gap: 16px;
    padding: 24px 24px 20px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.08);
}

/* Desktop Profile Picture */
.post-header .profile-pic-link {
    grid-area: pic;
}

.post-header .profile-pic {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    border: 2.5px solid;
    object-fit: cover;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s ease;
}

/* Desktop Author Info */
.post-header .author-info {
    grid-area: info;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.post-header .published-date,
.post-header .author-info .published-date {
    color: #a7b0bf;
    font-size: 0.92rem;
    font-weight: 600;
    line-height: 1.35;
}

.nuzler-brand-tag {
    width: fit-content;
    max-width: 100%;
    color: #f8fafc;
    background: rgba(148, 163, 184, 0.12);
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 8px;
    padding: 4px 10px;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
    overflow-wrap: anywhere;
}

a.nuzler-brand-tag:hover {
    color: #ffffff;
    border-color: currentColor;
}

/* Desktop Subscribe Button */
.post-header .subscribe-button {
    grid-area: button;
    padding: 10px 20px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.25s ease;
    white-space: nowrap;
    height: auto;
    width: auto;
    min-width: 160px;
    text-align: center;
    position: relative;
    overflow: hidden;
    letter-spacing: 0.02em;
    box-shadow: 0 4px 14px rgba(102, 126, 234, 0.3);
}

/* Show button text on desktop */
.post-header .subscribe-button .button-text {
    display: inline;
}

/* Hide mobile icons on desktop only */
@media (min-width: 769px) {
    .post-header .subscribe-button:before {
        display: none; /* Hide mobile icons on desktop */
    }

    .post-header .subscribe-button:after {
        display: none; /* Hide mobile ripple on desktop */
    }
}

.post-header .subscribe-button:not(.subscribed):hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.5);
}

.post-header .subscribe-button.subscribed {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

.post-header .subscribe-button.subscribed:hover {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    transform: translateY(-2px);
}

/* Desktop button loading state */
.post-header .subscribe-button.loading {
    pointer-events: none;
    opacity: 0.7;
}

.post-header .subscribe-button.loading:after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    margin: auto;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top: 2px solid white;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: block;
}

@keyframes spin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Mobile Post Header */
@media (max-width: 768px) {
    .post-header {
        padding: 20px 18px 16px;
        gap: 14px;
        display: grid;
        grid-template-columns: 52px 1fr 48px;
        grid-template-areas: "pic info button";
        align-items: center;
    }
    
    .post-header .profile-pic-link {
        grid-area: pic;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .post-header .profile-pic {
        width: 48px !important;
        height: 48px !important;
        border-radius: 12px !important;
        border: 1.5px solid rgba(64, 158, 255, 0.4);
        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
    }
    
    .post-header .author-info {
        grid-area: info;
        display: flex;
        flex-direction: column;
        gap: 3px;
        justify-content: center;
        min-height: auto;
        padding: 0;
    }
    
    .post-header .author-info .author-name-row {
        display: flex;
        align-items: center;
        gap: 6px;
        margin-bottom: 0;
    }
    
    .post-header .author-info .author-name-row .author {
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1.2;
    }
    
    .post-header .author-info .verified-checkmark {
        flex-shrink: 0;
    }
    
    .post-header .author-info .verified-checkmark svg {
        width: 16px !important;
        height: 16px !important;
    }
    
    .post-header .author-info .author-tier-row .author-tier {
        font-size: 14px !important;
        font-weight: 600 !important;
        opacity: 0.8;
    }
    
    .post-header .author-info .nuzler-type {
        font-size: 13px !important;
    }
    
    .post-header .author-info .posting-rate {
        font-size: 13px !important;
        font-weight: 500 !important;
        opacity: 0.8;
    }
    
    .post-header .author-info .subscriber-count-row .subscriber-count {
        font-size: 13px !important;
        font-weight: 600 !important;
    }
    
    /* Subscribe Button - Round icon on mobile */
    .post-header .subscribe-button {
        grid-area: button;
        width: 44px;
        height: 44px;
        padding: 0;
        font-size: 0 !important;
        border-radius: 50% !important;
        border: none;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        color: white !important;
        transition: all 0.25s ease;
        position: relative;
        overflow: hidden;
        justify-self: center;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: auto !important;
    }
    
    .post-header .subscribe-button .button-text {
        display: none;
    }
    
    .post-header .subscribe-button:before {
        content: '+';
        font-size: 20px;
        font-weight: 300;
        line-height: 1;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 2;
    }
    
    .post-header .subscribe-button:after {
        display: none;
    }
    
    .post-header .subscribe-button:not(.subscribed):hover {
        transform: scale(1.08);
        box-shadow: 0 4px 14px rgba(102, 126, 234, 0.5);
    }
    
    .post-header .subscribe-button:not(.subscribed):active {
        transform: scale(0.95);
    }
    
    .post-header .subscribe-button.subscribed {
        background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    }
    
    .post-header .subscribe-button.subscribed:before {
        content: '✓';
        font-size: 16px;
        font-weight: 700;
        color: white;
    }
    
    .post-header .subscribe-button.subscribed:hover {
        background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    }
    
    .post-header .subscribe-button.subscribed:hover:before {
        content: '×';
        font-size: 18px;
    }
    
    .post-header .subscribe-button.loading:before {
        content: '';
        width: 16px;
        height: 16px;
        border: 2px solid rgba(255, 255, 255, 0.3);
        border-top: 2px solid white;
        border-radius: 50%;
        animation: spin 1s linear infinite;
    }
}

@media (max-width: 480px) {
    .post-header {
        padding: 16px 14px 12px;
        gap: 10px;
        grid-template-columns: 44px 1fr 40px;
    }
    
    .post-header .profile-pic {
        width: 40px !important;
        height: 40px !important;
        border-radius: 10px !important;
    }
    
    .post-header .author-info {
        min-height: auto;
        gap: 2px;
    }
    
    .post-header .author-info .author-name-row .author {
        font-size: 15px !important;
    }
    
    .post-header .author-info .verified-checkmark svg {
        width: 14px !important;
        height: 14px !important;
    }
    
    .post-header .author-info .author-tier-row .author-tier {
        font-size: 13px !important;
    }
    
    .post-header .author-info .nuzler-type {
        font-size: 12px !important;
    }
    
    .post-header .author-info .posting-rate {
        font-size: 12px !important;
    }
    
    .post-header .author-info .subscriber-count-row .subscriber-count {
        font-size: 12px !important;
    }
}

.post-header .details {
    display: flex;
    align-items: center;
    flex-direction: column;
}
.post-header .profile-pic {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    border: 2.5px solid;
    object-fit: cover;
    margin-right: 0;
    transition: transform 0.2s ease;
}
/* Tier-based border colors - comprehensive rules */
.profile-pic.blue { border-color: #409eff !important; }
.profile-pic.meme { border-color: #ff4fd8 !important; }
.profile-pic.gold { border-color: #facc15 !important; }
.profile-pic.purple { border-color: #b388ff !important; }
.profile-pic.brown { border-color: #cd853f !important; }
.profile-pic.pink { border-color: #ff85b3 !important; }
.profile-pic.red { border-color: #ff4444 !important; }
.profile-pic.orange { border-color: #f97316 !important; }
.profile-pic.yellow { border-color: #eab308 !important; }
.profile-pic.green { border-color: #10b981 !important; }
.profile-pic.darkpink { border-color: #be185d !important; }
.profile-pic.mint { border-color: #2dd4bf !important; }
.profile-pic.magenta { border-color: #d946ef !important; }
.profile-pic.indigo { border-color: #6366f1 !important; }
.profile-pic.stadium { border-color: #22c55e !important; }
.profile-pic.copper { border-color: #b45309 !important; }
.profile-pic.royal { border-color: #2563eb !important; }
.profile-pic.rose { border-color: #f43f5e !important; }

.post-header .author-info {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Tier Display Styles */
.profile-tier {
    margin-bottom: 10px;
}

.tier-display {
    font-size: 0.9em;
    font-weight: 500;
    opacity: 0.8;
}

.author-tier-row {
    margin-top: 2px;
    margin-bottom: 2px;
}

.author-tier {
    font-size: 0.92em;
    font-weight: 600;
    opacity: 0.75;
}

.author-tier-row-profile {
    margin-top: 2px;
    margin-bottom: 4px;
}

.author-tier-row-profile .author-tier {
    font-size: 0.75em;
    font-weight: 400;
    opacity: 0.75;
}

.post-header .verified-checkmark {
    margin-left: -2px;
}

.post-header .author {
    font-size: 1.1em;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: opacity 0.2s ease;
    letter-spacing: -0.2px;
}

.post-header .author:hover {
    opacity: 0.8;
    text-decoration: underline;
    text-underline-offset: 2px;
}


/* Author tier colors for publisher names */
.author.tier-blue { color: #409eff; }
.author.tier-meme { color: #ff4fd8; }
.author.tier-orange { color: #f97316; }
.author.tier-red { color: #ff4444; }
.author.tier-violet { color: #8b45c5; }
.author.tier-purple { color: #b388ff; }
.author.tier-green { color: #10b981; }
.author.tier-yellow { color: #eab308; }
.author.tier-pink { color: #ff85b3; }
.author.tier-teal { color: #14b8a6; }
.author.tier-lightblue { color: #38bdf8; }
.author.tier-gray { color: #6b7280; }
.author.tier-lime { color: #84cc16; }
.author.tier-gold { color: #facc15; }
.author.tier-darkblue { color: #1e40af; }
.author.tier-cyan { color: #06b6d4; }
.author.tier-darkpink { color: #be185d; }
.author.tier-mint { color: #2dd4bf; }
.author.tier-magenta { color: #d946ef; }
.author.tier-indigo { color: #6366f1; }
.author.tier-emerald { color: #059669; }
.author.tier-stadium { color: #22c55e; }
.author.tier-copper { color: #b45309; }
.author.tier-sky { color: #0ea5e9; }
.author.tier-coral { color: #fb7185; }
.author.tier-royal { color: #2563eb; }
.author.tier-rose { color: #f43f5e; }
.post-header .publishing-ratio {
    color: #888;
    font-size: 0.9em;
}
.subscribe-button {
    background: #409eff;
    color: white;
    border: none;
    border-radius: 50px;
    padding: 8px 15px;
    cursor: pointer;
    font-weight: bold;
    font-size: 14px;
    transition: background-color 0.3s, transform 0.2s;
}
.subscribe-button.subscribed {
    background-color: #333;
    color: #888;
}
.subscribe-button:hover:not(.subscribed) {
    background-color: #1e3a8a;
    transform: scale(1.1);
}
.post-header .checkmark-wrapper {
    margin-left: auto; /* Pushes the checkmark to the far right */
    position: relative;
    cursor: pointer;
}
.post-header .checkmark {
    width: 28px;
    height: 28px;
    font-size: 0.9em;
    margin-left: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.15);
    transition: all 0.3s ease;
    position: relative;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.checkmark::after {
    content: "✓";
    font-size: 1.1em;
    font-weight: bold;
}
.checkmark.blue {
    color: #409eff;
    background: rgba(64, 158, 255, 0.2);
    border: 2px solid #409eff;
}
.checkmark.gold {
    color: #facc15;
    background: rgba(250, 204, 21, 0.2);
    border: 2px solid #facc15;
}
.checkmark.purple {
    color: #b388ff;
    background: rgba(179, 136, 255, 0.2);
    border: 2px solid #b388ff;
}
.checkmark.brown {
    color: #cd853f;
    background: rgba(205, 133, 63, 0.2);
    border: 2px solid #cd853f;
}
.checkmark.red {
    background: rgba(255, 68, 68, 0.2);
    border: 2px solid #ff4444;
    color: #ff4444;
}
.checkmark.pink {
    color: #ff85b3;
    background: rgba(255, 133, 179, 0.2);
    border: 2px solid #ff85b3;
}
.checkmark.orange {
    color: #f97316;
    background: rgba(249, 115, 22, 0.2);
    border: 2px solid #f97316;
}
.checkmark.yellow {
    color: #eab308;
    background: rgba(234, 179, 8, 0.2);
    border: 2px solid #eab308;
}
.checkmark.green {
    color: #10b981;
    background: rgba(16, 185, 129, 0.2);
    border: 2px solid #10b981;
}

/* Author name colors to match verification tiers */
.author.blue {
    color: #409eff;
}
.author.meme {
    color: #ff4fd8;
}
.author.gold {
    color: #facc15;
}
.author.purple {
    color: #b388ff;
}
.author.brown {
    color: #cd853f;
}
.author.pink {
    color: #ff85b3;
}
.author.red {
    color: #ff4444;
}
.author.orange {
    color: #f97316;
}
.author.yellow {
    color: #eab308;
}
.author.green {
    color: #10b981;
}

/* Profile name colors for verification tiers */
.profile-name.blue, .profile-name .blue {
    color: #409eff !important;
}
.profile-name.meme, .profile-name .meme {
    color: #ff4fd8 !important;
}
.profile-name.gold, .profile-name .gold {
    color: #facc15 !important;
}
.profile-name.purple, .profile-name .purple {
    color: #b388ff !important;
}
.profile-name.brown, .profile-name .brown {
    color: #cd853f !important;
}
.profile-name.pink, .profile-name .pink {
    color: #ff85b3 !important;
}
.profile-name.red, .profile-name .red {
    color: #ff4444 !important;
}
.profile-name.orange, .profile-name .orange {
    color: #f97316 !important;
}
.profile-name.yellow, .profile-name .yellow {
    color: #eab308 !important;
}
.profile-name.green, .profile-name .green {
    color: #10b981 !important;
}

/* Initials avatar background colors for verification tiers */
.initials-avatar.blue { background-color: #409eff; }
.initials-avatar.orange { background-color: #f97316; }
.initials-avatar.meme { background-color: #ff4fd8; }
.initials-avatar.red { background-color: #ff4444; }
.initials-avatar.violet { background-color: #8b45c5; }
.initials-avatar.purple { background-color: #b388ff; }
.initials-avatar.green { background-color: #10b981; }
.initials-avatar.yellow { background-color: #eab308; }
.initials-avatar.pink { background-color: #ff85b3; }
.initials-avatar.teal { background-color: #14b8a6; }
.initials-avatar.lightblue { background-color: #38bdf8; }
.initials-avatar.gray { background-color: #6b7280; }
.initials-avatar.lime { background-color: #84cc16; }
.initials-avatar.gold { background-color: #facc15; }
.initials-avatar.darkblue { background-color: #1e40af; }
.initials-avatar.cyan { background-color: #06b6d4; }
.initials-avatar.darkpink { background-color: #be185d; }
.initials-avatar.mint { background-color: #2dd4bf; }
.initials-avatar.magenta { background-color: #d946ef; }
.initials-avatar.indigo { background-color: #6366f1; }
.initials-avatar.emerald { background-color: #059669; }
.initials-avatar.stadium { background-color: #22c55e; }
.initials-avatar.copper { background-color: #b45309; }
.initials-avatar.sky { background-color: #0ea5e9; }
.initials-avatar.coral { background-color: #fb7185; }
.initials-avatar.royal { background-color: #2563eb; }
.initials-avatar.rose { background-color: #f43f5e; }
.initials-avatar.default { background-color: #888888; }

.post-title {
    font-family: "Space Grotesk", sans-serif;
    font-size: 1.25em;
    font-weight: 700;
    margin: 0;
    padding: 20px 24px 8px;
    color: #f1f5f9;
    line-height: 1.35;
    letter-spacing: -0.02em;
}

.post-title .post-title-link {
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    display: inline;
}

.post-title .post-title-link:hover {
    color: #facc15;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.post-image {
    width: 100%;
    border-radius: 8px;
    margin-bottom: 15px;
    max-height: 300px;
    object-fit: cover;
}
.post-content {
    font-size: 0.95em;
    color: #94a3b8;
    line-height: 1.7;
    margin: 0;
    padding: 8px 24px 16px;
    word-wrap: break-word;
    word-break: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
    max-width: 100%;
}

/* Rich markup inside feed / card bodies (headings, media, lists, code) */
.post-content img,
.post-content video,
.post-content iframe,
.post-content svg {
    max-width: 100%;
    height: auto;
}

.post-content iframe {
    aspect-ratio: 16 / 9;
    min-height: 180px;
}

.post-content h1 { font-size: 1.45em; font-weight: 700; margin: 0.85em 0 0.45em; line-height: 1.25; color: #e8e8f4; }
.post-content h2 { font-size: 1.28em; font-weight: 700; margin: 0.8em 0 0.4em; line-height: 1.28; color: #e2e8f0; }
.post-content h3 { font-size: 1.12em; font-weight: 700; margin: 0.75em 0 0.35em; line-height: 1.3; color: #e2e8f0; }
.post-content h4, .post-content h5, .post-content h6 {
    font-size: 1.05em;
    font-weight: 600;
    margin: 0.65em 0 0.3em;
    line-height: 1.35;
    color: #cbd5e1;
}

.post-content pre {
    white-space: pre-wrap;
    word-break: break-word;
    overflow-wrap: break-word;
    overflow-x: auto;
    max-width: 100%;
    background: rgba(0, 0, 0, 0.35);
    padding: 12px 14px;
    border-radius: 8px;
    font-size: 0.88em;
    margin: 12px 0;
}

.post-content blockquote {
    margin: 12px 0;
    padding: 10px 14px;
    border-left: 4px solid #3b82f6;
    background: rgba(59, 130, 246, 0.08);
    color: #cbd5e1;
}

.post-content ul,
.post-content ol {
    padding-left: 1.35em;
    margin: 0.6em 0;
}

.post-content li {
    margin: 0.25em 0;
}

.post-content hr {
    border: none;
    border-top: 1px solid rgba(100, 116, 139, 0.35);
    margin: 1.25em 0;
}

.post-content table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    font-size: 0.92em;
    margin: 12px 0;
}

.post-content table td,
.post-content table th {
    border: 1px solid rgba(100, 116, 139, 0.35);
    padding: 6px 10px;
    word-break: break-word;
}

.feed-content-empty {
    color: #64748b;
    font-style: italic;
    margin: 0;
}

.feed-content-loading {
    color: rgba(226, 232, 240, 0.72);
    font-style: normal;
    margin: 0;
}

.feed-load-more-sentinel {
    width: 100%;
    height: 1px;
}

.main-feed-post-content {
    overflow-x: auto;
}

/* Mobile Post Title & Content Optimization */
@media (max-width: 768px) {
    .post-title {
        font-size: 18px !important;
        font-weight: 700 !important;
        line-height: 1.35 !important;
        padding: 12px 16px 4px !important;
        margin: 0 !important;
        color: #f1f5f9 !important;
        letter-spacing: -0.2px;
    }
    
    .post-content {
        font-size: 16px !important;
        line-height: 1.65;
        padding: 6px 16px 12px !important;
        margin: 0 !important;
        word-break: break-word;
        overflow-wrap: anywhere;
        color: #b8c0cc !important;
    }
    
    /* Handle long URLs and unbreakable content */
    .post-content a {
        word-break: break-all;
        overflow-wrap: anywhere;
    }
    
    /* Handle code blocks if any */
    .post-content code {
        word-break: break-all;
        white-space: pre-wrap;
        overflow-wrap: anywhere;
    }
    
    /* Handle pre-formatted text */
    .post-content pre {
        white-space: pre-wrap;
        word-break: break-word;
        overflow-wrap: break-word;
        overflow-x: auto;
        max-width: 100%;
    }
    
    /* Handle images in content */
    .post-content img {
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain;
    }
    
    /* Handle tables in content */
    .post-content table {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        display: block;
        white-space: nowrap;
    }
    
    .post-content table td,
    .post-content table th {
        padding: 4px 8px;
        font-size: 0.85em;
        word-break: break-word;
    }
    
    /* Handle blockquotes */
    .post-content blockquote {
        margin: 10px 0;
        padding: 10px 15px;
        border-left: 4px solid #3b82f6;
        background: rgba(59, 130, 246, 0.1);
        max-width: 100%;
        box-sizing: border-box;
        word-wrap: break-word;
    }
    
    /* Handle lists */
    .post-content ul,
    .post-content ol {
        padding-left: 20px;
        max-width: 100%;
    }
    
    .post-content li {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}

@media (max-width: 480px) {
    .post-title {
        font-size: 17px !important;
        padding: 10px 14px 4px !important;
    }
    
    .post-content {
        font-size: 15px !important;
        line-height: 1.6;
        padding: 6px 14px 10px !important;
    }
    
    .post-footer {
        padding: 10px 14px 12px;
    }
    
    .post-footer .stats {
        gap: 4px;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    
    .post-footer .stats::-webkit-scrollbar {
        display: none;
    }
    
    .post-footer .stats span,
    .post-footer .stats button {
        font-size: 13px !important;
        font-weight: 600;
        padding: 6px 10px !important;
        white-space: nowrap;
        flex-shrink: 0;
    }
}

.post-content p {
    margin-bottom: 1em;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.nuzler-section {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #2a2a4a;
}
.nuzler-section h3 {
    margin-bottom: 10px;
    font-size: 1.1em;
    font-weight: 700;
}
.nuzler-link {
    color: #facc15;
    font-weight: 700;
    text-decoration: underline;
}
.post-footer {
    display: flex;
    align-items: center;
    padding: 16px 24px 18px;
    border-top: 1px solid rgba(148, 163, 184, 0.08);
}
.post-footer .stats {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    width: 100%;
}
.post-footer .stats span {
    position: relative;
    font-size: 0.88em;
    color: #8892a4;
    cursor: pointer;
    padding: 6px 14px;
    margin: 0;
    transition: all 0.2s ease;
    border-radius: 10px;
    font-weight: 500;
}
.post-footer .stats span:hover {
    background: rgba(255, 255, 255, 0.06);
}

.post-footer .stats .hits {
    cursor: default;
    font-weight: 600;
    font-size: 0.78em;
    opacity: 0.85;
    letter-spacing: 0.3px;
    font-family: inherit;
    border-radius: 8px;
    padding: 4px 8px;
}

.post-footer .stats span:not(.hits)::after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #facc15; /* Default yellow underline */
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

/* Tier-based underline colors for interaction buttons */
.tier-red .post-footer .stats span:not(.hits)::after {
    background-color: #ff4444 !important;
}
.tier-blue .post-footer .stats span:not(.hits)::after {
    background-color: #409eff !important;
}
.tier-orange .post-footer .stats span:not(.hits)::after {
    background-color: #f97316 !important;
}
.tier-purple .post-footer .stats span:not(.hits)::after {
    background-color: #b388ff !important;
}
.tier-green .post-footer .stats span:not(.hits)::after {
    background-color: #10b981 !important;
}
.tier-yellow .post-footer .stats span:not(.hits)::after {
    background-color: #eab308 !important;
}
.tier-pink .post-footer .stats span:not(.hits)::after {
    background-color: #ff85b3 !important;
}
.tier-teal .post-footer .stats span:not(.hits)::after { background-color: #14b8a6 !important; }
.tier-lightblue .post-footer .stats span:not(.hits)::after { background-color: #38bdf8 !important; }
.tier-gray .post-footer .stats span:not(.hits)::after { background-color: #6b7280 !important; }
.tier-lime .post-footer .stats span:not(.hits)::after { background-color: #84cc16 !important; }
.tier-gold .post-footer .stats span:not(.hits)::after { background-color: #facc15 !important; }
.tier-darkblue .post-footer .stats span:not(.hits)::after { background-color: #1e40af !important; }
.tier-cyan .post-footer .stats span:not(.hits)::after { background-color: #06b6d4 !important; }
.tier-violet .post-footer .stats span:not(.hits)::after { background-color: #8b45c5 !important; }
.tier-darkpink .post-footer .stats span:not(.hits)::after { background-color: #be185d !important; }
.tier-mint .post-footer .stats span:not(.hits)::after { background-color: #2dd4bf !important; }
.tier-magenta .post-footer .stats span:not(.hits)::after { background-color: #d946ef !important; }
.tier-indigo .post-footer .stats span:not(.hits)::after { background-color: #6366f1 !important; }
.tier-emerald .post-footer .stats span:not(.hits)::after { background-color: #059669 !important; }
.tier-stadium .post-footer .stats span:not(.hits)::after { background-color: #22c55e !important; }
.tier-copper .post-footer .stats span:not(.hits)::after { background-color: #b45309 !important; }
.tier-sky .post-footer .stats span:not(.hits)::after { background-color: #0ea5e9 !important; }
.tier-coral .post-footer .stats span:not(.hits)::after { background-color: #fb7185 !important; }
.tier-royal .post-footer .stats span:not(.hits)::after { background-color: #2563eb !important; }
.tier-rose .post-footer .stats span:not(.hits)::after { background-color: #f43f5e !important; }
.tier-meme .post-footer .stats span:not(.hits)::after { background-color: #ff4fd8 !important; }

.post-footer .stats span:not(.hits):hover::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

.post-footer .stats span:not(.hits):hover {
    color: #fff;
}

/* Remove old underline animations from footer stats */
.post-footer .stats span::after {
    content: none !important;
    display: none !important;
}

/* Tier-based hover colors for interaction buttons */
.tier-red .post-footer .stats span:not(.hits):hover {
    color: #ff4444 !important;
}
.tier-blue .post-footer .stats span:not(.hits):hover {
    color: #409eff !important;
}
.tier-orange .post-footer .stats span:not(.hits):hover {
    color: #f97316 !important;
}
.tier-purple .post-footer .stats span:not(.hits):hover {
    color: #b388ff !important;
}
.tier-green .post-footer .stats span:not(.hits):hover {
    color: #10b981 !important;
}
.tier-yellow .post-footer .stats span:not(.hits):hover {
    color: #eab308 !important;
}

.tier-pink .post-footer .stats span:not(.hits):hover {
    color: #ff85b3 !important;
}
.tier-teal .post-footer .stats span:not(.hits):hover { color: #14b8a6 !important; }
.tier-lightblue .post-footer .stats span:not(.hits):hover { color: #38bdf8 !important; }
.tier-gray .post-footer .stats span:not(.hits):hover { color: #6b7280 !important; }
.tier-lime .post-footer .stats span:not(.hits):hover { color: #84cc16 !important; }
.tier-gold .post-footer .stats span:not(.hits):hover { color: #facc15 !important; }
.tier-darkblue .post-footer .stats span:not(.hits):hover { color: #1e40af !important; }
.tier-cyan .post-footer .stats span:not(.hits):hover { color: #06b6d4 !important; }
.tier-violet .post-footer .stats span:not(.hits):hover { color: #8b45c5 !important; }
.tier-darkpink .post-footer .stats span:not(.hits):hover { color: #be185d !important; }
.tier-mint .post-footer .stats span:not(.hits):hover { color: #2dd4bf !important; }
.tier-magenta .post-footer .stats span:not(.hits):hover { color: #d946ef !important; }
.tier-indigo .post-footer .stats span:not(.hits):hover { color: #6366f1 !important; }
.tier-emerald .post-footer .stats span:not(.hits):hover { color: #059669 !important; }
.tier-stadium .post-footer .stats span:not(.hits):hover { color: #22c55e !important; }
.tier-copper .post-footer .stats span:not(.hits):hover { color: #b45309 !important; }
.tier-sky .post-footer .stats span:not(.hits):hover { color: #0ea5e9 !important; }
.tier-coral .post-footer .stats span:not(.hits):hover { color: #fb7185 !important; }
.tier-royal .post-footer .stats span:not(.hits):hover { color: #2563eb !important; }
.tier-rose .post-footer .stats span:not(.hits):hover { color: #f43f5e !important; }

.post-footer .stats span:last-child {
    margin-right: 0;
}

/* Mobile-specific styles for interaction buttons */
@media (max-width: 768px) {
    .post-footer {
        padding: 12px 16px 14px;
    }
    
    .post-footer .stats {
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        gap: 6px;
    }

    .post-footer .stats::-webkit-scrollbar {
        display: none;
    }

    .post-footer .stats span,
    .post-footer .stats button {
        margin: 0 !important;
        font-size: 14px;
        display: flex;
        align-items: center;
        padding: 6px 12px;
        white-space: nowrap;
        flex-shrink: 0;
    }

    .share-nuzler-link {
        padding: 6px 14px !important;
        border-width: 1px !important;
        font-size: 14px !important;
    }

    .post-footer .stats .hits {
        padding: 6px 10px !important;
    }
}

/* Nuzed control is a <button> (clickable); match stats span appearance */
.post-footer .stats button.nuze-btn {
    background: none;
    border: none;
    font: inherit;
    font-size: 0.88em;
    font-weight: 500;
    color: #8892a4;
    cursor: pointer;
    padding: 6px 14px;
    margin: 0;
    border-radius: 10px;
    transition: all 0.2s ease;
    appearance: none;
    -webkit-appearance: none;
}
.post-footer .stats button.nuze-btn:hover {
    background: rgba(100, 116, 139, 0.12);
}

.post.tier-red .post-footer .stats button.nuze-btn:hover { color: #ff4444 !important; }
.post.tier-blue .post-footer .stats button.nuze-btn:hover { color: #409eff !important; }
.post.tier-orange .post-footer .stats button.nuze-btn:hover { color: #f97316 !important; }
.post.tier-purple .post-footer .stats button.nuze-btn:hover { color: #b388ff !important; }
.post.tier-green .post-footer .stats button.nuze-btn:hover { color: #10b981 !important; }
.post.tier-yellow .post-footer .stats button.nuze-btn:hover { color: #eab308 !important; }
.post.tier-pink .post-footer .stats button.nuze-btn:hover { color: #ff85b3 !important; }
.post.tier-teal .post-footer .stats button.nuze-btn:hover { color: #14b8a6 !important; }
.post.tier-lightblue .post-footer .stats button.nuze-btn:hover { color: #38bdf8 !important; }
.post.tier-gray .post-footer .stats button.nuze-btn:hover { color: #6b7280 !important; }
.post.tier-lime .post-footer .stats button.nuze-btn:hover { color: #84cc16 !important; }
.post.tier-gold .post-footer .stats button.nuze-btn:hover { color: #facc15 !important; }
.post.tier-darkblue .post-footer .stats button.nuze-btn:hover { color: #1e40af !important; }
.post.tier-cyan .post-footer .stats button.nuze-btn:hover { color: #06b6d4 !important; }
.post.tier-violet .post-footer .stats button.nuze-btn:hover { color: #8b45c5 !important; }
.post.tier-darkpink .post-footer .stats button.nuze-btn:hover { color: #be185d !important; }
.post.tier-mint .post-footer .stats button.nuze-btn:hover { color: #2dd4bf !important; }
.post.tier-magenta .post-footer .stats button.nuze-btn:hover { color: #d946ef !important; }
.post.tier-indigo .post-footer .stats button.nuze-btn:hover { color: #6366f1 !important; }
.post.tier-emerald .post-footer .stats button.nuze-btn:hover { color: #059669 !important; }
.post.tier-stadium .post-footer .stats button.nuze-btn:hover { color: #22c55e !important; }
.post.tier-copper .post-footer .stats button.nuze-btn:hover { color: #b45309 !important; }
.post.tier-sky .post-footer .stats button.nuze-btn:hover { color: #0ea5e9 !important; }
.post.tier-coral .post-footer .stats button.nuze-btn:hover { color: #fb7185 !important; }
.post.tier-royal .post-footer .stats button.nuze-btn:hover { color: #2563eb !important; }
.post.tier-rose .post-footer .stats button.nuze-btn:hover { color: #f43f5e !important; }
.post.tier-meme .post-footer .stats button.nuze-btn:hover { color: #ff4fd8 !important; }

/* Nuzed button active state */
.post-footer .stats .nuze-btn.active {
    color: #facc15 !important;
    font-weight: 500;
}

.post-footer .stats .nuze-btn.active::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

/* Tier-based active state colors for nuzed buttons */
.tier-red .post-footer .stats .nuze-btn.active {
    color: #ff4444 !important;
}
.tier-blue .post-footer .stats .nuze-btn.active {
    color: #409eff !important;
}
.tier-orange .post-footer .stats .nuze-btn.active {
    color: #f97316 !important;
}
.tier-purple .post-footer .stats .nuze-btn.active {
    color: #b388ff !important;
}
.tier-green .post-footer .stats .nuze-btn.active {
    color: #10b981 !important;
}
.tier-yellow .post-footer .stats .nuze-btn.active {
    color: #eab308 !important;
}
.tier-pink .post-footer .stats .nuze-btn.active {
    color: #ff85b3 !important;
}
.tier-darkpink .post-footer .stats .nuze-btn.active {
    color: #be185d !important;
}
.tier-mint .post-footer .stats .nuze-btn.active {
    color: #2dd4bf !important;
}
.tier-magenta .post-footer .stats .nuze-btn.active {
    color: #d946ef !important;
}
.tier-indigo .post-footer .stats .nuze-btn.active {
    color: #6366f1 !important;
}
.tier-emerald .post-footer .stats .nuze-btn.active {
    color: #059669 !important;
}
.tier-stadium .post-footer .stats .nuze-btn.active {
    color: #22c55e !important;
}
.tier-copper .post-footer .stats .nuze-btn.active {
    color: #b45309 !important;
}
.tier-sky .post-footer .stats .nuze-btn.active {
    color: #0ea5e9 !important;
}
.tier-coral .post-footer .stats .nuze-btn.active {
    color: #fb7185 !important;
}
.tier-royal .post-footer .stats .nuze-btn.active {
    color: #2563eb !important;
}
.tier-rose .post-footer .stats .nuze-btn.active {
    color: #f43f5e !important;
}
.tier-meme .post-footer .stats .nuze-btn.active {
    color: #ff4fd8 !important;
}

/* Comments System Styles */
.comment-btn {
    cursor: pointer;
    transition: color 0.3s ease;
}

.comment-btn:hover {
    color: #facc15 !important;
}

/* Tier-based comment button hover colors */
.tier-red .comment-btn:hover {
    color: #ff4444 !important;
}
.tier-blue .comment-btn:hover {
    color: #409eff !important;
}
.tier-orange .comment-btn:hover {
    color: #f97316 !important;
}
.tier-purple .comment-btn:hover {
    color: #b388ff !important;
}
.tier-green .comment-btn:hover {
    color: #10b981 !important;
}
.tier-yellow .comment-btn:hover {
    color: #eab308 !important;
}
.tier-pink .comment-btn:hover {
    color: #ff85b3 !important;
}
.tier-darkpink .comment-btn:hover {
    color: #be185d !important;
}
.tier-mint .comment-btn:hover {
    color: #2dd4bf !important;
}
.tier-magenta .comment-btn:hover {
    color: #d946ef !important;
}
.tier-indigo .comment-btn:hover {
    color: #6366f1 !important;
}
.tier-emerald .comment-btn:hover {
    color: #059669 !important;
}
.tier-stadium .comment-btn:hover {
    color: #22c55e !important;
}
.tier-copper .comment-btn:hover {
    color: #b45309 !important;
}
.tier-sky .comment-btn:hover {
    color: #0ea5e9 !important;
}
.tier-coral .comment-btn:hover {
    color: #fb7185 !important;
}
.tier-royal .comment-btn:hover {
    color: #2563eb !important;
}
.tier-rose .comment-btn:hover {
    color: #f43f5e !important;
}
.tier-meme .comment-btn:hover {
    color: #ff4fd8 !important;
}

/* Tier-based colors for hits (Share button uses inline tier hex from script.js) */
.post-footer-red .stats .hits {
    color: #ff4444 !important;
}

.post-footer-blue .stats .hits {
    color: #409eff !important;
}

.post-footer-orange .stats .hits {
    color: #f97316 !important;
}

.post-footer-purple .stats .hits {
    color: #b388ff !important;
}

.post-footer-green .stats .hits {
    color: #10b981 !important;
}

.post-footer-yellow .stats .hits {
    color: #eab308 !important;
}

.post-footer-pink .stats .hits {
    color: #ff85b3 !important;
}

.post-footer-mint .stats .hits {
    color: #2dd4bf !important;
}

.post-footer-magenta .stats .hits {
    color: #d946ef !important;
}

.post-footer-indigo .stats .hits {
    color: #6366f1 !important;
}
.post-footer-royal .stats .hits {
    color: #2563eb !important;
}
.post-footer-rose .stats .hits {
    color: #f43f5e !important;
}

.comments-section {
    margin: 0;
    padding: 18px 24px 22px;
    background: rgba(15, 15, 35, 0.6);
    border-top: 1px solid rgba(148, 163, 184, 0.08);
    border-radius: 0 0 20px 20px;
}

.comment-form {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin-bottom: 10px;
}

.comment-form textarea {
    flex: 1;
    padding: 14px 16px;
    border: 1px solid rgba(100, 116, 139, 0.2);
    border-radius: 12px;
    background: rgba(10, 10, 30, 0.6);
    color: #e2e8f0;
    font-family: inherit;
    font-size: 14px;
    resize: none;
    min-height: 56px;
    max-height: 80px;
    line-height: 1.4;
}

.comment-form textarea:focus {
    outline: none;
    border-color: rgba(59, 130, 246, 0.4);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.08);
}

.comment-form textarea::placeholder {
    color: #64748b;
    font-size: 12px;
}

.post-comment-btn {
    margin-top: 12px;
    padding: 10px 20px;
    background: #3b82f6;
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.2s ease;
    white-space: nowrap;
    align-self: flex-end;
}

.post-comment-btn:hover {
    background: #2563eb;
    transform: translateY(-1px);
}

.post-comment-btn:active {
    transform: translateY(0);
}

.comments-list {
    max-height: 300px;
    overflow-y: auto;
}

.comment {
    background: rgba(10, 10, 30, 0.5);
    border: 1px solid rgba(100, 116, 139, 0.12);
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
    transition: background-color 0.2s ease;
    text-align: left;
}

.comment:last-child {
    margin-bottom: 0;
}

.comment.new-comment {
    background: rgba(59, 130, 246, 0.08);
    border-color: rgba(59, 130, 246, 0.25);
}

.comment-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    text-align: left;
    margin-bottom: 8px;
}

.comment-author {
    font-weight: 600;
    font-size: 14px;
}

.comment-author.blue { color: #409eff; }
.comment-author.gold { color: #facc15; }
.comment-author.purple { color: #b388ff; }
.comment-author.brown { color: #cd853f; }
.comment-author.pink { color: #ff85b3; }
.comment-author.red { color: #ff4444; }
.comment-author.default { color: #888; }

.comment-time {
    font-size: 13px;
    color: #64748b;
    text-align: left;
}

.comment-content {
    color: #b0b8c8;
    line-height: 1.7;
    font-size: 15px;
    white-space: pre-wrap;
    word-wrap: break-word;
    text-align: left;
}

.no-comments {
    text-align: center;
    color: #64748b;
    font-style: italic;
    padding: 24px;
    margin: 0;
    font-size: 14px;
}

/* Responsive Comments */
@media (max-width: 768px) {
    .comments-section {
        padding: 16px 16px;
    }
    
    .comment-form textarea {
        font-size: 16px; /* Prevents zoom on iOS */
        min-height: 60px;
        padding: 14px 16px;
    }
    
    .comment {
        padding: 14px 14px;
    }
    
    .comment-author {
        font-size: 14px;
    }
    
    .comment-time {
        font-size: 13px;
    }
    
    .comment-content {
        font-size: 15px;
        line-height: 1.65;
    }
    
    .comment-header {
        flex-direction: row;
        align-items: center;
        gap: 8px;
    }

    .no-comments {
        font-size: 15px;
    }
    
    .post-comment-btn {
        font-size: 15px;
        padding: 12px 22px;
    }
}

.post-footer .stat-item {
    font-size: 0.85em;
    color: #888;
    cursor: pointer;
    padding: 5px 10px;
    margin-right: 10px;
    transition: color 0.2s ease-in-out;
}

.post-footer .stat-item:hover {
    color: #facc15;
}

.post-actions {
    margin-top: 15px;
    display: flex;
    gap: 10px;
}

.action-btn {
    background-color: #2a2a4a;
    color: #c0c0e0;
    border: 1px solid #444;
    padding: 8px 15px;
    border-radius: 20px;
    cursor: pointer;
    font-weight: 700;
    transition: all 0.2s ease-in-out;
}

.action-btn:hover {
    background-color: #facc15;
    color: #111137;
    border-color: #facc15;
    transform: translateY(-2px);
}

/* Load More */
.load-more {
    text-align: center;
    padding: 15px;
    font-size: 1em;
    background: linear-gradient(145deg, #3b82f6, #f7b42c);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    cursor: pointer;
    margin-bottom: 20px;
}

/* Loading Wheel Animation */
.loading-wheel {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 20px 0;
    padding: 10px;
}

.loading-wheel .spinner {
    width: 40px;
    height: 40px;
    border: 4px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    border-top: 4px solid #facc15;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@media (max-width: 768px) {
    .loading-wheel .spinner {
        width: 30px;
        height: 30px;
        border-width: 3px;
        border-top-width: 3px;
    }
}

/* Unverified Mark */
.unverified {
    color: #ff4444;
    cursor: pointer;
    font-weight: bold;
    padding: 5px 10px;
    border-radius: 4px;
    background: rgba(255, 68, 68, 0.1);
    transition: all 0.3s ease;
}

.unverified:hover {
    background: rgba(255, 68, 68, 0.2);
    transform: translateY(-2px);
}

/* Modal Styles */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    overflow-y: auto;
}

.modal-content {
    background: #1a1a2e;
    margin: 5% auto;
    padding: 20px;
    border-radius: 8px;
    width: 90%;
    max-width: 600px;
    position: relative;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.modal-title {
    color: #facc15;
    text-align: center;
    margin-bottom: 20px;
    font-size: 1.5em;
}

.close-modal {
    position: absolute;
    right: 20px;
    top: 20px;
    font-size: 1.5em;
    color: #fff;
    cursor: pointer;
    transition: color 0.3s;
    z-index: 1001;
}

.close-modal:hover {
    color: #facc15;
}

.account-type {
    display: flex;
    align-items: flex-start;
    padding: 20px;
    border: 1px solid #1e3a8a;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: rgba(30, 58, 138, 0.1);
    margin-bottom: 15px;
}

.account-type:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    background-color: rgba(30, 58, 138, 0.2);
}

.account-type.selected {
    border: 2px solid #facc15;
    box-shadow: 0 0 10px rgba(250, 204, 21, 0.3);
    background-color: rgba(250, 204, 21, 0.1);
}

.account-color {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-right: 15px;
    margin-top: 3px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #333;
}

.account-color::after {
    content: "✓";
    font-size: 16px;
    font-weight: bold;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
}

.account-color.blue {
    background-color: #409eff;
    border: 2px solid #409eff;
}

.account-color.gold {
    background-color: #facc15;
    border: 2px solid #facc15;
}

.account-color.pink {
    background-color: #ff85b3;
    border: 2px solid #ff85b3;
}

.account-color.brown {
    background-color: #cd853f;
    border: 2px solid #cd853f;
}

.account-color.purple {
    background-color: #b388ff;
    border: 2px solid #b388ff;
}

.account-color.red {
    background-color: #ff4444;
    border: 2px solid #ff4444;
}

.account-details {
    flex: 1;
}

.account-name {
    font-size: 22px;
    margin: 0 0 10px 0;
    color: #ffffff;
    font-weight: bold;
}

.account-price {
    font-size: 18px;
    color: #facc15;
    margin: 0 0 15px 0;
    font-weight: bold;
}

.account-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.account-features li {
    color: #e0e0e0;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    font-size: 16px;
}

.account-features li::before {
    content: "✓";
    color: #facc15;
    margin-right: 10px;
    font-weight: bold;
}

.start-verification {
    display: block;
    width: 100%;
    padding: 15px;
    background: linear-gradient(145deg, #3b82f6, #f7b42c);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    margin-top: 20px;
    transition: all 0.3s ease;
}

.start-verification:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(250, 204, 21, 0.3);
}

.close-modal {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 24px;
    color: #ffffff;
    cursor: pointer;
    transition: all 0.3s ease;
}

.close-modal:hover {
    color: #facc15;
    transform: scale(1.1);
}

/* Verification Success Styles */
.verification-success {
    background-color: rgba(30, 58, 138, 0.2);
    border-radius: 10px;
    padding: 30px;
    text-align: center;
    margin: 20px 0;
    border: 1px solid #1e3a8a;
}

.success-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(145deg, #3b82f6, #f7b42c);
    border-radius: 50%;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    color: white;
    font-weight: bold;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.verification-success p {
    margin-bottom: 15px;
    font-size: 18px;
    color: #e0e0e0;
    line-height: 1.5;
}

.verification-success p strong {
    color: #facc15;
}

.verification-success .blue-checkmark,
.verification-success .gold-checkmark,
.verification-success .purple-checkmark,
.verification-success .pink-checkmark,
.verification-success .brown-checkmark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-weight: bold;
    margin: 0 5px;
    vertical-align: middle;
}

.verification-success .blue-checkmark {
    background: rgba(64, 158, 255, 0.2);
    border: 2px solid #409eff;
    color: #409eff;
}

.verification-success .gold-checkmark {
    background: rgba(250, 204, 21, 0.2);
    border: 2px solid #facc15;
    color: #facc15;
}

.verification-success .purple-checkmark {
    background: rgba(179, 136, 255, 0.2);
    border: 2px solid #b388ff;
    color: #b388ff;
}

.verification-success .pink-checkmark {
    background: rgba(255, 133, 179, 0.2);
    border: 2px solid #ff85b3;
    color: #ff85b3;
}

.verification-success .brown-checkmark {
    background: rgba(205, 133, 63, 0.2);
    border: 2px solid #cd853f;
    color: #cd853f;
}

.verification-success .red-checkmark {
    background: rgba(255, 68, 68, 0.2);
    border: 2px solid #ff4444;
    color: #ff4444;
}

/* Mobile Responsive Styles */
@media (max-width: 768px) {
    #signupContent {
        width: 95%;
        margin: 10px auto;
        padding: 15px;
    }

    .account-type {
        padding: 15px;
    }

    .account-name {
        font-size: 18px;
    }

    .account-price {
        font-size: 16px;
    }

    .account-features li {
        font-size: 14px;
    }
    
    .verification-success {
        padding: 20px;
    }
    
    .success-icon {
        width: 60px;
        height: 60px;
        font-size: 30px;
    }
    
    .verification-success p {
        font-size: 16px;
    }
}

/* Tooltip */
.tooltip {
    position: absolute;
    background: #111137;
    color: #fff;
    padding: 10px;
    border-radius: 6px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    z-index: 100;
    max-width: 300px;
    display: none;
}

/* Footer */
footer {
    text-align: center;
    padding: 15px 0;
    background: #0a0a2a;
    color: #bbb;
    font-size: 0.8em;
    margin-top: 20px;
}

/* Hero Slogan — below header on narrow screens (typing effect synced via header-typing.js) */
.hero-slogan {
    display: none;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
}

/* Mobile Optimization */
@media (max-width: 600px) {
    /* Prevent zoom on input focus */
    input[type="text"],
    input[type="search"],
    textarea,
    select {
        font-size: 16px !important;
        transform: translateZ(0);
        -webkit-transform: translateZ(0);
        -webkit-user-select: text;
        user-select: text;
    }
    
    header.site-header {
        grid-template-columns: auto auto;
        padding: 5px 14px;
        gap: 8px;
        background: linear-gradient(135deg, #1e3a8a, #3b82f6);
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.28);
    }

    header.site-header .logo {
        grid-column: 1;
    }

    header.site-header .header-actions {
        grid-column: 2;
    }
    
    /* Hide in-bar slogan on mobile — hero-slogan row shows typing effect below */
    header.site-header .slogan {
        display: none !important;
    }
    
    /* Simple hero slogan on mobile - Just text */
    .hero-slogan {
        display: block;
        text-align: center;
        padding: 8px 16px 6px 16px;
        margin: 6px 0 4px 0;
        font-weight: 500;
        color: rgba(255, 255, 255, 0.9);
        line-height: 1.35;
        font-size: 0.75rem;
        letter-spacing: 0.04em;
        min-height: 0;
    }
    
    .hero-slogan .typing-text {
        display: inline-block;
        border-right: 1px solid rgba(250, 204, 21, 0.75);
        animation: blink-caret 0.75s step-end infinite;
        font-size: inherit;
        padding-right: 2px;
        font-weight: 500;
    }
    
    .logo {
        flex: 0 0 auto;
        font-size: 1.2rem;
    }
    
    .profile-email {
        flex: 0 0 auto;
        font-size: 0.78rem;
    }
    
    /* Modern mobile main container */
    .main-container {
        padding: 0 16px 20px 16px;
        max-width: 100%;
    }
    
    /* Enhanced search container for mobile */
    .search-container {
        margin-bottom: 20px;
        margin-top: 8px;
    }
    
    .search-bar {
        border-radius: 12px;
        padding: 14px 18px;
        font-size: 16px !important;
        border: 2px solid rgba(179, 136, 255, 0.3);
        background: rgba(26, 26, 26, 0.8);
        backdrop-filter: blur(10px);
        transition: all 0.3s ease;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
        -webkit-user-select: text;
        user-select: text;
        transform: translateZ(0);
        -webkit-transform: translateZ(0);
    }
    
    .search-bar:focus {
        border-color: #facc15;
        box-shadow: 0 0 0 3px rgba(250, 204, 21, 0.1);
        background: rgba(26, 26, 26, 0.9);
        outline: none;
        transform: translateZ(0);
        -webkit-transform: translateZ(0);
    }
    
    /* Modern mobile posts */
    .post {
        padding: 18px;
        border-radius: 12px;
        background: rgba(26, 26, 26, 0.8);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.1);
        margin-bottom: 16px;
        transition: all 0.3s ease;
    }
    
    .post:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    }
    
    .post-title {
        font-size: 1.1em;
        font-weight: 500;
        margin-bottom: 12px;
    }
    
    .post-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        margin-top: 12px;
    }
    
    /* Modern tabs — non-feed pages only */
    .tabs:not(.feed-container .tabs) {
        margin-bottom: 24px;
        background: rgba(255, 255, 255, 0.05);
        border-radius: 12px;
        padding: 6px;
        backdrop-filter: blur(10px);
    }
    
    .tab:not(.feed-container .tabs-scroll .tab) {
        border-radius: 8px;
        padding: 12px 16px;
        font-size: 0.9em;
        font-weight: 500;
        transition: all 0.3s ease;
    }
    
    .tab.active:not(.feed-container .tabs-scroll .tab) {
        background: rgba(250, 204, 21, 0.2);
        color: #facc15;
        font-weight: 600;
    }
    
    .add-tab {
        font-size: 1.4em;
        padding: 8px 12px;
        border-radius: 8px;
        transition: all 0.3s ease;
    }
    
    .add-tab-menu {
        width: calc(100vw - 40px);
        max-width: 280px;
        font-size: 0.9em;
        max-height: 300px;
        overflow-y: auto;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }
    
    .add-tab-menu li {
        padding: 10px 12px;
        font-size: 0.9em;
    }
    
    .add-tabs-button {
        padding: 10px;
        font-size: 1em;
    }
    
    .modal {
        width: 92%;
        border-radius: 16px;
        max-height: 85vh;
        overflow-y: auto;
    }
    .checkmark {
        width: 22px;
        height: 22px;
        font-size: 0.8em;
        margin-left: 6px;
    }
    
    .post-header .checkmark {
        margin-left: 4px;
    }
    
    .verification-tooltip {
        /* On mobile, position tooltip below the checkmark */
        top: 115%; /* Place it just below the parent */
        left: 50%;
        right: auto;
        transform: translateX(calc(-50% + 15px)); /* Center horizontally under the checkmark, with a slight nudge to the right */
        font-size: 0.7em;
        padding: 6px 10px;
    }
}

.verification-tooltip {
    position: absolute;
    background: #1a1a3a;
    color: #fff;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 0.8em;
    white-space: nowrap;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    display: none;
    top: -35px;
    left: 50%;
    transform: translateX(-50%);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.checkmark:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

.checkmark:hover .verification-tooltip {
    display: block;
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateX(-50%) translateY(10px); }
    to { opacity: 1; transform: translateX(-50%) translateY(0); }
}

/* Publisher Profile Styles */
.publisher-profile {
    background: #1a1a2e;
    padding: 20px;
    border-radius: 8px;
    color: #fff;
}

.publisher-header {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
    position: relative;
}

.badge-explanation {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    padding: 1rem;
    margin-bottom: 1.5rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.badge-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
    font-weight: 500;
    font-size: 1rem;
    color: #fff;
}

.badge-explanation p {
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.9rem;
    line-height: 1.5;
    margin: 0;
}

.publisher-badge {
    display: flex;
    justify-content: center;
    margin-top: 0.5rem;
}

.publisher-profile-pic {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border: 3px solid rgba(255, 255, 255, 0.2);
    transition: all 0.3s ease;
}

.publisher-info {
    flex: 1;
    min-width: 200px;
}

.publisher-name {
    font-size: 24px;
    margin: 0 0 15px 0;
    color: var(--text-color);
    display: flex;
    align-items: center;
    gap: 10px;
}

.publisher-stats {
    display: flex;
    gap: 20px;
    margin-top: 10px;
}

.stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.stat-value {
    font-size: 20px;
    font-weight: bold;
    color: var(--text-color);
}

.stat-label {
    font-size: 14px;
    color: var(--secondary-text-color);
}

.publisher-description {
    margin: 20px 0;
    color: var(--text-color);
    line-height: 1.5;
}

.publisher-posts {
    margin-top: 2rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 12px;
}

.publisher-posts h3 {
    margin-bottom: 1rem;
    color: #fff;
    font-size: 1.2rem;
}

.posts-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.publisher-post {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    padding: 1rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.publisher-post:hover {
    background: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
}

.publisher-post.active {
    background: rgba(255, 255, 255, 0.1);
    transform: translateY(-2px);
}

.publisher-post .post-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.7);
}

.publisher-post .post-stats {
    display: flex;
    gap: 1rem;
}

.publisher-post .post-title {
    margin: 0.5rem 0;
    color: #fff;
    font-size: 1.1rem;
}

.publisher-post .post-content {
    display: none;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.5;
    margin-top: 0.5rem;
}

.publisher-post.active .post-content {
    display: block;
}

/* Make publisher name clickable */
.author {
    cursor: pointer;
    transition: color 0.3s;
}

.author:hover {
    color: #facc15;
}

/* Publisher Profile Modal */
#publisherModal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1000;
    overflow-y: auto;
}

#publisherContent {
    background-color: #0a0a2a;
    margin: 20px auto;
    padding: 20px;
    border-radius: 10px;
    max-width: 800px;
    width: 90%;
    position: relative;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border: 1px solid #1e3a8a;
}

.publisher-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.publisher-profile-pic {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border: 3px solid var(--border-color);
    cursor: pointer;
    transition: transform 0.3s ease;
}

.publisher-profile-pic:hover {
    transform: scale(1.05);
}

.publisher-info {
    flex: 1;
    min-width: 200px;
}

.publisher-name {
    font-size: 24px;
    margin: 0 0 15px 0;
    color: var(--text-color);
    display: flex;
    align-items: center;
    gap: 10px;
}

.publisher-followers {
    color: var(--secondary-text-color);
    font-size: 14px;
}

.publisher-description {
    margin: 20px 0;
    color: var(--text-color);
    line-height: 1.5;
}

.publisher-posts {
    margin-top: 30px;
}

.publisher-posts h3 {
    margin-bottom: 20px;
    color: var(--text-color);
}

.publisher-post {
    background-color: var(--post-background);
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 20px;
    border: 1px solid var(--border-color);
    cursor: pointer;
    transition: all 0.3s ease;
}

.publisher-post:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.publisher-post.active {
    border: 2px solid #facc15;
    box-shadow: 0 0 10px rgba(250, 204, 21, 0.3);
}

.publisher-post .post-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    font-size: 14px;
    color: var(--secondary-text-color);
}

.publisher-post .post-title {
    margin: 10px 0;
    color: var(--text-color);
    font-size: 18px;
}

.publisher-post .post-content {
    color: var(--text-color);
    line-height: 1.5;
    display: none;
}

.publisher-post.active .post-content {
    display: block;
}

.publisher-post .post-stats {
    display: flex;
    gap: 15px;
}

.publisher-post .post-stats span {
    display: flex;
    align-items: center;
    gap: 5px;
}

/* Mobile Responsive Styles */
@media (max-width: 768px) {
    #publisherContent {
        width: 95%;
        margin: 10px auto;
        padding: 15px;
    }

    .publisher-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 15px;
    }

    .publisher-profile-pic {
        width: 80px;
        height: 80px;
    }

    .publisher-info {
        text-align: center;
    }

    .publisher-name {
        font-size: 20px;
        justify-content: center;
    }

    .publisher-stats {
        justify-content: center;
        gap: 15px;
    }

    .stat-value {
        font-size: 18px;
    }

    .stat-label {
        font-size: 12px;
    }

    .publisher-post {
        padding: 15px;
    }

    .publisher-post .post-header {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }

    .publisher-post .post-stats {
        width: 100%;
        justify-content: space-between;
    }
}

/* Signup Modal */
#signupModal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1000;
    overflow-y: auto;
}

#signupContent {
    background-color: #0a0a2a;
    margin: 20px auto;
    padding: 20px;
    border-radius: 10px;
    max-width: 800px;
    width: 90%;
    position: relative;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border: 1px solid #1e3a8a;
}

.modal-title {
    color: #facc15;
    text-align: center;
    margin-bottom: 20px;
    font-size: 1.5em;
}

.account-types {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin: 20px 0;
    max-height: 70vh;
    overflow-y: auto;
    padding-right: 10px;
}

.account-types::-webkit-scrollbar {
    width: 8px;
}

.account-types::-webkit-scrollbar-track {
    background: #0a0a2a;
    border-radius: 10px;
}

.account-types::-webkit-scrollbar-thumb {
    background: #1e3a8a;
    border-radius: 10px;
}

.account-types::-webkit-scrollbar-thumb:hover {
    background: #3b82f6;
}

.account-type {
    display: flex;
    align-items: flex-start;
    padding: 20px;
    border: 1px solid #1e3a8a;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: rgba(30, 58, 138, 0.1);
    margin-bottom: 15px;
}

.account-type:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    background-color: rgba(30, 58, 138, 0.2);
}

.account-type.selected {
    border: 2px solid #facc15;
    box-shadow: 0 0 10px rgba(250, 204, 21, 0.3);
    background-color: rgba(250, 204, 21, 0.1);
}

.account-color {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-right: 15px;
    margin-top: 3px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #333;
}

.account-color::after {
    content: "✓";
    font-size: 16px;
    font-weight: bold;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
}

.account-color.blue {
    background-color: #409eff;
    border: 2px solid #409eff;
}

.account-color.gold {
    background-color: #facc15;
    border: 2px solid #facc15;
}

.account-color.pink {
    background-color: #ff85b3;
    border: 2px solid #ff85b3;
}

.account-color.brown {
    background-color: #cd853f;
    border: 2px solid #cd853f;
}

.account-color.purple {
    background-color: #b388ff;
    border: 2px solid #b388ff;
}

.account-color.red {
    background-color: #ff4444;
    border: 2px solid #ff4444;
}

.account-details {
    flex: 1;
}

.account-name {
    font-size: 22px;
    margin: 0 0 10px 0;
    color: #ffffff;
    font-weight: bold;
}

.account-price {
    font-size: 18px;
    color: #facc15;
    margin: 0 0 15px 0;
    font-weight: bold;
}

.account-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.account-features li {
    color: #e0e0e0;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    font-size: 16px;
}

.account-features li::before {
    content: "✓";
    color: #facc15;
    margin-right: 10px;
    font-weight: bold;
}

.start-verification {
    display: block;
    width: 100%;
    padding: 15px;
    background: linear-gradient(145deg, #3b82f6, #f7b42c);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    margin-top: 20px;
    transition: all 0.3s ease;
}

.start-verification:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(250, 204, 21, 0.3);
}

.close-modal {
    position: absolute;
    top: 15px;
    right: 15px;
    font-size: 24px;
    color: #ffffff;
    cursor: pointer;
    transition: all 0.3s ease;
}

.close-modal:hover {
    color: #facc15;
    transform: scale(1.1);
}

/* Verification Success Styles */
.verification-success {
    background-color: rgba(30, 58, 138, 0.2);
    border-radius: 10px;
    padding: 30px;
    text-align: center;
    margin: 20px 0;
    border: 1px solid #1e3a8a;
}

.success-icon {
    width: 80px;
    height: 80px;
    background: linear-gradient(145deg, #3b82f6, #f7b42c);
    border-radius: 50%;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    color: white;
    font-weight: bold;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.verification-success p {
    margin-bottom: 15px;
    font-size: 18px;
    color: #e0e0e0;
    line-height: 1.5;
}

.verification-success p strong {
    color: #facc15;
}

.verification-success .blue-checkmark,
.verification-success .gold-checkmark,
.verification-success .purple-checkmark,
.verification-success .pink-checkmark,
.verification-success .brown-checkmark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-weight: bold;
    margin: 0 5px;
    vertical-align: middle;
}

.verification-success .blue-checkmark {
    background: rgba(64, 158, 255, 0.2);
    border: 2px solid #409eff;
    color: #409eff;
}

.verification-success .gold-checkmark {
    background: rgba(250, 204, 21, 0.2);
    border: 2px solid #facc15;
    color: #facc15;
}

.verification-success .purple-checkmark {
    background: rgba(179, 136, 255, 0.2);
    border: 2px solid #b388ff;
    color: #b388ff;
}

.verification-success .pink-checkmark {
    background: rgba(255, 133, 179, 0.2);
    border: 2px solid #ff85b3;
    color: #ff85b3;
}

.verification-success .brown-checkmark {
    background: rgba(205, 133, 63, 0.2);
    border: 2px solid #cd853f;
    color: #cd853f;
}

.verification-success .red-checkmark {
    background: rgba(255, 68, 68, 0.2);
    border: 2px solid #ff4444;
    color: #ff4444;
}

/* Mobile Responsive Styles */
@media (max-width: 768px) {
    #signupContent {
        width: 95%;
        margin: 10px auto;
        padding: 15px;
    }

    .account-type {
        padding: 15px;
    }

    .account-name {
        font-size: 18px;
    }

    .account-price {
        font-size: 16px;
    }

    .account-features li {
        font-size: 14px;
    }
    
    .verification-success {
        padding: 20px;
    }
    
    .success-icon {
        width: 60px;
        height: 60px;
        font-size: 30px;
    }
    
    .verification-success p {
        font-size: 16px;
    }
}

.publisher-badge {
    margin-top: 10px;
    display: flex;
    align-items: center;
}

.publisher-badge .checkmark {
    margin: 0;
    position: relative;
}

/* Footer styles */
.site-footer {
    background-color: rgba(0, 0, 0, 0.2);
    padding: 1rem 0;
    text-align: center;
    margin-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-content {
    color: rgba(255, 255, 255, 0.6);
    font-size: 0.9rem;
}

/* Mobile responsiveness for footer */
@media (max-width: 768px) {
    .site-footer {
        padding: 0.8rem 0;
        margin-top: 1.5rem;
    }
    
    .footer-content {
        font-size: 0.8rem;
    }
}

/* Notification styles */
#notification {
    position: fixed;
    bottom: -100px;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 12px 20px;
    border-radius: 20px;
    z-index: 1000;
    font-size: 14px;
    transition: bottom 0.3s ease-in-out;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    text-align: center;
    min-width: 200px;
    max-width: 80%;
}

#notification.show {
    bottom: 30px;
}

@media (max-width: 480px) {
    #notification {
        width: 90%;
        font-size: 13px;
        padding: 10px 15px;
    }
    
    #notification.show {
        bottom: 20px;
    }
    
    .add-tab-menu {
        width: calc(100vw - 20px);
        max-width: 260px;
        left: 50%;
        right: auto;
        transform: translateX(-50%);
    }
}

/* Mobile responsive styles for search bar */
@media (max-width: 768px) {
    .search-bar {
        padding: 10px 15px;
        font-size: 14px;
    }
} 

/* Dropdown Menu Styles */
.add-tab-menu {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #111137;
    border: 1px solid #3b82f6;
    border-radius: 12px;
    width: 90vw;
    max-width: 320px;
    max-height: 70vh;
    z-index: 1000;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.7);
    font-family: 'Outfit', sans-serif;
    /* Use flexbox to manage layout */
    flex-direction: column;
}

.add-tab-menu.visible {
    display: flex;
}

.add-tab-menu .menu-title {
    background: linear-gradient(90deg, #1e3a8a, #3b82f6);
    color: white;
    padding: 15px;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    flex-shrink: 0;
    border-bottom: 1px solid #3b82f6;
    position: relative; /* Needed for positioning the close button */
}

.close-menu-btn {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    font-size: 26px;
    font-weight: 400;
    line-height: 1;
    color: white;
    cursor: pointer;
    transition: transform 0.2s, color 0.2s;
}

.close-menu-btn:hover {
    transform: translateY(-50%) scale(1.2);
    color: #facc15;
}

.add-tab-menu ul {
    list-style: none;
    padding: 8px 0;
    margin: 0;
    overflow-y: auto;
}

/* Custom scrollbar for dropdown */
.add-tab-menu ul::-webkit-scrollbar {
    width: 6px;
}
.add-tab-menu ul::-webkit-scrollbar-track {
    background: #111137;
}
.add-tab-menu ul::-webkit-scrollbar-thumb {
    background: #3b82f6;
    border-radius: 3px;
}
.add-tab-menu ul::-webkit-scrollbar-thumb:hover {
    background: #1e3a8a;
}


.add-tab-menu li {
    padding: 12px 20px;
    cursor: pointer;
    border-bottom: 1px solid #2a2a4a;
    font-size: 15px;
    color: #c0c0e0;
    font-weight: 400;
    display: flex;
    align-items: center;
    transition: background-color 0.2s, color 0.2s;
}

.add-tab-menu li:last-child {
    border-bottom: none;
}

.add-tab-menu li:hover {
    background: #2a2a4a;
    color: #facc15;
}

.add-tab-menu li span {
    margin-right: 12px;
    font-weight: bold;
    color: #ff4444;
    transition: color 0.2s;
}

.add-tab-menu li.selected {
    background: #2a2a4a;
    color: #facc15;
    font-weight: 500;
}

.add-tab-menu li.selected span {
    color: #4ade80;
}

.add-tabs-button {
    background: linear-gradient(145deg, #3b82f6, #facc15);
    color: white;
    border: none;
    padding: 15px;
    width: 100%;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s ease;
    margin-top: auto;
    flex-shrink: 0;
    border-top: 1px solid #3b82f6;
}

.add-tabs-button:hover {
    background: linear-gradient(145deg, #facc15, #3b82f6);
} 

/* Image Gallery Styles */
.image-gallery {
    margin: 15px 0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    display: flex;
    gap: 4px;
    max-height: 300px;
}

.gallery-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
    transition: transform 0.3s ease, filter 0.3s ease;
    cursor: pointer;
}

.gallery-image:hover {
    transform: scale(1.02);
    filter: brightness(1.1);
}

/* Single Image Layout */
.image-gallery.single-image {
    max-height: 400px;
}

.image-gallery.single-image .gallery-image {
    border-radius: 8px;
}

/* Two Images Layout */
.image-gallery.two-images {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
}

/* Three Images Layout */
.image-gallery.three-images {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
}

.image-gallery.three-images .gallery-image.large {
    grid-row: span 2;
}

.image-gallery.three-images .small-images {
    display: grid;
    grid-template-rows: 1fr 1fr;
    gap: 4px;
}

/* Four Images Layout */
.image-gallery.four-images {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
}

.image-gallery.four-images .gallery-image.large {
    grid-row: span 3;
}

.image-gallery.four-images .small-images {
    display: grid;
    grid-template-rows: 1fr 1fr 1fr;
    gap: 4px;
}

/* Five+ Images Layout */
.image-gallery.five-plus-images {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
}

.image-gallery.five-plus-images .gallery-image.large {
    grid-row: span 3;
}

.image-gallery.five-plus-images .small-images {
    display: grid;
    grid-template-rows: 1fr 1fr 1fr;
    gap: 4px;
}

.more-images {
    position: relative;
    overflow: hidden;
    border-radius: 4px;
}

.more-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2em;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s ease;
}

.more-overlay:hover {
    background: rgba(0, 0, 0, 0.8);
}

/* Newsletter-style spacing */
.image-gallery + .post-content {
    margin-top: 1rem;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .image-gallery {
        max-height: 250px;
        margin: 10px 0;
    }
    
    .image-gallery.single-image {
        max-height: 300px;
    }
    
    .image-gallery.three-images,
    .image-gallery.four-images,
    .image-gallery.five-plus-images {
        grid-template-columns: 1fr;
    }
    
    .image-gallery.three-images .gallery-image.large,
    .image-gallery.four-images .gallery-image.large,
    .image-gallery.five-plus-images .gallery-image.large {
        grid-row: span 1;
        max-height: 200px;
    }
    
    .image-gallery.three-images .small-images,
    .image-gallery.four-images .small-images,
    .image-gallery.five-plus-images .small-images {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr;
        max-height: 150px;
    }
    
    .image-gallery.four-images .small-images {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
    }
    
    .image-gallery.five-plus-images .small-images {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
    }
}

@media (max-width: 480px) {
    .image-gallery {
        max-height: 200px;
        gap: 2px;
    }
    
    .image-gallery.single-image {
        max-height: 250px;
    }
    
    .more-overlay {
        font-size: 1em;
    }
} 

/* Publisher Tooltip Styles */
.publisher-tooltip {
    position: fixed;
    background: #111137;
    border: 2px solid #3b82f6;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
    z-index: 2000;
    max-width: 280px;
    min-width: 260px;
    font-family: "Outfit", sans-serif;
    animation: tooltipFadeIn 0.3s ease;
}

@keyframes tooltipFadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.publisher-tooltip-header {
    background: linear-gradient(90deg, #1e3a8a, #3b82f6);
    padding: 12px 16px;
    border-radius: 10px 10px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.publisher-tooltip-header h4 {
    margin: 0;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}

.close-tooltip {
    background: none;
    border: none;
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background 0.2s ease;
}

.close-tooltip:hover {
    background: rgba(255, 255, 255, 0.2);
}

.publisher-tooltip-content {
    padding: 16px;
    background: #0a0a2a;
    border-radius: 0 0 10px 10px;
}

.publisher-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.publisher-info-row:last-child {
    border-bottom: none;
}

.publisher-info-row .label {
    font-weight: 600;
    color: #c0c0e0;
    font-size: 13px;
    flex-shrink: 0;
    margin-right: 12px;
}

.publisher-info-row .value {
    color: #fff;
    font-size: 13px;
    text-align: right;
    flex-grow: 1;
}

.publisher-score {
    margin: 16px 0;
    padding: 12px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.publisher-score .label {
    font-weight: 600;
    color: #c0c0e0;
    font-size: 13px;
    margin-bottom: 8px;
    display: block;
}

.score-container {
    display: flex;
    align-items: center;
    gap: 12px;
}

.score-bar {
    flex-grow: 1;
    height: 8px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
    overflow: hidden;
    position: relative;
}

.score-fill {
    height: 100%;
    background: linear-gradient(90deg, #ff4444, #facc15, #4ade80);
    border-radius: 4px;
    transition: width 0.8s ease;
    position: relative;
}

.score-fill::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    animation: shimmer 2s infinite;
}

@keyframes shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

.score-value {
    font-weight: 700;
    color: #fff;
    font-size: 14px;
    min-width: 45px;
    text-align: right;
}

.publisher-description {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.publisher-description p {
    margin: 0;
    color: #c0c0e0;
    font-size: 12px;
    line-height: 1.5;
    font-style: italic;
}

/* Mobile responsive tooltip */
@media (max-width: 600px) {
    .publisher-tooltip {
        max-width: calc(100vw - 40px);
        min-width: calc(100vw - 40px);
        left: 20px !important;
        right: 20px;
    }
    
    .publisher-tooltip-header h4 {
        font-size: 14px;
    }
    
    .publisher-info-row .label,
    .publisher-info-row .value {
        font-size: 12px;
    }
    
    .publisher-score .label {
        font-size: 12px;
    }
    
    .score-value {
        font-size: 13px;
    }
    
    .publisher-description p {
        font-size: 11px;
    }
} 

/* Engagement Popup Styles - Premium Redesign */
.engagement-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: linear-gradient(145deg, rgba(17, 17, 55, 0.95), rgba(26, 26, 74, 0.95));
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(59, 130, 246, 0.3);
    border-radius: 20px;
    box-shadow: 
        0 25px 50px rgba(0, 0, 0, 0.8),
        0 0 0 1px rgba(255, 255, 255, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    z-index: 2000;
    max-width: 450px;
    min-width: 400px;
    max-height: 75vh;
    overflow: hidden;
    font-family: "Outfit", sans-serif;
    animation: popupSlideIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes popupSlideIn {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.8) rotateX(-10deg);
        filter: blur(10px);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1) rotateX(0deg);
        filter: blur(0px);
    }
}

.engagement-popup-header {
    background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 50%, #6366f1 100%);
    padding: 20px 24px;
    border-radius: 20px 20px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.engagement-popup-header::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(45deg, 
        transparent 0%, 
        rgba(255, 255, 255, 0.1) 50%, 
        transparent 100%);
    animation: shimmer 3s ease-in-out infinite;
}

@keyframes shimmer {
    0%, 100% { transform: translateX(-100%); }
    50% { transform: translateX(100%); }
}

.engagement-popup-header h3 {
    color: white;
    margin: 0;
    font-size: 1.3em;
    font-weight: 700;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    letter-spacing: 0.5px;
    position: relative;
    z-index: 1;
}

.close-engagement-popup {
    color: white;
    font-size: 1.4em;
    cursor: pointer;
    padding: 8px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    position: relative;
    z-index: 1;
}

.close-engagement-popup:hover {
    background: rgba(255, 68, 68, 0.2);
    border-color: rgba(255, 68, 68, 0.4);
    transform: scale(1.1) rotate(90deg);
    box-shadow: 0 4px 12px rgba(255, 68, 68, 0.3);
}

.engagement-popup-content {
    padding: 0;
    max-height: 55vh;
    overflow-y: auto;
    background: linear-gradient(180deg, 
        rgba(17, 17, 55, 0.8) 0%, 
        rgba(26, 26, 74, 0.9) 100%);
}

/* Custom Scrollbar */
.engagement-popup-content::-webkit-scrollbar {
    width: 6px;
}

.engagement-popup-content::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
}

.engagement-popup-content::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #3b82f6, #6366f1);
    border-radius: 3px;
}

.engagement-popup-content::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #6366f1, #8b5cf6);
}

/* Enhanced Profile Styles */
.engagement-profile {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.engagement-profile::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 0;
    background: linear-gradient(90deg, 
        rgba(59, 130, 246, 0.1), 
        rgba(250, 204, 21, 0.1));
    transition: width 0.3s ease;
}

.engagement-profile:hover::before {
    width: 100%;
}

.engagement-profile:hover {
    background: rgba(255, 255, 255, 0.03);
    transform: translateX(8px);
    border-left: 3px solid #facc15;
}

.engagement-profile:last-child {
    border-bottom: none;
}

.engagement-popup .profile-avatar {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1em;
    color: white;
    border: 2px solid;
    position: relative;
    transition: all 0.3s ease;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

.engagement-popup .profile-avatar::after {
    content: '';
    position: absolute;
    inset: -2px;
    background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.engagement-profile:hover .engagement-popup .profile-avatar::after {
    opacity: 1;
    animation: rotate 2s linear infinite;
}

@keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.engagement-popup .profile-avatar.blue {
    background: linear-gradient(135deg, rgba(64, 158, 255, 0.3), rgba(59, 130, 246, 0.5));
    border-color: #409eff;
    box-shadow: 0 4px 12px rgba(64, 158, 255, 0.3);
}

.engagement-popup .profile-avatar.gold {
    background: linear-gradient(135deg, rgba(250, 204, 21, 0.3), rgba(245, 158, 11, 0.5));
    border-color: #facc15;
    box-shadow: 0 4px 12px rgba(250, 204, 21, 0.3);
}

.engagement-popup .profile-avatar.purple {
    background: linear-gradient(135deg, rgba(179, 136, 255, 0.3), rgba(139, 92, 246, 0.5));
    border-color: #b388ff;
    box-shadow: 0 4px 12px rgba(179, 136, 255, 0.3);
}

.engagement-popup .profile-avatar.brown {
    background: linear-gradient(135deg, rgba(205, 133, 63, 0.3), rgba(180, 83, 9, 0.5));
    border-color: #cd853f;
    box-shadow: 0 4px 12px rgba(205, 133, 63, 0.3);
}

.engagement-popup .profile-avatar.pink {
    background: linear-gradient(135deg, rgba(255, 133, 179, 0.3), rgba(236, 72, 153, 0.5));
    border-color: #ff85b3;
    box-shadow: 0 4px 12px rgba(255, 133, 179, 0.3);
}

.profile-info {
    flex: 1;
}

.profile-name {
    color: white;
    font-weight: 700;
    font-size: 1.05em;
    margin-bottom: 4px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    letter-spacing: 0.3px;
}

.profile-company {
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.85em;
    font-weight: 500;
    line-height: 1.3;
}

.profile-badge {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9em;
    font-weight: bold;
    border: 2px solid;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.engagement-profile:hover .profile-badge {
    transform: scale(1.2) rotate(360deg);
}

.profile-badge.blue {
    color: #409eff;
    background: linear-gradient(135deg, rgba(64, 158, 255, 0.2), rgba(59, 130, 246, 0.3));
    border-color: #409eff;
}

.profile-badge.gold {
    color: #facc15;
    background: linear-gradient(135deg, rgba(250, 204, 21, 0.2), rgba(245, 158, 11, 0.3));
    border-color: #facc15;
}

.profile-badge.purple {
    color: #b388ff;
    background: linear-gradient(135deg, rgba(179, 136, 255, 0.2), rgba(139, 92, 246, 0.3));
    border-color: #b388ff;
}

.profile-badge.brown {
    color: #cd853f;
    background: linear-gradient(135deg, rgba(205, 133, 63, 0.2), rgba(180, 83, 9, 0.3));
    border-color: #cd853f;
}

.profile-badge.pink {
    color: #ff85b3;
    background: linear-gradient(135deg, rgba(255, 133, 179, 0.2), rgba(236, 72, 153, 0.3));
    border-color: #ff85b3;
}

/* Enhanced Comment Styles */
.engagement-comment {
    padding: 20px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    transition: all 0.3s ease;
    position: relative;
}

.engagement-comment::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 0;
    background: linear-gradient(90deg, 
        rgba(59, 130, 246, 0.1), 
        rgba(99, 102, 241, 0.1));
    transition: width 0.3s ease;
}

.engagement-comment:hover::before {
    width: 4px;
}

.engagement-comment:hover {
    background: rgba(255, 255, 255, 0.02);
    transform: translateX(4px);
}

.engagement-comment:last-child {
    border-bottom: none;
}

.comment-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
}

.comment-info {
    flex: 1;
}

.comment-time {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.8em;
    font-weight: 500;
    margin-top: 2px;
}

.comment-text {
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.6;
    padding-left: 64px;
    font-size: 0.95em;
    font-weight: 400;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* Enhanced engagement stats */
.engagement-stat {
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 6px 12px;
    border-radius: 8px;
    position: relative;
    overflow: hidden;
    font-weight: 600;
}

.engagement-stat::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(250, 204, 21, 0.3), 
        transparent);
    transition: left 0.5s ease;
}

.engagement-stat:hover::before {
    left: 100%;
}

.engagement-stat:hover {
    background: linear-gradient(135deg, 
        rgba(59, 130, 246, 0.2), 
        rgba(250, 204, 21, 0.2));
    color: #facc15;
    transform: scale(1.05) translateY(-2px);
    box-shadow: 0 4px 12px rgba(250, 204, 21, 0.3);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

/* Mobile responsive enhancements */
@media (max-width: 600px) {
    .engagement-popup {
        max-width: calc(100vw - 32px);
        min-width: calc(100vw - 32px);
        left: 16px;
        right: 16px;
        transform: translateY(-50%);
        border-radius: 16px;
        max-height: 80vh;
    }
    
    .engagement-popup-header {
        padding: 16px 20px;
        border-radius: 16px 16px 0 0;
    }
    
    .engagement-popup-header h3 {
        font-size: 1.1em;
    }
    
    .engagement-popup-content {
        max-height: 60vh;
    }
    
    .engagement-profile {
        padding: 14px 20px;
        gap: 14px;
    }
    
    .profile-avatar {
        width: 42px;
        height: 42px;
        font-size: 0.9em;
    }
    
    .profile-name {
        font-size: 0.95em;
    }
    
    .profile-company {
        font-size: 0.8em;
    }
    
    .engagement-comment {
        padding: 16px 20px;
    }
    
    .comment-text {
        padding-left: 58px;
        font-size: 0.9em;
    }
    
    .close-engagement-popup {
        width: 32px;
        height: 32px;
        font-size: 1.2em;
    }
}

/* Verified Profile Status Styles */
.profile-status.verified {
    background: rgba(15, 23, 42, 0.62);
    cursor: default;
    pointer-events: none;
}

/* Guest Menu Styles in Header */
.guest-menu {
    padding: 4px;
    text-align: left;
    border-radius: 8px;
    background: transparent;
    border: 0;
}

/* Hide mobile guest menu on desktop */
.mobile-guest-menu {
    display: none;
}

.guest-menu-kicker {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 4px 8px;
    border-radius: 6px;
    color: #facc15;
    background: rgba(250, 204, 21, 0.12);
    border: 1px solid rgba(250, 204, 21, 0.28);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0;
    margin-bottom: 10px;
}

.guest-menu p {
    margin: 0 0 16px 0;
    color: #e5e7eb;
    font-size: 1rem;
    line-height: 1.45;
    font-weight: 600;
}

.guest-menu-actions {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 10px;
}

.btn-signup,
.btn-login {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 13px 16px;
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 800;
    font-size: 1rem;
    line-height: 1.2;
    letter-spacing: 0;
    border: 1px solid transparent;
    position: relative;
    overflow: hidden;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.btn-signup::after,
.btn-login::after {
    content: ">";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin-left: 8px;
    border-radius: 999px;
    font-size: 0.84rem;
    line-height: 1;
    background: rgba(255, 255, 255, 0.16);
    transform: translateX(0);
    transition: transform 0.18s ease, background 0.18s ease;
}

.btn-signup {
    background: rgba(217, 179, 95, 0.12);
    border-color: rgba(217, 179, 95, 0.34);
    color: #f2d99b;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 10px 24px rgba(0, 0, 0, 0.18);
}

.btn-signup:hover,
.btn-signup:focus-visible {
    background: rgba(217, 179, 95, 0.2);
    border-color: rgba(217, 179, 95, 0.52);
    color: #fff8ea;
    transform: translateY(-1px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 12px 28px rgba(0, 0, 0, 0.22);
    outline: none;
}

.btn-signup:hover::after,
.btn-signup:focus-visible::after,
.btn-login:hover::after,
.btn-login:focus-visible::after {
    transform: translateX(2px);
    background: rgba(255, 255, 255, 0.23);
}

.btn-login {
    background:
        linear-gradient(135deg, rgba(15, 23, 42, 0.95), rgba(30, 41, 59, 0.92));
    color: #e2e8f0;
    border-color: rgba(147, 197, 253, 0.34);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.btn-login:hover,
.btn-login:focus-visible {
    transform: translateY(-2px);
    background:
        linear-gradient(135deg, rgba(30, 41, 59, 0.98), rgba(49, 46, 129, 0.84));
    border-color: rgba(250, 204, 21, 0.48);
    color: #fff;
    outline: none;
}

/* Enhanced mobile guest menu styling */
@media (max-width: 768px) {
    .guest-menu {
        padding: 4px;
    }

    .guest-menu-actions {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    
    .guest-menu p {
        font-size: 1.02rem;
        margin-bottom: 18px;
        line-height: 1.45;
        color: #f8fafc;
    }
    
    .btn-signup,
    .btn-login {
        min-height: 48px;
        padding: 13px 12px;
        font-size: 1rem;
        text-align: center;
    }
    
    .btn-signup:hover,
    .btn-login:hover {
        transform: none;
    }
}

@media (max-width: 360px) {
    .guest-menu-actions {
        grid-template-columns: 1fr;
    }
}

/* --- FIX FOR HIDDEN CONTENT ON MAIN FEED --- */
/* This rule ensures the post content is always visible, overriding any conflicting styles. */
#postsContainer .post .post-content {
    display: block !important;
}

/* New, unique class for main feed content to avoid conflicts */
.main-feed-post-content {
    font-size: 0.95em;
    color: #bbb;
    line-height: 1.6;
    margin: 15px 0;
}

/* --- DEFINITIVE FIX FOR MAIN FEED CONTENT --- */
/* This rule is placed at the end of the file for maximum priority. */
.post-content {
    display: block !important;
}

/* Individual Nuzler View Content - Mobile Optimization */
.nuzler-view-content {
    font-size: 15px;
    line-height: 1.7;
    color: #e2e8f0;
    margin: 20px 0;
    padding: 0 15px;
    word-wrap: break-word;
    word-break: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
    max-width: 100%;
}

@media (max-width: 768px) {
    .nuzler-view-content {
        font-size: 14px;
        line-height: 1.8;
        margin: 15px 0;
        padding: 0 10px;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    
    .nuzler-view-content a {
        word-break: break-all;
        overflow-wrap: anywhere;
    }
    
    .nuzler-view-content code {
        word-break: break-all;
        white-space: pre-wrap;
        overflow-wrap: anywhere;
        background: rgba(0,0,0,0.3);
        padding: 2px 4px;
        border-radius: 4px;
        font-size: 13px;
    }
    
    .nuzler-view-content pre {
        white-space: pre-wrap;
        word-break: break-word;
        overflow-wrap: break-word;
        overflow-x: auto;
        max-width: 100%;
        background: rgba(0,0,0,0.3);
        padding: 12px;
        border-radius: 8px;
        font-size: 13px;
    }
    
    .nuzler-view-content img {
        max-width: 100% !important;
        height: auto !important;
        object-fit: contain;
        border-radius: 8px;
    }
    
    .nuzler-view-content table {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        display: block;
        font-size: 13px;
    }
    
    .nuzler-view-content table td,
    .nuzler-view-content table th {
        padding: 6px 8px;
        word-break: break-word;
    }
    
    .nuzler-view-content blockquote {
        margin: 15px 0;
        padding: 12px 16px;
        border-left: 4px solid #3b82f6;
        background: rgba(59, 130, 246, 0.1);
        max-width: 100%;
        box-sizing: border-box;
        word-wrap: break-word;
        border-radius: 6px;
    }
    
    .nuzler-view-content ul,
    .nuzler-view-content ol {
        padding-left: 20px;
        max-width: 100%;
    }
    
    .nuzler-view-content li {
        word-wrap: break-word;
        overflow-wrap: break-word;
        margin-bottom: 6px;
    }
}

@media (max-width: 480px) {
    .nuzler-view-content {
        font-size: 13px;
        line-height: 1.9;
        padding: 0 8px;
    }
    
    .nuzler-view-content code {
        font-size: 12px;
    }
    
    .nuzler-view-content pre {
        font-size: 12px;
        padding: 10px;
    }
}

/* Styles for Verified Checkmark */
.post-header .author-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px; /* Adjust spacing between elements */
}

.post-header .author-info .author-name-row {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.verified-checkmark {
    display: inline-flex !important; /* IMPORTANT: Fix for layout bug */
    align-items: center;
    cursor: pointer;
}

/* Posting Rate Styles for Main Feed */
.posting-rate {
    font-size: 0.88em;
    color: #64748b;
    font-weight: 500;
    margin-top: 2px;
    opacity: 0.8;
}

/* 
  DEFINITIVE AVATAR SHAPE FIX:
  This rule uses high specificity to override any other conflicting
  styles that might be making the avatars round.
*/
body .main-container .post .post-header .profile-pic {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    border: 2.5px solid;
    object-fit: cover;
    margin-right: 0;
    transition: transform 0.2s ease;
}

/* =====================================
   UNIVERSAL AVATAR STYLES
   ===================================== */
.profile-pic,
.avatar-image {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    border: 2px solid;
    object-fit: cover;
    margin-right: 0;
    transition: transform 0.2s ease;
}

/* Tier-based border colors for ALL avatars */
body .main-container .post .post-header .profile-pic.blue,    .avatar-image.blue    { border-color: #409eff !important; }
body .main-container .post .post-header .profile-pic.gold,    .avatar-image.gold    { border-color: #facc15 !important; }
body .main-container .post .post-header .profile-pic.purple,  .avatar-image.purple  { border-color: #b388ff !important; }
body .main-container .post .post-header .profile-pic.brown,   .avatar-image.brown   { border-color: #cd853f !important; }
body .main-container .post .post-header .profile-pic.pink,    .avatar-image.pink    { border-color: #ff85b3 !important; }
body .main-container .post .post-header .profile-pic.red,     .avatar-image.red     { border-color: #ff4444 !important; }
body .main-container .post .post-header .profile-pic.orange,  .avatar-image.orange  { border-color: #f97316 !important; }
body .main-container .post .post-header .profile-pic.yellow,  .avatar-image.yellow  { border-color: #eab308 !important; }
body .main-container .post .post-header .profile-pic.green,   .avatar-image.green   { border-color: #10b981 !important; }
body .main-container .post .post-header .profile-pic.mint,    .avatar-image.mint    { border-color: #2dd4bf !important; }
body .main-container .post .post-header .profile-pic.magenta, .avatar-image.magenta { border-color: #d946ef !important; }
body .main-container .post .post-header .profile-pic.indigo,  .avatar-image.indigo  { border-color: #6366f1 !important; }
body .main-container .post .post-header .profile-pic.stadium, .avatar-image.stadium { border-color: #22c55e !important; }
body .main-container .post .post-header .profile-pic.copper,  .avatar-image.copper  { border-color: #b45309 !important; }
body .main-container .post .post-header .profile-pic.royal,  .avatar-image.royal  { border-color: #2563eb !important; }
body .main-container .post .post-header .profile-pic.rose,   .avatar-image.rose   { border-color: #f43f5e !important; }

/* =====================================
   SUBSCRIPTION BUTTONS
   ===================================== */

/* Subscribe button in main feed posts */
.subscribe-button {
    padding: 6px 14px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border: none;
    border-radius: 16px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    transition: all 0.25s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
}

.subscribe-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.subscribe-button.subscribed {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: white;
}

.subscribe-button.subscribed:hover {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

.subscribe-button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

/* Profile page subscribe button */
.profile-btn.subscribed {
    background: #10b981 !important;
    border-color: #10b981 !important;
}

.profile-btn.subscribed:hover {
    background: #059669 !important;
    border-color: #059669 !important;
}

/* Post header layout for subscribe button */
.post-header {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    gap: 12px;
}

.post-header .author-info {
    flex: 1;
}

/* Subscriber count styling */
.subscriber-count-row {
    margin-top: 4px;
    margin-bottom: 2px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.subscriber-count {
    background: rgba(100, 116, 139, 0.08);
    font-size: 0.88em;
    font-weight: 500;
    padding: 5px 12px;
    border-radius: 10px;
    border: 1px solid rgba(100, 116, 139, 0.2);
    color: #8892a4;
    white-space: nowrap;
    display: inline-block;
}

.people-count-button {
    appearance: none;
    color: inherit;
    cursor: pointer;
    font-family: inherit;
    line-height: 1.2;
}

.people-count-button:hover,
.people-count-button:focus-visible,
.people-count-link:hover,
.people-count-link:focus-visible {
    filter: brightness(1.15);
    box-shadow: 0 0 0 1px currentColor;
}

.people-count-button:focus-visible,
.people-count-link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.people-modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.74);
    backdrop-filter: blur(6px);
    z-index: 10000;
}

.people-modal.is-open {
    display: flex;
}

.people-modal-content {
    width: min(520px, 100%);
    max-height: min(82vh, 720px);
    overflow: hidden;
    border: 1px solid rgba(88, 166, 255, 0.26);
    border-radius: 8px;
    background: #161b22;
    color: #c9d1d9;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.45);
    display: flex;
    flex-direction: column;
}

.people-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid #30363d;
}

.people-modal-header h3 {
    margin: 0;
    color: #f0f6fc;
    font-size: 1.12rem;
    line-height: 1.2;
}

.people-modal-close {
    width: 36px;
    height: 36px;
    border: 1px solid #30363d;
    border-radius: 8px;
    background: #0d1117;
    color: #c9d1d9;
    cursor: pointer;
    font-size: 1.4rem;
    line-height: 1;
}

.people-modal-close:hover,
.people-modal-close:focus-visible {
    border-color: #58a6ff;
    color: #fff;
}

.people-modal-list {
    overflow-y: auto;
    padding: 16px;
}

.people-modal-state {
    padding: 28px 16px;
    border: 1px dashed #30363d;
    border-radius: 8px;
    color: #8b949e;
    text-align: center;
}

.people-modal-error {
    color: #fca5a5;
    border-color: rgba(248, 113, 113, 0.38);
}

.people-modal-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 1px solid #30363d;
    border-radius: 8px;
    background: #0d1117;
}

.people-modal-item + .people-modal-item {
    margin-top: 10px;
}

.people-modal-avatar {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    flex: 0 0 auto;
}

.people-modal-info {
    min-width: 0;
}

.people-modal-name {
    display: block;
    font-weight: 800;
    text-decoration: none;
}

.people-modal-meta {
    margin-top: 3px;
    color: #8b949e;
    font-size: 0.82rem;
    line-height: 1.3;
}

/* Nuzler Type Styling - Cohesive with Header */
.nuzler-type-row,
.nuzler-type-row-profile {
    margin-top: 2px;
    margin-bottom: 2px;
}

.nuzler-type {
    font-size: 0.82em;
    font-weight: 500;
    display: inline-block;
    opacity: 0.6;
}

/* Enhanced Author Info Styling */
.author-info {
    line-height: 1.3;
}

.author-name-row {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 1px;
}

.author-tier-row,
.author-tier-row-profile {
    margin-bottom: 2px;
}

.nuzler-type {
    font-size: 0.82em;
    font-weight: 500;
    opacity: 0.6;
}

.posting-rate,
.posting-rate-profile {
    font-size: 0.8em;
    font-weight: 600;
    margin-top: 2px;
}

/* Share Nuzler Button Styling */
.share-nuzler-link {
    border: 1px solid currentColor;
    font-size: 0.85em;
    font-weight: 600;
    padding: 6px 16px;
    border-radius: 10px;
    transition: all 0.2s ease;
    white-space: nowrap;
    cursor: pointer;
    font-family: inherit;
    margin-left: auto !important;
    background: transparent !important;
}

.share-nuzler-link:hover {
    filter: brightness(1.15);
    background: rgba(100, 116, 139, 0.1) !important;
}





/* Clickable Comment Author Links - Tier-Based Colors */
.comment-author-link {
    font-weight: 600;
    text-decoration: none;
    transition: opacity 0.2s ease, text-decoration 0.2s ease;
    cursor: pointer;
}

.comment-author-link:hover {
    opacity: 0.8;
    text-decoration: underline !important;
}

.comment-author-link:visited {
    /* Maintain the same color even after visiting */
    color: inherit;
}

/* Ensure comment author links work well in all contexts */
.comment-author a {
    font-weight: 600;
    transition: opacity 0.2s ease, text-decoration 0.2s ease;
    text-decoration: none;
}

.comment-author a:hover {
    opacity: 0.8;
    text-decoration: underline;
}

.comment-author a:visited {
    color: inherit;
}

/* Comment author styling enhancements */
.comment-author {
    font-weight: 600;
    font-size: 14px;
    transition: opacity 0.2s ease;
}

/* Enhanced hover effects for all comment elements */
.comment-item:hover .comment-author a {
    text-shadow: 0 0 8px currentColor;
}

/* ---- Home feed: same max width as single nuzler page (.nuzler-view-container = 800px) ---- */
.feed-container {
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
    padding: 20px 20px 3rem;
    box-sizing: border-box;
    position: relative;
}


.feed-container .search-container {
    margin-bottom: 12px;
}

@media (max-width: 768px) {
    .feed-container .search-container {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
        margin: 10px 0 16px;
    }

    .feed-container .search-bar {
        height: 48px;
        min-height: 48px;
        margin: 0;
        padding: 0 16px !important;
        border-radius: 8px;
        font-size: 16px !important;
        line-height: 48px;
        text-align: left;
        vertical-align: middle;
    }

    .feed-container .search-bar::placeholder {
        line-height: 48px;
        opacity: 1;
    }
}

/* Vertical gap between nuzlers — each post is its own card */
.feed-container #postsContainer {
    display: flex;
    flex-direction: column;
    gap: 1.125rem;
    background: transparent;
    border: none;
    box-shadow: none;
    overflow: visible;
}

.feed-container .post {
    margin-bottom: 0;
    border-radius: 10px;
    border: 1px solid rgba(100, 116, 139, 0.28);
    border-left: 3px solid #3b82f6;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.28);
    background: rgba(10, 10, 34, 0.72);
    padding: 1rem 1rem 1.15rem;
    cursor: default;
}

.feed-container .post:hover {
    transform: none;
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.38);
    background: rgba(16, 16, 44, 0.88);
}

.feed-container .post-title {
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #e8e8f4;
    margin: 0 0 0.5rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid rgba(100, 116, 139, 0.18);
}

.feed-container .post-title .post-title-link {
    color: #e8e8f4;
}

.feed-container .post-title .post-title-link:hover {
    color: #facc15;
}

.feed-container .post-content {
    font-size: 0.9rem;
    line-height: 1.55;
    color: #b8b8d0;
}

.feed-container .post-content p {
    margin-bottom: 0.75em;
}

.feed-container .post-content p:last-child {
    margin-bottom: 0;
}

.feed-container .post-footer {
    margin-top: 0.75rem;
    padding-top: 0.65rem;
    border-top: 1px solid rgba(100, 116, 139, 0.15);
}

@media (max-width: 768px) {
    .feed-container {
        max-width: 100%;
        padding: 16px 12px 2rem;
    }

    .feed-container #postsContainer {
        gap: 1rem;
    }

    .feed-container .post {
        margin-bottom: 0;
        border-radius: 10px;
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    .feed-container .post:hover {
        transform: none;
    }
}


/* ===== Tier tabs in scroll row + add button + picker ===== */

/* The .tabs row: horizontal flex, no wrapping, no overflow clipping */
.feed-container .tabs {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: 12px;
    position: relative;
    overflow: visible;
    flex-wrap: nowrap;
}

/* Scrollable tab strip */
.feed-container .tabs-scroll {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
    gap: 0;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 2px;
}
.feed-container .tabs-scroll::-webkit-scrollbar { display: none; }

/* Individual tab */
.feed-container .tabs-scroll .tab {
    flex: 0 0 auto;
    min-width: fit-content;
    padding: 10px 16px;
    white-space: nowrap;
    text-align: center;
    color: #bbb;
    cursor: pointer;
    font-size: 0.875rem;
    font-weight: 500;
    transition: color 0.2s;
    position: relative;
    border: none;
    background: none;
    overflow: visible;
}
.feed-container .tabs-scroll .tab[data-core="1"] {
    flex: 1 1 0;
    min-width: 72px;
    max-width: 200px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0;
}
.feed-container .tabs-scroll .tab:hover { color: #fff; }

/* Active tab: white text + colored underline */
.feed-container .tabs-scroll .tab.active {
    color: #fff;
    font-weight: 700;
}
.feed-container .tabs-scroll .tab.active:not(.tier-tab) {
    border-radius: 8px 8px 0 0;
    background: rgba(var(--tier-r,59), var(--tier-g,130), var(--tier-b,246), 0.12);
}
.feed-container .tabs-scroll .tab[data-feed="forYou"].active {
    background: rgba(59, 130, 246, 0.12);
}
.feed-container .tabs-scroll .tab.active::after {
    content: "";
    position: absolute;
    bottom: 0; left: 4px; right: 4px;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(145deg, #3b82f6, #facc15);
}
/* For You keeps gradient; others use tier color */
.feed-container .tabs-scroll .tab[data-feed="forYou"].active::after {
    background: linear-gradient(145deg, #3b82f6, #facc15);
}
.feed-container .tabs-scroll .tab:not([data-feed="forYou"]).active::after {
    background: rgb(var(--tier-r,234), var(--tier-g,179), var(--tier-b,8));
}

/* --- Added tier tabs: tier-colored chip --- */
.feed-container .tabs-scroll .tier-tab {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 8px 8px 8px 14px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.035);
    color: #cbd5e1;
    margin: 0 2px;
    transition: background 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
}
.feed-container .tabs-scroll .tier-tab:hover {
    background: rgba(var(--tier-r,180), var(--tier-g,180), var(--tier-b,180), 0.1);
    border-color: rgba(var(--tier-r,180), var(--tier-g,180), var(--tier-b,180), 0.28);
}
.feed-container .tabs-scroll .tier-tab.active {
    background: rgba(var(--tier-r,180), var(--tier-g,180), var(--tier-b,180), 0.22);
    border-color: rgba(var(--tier-r,180), var(--tier-g,180), var(--tier-b,180), 0.68);
    box-shadow: inset 0 -3px 0 rgb(var(--tier-r,180), var(--tier-g,180), var(--tier-b,180));
    color: #fff;
}
.feed-container .tabs-scroll .tier-tab.active::after { display: none; }
.feed-container .tabs-scroll .tier-tab .tier-tab-text { pointer-events: none; }

/* Remove (x) button */
.feed-container .tabs-scroll .tier-tab-x {
    appearance: none;
    border: none;
    background: rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.6);
    width: 18px; height: 18px;
    border-radius: 50%;
    font-size: 13px; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0; margin: 0;
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}
.feed-container .tabs-scroll .tier-tab-x:hover {
    background: rgba(239,68,68,0.85);
    color: #fff;
}

/* + add button (always visible, right side) */
.tier-add-btn {
    appearance: none;
    flex: 0 0 auto;
    width: 32px; height: 32px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 50%;
    color: #ccc;
    font-size: 1.25rem; line-height: 1;
    cursor: pointer;
    margin-left: 6px;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.tier-add-btn:hover {
    background: rgba(250,204,21,0.15);
    border-color: rgba(250,204,21,0.4);
    color: #facc15;
}

/* --- Tier picker dropdown --- */
.tier-picker {
    display: block;
    position: absolute;
    z-index: 10050;
    top: 58px; right: 20px;
    width: 240px;
    background: #1a1a3a;
    border: 1px solid rgba(100,116,139,0.35);
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(0,0,0,0.5);
    overflow: hidden;
    opacity: 0; visibility: hidden;
    transform: translateY(-6px) scale(0.97);
    transform-origin: top right;
    transition: opacity 0.18s, transform 0.18s, visibility 0.18s;
    pointer-events: none;
}
.tier-picker.visible {
    opacity: 1; visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
.tier-picker-header {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 14px; font-weight: 700; font-size: 0.9rem; color: #f0f0f0;
    border-bottom: 1px solid rgba(100,116,139,0.2);
}
.tier-picker-close {
    appearance: none; border: none; background: rgba(100,116,139,0.15);
    color: #e2e8f0; width: 28px; height: 28px; border-radius: 6px;
    font-size: 1.1rem; cursor: pointer; display: flex; align-items: center; justify-content: center;
    transition: background 0.2s;
}
.tier-picker-close:hover { background: rgba(250,204,21,0.2); color: #facc15; }

.tier-picker-body {
    max-height: min(60vh, 380px);
    overflow-y: auto;
    padding: 6px 0;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.12) transparent;
}
.tier-picker-item {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 14px; cursor: pointer;
    color: #d1d5db; font-size: 0.85rem;
    transition: background 0.15s, color 0.15s;
}
.tier-picker-item:hover { background: rgba(59,130,246,0.1); color: #fff; }
.tier-picker-item.added {
    background: rgba(250,204,21,0.08); color: #facc15; font-weight: 600;
}
.tier-picker-item.added::after {
    content: "\2713"; margin-left: auto; font-size: 0.8rem; color: #facc15;
}
.tier-picker-item.active {
    background: rgba(59,130,246,0.18);
    color: #fff;
}
.tier-picker-item.active::after {
    content: "Active";
    margin-left: auto;
    font-size: 0.7rem;
    color: #93c5fd;
    text-transform: uppercase;
    letter-spacing: 0;
}
.tp-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.tp-label { flex: 1; min-width: 0; }

/* --- Guest auth prompt --- */
.tier-auth-prompt {
    display: block; position: absolute; z-index: 10050;
    top: 58px; right: 20px; width: 240px;
    background: #1a1a3a; border: 1px solid rgba(100,116,139,0.35);
    border-radius: 10px; box-shadow: 0 12px 32px rgba(0,0,0,0.5);
    padding: 20px 16px; text-align: center;
    opacity: 0; visibility: hidden;
    transform: translateY(-6px) scale(0.97); transform-origin: top right;
    transition: opacity 0.18s, transform 0.18s, visibility 0.18s;
    pointer-events: none;
}
.tier-auth-prompt.visible {
    opacity: 1; visibility: visible;
    transform: translateY(0) scale(1); pointer-events: auto;
}
.tier-auth-prompt p { margin: 0 0 14px; font-size: 0.875rem; color: #e2e8f0; line-height: 1.4; }
.tier-auth-actions { display: flex; gap: 8px; }
.tier-auth-btn {
    flex: 1; display: inline-flex; align-items: center; justify-content: center;
    padding: 8px 0; border-radius: 6px; font-size: 0.8125rem; font-weight: 600;
    text-decoration: none; transition: opacity 0.2s;
}
.tier-auth-btn:hover { opacity: 0.85; }
.tier-auth-signup {
    background: rgba(217, 179, 95, 0.12);
    border: 1px solid rgba(217, 179, 95, 0.34);
    color: #f2d99b;
}
.tier-auth-login { background: rgba(255,255,255,0.1); color: #e2e8f0; border: 1px solid rgba(255,255,255,0.2); }

/* --- Mobile adjustments --- */
@media (max-width: 768px) {
    .feed-container .tabs { gap: 6px; }
    .feed-container .tabs-scroll .tab { padding: 10px 12px; font-size: 13px; }
    .feed-container .tabs-scroll .tab[data-core="1"] { flex: 1 1 0; min-width: 0; max-width: 140px; padding-left: 4px; padding-right: 4px; }
    .feed-container .tabs-scroll .tab.active::after { left: 2px; right: 2px; }

    .feed-container .tabs-scroll .tier-tab { padding: 8px 6px 8px 12px; font-size: 13px; }
    .tier-add-btn { flex: 0 0 32px; width: 32px; height: 32px; font-size: 1.15rem; margin-left: 4px; }
    .feed-container .tabs { padding: 5px 6px; }
    .feed-container .tabs-scroll { padding: 0 4px; }

    /* Picker: bottom sheet */
    .tier-picker {
        position: fixed; top: auto; bottom: 0; left: 0; right: 0;
        width: 100%; max-width: 100%;
        border-radius: 16px 16px 0 0;
        transform: translateY(100%); transform-origin: bottom center;
        transition: transform 0.25s ease, opacity 0.25s ease, visibility 0.25s;
    }
    .tier-picker.visible { transform: translateY(0); }
    .tier-picker-header { padding: 16px; }
    .tier-picker-body { max-height: 60vh; padding: 8px 0 16px; }
    .tier-picker-item { padding: 13px 16px; font-size: 0.9rem; }

    /* Auth prompt: bottom sheet */
    .tier-auth-prompt {
        position: fixed; top: auto; bottom: 0; left: 0; right: 0;
        width: 100%; max-width: 100%;
        border-radius: 16px 16px 0 0;
        transform: translateY(100%); transform-origin: bottom center;
        transition: transform 0.25s ease, opacity 0.25s ease, visibility 0.25s;
        padding: 24px 20px;
    }
    .tier-auth-prompt.visible { transform: translateY(0); }
}


/* --- Site footer (main feed) --- */
.site-footer {
    margin-top: 0;
    padding: 0 1.25rem 2rem;
}

.site-footer-inner {
    max-width: 800px;
    margin: 0 auto;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(100, 116, 139, 0.2);
    text-align: center;
}

.site-footer-copy {
    margin: 0;
    font-size: 0.8125rem;
    color: rgba(148, 163, 184, 0.9);
    letter-spacing: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    line-height: 1.45;
}

.site-footer-copy-line {
    display: block;
    width: 100%;
    text-align: center;
}

.site-footer-copy a {
    color: #f6d98b;
    font-weight: 700;
    text-decoration: none;
    transition: color 160ms ease, opacity 160ms ease;
}

.site-footer-copy a:hover,
.site-footer-copy a:focus-visible {
    color: #f8fafc;
    text-decoration: underline;
    text-underline-offset: 0.18em;
    outline: none;
}

.site-footer-links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.55rem;
    flex-wrap: wrap;
}

.site-footer-links a {
    color: rgba(226, 232, 240, 0.86);
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
}

.site-footer-links a:hover,
.site-footer-links a:focus-visible {
    color: #facc15;
    text-decoration: underline;
    outline: none;
}

/* Imported newsletter posts */
.nuzler-newsletter {
    display: block;
    max-width: 100%;
    color: inherit;
}

.nuzler-newsletter-original {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    background: #ffffff;
    color: #111827;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    line-height: normal;
    overflow-wrap: normal;
    word-break: normal;
}

.nuzler-newsletter-original table {
    width: auto;
    max-width: 100%;
    margin: 0 auto;
    border: 0;
    border-collapse: separate;
    font-size: inherit;
}

.nuzler-newsletter-original table.nuzler-email-fit-table {
    width: 100% !important;
    max-width: 100% !important;
}

.nuzler-newsletter-original table td,
.nuzler-newsletter-original table th {
    border: 0;
    padding: 0;
    word-break: normal;
    overflow-wrap: normal;
    vertical-align: inherit;
}

.nuzler-newsletter-original h1,
.nuzler-newsletter-original h2,
.nuzler-newsletter-original h3,
.nuzler-newsletter-original h4,
.nuzler-newsletter-original h5,
.nuzler-newsletter-original h6,
.nuzler-newsletter-original p,
.nuzler-newsletter-original div,
.nuzler-newsletter-original span,
.nuzler-newsletter-original td,
.nuzler-newsletter-original th,
.nuzler-newsletter-original font {
    color: inherit;
}

.nuzler-newsletter-original p {
    margin: inherit;
}

.nuzler-newsletter-original a {
    color: inherit;
    font-weight: inherit;
    text-decoration: inherit;
}

.nuzler-newsletter-original img {
    max-width: 100%;
    height: auto;
}

.nuzler-newsletter-section {
    margin: 0 0 1.35rem;
    padding: 0 0 1.1rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.nuzler-newsletter-section:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}

.nuzler-newsletter-heading {
    margin: 0 0 0.65rem;
    font-size: 1.25rem;
    line-height: 1.25;
    color: inherit;
    letter-spacing: 0;
}

.nuzler-newsletter-paragraph {
    margin: 0 0 0.9rem;
    line-height: 1.7;
}

.nuzler-newsletter-paragraph:last-child {
    margin-bottom: 0;
}

.nuzler-newsletter-list {
    margin: 0.75rem 0 1rem;
    padding-left: 1.35rem;
    line-height: 1.65;
}

.nuzler-newsletter-list li + li {
    margin-top: 0.35rem;
}

.nuzler-newsletter-quote {
    margin: 1rem 0;
    padding: 0.75rem 1rem;
    border-left: 3px solid currentColor;
    background: rgba(148, 163, 184, 0.1);
    border-radius: 8px;
    line-height: 1.65;
}

.nuzler-newsletter a {
    color: #2563eb;
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 0.16em;
}

.nuzler-newsletter .nuzler-newsletter-original a {
    color: inherit;
    font-weight: inherit;
    text-decoration: inherit;
    text-underline-offset: inherit;
}

.nuzler-newsletter-cta {
    margin: 0.85rem 0 0.35rem;
}

.nuzler-newsletter-cta a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    max-width: 100%;
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: #2563eb;
    color: #fff;
    font-size: 0.95rem;
    font-weight: 700;
    text-decoration: none;
    line-height: 1.2;
    vertical-align: middle;
}

.nuzler-newsletter-image {
    margin: 1rem 0;
}

.nuzler-newsletter-image img {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

.nuzler-newsletter-img-social-icon,
.nuzler-newsletter-img-icon,
.nuzler-newsletter-image-social-icon img,
.nuzler-newsletter-image-icon img {
    display: inline-block;
    width: auto !important;
    max-width: 34px !important;
    max-height: 34px !important;
    object-fit: contain;
    border-radius: 4px;
    vertical-align: middle;
}

.nuzler-newsletter-img-logo,
.nuzler-newsletter-image-logo img {
    width: auto !important;
    max-width: min(220px, 70%) !important;
    max-height: 90px !important;
    object-fit: contain;
}

.nuzler-newsletter-image-social-icon,
.nuzler-newsletter-image-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0.25rem 0.35rem 0.25rem 0;
    width: auto;
}

.nuzler-newsletter-divider {
    margin: 1.35rem 0;
    border: 0;
    border-top: 1px solid rgba(148, 163, 184, 0.24);
}

.main-feed-post-content .nuzler-newsletter-heading {
    font-size: 1.05rem;
}

.main-feed-post-content .nuzler-newsletter-cta a {
    min-height: 32px;
    padding: 0.48rem 0.7rem;
    font-size: 0.9rem;
}

@media (max-width: 768px) {
    .site-footer {
        padding: 0 12px 1.75rem;
    }

    .site-footer-inner {
        padding-top: 1rem;
    }

    .site-footer-links {
        gap: 0.8rem;
    }
}

/* --- Platform readability pass: larger, clearer type across shared surfaces --- */
html {
    font-size: 17px;
}

body {
    font-size: 1rem;
    line-height: 1.68;
}

button,
input,
select,
textarea {
    font-size: 1rem;
}

.logo {
    font-size: 1.55rem;
}

.beta-tag {
    font-size: 0.68em;
}

.slogan {
    font-size: 0.9rem;
}

.profile-email {
    font-size: 1rem;
}

.profile-menu-user-name {
    font-size: 1.18rem;
}

.profile-name-email,
.profile-menu-address-value,
.profile-status {
    font-size: 0.98rem;
}

.profile-menu-address-label,
.menu-counter {
    font-size: 0.82rem;
}

.profile-options a,
.guest-menu p,
.guest-menu a {
    font-size: 1.05rem;
    line-height: 1.35;
}

.tabs .tab,
.feed-container .tabs-scroll .tab,
.feed-container .tabs-scroll .tier-tab {
    font-size: 1rem;
}

.tier-add-btn {
    font-size: 1.35rem;
}

.add-tab-menu li,
.tier-picker-item {
    font-size: 1rem;
}

.tier-picker-header {
    font-size: 1rem;
}

.tier-auth-prompt p,
.tier-auth-btn {
    font-size: 0.98rem;
}

.post-title,
.feed-container .post-title,
.publisher-post .post-title {
    font-size: 1.35rem;
    line-height: 1.32;
}

.post-content,
.main-feed-post-content,
.feed-container .post-content,
#postsContainer .post .post-content,
.publisher-post .post-content {
    font-size: 1.06rem;
    line-height: 1.78;
}

.post-content h1 { font-size: 1.7em; }
.post-content h2 { font-size: 1.48em; }
.post-content h3 { font-size: 1.28em; }
.post-content h4,
.post-content h5,
.post-content h6 {
    font-size: 1.14em;
}

.post-meta,
.profile-tier,
.author-tier-row-profile .author-tier,
.nuzler-type-row-profile .nuzler-type,
.posting-rate-profile,
.post-footer .stats span,
.post-footer .stats button,
.comment-btn {
    font-size: 1rem;
}

.comment,
.comment-author,
.comment-time,
.comment-content,
.comment-text,
.no-comments {
    font-size: 1rem;
}

.site-footer-copy,
.site-footer-links a {
    font-size: 0.95rem;
}

.nuzler-newsletter-heading,
.main-feed-post-content .nuzler-newsletter-heading {
    font-size: 1.32rem;
}

.nuzler-newsletter-paragraph,
.nuzler-newsletter-list {
    font-size: 1.06rem;
}

@media (max-width: 768px) {
    html,
    body {
        font-size: 16px;
    }

    .logo {
        font-size: 1.28rem;
    }

    .slogan {
        font-size: 0.82rem;
    }

    .profile-email {
        font-size: 0.95rem;
    }

    .post-title,
    .feed-container .post-title,
    .publisher-post .post-title {
        font-size: 1.22rem !important;
    }

    .post-content,
    .main-feed-post-content,
    .feed-container .post-content,
    #postsContainer .post .post-content,
    .publisher-post .post-content {
        font-size: 1rem !important;
        line-height: 1.72;
    }

    .feed-container .tabs-scroll .tab,
    .feed-container .tabs-scroll .tier-tab,
    .tier-picker-item {
        font-size: 1rem;
    }

    .comment,
    .comment-author,
    .comment-time,
    .comment-content,
    .comment-text {
        font-size: 1rem;
    }
}

/* Mobile search input alignment fix.
   Keep this late in the cascade so older mobile search overrides cannot
   shrink the field or pull typed text away from the visual center. */
@media (max-width: 768px) {
    .feed-container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .feed-container .search-container {
        display: block;
        width: 100%;
        max-width: 100%;
        padding: 0;
        margin: 10px 0 16px;
        box-sizing: border-box;
    }

    .feed-container .search-bar,
    input.search-bar[type="search"],
    input.search-bar[type="text"] {
        display: block;
        width: 100%;
        height: 48px;
        min-height: 48px;
        max-height: 48px;
        margin: 0;
        padding: 0 16px !important;
        box-sizing: border-box;
        border-radius: 8px;
        font-size: 16px !important;
        line-height: normal !important;
        text-align: left;
        color: #fff;
        caret-color: #facc15;
        appearance: none;
        -webkit-appearance: none;
        transform: none !important;
        -webkit-transform: none !important;
    }

    .feed-container .search-bar::placeholder {
        font-size: 16px;
        line-height: normal;
        opacity: 1;
    }

    .feed-container .search-bar::-webkit-search-decoration,
    .feed-container .search-bar::-webkit-search-cancel-button,
    .feed-container .search-bar::-webkit-search-results-button,
    .feed-container .search-bar::-webkit-search-results-decoration {
        -webkit-appearance: none;
        appearance: none;
    }
}

@media (max-width: 480px) {
    html,
    body {
        font-size: 16px;
    }

    .logo {
        font-size: 1.2rem;
    }

    .post-title,
    .feed-container .post-title,
    .publisher-post .post-title {
        font-size: 1.16rem !important;
    }
}

/* Mobile email-client rendering for imported newsletters.
   Older post rules make tables nowrap/block on phones; newsletters are table-heavy,
   so they need their own responsive layer to stay readable instead of clipped. */
.post-content .nuzler-newsletter,
.main-feed-post-content .nuzler-newsletter,
.nuzler-view-content .nuzler-newsletter,
.nuzler-post .post-content .nuzler-newsletter {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-wrap: normal;
    word-break: normal;
    box-sizing: border-box;
}

.post-content .nuzler-newsletter *,
.main-feed-post-content .nuzler-newsletter *,
.nuzler-view-content .nuzler-newsletter *,
.nuzler-post .post-content .nuzler-newsletter * {
    box-sizing: border-box;
}

.post-content .nuzler-newsletter-original table,
.main-feed-post-content .nuzler-newsletter-original table,
.nuzler-view-content .nuzler-newsletter-original table,
.nuzler-post .post-content .nuzler-newsletter-original table {
    max-width: 100% !important;
}

@media (max-width: 768px) {
    .post-content:has(.nuzler-newsletter-original),
    .main-feed-post-content:has(.nuzler-newsletter-original),
    .nuzler-view-content:has(.nuzler-newsletter-original),
    .nuzler-post .post-content:has(.nuzler-newsletter-original) {
        overflow-x: hidden !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }

    .post-content .nuzler-newsletter-original,
    .main-feed-post-content .nuzler-newsletter-original,
    .nuzler-view-content .nuzler-newsletter-original,
    .nuzler-post .post-content .nuzler-newsletter-original {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    .post-content .nuzler-newsletter-original table,
    .main-feed-post-content .nuzler-newsletter-original table,
    .nuzler-view-content .nuzler-newsletter-original table,
    .nuzler-post .post-content .nuzler-newsletter-original table {
        display: table !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    .post-content .nuzler-newsletter-original tr,
    .main-feed-post-content .nuzler-newsletter-original tr,
    .nuzler-view-content .nuzler-newsletter-original tr,
    .nuzler-post .post-content .nuzler-newsletter-original tr {
        width: 100% !important;
        max-width: 100% !important;
    }

    .post-content .nuzler-newsletter-original td,
    .post-content .nuzler-newsletter-original th,
    .main-feed-post-content .nuzler-newsletter-original td,
    .main-feed-post-content .nuzler-newsletter-original th,
    .nuzler-view-content .nuzler-newsletter-original td,
    .nuzler-view-content .nuzler-newsletter-original th,
    .nuzler-post .post-content .nuzler-newsletter-original td,
    .nuzler-post .post-content .nuzler-newsletter-original th {
        max-width: 100% !important;
        min-width: 0 !important;
        white-space: normal !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }

    .post-content .nuzler-newsletter-original .nuzler-email-stack-on-mobile > tbody > tr > td,
    .post-content .nuzler-newsletter-original .nuzler-email-stack-on-mobile > tr > td,
    .main-feed-post-content .nuzler-newsletter-original .nuzler-email-stack-on-mobile > tbody > tr > td,
    .main-feed-post-content .nuzler-newsletter-original .nuzler-email-stack-on-mobile > tr > td,
    .nuzler-view-content .nuzler-newsletter-original .nuzler-email-stack-on-mobile > tbody > tr > td,
    .nuzler-view-content .nuzler-newsletter-original .nuzler-email-stack-on-mobile > tr > td,
    .nuzler-post .post-content .nuzler-newsletter-original .nuzler-email-stack-on-mobile > tbody > tr > td,
    .nuzler-post .post-content .nuzler-newsletter-original .nuzler-email-stack-on-mobile > tr > td {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .post-content .nuzler-newsletter-original img,
    .main-feed-post-content .nuzler-newsletter-original img,
    .nuzler-view-content .nuzler-newsletter-original img,
    .nuzler-post .post-content .nuzler-newsletter-original img {
        max-width: 100% !important;
        height: auto !important;
    }

    .post-content .nuzler-newsletter-original a,
    .main-feed-post-content .nuzler-newsletter-original a,
    .nuzler-view-content .nuzler-newsletter-original a,
    .nuzler-post .post-content .nuzler-newsletter-original a {
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .main-feed-post-content .nuzler-newsletter-original {
        font-size: 0.94rem;
        line-height: 1.55;
    }
}

@media (max-width: 480px) {
    .feed-container .post-content:has(.nuzler-newsletter-original),
    #postsContainer .post .post-content:has(.nuzler-newsletter-original) {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .post-content .nuzler-newsletter-original .nuzler-newsletter-img-social-icon,
    .post-content .nuzler-newsletter-original .nuzler-newsletter-img-icon,
    .main-feed-post-content .nuzler-newsletter-original .nuzler-newsletter-img-social-icon,
    .main-feed-post-content .nuzler-newsletter-original .nuzler-newsletter-img-icon,
    .nuzler-view-content .nuzler-newsletter-original .nuzler-newsletter-img-social-icon,
    .nuzler-view-content .nuzler-newsletter-original .nuzler-newsletter-img-icon {
        max-width: 28px !important;
        max-height: 28px !important;
    }
}

.miriam-feed-remove-btn,
.miriam-feed-pin-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(248, 113, 113, 0.55);
    border-radius: 6px;
    background: rgba(127, 29, 29, 0.34);
    color: #fecaca;
    font: inherit;
    font-size: 0.88rem;
    font-weight: 800;
    line-height: 1.1;
    cursor: pointer;
    white-space: nowrap;
}

.miriam-feed-pin-btn {
    border-color: rgba(96, 165, 250, 0.55);
    background: rgba(29, 78, 216, 0.24);
    color: #bfdbfe;
}

.miriam-feed-pin-btn.is-pinned {
    border-color: rgba(250, 204, 21, 0.62);
    background: rgba(113, 63, 18, 0.32);
    color: #fef3c7;
}

.miriam-feed-remove-btn:hover,
.miriam-feed-remove-btn:focus-visible,
.miriam-feed-pin-btn:hover,
.miriam-feed-pin-btn:focus-visible {
    background: rgba(185, 28, 28, 0.5);
    border-color: rgba(252, 165, 165, 0.82);
    color: #fff;
    outline: none;
}

.miriam-feed-pin-btn:hover,
.miriam-feed-pin-btn:focus-visible {
    background: rgba(37, 99, 235, 0.4);
    border-color: rgba(147, 197, 253, 0.85);
}

.miriam-feed-pin-btn.is-pinned:hover,
.miriam-feed-pin-btn.is-pinned:focus-visible {
    background: rgba(161, 98, 7, 0.44);
    border-color: rgba(253, 224, 71, 0.85);
}

.miriam-feed-remove-btn:disabled,
.miriam-feed-pin-btn:disabled {
    cursor: wait;
    opacity: 0.78;
}

.miriam-feed-remove-done {
    background: rgba(20, 83, 45, 0.45);
    border-color: rgba(74, 222, 128, 0.58);
    color: #bbf7d0;
}

.miriam-feed-removing {
    opacity: 0.3;
    transform: scale(0.995);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.miriam-feed-notice {
    position: fixed;
    left: 50%;
    bottom: 22px;
    z-index: 100000;
    transform: translate(-50%, 16px);
    max-width: min(92vw, 520px);
    padding: 12px 16px;
    border: 1px solid rgba(74, 222, 128, 0.45);
    border-radius: 8px;
    background: rgba(5, 46, 22, 0.94);
    color: #dcfce7;
    font-size: 0.95rem;
    font-weight: 800;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.miriam-feed-notice.visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

.pinned-feed-note {
    position: relative;
    z-index: 12;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 38px;
    margin: 0 0 16px;
    padding: 7px 16px;
    overflow: visible;
    border: 1px solid rgba(229, 190, 105, 0.36);
    border-left: 0;
    border-right: 0;
    border-radius: inherit inherit 0 0;
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0) 24%, rgba(255, 255, 255, 0.1) 100%),
        linear-gradient(135deg, rgba(76, 54, 22, 0.62), rgba(19, 28, 25, 0.84) 48%, rgba(94, 63, 20, 0.48));
    color: #fff7d7;
    box-shadow:
        0 1px 0 rgba(255, 246, 199, 0.16) inset,
        0 12px 28px rgba(0, 0, 0, 0.18);
    pointer-events: none;
}

.post > .pinned-feed-note,
.nuzler-post > .pinned-feed-note,
.nuzler-view-container > .pinned-feed-note {
    margin-bottom: 0;
}

.pinned-feed-note::before {
    content: "";
    position: absolute;
    inset: auto 18px -1px;
    height: 1px;
    background: linear-gradient(90deg, rgba(229, 190, 105, 0), rgba(229, 190, 105, 0.5), rgba(229, 190, 105, 0));
}

.pinned-feed-note span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    min-height: 26px;
    padding: 5px 14px;
    border: 1px solid rgba(255, 230, 151, 0.34);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 226, 139, 0.18), rgba(255, 226, 139, 0.05)),
        rgba(7, 13, 15, 0.34);
    color: #ffe8a8;
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 0 1px 1px rgba(14, 10, 4, 0.65);
    box-shadow:
        0 1px 0 rgba(255, 248, 205, 0.16) inset,
        0 10px 20px rgba(0, 0, 0, 0.16);
    white-space: nowrap;
}

.pinned-feed-note span::before,
.pinned-feed-note span::after {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.72;
}

@media (max-width: 640px) {
    .miriam-feed-remove-btn,
    .miriam-feed-pin-btn {
        width: 100%;
    }

    .pinned-feed-note {
        min-height: 34px;
        padding: 6px 12px;
    }

    .pinned-feed-note span {
        min-height: 24px;
        padding: 5px 12px;
        font-size: 0.64rem;
    }
}

/* ===== Premium visual identity layer v7.7 ===== */
:root {
    --nuzler-bg: #0b0d0c;
    --nuzler-bg-2: #111411;
    --nuzler-surface: rgba(21, 25, 22, 0.82);
    --nuzler-surface-strong: rgba(26, 31, 27, 0.94);
    --nuzler-line: rgba(227, 220, 196, 0.12);
    --nuzler-line-strong: rgba(227, 220, 196, 0.2);
    --nuzler-text: #f2f0e8;
    --nuzler-muted: #aaa89d;
    --nuzler-soft: #777a70;
    --nuzler-gold: #d9b35f;
    --nuzler-jade: #48d597;
    --nuzler-coral: #ff6f8f;
    --nuzler-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
}

body {
    background:
        linear-gradient(145deg, rgba(72, 213, 151, 0.08) 0%, transparent 26%),
        linear-gradient(315deg, rgba(255, 111, 143, 0.055) 0%, transparent 28%),
        linear-gradient(180deg, #10130f 0%, #0b0d0c 42%, #0a0b0a 100%);
    color: var(--nuzler-text);
}

header.site-header {
    background:
        linear-gradient(135deg, rgba(17, 22, 18, 0.96), rgba(31, 38, 31, 0.94) 52%, rgba(37, 28, 35, 0.94));
    border-bottom: 1px solid rgba(217, 179, 95, 0.24);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.32), inset 0 -1px 0 rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.logo {
    color: #fffaf0;
    text-shadow: 0 1px 18px rgba(217, 179, 95, 0.12);
}

.logo span,
.beta-tag {
    color: var(--nuzler-gold);
}

.beta-tag {
    background: rgba(217, 179, 95, 0.08);
    border-color: rgba(217, 179, 95, 0.7);
}

.slogan {
    color: rgba(242, 240, 232, 0.82);
}

.typing-text {
    border-right-color: rgba(217, 179, 95, 0.8);
}

.profile-email {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(217, 179, 95, 0.22);
    color: #fffaf0;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.profile-email:hover,
.profile-email:focus-visible {
    border-color: rgba(217, 179, 95, 0.52);
    background: rgba(217, 179, 95, 0.1);
}

.profile-menu,
.tier-picker,
.tier-auth-prompt {
    background: linear-gradient(180deg, rgba(24, 29, 25, 0.98), rgba(13, 15, 13, 0.98));
    border-color: rgba(217, 179, 95, 0.18);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.tier-picker-header {
    border-bottom-color: rgba(217, 179, 95, 0.16);
}

.tier-picker-item:hover,
.tier-picker-item.active {
    background: rgba(72, 213, 151, 0.1);
}

.tier-picker-item.added {
    background: rgba(217, 179, 95, 0.1);
    color: #f2d99b;
}

.tier-picker-close:hover,
.tier-add-btn:hover {
    background: rgba(217, 179, 95, 0.14);
    border-color: rgba(217, 179, 95, 0.42);
    color: #f2d99b;
}

.feed-container {
    padding-top: 24px;
}

.feed-container .search-bar,
.search-bar {
    background: rgba(16, 19, 17, 0.76) !important;
    border: 1px solid rgba(227, 220, 196, 0.18) !important;
    color: var(--nuzler-text) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 10px 26px rgba(0, 0, 0, 0.2);
}

.feed-container .search-bar:focus,
.search-bar:focus {
    border-color: rgba(217, 179, 95, 0.5) !important;
    box-shadow: 0 0 0 3px rgba(217, 179, 95, 0.12), 0 16px 34px rgba(0, 0, 0, 0.26);
}

.feed-container .tabs {
    padding: 6px 8px;
    border: 1px solid rgba(227, 220, 196, 0.12);
    border-radius: 16px;
    background:
        linear-gradient(180deg, rgba(28, 30, 28, 0.7), rgba(12, 14, 12, 0.65));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 10px 28px rgba(0, 0, 0, 0.28);
    overflow: hidden;
}

.feed-container .tabs-scroll {
    padding: 0 6px;
    overflow-x: auto;
    flex-wrap: nowrap;
}

.feed-container .tabs-scroll .tab {
    color: rgba(242, 240, 232, 0.66);
    border-radius: 12px;
    transition: color 0.2s ease, background 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

.feed-container .tabs-scroll .tab:hover {
    color: #fffaf0;
    background: rgba(255, 255, 255, 0.045);
}

.feed-container .tabs-scroll .tab.active {
    color: #fffaf0;
    transform: translateY(-0.5px);
}

.feed-container .tabs-scroll .tab.active:not(.tier-tab) {
    border-radius: 12px;
    background:
        linear-gradient(180deg,
            rgba(var(--tier-r, 217), var(--tier-g, 179), var(--tier-b, 95), 0.22),
            rgba(var(--tier-r, 217), var(--tier-g, 179), var(--tier-b, 95), 0.06));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 0 0 1px rgba(var(--tier-r, 217), var(--tier-g, 179), var(--tier-b, 95), 0.36),
        inset 0 -2px 0 rgba(var(--tier-r, 217), var(--tier-g, 179), var(--tier-b, 95), 0.85);
}

.feed-container .tabs-scroll .tab[data-feed="forYou"].active {
    background:
        linear-gradient(180deg, rgba(217, 179, 95, 0.22), rgba(72, 213, 151, 0.08));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        inset 0 0 0 1px rgba(217, 179, 95, 0.36),
        inset 0 -2px 0 rgba(217, 179, 95, 0.85);
}

.feed-container .tabs-scroll .tab.active::after,
.feed-container .tabs-scroll .tab[data-feed="forYou"].active::after,
.feed-container .tabs-scroll .tab:not([data-feed="forYou"]).active::after {
    display: none;
    content: none;
}

.tier-add-btn {
    background: rgba(255, 255, 255, 0.055);
    border-color: rgba(227, 220, 196, 0.18);
    color: rgba(242, 240, 232, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}

.tier-add-btn:hover {
    transform: translateY(-1px);
}

.feed-container .tabs-scroll .tier-tab {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(227, 220, 196, 0.12);
}

.feed-container .tabs-scroll .tier-tab.active {
    box-shadow: inset 0 -3px 0 rgb(var(--tier-r, 217), var(--tier-g, 179), var(--tier-b, 95)), 0 0 18px rgba(var(--tier-r, 217), var(--tier-g, 179), var(--tier-b, 95), 0.12);
}

/* ===== Tier picker dropdown — modern rail-matched design ===== */
.tier-picker {
    top: 64px;
    right: 16px;
    width: min(340px, calc(100vw - 24px));
    padding: 0;
    border-radius: 16px;
    border: 1px solid rgba(227, 220, 196, 0.14);
    background:
        linear-gradient(180deg, rgba(28, 30, 28, 0.94), rgba(14, 16, 14, 0.94));
    box-shadow:
        0 24px 64px rgba(0, 0, 0, 0.55),
        inset 0 1px 0 rgba(255, 255, 255, 0.045);
    overflow: hidden;
}

.tier-picker-header {
    padding: 14px 16px 10px;
    border-bottom: 1px solid rgba(227, 220, 196, 0.08);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.02), transparent);
}

.tier-picker-heading {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.tier-picker-title {
    color: #fffaf0;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.tier-picker-subtitle {
    color: rgba(242, 240, 232, 0.55);
    font-size: 0.72rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.tier-picker-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(227, 220, 196, 0.16);
    color: rgba(242, 240, 232, 0.78);
    font-size: 1rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.15s ease;
}

.tier-picker-close:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fffaf0;
    border-color: rgba(227, 220, 196, 0.3);
    transform: rotate(90deg);
}

.tier-picker-search {
    padding: 10px 14px 6px;
}

.tier-picker-search input {
    width: 100%;
    padding: 9px 12px;
    border-radius: 10px;
    border: 1px solid rgba(227, 220, 196, 0.16);
    background: rgba(16, 19, 17, 0.6);
    color: #fffaf0;
    font-family: inherit;
    font-size: 0.85rem;
    outline: none;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.tier-picker-search input::placeholder {
    color: rgba(242, 240, 232, 0.42);
}

.tier-picker-search input:focus {
    border-color: rgba(217, 179, 95, 0.45);
    background: rgba(16, 19, 17, 0.85);
    box-shadow: 0 0 0 3px rgba(217, 179, 95, 0.12);
}

.tier-picker-body {
    max-height: min(58vh, 420px);
    overflow-y: auto;
    padding: 6px 8px 10px;
    scrollbar-width: thin;
    scrollbar-color: rgba(227, 220, 196, 0.18) transparent;
}

.tier-picker-body::-webkit-scrollbar { width: 8px; }
.tier-picker-body::-webkit-scrollbar-thumb {
    background: rgba(227, 220, 196, 0.18);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.tier-picker-item {
    appearance: none;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    margin: 2px 0;
    border-radius: 10px;
    border: 1px solid transparent;
    background: transparent;
    color: rgba(242, 240, 232, 0.78);
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.15s ease;
}

.tier-picker-item .tp-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.04), 0 0 8px currentColor;
    color: rgba(255, 255, 255, 0.0);
}

.tier-picker-item .tp-label {
    flex: 1;
    min-width: 0;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tier-picker-item .tp-state {
    flex-shrink: 0;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(242, 240, 232, 0.5);
}

.tier-picker-item:hover {
    background: rgba(255, 255, 255, 0.05);
    color: #fffaf0;
    border-color: rgba(227, 220, 196, 0.12);
}

.tier-picker-item.added {
    background: rgba(217, 179, 95, 0.1);
    color: #fffaf0;
}

.tier-picker-item.added .tp-state::before {
    content: "Added";
    color: rgba(217, 179, 95, 0.9);
}

.tier-picker-item.active {
    background:
        linear-gradient(180deg, rgba(217, 179, 95, 0.22), rgba(217, 179, 95, 0.06));
    color: #fffaf0;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        inset 0 0 0 1px rgba(217, 179, 95, 0.32);
}

.tier-picker-item.active .tp-state::before {
    content: "Active";
    color: rgba(255, 250, 240, 0.95);
}

.tier-picker-empty {
    margin: 14px 12px 8px;
    padding: 18px 12px;
    border-radius: 10px;
    border: 1px dashed rgba(227, 220, 196, 0.16);
    color: rgba(242, 240, 232, 0.55);
    font-size: 0.82rem;
    text-align: center;
}

.tier-picker-prompt {
    width: min(320px, calc(100vw - 24px));
}

.tier-picker-prompt-body {
    padding: 14px 16px 18px;
}

.tier-prompt-msg {
    margin: 0 0 14px;
    font-size: 0.86rem;
    line-height: 1.45;
    color: rgba(242, 240, 232, 0.78);
}

.tier-prompt-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.tier-prompt-btn {
    flex: 1 1 120px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid transparent;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.15s ease;
}

.tier-prompt-btn-primary {
    background: linear-gradient(180deg, rgba(217, 179, 95, 0.28), rgba(217, 179, 95, 0.14));
    border-color: rgba(217, 179, 95, 0.42);
    color: #fffaf0;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.tier-prompt-btn-primary:hover {
    background: linear-gradient(180deg, rgba(217, 179, 95, 0.36), rgba(217, 179, 95, 0.18));
    border-color: rgba(217, 179, 95, 0.55);
    transform: translateY(-1px);
}

.tier-prompt-btn-secondary {
    background: rgba(255, 255, 255, 0.045);
    border-color: rgba(227, 220, 196, 0.18);
    color: rgba(242, 240, 232, 0.85);
}

.tier-prompt-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(227, 220, 196, 0.32);
    color: #fffaf0;
    transform: translateY(-1px);
}

@media (max-width: 768px) {
    .tier-picker {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100%;
        border-radius: 18px 18px 0 0;
        transform-origin: bottom center;
    }
    .tier-picker-body { max-height: 60vh; }
}
/* ===== End tier picker dropdown ===== */

.post,
.feed-container .post {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.015)),
        var(--nuzler-surface);
    border-color: var(--nuzler-line);
    border-left-color: var(--tier-accent, var(--nuzler-gold));
    border-radius: 14px;
    box-shadow: var(--nuzler-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.post::before,
.feed-container .post::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 2px;
    background: linear-gradient(90deg, var(--tier-accent, var(--nuzler-gold)), transparent 72%);
    opacity: 0.86;
    pointer-events: none;
}

.post:hover,
.feed-container .post:hover {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.025)),
        var(--nuzler-surface-strong);
    border-color: var(--nuzler-line-strong);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.025) inset;
}

.post-header {
    border-bottom-color: rgba(227, 220, 196, 0.1);
}

.post-header .profile-pic,
.profile-pic,
.initials-avatar,
.avatar-image {
    box-shadow: 0 0 0 3px rgba(10, 12, 10, 0.72), 0 10px 26px rgba(0, 0, 0, 0.34), 0 0 24px color-mix(in srgb, var(--tier-accent, var(--nuzler-gold)) 24%, transparent);
}

.post-header .author,
.author-name,
.pub-post-name {
    letter-spacing: 0;
}

.author-tier,
.nuzler-type,
.posting-rate,
.subscriber-count,
.nuzler-brand-tag,
.tier-display {
    border: 1px solid rgba(227, 220, 196, 0.12);
    background: rgba(255, 255, 255, 0.045);
    border-radius: 8px;
}

.author-tier,
.nuzler-type,
.posting-rate {
    width: fit-content;
    padding: 2px 8px;
}

.nuzler-brand-tag {
    background: rgba(217, 179, 95, 0.085);
    border-color: rgba(217, 179, 95, 0.24);
    color: #f4e7c2;
}

a.nuzler-brand-tag:hover {
    border-color: currentColor;
    box-shadow: 0 0 0 3px rgba(217, 179, 95, 0.08);
}

.post-title,
.feed-container .post-title {
    color: #fffaf0;
    border-bottom-color: rgba(227, 220, 196, 0.1);
}

.feed-container .post-title .post-title-link,
.post-title .post-title-link {
    color: #fffaf0;
}

.feed-container .post-title .post-title-link:hover,
.post-title .post-title-link:hover {
    color: #f2d99b;
}

.feed-container .post-content,
.post-content {
    color: rgba(242, 240, 232, 0.78);
}

.post-footer,
.feed-container .post-footer {
    border-top-color: rgba(227, 220, 196, 0.1);
}

.post-footer .stats span,
.post-footer .stats button {
    color: rgba(242, 240, 232, 0.62);
}

.post-footer .stats span:hover,
.post-footer .stats button:hover {
    color: #fffaf0;
    background: rgba(255, 255, 255, 0.045);
    border-color: rgba(227, 220, 196, 0.1);
}

.post-header .subscribe-button,
.tier-auth-signup {
    background: rgba(217, 179, 95, 0.12);
    color: #f2d99b;
    box-shadow: 0 12px 26px rgba(217, 179, 95, 0.18);
}

.post-header .subscribe-button:not(.subscribed):hover {
    box-shadow: 0 16px 34px rgba(217, 179, 95, 0.26);
}

.post-header .subscribe-button.subscribed {
    background: linear-gradient(135deg, #48d597 0%, #2aa876 100%);
    color: #06110d;
}

.comment-form textarea {
    background: rgba(10, 12, 10, 0.62);
    border-color: rgba(227, 220, 196, 0.13);
    color: var(--nuzler-text);
}

.comment-form textarea:focus {
    border-color: rgba(217, 179, 95, 0.44);
    box-shadow: 0 0 0 3px rgba(217, 179, 95, 0.1);
}

.post-comment-btn {
    background: rgba(217, 179, 95, 0.13) !important;
    border-color: rgba(217, 179, 95, 0.26) !important;
    color: #f2d99b !important;
}

.post-comment-btn:hover {
    background: rgba(217, 179, 95, 0.2) !important;
}

.tier-red { --tier-accent: #ff5d6c; }
.tier-blue { --tier-accent: #5aa7ff; }
.tier-orange { --tier-accent: #ff985f; }
.tier-purple { --tier-accent: #b893ff; }
.tier-green { --tier-accent: #48d597; }
.tier-yellow { --tier-accent: #e8c85f; }
.tier-pink { --tier-accent: #ff7eb6; }
.tier-mint { --tier-accent: #52ddc5; }
.tier-magenta { --tier-accent: #e46df5; }
.tier-indigo { --tier-accent: #7b83ff; }
.tier-emerald { --tier-accent: #18c488; }
.tier-stadium { --tier-accent: #37d56e; }
.tier-copper { --tier-accent: #c9823d; }
.tier-sky { --tier-accent: #32b8ea; }
.tier-coral { --tier-accent: #ff7890; }
.tier-royal { --tier-accent: #5c8df6; }
.tier-rose { --tier-accent: #ff5d78; }
.tier-meme { --tier-accent: #ff58cf; }
.tier-audio { --tier-accent: #a78bfa; }

.profile-pic.red, .initials-avatar.red, .avatar-image.red { --tier-accent: #ff5d6c; }
.profile-pic.blue, .initials-avatar.blue, .avatar-image.blue { --tier-accent: #5aa7ff; }
.profile-pic.orange, .initials-avatar.orange, .avatar-image.orange { --tier-accent: #ff985f; }
.profile-pic.purple, .initials-avatar.purple, .avatar-image.purple { --tier-accent: #b893ff; }
.profile-pic.green, .initials-avatar.green, .avatar-image.green { --tier-accent: #48d597; }
.profile-pic.yellow, .initials-avatar.yellow, .avatar-image.yellow { --tier-accent: #e8c85f; }
.profile-pic.pink, .initials-avatar.pink, .avatar-image.pink { --tier-accent: #ff7eb6; }
.profile-pic.mint, .initials-avatar.mint, .avatar-image.mint { --tier-accent: #52ddc5; }
.profile-pic.magenta, .initials-avatar.magenta, .avatar-image.magenta { --tier-accent: #e46df5; }
.profile-pic.indigo, .initials-avatar.indigo, .avatar-image.indigo { --tier-accent: #7b83ff; }
.profile-pic.emerald, .initials-avatar.emerald, .avatar-image.emerald { --tier-accent: #18c488; }
.profile-pic.stadium, .initials-avatar.stadium, .avatar-image.stadium { --tier-accent: #37d56e; }
.profile-pic.copper, .initials-avatar.copper, .avatar-image.copper { --tier-accent: #c9823d; }
.profile-pic.sky, .initials-avatar.sky, .avatar-image.sky { --tier-accent: #32b8ea; }
.profile-pic.coral, .initials-avatar.coral, .avatar-image.coral { --tier-accent: #ff7890; }
.profile-pic.royal, .initials-avatar.royal, .avatar-image.royal { --tier-accent: #5c8df6; }
.profile-pic.rose, .initials-avatar.rose, .avatar-image.rose { --tier-accent: #ff5d78; }
.profile-pic.meme, .initials-avatar.meme, .avatar-image.meme { --tier-accent: #ff58cf; }
.profile-pic.audio, .initials-avatar.audio, .avatar-image.audio { --tier-accent: #a78bfa; }

@media (max-width: 768px) {
    .feed-container .tabs {
        padding: 5px;
        border-radius: 12px;
    }

    .feed-container .tabs-scroll {
        align-items: center;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }

    .feed-container .tabs-scroll.has-tier-tabs .tab,
    .feed-container .tabs-scroll.has-tier-tabs .tab[data-core="1"],
    .feed-container .tabs-scroll.has-tier-tabs .tier-tab {
        flex: 0 0 auto;
        min-width: max-content;
        max-width: none;
        white-space: nowrap;
    }

    .feed-container .tabs-scroll.has-tier-tabs .tab[data-core="1"] {
        min-width: 104px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .feed-container .tabs-scroll.has-tier-tabs .tier-tab {
        min-width: 118px;
        justify-content: center;
    }

    .post,
    .feed-container .post {
        border-radius: 12px;
    }
}

/* --- Premium Signup / Signin Dropdown v7.8 --- */
.profile-menu.profile-menu-guest {
    width: min(340px, calc(100vw - 24px));
    padding: 12px;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.018)),
        rgba(16, 19, 17, 0.98);
    border: 1px solid rgba(227, 220, 196, 0.18);
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.05);
    overflow: visible;
}

.profile-menu.profile-menu-guest::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(90deg, #d9b35f, #48d597, #cc6f72);
    pointer-events: none;
}

.profile-menu.profile-menu-guest .guest-menu {
    padding: 0;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.profile-menu.profile-menu-guest .btn-signup,
.profile-menu.profile-menu-guest .btn-login {
    min-height: 52px;
    border-radius: 8px;
    padding: 14px 16px;
    font-size: 1.02rem;
    font-weight: 850;
    letter-spacing: 0;
}

.profile-menu.profile-menu-guest .btn-signup {
    background: rgba(217, 179, 95, 0.12);
    color: #f2d99b;
    border-color: rgba(217, 179, 95, 0.34);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 10px 24px rgba(0, 0, 0, 0.18);
}

.profile-menu.profile-menu-guest .btn-login {
    background: rgba(255, 255, 255, 0.045);
    color: rgba(255, 248, 234, 0.9);
    border-color: rgba(227, 220, 196, 0.18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.profile-menu.profile-menu-guest .btn-signup:hover,
.profile-menu.profile-menu-guest .btn-signup:focus-visible {
    background: rgba(217, 179, 95, 0.2);
    border-color: rgba(217, 179, 95, 0.52);
    color: #fff8ea;
    transform: translateY(-1px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 12px 28px rgba(0, 0, 0, 0.22);
}

.profile-menu.profile-menu-guest .btn-login:hover,
.profile-menu.profile-menu-guest .btn-login:focus-visible {
    background: rgba(217, 179, 95, 0.1);
    border-color: rgba(217, 179, 95, 0.34);
    color: #f2d99b;
    transform: translateY(-1px);
}

.profile-menu.profile-menu-guest .btn-signup::after,
.profile-menu.profile-menu-guest .btn-login::after {
    content: "";
    width: 8px;
    height: 8px;
    margin-left: 10px;
    border-radius: 999px;
    background: currentColor;
    opacity: 0.44;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-guest {
        width: min(360px, calc(100vw - 20px));
        padding: 14px;
        right: 10px;
    }

    .profile-menu.profile-menu-guest .guest-menu-actions {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .profile-menu.profile-menu-guest .btn-signup,
    .profile-menu.profile-menu-guest .btn-login {
        min-height: 50px;
        font-size: 1rem;
    }
}

/* --- Signed-out custom feed prompt v7.9 --- */
.tier-auth-prompt {
    width: min(320px, calc(100vw - 24px));
    padding: 16px;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.018)),
        rgba(16, 19, 17, 0.98);
    border: 1px solid rgba(227, 220, 196, 0.18);
    box-shadow: 0 26px 70px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.tier-auth-prompt::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(90deg, #d9b35f, #48d597, #cc6f72);
    pointer-events: none;
}

.tier-auth-prompt p {
    margin: 4px 0 14px;
    color: rgba(255, 248, 234, 0.86);
    font-size: 1rem;
    line-height: 1.45;
    font-weight: 740;
}

.tier-auth-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.tier-auth-btn {
    min-height: 48px;
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 0.98rem;
    font-weight: 840;
    text-decoration: none;
    border: 1px solid transparent;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.tier-auth-signup,
.post-header .subscribe-button.tier-auth-signup {
    background: rgba(217, 179, 95, 0.12);
    border-color: rgba(217, 179, 95, 0.32);
    color: #f2d99b;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 10px 24px rgba(0, 0, 0, 0.18);
}

.tier-auth-signup:hover,
.tier-auth-signup:focus-visible {
    background: rgba(217, 179, 95, 0.18);
    border-color: rgba(217, 179, 95, 0.48);
    color: #fff8ea;
    transform: translateY(-1px);
}

.tier-auth-login {
    background: rgba(255, 255, 255, 0.045);
    color: rgba(255, 248, 234, 0.86);
    border-color: rgba(227, 220, 196, 0.16);
}

.tier-auth-login:hover,
.tier-auth-login:focus-visible {
    background: rgba(72, 213, 151, 0.1);
    border-color: rgba(72, 213, 151, 0.3);
    color: #c9f8df;
    transform: translateY(-1px);
}

@media (max-width: 768px) {
    .tier-auth-prompt {
        width: 100%;
        max-width: 100%;
        padding: 24px 20px;
        border-radius: 16px 16px 0 0;
    }

    .tier-auth-prompt::before {
        border-radius: 16px 16px 0 0;
    }
}

/* --- Final auth CTA color override v8.0 --- */
.profile-menu.profile-menu-guest .btn-signup,
.tier-auth-prompt .tier-auth-signup,
.tier-auth-signup {
    background: rgba(217, 179, 95, 0.12) !important;
    border: 1px solid rgba(217, 179, 95, 0.34) !important;
    color: #f2d99b !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 10px 24px rgba(0, 0, 0, 0.18) !important;
}

.profile-menu.profile-menu-guest .btn-signup:hover,
.profile-menu.profile-menu-guest .btn-signup:focus-visible,
.tier-auth-prompt .tier-auth-signup:hover,
.tier-auth-prompt .tier-auth-signup:focus-visible,
.tier-auth-signup:hover,
.tier-auth-signup:focus-visible {
    background: rgba(217, 179, 95, 0.2) !important;
    border-color: rgba(217, 179, 95, 0.52) !important;
    color: #fff8ea !important;
    transform: translateY(-1px);
}

.profile-menu.profile-menu-guest .btn-signup::after,
.tier-auth-prompt .tier-auth-signup::after {
    background: currentColor !important;
    opacity: 0.42 !important;
}

/* --- Header auth buttons use isolated classes v8.3 --- */
.profile-menu.profile-menu-guest .header-auth-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    width: 100%;
    padding: 16px 18px;
    border-radius: 8px;
    text-decoration: none;
    font-size: 1.08rem;
    font-weight: 880;
    line-height: 1.2;
    letter-spacing: 0;
    border: 1px solid transparent;
    position: relative;
    overflow: hidden;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.profile-menu.profile-menu-guest .header-auth-signup {
    background:
        linear-gradient(135deg, rgba(230, 194, 112, 0.96) 0%, rgba(189, 147, 68, 0.94) 52%, rgba(160, 117, 55, 0.96) 100%);
    border-color: rgba(255, 232, 174, 0.42);
    color: #161006;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.22);
    box-shadow:
        0 16px 34px rgba(217, 179, 95, 0.2),
        0 8px 18px rgba(0, 0, 0, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.profile-menu.profile-menu-guest .header-auth-signup:hover,
.profile-menu.profile-menu-guest .header-auth-signup:focus-visible {
    background:
        linear-gradient(135deg, rgba(242, 211, 135, 0.98) 0%, rgba(204, 163, 78, 0.96) 52%, rgba(176, 132, 62, 0.98) 100%);
    border-color: rgba(255, 237, 190, 0.56);
    color: #120d05;
    transform: translateY(-1px);
    box-shadow:
        0 20px 42px rgba(217, 179, 95, 0.24),
        0 10px 22px rgba(0, 0, 0, 0.26),
        inset 0 1px 0 rgba(255, 255, 255, 0.34);
    outline: none;
}

.profile-menu.profile-menu-guest .header-auth-login {
    min-height: 54px;
    background: rgba(255, 255, 255, 0.055);
    border-color: rgba(227, 220, 196, 0.22);
    color: rgba(255, 248, 234, 0.94);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 10px 22px rgba(0, 0, 0, 0.16);
}

.profile-menu.profile-menu-guest .header-auth-login:hover,
.profile-menu.profile-menu-guest .header-auth-login:focus-visible {
    background: rgba(72, 213, 151, 0.1);
    border-color: rgba(72, 213, 151, 0.3);
    color: #c9f8df;
    transform: translateY(-1px);
    outline: none;
}

.profile-menu.profile-menu-guest .header-auth-btn::after {
    content: "";
    width: 24px;
    height: 24px;
    margin-left: 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.22);
    opacity: 1;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.profile-menu.profile-menu-guest .header-auth-btn::before {
    content: "";
    position: absolute;
    right: 25px;
    width: 7px;
    height: 7px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    z-index: 1;
    opacity: 0.82;
}

.profile-menu.profile-menu-guest .header-auth-login::after {
    background: rgba(255, 255, 255, 0.1);
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-guest .header-auth-btn {
        min-height: 56px;
        font-size: 1.05rem;
    }
}

/* --- Polished top-right guest auth dropdown v8.5 --- */
.profile-menu.profile-menu-guest {
    width: min(380px, calc(100vw - 24px)) !important;
    min-width: min(380px, calc(100vw - 24px));
    padding: 18px !important;
    align-items: stretch !important;
    gap: 0;
}

.profile-menu.profile-menu-guest .guest-menu,
.profile-menu.profile-menu-guest .mobile-guest-menu {
    width: 100% !important;
    padding: 0 !important;
    text-align: center !important;
    box-sizing: border-box;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    align-items: stretch !important;
}

.profile-menu.profile-menu-guest .header-auth-btn {
    width: 100% !important;
    min-height: 62px !important;
    padding: 17px 22px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    border-radius: 8px !important;
    font-size: 1.12rem !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    line-height: 1.15 !important;
    transform: translateY(0);
}

.profile-menu.profile-menu-guest .header-auth-signup {
    background:
        linear-gradient(135deg, #e5bd64 0%, #c99a4b 48%, #a97834 100%) !important;
    border: 1px solid rgba(255, 231, 170, 0.58) !important;
    color: #140f07 !important;
    box-shadow:
        0 18px 40px rgba(217, 179, 95, 0.28),
        0 10px 24px rgba(0, 0, 0, 0.32),
        inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
}

.profile-menu.profile-menu-guest .header-auth-signup:hover,
.profile-menu.profile-menu-guest .header-auth-signup:focus-visible {
    background:
        linear-gradient(135deg, #f2cf7f 0%, #ddb05d 48%, #bf8a3e 100%) !important;
    border-color: rgba(255, 240, 196, 0.76) !important;
    color: #100b04 !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 24px 50px rgba(217, 179, 95, 0.34),
        0 12px 28px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

.profile-menu.profile-menu-guest .header-auth-login {
    min-height: 58px !important;
    background: rgba(255, 255, 255, 0.065) !important;
    border: 1px solid rgba(227, 220, 196, 0.24) !important;
    color: rgba(255, 248, 234, 0.94) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 12px 26px rgba(0, 0, 0, 0.22) !important;
}

.profile-menu.profile-menu-guest .header-auth-login:hover,
.profile-menu.profile-menu-guest .header-auth-login:focus-visible {
    background: rgba(72, 213, 151, 0.15) !important;
    border-color: rgba(72, 213, 151, 0.45) !important;
    color: #d9ffe9 !important;
    transform: translateY(-2px) !important;
    box-shadow:
        0 18px 38px rgba(72, 213, 151, 0.13),
        0 10px 24px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.profile-menu.profile-menu-guest .header-auth-signup:hover,
.profile-menu.profile-menu-guest .header-auth-signup:focus-visible {
    background: linear-gradient(135deg, #f2cf7f 0%, #ddb05d 48%, #bf8a3e 100%) !important;
}

.profile-menu.profile-menu-guest .header-auth-login:hover,
.profile-menu.profile-menu-guest .header-auth-login:focus-visible {
    background: rgba(72, 213, 151, 0.15) !important;
}

.profile-menu.profile-menu-guest .header-auth-btn::after {
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    margin-left: 14px !important;
    background: rgba(255, 255, 255, 0.2) !important;
}

.profile-menu.profile-menu-guest .header-auth-btn::before {
    right: 29px !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-guest {
        width: auto !important;
        min-width: 0;
        padding: 18px !important;
    }

    .profile-menu.profile-menu-guest .mobile-guest-menu {
        padding: 0 !important;
    }
}

/* --- Signed-in account dropdown header reset v8.9 --- */
.profile-menu.profile-menu-logged-in .profile-menu-user {
    display: block !important;
    padding: 12px !important;
    margin: 0 0 12px !important;
    border-radius: 8px !important;
    background: rgba(10, 15, 18, 0.72) !important;
    border: 1px solid rgba(217, 179, 95, 0.18) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user-main {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    gap: 12px !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    color: #fffaf0 !important;
    text-decoration: none !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user .initials-avatar {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    flex: 0 0 52px !important;
    border-radius: 8px !important;
    font-size: 1.38rem !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user-copy {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 5px !important;
    min-width: 0 !important;
    text-align: left !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user-name {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    color: #fffaf0 !important;
    font-size: 1.18rem !important;
    font-weight: 900 !important;
    line-height: 1.08 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    letter-spacing: 0 !important;
}

.profile-menu.profile-menu-logged-in .profile-copy-address {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(217, 179, 95, 0.96) !important;
    font: inherit !important;
    text-align: left !important;
    cursor: copy !important;
    transform: none !important;
    position: static !important;
}

.profile-menu.profile-menu-logged-in .profile-copy-address:hover,
.profile-menu.profile-menu-logged-in .profile-copy-address:focus-visible {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    transform: none !important;
    color: #f2d99b !important;
}

.profile-menu.profile-menu-logged-in .profile-copy-address .profile-menu-address-value {
    display: block !important;
    max-width: 100% !important;
    color: inherit !important;
    font-size: 0.94rem !important;
    font-weight: 800 !important;
    line-height: 1.18 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 4px !important;
}

.profile-menu.profile-menu-logged-in .profile-copy-address.copied .profile-menu-address-value {
    color: #8ff0bb !important;
}

.profile-menu.profile-menu-logged-in .profile-copy-feedback {
    min-height: 1em !important;
    margin: 0 !important;
    color: #8ff0bb !important;
    font-size: 0.74rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    text-align: left !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in .profile-menu-user {
        padding: 12px !important;
        padding-right: 48px !important;
    }

    .profile-menu.profile-menu-logged-in .profile-menu-user-main {
        grid-template-columns: 46px minmax(0, 1fr) !important;
        gap: 10px !important;
    }

    .profile-menu.profile-menu-logged-in .profile-menu-user .initials-avatar {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        flex-basis: 46px !important;
        font-size: 1.22rem !important;
    }

    .profile-menu.profile-menu-logged-in .profile-menu-user-name {
        font-size: 1.08rem !important;
    }

    .profile-menu.profile-menu-logged-in .profile-copy-address .profile-menu-address-value {
        font-size: 0.88rem !important;
    }
}

/* --- Signed-in account dropdown compact identity row v9.1 --- */
.profile-menu.profile-menu-logged-in .profile-menu-user {
    display: block !important;
    min-height: 0 !important;
    padding: 12px !important;
    margin: 0 0 12px !important;
    border-radius: 8px !important;
    background: rgba(10, 15, 18, 0.72) !important;
    border: 1px solid rgba(217, 179, 95, 0.18) !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user-main {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
    min-width: 0 !important;
    text-decoration: none !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-avatar-link {
    display: block !important;
    flex: 0 0 48px !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    text-decoration: none !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user .initials-avatar {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    border-radius: 8px !important;
    font-size: 1.2rem !important;
    line-height: 1 !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user-copy {
    display: flex !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 4px !important;
    text-align: left !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user-name {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #fffaf0 !important;
    font-size: 1rem !important;
    font-weight: 900 !important;
    line-height: 1.08 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-user-name:hover,
.profile-menu.profile-menu-logged-in .profile-menu-user-name:focus-visible {
    color: #f2d99b !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .profile-copy-address {
    display: inline-block !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(217, 179, 95, 0.96) !important;
    font: inherit !important;
    cursor: copy !important;
    transform: none !important;
}

.profile-menu.profile-menu-logged-in .profile-copy-address .profile-menu-address-value {
    display: block !important;
    max-width: 100% !important;
    color: inherit !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 3px !important;
}

.profile-menu.profile-menu-logged-in .profile-copy-feedback {
    min-height: 0 !important;
    margin: 0 !important;
    color: #8ff0bb !important;
    font-size: 0.68rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    text-align: left !important;
}

.profile-menu.profile-menu-logged-in .profile-status {
    margin-bottom: 10px !important;
    padding: 8px 10px !important;
    font-size: 0.95rem !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in .profile-menu-user {
        padding: 10px 48px 10px 10px !important;
    }

    .profile-menu.profile-menu-logged-in .profile-menu-user-main {
        gap: 10px !important;
    }

    .profile-menu.profile-menu-logged-in .profile-menu-avatar-link,
    .profile-menu.profile-menu-logged-in .profile-menu-user .initials-avatar {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        flex-basis: 42px !important;
    }

    .profile-menu.profile-menu-logged-in .profile-menu-user-name {
        font-size: 0.98rem !important;
    }

    .profile-menu.profile-menu-logged-in .profile-copy-address .profile-menu-address-value {
        font-size: 0.8rem !important;
    }
}

/* --- Rebuilt signed-in dropdown header v9.2 --- */
.profile-menu.profile-menu-logged-in {
    gap: 10px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-header {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    min-height: 68px !important;
    margin: 0 !important;
    padding: 12px !important;
    box-sizing: border-box !important;
    border-radius: 8px !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(217, 179, 95, 0.055)) !important;
    border: 1px solid rgba(217, 179, 95, 0.18) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-avatar {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    background: var(--account-accent, #409eff) !important;
    color: #fff !important;
    font-size: 1.08rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-avatar:hover,
.profile-menu.profile-menu-logged-in .account-menu-avatar:focus-visible {
    filter: brightness(1.08) !important;
    outline: 2px solid rgba(217, 179, 95, 0.34) !important;
    outline-offset: 2px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-identity {
    display: flex !important;
    min-width: 0 !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 4px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name {
    display: block !important;
    max-width: 100% !important;
    color: #fffaf0 !important;
    font-size: 1rem !important;
    font-weight: 900 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name:hover,
.profile-menu.profile-menu-logged-in .account-menu-name:focus-visible {
    color: #f2d99b !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address {
    display: inline-block !important;
    max-width: 100% !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: rgba(217, 179, 95, 0.96) !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    cursor: copy !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 3px !important;
    user-select: text !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address:hover,
.profile-menu.profile-menu-logged-in .account-menu-address:focus-visible {
    color: #f2d99b !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address.copied {
    color: #8ff0bb !important;
}

.profile-menu.profile-menu-logged-in .account-menu-copy-feedback {
    display: block !important;
    min-height: 0 !important;
    color: #8ff0bb !important;
    font-size: 0.68rem !important;
    font-weight: 850 !important;
    line-height: 1 !important;
}

.profile-menu.profile-menu-logged-in .profile-status {
    margin: 0 !important;
    padding: 8px 10px !important;
    min-height: 0 !important;
    border-radius: 8px !important;
    font-size: 0.92rem !important;
    line-height: 1.1 !important;
}

.profile-menu.profile-menu-logged-in .profile-options {
    gap: 8px !important;
}

.profile-menu.profile-menu-logged-in .profile-options a {
    min-height: 48px !important;
    padding: 11px 13px !important;
    font-size: 0.98rem !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        gap: 10px !important;
        min-height: 62px !important;
        padding: 10px 46px 10px 10px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        font-size: 1rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 0.98rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        font-size: 0.8rem !important;
    }

    .profile-menu.profile-menu-logged-in .profile-options a {
        min-height: 46px !important;
        padding: 10px 12px !important;
        font-size: 0.96rem !important;
    }
}

/* --- Account dropdown final polish v9.4 --- */
.profile-menu.profile-menu-logged-in {
    padding: 14px !important;
    gap: 10px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name:hover,
.profile-menu.profile-menu-logged-in .account-menu-name:focus-visible {
    color: #f2d99b !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address:hover,
.profile-menu.profile-menu-logged-in .account-menu-address:focus-visible {
    color: #fff3c6 !important;
    border-color: rgba(217, 179, 95, 0.48) !important;
    background: rgba(217, 179, 95, 0.1) !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address.copied {
    color: #d9ffe9 !important;
    border-color: rgba(72, 213, 151, 0.46) !important;
    background: rgba(72, 213, 151, 0.11) !important;
}

.profile-menu.profile-menu-logged-in .profile-status {
    width: auto !important;
    align-self: flex-start !important;
    margin: 0 0 2px 0 !important;
    padding: 7px 11px !important;
    min-height: 0 !important;
    border-radius: 8px !important;
    background: rgba(15, 23, 42, 0.52) !important;
    border: 1px solid rgba(64, 158, 255, 0.28) !important;
    box-shadow: none !important;
    font-size: 0.88rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-align: left !important;
}

.profile-menu.profile-menu-logged-in .profile-options {
    gap: 8px !important;
}

.profile-menu.profile-menu-logged-in .profile-options a {
    min-height: 50px !important;
    padding: 12px 14px !important;
    border-radius: 8px !important;
    background: rgba(15, 23, 42, 0.54) !important;
    border-color: rgba(148, 163, 184, 0.16) !important;
    font-size: 0.98rem !important;
}

.profile-menu.profile-menu-logged-in .profile-options a:hover,
.profile-menu.profile-menu-logged-in .profile-options a:focus-visible {
    background: rgba(217, 179, 95, 0.1) !important;
    border-color: rgba(217, 179, 95, 0.34) !important;
    color: #fffaf0 !important;
}

.profile-menu.profile-menu-logged-in .menu-counter {
    min-width: 34px !important;
    padding: 5px 9px !important;
    border-radius: 8px !important;
    background: #facc15 !important;
    color: #11170f !important;
    font-size: 0.84rem !important;
    line-height: 1 !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in {
        padding: 12px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 48px minmax(0, 1fr) !important;
        min-height: 72px !important;
        padding: 12px 46px 12px 12px !important;
        gap: 12px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;
        font-size: 1.1rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 1.02rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        max-width: 100% !important;
        font-size: 0.78rem !important;
        padding: 5px 8px !important;
    }

    .profile-menu.profile-menu-logged-in .profile-options a {
        min-height: 48px !important;
        padding: 11px 12px !important;
        font-size: 0.96rem !important;
    }
}

/* --- Lean account dropdown v9.5 --- */
.profile-menu.profile-menu-logged-in {
    padding: 12px !important;
    gap: 8px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-header {
    min-height: 58px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name:hover,
.profile-menu.profile-menu-logged-in .account-menu-name:focus-visible,
.profile-menu.profile-menu-logged-in .account-menu-avatar:hover,
.profile-menu.profile-menu-logged-in .account-menu-avatar:focus-visible {
    filter: brightness(1.08) !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address:hover,
.profile-menu.profile-menu-logged-in .account-menu-address:focus-visible {
    color: #fff3c6 !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address.copied {
    color: #8ff0bb !important;
}

.profile-menu.profile-menu-logged-in .profile-status {
    display: none !important;
}

.profile-menu.profile-menu-logged-in .profile-options {
    gap: 8px !important;
}

.profile-menu.profile-menu-logged-in .profile-options a {
    min-height: 44px !important;
    padding: 10px 12px !important;
    border-radius: 8px !important;
    font-size: 0.94rem !important;
    background: rgba(15, 23, 42, 0.5) !important;
    border-color: rgba(148, 163, 184, 0.15) !important;
}

.profile-menu.profile-menu-logged-in .profile-options a:hover,
.profile-menu.profile-menu-logged-in .profile-options a:focus-visible {
    background: rgba(217, 179, 95, 0.1) !important;
    border-color: rgba(217, 179, 95, 0.32) !important;
    color: #fffaf0 !important;
}

.profile-menu.profile-menu-logged-in .menu-counter {
    min-width: 30px !important;
    padding: 4px 8px !important;
    border-radius: 8px !important;
    font-size: 0.78rem !important;
    line-height: 1 !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in {
        padding: 10px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 38px minmax(0, 1fr) !important;
        min-height: 54px !important;
        padding: 9px 44px 9px 9px !important;
        gap: 10px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        font-size: 0.94rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 0.92rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-tier {
        max-width: 112px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 0.62rem !important;
        padding: 3px 6px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        font-size: 0.72rem !important;
    }

    .profile-menu.profile-menu-logged-in .profile-options a {
        min-height: 42px !important;
        padding: 9px 11px !important;
        font-size: 0.92rem !important;
    }
}

/* --- Strong account identity dropdown v9.6 --- */
.profile-menu.profile-menu-logged-in .account-menu-header {
    overflow: hidden !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name:hover,
.profile-menu.profile-menu-logged-in .account-menu-name:focus-visible,
.profile-menu.profile-menu-logged-in .account-menu-avatar:hover,
.profile-menu.profile-menu-logged-in .account-menu-avatar:focus-visible {
    filter: brightness(1.08) !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address:hover,
.profile-menu.profile-menu-logged-in .account-menu-address:focus-visible {
    color: #fff3c6 !important;
    border-color: rgba(217, 179, 95, 0.62) !important;
    background: rgba(217, 179, 95, 0.12) !important;
    outline: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address.copied {
    color: #d9ffe9 !important;
    border-color: rgba(72, 213, 151, 0.55) !important;
    background: rgba(72, 213, 151, 0.13) !important;
}

.profile-menu.profile-menu-logged-in .profile-options a {
    min-height: 46px !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 46px minmax(0, 1fr) !important;
        min-height: 82px !important;
        padding: 12px 46px 12px 12px !important;
        gap: 12px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 46px !important;
        height: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        font-size: 1.12rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 1rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-tier {
        font-size: 0.74rem !important;
        padding: 4px 8px !important;
        max-width: 160px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        font-size: 0.88rem !important;
        padding: 7px 9px !important;
    }
}

/* --- Full-size account dropdown identity header v9.7 --- */
.profile-menu.profile-menu-logged-in {
    padding: 14px !important;
    gap: 10px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-header {
    display: grid !important;
    grid-template-columns: 78px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 18px !important;
    min-height: 144px !important;
    margin: 0 0 12px !important;
    padding: 22px 52px 22px 18px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 12% 18%, rgba(217, 179, 95, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(18, 28, 23, 0.98), rgba(14, 21, 31, 0.98)) !important;
    border: 1px solid rgba(217, 179, 95, 0.42) !important;
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-avatar {
    width: 78px !important;
    height: 78px !important;
    min-width: 78px !important;
    max-width: 78px !important;
    border-radius: 8px !important;
    font-size: 2rem !important;
    font-weight: 950 !important;
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-identity {
    gap: 12px !important;
    min-width: 0 !important;
}

.profile-menu.profile-menu-logged-in .account-menu-title-row {
    gap: 10px !important;
    align-items: center !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name {
    font-size: 1.72rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    color: #fffaf0 !important;
}

.profile-menu.profile-menu-logged-in .account-menu-tier {
    padding: 9px 12px !important;
    max-width: 100% !important;
    border-radius: 8px !important;
    font-size: 1.22rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-tier span:last-child {
    font-size: 1.54rem !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address {
    max-width: 100% !important;
    padding: 11px 14px !important;
    border-radius: 8px !important;
    font-size: 1.34rem !important;
    font-weight: 950 !important;
    line-height: 1.05 !important;
    color: #f4d98f !important;
    background: rgba(10, 15, 18, 0.56) !important;
    border-color: rgba(217, 179, 95, 0.48) !important;
    text-decoration: none !important;
}

.profile-menu.profile-menu-logged-in .account-menu-copy-feedback {
    min-height: 1rem !important;
    font-size: 0.88rem !important;
}

.profile-menu.profile-menu-logged-in .profile-options a {
    min-height: 54px !important;
    padding: 14px 16px !important;
    font-size: 1.08rem !important;
    font-weight: 850 !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in {
        padding: 12px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 68px minmax(0, 1fr) !important;
        min-height: 132px !important;
        padding: 18px 48px 18px 16px !important;
        gap: 15px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 68px !important;
        height: 68px !important;
        min-width: 68px !important;
        max-width: 68px !important;
        font-size: 1.72rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 1.46rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-tier {
        font-size: 1.06rem !important;
        padding: 8px 10px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-tier span:last-child {
        font-size: 1.34rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        font-size: 1.12rem !important;
        padding: 10px 12px !important;
    }

    .profile-menu.profile-menu-logged-in .profile-options a {
        min-height: 52px !important;
        padding: 13px 14px !important;
        font-size: 1.04rem !important;
    }
}

@media (max-width: 420px) {
    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 60px minmax(0, 1fr) !important;
        min-height: 122px !important;
        padding: 16px 44px 16px 14px !important;
        gap: 13px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 60px !important;
        height: 60px !important;
        min-width: 60px !important;
        max-width: 60px !important;
        font-size: 1.54rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 1.28rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-tier {
        font-size: 0.96rem !important;
        padding: 7px 9px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        font-size: 1rem !important;
        padding: 9px 10px !important;
    }
}

/* --- Guest feed locked Nuzlers v10.0 --- */
.feed-container .post.post-locked {
    position: relative;
    overflow: hidden;
    scroll-margin-top: calc(var(--site-header-height, 52px) + 18px);
}

.feed-container .post.post-locked .post-title-link {
    cursor: pointer;
}

.main-feed-post-content.is-feed-locked {
    max-height: 450px;
    overflow: hidden;
    filter: blur(5px) saturate(0.82);
    transform: none;
    opacity: 0.74;
    pointer-events: none;
    user-select: none;
    transition: filter 0.22s ease, opacity 0.22s ease, transform 0.22s ease;
}

.feed-lock-overlay {
    position: absolute;
    left: 50%;
    right: auto;
    top: clamp(310px, 32%, 430px);
    z-index: 12;
    display: flex;
    justify-content: center;
    pointer-events: none;
    width: min(430px, calc(100% - 52px));
    transform: translate(-50%, -50%);
    transition: opacity 0.22s ease, transform 0.22s ease;
}

.feed-lock-overlay::before {
    content: "";
    position: absolute;
    inset: -48px -34px;
    z-index: -1;
    background: radial-gradient(circle at center, rgba(10, 15, 18, 0.72), rgba(10, 15, 18, 0.36) 50%, rgba(10, 15, 18, 0) 78%);
}

.feed-lock-overlay.is-unlocking {
    opacity: 0;
    transform: translateY(-46%) scale(0.98);
}

.feed-lock-panel {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 18px;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background:
        linear-gradient(180deg, rgba(17, 25, 22, 0.98), rgba(10, 15, 18, 0.98));
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.42);
    color: #fffaf0;
    font-size: 16px;
    line-height: 1.35;
    text-align: center;
    pointer-events: auto;
}

.feed-lock-mark {
    display: none;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 8px;
    border: 1px solid rgba(217, 179, 95, 0.42);
    background: linear-gradient(135deg, rgba(217, 179, 95, 0.28), rgba(72, 213, 151, 0.13));
    color: #f6d27b;
    font-size: 24px;
    font-weight: 950;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.feed-lock-copy {
    min-width: 0;
    align-self: auto;
}

.feed-lock-kicker {
    display: inline-flex;
    margin: 0 0 7px;
    padding: 5px 8px;
    border-radius: 8px;
    background: rgba(217, 179, 95, 0.13);
    color: #f2d99b;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0;
}

.feed-lock-panel strong {
    display: block;
    color: #fffaf0;
    font-size: 21px;
    font-weight: 950;
    line-height: 1.05;
}

.feed-lock-panel p {
    margin: 6px auto 0;
    max-width: 330px;
    color: rgba(248, 250, 252, 0.78);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

.feed-lock-signin-form {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    margin: 2px 0 0;
}

.feed-lock-field {
    display: block;
    position: relative;
    width: 100%;
    height: 56px;
    min-height: 56px;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(5, 10, 14, 0.34);
    padding: 0;
    text-align: center;
    overflow: hidden;
}

.feed-lock-field > span {
    display: none;
}

.feed-lock-input-row {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    min-width: 0;
}

.feed-lock-field-password {
    width: 100%;
    margin-left: 0;
}

.feed-lock-field input {
    display: block;
    position: absolute;
    inset: 0;
    min-width: 0;
    width: 100%;
    height: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: #fffaf0;
    padding: 0 18px;
    box-sizing: border-box;
    font: inherit;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: 0;
    text-align: center;
    line-height: 56px;
}

.feed-lock-field input::placeholder {
    color: rgba(248, 250, 252, 0.58);
    opacity: 1;
}

.feed-lock-field em {
    position: absolute;
    right: 22px;
    top: 50%;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    padding: 0;
    color: rgba(248, 250, 252, 0.74);
    font-style: normal;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    transform: translateY(-50%);
    pointer-events: none;
}

.feed-lock-actions {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 9px;
    margin-top: 2px;
}

.feed-inline-signin-btn,
.feed-lock-signup {
    width: 100%;
    box-sizing: border-box;
    min-height: 43px;
    padding: 11px 14px;
    border-radius: 8px;
    border: 1px solid rgba(217, 179, 95, 0.36);
    background: rgba(217, 179, 95, 0.16);
    color: #f6e5b5;
    font: inherit;
    font-size: 16px;
    font-weight: 950;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.feed-inline-signin-btn {
    margin-left: 0;
}

.feed-lock-signup {
    grid-column: 1 / -1;
    margin-left: 0;
    background: rgba(255, 255, 255, 0.045);
    border-color: rgba(255, 255, 255, 0.14);
    color: rgba(255, 250, 240, 0.84);
}

.feed-inline-signin-btn:hover,
.feed-inline-signin-btn:focus-visible,
.feed-lock-signup:hover,
.feed-lock-signup:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(217, 179, 95, 0.48);
    color: #fffaf0;
    outline: none;
}

.feed-inline-signin-btn:disabled {
    cursor: wait;
    opacity: 0.72;
    transform: none;
}

.feed-lock-message {
    grid-column: 1 / -1;
    display: block;
    min-height: 1em;
    margin-top: 12px;
    color: #f2d99b;
    font-size: 14px;
    font-weight: 850;
    line-height: 1.25;
    font-style: normal;
    opacity: 0;
    transition: opacity 0.18s ease;
}

.feed-lock-message.is-visible {
    opacity: 1;
}

@media (max-width: 640px) {
    .main-feed-post-content.is-feed-locked {
        max-height: 390px;
        filter: blur(5px);
    }

    .feed-lock-overlay {
        width: calc(100% - 26px);
        top: clamp(286px, 34%, 390px);
    }

    .feed-lock-panel {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        padding: 15px;
        font-size: 15px;
    }

    .feed-lock-mark {
        display: none;
    }

    .feed-lock-panel strong {
        font-size: 20px;
    }

    .feed-lock-panel p {
        font-size: 15px;
    }

    .feed-lock-field-password {
        width: 100%;
        margin-left: 0;
    }

    .feed-inline-signin-btn {
        width: 100%;
        margin-left: 0;
    }

    .feed-lock-signup {
        width: 100%;
    }

    .feed-inline-signin-btn,
    .feed-lock-signup {
        min-height: 40px;
        padding: 9px 10px;
        font-size: 15px;
    }
}

/* --- Viewport-safe signed-in account dropdown v10.8 final override --- */
.profile-menu.profile-menu-logged-in {
    width: min(440px, calc(100vw - 18px)) !important;
    max-height: calc(100dvh - var(--site-header-height, 52px) - 12px) !important;
    padding: 9px !important;
    gap: 7px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
}

@media (min-width: 769px) {
    .profile-menu.profile-menu-logged-in {
        top: calc(100% + 6px) !important;
        right: 8px !important;
        max-height: calc(100dvh - 66px) !important;
    }
}

.profile-menu.profile-menu-logged-in .account-menu-header {
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    min-height: 76px !important;
    margin: 0 0 6px !important;
    padding: 10px 40px 10px 10px !important;
    gap: 10px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-avatar {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    font-size: 1.24rem !important;
}

.profile-menu.profile-menu-logged-in .account-menu-identity {
    gap: 7px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-title-row {
    gap: 8px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name {
    font-size: 1.16rem !important;
    line-height: 1.05 !important;
}

.profile-menu.profile-menu-logged-in .account-menu-tier {
    padding: 5px 8px !important;
    font-size: 0.82rem !important;
    max-width: 152px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.profile-menu.profile-menu-logged-in .account-menu-tier span:last-child {
    font-size: 0.98rem !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address {
    max-width: 100% !important;
    padding: 7px 9px !important;
    font-size: 0.92rem !important;
    line-height: 1.05 !important;
}

.profile-menu.profile-menu-logged-in .account-menu-copy-feedback {
    min-height: 0.72rem !important;
    font-size: 0.72rem !important;
    line-height: 1 !important;
}

.profile-menu.profile-menu-logged-in .profile-options {
    gap: 6px !important;
}

.profile-menu.profile-menu-logged-in .profile-options a {
    min-height: 38px !important;
    padding: 8px 11px !important;
    font-size: 0.9rem !important;
    line-height: 1.08 !important;
}

.profile-menu.profile-menu-logged-in .menu-counter {
    min-width: 28px !important;
    padding: 4px 8px !important;
    font-size: 0.78rem !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in {
        left: 8px !important;
        right: 8px !important;
        width: auto !important;
        max-height: calc(100dvh - var(--site-header-height, 52px) - 16px) !important;
        padding: 9px !important;
        gap: 7px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 44px minmax(0, 1fr) !important;
        min-height: 68px !important;
        margin-bottom: 7px !important;
        padding: 10px 42px 10px 10px !important;
        gap: 10px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        font-size: 1.04rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 1rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-tier {
        max-width: 140px !important;
        padding: 5px 8px !important;
        font-size: 0.78rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        padding: 7px 9px !important;
        font-size: 0.84rem !important;
    }

    .profile-menu.profile-menu-logged-in .profile-options a {
        min-height: 36px !important;
        padding: 7px 10px !important;
        font-size: 0.86rem !important;
    }
}

@media (max-height: 680px) {
    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        min-height: 60px !important;
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        font-size: 0.96rem !important;
    }

    .profile-menu.profile-menu-logged-in .profile-options a {
        min-height: 34px !important;
        padding-top: 6px !important;
        padding-bottom: 6px !important;
        font-size: 0.84rem !important;
    }
}

/* --- Nuzler wordmark refresh v10.10 --- */
.logo,
header.site-header .logo {
    font-family: var(--nuzler-logo-font) !important;
    font-weight: 700 !important;
    font-size: 1.42rem !important;
    line-height: 1 !important;
    letter-spacing: -0.03em !important;
    color: #ffffff !important;
    text-shadow: 0 8px 18px rgba(0, 0, 0, 0.18) !important;
    gap: 8px !important;
    white-space: nowrap !important;
}

.logo .logo-wordmark,
header.site-header .logo .logo-wordmark {
    color: #ffffff !important;
    display: inline-block !important;
}

.beta-tag,
header.site-header .beta-tag {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 18px !important;
    margin-left: 0 !important;
    padding: 1px 6px 2px !important;
    border-radius: 4px !important;
    border: 1px solid rgba(255, 215, 117, 0.78) !important;
    background: rgba(255, 214, 102, 0.1) !important;
    color: #ffd86a !important;
    font-family: "Outfit", sans-serif !important;
    font-size: 0.48rem !important;
    font-weight: 950 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 8px 16px rgba(0, 0, 0, 0.18) !important;
    transform: rotate(-9deg) translateY(-3px) !important;
    transform-origin: 50% 50% !important;
}

@media (max-width: 768px) {
    .logo,
    header.site-header .logo {
        font-size: 1.22rem !important;
        gap: 7px !important;
    }

    .beta-tag,
    header.site-header .beta-tag {
        min-height: 17px !important;
        padding: 1px 6px 2px !important;
        font-size: 0.45rem !important;
    }
}

@media (max-width: 480px) {
    .logo,
    header.site-header .logo {
        font-size: 1.08rem !important;
        gap: 6px !important;
    }

    .beta-tag,
    header.site-header .beta-tag {
        min-height: 16px !important;
        padding: 1px 5px 2px !important;
        font-size: 0.42rem !important;
    }
}

/* --- Mobile slogan centering pass v10.21 --- */
@media (max-width: 768px) {
    .hero-slogan {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 50px !important;
        margin: 0 !important;
        padding: 8px 14px !important;
        text-align: center !important;
        box-sizing: border-box !important;
        will-change: transform !important;
    }

    .hero-slogan .typing-text {
        line-height: 1.2 !important;
        display: inline-block !important;
        transform: none !important;
    }
}

@media (max-width: 600px) {
    .hero-slogan {
        min-height: 46px !important;
        padding: 7px 12px !important;
    }
}

/* --- Liquid search border pass v10.15 --- */
@keyframes nuzlerLiquidFlow {
    0% {
        transform: translate3d(-1%, 0, 0) scale(1.01);
        filter: blur(8px) saturate(1.04);
    }
    50% {
        transform: translate3d(1%, -1%, 0) scale(1.02);
        filter: blur(9px) saturate(1.08);
    }
    100% {
        transform: translate3d(-1%, 1%, 0) scale(1.01);
        filter: blur(8px) saturate(1.04);
    }
}

/* --- Home mobile slogan vertical rhythm parity with auth pages v10.22 --- */
@media (max-width: 768px) {
    body:not(.auth-page) .feed-container {
        padding-top: 10px !important;
    }
}

@media (max-width: 600px) {
    body:not(.auth-page) .feed-container {
        padding-top: 8px !important;
    }
}

/* --- Mobile search input stability pass v10.23 --- */
@media (max-width: 768px) {
    body:not(.auth-page) .feed-container .search-container.liquid-search-wrap {
        border-radius: 8px !important;
    }

    body:not(.auth-page) .feed-container .search-container.liquid-search-wrap::before,
    body:not(.auth-page) .feed-container .search-container.liquid-search-wrap::after {
        content: none !important;
        display: none !important;
    }

    body:not(.auth-page) .feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar {
        border: 1px solid rgba(166, 215, 198, 0.28) !important;
        border-radius: 8px !important;
        background: rgba(12, 17, 15, 0.94) !important;
        background-image: none !important;
        min-height: 48px !important;
        height: auto !important;
        padding: 12px 16px !important;
        line-height: 1.25 !important;
        font-size: 16px !important;
        caret-color: #facc15 !important;
        animation: none !important;
        transform: none !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.05),
            0 8px 22px rgba(0, 0, 0, 0.20) !important;
    }

    body:not(.auth-page) .feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar:focus {
        border-color: rgba(198, 235, 219, 0.55) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.08),
            0 0 16px rgba(122, 213, 181, 0.2),
            0 12px 30px rgba(0, 0, 0, 0.26) !important;
    }
}

.feed-container .search-container {
    position: relative !important;
    isolation: isolate !important;
    border-radius: 10px !important;
    overflow: visible !important;
}

.feed-container .search-container::before {
    content: "";
    position: absolute;
    inset: -2px;
    z-index: 0;
    pointer-events: none;
    border-radius: 10px;
    background:
        radial-gradient(120% 90% at 0% 50%, rgba(72, 213, 151, 0.24) 0%, rgba(72, 213, 151, 0) 56%),
        radial-gradient(120% 100% at 100% 45%, rgba(90, 160, 255, 0.2) 0%, rgba(90, 160, 255, 0) 58%),
        radial-gradient(130% 100% at 50% 100%, rgba(217, 179, 95, 0.18) 0%, rgba(217, 179, 95, 0) 60%);
    opacity: 0.5;
    animation: nuzlerLiquidFlow 7.2s ease-in-out infinite;
}

.feed-container .search-container::after {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: 1;
    pointer-events: none;
    border-radius: 9px;
    border: 1px solid rgba(166, 215, 198, 0.34);
    opacity: 0.55;
}

.feed-container .search-bar {
    position: relative;
    z-index: 2;
}

.feed-container .search-container:focus-within::before {
    opacity: 0.66;
}

.feed-container .search-container:focus-within::after {
    border-color: rgba(200, 232, 218, 0.5);
    opacity: 0.75;
}

@media (max-width: 768px) {
    .feed-container .search-container::before {
        inset: -1px;
        opacity: 0.42;
        animation-duration: 6.6s;
    }

    .feed-container .search-container::after {
        opacity: 0.48;
    }
}

@keyframes nuzlerLiquidBorderShift {
    0% {
        background-position: 0 0, 0% 50%;
    }
    50% {
        background-position: 0 0, 100% 50%;
    }
    100% {
        background-position: 0 0, 0% 50%;
    }
}

/* --- Final search system: single liquid border, stable caret (v10.24) --- */
.feed-container .search-container.liquid-search-wrap {
    position: relative !important;
    isolation: isolate !important;
    border-radius: 10px !important;
    padding: 1px !important;
    background: linear-gradient(120deg, rgba(72, 213, 151, 0.36), rgba(90, 160, 255, 0.3), rgba(217, 179, 95, 0.34), rgba(72, 213, 151, 0.36)) !important;
    background-size: 220% 220% !important;
    background-position: 0% 50% !important;
    animation: nuzlerLiquidBorderShift 8.8s ease-in-out infinite !important;
    box-shadow:
        0 0 0 1px rgba(166, 215, 198, 0.2),
        0 10px 24px rgba(0, 0, 0, 0.18) !important;
}

.feed-container .search-container.liquid-search-wrap::before,
.feed-container .search-container.liquid-search-wrap::after {
    content: none !important;
    display: none !important;
}

.feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar {
    border: 0 !important;
    border-radius: 9px !important;
    background: rgba(14, 18, 16, 0.94) !important;
    background-image: none !important;
    animation: none !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    min-height: 48px !important;
    height: auto !important;
    padding: 12px 16px !important;
    line-height: 1.3 !important;
    font-size: 16px !important;
    caret-color: #facc15 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar:focus {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 0 0 1px rgba(196, 232, 218, 0.42),
        0 0 18px rgba(124, 206, 180, 0.18) !important;
}

.feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar::-webkit-search-decoration,
.feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar::-webkit-search-cancel-button,
.feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar::-webkit-search-results-button,
.feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar::-webkit-search-results-decoration {
    -webkit-appearance: none !important;
    appearance: none !important;
}

@media (max-width: 768px) {
    .feed-container .search-container.liquid-search-wrap {
        border-radius: 8px !important;
        padding: 1px !important;
    }

    .feed-container .search-container.liquid-search-wrap .search-bar.liquid-search-bar {
        border-radius: 7px !important;
        min-height: 48px !important;
        padding: 12px 16px !important;
        line-height: 1.25 !important;
        font-size: 16px !important;
    }
}

/* --- Absolute final search renderer v10.25 (markup-driven, no legacy overlap) --- */
body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    margin: 10px 0 16px !important;
    padding: 1px !important;
    border-radius: 10px !important;
    overflow: visible !important;
    isolation: isolate !important;
    background: linear-gradient(120deg, rgba(72, 213, 151, 0.36), rgba(90, 160, 255, 0.30), rgba(217, 179, 95, 0.34), rgba(72, 213, 151, 0.36)) !important;
    background-size: 220% 220% !important;
    background-position: 0% 50% !important;
    animation: nuzlerLiquidBorderShift 8s ease-in-out infinite !important;
    box-shadow: 0 0 0 1px rgba(166, 215, 198, 0.2), 0 10px 24px rgba(0, 0, 0, 0.18) !important;
}

body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3::before,
body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3::after {
    content: none !important;
    display: none !important;
}

body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 .search-bar.liquid-search-bar.nuzler-search-input-v3 {
    display: block !important;
    width: 100% !important;
    min-height: 48px !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: rgba(14, 18, 16, 0.94) !important;
    background-image: none !important;
    color: #f5f7fb !important;
    font-size: 16px !important;
    line-height: 48px !important;
    text-align: left !important;
    caret-color: #facc15 !important;
    outline: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    animation: none !important;
    transform: none !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 .search-bar.liquid-search-bar.nuzler-search-input-v3::placeholder {
    color: rgba(242, 240, 232, 0.55) !important;
    font-size: 16px !important;
    line-height: 48px !important;
}

body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 .search-bar.liquid-search-bar.nuzler-search-input-v3:focus {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 0 0 1px rgba(196, 232, 218, 0.42), 0 0 18px rgba(124, 206, 180, 0.18) !important;
}

body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 .search-bar.liquid-search-bar.nuzler-search-input-v3::-webkit-search-decoration,
body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 .search-bar.liquid-search-bar.nuzler-search-input-v3::-webkit-search-cancel-button,
body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 .search-bar.liquid-search-bar.nuzler-search-input-v3::-webkit-search-results-button,
body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 .search-bar.liquid-search-bar.nuzler-search-input-v3::-webkit-search-results-decoration {
    -webkit-appearance: none !important;
    appearance: none !important;
}

@media (max-width: 768px) {
    body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 {
        border-radius: 8px !important;
        margin: 10px 0 16px !important;
    }

    body.home-page main.feed-container .search-container.liquid-search-wrap.nuzler-search-v3 .search-bar.liquid-search-bar.nuzler-search-input-v3 {
        border-radius: 7px !important;
    }
}

/* Individual nuzler + profile pages intentionally inherit the same
   mobile hero-slogan placement rules as the homepage. */

/* --- Final signed-out auth dropdown polish v10.31 --- */
.header-actions .guest-auth-trigger {
    border-color: rgba(217, 179, 95, 0.46) !important;
    background:
        radial-gradient(circle at 18% 0%, rgba(217, 179, 95, 0.18), transparent 34%),
        linear-gradient(135deg, rgba(25, 24, 19, 0.92), rgba(20, 20, 21, 0.92)) !important;
    color: #ffe6a3 !important;
    box-shadow:
        0 10px 26px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.header-actions .guest-auth-trigger:hover,
.header-actions .guest-auth-trigger:focus-visible,
.header-actions .guest-auth-trigger[aria-expanded="true"] {
    border-color: rgba(242, 211, 135, 0.72) !important;
    color: #fff6d8 !important;
    transform: translateY(-1px);
}

.profile-menu.profile-menu-guest {
    width: min(340px, calc(100vw - 24px)) !important;
    min-width: 0 !important;
    padding: 10px !important;
    gap: 0 !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    border: 1px solid rgba(217, 179, 95, 0.32) !important;
    background:
        linear-gradient(90deg, rgba(217, 179, 95, 0.9), rgba(106, 218, 169, 0.82), rgba(229, 133, 143, 0.72)) top / 100% 3px no-repeat,
        radial-gradient(circle at 18% 0%, rgba(217, 179, 95, 0.14), transparent 34%),
        radial-gradient(circle at 88% 18%, rgba(106, 218, 169, 0.11), transparent 30%),
        linear-gradient(180deg, rgba(15, 20, 18, 0.98), rgba(9, 13, 14, 0.98)) !important;
    box-shadow:
        0 22px 54px rgba(0, 0, 0, 0.48),
        0 0 0 1px rgba(255, 255, 255, 0.04),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    backdrop-filter: blur(18px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
}

.header-actions:focus-within > .profile-menu.profile-menu-guest,
.header-actions:hover > .profile-menu.profile-menu-guest,
.profile-menu.profile-menu-guest.show {
    display: flex !important;
    flex-direction: column !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
}

.profile-menu.profile-menu-guest .guest-menu,
.profile-menu.profile-menu-guest .mobile-guest-menu {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.profile-menu.profile-menu-guest .guest-menu:not(.mobile-guest-menu) {
    display: block !important;
}

.profile-menu.profile-menu-guest .mobile-guest-menu {
    display: none !important;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    width: 100% !important;
    align-items: stretch !important;
}

.profile-menu.profile-menu-guest .header-auth-btn {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 56px !important;
    padding: 15px 16px !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    font-size: 1.04rem !important;
    font-weight: 950 !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    overflow: hidden !important;
    transform: translateY(0) !important;
    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        background 0.18s ease,
        color 0.18s ease,
        box-shadow 0.18s ease !important;
}

.profile-menu.profile-menu-guest .header-auth-btn::before {
    content: none !important;
}

.profile-menu.profile-menu-guest .header-auth-btn::after {
    content: "→" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 30px !important;
    width: 30px !important;
    height: 30px !important;
    margin-left: 14px !important;
    border-radius: 8px !important;
    font-size: 1.08rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    opacity: 1 !important;
    background: rgba(255, 255, 255, 0.14) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

.profile-menu.profile-menu-guest .header-auth-signup {
    color: #181006 !important;
    border: 1px solid rgba(255, 231, 170, 0.62) !important;
    background:
        linear-gradient(135deg, rgba(239, 204, 125, 0.98), rgba(200, 157, 76, 0.96) 52%, rgba(165, 121, 56, 0.98)) !important;
    box-shadow:
        0 14px 30px rgba(217, 179, 95, 0.22),
        0 9px 20px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.36) !important;
}

.profile-menu.profile-menu-guest .header-auth-login {
    color: rgba(250, 247, 235, 0.95) !important;
    border: 1px solid rgba(186, 214, 202, 0.22) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.07), rgba(72, 213, 151, 0.075)) !important;
    box-shadow:
        0 10px 22px rgba(0, 0, 0, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}

.profile-menu.profile-menu-guest .header-auth-login::after {
    color: #c9f8df !important;
    background: rgba(72, 213, 151, 0.14) !important;
}

.profile-menu.profile-menu-guest .header-auth-btn:hover,
.profile-menu.profile-menu-guest .header-auth-btn:focus-visible {
    transform: translateY(-1px) !important;
    outline: none !important;
}

.profile-menu.profile-menu-guest .header-auth-signup:hover,
.profile-menu.profile-menu-guest .header-auth-signup:focus-visible {
    border-color: rgba(255, 239, 194, 0.82) !important;
    background:
        linear-gradient(135deg, rgba(250, 220, 148, 0.99), rgba(216, 174, 88, 0.98) 52%, rgba(181, 135, 63, 0.99)) !important;
    box-shadow:
        0 18px 38px rgba(217, 179, 95, 0.28),
        0 12px 26px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

.profile-menu.profile-menu-guest .header-auth-login:hover,
.profile-menu.profile-menu-guest .header-auth-login:focus-visible {
    color: #e9fff2 !important;
    border-color: rgba(106, 218, 169, 0.44) !important;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.085), rgba(72, 213, 151, 0.13)) !important;
    box-shadow:
        0 14px 30px rgba(72, 213, 151, 0.1),
        0 10px 24px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

@media (min-width: 769px) {
    .profile-menu.profile-menu-guest {
        top: calc(100% + 12px) !important;
        right: 0 !important;
    }
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-guest {
        position: fixed !important;
        top: calc(var(--site-header-height, 58px) + 10px) !important;
        left: 12px !important;
        right: 12px !important;
        width: auto !important;
        max-height: calc(100dvh - var(--site-header-height, 58px) - 22px) !important;
        padding: 44px 12px 12px !important;
        overflow-y: auto !important;
    }

    .profile-menu.profile-menu-guest .profile-menu-close {
        top: 10px !important;
        right: 10px !important;
        width: 30px !important;
        height: 30px !important;
        border-color: rgba(217, 179, 95, 0.28) !important;
        background: rgba(9, 13, 14, 0.74) !important;
        color: rgba(255, 248, 234, 0.88) !important;
    }

    .profile-menu.profile-menu-guest .guest-menu:not(.mobile-guest-menu) {
        display: none !important;
    }

    .profile-menu.profile-menu-guest .mobile-guest-menu {
        display: block !important;
    }

    .profile-menu.profile-menu-guest .header-auth-btn {
        min-height: 54px !important;
        padding: 14px 15px !important;
        font-size: 1.02rem !important;
    }
}

/* --- Premium signed-out auth menu v10.33 --- */
.header-actions .guest-auth-trigger {
    min-width: 112px !important;
    min-height: 44px !important;
    padding: 0 15px !important;
    border-radius: 8px !important;
    border-color: rgba(217, 179, 95, 0.46) !important;
    background:
        linear-gradient(180deg, rgba(34, 31, 24, 0.96), rgba(18, 23, 20, 0.94)) !important;
    color: #ffe39a !important;
    font-size: 1rem !important;
    font-weight: 950 !important;
    letter-spacing: 0 !important;
    box-shadow:
        0 12px 26px rgba(0, 0, 0, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.header-actions .guest-auth-trigger:hover,
.header-actions .guest-auth-trigger:focus-visible,
.header-actions .guest-auth-trigger[aria-expanded="true"] {
    color: #fff5cf !important;
    border-color: rgba(238, 208, 132, 0.74) !important;
    background:
        linear-gradient(180deg, rgba(42, 38, 28, 0.98), rgba(19, 29, 24, 0.96)) !important;
    transform: translateY(-1px);
}

.profile-menu.profile-menu-guest {
    width: min(328px, calc(100vw - 24px)) !important;
    min-width: 0 !important;
    padding: 12px !important;
    gap: 0 !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    border: 1px solid rgba(217, 179, 95, 0.34) !important;
    background:
        linear-gradient(90deg, rgba(217, 179, 95, 0.82), rgba(104, 218, 169, 0.76), rgba(231, 133, 145, 0.62)) top / 100% 3px no-repeat,
        linear-gradient(180deg, rgba(17, 23, 20, 0.985), rgba(8, 13, 13, 0.99)) !important;
    box-shadow:
        0 22px 56px rgba(0, 0, 0, 0.46),
        0 0 0 1px rgba(255, 255, 255, 0.035),
        inset 0 1px 0 rgba(255, 255, 255, 0.065) !important;
    backdrop-filter: blur(18px) saturate(132%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(132%) !important;
}

.header-actions:focus-within > .profile-menu.profile-menu-guest,
.header-actions:hover > .profile-menu.profile-menu-guest,
.profile-menu.profile-menu-guest.show {
    display: flex !important;
    flex-direction: column !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
}

.profile-menu.profile-menu-guest .profile-menu-close {
    display: none !important;
}

.profile-menu.profile-menu-guest .guest-menu,
.profile-menu.profile-menu-guest .mobile-guest-menu {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.profile-menu.profile-menu-guest .guest-menu:not(.mobile-guest-menu) {
    display: block !important;
}

.profile-menu.profile-menu-guest .mobile-guest-menu {
    display: none !important;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    width: 100% !important;
}

.profile-menu.profile-menu-guest .header-auth-btn {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 56px !important;
    width: 100% !important;
    padding: 0 16px !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    font-size: 1.06rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        background 0.18s ease,
        box-shadow 0.18s ease,
        color 0.18s ease !important;
}

.profile-menu.profile-menu-guest .header-auth-btn::before {
    content: none !important;
}

.profile-menu.profile-menu-guest .header-auth-btn::after {
    content: "→" !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
    margin-left: 14px !important;
    border-radius: 8px !important;
    font-size: 1rem !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

.profile-menu.profile-menu-guest .header-auth-signup {
    color: #161008 !important;
    border: 1px solid rgba(255, 234, 174, 0.64) !important;
    background: linear-gradient(135deg, rgba(237, 203, 123, 0.99), rgba(199, 157, 76, 0.98)) !important;
    box-shadow:
        0 14px 30px rgba(217, 179, 95, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
}

.profile-menu.profile-menu-guest .header-auth-signup::after {
    color: #1b1207 !important;
    background: rgba(255, 255, 255, 0.22) !important;
}

.profile-menu.profile-menu-guest .header-auth-login {
    color: rgba(248, 249, 241, 0.96) !important;
    border: 1px solid rgba(182, 217, 200, 0.24) !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(78, 210, 153, 0.1)) !important;
    box-shadow:
        0 10px 24px rgba(0, 0, 0, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.075) !important;
}

.profile-menu.profile-menu-guest .header-auth-login::after {
    color: #d7ffe9 !important;
    background: rgba(104, 218, 169, 0.16) !important;
}

.profile-menu.profile-menu-guest .header-auth-btn:hover,
.profile-menu.profile-menu-guest .header-auth-btn:focus-visible {
    transform: translateY(-1px) !important;
    outline: none !important;
}

.profile-menu.profile-menu-guest .header-auth-signup:hover,
.profile-menu.profile-menu-guest .header-auth-signup:focus-visible {
    border-color: rgba(255, 241, 199, 0.86) !important;
    background: linear-gradient(135deg, rgba(248, 218, 145, 1), rgba(213, 171, 84, 0.99)) !important;
    box-shadow:
        0 18px 38px rgba(217, 179, 95, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}

.profile-menu.profile-menu-guest .header-auth-login:hover,
.profile-menu.profile-menu-guest .header-auth-login:focus-visible {
    color: #f2fff8 !important;
    border-color: rgba(104, 218, 169, 0.48) !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.085), rgba(78, 210, 153, 0.16)) !important;
    box-shadow:
        0 14px 30px rgba(78, 210, 153, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

@media (min-width: 769px) {
    .profile-menu.profile-menu-guest {
        top: calc(100% + 10px) !important;
        right: 0 !important;
        left: auto !important;
    }
}

@media (max-width: 768px) {
    .header-actions .guest-auth-trigger {
        min-width: 104px !important;
        min-height: 42px !important;
        padding: 0 13px !important;
        font-size: 0.98rem !important;
    }

    .profile-menu.profile-menu-guest {
        position: fixed !important;
        top: calc(var(--site-header-height, 58px) + 10px) !important;
        left: 12px !important;
        right: 12px !important;
        width: auto !important;
        max-height: calc(100dvh - var(--site-header-height, 58px) - 22px) !important;
        padding: 42px 12px 12px !important;
        overflow-y: auto !important;
    }

    .profile-menu.profile-menu-guest .profile-menu-close {
        position: absolute !important;
        display: inline-flex !important;
        top: 9px !important;
        right: 9px !important;
        width: 28px !important;
        height: 28px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
        border: 1px solid rgba(217, 179, 95, 0.28) !important;
        background: rgba(8, 13, 13, 0.72) !important;
        color: rgba(255, 248, 234, 0.9) !important;
        font-size: 16px !important;
        line-height: 1 !important;
    }

    .profile-menu.profile-menu-guest .guest-menu:not(.mobile-guest-menu) {
        display: none !important;
    }

    .profile-menu.profile-menu-guest .mobile-guest-menu {
        display: block !important;
    }

    .profile-menu.profile-menu-guest .guest-menu-actions {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .profile-menu.profile-menu-guest .header-auth-btn {
        min-height: 54px !important;
        padding: 0 15px !important;
        font-size: 1.04rem !important;
    }
}

/* --- Signed-out access menu refinement v10.34 --- */
.header-actions .guest-auth-trigger {
    min-width: 108px !important;
    min-height: 42px !important;
    padding: 0 14px !important;
    border-radius: 8px !important;
    border-color: rgba(225, 204, 137, 0.5) !important;
    background: rgba(20, 25, 22, 0.92) !important;
    color: #f5df9d !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 10px 24px rgba(0, 0, 0, 0.22) !important;
}

.header-actions .guest-auth-trigger:hover,
.header-actions .guest-auth-trigger:focus-visible,
.header-actions .guest-auth-trigger[aria-expanded="true"] {
    border-color: rgba(245, 224, 162, 0.7) !important;
    background: rgba(25, 31, 27, 0.96) !important;
    color: #fff1be !important;
}

.profile-menu.profile-menu-guest {
    width: min(264px, calc(100vw - 24px)) !important;
    padding: 6px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(225, 204, 137, 0.3) !important;
    background: rgba(12, 18, 16, 0.98) !important;
    box-shadow:
        0 18px 42px rgba(0, 0, 0, 0.42),
        inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
    backdrop-filter: blur(14px) saturate(118%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(118%) !important;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    gap: 6px !important;
}

.profile-menu.profile-menu-guest .header-auth-btn {
    min-height: 48px !important;
    justify-content: flex-start !important;
    padding: 0 14px !important;
    border-radius: 7px !important;
    font-size: 1rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

.profile-menu.profile-menu-guest .header-auth-btn::after,
.profile-menu.profile-menu-guest .header-auth-btn::before {
    content: none !important;
    display: none !important;
}

.profile-menu.profile-menu-guest .header-auth-signup {
    color: #f4de9d !important;
    border: 1px solid rgba(225, 204, 137, 0.28) !important;
    background: rgba(225, 204, 137, 0.11) !important;
}

.profile-menu.profile-menu-guest .header-auth-login {
    color: rgba(245, 247, 240, 0.92) !important;
    border: 1px solid rgba(190, 214, 203, 0.14) !important;
    background: rgba(255, 255, 255, 0.035) !important;
}

.profile-menu.profile-menu-guest .header-auth-signup:hover,
.profile-menu.profile-menu-guest .header-auth-signup:focus-visible {
    color: #fff0bd !important;
    border-color: rgba(245, 224, 162, 0.5) !important;
    background: rgba(225, 204, 137, 0.16) !important;
    transform: none !important;
}

.profile-menu.profile-menu-guest .header-auth-login:hover,
.profile-menu.profile-menu-guest .header-auth-login:focus-visible {
    color: #f6fff9 !important;
    border-color: rgba(104, 218, 169, 0.28) !important;
    background: rgba(104, 218, 169, 0.08) !important;
    transform: none !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-guest {
        left: 12px !important;
        right: 12px !important;
        width: auto !important;
        padding: 40px 8px 8px !important;
    }

    .profile-menu.profile-menu-guest .profile-menu-close {
        top: 8px !important;
        right: 8px !important;
        width: 26px !important;
        height: 26px !important;
        border-radius: 7px !important;
        border-color: rgba(225, 204, 137, 0.22) !important;
        background: rgba(255, 255, 255, 0.04) !important;
    }

    .profile-menu.profile-menu-guest .header-auth-btn {
        min-height: 50px !important;
        padding: 0 14px !important;
        font-size: 1rem !important;
    }
}

/* --- Natural guest access dropdown v10.35 --- */
.header-actions .guest-auth-trigger {
    min-width: 104px !important;
    min-height: 40px !important;
    padding: 0 13px !important;
    border: 1px solid rgba(232, 211, 148, 0.46) !important;
    border-radius: 8px !important;
    background:
        linear-gradient(180deg, rgba(30, 29, 24, 0.94), rgba(18, 22, 19, 0.96)) !important;
    color: #f2dda0 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

.header-actions .guest-auth-trigger:hover,
.header-actions .guest-auth-trigger:focus-visible,
.header-actions .guest-auth-trigger[aria-expanded="true"] {
    background:
        linear-gradient(180deg, rgba(36, 34, 28, 0.96), rgba(20, 28, 23, 0.97)) !important;
    border-color: rgba(242, 222, 162, 0.68) !important;
}

.profile-menu.profile-menu-guest {
    width: min(238px, calc(100vw - 24px)) !important;
    padding: 7px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(232, 211, 148, 0.24) !important;
    background:
        linear-gradient(180deg, rgba(20, 25, 22, 0.985), rgba(10, 15, 14, 0.99)) !important;
    box-shadow:
        0 16px 36px rgba(0, 0, 0, 0.38),
        inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 2px !important;
}

.profile-menu.profile-menu-guest .header-auth-btn {
    min-height: 44px !important;
    padding: 0 12px !important;
    border: 0 !important;
    border-radius: 6px !important;
    justify-content: flex-start !important;
    background: transparent !important;
    color: rgba(249, 246, 232, 0.92) !important;
    font-size: 0.98rem !important;
    font-weight: 850 !important;
    box-shadow: none !important;
}

.profile-menu.profile-menu-guest .header-auth-signup {
    color: #f3dfa4 !important;
}

.profile-menu.profile-menu-guest .header-auth-login {
    color: rgba(249, 246, 232, 0.9) !important;
}

.profile-menu.profile-menu-guest .header-auth-btn:hover,
.profile-menu.profile-menu-guest .header-auth-btn:focus-visible {
    background: rgba(232, 211, 148, 0.09) !important;
    color: #fff1bd !important;
    outline: none !important;
    transform: none !important;
}

.profile-menu.profile-menu-guest .header-auth-btn:active {
    background: rgba(232, 211, 148, 0.13) !important;
}

@media (min-width: 769px) {
    .profile-menu.profile-menu-guest {
        top: calc(100% + 9px) !important;
        right: 0 !important;
    }
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-guest {
        left: auto !important;
        right: 12px !important;
        top: calc(var(--site-header-height, 58px) + 9px) !important;
        width: min(236px, calc(100vw - 24px)) !important;
        padding: 34px 7px 7px !important;
        max-height: calc(100dvh - var(--site-header-height, 58px) - 18px) !important;
    }

    .profile-menu.profile-menu-guest .profile-menu-close {
        display: inline-flex !important;
        top: 7px !important;
        right: 7px !important;
        width: 24px !important;
        height: 24px !important;
        border: 0 !important;
        background: transparent !important;
        color: rgba(249, 246, 232, 0.72) !important;
        font-size: 18px !important;
    }

    .profile-menu.profile-menu-guest .header-auth-btn {
        min-height: 44px !important;
        padding: 0 12px !important;
        font-size: 0.98rem !important;
    }
}

/* --- Reference-inspired guest account menu v10.37 --- */
.header-actions .guest-auth-trigger {
    min-width: 126px !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    gap: 9px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(229, 211, 154, 0.56) !important;
    background: rgba(24, 24, 22, 0.78) !important;
    color: #fff2c5 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 10px 22px rgba(0, 0, 0, 0.24) !important;
}

.header-actions .guest-auth-trigger::before {
    content: "" !important;
    display: inline-block !important;
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
    border: 1.5px solid currentColor !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
    opacity: 0.86 !important;
    box-shadow: inset 0 -6px 0 -4px currentColor !important;
}

.header-actions .guest-auth-trigger:hover,
.header-actions .guest-auth-trigger:focus-visible,
.header-actions .guest-auth-trigger[aria-expanded="true"] {
    background: rgba(29, 29, 26, 0.9) !important;
    border-color: rgba(250, 232, 174, 0.78) !important;
    color: #fff7d8 !important;
}

.profile-menu.profile-menu-guest {
    width: 190px !important;
    min-width: 190px !important;
    padding: 14px 0 !important;
    border-radius: 8px !important;
    border: 1px solid rgba(229, 211, 154, 0.22) !important;
    background: rgba(11, 14, 14, 0.94) !important;
    box-shadow:
        0 22px 48px rgba(0, 0, 0, 0.44),
        inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
    backdrop-filter: blur(16px) saturate(120%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(120%) !important;
}

.profile-menu.profile-menu-guest::before {
    content: none !important;
    display: none !important;
}

.profile-menu.profile-menu-guest .profile-menu-close {
    display: none !important;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
}

.profile-menu.profile-menu-guest .header-auth-btn {
    min-height: 52px !important;
    padding: 0 24px !important;
    border: 0 !important;
    border-radius: 0 !important;
    justify-content: flex-start !important;
    color: rgba(255, 250, 236, 0.95) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 1rem !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
}

.profile-menu.profile-menu-guest .header-auth-signup,
.profile-menu.profile-menu-guest .header-auth-login {
    color: rgba(255, 250, 236, 0.95) !important;
    background: transparent !important;
}

.profile-menu.profile-menu-guest .header-auth-btn:hover,
.profile-menu.profile-menu-guest .header-auth-btn:focus-visible {
    color: #fff4cb !important;
    background: rgba(255, 255, 255, 0.055) !important;
    transform: none !important;
    outline: none !important;
}

@media (min-width: 769px) {
    .profile-menu.profile-menu-guest {
        top: calc(100% + 12px) !important;
        right: 0 !important;
        left: auto !important;
    }
}

@media (max-width: 768px) {
    .header-actions .guest-auth-trigger {
        min-width: 116px !important;
        min-height: 42px !important;
        padding: 0 13px !important;
    }

    .profile-menu.profile-menu-guest {
        position: fixed !important;
        top: calc(var(--site-header-height, 58px) + 10px) !important;
        right: 12px !important;
        left: auto !important;
        width: min(196px, calc(100vw - 24px)) !important;
        min-width: 0 !important;
        padding: 12px 0 !important;
    }

    .profile-menu.profile-menu-guest .mobile-guest-menu {
        display: block !important;
    }

    .profile-menu.profile-menu-guest .guest-menu:not(.mobile-guest-menu) {
        display: none !important;
    }

    .profile-menu.profile-menu-guest .header-auth-btn {
        min-height: 50px !important;
        padding: 0 22px !important;
        font-size: 1rem !important;
    }
}

/* --- Guest access capsule v10.36 --- */
.header-actions .guest-auth-trigger {
    min-width: 104px !important;
    min-height: 40px !important;
    padding: 0 14px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(232, 211, 148, 0.52) !important;
    background:
        linear-gradient(180deg, rgba(35, 32, 25, 0.94), rgba(19, 24, 21, 0.96)) !important;
    color: #f5e1a6 !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 8px 18px rgba(0, 0, 0, 0.22) !important;
}

.profile-menu.profile-menu-guest {
    width: 292px !important;
    padding: 5px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(232, 211, 148, 0.3) !important;
    background: rgba(13, 18, 16, 0.88) !important;
    box-shadow:
        0 18px 38px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
    backdrop-filter: blur(18px) saturate(125%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
}

.profile-menu.profile-menu-guest::before {
    content: "" !important;
    position: absolute !important;
    top: -6px !important;
    right: 25px !important;
    width: 12px !important;
    height: 12px !important;
    border-left: 1px solid rgba(232, 211, 148, 0.28) !important;
    border-top: 1px solid rgba(232, 211, 148, 0.28) !important;
    background: rgba(13, 18, 16, 0.88) !important;
    transform: rotate(45deg) !important;
    border-radius: 2px !important;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 5px !important;
    width: 100% !important;
}

.profile-menu.profile-menu-guest .header-auth-btn {
    min-height: 46px !important;
    padding: 0 12px !important;
    border: 0 !important;
    border-radius: 7px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: rgba(249, 246, 232, 0.86) !important;
    background: transparent !important;
    font-size: 0.96rem !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
}

.profile-menu.profile-menu-guest .header-auth-signup {
    color: #14120c !important;
    background: #e2c36f !important;
}

.profile-menu.profile-menu-guest .header-auth-login {
    color: rgba(249, 246, 232, 0.9) !important;
    background: rgba(255, 255, 255, 0.045) !important;
}

.profile-menu.profile-menu-guest .header-auth-signup:hover,
.profile-menu.profile-menu-guest .header-auth-signup:focus-visible {
    color: #100e08 !important;
    background: #efd381 !important;
}

.profile-menu.profile-menu-guest .header-auth-login:hover,
.profile-menu.profile-menu-guest .header-auth-login:focus-visible {
    color: #fff6d7 !important;
    background: rgba(232, 211, 148, 0.12) !important;
}

@media (min-width: 769px) {
    .profile-menu.profile-menu-guest {
        top: calc(100% + 11px) !important;
        right: 0 !important;
        left: auto !important;
    }

    .profile-menu.profile-menu-guest .profile-menu-close {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-guest {
        position: fixed !important;
        top: calc(var(--site-header-height, 58px) + 9px) !important;
        left: 12px !important;
        right: 12px !important;
        width: auto !important;
        padding: 32px 6px 6px !important;
    }

    .profile-menu.profile-menu-guest::before {
        right: 34px !important;
    }

    .profile-menu.profile-menu-guest .profile-menu-close {
        display: inline-flex !important;
        position: absolute !important;
        top: 6px !important;
        right: 8px !important;
        width: 23px !important;
        height: 23px !important;
        border: 0 !important;
        border-radius: 6px !important;
        background: rgba(255, 255, 255, 0.05) !important;
        color: rgba(249, 246, 232, 0.76) !important;
        align-items: center !important;
        justify-content: center !important;
        line-height: 1 !important;
    }

    .profile-menu.profile-menu-guest .guest-menu-actions {
        grid-template-columns: 1fr 1fr !important;
        gap: 6px !important;
    }

    .profile-menu.profile-menu-guest .header-auth-btn {
        min-height: 48px !important;
        font-size: 0.98rem !important;
    }
}

/* --- Final guest account menu normalization v10.38 --- */
.header-actions .guest-auth-trigger {
    min-width: 118px !important;
    min-height: 42px !important;
    padding: 0 13px !important;
    gap: 8px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(232, 211, 148, 0.5) !important;
    background: rgba(24, 24, 22, 0.86) !important;
    color: #f7e4ab !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 8px 18px rgba(0, 0, 0, 0.22) !important;
}

.header-actions .guest-auth-trigger::before {
    content: none !important;
    display: none !important;
}

.header-actions .guest-auth-trigger:hover,
.header-actions .guest-auth-trigger:focus-visible,
.header-actions .guest-auth-trigger[aria-expanded="true"] {
    background: rgba(31, 31, 27, 0.94) !important;
    border-color: rgba(252, 232, 169, 0.74) !important;
    color: #fff3c9 !important;
}

.profile-menu.profile-menu-guest {
    width: 186px !important;
    min-width: 186px !important;
    max-width: calc(100vw - 24px) !important;
    padding: 10px 0 !important;
    border-radius: 8px !important;
    border: 1px solid rgba(232, 211, 148, 0.22) !important;
    background: rgba(11, 14, 14, 0.95) !important;
    box-shadow: 0 20px 44px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
    backdrop-filter: blur(16px) saturate(120%) !important;
    -webkit-backdrop-filter: blur(16px) saturate(120%) !important;
}

.profile-menu.profile-menu-guest::before {
    content: none !important;
    display: none !important;
}

.profile-menu.profile-menu-guest .profile-menu-close {
    display: none !important;
}

.profile-menu.profile-menu-guest .guest-menu-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    width: 100% !important;
}

.profile-menu.profile-menu-guest .header-auth-btn {
    min-height: 48px !important;
    padding: 0 22px !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    color: rgba(255, 250, 236, 0.95) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 1rem !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
}

.profile-menu.profile-menu-guest .header-auth-signup,
.profile-menu.profile-menu-guest .header-auth-login {
    color: rgba(255, 250, 236, 0.95) !important;
    background: transparent !important;
}

.profile-menu.profile-menu-guest .header-auth-btn:hover,
.profile-menu.profile-menu-guest .header-auth-btn:focus-visible {
    color: #fff3c9 !important;
    background: rgba(255, 255, 255, 0.06) !important;
    transform: none !important;
    outline: none !important;
}

@media (min-width: 769px) {
    .profile-menu.profile-menu-guest {
        top: calc(100% + 11px) !important;
        right: 0 !important;
        left: auto !important;
    }
}

@media (max-width: 768px) {
    .header-actions .guest-auth-trigger {
        min-width: 112px !important;
        min-height: 42px !important;
        padding: 0 12px !important;
    }

    .profile-menu.profile-menu-guest {
        position: fixed !important;
        top: calc(var(--site-header-height, 58px) + 9px) !important;
        right: 12px !important;
        left: auto !important;
        width: min(190px, calc(100vw - 24px)) !important;
        min-width: 0 !important;
        padding: 9px 0 !important;
    }

    .profile-menu.profile-menu-guest .profile-menu-close {
        display: none !important;
    }

    .profile-menu.profile-menu-guest .mobile-guest-menu {
        display: block !important;
    }

    .profile-menu.profile-menu-guest .guest-menu:not(.mobile-guest-menu) {
        display: none !important;
    }

    .profile-menu.profile-menu-guest .header-auth-btn {
        min-height: 47px !important;
        padding: 0 21px !important;
        font-size: 1rem !important;
    }
}

/* --- Signed-in account dropdown, copy-forward polish v11.0 --- */
.profile-menu.profile-menu-logged-in {
    border-color: rgba(217, 179, 95, 0.34) !important;
    background:
        radial-gradient(circle at 16% 0%, rgba(217, 179, 95, 0.12), transparent 34%),
        linear-gradient(145deg, rgba(11, 17, 18, 0.98), rgba(9, 13, 20, 0.98)) !important;
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.46), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-header {
    grid-template-columns: 64px minmax(0, 1fr) !important;
    align-items: center !important;
    min-height: 118px !important;
    padding: 16px 54px 16px 16px !important;
    gap: 15px !important;
    border-color: rgba(217, 179, 95, 0.5) !important;
    background:
        radial-gradient(circle at 16% 22%, rgba(217, 179, 95, 0.18), transparent 38%),
        linear-gradient(135deg, rgba(24, 35, 27, 0.98), rgba(10, 18, 28, 0.98)) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-avatar {
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    font-size: 1.6rem !important;
}

.profile-menu.profile-menu-logged-in .account-menu-title-row {
    width: 100% !important;
    gap: 10px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name {
    font-size: 1.46rem !important;
    line-height: 1 !important;
}

.profile-menu.profile-menu-logged-in .account-menu-tier {
    padding: 7px 10px !important;
    font-size: 0.94rem !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
        "label action"
        "value action" !important;
    gap: 4px 12px !important;
    width: min(100%, 330px) !important;
    max-width: 100% !important;
    min-height: 58px !important;
    padding: 10px 11px !important;
    border-color: rgba(244, 217, 143, 0.42) !important;
    background:
        linear-gradient(135deg, rgba(244, 217, 143, 0.13), rgba(72, 211, 149, 0.06)),
        rgba(7, 12, 15, 0.66) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 10px 24px rgba(0, 0, 0, 0.2) !important;
    white-space: normal !important;
}

.account-menu-address-label {
    grid-area: label;
    color: rgba(215, 179, 95, 0.86);
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.account-menu-address-value {
    grid-area: value;
    min-width: 0;
    overflow: hidden;
    color: #fff3c9;
    font-size: 1rem;
    font-weight: 950;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-menu-address-action {
    grid-area: action;
    align-self: center;
    justify-self: end;
    padding: 7px 9px;
    border: 1px solid rgba(244, 217, 143, 0.34);
    border-radius: 8px;
    color: #0d1117;
    background: linear-gradient(135deg, #f4d98f, #73e0ad);
    font-size: 0.78rem;
    font-weight: 950;
    line-height: 1;
}

.profile-menu.profile-menu-logged-in .account-menu-address:hover .account-menu-address-action,
.profile-menu.profile-menu-logged-in .account-menu-address:focus-visible .account-menu-address-action,
.profile-menu.profile-menu-logged-in .account-menu-address.copied .account-menu-address-action {
    color: #06100d;
    background: linear-gradient(135deg, #73e0ad, #f4d98f);
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in {
        left: 10px !important;
        right: 10px !important;
        max-height: calc(100dvh - var(--site-header-height, 52px) - 18px) !important;
        padding: 10px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 58px minmax(0, 1fr) !important;
        min-height: 128px !important;
        padding: 15px 50px 15px 14px !important;
        gap: 13px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 58px !important;
        height: 58px !important;
        min-width: 58px !important;
        max-width: 58px !important;
        font-size: 1.42rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 1.3rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-tier {
        padding: 6px 9px !important;
        font-size: 0.86rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        width: 100% !important;
        min-height: 56px !important;
        padding: 10px !important;
    }

    .account-menu-address-value {
        font-size: 0.98rem;
    }
}

@media (max-width: 430px) {
    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 52px minmax(0, 1fr) !important;
        min-height: 120px !important;
        padding-right: 46px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-title-row {
        gap: 7px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 1.18rem !important;
    }
}

/* --- Signed-in account dropdown, calmer copy-first polish v12.0 --- */
.site-footer-copy .site-footer-credit {
    color: #5fa2ff !important;
    font-weight: 900;
    text-decoration-color: rgba(95, 162, 255, 0.36);
    text-underline-offset: 3px;
}

.site-footer-copy .site-footer-credit:hover,
.site-footer-copy .site-footer-credit:focus-visible {
    color: #8bc0ff !important;
    text-decoration-color: rgba(139, 192, 255, 0.72);
}

.profile-menu.profile-menu-logged-in {
    width: min(392px, calc(100vw - 18px)) !important;
    padding: 10px !important;
    gap: 8px !important;
    border: 1px solid rgba(217, 179, 95, 0.28) !important;
    border-radius: 8px !important;
    background:
        radial-gradient(circle at 18% 0%, rgba(217, 179, 95, 0.1), transparent 32%),
        linear-gradient(145deg, rgba(10, 15, 15, 0.98), rgba(9, 13, 20, 0.98)) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-header {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    min-height: 118px !important;
    padding: 14px 47px 14px 14px !important;
    gap: 13px !important;
    border: 1px solid rgba(217, 179, 95, 0.36) !important;
    border-radius: 8px !important;
    background:
        linear-gradient(135deg, rgba(26, 34, 25, 0.92), rgba(11, 19, 30, 0.94)),
        rgba(11, 17, 20, 0.95) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 18px 44px rgba(0, 0, 0, 0.26) !important;
}

.profile-menu.profile-menu-logged-in .account-menu-avatar {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    font-size: 1.42rem !important;
}

.profile-menu.profile-menu-logged-in .account-menu-title-row {
    align-items: center !important;
    gap: 8px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-name {
    color: #fffaf0 !important;
    font-size: 1.32rem !important;
    line-height: 1.04 !important;
}

.profile-menu.profile-menu-logged-in .account-menu-tier {
    padding: 6px 9px !important;
    font-size: 0.84rem !important;
    border-radius: 8px !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
        "label action"
        "value action" !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 54px !important;
    padding: 9px 9px 9px 10px !important;
    gap: 4px 9px !important;
    border: 1px solid rgba(244, 217, 143, 0.32) !important;
    border-radius: 8px !important;
    background: rgba(7, 12, 15, 0.58) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    white-space: normal !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address-label {
    grid-area: label;
    color: rgba(244, 217, 143, 0.72) !important;
    font-size: 0.62rem !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    line-height: 1 !important;
    text-transform: uppercase;
}

.profile-menu.profile-menu-logged-in .account-menu-address-value {
    grid-area: value;
    color: #fff3c9 !important;
    font-size: 0.96rem !important;
    font-weight: 950 !important;
    line-height: 1.05 !important;
}

.profile-menu.profile-menu-logged-in .account-menu-address-action {
    grid-area: action;
    min-width: 56px;
    padding: 8px 10px !important;
    border: 1px solid rgba(95, 162, 255, 0.46) !important;
    border-radius: 8px !important;
    color: #dfeeff !important;
    background: rgba(95, 162, 255, 0.14) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    font-size: 0.78rem !important;
    text-align: center;
}

.profile-menu.profile-menu-logged-in .account-menu-address:hover .account-menu-address-action,
.profile-menu.profile-menu-logged-in .account-menu-address:focus-visible .account-menu-address-action,
.profile-menu.profile-menu-logged-in .account-menu-address.copied .account-menu-address-action {
    color: #061423 !important;
    background: #8bc0ff !important;
}

.profile-menu.profile-menu-logged-in .profile-options {
    gap: 5px !important;
}

.profile-menu.profile-menu-logged-in .profile-options a {
    min-height: 43px !important;
    padding: 10px 12px !important;
    border: 1px solid rgba(95, 162, 255, 0.13) !important;
    border-radius: 8px !important;
    background: rgba(13, 19, 29, 0.58) !important;
    box-shadow: none !important;
    color: rgba(245, 248, 255, 0.92) !important;
    font-size: 0.95rem !important;
    line-height: 1.08 !important;
}

.profile-menu.profile-menu-logged-in .profile-options a:hover,
.profile-menu.profile-menu-logged-in .profile-options a:focus-visible {
    border-color: rgba(95, 162, 255, 0.34) !important;
    background: rgba(95, 162, 255, 0.1) !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

.profile-menu.profile-menu-logged-in .menu-counter {
    min-width: 36px !important;
    padding: 5px 9px !important;
    border-radius: 999px !important;
    background: #ffd11a !important;
    color: #07101b !important;
    font-size: 0.78rem !important;
}

.profile-menu.profile-menu-logged-in .profile-menu-danger {
    border-color: rgba(255, 134, 153, 0.24) !important;
    color: #ffc9d0 !important;
}

@media (max-width: 768px) {
    .profile-menu.profile-menu-logged-in {
        width: auto !important;
        max-height: calc(100dvh - var(--site-header-height, 52px) - 14px) !important;
        padding: 9px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 54px minmax(0, 1fr) !important;
        min-height: 112px !important;
        padding: 13px 46px 13px 12px !important;
        gap: 11px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 54px !important;
        height: 54px !important;
        min-width: 54px !important;
        max-width: 54px !important;
        font-size: 1.36rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-name {
        font-size: 1.18rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-tier {
        font-size: 0.78rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address {
        min-height: 52px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address-value {
        font-size: 0.88rem !important;
    }

    .profile-menu.profile-menu-logged-in .profile-options a {
        min-height: 41px !important;
        font-size: 0.92rem !important;
    }
}

@media (max-width: 390px) {
    .profile-menu.profile-menu-logged-in .account-menu-header {
        grid-template-columns: 48px minmax(0, 1fr) !important;
        min-height: 106px !important;
        padding-right: 43px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-avatar {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        max-width: 48px !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address-label {
        font-size: 0.56rem !important;
    }

    .profile-menu.profile-menu-logged-in .account-menu-address-action {
        min-width: 50px;
        padding: 7px 8px !important;
    }
}