/* ============================================================
   ENTRACTE GAMING HUB — Design System v1.0
   Extension du design public (mêmes tokens, nouveaux composants)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700;900&family=Rajdhani:wght@400;500;600;700&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap');

/* ── TOKENS ── */
:root {
    --bg:           #06060F;
    --bg-surface:   #0B0B1A;
    --bg-card:      #0F0F20;
    --bg-card-h:    #141428;
    --border:       rgba(255,255,255,0.07);
    --border-h:     rgba(0,207,255,0.35);

    --cyan:         #00CFFF;
    --cyan-glow:    rgba(0,207,255,0.18);
    --cyan-dim:     rgba(0,207,255,0.08);
    --magenta:      #A020FF;
    --magenta-dim:  rgba(160,32,255,0.08);

    --green:        #00E896;
    --green-dim:    rgba(0,232,150,0.10);
    --orange:       #FF9000;
    --orange-dim:   rgba(255,144,0,0.10);
    --red:          #FF3B5C;
    --red-dim:      rgba(255,59,92,0.10);

    --text:         #E2E4F0;
    --text-muted:   #6B6E8F;
    --text-dim:     #3D3F5C;

    --nav-h:        60px;
    --sidebar-w:    260px;
    --radius:       12px;
    --radius-sm:    8px;
    --radius-xs:    5px;

    --font-logo:    'Orbitron', sans-serif;
    --font-head:    'Rajdhani', sans-serif;
    --font-body:    'DM Sans', sans-serif;
    --font-mono:    'DM Mono', monospace;
}

/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 15px; scroll-behavior: smooth; }
body {
    font-family: var(--font-body);
    background: var(--bg);
    color: var(--text);
    line-height: 1.65;
    min-height: 100vh;
    overflow-x: hidden;
}
body::before {
    content:'';
    position:fixed;
    inset:0;
    background-image: repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.025) 2px,rgba(0,0,0,0.025) 4px);
    pointer-events:none;
    z-index:1000;
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button { cursor:pointer; border:none; background:none; font:inherit; color:inherit; }
textarea { resize:vertical; }

/* ── LAYOUT ── */
.page { display:flex; flex-direction:column; min-height:100vh; width:100%; }
.hub-layout {
    display: grid;
    grid-template-columns: var(--sidebar-w) 1fr;
    gap: 0;
    min-height: calc(100vh - var(--nav-h));
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
    padding: 0 24px;
}
.hub-main { min-width: 0; padding: 28px 0 64px 28px; }
.hub-sidebar { padding: 28px 28px 64px 0; border-right: 1px solid var(--border); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.container-wide { max-width: 100%; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }

/* ── NAV ── */
.nav {
    position: sticky; top: 0; z-index: 900;
    height: var(--nav-h);
    background: rgba(6,6,15,0.88);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border);
    display: flex; align-items: center;
}
.nav-inner {
    max-width: 1400px; width: 100%; margin: 0 auto;
    padding: 0 24px;
    display: flex; align-items: center; gap: 16px;
}
.nav-logo {
    font-family: var(--font-logo);
    font-weight: 900; font-size: 12px;
    letter-spacing: 0.12em; text-transform: uppercase;
    display: flex; align-items: center; gap: 10px;
    white-space: nowrap; flex-shrink: 0;
}
.nav-logo-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--cyan); box-shadow: 0 0 8px var(--cyan);
    animation: pulse-dot 2.5s ease-in-out infinite;
}
@keyframes pulse-dot {
    0%,100% { opacity:1; box-shadow:0 0 8px var(--cyan); }
    50% { opacity:0.5; box-shadow:0 0 20px var(--cyan); }
}
.nav-links { display:flex; align-items:center; gap:2px; flex:1; }
.nav-links a {
    font-family: var(--font-head);
    font-size: 14px; font-weight: 600;
    letter-spacing: 0.05em; text-transform: uppercase;
    color: var(--text-muted);
    padding: 6px 12px; border-radius: var(--radius-sm);
    transition: color 0.15s, background 0.15s;
    display: flex; align-items: center; gap: 7px;
}
.nav-links a:hover, .nav-links a.active {
    color: var(--cyan); background: var(--cyan-dim);
}
.nav-links a .nav-icon { font-size: 15px; }
.nav-right { display:flex; align-items:center; gap:10px; margin-left:auto; }

