/* =================================================================== */
/* =            VIEŠAS PROFILIS - PILNAS STILIŲ RINKINYS               = */
/* =================================================================== */

/* Modernūs kintamieji ir bazinis sistemos stilius */
:root {
    --bg-main: #121212;
    --bg-surface: #1E1E1E;
    --bg-surface-hover: #2a2a2a;
    --border-color: #333333;
    --text-primary: #EAEAEA;
    --text-secondary: #9E9E9E;
    --accent-blue: #007BFF;
    --accent-green: #28a745;
    --accent-red: #dc3545;
    --accent-yellow: #F59E0B;
    --accent-purple: #9370DB;
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.2);
    --shadow-md: 0 8px 24px rgba(0,0,0,0.4);
    --font-main: 'Inter', -apple-system, sans-serif;
}

/* Šviesios temos palaikymas, jei aktyvuota per JS */
:root.light-theme {
    --bg-main: #F3F4F6;
    --bg-surface: #FFFFFF;
    --bg-surface-hover: #F9FAFB;
    --border-color: #E5E7EB;
    --text-primary: #1F2937;
    --text-secondary: #4B5563;
    --accent-blue: #2563EB;
    --accent-green: #10B981;
    --accent-red: #EF4444;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.05);
}

/* Globalus dėžutės modelio pritaikymas visiems elementams */
*, *::before, *::after {
    box-sizing: border-box;
}

/* Baziniai puslapio atstatymai */
body {
    background-color: var(--bg-main);
    color: var(--text-primary);
    font-family: var(--font-main);
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

body, .container, .profile-container {
    padding-top: 20px !important; /* Arba nustatykite tokį, koks jums tinka */
    margin-top: 0 !important;
}

/* Pagrindiniai mygtukų ir įvesčių stiliai, kad nepriklausytų nuo išorinio style.css */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, transform 0.2s;
    font-size: 0.9em;
    max-width: 100%;
}
.btn-primary {
    background: var(--accent-blue);
    color: #fff;
}
.btn-primary:hover {
    background: #0069d9;
    transform: translateY(-1px);
}
.btn-secondary {
    background: var(--bg-main);
    border-color: var(--border-color);
    color: var(--text-primary);
}
.btn-secondary:hover {
    background: var(--bg-surface-hover);
    border-color: var(--text-secondary);
}
.btn-sm {
    padding: 6px 12px;
    font-size: 0.85em;
    border-radius: 6px;
}
.form-control {
    width: 100%;
    max-width: 100%;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.form-control:focus {
    border-color: var(--accent-yellow) !important;
    outline: none;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.15);
}

/* PATAISYMAS: Užtikriname, kad modalas būtų visada viršuje */
#photoModal {
    display: none;
    position: fixed !important; /* !important užtikrina, kad joks kitas stilius neperrašys */
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(0,0,0,0.95) !important;
    z-index: 99999 !important; /* Didelis skaičius, kad būtų virš visko */
    align-items: center;
    justify-content: center;
    padding: 15px;
}

/* Pagrindinis profilio konteineris */
.profile-container {
    max-width: 1200px;
    margin: 100px auto 40px;
    padding: 0 20px;
    width: 100%;
    padding-top: 20px !important; /* Pakeiskite į tokį, koks jums tinka */
    margin-top: 80px !important; /* Arba nustatykite marginą vietoj paddingo */
}

/* Patobulintas Headeris */
.profile-header {
    background: var(--bg-surface);
    border: 1px solid var(--border-color);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    margin-bottom: 30px;
    position: relative;
    width: 100%;
    margin-top: 80px;
}

.profile-cover {
    height: 280px;
    background-color: #1e1e1e;
    background-size: cover;
    background-position: center;
    background-image: radial-gradient(circle at center, var(--accent-purple) 0%, #1a1a1a 100%);
    position: relative;
    width: 100%;
    overflow: hidden;
    isolation: isolate;
}

.profile-cover.has-premium-cover {
    overflow: hidden;
    isolation: isolate;
    contain: paint;
}

.profile-cover-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: 0;
    opacity: 0;
    pointer-events: none;
    transform: translateZ(0);
    backface-visibility: hidden;
    transition: opacity 220ms ease;
}

.profile-cover-video.is-video-ready {
    opacity: 1;
}

.profile-cover.is-video-static .profile-cover-video,
.profile-cover.is-video-error .profile-cover-video {
    display: none;
}

.profile-cover.profile-cover-mode-video {
    background-color: #121212;
}

@media (prefers-reduced-motion: reduce) {
    .profile-cover-video {
        display: none;
    }
}

.profile-cover.has-premium-cover::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.profile-cover.profile-cover-animated {
    background-size: 180% 180%;
    animation: profilePremiumCoverMove 9s ease-in-out infinite alternate;
}

