/* Shared text sizes, loaded after component styles on public and Studio pages. */
body { font-size: 16px; }
.site-header nav { font-size: 16px; }
.site-header .account-link { font-size: 15px; max-width: none; }
.site-header .brand small { font-size: 11px; line-height: 1.4; letter-spacing: .5px; }
.top-strip { height: auto; min-height: 34px; padding-block: 7px; gap: 10px; flex-wrap: wrap; }
.top-strip > div, .top-strip > span { font-size: 12px; letter-spacing: .3px; color: #c0c7d3; }
.top-strip .italy-mini { font-size: 11px; width: 28px; height: 16px; line-height: 16px; }
body .site-main .catalog-intro .eyebrow,
body .site-main .game-cover-wrap > .badge { font-size: 14px; }

body .site-main :is(.eyebrow, .breadcrumbs, .badge, .game-meta, .game-card-footer,
  .game-tabs span, .heading-count, .count-label, .progress-line, .file-info,
  .tiny-note, .checksum, .check-label, .form-message, .thread-heading-meta,
  .discussion-labels, .thread-label, .post-meta, .post-signature,
  .role-badge, .account-help-link, .forum-pagination, .profile-contribution details) {
  font-size: 14px; line-height: 1.65;
}
body .site-main :is(.prose, .post-body, .message p, .quiet, .empty-inline,
  .member-gate, .member-gate p, .forum-empty, .thread-heading > p,
  .community-hero p, .catalog-intro p, .side-panel p, .notice p,
  .guide-steps p, .game-info > p) { font-size: 16px; line-height: 1.8; }
body .site-main :is(.prose, .post-body) { font-size: 17px; color: #414c5e; }
body .site-main :is(label, legend) { font-size: 15px; line-height: 1.6; }
body .site-main :is(input:not([type=checkbox]):not([type=radio]), textarea, select) { font-size: 16px; }
body .site-main input::placeholder, body .site-main textarea::placeholder { font-size: 16px; color: #667184; opacity: 1; }
body .site-main :is(.button, .text-link, .text-button, .filter, .forum-tabs a,
  .forum-search .button, .thread-toolbar > a, .post-actions button, .post-actions a,
  .side-profile-link, .forum-rules-link, .profile-summary > a) { font-size: 15px; line-height: 1.5; }
body .site-main .button { min-height: 44px; white-space: normal; }
body .site-main :is(small, .form-bottom small, .extra-download small, .mini-request small,
  .guide-teaser small, .category-count span, .category-count small,
  .category-latest p, .category-latest time, .discussion-main > p,
  .discussion-main > p time, .discussion-numbers span, .discussion-numbers small,
  .discussion-last time, .post-author dl, .post-author > small, .post-actions > span,
  .forum-pagination > span, .profile-summary p, .avatar-choice span,
  .avatar-upload-row p, .public-profile-header p) { font-size: 14px; line-height: 1.65; }
body .site-main :is(.category-description p, .category-latest > a,
  .sidebar-topic strong, .welcome-card p, .board-stats > div,
  .public-profile-header .profile-bio, .profile-contribution > p) { font-size: 15px; line-height: 1.7; }
body .site-main :is(.category-description h3, .discussion-main h3, .profile-contribution h3) { font-size: 18px; line-height: 1.5; }
body .site-main :is(.discussion-numbers strong, .category-count strong) { font-size: 19px; }
body .site-main .forum-bar h2 { font-size: 20px; }
body .site-main .forum-bar > span { font-size: 14px; letter-spacing: .5px; color: #d0d5df; }
body .site-main :is(.sidebar-topic > span, .filter span, .checksum code,
  .screenshot-card figcaption, .screenshot-zoom) { font-size: 14px; line-height: 1.6; }
body .site-main .forum-side-card h2 { font-size: 22px; }
body .site-main .discussion-last a:not(.avatar-link) { font-size: 14px; max-width: 100%; }
body .site-main .post-author > strong { font-size: 16px; }
body .site-main .post-body blockquote { font-size: 16px; color: #505d70; }
body .site-main .post-body a { color: #b91d37; text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
body .site-main .forum-post { grid-template-columns: 170px minmax(0, 1fr); }
body .site-main .post-actions { flex-wrap: wrap; font-size: 14px; }
body .site-main .post-actions > span { color: #626d80; letter-spacing: .35px; }
body .site-main .post-actions button { min-height: 40px; }
body .site-main :is(.category-description, .category-latest, .discussion-main, .post-author) { min-width: 0; }
body .site-main :is(.category-description p, .category-latest p, .category-latest time,
  .discussion-labels, .discussion-main > p, .discussion-numbers, .discussion-last time,
  .post-meta, .post-signature, .form-bottom small, .empty-inline, .thread-heading-meta,
  .forum-pagination > span, .sidebar-topic small, .profile-contribution > p) { color: #5e6a7d; }
body .site-main .category-latest > a { -webkit-line-clamp: 3; }
.site-footer :is(.footer-brand p, .footer-links, .footer-bottom) { font-size: 14px; line-height: 1.7; }
.site-footer .footer-bottom { color: #aab5c8; }
.site-footer .footer-bottom span, .site-footer .footer-brand p { color: #aab5c8; }
.toast { font-size: 15px; line-height: 1.6; }

/* Staff identity comes from the server role, never from a nickname or message. */
.role-badge svg, .staff-mark svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }
body .site-main .role-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; max-width: 100%; font-weight: 600; }
body .site-main .role-badge.staff { background: #be2038; border-color: #be2038; color: #fff; }
body .site-main .role-badge.moderator { background: #28549b; border-color: #28549b; color: #fff; }
.staff-mark { display: inline-flex; vertical-align: middle; align-items: center; justify-content: center; width: 24px; height: 24px; margin-inline: 5px; border-radius: 5px; background: #be2038; color: #fff; flex-shrink: 0; }
.staff-mark.moderator { background: #28549b; }
.moderator-post { border-top: 2px solid #28549b; }

/* The palette expands in the form so it cannot cover text or other panels. */
.editor-tools { min-width: 0; }
body .site-main .editor-toolbar { flex-wrap: wrap; gap: 8px; padding: 10px; }
body .site-main .editor-toolbar button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 12px; font-size: 15px; line-height: 1.4; min-height: 44px; color: #3e4f67; }
body .site-main .editor-toolbar button span { font-size: inherit; }
body .site-main .editor-toolbar .emoji-toggle { margin-left: auto; }
body .site-main .editor-toolbar .emoji-toggle > span { font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', sans-serif; font-size: 22px; }
.emoji-toggle[aria-expanded=true] { background: #fff0f3; border-color: #c6243d; }
.emoji-picker { border: 1px solid #cdd4e0; background: #fff; padding: 14px; }
.emoji-picker-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.emoji-picker-heading strong { font-size: 15px; color: #424f63; }
.emoji-picker-heading > button { width: 40px; min-height: 40px; border: 1px solid #d5dce7; border-radius: 5px; background: #f6f8fb; font-size: 18px; color: #4d5b70; }
.emoji-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(44px, 1fr)); gap: 6px; max-width: 600px; }
.emoji-grid button { display: flex; align-items: center; justify-content: center; padding: 6px; min-width: 44px; min-height: 44px; border: 1px solid #e1e6ef; background: #f8f9fc; border-radius: 6px; cursor: pointer; }
.emoji-grid button span { font: 25px/1.2 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', sans-serif; }
.emoji-grid button:hover { background: #fff0f3; border-color: #c6243d; }
.emoji-picker[hidden] { display: none; }

/* Studio uses the same readable controls and supporting text. */
body.admin-page :is(.button, .text-link, .settings-tabs button, .item-actions button, .item-actions a) { font-size: 15px; min-height: 44px; }
body.admin-page :is(label, legend, .mod-body, .admin-member, .admin-file-row, .mail-connection) { font-size: 16px; line-height: 1.65; }
body.admin-page :is(input:not([type=checkbox]):not([type=radio]), textarea, select) { font-size: 16px; }
body.admin-page :is(small, .eyebrow, .admin-tip, .file-state, .public-badge, .draft-badge,
  .settings-status, .form-message, .staff-reply summary, .admin-file-row p,
  .settings-save p, .setting-toggle strong) { font-size: 14px; line-height: 1.65; }
body.admin-page .site-header nav a { font-size: 15px; }

@media (max-width: 760px) {
  .top-strip { padding-block: 7px; gap: 3px; }
  .top-strip > div, .top-strip > span { font-size: 11px; }
  .site-header { min-height: 88px; }
  .site-header > .brand { flex: 1 1 auto; min-width: 0; }
  .site-header > .brand > span { min-width: 0; }
  .site-header .brand img { flex-shrink: 0; }
  .site-header .brand small { max-width: 140px; white-space: normal; font-size: 10px; }
  .site-header .account-link { font-size: 14px; max-width: 105px; flex-shrink: 0; min-width: 0; }
  .site-header .account-link > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .site-header .account-link .user-icon { flex-shrink: 0; }
  .site-header .mobile-menu { min-width: 40px; min-height: 44px; flex-shrink: 0; }
  body:not(.admin-page) .site-header nav { top: 100%; }
  body .site-main :is(.prose, .post-body) { font-size: 16px; }
  body .site-main .forum-category-row { grid-template-columns: 36px minmax(0, 1fr) 72px; }
  body .site-main .discussion-row { grid-template-columns: 34px minmax(0, 1fr) 62px; }
  body .site-main .category-latest > a { white-space: normal; overflow-wrap: anywhere; }
  body .site-main .post-author { flex-wrap: wrap; gap: 10px; }
  body .site-main .post-author .role-badge { margin-left: auto; }
  body .site-main .editor-toolbar { gap: 6px; padding: 8px; }
  body .site-main .white-panel .reply-composer { padding: 18px 12px; }
  body .site-main .editor-toolbar button { padding-inline: 7px; gap: 4px; font-size: 14px; flex: 1 1 auto; }
  body .site-main .editor-toolbar .emoji-toggle { margin-left: 0; }
  .emoji-grid { max-height: 250px; overflow-y: auto; padding: 2px; }
  body .site-main .forum-pagination { flex-wrap: wrap; }
  body .site-main .forum-pagination > span { margin-left: 0; width: 100%; }
  .site-footer .footer-links { gap: 15px; }
  body.admin-page .site-header { flex-wrap: wrap; padding-block: 17px; }
  body.admin-page .site-header nav { display: flex; flex-wrap: wrap; position: static; width: 100%; gap: 14px; }
}
@media (max-width: 380px) {
  .site-header .account-link { max-width: 88px; }
}
@media (max-width: 960px) {
  body:not(.admin-page) .site-header .account-link { margin-left: auto; }
  body:not(.admin-page) .site-header .mobile-menu { display: block; min-width: 44px; min-height: 44px; padding: 5px 9px; font-size: 22px; border: 1px solid #444d5e; border-radius: 4px; background: #2b303c; color: #dae0eb; flex-shrink: 0; }
  body:not(.admin-page) .site-header nav { display: none; position: absolute; top: 100%; left: 0; right: 0; margin: 0; padding: 14px 5%; background: #222732; border-bottom: 1px solid #414b5d; box-shadow: 0 5px 18px #151d3030; z-index: 10; flex-direction: column; align-items: stretch; gap: 0; }
  body:not(.admin-page) .site-header nav.open { display: flex; }
  body:not(.admin-page) .site-header nav a { padding: 13px 0; font-size: 16px; }
  body:not(.admin-page) .site-header nav a.active:after { display: none; }
}