/* Notification badge */
.nav-notif { position:relative; }
.notif-badge {
    position: absolute; top: -2px; right: -2px;
    width: 16px; height: 16px; border-radius: 50%;
    background: var(--red); color: #fff;
    font-size: 9px; font-weight: 700;
    display: flex; align-items:center; justify-content:center;
    border: 2px solid var(--bg);
}

/* User menu */
.nav-user {
    display: flex; align-items: center; gap: 8px;
    padding: 5px 12px 5px 6px;
    border: 1px solid var(--border); border-radius: 20px;
    cursor: pointer; transition: border-color 0.15s, background 0.15s;
}
.nav-user:hover { border-color: var(--border-h); background: var(--cyan-dim); }
.nav-avatar { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.nav-username { font-family:var(--font-head); font-size:13px; font-weight:600; color:var(--text); }

/* ── BUTTONS ── */
.btn {
    display: inline-flex; align-items: center; gap: 7px;
    font-family: var(--font-head); font-weight: 700;
    font-size: 13px; letter-spacing: 0.07em; text-transform: uppercase;
    padding: 9px 20px; border-radius: var(--radius-sm);
    border: 1px solid transparent; transition: all 0.18s;
    cursor: pointer; white-space: nowrap;
}
.btn-primary { background:var(--cyan); color:var(--bg); border-color:var(--cyan); }
.btn-primary:hover { box-shadow:0 0 24px var(--cyan-glow); transform:translateY(-1px); color:var(--bg); }
.btn-ghost { background:transparent; color:var(--text); border-color:var(--border); }
.btn-ghost:hover { border-color:var(--border-h); background:var(--cyan-dim); color:var(--cyan); }
.btn-danger { background:transparent; color:var(--red); border-color:rgba(255,59,92,0.25); }
.btn-danger:hover { background:var(--red-dim); border-color:var(--red); }
.btn-sm { padding:6px 14px; font-size:12px; }
.btn-xs { padding:4px 10px; font-size:11px; }
.btn-icon { padding:8px; border-radius:var(--radius-sm); width:36px; height:36px; justify-content:center; }

/* ── CARDS ── */
.card {
    background: var(--bg-card); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 20px;
    transition: border-color 0.2s, box-shadow 0.2s;
    position: relative; overflow: hidden;
}
.card:hover { border-color: rgba(0,207,255,0.18); }
.card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

/* ── SECTION HEADERS ── */
.section-title {
    font-family: var(--font-head);
    font-size: 22px; font-weight: 700;
    color: var(--text); margin-bottom: 4px;
}
.section-sub { font-size: 13px; color: var(--text-muted); }
.section-header {
    display: flex; align-items: center;
    justify-content: space-between; gap: 16px;
    margin-bottom: 20px;
}

/* ── FORMS ── */
.form-group { display:flex; flex-direction:column; gap:6px; margin-bottom:16px; }
.form-label {
    font-family: var(--font-head);
    font-size: 12px; font-weight: 600;
    letter-spacing: 0.1em; text-transform: uppercase;
    color: var(--text-muted);
}
.form-control {
    width: 100%; background: rgba(255,255,255,0.04);
    border: 1px solid var(--border); border-radius: var(--radius-sm);
    padding: 10px 14px; color: var(--text);
    font-family: var(--font-body); font-size: 14px;
    transition: border-color 0.15s, background 0.15s;
    outline: none;
}
.form-control::placeholder { color: var(--text-dim); }
.form-control:focus {
    border-color: rgba(0,207,255,0.4);
    background: rgba(0,207,255,0.03);
}
select.form-control {
    appearance: none; cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235A5D7A' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 14px center;
    padding-right: 36px;
}
select.form-control option { background: #0F0F20; }
textarea.form-control { min-height: 120px; }
.form-hint { font-size: 12px; color: var(--text-dim); }
.form-error { font-size: 12px; color: var(--red); margin-top: 4px; }

/* Checkbox custom */
.form-check { display:flex; align-items:center; gap:10px; cursor:pointer; }
.form-check input[type=checkbox] {
    width:18px; height:18px;
    appearance: none; border: 1px solid var(--border);
    background: rgba(255,255,255,0.04);
    border-radius: 4px; cursor: pointer;
    transition: all 0.15s; flex-shrink: 0;
}
.form-check input[type=checkbox]:checked {
    background: var(--cyan); border-color: var(--cyan);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='9'%3E%3Cpath d='M1 4l4 4 6-7' stroke='%2306060F' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center;
}
.form-check-label { font-size: 14px; color: var(--text-muted); }

/* Platform checkboxes grid */
.platform-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 8px;
}
.platform-chip {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 12px; border: 1px solid var(--border);
    border-radius: var(--radius-sm); cursor: pointer;
    font-size: 13px; font-family: var(--font-head);
    font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--text-muted); background: rgba(255,255,255,0.02);
    transition: all 0.15s;
    user-select: none;
}
.platform-chip:has(input:checked),
.platform-chip.selected {
    border-color: var(--cyan); color: var(--cyan);
    background: var(--cyan-dim);
}
.platform-chip input { display: none; }