.profile-cover-animated-aurora {
    background:
            radial-gradient(ellipse at 18% 24%, rgba(134,239,172,.58), transparent 30%),
            radial-gradient(ellipse at 82% 16%, rgba(125,211,252,.34), transparent 34%),
            linear-gradient(135deg, #06120e, #111);
}

.profile-cover-animated-fire {
    background:
            radial-gradient(circle at 24% 82%, rgba(255,209,92,.44), transparent 22%),
            radial-gradient(circle at 78% 74%, rgba(255,122,24,.34), transparent 26%),
            linear-gradient(135deg, #1c0b07, #050505);
}

.profile-cover-animated-ocean {
    background:
            radial-gradient(ellipse at 50% 10%, rgba(224,250,255,.28), transparent 28%),
            radial-gradient(circle at 78% 70%, rgba(56,189,248,.28), transparent 30%),
            linear-gradient(135deg, #03142a, #031018);
}

.profile-cover-animated-code {
    background:
            linear-gradient(rgba(48,200,134,.18) 1px, transparent 1px),
            linear-gradient(90deg, rgba(253,185,19,.12) 1px, transparent 1px),
            linear-gradient(135deg, #06120e, #050707);
    background-size: 18px 18px, 18px 18px, 180% 180%;
}

.profile-cover-animated-forest {
    background:
            radial-gradient(ellipse at 24% 10%, rgba(217,249,157,.24), transparent 28%),
            radial-gradient(ellipse at 82% 16%, rgba(34,197,94,.20), transparent 30%),
            linear-gradient(135deg, #06100a, #10150f);
}

.profile-cover-animated-stardust {
    background:
            radial-gradient(circle at 22% 24%, rgba(245,208,254,.30), transparent 18%),
            radial-gradient(circle at 78% 18%, rgba(125,211,252,.24), transparent 18%),
            radial-gradient(circle at 58% 74%, rgba(253,185,19,.18), transparent 22%),
            linear-gradient(135deg, #0f1020, #090909);
}

@keyframes profilePremiumCoverMove {
    from { background-position: 0% 50%, 100% 50%, 50% 50%; }
    to { background-position: 100% 50%, 0% 50%, 55% 45%; }
}

.profile-cover:not(.has-profile-cover):not(.has-premium-cover)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60%;
    background: linear-gradient(to top, rgba(0,0,0,0.6), transparent);
    z-index: 1;
}

/* INTERAKTYVIOS NUOTRAUKOS */
.interactive-photo {
    position: relative;
    transition: filter 0.3s;
    cursor: pointer;
}
.interactive-photo:hover { filter: brightness(0.9); }

.photo-edit-hint {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0,0,0,0.7);
    color: #fff;
    padding: 10px 20px;
    border-radius: 30px;
    font-size: 0.85em;
    font-weight: 600;
    pointer-events: none;
    opacity: 0;
    transition: 0.3s;
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.interactive-photo:hover .photo-edit-hint { opacity: 1; }
.photo-edit-hint.small {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

/* Informacijos wrap'as */
.profile-info-wrap {
    display: flex;
    padding: 0 40px 35px;
    margin-top: -100px;
    gap: 35px;
    align-items: flex-end;
    position: relative;
    width: 100%;
}

.profile-avatar-large {
    width: 190px;
    height: 190px;
    border-radius: 28px;
    border: 6px solid var(--bg-surface);
    background: var(--bg-main);
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 15px 35px rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4em;
    color: #fff;
    font-weight: bold;
    position: relative;
    z-index: 2;
}

.profile-avatar-large img { width: 100%; height: 100%; object-fit: cover; }
.lt-flag-bg { background: linear-gradient(to bottom, #FDB913 33.3%, #006A44 33.3%, #006A44 66.6%, #C1272D 66.6%); }

/* Tekstinė dalis */
.profile-text-details { flex: 1; padding-bottom: 5px; position: relative; z-index: 2; min-width: 0; }
.profile-text-details h1 { margin: 0 0 8px 0; font-size: 2.6em; color: var(--text-primary); display: flex; align-items: center; gap: 15px; font-weight: 800; flex-wrap: wrap; word-break: break-word; }
.lvl-badge { font-size: 0.45em; background: var(--accent-yellow); color: #000; padding: 3px 12px; border-radius: 6px; font-weight: 900; vertical-align: middle; white-space: nowrap; }
.premium-plan-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: min(100%, 220px);
    padding: 5px 10px;
    border: 1px solid rgba(253, 185, 19, 0.44);
    border-radius: 999px;
    background:
            linear-gradient(135deg, rgba(253, 185, 19, 0.18), rgba(0, 106, 68, 0.08)),
            rgba(255, 255, 255, 0.04);
    color: #fdb913;
    font-size: 0.42em;
    font-weight: 900;
    line-height: 1.1;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.premium-plan-badge i { flex: 0 0 auto; }
.premium-plan-badge-pro {
    border-color: rgba(125, 211, 252, 0.48);
    background:
            linear-gradient(135deg, rgba(125, 211, 252, 0.18), rgba(253, 185, 19, 0.12)),
            rgba(255, 255, 255, 0.045);
    color: #7dd3fc;
}
.profile-headline { font-size: 1.15em; color: var(--accent-yellow); margin-bottom: 12px; font-weight: 500; display: block; opacity: 0.9; word-break: break-word; }
.profile-username { font-size: 0.95em; color: var(--text-secondary); font-weight: 500; margin-bottom: 18px; display: block; word-break: break-word; }

/* XP Juosta */
.xp-container { margin: 15px 0 20px 0; width: 100%; max-width: 350px; }
.xp-bar-bg { height: 7px; background: rgba(255,255,255,0.08); border-radius: 10px; overflow: hidden; margin-bottom: 6px; }
.xp-bar-fill { height: 100%; background: linear-gradient(90deg, var(--accent-yellow), #f59e0b); border-radius: 10px; transition: width 1s ease-in-out; box-shadow: 0 0 10px rgba(245, 158, 11, 0.3); }
.xp-text { font-size: 0.75em; color: var(--text-secondary); display: flex; justify-content: space-between; font-weight: 700; }
.profile-badges { display: flex; gap: 12px; flex-wrap: wrap; width: 100%; }
.p-badge { padding: 8px 16px; border-radius: 10px; font-size: 0.85em; font-weight: 600; display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,0.04); color: var(--text-primary); border: 1px solid var(--border-color); white-space: nowrap; }
.p-badge i { color: var(--accent-yellow); flex-shrink: 0; }
.profile-premium-public-badge {
    border-color: rgba(253, 185, 19, 0.38);
    background: rgba(253, 185, 19, 0.10);
    color: var(--accent-yellow);
}
.verified-creator-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: min(100%, 260px);
    padding: 5px 10px;
    border: 1px solid rgba(56, 189, 248, 0.48);
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(56, 189, 248, 0.18), rgba(253, 185, 19, 0.10)), rgba(255, 255, 255, 0.04);
    color: #7dd3fc;
    font-size: 0.42em;
    font-weight: 900;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.verified-creator-public-badge {
    border-color: rgba(56, 189, 248, 0.42);
    background: rgba(56, 189, 248, 0.10);
    color: #7dd3fc;
}
.profile-job-public-badge {
    border-color: rgba(40, 167, 69, 0.38);
    background: rgba(40, 167, 69, 0.10);
    color: #6ee7b7;
}
.profile-featured-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    max-width: 100%;
    margin-top: 16px;
}
.profile-featured-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    max-width: 100%;
    padding: 9px 13px;
    border: 1px solid rgba(253, 185, 19, 0.34);
    border-radius: 10px;
    background:
            linear-gradient(var(--bg-surface), var(--bg-surface)) padding-box,
            linear-gradient(90deg, #fdb913, #006a44, #c1272d) border-box;
    color: var(--text-primary);
    font-size: 0.86rem;
    font-weight: 800;
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}
.profile-featured-link:hover {
    border-color: rgba(253, 185, 19, 0.62);
    background:
            linear-gradient(rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.03)) padding-box,
            linear-gradient(90deg, #fdb913, #006a44, #c1272d) border-box;
    color: var(--text-primary);
    transform: translateY(-1px);
}
.profile-featured-link i {
    color: var(--accent-yellow);
    flex: 0 0 auto;
}
.profile-featured-link span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* --- MYGTUKAS REDAGUOTI --- */
.profile-actions { position: relative; z-index: 3; align-self: flex-end; margin-bottom: 10px; flex-shrink: 0; }
.btn-edit-profile { background: var(--bg-main); border: 1px solid var(--border-color); color: var(--text-primary); padding: 12px 24px; border-radius: 12px; font-weight: 700; text-decoration: none; transition: 0.2s; display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.btn-edit-profile:hover { border-color: var(--accent-yellow); color: var(--accent-yellow); background: var(--bg-surface-hover); transform: translateY(-2px); }

/* PATAISYTA: Užtikriname, kad kairė ir dešinė pusės glaustųsi prie viršaus, panaikinant tuščią tarpą */
.profile-layout {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: 30px;
    align-items: start; /* Svarbu: neleidžia dešiniajam stulpeliui dirbtinai išsitempti */
    width: 100%;
}

/* PATAISYTA: Šoninis ir pagrindinis konteineriai dabar glaudžiai rikiuoja savo vidinius p-card blokus */
.profile-sidebar, .profile-main {
    display: flex;
    flex-direction: column;
    gap: 0; /* Priklauso nuo pačių p-card margin-bottom */
}

.p-card { background: var(--bg-surface); border: 1px solid var(--border-color); border-radius: 20px; padding: 30px; margin-bottom: 30px; box-shadow: var(--shadow-sm); overflow: hidden; width: 100%; }
.p-card:last-child { margin-bottom: 0; } /* Nuimame paskutinio bloko tarpą apčioje */

.p-card-title { font-size: 1em; font-weight: 800; color: var(--text-primary); margin-top: 0; margin-bottom: 25px; padding-bottom: 12px; border-bottom: 1px solid var(--border-color); display: flex; align-items: center; gap: 12px; text-transform: uppercase; letter-spacing: 1px; word-break: break-word; }
.p-card-title i { color: var(--accent-yellow); flex-shrink: 0; }

.profile-job-card {
    position: relative;
    border-color: rgba(40, 167, 69, 0.28);
    background: radial-gradient(circle at 0% 0%, rgba(40, 167, 69, 0.14), transparent 42%), linear-gradient(145deg, rgba(255,255,255,0.045), rgba(255,255,255,0.015)), var(--bg-surface);
}
.profile-job-card-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 13px;
    align-items: center;
    margin-bottom: 14px;
}
.profile-job-card-head > span {
    display: inline-grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    border: 1px solid rgba(40, 167, 69, 0.34);
    background: rgba(40, 167, 69, 0.12);
    color: #6ee7b7;
    font-size: 1.1rem;
}
.profile-job-card h3 {
    margin: 0;
    color: var(--text-primary);
    font-size: 1.08rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}
.profile-job-card small {
    display: block;
    margin-top: 3px;
    color: #6ee7b7;
    font-weight: 800;
}
.profile-job-card p {
    margin: 0 0 14px;
    color: var(--text-secondary);
    line-height: 1.6;
    overflow-wrap: anywhere;
}
.profile-job-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}
.profile-job-meta span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    max-width: 100%;
    padding: 6px 10px;
    border: 1px solid var(--border-color);
    border-radius: 999px;
    background: rgba(255,255,255,0.04);
    color: var(--text-secondary);
    font-size: 0.82rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}
.profile-job-contact {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 42px;
    padding: 10px 13px;
    border: 1px solid rgba(40, 167, 69, 0.40);
    border-radius: 11px;
    background: rgba(40, 167, 69, 0.12);
    color: #6ee7b7;
    text-decoration: none;
    font-weight: 900;
}
.profile-job-contact:hover {
    background: rgba(40, 167, 69, 0.18);
    color: #bbf7d0;
}
.profile-skill-map-list {
    display: grid;
    gap: 14px;
}
.profile-skill-map-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: center;
}
.profile-skill-map-row strong,
.profile-skill-map-row small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.profile-skill-map-row strong {
    color: var(--text-primary);
    font-size: 0.92rem;
}
.profile-skill-map-row small {
    margin-top: 2px;
    color: var(--text-secondary);
    font-size: 0.78rem;
}
.profile-skill-map-row span {
    color: var(--accent-yellow);
    font-size: 0.82rem;
    font-weight: 900;
}
.profile-skill-map-row b {
    grid-column: 1 / -1;
    display: block;
    height: 8px;
    border-radius: 999px;
    background: rgba(255,255,255,0.08);
    overflow: hidden;
}
.profile-skill-map-row b i {
    display: block;
    width: var(--skill-level, 50%);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #fdb913, #006a44);
    box-shadow: 0 0 16px rgba(253, 185, 19, 0.24);
}
.profile-extra-blocks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 30px;
}
.profile-extra-block {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--border-color);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255,255,255,0.045), rgba(255,255,255,0.015)), var(--bg-surface);
    box-shadow: var(--shadow-sm);
}
.profile-extra-block > span {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    border: 1px solid rgba(253, 185, 19, 0.34);
    background: rgba(253, 185, 19, 0.10);
    color: var(--accent-yellow);
}
.profile-extra-block h3 {
    margin: 0 0 7px;
    color: var(--text-primary);
    font-size: 1rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}
.profile-extra-block p {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.58;
    overflow-wrap: anywhere;
}
.profile-extra-block-accent {
    border-color: rgba(253, 185, 19, 0.40);
    background: radial-gradient(circle at 0% 0%, rgba(253, 185, 19, 0.13), transparent 42%), var(--bg-surface);
}
.profile-extra-block-success {
    border-color: rgba(40, 167, 69, 0.34);
}
.profile-extra-block-success > span {
    border-color: rgba(40, 167, 69, 0.36);
    background: rgba(40, 167, 69, 0.12);
    color: #6ee7b7;
}
.profile-extra-block-warning {
    border-color: rgba(245, 158, 11, 0.42);
}

/* Įgūdžiai, Biografija, Įranga */
.skills-wrap { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; }
.skill-badge { display: inline-block; padding: 6px 14px; background: rgba(52, 152, 219, 0.08); color: #3498db; border: 1px solid rgba(52, 152, 219, 0.2); border-radius: 8px; font-size: 0.9em; margin: 0; font-weight: 600; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bio-content { color: var(--text-secondary); line-height: 1.8; font-size: 1.05em; white-space: pre-line; word-break: break-word; }
.setup-text { font-size: 0.9em; color: var(--text-secondary); line-height: 1.5; white-space: pre-line; background: rgba(0,0,0,0.1); padding: 12px; border-radius: 8px; width: 100%; word-break: break-word; }

/* Informacija (Kontaktai) */
.contact-info { display: flex; flex-direction: column; gap: 12px; width: 100%; }
.contact-item { display: flex; align-items: center; gap: 14px; margin-bottom: 0; color: var(--text-secondary); font-size: 0.95em; word-break: break-all; width: 100%; }
.contact-item i { width: 20px; text-align: center; opacity: 0.7; flex-shrink: 0; }
.contact-item a { color: var(--accent-blue); text-decoration: none; word-break: break-all; }
.social-row { display: flex; gap: 12px; margin-top: 25px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.05); width: 100%; flex-wrap: wrap; }
.social-icon-btn { width: 42px; height: 42px; border-radius: 10px; background: var(--bg-main); border: 1px solid var(--border-color); display: flex; align-items: center; justify-content: center; color: var(--text-primary); font-size: 1.3em; transition: 0.2s; flex-shrink: 0; }
.social-icon-btn:hover { border-color: var(--accent-yellow); color: var(--accent-yellow); transform: translateY(-3px); box-shadow: 0 5px 15px rgba(0,0,0,0.2); }

/* Statistika, Grafikas */
.stat-list { list-style: none; padding: 0; margin: 0; width: 100%; }
.stat-list li { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.05); color: var(--text-secondary); font-size: 0.95em; gap: 10px; width: 100%; }
.stat-list li strong { color: var(--text-primary); text-align: right; flex-shrink: 0; }

