@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@400;500;600;700;800&family=Rajdhani:wght@400;500;600;700&display=swap');

:root {
    --bg: #080d14;
    --card: #111720;
    --card-soft: #151b25;
    --input: #252c37;
    --line: #283140;
    --text: #f6f7fb;
    --muted: #9ca8b8;
    --red: #ff2739;
    --orange: #ff5a31;
    --green: #18df4b;
    --blue: #009eff;
    --radius: 16px;
    --rainbow: linear-gradient(100deg, #ff382d 0%, #e19e28 28%, #18dc4d 52%, #00caa0 70%, #009cff 100%);
    --rainbow-border: linear-gradient(120deg, #ff3b2f, #efb529, #1ee14d, #00bad0, #009eff);
    --shadow: 0 14px 35px rgba(98, 104, 210, .18);
}

/* Razširjeni profili streamerjev in gaming strežnikov */
.creator-profiles,.profile-directory{display:grid;gap:18px;margin-top:28px}.creator-profiles>h2{margin-bottom:0}.public-profile{padding:24px}.profile-title{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.profile-title h2{margin:10px 0}.profile-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0}.profile-columns>div,.profile-facts{padding:15px;border:1px solid #283444;border-radius:13px;background:rgba(8,14,22,.55)}.profile-facts{display:flex;flex-wrap:wrap;gap:12px 28px;margin:16px 0}.mini-list{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 18px}.mini-list span{padding:7px 10px;border:1px solid #344356;border-radius:999px;background:#111a25}.donor-list{display:grid;gap:7px;max-width:520px;padding-left:25px}.donor-list li{padding:8px 10px;border-bottom:1px solid #283444}.donor-list b{float:right;color:var(--green)}.profile-actions,.community-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px}.community-filters{margin:0 0 22px}.community-filters a{text-decoration:none}.community-filters .selected{color:#fff;border-color:#00d9d9;box-shadow:0 0 14px rgba(0,217,217,.2)}.page-uredi-predstavitev .form-card{display:grid;gap:14px;margin-bottom:24px}.page-predlagaj-dogodek .form-card{display:grid;gap:14px}
@media(max-width:700px){.profile-columns{grid-template-columns:1fr}.profile-title{flex-direction:column}.public-profile{padding:18px}}

* {
    box-sizing: border-box;
}

html {
    min-width: 320px;
    color-scheme: dark;
    scroll-behavior: smooth;
}

body {
    min-height: 100vh;
    margin: 0;
    color: var(--text);
    background:
        radial-gradient(ellipse at 50% 100%, rgba(0, 152, 77, .14), transparent 32%),
        linear-gradient(105deg, #210d15 0%, #0d0d14 45%, #071d31 100%);
    background-attachment: fixed;
    font: 500 15px/1.5 "Rajdhani", system-ui, sans-serif;
}

button,
input,
textarea,
select {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

a {
    color: inherit;
}

.site-shell {
    width: min(1090px, calc(100% - 32px));
    min-height: 100vh;
    margin: 0 auto;
}

.site-header {
    position: relative;
    z-index: 20;
    height: 87px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.brand {
    width: 57px;
    height: 45px;
    border-radius: 13px;
    overflow: hidden;
    box-shadow: 0 6px 22px rgba(0, 0, 0, .25);
    flex: 0 0 auto;
}

.brand img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
}

nav a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #b9c7d9;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    transition: color .18s ease, transform .18s ease;
}

nav a:hover,
nav a:focus-visible {
    color: #fff;
    transform: translateY(-1px);
}

nav a.active {
    color: var(--green);
}

nav .profile-link {
    color: var(--blue);
}

nav .admin-link.active,
nav .admin-link:hover {
    color: var(--green);
}

.nav-logout-form {
    margin: 0;
}

.nav-logout-form input[type="hidden"] {
    display: none;
}

.nav-action {
    min-height: 36px !important;
    padding: 0 13px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
}

.menu-toggle {
    display: none;
    width: 42px;
    height: 42px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--card);
    color: #fff;
    cursor: pointer;
    font-size: 22px;
}

.ticker {
    width: 100%;
    height: 38px;
    overflow: hidden;
    border-radius: 14px;
    background: #0f141d;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .015);
    color: #aeb7c5;
}

.ticker-track {
    width: max-content;
    height: 100%;
    display: flex;
    align-items: center;
    font-weight: 600;
    white-space: nowrap;
    transform: translate3d(0, 0, 0);
    animation: tickerMove 40s linear infinite;
    will-change: transform;
    backface-visibility: hidden;
}

.ticker-group {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 70px;
    padding: 0 70px 0 10px;
}

@keyframes tickerMove {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(-50%, 0, 0); }
}

.flash {
    position: fixed;
    top: 105px;
    left: 50%;
    z-index: 100;
    translate: -50% 0;
    width: min(520px, calc(100% - 32px));
    padding: 13px 18px;
    border: 1px solid rgba(24, 223, 75, .6);
    border-radius: 13px;
    background: rgba(12, 24, 20, .95);
    box-shadow: 0 15px 35px rgba(0, 0, 0, .35);
    text-align: center;
    transition: opacity .3s ease, transform .3s ease;
}

.flash.error {
    border-color: rgba(255, 39, 57, .8);
    background: rgba(36, 12, 18, .96);
}

.flash.hide {
    opacity: 0;
    transform: translateY(-12px);
}

main {
    min-height: 580px;
    padding: 56px 0 80px;
}

h1,
h2,
h3,
h4,
.gradient-button,
.outline-button,
.discord-button,
.danger-button,
.text-button {
    font-family: "Oxanium", system-ui, sans-serif;
}

h1,
h2,
h3,
h4,
p {
    margin-top: 0;
}

h1 {
    margin-bottom: 7px;
    font-size: clamp(38px, 4.2vw, 52px);
    line-height: 1.08;
    letter-spacing: -.035em;
}

h2 {
    margin-bottom: 28px;
    font-size: 31px;
    line-height: 1.15;
}

h3 {
    margin-bottom: 9px;
    font-size: 20px;
    line-height: 1.22;
}

h4 {
    margin-bottom: 8px;
    color: #aab6c7;
    font-size: 12px;
    letter-spacing: .04em;
}

p {
    color: var(--muted);
}

small {
    color: #8e9aab;
}

.gradient-text {
    display: inline-block;
    background-image: linear-gradient(
        90deg,
        #ff2f48 0%,
        #ff8a2b 6.25%,
        #ffe135 12.5%,
        #20e965 18.75%,
        #00d9d9 25%,
        #008cff 31.25%,
        #875cff 37.5%,
        #f040d1 43.75%,
        #ff2f48 50%,
        #ff8a2b 56.25%,
        #ffe135 62.5%,
        #20e965 68.75%,
        #00d9d9 75%,
        #008cff 81.25%,
        #875cff 87.5%,
        #f040d1 93.75%,
        #ff2f48 100%
    );
    background-size: 200% 100%;
    background-position: 0% 50%;
    background-repeat: repeat-x;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
    filter: drop-shadow(0 0 5px rgba(0, 217, 217, .22));
    animation: movingLedText 6s linear infinite;
    will-change: background-position;
}

@keyframes movingLedText {
    from { background-position: 0% 50%; }
    to { background-position: 100% 50%; }
}

.red { color: var(--red) !important; }
.green { color: var(--green) !important; }
.blue { color: var(--blue) !important; }

.icon {
    width: 21px;
    height: 21px;
    flex: 0 0 auto;
}

.card {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(145deg, #151a23, #0f141c 70%);
    box-shadow: var(--shadow);
}

.rainbow-card,
.rainbow-outline,
.outline-button {
    border: 1px solid transparent !important;
    background:
        linear-gradient(#101620, #101620) padding-box,
        var(--rainbow-border) border-box !important;
}

.gradient-button,
.outline-button,
.discord-button,
.danger-button {
    min-height: 45px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 24px;
    border: 0;
    border-radius: 13px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    transition: filter .18s ease, transform .18s ease, box-shadow .18s ease;
}

.gradient-button {
    background: var(--rainbow);
    box-shadow: 0 0 24px rgba(0, 174, 255, .3), -10px 0 24px rgba(255, 50, 45, .18);
}

.discord-button {
    background: linear-gradient(135deg, #5865f2, #7b55e7);
    box-shadow: 0 0 24px rgba(88, 101, 242, .34);
}

.danger-button {
    border: 1px solid rgba(255, 39, 57, .75);
    background: rgba(83, 18, 29, .72);
    box-shadow: 0 0 18px rgba(255, 39, 57, .13);
}

.outline-button {
    background:
        linear-gradient(#0c1119, #0c1119) padding-box,
        var(--rainbow-border) border-box !important;
}

.gradient-button:hover,
.gradient-button:focus-visible,
.outline-button:hover,
.outline-button:focus-visible,
.discord-button:hover,
.discord-button:focus-visible,
.danger-button:hover,
.danger-button:focus-visible {
    filter: brightness(1.12);
    transform: translateY(-1px);
}

.gradient-button:disabled,
.outline-button:disabled,
.discord-button:disabled,
.danger-button:disabled {
    opacity: .42;
    filter: grayscale(.75);
    cursor: not-allowed;
    transform: none;
}

.compact {
    min-height: 41px;
    padding: 0 18px;
}

.text-link {
    display: inline-block;
    font-weight: 700;
    text-decoration: none;
}

.text-link:hover {
    text-decoration: underline;
}

.text-button {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    font-weight: 600;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
    outline: 2px solid #66c8ff;
    outline-offset: 3px;
}

.hero {
    position: relative;
    isolation: isolate;
    min-height: 570px;
    overflow: hidden;
    padding: 46px 28px 48px;
    border: 1px solid rgba(75, 105, 137, .58);
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(2, 5, 10, .06) 0%, rgba(2, 6, 12, .18) 68%, rgba(2, 6, 12, .35) 100%),
        url("home-hero-background.webp") center / cover no-repeat;
    box-shadow: 0 24px 62px rgba(0, 0, 0, .34), inset 0 0 80px rgba(0, 0, 0, .16);
    text-align: center;
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(ellipse at 50% 102%, rgba(18, 225, 101, .08), transparent 34%),
        linear-gradient(90deg, rgba(255, 25, 120, .03), transparent 28%, transparent 72%, rgba(0, 170, 255, .04));
    pointer-events: none;
}

.hero > * {
    position: relative;
    z-index: 1;
}

.hero-logo {
    display: block;
    width: 285px;
    max-width: 78vw;
    height: auto;
    margin: 0 auto 24px;
    border-radius: 22px;
    box-shadow: 0 16px 46px rgba(0, 0, 0, .48), 0 0 30px rgba(40, 101, 190, .15);
}

.hero h1 {
    margin-bottom: 18px;
    font-size: clamp(47px, 5.2vw, 62px);
    letter-spacing: -.04em;
}

.hero p {
    max-width: 590px;
    margin: 0 auto 30px;
    font-size: 17px;
}

.hero-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 62px;
}

.stats article {
    min-height: 94px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(145deg, #151a23, #0f141c);
    box-shadow: var(--shadow);
    text-align: center;
}

.stats strong {
    font-family: "Oxanium", sans-serif;
    font-size: 27px;
    line-height: 1;
}

.stats span {
    margin-top: 10px;
    color: #aeb7c5;
    font-size: 12px;
}

.home-section {
    margin-top: 96px;
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.feature-card {
    min-height: 169px;
    padding: 25px;
}

.feature-card .icon {
    width: 25px;
    height: 25px;
    margin-bottom: 10px;
}

.feature-card p {
    margin: 0;
}

.home-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 34px;
}

.leaderboard-card {
    min-height: 620px;
    padding: 24px;
}

.leaderboard-card small {
    display: block;
    margin-top: 16px;
}

.quick-links {
    display: grid;
    grid-template-rows: repeat(4, 1fr);
    gap: 20px;
}

.quick-links .card {
    min-height: 140px;
    display: block;
    padding: 25px;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease;
}

.quick-links .card:hover {
    border-color: #3a4962;
    transform: translateY(-2px);
}

.quick-links .icon {
    width: 24px;
    height: 24px;
}

.quick-links p {
    margin-bottom: 0;
}

.leader-list {
    margin: 22px 0 0;
    padding: 0;
    list-style-position: inside;
}

.leader-list li {
    display: flex;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid #262e3a;
}

.page-heading {
    position: relative;
    margin-bottom: 42px;
}

.page-heading > p:not(.eyebrow) {
    margin-bottom: 0;
}

.page-heading .text-link {
    margin-top: 16px;
}

.game-save-status {
    min-height: 22px;
    margin-top: 13px !important;
    color: #a8b5c7;
    font-weight: 700;
}

.game-save-status.success {
    color: var(--green);
}

.game-save-status.error {
    color: #ff7483;
}

.eyebrow {
    margin-bottom: 12px;
    color: #8390a3;
    font-family: "Oxanium", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .28em;
}

.games-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.game-card {
    min-height: 343px;
    padding: 20px;
    overflow: hidden;
}

.game-card h3 {
    margin-bottom: 15px;
}

.reaction-zone {
    width: 100%;
    height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 17px;
    color: #fff;
    cursor: pointer;
}

.reaction-zone strong {
    font: 700 20px "Oxanium", sans-serif;
}

.reaction-zone small {
    margin-top: 12px;
}

.reaction-zone.waiting {
    background: #4a2c20 !important;
}

.reaction-zone.ready {
    background: #0a7733 !important;
}

.memory-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
}

.memory-card {
    height: 72px;
    border-radius: 13px;
    color: #fff;
    cursor: pointer;
    font-size: 22px;
}

.memory-card.matched {
    opacity: .42;
    cursor: default;
}

.game-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 12px;
    color: #9ca8b8;
}

.clicker-card,
.guess-card,
.simon-card,
.rps-card {
    text-align: center;
}

.clicker-card h3,
.guess-card h3,
.simon-card h3,
.rps-card h3 {
    text-align: left;
}

.clicker-button {
    width: 130px;
    height: 130px;
    margin: 42px auto 0;
    border-radius: 50%;
    color: #fff;
    background: #53292e !important;
    cursor: pointer;
    font: 700 29px "Oxanium", sans-serif;
}

.clicker-button.running {
    background: #143d3c !important;
}

.clicker-card p {
    margin-top: 13px;
}

.rps-result {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    margin-top: 10px;
}

.rps-result strong {
    font: 700 42px "Oxanium", sans-serif;
}

.rps-buttons {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

.rps-buttons button {
    height: 58px;
    border-radius: 13px;
    cursor: pointer;
    font-size: 24px;
}

.rps-card > small {
    display: block;
    margin-top: 14px;
}

.guess-card > p {
    margin-top: 20px;
}

.guess-row {
    display: flex;
    gap: 8px;
    margin-top: 14px;
}

.guess-row .gradient-button {
    width: 57px;
    padding: 0;
}

.simon-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
}

.simon-pad {
    height: 85px;
    border-radius: 14px;
    cursor: pointer;
    transition: filter .12s ease, transform .12s ease;
}

.simon-pad:nth-child(1) { background: #32151b padding-box, var(--rainbow-border) border-box !important; }
.simon-pad:nth-child(2) { background: #0b273a padding-box, var(--rainbow-border) border-box !important; }
.simon-pad:nth-child(3) { background: #10341e padding-box, var(--rainbow-border) border-box !important; }
.simon-pad:nth-child(4) { background: #3a3311 padding-box, var(--rainbow-border) border-box !important; }

.simon-pad.active {
    filter: brightness(2.7);
    transform: scale(.97);
}

.simon-card > p {
    margin-top: 13px;
}

.games-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 40px;
}

.games-bottom .leaderboard-card,
.points-card {
    min-height: 325px;
    padding: 24px;
}

.points-card p {
    margin-bottom: 8px;
}

.points-card .text-link {
    margin-top: 12px;
}

.directory-heading {
    padding-right: 310px;
}

.search-field {
    position: absolute;
    right: 0;
    bottom: 2px;
    width: 290px;
}

.search-field .icon {
    position: absolute;
    top: 50%;
    left: 14px;
    translate: 0 -50%;
    color: var(--blue);
}

.search-field input {
    padding-left: 45px;
    border-color: var(--blue);
    background: rgba(11, 18, 28, .75);
}

.filters {
    margin-bottom: 20px;
}

.chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.chips button,
.choice-chip {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
    border: 1px solid #2b3442;
    border-radius: 999px;
    background: transparent;
    color: #bdc8d8;
    cursor: pointer;
    font-weight: 700;
    transition: color .16s ease, border-color .16s ease, background .16s ease;
}

.chips button:hover,
.chips button.selected,
.choice-chip:hover,
.choice-chip.selected {
    border-color: var(--blue);
    background: rgba(0, 158, 255, .08);
    color: #fff;
}

.choice-chip input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.favourite-filter {
    margin-top: 28px;
    padding: 20px 24px;
}

.favourite-filter h3,
.favourite-filter p {
    margin-bottom: 4px;
}

.favourite-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-top: 16px;
}

#streamerCount {
    margin: 26px 0 14px;
}

.streamer-list {
    display: grid;
    gap: 14px;
}

.streamer-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 16px;
    padding: 18px 22px;
}

.streamer-avatar {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border: 1px solid var(--blue);
    border-radius: 50%;
    background: #1a2330;
    color: var(--green);
    font: 700 22px "Oxanium", sans-serif;
}

.streamer-card h3,
.streamer-card p {
    margin: 0;
}

.live-pill {
    display: inline-block;
    padding: 3px 7px;
    border-radius: 999px;
    background: var(--red);
    font-size: 10px;
    vertical-align: middle;
}

.empty-state {
    min-height: 125px;
    display: grid;
    place-content: center;
    justify-items: center;
    padding: 24px;
    text-align: center;
}

.empty-state p {
    margin-bottom: 8px;
}

.calendar-empty {
    margin-top: -7px;
}

.event-list {
    display: grid;
    gap: 16px;
}

.event-card {
    padding: 22px 25px;
}

.event-card time {
    color: var(--blue);
    font-weight: 700;
}

.event-card h3 {
    margin-top: 6px;
}

.three-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 0;
}

.achievement-stats article {
    min-height: 112px;
    align-items: flex-start;
    padding: 20px;
    text-align: left;
}

.achievement-stats span {
    margin-top: 0;
}

.achievement-stats strong {
    margin-top: 6px;
}

.achievement-stats small {
    margin-top: 8px;
}

.achievements-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 28px;
}

.achievement-card {
    position: relative;
    min-height: 222px;
    padding: 21px;
}

.achievement-card .achievement-lock {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 17px;
    height: 17px;
    color: #778394;
}

.achievement-card.unlocked .achievement-lock {
    color: var(--green);
}

.tier {
    display: inline-block;
    margin-bottom: 9px;
    font-family: "Oxanium", sans-serif;
    font-size: 11px;
    font-weight: 700;
}

.tier-bronze { color: #ff6742; }
.tier-silver { color: #b8c6d5; }
.tier-gold { color: #ffd12f; }
.tier-legendary { color: #ff3655; }

.achievement-card p {
    margin-bottom: 6px;
}

.progress {
    height: 7px;
    margin: 17px 0 7px;
    overflow: hidden;
    border-radius: 99px;
    background: #202733;
}

.progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--rainbow);
}

.achievement-discord {
    margin-top: 24px;
    padding: 24px;
}

.form-card,
.admin-card,
.profile-form,
.auth-card {
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 32px;
}

label,
legend {
    color: #f2f5f8;
    font-weight: 700;
}

input,
textarea,
select {
    width: 100%;
    min-height: 46px;
    padding: 12px 16px;
    border: 1px solid transparent;
    border-radius: 12px;
    outline: none;
    background: var(--input);
    color: #fff;
    transition: border-color .16s ease, box-shadow .16s ease;
}

label > input,
label > textarea,
label > select {
    margin-top: 8px;
}

textarea {
    min-height: 86px;
    resize: vertical;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(0, 158, 255, .1);
}

fieldset {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

fieldset > small {
    display: block;
    margin: 5px 0 13px;
}

.notification-form {
    gap: 27px;
    padding: 32px;
}

.notification-chips {
    margin-bottom: 10px;
}

.frequency-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 13px;
}

.frequency-choice {
    min-height: 79px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 14px 16px;
    border: 1px solid #2a3340;
    border-radius: 15px;
    cursor: pointer;
}

.frequency-choice input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.frequency-choice strong {
    font: 700 15px "Oxanium", sans-serif;
}

.frequency-choice small {
    margin-top: 5px;
}

.frequency-choice.selected {
    border-color: var(--blue);
    box-shadow: 0 0 20px rgba(0, 158, 255, .18);
}

.frequency-choice.selected strong {
    color: var(--blue);
}

.notification-form > .gradient-button {
    align-self: flex-start;
}

.access-note {
    margin-bottom: 24px;
    padding: 20px 24px;
}

.access-note h3,
.access-note p {
    margin-bottom: 8px;
}

.admin-stack {
    display: grid;
    gap: 24px;
}

.admin-card {
    padding: 32px;
}

.admin-card > h3 {
    margin-bottom: 0;
}

.admin-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.admin-card-heading h3,
.admin-card-heading p {
    margin-bottom: 5px;
}

.admin-user-total {
    flex: 0 0 auto;
    padding: 7px 11px;
    border: 1px solid #354154;
    border-radius: 999px;
    color: #b9c8d9;
    font-weight: 700;
}

.role-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 20px 0;
}

.role-summary > div {
    min-height: 72px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #2a3443;
    border-radius: 12px;
    background: #111822;
}

.role-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    min-height: 25px;
    padding: 3px 9px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font: 700 11px "Oxanium", sans-serif;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.role-admin {
    color: #ff5265;
    background: rgba(255, 39, 57, .1);
}

.role-sponsor {
    color: #ffd24a;
    background: rgba(255, 210, 74, .1);
}

.role-streamer {
    color: #30b9ff;
    background: rgba(0, 158, 255, .1);
}

.role-user {
    color: #43e66b;
    background: rgba(24, 223, 75, .08);
}

.role-guest {
    color: #9ca8b8;
    background: rgba(156, 168, 184, .08);
}

.user-role-list {
    display: grid;
    gap: 9px;
}

.user-role-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto 165px 105px;
    align-items: center;
    gap: 12px;
    padding: 11px;
    border: 1px solid #2a3443;
    border-radius: 12px;
    background: rgba(8, 13, 20, .48);
}

.user-role-identity {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.user-role-identity strong,
.user-role-identity small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-role-points {
    color: #94a2b5;
    white-space: nowrap;
}

.role-history {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #2a3443;
}

.role-history summary,
.password-card summary {
    cursor: pointer;
    color: #d9e2ee;
    font: 700 14px "Oxanium", sans-serif;
}

.role-history-list {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.role-history-list p {
    margin: 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(7, 12, 18, .42);
}

.role-history-list small {
    display: block;
    margin-top: 3px;
}

.role-select-label select {
    margin: 0;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.discord-admin-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
}

.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.admin-card fieldset legend {
    margin-bottom: 8px;
    color: #9cabbc;
    font-size: 11px;
    letter-spacing: .04em;
}

.admin-wide-button {
    width: 50%;
}

.award-card select {
    margin-top: -5px;
}

.award-actions {
    display: flex;
    gap: 12px;
}

.admin-record-list {
    display: grid;
    gap: 10px;
}

.admin-record-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px;
    border: 1px solid #2a3443;
    border-radius: 12px;
    background: rgba(8, 13, 20, .48);
}

.admin-record-row > div:first-child {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.admin-record-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-record-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
}

.admin-record-actions form,
.admin-record-row > form {
    margin: 0;
}

.profile-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
}

.profile-form {
    min-height: 235px;
    justify-content: flex-start;
}

.profile-form .gradient-button {
    align-self: flex-start;
}

.profile-summary {
    min-height: 235px;
    padding: 25px;
}

.profile-role-badge {
    margin: 6px 0 17px;
}

.profile-points {
    display: block;
    margin: 6px 0 11px;
    font: 700 38px "Oxanium", sans-serif;
}

.profile-summary .text-link {
    display: block;
    margin-top: 8px;
}

.history-title {
    margin: 42px 0 17px;
    font-size: 24px;
}

.password-card {
    margin-top: 20px;
    padding: 22px 25px;
}

.password-form {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
    margin-top: 18px;
}

.password-form .gradient-button {
    grid-column: 1 / -1;
    justify-self: start;
}

.history-card {
    min-height: 104px;
    padding: 24px;
}

.history-card p {
    margin-bottom: 8px;
}

.score-table {
    display: grid;
}

.score-table > div {
    display: grid;
    grid-template-columns: 1fr 1fr auto auto;
    gap: 20px;
    align-items: center;
    padding: 11px 0;
    border-bottom: 1px solid #29313e;
}

.auth-card {
    width: min(448px, 100%);
    min-height: 510px;
    margin: 4px auto 0;
    padding: 28px;
}

.auth-card h1 {
    margin-bottom: -6px;
    font-size: 28px;
    letter-spacing: .01em;
}

.auth-card p {
    margin-bottom: 6px;
}

.auth-card .gradient-button,
.auth-card .outline-button {
    width: 100%;
}

.auth-link,
.auth-card > small {
    text-align: center;
}

.social-auth-card {
    min-height: 0;
    display: grid;
    gap: 18px;
    overflow: hidden;
    background:
        radial-gradient(circle at 10% 0%, rgba(255, 39, 57, .12), transparent 34%),
        radial-gradient(circle at 100% 10%, rgba(0, 158, 255, .14), transparent 36%),
        var(--card);
}

.social-auth-card .eyebrow,
.social-auth-card h1,
.social-auth-card p {
    margin-bottom: 0;
}

.social-auth-card .oauth-login-options {
    margin-top: 4px;
}

.social-auth-note {
    display: grid;
    gap: 2px;
    padding: 12px 14px;
    border: 1px solid rgba(24, 223, 75, .25);
    border-radius: 12px;
    background: rgba(24, 223, 75, .06);
    color: var(--muted);
}

.social-auth-note strong {
    color: var(--green);
    font-family: "Oxanium", system-ui, sans-serif;
    font-size: 12px;
    text-transform: uppercase;
}

.email-login-fallback {
    border-top: 1px solid #2a3442;
    border-bottom: 1px solid #2a3442;
    padding: 12px 0;
}

.email-login-fallback summary {
    color: #aeb9c8;
    cursor: pointer;
    font-weight: 700;
    text-align: center;
}

.email-login-fallback[open] summary {
    margin-bottom: 14px;
}

.email-login-form {
    display: grid;
    gap: 12px;
}

.email-login-form .outline-button {
    width: 100%;
}

.onboarding-card {
    width: min(520px, 100%);
}

.onboarding-form {
    display: grid;
    gap: 14px;
}

.onboarding-form > small {
    margin-top: -7px;
    color: var(--muted);
}

.onboarding-cancel-form {
    display: flex;
    justify-content: center;
    margin-top: -4px;
}

.onboarding-cancel-form input[type="hidden"] {
    display: none;
}

/* Google in Discord prijava */
.auth-divider {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 11px;
    color: #7f8c9d;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.auth-divider::before,
.auth-divider::after {
    height: 1px;
    background: #2a3442;
    content: "";
}

.oauth-login-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.oauth-button {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: 12px;
    font: 700 12px "Oxanium", system-ui, sans-serif;
    text-decoration: none;
    transition: filter .18s ease, transform .18s ease, box-shadow .18s ease;
}

.oauth-button.oauth-google {
    border-color: #d8dce4;
    background: #fff;
    color: #172033;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .2);
}

.oauth-button.oauth-discord {
    border-color: #7c85f8;
    background: linear-gradient(135deg, #5865f2, #7459e7);
    color: #fff;
    box-shadow: 0 8px 24px rgba(88, 101, 242, .26);
}

.oauth-button:not(.is-disabled):hover,
.oauth-button:not(.is-disabled):focus-visible {
    filter: brightness(1.08);
    transform: translateY(-1px);
}

.oauth-button.is-disabled {
    opacity: .42;
    filter: grayscale(.7);
    cursor: not-allowed;
}

.oauth-brand-mark {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    border-radius: 7px;
    background: rgba(0, 0, 0, .08);
    font: 800 13px "Oxanium", system-ui, sans-serif;
}

.oauth-brand-mark.oauth-google {
    background: #fff;
    color: #4285f4;
    box-shadow: inset 0 0 0 1px #d8dce4;
}

.oauth-brand-mark.oauth-discord {
    background: #5865f2;
    color: #fff;
}

.oauth-setup-note {
    margin-top: -10px;
    padding: 9px 11px;
    border: 1px solid rgba(255, 210, 74, .2);
    border-radius: 10px;
    background: rgba(255, 210, 74, .05);
    color: #d7c88d;
    font-size: 11px;
    text-align: center;
}

.connected-accounts-card {
    margin-top: 20px;
    padding: 25px;
}

.connected-accounts-heading,
.connected-account-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.connected-accounts-heading h3,
.connected-accounts-heading .eyebrow {
    margin-bottom: 0;
}

.connection-count,
.connection-status {
    flex: 0 0 auto;
    color: #58ed88;
    font: 700 11px "Oxanium", system-ui, sans-serif;
    letter-spacing: .03em;
}

.connection-count {
    padding: 6px 10px;
    border: 1px solid rgba(24, 223, 75, .35);
    border-radius: 999px;
    background: rgba(24, 223, 75, .07);
}

.connected-account-list {
    display: grid;
    gap: 9px;
    margin-top: 17px;
}

.connected-account-row {
    justify-content: flex-start;
    padding: 12px 13px;
    border: 1px solid #2c3746;
    border-radius: 13px;
    background: rgba(7, 12, 19, .48);
}

.connected-account-row > div {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.connected-account-row small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.connection-status.is-muted {
    color: #788597;
}

/* Piškotki */
[hidden] {
    display: none !important;
}

.cookie-banner {
    position: fixed;
    right: 22px;
    bottom: 22px;
    left: 22px;
    z-index: 1000;
    width: min(1120px, calc(100% - 44px));
    margin: 0 auto;
    padding: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    border: 1px solid rgba(0, 158, 255, .48);
    border-radius: 18px;
    background:
        radial-gradient(circle at 0 0, rgba(255, 56, 45, .12), transparent 32%),
        radial-gradient(circle at 100% 100%, rgba(0, 158, 255, .13), transparent 34%),
        rgba(10, 15, 23, .97);
    box-shadow: 0 22px 70px rgba(0, 0, 0, .6), 0 0 28px rgba(0, 158, 255, .12);
    backdrop-filter: blur(15px);
}

.cookie-banner-copy {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
}

.cookie-banner-copy h2 {
    margin-bottom: 3px;
    font-size: 18px;
}

.cookie-banner-copy p {
    max-width: 650px;
    margin: 0;
    font-size: 14px;
}

.cookie-inline-link,
.footer-privacy-links a,
.footer-privacy-links button {
    color: #58c8ff;
}

.cookie-inline-link {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    text-decoration: underline;
}

.cookie-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 181, 48, .35);
    border-radius: 14px;
    background: rgba(255, 170, 43, .08);
    font-size: 25px;
}

.cookie-banner-actions,
.cookie-settings-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 9px;
}

.cookie-settings-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1100;
    padding: 22px;
    display: grid;
    place-items: center;
    overflow-y: auto;
    background: rgba(2, 6, 11, .82);
    backdrop-filter: blur(8px);
}