/* ── ALERTS ── */
.alert {
    padding: 12px 16px; border-radius: var(--radius-sm);
    font-size: 13.5px; border: 1px solid transparent;
    display: flex; align-items: flex-start; gap: 10px;
    margin-bottom: 16px;
}
.alert-icon { flex-shrink: 0; font-size: 15px; margin-top: 1px; }
.alert-error { background:var(--red-dim); border-color:rgba(255,59,92,0.3); color:var(--red); }
.alert-success { background:var(--green-dim); border-color:rgba(0,232,150,0.3); color:var(--green); }
.alert-info { background:var(--cyan-dim); border-color:rgba(0,207,255,0.2); color:var(--cyan); }
.alert-warning { background:var(--orange-dim); border-color:rgba(255,144,0,0.3); color:var(--orange); }

/* ── BADGES & PILLS ── */
.badge {
    display: inline-flex; align-items: center; gap: 5px;
    font-family: var(--font-head); font-size: 11px;
    font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
    padding: 3px 8px; border-radius: 20px; border: 1px solid transparent;
    white-space: nowrap;
}
.badge-cyan    { color:var(--cyan);    background:var(--cyan-dim);    border-color:rgba(0,207,255,0.2); }
.badge-green   { color:var(--green);   background:var(--green-dim);   border-color:rgba(0,232,150,0.2); }
.badge-orange  { color:var(--orange);  background:var(--orange-dim);  border-color:rgba(255,144,0,0.2); }
.badge-red     { color:var(--red);     background:var(--red-dim);     border-color:rgba(255,59,92,0.2); }
.badge-magenta { color:var(--magenta); background:var(--magenta-dim); border-color:rgba(160,32,255,0.2); }
.badge-muted   { color:var(--text-muted); background:rgba(255,255,255,0.04); border-color:var(--border); }

.badge-dot { width:6px; height:6px; border-radius:50%; background:currentColor; flex-shrink:0; }

