.portal-panel { padding:28px; border:1px solid var(--line); border-radius:3px; background:var(--surface); margin-block:24px; }
.portal-filters { display:flex; flex-wrap:wrap; gap:18px; align-items:end; }
.portal-filters label { display:grid; gap:8px; flex:1 1 160px; font-family:var(--ui); font-size:.85rem; color:var(--ink-soft); }
.portal-filters input,.portal-filters select { width:100%; min-height:48px; padding:10px 12px; border:1px solid var(--line); border-radius:3px; background:#0d1317; color:var(--ink); font:inherit; }
.portal-filters input:focus-visible,.portal-filters select:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
.portal-status { color:var(--ink-soft); font-family:var(--ui); font-size:.9rem; line-height:1.6; margin:24px 0 12px; }
.portal-updated { font: .75rem/1.6 var(--ui); color:var(--ink-mute); margin:16px 0 0; }
.portal-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:3px; background:var(--surface); }
.portal-table { width:100%; border-collapse:collapse; font-family:var(--ui); font-size:.9rem; white-space:nowrap; }
.portal-table caption { text-align:left; padding:20px; font-family:var(--display); font-size:1.3rem; color:var(--ink); }
.portal-table th { text-align:left; color:var(--gold); font-size:.75rem; letter-spacing:.04em; background:#192126; font-weight:500; }
.portal-table th,.portal-table td { padding:16px 20px; border-bottom:1px solid var(--line); }
.portal-table tr:last-child td { border-bottom:0; }
.portal-table tbody tr:hover { background:#1b2429; }
.portal-table td:first-child { color:var(--ink-mute); font-variant-numeric:tabular-nums; }
.portal-table .numeric { text-align:right; font-variant-numeric:tabular-nums; }
.portal-table a { color:var(--ink); text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--gold-deep); }
.portal-table a:hover { color:var(--gold); }
.portal-pages { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:20px; font-family:var(--ui); font-size:.85rem; }
.portal-pages a[aria-disabled=true] { opacity:.4; pointer-events:none; }
.portal-empty { border:1px dashed var(--line); padding:32px; text-align:center; color:var(--ink-soft); }
.world-card { display:grid; grid-template-columns:1fr 1fr; gap:36px; padding:36px; border:1px solid var(--line); border-top:2px solid var(--gold-deep); background:linear-gradient(135deg,#192429,#11181c); }
.world-card h2 { font:2.4rem/1.2 var(--display); margin:12px 0 16px; }
.world-card p { color:var(--ink-soft); line-height:1.7; }
.world-card .cta { margin-top:24px; }
.world-state { display:inline-flex; gap:8px; align-items:center; font:.8rem var(--ui); color:var(--ink-soft); }
.world-state::before { content:''; height:7px; width:7px; border-radius:50%; background:var(--ink-mute); }
.world-state[data-online=true]::before { background:#8fc397; box-shadow:0 0 12px #8fc39740; }
.character-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.character-heading h2 { font:2rem var(--display); margin:0 0 24px; overflow-wrap:anywhere; }
.portal-note { max-width:78ch; color:var(--ink-mute); font-size:.95rem; line-height:1.75; }
[hidden] { display:none!important; }
@media(max-width:640px) {
  .portal-panel,.world-card { padding:20px; }
  .world-card { grid-template-columns:1fr; gap:12px; }
  .portal-filters label { flex-basis:calc(50% - 18px); min-width:0; }
  .portal-filters .character-search { flex-basis:100%; }
  .portal-filters button { width:100%; }
  .portal-table th,.portal-table td { padding:14px 12px; }
  .portal-pages { flex-wrap:wrap; }
}

.hub-page[data-portal] .page-head { margin-bottom:24px; }
.hub-page[data-portal] .page-head h1 { font-size:clamp(2rem,4vw,3rem); margin-block:12px 18px; }

.boosted-card { border-top:2px solid var(--gold-deep); padding:36px; background:linear-gradient(135deg,#1d292d,#11181c); }
.boosted-card h2 { font-family:var(--display); font-size:clamp(1.7rem,3vw,2.5rem); margin:24px 0 12px; text-transform:capitalize; }
.event-calendar { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; margin:24px 0; font-family:var(--ui); }
.calendar-weekday { text-align:center; padding:12px 4px; color:var(--ink-mute); font-size:.8rem; }
.calendar-day { min-height:84px; padding:12px; border:1px solid var(--line); border-radius:3px; background:var(--surface); color:var(--ink-soft); }
.calendar-day small { display:block; margin-top:12px; color:var(--gold); font-size:.7rem; }
.calendar-day.has-event { border-color:var(--gold-deep); background:#24271e; }
.calendar-day.has-event:hover { border-color:var(--gold); }
.event-entry { scroll-margin-top:110px; }
.event-entry h2 { font-family:var(--display); margin:18px 0; }
.event-entry p { white-space:pre-line; overflow-wrap:anywhere; }
@media(max-width:640px) {
  .event-calendar { gap:3px; }
  .calendar-day { min-height:56px; padding:8px 4px; text-align:center; font-size:.85rem; }
  .calendar-day small { font-size:.55rem; margin-top:8px; }
  .calendar-weekday { font-size:.65rem; }
  .boosted-card { padding:24px; }
}

.support-form { display:grid; gap:20px; margin-block:24px; }
.support-form label { display:grid; gap:8px; font:.9rem var(--ui); }
.support-form input,.support-form select,.support-form textarea { min-width:0; width:100%; padding:12px; border:1px solid var(--line); border-radius:3px; background:#0d1317; color:var(--ink); font:1rem/1.6 var(--ui); }
.support-form textarea { resize:vertical; }
.support-form button { justify-self:start; }
.support-ticket { width:100%; display:block; text-align:left; background:var(--surface); color:var(--ink); padding:18px; border:1px solid var(--line); margin-top:8px; font:1rem/1.5 var(--ui); overflow-wrap:anywhere; cursor:pointer; }
.support-ticket:hover { border-color:var(--gold); }
.support-message { padding:20px; margin-block:16px; border-left:2px solid var(--line); background:#0d1317; }
.support-message[data-author=staff] { border-left-color:var(--gold); }
.support-message h3 { margin:0; font:1rem var(--ui); }
.support-message-text { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.7; }
#support-thread h2 { overflow-wrap:anywhere; }
#support-thread .portal-note { overflow-wrap:anywhere; }

#support-thread h2 { scroll-margin-top:110px; }

/* Polls: options as a plain list, the vote as a radio group, results as bars that never widen the page. */
.poll h2 { overflow-wrap:anywhere; }
.poll-options,.poll-results { list-style:none; padding:0; margin:20px 0; display:grid; gap:12px; }
.poll-options li { padding:12px 16px; border:1px solid var(--line); border-radius:3px; overflow-wrap:anywhere; }
.poll-results li { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 16px; align-items:baseline; }
.poll-label { overflow-wrap:anywhere; }
.poll-count { color:var(--ink-soft); font:.9rem var(--ui); white-space:nowrap; }
.poll-bar { grid-column:1 / -1; height:8px; border:1px solid var(--line); border-radius:2px; background:#0d1317; overflow:hidden; }
.poll-bar span { display:block; height:100%; background:var(--gold); }
.poll-form fieldset { border:0; padding:0; margin:20px 0 8px; display:grid; gap:10px; min-width:0; }
.poll-form legend { padding:0; margin-bottom:12px; color:var(--ink-soft); font:.9rem var(--ui); }
.poll-form label { display:flex; gap:12px; align-items:flex-start; padding:12px 16px; border:1px solid var(--line); border-radius:3px; cursor:pointer; overflow-wrap:anywhere; }
.poll-form label:hover,.poll-form label:focus-within { border-color:var(--gold); }
.poll-form input { margin-top:.35em; accent-color:var(--gold); flex:none; }
.poll-form .portal-status { margin:12px 0 0; }

/* RavoraWiki index: shelves of classes and kinds, each tile with the picture that stands for it. */
.shelf { margin-block:28px; }
.shelf h2 { margin:0 0 14px; padding-bottom:10px; border-bottom:1px solid var(--line); font:400 1.35rem var(--display); color:var(--gold); }
.shelf-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:12px; }
.shelf-tile { display:grid; grid-template-columns:64px minmax(0,1fr); grid-template-rows:auto auto; column-gap:12px; align-items:center; padding:12px 14px; text-decoration:none;
  border:1px solid var(--line); border-radius:6px; background:var(--surface); transition:border-color .15s ease,background-color .15s ease; }
.shelf-tile:hover, .shelf-tile:focus-visible { border-color:var(--gold); background:#1a2227; }
.shelf-picture { grid-row:1 / span 2; display:grid; place-items:center; width:64px; height:64px; }
.shelf-picture .sprite { transform-origin:center; max-width:64px; }
.shelf-tile strong { align-self:end; font:400 1.05rem/1.2 var(--display); color:var(--ink); text-transform:capitalize; }
.shelf-tile:hover strong { color:var(--gold-bright); }
.shelf-tile small { align-self:start; font:.72rem var(--ui); color:var(--ink-mute); }
.crumbs { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-block:4px 16px; font:.85rem var(--ui); color:var(--ink-mute); }
.crumbs a { color:var(--gold); text-decoration:none; } .crumbs a:hover { text-decoration:underline; text-underline-offset:4px; }
.crumbs strong { color:var(--ink); font-weight:500; text-transform:capitalize; }
.portal-table th .sort-link { color:inherit; text-decoration:none; } .portal-table th .sort-link:hover { color:var(--gold-bright); }
.portal-table th[aria-sort] .sort-link::after { content:" ▾"; }
.portal-table th[aria-sort="ascending"] .sort-link::after { content:" ▴"; }
@media (max-width:560px) { .shelf-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .shelf-tile { grid-template-columns:minmax(0,1fr); justify-items:center; text-align:center; padding:12px 8px; } .shelf-picture { grid-row:auto; } .shelf-tile strong { overflow-wrap:anywhere; } }
@media (prefers-reduced-motion:reduce) { .shelf-tile { transition:none; } }
.shelf-heading { margin:36px 0 18px; padding-bottom:10px; border-bottom:1px solid var(--line); font:400 1.35rem var(--display); color:var(--gold); }
