/* Forum uses the category and discussion layout from the supplied prototype. */
.page-forum .forum-layout{display:grid;grid-template-columns:minmax(0,1fr) 292px;gap:18px;align-items:start}.page-forum .forum-stack,.page-forum .forum-side{display:flex;flex-direction:column;gap:16px;min-width:0}.page-forum .forum-stack>*+*{margin-top:0}.page-forum .page-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}.page-forum .page-head-actions{display:flex;gap:8px;flex-wrap:wrap}.page-forum .page-head-actions form{margin:0}.page-forum .button,#view-forum .button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-family:inherit;line-height:1.3;cursor:pointer}.page-forum .forum-actions select{min-height:30px;max-width:100%;padding:5px 8px;border:1px solid #dfe7eb;border-radius:5px;font-family:inherit;font-size:11px;background:white;color:#526879}.page-forum .forum-empty{padding:28px 20px;color:#7c929e;font-size:12px}.forum-empty p{margin:6px 0 16px}.forum-category-links{display:flex;flex-direction:column;padding:5px 0}.forum-category-links a{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;gap:10px;font-size:11px;border-bottom:1px solid #f0f4f6;color:#5c7e91}.forum-category-links a[aria-current]{background:#eef7f5;color:#31887d;font-weight:800}.forum-category-links small{color:#9aa7af}.page-forum .stat-grid b{font-size:22px}.page-forum .last-post img{width:28px;height:28px;object-fit:cover;border-radius:7px}.page-forum .last-post time{display:block;font-size:9px;color:#94a3ae}.page-forum .topic{min-width:0}.page-forum .topic>div:last-child{min-width:0}.page-forum .topic h3{overflow-wrap:anywhere}.page-forum .topic small{line-height:1.7}.page-forum .forum-row .badge{margin:2px 3px}.forum-tone-blue{background:#e9f3fa;color:#4d88ac}.forum-tone-gold{background:#fff3d2;color:#ba963f}.forum-tone-coral{background:#fff0e9;color:#cd806c}.forum-tone-violet{background:#f4eef9;color:#a181b8}.forum-feedback{padding:13px 18px;margin:0 0 18px;border:1px solid #cde4d9;border-radius:7px;background:#f0f8f3;color:#4e7e6a;font-size:12px}.forum-feedback.is-error{background:#fff4ee;border-color:#efd6c9;color:#aa6c55}.forum-feedback ul{margin:0;padding-left:18px}.forum-editor{max-width:900px;margin:auto}.forum-form{display:grid;gap:16px;padding:20px}.forum-form label{display:grid;gap:7px;font-size:12px;font-weight:700;color:#577284}.forum-form :is(input:not([type=checkbox]),textarea,select){width:100%;max-width:100%;padding:10px 12px;border:1px solid #d8e4e9;border-radius:5px;background:#fbfdfe;color:#39586a;font:12px/1.6 Arial,sans-serif}.forum-form textarea{resize:vertical;min-height:90px}.forum-form small{font-size:10px;font-weight:400;color:#91a2ad}.forum-form-actions{display:flex;justify-content:flex-end;align-items:center;gap:10px;flex-wrap:wrap}.forum-form-actions small{margin-right:auto}.forum-form>.button{justify-self:start}.forum-thread-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:8px 0 20px}.forum-thread-heading h1{font:900 25px/1.25 Nunito,Arial,sans-serif;color:#365a6f;margin:7px 0;overflow-wrap:anywhere}.forum-thread-heading p{color:#91a1ad;font-size:11px;margin:0}.forum-kicker{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:#759a9b;font-weight:800}.forum-posts{display:flex;flex-direction:column;gap:16px}.forum-post{display:grid;grid-template-columns:150px minmax(0,1fr);overflow:hidden;scroll-margin-top:20px}.forum-post-author{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 12px;background:#f7fafc;border-right:1px solid #e8eef2;font-size:12px}.forum-post-author img{width:60px;height:60px;object-fit:cover;border-radius:10px;margin-bottom:3px}.forum-post-author>a{font-weight:800;overflow-wrap:anywhere;max-width:100%}.forum-post-author small{font-size:10px;color:#8aa0ae}.forum-post-content{min-width:0;padding:18px 20px}.forum-post-content>header{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:10px;color:#98a7b1}.forum-post-body{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.85;color:#536d7e;margin:20px 0}.forum-post-tools{margin-top:14px;font-size:11px}.forum-post-tools summary,.forum-moderation summary{cursor:pointer;color:#62899a;font-weight:700}.forum-moderation>summary{padding:15px 20px}.forum-post-tools .forum-form{padding:15px 0}.forum-form label.forum-confirm{display:flex;align-items:center;gap:8px}.forum-confirm input{accent-color:#328e87}.forum-admin-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:0 0 20px}.forum-admin-toolbar p{font-size:12px;color:#8298a5}.forum-admin-toolbar a{white-space:nowrap}.forum-admin-category{border-bottom:1px solid #e9eff2}.forum-admin-category>summary{display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;padding:16px 20px;color:#4e758c;font-weight:700;font-size:12px}.forum-admin-category summary small{display:block;font-weight:400;font-size:10px;color:#96a5af;margin-top:4px}.forum-admin-category>summary>span:last-child{font-size:10px;color:#7c9b9e}.forum-admin-new{margin-top:24px}.forum-fields-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.page-forum :is(input,select,textarea,button,a):focus-visible,#view-forum :is(input,select,textarea,button,a):focus-visible{outline:2px solid #499b98;outline-offset:3px}


/* =========================================================
   LAJV — FORUM (forum.html)
   Allt nedan är avgränsat till body.page-forum och påverkar
   därför inga andra sidor som delar style.css.
   ========================================================= */