.cookie-settings-card {
    position: relative;
    width: min(560px, 100%);
    padding: 30px;
    box-shadow: 0 30px 90px rgba(0, 0, 0, .7);
}

.cookie-settings-card h2 {
    margin-bottom: 8px;
}

.cookie-settings-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 38px;
    height: 38px;
    border: 1px solid #344052;
    border-radius: 11px;
    background: #121a25;
    color: #fff;
    cursor: pointer;
    font-size: 24px;
}

.cookie-option {
    min-height: 80px;
    margin-top: 12px;
    padding: 14px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border: 1px solid #2c3848;
    border-radius: 14px;
    background: rgba(8, 14, 22, .56);
}

.cookie-option span {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cookie-option input {
    width: 23px;
    min-height: 23px;
    flex: 0 0 auto;
    accent-color: var(--green);
}

.cookie-settings-actions {
    justify-content: flex-end;
    margin-top: 20px;
}

.cookie-page-heading .gradient-button {
    margin-top: 12px;
}

.cookie-policy-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.cookie-policy-card {
    padding: 25px;
}

.cookie-policy-card:first-child {
    grid-column: 1 / -1;
}

.cookie-policy-card h2 {
    margin: 13px 0 9px;
    font-size: 24px;
}

.cookie-policy-badge {
    display: inline-flex;
    padding: 5px 9px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font: 700 10px "Oxanium", system-ui, sans-serif;
}

.cookie-policy-badge.required { color: #4ee47f; }
.cookie-policy-badge.optional { color: #52bfff; }
.cookie-policy-badge.browser { color: #ffba49; }

.cookie-table {
    display: grid;
    margin-top: 18px;
    border-top: 1px solid #2b3543;
}

.cookie-table > div {
    display: grid;
    grid-template-columns: 190px 1fr auto;
    gap: 16px;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #2b3543;
}

.cookie-table small {
    text-align: right;
}

/* Začetni zaklep celotne spletne strani */
.access-gate-page {
    min-height: 100vh;
    overflow-x: hidden;
}

.access-gate-page::before,
.access-gate-page::after {
    position: fixed;
    z-index: -1;
    width: 390px;
    height: 390px;
    border-radius: 50%;
    content: "";
    filter: blur(90px);
    opacity: .18;
    pointer-events: none;
}

.access-gate-page::before {
    top: -140px;
    left: -130px;
    background: #ff2739;
}

.access-gate-page::after {
    right: -130px;
    bottom: -150px;
    background: #009eff;
}

.access-gate-shell {
    width: min(100% - 32px, 520px);
    min-height: 100vh;
    margin: 0 auto;
    padding: 42px 0;
    display: grid;
    place-items: center;
}

.access-gate-card {
    width: 100%;
    margin: 0;
    padding: 34px;
    display: flex;
    flex-direction: column;
    gap: 17px;
    text-align: center;
    box-shadow: 0 24px 80px rgba(0, 0, 0, .48), 0 0 34px rgba(0, 158, 255, .12);
}

.access-gate-logo {
    width: 108px;
    height: 86px;
    margin: 0 auto -2px;
    border-radius: 18px;
    object-fit: cover;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .35);
}

.access-gate-icon {
    width: 44px;
    height: 44px;
    margin: -4px auto -7px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(0, 158, 255, .38);
    border-radius: 50%;
    background: #111b28;
    box-shadow: 0 0 22px rgba(0, 158, 255, .2);
    font-size: 20px;
}

.access-gate-card h1 {
    margin: 0;
    font-size: clamp(25px, 7vw, 34px);
    letter-spacing: .015em;
}

.access-gate-card p {
    margin: -6px 0 2px;
}

.access-gate-card label {
    text-align: left;
}

.access-gate-card input {
    min-height: 52px;
    border-color: #343f50;
    background: #202834;
    font-size: 16px;
}

.access-gate-card .gradient-button {
    width: 100%;
    min-height: 50px;
}

.access-gate-card > small {
    text-align: center;
}

.access-gate-error {
    padding: 11px 13px;
    border: 1px solid rgba(255, 39, 57, .62);
    border-radius: 11px;
    background: rgba(72, 12, 22, .56);
    color: #ffb8c0;
    font-weight: 700;
}

.database-error-card p {
    margin: 0;
}

.database-manager-card {
    border-color: rgba(25, 220, 105, .42);
    background:
        radial-gradient(circle at 100% 0, rgba(25, 220, 105, .1), transparent 38%),
        var(--card);
}

.database-status {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid rgba(25, 220, 105, .46);
    border-radius: 999px;
    color: #51ed87;
    font: 700 11px "Oxanium", sans-serif;
    letter-spacing: .04em;
}

.database-status span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #19dc69;
    box-shadow: 0 0 12px rgba(25, 220, 105, .8);
}

.database-table-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 18px 0;
}

.database-table-list code {
    padding: 7px 10px;
    border: 1px solid #334052;
    border-radius: 9px;
    background: rgba(8, 13, 20, .72);
    color: #b9c9d9;
}

.database-admin-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.database-admin-actions small {
    line-height: 1.5;
}

footer {
    min-height: 112px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-top: 1px solid #29323c;
    color: #8ca0b4;
    text-align: center;
}

.footer-privacy-links {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 13px;
}

.footer-privacy-links a,
.footer-privacy-links button {
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    font: inherit;
    text-decoration: none;
}

.footer-privacy-links a:hover,
.footer-privacy-links button:hover {
    text-decoration: underline;
}

@media (max-width: 960px) {
    nav { gap: 12px; }
    nav a { font-size: 13px; }
    .feature-grid,
    .games-grid,
    .achievements-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
    .site-header { height: 74px; }
    .menu-toggle { display: inline-grid; place-items: center; }
    nav {
        position: absolute;
        top: 65px;
        right: 0;
        left: 0;
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 5px;
        padding: 16px;
        border: 1px solid var(--line);
        border-radius: 15px;
        background: rgba(15, 21, 31, .98);
        box-shadow: 0 20px 45px rgba(0, 0, 0, .45);
    }
    nav.open { display: flex; }
    nav a { min-height: 40px; padding: 0 10px; }
    nav .nav-action { margin-top: 4px; }
    .nav-logout-form,
    .nav-logout-form .nav-action { width: 100%; }
    main { padding-top: 42px; }
    .stats { grid-template-columns: repeat(2, 1fr); }
    .home-section { margin-top: 68px; }
    .home-bottom,
    .games-bottom,
    .profile-grid { grid-template-columns: 1fr; }
    .leaderboard-card { min-height: 270px; }
    .directory-heading { padding-right: 0; }
    .search-field { position: relative; bottom: auto; display: block; width: 100%; margin-top: 18px; }
    .three-stats { grid-template-columns: 1fr; }
    .user-role-row { grid-template-columns: 1fr 150px auto; }
    .user-role-identity { grid-column: 1 / -1; }
    .password-form { grid-template-columns: 1fr; }
    .cookie-banner { align-items: stretch; flex-direction: column; }
    .cookie-banner-actions { justify-content: flex-end; }
}

@media (max-width: 610px) {
    body { font-size: 14px; }
    .site-shell { width: min(100% - 22px, 1090px); }
    .ticker { border-radius: 10px; }
    .ticker-group { gap: 38px; padding-right: 38px; }
    main { padding: 34px 0 56px; }
    h1 { font-size: 36px; }
    .hero {
        min-height: 570px;
        padding: 36px 17px 38px;
        border-radius: 19px;
        background-position: center;
    }
    .hero-logo { width: 270px; margin-bottom: 22px; }
    .hero h1 { font-size: 45px; }
    .hero br { display: none; }
    .hero-actions { flex-direction: column; align-items: stretch; width: min(300px, 100%); margin: auto; }
    .stats,
    .feature-grid,
    .games-grid,
    .achievements-grid,
    .frequency-grid,
    .form-grid { grid-template-columns: 1fr; }
    .home-section { margin-top: 60px; }
    .feature-card { min-height: 150px; }
    .quick-links .card { min-height: 126px; }
    .page-heading { margin-bottom: 30px; }
    .game-card { min-height: 330px; }
    .favourite-row { grid-template-columns: 1fr; }
    .favourite-row button { width: 100%; }
    .streamer-card { grid-template-columns: auto 1fr; }
    .streamer-card .outline-button { grid-column: 1 / -1; }
    .form-card,
    .admin-card,
    .profile-form,
    .auth-card,
    .access-gate-card { padding: 21px; }
    .admin-wide-button { width: 100%; }
    .award-actions { flex-direction: column; }
    .admin-record-row { align-items: stretch; flex-direction: column; }
    .admin-record-actions { width: 100%; flex-direction: column; }
    .admin-record-actions form,
    .admin-record-actions button,
    .admin-record-row > form,
    .admin-record-row > form button { width: 100%; }
    .admin-card-heading { flex-direction: column; }
    .role-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .user-role-row { grid-template-columns: 1fr; }
    .user-role-identity { grid-column: auto; }
    .user-role-row .outline-button,
    .discord-admin-actions > * { width: 100%; }
    .database-admin-actions { align-items: stretch; flex-direction: column; }
    .database-admin-actions .gradient-button { width: 100%; }
    .score-table > div { grid-template-columns: 1fr auto; gap: 5px 12px; }
    .oauth-login-options,
    .cookie-policy-grid { grid-template-columns: 1fr; }
    .cookie-policy-card:first-child { grid-column: auto; }
    .connected-account-row { flex-wrap: wrap; }
    .connected-account-row .connection-status,
    .connected-account-row .outline-button { width: 100%; justify-content: center; text-align: center; }
    .cookie-banner { right: 11px; bottom: 11px; left: 11px; width: calc(100% - 22px); padding: 15px; }
    .cookie-banner-copy { align-items: flex-start; }
    .cookie-icon { width: 40px; height: 40px; font-size: 21px; }
    .cookie-banner-actions,
    .cookie-settings-actions { align-items: stretch; flex-direction: column; }
    .cookie-banner-actions > *,
    .cookie-settings-actions > * { width: 100%; }
    .cookie-settings-backdrop { padding: 11px; }
    .cookie-settings-card { padding: 23px 19px; }
    .cookie-table > div { grid-template-columns: 1fr; gap: 4px; }
    .cookie-table small { text-align: left; }
}

/* Zasebni chat, stiki in komentarji pod videi */
.message-link {
    position: relative;
}

.nav-unread-badge,
.unread-pill,
.request-count {
    display: inline-grid;
    min-width: 20px;
    height: 20px;
    place-items: center;
    padding: 0 6px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--red), #ff5b30);
    box-shadow: 0 0 14px rgba(255, 39, 57, .35);
    color: #fff;
    font: 700 11px/1 "Oxanium", sans-serif;
}