/* Aktyvumo konteineris */
.contribution-graph { min-height: 120px; background: var(--bg-main); border: 1px solid var(--border-color); border-radius: 12px; padding: 20px; overflow-x: auto; width: 100%; -webkit-overflow-scrolling: touch; }

/* --- PORTFOLIO PROJEKTAI --- */
.portfolio-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border-color); margin-bottom: 25px; padding-bottom: 15px; flex-wrap: wrap; gap: 15px; width: 100%; }
.projects-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 22px; width: 100%; }
.project-item { background: var(--bg-main); border: 1px solid var(--border-color); border-radius: 14px; padding: 22px; transition: 0.3s; position: relative; display: flex; flex-direction: column; height: 100%; width: 100%; }
.project-item:hover { transform: translateY(-5px); border-color: var(--accent-yellow); background: var(--bg-surface-hover); }
.project-item.is-pinned-project {
    border-color: rgba(253, 185, 19, 0.44);
    background:
            linear-gradient(135deg, rgba(253, 185, 19, 0.08), rgba(0, 106, 68, 0.055)),
            var(--bg-main);
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18);
}
.proj-pinned-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: fit-content;
    margin: 0 0 12px;
    padding: 5px 10px;
    border: 1px solid rgba(253, 185, 19, 0.35);
    border-radius: 999px;
    background: rgba(253, 185, 19, 0.10);
    color: var(--accent-yellow);
    font-size: 0.76rem;
    font-weight: 850;
}
.proj-lang-tag { position: absolute; top: 22px; right: 22px; max-width: calc(100% - 44px); overflow: hidden; text-overflow: ellipsis; font-size: 0.75em; font-weight: 700; text-transform: uppercase; padding: 4px 10px; border-radius: 6px; background: rgba(255,215,0,0.1); color: var(--accent-yellow); border: 1px solid rgba(255,215,0,0.2); white-space: nowrap; }
.project-item.is-pinned-project .proj-lang-tag { top: 58px; max-width: 54%; }
.proj-icon-box { width: 48px; height: 48px; border-radius: 12px; background: rgba(255,255,255,0.03); display: flex; align-items: center; justify-content: center; margin-bottom: 20px; font-size: 1.6em; color: var(--accent-yellow); border: 1px solid var(--border-color); flex-shrink: 0; }
.proj-title { font-size: 1.2em; color: var(--text-primary); margin: 0 0 12px 0; font-weight: 600; padding-right: 60px; word-break: break-word; }
.proj-title a { color: var(--text-primary); text-decoration: none; transition: color 0.2s; }
.proj-title a:hover { color: var(--accent-yellow); }
.proj-status-tag { display:inline-block; font-size:0.8em; padding:3px 8px; background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.1); border-radius:6px; margin-bottom:10px; color:var(--text-secondary); white-space: nowrap; }
.proj-status-tag i { color:var(--accent-yellow); margin-right:4px; }
.proj-desc { font-size: 0.9em; color: var(--text-secondary); margin-bottom: 25px; line-height: 1.6; flex-grow: 1; word-break: break-word; }
.proj-meta-bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 15px; border-top: 1px solid rgba(255,255,255,0.05); margin-top: auto; font-size: 0.85em; gap: 10px; width: 100%; }
.proj-status-pill { padding: 4px 10px; border-radius: 6px; font-weight: 600; white-space: nowrap; }
.status-completed { background: rgba(40, 167, 69, 0.1); color: var(--accent-green); border: 1px solid rgba(40, 167, 69, 0.2); }
.status-demo { background: rgba(245, 158, 11, 0.1); color: var(--accent-yellow); border: 1px solid rgba(245, 158, 11, 0.2); }
.proj-date { color: var(--text-secondary); white-space: nowrap; }

/* --- REKOMENDACIJOS --- */
.recommendations-list { display: flex; flex-direction: column; gap: 15px; width: 100%; }
.rec-card a { color: var(--accent-blue); text-decoration: none; }
.rec-card a:hover { text-decoration: underline; }

.empty-msg { text-align: center; color: var(--text-secondary); font-style: italic; padding: 30px; background: rgba(255,255,255,0.02); border-radius: 12px; width: 100%; }