/* Role badges */
.role-badge { }
.role-member     { @extend .badge; @extend .badge-muted; }
.role-moderator  { color:#FF9000; background:var(--orange-dim); border-color:rgba(255,144,0,0.2); }
.role-admin      { color:var(--magenta); background:var(--magenta-dim); border-color:rgba(160,32,255,0.2); }
.role-superadmin { color:var(--cyan); background:var(--cyan-dim); border-color:rgba(0,207,255,0.2); }

/* ── USER CARD (mini profil inline) ── */
.user-inline {
    display: inline-flex; align-items: center; gap: 8px;
}
.user-inline-avatar {
    width: 24px; height: 24px; border-radius: 50%;
    object-fit: cover; flex-shrink: 0;
}
.user-inline-name {
    font-weight: 500; font-size: 13.5px;
    color: var(--text); transition: color 0.15s;
}
.user-inline-name:hover { color: var(--cyan); }

/* ── FORUM THREAD LIST ── */
.thread-list { display:flex; flex-direction:column; gap:1px; }
.thread-item {
    display: grid;
    grid-template-columns: 40px 1fr auto;
    gap: 14px;
    padding: 14px 16px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    margin-bottom: 2px;
    transition: border-color 0.15s, background 0.15s;
    align-items: start;
}
.thread-item:hover { border-color:rgba(0,207,255,0.18); background:var(--bg-card-h); }
.thread-item.pinned { border-left: 3px solid var(--cyan); }
.thread-vote-col {
    display: flex; flex-direction: column;
    align-items: center; gap: 4px;
    padding-top: 2px;
}
.vote-score {
    font-family: var(--font-head); font-size: 15px;
    font-weight: 700; color: var(--text-muted);
    line-height: 1;
}
.vote-score.positive { color: var(--green); }
.btn-vote {
    width: 28px; height: 28px;
    display: flex; align-items:center; justify-content:center;
    border-radius: var(--radius-xs); font-size: 14px;
    border: 1px solid var(--border);
    color: var(--text-muted);
    transition: all 0.15s;
}
.btn-vote:hover, .btn-vote.voted {
    background: var(--green-dim); border-color:rgba(0,232,150,0.3);
    color: var(--green);
}
.thread-body {}
.thread-title {
    font-family: var(--font-head); font-size: 17px; font-weight: 600;
    color: var(--text); line-height: 1.25; margin-bottom: 6px;
}
.thread-title a:hover { color: var(--cyan); }
.thread-meta {
    display: flex; align-items: center; flex-wrap: wrap;
    gap: 10px; font-size: 12px; color: var(--text-muted);
}
.thread-stats {
    display: flex; flex-direction: column;
    align-items: flex-end; gap: 4px;
    font-size: 12px; color: var(--text-muted);
    white-space: nowrap; min-width: 80px;
}
.thread-stats strong { font-size: 14px; color: var(--text); display:block; text-align:right; }

/* ── FORUM POST ── */
.post-item {
    display: grid; grid-template-columns: 72px 1fr;
    gap: 20px; padding: 20px 0;
    border-bottom: 1px solid var(--border);
}
.post-item:last-child { border-bottom: none; }
.post-author {
    display: flex; flex-direction: column;
    align-items: center; gap: 8px; text-align: center;
}
.post-author-avatar { width: 52px; height: 52px; border-radius: 50%; object-fit:cover; }
.post-author-name { font-family:var(--font-head); font-size:13px; font-weight:600; color:var(--text); }
.post-body { }
.post-content {
    font-size: 14px; line-height: 1.75; color: var(--text);
    margin-bottom: 12px;
}
.post-content p { margin-bottom: 12px; }
.post-content code { font-family:var(--font-mono); background:rgba(255,255,255,0.06); padding:2px 6px; border-radius:4px; font-size:13px; }
.post-actions {
    display: flex; align-items: center; gap: 12px;
    font-size: 12px; color: var(--text-muted);
}

/* ── ROOM CARDS ── */
.room-card {
    background: var(--bg-card); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 18px 20px;
    display: flex; flex-direction: column; gap: 12px;
    transition: transform 0.18s, border-color 0.18s, box-shadow 0.18s;
    position: relative; overflow: hidden;
}
.room-card::before {
    content:''; position:absolute; inset:0;
    background:linear-gradient(135deg, rgba(0,207,255,0.03) 0%, transparent 50%);
    opacity:0; transition:opacity 0.18s; pointer-events:none;
}
.room-card:hover { transform:translateY(-2px); border-color:var(--border-h); box-shadow:0 8px 24px rgba(0,0,0,0.3); }
.room-card:hover::before { opacity:1; }

.room-header { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.room-game { font-family:var(--font-head); font-size:18px; font-weight:700; color:var(--text); margin-bottom:3px; }
.room-title { font-size:13px; color:var(--text-muted); }
.room-slots {
    font-family: var(--font-head); font-weight: 700;
    font-size: 13px; white-space: nowrap;
    display: flex; align-items: center; gap: 6px;
}
.room-slots-filled { color: var(--green); font-size: 18px; }
.room-slots-total { color: var(--text-muted); }

.room-slots-bar {
    height: 4px; background: var(--bg-surface);
    border-radius: 2px; overflow: hidden;
}
.room-slots-fill {
    height: 100%; background: var(--green);
    border-radius: 2px; transition: width 0.3s;
}
.room-slots-fill.full { background: var(--cyan); }

.room-meta {
    display: flex; flex-wrap: wrap; gap: 8px;
    font-size: 12px; align-items: center;
}
.room-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:auto; padding-top:12px; border-top:1px solid var(--border); }

/* Level badges */
.level-chill       { @extend .badge; color:#00E896; background:rgba(0,232,150,0.08); border-color:rgba(0,232,150,0.2); }
.level-competitive { @extend .badge; color:var(--red); background:var(--red-dim); border-color:rgba(255,59,92,0.2); }
.level-both        { @extend .badge; color:var(--orange); background:var(--orange-dim); border-color:rgba(255,144,0,0.2); }

/* ── SIDEBAR COMPONENTS ── */
.sidebar-section { margin-bottom: 28px; }
.sidebar-title {
    font-family: var(--font-head); font-size: 12px;
    font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase;
    color: var(--text-muted); margin-bottom: 12px;
    padding-bottom: 8px; border-bottom: 1px solid var(--border);
}
.sidebar-nav { display:flex; flex-direction:column; gap:2px; }
.sidebar-nav a {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 12px; border-radius: var(--radius-sm);
    font-size: 14px; color: var(--text-muted);
    transition: all 0.15s;
}
.sidebar-nav a:hover, .sidebar-nav a.active {
    background: var(--cyan-dim); color: var(--cyan);
}
.sidebar-nav a .icon { width: 18px; text-align: center; font-size: 14px; }
.sidebar-nav a .count {
    margin-left: auto; font-family: var(--font-head);
    font-size: 11px; font-weight: 700; color: var(--text-dim);
}

/* ── PAGINATION ── */
.pagination { display:flex; align-items:center; gap:4px; margin-top:24px; }
.page-btn {
    min-width: 32px; height: 32px; display:flex; align-items:center; justify-content:center;
    font-family: var(--font-head); font-size: 13px; font-weight: 600;
    border: 1px solid var(--border); border-radius: var(--radius-xs);
    color: var(--text-muted); background: transparent; transition: all 0.15s;
}
.page-btn:hover { border-color:var(--border-h); color:var(--cyan); background:var(--cyan-dim); }
.page-btn.active { background:var(--cyan); color:var(--bg); border-color:var(--cyan); }
.page-btn.disabled { opacity:0.3; pointer-events:none; }

/* ── TABS ── */
.tabs { display:flex; gap:0; border-bottom:1px solid var(--border); margin-bottom:24px; }
.tab-btn {
    font-family: var(--font-head); font-size: 14px; font-weight: 600;
    letter-spacing: 0.05em; text-transform: uppercase;
    padding: 10px 18px; color: var(--text-muted);
    border-bottom: 2px solid transparent; margin-bottom: -1px;
    transition: all 0.15s; cursor: pointer;
}
.tab-btn:hover { color: var(--text); }
.tab-btn.active { color: var(--cyan); border-color: var(--cyan); }

/* ── EMPTY STATE ── */
.empty-state {
    text-align: center; padding: 60px 24px;
    color: var(--text-muted);
}
.empty-state-icon { font-size: 40px; margin-bottom: 16px; opacity: 0.4; }
.empty-state-title { font-family:var(--font-head); font-size:20px; font-weight:700; color:var(--text); margin-bottom:8px; }
.empty-state-sub { font-size: 14px; max-width: 320px; margin: 0 auto 20px; }

/* ── MODERATION INDICATORS ── */
.report-btn {
    font-size: 11px; color: var(--text-dim);
    display: inline-flex; align-items: center; gap: 5px;
    transition: color 0.15s; cursor: pointer;
}
.report-btn:hover { color: var(--orange); }

.deleted-content {
    font-size: 13px; color: var(--text-dim); font-style: italic;
    padding: 8px 12px; background: rgba(255,255,255,0.02);
    border-radius: var(--radius-xs); border: 1px dashed var(--border);
}

/* ── AUTH PAGES ── */
.auth-wrap {
    min-height: 100vh; display: flex; align-items: center;
    justify-content: center; padding: 32px 16px;
    background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(0,207,255,0.06) 0%, transparent 60%);
}
.auth-card {
    width: 100%; max-width: 440px;
    background: var(--bg-card); border: 1px solid var(--border);
    border-radius: var(--radius); padding: 36px 32px;
}
.auth-title {
    font-family: var(--font-head); font-size: 28px; font-weight: 700;
    color: var(--text); margin-bottom: 8px; text-align: center;
}
.auth-sub { font-size: 14px; color: var(--text-muted); text-align:center; margin-bottom: 28px; }
.auth-divider {
    display: flex; align-items: center; gap: 12px;
    color: var(--text-dim); font-size: 12px;
    margin: 20px 0; text-transform: uppercase; letter-spacing: 0.1em;
}
.auth-divider::before, .auth-divider::after {
    content:''; flex:1; height:1px; background:var(--border);
}

/* ── FOOTER ── */
footer {
    border-top: 1px solid var(--border);
    padding: 20px 24px;
    background: var(--bg-surface);
    position: fixed;
    bottom: 0; left: 0; right: 0;
    width: 100vw;
    box-sizing: border-box;
    z-index: 500;
}

/* Compenser la hauteur du footer fixe */
.page { padding-bottom: 80px; }
.footer-inner {
    width: 100%;
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px; flex-wrap: wrap;
}


.footer-logo { font-family:var(--font-logo); font-size:10px; font-weight:900; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-dim); }
.footer-copy { font-size:12px; color:var(--text-dim); text-align:center; }