.chat-page-heading {
    margin-bottom: 26px;
}

.chat-shell {
    display: grid;
    grid-template-columns: 350px minmax(0, 1fr);
    min-height: 680px;
    padding: 0;
    overflow: hidden;
    background: rgba(12, 17, 25, .92);
}

.chat-sidebar {
    min-width: 0;
    padding: 21px 17px;
    border-right: 1px solid var(--line);
    background:
        radial-gradient(circle at 15% 0, rgba(0, 158, 255, .08), transparent 32%),
        rgba(8, 13, 20, .72);
}

.chat-sidebar-heading,
.chat-conversation-header,
.profile-video-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.chat-sidebar-heading {
    margin-bottom: 17px;
    padding: 0 3px;
}

.chat-sidebar-heading strong {
    display: block;
    margin-top: 2px;
    font: 700 19px/1.25 "Oxanium", sans-serif;
}

.chat-kicker {
    color: var(--muted);
    font: 700 10px/1 "Oxanium", sans-serif;
    letter-spacing: .12em;
}

.request-count {
    min-width: auto;
    height: 24px;
    background: rgba(24, 223, 75, .14);
    box-shadow: inset 0 0 0 1px rgba(24, 223, 75, .38);
    color: var(--green);
}

.people-search-form {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid #313b4a;
    border-radius: 13px;
    background: #171e29;
}

.people-search-form label {
    display: grid;
    place-items: center;
    color: #7f90a5;
}

.people-search-form .icon {
    width: 17px;
    height: 17px;
}

.people-search-form input {
    width: 100%;
    height: 43px;
    padding: 0 5px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #fff;
}

.people-search-form button {
    height: 43px;
    padding: 0 12px;
    border: 0;
    border-left: 1px solid #313b4a;
    background: transparent;
    color: var(--blue);
    cursor: pointer;
    font: 700 11px/1 "Oxanium", sans-serif;
}

.incoming-requests,
.chat-contact-section {
    margin-bottom: 18px;
}

