/* Fórum (site) */
.forum-page { display: grid; gap: 18px; padding-top: 12px; padding-bottom: 32px; }
.forum-crumbs { font-size: .9rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: 6px; }
.forum-crumbs a { color: inherit; }

.forum-cats, .forum-topics { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.forum-cat {
    display: flex; justify-content: space-between; gap: 12px; align-items: center;
    background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 14px 16px;
    color: inherit; text-decoration: none;
}
.forum-cat-main { display: grid; gap: 4px; min-width: 0; }
.forum-cat-main small, .forum-cat-meta small { color: var(--muted); }
.forum-cat-meta { text-align: right; white-space: nowrap; font-size: .92rem; }
.forum-search { display:flex; gap:8px; flex-wrap:wrap; }
.forum-search .input { flex:1 1 240px; }
.forum-search-results { display:grid; gap:12px; max-width:960px; }
.forum-search-result { display:grid; gap:8px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:16px; }
.forum-search-result h3 { margin:0; overflow-wrap:anywhere; }
.forum-search-result p { margin:0; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.55; }
.forum-search-result small { color:var(--muted); }
.forum-search-result-head { display:flex; justify-content:space-between; gap:10px; align-items:center; flex-wrap:wrap; }

.forum-topic {
    background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 12px 16px;
    display: grid; gap: 6px;
}
.forum-topic.is-hidden { opacity: .7; }
.forum-topic-title { color: inherit; text-decoration: none; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.forum-topic-meta { color: var(--muted); font-size: .85rem; }
.forum-topic-follow { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.forum-topic-follow form { margin:0; }
.forum-topic-follow small { color:var(--muted); }

.forum-post { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 16px; display: grid; gap: 10px; }
.forum-post.is-hidden { opacity: .75; border-style: dashed; }
.forum-post-head h1 { margin: 0; font-size: 1.35rem; overflow-wrap: anywhere; }
.forum-post-meta { margin: 0; color: var(--muted); font-size: .9rem; }
.forum-body { line-height: 1.6; overflow-wrap: anywhere; }
.forum-title-link { display:flex; gap:12px; align-items:center; margin:8px 0; padding:10px; border:1px solid var(--border); border-radius:14px; background:var(--surface-2); color:var(--text); text-decoration:none; }
.forum-title-link img { width:56px; height:78px; flex:none; object-fit:cover; border-radius:8px; }
.forum-title-link span { display:grid; gap:3px; }
.forum-title-link small,.forum-title-score { color:var(--muted); font-size:.82rem; }
.forum-topic-rating { display:flex; justify-content:space-between; gap:12px; align-items:center; flex-wrap:wrap; margin-top:8px; padding:12px; border-radius:12px; background:var(--surface-2); }
.forum-topic-rating small { display:block; color:var(--muted); }
.forum-reactions { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.forum-reaction-form { display:inline-flex; margin:0; }
.forum-reaction { border:1px solid var(--border); border-radius:999px; background:var(--surface-2); color:var(--text); padding:5px 9px; cursor:pointer; font-size:.9rem; }
.forum-reaction:hover, .forum-reaction.is-mine { border-color:var(--accent); background:var(--accent-soft); }
.forum-reaction span { color:var(--muted); font-size:.8rem; }
.forum-poll { display:grid; gap:12px; padding:14px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface-2); }
.forum-poll-head { display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.forum-poll-head small { display:block; color:var(--muted); margin-top:3px; }
.forum-poll-form { display:grid; gap:8px; }
.forum-poll-option { display:grid; grid-template-columns:auto 1fr; gap:7px 9px; align-items:center; cursor:pointer; }
.forum-poll-option-label { display:flex; justify-content:space-between; gap:8px; font-size:.92rem; }
.forum-poll-option-label strong { color:var(--muted); font-size:.82rem; white-space:nowrap; }
.forum-poll-bar { grid-column:2; height:7px; background:var(--border); border-radius:99px; overflow:hidden; }
.forum-poll-bar i { display:block; height:100%; background:var(--accent); border-radius:inherit; }
.forum-poll-create { border:1px dashed var(--border-strong); border-radius:var(--radius); padding:10px 12px; }
.forum-poll-create summary { cursor:pointer; color:var(--accent-text); font-weight:700; }
.forum-poll-create-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.forum-stars { display:flex; gap:3px; align-items:center; }
.forum-stars input { position:absolute; opacity:0; }
.forum-stars span { color:var(--border-strong); font-size:1.35rem; cursor:pointer; }
.forum-stars input:checked + span,.forum-stars label:hover span { color:#f4b940; }
.forum-inline { display: inline; margin: 0; }
.forum-moderation-actions { display:flex; flex-wrap:wrap; gap:6px; padding-top:4px; border-top:1px solid var(--border); }
.forum-replies { display: grid; gap: 10px; }
.forum-replies h2 { font-size: 1.05rem; margin: 6px 0 0; }
.forum-reply { padding: 12px 14px; }

.forum-reply-form { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 16px; display: grid; gap: 10px; }
.forum-reply-form textarea, .forum-form textarea { width: 100%; min-height: 120px; resize: vertical; }
.forum-form { display: grid; gap: 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 18px; }
.forum-form .field { display: grid; gap: 6px; }
.forum-spoiler-option { display:flex; gap:9px; align-items:flex-start; color:var(--text); font-size:.9rem; cursor:pointer; }
.forum-spoiler-option input { margin-top:3px; accent-color:var(--accent); }
.forum-spoiler { border:1px solid var(--border); border-radius:12px; background:var(--surface-2); padding:10px 12px; }
.forum-spoiler summary { cursor:pointer; font-weight:700; color:var(--accent-text); }
.forum-spoiler[open] summary { margin-bottom:10px; }
.forum-spoiler h2 { font-size:1.1rem; margin:0 0 8px; }

@media (max-width: 640px) {
    .forum-cat { flex-direction: column; align-items: flex-start; }
    .forum-cat-meta { text-align: left; white-space: normal; }
}

/* ===== Fórum v2 (alpha.86): hero, categorias, tópicos e respostas ===== */
.fx-hero { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; padding:22px; border:1px solid var(--border); border-radius:20px;
    background:radial-gradient(120% 140% at 0% 0%, var(--accent-soft), transparent 60%), var(--surface); position:relative; overflow:hidden; }
.fx-hero--slim { padding:18px 20px; align-items:center; }
.fx-hero-text { display:grid; gap:8px; min-width:0; flex:1 1 280px; }
.fx-hero h1 { margin:0; font-size:clamp(1.5rem,4vw,2.1rem); line-height:1.1; overflow-wrap:anywhere; }
.fx-hero p { margin:0; color:var(--muted); max-width:56ch; }
.fx-eyebrow { display:inline-flex; align-items:center; gap:6px; font-size:.78rem; font-weight:700; letter-spacing: 0; text-transform: none; color:var(--accent-text); }
.fx-eyebrow svg { width:15px; height:15px; }
.fx-hero-stats { display:flex; gap:16px; flex-wrap:wrap; color:var(--muted); font-size:.88rem; }
.fx-hero-stats strong { color:var(--text); font-size:1.05rem; margin-right:3px; }
.fx-hero-actions { display:flex; gap:8px; flex-wrap:wrap; }
.fx-search { box-sizing:border-box; display:flex; align-items:center; gap:8px; flex:1 1 min(100%,300px); min-width:0; max-width:min(100%,420px); padding:5px 5px 5px 14px; border:1px solid var(--border-strong); border-radius:999px; background:var(--surface-2); }
.fx-search:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.fx-search svg { width:18px; height:18px; color:var(--muted); flex:none; }
.fx-search input { flex:1 1 0; width:100%; min-width:0; border:0; background:transparent; color:var(--text); font:inherit; padding:8px 0; outline:0; }
.fx-search button { flex:none; border:0; border-radius:999px; background:var(--accent); color:var(--on-accent,#fff); font-weight:700; padding:8px 16px; cursor:pointer; }

.fx-cats { list-style:none; margin:0; padding:0; display:grid; gap:12px; grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr)); }
.fx-cat { --tone:var(--accent); display:flex; gap:14px; align-items:center; padding:16px; border:1px solid var(--border); border-radius:18px; background:var(--surface); color:inherit; text-decoration:none;
    transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease; position:relative; overflow:hidden; }
.fx-cat::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--tone); opacity:.8; }
.fx-cat:hover, .fx-cat:focus-visible { transform:translateY(-2px); border-color:var(--tone); box-shadow:0 10px 26px -14px var(--tone); }
.fx-cat-icon { width:46px; height:46px; flex:none; display:grid; place-items:center; border-radius:14px; background:color-mix(in srgb, var(--tone) 16%, transparent); color:var(--tone); }
.fx-cat-icon svg { width:22px; height:22px; }
.fx-cat-main { display:grid; gap:3px; min-width:0; flex:1; }
.fx-cat-main strong { font-size:1.02rem; overflow-wrap:anywhere; }
.fx-cat-main small { color:var(--muted); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.fx-cat-meta { display:flex; gap:12px; flex-wrap:wrap; font-style:normal; font-size:.8rem; color:var(--muted); margin-top:4px; }
.fx-cat-meta span { display:inline-flex; align-items:center; gap:4px; }
.fx-cat-meta svg { width:13px; height:13px; }
.fx-cat-go { color:var(--muted); flex:none; }
.fx-cat-go svg { width:18px; height:18px; }
.fx-tone-violet { --tone:#9b7bff; } .fx-tone-blue { --tone:#4da3ff; } .fx-tone-amber { --tone:#f4b940; }
.fx-tone-green { --tone:#3ecf8e; } .fx-tone-rose { --tone:#ff6b8b; } .fx-tone-teal { --tone:#2cc6c6; }

.fx-topics { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.fx-topic { display:flex; align-items:center; gap:14px; padding:12px 14px; border:1px solid var(--border); border-radius:16px; background:var(--surface); transition:border-color .15s ease, background .15s ease; }
.fx-topic:hover { border-color:var(--border-strong); background:var(--surface-2); }
.fx-topic.is-pinned { border-color:color-mix(in srgb, var(--accent) 45%, var(--border)); background:linear-gradient(90deg, var(--accent-soft), transparent 55%), var(--surface); }
.fx-topic.is-hidden { opacity:.7; border-style:dashed; }
.fx-topic > .avatar { flex:none; }
.fx-topic-main { display:grid; gap:3px; min-width:0; flex:1; }
.fx-topic-tags { display:flex; gap:6px; flex-wrap:wrap; }
.fx-topic-tags:empty { display:none; }
.fx-topic-title { color:var(--text); font-weight:700; text-decoration:none; overflow-wrap:anywhere; line-height:1.3; }
.fx-topic-title:hover { color:var(--accent-text); }
.fx-topic-title::after { content:""; position:absolute; inset:0; }
.fx-topic { position:relative; }
.fx-topic-by { margin:0; color:var(--muted); font-size:.82rem; }
.fx-topic-stats { display:flex; gap:14px; flex:none; color:var(--muted); font-size:.85rem; }
.fx-topic-stats span { display:inline-flex; align-items:center; gap:5px; }
.fx-topic-stats svg { width:15px; height:15px; }
.fx-topic-stats b { color:var(--text); font-weight:700; }

.fx-tag { display:inline-flex; align-items:center; gap:4px; padding:2px 9px; border-radius:999px; font-size:.72rem; font-weight:700; background:var(--surface-2); color:var(--muted); border:1px solid var(--border); }
.fx-tag svg { width:11px; height:11px; }
.fx-tag--accent { background:var(--accent-soft); color:var(--accent-text); border-color:transparent; }
.fx-tag--warn { background:rgba(244,185,64,.14); color:#f4b940; border-color:transparent; }

/* tópico */
.forum-post-head { display:grid; gap:8px; }
.fx-badges { display:flex; gap:6px; flex-wrap:wrap; }
.fx-badges:empty { display:none; }
.forum-post-head h1 { font-size:clamp(1.3rem,3.6vw,1.8rem); line-height:1.2; }
.fx-author { display:flex; align-items:center; gap:12px; padding:10px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.fx-author-info { display:grid; gap:2px; min-width:0; flex:1; }
.fx-author-info a { font-weight:700; color:var(--text); text-decoration:none; overflow-wrap:anywhere; }
.fx-author-info small { color:var(--muted); }
.forum-body { font-size:1rem; line-height:1.7; white-space:normal; }
.fx-toolbar { display:flex; flex-wrap:wrap; gap:6px; align-items:center; padding-top:10px; border-top:1px solid var(--border); }
.fx-toolbar:empty { display:none; }
.fx-toolbar--sm { border-top:0; padding-top:2px; }
.fx-toolbar .forum-moderation-actions { border:0; padding:0; }

.forum-replies h2 { display:flex; align-items:center; gap:8px; font-size:1.1rem; margin:8px 0 2px; }
.forum-replies h2 svg { width:18px; height:18px; color:var(--accent-text); }
.fx-count { background:var(--accent-soft); color:var(--accent-text); border-radius:999px; font-size:.78rem; padding:2px 9px; }
.fx-no-replies { margin:0; color:var(--muted); padding:18px; text-align:center; border:1px dashed var(--border-strong); border-radius:16px; }
.fx-reply { display:flex; gap:12px; padding:14px; border:1px solid var(--border); border-radius:16px; background:var(--surface); scroll-margin-top:84px; }
.fx-reply.is-op { border-color:color-mix(in srgb, var(--accent) 40%, var(--border)); }
.fx-reply.is-hidden { opacity:.75; border-style:dashed; }
.fx-reply:target { box-shadow:0 0 0 2px var(--accent); }
.fx-reply-side { flex:none; }
.fx-reply-main { display:grid; gap:8px; min-width:0; flex:1; }
.fx-reply-meta { margin:0; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.fx-reply-meta a { font-weight:700; color:var(--text); text-decoration:none; }
.fx-reply-meta small { color:var(--muted); }

.fx-compose { border-radius:18px; }
.fx-compose-form { display:grid; gap:10px; }
.fx-compose textarea { min-height:110px; }

@media (max-width: 640px) {
    .fx-hero { padding:16px; border-radius:16px; }
    .fx-search { max-width:none; }
    .fx-topic { flex-wrap:wrap; }
    .fx-topic-main { flex-basis:calc(100% - 60px); }
    .fx-topic-stats { margin-left:56px; flex-basis:100%; }
    .fx-reply { padding:12px; gap:10px; }
    .fx-reply .avatar { width:34px; height:34px; font-size:.8rem; }
    .fx-cat { padding:14px; }
}

/* ===== Fórum v3 (alpha.115): hero com profundidade, respostas mais legíveis, citar e botão flutuante ===== */
.fx-hero { background:
    radial-gradient(120% 140% at 0% 0%, var(--accent-soft), transparent 60%),
    radial-gradient(70% 120% at 100% 100%, color-mix(in srgb, #8b5cf6 14%, transparent), transparent 65%), var(--surface);
  box-shadow: 0 18px 40px -30px color-mix(in srgb, var(--accent) 60%, transparent); }
.fx-hero::after { content: ""; position: absolute; right: -50px; top: -50px; width: 200px; height: 200px; border-radius: 50%; border: 26px solid color-mix(in srgb, var(--accent) 9%, transparent); pointer-events: none; }
.fx-hero > * { position: relative; z-index: 1; }
.fx-search { box-shadow: 0 8px 20px -16px rgba(0, 0, 0, .5); transition: box-shadow .2s, border-color .2s; }
.fx-search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
.fx-cat-icon { transition: transform .2s ease; }
.fx-cat:hover .fx-cat-icon { transform: scale(1.08) rotate(-4deg); }

.forum-post { box-shadow: 0 14px 34px -28px rgba(0, 0, 0, .6); }
.forum-body { line-height: 1.65; font-size: 1rem; }
.fx-reply { transition: border-color .2s, box-shadow .2s; }
.fx-reply:hover { box-shadow: 0 10px 26px -22px rgba(0, 0, 0, .6); }
.fx-reply.is-op { position: relative; background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 7%, var(--surface)), var(--surface) 40%); }
.fx-reply.is-op::before { content: ""; position: absolute; inset: 12px auto 12px 0; width: 3px; border-radius: 0 3px 3px 0; background: var(--accent); }
.fx-reply .fx-toolbar--sm { opacity: .7; transition: opacity .2s; }
.fx-reply:hover .fx-toolbar--sm, .fx-reply:focus-within .fx-toolbar--sm { opacity: 1; }
.fx-compose textarea { border-radius: 14px; transition: border-color .2s, box-shadow .2s; }
.fx-compose textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent); }
.fx-counter { justify-self: end; color: var(--muted); font-size: .76rem; min-height: 1em; }
.fx-counter.is-low { color: var(--danger, #ef4444); font-weight: 700; }
.fx-fab { position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: calc(76px + env(safe-area-inset-bottom)); z-index: 30; display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 999px; background: var(--accent); color: var(--accent-ink, #fff); font-weight: 700; text-decoration: none; box-shadow: 0 14px 30px -12px color-mix(in srgb, var(--accent) 80%, transparent); transition: transform .2s ease, opacity .2s ease; }
.fx-fab svg { width: 18px; height: 18px; }
.fx-fab.is-hidden { opacity: 0; transform: translateY(16px); pointer-events: none; }
@media (min-width: 900px) { .fx-fab { bottom: 28px; } }
@media (prefers-reduced-motion: reduce) { .fx-fab, .fx-cat-icon, .fx-reply { transition: none; } }