.page-forum {

  /* ---------- Hero ---------- */
  .fx-hero {
    position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) 300px;
    margin-bottom: 14px; border: 1px solid #c8e2e0; border-radius: 10px; box-shadow: var(--shadow);
    background: linear-gradient(115deg, #d9f0ed 0%, #e6f3f2 50%, #f8e9c5 100%);
  }
  .fx-hero::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background:
      radial-gradient(circle at 12% 15%, rgba(255,239,205,.85), transparent 40%),
      repeating-linear-gradient(45deg, transparent 0 10px, rgba(255,255,255,.08) 10px 11px);
  }
  .fx-hero-copy { position: relative; z-index: 2; padding: 22px 24px 20px; min-width: 0; }
  .fx-kicker { color: #9a6846; font-size: 9px; font-weight: 900; letter-spacing: .14em; }
  .fx-hero h1 { margin: 6px 0 8px; font: 900 34px/1.1 'Nunito', sans-serif; color: #4f4036; letter-spacing: -.8px; }
  .fx-hero h1 span { color: #b96545; }
  .fx-hero p { margin: 0; max-width: 520px; color: #78675a; font-size: 12.5px; line-height: 1.65; }
  .fx-hero-stats { display: flex; flex-wrap: wrap; gap: 8px 0; margin-top: 16px; }
  .fx-hero-stats div { padding: 0 18px; border-left: 1px dashed #cbb49a; }
  .fx-hero-stats div:first-child { padding-left: 0; border-left: 0; }
  .fx-hero-stats b { display: block; color: #a65e3f; font: 900 21px/1.1 'Nunito', sans-serif; }
  .fx-hero-stats small { color: #897565; font-size: 9px; font-weight: 800; letter-spacing: .05em; }
  .fx-hero-stats .hl b { color: #d4604f; }
  .fx-hero-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }


  .fx-hero-art { position: relative; z-index: 1; min-height: 190px; }
  .fx-hero-art .bubble {
    position: absolute; max-width: 170px; padding: 8px 12px; background: #fffaf0; color: #7a5a44;
    border-radius: 14px 14px 14px 3px; box-shadow: 0 3px 0 #e2cfae, 0 8px 16px rgba(120,90,50,.12);
    font: 800 11px/1.35 'Nunito', sans-serif;
  }
  .fx-hero-art .b1 { top: 22px; right: 120px; transform: rotate(-3deg); }
  .fx-hero-art .b2 { top: 74px; right: 22px; border-radius: 14px 14px 3px 14px; background: #fff; transform: rotate(2deg); }
  .fx-hero-art .b3 { top: 134px; right: 110px; background: #e4f4f1; box-shadow: 0 3px 0 #bddcd7, 0 8px 16px rgba(40,100,95,.1); transform: rotate(-2deg); }
  .fx-hero-art .leaf { position: absolute; color: #d18a4e; }
  .fx-hero-art .l1 { top: 14px; right: 24px; font-size: 22px; }
  .fx-hero-art .l2 { bottom: 16px; right: 26px; font-size: 18px; }
  @media (prefers-reduced-motion: no-preference) {
    .fx-hero-art .bubble { animation: fx-float 6s ease-in-out infinite; }
    .fx-hero-art .b2 { animation-delay: -2s; }
    .fx-hero-art .b3 { animation-delay: -4s; }
  }

  /* ---------- Verktygsrad ---------- */
  .fx-toolbar {
    position: sticky; top: 8px; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
    margin-bottom: 16px; padding: 8px 10px; background: rgba(255,255,255,.96); backdrop-filter: blur(6px);
    border: 1px solid #d5e0e6; border-radius: 9px; box-shadow: 0 4px 14px rgba(35,64,82,.09);
  }
  .fx-search { position: relative; flex: 1 1 260px; min-width: 0; display: flex; align-items: center; gap: 6px; padding: 0; background: none; border: 0; }
  .fx-search-icon { position: absolute; left: 11px; top: 50%; translate: 0 -52%; color: #8b9aa5; font-size: 18px; pointer-events: none; }
  .fx-search input[type="search"] { flex: 1; min-width: 0; min-height: 36px; padding: 6px 12px 6px 34px; border: 1px solid #d4e1e6; border-radius: 6px; background: #fbfcfd; font-size: 12px; }
  .fx-search input[type="search"]:focus { border-color: #8bc7ca; background: #fff; box-shadow: 0 0 0 3px #e3f5f3; }
  .fx-search .button { min-height: 36px; padding: 0 14px; }
  .fx-chips { display: flex; gap: 4px; padding: 3px; background: #eef4f7; border-radius: 8px; }
  .fx-chips button { display: inline-flex; align-items: center; gap: 5px; padding: 6px 13px; border: 0; border-radius: 6px; background: transparent; color: #5d7788; font-size: 11px; font-weight: 800; transition: background .15s, color .15s; }
  .fx-chips button:hover { color: #2c7299; }
  .fx-chips button.on { background: #fff; color: #205b7e; box-shadow: 0 1px 3px rgba(35,64,82,.15); }
  .fx-fold { padding: 7px 12px; border: 1px solid #cddfe5; border-radius: 6px; background: linear-gradient(#fff, #f1f8f6); color: #47788f; font-size: 11px; font-weight: 800; }
  .fx-fold:hover { border-color: #8bc7ca; }
  .fx-count { margin-left: auto; color: #93a0aa; font-size: 10px; font-weight: 700; }
  .fx-search input:focus-visible, .fx-chips button:focus-visible, .fx-fold:focus-visible,
  .fx-toggle:focus-visible, .fx-hero .button:focus-visible, .fx-new-card .button:focus-visible {
    outline: 2px solid var(--teal); outline-offset: 2px;
  }

  /* ---------- Kategorikort ---------- */
  .home-main { gap: 18px; }
  .fcat { --cat: #2c7299; border-radius: 10px; transition: box-shadow .2s; }
  .fcat:hover { box-shadow: 0 2px 0 rgba(35,64,82,.035), 0 10px 24px rgba(35,64,82,.09); }
  .fcat .panel-heading {
    position: relative; min-height: 46px; gap: 10px; padding: 0 8px 0 16px;
    background: linear-gradient(100deg, color-mix(in srgb, var(--cat) 11%, #fff), #fff 70%);
    border-bottom: 1px solid color-mix(in srgb, var(--cat) 18%, #e3e9ed);
    color: color-mix(in srgb, var(--cat) 70%, #2a3a48); font-size: 11px;
  }
  .fcat .panel-heading::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--cat); }
  .cat-title { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
  .cat-glyph {
    display: inline-grid; place-items: center; width: 28px; height: 28px; flex: 0 0 auto; border-radius: 8px;
    background: var(--cat); color: #fff; font-style: normal; font-size: 14px; letter-spacing: 0;
    box-shadow: inset 0 1px rgba(255,255,255,.3), 0 2px 0 color-mix(in srgb, var(--cat) 60%, #000 0%);
  }
  .fcat .cat-sub { margin-left: auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .fx-hot .panel-heading a { margin-left: auto; }
  .fx-toggle { flex: 0 0 auto; width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 6px; background: transparent; color: #7d93a1; font-size: 16px; }
  .fx-toggle:hover { background: rgba(35,64,82,.07); color: var(--cat); }
  .fx-toggle span { display: block; transition: transform .2s; }
  .fcat.collapsed .fx-toggle span { transform: rotate(-90deg); }
  .fcat.collapsed > .forum-head, .fcat.collapsed > .forum-row, .fcat.collapsed > .legend { display: none; }
  .fcat.collapsed .panel-heading { border-bottom: 0; }

  /* ---------- Rader ---------- */
  .forum-head, .forum-row { grid-template-columns: minmax(0, 1fr) 70px 78px 200px; gap: 14px; padding-left: 16px; padding-right: 16px; }
  .forum-head { min-height: 30px; background: #f6fafb; }
  .forum-row { position: relative; min-height: 66px; border-left: 3px solid transparent; padding-left: 13px; }
  .forum-row.unread { border-left-color: var(--cat, var(--coral)); background: linear-gradient(90deg, color-mix(in srgb, var(--cat, #e0705f) 7%, #fff), #fffdf8 40%); }
  .forum-row.unread:hover { background: color-mix(in srgb, var(--cat, #e0705f) 9%, #fff); }
  .forum-row.flash { animation: fx-flash 1.6s ease; }
  .topic { gap: 12px; }
  .topic-icon { width: 38px; height: 38px; border-radius: 10px; font-size: 16px; }
  .fcat .topic-icon:not(.lock) { background: color-mix(in srgb, var(--cat) 13%, #fff); color: var(--cat); }
  .fx-hot .topic-icon.hot { background: #fde7e1; color: #e0705f; }
  .fx-hot .topic-icon.pin { background: #fff1cc; color: #c9961f; }
  .fx-hot .topic-icon.q { background: #e4f4ea; color: #3e9966; }
  .fx-hot .topic-icon:not(.hot):not(.pin):not(.q):not(.lock) { background: #e1eef6; color: #2c7299; }
  .topic h3 { font-size: 13.5px; }
  .topic h3 a { display: inline; }
  .topic h3 a:focus-visible, .last-post a:focus-visible, .who-list a:focus-visible, .fx-unread-list a:focus-visible, .tag-cloud a:focus-visible {
    outline: 2px solid var(--teal); outline-offset: 2px; border-radius: 3px;
  }
  .forum-row .topic p { margin-top: 2px; font-size: 11px; line-height: 1.45; }
  .topic small { font-size: 10px; margin-top: 2px; }
  .forum-row .num { font-size: 15px; color: #3f6a82; }
  .forum-row.read .num { color: #7f95a3; }
  .num small { font-size: 9px; }
  .last-post { gap: 9px; font-size: 10.5px; }
  .last-post .tiny-avatar { width: 32px; height: 32px; font-size: 13px; border: 2px solid #fff; outline: 1px solid #d9e3e8; border-radius: 8px; }
  .forum-row .last-post a { font-size: 11px; }
  .legend { padding: 8px 16px; }

  /* ---------- Tomt läge ---------- */
  .fx-empty { padding: 34px 20px; text-align: center; background: #fff; border: 1px dashed #bcd3da; border-radius: 10px; }
  .fx-empty[hidden] { display: none; }
  .fx-empty-ico { display: inline-grid; place-items: center; width: 54px; height: 54px; margin-bottom: 6px; border-radius: 14px; background: #e4f2f1; color: #2e9e99; font-size: 28px; }
  .fx-empty h3 { margin: 0 0 3px; font: 900 17px 'Nunito', sans-serif; color: #2e4f65; }
  .fx-empty p { margin: 0 0 12px; color: #8a98a2; font-size: 12px; }

  /* ---------- Sidokolumn ---------- */
  .fx-new-card { border: 0; background: linear-gradient(135deg, #f7a595, #e0705f); color: #fff; }
  .fx-new-body { padding: 16px; }
  .fx-new-body b { display: block; font: 900 17px 'Nunito', sans-serif; }
  .fx-new-body p { margin: 4px 0 12px; font-size: 11.5px; line-height: 1.5; opacity: .93; }
  .fx-new-card .button-coral { background: #fff; color: #c9503f; border-color: #fff; }
  .fx-new-card .button-coral:hover { color: #b13f2f; }
  .fx-unread-list { list-style: none; margin: 0; padding: 0; }
  .fx-unread-list li { border-bottom: 1px solid #f0f3f5; }
  .fx-unread-list li:last-child { border-bottom: 0; }
  .fx-unread-list a { display: flex; align-items: center; gap: 9px; padding: 8px 12px; color: inherit; }
  .fx-unread-list a:hover { background: #f5fafb; }
  .fx-unread-list .tiny-avatar { width: 30px; height: 30px; font-size: 12px; border-radius: 7px; }
  .fx-ul-txt { min-width: 0; flex: 1; }
  .fx-ul-txt b, .fx-ul-txt small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .fx-ul-txt b { color: #34607a; font: 800 11.5px 'Nunito', sans-serif; }
  .fx-ul-txt small { color: #9aa7af; font-size: 9.5px; }
  .fx-unread-list .fx-ul-empty { padding: 14px; text-align: center; color: #93a0aa; font-size: 11px; }
  .tag-cloud a { padding: 1px 3px; border-radius: 4px; }
  .tag-cloud a:hover { background: #fdeeea; }
  .panel-heading small { letter-spacing: 0; font-weight: 500; }

}

/* Keyframes för forumet (kan inte ligga nästlade) */
@keyframes fx-float { 0%,100% { translate: 0 0; } 50% { translate: 0 -5px; } }
@keyframes fx-flash { 0%,40% { background: #fff1c2; } 100% { background: transparent; } }


/* =========================================================
   LAJV — FORUM, UNDERSIDOR (kategori.html, trad.html, ny-trad.html)
   Fortfarande avgränsat till .page-forum.
   ========================================================= */
.page-forum {

  /* ---------- Kategorisida ---------- */
  .fx-cat-hero .fx-hero-art { display: grid; place-items: center; min-height: 150px; }
  .fx-cat-hero .cat-big {
    display: grid; place-items: center; width: 92px; height: 92px; border-radius: 24px 24px 24px 8px; rotate: -4deg;
    background: var(--cat, #2c7299); color: #fff; font: 900 44px 'Nunito', sans-serif;
    box-shadow: 0 4px 0 color-mix(in srgb, var(--cat, #2c7299) 70%, #000), 0 12px 24px rgba(35,64,82,.18);
  }
  .fx-cat-hero { background: linear-gradient(115deg, color-mix(in srgb, var(--cat, #2c7299) 16%, #fff) 0%, #f4f9fa 55%, #f8f1de 100%); border-color: color-mix(in srgb, var(--cat, #2c7299) 25%, #d9e2e7); }
  .fx-cat-hero .fx-kicker { color: var(--cat, #2c7299); }
  .fx-cat-hero h1 { color: #2e4f65; }
  .fx-cat-hero p { color: #647a89; }
  .fx-cat-hero .fx-hero-stats b { color: var(--cat, #2c7299); }
  .fx-cat-hero .fx-hero-stats div { border-left-color: #cfdde3; }
  .fx-select { display: inline-flex; align-items: center; gap: 7px; color: #7b8795; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
  .fx-select select { min-height: 36px; padding: 5px 10px; border: 1px solid #d4e1e6; border-radius: 6px; background: #fbfcfd; color: #4c6577; font: 600 12px 'DM Sans', Arial, sans-serif; text-transform: none; letter-spacing: 0; outline: 0; }
  .fx-select select:focus-visible { border-color: #8bc7ca; box-shadow: 0 0 0 3px #e3f5f3; }
  .fx-more { padding: 12px; text-align: center; border-top: 1px solid #edf0f2; background: #fbfcfd; }
  .fx-lockednote { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 6px; background: #eef1f3; color: #6f8290; font-size: 11px; font-weight: 800; }
  .fx-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
  .fx-tag { padding: 0 7px; border-radius: 9px; background: #eef8f6; border: 1px solid #d8e8e9; color: #4c8b88; font-size: 9px; font-weight: 800; line-height: 15px; }
  .fx-sidenav { padding: 4px 0 8px; max-height: 420px; overflow-y: auto; }
  .fx-sidegroup { padding: 9px 13px 3px; color: var(--cat); font: 900 9px 'DM Sans', sans-serif; letter-spacing: .09em; text-transform: uppercase; }
  .fx-sidenav a { display: flex; align-items: center; gap: 9px; padding: 6px 13px; border-left: 3px solid transparent; color: #526779; font-size: 11.5px; font-weight: 700; }
  .fx-sidenav a i { flex: 0 0 22px; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; background: color-mix(in srgb, var(--cat) 13%, #fff); color: var(--cat); font-style: normal; font-size: 11px; }
  .fx-sidenav a:hover { background: #f3f8fa; }
  .fx-sidenav a.on { background: color-mix(in srgb, var(--cat) 9%, #fff); border-left-color: var(--cat); color: #2e4f65; }
  .fx-sidenav a:focus-visible, .fx-quote:focus-visible, .fx-like:focus-visible, .fx-fmt button:focus-visible, .fx-tabs button:focus-visible, .fx-back:focus-visible, .fx-postno:focus-visible {
    outline: 2px solid var(--teal); outline-offset: 2px; border-radius: 4px;
  }
  .fx-select select:focus-visible { outline: 2px solid var(--teal); outline-offset: 1px; }

  /* ---------- Tråd ---------- */
  .fx-thread-head { margin-bottom: 0; }
  .fx-back { font-size: 10px; font-weight: 800; letter-spacing: 0; }
  .fx-thread-title { padding: 16px 18px 16px; background: linear-gradient(180deg, color-mix(in srgb, var(--cat) 5%, #fffdf6), #fff 70%); }
  .fx-badges { display: flex; gap: 4px; margin-bottom: 6px; }
  .fx-badges:empty { display: none; }
  .fx-thread-title h1 { margin: 0; font: 900 27px/1.2 'Nunito', sans-serif; color: #2b4a60; letter-spacing: -.4px; overflow-wrap: anywhere; }
  .fx-meta { margin: 6px 0 0; color: #8a98a2; font-size: 11px; }
  .fx-meta a { font-weight: 800; }
  .fx-thread-actions { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 8px; }
  .fx-posts { display: flex; flex-direction: column; gap: 12px; margin-top: 12px; }
  .fx-posts > div { display: flex; flex-direction: column; gap: 12px; }
  .fx-note { margin: 0; padding: 8px 12px; border: 1px dashed #cbdde3; border-radius: 8px; background: #f6fafb; color: #7d93a1; font-size: 11px; text-align: center; }
  .fx-post { display: grid; grid-template-columns: 138px minmax(0, 1fr); background: #fff; border: 1px solid #d9e2e7; border-radius: 10px; box-shadow: var(--shadow); overflow: hidden; scroll-margin-top: 70px; }
  .fx-post.op { border-color: color-mix(in srgb, var(--cat, #2c7299) 35%, #d9e2e7); box-shadow: 0 2px 0 rgba(35,64,82,.035), 0 8px 20px rgba(35,64,82,.07); }
  .fx-post.op .fx-author { background: linear-gradient(180deg, color-mix(in srgb, var(--cat, #2c7299) 11%, #fff), #f7fafb); }
  .fx-author { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 16px 10px; background: #f7fafb; border-right: 1px solid #e8eef1; text-align: center; min-width: 0; }
  .fx-author .tiny-avatar { width: 56px; height: 56px; font-size: 24px; border-radius: 12px; border: 3px solid #fff; outline: 1px solid #d9e3e8; box-shadow: 0 3px 7px #cfdce2; }
  .fx-author-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; font: 800 12.5px 'Nunito', sans-serif; color: #34607a; }
  .fx-author .mem-flag { margin: 0; }
  .fx-op-tag { padding: 0 7px; border-radius: 9px; background: #e4f2f1; color: #2e8a85; font-size: 9px; font-weight: 800; line-height: 16px; }
  .fx-postbody { display: flex; flex-direction: column; min-width: 0; }
  .fx-posthead { display: flex; justify-content: space-between; gap: 10px; padding: 9px 16px; border-bottom: 1px solid #eef2f4; color: #98a5ad; font-size: 10px; }
  .fx-postno { color: #9db0bb; font-weight: 800; }
  .fx-text { flex: 1; padding: 14px 16px; color: #43596a; font: 600 13.5px/1.7 'Nunito', sans-serif; overflow-wrap: anywhere; }
  .fx-text p { margin: 0 0 10px; }
  .fx-text p:last-child { margin-bottom: 0; }
  .fx-text ul { margin: 0 0 10px; padding-left: 20px; }
  .fx-text li { margin-bottom: 3px; }
  .fx-text blockquote { margin: 0 0 10px; padding: 7px 12px; border-left: 3px solid color-mix(in srgb, var(--cat, #2c7299) 50%, #fff); border-radius: 0 6px 6px 0; background: #f4f8fa; color: #5f7686; font-size: 12.5px; }
  .fx-text a { text-decoration: underline; }
  .fx-postfoot { display: flex; gap: 6px; padding: 8px 12px; border-top: 1px solid #eef2f4; background: #fbfcfd; }
  .fx-like, .fx-quote { display: inline-flex; align-items: center; gap: 5px; padding: 4px 11px; border: 1px solid #cddfe5; border-radius: 12px; background: #fff; color: #5d7788; font: 800 10.5px 'DM Sans', sans-serif; transition: background .15s, border-color .15s; }
  .fx-like:hover { background: #fde7e1; border-color: #eab0a5; color: #d9606e; }
  .fx-like.on { background: #fde7e1; border-color: #e8a79c; color: #d9606e; }
  .fx-quote:hover { background: #e3f5f3; border-color: #8bc7ca; color: #2e7594; }
  .fx-post.is-new .fx-text { animation: fx-new-bg 2.4s ease; }

  .fx-reply { margin-top: 14px; scroll-margin-top: 70px; }
  .fx-locked-box { margin-top: 14px; }
  .fx-locked-in { display: flex; gap: 12px; align-items: center; padding: 14px 16px; background: #f6f8f9; font-size: 12px; color: #6f8290; }
  .fx-locked-in > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: #e9eef1; font-size: 18px; }
  .fx-locked-in b { color: #4b6578; }
  .fx-locked-in p { margin: 2px 0 0; }
  .fx-facts { padding: 4px 14px 8px; }
  .fx-facts dd a { font-weight: 800; }

  /* ---------- Formulär (svara + ny tråd) ---------- */
  .fx-form { display: flex; flex-direction: column; gap: 18px; padding: 16px 18px 0; background: linear-gradient(180deg, #fffdf6, #fff 40%); }
  .fx-form .form-field { display: flex; flex-direction: column; gap: 6px; }
  .fx-form label { display: flex; align-items: center; gap: 8px; color: #3f5a6c; font: 900 12px 'Nunito', sans-serif; }
  .fx-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .fx-step { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--cat, #2c7299); color: #fff; font: 900 11px 'Nunito', sans-serif; }
  .fx-step.light { background: rgba(255,255,255,.28); margin-right: 6px; }
  .fx-form input[type="text"], .fx-form select, .fx-form textarea {
    width: 100%; min-height: 40px; padding: 9px 12px; border: 1px solid #d4e1e6; border-radius: 6px; background: #fff;
    color: var(--ink); font: 600 13px 'DM Sans', Arial, sans-serif; outline: 0; transition: border-color .15s, box-shadow .15s;
  }
  .fx-form textarea { min-height: 120px; resize: vertical; line-height: 1.6; border-radius: 0 0 6px 6px; }
  .fx-form select { cursor: pointer; }
  .fx-form input:hover, .fx-form select:hover, .fx-form textarea:hover { border-color: #bcd3da; }
  .fx-form input:focus, .fx-form select:focus, .fx-form textarea:focus { border-color: #8bc7ca; box-shadow: 0 0 0 3px #e3f5f3; }
  .fx-form .form-field.invalid input, .fx-form .form-field.invalid select, .fx-form .form-field.invalid textarea { border-color: #e8a79c; background: #fff9f8; box-shadow: 0 0 0 3px #fdeae6; }
  .fx-field-foot { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
  .fx-field-foot .field-error { flex: 1; }
  .fx-form .form-field.invalid .field-hint { display: none; }
  .fx-form .form-field > .field-error { display: none; }
  .fx-form .form-field.invalid > .field-error, .fx-form .form-field.invalid .fx-field-foot .field-error { display: block; }
  .fx-counter { flex: 0 0 auto; margin-left: auto; color: #98a5ad; font-size: 10px; font-weight: 700; }
  .fx-fmt { display: flex; gap: 4px; padding: 6px; border: 1px solid #d4e1e6; border-bottom: 0; background: #f3f8fa; }
  .fx-form .fx-fmt:first-of-type { border-radius: 6px 6px 0 0; }
  .fx-fmt button { min-width: 32px; height: 30px; padding: 0 9px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: #4a6678; font-size: 12px; }
  .fx-fmt button:hover { background: #fff; border-color: #cddfe5; }
  .fx-tabs { display: flex; gap: 2px; }
  .fx-tabs button { padding: 7px 14px; border: 1px solid #d4e1e6; border-bottom: 0; border-radius: 6px 6px 0 0; background: #f3f8fa; color: #6b8190; font-size: 11px; font-weight: 800; }
  .fx-tabs button.on { background: #fff; color: #205b7e; }
  .fx-write .fx-fmt { border-radius: 0 6px 0 0; margin-top: -1px; }
  .fx-preview { min-height: 190px; padding: 14px 16px; border: 1px solid #d4e1e6; border-radius: 0 6px 6px 6px; background: #fff; color: #43596a; font: 600 13.5px/1.7 'Nunito', sans-serif; overflow-wrap: anywhere; }
  .fx-preview[hidden], .fx-write[hidden], .fx-discard[hidden], .fx-formerr[hidden], .fx-empty[hidden], .fx-more[hidden] { display: none; }
  .fx-preview h3 { margin: 0 0 10px; font: 900 18px 'Nunito', sans-serif; color: #2b4a60; }
  .fx-preview p { margin: 0 0 10px; }
  .fx-preview blockquote { margin: 0 0 10px; padding: 7px 12px; border-left: 3px solid #cfe1e8; background: #f4f8fa; border-radius: 0 6px 6px 0; }
  .fx-preview-empty { color: #98a5ad; font-style: italic; }
  .fx-form-foot { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 -18px; padding: 12px 18px; border-top: 1px solid #edf0f2; background: #f7fafb; }
  .fx-form-foot .button { padding: 10px 18px; font-size: 12px; }
  .fx-form-foot .button:last-child { margin-left: auto; }
  .fx-form-foot .button:disabled { opacity: .6; cursor: wait; transform: none; }
  .fx-formerr { padding: 10px 12px; border: 1px solid #e8a79c; border-radius: 6px; background: #fff3f1; color: #b64a3d; font-size: 12px; font-weight: 700; }
  .fx-discard { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid #f0cfc9; border-radius: 8px; background: #fff7f5; color: #8a4b42; font-size: 12px; font-weight: 700; }
  .fx-discard span { flex: 1 1 160px; }
  .fx-tips b { color: #3f6a82; }
  .fx-form select:focus-visible, .fx-form input:focus-visible, .fx-form textarea:focus-visible { outline: 2px solid var(--teal); outline-offset: 1px; }
  .fx-form .field-error { color: #d4604f; font-size: 11px; font-weight: 700; }
  .fx-form .field-hint { color: #9aa7af; font-size: 10.5px; }

}

/* Behövs utanför nästlingen (får inte ligga i en regel) */
@keyframes fx-new-bg { 0%,35% { background: #fff6d6; } 100% { background: #fff; } }

/* Integration with the existing Playarea shell and server-rendered forum. */
.page-forum .forum-surface{padding-top:16px;--cat:#2c7299}
.page-forum .forum-stack{gap:16px}.page-forum .fx-hero{margin-bottom:18px}
.page-forum .fx-toolbar .fx-search{margin:0}.page-forum .fx-toolbar select{min-height:36px}
.page-forum .fx-chips a{display:inline-flex;align-items:center;gap:5px;padding:6px 13px;border-radius:6px;color:#5d7788;font-size:11px;font-weight:800}
.page-forum .fx-chips a.on{background:#fff;color:#205b7e;box-shadow:0 1px 3px #23405226}
.page-forum .recent-thread{display:block;padding:12px 14px;border-bottom:1px solid #eef2f4}
.page-forum .recent-thread:last-child{border:0}.page-forum .recent-thread:hover{background:#fafdfd}
.page-forum .recent-thread b{display:block;font:800 13px/1.4 Nunito,Arial,sans-serif;overflow-wrap:anywhere}
.page-forum .recent-thread small{display:block;color:#94a3ae;font-size:10px;margin-top:5px}
.page-forum .forum-plain-text{white-space:pre-wrap}
.page-forum .fx-author img{object-fit:cover}
.page-forum .fx-postbody .forum-post-tools{padding:0 16px 14px}
.page-forum .fx-form{padding-bottom:18px}
.page-forum .forum-text-preview{white-space:pre-wrap;overflow-wrap:anywhere;padding:16px;border:1px solid #d4e1e6;border-radius:6px;min-height:100px}
.page-forum [hidden]{display:none!important}
.page-forum .forum-editor-layout{margin-bottom:24px}
.page-forum .forum-category-section>summary{cursor:pointer;list-style:none}
.page-forum .forum-category-section>summary::-webkit-details-marker{display:none}
.page-forum .forum-category-section>summary:after{content:"▾";font-size:16px;margin-left:10px}
.page-forum .forum-category-section:not([open])>summary:after{content:"▸"}
.page-forum .forum-title-highlight{position:relative;display:inline-block;color:#278f89;isolation:isolate}
.page-forum .forum-title-highlight:before{content:"";position:absolute;z-index:-1;left:-5px;right:-5px;bottom:1px;height:10px;background:#f7d986;border-radius:5px 3px 7px 4px;transform:rotate(-3deg)}
.page-forum .forum-title-highlight:after{content:"✦";position:absolute;top:-9px;right:-16px;color:#dba747;font-size:18px}
.page-forum .fx-hero h1{line-height:1.25}
.page-forum .fx-thread-title{margin-bottom:16px}
.page-forum .forum-form.fx-form>label{display:grid;gap:7px}.page-forum .fx-thread-title>div>p{font-size:11px;color:#8a98a2}.page-forum .fx-facts dt{font-size:10px;color:#8a98a2;margin-top:12px}.page-forum .fx-facts dd{margin:3px 0 12px;font-size:12px;color:#536d7e}.page-forum .forum-title-highlight{color:#527c7b!important}

/* Shared panel headings match Playarea's existing light gradients. */
.page-forum .panel .panel-heading,
.page-forum .fcat .panel-heading{
 min-height:35px;padding:0 12px;background:linear-gradient(#fff,#f7f9fa);
 border-bottom:1px solid #e3e9ed;color:#52687a;font-size:10px;font-weight:900;
 letter-spacing:.065em;text-shadow:none
}
.page-forum .fcat .panel-heading:before{content:none}
.page-forum .fcat .panel-heading small{color:#94a1aa;font-size:9px;font-weight:500;letter-spacing:0}
.page-forum .forum-discover-intro{margin:0;padding:13px 14px 5px;font-size:11px;color:#8497a2}
.page-forum .forum-discover .forum-category-links{padding:7px 9px 10px;gap:5px}
.page-forum .forum-discover .forum-category-links a{justify-content:flex-start;gap:10px;padding:10px 9px;border:1px solid transparent;border-radius:7px;background:linear-gradient(110deg,#fbfdfd,#f5f9fa);transition:background .15s,border-color .15s}
.page-forum .forum-discover .forum-category-links a:hover,
.page-forum .forum-discover .forum-category-links a[aria-current]{background:linear-gradient(110deg,#e1f2ec,#f4faf7);border-color:#cde3dc}
.page-forum .forum-discover-icon{display:grid;place-items:center;flex:0 0 33px;width:33px;height:33px;border-radius:10px 10px 10px 4px;font-size:17px}
.page-forum .forum-discover-copy{flex:1;min-width:0}
.page-forum .forum-discover-copy b{display:block;font:800 13px/1.4 Nunito,Arial,sans-serif;color:#426a7d}
.page-forum .forum-discover-copy small{display:block;margin-top:3px;font-size:9px;font-weight:400;color:#94a3ae}
.page-forum .forum-discover-arrow{color:#91b5ba;font-size:21px}
.page-forum .fx-hero,.page-forum .fx-cat-hero{background:linear-gradient(120deg,#e1f2ec,#edf5f6 60%,#fff1d0);border-color:#cddfe0}
.page-forum .fx-hero:before{content:none}
.page-forum .fx-hero h1{color:#31566a}
.page-forum .fx-hero p{color:#68808d}
.page-forum .fx-kicker{color:#65918e}
.page-forum .fx-hero-stats b{color:#278f89}
.page-forum .fx-hero-stats small{color:#7b8795}
.page-forum .fx-hero-stats div{border-left-color:#cddfe0}

.page-forum .forum-group>.panel-heading{min-height:43px;background:linear-gradient(#fff,#f7f9fa);padding:7px 12px}
.page-forum .forum-group-name{display:flex;align-items:center;gap:9px;font:900 12px Nunito,Arial,sans-serif;color:#426a7d;letter-spacing:.03em}
.page-forum .forum-group-name i{display:grid;place-items:center;width:27px;height:27px;border-radius:7px;background:linear-gradient(145deg,#e1f2ec,#edf5f6);color:#278f89;font-style:normal;font-size:15px}
.page-forum .forum-group .topic p{margin:4px 0 0;font-size:10px;color:#8a99a3;line-height:1.6}
.page-forum .forum-group .last-post small{display:block;margin-top:4px;font-size:9px;color:#94a3ae}

.page-forum .forum-group-name{font:700 11px/1.5 'DM Sans',Arial,sans-serif;color:#6b818f;letter-spacing:.025em}
.page-forum .forum-group-name i{width:23px;height:23px;font-size:12px;border-radius:6px;background:linear-gradient(#f4f9f8,#eaf3f1);color:#6f9992}
.page-forum .forum-group>.panel-heading{min-height:35px;padding:5px 12px}

/* Restrained forum presentation. */
.page-forum .forum-surface{--shadow:0 1px 2px rgba(35,64,82,.025)}
.page-forum .fx-hero,.page-forum .fx-cat-hero{
 grid-template-columns:minmax(0,1fr);border-radius:7px;
 background:linear-gradient(115deg,#f0f6f4,#f7f9f8 65%,#faf8f0);border-color:#dce5e3;box-shadow:none
}
.page-forum .fx-hero-copy{padding:19px 22px}
.page-forum .fx-hero .fx-hero-art{display:none}
.page-forum .fx-hero h1{font-size:25px;font-weight:800;letter-spacing:-.4px;margin:6px 0 9px;color:#496575}
.page-forum .forum-title-highlight:before,.page-forum .forum-title-highlight:after{content:none}
.page-forum .fx-kicker{color:#7c908e;font-size:9px;font-weight:600;letter-spacing:.07em}
.page-forum .fx-hero p{font-size:12px;color:#74858e;max-width:620px}
.page-forum .fx-hero-stats{margin-top:13px}
.page-forum .fx-hero-stats b{font-size:17px;font-weight:700;color:#67837f}
.page-forum .fx-hero-stats small{font-size:8px;font-weight:500;letter-spacing:.03em;color:#81918f}
.page-forum .fx-hero-stats div{border-left:1px solid #e0e8e5}
.page-forum .fx-hero-stats div:first-child{border:0}
.page-forum .fx-hero-actions{margin-top:14px}
.page-forum .fx-new-card{background:linear-gradient(#fafcfb,#f2f7f5);border-color:#dce6e2}
.page-forum .fx-new-body{padding:15px;color:#6f8580}
.page-forum .fx-new-body b{font-size:14px;font-weight:700;color:#5d7c74}
.page-forum .fx-new-body p{font-size:11px;color:#82958e}
.page-forum .fx-toolbar{position:static;box-shadow:none;backdrop-filter:none;border-color:#dfe6e9;background:#fcfdfd;padding:8px}
.page-forum .fx-chips{background:#f2f5f6;border-radius:5px}
.page-forum .fx-chips a{font-weight:500;padding:5px 10px;color:#7b8d97}
.page-forum .fx-chips a.on{box-shadow:none;background:white;color:#557a80}
.page-forum .forum-surface .panel,.page-forum .fx-post{box-shadow:none;border-radius:6px;border-color:#dfe6e9}
.page-forum .forum-surface .panel:hover,.page-forum .fx-post.op{box-shadow:none}
.page-forum .panel .panel-heading,.page-forum .fcat .panel-heading{font-weight:600;letter-spacing:.035em;color:#718491;background:linear-gradient(#fdfefe,#f6f8f9)}
.page-forum .forum-surface .block-title h2{font:700 14px/1.5 Nunito,Arial,sans-serif;color:#687f8d}
.page-forum .forum-surface .block-title h2 i{width:20px;height:20px;font-size:11px;background:#eef3f5;color:#7d96a3}
.page-forum .forum-group-name{font-weight:600;color:#748793}
.page-forum .forum-group-name i{background:#f1f5f4;font-size:11px;color:#829b95}
.page-forum .forum-row{background:#fff;border-color:#eff2f4}
.page-forum .forum-row.unread{background:#fcfdfd}
.page-forum .topic h3{font:700 12px/1.5 Nunito,Arial,sans-serif}
.page-forum .topic h3 a{color:#57798d}
.page-forum .topic-icon{width:26px;height:26px;font-size:12px;box-shadow:none;background:#eef3f5;color:#7b96a5}
.page-forum .forum-tone-blue{background:#edf3f6;color:#7895a6}
.page-forum .forum-tone-gold{background:#f7f3e8;color:#a59670}
.page-forum .forum-tone-coral{background:#f8efec;color:#b2948b}
.page-forum .forum-tone-violet{background:#f2eff7;color:#9a91ad}
.page-forum .num{font-size:12px;font-weight:600;color:#7b909c}
.page-forum .badge{font-size:8px;font-weight:600;box-shadow:none}
.page-forum .recent-thread b{font:600 12px/1.5 Nunito,Arial,sans-serif;color:#638194}
.page-forum .recent-thread{padding:11px 13px}
.page-forum .stat-grid b{font-size:18px;font-weight:700;color:#748d90}
.page-forum .forum-discover-intro{font-size:10px;color:#8a9aa3}
.page-forum .forum-discover .forum-category-links{gap:2px}
.page-forum .forum-discover .forum-category-links a{padding:8px;background:transparent;border-radius:5px}
.page-forum .forum-discover .forum-category-links a:hover,.page-forum .forum-discover .forum-category-links a[aria-current]{background:linear-gradient(#f5f9f7,#eff5f2);border-color:#e2ebe6}
.page-forum .forum-discover-icon{flex-basis:25px;width:25px;height:25px;border-radius:6px;font-size:12px}
.page-forum .forum-discover-copy b{font:600 12px/1.4 Nunito,Arial,sans-serif;color:#718a99}
.page-forum .forum-discover-arrow{font-size:16px;color:#a4b7bd}
.page-forum .fx-thread-title{background:linear-gradient(#fbfdfc,#f6f9f8)}
.page-forum .fx-thread-title h1{font-size:23px;font-weight:800;color:#496575}
.page-forum .fx-author,.page-forum .fx-post.op .fx-author{background:#f8fafb}
.page-forum .fx-author .tiny-avatar{width:44px;height:44px;border-radius:8px;box-shadow:none;border:2px solid white;outline-color:#e1e7eb}
.page-forum .fx-author>a{font-size:12px;font-weight:600;color:#688497}
.page-forum .fx-text{font:400 13px/1.85 'DM Sans',Arial,sans-serif;color:#5b7180}
.page-forum .forum-form.fx-form{background:#fff}
.page-forum .forum-form label{font-weight:600;color:#6c8391}

/* Use the shared Playarea buttons without moving the hover hit area. */
.page-forum .forum-surface .button{transition:filter .12s}
.page-forum .forum-surface .button:hover{transform:none}
.page-forum .forum-surface .button:active{transform:none;filter:brightness(.98)}
.page-forum .fx-new-card{border:1px solid #dce6e2}

.page-forum .recent-thread-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:7px;color:#8798a3;font-size:10px;line-height:1.5}
.page-forum .recent-thread-meta img{width:22px;height:22px;flex:0 0 22px;object-fit:cover;border-radius:5px;border:1px solid #e5ebee}
.page-forum .recent-thread-meta time{color:#97a5ae}

/* Keep forum, category and thread headings aligned and allow long titles. */
.page-forum .fx-hero-copy{min-width:0}
.page-forum .fx-hero h1{overflow-wrap:anywhere}
.page-forum .forum-title-highlight{display:inline}
.page-forum .fx-thread-title{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:19px 22px}
.page-forum .fx-thread-title>div{min-width:0}
.page-forum .fx-thread-title h1{margin:6px 0 9px;font:800 25px/1.3 Nunito,Arial,sans-serif;letter-spacing:-.4px;overflow-wrap:anywhere}
.page-forum .fx-thread-title>.button{flex-shrink:0}
.page-forum .fx-thread-title .forum-kicker{font:600 9px/1.5 'DM Sans',Arial,sans-serif;letter-spacing:.07em;color:#7c908e}
.page-forum .fx-cat-hero .fx-kicker{color:#7c908e}

/* Playarea's playful title treatment, with restrained surrounding content. */
.page-forum .fx-hero h1,.page-forum .fx-thread-title h1{
 font:900 32px/1.3 Nunito,Arial,sans-serif;letter-spacing:-.7px;color:#355f70;
 margin:9px 0 13px;overflow-wrap:anywhere
}
.page-forum .forum-title-highlight{
 display:inline;position:relative;color:#278f89!important;isolation:auto;
 background:linear-gradient(transparent 72%,#f7df9f 72%,#f7df9f 92%,transparent 92%);
 padding:0 2px;box-decoration-break:clone;-webkit-box-decoration-break:clone
}
.page-forum .forum-title-highlight:before{content:none}
.page-forum .forum-title-highlight:after{
 content:"✦";position:static;display:inline-block;vertical-align:top;margin:-3px 0 0 6px;
 font-size:15px;line-height:1.3;color:#d4aa54;transform:rotate(12deg)
}
.page-forum .fx-hero,.page-forum .fx-cat-hero,.page-forum .fx-thread-title{
 background:linear-gradient(115deg,#e7f3ee,#f2f7f5 65%,#fcf3dd);border-color:#d5e4dd
}

.page-forum .forum-breadcrumb{display:flex;align-items:baseline;flex-wrap:wrap;gap:7px;margin:0 0 16px;font-size:11px;color:#8a9ca7}
.page-forum .forum-breadcrumb a{color:#648394}
.page-forum .forum-breadcrumb [aria-current]{min-width:0;overflow-wrap:anywhere}
.page-forum .forum-moderation{margin-bottom:18px;border-color:#cbdeda}
.page-forum .forum-moderation>summary{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 15px;background:linear-gradient(#f6faf8,#edf5f1);color:#507f76;font-size:12px;font-weight:700}
.page-forum .forum-moderation>summary:before{content:"▸"}
.page-forum .forum-moderation[open]>summary:before{content:"▾"}
.page-forum .forum-moderation>summary small{margin-left:auto;font-size:10px;font-weight:400;color:#7c958e}

.page-forum .forum-move-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.page-forum .forum-move-fields input[readonly]{background:#f3f6f7;color:#82949f}

.page-forum .forum-compose-actions{gap:8px}
.page-forum .forum-compose-actions [data-preview-toggle]{margin-right:auto}
.page-forum .forum-button-cancel{background:linear-gradient(#fff8f6,#fceeea);border-color:#ebc9c0;color:#b36c5e}
.page-forum .forum-button-cancel:hover{background:linear-gradient(#fff2ed,#f8e6df);border-color:#dbafa3;color:#a45c4e}
.page-forum .forum-compose-heading{margin-bottom:18px}

/* A welcoming writing corner for new conversations. */
.page-forum .forum-compose-page .forum-compose-heading{position:relative;overflow:hidden;min-height:200px;padding:25px 28px;gap:10px;background:radial-gradient(circle at 90% 25%,#fff3d0 0 85px,transparent 86px),linear-gradient(115deg,#dff1ea,#eff7f3 65%,#fff1d4)}
.page-forum .forum-compose-page .forum-compose-heading>div:first-child{position:relative;z-index:1;flex:1}
.page-forum .forum-compose-page .forum-compose-heading h1{font-size:34px}
.page-forum .forum-compose-page .forum-compose-heading p{max-width:360px;font-size:12px;line-height:1.8;color:#6f8986}
.page-forum .compose-stickers{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.page-forum .compose-stickers span{padding:4px 8px;border:1px solid #cee3db;background:#ffffffa8;border-radius:5px;font-size:9px;color:#678e80;transform:rotate(-2deg)}
.page-forum .compose-stickers span:nth-child(2){transform:rotate(2deg);background:#fff8e4;border-color:#ecdfbb;color:#9b8553}
.page-forum .compose-stickers span:nth-child(3){background:#fceee9;border-color:#ecd7cd;color:#b18676}
.page-forum .compose-mascot{position:relative;flex:0 0 140px;align-self:stretch;min-height:170px}
.page-forum .compose-mascot img{position:absolute;bottom:-30px;right:10px;width:115px;height:160px;object-fit:contain;transform:rotate(5deg);filter:drop-shadow(0 4px 3px #527e6620)}
.page-forum .compose-mascot>span{position:absolute;top:1px;right:0;padding:7px 10px;border:1px solid #e5d9b9;border-radius:10px 10px 2px 10px;background:#fffcf2;color:#8f815d;font:800 11px Nunito,Arial;transform:rotate(-4deg)}
.page-forum .forum-compose-page .fx-compose{border-color:#d3e3dc}

.page-forum .forum-compose-page .forum-form{gap:23px;padding:23px}
.page-forum .compose-label{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font:800 14px Nunito,Arial;color:#4d796f;margin-bottom:3px}
.page-forum .compose-label i{display:grid;place-items:center;width:24px;height:24px;background:#e4f2e9;color:#588e7a;border-radius:8px 8px 8px 3px;font:800 11px Nunito,Arial}
.page-forum .compose-label small{margin-left:auto;color:#91a49b;font-size:10px}

.page-forum .compose-paper-foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:7px}
.page-forum .compose-paper-foot small{font-size:10px;color:#96a394}
.page-forum .forum-compose-page .compose-note{position:relative;background:#fffaf0;border-color:#e9dfc7;transform:rotate(1deg)}
.page-forum .compose-note:before{content:"";display:block;position:absolute;top:-1px;left:39%;width:54px;height:12px;background:#eadba666;transform:rotate(-5deg);z-index:1}
.page-forum .forum-compose-page .compose-note>.panel-heading{background:linear-gradient(#fffaf0,#fcf4e3);color:#9c895f}
.page-forum .compose-note .rules-list{color:#94866f;line-height:1.9}

.page-forum .forum-compose-hero{grid-template-columns:minmax(0,1fr) 290px;background:linear-gradient(115deg,#e7f3ee,#f2f7f5 65%,#fcf3dd)}
.page-forum .forum-compose-hero .fx-hero-copy{padding:24px 26px}
.page-forum .forum-compose-hero .fx-hero-art{display:block;min-height:175px}
.page-forum .forum-compose-hero .fx-hero-art .bubble{animation:none}
.page-forum .forum-compose-hero .fx-hero-art .b1{top:18px;right:120px}
.page-forum .forum-compose-hero .fx-hero-art .b2{top:65px;right:20px}
.page-forum .forum-compose-hero .fx-hero-art .b3{top:117px;right:110px}

/* Give the compose page a clear, prominent main title. */
.page-forum .forum-compose-hero h1{
 font:900 48px/1.15 Nunito,Arial,sans-serif;
 letter-spacing:-1.2px;margin:12px 0 16px;color:#355f70
}
.page-forum .forum-compose-hero .fx-hero-copy{padding:30px}
.page-forum .forum-compose-hero .forum-title-highlight{
 background:linear-gradient(transparent 74%,#f7df9f 74%,#f7df9f 94%,transparent 94%)
}

/* Reuse Playarea's shared banner rather than a separate forum title design. */
.page-forum .forum-page-banner{background:linear-gradient(115deg,#e7f2f9 0%,#eef8f5 55%,#fff3d8 100%)}
.page-forum .forum-page-banner h1{overflow-wrap:anywhere}
.page-forum .forum-overview-tools{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap;margin:0 0 18px}
.page-forum .forum-overview-tools .fx-hero-stats,.page-forum .forum-overview-tools .fx-hero-actions{margin-top:0}
.page-forum .forum-overview-tools .fx-hero-stats b{font:800 17px Nunito,Arial;color:#58847f}
.page-forum .forum-overview-tools .fx-hero-stats small{font-size:9px;color:#81918f}
.page-forum .forum-thread-status:empty{display:none}
.page-forum .forum-thread-status{margin:0 0 12px}

/* Form controls follow the settings page. */
.page-forum .forum-compose-page .forum-settings-form>label{display:grid;gap:4px;color:#52687a;font:900 10px/1.5 'DM Sans',Arial,sans-serif;letter-spacing:.045em;text-transform:uppercase}
.page-forum .forum-compose-page .forum-settings-form :is(input[type=text],select,textarea){width:100%;min-height:39px;padding:7px 11px;border:1px solid #d4e1e6;border-radius:5px;background:#fff;color:var(--ink);font:500 12px/1.5 'DM Sans',Arial,sans-serif;outline:0;transition:border-color .15s,box-shadow .15s,background .15s}
.page-forum .forum-compose-page .forum-settings-form textarea{min-height:220px;resize:vertical}
.page-forum .forum-settings-form :is(input,select,textarea):hover{border-color:#bcd3da}
.page-forum .forum-settings-form :is(input,select,textarea):focus{border-color:#8bc7ca;background:#fff;box-shadow:0 0 0 3px #e3f5f3}
.page-forum .forum-settings-form .compose-paper-foot{text-transform:none;letter-spacing:0}
.page-forum .forum-compose-page .fx-compose>.panel-heading{background:linear-gradient(#fff,#f7f9fa);color:#52687a;min-height:35px}
.page-forum .forum-banner-stats{display:flex;flex-wrap:wrap;gap:20px;margin-top:13px}
.page-forum .forum-banner-stats>div{display:flex;align-items:baseline;gap:6px}
.page-forum .forum-banner-stats b{font:800 17px Nunito,Arial,sans-serif;color:#52827e}
.page-forum .forum-banner-stats small{font-size:9px;letter-spacing:.045em;color:#82958f}

/* Forum front page follows the supplied forum prototype. */
.page-forum .forum-index-hero{grid-template-columns:minmax(0,1fr) 300px;background:linear-gradient(115deg,#d9f0ed 0%,#e6f3f2 50%,#f8e9c5 100%);border-color:#c8e2e0}
.page-forum .forum-index-hero .fx-hero-copy{padding:22px 24px}
.page-forum .forum-index-hero .fx-hero-art{display:block;min-height:215px}
.page-forum .forum-index-hero h1{font:900 34px/1.2 Nunito,Arial;color:#4f4036;letter-spacing:-.8px}
.page-forum .forum-index-hero h1 span{color:#b96545}
.page-forum .forum-index-hero .fx-kicker{color:#9a6846}
.page-forum .forum-index-hero p{color:#78675a}
.page-forum .forum-group>.panel-heading,.page-forum .forum-unread-panel>.panel-heading{min-height:35px;padding:0 12px;background:linear-gradient(#fff,#f7f9fa);border-bottom:1px solid #e3e9ed;color:#52687a;font-size:10px;font-weight:700;letter-spacing:.04em}
.page-forum .forum-group-name{color:inherit;font:inherit}
.page-forum .forum-group-name i{background:transparent}
.page-forum .forum-surface .forum-new-action{display:inline-flex;align-items:center;gap:9px;padding:9px 14px;border-radius:7px 7px 7px 3px;box-shadow:inset 0 1px #ffffff40,0 2px 0 #247c78}
.page-forum .forum-new-action>span:first-child{font-size:17px;line-height:1}
.page-forum .forum-new-action>span:last-child{opacity:.75}

/* Equal-sized actions in the forum banner; playful button only in the side card. */
.page-forum .forum-index-hero .fx-hero-actions .button{padding:8px 12px;font-size:11px;line-height:1.3}
.page-forum .fx-new-card{background:linear-gradient(135deg,#f7a595,#e0705f);border:0;color:#fff}
.page-forum .fx-new-card .fx-new-body{padding:16px;color:#fff}
.page-forum .fx-new-card .fx-new-body b{font:900 17px Nunito,Arial;color:#fff}
.page-forum .fx-new-card .fx-new-body p{color:#fff;font-size:11.5px;line-height:1.5;opacity:.93}
.page-forum .fx-new-card .forum-new-action{background:linear-gradient(#fff,#fff7f2);border-color:#fff;color:#b65f4e;box-shadow:0 2px 0 #b65f4e30}
.page-forum .fx-new-card .forum-new-action:hover{color:#a85242;filter:brightness(.98)}

/* Compact active discussions with aligned reply counts. */
.page-forum .forum-active-panel>.panel-heading{min-height:26px;padding:7px 12px;font-size:9px}
.page-forum .forum-active-list{padding:0}
.page-forum .forum-active-table{width:100%;border-collapse:collapse;table-layout:fixed}
.page-forum .forum-active-table td{padding:6px 0;vertical-align:middle;border-bottom:1px solid #d6dde1}
.page-forum .forum-active-row{background:linear-gradient(#fff,#edf0f2);font:600 11px/1.4 'DM Sans',Arial;color:#647787}
.page-forum .forum-active-row:nth-child(even){background:#fff}
.page-forum .forum-active-row:hover{background:#eaf2f5}
.page-forum .forum-active-row:last-child td{border-bottom:0}
.page-forum .forum-active-table .forum-active-icon-cell{width:43px;padding-left:9px;padding-right:7px}
.page-forum .forum-active-icon{position:relative;display:grid;place-items:center;width:27px;height:27px;border-radius:8px 8px 8px 3px;background:linear-gradient(145deg,#8ec8e4,#4d8db6);color:#fff;border:1px solid #ffffffb3;box-shadow:inset 0 1px 0 #ffffff66,0 1px 2px #345e781c}
.page-forum .forum-active-icon.is-locked{background:linear-gradient(145deg,#a4b6c4,#748b9e)}
.page-forum .forum-active-topic-cell{overflow:hidden}
.page-forum .forum-active-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#647787}
.page-forum .forum-active-title:hover{color:#2c7299}
.page-forum .forum-active-table .forum-active-count{width:45px;padding-right:10px;padding-left:4px;text-align:right;white-space:nowrap;font-size:10px;font-weight:700}
.page-forum .forum-active-count span{color:#2c7299}
.page-forum .forum-active-panel>.panel-foot{padding:5px 9px;font-size:10px}

.page-forum .forum-active-icon.forum-active-tone-teal{background:linear-gradient(145deg,#73c5bb,#2d7f8b)}
.page-forum .forum-active-icon.forum-active-tone-blue{background:linear-gradient(145deg,#8ec8e4,#4d8db6)}
.page-forum .forum-active-icon.forum-active-tone-coral{background:linear-gradient(145deg,#f6b6a1,#d86e83)}
.page-forum .forum-active-icon.forum-active-tone-gold{background:linear-gradient(145deg,#f3c36a,#db8951)}
.page-forum .forum-active-icon.forum-active-tone-violet{background:linear-gradient(145deg,#d5a9d8,#9568b1)}

/* Extend the title link over its entire table row. */
.page-forum .forum-active-row{position:relative}
.page-forum .forum-active-title:after{content:"";position:absolute;inset:0;z-index:1}
.page-forum .forum-active-row:focus-within{background:#eaf2f5;outline:2px solid #759ba8;outline-offset:-2px}

/* Welcoming empty forum states. */
.page-forum .forum-welcome-empty{display:flex;align-items:center;gap:28px;padding:30px;background:linear-gradient(115deg,#f0f8f5,#fffdf5)}
.page-forum .forum-empty-art{position:relative;flex:0 0 130px;min-height:180px}
.page-forum .forum-empty-art img{position:absolute;bottom:0;left:6px;width:110px;height:145px;object-fit:contain;transform:rotate(-4deg)}
.page-forum .forum-empty-bubble{position:absolute;top:0;left:0;white-space:nowrap;padding:7px 10px;border:1px solid #e5dcc4;border-radius:10px 10px 3px 10px;background:#fffaf0;font:800 11px Nunito,Arial;color:#96825f;transform:rotate(3deg)}
.page-forum .forum-empty-spark{position:absolute;right:0;top:65px;font-size:23px;color:#e9b94d}
.page-forum .forum-empty-eyebrow{font-size:9px;font-weight:700;letter-spacing:.09em;color:#7b9c92}
.page-forum .forum-empty-copy h2{font:900 24px/1.25 Nunito,Arial;color:#3a6b7c;margin:8px 0 10px}
.page-forum .forum-empty-copy p{max-width:370px;font-size:12px;line-height:1.8;color:#82989e;margin:0 0 17px}
.page-forum .forum-active-empty{text-align:center;padding:25px 18px;background:linear-gradient(#fff,#f6faf7)}
.page-forum .forum-active-empty-icon{position:relative;display:inline-grid;place-items:center;width:48px;height:48px;border-radius:13px 13px 13px 5px;background:#edf5ef;font-size:26px}
.page-forum .forum-active-empty-icon i{position:absolute;right:-7px;top:-8px;font-style:normal;font-size:18px;color:#e9b94d}
.page-forum .forum-active-empty h3{font:800 16px/1.4 Nunito,Arial;color:#507b86;margin:12px 0 7px}
.page-forum .forum-active-empty p{font-size:11px;line-height:1.7;color:#8b9da5;margin:0 0 15px}



.page-forum .forum-action-toast { position: fixed; left: 50%; bottom: 22px; z-index: 50; padding: 10px 16px; border-radius: 9px; background: #2a3b4a; color: #fff; font-size: 12px; box-shadow: 0 8px 24px rgba(20,40,55,.3); opacity: 0; pointer-events: none; transform: translate(-50%, 14px); transition: .25s; }
.page-forum .forum-action-toast.show { opacity: 1; transform: translate(-50%, 0); }
@media(prefers-reduced-motion:reduce){.page-forum .forum-action-toast{transition:none}}

.page-forum .forum-action-toast{display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);padding:11px 15px 11px 11px;border:1px solid #4a6270;border-radius:12px 12px 12px 4px;background:linear-gradient(120deg,#2a3b4a,#304957);box-shadow:0 8px 24px #1428374d,inset 0 1px #ffffff0d;font-weight:600}
.page-forum .forum-toast-check{display:grid;place-items:center;flex:0 0 27px;width:27px;height:27px;border-radius:8px;background:#3b726e;color:#c9f2df;font-size:16px;box-shadow:inset 0 1px #ffffff18}
.page-forum .forum-toast-spark{margin-left:5px;color:#efd080;font-size:17px;transform:rotate(10deg)}

/* Classic forum post structure, using Playarea's existing palette. */
.page-forum .forum-classic-post{grid-template-columns:155px minmax(0,1fr);gap:0;border-radius:7px}
.page-forum .forum-classic-posthead{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:8px 12px;background:linear-gradient(#fdfefe,#f1f5f7);border-bottom:1px solid #dfe7eb;font:500 10px/1.5 'DM Sans',Arial;color:#7f94a1}
.page-forum .forum-classic-posthead a{color:#688a9d;white-space:nowrap;font-size:10px}
.page-forum .forum-classic-author,.page-forum .fx-post.op .forum-classic-author{align-items:flex-start;text-align:left;padding:14px 13px;gap:6px;background:#f3f7f9;border-right:1px solid #e0e8ed}
.page-forum .forum-classic-author .forum-post-nickname{font:800 14px/1.4 Nunito,Arial;color:#416c84;max-width:100%;overflow-wrap:anywhere}
.page-forum .forum-classic-author .forum-post-role{color:#7896a7;font-size:10px}
.page-forum .forum-classic-author img.tiny-avatar{width:62px;height:62px;border-radius:8px;margin:4px 0 8px;border:2px solid white;outline:1px solid #dce5eb;box-shadow:none}
.page-forum .forum-classic-author small{font-size:10px;line-height:1.6;color:#90a1ad}
.page-forum .forum-classic-post .fx-postbody{min-height:195px}
.page-forum .forum-classic-post .fx-text{padding:16px 18px;font:400 13px/1.8 'DM Sans',Arial;color:#536c7b}
.page-forum .forum-post-edited{padding:0 18px 12px;color:#98a7b0;font-size:10px}
.page-forum .forum-classic-tools{margin-top:auto;padding:10px 14px;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:flex-start;gap:12px;border-top:1px solid #edf1f3;background:#fbfcfd}
.page-forum .forum-classic-tools:empty{display:none}
.page-forum .forum-classic-tools .forum-post-tools{padding:0;margin:0;max-width:100%}
.page-forum .forum-classic-tools .forum-post-tools[open]{flex-basis:100%}
.page-forum .forum-classic-tools>.button{padding:5px 10px;font-size:10px}

.page-forum .forum-manage-bar{display:flex;justify-content:flex-end;margin:-4px 0 14px}
.page-forum .forum-manage{position:relative;z-index:30}
.page-forum .forum-manage>summary{list-style:none;cursor:pointer;font:600 11px/1.5 'DM Sans',Arial;color:#718995;padding:5px 9px;border:1px solid #dce5e9;border-radius:5px;background:linear-gradient(#fff,#f7f9fa)}
.page-forum .forum-manage>summary::-webkit-details-marker{display:none}
.page-forum .forum-manage-menu{position:absolute;right:0;top:calc(100% + 5px);width:185px;background:#fff;border:1px solid #dce5e9;border-radius:6px;box-shadow:0 5px 18px #24435718;padding:4px}
.page-forum .forum-manage-menu form{margin:0}
.page-forum .forum-manage-menu button{display:block;width:100%;border:0;background:transparent;text-align:left;padding:8px 10px;color:#6a8392;font:500 11px 'DM Sans',Arial;border-radius:4px}
.page-forum .forum-manage-menu button:hover{background:#f0f6f5}
.page-forum .forum-manage-menu .forum-manage-delete{color:#b76f64;border-top:1px solid #edf1f3;border-radius:0;margin-top:3px}
.page-forum .forum-manage-dialog{padding:0;width:min(440px,calc(100% - 32px));max-height:85vh;overflow:auto;background:#fff;border:1px solid #d9e2e8;border-radius:7px;box-shadow:0 10px 30px #23374429;color:#607480}
.page-forum .forum-manage-dialog::backdrop{background:#23374461}
.page-forum .forum-manage-dialog>header{position:relative;padding:10px 42px 10px 16px;min-height:34px;background:linear-gradient(#fff,#f7f9fa);border-bottom:1px solid #e3e9ed}
.page-forum .forum-manage-dialog h2{font:600 11px/1.5 'DM Sans',Arial;letter-spacing:.04em;margin:0;color:#74838e}
.page-forum .forum-manage-dialog>header button{position:absolute;right:7px;top:3px;width:28px;height:28px;border:0;background:transparent;color:#71838e;font-size:20px}
.page-forum .forum-manage-dialog .forum-form{padding:14px 16px;gap:14px}
.page-forum .forum-manage-context{margin:0;font:700 13px Nunito,Arial;color:#5b7b8d;overflow-wrap:anywhere}
.page-forum .forum-manage-dialog label{font-size:11px;font-weight:600}
.page-forum .forum-manage-dialog textarea{background:#fcfdfe;min-height:70px}
.page-forum .forum-manage-footer{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #edf0f2;padding-top:12px}
.page-forum .forum-manage-footer .button{font-size:11px;padding:6px 10px}
.page-forum .forum-manage-warning{font-size:11px;color:#a77468;margin:0}
.page-forum .forum-manage-footer .forum-manage-delete-button{background:linear-gradient(#f18d7b,#dc6b5e);border-color:#d86a5d;color:white}

.page-forum .forum-manage-bar{align-items:center;gap:9px}
.page-forum .forum-manage-bar .forum-thread-status{margin:0;display:flex;align-items:center;gap:5px}
.page-forum .forum-manage-bar:has(.forum-thread-status:empty):not(:has(.forum-manage)){display:none}

.page-forum .forum-manage-bar>.forum-thread-status{margin-right:auto}
.page-forum .forum-hidden-post{padding:12px 14px;border:1px solid #e1e8ec;border-radius:5px;background:#f5f8f9;color:#81939e;font-size:12px;font-style:italic}
.page-forum .forum-hidden-original{font-size:11px;color:#8398a4}
.page-forum .forum-hidden-original summary{cursor:pointer}

.page-forum .forum-permalink-label{font-weight:400;color:#94a6b0}

.page-forum .forum-guest-reply{display:flex;align-items:center;gap:25px;padding:25px 30px;background:linear-gradient(115deg,#e7f2f9,#eef8f5 55%,#fff3d8);border-color:#d2e3df}
.page-forum .forum-guest-reply>.forum-guest-art{position:relative;flex:0 0 125px;min-height:165px;display:block;padding:0}
.page-forum .forum-guest-art img{position:absolute;bottom:-5px;left:5px;width:105px;height:140px;object-fit:contain;transform:rotate(-5deg)}
.page-forum .forum-guest-art>span{position:absolute;top:0;left:0;padding:7px 10px;background:#fffcf1;border:1px solid #e7dcc1;border-radius:10px 10px 3px 10px;font:800 10px Nunito,Arial;color:#958264;white-space:nowrap;transform:rotate(3deg)}
.page-forum .forum-guest-reply>.forum-guest-copy{display:block;flex:1;padding:0;min-width:0}
.page-forum .forum-guest-copy h2{margin:8px 0 10px;font:900 26px/1.25 Nunito,Arial;color:#35647b;letter-spacing:-.4px}
.page-forum .forum-guest-copy h2 span{color:#2e9e99}
.page-forum .forum-guest-copy p{max-width:490px;font-size:12px;line-height:1.8;color:#7b929c;margin:0 0 16px}
.page-forum .forum-guest-actions{display:flex;flex-wrap:wrap;gap:8px}
.page-forum .forum-guest-copy>small{display:block;margin-top:11px;font-size:10px;color:#93a5a8}

.page-forum .forum-keep-together{white-space:nowrap}

.page-forum .forum-rules-card{background:linear-gradient(145deg,#fffdf6,#fff 65%);border-color:#eadfca}
.page-forum .forum-rules-intro{display:flex;align-items:center;gap:12px;padding:18px 15px 15px;background:linear-gradient(115deg,#edf7f5,#fff4da);border-bottom:1px dashed #e4dcc7}
.page-forum .forum-rules-icon{position:relative;display:grid;place-items:center;flex:0 0 40px;height:42px;border:2px solid #fff;border-radius:12px 12px 12px 4px;background:linear-gradient(145deg,#57b7af,#2a8e91);box-shadow:0 3px 0 #d2e4dc;color:#fff;font:800 29px/1 'Nunito',sans-serif;transform:rotate(-7deg)}
.page-forum .forum-rules-icon i{position:absolute;right:-7px;top:-9px;color:#e6b54a;font-size:17px;font-style:normal;text-shadow:0 1px #fff}
.page-forum .forum-rules-eyebrow{font-size:9px;font-weight:800;letter-spacing:.1em;color:#6b908c}
.page-forum .forum-rules-intro h2{margin:4px 0;font:900 18px/1.15 'Nunito',sans-serif;color:#345e69;letter-spacing:-.3px}
.page-forum .forum-rules-intro h2>span{color:#df7968}
.page-forum .forum-rules-intro p{margin:5px 0 0;font-size:10px;line-height:1.5;color:#7b8a83}
.page-forum .forum-rules-list{list-style:none;margin:0;padding:4px 15px}
.page-forum .forum-rules-list li{display:flex;align-items:flex-start;gap:10px;padding:12px 0}
.page-forum .forum-rules-list li+li{border-top:1px solid #eeeae1}
.page-forum .forum-rule-number{display:grid;place-items:center;flex:0 0 25px;height:25px;border-radius:8px;background:#e7f3f0;color:#408b83;font:900 10px/1 'Nunito',sans-serif}
.page-forum .forum-rules-list li:nth-child(2) .forum-rule-number{background:#fbece7;color:#bf7763}
.page-forum .forum-rules-list li:nth-child(3) .forum-rule-number{background:#e9f1f8;color:#6388a5}
.page-forum .forum-rules-list li:nth-child(4) .forum-rule-number{background:#fbf1d9;color:#aa8b44}
.page-forum .forum-rules-list b{display:block;color:#526b73;font-size:11px;line-height:1.5}
.page-forum .forum-rules-list p{margin:3px 0 0;color:#899399;font-size:11px;line-height:1.55}
.page-forum .forum-rules-footer{display:flex;flex-direction:column;gap:7px;padding:12px 15px;background:#f8f8f2;border-top:1px dashed #e4dcc7}
.page-forum .forum-rules-footer>span{font-size:10px;color:#92998b}
.page-forum .forum-rules-footer a{align-self:flex-start;color:#378c88;font-size:11px;font-weight:800;text-decoration:none}
.page-forum .forum-rules-footer a:hover{color:#bd6556;text-decoration:underline}
@media(prefers-reduced-motion:reduce){.page-forum .forum-rules-icon{transform:none}}
.forum-markdown { overflow-wrap:anywhere; }
.forum-markdown p { margin:0 0 10px; }
.forum-markdown blockquote { border-left:3px solid #cfe1e8; padding:6px 12px; margin:8px 0; background:#f4f8fa; }
.forum-markdown pre { white-space:pre-wrap; }
.forum-thread-tags { display:flex; gap:6px; flex-wrap:wrap; margin:12px 0; }
.forum-thread-tags span { padding:3px 10px; border-radius:12px; background:#e4f2f1; color:#2e8a85; font-size:11px; }