/* === NUOTRAUKŲ MODALAS (POPUP) === */
.modal-photo-popup { display: none; position: fixed; z-index: 10000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.95); backdrop-filter: blur(8px); align-items: center; justify-content: center; padding: 15px; }
.modal-close { position: absolute; top: 20px; right: 25px; color: #fff; font-size: 40px; font-weight: bold; cursor: pointer; z-index: 10001; transition: 0.3s; }
.modal-close:hover { color: var(--accent-yellow); transform: scale(1.1); }
.modal-popup-content { max-width: 600px; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 25px; }
#modalFullImage { max-width: 100%; max-height: 65vh; border-radius: 12px; box-shadow: 0 0 50px rgba(0,0,0,0.8); object-fit: contain; }

/* Savininko meniu modale */
.modal-owner-menu { display: flex; gap: 15px; flex-wrap: wrap; justify-content: center; width: 100%; }
.modal-btn { background: var(--bg-surface); border: 1px solid var(--border-color); color: #fff; padding: 12px 28px; border-radius: 12px; cursor: pointer; transition: 0.2s; font-weight: 700; display: inline-flex; align-items: center; gap: 10px; }
.modal-btn:hover { border-color: var(--accent-yellow); color: var(--accent-yellow); }

/* Įkėlimo forma modale */
.modal-upload-form { background: var(--bg-surface); padding: 30px; border-radius: 24px; border: 1px solid var(--border-color); width: 100%; max-width: 450px; text-align: center; box-shadow: 0 20px 50px rgba(0,0,0,0.5); }
.upload-preview-container { width: 100%; min-height: 220px; border: 2px dashed var(--border-color); border-radius: 16px; margin: 25px 0; display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; background: var(--bg-main); transition: 0.3s; padding: 10px; }
.upload-preview-container:hover { border-color: var(--accent-yellow); background: rgba(245, 158, 11, 0.03); }
.upload-preview-container img { max-width: 100%; max-height: 250px; border-radius: 8px; object-fit: contain; }
#uploadPlaceholder { color: var(--text-secondary); width: 100%; }
#uploadPlaceholder i { font-size: 3.5em; margin-bottom: 15px; color: var(--accent-yellow); }
.modal-actions { display: flex; justify-content: center; gap: 15px; margin-top: 10px; flex-wrap: wrap; width: 100%; }
.modal-actions .btn { flex: 1; min-width: 120px; }

/* Image Updated fade-in animacija */
.image-updated-anim {
    animation: imageFadeIn 0.6s ease-out forwards;
}
@keyframes imageFadeIn {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

/* =================================================================== */
/* =            ADAPTYVUMAS (RESPONSIVE)                               = */
/* =================================================================== */

@media (max-width: 1024px) {
    .profile-layout { grid-template-columns: 300px 1fr; gap: 20px; }
}

@media (max-width: 900px) {
    .profile-container { margin-top: 80px; padding: 0 15px; }

    .profile-layout {
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
        width: 100% !important;
    }

    .profile-sidebar, .profile-main {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 20px !important;
    }

    .profile-info-wrap {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        margin-top: -80px !important;
        padding: 0 20px 25px !important;
        gap: 20px !important;
        width: 100% !important;
    }

    .profile-avatar-large {
        width: 150px !important;
        height: 150px !important;
        border-width: 4px !important;
        font-size: 3em !important;
    }

    .profile-text-details {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .profile-text-details h1 {
        justify-content: center !important;
        font-size: 2em !important;
        text-align: center !important;
        width: 100% !important;
    }

    .profile-badges {
        justify-content: center !important;
        width: 100% !important;
    }

    .xp-container {
        margin: 15px auto !important;
        width: 100% !important;
        max-width: 300px !important;
    }

    .profile-actions {
        align-self: center !important;
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        margin-bottom: 0 !important;
    }

    .btn-edit-profile {
        width: 100% !important;
        max-width: 300px !important;
        justify-content: center !important;
    }

    .p-card {
        padding: 20px !important;
        margin-bottom: 0 !important;
    }

    .projects-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
        width: 100% !important;
    }

    .project-item {
        width: 100% !important;
    }

    .profile-extra-blocks {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-bottom: 20px;
    }

    .profile-extra-block,
    .profile-job-card {
        border-radius: 12px;
    }

    .modal-close { top: 15px; right: 20px; font-size: 30px; }
}

@media (max-width: 480px) {
    .profile-cover { height: 200px; }
    .profile-text-details h1 { font-size: 1.6em !important; }
    .modal-upload-form { padding: 20px; }
    .p-badge { width: 100%; justify-content: center; }
}

/* === Modernesnis viešo profilio išdėstymas === */
body.page-public-profile,
body.page-public-profile .container {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body.page-public-profile .container {
    max-width: 1200px;
    width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

body.page-public-profile .profile-container {
    max-width: 1200px;
    width: 100%;
    margin: 56px auto 56px !important;
    padding: 0 !important;
}

body.page-public-profile .profile-header {
    margin-top: 0;
    border-radius: 18px;
    overflow: hidden;
}

body.page-public-profile .profile-cover {
    height: clamp(190px, 26vw, 280px);
    border-radius: 14px 14px 0 0;
}

body.page-public-profile .profile-info-wrap {
    align-items: flex-end;
    padding: 0 34px 30px;
    gap: 26px;
}

body.page-public-profile .profile-avatar-large {
    width: clamp(130px, 16vw, 180px);
    height: clamp(130px, 16vw, 180px);
    border-radius: 18px;
}

body.page-public-profile .profile-text-details h1 {
    font-size: clamp(2rem, 4vw, 2.7rem);
    line-height: 1.08;
}

body.page-public-profile .profile-layout {
    grid-template-columns: 360px minmax(0, 1fr);
    gap: 30px;
    justify-content: center;
}

body.page-public-profile .profile-sidebar,
body.page-public-profile .profile-main {
    min-width: 0;
}

body.page-public-profile .p-card {
    border-radius: 14px;
    padding: 24px;
}

body.page-public-profile .portfolio-header {
    align-items: center;
}

body.page-public-profile .projects-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}

body.page-public-profile .project-item {
    border-radius: 12px;
}

body.page-public-profile .proj-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid rgba(255,255,255,0.06);
}

body.page-public-profile .proj-links {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

body.page-public-profile .proj-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0 !important;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    background: rgba(255,255,255,0.035);
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 0.98rem;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

body.page-public-profile .proj-action-btn:hover,
body.page-public-profile .proj-action-btn:focus-visible {
    opacity: 1;
    text-decoration: none;
    transform: translateY(-2px);
    outline: none;
}

body.page-public-profile .proj-action-btn.github:hover,
body.page-public-profile .proj-action-btn.github:focus-visible {
    border-color: #6e7681;
    background: rgba(110, 118, 129, 0.16);
    color: var(--text-primary);
}

body.page-public-profile .proj-action-btn.settings:hover,
body.page-public-profile .proj-action-btn.settings:focus-visible {
    border-color: rgba(245, 158, 11, 0.55);
    background: rgba(245, 158, 11, 0.14);
    color: var(--accent-yellow);
}

body.page-public-profile .proj-action-btn.ide {
    color: var(--accent-blue);
}

body.page-public-profile .proj-action-btn.ide:hover,
body.page-public-profile .proj-action-btn.ide:focus-visible {
    border-color: rgba(0, 123, 255, 0.55);
    background: rgba(0, 123, 255, 0.13);
}

body.page-public-profile .proj-action-btn.preview:hover,
body.page-public-profile .proj-action-btn.preview:focus-visible {
    border-color: rgba(40, 167, 69, 0.55);
    background: rgba(40, 167, 69, 0.13);
    color: var(--accent-green);
}

body.page-public-profile .proj-lang-tag {
    position: static;
    align-self: flex-start;
    margin-bottom: 14px;
    max-width: 100%;
    white-space: normal;
}

body.page-public-profile .proj-title {
    padding-right: 0;
}

body.page-public-profile .contribution-graph {
    min-height: 132px;
}

body.page-public-profile .recommendation-item {
    overflow-wrap: anywhere;
}

@media (max-width: 900px) {
    body.page-public-profile .container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    body.page-public-profile .profile-container {
        margin-top: 20px !important;
    }

    body.page-public-profile .profile-header {
        overflow: hidden;
    }

    body.page-public-profile .profile-info-wrap {
        padding: 0 20px 24px !important;
    }

    body.page-public-profile .profile-actions .btn-edit-profile {
        max-width: none !important;
    }
}

@media (max-width: 560px) {
    body.page-public-profile .profile-cover {
        height: 180px;
    }

    body.page-public-profile .profile-avatar-large {
        width: 128px !important;
        height: 128px !important;
    }

    body.page-public-profile .profile-text-details h1 {
        font-size: 1.75rem !important;
    }

    body.page-public-profile .p-card {
        padding: 18px !important;
        border-radius: 12px;
    }

    body.page-public-profile .portfolio-header .btn {
        width: 100%;
    }

    body.page-public-profile .proj-meta-bottom,
    body.page-public-profile .proj-footer {
        flex-direction: column;
        align-items: flex-start;
    }

    body.page-public-profile .proj-links,
    body.page-public-profile .proj-action-btn {
        width: 100%;
    }

    body.page-public-profile .proj-links {
        justify-content: stretch;
    }

    body.page-public-profile .proj-action-btn {
        flex: 1 1 44px;
        width: auto;
        height: 40px;
    }
}

/* === Public profile v2: compact, responsive, PWA-ready surface === */
body.page-public-profile.workspace-profile-page {
    background:
            radial-gradient(circle at 50% 0%, rgba(72, 72, 72, 0.42), transparent 34rem),
            linear-gradient(180deg, #151515 0%, #101010 58%, #0d0d0d 100%) !important;
}

body.page-public-profile.workspace-profile-page .container {
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.page-public-profile.workspace-profile-page .profile-container {
    width: min(1240px, calc(100% - 40px)) !important;
    max-width: 1240px !important;
    margin: clamp(18px, 3vw, 38px) auto calc(56px + env(safe-area-inset-bottom)) !important;
}

body.page-public-profile.workspace-profile-page .profile-header,
body.page-public-profile.workspace-profile-page .profile-smart-strip,
body.page-public-profile.workspace-profile-page .p-card,
body.page-public-profile.workspace-profile-page .project-item {
    border-color: rgba(255, 255, 255, 0.10) !important;
    background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
            rgba(24, 24, 24, 0.92) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.24) !important;
}

body.page-public-profile.workspace-profile-page .profile-header {
    border-radius: 12px !important;
}

body.page-public-profile.workspace-profile-page .profile-cover {
    height: clamp(190px, 25vw, 290px) !important;
    background-color: #1b1b1b;
    background-image:
            radial-gradient(circle at 16% 0%, rgba(253, 185, 19, 0.20), transparent 30%),
            radial-gradient(circle at 86% 12%, rgba(255, 255, 255, 0.12), transparent 24%),
            linear-gradient(135deg, #141414, #303030 58%, #161616);
    background-size: cover;
    background-position: center;
}

body.page-public-profile.workspace-profile-page .profile-cover.has-profile-cover,
body.page-public-profile.workspace-profile-page .profile-cover.has-premium-cover {
    contain: paint;
}

body.page-public-profile.workspace-profile-page .profile-info-wrap {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: end !important;
    gap: clamp(18px, 3vw, 30px) !important;
    padding: 0 clamp(20px, 4vw, 38px) 30px !important;
    margin-top: -86px !important;
}

body.page-public-profile.workspace-profile-page .profile-avatar-large {
    width: clamp(132px, 16vw, 178px) !important;
    height: clamp(132px, 16vw, 178px) !important;
    border-radius: 16px !important;
    border-width: 5px !important;
}

body.page-public-profile.workspace-profile-page .profile-text-details h1 {
    max-width: 100%;
    font-size: clamp(1.7rem, 2.65vw, 2.35rem) !important;
}

body.page-public-profile.workspace-profile-page .profile-text-details {
    align-self: end !important;
    min-width: 0;
    max-width: 100%;
    /* padding-top: 0 !important; */
    /* padding-bottom: 6px !important; */
    background: rgb(0 0 0 / 52%);
    padding: 12px;
    z-index: auto;
    border-radius: 15px;
}

body.page-public-profile.workspace-profile-page .profile-title {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px 10px !important;
    align-items: center !important;
    min-width: 0;
    max-width: 100%;
    line-height: 1.06 !important;
}

body.page-public-profile.workspace-profile-page .profile-display-name {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}

body.page-public-profile.workspace-profile-page .profile-title-badges {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
    max-width: 100%;
}

body.page-public-profile.workspace-profile-page .profile-title-badges .lvl-badge,
body.page-public-profile.workspace-profile-page .profile-title-badges .premium-plan-badge,
body.page-public-profile.workspace-profile-page .profile-title-badges .verified-creator-badge,
body.page-public-profile.workspace-profile-page .profile-title-badges .profile-admin-badge {
    flex: 0 1 auto;
    min-height: 26px;
    max-width: min(100%, 220px);
    font-size: clamp(0.68rem, 0.9vw, 0.78rem) !important;
    line-height: 1.05 !important;
}

body.page-public-profile.workspace-profile-page .profile-title-badges .premium-plan-badge,
body.page-public-profile.workspace-profile-page .profile-title-badges .verified-creator-badge {
    padding: 4px 8px !important;
}

body.page-public-profile.workspace-profile-page .profile-admin-badge {
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border: 1px solid rgba(52, 152, 219, 0.38);
    border-radius: 50%;
    background: rgba(52, 152, 219, 0.12);
    color: #3498db;
}

body.page-public-profile.workspace-profile-page .profile-admin-badge i {
    font-size: 0.82rem;
}

body.page-public-profile.workspace-profile-page .profile-actions {
    align-self: end !important;
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    max-width: 100%;
}

body.page-public-profile.workspace-profile-page .profile-headline {
    color: #fdb913 !important;
}

body.page-public-profile.workspace-profile-page .profile-badges {
    gap: 8px !important;
    min-width: 0;
    max-width: 100%;
}

body.page-public-profile.workspace-profile-page .p-badge {
    max-width: 100%;
    min-width: 0;
    white-space: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.18;
}

body.page-public-profile.workspace-profile-page .profile-featured-links {
    gap: 8px !important;
    min-width: 0;
    max-width: 100%;
}

body.page-public-profile.workspace-profile-page .profile-featured-link {
    border-radius: 8px !important;
    background:
            linear-gradient(rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)) padding-box,
            linear-gradient(90deg, #fdb913, #006a44, #c1272d) border-box !important;
}

body.page-public-profile.workspace-profile-page .profile-featured-link span,
body.page-public-profile.workspace-profile-page .btn-edit-profile span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.page-public-profile.workspace-profile-page .p-badge,
body.page-public-profile.workspace-profile-page .skill-badge,
body.page-public-profile.workspace-profile-page .proj-lang-tag,
body.page-public-profile.workspace-profile-page .proj-status-tag {
    border-radius: 8px !important;
}

body.page-public-profile.workspace-profile-page .profile-smart-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
    gap: 10px;
    align-items: stretch;
    margin: 0 0 24px;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 12px;
}

body.page-public-profile.workspace-profile-page .profile-smart-metric,
body.page-public-profile.workspace-profile-page .profile-smart-links a {
    min-width: 0;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    background: rgba(12, 12, 12, 0.55);
}

body.page-public-profile.workspace-profile-page .profile-smart-metric {
    display: grid;
    gap: 3px;
    padding: 12px;
}

body.page-public-profile.workspace-profile-page .profile-smart-metric span {
    color: var(--text-primary);
    font-size: clamp(1.18rem, 2vw, 1.58rem);
    font-weight: 900;
    line-height: 1;
}

body.page-public-profile.workspace-profile-page .profile-smart-metric strong {
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.2;
}

body.page-public-profile.workspace-profile-page .profile-smart-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
    min-width: 0;
}

body.page-public-profile.workspace-profile-page .profile-smart-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 12px;
    color: var(--text-primary);
    font-size: 0.86rem;
    font-weight: 850;
    text-decoration: none;
}

body.page-public-profile.workspace-profile-page .profile-smart-links a:hover,
body.page-public-profile.workspace-profile-page .profile-smart-links a:focus-visible {
    border-color: rgba(253, 185, 19, 0.46);
    background: rgba(253, 185, 19, 0.10);
    color: #fdb913;
    outline: none;
}

body.page-public-profile.workspace-profile-page .profile-layout {
    grid-template-columns: minmax(280px, 340px) minmax(0, 1fr) !important;
    gap: 24px !important;
}

body.page-public-profile.workspace-profile-page .p-card {
    padding: clamp(18px, 2.4vw, 26px) !important;
    border-radius: 12px !important;
}

body.page-public-profile.workspace-profile-page .p-card-title {
    margin-bottom: 18px !important;
    letter-spacing: 0 !important;
}

body.page-public-profile.workspace-profile-page .portfolio-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    margin-bottom: 20px !important;
    padding-bottom: 16px !important;
}

body.page-public-profile.workspace-profile-page .portfolio-header .p-card-title {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

body.page-public-profile.workspace-profile-page .projects-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)) !important;
}