/* ── ANIMATIONS ── */
@keyframes fade-up {
    from { opacity:0; transform:translateY(12px); }
    to   { opacity:1; transform:translateY(0); }
}
.fade-up { animation:fade-up 0.4s ease forwards; opacity:0; }
.d1 { animation-delay:0.05s; } .d2 { animation-delay:0.1s; } .d3 { animation-delay:0.15s; }

/* ── RESPONSIVE ── */
@media (max-width:1024px) {
    .hub-layout { grid-template-columns:1fr; }
    .hub-sidebar { display:none; }
    .hub-main { padding:20px 0 48px; }
}
@media (max-width:640px) {
    :root { --nav-h:52px; }
    .nav-links { display:none; }
    .thread-item { grid-template-columns:32px 1fr; }
    .thread-stats { display:none; }
    .post-item { grid-template-columns:1fr; }
    .post-author { flex-direction:row; text-align:left; }
    .room-card { padding:14px 16px; }
    .auth-card { padding:24px 20px; }
}

/* ── Tableaux admin — hauteur uniforme ── */
.licences-table tr,
.games-table tr,
.con-table tr,
.list-table tr,
.users-table tr {
    height: 52px;
}
.licences-table td,
.games-table td,
.con-table td,
.list-table td,
.users-table td {
    height: 52px;
    max-height: 52px;
    padding: 0 12px;
    vertical-align: middle;
    overflow: hidden;
    white-space: nowrap;
}
.licences-table td .lic-logo,
.games-table td .g-thumb,
.con-table td .con-thumb {
    width: 36px;
    height: 36px;
    max-height: 36px;
    object-fit: contain;
    display: block;
    flex-shrink: 0;
}