/* ── Settings ── */
.settings-body { flex:1; overflow-y:auto; padding:0 24px 32px; display:flex; flex-direction:column; gap:20px; }
.settings-section { background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:16px; overflow:hidden; }
.settings-section-title { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; color:var(--text-muted); padding:14px 20px 10px; border-bottom:1px solid rgba(255,255,255,0.06); }
.settings-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 20px; border-bottom:1px solid rgba(255,255,255,0.04); }
.settings-row:last-child { border-bottom:none; }
.settings-label { flex:1; min-width:0; }
.settings-label-main { font-size:14px; font-weight:500; color:var(--text-primary); margin-bottom:2px; }
.settings-label-sub { font-size:12px; color:var(--text-muted); }
.settings-toggle-group { display:flex; background:rgba(0,0,0,0.3); border-radius:8px; padding:2px; gap:2px; }
.settings-toggle { padding:5px 14px; border-radius:6px; border:none; background:transparent; color:var(--text-muted); font-size:12px; font-weight:600; cursor:pointer; transition:all 0.15s; }
.settings-toggle.active { background:rgba(255,255,255,0.12); color:var(--text-primary); }
.settings-toggle:hover:not(.active) { color:var(--text-secondary); }
.settings-accent-swatches { display:flex; gap:8px; flex-wrap:wrap; }
.settings-accent-swatch { width:24px; height:24px; border-radius:50%; cursor:pointer; transition:transform 0.15s; border:2px solid transparent; }
.settings-accent-swatch:hover { transform:scale(1.2); }
.settings-accent-swatch.active { border-color:#fff; box-shadow:0 0 0 2px rgba(255,255,255,0.3); transform:scale(1.15); }
.settings-switch { position:relative; display:inline-block; width:44px; height:24px; flex-shrink:0; cursor:pointer; }
.settings-switch input { opacity:0; width:0; height:0; position:absolute; }
.settings-switch-track { position:absolute; inset:0; background:rgba(255,255,255,0.12); border-radius:12px; transition:background 0.2s; }
.settings-switch-track::after { content:''; position:absolute; width:18px; height:18px; border-radius:50%; background:#fff; top:3px; left:3px; transition:transform 0.2s; }
.settings-switch input:checked + .settings-switch-track { background:var(--accent); }
.settings-switch input:checked + .settings-switch-track::after { transform:translateX(20px); }
/* Light theme */
body.light-theme { --bg-primary:#f1f5f9; --bg-secondary:#e2e8f0; --bg-tertiary:#cbd5e1; --text-primary:#0f172a; --text-secondary:#475569; --text-muted:#94a3b8; --border:rgba(0,0,0,0.1); }
body.light-theme .sidebar { background:#e8edf5; }
body.light-theme header { background:#e8edf5; border-color:rgba(0,0,0,0.1); }
body.light-theme .input-area { background:#e8edf5; border-color:rgba(0,0,0,0.1); }
body.light-theme .message-content { background:#fff; color:#0f172a; }
body.light-theme .message.user .message-content { color:#fff; }
body.light-theme .model-dropdown { background:#e2e8f0; border-color:rgba(0,0,0,0.15); }
body.light-theme .model-option:hover { background:rgba(0,0,0,0.05); }
body.light-theme .input-box { background:#fff; border-color:rgba(0,0,0,0.12); color:#0f172a; }
body.light-theme .welcome-screen { background:var(--bg-primary); }
body.light-theme .quick-action { background:#fff; border-color:rgba(0,0,0,0.1); color:#475569; }
body.light-theme .gallery-header { background:#e8edf5; border-color:rgba(0,0,0,0.08); }
body.light-theme .settings-section { background:rgba(0,0,0,0.03); border-color:rgba(0,0,0,0.08); }
body.light-theme .new-chat-btn:hover { background:rgba(0,0,0,0.06); }

/* Browse toolbar */
.browse-toolbar {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0 24px 20px;
}
.browse-search-wrap {
    position: relative;
    max-width: 480px;
}
.browse-search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 15px;
    pointer-events: none;
}
.browse-search {
    width: 100%;
    padding: 10px 14px 10px 38px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 10px;
    color: var(--text-primary);
    font-size: 14px;
    outline: none;
    box-sizing: border-box;
    transition: border-color 0.2s;
}
.browse-search:focus {
    border-color: rgba(96,165,250,0.5);
}
.browse-search::placeholder { color: var(--text-muted); }
.browse-filters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.browse-filter {
    padding: 5px 14px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.15);
    background: transparent;
    color: var(--text-secondary);
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}
.browse-filter:hover {
    border-color: rgba(96,165,250,0.4);
    color: #60a5fa;
}
.browse-filter.active {
    background: rgba(96,165,250,0.15);
    border-color: rgba(96,165,250,0.5);
    color: #60a5fa;
    font-weight: 600;
}
/* Community game card extras */
.game-card-creator {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 6px;
}
.game-card-creator span {
    color: #a78bfa;
    font-weight: 600;
}
.game-card-stars {
    font-size: 12px;
    color: #fbbf24;
    margin-bottom: 10px;
}
.game-card-tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 6px;
    background: rgba(96,165,250,0.15);
    color: #60a5fa;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 8px;
}

/* publish toast */
.publish-toast {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%);
    background: #0f2a1a;
    border: 1px solid var(--accent);
    color: var(--text-primary);
    padding: 10px 20px;
    border-radius: 10px;
    font-size: 13px;
    z-index: 3000;
    animation: fadeIn 0.2s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}