body.page-public-profile.workspace-profile-page .project-item {
    border-radius: 12px !important;
    padding: 20px !important;
}

body.page-public-profile.workspace-profile-page .project-item:hover {
    transform: translateY(-3px) !important;
}

body.page-public-profile.workspace-profile-page .proj-footer {
    align-items: stretch !important;
    flex-direction: column !important;
}

body.page-public-profile.workspace-profile-page .proj-links {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
    gap: 8px !important;
    width: 100% !important;
}

body.page-public-profile.workspace-profile-page .proj-action-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    padding: 0 12px !important;
    border-radius: 9px !important;
    font-size: 0.86rem !important;
    font-weight: 850 !important;
}

body.page-public-profile.workspace-profile-page .proj-action-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html.light-theme body.page-public-profile.workspace-profile-page {
    background: linear-gradient(180deg, #f5f7fb 0%, #eef2f7 100%) !important;
}

html.light-theme body.page-public-profile.workspace-profile-page .profile-header,
html.light-theme body.page-public-profile.workspace-profile-page .profile-smart-strip,
html.light-theme body.page-public-profile.workspace-profile-page .p-card,
html.light-theme body.page-public-profile.workspace-profile-page .project-item {
    background: #ffffff !important;
    border-color: #dde4ef !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, 0.08) !important;
}

html.light-theme body.page-public-profile.workspace-profile-page .profile-smart-metric,
html.light-theme body.page-public-profile.workspace-profile-page .profile-smart-links a {
    background: #f8fafc;
    border-color: #dde4ef;
}

@media (max-width: 980px) {
    body.page-public-profile.workspace-profile-page .profile-container {
        width: min(100% - 24px, 920px) !important;
    }

    body.page-public-profile.workspace-profile-page .profile-info-wrap,
    body.page-public-profile.workspace-profile-page .profile-layout {
        grid-template-columns: 1fr !important;
    }

    body.page-public-profile.workspace-profile-page .profile-info-wrap {
        justify-items: center !important;
        text-align: center !important;
        margin-top: -72px !important;
    }

    body.page-public-profile.workspace-profile-page .profile-text-details {
        align-self: center !important;
        align-items: center !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    body.page-public-profile.workspace-profile-page .profile-text-details h1,
    body.page-public-profile.workspace-profile-page .profile-badges,
    body.page-public-profile.workspace-profile-page .profile-featured-links {
        justify-content: center !important;
    }

    body.page-public-profile.workspace-profile-page .profile-title {
        justify-items: center !important;
        text-align: center !important;
    }

    body.page-public-profile.workspace-profile-page .profile-title-badges {
        justify-content: center !important;
    }

    body.page-public-profile.workspace-profile-page .profile-actions {
        align-self: center !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    body.page-public-profile.workspace-profile-page .profile-smart-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.page-public-profile.workspace-profile-page .profile-smart-links {
        grid-column: 1 / -1;
        justify-content: stretch;
    }

    body.page-public-profile.workspace-profile-page .profile-smart-links a {
        flex: 1 1 150px;
    }
}

@media (max-width: 620px) {
    body.page-public-profile.workspace-profile-page .profile-container {
        width: calc(100% - 14px) !important;
        margin-top: 10px !important;
    }

    body.page-public-profile.workspace-profile-page .profile-header {
        border-radius: 10px !important;
    }

    body.page-public-profile.workspace-profile-page .profile-cover {
        height: 168px !important;
    }

    body.page-public-profile.workspace-profile-page .profile-info-wrap {
        padding: 0 14px 18px !important;
        margin-top: -58px !important;
        gap: 14px !important;
    }

    body.page-public-profile.workspace-profile-page .profile-avatar-large {
        width: 116px !important;
        height: 116px !important;
        border-radius: 14px !important;
    }

    body.page-public-profile.workspace-profile-page .profile-text-details h1 {
        font-size: clamp(1.55rem, 8vw, 2rem) !important;
    }

    body.page-public-profile.workspace-profile-page .profile-title-badges {
        gap: 6px;
    }

    body.page-public-profile.workspace-profile-page .profile-title-badges .lvl-badge,
    body.page-public-profile.workspace-profile-page .profile-title-badges .premium-plan-badge,
    body.page-public-profile.workspace-profile-page .profile-title-badges .verified-creator-badge,
    body.page-public-profile.workspace-profile-page .profile-title-badges .profile-admin-badge {
        max-width: 100%;
        min-height: 25px;
        font-size: 0.72rem !important;
    }

    body.page-public-profile.workspace-profile-page .profile-smart-strip {
        grid-template-columns: 1fr 1fr;
        padding: 8px;
    }

    body.page-public-profile.workspace-profile-page .profile-smart-metric {
        padding: 10px;
    }

    body.page-public-profile.workspace-profile-page .profile-smart-links {
        display: grid;
        grid-template-columns: 1fr;
    }

    body.page-public-profile.workspace-profile-page .p-badge,
    body.page-public-profile.workspace-profile-page .profile-featured-link,
    body.page-public-profile.workspace-profile-page .profile-actions .btn-edit-profile,
    body.page-public-profile.workspace-profile-page .portfolio-header .btn {
        width: 100% !important;
    }

    body.page-public-profile.workspace-profile-page .portfolio-header {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    body.page-public-profile.workspace-profile-page .proj-links {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 380px) {
    body.page-public-profile.workspace-profile-page .proj-links,
    body.page-public-profile.workspace-profile-page .profile-smart-strip {
        grid-template-columns: 1fr;
    }
}

/* Fixed header compensation must stay on the body. Older profile rules reset it to zero. */
body.page-public-profile.workspace-profile-page {
    padding-top: var(--header-height, 70px) !important;
    overflow-x: clip;
}

body.page-public-profile.workspace-profile-page > .container {
    width: 100% !important;
    max-width: none !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    overflow-x: clip;
}

body.page-public-profile.workspace-profile-page.has-profile-atmosphere > .container {
    position: relative;
    z-index: 1;
}

.profile-page-atmosphere {
    position: fixed;
    inset: -8%;
    z-index: 0;
    display: block;
    width: 116vw;
    height: 116vh;
    pointer-events: none;
    opacity: 0.62;
    filter: blur(16px) saturate(1.08) brightness(0.58);
    transform: translateZ(0) scale(1.03);
    contain: paint;
}

.profile-page-atmosphere-video {
    object-fit: cover;
    object-position: center;
    opacity: 0;
    transition: opacity 240ms ease;
}

.profile-page-atmosphere-video.is-video-ready {
    opacity: 0.62;
}

.profile-page-atmosphere-image {
    background: var(--profile-atmosphere-image) center / cover no-repeat;
}

.profile-page-atmosphere-shade {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
            radial-gradient(circle at 50% 8%, rgba(255, 255, 255, 0.06), transparent 30%),
            linear-gradient(180deg, rgba(3, 5, 12, 0.18), rgba(2, 3, 8, 0.72) 62%, rgba(2, 3, 8, 0.90));
}

@media (max-width: 720px), (prefers-reduced-motion: reduce) {
    .profile-page-atmosphere-video,
    .profile-page-atmosphere-shade {
        display: none;
    }

    .profile-page-atmosphere {
        opacity: 0.48;
        filter: blur(18px) saturate(1.04) brightness(0.54);
    }
}

@media (hover: none), (pointer: coarse) {
    .profile-page-atmosphere-video,
    .profile-page-atmosphere-shade {
        display: none;
    }
}

html.pwa-standalone .profile-page-atmosphere-video,
body.pwa-standalone .profile-page-atmosphere-video,
html.pwa-standalone .profile-page-atmosphere-shade,
body.pwa-standalone .profile-page-atmosphere-shade {
    display: none;
}

body.page-public-profile.workspace-profile-page .ad-placement-site_header {
    width: min(1120px, calc(100% - 24px));
    margin-top: clamp(12px, 1.8vw, 24px) !important;
    margin-bottom: clamp(18px, 2.4vw, 34px) !important;
}

body.page-public-profile.workspace-profile-page .profile-cover.has-profile-cover:not(.profile-cover-animated) {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

body.page-public-profile.workspace-profile-page .profile-cover.has-profile-cover::after,
body.page-public-profile.workspace-profile-page .profile-cover.has-premium-cover::after {
    content: none !important;
    display: none !important;
}

@supports not (overflow: clip) {
    body.page-public-profile.workspace-profile-page,
    body.page-public-profile.workspace-profile-page > .container {
        overflow-x: hidden;
    }
}

/* Premium subscriber block frames: scoped to public profiles and tied to the active premium theme. */
body.page-public-profile.workspace-profile-page.has-premium-profile {
    --premium-block-frame-border: rgba(253, 185, 19, 0.32);
    --premium-block-title-edge: rgba(253, 185, 19, 0.20);
    --premium-block-frame-opacity: 0.88;
    --premium-block-sheen-opacity: 0.46;
    --premium-block-frame-width: 2px;
    --premium-block-frame-speed: 22s;
    --premium-block-sheen-speed: 30s;
    --premium-block-card-fill: linear-gradient(180deg, rgba(31, 31, 31, 0.94), rgba(18, 18, 18, 0.92));
    --premium-block-frame-bg:
            radial-gradient(ellipse at 12% 0%, rgba(253, 185, 19, 0.42), transparent 32%),
            radial-gradient(ellipse at 90% 100%, rgba(0, 106, 68, 0.30), transparent 36%),
            linear-gradient(100deg, transparent 0 34%, rgba(255, 255, 255, 0.28) 46%, transparent 58%),
            conic-gradient(from 145deg at 50% 50%, rgba(253, 185, 19, 0.10), rgba(253, 185, 19, 0.46), rgba(0, 106, 68, 0.28), rgba(193, 39, 45, 0.22), rgba(253, 185, 19, 0.10));
    --premium-block-sheen-bg:
            radial-gradient(ellipse at 12% -8%, rgba(253, 185, 19, 0.14), transparent 36%),
            radial-gradient(ellipse at 86% 108%, rgba(0, 106, 68, 0.11), transparent 40%),
            linear-gradient(115deg, transparent 0 40%, rgba(255, 255, 255, 0.055) 50%, transparent 62%);
    --premium-block-frame-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.14),
            inset 0 0 0 1px var(--premium-block-frame-border),
            0 14px 38px rgba(0, 0, 0, 0.16);
}

body.page-public-profile.workspace-profile-page.has-premium-profile.profile-theme-real-sky {
    --premium-block-frame-border: rgba(219, 234, 254, 0.38);
    --premium-block-title-edge: rgba(191, 219, 254, 0.24);
    --premium-block-frame-opacity: 0.92;
    --premium-block-sheen-opacity: 0.50;
    --premium-block-frame-speed: 30s;
    --premium-block-sheen-speed: 38s;
    --premium-block-frame-bg:
            radial-gradient(ellipse 68% 24% at 8% 18%, rgba(255, 255, 255, 0.60), transparent 55%),
            radial-gradient(ellipse 54% 22% at 88% 84%, rgba(186, 230, 253, 0.48), transparent 58%),
            linear-gradient(105deg, transparent 0 32%, rgba(255, 255, 255, 0.40) 46%, rgba(125, 211, 252, 0.26) 54%, transparent 66%),
            conic-gradient(from 170deg at 50% 50%, rgba(255, 255, 255, 0.10), rgba(219, 234, 254, 0.62), rgba(96, 165, 250, 0.22), rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.10));
    --premium-block-sheen-bg:
            radial-gradient(ellipse 74% 28% at -8% 10%, rgba(255, 255, 255, 0.18), transparent 64%),
            radial-gradient(ellipse 64% 26% at 108% 92%, rgba(186, 230, 253, 0.14), transparent 62%),
            linear-gradient(95deg, transparent 0 28%, rgba(255, 255, 255, 0.07) 45%, rgba(125, 211, 252, 0.06) 55%, transparent 72%);
}

body.page-public-profile.workspace-profile-page.has-premium-profile.profile-theme-space-orbit {
    --premium-block-frame-border: rgba(125, 211, 252, 0.38);
    --premium-block-title-edge: rgba(125, 211, 252, 0.22);
    --premium-block-frame-opacity: 0.90;
    --premium-block-sheen-opacity: 0.42;
    --premium-block-frame-speed: 24s;
    --premium-block-sheen-speed: 32s;
    --premium-block-frame-bg:
            radial-gradient(circle at 18% 20%, rgba(255, 255, 255, 0.52), transparent 7%),
            radial-gradient(circle at 78% 72%, rgba(125, 211, 252, 0.42), transparent 11%),
            linear-gradient(108deg, transparent 0 36%, rgba(216, 180, 254, 0.34) 46%, rgba(125, 211, 252, 0.36) 55%, transparent 66%),
            conic-gradient(from 60deg at 50% 50%, rgba(8, 13, 32, 0), rgba(125, 211, 252, 0.62), rgba(216, 180, 254, 0.32), rgba(255, 255, 255, 0.30), rgba(8, 13, 32, 0));
    --premium-block-sheen-bg:
            radial-gradient(circle at 16% 12%, rgba(255, 255, 255, 0.10), transparent 18%),
            radial-gradient(circle at 84% 92%, rgba(125, 211, 252, 0.09), transparent 22%),
            linear-gradient(118deg, transparent 0 40%, rgba(216, 180, 254, 0.075) 52%, transparent 66%);
}

body.page-public-profile.workspace-profile-page.has-premium-profile.profile-theme-spirit-moon {
    --premium-block-frame-border: rgba(216, 180, 254, 0.40);
    --premium-block-title-edge: rgba(216, 180, 254, 0.24);
    --premium-block-frame-opacity: 0.92;
    --premium-block-sheen-opacity: 0.48;
    --premium-block-frame-speed: 28s;
    --premium-block-sheen-speed: 36s;
    --premium-block-frame-bg:
            radial-gradient(ellipse 40% 28% at 16% 8%, rgba(255, 255, 255, 0.56), transparent 56%),
            radial-gradient(ellipse 62% 24% at 86% 92%, rgba(186, 230, 253, 0.34), transparent 62%),
            linear-gradient(110deg, transparent 0 34%, rgba(255, 255, 255, 0.28) 44%, rgba(216, 180, 254, 0.32) 55%, transparent 68%),
            conic-gradient(from 125deg at 50% 50%, rgba(255, 255, 255, 0.08), rgba(216, 180, 254, 0.58), rgba(125, 211, 252, 0.26), rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.08));
    --premium-block-sheen-bg:
            radial-gradient(ellipse 64% 24% at 0% 2%, rgba(255, 255, 255, 0.15), transparent 62%),
            radial-gradient(ellipse 70% 24% at 100% 98%, rgba(216, 180, 254, 0.12), transparent 62%),
            linear-gradient(100deg, transparent 0 34%, rgba(255, 255, 255, 0.055) 48%, rgba(125, 211, 252, 0.045) 58%, transparent 72%);
}

body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip,
body.page-public-profile.workspace-profile-page.has-premium-profile .p-card,
body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block,
body.page-public-profile.workspace-profile-page.has-premium-profile .project-item {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    box-sizing: border-box;
    border: var(--premium-block-frame-width) solid transparent !important;
    background: var(--premium-block-card-fill) padding-box, var(--premium-block-frame-bg) border-box !important;
    box-shadow: var(--premium-block-frame-shadow), 0 18px 48px rgba(0, 0, 0, 0.12) !important;
}

body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block-accent,
body.page-public-profile.workspace-profile-page.has-premium-profile .profile-job-card,
body.page-public-profile.workspace-profile-page.has-premium-profile .project-item.is-pinned-project {
    --premium-block-frame-opacity: 1;
    --premium-block-sheen-opacity: 0.58;
}

body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::before,
body.page-public-profile.workspace-profile-page.has-premium-profile .p-card::before,
body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::before,
body.page-public-profile.workspace-profile-page.has-premium-profile .project-item::before {
    content: "";
    position: absolute;
    inset: 1px;
    z-index: 0;
    pointer-events: none;
    border-radius: inherit;
    background: var(--premium-block-sheen-bg);
    background-size: 220% 220%, 220% 220%, 180% 180%;
    opacity: var(--premium-block-sheen-opacity);
}

body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::after,
body.page-public-profile.workspace-profile-page.has-premium-profile .p-card::after,
body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::after,
body.page-public-profile.workspace-profile-page.has-premium-profile .project-item::after {
    content: "";
    display: none;
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    border-radius: inherit;
    padding: var(--premium-block-frame-width);
    background: var(--premium-block-frame-bg);
    background-size: 230% 230%, 230% 230%, 190% 190%, 100% 100%;
    box-shadow: var(--premium-block-frame-shadow);
    opacity: var(--premium-block-frame-opacity);
}

@supports ((-webkit-mask-composite: xor) or (mask-composite: exclude)) {
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .p-card::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .project-item::after {
        display: block;
        -webkit-mask:
                linear-gradient(#000 0 0) content-box,
                linear-gradient(#000 0 0);
        -webkit-mask-composite: xor;
        mask:
                linear-gradient(#000 0 0) content-box,
                linear-gradient(#000 0 0);
        mask-composite: exclude;
    }
}

body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip > *,
body.page-public-profile.workspace-profile-page.has-premium-profile .p-card > *,
body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block > *,
body.page-public-profile.workspace-profile-page.has-premium-profile .project-item > * {
    position: relative;
    z-index: 1;
}

body.page-public-profile.workspace-profile-page.has-premium-profile .p-card-title {
    border-bottom-color: var(--premium-block-title-edge) !important;
}

body.page-public-profile.workspace-profile-page.has-premium-profile .contribution-graph {
    position: relative;
    z-index: 1;
    border-color: rgba(255, 255, 255, 0.08);
}

html.light-theme body.page-public-profile.workspace-profile-page.has-premium-profile {
    --premium-block-frame-border: rgba(37, 99, 235, 0.20);
    --premium-block-title-edge: rgba(37, 99, 235, 0.14);
    --premium-block-frame-opacity: 0.74;
    --premium-block-sheen-opacity: 0.36;
    --premium-block-card-fill: linear-gradient(180deg, #ffffff, #f8fbff);
    --premium-block-frame-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.55),
            inset 0 0 0 1px var(--premium-block-frame-border),
            0 14px 34px rgba(15, 23, 42, 0.08);
}

@media (prefers-reduced-motion: no-preference) {
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip.is-premium-frame-active::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .p-card.is-premium-frame-active::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block.is-premium-frame-active::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .project-item.is-premium-frame-active::after {
        animation: premiumBlockFrameDrift var(--premium-block-frame-speed) linear infinite;
        will-change: background-position;
    }

    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip.is-premium-frame-active::before,
    body.page-public-profile.workspace-profile-page.has-premium-profile .p-card.is-premium-frame-active::before,
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block.is-premium-frame-active::before,
    body.page-public-profile.workspace-profile-page.has-premium-profile .project-item.is-premium-frame-active::before {
        animation: premiumBlockSheenDrift var(--premium-block-sheen-speed) ease-in-out infinite alternate;
        will-change: background-position, opacity;
    }
}

@keyframes premiumBlockFrameDrift {
    0% { background-position: 0% 48%, 100% 52%, -120px 0, 50% 50%; }
    50% { background-position: 92% 52%, 8% 48%, 120px 0, 50% 50%; }
    100% { background-position: 0% 48%, 100% 52%, 360px 0, 50% 50%; }
}

@keyframes premiumBlockSheenDrift {
    0% { background-position: 0% 44%, 100% 58%, -90px 0; }
    100% { background-position: 100% 52%, 0% 46%, 110px 0; }
}

html.pwa-standalone body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::before,
html.pwa-standalone body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::after,
html.pwa-standalone body.page-public-profile.workspace-profile-page.has-premium-profile .p-card::before,
html.pwa-standalone body.page-public-profile.workspace-profile-page.has-premium-profile .p-card::after,
html.pwa-standalone body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::before,
html.pwa-standalone body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::after,
html.pwa-standalone body.page-public-profile.workspace-profile-page.has-premium-profile .project-item::before,
html.pwa-standalone body.page-public-profile.workspace-profile-page.has-premium-profile .project-item::after,
body.pwa-standalone.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::before,
body.pwa-standalone.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::after,
body.pwa-standalone.page-public-profile.workspace-profile-page.has-premium-profile .p-card::before,
body.pwa-standalone.page-public-profile.workspace-profile-page.has-premium-profile .p-card::after,
body.pwa-standalone.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::before,
body.pwa-standalone.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::after,
body.pwa-standalone.page-public-profile.workspace-profile-page.has-premium-profile .project-item::before,
body.pwa-standalone.page-public-profile.workspace-profile-page.has-premium-profile .project-item::after {
    --premium-block-frame-speed: 36s;
    --premium-block-sheen-speed: 44s;
}

@media (max-width: 760px), (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
    body.page-public-profile.workspace-profile-page.has-premium-profile {
        --premium-block-frame-opacity: 0.72;
        --premium-block-sheen-opacity: 0.30;
        --premium-block-frame-speed: 38s;
        --premium-block-sheen-speed: 46s;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::before,
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-smart-strip::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .p-card::before,
    body.page-public-profile.workspace-profile-page.has-premium-profile .p-card::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::before,
    body.page-public-profile.workspace-profile-page.has-premium-profile .profile-extra-block::after,
    body.page-public-profile.workspace-profile-page.has-premium-profile .project-item::before,
    body.page-public-profile.workspace-profile-page.has-premium-profile .project-item::after {
        animation: none !important;
        will-change: auto !important;
    }
}

@supports (content-visibility: auto) {
    body.page-public-profile.workspace-profile-page .profile-layout .p-card,
    body.page-public-profile.workspace-profile-page .profile-extra-block,
    body.page-public-profile.workspace-profile-page .project-item,
    body.page-public-profile.workspace-profile-page .recommendation-item {
        content-visibility: auto;
        contain-intrinsic-size: auto 220px;
    }

    body.page-public-profile.workspace-profile-page .profile-extra-block {
        contain-intrinsic-size: auto 140px;
    }

    body.page-public-profile.workspace-profile-page .project-item {
        contain-intrinsic-size: auto 260px;
    }
}

/* Premium cover rules live last because the workspace profile layout also defines cover backgrounds. */
body.page-public-profile .profile-cover.profile-cover-animated,
body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated {
    background-size: 180% 180% !important;
    background-position: 0% 50%, 100% 50%, 50% 50%;
    background-repeat: no-repeat !important;
    animation: profilePremiumCoverMove 9s ease-in-out infinite alternate !important;
    will-change: background-position;
}

body.page-public-profile .profile-cover.profile-cover-animated-aurora,
body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated-aurora {
    background-image:
            radial-gradient(ellipse at 18% 24%, rgba(134,239,172,.58), transparent 30%),
            radial-gradient(ellipse at 82% 16%, rgba(125,211,252,.34), transparent 34%),
            linear-gradient(135deg, #06120e, #111) !important;
}

body.page-public-profile .profile-cover.profile-cover-animated-fire,
body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated-fire {
    background-image:
            radial-gradient(circle at 24% 82%, rgba(255,209,92,.44), transparent 22%),
            radial-gradient(circle at 78% 74%, rgba(255,122,24,.34), transparent 26%),
            linear-gradient(135deg, #1c0b07, #050505) !important;
}

body.page-public-profile .profile-cover.profile-cover-animated-ocean,
body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated-ocean {
    background-image:
            radial-gradient(ellipse at 50% 10%, rgba(224,250,255,.28), transparent 28%),
            radial-gradient(circle at 78% 70%, rgba(56,189,248,.28), transparent 30%),
            linear-gradient(135deg, #03142a, #031018) !important;
}

body.page-public-profile .profile-cover.profile-cover-animated-code,
body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated-code {
    background-image:
            linear-gradient(rgba(48,200,134,.18) 1px, transparent 1px),
            linear-gradient(90deg, rgba(253,185,19,.12) 1px, transparent 1px),
            linear-gradient(135deg, #06120e, #050707) !important;
    background-size: 18px 18px, 18px 18px, 180% 180% !important;
}

body.page-public-profile .profile-cover.profile-cover-animated-forest,
body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated-forest {
    background-image:
            radial-gradient(ellipse at 24% 10%, rgba(217,249,157,.24), transparent 28%),
            radial-gradient(ellipse at 82% 16%, rgba(34,197,94,.20), transparent 30%),
            linear-gradient(135deg, #06100a, #10150f) !important;
}

body.page-public-profile .profile-cover.profile-cover-animated-stardust,
body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated-stardust {
    background-image:
            radial-gradient(circle at 22% 24%, rgba(245,208,254,.30), transparent 18%),
            radial-gradient(circle at 78% 18%, rgba(125,211,252,.24), transparent 18%),
            radial-gradient(circle at 58% 74%, rgba(253,185,19,.18), transparent 22%),
            linear-gradient(135deg, #0f1020, #090909) !important;
}

body.page-public-profile .profile-cover.profile-cover-animated:not(.profile-cover-animated-code),
body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated:not(.profile-cover-animated-code) {
    background-size: 180% 180%, 180% 180%, 180% 180% !important;
    background-repeat: no-repeat !important;
}

body.page-public-profile.workspace-profile-page.profile-motion-paused *,
body.page-public-profile.workspace-profile-page.profile-motion-paused *::before,
body.page-public-profile.workspace-profile-page.profile-motion-paused *::after {
    animation-play-state: paused !important;
}

body.page-public-profile.workspace-profile-page .profile-cover.profile-cover-animated:not(.is-cover-motion-active) {
    animation-play-state: paused !important;
    will-change: auto !important;
}

body.page-public-profile.workspace-profile-page.profile-low-power .profile-cover.profile-cover-animated,
body.page-public-profile.workspace-profile-page.profile-reduced-motion .profile-cover.profile-cover-animated {
    animation: none !important;
    background-position: 50% 50% !important;
    will-change: auto !important;
}

body.page-public-profile.workspace-profile-page.profile-low-power .profile-page-atmosphere,
body.page-public-profile.workspace-profile-page.profile-low-power .profile-page-atmosphere-shade,
body.page-public-profile.workspace-profile-page.profile-reduced-motion .profile-page-atmosphere,
body.page-public-profile.workspace-profile-page.profile-reduced-motion .profile-page-atmosphere-shade {
    display: none !important;
}

body.page-public-profile.workspace-profile-page.profile-low-power .profile-header,
body.page-public-profile.workspace-profile-page.profile-low-power .profile-smart-strip,
body.page-public-profile.workspace-profile-page.profile-low-power .p-card,
body.page-public-profile.workspace-profile-page.profile-low-power .profile-extra-block,
body.page-public-profile.workspace-profile-page.profile-low-power .project-item {
    backdrop-filter: none !important;
    filter: none !important;
}

body.page-public-profile.workspace-profile-page.profile-low-power.has-premium-profile .profile-smart-strip::before,
body.page-public-profile.workspace-profile-page.profile-low-power.has-premium-profile .profile-smart-strip::after,
body.page-public-profile.workspace-profile-page.profile-low-power.has-premium-profile .p-card::before,
body.page-public-profile.workspace-profile-page.profile-low-power.has-premium-profile .p-card::after,
body.page-public-profile.workspace-profile-page.profile-low-power.has-premium-profile .profile-extra-block::before,
body.page-public-profile.workspace-profile-page.profile-low-power.has-premium-profile .profile-extra-block::after,
body.page-public-profile.workspace-profile-page.profile-low-power.has-premium-profile .project-item::before,
body.page-public-profile.workspace-profile-page.profile-low-power.has-premium-profile .project-item::after {
    animation: none !important;
    will-change: auto !important;
}