.incoming-requests h2,
.chat-contact-section h2 {
    margin: 0 3px 9px;
    color: #8e9cad;
    font: 700 11px/1.2 "Oxanium", sans-serif;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.chat-contact-list,
.people-list,
.video-comment-list {
    display: grid;
    gap: 6px;
}

.chat-contact {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    min-height: 66px;
    padding: 8px 9px;
    border: 1px solid transparent;
    border-radius: 14px;
    color: inherit;
    text-decoration: none;
    transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.chat-contact:hover,
.chat-contact:focus-visible,
.chat-contact.is-active {
    border-color: rgba(0, 158, 255, .34);
    background: rgba(0, 158, 255, .09);
    transform: translateX(2px);
}

.chat-contact-copy {
    min-width: 0;
}

.chat-contact-copy strong,
.chat-contact-copy small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chat-contact-copy strong {
    margin-bottom: 3px;
    font: 700 14px/1.2 "Oxanium", sans-serif;
}

.chat-contact-copy small,
.chat-contact time {
    color: var(--muted);
    font-size: 12px;
}

.unread-pill {
    background: var(--blue);
    box-shadow: 0 0 14px rgba(0, 158, 255, .32);
}

.chat-avatar,
.comment-avatar {
    display: inline-grid;
    width: 43px;
    height: 43px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;
    box-shadow: inset 0 0 18px rgba(255, 255, 255, .04);
    color: #fff;
    font: 800 13px/1 "Oxanium", sans-serif;
}

.chat-avatar.is-large {
    width: 48px;
    height: 48px;
    font-size: 14px;
}

.avatar-tone-0 { background: linear-gradient(145deg, #ff3147, #6d1727); }
.avatar-tone-1 { background: linear-gradient(145deg, #008fff, #17426d); }
.avatar-tone-2 { background: linear-gradient(145deg, #15d74a, #15562b); }
.avatar-tone-3 { background: linear-gradient(145deg, #984bff, #3d2463); }
.avatar-tone-4 { background: linear-gradient(145deg, #ff9d21, #6d4117); }

.people-discovery {
    border-top: 1px solid var(--line);
    padding-top: 13px;
}

.people-discovery summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 4px;
    cursor: pointer;
    color: #dbe7f7;
    font: 700 13px/1.2 "Oxanium", sans-serif;
    list-style: none;
}

.people-discovery summary::-webkit-details-marker { display: none; }
.people-discovery summary span { color: var(--green); font-size: 20px; }
.people-discovery[open] summary span { transform: rotate(45deg); }

.people-list {
    margin-top: 5px;
}

.people-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 62px;
    padding: 8px;
    border-radius: 13px;
    background: rgba(255, 255, 255, .025);
}

.people-row.is-request {
    margin-bottom: 7px;
    border: 1px solid rgba(24, 223, 75, .18);
}

.people-identity {
    min-width: 0;
}

.people-identity strong,
.people-identity small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.people-identity strong { font: 700 13px/1.25 "Oxanium", sans-serif; }
.people-identity small { margin-top: 3px; color: var(--muted); font-size: 11px; }
.people-row .compact { min-height: 31px; padding: 0 10px; font-size: 10px; }
.people-action-form { margin: 0; }
.people-action-form .is-muted { color: #8997a8; }

.people-request-actions {
    display: flex;
    gap: 5px;
}

.people-request-actions form { margin: 0; }

.chat-empty-small {
    margin: 8px 4px 12px;
    color: var(--muted);
    font-size: 12px;
}

.chat-main {
    display: flex;
    min-width: 0;
    min-height: 680px;
    flex-direction: column;
    background:
        radial-gradient(circle at 85% 0, rgba(24, 223, 75, .07), transparent 34%),
        linear-gradient(180deg, rgba(19, 25, 35, .88), rgba(8, 13, 20, .96));
}

.chat-welcome {
    display: grid;
    width: min(420px, calc(100% - 40px));
    margin: auto;
    justify-items: center;
    text-align: center;
}

.chat-welcome-icon {
    display: grid;
    width: 82px;
    height: 82px;
    margin-bottom: 18px;
    place-items: center;
    border: 1px solid rgba(0, 158, 255, .35);
    border-radius: 50%;
    background: rgba(0, 158, 255, .08);
    box-shadow: 0 0 35px rgba(0, 158, 255, .12);
    color: var(--blue);
}

.chat-welcome-icon .icon { width: 36px; height: 36px; }
.chat-welcome h2 { margin: 0 0 8px; }
.chat-welcome p { margin: 0; color: var(--muted); }

.chat-conversation-header {
    min-height: 83px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--line);
    background: rgba(13, 18, 27, .82);
}

.chat-person {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 12px;
}

.chat-person h2 {
    margin: 0 0 3px;
    font-size: 18px;
}

.chat-person span {
    color: var(--muted);
    font-size: 12px;
}

.chat-remove-contact {
    padding: 7px 9px;
    border: 0;
    background: transparent;
    color: #718096;
    cursor: pointer;
    font: 700 10px/1 "Oxanium", sans-serif;
}

.chat-remove-contact:hover { color: var(--red); }
.chat-mobile-back { display: none; }

.chat-thread {
    display: flex;
    min-height: 0;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 5px;
    padding: 22px 22px 16px;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: #34465c transparent;
}

.chat-message {
    display: flex;
    max-width: min(72%, 520px);
    flex-direction: column;
}

.chat-message.is-mine {
    align-self: flex-end;
    align-items: flex-end;
}

.chat-message.is-theirs {
    align-self: flex-start;
    align-items: flex-start;
}

.chat-bubble {
    padding: 10px 13px;
    border: 1px solid #303b4a;
    border-radius: 16px 16px 16px 5px;
    background: #1d2632;
    box-shadow: 0 5px 13px rgba(0, 0, 0, .12);
}

.chat-message.is-mine .chat-bubble {
    border-color: rgba(0, 158, 255, .42);
    border-radius: 16px 16px 5px 16px;
    background: linear-gradient(135deg, #006eae, #005185);
}

.chat-bubble p {
    margin: 0;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
    color: #f5f8fc;
    line-height: 1.38;
}

.chat-message time {
    margin: 3px 5px 6px;
    color: #708095;
    font-size: 10px;
}

.chat-first-message {
    display: grid;
    margin: auto;
    justify-items: center;
    color: var(--muted);
    text-align: center;
}

.chat-first-message > span { margin-bottom: 6px; font-size: 30px; }
.chat-first-message strong { color: #fff; font: 700 17px/1.2 "Oxanium", sans-serif; }
.chat-first-message p { margin: 7px 0; }

.chat-composer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    padding: 14px 18px 8px;
    border-top: 1px solid var(--line);
    background: rgba(11, 16, 24, .95);
}

.chat-composer textarea {
    width: 100%;
    min-height: 44px;
    max-height: 120px;
    resize: vertical;
    padding: 11px 14px;
    border: 1px solid #344154;
    border-radius: 14px;
    outline: 0;
    background: #1b2330;
    color: #fff;
}

.chat-composer textarea:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(0, 158, 255, .1);
}

.chat-composer button { align-self: end; min-height: 44px; }

.chat-live-status {
    padding: 0 20px 10px;
    background: rgba(11, 16, 24, .95);
    color: #65758a;
    font-size: 10px;
    text-align: right;
}

.profile-video-section {
    margin-top: 24px;
    padding-top: 21px;
    border-top: 1px solid #2b3645;
    scroll-margin-top: 24px;
}

.profile-video-heading {
    margin-bottom: 12px;
}

.profile-video-heading h3 {
    margin: 3px 0 0;
}

.video-comment-total {
    padding: 5px 9px;
    border: 1px solid rgba(0, 158, 255, .25);
    border-radius: 999px;
    color: #9fcff1;
    font-size: 11px;
}

.profile-video-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 92px;
    padding: 15px 17px;
    border: 1px solid rgba(0, 158, 255, .24);
    border-radius: 15px;
    background:
        linear-gradient(100deg, rgba(255, 39, 57, .09), transparent 35%),
        linear-gradient(135deg, #151e2a, #101721);
    color: inherit;
    text-decoration: none;
    transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.profile-video-card:hover,
.profile-video-card:focus-visible {
    border-color: rgba(0, 158, 255, .58);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .24);
    transform: translateY(-2px);
}

.profile-video-play {
    display: grid;
    width: 50px;
    height: 50px;
    place-items: center;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--red), #ff6b2d);
    box-shadow: 0 0 22px rgba(255, 39, 57, .27);
    color: #fff;
    font-size: 18px;
}

.profile-video-card strong,
.profile-video-card small {
    display: block;
}

.profile-video-card strong { font: 800 14px/1.2 "Oxanium", sans-serif; }
.profile-video-card small { margin-top: 5px; color: var(--muted); }
.profile-video-card > b { color: var(--blue); font-size: 22px; }

.video-comment-list {
    margin-top: 15px;
}

.video-comment {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
    padding: 11px 2px;
    border-bottom: 1px solid rgba(45, 57, 72, .68);
}

.comment-avatar {
    width: 35px;
    height: 35px;
    background: linear-gradient(145deg, #26374b, #111923);
    font-size: 11px;
}

.video-comment-copy { min-width: 0; }

.video-comment-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}

.video-comment-meta strong { font: 700 12px/1.2 "Oxanium", sans-serif; }
.video-comment-meta .role-badge { padding: 2px 6px; font-size: 8px; }
.video-comment-meta time { color: #718096; font-size: 10px; }
.video-comment-copy p { margin: 5px 0 0; overflow-wrap: anywhere; color: #dce5ef; }
.video-comments-empty { margin: 4px 0; color: var(--muted); }

.comment-delete-button {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #69778a;
    cursor: pointer;
    font-size: 19px;
}

.comment-delete-button:hover { background: rgba(255, 39, 57, .1); color: var(--red); }

.video-comment-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 10px;
    margin-top: 14px;
}

.video-comment-form textarea {
    width: 100%;
    min-height: 47px;
    resize: vertical;
    padding: 11px 13px;
    border: 1px solid #354255;
    border-radius: 13px;
    background: #171f2a;
    color: #fff;
}

.video-comment-login {
    margin: 14px 0 0;
    color: var(--muted);
}

.video-comment-login a { color: var(--blue); }

@media (max-width: 920px) {
    .chat-shell { grid-template-columns: 310px minmax(0, 1fr); }
    .chat-sidebar { padding-right: 13px; padding-left: 13px; }
}

@media (max-width: 700px) {
    .chat-shell { grid-template-columns: 1fr; min-height: 600px; }
    .chat-sidebar { border-right: 0; }
    .chat-main { min-height: 600px; border-top: 1px solid var(--line); }
    .chat-shell.has-conversation .chat-sidebar { display: none; }
    .chat-shell.has-conversation .chat-main { border-top: 0; }
    .chat-mobile-back {
        display: inline-grid;
        width: 36px;
        height: 36px;
        place-items: center;
        border: 1px solid var(--line);
        border-radius: 50%;
        color: #fff;
        text-decoration: none;
        font-size: 20px;
    }
    .chat-message { max-width: 86%; }
    .chat-thread { padding: 18px 13px 12px; }
    .chat-conversation-header { padding: 12px 13px; }
    .chat-remove-contact { display: none; }
    .chat-composer { padding: 11px 11px 7px; }
    .chat-live-status { padding-right: 13px; }
}

@media (max-width: 520px) {
    .people-row { grid-template-columns: auto minmax(0, 1fr); }
    .people-row > .people-action-form,
    .people-row > .people-request-actions,
    .people-row > .gradient-button {
        grid-column: 1 / -1;
        width: 100%;
    }
    .people-row > .gradient-button,
    .people-row > .people-action-form button { width: 100%; }
    .people-request-actions form,
    .people-request-actions button { flex: 1; width: 100%; }
    .profile-video-heading { align-items: flex-start; flex-direction: column; }
    .profile-video-card { grid-template-columns: auto minmax(0, 1fr); }
    .profile-video-card > b { display: none; }
    .video-comment-form { grid-template-columns: 1fr; }
    .video-comment-form button { width: 100%; }
    .video-comment { grid-template-columns: auto minmax(0, 1fr); }
    .video-comment > form { grid-column: 2; justify-self: end; }
    .chat-composer { grid-template-columns: 1fr; }
    .chat-composer button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}

/* Napredne STRIMER.SI funkcije */
.management-grid,.partner-grid,.music-list{display:grid;gap:16px}.management-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.management-entity{gap:18px}.manager-add-form,.server-control .form-card{display:grid;gap:12px;margin-top:14px}.permission-grid{display:flex;flex-wrap:wrap;gap:8px}.permission-grid .choice-chip{position:relative}.server-control{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}.server-control summary{cursor:pointer;font:700 14px "Oxanium",sans-serif}.server-command-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}.music-admin-row,.music-track{display:grid;grid-template-columns:minmax(180px,1fr) minmax(260px,2fr) auto;align-items:center;gap:15px;padding:16px 18px}.music-track{border:1px solid var(--line);border-radius:13px;background:rgba(7,12,19,.5)}.music-track>div,.music-admin-row>div{display:flex;flex-direction:column}.music-track audio,.music-admin-row audio{width:100%}.profile-music{margin-top:22px}.profile-music h3{margin-bottom:12px}.creator-advanced{position:relative;isolation:isolate;margin-top:18px;padding:18px;border:1px solid var(--line);border-radius:14px;overflow:hidden}.creator-advanced::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--profile-bg,none) center/cover no-repeat;opacity:.16}.creator-advanced::after{content:"";position:absolute;inset:0;z-index:-1;background:rgba(8,13,20,.88)}.creator-advanced.theme-light{color:#111;background:#eef3f8}.creator-advanced.theme-light::after{background:rgba(238,243,248,.88)}.creator-advanced.theme-light p{color:#344}.creator-advanced.theme-blue{box-shadow:inset 0 0 40px rgba(0,158,255,.14)}.creator-advanced.theme-yellow{box-shadow:inset 0 0 40px rgba(255,210,74,.13)}.creator-advanced.theme-purple{box-shadow:inset 0 0 40px rgba(135,92,255,.16)}.creator-advanced.theme-neon{border-color:#00d9d9;box-shadow:0 0 24px rgba(0,217,217,.12)}.partner-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:24px}.partner-card{padding:22px;text-decoration:none;transition:transform .18s ease,border-color .18s ease}.partner-card:hover{transform:translateY(-2px);border-color:var(--blue)}.partner-card h3{margin:12px 0 8px}.stream-activity-card{margin-top:20px}.management-entity .form-grid{grid-template-columns:1fr 1fr}
@media(max-width:850px){.management-grid,.partner-grid{grid-template-columns:1fr}.music-admin-row,.music-track{grid-template-columns:1fr}.management-entity .form-grid{grid-template-columns:1fr}}

/* ===== LIVE / engagement dodatki ===== */
.engagement-block{margin-top:18px;padding:18px;border:1px solid #29374a;border-radius:14px;background:rgba(7,13,21,.58)}
.channel-grid,.clip-grid,.recommend-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.channel-card,.clip-card{display:flex;flex-direction:column;gap:7px;padding:14px;border:1px solid #2b3a4f;border-radius:13px;background:#0d1520;text-decoration:none}.channel-card.is-live{border-color:#ff4052;box-shadow:0 0 18px rgba(255,64,82,.15)}.channel-card span{color:#9fb0c5}.live-hero-card{display:grid;grid-template-columns:220px 1fr;gap:16px;margin-top:18px;padding:14px;border:1px solid #ff4052;border-radius:16px;background:rgba(42,9,16,.6);text-decoration:none}.live-hero-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:11px}.clip-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:9px}.poll-option{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin:8px 0}.poll-option form,.poll-option button{width:100%}.poll-option button{padding:10px 12px;border:1px solid #34465e;border-radius:10px;background:#111b28;color:#fff;cursor:pointer;text-align:left}.event-countdown{display:flex;justify-content:space-between;gap:16px;margin-top:16px;padding:14px 16px;border:1px solid rgba(255,186,73,.4);border-radius:13px;background:rgba(255,186,73,.06)}.countdown-value{color:#ffcf64;font-weight:700}.server-status-row{display:flex;align-items:center;gap:10px}.server-status-dot{width:10px;height:10px;border-radius:50%;background:#7b8797}.server-status-dot.online{background:#22df61;box-shadow:0 0 12px rgba(34,223,97,.7)}.whitelist-box{margin-top:14px}.notification-center-list{display:grid;gap:9px;margin-top:15px}.notification-center-item{display:flex;justify-content:space-between;gap:12px;padding:12px;border:1px solid #29384a;border-radius:12px;background:rgba(8,13,20,.45)}.notification-center-item.is-unread{border-color:#00a7ff;background:rgba(0,158,255,.06)}.notification-center-item p{margin:4px 0}.engagement-editor{margin-top:22px}.engagement-editor>.form-card{padding:18px;border:1px solid #2b394d;border-radius:13px;background:rgba(8,13,20,.4)}
@media(max-width:760px){.channel-grid,.clip-grid,.recommend-grid{grid-template-columns:1fr}.live-hero-card{grid-template-columns:1fr}.event-countdown{flex-direction:column}}

/* V6 chat: slike/memi in glasovna sporočila */
.chat-bubble {
    max-width: min(520px, 78vw);
}
.chat-bubble:has(.chat-attachment-image),
.chat-bubble:has(.chat-voice-player) {
    padding: 8px;
}
.chat-bubble p + .chat-attachment-image-link,
.chat-bubble p + .chat-voice-player {
    margin-top: 8px;
}
.chat-attachment-image-link { display:block; }
.chat-attachment-image {
    display:block;
    width:min(360px, 66vw);
    max-height:420px;
    object-fit:contain;
    border-radius:12px;
    background:#0b1017;
}
.chat-voice-player {
    display:block;
    width:min(320px, 66vw);
    max-width:100%;
}
.chat-composer {
    grid-template-columns:auto auto minmax(0, 1fr) auto;
    align-items:end;
}
.chat-file-input {
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    min-height:0 !important;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
}
.chat-media-button {
    width:44px;
    height:44px;
    min-height:44px !important;
    display:grid;
    place-items:center;
    padding:0 !important;
    border:1px solid #344154;
    border-radius:13px;
    background:#1b2330;
    color:#fff;
    cursor:pointer;
    font-size:19px;
}
.chat-media-button:hover { border-color:var(--blue); }
.chat-record-button.is-recording {
    border-color:#ff4052;
    box-shadow:0 0 0 3px rgba(255,64,82,.12), 0 0 20px rgba(255,64,82,.18);
}
.chat-attachment-name {
    grid-column:3 / 5;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#86d6ff;
    font-size:11px;
}
@media(max-width:700px){
    .chat-composer { grid-template-columns:auto auto 1fr; }
    .chat-composer > .gradient-button { grid-column:1 / -1; width:100%; }
    .chat-attachment-name { grid-column:1 / -1; }
}

/* V6: stari Home ostane zgoraj, nove sekcije se začnejo šele spodaj. */
.home-v6-first-extra { margin-top:96px; }
.home-v6-compact-features { grid-template-columns:1fr; }

/* V7 — bolj urejen spodnji del domače strani */
.home-v6-first-extra{margin-top:88px;padding-top:54px;border-top:1px solid rgba(126,151,181,.18)}
.home-v6-first-extra .home-live-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.home-v5-split{align-items:start;gap:28px}
.home-v5-split>.home-v5-section{min-width:0}
.home-v6-compact-features{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px}
.home-v6-compact-features article{min-height:160px;display:flex;flex-direction:column;justify-content:center}
.home-featured-list{grid-template-columns:1fr}
.home-featured-row{width:100%;min-height:76px}
.home-server-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.home-events-notifications{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr)}
.home-event-row,.home-notification-row,.home-v5-empty{width:100%}
.home-v5-section-heading{padding-bottom:10px;border-bottom:1px solid rgba(126,151,181,.12)}
.home-live-card,.home-server-card,.home-event-row,.home-notification-row,.home-featured-row,.home-v6-compact-features article{box-shadow:0 14px 35px rgba(0,0,0,.13)}
@media(max-width:980px){
 .home-v6-first-extra .home-live-grid,.home-server-grid{grid-template-columns:1fr 1fr}
 .home-v5-split,.home-events-notifications{grid-template-columns:1fr}
 .home-v5-split>.home-v5-section{margin-top:52px}
}
@media(max-width:700px){
 .home-v6-first-extra{margin-top:64px;padding-top:38px}
 .home-v6-first-extra .home-live-grid,.home-server-grid,.home-v6-compact-features{grid-template-columns:1fr!important}
}

/* V7 — voice recorder status */
.chat-record-button:disabled{opacity:.7;cursor:wait}
.chat-record-button.is-recording{animation:voicePulse 1.15s ease-in-out infinite}
@keyframes voicePulse{50%{transform:scale(1.06);box-shadow:0 0 0 6px rgba(255,64,82,.08),0 0 24px rgba(255,64,82,.25)}}


/* V8 — bolj zračen in širši spodnji Home */
.home-extras-wide{
    width:min(1340px, calc(100vw - 56px));
    margin:0 0 0 50%;
    transform:translateX(-50%);
}
.home-extras-wide .home-v5-section{margin-top:96px}
.home-extras-wide .home-v6-first-extra{margin-top:108px;padding-top:68px}
.home-extras-wide .home-v5-section-heading{margin-bottom:30px;padding-bottom:16px}
.home-extras-wide .home-live-grid{gap:26px}
.home-extras-wide .home-live-card{border-radius:18px}
.home-extras-wide .home-live-copy{padding:24px}
.home-extras-wide .home-live-copy h3{font-size:20px;margin:12px 0 9px}
.home-extras-wide .home-v5-split{gap:36px}
.home-extras-wide .home-v5-split>.home-v5-section{margin-top:96px}
.home-extras-wide .home-featured-list{gap:14px}
.home-extras-wide .home-featured-row{min-height:92px;padding:18px 20px;border-radius:15px}
.home-extras-wide .home-v6-compact-features{gap:20px!important}
.home-extras-wide .home-v6-compact-features article{min-height:190px;padding:28px!important;border-radius:18px}
.home-extras-wide .home-v6-compact-features article>span{font-size:34px}
.home-extras-wide .home-server-grid{gap:22px}
.home-extras-wide .home-server-card{min-height:245px;padding:26px;border-radius:18px}
.home-extras-wide .home-event-list,.home-extras-wide .home-notification-list{gap:15px}
.home-extras-wide .home-event-row,.home-extras-wide .home-notification-row{padding:20px;border-radius:15px}
.home-extras-wide .home-events-notifications{gap:38px}
.home-extras-wide .partner-grid{gap:22px}
@media(max-width:1100px){
    .home-extras-wide{width:min(100%, calc(100vw - 34px))}
    .home-extras-wide .home-v5-split,.home-extras-wide .home-events-notifications{grid-template-columns:1fr}
    .home-extras-wide .home-v5-split>.home-v5-section{margin-top:72px}
}
@media(max-width:760px){
    .home-extras-wide{width:100%;margin-left:0;transform:none}
    .home-extras-wide .home-v5-section{margin-top:66px}
    .home-extras-wide .home-v6-first-extra{margin-top:70px;padding-top:42px}
    .home-extras-wide .home-v5-split>.home-v5-section{margin-top:60px}
    .home-extras-wide .home-v6-compact-features article{min-height:150px}
}

/* V8 — jasen status snemanja glasu */
.chat-live-status{min-height:22px;display:block;margin-top:7px}
.chat-record-button.is-recording{background:rgba(255,64,82,.16);color:#ff8a98}

/* V9: skupinski chat, voice in glasovni klici */
.chat-group-section { margin-top: 18px; padding-top: 14px; border-top: 1px solid #283444; }
.chat-section-title { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.chat-section-title h2 { margin:0 0 10px; font-size:15px; }
.chat-section-title span { min-width:25px; height:25px; display:grid; place-items:center; border-radius:999px; background:#1b2633; color:#8fd8ff; font-weight:700; }
.group-contact .group-avatar, .group-avatar { background:linear-gradient(135deg,#24314a,#172231); border-color:#6b6ff6; }
.group-create { margin-top:12px; border-top:1px solid #283444; padding-top:12px; }
.group-create summary { cursor:pointer; color:#58c8ff; font:700 12px "Oxanium",sans-serif; }
.group-create-form { display:grid; gap:12px; margin-top:12px; padding:12px; border:1px solid #2b3849; border-radius:12px; background:rgba(7,12,19,.45); }
.group-member-picker { display:grid; gap:7px; max-height:180px; overflow:auto; }
.group-member-picker label { display:flex; align-items:center; gap:9px; padding:8px 9px; border-radius:9px; background:#111a25; cursor:pointer; }
.group-member-picker input { width:18px; min-height:18px; margin:0; }
.group-members-panel { padding:12px 18px; border-bottom:1px solid #283444; background:rgba(10,16,24,.88); }
.group-members-list { display:flex; flex-wrap:wrap; gap:8px; }
.group-members-list span { padding:6px 9px; border:1px solid #324156; border-radius:999px; color:#b8c7d9; }
.group-add-member-form { display:flex; gap:8px; margin-top:12px; }
.group-add-member-form select { margin:0; }
.chat-group-info-button, .call-button { min-height:38px; padding:0 13px; border:1px solid #3a4a60; border-radius:11px; background:#111923; color:#fff; cursor:pointer; font:700 11px "Oxanium",sans-serif; }
.call-button { border-color:#25d56f; color:#62f99d; box-shadow:0 0 18px rgba(37,213,111,.10); }
.chat-header-actions { display:flex; align-items:center; gap:8px; }
.group-message-sender { display:block; margin:0 0 3px 8px; color:#7fcaff; font-weight:700; }

.call-layer { position:fixed; inset:0; z-index:2500; display:grid; place-items:center; padding:20px; background:rgba(2,6,11,.76); backdrop-filter:blur(9px); }
.call-card { width:min(420px,100%); padding:30px; text-align:center; box-shadow:0 30px 90px rgba(0,0,0,.65),0 0 40px rgba(0,158,255,.15); }
.call-card h2 { margin:4px 0 8px; }
.call-card p { margin-bottom:18px; }
.call-avatar { width:76px; height:76px; display:grid; place-items:center; margin:0 auto 14px; border-radius:50%; border:1px solid #2fd87b; background:#111d27; font-size:32px; box-shadow:0 0 30px rgba(47,216,123,.18); }
.call-actions { display:flex; justify-content:center; gap:10px; }
.chat-record-button.is-recording { background:#6d1422 !important; border-color:#ff4054 !important; animation:voicePulse 1s ease-in-out infinite; }
@keyframes voicePulse { 50% { transform:scale(1.08); box-shadow:0 0 22px rgba(255,64,84,.45); } }

@media(max-width:700px){
  .chat-header-actions{gap:5px}.call-button{font-size:0;width:40px;padding:0}.call-button::before{content:"📞";font-size:16px}.group-add-member-form{flex-direction:column}
}


/* V10: bolj jasen snemalnik glasovnih sporočil + video klic */
.voice-recording-panel {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 6px 10px;
    border: 1px solid rgba(255, 64, 84, .42);
    border-radius: 12px;
    background: rgba(86, 14, 28, .36);
    white-space: nowrap;
}
.voice-recording-panel[hidden] { display: none !important; }
.voice-recording-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #ff4054;
    box-shadow: 0 0 14px rgba(255,64,84,.8);
    animation: voicePulseDot 1s ease-in-out infinite;
}
.voice-recording-panel strong { min-width: 36px; font-family:"Oxanium",sans-serif; }
.voice-recording-panel button {
    min-height: 30px;
    padding: 0 9px;
    border: 1px solid #3b4657;
    border-radius: 9px;
    background: #131c27;
    color: #fff;
    cursor: pointer;
    font: 700 10px "Oxanium",sans-serif;
}
.voice-recording-panel button[data-voice-send] { border-color: rgba(24,223,75,.65); color:#5df28a; }
.voice-recording-panel button:disabled { opacity:.4; cursor:not-allowed; }
@keyframes voicePulseDot { 50% { opacity:.35; transform:scale(.72); } }

.video-call-button { border-color:#7a6cff; color:#a89dff; }
.call-card { width:min(760px,100%); }
.call-video-stage {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    margin: 16px 0 20px;
    overflow: hidden;
    border: 1px solid #344054;
    border-radius: 18px;
    background:#05080d;
    box-shadow: inset 0 0 45px rgba(0,0,0,.55);
}
.call-video-stage[hidden] { display:none !important; }
.call-video-stage > video[data-call-remote-video] {
    width:100%; height:100%; object-fit:cover; display:block; background:#05080d;
}
.call-local-video {
    position:absolute;
    right:14px;
    bottom:14px;
    width:min(28%,180px);
    aspect-ratio: 4 / 3;
    object-fit:cover;
    border:2px solid rgba(255,255,255,.72);
    border-radius:13px;
    background:#111;
    box-shadow:0 8px 30px rgba(0,0,0,.5);
}
@media(max-width:700px){
    .chat-header-actions .video-call-button{font-size:0;width:40px;padding:0}.chat-header-actions .video-call-button::before{content:"🎥";font-size:16px}
    .voice-recording-panel { position:absolute; left:8px; right:8px; bottom:66px; justify-content:center; z-index:5; }
    .call-card{padding:18px}.call-video-stage{border-radius:13px}.call-local-video{right:8px;bottom:8px;width:30%}
}


/* V11: dekorativno neon/gaming ozadje ob levem in desnem robu */
body::before,
body::after {
    content: "";
    position: fixed;
    top: 0;
    bottom: 0;
    width: clamp(70px, 10vw, 180px);
    z-index: 0;
    pointer-events: none;
    opacity: .72;
}
body::before {
    left: 0;
    background:
        radial-gradient(circle at 18% 18%, rgba(255, 45, 83, .30) 0 2px, transparent 3px),
        radial-gradient(circle at 55% 42%, rgba(255, 174, 0, .18), transparent 24%),
        linear-gradient(90deg, rgba(255, 35, 74, .16), transparent 76%);
    filter: blur(.15px);
}
body::after {
    right: 0;
    background:
        radial-gradient(circle at 78% 25%, rgba(0, 210, 255, .30) 0 2px, transparent 3px),
        radial-gradient(circle at 48% 70%, rgba(0, 255, 153, .17), transparent 25%),
        linear-gradient(270deg, rgba(0, 145, 255, .18), transparent 76%);
}
.site-shell { position: relative; z-index: 1; }
@media (max-width: 760px) {
    body::before, body::after { width: 42px; opacity: .38; }
}


/* V12 dodatne mini igre */
.aim-arena{position:relative;height:210px;border:1px solid #29394d;border-radius:16px;background:radial-gradient(circle at center,rgba(0,220,255,.08),#0b111a);overflow:hidden}.aim-arena button{position:absolute;width:42px;height:42px;border:5px solid #ff4055;border-radius:50%;background:#ffd43b;box-shadow:0 0 18px rgba(255,64,85,.55);cursor:crosshair}.typing-prompt{min-height:64px;padding:12px;border-radius:12px;background:#0b111a;color:#dbe7f6}.typing-card textarea{width:100%;resize:none}.color-word{display:block;margin:32px 0;font:800 38px "Oxanium",sans-serif;text-align:center}.color-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.color-buttons button,.snake-controls button,.ttt-board button{min-height:44px;border:1px solid #30445c;border-radius:10px;background:#0b111a;color:#fff;cursor:pointer}.snake-card canvas{display:block;width:100%;max-width:300px;height:auto;margin:0 auto;border:1px solid #30445c;border-radius:12px}.snake-controls{display:grid;justify-content:center;gap:4px;margin-top:8px}.snake-controls>button{width:48px;margin:auto}.snake-controls span{display:flex;gap:4px}.snake-controls span button{width:48px}.ttt-board{display:grid;grid-template-columns:repeat(3,72px);justify-content:center;gap:7px;margin:22px auto}.ttt-board button{height:72px;font:800 28px "Oxanium",sans-serif}.aim-card,.typing-card,.color-card,.snake-card,.ttt-card{min-height:390px}

/* Online 1v1 Game Center */
.online-duel-panel{margin:0 0 34px;padding:28px;display:grid;gap:22px}.online-duel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:22px}.online-duel-heading h2{margin-bottom:8px}.online-duel-heading p{max-width:680px;margin-bottom:0}.duel-invites{display:grid;gap:10px;padding:16px;border:1px solid #334154;border-radius:14px;background:rgba(8,13,20,.5)}.duel-invites h3{margin:0 0 4px}.duel-invites article{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px;border:1px solid #2c3746;border-radius:12px;background:#111822}.duel-invites article>div{display:flex;gap:8px}.duel-invites form{margin:0}.online-duel-game{display:grid;justify-items:center;gap:18px;padding:22px;border:1px solid #2e3b4d;border-radius:18px;background:radial-gradient(circle at 50% 0,rgba(0,158,255,.10),transparent 42%),rgba(7,12,19,.58)}.duel-players{width:min(520px,100%);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px}.duel-players>span:not(.duel-vs){padding:12px 14px;border:1px solid #344154;border-radius:13px;background:#111822;text-align:center}.duel-player-x b{color:#ff5265}.duel-player-o b{color:#41bfff}.duel-vs{color:#7f8b9d;font:700 12px "Oxanium",sans-serif}.duel-status{min-height:24px;margin:0;color:#e8eef6;font-weight:700;text-align:center}.online-ttt-board{width:min(330px,86vw)}.online-ttt-board button{font-size:38px}.online-ttt-board button:disabled{cursor:default;opacity:1}.duel-footer{width:min(520px,100%);display:flex;align-items:center;justify-content:space-between;gap:14px;color:#aeb9c8}.duel-footer form{margin:0}.duel-empty{min-height:150px;display:grid;place-items:center;align-content:center;text-align:center}.duel-empty>span{font-size:35px}.duel-empty strong{margin-top:8px}.duel-empty p{margin:4px 0 0}.chat-duel-form{margin:0}.chat-duel-button{border-color:rgba(24,223,75,.45)!important;color:#72f597!important}
@media(max-width:700px){.online-duel-panel{padding:19px}.online-duel-heading{flex-direction:column}.duel-invites article{align-items:flex-start;flex-direction:column}.duel-footer{align-items:flex-start;flex-direction:column}.duel-players{grid-template-columns:1fr}.duel-vs{text-align:center}}

/* V15: matchmaking, ekipe, voice sobe in AI */
.v15-match-card{max-width:760px;margin:0 auto;padding:42px;text-align:center}.v15-big-icon{font-size:60px;margin-bottom:14px}.v15-team-create{margin-bottom:26px}.v15-team-create summary{cursor:pointer;font:700 15px "Oxanium",sans-serif}.v15-team-create form{display:grid;gap:14px;margin-top:18px}.v15-team-grid,.v15-room-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.v15-team-card,.v15-room-card{padding:24px}.v15-team-card>img{width:74px;height:74px;object-fit:cover;border-radius:18px}.v15-team-logo,.v15-room-icon{width:74px;height:74px;display:grid;place-items:center;border-radius:18px;background:#172131;font-size:34px;margin-bottom:15px}.v15-room-card .gradient-button,.v15-room-card .outline-button{margin-right:8px}.v15-room-members{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}.v15-room-members span{padding:5px 9px;border:1px solid #334154;border-radius:999px;font-size:12px}.v15-ai{max-width:860px;margin:0 auto;padding:30px;display:grid;gap:16px}.v15-ai textarea{min-height:190px}.chat-typing-status{min-height:20px;color:#58c8ff;font-weight:700}.message-reaction-bar{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.message-reaction-button{border:1px solid #334052;background:#131b27;color:#fff;border-radius:999px;padding:3px 8px;cursor:pointer}.message-reaction-button.is-mine{border-color:#18df4b;background:rgba(24,223,75,.1)}.message-tools{display:flex;gap:6px;margin-top:5px}.message-tools button{border:0;background:transparent;color:#8292a7;cursor:pointer;font-size:12px}.pinned-messages{margin:0 16px 12px;padding:12px 14px;border:1px solid rgba(255,210,74,.35);border-radius:12px;background:rgba(255,210,74,.05)}.screen-share-button{border-color:#00d9d9!important}.report-user-box{padding:16px;margin:14px;border-top:1px solid #283140}.report-user-box form{display:grid;gap:9px}@media(max-width:900px){.v15-team-grid,.v15-room-grid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.v15-team-grid,.v15-room-grid{grid-template-columns:1fr}.v15-match-card{padding:25px}}
.chat-seen{display:block;margin-top:3px;color:#6f8298;font-size:11px;text-align:right}

/* V17 — centered cyber layout inspired by the approved STRIMER.SI mockup */
:root{--shell-wide:1240px;--cyber-pink:#ff167d;--cyber-purple:#7b2cff;--cyber-cyan:#00c8ff}
body{
 background:
 radial-gradient(circle at 4% 48%,rgba(255,0,105,.16),transparent 25%),
 radial-gradient(circle at 96% 50%,rgba(0,157,255,.18),transparent 27%),
 radial-gradient(circle at 50% 100%,rgba(0,220,150,.08),transparent 30%),
 linear-gradient(90deg,#160912 0%,#080b12 26%,#070b12 74%,#04182a 100%);
 overflow-x:hidden;
}
body::before,body::after{width:clamp(120px,14vw,250px);opacity:1;filter:none}
body::before{background:radial-gradient(circle at 22% 30%,rgba(255,25,121,.9) 0 1px,transparent 2px),radial-gradient(circle at 65% 72%,rgba(255,60,50,.45) 0 1px,transparent 2px),linear-gradient(90deg,rgba(255,0,92,.12),transparent 75%);box-shadow:inset 5px 0 40px rgba(255,0,110,.12)}
body::after{background:radial-gradient(circle at 76% 25%,rgba(0,205,255,.9) 0 1px,transparent 2px),radial-gradient(circle at 38% 70%,rgba(0,120,255,.5) 0 1px,transparent 2px),linear-gradient(270deg,rgba(0,145,255,.15),transparent 75%);box-shadow:inset -5px 0 40px rgba(0,170,255,.14)}
.site-shell{width:min(var(--shell-wide),calc(100% - 40px));margin-inline:auto}
.site-header{height:auto;min-height:88px;margin-top:18px;padding:14px 20px;border:1px solid rgba(111,125,151,.28);border-radius:18px;background:rgba(5,9,15,.78);backdrop-filter:blur(18px);display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;align-items:center;box-shadow:0 18px 60px rgba(0,0,0,.25)}
.brand{width:auto;height:auto;overflow:visible;border-radius:0;box-shadow:none;text-decoration:none}
.brand img{width:105px;height:44px;object-fit:contain}
nav{justify-content:center;gap:10px;flex-wrap:wrap}
nav a{font-size:12px;padding:7px 3px}
.nav-logout-form{margin:0}.nav-action{min-height:36px}
.ticker{margin-top:12px;border:1px solid rgba(111,125,151,.24);border-radius:15px;background:rgba(7,11,18,.78);overflow:hidden}
main{padding-top:36px}
.page-heading{text-align:center;max-width:900px;margin:0 auto 34px}.page-heading h1{font-size:clamp(34px,4vw,48px)}
.card{background:linear-gradient(145deg,rgba(16,23,34,.94),rgba(8,13,21,.96));border-color:#2b3748}
.rainbow-card{position:relative;border:1px solid transparent;background:linear-gradient(#0c121b,#0c121b) padding-box,linear-gradient(110deg,var(--cyber-pink),#ff9e19,#21dc63,var(--cyber-cyan)) border-box}
.profile-settings-heading{margin-top:12px}
.profile-settings-layout{display:grid;grid-template-columns:230px minmax(0,1fr);max-width:1120px;margin:0 auto 36px;border:1px solid transparent;border-radius:20px;background:linear-gradient(#070c13,#070c13) padding-box,linear-gradient(110deg,var(--cyber-pink),#f0b11c,#21dc63,var(--cyber-cyan)) border-box;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.38)}
.profile-settings-sidebar{padding:28px 18px;border-right:1px solid #202a38;background:rgba(5,9,15,.92);display:flex;flex-direction:column;gap:8px}
.settings-side-title{padding:0 10px 10px;color:#dc8cff;font:700 13px 'Oxanium',sans-serif;letter-spacing:.06em}
.settings-side-link{display:block;padding:12px 13px;border-radius:9px;text-decoration:none;color:#d8dfeb;font-weight:700;transition:.18s ease}.settings-side-link:hover,.settings-side-link.active{color:#fff;background:linear-gradient(100deg,#7a28e9,#39218b);box-shadow:0 8px 24px rgba(114,35,255,.22)}
.settings-premium-card{margin-top:auto;padding:16px;border:1px solid rgba(133,55,255,.28);border-radius:12px;background:linear-gradient(145deg,rgba(60,17,97,.22),rgba(11,12,22,.8))}.settings-premium-card strong{color:#e5a3ff;font-size:12px}.settings-premium-card p{font-size:13px;color:#c0c9d7}
.profile-settings-content{min-width:0;padding:26px;background:radial-gradient(circle at 100% 0,rgba(0,170,255,.05),transparent 35%)}
.profile-settings-content .settings-main-card{margin:0 0 24px;padding:0;border:0;background:transparent;box-shadow:none}.profile-settings-content .settings-main-card:last-child{margin-bottom:0}.profile-settings-content .settings-main-card>h2{margin:0 0 22px;font-size:22px}.profile-settings-content label{font-weight:700}.profile-settings-content input,.profile-settings-content textarea,.profile-settings-content select{margin-top:7px;border:1px solid #344153;background:#151d29;border-radius:10px;min-height:44px;padding:11px 14px}.profile-settings-content textarea{min-height:92px}.profile-settings-content .gradient-button{justify-self:end}
#server-form{max-width:1120px;margin:34px auto}
@media(max-width:1100px){.site-header{grid-template-columns:1fr}.brand{text-align:center}.brand img{margin:auto}nav{justify-content:center}.profile-settings-layout{grid-template-columns:200px minmax(0,1fr)}}
@media(max-width:780px){.site-shell{width:min(100% - 20px,var(--shell-wide))}.site-header{padding:12px}.profile-settings-layout{grid-template-columns:1fr}.profile-settings-sidebar{border-right:0;border-bottom:1px solid #202a38}.settings-premium-card{display:none}.profile-settings-content{padding:18px}.form-grid{grid-template-columns:1fr!important}body::before,body::after{width:50px;opacity:.5}}

/* V18: Premium je brezplačen za vse */
.settings-free-card{border-color:rgba(0,220,255,.42);box-shadow:0 0 28px rgba(123,47,255,.12),inset 0 0 25px rgba(0,217,255,.04)}
.settings-free-card strong{background:linear-gradient(90deg,#ffd64a,#ff38c7,#00dcff);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.premium-free-badge{display:flex!important;justify-content:center;cursor:default;pointer-events:none;text-align:center}

/* V19 — full cyber background + boxed profile editor matching approved mockup */
body{
    background:
        radial-gradient(ellipse at 0% 35%, rgba(255,0,102,.22), transparent 28%),
        radial-gradient(ellipse at 100% 38%, rgba(0,160,255,.24), transparent 30%),
        radial-gradient(ellipse at 50% 105%, rgba(0,220,180,.08), transparent 34%),
        linear-gradient(90deg,#11070e 0%,#070b12 27%,#050911 73%,#031526 100%) !important;
    background-attachment:fixed !important;
}
body::before,body::after{
    top:0!important;bottom:0!important;height:100vh!important;position:fixed!important;
    width:clamp(90px,11vw,185px)!important;border-radius:0!important;filter:none!important;
    opacity:1!important;pointer-events:none!important;background-size:100% 100%, 38px 38px, 100% 100%!important;
}
body::before{
    left:0!important;
    background:
        linear-gradient(90deg,rgba(255,0,92,.20),transparent 92%),
        radial-gradient(circle at 24% 18%,rgba(255,50,150,.65) 0 1px,transparent 2px),
        linear-gradient(90deg,transparent 16%,rgba(255,20,110,.95) 17%,rgba(255,20,110,.22) 19%,transparent 23%)!important;
    box-shadow:inset 18px 0 80px rgba(255,0,92,.22), 28px 0 80px rgba(255,0,92,.07)!important;
}
body::after{
    right:0!important;
    background:
        linear-gradient(270deg,rgba(0,155,255,.22),transparent 92%),
        radial-gradient(circle at 74% 22%,rgba(0,215,255,.75) 0 1px,transparent 2px),
        linear-gradient(270deg,transparent 16%,rgba(0,200,255,.98) 17%,rgba(0,200,255,.22) 19%,transparent 23%)!important;
    box-shadow:inset -18px 0 80px rgba(0,160,255,.22), -28px 0 80px rgba(0,160,255,.07)!important;
}
.site-shell{position:relative;z-index:1;width:min(1260px,calc(100% - 42px))!important;margin-inline:auto!important}
.site-header{width:100%;grid-template-columns:150px minmax(0,1fr)!important;margin-inline:auto!important}
nav{justify-content:center!important}
.ticker{width:100%;margin-inline:auto!important}
.page-heading{max-width:980px!important;margin-inline:auto!important}

.profile-settings-layout-v19{grid-template-columns:220px minmax(0,1fr)!important;max-width:1160px!important;background:rgba(3,8,15,.88)!important;backdrop-filter:blur(16px);}
.profile-settings-content-v19{padding:18px!important;background:linear-gradient(145deg,rgba(8,13,22,.70),rgba(2,8,15,.82))!important}
.settings-profile-form{display:grid;gap:14px;margin:0 0 18px}
.settings-profile-form-secondary{padding-top:4px;border-top:1px solid rgba(82,99,126,.22)}
.settings-box{min-width:0;padding:18px;border:1px solid rgba(62,79,104,.78);border-radius:14px;background:linear-gradient(145deg,rgba(15,22,33,.95),rgba(7,12,20,.96));box-shadow:0 14px 35px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.015)}
.settings-box:hover{border-color:rgba(76,111,150,.92)}
.settings-box-wide{padding:20px}
.settings-box-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.settings-box-heading h2,.settings-box-heading h3,.settings-box h3{margin:3px 0 0}
.settings-box-kicker{color:#c8d3e1;font:700 11px "Oxanium",sans-serif;letter-spacing:.055em}
.settings-box-icon{width:37px;height:37px;display:grid;place-items:center;border:1px solid #33475e;border-radius:11px;background:#0d1723;font-size:18px}
.settings-basic-grid{display:grid;grid-template-columns:minmax(210px,.72fr) minmax(0,1.55fr);gap:16px;align-items:start}
.settings-bio-field textarea{min-height:112px!important}
.settings-grid-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.settings-grid-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.compact-grid{gap:10px}
.mini-settings-box{padding:15px}.mini-settings-box textarea{min-height:128px!important}
.settings-clean-label{display:block;margin:0}.settings-clean-label textarea{margin-top:0!important}
.settings-profile-form input,.settings-profile-form textarea,.settings-profile-form select,.server-settings-form input,.server-settings-form textarea,.server-settings-form select{border:1px solid #344153!important;background:linear-gradient(180deg,#151d29,#111824)!important;box-shadow:inset 0 1px 2px rgba(0,0,0,.2)}
.settings-profile-form input:focus,.settings-profile-form textarea:focus,.settings-profile-form select:focus{border-color:#00bfff!important;box-shadow:0 0 0 3px rgba(0,190,255,.08),0 0 20px rgba(0,190,255,.06)!important}
.settings-save-row{display:flex;justify-content:flex-end;gap:10px;padding:5px 0 8px}.settings-save-row .gradient-button{min-width:220px}
.profile-media-box{overflow:hidden}.profile-media-preview{position:relative;min-height:170px;margin:8px 0 15px;border:1px solid #334359;border-radius:13px;background:radial-gradient(circle at 30% 40%,rgba(255,0,126,.22),transparent 38%),radial-gradient(circle at 80% 45%,rgba(0,180,255,.24),transparent 40%),linear-gradient(110deg,#130914,#071323);background-position:center;background-size:cover;display:flex;align-items:center;justify-content:center;overflow:hidden}.profile-media-preview::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,7,13,.12),rgba(3,7,13,.48));pointer-events:none}.profile-media-preview>strong{position:relative;z-index:2;font:800 25px "Oxanium",sans-serif}.profile-avatar-preview{position:absolute;z-index:3;left:24px;bottom:20px;width:78px;height:78px;border:3px solid transparent;border-radius:50%;background:linear-gradient(#111924,#111924) padding-box,linear-gradient(135deg,#ff1685,#8d45ff,#00cfff) border-box;display:grid;place-items:center;overflow:hidden;box-shadow:0 8px 30px rgba(0,0,0,.45)}.profile-avatar-preview img{width:100%;height:100%;object-fit:cover}.profile-avatar-preview span{font:800 26px "Oxanium",sans-serif}
.settings-premium-card{margin-top:auto}.premium-free-mini{display:block;margin-top:10px;padding:8px 10px;border:1px solid rgba(0,214,255,.36);border-radius:9px;color:#6deaff;font:700 10px "Oxanium",sans-serif;text-align:center;background:rgba(0,190,255,.06)}
.engagement-editor{margin:16px 0 0!important;padding:18px!important;border-radius:14px!important}.engagement-editor>h2{font-size:20px!important}.engagement-editor .form-card{padding:16px!important;border:1px solid #2d3c50;border-radius:12px;background:rgba(9,15,24,.72)}
.server-editor-shell{max-width:1160px;margin:34px auto 0;padding:20px;border:1px solid transparent;border-radius:20px;background:linear-gradient(#070c13,#070c13) padding-box,linear-gradient(110deg,#ff1685,#ff9d20,#20dc68,#00c8ff) border-box;box-shadow:0 30px 80px rgba(0,0,0,.28)}.server-editor-heading{padding:0 4px 12px}.server-settings-form{display:grid;gap:14px}
/* No standalone Premium card on the right side — premium remains free in the sidebar only. */
.profile-settings-content-v19 .premium-panel,.profile-settings-content-v19 .premium-card,.profile-settings-content-v19 .premium-user-card{display:none!important}

@media(max-width:1100px){.settings-grid-four{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-basic-grid{grid-template-columns:1fr}.profile-settings-layout-v19{grid-template-columns:190px minmax(0,1fr)!important}}
@media(max-width:800px){body::before,body::after{width:45px!important;opacity:.38!important}.profile-settings-layout-v19{grid-template-columns:1fr!important}.profile-settings-sidebar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-right:0!important;border-bottom:1px solid #202a38}.settings-side-title,.settings-premium-card{grid-column:1/-1}.settings-grid-two,.settings-grid-four{grid-template-columns:1fr}.settings-media-grid{grid-template-columns:1fr}.profile-settings-content-v19{padding:12px!important}.settings-save-row{flex-direction:column}.settings-save-row .gradient-button,.settings-save-row .outline-button{width:100%}.site-shell{width:min(100% - 18px,1260px)!important}}
@media(max-width:520px){.profile-settings-sidebar{grid-template-columns:1fr}.settings-box{padding:14px}.profile-media-preview{min-height:135px}.profile-avatar-preview{width:66px;height:66px;left:15px;bottom:14px}}

/* V20 — reference layout: no Premium, configurable full-site background, compact dashboard */
body {
    background-image:
        linear-gradient(90deg, rgba(12,2,10,.72) 0%, rgba(3,8,15,.54) 28%, rgba(3,8,15,.52) 72%, rgba(0,13,26,.70) 100%),
        var(--custom-site-bg, linear-gradient(90deg,#160510 0%,#050912 36%,#04101c 72%,#00172b 100%)) !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}
body::before,
body::after {
    width: clamp(72px, 8vw, 135px) !important;
    opacity: .96 !important;
}
body::before {
    background:
        radial-gradient(circle at 28% 12%, rgba(255,35,142,.9) 0 1px, transparent 2px),
        linear-gradient(90deg, rgba(255,0,89,.20), transparent 88%),
        linear-gradient(90deg, transparent 35%, rgba(255,14,118,.92) 36%, rgba(255,14,118,.13) 39%, transparent 44%) !important;
    box-shadow: inset 22px 0 85px rgba(255,0,98,.18), 32px 0 80px rgba(255,0,98,.08) !important;
}
body::after {
    background:
        radial-gradient(circle at 72% 16%, rgba(0,214,255,.9) 0 1px, transparent 2px),
        linear-gradient(270deg, rgba(0,151,255,.22), transparent 88%),
        linear-gradient(270deg, transparent 35%, rgba(0,205,255,.96) 36%, rgba(0,205,255,.14) 39%, transparent 44%) !important;
    box-shadow: inset -22px 0 85px rgba(0,160,255,.20), -32px 0 80px rgba(0,160,255,.08) !important;
}
.site-shell { width:min(1370px, calc(100% - 52px)) !important; }
.site-header {
    min-height:72px;height:auto!important;margin-top:12px;padding:10px 15px!important;
    border:1px solid rgba(55,77,105,.60);border-radius:16px;
    background:rgba(3,8,15,.84);backdrop-filter:blur(14px);
    box-shadow:0 15px 44px rgba(0,0,0,.22);
}
.site-header .brand { width:96px;height:42px;background:transparent;box-shadow:none;display:flex;align-items:center; }
.site-header .brand img { object-fit:contain; }
nav { gap:14px!important; }
nav a { font-size:12px!important; }
.ticker { margin-top:10px;border:1px solid rgba(49,70,96,.58);background:rgba(5,10,17,.82)!important; }
main { padding-top:34px!important; }
.v20-settings-heading { text-align:center;max-width:none!important;margin-bottom:24px!important; }
.v20-settings-heading h1 { font-size:clamp(34px,4vw,48px); }
.v20-settings-heading p { margin:8px 0 0; }

.profile-settings-layout-v20 {
    display:grid;grid-template-columns:245px minmax(0,1fr);max-width:1220px;margin:0 auto 30px;
    border:1px solid transparent;border-radius:18px;overflow:hidden;
    background:linear-gradient(rgba(4,9,16,.94),rgba(4,9,16,.94)) padding-box,
               linear-gradient(115deg,#ff147c,#a54cff 25%,#1cc7ff 70%,#00a9ff) border-box;
    box-shadow:0 28px 75px rgba(0,0,0,.36),0 0 38px rgba(0,147,255,.08);
}
.v20-settings-sidebar { min-height:100%;padding:20px 15px;border-right:1px solid rgba(49,66,91,.65);background:rgba(5,9,16,.90); }
.v20-settings-sidebar .settings-side-title { margin-bottom:10px; }
.v20-settings-sidebar .settings-side-link { padding:11px 12px;border-radius:9px;font-size:12px; }
.v20-settings-sidebar .settings-side-link.active { background:linear-gradient(90deg,#762de1,#391f8e);box-shadow:0 0 22px rgba(118,45,225,.28); }
.profile-settings-content-v20 { min-width:0;padding:14px;background:linear-gradient(145deg,rgba(7,13,22,.83),rgba(2,8,15,.88)); }
.v20-profile-form { gap:12px; }
.v20-profile-form .settings-box { padding:15px;border-radius:12px;background:linear-gradient(145deg,rgba(12,19,30,.96),rgba(7,12,20,.96)); }
.v20-profile-form .settings-box-kicker { display:block;margin-bottom:10px;color:#e5ebf5;font-size:11px; }
.v20-profile-form label { font-size:12px; }
.v20-profile-form input,.v20-profile-form textarea,.v20-profile-form select { min-height:40px!important;padding:9px 12px!important;margin-top:6px!important;border-radius:8px!important; }
.v20-profile-form textarea { min-height:86px!important; }
.v20-top-grid { display:grid;grid-template-columns:minmax(0,.94fr) minmax(390px,1.15fr);gap:12px; }
.v20-basic-box textarea { min-height:112px!important; }
.v20-media-box { overflow:hidden; }
.v20-profile-media { min-height:164px;margin:0 0 12px; }
.v20-profile-media>strong { font-size:22px;letter-spacing:.02em; }
.v20-upload-actions { display:flex;justify-content:flex-end;gap:9px; }
.v20-file-button { position:relative;overflow:hidden;cursor:pointer; }
.v20-file-button input[type=file] { position:absolute;inset:0;opacity:0;cursor:pointer;margin:0!important; }
.v20-url-details { margin-top:10px;padding:10px;border:1px solid #2b394b;border-radius:9px;background:rgba(5,9,15,.45); }
.v20-url-details summary { cursor:pointer;color:#aebbd0;font-weight:700; }
.v20-remove-row { display:flex;flex-wrap:wrap;gap:14px;margin-top:9px;color:#aab6c7; }
.v20-remove-row label { display:flex;align-items:center;gap:7px;font-weight:600; }
.v20-remove-row input[type=checkbox] { width:18px;min-height:18px;margin:0!important; }
.v20-mid-grid { display:grid;grid-template-columns:1.35fr .78fr .78fr;gap:12px; }
.v20-mid-grid textarea { min-height:118px!important; }
.v20-bottom-grid { display:grid;grid-template-columns:1.2fr .9fr .9fr;gap:12px; }
.v20-bottom-grid textarea { min-height:115px!important; }
.v20-theme-tiles { display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:6px 0 12px; }
.v20-theme-tiles span { aspect-ratio:1;border-radius:7px;background:#060b12;box-shadow:inset 0 0 15px rgba(0,0,0,.55); }
.theme-cyan { border:2px solid #00d9ff;box-shadow:0 0 14px rgba(0,217,255,.35)!important; }
.theme-pink { border:2px solid #ff166f;box-shadow:0 0 14px rgba(255,22,111,.32)!important; }
.theme-orange { border:2px solid #ff8a19;box-shadow:0 0 14px rgba(255,138,25,.32)!important; }
.theme-rainbow { border:2px solid transparent!important;background:linear-gradient(#060b12,#060b12) padding-box,linear-gradient(135deg,#ff1c85,#ff9d18,#29e469,#00cbff) border-box!important; }
.v20-extra-grid { gap:12px; }
.v20-save-row { padding-top:3px!important; }
.v20-save-row .gradient-button { min-width:210px; }
.v20-site-appearance-form { margin-top:12px; }
.v20-site-preview,.v20-logo-preview { min-height:145px;display:grid;place-items:center;border:1px solid #34465d;border-radius:12px;background:radial-gradient(circle at 20% 30%,rgba(255,0,115,.18),transparent 32%),radial-gradient(circle at 80% 35%,rgba(0,185,255,.20),transparent 34%),#08101a;background-size:cover;background-position:center;overflow:hidden; }
.v20-site-preview strong { padding:8px 12px;border-radius:8px;background:rgba(0,0,0,.58); }
.v20-logo-preview img { max-width:80%;max-height:120px;object-fit:contain; }
.v20-server-details { max-width:1220px!important;padding:0!important;overflow:hidden; }
.v20-server-details>summary { cursor:pointer;padding:18px 20px;font:700 15px "Oxanium",sans-serif; }
.v20-server-details[open]>summary { border-bottom:1px solid #2d3c50; }
.v20-server-details .server-settings-form { padding:18px; }
/* Premium UI is intentionally removed. */
.settings-premium-card,.premium-panel,.premium-card,.premium-user-card { display:none!important; }

/* Home logo can now be changed from Izgled strani. */
.page-domov .hero-logo { width:min(360px,72vw);max-height:230px;object-fit:contain;background:rgba(2,7,12,.20); }

@media(max-width:1120px){
    .profile-settings-layout-v20{grid-template-columns:205px minmax(0,1fr)}
    .v20-top-grid,.v20-mid-grid,.v20-bottom-grid{grid-template-columns:1fr 1fr}
    .v20-mid-grid>section:first-child,.v20-bottom-grid>section:first-child{grid-column:1/-1}
}
@media(max-width:820px){
    .site-shell{width:min(100% - 18px,1370px)!important}
    .profile-settings-layout-v20{grid-template-columns:1fr}
    .v20-settings-sidebar{display:flex;overflow:auto;border-right:0;border-bottom:1px solid #263548;padding:10px;gap:7px}
    .v20-settings-sidebar .settings-side-title{display:none}.v20-settings-sidebar .settings-side-link{flex:0 0 auto;white-space:nowrap}
    .v20-top-grid,.v20-mid-grid,.v20-bottom-grid,.v20-extra-grid{grid-template-columns:1fr}
    .v20-mid-grid>section:first-child,.v20-bottom-grid>section:first-child{grid-column:auto}
    .profile-settings-content-v20{padding:10px}.v20-upload-actions{justify-content:stretch;flex-direction:column}.v20-upload-actions>*{width:100%}
}


/* V21 FIX — uporabnikovo pravo PNG ozadje na VSEH straneh */
html { background:#02050b !important; }
body {
    background-color:#02050b !important;
    background-image:
        linear-gradient(90deg, rgba(2,3,8,.08) 0%, rgba(2,5,12,.12) 24%, rgba(2,5,12,.16) 50%, rgba(2,5,12,.12) 76%, rgba(2,3,8,.08) 100%),
        var(--custom-site-bg, url("site-background.webp")) !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
}
/* Slika že vsebuje roza/modre neon robove, zato starih CSS robov ne rišemo čez njo. */
body::before, body::after { display:none !important; }
.site-shell { position:relative; z-index:1; }
.site-header,.ticker,.card,.settings-box,.profile-settings-layout-v19,.server-editor-shell {
    backdrop-filter: blur(10px);
}
@media (max-width: 900px) {
    body { background-size:auto 100vh !important; background-position:center top !important; }
}

/* V23 — zanesljivo globalno PNG ozadje. Slika je v isti /assets mapi kot CSS. */
html,
body {
    min-height: 100%;
    background: #02050b !important;
}
body {
    position: relative;
    isolation: isolate;
}
.site-global-background {
    position: fixed;
    inset: 0;
    z-index: -2;
    display: block !important;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background: #02050b url("site-background.webp") center center / cover no-repeat;
    transform: translateZ(0);
}
.site-global-overlay {
    position: fixed;
    inset: 0;
    z-index: -1;
    display: block !important;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(2,5,11,.08), rgba(2,5,11,.16)),
        radial-gradient(ellipse at 50% 25%, rgba(1,5,12,.10), rgba(1,5,12,.30) 72%);
}
/* Stari pseudo robovi ne smejo prekriti pravega ozadja. */
body::before,
body::after { display: none !important; }
.site-shell,
.access-gate-shell { position: relative; z-index: 1; }
/* Kartice naj pokažejo malo ozadja skozi sebe. */
.site-header,
.ticker,
.card,
.settings-box,
.profile-settings-layout-v20,
.server-editor-shell {
    background-color: rgba(5,10,18,.86);
}

/* Profilna slika/banner: bolj jasen upload UI + live preview. */
.v20-file-button { min-width: 150px; }
.v20-upload-state {
    margin: 10px 0 0;
    color: #8fe7ff;
    font-weight: 700;
    font-size: 12px;
    text-align: right;
}
.profile-media-preview.has-local-preview::after { background: linear-gradient(180deg,rgba(3,7,13,.05),rgba(3,7,13,.28)); }
@media (max-width: 900px) {
    .site-global-background { background-size: auto 100vh; background-position: center top; }
}


/* V24 — bolj čista zgornja navigacija in dashboard postavitev na Domov */
.site-header-v24{
    min-height:0!important;
    padding:12px 18px 14px!important;
    display:block!important;
    border-radius:20px!important;
    background:linear-gradient(180deg,rgba(4,9,16,.92),rgba(4,9,16,.82))!important;
    box-shadow:0 18px 55px rgba(0,0,0,.30),inset 0 1px rgba(255,255,255,.025)!important;
}
.site-header-v24 .header-brand-row{position:relative;min-height:48px;display:flex;align-items:center;justify-content:center}
.site-header-v24 .brand{display:flex!important;align-items:center;justify-content:center;width:auto!important;height:46px!important}
.site-header-v24 .brand img{width:118px!important;height:46px!important;object-fit:contain!important}
.site-header-v24 #main-navigation{width:100%;display:grid!important;gap:9px!important}
.site-header-v24 .nav-primary{display:flex;align-items:center;justify-content:center;gap:12px;min-width:0;white-space:nowrap}
.site-header-v24 .nav-primary a{padding:6px 1px;font-size:11.5px;color:#b7c4d4}
.site-header-v24 .nav-primary a.active{color:#24e567}
.site-header-v24 .nav-account{display:flex;align-items:center;justify-content:center;gap:12px;min-height:39px;padding-top:8px;border-top:1px solid rgba(91,113,140,.17)}
.site-header-v24 .nav-account a{font-size:12px}
.site-header-v24 .nav-account .nav-action{min-height:36px!important}
.site-header-v24 .menu-toggle{position:absolute;right:0;top:4px}
.ticker{min-height:38px;height:38px!important;margin-top:10px!important;border-radius:13px!important;background:rgba(5,10,17,.88)!important;box-shadow:0 10px 35px rgba(0,0,0,.18)}
.ticker-group{gap:64px!important;padding-left:30px!important;padding-right:64px!important}

/* Domača stran: spodnji deli kot urejen dashboard namesto dolgih praznih pasov */
.home-extras-wide{width:100%!important;margin:52px auto 0!important;transform:none!important}
.home-extras-wide .home-v5-section{
    margin-top:24px!important;
    padding:28px!important;
    border:1px solid rgba(59,82,111,.62);
    border-radius:22px;
    background:linear-gradient(145deg,rgba(12,19,29,.90),rgba(6,12,20,.92));
    box-shadow:0 22px 62px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.02);
    backdrop-filter:blur(8px);
}
.home-extras-wide .home-v6-first-extra{margin-top:0!important;padding-top:28px!important}
.home-extras-wide .home-v5-split{gap:22px!important;margin-top:22px!important;align-items:stretch!important}
.home-extras-wide .home-v5-split>.home-v5-section{margin-top:0!important;height:100%}
.home-extras-wide .home-v5-section-heading{align-items:center!important;margin-bottom:22px!important;padding-bottom:16px!important;border-bottom:1px solid rgba(102,132,167,.18)!important}
.home-extras-wide .home-v5-section-heading h2{margin:3px 0 0!important;font-size:clamp(25px,2.2vw,33px)}
.home-extras-wide .home-v5-section-heading .eyebrow{font-size:11px}
.home-extras-wide .home-live-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px!important}
.home-extras-wide .home-live-card{display:grid!important;grid-template-columns:minmax(220px,42%) minmax(0,1fr);min-height:245px;border-radius:17px!important;overflow:hidden}
.home-extras-wide .home-live-media{height:100%!important;min-height:245px;aspect-ratio:auto!important}
.home-extras-wide .home-live-copy{display:flex;flex-direction:column;justify-content:center;padding:24px!important}
.home-extras-wide .home-live-copy .profile-actions{margin-top:18px}
.home-extras-wide .home-featured-list{gap:12px!important}
.home-extras-wide .home-featured-row{min-height:82px!important;padding:16px 18px!important;border-radius:14px!important}
.home-extras-wide .home-v6-compact-features{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important}
.home-extras-wide .home-v6-compact-features article{min-height:150px!important;padding:22px!important;border-radius:15px!important;justify-content:flex-start!important}
.home-extras-wide .home-v6-compact-features article>span{font-size:30px!important}
.home-extras-wide .home-server-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important}
.home-extras-wide .home-server-card{min-height:210px!important;padding:22px!important;border-radius:16px!important}
.home-extras-wide .home-events-notifications{gap:22px!important;margin-top:22px!important}
.home-extras-wide .home-event-list,.home-extras-wide .home-notification-list{gap:12px!important}
.home-extras-wide .home-event-row,.home-extras-wide .home-notification-row{padding:16px!important;border-radius:14px!important}
.home-extras-wide .home-v5-empty{min-height:92px;display:flex;flex-direction:column;justify-content:center;border-radius:14px}
.home-extras-wide .partner-grid{gap:18px!important}

@media(max-width:1180px){
    .site-header-v24 .nav-primary{gap:9px;overflow-x:auto;justify-content:flex-start;padding:0 4px 4px;scrollbar-width:none}
    .site-header-v24 .nav-primary::-webkit-scrollbar{display:none}
    .home-extras-wide .home-live-card{grid-template-columns:1fr}
    .home-extras-wide .home-live-media{min-height:210px;aspect-ratio:16/9!important}
}
@media(max-width:820px){
    .site-header-v24 .header-brand-row{justify-content:flex-start}
    .site-header-v24 .brand img{width:104px!important}
    .site-header-v24 #main-navigation{display:none!important;padding-top:10px}
    .site-header-v24 #main-navigation.open{display:grid!important}
    .site-header-v24 .nav-primary,.site-header-v24 .nav-account{flex-direction:column;align-items:stretch;overflow:visible;white-space:normal}
    .site-header-v24 .nav-primary a,.site-header-v24 .nav-account a,.site-header-v24 .nav-account form,.site-header-v24 .nav-account button{width:100%;justify-content:center;text-align:center}
    .home-extras-wide .home-v5-split,.home-extras-wide .home-events-notifications{grid-template-columns:1fr!important}
    .home-extras-wide .home-live-grid,.home-extras-wide .home-server-grid{grid-template-columns:1fr!important}
    .home-extras-wide .home-v6-compact-features{grid-template-columns:1fr!important}
}
@media(max-width:560px){
    .home-extras-wide .home-v5-section{padding:20px!important;border-radius:17px}
    .home-extras-wide .home-v5-section-heading{align-items:flex-start!important}
    .home-extras-wide .home-v5-section-heading .text-link{margin-top:8px}
}

/* ===== V17: funkcije 31–40 ===== */
.v17-playlist-grid,.v17-news-grid,.v17-suggestion-grid,.v17-offer-grid,.v17-schedule-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;margin:22px 0 34px}.v17-playlist,.v17-news-card,.v17-suggestion-grid>.card,.v17-offer-grid>.card,.v17-schedule-grid>.card{background:rgba(7,12,22,.88);backdrop-filter:blur(12px)}.v17-card-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.v17-playlist-track,.v17-mini-track{display:grid;grid-template-columns:minmax(140px,1fr) 1fr auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid rgba(255,255,255,.08)}.v17-playlist-track audio,.v17-mini-track audio{width:100%;min-width:130px}.v17-playlist-track span,.v17-mini-track span{display:flex;flex-direction:column}.v17-add-track{display:flex;gap:10px;margin-top:14px}.v17-add-track select{flex:1}.v17-news-card{overflow:hidden;padding:0!important}.v17-news-card>img{width:100%;aspect-ratio:16/7;object-fit:cover}.v17-news-card>div{padding:22px}.v17-news-card time{float:right;opacity:.65}.v17-news-editor{margin-bottom:22px}.v17-news-editor summary{cursor:pointer;font-weight:800}.v17-builder{max-width:1100px;margin:0 auto}.v17-builder-grid{display:grid;grid-template-columns:1.3fr 2fr 1fr 1fr;gap:18px}.v17-sort-list{display:grid;gap:10px}.v17-sort-list button{cursor:grab;text-align:left;padding:14px;border:1px solid rgba(0,200,255,.25);background:#111925;color:#fff;border-radius:12px}.v17-sort-list button.is-dragging{opacity:.45}.v17-theme-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.v17-theme-choice input{position:absolute;opacity:0}.v17-theme-choice span{display:block;padding:18px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);cursor:pointer;text-align:center;font-weight:800}.v17-theme-choice input:checked+span{outline:2px solid #00d5ff;box-shadow:0 0 24px rgba(0,213,255,.28)}.theme-matrix span{background:linear-gradient(135deg,#06120a,#063b16)}.theme-fire span{background:linear-gradient(135deg,#210708,#7f2700)}.theme-galaxy span{background:linear-gradient(135deg,#100829,#0b3972)}.theme-snow span{background:linear-gradient(135deg,#162433,#47789f)}.theme-minecraft span{background:linear-gradient(135deg,#132312,#385f27)}.theme-cyberpunk span{background:linear-gradient(135deg,#27002a,#00355f)}.v17-discord-grid{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:18px}.v17-mini-schedule{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}.v17-mini-schedule span{padding:11px;border:1px solid rgba(255,255,255,.09);border-radius:10px;display:grid}.v17-public-builder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}.v17-profile-block{min-width:0}.v17-discord-profile{display:flex!important;align-items:center;justify-content:space-between;margin-top:16px;text-decoration:none}.v17-status-form{display:flex;gap:8px;margin-top:12px}.v17-partner-center{margin-top:28px}.v17-offer-grid{margin-top:18px}
.creator-profile-v4.v17-theme-matrix{box-shadow:0 0 45px rgba(0,255,70,.16)}.creator-profile-v4.v17-theme-fire{box-shadow:0 0 45px rgba(255,70,0,.2)}.creator-profile-v4.v17-theme-galaxy{box-shadow:0 0 48px rgba(125,70,255,.22)}.creator-profile-v4.v17-theme-snow{box-shadow:0 0 45px rgba(170,225,255,.18)}.creator-profile-v4.v17-theme-minecraft{box-shadow:0 0 45px rgba(80,180,70,.18)}.creator-profile-v4.v17-theme-cyberpunk{box-shadow:0 0 55px rgba(255,0,190,.18),0 0 55px rgba(0,190,255,.12)}
.creator-profile-v4[class*="v17-theme-"] .creator-cover{position:relative;overflow:hidden}.creator-profile-v4.v17-theme-matrix .creator-cover::after{content:"010101 110010 001011 101001";position:absolute;inset:0;color:rgba(0,255,90,.16);font:700 18px/2 monospace;letter-spacing:10px;animation:v17matrix 8s linear infinite;pointer-events:none}.creator-profile-v4.v17-theme-fire .creator-cover::after{content:"";position:absolute;inset:auto 0 0;height:45%;background:radial-gradient(ellipse at bottom,rgba(255,80,0,.45),transparent 65%);animation:v17pulse 2s ease-in-out infinite}.creator-profile-v4.v17-theme-galaxy .creator-cover::after{content:"✦  ·  ✧  ·  ✦  ·  ✧";position:absolute;inset:0;color:rgba(190,210,255,.35);font-size:26px;letter-spacing:34px;animation:v17float 8s linear infinite}.creator-profile-v4.v17-theme-snow .creator-cover::after{content:"❄  ❅  ❆  ❄  ❅";position:absolute;inset:0;color:rgba(255,255,255,.35);font-size:22px;letter-spacing:45px;animation:v17snow 7s linear infinite}.creator-profile-v4.v17-theme-cyberpunk .creator-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 35%,rgba(255,0,190,.18) 48%,rgba(0,220,255,.18) 52%,transparent 65%);animation:v17scan 4s linear infinite}.creator-profile-v4.v17-theme-minecraft .creator-cover::after{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(60,140,50,.12) 50%,transparent 50%),linear-gradient(rgba(60,140,50,.12) 50%,transparent 50%);background-size:48px 48px}
.creator-avatar-wrap.v17-frame-neon .creator-avatar-v4{box-shadow:0 0 0 4px #ff00bf,0 0 0 8px #00d9ff,0 0 30px #00d9ff}.creator-avatar-wrap.v17-frame-fire .creator-avatar-v4{box-shadow:0 0 0 5px #ff6a00,0 0 28px #ff3200}.creator-avatar-wrap.v17-frame-ice .creator-avatar-v4{box-shadow:0 0 0 5px #bceeff,0 0 30px #30cfff}.creator-avatar-wrap.v17-frame-gold .creator-avatar-v4{box-shadow:0 0 0 5px #ffd55c,0 0 30px #ffb400}.creator-avatar-wrap.v17-frame-galaxy .creator-avatar-v4{box-shadow:0 0 0 4px #8b5cff,0 0 0 8px #18d9ff,0 0 32px #ba5cff}.creator-cover.v17-banner-neon{outline:2px solid #00d9ff;box-shadow:inset 0 0 40px rgba(255,0,190,.12)}.creator-cover.v17-banner-fire{outline:2px solid #ff5a00}.creator-cover.v17-banner-ice{outline:2px solid #7fe9ff}.creator-cover.v17-banner-gold{outline:2px solid #ffd55c}.creator-cover.v17-banner-galaxy{outline:2px solid #9d6cff}
@keyframes v17matrix{from{transform:translateY(-30%)}to{transform:translateY(30%)}}@keyframes v17pulse{50%{opacity:.45;transform:scaleY(1.2)}}@keyframes v17float{from{transform:translateX(-15%)}to{transform:translateX(15%)}}@keyframes v17snow{from{transform:translateY(-20%)}to{transform:translateY(30%)}}@keyframes v17scan{from{transform:translateX(-80%)}to{transform:translateX(80%)}}
@media(max-width:900px){.v17-builder-grid,.v17-discord-grid{grid-template-columns:1fr}.v17-public-builder{grid-template-columns:1fr}.v17-playlist-track,.v17-mini-track{grid-template-columns:1fr}.v17-add-track{flex-direction:column}}

/* V28 footer - širok footer po referenčni postavitvi */
.site-footer{
    min-height:0;
    width:100%;
    margin-top:54px;
    padding:0;
    display:block;
    border-top:1px solid rgba(111,139,176,.18);
    background:linear-gradient(180deg,rgba(3,7,13,.90),rgba(2,5,10,.98));
    color:#9eabb9;
    text-align:left;
}
.site-footer-grid{
    width:min(1460px,calc(100% - 56px));
    margin:0 auto;
    padding:34px 0 30px;
    display:grid;
    grid-template-columns:1.45fr repeat(3,.8fr) 1.15fr;
    gap:46px;
    align-items:start;
}
.site-footer-brand p{margin:14px 0 7px;color:#b9c3cf;font-size:13px}.site-footer-brand small{display:block;max-width:290px;line-height:1.55;color:#748292}
.site-footer-logo{display:inline-flex;align-items:center;gap:10px;color:#f7f9fc;text-decoration:none;font-size:25px;font-style:italic}.site-footer-logo-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;font-style:normal;font-size:16px;color:#fff;background:conic-gradient(#ff304c,#ff9b2f,#32e36c,#00b8ff,#6b5cff,#ff304c);box-shadow:0 0 22px rgba(0,184,255,.18)}
.site-footer-column{display:flex;flex-direction:column;align-items:flex-start;gap:7px}.site-footer-column h3{margin:3px 0 8px;color:#f3f6fa;font-size:12px;letter-spacing:.04em}.site-footer-column a{color:#9ca8b6;text-decoration:none;font-size:13px;transition:.18s ease}.site-footer-column a:hover{color:#fff;transform:translateX(2px)}.site-footer-column .footer-danger-link{color:#ff4358}
.partner-placeholder{width:100%;min-height:88px;padding:15px;border:1px dashed rgba(114,139,171,.26);border-radius:13px;display:flex;flex-direction:column;justify-content:center;gap:5px;background:rgba(255,255,255,.018)}.partner-placeholder span{color:#dce5ef;font-size:12px;font-weight:800;letter-spacing:.12em}.partner-placeholder small{font-size:11px;color:#697788}
.site-footer-bottom{border-top:1px solid rgba(111,139,176,.14);min-height:58px;width:100%;padding:12px max(28px,calc((100% - 1460px)/2));display:flex;align-items:center;justify-content:space-between;gap:20px;color:#718091;font-size:12px}.site-footer .footer-privacy-links{display:flex;gap:16px}.site-footer .footer-privacy-links a,.site-footer .footer-privacy-links button{color:#a8b4c2}.site-footer .footer-privacy-links button{padding:7px 12px;border:1px solid rgba(130,151,178,.25);border-radius:8px;background:rgba(255,255,255,.025)}
@media(max-width:1050px){.site-footer-grid{grid-template-columns:1.4fr repeat(2,1fr)}.site-footer-partners{grid-column:2/4}.site-footer-brand{grid-row:span 2}}
@media(max-width:700px){.site-footer-grid{width:min(100% - 32px,1460px);grid-template-columns:1fr 1fr;gap:28px 22px}.site-footer-brand,.site-footer-partners{grid-column:1/-1;grid-row:auto}.site-footer-bottom{padding:16px;align-items:flex-start;flex-direction:column}.site-footer .footer-privacy-links{flex-wrap:wrap}}

/* V29 footer: pravi STRIMER.SI logo */
.site-footer-logo{display:inline-flex;align-items:center;text-decoration:none}
.site-footer-logo img{display:block;width:auto;height:54px;max-width:220px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(0,184,255,.10))}
@media(max-width:700px){.site-footer-logo img{height:48px;max-width:190px}}


/* ===== V35: profilni kvadratki so dejanski gumbi ===== */
.v20-theme-tiles span{
    cursor:pointer;
    position:relative;
    transition:transform .16s ease,filter .16s ease,box-shadow .16s ease;
}
.v20-theme-tiles span:hover,
.v20-theme-tiles span:focus-visible{
    transform:translateY(-2px) scale(1.025);
    filter:brightness(1.18);
    outline:2px solid rgba(255,255,255,.72);
    outline-offset:3px;
}
.v20-theme-tiles span.is-selected::after{
    content:"✓";
    position:absolute;
    right:7px;
    bottom:6px;
    width:25px;
    height:25px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:rgba(4,9,16,.88);
    color:#fff;
    font-weight:900;
    box-shadow:0 0 16px rgba(255,255,255,.22);
}

/* ===== V35: poseben fullscreen prikaz dohodnega klica ===== */
.call-layer.is-incoming{
    inset:0;
    padding:0;
    background:
        radial-gradient(circle at 50% 34%,rgba(0,183,255,.22),transparent 28%),
        radial-gradient(circle at 50% 70%,rgba(38,231,111,.12),transparent 35%),
        rgba(1,5,11,.94);
}
.call-layer.is-incoming .call-card{
    width:100vw !important;
    max-width:none !important;
    min-height:100vh;
    margin:0;
    border:0;
    border-radius:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:clamp(28px,6vw,80px);
    background:
        linear-gradient(180deg,rgba(5,12,21,.90),rgba(2,6,12,.97)),
        radial-gradient(circle at 50% 35%,rgba(0,158,255,.16),transparent 32%);
}
.call-layer.is-incoming .call-avatar{
    width:132px;
    height:132px;
    margin-bottom:24px;
    font-size:56px;
    border-width:2px;
    animation:v35IncomingPulse 1.35s ease-in-out infinite;
}
.call-layer.is-incoming [data-call-kind]{
    font:800 13px "Oxanium",sans-serif;
    letter-spacing:.12em;
    color:#69dcff;
}
.call-layer.is-incoming h2{
    margin:9px 0 10px;
    font-size:clamp(30px,5vw,58px);
}
.call-layer.is-incoming [data-call-status]{
    font-size:clamp(16px,2vw,21px);
}
.call-layer.is-incoming .call-actions{
    margin-top:24px;
    gap:14px;
    flex-wrap:wrap;
}
.call-layer.is-incoming .call-actions button{
    min-width:160px;
    min-height:56px;
    font-size:15px;
}
@keyframes v35IncomingPulse{
    50%{transform:scale(1.07);box-shadow:0 0 0 13px rgba(47,216,123,.06),0 0 55px rgba(47,216,123,.35)}
}

/* ===== V35: ločeno obvestilo za zasebno sporočilo ===== */
.strimer-message-toast{
    position:fixed;
    z-index:3200;
    top:20px;
    right:20px;
    width:min(390px,calc(100vw - 28px));
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:12px;
    align-items:center;
    padding:14px 14px;
    border:1px solid rgba(67,190,255,.45);
    border-radius:16px;
    background:linear-gradient(145deg,rgba(12,20,31,.97),rgba(5,10,17,.98));
    color:#fff;
    text-decoration:none;
    box-shadow:0 22px 70px rgba(0,0,0,.48),0 0 32px rgba(0,158,255,.13);
    backdrop-filter:blur(14px);
    opacity:0;
    transform:translateY(-12px) scale(.98);
    transition:opacity .2s ease,transform .2s ease;
}
.strimer-message-toast.is-visible{opacity:1;transform:none}
.strimer-message-toast-icon{
    width:44px;height:44px;display:grid;place-items:center;border-radius:13px;
    background:rgba(0,158,255,.12);font-size:22px
}
.strimer-message-toast-copy{min-width:0;display:flex;flex-direction:column;gap:3px}
.strimer-message-toast-copy strong{font:800 14px "Oxanium",sans-serif}
.strimer-message-toast-copy small{
    display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#aebdd0
}
.strimer-message-toast button{
    width:32px;height:32px;border:0;border-radius:9px;background:rgba(255,255,255,.06);
    color:#dbe7f3;cursor:pointer;font-size:20px
}
@media(max-width:600px){
    .strimer-message-toast{top:10px;right:10px;width:calc(100vw - 20px)}
    .call-layer.is-incoming .call-actions{width:min(420px,100%)}
    .call-layer.is-incoming .call-actions button{flex:1;min-width:130px}
}
/* VEČJI NAPISI V ZGORNJEM MENIJU */
.main-nav a,
.site-nav a,
.nav-links a,
header nav a {
    font-size: 16px !important;
}

/* VEČJI NAPISI V SPODNJI VRSTICI MENIJA */
.user-nav a,
.account-nav a,
.header-actions a {
    font-size: 16px !important;
}

/* ===== NUJNI FIX - IZPOSTAVLJENI STREAMERJI ===== */

.home-featured-list .home-featured-row {
    display: grid !important;
    grid-template-columns: 55px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px !important;
    min-height: 80px !important;
    overflow: hidden !important;
}

.home-featured-list .home-featured-row > img {
    width: 55px !important;
    height: 55px !important;
    min-width: 55px !important;
    min-height: 55px !important;
    max-width: 55px !important;
    max-height: 55px !important;

    display: block !important;
    object-fit: cover !important;
    object-position: center !important;

    border-radius: 14px !important;

    position: static !important;
    inset: auto !important;
    transform: none !important;

    margin: 0 !important;
    padding: 0 !important;
}

.home-featured-list .home-featured-row > span {
    min-width: 0 !important;
}

.home-featured-list .home-featured-row > b {
    width: auto !important;
    height: auto !important;
    white-space: nowrap !important;
}

@media (max-width: 760px) {
    .home-featured-list .home-featured-row {
        grid-template-columns: 45px minmax(0, 1fr) !important;
    }

    .home-featured-list .home-featured-row > img {
        width: 45px !important;
        height: 45px !important;
        min-width: 45px !important;
        min-height: 45px !important;
        max-width: 45px !important;
        max-height: 45px !important;
    }

    .home-featured-list .home-featured-row > b {
        grid-column: 2 !important;
    }
}

/* STREAMER BANNER FIX */
.creator-profile-v4 .creator-cover{
    width:100% !important;
    height:220px !important;
    min-height:220px !important;
    max-height:220px !important;

    background-size:cover !important;
    background-position:center !important;
    background-repeat:no-repeat !important;

    overflow:hidden !important;
}

@media(max-width:760px){
    .creator-profile-v4 .creator-cover{
        height:150px !important;
        min-height:150px !important;
        max-height:150px !important;
    }
}

/* =========================================
   STREAMER PROFIL - profilna malo nižje
   ========================================= */

.creator-profile-v4 .creator-identity-row {
    position: relative;
    transform: translateY(22px);
    z-index: 10;
}

/* Če je profilna posebej pozicionirana */
.creator-profile-v4 .creator-avatar-wrap,
.creator-profile-v4 .creator-avatar {
    position: relative;
    z-index: 20;
}

/* Spodnji del kartice dobi več prostora */
.creator-profile-v4 .creator-main,
.creator-profile-v4 .creator-body {
    padding-top: 22px;
}

/* =========================================================
   NAV DROPDOWN — na računalniku se pokaže SAMO ob hoverju
   ========================================================= */
@media (min-width: 821px) {
    .nav-v42-dropdown {
        position: relative !important;
    }

    /* Dropdown je privzeto vedno skrit — tudi če ima <details> atribut open */
    .nav-v42-dropdown > .nav-v42-menu,
    .nav-v42-dropdown[open] > .nav-v42-menu {
        display: none !important;
        position: absolute !important;
        top: calc(100% + 6px) !important;
        left: 0 !important;
        z-index: 99999 !important;
    }

    /* Prikaži ga samo, ko je miška na gumbu ALI na samem dropdownu */
    .nav-v42-dropdown:hover > .nav-v42-menu,
    .nav-v42-dropdown:focus-within > .nav-v42-menu {
        display: flex !important;
    }

    /* Malo nevidnega prostora med gumbom in menijem,
       da dropdown ne izgine med premikom miške navzdol */
    .nav-v42-dropdown::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        height: 8px;
    }

    /* Klik na summary naj vizualno ne "zaklene" odprtega menija */
    .nav-v42-dropdown[open] > summary {
        background: transparent !important;
    }
}

/* Telefon/tablet: obdrži klik/tap način */
@media (max-width: 820px) {
    .nav-v42-dropdown > .nav-v42-menu {
        display: none !important;
        position: static !important;
    }

    .nav-v42-dropdown[open] > .nav-v42-menu {
        display: flex !important;
    }
}


/* =========================================================
   STREAMER BANNER — brez overlay-a in brez obrobe/črte
   ========================================================= */
.creator-profile-v4 .creator-cover-glow{
    display:none !important;
}

.creator-profile-v4 .creator-cover,
.creator-profile-v4 .creator-cover[class*="v17-banner-"]{
    outline:none !important;
    border:none !important;
    border-bottom:none !important;
    box-shadow:none !important;
}

/* odstrani črto med bannerjem in spodnjim delom profila */
.creator-profile-v4 .creator-identity-row,
.creator-profile-v4 .creator-main,
.creator-profile-v4 .creator-body{
    border-top:none !important;
}

.profile-video-player{
    width: min(700px, 100%);
    aspect-ratio: 16/9;
    margin: 18px auto 22px;
    overflow: hidden;
    border-radius: 18px;
    background: #000;
    border: 1px solid rgba(0,191,255,.28);
    box-shadow: 0 15px 40px rgba(0,0,0,.35);
}

.profile-video-player iframe{
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

/* PARTNER CENTER - odmik od robov */
.partner-center {
    margin-left: 24px !important;
    margin-right: 24px !important;
    width: auto !important;
    max-width: calc(100% - 48px) !important;
    box-sizing: border-box !important;
}

@media (max-width: 700px) {
    .partner-center {
        margin-left: 12px !important;
        margin-right: 12px !important;
        max-width: calc(100% - 24px) !important;
    }
}

/* =========================================
   HOME OBVESTILA - KONČNI FIX
   ========================================= */

.home-extras-wide
.home-events-notifications
.home-notification-list
.home-v5-empty{
    padding: 24px 40px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    min-height: 92px !important;
}

.home-extras-wide
.home-events-notifications
.home-notification-list
.home-v5-empty{
    text-indent: 0 !important;
}

@media(max-width:760px){
    .home-extras-wide
    .home-events-notifications
    .home-notification-list
    .home-v5-empty{
        padding: 20px 26px !important;
    }
}

/* =========================================
   HOME LIVE PRAZEN BOX - OMIK OD ROBA
   ========================================= */

.home-extras-wide
.home-v6-first-extra
.home-v5-empty{
    padding:24px 40px !important;
    box-sizing:border-box !important;
    min-height:92px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
}

.home-extras-wide
.home-v6-first-extra
.home-v5-empty strong{
    display:block !important;
    margin:0 0 4px !important;
}

.home-extras-wide
.home-v6-first-extra
.home-v5-empty p{
    margin:0 !important;
}

@media(max-width:760px){
    .home-extras-wide
    .home-v6-first-extra
    .home-v5-empty{
        padding:20px 26px !important;
    }
}

/* =========================================
   CHAT - SCROLL KOT DISCORD
   ========================================= */

.chat-shell.has-conversation {
    height: 760px !important;
    max-height: calc(100vh - 120px) !important;
    overflow: hidden !important;
}

.chat-shell.has-conversation .chat-main {
    height: 100% !important;
    min-height: 0 !important;

    display: flex !important;
    flex-direction: column !important;

    overflow: hidden !important;
}

/* HEADER OSTANE ZGORAJ */
.chat-shell.has-conversation .chat-conversation-header {
    flex: 0 0 auto !important;
}

/* SAMO SPOROČILA SCROLLAJO */
.chat-shell.has-conversation .chat-thread {
    flex: 1 1 auto !important;

    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    overscroll-behavior: contain;
    scrollbar-gutter: stable;

    padding-right: 8px;
}

/* INPUT OSTANE SPODAJ */
.chat-shell.has-conversation .chat-composer {
    flex: 0 0 auto !important;
}

/* STATUS POD INPUTOM */
.chat-shell.has-conversation .chat-live-status {
    flex: 0 0 auto !important;
}

/* LEPŠI SCROLLBAR */
.chat-shell.has-conversation .chat-thread::-webkit-scrollbar {
    width: 8px;
}

.chat-shell.has-conversation .chat-thread::-webkit-scrollbar-track {
    background: transparent;
}

.chat-shell.has-conversation .chat-thread::-webkit-scrollbar-thumb {
    background: #34465c;
    border-radius: 20px;
}

.chat-shell.has-conversation .chat-thread::-webkit-scrollbar-thumb:hover {
    background: #4c6684;
}

/* Firefox */
.chat-shell.has-conversation .chat-thread {
    scrollbar-width: thin;
    scrollbar-color: #34465c transparent;
}

@media (max-width: 760px) {
    .chat-shell.has-conversation {
        height: calc(100dvh - 90px) !important;
        max-height: calc(100dvh - 90px) !important;
    }
}

