/*
 * Mietwagen-Ecke Modern 0.4.0 – final visual layer
 * Loaded after extension styles so Board3 and other extensions keep the same
 * Mietwagen-Ecke look and feel.
 *
 * This file changes presentation only. No routes, canonical URLs, link
 * parameters or rewrite rules are modified.
 */

:root {
    --mwe-primary: #075fc4;
    --mwe-primary-strong: #064786;
    --mwe-primary-dark: #05376d;
    --mwe-primary-soft: #eef5ff;
    --mwe-primary-soft-2: #f7faff;
    --mwe-page: #f5f7fa;
    --mwe-surface: #ffffff;
    --mwe-surface-muted: #f8fafc;
    --mwe-border: #e1e7ee;
    --mwe-border-strong: #cfd8e3;
    --mwe-text: #102a4c;
    --mwe-text-soft: #5f7188;
    --mwe-text-faint: #7b8ba0;
    --mwe-radius-sm: 5px;
    --mwe-radius: 8px;
    --mwe-radius-lg: 9px;
    --mwe-shadow: 0 2px 10px rgba(24, 55, 90, .055);
    --mwe-shadow-hover: 0 8px 24px rgba(24, 55, 90, .10);
    --mwe-content-width: 1492px;
}

/* ---------- Global shell ---------- */
html,
body {
    background: var(--mwe-page) !important;
}

body {
    color: var(--mwe-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 12px;
}

.wrap {
    width: 100%;
    max-width: none;
    min-width: 290px;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
}

#page-body {
    width: calc(100% - 44px);
    max-width: var(--mwe-content-width);
    margin: 17px auto 0;
    padding: 0;
    box-sizing: border-box;
}

#page-body::after {
    content: "";
    display: table;
    clear: both;
}

h2,
h2 a,
h3,
h3 a,
h4,
.content h2,
.panel h2 {
    color: var(--mwe-text);
}

h2 {
    margin: 8px 0 10px;
    font-size: 1.9em;
    font-weight: 720;
    letter-spacing: -.018em;
}

h3 {
    font-weight: 700;
}

a {
    color: var(--mwe-primary);
}

a:hover,
a:focus {
    color: var(--mwe-primary-strong);
    text-decoration: none;
}

/* ---------- Header ---------- */
#page-header {
    padding: 0;
    background: #fff;
}

.headerbar {
    min-height: 74px;
    margin: 0;
    padding: 0;
    background: #fff !important;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.headerbar > .inner.mwe-header-inner {
    width: calc(100% - 44px);
    max-width: var(--mwe-content-width);
    min-height: 74px;
    margin: 0 auto;
    padding: 10px 0;
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(320px, 450px) minmax(280px, 1fr);
    gap: 24px;
    align-items: center;
    box-sizing: border-box;
}

.site-description,
#site-description {
    float: none;
    width: auto;
    margin: 0;
    padding: 0;
}

.mwe-brand,
#site-description > a.logo.mwe-brand {
    display: inline-flex;
    float: none;
    align-items: center;
    gap: 12px;
    max-width: 100%;
    margin: 0;
    color: var(--mwe-text);
    text-decoration: none;
}

.mwe-brand-mark {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    background: linear-gradient(180deg, #0875e7 0%, #0758b7 100%);
    color: #fff;
    box-shadow: 0 3px 9px rgba(7, 95, 196, .22);
    font-size: 25px;
    font-weight: 450;
    line-height: 1;
}

.mwe-brand-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.15;
}

.mwe-brand-copy strong {
    color: #11294a;
    font-size: 20px;
    font-weight: 760;
    letter-spacing: -.02em;
    white-space: nowrap;
}

.mwe-brand-copy small {
    margin-top: 4px;
    color: #667a94;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
}

.mwe-semantic-title {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.search-header,
#search-box.search-header {
    float: none;
    width: 100%;
    margin: 0;
    box-shadow: none;
}

.search-header form,
.search-header fieldset {
    width: 100%;
}

.search-header fieldset {
    display: flex;
    align-items: center;
    height: 42px;
    overflow: hidden;
    box-sizing: border-box;
    border: 1px solid var(--mwe-border);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(25, 54, 85, .03);
}

.search-header fieldset:focus-within {
    border-color: #8ab7e8;
    box-shadow: 0 0 0 3px rgba(7, 95, 196, .08);
}

.search-header .inputbox,
.search-header .inputbox:hover,
.search-header .inputbox:focus {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    height: 40px;
    margin: 0;
    padding: 0 14px;
    border: 0 !important;
    border-radius: 0;
    background: #fff !important;
    box-shadow: none !important;
    color: var(--mwe-text);
    font-size: 12px;
}

.search-header .button-search,
.search-header .button-search-end {
    width: 42px;
    height: 40px;
    min-width: 42px;
    margin: 0;
    padding: 0;
    border: 0;
    border-left: 1px solid #edf1f5;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    color: var(--mwe-text);
}

.search-header .button-search-end {
    display: none;
}

.mwe-account-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.mwe-account-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    box-sizing: border-box;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.mwe-account-login {
    padding: 0 2px;
    color: var(--mwe-primary-strong);
}

.mwe-account-register {
    padding: 0 16px;
    border-radius: 6px;
    background: #0868d8;
    color: #fff !important;
    box-shadow: 0 3px 8px rgba(8, 104, 216, .18);
}

.mwe-account-register:hover,
.mwe-account-register:focus {
    background: #0759ba;
    color: #fff !important;
}

/* ---------- Main navigation ---------- */
#page-header .mwe-main-navbar {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: linear-gradient(90deg, #06437f 0%, #075595 55%, #06437f 100%);
    box-shadow: none;
}

#page-header .mwe-main-navbar > .inner {
    width: 100%;
    margin: 0;
    padding: 0;
}

#page-header #nav-main {
    width: calc(100% - 44px);
    max-width: var(--mwe-content-width);
    min-height: 46px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: stretch;
    float: none;
    line-height: normal;
}

#page-header #nav-main > li {
    float: none;
    display: flex;
    align-items: stretch;
    margin: 0;
}

#page-header #nav-main > li > a,
#page-header #nav-main > li > .header-profile > a,
#page-header #nav-main > li.quick-links > a {
    min-height: 46px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border: 0;
    border-radius: 0;
    box-sizing: border-box;
    color: rgba(255,255,255,.96);
    font-size: 12px;
    font-weight: 620;
    text-decoration: none;
}

#page-header #nav-main > li:first-child > a {
    padding-left: 12px;
}

#page-header #nav-main > li > a:hover,
#page-header #nav-main > li > a:focus,
#page-header #nav-main > li > .header-profile > a:hover,
#page-header #nav-main > li.quick-links > a:hover {
    background: rgba(0, 33, 71, .24);
    color: #fff;
}

#page-header #nav-main .icon {
    color: inherit;
    font-size: 14px;
}

.mwe-nav-fill {
    flex: 1 1 auto;
}

#page-header #nav-main > .mwe-secondary-nav > a,
#page-header #nav-main > .mwe-user-nav > a,
#page-header #nav-main > .mwe-user-nav .header-profile > a {
    padding-left: 14px;
    padding-right: 14px;
}

#page-header #nav-main > .mwe-user-nav {
    display: flex;
}

#page-header #nav-main .badge {
    min-width: 18px;
    margin-left: 4px;
    padding: 1px 5px;
    border-radius: 999px;
    background: #fff;
    color: var(--mwe-primary-strong);
}

/* ---------- Breadcrumbs ---------- */
#page-header #nav-breadcrumbs {
    width: calc(100% - 44px);
    max-width: var(--mwe-content-width);
    min-height: 43px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #edf1f5;
    color: var(--mwe-text-soft);
    line-height: normal;
}

#page-header #nav-breadcrumbs > li {
    float: none;
}

#page-header #nav-breadcrumbs .breadcrumbs {
    flex: 1 1 auto;
    padding: 0;
}

#page-header #nav-breadcrumbs .crumb a {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    color: #667a93;
    font-size: 11.5px;
    font-weight: 520;
}

#page-header #nav-breadcrumbs .crumb:last-child a,
#page-header #nav-breadcrumbs .crumb a:hover {
    color: var(--mwe-text);
}

#page-header #nav-breadcrumbs .crumb:before {
    color: #aebac8;
}

/* ---------- Sponsor banner from existing ads extension ---------- */
#topic-slot-banner.topic-slot {
    width: calc(100% - 44px);
    max-width: var(--mwe-content-width);
    margin: 11px auto 12px !important;
    padding: 0;
    box-sizing: border-box;
}

#topic-slot-banner.topic-slot a {
    width: fit-content;
    max-width: 100%;
    margin: 0 auto;
}

#topic-slot-banner.topic-slot img {
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto;
    border-radius: 4px;
}

/* ---------- Cards / panels ---------- */
.forabg,
.forumbg,
.panel,
.post,
.rules,
table.table1 {
    border-color: var(--mwe-border);
}

.forabg,
.forumbg,
.panel,
.post {
    border-radius: var(--mwe-radius);
    background: #fff;
    box-shadow: var(--mwe-shadow);
}

.panel {
    padding: 16px 18px;
}

.bg1,
.bg2,
.bg3 {
    background-color: #fff;
}

/* ---------- Forum / topic tables ---------- */
.forabg,
.forumbg {
    margin-bottom: 15px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--mwe-border);
}

.forabg > .inner,
.forumbg > .inner {
    margin: 0;
}

.forabg ul.topiclist > li.header,
.forumbg ul.topiclist > li.header {
    min-height: 38px;
    background: #fff;
    border-bottom: 1px solid var(--mwe-border);
}

.forabg ul.topiclist > li.header dl,
.forumbg ul.topiclist > li.header dl {
    min-height: 38px;
    align-items: center;
}

.forabg ul.topiclist > li.header dt,
.forabg ul.topiclist > li.header dd,
.forumbg ul.topiclist > li.header dt,
.forumbg ul.topiclist > li.header dd,
.forabg .header a,
.forumbg .header a {
    color: #16345c !important;
    font-family: inherit;
    font-size: 10.5px;
    font-weight: 760;
    letter-spacing: .035em;
    text-transform: uppercase;
}

ul.topiclist.forums,
ul.topiclist.topics {
    background: #fff;
}

ul.topiclist li.row {
    min-height: 48px;
    background: #fff;
    border-top: 1px solid var(--mwe-border);
    border-bottom: 0;
}

ul.topiclist li.row:first-child {
    border-top: 0;
}

ul.topiclist li.row:hover {
    background: #f8fbff;
}

ul.topiclist li.row dl {
    min-height: 48px;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    align-items: stretch;
}

ul.topiclist li.row dt,
ul.topiclist li.row dd {
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.row .list-inner {
    width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
}

.row-item .forumtitle,
.row-item .topictitle {
    color: #0757b8;
    font-family: inherit;
    font-size: 1.15em;
    font-weight: 720;
    line-height: 1.2;
}

.row-item .forumtitle:hover,
.row-item .topictitle:hover {
    color: var(--mwe-primary-dark);
}

ul.topiclist dd {
    border-left-color: var(--mwe-border);
    color: #46607f;
}

ul.topiclist li.row dd {
    border-color: var(--mwe-border);
}

ul.topiclist li.row dd.posts,
ul.topiclist li.row dd.topics,
ul.topiclist li.row dd.views {
    justify-content: center;
    font-variant-numeric: tabular-nums;
}

.lastpost {
    color: #536b87;
}

.lastpost a,
.lastpost .lastsubject {
    color: #0757b8;
    font-weight: 650;
}

.row-item:before {
    opacity: 1;
    border-radius: 50%;
}

.topic-title {
    margin: 5px 0 7px;
    color: var(--mwe-text);
    font-size: 2em;
    font-weight: 730;
    letter-spacing: -.015em;
}

/* ---------- Action bars / buttons / pagination ---------- */
.action-bar {
    margin: 8px 0 12px;
}

.button,
.button1,
.button2,
input.button1,
input.button2,
a.button1,
a.button2 {
    min-height: 30px;
    border-radius: 5px;
    border: 1px solid var(--mwe-border-strong);
    background: #fff;
    color: #0b57ad;
    box-shadow: none;
    font-family: inherit;
    font-weight: 650;
}

.button1,
input.button1,
a.button1,
.button.button-primary {
    border-color: #0764cf;
    background: #0764cf;
    color: #fff;
}

.button:hover,
.button:focus,
.button2:hover,
.button2:focus {
    border-color: #9fbbe0;
    background: #f1f7ff;
    color: var(--mwe-primary-dark);
}

.button1:hover,
.button1:focus,
input.button1:hover,
input.button1:focus,
a.button1:hover,
a.button1:focus {
    border-color: #0758b7;
    background: #0758b7;
    color: #fff;
}

.pagination {
    font-size: 11px;
}

.pagination li a,
.pagination li span,
.pagination li.active span {
    min-width: 28px;
    min-height: 28px;
    padding: 0 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border-radius: 4px;
}

.pagination li a {
    border-color: #d7e0ea;
    background: #fff;
    color: #365272;
}

.pagination li a:hover,
.pagination li.active span {
    border-color: #0a57a9;
    background: #0a57a9;
    color: #fff;
}

/* ---------- Thread / posts ---------- */
.post {
    margin-bottom: 12px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--mwe-border);
}

.post > .inner {
    min-height: 118px;
    margin: 0;
    padding: 0;
}

.postprofile {
    width: 255px;
    min-height: 118px;
    margin: 0;
    padding: 17px 16px;
    float: left;
    box-sizing: border-box;
    border: 0;
    border-right: 1px solid #edf1f5;
    background: #fff;
    color: #475e79;
}

.postprofile dd,
.postprofile dt {
    margin-left: 0;
    line-height: 1.35em;
}

.postprofile dt.author a,
.postprofile a.username,
.postprofile a.username-coloured {
    color: #0759bb;
    font-size: 1.14em;
    font-weight: 760;
}

.postprofile .avatar {
    margin-right: 12px;
}

.postprofile .avatar img {
    max-width: 64px;
    border-radius: 5px;
    box-shadow: none;
}

.postbody {
    width: calc(100% - 255px);
    margin: 0;
    padding: 15px 18px 18px;
    float: right;
    box-sizing: border-box;
    color: var(--mwe-text);
}

.postbody h3,
.has-profile .postbody h3 {
    margin: 0 120px 4px 0 !important;
    padding: 0 0 7px;
    float: none;
    border: 0;
    color: var(--mwe-text);
    font-size: 1.05em;
    font-weight: 680;
}

.postbody h3 a {
    color: #18395f;
}

.postbody p.author {
    margin: 0 110px 12px 0;
    color: #60758f;
    font-size: .95em;
}

.postbody .content {
    clear: both;
    min-height: 45px;
    color: #172f50;
    font-family: inherit;
    font-size: 1.15em;
    line-height: 1.58;
}

.post-buttons {
    top: 14px;
    right: 14px;
}

.post-buttons .button {
    min-width: 34px;
    min-height: 30px;
    border-color: #d7e0ea;
    background: #fff;
}

.post-buttons .button:hover {
    border-color: #a5bee0;
    background: #f4f8fd;
}

blockquote,
.codebox,
.attachbox {
    border-color: var(--mwe-border);
    border-radius: 6px;
    background: #f8fafc;
}

blockquote {
    border-left: 3px solid #8eb7e8;
}

/* ---------- Forms / login / registration / posting ---------- */
.inputbox,
select,
textarea,
input[type="text"],
input[type="password"],
input[type="email"],
input[type="search"],
input[type="url"],
input[type="number"] {
    border: 1px solid #d6dfe9;
    border-radius: 5px;
    background: #fff;
    color: var(--mwe-text);
    font-family: inherit;
}

.inputbox:focus,
select:focus,
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="search"]:focus,
input[type="url"]:focus,
input[type="number"]:focus {
    border-color: #82afe1;
    outline: 0;
    box-shadow: 0 0 0 3px rgba(7, 95, 196, .08);
}

fieldset.fields1 dt,
fieldset.fields2 dt,
fieldset.fields1 dd,
fieldset.fields2 dd {
    border-color: var(--mwe-border);
}

.section-ucp .panel,
.section-memberlist .panel,
.section-search .panel,
.section-posting .panel,
.section-faq .panel,
.section-mcp .panel {
    border: 1px solid var(--mwe-border);
    background: #fff;
}

/* ---------- UCP / MCP ---------- */
#cp-menu .panel,
#cp-main .panel,
#cp-main .post,
.panel-container .panel {
    border-color: var(--mwe-border);
    background: #fff;
}

#tabs .tab > a,
#minitabs .tab > a {
    border-radius: 5px 5px 0 0;
    background: #f3f6fa;
    color: #5e7188;
}

#tabs .activetab > a,
#tabs .activetab > a:hover,
#minitabs .activetab > a,
#minitabs .activetab > a:hover {
    background: #075ebf;
    color: #fff;
}

#navigation a {
    border-radius: 5px;
    color: #334f70;
}

#navigation a:hover,
#navigation #active-subsection a {
    background: #edf5ff;
    color: #0757b8;
}

/* ---------- Board3 ---------- */
#portal-body,
#portal-page-body {
    color: var(--mwe-text);
}

#portal-page-body {
    margin-top: 0 !important;
}

#portal-body .forabg,
#portal-left .forabg,
#portal-right .forabg,
#portal-center .forabg {
    margin-bottom: 12px;
    overflow: hidden;
    border: 1px solid var(--mwe-border) !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: var(--mwe-shadow) !important;
}

#portal-body .forabg > .inner,
#portal-left .forabg > .inner,
#portal-right .forabg > .inner,
#portal-center .forabg > .inner {
    margin: 0 !important;
}

#portal-body .forabg ul.topiclist > li.header,
#portal-left .forabg ul.topiclist > li.header,
#portal-right .forabg ul.topiclist > li.header,
#portal-center .forabg ul.topiclist > li.header {
    min-height: 39px !important;
    background: #fff !important;
    border-bottom: 1px solid var(--mwe-border) !important;
}

#portal-body .forabg ul.topiclist > li.header dt,
#portal-left .forabg ul.topiclist > li.header dt,
#portal-right .forabg ul.topiclist > li.header dt,
#portal-center .forabg ul.topiclist > li.header dt {
    padding: 10px 13px !important;
    color: #14345c !important;
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 760 !important;
    text-transform: uppercase;
    letter-spacing: .02em;
}

#portal-body .forabg ul.topiclist > li.header dt a,
#portal-left .forabg ul.topiclist > li.header dt a,
#portal-right .forabg ul.topiclist > li.header dt a {
    color: #14345c !important;
}

#portal-body .portal-side-wrapper,
#portal-left .portal-side-wrapper,
#portal-right .portal-side-wrapper {
    padding: 12px 13px !important;
    border: 0 !important;
    background: #fff !important;
}

#portal-body .portal-side,
#portal-left .portal-side,
#portal-right .portal-side {
    color: #526b87 !important;
    font-size: 11px;
    line-height: 1.5;
}

.portal-navigation ul {
    margin-bottom: 2px !important;
}

.portal-navigation ul li {
    padding: 0 !important;
}

.portal-navigation ul li a {
    padding: 6px 7px !important;
    border-radius: 5px;
    color: #355171 !important;
    font-size: 11px !important;
    font-weight: 580 !important;
}

.portal-navigation ul li a:hover {
    background: #f0f6fd !important;
    color: #0757b8 !important;
}

.portal-navigation .menutitle {
    margin-bottom: 4px;
    color: #18395f;
    font-family: inherit !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

#portal-login-box .inputbox {
    width: 100% !important;
    height: 34px;
    margin: 4px 0 8px;
    padding: 0 9px;
    box-sizing: border-box;
}

#portal-login-box input.button1 {
    width: 100%;
    height: 34px;
    margin-top: 5px;
}

#portal-center .panel.portal-no-margin,
#portal-center .post.portal-no-margin {
    margin: 0;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none !important;
}

#portal-center .portal-module-postbody,
#portal-center table.portal-module-postbody {
    width: 100%;
}

#portal-center .portal-recent-column {
    padding: 10px 13px;
    background: #fff !important;
}

#portal-center .portal-recent-column a {
    margin: 2px 0;
    color: #0757b8;
}

#portal-left,
#portal-right {
    box-sizing: border-box;
}

.b3p-copyright {
    margin: 8px auto 0;
    color: #8592a3;
    font-size: 10px;
    text-align: center;
}

/* ---------- Ad extension ---------- */
.ad-dialog {
    border-radius: 8px !important;
    box-shadow: 0 18px 50px rgba(10, 35, 65, .25) !important;
}

.ad-btn {
    border-radius: 6px !important;
}

.ad-btn-primary {
    background: #075fc4 !important;
}

/* ---------- Value strip + footer ---------- */
.mwe-value-strip {
    width: calc(100% - 44px);
    max-width: var(--mwe-content-width);
    margin: 22px auto 0;
    padding: 15px 20px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    box-sizing: border-box;
    border: 1px solid var(--mwe-border);
    border-radius: 8px;
    background: #fff;
    box-shadow: var(--mwe-shadow);
}

.mwe-value-item {
    min-width: 0;
    padding: 0 24px;
    display: flex;
    align-items: center;
    gap: 14px;
    border-right: 1px solid #e8edf3;
}

.mwe-value-item:first-child {
    padding-left: 0;
}

.mwe-value-item:last-child {
    padding-right: 0;
    border-right: 0;
}

.mwe-value-item > .icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d9e7f7;
    border-radius: 50%;
    background: #f7fbff;
    color: #075fc4;
    font-size: 20px;
}

.mwe-value-item div {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.mwe-value-item strong {
    margin-bottom: 4px;
    color: #18395f;
    font-size: 12px;
}

.mwe-value-item span {
    color: #63758b;
    font-size: 11px;
    line-height: 1.35;
}

#page-footer {
    margin: 12px 0 0;
    padding: 0;
    background: linear-gradient(90deg, #06427d 0%, #075695 54%, #06427d 100%);
    color: rgba(255,255,255,.86);
}

#page-footer > .navbar {
    width: calc(100% - 44px);
    max-width: var(--mwe-content-width);
    margin: 0 auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

#page-footer > .navbar #nav-footer {
    min-height: 42px;
    padding: 0;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(255,255,255,.10);
}

#page-footer > .navbar a,
#page-footer > .navbar .icon,
#page-footer > .navbar li,
#page-footer > .navbar span {
    color: rgba(255,255,255,.88);
}

#page-footer .copyright {
    width: calc(100% - 44px);
    max-width: var(--mwe-content-width);
    min-height: 48px;
    margin: 0 auto;
    padding: 12px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    box-sizing: border-box;
    color: rgba(255,255,255,.78);
}

#page-footer .footer-row {
    margin: 0;
}

#page-footer .footer-link,
#page-footer .footer-copyright,
#page-footer .footer-info {
    color: rgba(255,255,255,.82);
}

/* ---------- Dropdowns / tables ---------- */
.dropdown,
.dropdown-extended {
    border: 1px solid var(--mwe-border);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(17, 43, 74, .13);
}

.dropdown-contents a {
    color: #36516f;
}

.dropdown-contents a:hover {
    background: #f2f7fc;
    color: #0757b8;
}

table.table1 {
    overflow: hidden;
    border: 1px solid var(--mwe-border);
    border-radius: 7px;
    background: #fff;
}

table.table1 thead th {
    background: #f4f7fa;
    color: #17375e;
    border-color: var(--mwe-border);
}

table.table1 tbody td {
    border-color: var(--mwe-border);
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    .headerbar > .inner.mwe-header-inner {
        grid-template-columns: minmax(250px, 1fr) minmax(280px, 390px) auto;
        gap: 15px;
    }

    .mwe-brand-copy strong { font-size: 18px; }
    .mwe-account-actions { gap: 8px; }

    #page-header #nav-main > li > a,
    #page-header #nav-main > li.quick-links > a {
        padding-left: 11px;
        padding-right: 11px;
    }

    .mwe-value-item {
        padding-left: 14px;
        padding-right: 14px;
    }
}

@media (max-width: 850px) {
    .headerbar > .inner.mwe-header-inner,
    #page-header #nav-main,
    #page-header #nav-breadcrumbs,
    #page-body,
    #topic-slot-banner.topic-slot,
    .mwe-value-strip,
    #page-footer > .navbar,
    #page-footer .copyright {
        width: calc(100% - 28px);
    }

    .headerbar > .inner.mwe-header-inner {
        grid-template-columns: 1fr auto;
    }

    #search-box.search-header {
        grid-column: 1 / -1;
        grid-row: 2;
        max-width: none;
    }

    .headerbar > .inner.mwe-header-inner {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    #page-header #nav-main > .mwe-primary-nav:nth-of-type(4),
    #page-header #nav-main > .mwe-primary-nav:nth-of-type(5) {
        display: none;
    }

    .postprofile {
        width: 210px;
    }

    .postbody {
        width: calc(100% - 210px);
    }

    .mwe-value-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 18px;
    }

    .mwe-value-item:nth-child(2) {
        border-right: 0;
    }

    .mwe-value-item:nth-child(3),
    .mwe-value-item:nth-child(4) {
        padding-top: 15px;
        border-top: 1px solid #e8edf3;
    }
}

@media (max-width: 700px) {
    #page-header #nav-main,
    #page-header #nav-breadcrumbs,
    #page-body,
    #topic-slot-banner.topic-slot,
    .mwe-value-strip,
    #page-footer > .navbar,
    #page-footer .copyright,
    .headerbar > .inner.mwe-header-inner {
        width: calc(100% - 16px);
    }

    .mwe-brand-mark {
        width: 39px;
        height: 39px;
        flex-basis: 39px;
        font-size: 22px;
    }

    .mwe-brand-copy strong {
        font-size: 16px;
    }

    .mwe-brand-copy small {
        font-size: 10.5px;
    }

    .mwe-account-login span,
    .mwe-account-register span {
        display: none;
    }

    .mwe-account-register {
        width: 38px;
        padding: 0;
    }

    #page-header #nav-main {
        min-height: 42px;
        overflow-x: auto;
        scrollbar-width: none;
    }

    #page-header #nav-main::-webkit-scrollbar { display: none; }

    #page-header #nav-main > li > a,
    #page-header #nav-main > li.quick-links > a {
        min-height: 42px;
        padding: 0 10px;
        white-space: nowrap;
    }

    .mwe-nav-fill { min-width: 4px; }

    #page-header #nav-breadcrumbs {
        min-height: 38px;
    }

    #page-header #nav-breadcrumbs .crumb a {
        min-height: 37px;
    }

    .post > .inner {
        min-height: 0;
    }

    .postprofile {
        width: 100%;
        min-height: 0;
        padding: 10px 12px;
        float: none;
        border-right: 0;
        border-bottom: 1px solid #edf1f5;
    }

    .postprofile .avatar {
        max-width: 44px;
        margin-right: 9px;
    }

    .postprofile .avatar img {
        max-width: 44px;
    }

    .postbody {
        width: 100%;
        padding: 13px 12px 15px;
        float: none;
    }

    .postbody h3,
    .has-profile .postbody h3,
    .postbody p.author {
        margin-right: 78px !important;
    }

    .postbody .content {
        font-size: 1.13em;
    }

    .mwe-value-strip {
        grid-template-columns: 1fr;
        padding: 13px;
    }

    .mwe-value-item,
    .mwe-value-item:first-child,
    .mwe-value-item:last-child,
    .mwe-value-item:nth-child(3),
    .mwe-value-item:nth-child(4) {
        padding: 10px 0;
        border: 0;
        border-bottom: 1px solid #e8edf3;
    }

    .mwe-value-item:last-child {
        border-bottom: 0;
    }

    #page-footer > .navbar #nav-footer {
        min-height: 0;
        padding: 10px 0;
        display: block;
    }

    #page-footer .copyright {
        display: block;
        text-align: center;
    }
}

@media (max-width: 460px) {
    body { font-size: 11px; }

    .mwe-brand-copy strong { font-size: 14px; }
    .mwe-brand-copy small { display: none; }

    .headerbar > .inner.mwe-header-inner {
        gap: 8px;
    }

    #page-header #nav-main > .mwe-primary-nav:nth-of-type(3) {
        display: none;
    }

    .topic-title,
    h2 {
        font-size: 1.65em;
    }
}

/* Primary page actions in forum/topic views */
body.section-viewforum .action-bar.bar-top > a.button:first-of-type,
body.section-viewtopic .action-bar.bar-top > a.button:first-of-type,
body.section-posting input.button1[name="post"] {
    border-color: #0764cf;
    background: #0764cf;
    color: #fff;
}

body.section-viewforum .action-bar.bar-top > a.button:first-of-type .icon,
body.section-viewtopic .action-bar.bar-top > a.button:first-of-type .icon {
    color: #fff;
}

/* Keep Board3's established column logic, but make the spaces match the mockup. */
@media (min-width: 901px) {
    #portal-center {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    #portal-left .forabg,
    #portal-right .forabg {
        margin-bottom: 12px !important;
    }
}

/* ========================================================================== 
   v0.3.0 screenshot calibration
   Based on the real portal/viewforum/viewtopic screenshots from the test site.
   Presentation only: no routes, href variables, canonicals or rewrites change.
   ========================================================================== */

:root {
    --mwe-content-width: 1760px;
    --mwe-desktop-gutter: 28px;
    --mwe-portal-left: 240px;
    --mwe-portal-right: 250px;
}

/* The mockups use almost the full viewport. v0.2 was visibly too narrow. */
.headerbar > .inner.mwe-header-inner,
#page-header #nav-main,
#page-header #nav-breadcrumbs,
#page-body,
.mwe-value-strip,
#page-footer > .navbar,
#page-footer .copyright {
    width: calc(100% - (var(--mwe-desktop-gutter) * 2));
    max-width: var(--mwe-content-width);
}

/* Compact 75px desktop masthead from the reference design. */
.headerbar,
.headerbar > .inner.mwe-header-inner {
    height: 75px !important;
    min-height: 75px !important;
    box-sizing: border-box !important;
}

.headerbar > .inner.mwe-header-inner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    grid-template-columns: minmax(300px, 1fr) minmax(360px, 450px) minmax(300px, 1fr);
}

.mwe-brand-mark {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
}

/* Group-colour markup must not turn the header username red. */
.mwe-account-login,
.mwe-account-login span,
#page-header #username_logged_in > .header-profile > a,
#page-header #username_logged_in > .header-profile > a span,
#page-header #username_logged_in > .header-profile > a strong {
    color: #ffffff !important;
}

.mwe-account-login,
.mwe-account-login span {
    color: var(--mwe-primary-strong) !important;
}

/* Match the mockup: 46px dark-blue main navigation directly under the masthead. */
#page-header #nav-main {
    height: 46px;
    min-height: 46px;
}

#page-header #nav-main > li > a,
#page-header #nav-main > li > .header-profile > a,
#page-header #nav-main > li.quick-links > a {
    min-height: 46px;
}

/* Portal has no breadcrumb band in the homepage mockup. Modern browsers all
   support :has(); other pages retain the normal phpBB breadcrumb structure. */
body:has(#portal-body) #page-header #nav-breadcrumbs {
    display: none;
}

body:has(#portal-body) #page-body {
    margin-top: 12px;
}

/* Original campaign banner: centred, never visually stretched beyond its
   natural campaign format. The JS fallback below fixes subdirectory installs. */
#topic-slot-banner.topic-slot {
    width: calc(100% - (var(--mwe-desktop-gutter) * 2));
    max-width: 1220px;
    min-height: 0;
    margin: 12px auto 13px !important;
    line-height: 0;
    text-align: center;
}

#topic-slot-banner.topic-slot a {
    display: inline-block !important;
    width: auto !important;
    max-width: 100%;
}

#topic-slot-banner.topic-slot img {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    border-radius: 5px;
}

/* Board3: the actual ACP column widths were much narrower than the mockup.
   Override presentation only; Board3's content and links remain untouched. */
@media (min-width: 1101px) {
    #portal-left {
        width: var(--mwe-portal-left) !important;
    }

    #portal-right {
        width: var(--mwe-portal-right) !important;
        margin-left: calc(var(--mwe-portal-right) * -1) !important;
    }

    #portal-center {
        margin-left: var(--mwe-portal-left) !important;
        margin-right: var(--mwe-portal-right) !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

/* Portal cards are slightly roomier in the reference design. */
#portal-left .forabg,
#portal-right .forabg,
#portal-center .forabg {
    margin-bottom: 14px !important;
}

#portal-left .portal-side-wrapper,
#portal-right .portal-side-wrapper {
    padding: 14px 15px !important;
}

#portal-left .portal-navigation ul li a,
#portal-right .portal-navigation ul li a {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

/* Cleaner forum/topic tables: the reference uses denser rows than the test
   screenshots while keeping the metadata readable. */
body.section-viewforum ul.topiclist.topics li.row,
body.section-viewforum ul.topiclist.forums li.row {
    min-height: 44px;
}

body.section-viewforum ul.topiclist.topics li.row dl,
body.section-viewforum ul.topiclist.forums li.row dl {
    min-height: 44px;
}

body.section-viewforum ul.topiclist.topics .row .list-inner,
body.section-viewforum ul.topiclist.forums .row .list-inner {
    padding-top: 6px;
    padding-bottom: 6px;
}

body.section-viewforum .forabg,
body.section-viewforum .forumbg {
    margin-bottom: 14px;
}

body.section-viewforum .action-bar.bar-top {
    margin-top: 5px;
    margin-bottom: 12px;
}

/* Thread profile layout from the mockup: avatar/identity on one horizontal
   block, details aligned underneath, with an online status dot. */
@media (min-width: 701px) {
    .postprofile {
        width: 272px;
        padding: 17px 16px;
    }

    .postbody {
        width: calc(100% - 272px);
    }

    .postprofile dt.has-avatar {
        position: relative;
        min-height: 62px;
        padding-left: 74px;
        box-sizing: border-box;
    }

    .postprofile dt.has-avatar .avatar-container {
        position: absolute;
        top: 0;
        left: 0;
        width: 60px;
        height: 60px;
    }

    .postprofile dt.has-avatar ~ dd {
        margin-left: 74px;
    }

    .postprofile .avatar img {
        width: auto;
        max-width: 60px;
        max-height: 60px;
    }

    .postprofile dt.no-avatar {
        position: relative;
        min-height: 50px;
        padding-left: 60px;
        padding-top: 8px;
        box-sizing: border-box;
    }

    .postprofile dt.no-avatar::before {
        content: "\f007";
        position: absolute;
        top: 0;
        left: 0;
        width: 46px;
        height: 46px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #d6e4f4;
        border-radius: 50%;
        background: #f2f7fd;
        color: #1670c8;
        font-family: FontAwesome;
        font-size: 20px;
        font-weight: normal;
    }

    .postprofile dt.no-avatar ~ dd {
        margin-left: 60px;
    }

    .post.online .postprofile .avatar-container::after {
        content: "";
        position: absolute;
        right: -1px;
        bottom: -1px;
        width: 11px;
        height: 11px;
        border: 2px solid #fff;
        border-radius: 50%;
        background: #14a574;
        box-sizing: content-box;
    }
}

/* Flatter footer proportions, closer to the one-line mockup without removing
   phpBB's useful footer links. */
#page-footer > .navbar #nav-footer {
    min-height: 34px;
}

#page-footer .copyright {
    min-height: 42px;
    padding-top: 8px;
    padding-bottom: 8px;
}

#page-footer .footer-row {
    font-size: 10px;
}

/* Responsive recalibration for the new wider desktop shell. */
@media (max-width: 1100px) {
    :root {
        --mwe-desktop-gutter: 18px;
    }

    .headerbar > .inner.mwe-header-inner {
        grid-template-columns: minmax(250px, 1fr) minmax(280px, 390px) auto;
    }
}

@media (max-width: 850px) {
    :root {
        --mwe-desktop-gutter: 14px;
    }

    .headerbar,
    .headerbar > .inner.mwe-header-inner {
        height: auto !important;
        min-height: 66px !important;
    }

    .headerbar > .inner.mwe-header-inner {
        padding-top: 9px !important;
        padding-bottom: 9px !important;
    }
}

@media (max-width: 700px) {
    :root {
        --mwe-desktop-gutter: 8px;
    }

    body:has(#portal-body) #page-header #nav-breadcrumbs {
        display: none;
    }

    #topic-slot-banner.topic-slot {
        width: calc(100% - 16px);
        margin-top: 8px !important;
        margin-bottom: 9px !important;
    }
}

/* ========================================================================== 
   v0.4.0 visual convergence
   Stronger calibration to the approved homepage / forum / thread mockups.
   Presentation only. Existing phpBB href variables and route generation stay intact.
   ========================================================================== */

:root {
    --mwe-content-width: 1640px;
    --mwe-desktop-gutter: 32px;
    --mwe-portal-left: 220px;
    --mwe-portal-right: 250px;
    --mwe-text: #102a4c;
    --mwe-text-soft: #60738b;
    --mwe-page: #f6f8fb;
    --mwe-border: #dfe6ee;
    --mwe-shadow: 0 2px 12px rgba(24, 55, 90, .055);
}

body {
    font-size: 13px;
    line-height: 1.42;
}

/* More intentionally centred desktop canvas, as in the approved visuals. */
.headerbar > .inner.mwe-header-inner,
#page-header #nav-main,
#page-header #nav-breadcrumbs,
#page-body,
.mwe-value-strip,
#page-footer > .navbar,
#page-footer .copyright {
    width: calc(100% - (var(--mwe-desktop-gutter) * 2));
    max-width: var(--mwe-content-width);
}

#page-body {
    margin-top: 19px;
}

/* Header account area: keep the blue nav deliberately simple and move
   personal/admin tools into the white masthead. */
.mwe-account-actions {
    min-width: 250px;
}

.mwe-account-cluster {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
}

.mwe-account-icon,
.mwe-account-user {
    position: relative;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: 1px solid transparent;
    border-radius: 6px;
    color: #0b4f98 !important;
    text-decoration: none;
}

.mwe-account-icon {
    width: 38px;
    padding: 0 !important;
}

.mwe-account-user {
    gap: 5px;
    padding: 0 8px !important;
    font-size: 12px !important;
    font-weight: 650 !important;
}

.mwe-account-icon:hover,
.mwe-account-user:hover,
.mwe-account-profile.open .mwe-account-user,
.mwe-account-notifications.open .mwe-account-icon {
    border-color: #dbe7f4;
    background: #f5f9fe;
}

.mwe-account-actions .badge {
    position: absolute;
    top: 2px;
    right: 0;
    min-width: 15px;
    height: 15px;
    padding: 0 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #e64646;
    color: #fff;
    font-size: 8px;
    line-height: 1;
}

.mwe-account-chevron {
    margin-left: 1px;
    color: #8292a5 !important;
    font-size: 10px;
}

.mwe-account-profile .dropdown,
.mwe-account-notifications .dropdown-extended {
    margin-top: 8px;
}

/* The primary bar in the mockup has only core navigation on the left and
   reading/topic shortcuts on the right. */
#page-header #nav-main {
    height: 47px;
    min-height: 47px;
}

#page-header #nav-main > li > a,
#page-header #nav-main > li.quick-links > a {
    min-height: 47px;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 12.5px;
}

#page-header #nav-main > li:first-child > a {
    padding-left: 4px;
}

#page-header #nav-main > .mwe-secondary-nav > a {
    padding-left: 16px;
    padding-right: 16px;
}

/* Breadcrumb strip: lighter and airier, visibly separated from the page. */
#page-header #nav-breadcrumbs {
    min-height: 42px;
    border-bottom: 0;
    box-shadow: 0 1px 0 #edf1f5;
}

#page-header #nav-breadcrumbs .crumb a {
    min-height: 42px;
    font-size: 12px;
}

/* Ad slots: the approved homepage gives the campaign banner a much stronger
   visual presence. The original image and affiliate link are still used. */
#topic-slot-banner.topic-slot {
    max-width: var(--mwe-content-width);
    margin-top: 11px !important;
    margin-bottom: 15px !important;
}

#topic-slot-banner.topic-slot img {
    width: min(100%, 980px) !important;
    max-width: 980px !important;
    height: auto !important;
    object-fit: contain;
}

body:has(#portal-body) #topic-slot-banner.topic-slot img {
    width: min(100%, 1210px) !important;
    max-width: 1210px !important;
}

/* ---------- Page headings and toolbars ---------- */
h2,
.topic-title {
    margin-top: 8px;
    margin-bottom: 8px;
    font-size: 21px;
    line-height: 1.18;
    font-weight: 760;
    letter-spacing: -.018em;
}

.action-bar.bar-top {
    min-height: 34px;
    margin: 6px 0 12px;
}

.action-bar .button,
.action-bar .button1,
.action-bar .button2 {
    min-height: 32px;
}

.action-bar .search-box fieldset {
    height: 32px;
    display: flex;
    overflow: hidden;
    border: 1px solid #d5dee9;
    border-radius: 5px;
    background: #fff;
}

.action-bar .search-box .inputbox,
.action-bar .search-box .button {
    height: 30px;
    min-height: 30px;
    margin: 0;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none;
}

.action-bar .search-box .button {
    border-left: 1px solid #e4e9ef !important;
}

/* ---------- Forum and topic tables ---------- */
.forabg,
.forumbg {
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(17, 44, 76, .04);
}

.forabg ul.topiclist > li.header,
.forumbg ul.topiclist > li.header {
    min-height: 40px;
}

.forabg ul.topiclist > li.header dl,
.forumbg ul.topiclist > li.header dl {
    min-height: 40px;
}

.forabg ul.topiclist > li.header dt,
.forabg ul.topiclist > li.header dd,
.forumbg ul.topiclist > li.header dt,
.forumbg ul.topiclist > li.header dd,
.forabg .header a,
.forumbg .header a {
    font-size: 10.5px;
    letter-spacing: .025em;
}

ul.topiclist li.row,
ul.topiclist li.row dl {
    min-height: 54px;
}

.row .list-inner {
    padding-top: 7px;
    padding-bottom: 7px;
}

.row-item .forumtitle,
.row-item .topictitle {
    font-size: 14px;
    font-weight: 730;
    letter-spacing: -.008em;
}

.row-item .topictitle + br + span,
.row-item .forumtitle + br + span,
ul.topiclist li.row .list-inner > span,
ul.topiclist li.row .list-inner > a + span {
    color: #62748a;
    font-size: 11.5px;
}

ul.topiclist li.row dd.posts,
ul.topiclist li.row dd.topics,
ul.topiclist li.row dd.views,
ul.topiclist li.row dd.lastpost {
    font-size: 12px;
}

ul.topiclist li.row dd.posts,
ul.topiclist li.row dd.topics,
ul.topiclist li.row dd.views {
    color: #274e7d;
}

ul.topiclist li.row dd.lastpost {
    padding-left: 16px;
    padding-right: 14px;
}

.row-item:before {
    box-shadow: inset 0 0 0 1px rgba(10, 91, 178, .12);
}

/* ---------- Board3 homepage ---------- */
body:has(#portal-body) #page-body {
    margin-top: 15px;
}

@media (min-width: 1101px) {
    #portal-left {
        width: var(--mwe-portal-left) !important;
    }

    #portal-right {
        width: var(--mwe-portal-right) !important;
        margin-left: calc(var(--mwe-portal-right) * -1) !important;
    }

    #portal-center {
        margin-left: var(--mwe-portal-left) !important;
        margin-right: var(--mwe-portal-right) !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }
}

#portal-left .forabg,
#portal-right .forabg,
#portal-center .forabg {
    border-radius: 9px !important;
    box-shadow: 0 3px 12px rgba(24, 55, 90, .05) !important;
}

#portal-left .forabg ul.topiclist > li.header,
#portal-right .forabg ul.topiclist > li.header,
#portal-center .forabg ul.topiclist > li.header {
    min-height: 42px !important;
}

#portal-left .forabg ul.topiclist > li.header dt,
#portal-right .forabg ul.topiclist > li.header dt,
#portal-center .forabg ul.topiclist > li.header dt {
    padding: 11px 14px !important;
    font-size: 11px !important;
}

#portal-left .portal-side-wrapper,
#portal-right .portal-side-wrapper {
    padding: 13px 14px !important;
}

.portal-navigation ul li a {
    padding: 7px 7px !important;
    font-size: 11.5px !important;
}

#portal-center ul.topiclist li.row,
#portal-center ul.topiclist li.row dl {
    min-height: 61px;
}

#portal-center .row .list-inner {
    padding-top: 8px;
    padding-bottom: 8px;
}

#portal-center .row-item .topictitle {
    font-size: 14px;
}

#portal-center dd.posts,
#portal-center dd.views,
#portal-center dd.lastpost {
    font-size: 12px;
}

/* User/sidebar cards look less like legacy Board3 boxes. */
#portal-left hr.dashed,
#portal-right hr.dashed {
    border-top-color: #e7edf3 !important;
}

#portal-left .portal-title-span,
#portal-right .portal-title-span,
#portal-left .gensmall,
#portal-right .gensmall {
    font-size: 11.5px;
    line-height: 1.5;
}

/* ---------- Thread view ---------- */
body.section-viewtopic .post {
    margin-bottom: 11px;
    border-radius: 9px;
    box-shadow: 0 2px 10px rgba(20, 50, 84, .04);
}

body.section-viewtopic .post > .inner {
    min-height: 118px;
}

@media (min-width: 701px) {
    body.section-viewtopic .postprofile {
        width: 270px;
        padding: 16px 16px;
    }

    body.section-viewtopic .postbody {
        width: calc(100% - 270px);
        padding: 14px 18px 15px;
    }

    body.section-viewtopic .postprofile dt.has-avatar {
        min-height: 58px;
        padding-left: 72px;
    }

    body.section-viewtopic .postprofile dt.has-avatar .avatar-container {
        width: 58px;
        height: 58px;
    }

    body.section-viewtopic .postprofile dt.has-avatar ~ dd {
        margin-left: 72px;
    }

    body.section-viewtopic .postprofile .avatar img {
        max-width: 58px;
        max-height: 58px;
    }
}

.postprofile dt.author a,
.postprofile a.username,
.postprofile a.username-coloured,
.postprofile dt strong,
.postprofile dt > a {
    font-size: 13px;
    font-weight: 760;
}

.postprofile dd {
    color: #5e7188;
    font-size: 11.5px;
    line-height: 1.42;
}

.postprofile .profile-rank {
    margin-top: 1px;
    margin-bottom: 7px;
    color: #728297;
}

.postbody h3,
.has-profile .postbody h3 {
    margin-right: 145px !important;
    margin-bottom: 3px !important;
    padding-bottom: 4px;
    color: #17395f;
    font-size: 12.5px;
}

.postbody p.author {
    margin: 0 145px 11px 0;
    color: #677b92;
    font-size: 11.5px;
}

.postbody .content {
    min-height: 32px;
    color: #18314f;
    font-size: 13px;
    line-height: 1.55;
}

.postbody .content p {
    margin-top: 0;
    margin-bottom: 10px;
}

.postbody .content p:last-child {
    margin-bottom: 0;
}

.signature {
    margin-top: 12px;
    padding-top: 9px;
    border-top-color: #e3e8ee;
    color: #64768a;
    font-size: 11.5px;
}

/* Approved mockup: quote is the explicit action, moderation/editing actions
   live behind a three-dot menu. All original action URLs remain unchanged. */
.post-buttons.mwe-post-actions {
    top: 13px;
    right: 14px;
    display: flex;
    flex-direction: row-reverse;
    gap: 6px;
}

.post-buttons.mwe-post-actions > li {
    margin: 0;
}

.post-buttons.mwe-post-actions .button {
    min-height: 31px;
    height: 31px;
    border-color: #d8e1ea;
    border-radius: 5px;
    background: #fff;
    color: #0a539f;
}

.post-buttons.mwe-post-actions .mwe-quote-button {
    min-width: 78px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.post-buttons.mwe-post-actions .mwe-quote-label {
    display: inline-block;
    font-size: 11.5px;
    font-weight: 680;
}

.post-buttons.mwe-post-actions .mwe-post-more > .button {
    width: 32px;
    min-width: 32px;
    padding: 0;
}

.mwe-post-more .dropdown {
    top: 37px;
    min-width: 185px;
}

.mwe-post-more .dropdown-contents a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    font-size: 11.5px;
}

/* Forum information blocks at the bottom should read as intentional secondary
   information instead of raw legacy text. */
body.section-viewforum .stat-block,
body.section-viewforum .panel + .stat-block {
    margin-top: 14px;
}

body.section-viewforum .stat-block h3 {
    margin-bottom: 6px;
    padding-bottom: 7px;
    border-bottom: 1px solid #e4e9ef;
    color: #17385e;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .025em;
}

/* Footer/value strip proportions from the reference design. */
.mwe-value-strip {
    margin-top: 20px;
    padding-top: 15px;
    padding-bottom: 15px;
}

#page-footer {
    margin-top: 12px;
}

/* ---------- Responsive convergence ---------- */
@media (max-width: 1100px) {
    :root {
        --mwe-desktop-gutter: 20px;
    }

    .mwe-account-actions {
        min-width: 190px;
    }

    .mwe-account-user span {
        max-width: 100px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

@media (max-width: 850px) {
    :root {
        --mwe-desktop-gutter: 14px;
    }

    .mwe-account-actions {
        min-width: 0;
    }

    .mwe-account-user span,
    .mwe-account-chevron {
        display: none;
    }

    .mwe-account-user {
        width: 38px;
        padding: 0 !important;
    }

    #topic-slot-banner.topic-slot img,
    body:has(#portal-body) #topic-slot-banner.topic-slot img {
        width: auto !important;
        max-width: 100% !important;
    }
}

@media (max-width: 700px) {
    :root {
        --mwe-desktop-gutter: 8px;
    }

    body {
        font-size: 12px;
    }

    .mwe-account-cluster > .mwe-account-icon,
    .mwe-account-notifications {
        display: none !important;
    }

    #page-header #nav-main > li > a,
    #page-header #nav-main > li.quick-links > a {
        padding-left: 11px;
        padding-right: 11px;
        font-size: 11.5px;
    }

    #page-header #nav-main > .mwe-primary-nav:nth-of-type(4),
    #page-header #nav-main > .mwe-primary-nav:nth-of-type(5) {
        display: none;
    }

    h2,
    .topic-title {
        font-size: 20px;
    }

    body.section-viewtopic .postprofile {
        display: flex;
        align-items: center;
        min-height: 56px;
        padding: 9px 12px;
    }

    body.section-viewtopic .postprofile dt {
        flex: 1 1 auto;
        min-width: 0;
    }

    body.section-viewtopic .postprofile dd {
        display: none;
    }

    body.section-viewtopic .postbody {
        padding: 12px 12px 15px;
    }

    .postbody h3,
    .has-profile .postbody h3 {
        margin-right: 62px !important;
        margin-bottom: 6px !important;
    }

    .postbody p.author {
        margin-right: 62px !important;
        margin-bottom: 13px;
    }

    .postbody .content {
        font-size: 13px;
        line-height: 1.55;
    }

    .post-buttons.mwe-post-actions {
        top: 9px;
        right: 9px;
    }

    .post-buttons.mwe-post-actions .mwe-post-quote {
        display: none;
    }

    .post-buttons.mwe-post-actions .mwe-post-more > .button {
        width: 42px;
        height: 36px;
    }
}


/* ========================================================================== 
   v0.4.1 fixes
   - cleaner breadcrumbs on portal/index
   - stable action button alignment / hover
   - readable account dropdown labels
   - visible post action menu entries
   ========================================================================== */

/* Portal + forum index: no breadcrumb strip in the approved look. */
body.section-index #page-header #nav-breadcrumbs,
body:has(#portal-body) #page-header #nav-breadcrumbs {
    display: none !important;
}

body.section-index #page-body,
body:has(#portal-body) #page-body {
    margin-top: 14px;
}

/* Other pages: simpler breadcrumb strip, no odd tab-like appearance. */
body:not(.section-index) #page-header #nav-breadcrumbs {
    width: calc(100% - (var(--mwe-desktop-gutter) * 2));
    max-width: var(--mwe-content-width);
    min-height: 36px;
    margin: 0 auto;
    padding: 0 2px;
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 0;
    border-top: 1px solid #edf2f7;
    box-shadow: none;
}

body:not(.section-index) #page-header #nav-breadcrumbs .breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb {
    display: inline-flex;
    align-items: center;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb a {
    min-height: 36px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    color: #667a93;
    font-size: 12px;
    font-weight: 500;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:first-child a {
    padding-left: 0;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:last-child a {
    color: #17395f;
    font-weight: 700;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:before {
    color: #b6c1ce;
}

/* Stable button rendering in action bars. */
.action-bar .button,
.action-bar .button1,
.action-bar .button2,
.action-bar a.button,
.action-bar a.button1,
.action-bar a.button2,
.action-bar .dropdown-select,
.action-bar .button-icon-only,
.action-bar .button-search,
.action-bar .button-search-end {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 12px;
    line-height: 1;
    text-decoration: none;
    vertical-align: middle;
}

.action-bar .button .icon,
.action-bar .button1 .icon,
.action-bar .button2 .icon,
.action-bar a.button .icon,
.action-bar a.button1 .icon,
.action-bar a.button2 .icon,
.action-bar .dropdown-select .icon {
    position: static !important;
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
    float: none !important;
}

.action-bar .button:hover,
.action-bar .button:focus,
.action-bar .button2:hover,
.action-bar .button2:focus,
.action-bar .dropdown-select:hover,
.action-bar .dropdown-select:focus {
    box-shadow: none;
    background: #f3f7fc;
    border-color: #cfd9e5;
    color: #0757b8;
}

body.section-viewforum .action-bar.bar-top > a.button:first-of-type:hover,
body.section-viewforum .action-bar.bar-top > a.button:first-of-type:focus,
body.section-viewtopic .action-bar.bar-top > a.button:first-of-type:hover,
body.section-viewtopic .action-bar.bar-top > a.button:first-of-type:focus,
body.section-posting input.button1[name="post"]:hover,
body.section-posting input.button1[name="post"]:focus,
.mwe-reply-button:hover,
.mwe-reply-button:focus {
    background: #0764cf;
    border-color: #0764cf;
    color: #fff;
    box-shadow: none;
}

body.section-viewforum .action-bar.bar-top > a.button:first-of-type:hover .icon,
body.section-viewtopic .action-bar.bar-top > a.button:first-of-type:hover .icon,
.mwe-reply-button:hover .icon,
.mwe-reply-button:focus .icon {
    color: #fff;
}

.action-bar .search-box .button,
.action-bar .search-box .button-search-end {
    min-width: 40px;
    padding: 0 10px;
}

/* Avoid native title tooltip on the main reply CTA; visuals already explain the action. */
.mwe-reply-button[title] {
    pointer-events: auto;
}

/* Account/profile dropdown: labels must always be visible. */
.mwe-account-profile .dropdown,
.mwe-account-notifications .dropdown-extended {
    min-width: 220px;
}

.mwe-account-profile .dropdown-contents,
.mwe-account-notifications .dropdown-contents {
    padding: 6px 0;
}

.mwe-account-profile .dropdown-contents > li,
.mwe-account-notifications .dropdown-contents > li,
.mwe-post-more .dropdown-contents > li {
    border: 0;
}

.mwe-account-profile .dropdown-contents a,
.mwe-account-notifications .dropdown-contents a,
.mwe-post-more .dropdown-contents a {
    display: flex !important;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    padding: 8px 14px;
    color: #17395f !important;
    font-size: 12.5px;
    line-height: 1.25;
    white-space: nowrap;
}

.mwe-account-profile .dropdown-contents a span,
.mwe-account-notifications .dropdown-contents a span,
.mwe-post-more .dropdown-contents a span {
    display: inline !important;
    color: inherit !important;
    opacity: 1 !important;
    visibility: visible !important;
    font-size: inherit !important;
}

.mwe-account-profile .dropdown-contents a .icon,
.mwe-account-notifications .dropdown-contents a .icon,
.mwe-post-more .dropdown-contents a .icon {
    position: static !important;
    float: none !important;
    flex: 0 0 16px;
    width: 16px;
    margin: 0 !important;
    color: #315980 !important;
}

.mwe-account-profile .dropdown-contents li.separator,
.mwe-account-notifications .dropdown-contents li.separator,
.mwe-post-more .dropdown-contents li.separator {
    height: 1px;
    margin: 5px 0;
    background: #e7edf3;
}

/* Post action dropdown should reliably sit above the post card and keep text visible. */
.post-buttons.mwe-post-actions,
.mwe-post-more,
.mwe-account-profile,
.mwe-account-notifications {
    position: relative;
}

.mwe-post-more .dropdown,
.mwe-account-profile .dropdown,
.mwe-account-notifications .dropdown-extended {
    z-index: 120;
}

.mwe-post-more .dropdown {
    right: 0;
    left: auto;
    min-width: 210px;
}

/* Slightly calmer reply button proportions. */
.mwe-reply-button {
    min-width: 106px;
    font-weight: 700;
}

/* Mobile: keep the button row compact and readable. */
@media (max-width: 700px) {
    .action-bar .button,
    .action-bar .button1,
    .action-bar .button2,
    .action-bar a.button,
    .action-bar a.button1,
    .action-bar a.button2 {
        min-height: 34px;
        padding: 0 10px;
    }

    .mwe-account-profile .dropdown,
    .mwe-account-notifications .dropdown-extended,
    .mwe-post-more .dropdown {
        min-width: 190px;
    }
}


/* ========================================================================== 
   v0.4.2 interaction/layout fixes
   ========================================================================== */

/* --- Header account: avatar and readable profile menu --- */
.mwe-account-user {
    min-width: 0;
}

.mwe-account-avatar {
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background: #eef5fc;
}

.mwe-account-avatar img {
    width: 26px !important;
    height: 26px !important;
    max-width: 26px !important;
    max-height: 26px !important;
    object-fit: cover;
    border-radius: 50%;
}

.mwe-account-name {
    display: inline-block !important;
    color: #17395f !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.mwe-account-profile .dropdown {
    width: 236px;
    min-width: 236px;
    overflow: visible;
}

.mwe-account-profile .dropdown .dropdown-contents {
    width: 100%;
    box-sizing: border-box;
    overflow: visible;
}

.mwe-account-profile .dropdown-contents a {
    width: 100%;
    box-sizing: border-box;
    text-align: left;
}

.mwe-account-profile .dropdown-contents a span {
    flex: 1 1 auto;
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
}

/* --- Breadcrumb: one clean hierarchy, no duplicate Portal > Forum index. --- */
body:not(.section-index) #page-header #nav-breadcrumbs {
    min-height: 38px;
    padding: 0;
    background: #f8fafc;
    border: 0;
    box-shadow: inset 0 -1px 0 #e7edf4;
}

body:not(.section-index) #page-header #nav-breadcrumbs .breadcrumbs {
    min-height: 38px;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb a {
    min-height: 38px;
    padding: 0 9px;
    color: #60758d;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    text-decoration: none;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:first-child a {
    padding-left: 0;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:last-child a {
    color: #15385f;
    font-weight: 700;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:before {
    margin: 0 1px;
    color: #aab8c7;
}

/* Keep portal and index free of a redundant breadcrumb band. */
body.section-index #page-header #nav-breadcrumbs,
body:has(#portal-body) #page-header #nav-breadcrumbs {
    display: none !important;
}

/* --- Buttons: neutralize prosilver gradient/text-shadow on hover. --- */
.button,
.button:hover,
.button:focus,
.button1,
.button1:hover,
.button1:focus,
.button2,
.button2:hover,
.button2:focus,
a.button,
a.button:hover,
a.button:focus,
a.button1,
a.button1:hover,
a.button1:focus,
a.button2,
a.button2:hover,
a.button2:focus,
input.button1,
input.button1:hover,
input.button1:focus,
input.button2,
input.button2:hover,
input.button2:focus {
    background-image: none !important;
    filter: none !important;
    text-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    transform: none !important;
}

.mwe-reply-button,
.mwe-reply-button:hover,
.mwe-reply-button:focus {
    min-width: 112px;
    background: #0764cf !important;
    border-color: #0764cf !important;
    color: #fff !important;
    text-shadow: none !important;
    background-image: none !important;
    box-shadow: none !important;
}

.mwe-reply-button span,
.mwe-reply-button:hover span,
.mwe-reply-button:focus span,
.mwe-reply-button .icon,
.mwe-reply-button:hover .icon,
.mwe-reply-button:focus .icon {
    color: #fff !important;
    text-shadow: none !important;
}

.mwe-reply-button:hover,
.mwe-reply-button:focus {
    background: #075bbd !important;
    border-color: #075bbd !important;
}

/* --- Post controls: restore absolute top-right placement. --- */
.postbody {
    position: relative;
}

.has-profile .post-buttons.mwe-post-actions,
.post-buttons.mwe-post-actions {
    position: absolute !important;
    top: 13px !important;
    right: 14px !important;
    left: auto !important;
    float: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    z-index: 30;
}

.mwe-post-more {
    position: relative !important;
}

.mwe-post-more .dropdown {
    position: absolute;
    top: 38px;
    right: 0;
    left: auto;
    z-index: 150;
}

/* Reserve room for the controls so title/author never collide with them. */
body.section-viewtopic .postbody h3,
body.section-viewtopic .postbody p.author {
    margin-right: 138px !important;
}

@media (max-width: 850px) {
    .mwe-account-name,
    .mwe-account-chevron {
        display: none !important;
    }

    .mwe-account-user {
        width: 38px;
        padding: 0 !important;
    }
}

@media (max-width: 700px) {
    .has-profile .post-buttons.mwe-post-actions,
    .post-buttons.mwe-post-actions {
        top: 10px !important;
        right: 10px !important;
    }

    body.section-viewtopic .postbody h3,
    body.section-viewtopic .postbody p.author {
        margin-right: 54px !important;
    }
}


/* ========================================================================== 
   v0.4.3 layout polish
   ========================================================================== */

/* A conventional desktop reading width: roomy without stretching content
   across ultra-wide screens. */
:root {
    --mwe-content-width: 1440px;
    --mwe-desktop-gutter: 24px;
    --mwe-portal-left: 220px;
    --mwe-portal-right: 240px;
}

/* ---------- Breadcrumbs ----------
   Keep the structural phpBB links, but present them as one calm full-width
   strip. Board3's duplicate Portal crumb is suppressed by a style override. */
body:not(.section-index) #page-header #nav-breadcrumbs {
    width: calc(100% - (var(--mwe-desktop-gutter) * 2));
    max-width: var(--mwe-content-width);
    min-height: 38px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: center;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #e7edf3;
    box-shadow: 0 0 0 100vmax #fff;
    clip-path: inset(0 -100vmax);
}

body:not(.section-index) #page-header #nav-breadcrumbs .breadcrumbs {
    min-height: 38px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb {
    display: inline-flex;
    align-items: center;
    float: none;
    font-weight: 500;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:before {
    content: '\203A' !important;
    padding: 0 7px !important;
    color: #a9b7c6 !important;
    font-weight: 600;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:first-child:before {
    content: none !important;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb a {
    min-height: 38px;
    padding: 0 2px;
    display: inline-flex;
    align-items: center;
    color: #61768e;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb a:hover {
    color: #0757b8;
}

body:not(.section-index) #page-header #nav-breadcrumbs .crumb:last-child a {
    color: #17395f;
    font-weight: 700;
}

body.section-index #page-header #nav-breadcrumbs,
body:has(#portal-body) #page-header #nav-breadcrumbs {
    display: none !important;
}

/* ---------- Board3 search ---------- */
#portal-left #qsearch_form,
#portal-right #qsearch_form {
    margin: 0;
}

#portal-left #qsearch_form p,
#portal-right #qsearch_form p {
    margin: 0 0 8px;
}

#portal-left #qsearch_form #searchfield,
#portal-right #qsearch_form #searchfield {
    width: 100% !important;
    height: 34px;
    box-sizing: border-box;
    padding: 0 10px !important;
    border: 1px solid #d5dee8;
    border-radius: 6px;
    background-color: #fff !important;
    background-image: none !important;
    background-position: initial !important;
    background-repeat: no-repeat !important;
    color: #17395f;
    font-size: 12px;
}

#portal-left #qsearch_form p:nth-of-type(2),
#portal-right #qsearch_form p:nth-of-type(2) {
    display: flex;
    align-items: center;
    gap: 6px;
}

#portal-left #qsearch_select,
#portal-right #qsearch_select {
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
    height: 34px;
    box-sizing: border-box;
    margin: 0;
    padding: 0 28px 0 9px;
    border: 1px solid #d5dee8;
    border-radius: 6px;
    background-color: #fff;
    color: #17395f;
    font-size: 12px;
}

#portal-left #qsearch_form input.button2,
#portal-right #qsearch_form input.button2 {
    flex: 0 0 auto;
    min-width: 42px;
    height: 34px;
    margin: 0;
    padding: 0 10px;
    border: 1px solid #cbd7e4;
    border-radius: 6px;
    background: #fff !important;
    color: #0757b8 !important;
    font-size: 12px;
    line-height: 32px;
}

#portal-left #qsearch_form input.button2:hover,
#portal-right #qsearch_form input.button2:hover {
    background: #f2f7fc !important;
    border-color: #b9c9da;
}

/* Portal user module: always show a compact avatar/fallback. */
.mwe-portal-user-avatar {
    width: 58px;
    height: 58px;
    margin: 8px auto 3px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid #d8e3ee;
    border-radius: 50%;
    background: #f1f6fc;
}

.mwe-portal-user-avatar img {
    width: 58px !important;
    height: 58px !important;
    max-width: 58px !important;
    max-height: 58px !important;
    object-fit: cover;
}

.mwe-portal-user-avatar-fallback .icon {
    color: #0a62c8;
    font-size: 22px;
}

/* ---------- Dropdowns ----------
   Prosilver styles both the outer positioning shell and the inner menu. That
   produced the second white rectangle. Keep the shell transparent and style
   only the real menu surface. */
.dropdown:not(.dropdown-extended) {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.dropdown:not(.dropdown-extended) > .dropdown-contents {
    border: 1px solid #cfd9e4 !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(18, 45, 76, .16) !important;
}

.dropdown:not(.dropdown-extended) .pointer {
    border-color: #cfd9e4 transparent !important;
}

.dropdown:not(.dropdown-extended) .pointer-inner {
    border-color: #fff transparent !important;
}

/* ---------- Post back-to-top ---------- */
body.section-viewtopic .post > .inner {
    position: relative;
}

body.section-viewtopic .back2top {
    position: absolute;
    right: 8px;
    bottom: 7px;
    z-index: 12;
    clear: none;
}

body.section-viewtopic .back2top .top {
    width: 24px;
    height: 24px;
    margin: 0 !important;
    float: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #71859c;
    background: #fff;
}

body.section-viewtopic .back2top .top .icon {
    color: #71859c;
    font-size: 14px;
}

body.section-viewtopic .back2top .top:hover,
body.section-viewtopic .back2top .top:focus {
    background: #f1f6fb;
    color: #0757b8;
}

/* ---------- Footer navigation ---------- */
#page-footer {
    margin-top: 20px;
}

#page-footer > .navbar {
    width: calc(100% - (var(--mwe-desktop-gutter) * 2));
    max-width: var(--mwe-content-width);
}

#page-footer > .navbar #nav-footer {
    min-height: 0;
    padding: 14px 0 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 5px 8px;
    border-bottom: 1px solid rgba(255,255,255,.12);
    line-height: normal;
}

#page-footer #nav-footer > li,
#page-footer #nav-footer > li.rightside,
#page-footer #nav-footer .breadcrumbs {
    float: none !important;
    margin: 0 !important;
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
}

#page-footer #nav-footer .crumb {
    float: none;
}

#page-footer #nav-footer .crumb:before {
    content: none !important;
}

#page-footer #nav-footer a {
    min-height: 30px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border-radius: 5px;
    color: rgba(255,255,255,.86) !important;
    font-size: 11.5px;
    font-weight: 560;
    text-decoration: none;
}

#page-footer #nav-footer a:hover,
#page-footer #nav-footer a:focus {
    background: rgba(255,255,255,.10);
    color: #fff !important;
}

#page-footer #nav-footer .icon {
    color: rgba(255,255,255,.72) !important;
}

#page-footer .copyright {
    width: calc(100% - (var(--mwe-desktop-gutter) * 2));
    max-width: var(--mwe-content-width);
    min-height: 54px;
    padding: 12px 0 16px;
    flex-wrap: wrap;
    gap: 7px 16px;
    font-size: 10.5px;
}

#page-footer .footer-link {
    display: inline-flex;
    padding: 4px 6px;
    border-radius: 4px;
    text-decoration: none;
}

#page-footer .footer-link:hover,
#page-footer .footer-link:focus {
    background: rgba(255,255,255,.08);
    color: #fff;
}

@media (max-width: 850px) {
    :root {
        --mwe-desktop-gutter: 14px;
    }

    #page-footer > .navbar #nav-footer {
        justify-content: flex-start;
    }
}


/* ==========================================================================
   v0.4.4 responsive navigation / forum list / footer repairs
   ========================================================================== */

/* Top navigation deliberately contains only Forum + Aktuelles on the left. */
#page-header #nav-main {
    overflow: visible;
}

/* Portal belongs in the breadcrumb hierarchy on forum/topic pages. */
body:not(.section-index) #page-header #nav-breadcrumbs .mwe-portal-crumb {
    display: inline-flex !important;
}

/* Footer: never let phpBB collapse our footer links into the generic blank
   responsive overflow dropdown. The custom footer links simply wrap. */
#page-footer .mwe-footer-navbar .responsive-menu,
#page-footer .mwe-footer-navbar .dropdown-container.responsive-menu {
    display: none !important;
}

#page-footer .mwe-footer-navbar {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

#page-footer .mwe-footer-links {
    min-height: 0 !important;
    margin: 0 !important;
    padding: 16px 0 13px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 7px 10px;
    border-bottom: 1px solid rgba(255,255,255,.14);
    line-height: 1.2 !important;
}

#page-footer .mwe-footer-links > li {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
}

#page-footer .mwe-footer-links > li > a,
#page-footer .mwe-footer-links .crumb > a {
    min-height: 32px;
    padding: 0 10px !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    border-radius: 6px;
    color: rgba(255,255,255,.9) !important;
    font-size: 11.5px;
    font-weight: 600;
    text-decoration: none !important;
}

#page-footer .mwe-footer-links > li > a:hover,
#page-footer .mwe-footer-links > li > a:focus,
#page-footer .mwe-footer-links .crumb > a:hover,
#page-footer .mwe-footer-links .crumb > a:focus {
    background: rgba(255,255,255,.10);
    color: #fff !important;
}

#page-footer .mwe-footer-links .icon {
    color: rgba(255,255,255,.82) !important;
}

/* ----- Mobile / narrow screens ----- */
@media (max-width: 700px) {
    :root {
        --mwe-desktop-gutter: 10px;
    }

    /* Header navigation stays usable instead of clipping its right side. */
    #page-header .mwe-main-navbar {
        overflow: visible !important;
    }

    #page-header #nav-main {
        width: calc(100% - 12px) !important;
        max-width: none !important;
        min-height: 44px !important;
        height: 44px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        display: flex !important;
        align-items: stretch;
        overflow: visible !important;
        white-space: nowrap;
    }

    #page-header #nav-main > li {
        float: none !important;
        flex: 0 0 auto;
    }

    #page-header #nav-main > .mwe-nav-fill {
        display: block !important;
        flex: 1 1 auto;
        min-width: 4px;
    }

    #page-header #nav-main > li > a,
    #page-header #nav-main > li.quick-links > a {
        min-height: 44px !important;
        height: 44px !important;
        padding: 0 10px !important;
        display: inline-flex !important;
        align-items: center;
        gap: 4px;
        font-size: 11.5px !important;
    }

    /* Unread is useful but the text is too long on phone widths. */
    #page-header #nav-main > .mwe-secondary-nav:not(#quick-links) > a span {
        display: none !important;
    }

    #page-header #nav-main > .mwe-secondary-nav:not(#quick-links) > a {
        width: 38px;
        padding: 0 !important;
        justify-content: center;
    }

    /* The Themen menu remains a real dropdown on mobile. */
    #page-header #quick-links {
        display: block !important;
        position: relative !important;
    }

    #page-header #quick-links > .dropdown {
        top: 44px !important;
        right: 0 !important;
        left: auto !important;
        width: 225px !important;
        min-width: 225px !important;
        z-index: 300 !important;
    }

    #page-header #quick-links .dropdown-contents {
        width: 225px !important;
        box-sizing: border-box;
    }

    #page-header #quick-links .dropdown-contents a,
    #page-header #quick-links .dropdown-contents a span {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Breadcrumb: include Portal, but keep long hierarchies clean and usable. */
    body:not(.section-index) #page-header #nav-breadcrumbs {
        width: 100% !important;
        max-width: none !important;
        min-height: 39px !important;
        padding: 0 10px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs::-webkit-scrollbar {
        display: none;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .breadcrumbs {
        min-width: max-content;
        flex-wrap: nowrap !important;
        white-space: nowrap;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .crumb a {
        min-height: 39px !important;
        font-size: 11.5px !important;
    }

    /* Restore prosilver's intended mobile forum-list behaviour. Earlier desktop
       flex rules had overridden it and left statistics columns on top of text. */
    .forabg ul.topiclist > li.header dd,
    .forumbg ul.topiclist > li.header dd,
    ul.topiclist li.row dd:not(.mark),
    ul.topiclist.forums li.row dd:not(.mark),
    ul.topiclist.topics li.row dd:not(.mark) {
        display: none !important;
    }

    ul.topiclist li.row dl,
    ul.topiclist.forums li.row dl,
    ul.topiclist.topics li.row dl {
        min-height: 68px !important;
        display: block !important;
        position: relative;
    }

    ul.topiclist li.row dt,
    ul.topiclist.forums li.row dt,
    ul.topiclist.topics li.row dt {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        display: block !important;
        border: 0 !important;
    }

    ul.topiclist li.row dt .list-inner,
    ul.topiclist.forums li.row dt .list-inner,
    ul.topiclist.topics li.row dt .list-inner {
        width: auto !important;
        min-height: 68px !important;
        margin: 0 !important;
        padding-top: 11px !important;
        padding-bottom: 10px !important;
        padding-right: 12px !important;
        overflow: visible !important;
    }

    .row-item .forumtitle,
    .row-item .topictitle {
        display: inline !important;
        font-size: 13.5px !important;
        line-height: 1.25 !important;
        white-space: normal;
    }

    ul.topiclist li.row .list-inner > span,
    ul.topiclist li.row .list-inner > a + span {
        display: inline !important;
        font-size: 11.5px !important;
        line-height: 1.35;
        white-space: normal;
    }

    /* Footer becomes an always-visible two-column link area. */
    #page-footer > .navbar {
        width: calc(100% - 20px) !important;
        max-width: none !important;
        margin: 0 auto !important;
    }

    #page-footer .mwe-footer-links {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px 8px;
        padding: 13px 0 !important;
    }

    #page-footer .mwe-footer-links > li,
    #page-footer .mwe-footer-links > .crumb {
        width: 100% !important;
        display: block !important;
    }

    #page-footer .mwe-footer-links > li > a,
    #page-footer .mwe-footer-links .crumb > a {
        width: 100%;
        min-height: 36px;
        box-sizing: border-box;
        padding: 0 8px !important;
        justify-content: flex-start;
        font-size: 11px;
    }

    #page-footer .copyright {
        width: calc(100% - 20px) !important;
        max-width: none !important;
        padding: 13px 0 18px !important;
        text-align: center;
        justify-content: center;
    }
}

@media (max-width: 430px) {
    #page-header #nav-main > li > a,
    #page-header #nav-main > li.quick-links > a {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    #page-header #quick-links > a span {
        display: none !important;
    }

    #page-header #quick-links > a {
        width: 38px;
        padding: 0 !important;
        justify-content: center;
    }

    #page-footer .mwe-footer-links {
        grid-template-columns: 1fr;
    }
}

#page-footer .mwe-footer-links > li:empty { display: none !important; }
#page-footer .mwe-footer-links .mwe-footer-portal .crumb,
#page-footer .mwe-footer-links .mwe-footer-extra .crumb { display: block; width: 100%; }


/* ========================================================================== 
   v0.4.5 navigation / editor / forum-header polish
   ========================================================================== */

/* Main navigation: Portal is a first-class entry when Board3 supplies U_PORTAL. */
#page-header #nav-main > .mwe-portal-nav > a {
    font-weight: 650;
}

/* We use explicit navigation entries and the Themen dropdown; do not create a
   second generic responsive overflow menu. */
#page-header #nav-main > .responsive-menu {
    display: none !important;
}

/* Forum/table headers need the same visual inset as their row contents. */
.forabg ul.topiclist > li.header dt,
.forumbg ul.topiclist > li.header dt {
    box-sizing: border-box;
    padding-left: 16px !important;
}

.forabg ul.topiclist > li.header dt .list-inner,
.forumbg ul.topiclist > li.header dt .list-inner {
    padding-left: 0 !important;
}

/* Board3 center lists use the same header inset. */
#portal-center .forabg ul.topiclist > li.header dt,
#portal-center .forumbg ul.topiclist > li.header dt {
    padding-left: 16px !important;
}

/* phpBB's responsive helper may create an overflow/hamburger item in footer
   navigation. Our footer always wraps, so that generated control is unwanted. */
#page-footer #nav-footer > .responsive-menu,
#page-footer #nav-footer > li.responsive-menu,
#page-footer .mwe-footer-navbar .responsive-menu,
#page-footer .mwe-footer-navbar li.dropdown-container.responsive-menu {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    min-width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

#page-footer #nav-footer {
    overflow: visible !important;
}

/* ---------- Posting/editor controls ---------- */
body.section-posting .panel {
    border-color: #dfe6ee;
    box-shadow: 0 2px 10px rgba(24, 55, 90, .035);
}

body.section-posting .panel h3,
body.section-posting .panel > .inner > h3 {
    padding-left: 0;
    color: #17395f;
    font-size: 12px;
    letter-spacing: .02em;
}

body.section-posting #format-buttons {
    margin: 13px 0 6px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}

body.section-posting #format-buttons .button,
body.section-posting #format-buttons .button.button-secondary {
    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;
    margin: 0;
    padding: 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d9e2ec !important;
    border-radius: 5px;
    background: #f8fafc !important;
    color: #315a83 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    font-weight: 600;
}

body.section-posting #format-buttons .button.button-secondary:not(.button-icon-only) {
    width: auto;
    min-width: 30px;
    padding: 0 9px !important;
}

body.section-posting #format-buttons .button .icon {
    position: static !important;
    margin: 0 !important;
    color: #315a83 !important;
    font-size: 13px;
}

body.section-posting #format-buttons .button:hover,
body.section-posting #format-buttons .button:focus {
    border-color: #bfd0e2 !important;
    background: #eef5fc !important;
    color: #0757b8 !important;
    box-shadow: none !important;
}

body.section-posting #format-buttons .button:hover .icon,
body.section-posting #format-buttons .button:focus .icon {
    color: #0757b8 !important;
}

body.section-posting #format-buttons select,
body.section-posting #format-buttons .bbcode-size {
    height: 30px;
    min-height: 30px;
    margin: 0 0 0 2px;
    padding: 0 28px 0 9px;
    border: 1px solid #d9e2ec;
    border-radius: 5px;
    background-color: #fff;
    color: #314b68;
    font: inherit;
    font-size: 12px;
}

body.section-posting .message-box textarea {
    border-color: #ccd8e5;
    border-radius: 6px;
    background: #fff;
    box-shadow: inset 0 1px 2px rgba(20, 50, 80, .025);
}

body.section-posting .message-box textarea:focus {
    border-color: #9dbce0;
    box-shadow: 0 0 0 3px rgba(7, 91, 184, .07);
}

/* Submit controls: one clear primary action, restrained secondary actions. */
body.section-posting fieldset.submit-buttons {
    min-height: 44px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 7px;
}

body.section-posting fieldset.submit-buttons input {
    min-height: 34px;
    height: 34px;
    margin: 0 !important;
    padding: 0 14px;
    border-radius: 6px;
    box-shadow: none !important;
    text-shadow: none !important;
    font-family: inherit;
    font-size: 12px;
    font-weight: 650;
}

body.section-posting fieldset.submit-buttons input[name="save"],
body.section-posting fieldset.submit-buttons input[name="load"] {
    border-color: #d8e1eb !important;
    background: #fff !important;
    color: #526c87 !important;
}

body.section-posting fieldset.submit-buttons input[name="preview"] {
    border-color: #c8d6e5 !important;
    background: #f5f8fb !important;
    color: #214f7f !important;
}

body.section-posting fieldset.submit-buttons input[name="post"] {
    border-color: #0863c7 !important;
    background: #0863c7 !important;
    color: #fff !important;
}

body.section-posting fieldset.submit-buttons input[name="save"]:hover,
body.section-posting fieldset.submit-buttons input[name="load"]:hover,
body.section-posting fieldset.submit-buttons input[name="preview"]:hover {
    border-color: #b8c9da !important;
    background: #edf4fb !important;
    color: #0757b8 !important;
}

body.section-posting fieldset.submit-buttons input[name="post"]:hover,
body.section-posting fieldset.submit-buttons input[name="post"]:focus {
    border-color: #0758b4 !important;
    background: #0758b4 !important;
    color: #fff !important;
}

body.section-posting #tabs .tab > a {
    border-radius: 6px 6px 0 0;
    font-weight: 600;
}

/* Mobile: Portal + Forum + Aktuelles fit without invoking phpBB's overflow
   hamburger. Keep labels until the very narrow breakpoint. */
@media (max-width: 700px) {
    #page-header #nav-main > .mwe-primary-nav > a {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    body.section-posting #format-buttons {
        gap: 5px;
    }

    body.section-posting #format-buttons .button,
    body.section-posting #format-buttons .button.button-secondary {
        width: 32px;
        min-width: 32px;
        height: 32px;
        min-height: 32px;
    }
}

@media (max-width: 430px) {
    #page-header #nav-main > .mwe-primary-nav > a span {
        display: none !important;
    }

    #page-header #nav-main > .mwe-primary-nav > a {
        width: 38px;
        padding: 0 !important;
        justify-content: center;
    }
}


/* ========================================================================== 
   v0.4.6 portal mobile / post dropdown / legal footer fixes
   ========================================================================== */

/* Thread action menus must be allowed to escape the post card. Previously the
   rounded-card overflow clipped moderator actions at the bottom edge. */
body.section-viewtopic .post,
body.section-viewtopic .post > .inner,
body.section-viewtopic .postbody {
    overflow: visible !important;
}

body.section-viewtopic .post {
    position: relative;
}

body.section-viewtopic .post:focus-within,
body.section-viewtopic .post:has(.mwe-post-more.dropdown-visible) {
    z-index: 80;
}

body.section-viewtopic .mwe-post-more.dropdown-visible {
    z-index: 120;
}

body.section-viewtopic .mwe-post-more.dropdown-visible > .dropdown,
.nojs body.section-viewtopic .mwe-post-more:hover > .dropdown {
    display: block !important;
}

body.section-viewtopic .mwe-post-more .dropdown {
    right: 0 !important;
    left: auto !important;
    width: max-content;
    min-width: 220px !important;
    max-width: min(320px, calc(100vw - 28px));
    max-height: min(430px, 72vh);
    overflow-y: auto;
    overflow-x: hidden;
    box-sizing: border-box;
}

body.section-viewtopic .mwe-post-more .dropdown-contents {
    max-height: none;
}

/* The About-us extension exposes U_ABOUTUS globally. Its link is deliberately
   a normal footer item so it remains present on every page and viewport. */
#page-footer .mwe-footer-impressum {
    display: inline-flex !important;
}

/* Board3: on phones, don't squeeze left and right modules into 50% columns.
   The center content comes first, followed by full-width utility cards. */
@media (max-width: 760px) {
    body:has(#portal-body) #portal-body {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0;
        padding-top: 0 !important;
    }

    body:has(#portal-body) #portal-center-wrapper {
        order: 1;
        width: 100% !important;
        float: none !important;
        display: block !important;
    }

    body:has(#portal-body) #portal-center {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box;
    }

    body:has(#portal-body) #portal-left,
    body:has(#portal-body) #portal-right {
        width: 100% !important;
        max-width: none !important;
        margin: 10px 0 0 !important;
        float: none !important;
        display: block !important;
        position: relative !important;
        box-sizing: border-box;
    }

    body:has(#portal-body) #portal-left {
        order: 2;
    }

    body:has(#portal-body) #portal-right {
        order: 3;
    }

    body:has(#portal-body) #portal-left .forabg,
    body:has(#portal-body) #portal-right .forabg,
    body:has(#portal-body) #portal-center .forabg {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }

    body:has(#portal-body) #portal-left .portal-side-wrapper,
    body:has(#portal-body) #portal-right .portal-side-wrapper {
        padding: 14px 16px !important;
    }

    /* Side menus are easier to scan as roomy full-width rows. */
    body:has(#portal-body) .portal-navigation ul li a {
        min-height: 38px;
        padding: 8px 9px !important;
        display: flex;
        align-items: center;
        box-sizing: border-box;
        font-size: 12px !important;
    }

    /* Make the portal utility cards visually distinct from one another. */
    body:has(#portal-body) #portal-left .forabg,
    body:has(#portal-body) #portal-right .forabg {
        margin-bottom: 10px !important;
        border-radius: 9px !important;
    }
}

@media (max-width: 700px) {
    body.section-viewtopic .mwe-post-more .dropdown {
        min-width: 210px !important;
        max-width: calc(100vw - 24px);
        max-height: 68vh;
    }

    #page-footer .mwe-footer-impressum {
        display: block !important;
        width: 100% !important;
    }
}


/* v0.4.7: compact avatar beside the last poster in Board3 center lists. */
#portal-center dd.lastpost > .mwe-portal-lastpost {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
}

#portal-center .mwe-portal-lastpost-avatar {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid #d8e3ee;
    border-radius: 50%;
    background: #f3f7fb;
    color: #6c8198;
}

#portal-center .mwe-portal-lastpost-avatar img {
    width: 30px !important;
    height: 30px !important;
    max-width: 30px !important;
    max-height: 30px !important;
    object-fit: cover;
    border: 0;
    border-radius: 50%;
}

#portal-center .mwe-portal-lastpost-avatar .icon {
    margin: 0;
    color: #6c8198;
    font-size: 13px;
}

#portal-center .mwe-portal-lastpost-copy {
    min-width: 0;
    display: block;
    line-height: 1.35;
}

@media (max-width: 700px) {
    #portal-center .mwe-portal-lastpost-avatar {
        width: 26px;
        height: 26px;
        flex-basis: 26px;
    }

    #portal-center .mwe-portal-lastpost-avatar img {
        width: 26px !important;
        height: 26px !important;
        max-width: 26px !important;
        max-height: 26px !important;
    }
}

/* ========================================================================== 
   v0.4.8 registration + logged-out conversion polish
   Pure presentation/template markup. Existing phpBB routes/actions stay intact.
   ========================================================================== */

/* ---------- Logged-out masthead actions ---------- */
.mwe-account-actions .mwe-account-login,
.mwe-account-actions .mwe-account-register {
    min-height: 38px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.mwe-account-actions .mwe-account-login {
    padding: 0 11px;
    border: 1px solid transparent;
    color: #17395f !important;
}

.mwe-account-actions .mwe-account-login:hover,
.mwe-account-actions .mwe-account-login:focus {
    border-color: #d8e2ec;
    background: #f6f9fc;
    color: #0757b8 !important;
}

.mwe-account-actions .mwe-account-register {
    padding: 0 15px;
    border: 1px solid #0a67cc;
    background: #0a67cc;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(10, 103, 204, .15);
}

.mwe-account-actions .mwe-account-register:hover,
.mwe-account-actions .mwe-account-register:focus {
    border-color: #0757b8;
    background: #0757b8;
    box-shadow: 0 3px 8px rgba(7, 87, 184, .18);
}

/* ---------- Board3 login card ---------- */
#portal-login-box .mwe-portal-login-body {
    padding: 14px 15px 15px;
}

#portal-login-box .mwe-portal-login-label {
    display: block;
    margin: 0 0 5px;
    color: #526982;
    font-size: 11px;
    font-weight: 650;
}

#portal-login-box .mwe-portal-login-label + .inputbox {
    width: 100% !important;
    height: 37px;
    margin: 0 0 12px;
    padding: 0 10px;
    border: 1px solid #d6e0ea;
    border-radius: 6px;
    background: #fff;
    box-sizing: border-box;
    font-size: 12.5px;
}

#portal-login-box .mwe-portal-login-label + .inputbox:focus {
    border-color: #7dacdc;
    box-shadow: 0 0 0 3px rgba(7, 91, 184, .08);
}

#portal-login-box .mwe-portal-remember {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin: 0 0 12px;
    color: #687b91;
    font-size: 11px;
    line-height: 1.35;
}

#portal-login-box .mwe-portal-remember input {
    margin-top: 2px;
}

#portal-login-box input.mwe-portal-login-button {
    width: 100%;
    height: 38px;
    margin: 0;
    border: 1px solid #0a67cc;
    border-radius: 6px;
    background: #0a67cc;
    color: #fff;
    box-shadow: none;
    font-size: 12.5px;
    font-weight: 700;
    text-shadow: none;
}

#portal-login-box input.mwe-portal-login-button:hover,
#portal-login-box input.mwe-portal-login-button:focus {
    border-color: #0757b8;
    background: #0757b8;
    color: #fff;
    box-shadow: none;
}

#portal-login-box .mwe-portal-register-hint {
    margin: 11px 0 0;
    color: #74859a;
    font-size: 10.8px;
    line-height: 1.4;
    text-align: center;
}

#portal-login-box .mwe-portal-register-hint a {
    color: #0757b8;
    font-weight: 700;
}

/* ---------- Registration form ---------- */
.mwe-register-form,
.mwe-register-provider,
.mwe-agreement-form,
.mwe-agreement-language {
    width: 100%;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

.mwe-register-panel,
.mwe-register-provider,
.mwe-register-form .captcha-panel,
.mwe-agreement-panel {
    margin: 18px auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid #dfe6ee;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 3px 14px rgba(20, 50, 84, .045);
}

.mwe-register-panel > .inner,
.mwe-register-provider > .inner,
.mwe-register-form .captcha-panel > .inner,
.mwe-agreement-panel > .inner {
    padding: 24px 28px;
}

.mwe-register-heading,
.mwe-agreement-heading {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 22px;
    padding-bottom: 18px;
    border-bottom: 1px solid #e6ebf1;
}

.mwe-register-heading-icon,
.mwe-agreement-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d5e5f7;
    border-radius: 50%;
    background: #f4f9ff;
    color: #0a67cc;
    font-size: 16px;
}

.mwe-register-heading h2,
.mwe-agreement-heading h2,
.mwe-agreement-heading .sitename-title {
    margin: 0 0 5px;
    padding: 0;
    border: 0;
    color: #102a4c;
    font-size: 21px;
    line-height: 1.2;
    font-weight: 750;
    letter-spacing: -.015em;
}

.mwe-register-heading p,
.mwe-agreement-heading p {
    max-width: 700px;
    margin: 0;
    color: #65788f;
    font-size: 12.5px;
    line-height: 1.5;
}

.mwe-register-fields {
    margin: 0;
}

.mwe-register-fields dl,
.mwe-register-form .captcha-panel fieldset dl {
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    min-height: 56px;
    margin: 0;
    padding: 11px 0;
    border-top: 1px solid #edf1f5;
}

.mwe-register-fields dl:first-of-type {
    border-top: 0;
}

.mwe-register-fields dt,
.mwe-register-form .captcha-panel fieldset dt {
    width: auto !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left;
}

.mwe-register-fields dd,
.mwe-register-form .captcha-panel fieldset dd {
    width: auto !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.mwe-register-fields dt label,
.mwe-register-form .captcha-panel dt label {
    display: block;
    margin: 0 0 3px;
    color: #18395f;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.3;
}

.mwe-register-fields dt span,
.mwe-register-form .captcha-panel dt span {
    display: block;
    color: #78899d;
    font-size: 10.8px;
    font-weight: 400;
    line-height: 1.4;
}

.mwe-register-fields dd .inputbox,
.mwe-register-fields dd input[type="text"],
.mwe-register-fields dd input[type="password"],
.mwe-register-fields dd input[type="email"],
.mwe-register-fields dd select,
.mwe-register-form .captcha-panel dd .inputbox {
    width: min(100%, 410px) !important;
    min-width: 0;
    height: 39px;
    margin: 0;
    padding: 0 11px;
    border: 1px solid #d4dee9;
    border-radius: 6px;
    background: #fff;
    box-sizing: border-box;
    font-size: 12.5px;
}

.mwe-register-fields dd select {
    width: auto !important;
    max-width: 410px;
    padding-right: 30px;
}

.mwe-register-fields dd .inputbox:focus,
.mwe-register-fields dd input:focus,
.mwe-register-fields dd select:focus,
.mwe-register-form .captcha-panel dd .inputbox:focus {
    border-color: #7dacdc;
    box-shadow: 0 0 0 3px rgba(7, 91, 184, .08);
}

.mwe-register-section-title {
    margin: 14px 0 0;
    padding-top: 20px;
    border-top: 1px solid #dde5ed;
}

.mwe-register-section-title span {
    color: #5a6f87;
    font-size: 10.5px;
    font-weight: 750;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.mwe-register-notice,
.mwe-register-error {
    display: block !important;
    min-height: 0 !important;
    margin: 0 0 15px !important;
    padding: 11px 13px !important;
    border: 1px solid #d9e8f7 !important;
    border-radius: 7px;
    background: #f6faff;
}

.mwe-register-notice dd,
.mwe-register-error dd {
    display: block;
    width: auto !important;
    margin: 0 !important;
    color: #4f6781;
    font-size: 11.5px;
    line-height: 1.45;
}

.mwe-register-notice .icon {
    margin-right: 5px;
    color: #3a78b7;
}

.mwe-register-form .captcha-panel h3.captcha-title {
    margin: 0 0 12px;
    color: #17395f;
    font-size: 13px;
    font-weight: 750;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.mwe-register-form .captcha-panel fieldset {
    margin: 0;
}

.mwe-register-actions,
.mwe-agreement-actions {
    width: 100%;
    max-width: 980px;
    margin: 14px auto 26px;
    padding: 18px 22px;
    border: 1px solid #e0e7ef;
    border-radius: 9px;
    background: #fff;
    box-sizing: border-box;
    box-shadow: 0 2px 10px rgba(20, 50, 84, .035);
    text-align: center;
}

.mwe-register-actions fieldset,
.mwe-agreement-actions fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.mwe-register-actions input.button1,
.mwe-agreement-actions input.button1,
.mwe-agreement-actions input.button2 {
    min-height: 38px;
    padding: 0 18px;
    border-radius: 6px;
    box-shadow: none;
    font-size: 12px;
    font-weight: 700;
    text-shadow: none;
}

.mwe-register-actions input.button1,
.mwe-agreement-actions input.mwe-agree-primary {
    border-color: #0a67cc;
    background: #0a67cc;
    color: #fff;
}

.mwe-register-actions input.button1:hover,
.mwe-register-actions input.button1:focus,
.mwe-agreement-actions input.mwe-agree-primary:hover,
.mwe-agreement-actions input.mwe-agree-primary:focus {
    border-color: #0757b8;
    background: #0757b8;
    color: #fff;
    box-shadow: none;
}

.mwe-agreement-actions input.mwe-agree-secondary {
    margin-left: 7px;
    border-color: #d1dbe6;
    background: #fff;
    color: #64778d;
}

.mwe-agreement-actions input.mwe-agree-secondary:hover,
.mwe-agreement-actions input.mwe-agree-secondary:focus {
    border-color: #b9c6d3;
    background: #f6f8fa;
    color: #41566f;
    box-shadow: none;
}

.mwe-register-login-hint {
    margin: 10px 0 0;
    color: #76879a;
    font-size: 11px;
}

.mwe-register-login-hint a {
    color: #0757b8;
    font-weight: 700;
}

/* ---------- Terms / agreement page ---------- */
.mwe-agreement-language {
    margin-top: 14px;
    text-align: right;
    color: #61758c;
    font-size: 11px;
}

.mwe-agreement-language label {
    margin-right: 7px;
}

.mwe-agreement-language select {
    height: 32px;
}

.mwe-agreement-copy {
    color: #263e5a;
    font-size: 12px;
    line-height: 1.58;
}

.mwe-agreement-copy > p:first-child {
    margin-top: 0;
}

.mwe-agreement-copy h1,
.mwe-agreement-copy h2,
.mwe-agreement-copy h3,
.mwe-agreement-copy h4,
.mwe-agreement-copy strong {
    color: #17395f;
}

.mwe-agreement-copy h2,
.mwe-agreement-copy h3,
.mwe-agreement-copy h4 {
    margin-top: 17px;
    margin-bottom: 7px;
    padding-bottom: 5px;
    border-bottom: 1px solid #e7ecf1;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 750;
}

.mwe-agreement-copy ol,
.mwe-agreement-copy ul {
    margin-top: 6px;
    margin-bottom: 10px;
}

.mwe-agreement-copy li {
    margin-bottom: 4px;
}

/* Terms pages generated through the ELSEIF branch remain visually restrained. */
.section-ucp .mwe-agreement-panel .agreement {
    max-width: none;
}

/* ---------- Registration responsive ---------- */
@media (max-width: 700px) {
    .mwe-register-form,
    .mwe-register-provider,
    .mwe-agreement-form,
    .mwe-agreement-language {
        max-width: none;
    }

    .mwe-register-panel,
    .mwe-register-provider,
    .mwe-register-form .captcha-panel,
    .mwe-agreement-panel {
        margin: 10px 0;
        border-radius: 8px;
    }

    .mwe-register-panel > .inner,
    .mwe-register-provider > .inner,
    .mwe-register-form .captcha-panel > .inner,
    .mwe-agreement-panel > .inner {
        padding: 18px 16px;
    }

    .mwe-register-heading,
    .mwe-agreement-heading {
        gap: 10px;
        margin-bottom: 14px;
        padding-bottom: 14px;
    }

    .mwe-register-heading-icon,
    .mwe-agreement-icon {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
        font-size: 14px;
    }

    .mwe-register-heading h2,
    .mwe-agreement-heading h2,
    .mwe-agreement-heading .sitename-title {
        font-size: 18px;
    }

    .mwe-register-fields dl,
    .mwe-register-form .captcha-panel fieldset dl {
        grid-template-columns: 1fr;
        gap: 7px;
        padding: 12px 0;
    }

    .mwe-register-fields dd .inputbox,
    .mwe-register-fields dd input[type="text"],
    .mwe-register-fields dd input[type="password"],
    .mwe-register-fields dd input[type="email"],
    .mwe-register-form .captcha-panel dd .inputbox {
        width: 100% !important;
    }

    .mwe-register-fields dd select {
        max-width: 100%;
    }

    .mwe-register-actions,
    .mwe-agreement-actions {
        margin: 10px 0 18px;
        padding: 14px;
    }

    .mwe-register-actions input.button1,
    .mwe-agreement-actions input.button1,
    .mwe-agreement-actions input.button2 {
        width: 100%;
        margin: 0;
    }

    .mwe-agreement-actions input.mwe-agree-secondary {
        margin-top: 8px;
        margin-left: 0;
    }

    .mwe-agreement-language {
        margin: 10px 0;
        text-align: left;
    }

    .mwe-account-actions .mwe-account-login,
    .mwe-account-actions .mwe-account-register {
        min-width: 38px;
        padding: 0 9px;
    }
}


/* ========================================================================== 
   v0.4.9 guest account + portal login polish
   ========================================================================== */

/* Keep the three masthead areas anchored even when the search box is absent. */
#site-description {
    grid-column: 1;
}

#search-box.search-header {
    grid-column: 2;
}

.mwe-account-actions {
    grid-column: 3;
    justify-self: end;
    justify-content: flex-end;
    align-self: center;
}

/* Logged-out actions read as a deliberate pair instead of an orphan icon. */
.mwe-account-actions.mwe-account-guest {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 250px;
}

.mwe-account-actions.mwe-account-guest .mwe-account-login,
.mwe-account-actions.mwe-account-guest .mwe-account-register {
    min-height: 38px;
    height: 38px;
    padding: 0 14px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.mwe-account-actions.mwe-account-guest .mwe-account-login {
    min-width: 96px;
    border: 1px solid transparent;
    background: transparent;
    color: #123f70 !important;
}

.mwe-account-actions.mwe-account-guest .mwe-account-login:hover,
.mwe-account-actions.mwe-account-guest .mwe-account-login:focus {
    border-color: #d9e3ee;
    background: #f6f9fc;
    color: #0757b8 !important;
    box-shadow: none;
}

.mwe-account-actions.mwe-account-guest .mwe-account-register {
    min-width: 120px;
    border: 1px solid #0a67cc;
    background: #0a67cc;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(10, 103, 204, .14);
}

.mwe-account-actions.mwe-account-guest .mwe-account-register:hover,
.mwe-account-actions.mwe-account-guest .mwe-account-register:focus {
    border-color: #0757b8;
    background: #0757b8;
    color: #fff !important;
    box-shadow: 0 3px 8px rgba(7, 87, 184, .16);
}

.mwe-account-actions.mwe-account-guest .mwe-account-login span,
.mwe-account-actions.mwe-account-guest .mwe-account-register span {
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Board3 login card: full remember-me copy and centered primary action. */
#portal-login-box .mwe-portal-login-body {
    overflow: visible;
}

#portal-login-box .mwe-portal-remember {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin: 1px 0 13px;
    box-sizing: border-box;
    white-space: normal !important;
    overflow: visible !important;
}

#portal-login-box .mwe-portal-remember input {
    flex: 0 0 auto;
    margin: 2px 0 0;
}

#portal-login-box .mwe-portal-remember span {
    flex: 1 1 auto;
    min-width: 0;
    display: block;
    color: #667a91;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere;
    word-break: normal;
    line-height: 1.4;
}

#portal-login-box input.mwe-portal-login-button {
    width: auto;
    min-width: 126px;
    height: 38px;
    margin: 2px auto 0;
    padding: 0 18px;
    display: block;
    text-align: center;
}

#portal-login-box .mwe-portal-register-hint {
    margin-top: 12px;
    text-align: center;
}

/* On narrower layouts, keep both guest actions legible instead of icon-only. */
@media (max-width: 850px) {
    .headerbar > .inner.mwe-header-inner {
        grid-template-columns: minmax(210px, 1fr) auto;
    }

    #site-description {
        grid-column: 1;
    }

    #search-box.search-header {
        grid-column: 1 / -1;
    }

    .mwe-account-actions {
        grid-column: 2;
    }

    .mwe-account-actions.mwe-account-guest {
        min-width: 0;
        gap: 6px;
    }

    .mwe-account-actions.mwe-account-guest .mwe-account-login,
    .mwe-account-actions.mwe-account-guest .mwe-account-register {
        min-width: 0;
        padding: 0 10px;
    }
}

@media (max-width: 560px) {
    .headerbar > .inner.mwe-header-inner {
        grid-template-columns: 1fr;
        row-gap: 8px;
    }

    #site-description,
    .mwe-account-actions,
    #search-box.search-header {
        grid-column: 1;
    }

    .mwe-account-actions.mwe-account-guest {
        width: 100%;
        justify-self: stretch;
        justify-content: flex-end;
    }

    .mwe-account-actions.mwe-account-guest .mwe-account-login,
    .mwe-account-actions.mwe-account-guest .mwe-account-register {
        min-height: 36px;
        height: 36px;
        font-size: 11.5px;
    }
}


/* ========================================================================== 
   v0.5.0 robust Themen menu
   The previous Themen menu used phpBB's generic dropdown/responsive mechanism.
   On some viewport widths phpBB's responsive nav duplicated/relocated that
   element, leaving the dark rectangle / white pointer seen in production.
   Use a native details element instead: no JS dependency, no duplicate shell,
   and all existing phpBB URLs remain unchanged.
   ========================================================================== */

#page-header #quick-links.mwe-topics-menu {
    position: relative !important;
    display: flex !important;
    align-items: stretch !important;
    overflow: visible !important;
}

#page-header #quick-links.mwe-topics-menu.hidden {
    display: none !important;
}

#page-header #quick-links .mwe-topics-details {
    position: relative;
    display: flex;
    align-items: stretch;
    margin: 0;
    padding: 0;
}

#page-header #quick-links .mwe-topics-details > summary {
    min-height: 47px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    box-sizing: border-box;
    cursor: pointer;
    list-style: none;
    user-select: none;
    color: rgba(255,255,255,.96);
    font-size: 12.5px;
    font-weight: 620;
    line-height: 1;
    text-decoration: none;
    outline: 0;
}

#page-header #quick-links .mwe-topics-details > summary::-webkit-details-marker {
    display: none;
}

#page-header #quick-links .mwe-topics-details > summary::marker {
    display: none;
    content: '';
}

#page-header #quick-links .mwe-topics-details > summary:hover,
#page-header #quick-links .mwe-topics-details > summary:focus-visible,
#page-header #quick-links .mwe-topics-details[open] > summary {
    background: rgba(0,33,71,.24);
    color: #fff;
}

#page-header #quick-links .mwe-topics-details > summary .icon {
    position: static !important;
    float: none !important;
    margin: 0 !important;
    color: inherit !important;
}

#page-header #quick-links .mwe-topics-panel {
    position: absolute;
    top: calc(100% + 7px);
    right: 0;
    z-index: 1000;
    width: 238px;
    padding: 6px 0;
    box-sizing: border-box;
    border: 1px solid #cfd9e4;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 14px 32px rgba(18,45,76,.18);
    color: #17395f;
}

#page-header #quick-links .mwe-topics-panel::before,
#page-header #quick-links .mwe-topics-panel::after {
    content: '';
    position: absolute;
    right: 22px;
    width: 0;
    height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
}

#page-header #quick-links .mwe-topics-panel::before {
    top: -8px;
    border-bottom: 8px solid #cfd9e4;
}

#page-header #quick-links .mwe-topics-panel::after {
    top: -7px;
    border-bottom: 8px solid #fff;
}

#page-header #quick-links .mwe-topics-links {
    width: 100%;
    margin: 0;
    padding: 0;
    display: block;
    list-style: none;
}

#page-header #quick-links .mwe-topics-links > li {
    width: 100%;
    margin: 0;
    padding: 0;
    display: block;
    border: 0;
}

#page-header #quick-links .mwe-topics-links > li.separator {
    height: 1px;
    margin: 5px 0;
    background: #e5ebf2;
}

#page-header #quick-links .mwe-topics-links a {
    width: 100%;
    min-height: 37px;
    padding: 8px 13px;
    display: flex !important;
    align-items: center;
    gap: 9px;
    box-sizing: border-box;
    color: #17395f !important;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.25;
    text-decoration: none;
    white-space: normal;
}

#page-header #quick-links .mwe-topics-links a:hover,
#page-header #quick-links .mwe-topics-links a:focus {
    background: #f2f7fc;
    color: #0757b8 !important;
}

#page-header #quick-links .mwe-topics-links a .icon {
    position: static !important;
    float: none !important;
    flex: 0 0 16px;
    width: 16px;
    margin: 0 !important;
    color: #315980 !important;
}

#page-header #quick-links .mwe-topics-links a span {
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: inherit !important;
}

/* Disable obsolete quick-links dropdown rules now that this is not a phpBB
   dropdown-container. */
#page-header #quick-links > .dropdown,
#page-header #quick-links > .responsive-menu,
#page-header #quick-links .pointer {
    display: none !important;
}

@media (max-width: 700px) {
    #page-header #quick-links .mwe-topics-details > summary {
        min-height: 44px;
        height: 44px;
        padding: 0 10px;
        font-size: 11.5px;
    }

    #page-header #quick-links .mwe-topics-panel {
        top: calc(100% + 5px);
        right: 0;
        width: min(250px, calc(100vw - 18px));
    }
}

@media (max-width: 430px) {
    #page-header #quick-links .mwe-topics-details > summary {
        width: 38px;
        padding: 0;
    }

    #page-header #quick-links .mwe-topics-details > summary span {
        display: none;
    }
}


/* ==========================================================================\n   v0.5.1 mobile topic toolbar polish\n   Compact two-row control layout for phones. Presentation only.\n   ========================================================================== */
@media (max-width: 700px) {
    body.section-viewtopic .topic-title,
    body.section-viewtopic h2.topic-title {
        margin: 13px 0 9px !important;
        font-size: 20px !important;
        line-height: 1.22 !important;
    }

    body.section-viewtopic .action-bar.bar-top {
        width: 100%;
        min-height: 0;
        margin: 0 0 13px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 48px;
        gap: 7px;
        align-items: center;
        clear: both;
    }

    body.section-viewtopic .action-bar.bar-top > .mwe-reply-button,
    body.section-viewtopic .action-bar.bar-top > a.button:first-of-type {
        grid-column: 1;
        grid-row: 1;
        width: 100% !important;
        min-width: 0 !important;
        height: 40px !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 0 14px !important;
        justify-content: center !important;
        border-radius: 6px !important;
        font-size: 13px !important;
        font-weight: 720 !important;
    }

    body.section-viewtopic .action-bar.bar-top > .topic-tools {
        grid-column: 2;
        grid-row: 1;
        width: 48px !important;
        height: 40px !important;
        margin: 0 !important;
        position: relative;
    }

    body.section-viewtopic .action-bar.bar-top > .topic-tools > .button,
    body.section-viewtopic .action-bar.bar-top > .topic-tools > .dropdown-trigger {
        width: 48px !important;
        min-width: 48px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        border-radius: 6px !important;
        box-sizing: border-box;
    }

    body.section-viewtopic .action-bar.bar-top > .topic-tools .caret {
        margin-left: 0 !important;
    }

    body.section-viewtopic .action-bar.bar-top > .topic-tools > .dropdown {
        top: 45px !important;
        right: 0 !important;
        left: auto !important;
        width: min(250px, calc(100vw - 20px)) !important;
        min-width: 210px !important;
        z-index: 350 !important;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box {
        grid-column: 1 / -1;
        grid-row: 2;
        width: 100% !important;
        max-width: none !important;
        height: 40px !important;
        margin: 0 !important;
        float: none !important;
        box-sizing: border-box;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box form,
    body.section-viewtopic .action-bar.bar-top > .search-box fieldset {
        width: 100% !important;
        max-width: none !important;
        height: 40px !important;
        margin: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 42px 42px;
        align-items: stretch;
        box-sizing: border-box;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box .inputbox {
        width: 100% !important;
        min-width: 0 !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 11px !important;
        border-radius: 6px 0 0 6px !important;
        box-sizing: border-box;
        font-size: 12.5px !important;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box .button-search,
    body.section-viewtopic .action-bar.bar-top > .search-box .button-search-end {
        width: 42px !important;
        min-width: 42px !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
        border-radius: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box .button-search-end {
        border-radius: 0 6px 6px 0 !important;
    }

    body.section-viewtopic .action-bar.bar-top > .pagination {
        grid-column: 1 / -1;
        grid-row: 3;
        width: 100%;
        margin: -1px 0 0 !important;
        padding: 0 1px;
        float: none !important;
        justify-self: stretch;
        text-align: right;
        color: #61738a;
        font-size: 11px !important;
        line-height: 1.35;
    }

    body.section-viewtopic .action-bar.bar-top > .pagination .mark {
        font-size: 11px;
    }

    /* Keep bottom controls compact as well, but do not force the top grid. */
    body.section-viewtopic .action-bar.bar-bottom > .mwe-reply-button,
    body.section-viewtopic .action-bar.bar-bottom > a.button:first-of-type {
        min-height: 38px !important;
        border-radius: 6px !important;
    }
}

@media (max-width: 430px) {
    body.section-viewtopic .action-bar.bar-top {
        grid-template-columns: minmax(0, 1fr) 46px;
        gap: 6px;
    }

    body.section-viewtopic .action-bar.bar-top > .topic-tools,
    body.section-viewtopic .action-bar.bar-top > .topic-tools > .button,
    body.section-viewtopic .action-bar.bar-top > .topic-tools > .dropdown-trigger {
        width: 46px !important;
        min-width: 46px !important;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box form,
    body.section-viewtopic .action-bar.bar-top > .search-box fieldset {
        grid-template-columns: minmax(0, 1fr) 40px 40px;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box .button-search,
    body.section-viewtopic .action-bar.bar-top > .search-box .button-search-end {
        width: 40px !important;
        min-width: 40px !important;
    }
}


/* ========================================================================== 
   v0.5.2 mobile stability pass
   Fixes narrow-screen topic controls without touching phpBB URLs/markup logic.
   ========================================================================== */
@media (max-width: 700px) {
    body.section-viewtopic .action-bar.bar-top {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 46px !important;
        grid-auto-rows: auto;
        column-gap: 6px !important;
        row-gap: 7px !important;
        align-items: stretch !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    body.section-viewtopic .action-bar.bar-top > .mwe-reply-button,
    body.section-viewtopic .action-bar.bar-top > a.button:first-of-type {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        height: 40px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    body.section-viewtopic .action-bar.bar-top > .topic-tools {
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        height: 40px !important;
        margin: 0 !important;
        float: none !important;
        box-sizing: border-box !important;
    }

    body.section-viewtopic .action-bar.bar-top > .topic-tools > .button,
    body.section-viewtopic .action-bar.bar-top > .topic-tools > .dropdown-trigger {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        height: 40px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
        justify-self: stretch !important;
        box-sizing: border-box !important;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box form,
    body.section-viewtopic .action-bar.bar-top > .search-box fieldset {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: stretch !important;
        box-sizing: border-box !important;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box .inputbox {
        flex: 1 1 auto !important;
        width: 1% !important;
        max-width: none !important;
        min-width: 0 !important;
        height: 38px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    body.section-viewtopic .action-bar.bar-top > .search-box .button-search,
    body.section-viewtopic .action-bar.bar-top > .search-box .button-search-end {
        flex: 0 0 42px !important;
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        height: 38px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    body.section-viewtopic .action-bar.bar-top > .pagination {
        grid-column: 1 / -1 !important;
        grid-row: 3 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 1px !important;
        float: none !important;
        clear: both !important;
        box-sizing: border-box !important;
        text-align: right !important;
    }

    /* Keep long breadcrumbs usable instead of letting them expand the page. */
    #page-header #nav-breadcrumbs {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 8px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        box-sizing: border-box !important;
        scrollbar-width: none;
    }

    #page-header #nav-breadcrumbs::-webkit-scrollbar {
        display: none;
    }

    #page-header #nav-breadcrumbs .breadcrumbs {
        flex-wrap: nowrap !important;
        white-space: nowrap !important;
        min-width: max-content;
    }

    body.section-viewtopic .post {
        max-width: 100%;
        box-sizing: border-box;
    }
}

/* ---------- v0.5.3: Jumpbox / "Gehe zu" dropdown ---------- */
.jumpbox .dropdown,
.jumpbox .dropdown-extended,
.jumpbox .dropdown-contents,
#jumpbox .dropdown,
#jumpbox .dropdown-contents {
    border: 1px solid var(--mwe-border);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 16px 34px rgba(17, 43, 74, .18);
}

.jumpbox .dropdown-contents,
#jumpbox .dropdown-contents {
    overflow: hidden;
}

.jumpbox .dropdown-contents > li,
#jumpbox .dropdown-contents > li {
    margin: 0;
    border-top: 1px solid var(--mwe-border);
}

.jumpbox .dropdown-contents > li:first-child,
#jumpbox .dropdown-contents > li:first-child {
    border-top: 0;
}

.jumpbox .dropdown-contents a,
#jumpbox .dropdown-contents a {
    display: block;
    padding: 10px 14px;
    background: #fff;
    color: #26445f;
    text-decoration: none;
}

.jumpbox .dropdown-contents a span,
#jumpbox .dropdown-contents a span {
    color: inherit;
}

.jumpbox .dropdown-contents a:hover,
.jumpbox .dropdown-contents a:focus,
#jumpbox .dropdown-contents a:hover,
#jumpbox .dropdown-contents a:focus {
    background: #f3f8fd;
    color: #0757b8;
}

.jumpbox .dropdown-contents .jumpbox-cat-link,
#jumpbox .dropdown-contents .jumpbox-cat-link {
    background: #eef5fb;
    color: #103f6c;
    font-weight: 700;
}

.jumpbox .dropdown-contents .jumpbox-cat-link span,
#jumpbox .dropdown-contents .jumpbox-cat-link span {
    color: inherit;
}

.jumpbox .dropdown-contents .jumpbox-cat-link:hover,
.jumpbox .dropdown-contents .jumpbox-cat-link:focus,
#jumpbox .dropdown-contents .jumpbox-cat-link:hover,
#jumpbox .dropdown-contents .jumpbox-cat-link:focus {
    background: #e3eef9;
    color: #0a5db0;
}

.jumpbox .dropdown-contents .jumpbox-forum-link,
.jumpbox .dropdown-contents .jumpbox-sub-link,
#jumpbox .dropdown-contents .jumpbox-forum-link,
#jumpbox .dropdown-contents .jumpbox-sub-link {
    font-weight: 500;
}

.jumpbox .pointer-inner,
#jumpbox .pointer-inner {
    border-color: transparent transparent #ffffff transparent;
}

.dropdown-up.jumpbox .pointer-inner,
.dropdown-up #jumpbox .pointer-inner {
    border-color: #ffffff transparent transparent transparent;
}

/* ========================================================================== 
   v0.5.4 iPhone/mobile layout hardening
   - guest login/register are always visible and centered
   - compact, non-scrolling breadcrumb path
   - remove accidental horizontal page scrolling
   - keep forum/thread controls inside the viewport
   ========================================================================== */

@media (max-width: 700px) {
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden !important;
    }

    .wrap,
    #wrap {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    #page-header,
    .headerbar,
    .headerbar > .inner.mwe-header-inner,
    #page-header #nav-main,
    #page-header #nav-breadcrumbs,
    #page-body,
    #topic-slot-banner.topic-slot,
    .mwe-value-strip,
    #page-footer > .navbar,
    #page-footer .copyright {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #page-body {
        width: 100% !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    /* A compact two-line mobile masthead: logo, then the two account CTAs. */
    .headerbar,
    .headerbar > .inner.mwe-header-inner {
        height: auto !important;
        min-height: 0 !important;
    }

    .headerbar > .inner.mwe-header-inner {
        width: 100% !important;
        padding: 14px 12px 12px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        justify-items: center !important;
        align-items: center !important;
        row-gap: 10px !important;
    }

    #site-description {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
    }

    #site-description > a.logo.mwe-brand,
    .site-description > a.logo.mwe-brand,
    .mwe-brand {
        margin-left: auto !important;
        margin-right: auto !important;
        flex-shrink: 0 !important;
    }

    /* The full search remains available through navigation; hiding the large
       masthead search creates enough room for the account actions on phones. */
    #search-box.search-header {
        display: none !important;
    }

    .mwe-account-actions,
    .mwe-account-actions.mwe-account-guest {
        grid-column: 1 !important;
        grid-row: 2 !important;
        justify-self: center !important;
        width: 100% !important;
        max-width: 310px !important;
        min-width: 0 !important;
        margin: 0 auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
    }

    .mwe-account-actions.mwe-account-guest .mwe-account-login,
    .mwe-account-actions.mwe-account-guest .mwe-account-register {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 150px !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 0 10px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }

    .mwe-account-actions.mwe-account-guest .mwe-account-login span,
    .mwe-account-actions.mwe-account-guest .mwe-account-register span {
        display: inline !important;
        max-width: none !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    /* Logged-in account controls should also stay inside the viewport. */
    .mwe-account-cluster {
        max-width: 100% !important;
        margin: 0 auto !important;
        justify-content: center !important;
    }

    /* Mobile navigation: fixed to viewport, no horizontal drift. */
    #page-header #nav-main {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 8px !important;
        display: flex !important;
        align-items: center !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    #page-header #nav-main > li {
        min-width: 0 !important;
        flex: 0 0 auto;
    }

    #page-header #nav-main > .mwe-nav-fill {
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }

    #page-header #nav-main > li > a,
    #page-header #nav-main > li.quick-links > a,
    #page-header #nav-main > li.mwe-topics-menu > summary {
        padding-left: 9px !important;
        padding-right: 9px !important;
    }

    /* Aktuelles is still reachable through Themen and the footer; removing it
       here protects narrow iPhones from nav overflow. */
    #page-header #nav-main > .mwe-primary-nav:nth-of-type(3) {
        display: none !important;
    }

    #page-header #nav-main > .mwe-secondary-nav > a span,
    #page-header #nav-main > .mwe-topics-menu > summary span {
        display: none !important;
    }

    /* State-of-the-art compact breadcrumb: keep Portal + Foren-Übersicht +
       the current location, collapse intermediate levels, never horizontal-scroll. */
    body:not(.section-index) #page-header #nav-breadcrumbs {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 0 10px !important;
        overflow: hidden !important;
        background: #fff !important;
        border-top: 0 !important;
        border-bottom: 1px solid #e6edf4 !important;
        box-shadow: 0 1px 0 rgba(16, 42, 76, .025) !important;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .breadcrumbs {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 44px !important;
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        white-space: normal !important;
        overflow: hidden !important;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .crumb {
        flex: 0 0 auto !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    /* Hide intermediate crumbs; keep first two and the destination. */
    body:not(.section-index) #page-header #nav-breadcrumbs .crumb:nth-child(n+3):not(:last-child) {
        display: none !important;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .crumb:last-child {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .crumb a {
        min-height: 44px !important;
        max-width: 100% !important;
        padding: 0 7px !important;
        display: inline-flex !important;
        align-items: center !important;
        overflow: hidden !important;
        color: #60748c !important;
        font-size: 12px !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .crumb:first-child a {
        padding-left: 0 !important;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .crumb:last-child a {
        display: flex !important;
        color: #17395f !important;
        font-weight: 700 !important;
    }

    /* Mark a collapsed hierarchy without lying about direct ancestry. */
    body:not(.section-index) #page-header #nav-breadcrumbs .crumb:last-child:nth-child(n+4)::before {
        content: "…" !important;
        flex: 0 0 auto;
        margin: 0 2px 0 5px;
        color: #99a9ba !important;
        font-weight: 700;
    }

    #page-header #nav-breadcrumbs::-webkit-scrollbar {
        display: none !important;
    }

    /* Ensure common content never establishes a wider formatting context. */
    .forabg,
    .forumbg,
    .panel,
    .post,
    .action-bar,
    .search-box,
    #portal-body,
    #portal-center,
    #portal-left,
    #portal-right,
    ul.topiclist,
    ul.topiclist > li,
    ul.topiclist dl,
    .postbody,
    .postprofile {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    #topic-slot-banner.topic-slot {
        width: 100% !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
        box-sizing: border-box !important;
    }

    #topic-slot-banner.topic-slot img,
    body:has(#portal-body) #topic-slot-banner.topic-slot img {
        display: block !important;
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

@media (max-width: 390px) {
    .mwe-account-actions.mwe-account-guest {
        max-width: 286px !important;
    }

    .mwe-account-actions.mwe-account-guest .mwe-account-login,
    .mwe-account-actions.mwe-account-guest .mwe-account-register {
        padding-left: 8px !important;
        padding-right: 8px !important;
        font-size: 11.5px !important;
    }

    /* On very small phones keep the breadcrumb readable by turning Portal
       into an icon-first compact entry while retaining its text semantically. */
    body:not(.section-index) #page-header #nav-breadcrumbs .crumb:first-child a {
        max-width: 64px !important;
    }

    body:not(.section-index) #page-header #nav-breadcrumbs .crumb:nth-child(2) a {
        max-width: 112px !important;
    }
}

/* v0.5.5: clearer mobile account entry for logged-in users */
.mwe-account-mobile-label {
    display: none;
}

@media (max-width: 850px) {
    .mwe-account-cluster {
        gap: 10px !important;
    }

    .mwe-account-user {
        width: auto !important;
        min-width: 132px !important;
        max-width: min(78vw, 220px) !important;
        padding: 0 14px !important;
        border-radius: 999px !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        background: #ffffff !important;
        border: 1px solid rgba(17, 46, 94, 0.14) !important;
        box-shadow: 0 10px 24px rgba(17, 46, 94, 0.12) !important;
    }

    .mwe-account-mobile-label {
        display: inline-flex !important;
        align-items: center;
        min-width: 0;
        color: #0d2f5f !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        white-space: nowrap;
    }

    .mwe-account-name,
    .mwe-account-chevron {
        display: none !important;
    }

    .mwe-account-avatar,
    .mwe-account-fallback {
        flex: 0 0 auto;
    }

    .mwe-account-profile .dropdown {
        right: 50% !important;
        left: auto !important;
        transform: translateX(50%) !important;
        width: min(92vw, 320px) !important;
        max-width: 320px !important;
    }
}

@media (max-width: 480px) {
    .mwe-account-actions {
        max-width: 100% !important;
    }

    .mwe-account-user {
        min-width: 146px !important;
        max-width: 88vw !important;
        min-height: 44px !important;
        height: 44px !important;
        padding: 0 15px !important;
    }

    .mwe-account-mobile-label {
        font-size: 14px !important;
    }
}

/* ========================================================================== 
   v0.5.7: modern mobile navigation + progressive portal feed
   ========================================================================== */
.mwe-nav-label-mobile {
    display: none;
}

.mwe-portal-feed-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 16px 16px;
    border-top: 1px solid #e7edf4;
    background: #fff;
}

.mwe-portal-load-more,
.mwe-portal-all-topics {
    min-height: 38px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-weight: 700;
    text-decoration: none;
}

.mwe-portal-load-more {
    padding: 0 16px;
    border: 1px solid #d4dfeb;
    background: #f7faff;
    color: #0757b8;
    cursor: pointer;
}

.mwe-portal-load-more:hover,
.mwe-portal-load-more:focus {
    border-color: #b9cee4;
    background: #edf5fd;
    color: #064a96;
}

.mwe-portal-load-more.is-loading .icon {
    animation: mwe-load-spin .7s linear infinite;
}

.mwe-portal-all-topics {
    padding: 0 14px;
    color: #536b85;
}

.mwe-portal-all-topics:hover,
.mwe-portal-all-topics:focus {
    color: #0757b8;
}

@keyframes mwe-load-spin {
    to { transform: rotate(360deg); }
}

/* Avoid a flash of all preloaded rows before JS applies progressive reveal. */
@media (min-width: 701px) {
    .mwe-portal-feed > .mwe-portal-progressive-item:nth-child(n+11) {
        display: none;
    }
    .mwe-portal-feed > .mwe-portal-progressive-item[hidden] {
        display: none !important;
    }
    .mwe-portal-feed > .mwe-portal-progressive-item:not([hidden]) {
        display: list-item;
    }
}

@media (max-width: 700px) {
    /* Four clear, labelled destinations instead of ambiguous icon-only nav. */
    #page-header #nav-main {
        height: 62px !important;
        min-height: 62px !important;
        padding: 0 !important;
        gap: 0 !important;
        overflow: visible !important;
    }

    #page-header #nav-main > .mwe-nav-fill {
        display: none !important;
    }

    #page-header #nav-main > .mwe-primary-nav,
    #page-header #nav-main > .mwe-secondary-nav,
    #page-header #nav-main > .mwe-topics-menu {
        flex: 1 1 0 !important;
        width: auto !important;
        min-width: 0 !important;
        height: 62px !important;
        margin: 0 !important;
    }

    #page-header #nav-main > .mwe-primary-nav:nth-of-type(3) {
        display: none !important;
    }

    #page-header #nav-main > li > a,
    #page-header #nav-main > li.mwe-topics-menu > summary {
        width: 100% !important;
        height: 62px !important;
        min-height: 62px !important;
        padding: 7px 4px 6px !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        border-radius: 0 !important;
        font-size: 11px !important;
        line-height: 1.05 !important;
        text-align: center !important;
    }

    #page-header #nav-main > li > a .icon,
    #page-header #nav-main > li.mwe-topics-menu > summary .icon {
        margin: 0 !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    #page-header #nav-main > .mwe-primary-nav > a span,
    #page-header #nav-main > .mwe-topics-menu > summary span,
    #page-header #nav-main > .mwe-secondary-nav > a .mwe-nav-label-mobile {
        display: inline !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        color: #fff !important;
        font-size: 11px !important;
        font-weight: 650 !important;
    }

    #page-header #nav-main > .mwe-secondary-nav > a .mwe-nav-label-desktop {
        display: none !important;
    }

    body:has(#portal-body) #page-header #nav-main > .mwe-portal-nav > a,
    body.section-index:not(:has(#portal-body)) #page-header #nav-main > .mwe-forum-nav > a,
    body.section-viewforum #page-header #nav-main > .mwe-forum-nav > a,
    body.section-viewtopic #page-header #nav-main > .mwe-forum-nav > a,
    body.section-posting #page-header #nav-main > .mwe-forum-nav > a {
        background: rgba(255,255,255,.12) !important;
        box-shadow: inset 0 -3px 0 rgba(255,255,255,.92);
    }

    .mwe-topics-panel {
        right: 8px !important;
        left: 8px !important;
        width: auto !important;
        max-width: none !important;
    }

    .mwe-portal-feed-actions {
        flex-direction: column;
        padding: 12px;
    }

    .mwe-portal-load-more,
    .mwe-portal-all-topics {
        width: 100%;
        min-height: 44px;
        box-sizing: border-box;
    }

    .mwe-portal-load-more {
        background: #f2f7fd;
        border-color: #d3e0ed;
    }

    .mwe-portal-feed > .mwe-portal-progressive-item:nth-child(n+9) {
        display: none;
    }
    .mwe-portal-feed > .mwe-portal-progressive-item[hidden] {
        display: none !important;
    }
    .mwe-portal-feed > .mwe-portal-progressive-item:not([hidden]) {
        display: list-item;
    }
}

/* ========================================================================== 
   v0.5.7: calmer mobile navigation + viewport-safe Themen menu
   ========================================================================== */
@media (max-width: 700px) {
    /* A slimmer mobile nav: still obvious, but less visually dominant. */
    #page-header #nav-main {
        height: 54px !important;
        min-height: 54px !important;
        padding: 0 6px !important;
        gap: 2px !important;
        background: #075493 !important;
        overflow: visible !important;
    }

    #page-header #nav-main > .mwe-primary-nav,
    #page-header #nav-main > .mwe-secondary-nav,
    #page-header #nav-main > .mwe-topics-menu {
        height: 54px !important;
    }

    #page-header #nav-main > li > a,
    #page-header #nav-main > li.mwe-topics-menu > summary {
        height: 54px !important;
        min-height: 54px !important;
        padding: 6px 4px 5px !important;
        border-radius: 8px !important;
        gap: 3px !important;
        background: transparent !important;
        box-shadow: none !important;
        transition: background .16s ease, color .16s ease !important;
    }

    #page-header #nav-main > li > a:hover,
    #page-header #nav-main > li > a:focus,
    #page-header #nav-main > li.mwe-topics-menu > summary:hover,
    #page-header #nav-main > li.mwe-topics-menu > summary:focus-visible,
    #page-header #nav-main > li.mwe-topics-menu > .mwe-topics-details[open] > summary {
        background: rgba(255,255,255,.08) !important;
    }

    #page-header #nav-main > li > a .icon,
    #page-header #nav-main > li.mwe-topics-menu > summary .icon {
        font-size: 16px !important;
        opacity: .95;
    }

    #page-header #nav-main > .mwe-primary-nav > a span,
    #page-header #nav-main > .mwe-topics-menu > summary span,
    #page-header #nav-main > .mwe-secondary-nav > a .mwe-nav-label-mobile {
        font-size: 10.5px !important;
        font-weight: 600 !important;
        letter-spacing: .01em !important;
    }

    /* Active section: subtle lower indicator instead of a large filled tile. */
    body:has(#portal-body) #page-header #nav-main > .mwe-portal-nav > a,
    body.section-index:not(:has(#portal-body)) #page-header #nav-main > .mwe-forum-nav > a,
    body.section-viewforum #page-header #nav-main > .mwe-forum-nav > a,
    body.section-viewtopic #page-header #nav-main > .mwe-forum-nav > a,
    body.section-posting #page-header #nav-main > .mwe-forum-nav > a {
        background: rgba(255,255,255,.07) !important;
        box-shadow: inset 0 -2px 0 rgba(255,255,255,.85) !important;
    }

    /* The Themen popup is positioned from the right-most nav item, so give it
       a viewport-based width instead of stretching it inside the small nav cell. */
    #page-header #quick-links .mwe-topics-panel,
    .mwe-topics-panel {
        top: calc(100% + 7px) !important;
        right: 0 !important;
        left: auto !important;
        width: min(330px, calc(100vw - 20px)) !important;
        max-width: calc(100vw - 20px) !important;
        min-width: 0 !important;
        max-height: min(72vh, 520px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding: 6px !important;
        border: 1px solid #d5dee8 !important;
        border-radius: 12px !important;
        background: rgba(255,255,255,.985) !important;
        box-shadow: 0 18px 42px rgba(13,43,78,.22) !important;
        -webkit-overflow-scrolling: touch;
    }

    #page-header #quick-links .mwe-topics-panel::before,
    #page-header #quick-links .mwe-topics-panel::after {
        right: 20px !important;
    }

    #page-header #quick-links .mwe-topics-links {
        width: 100% !important;
        min-width: 0 !important;
    }

    #page-header #quick-links .mwe-topics-links > li {
        width: 100% !important;
        min-width: 0 !important;
    }

    #page-header #quick-links .mwe-topics-links a {
        width: 100% !important;
        min-height: 42px !important;
        padding: 9px 11px !important;
        display: grid !important;
        grid-template-columns: 20px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 9px !important;
        border-radius: 8px !important;
        color: #17395f !important;
        font-size: 13px !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        overflow: hidden !important;
    }

    #page-header #quick-links .mwe-topics-links a .icon {
        width: 20px !important;
        min-width: 20px !important;
        text-align: center !important;
        color: #486784 !important;
    }

    #page-header #quick-links .mwe-topics-links a span {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: normal !important;
    }

    #page-header #quick-links .mwe-topics-links > li.separator {
        margin: 5px 7px !important;
        width: auto !important;
        background: #e8edf3 !important;
    }
}

@media (max-width: 430px) {
    #page-header #nav-main {
        height: 52px !important;
        min-height: 52px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    #page-header #nav-main > .mwe-primary-nav,
    #page-header #nav-main > .mwe-secondary-nav,
    #page-header #nav-main > .mwe-topics-menu,
    #page-header #nav-main > li > a,
    #page-header #nav-main > li.mwe-topics-menu > summary {
        height: 52px !important;
        min-height: 52px !important;
    }

    #page-header #quick-links .mwe-topics-details > summary {
        width: 100% !important;
    }

    #page-header #quick-links .mwe-topics-details > summary span {
        display: inline !important;
    }

    #page-header #quick-links .mwe-topics-panel,
    .mwe-topics-panel {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        right: -2px !important;
        border-radius: 12px !important;
    }
}

/* ========================================================================== 
   v0.5.8: app-like mobile masthead for signed-in users
   Logo on the left, explicit account control on the right.
   ========================================================================== */
@media (max-width: 700px) {
    .headerbar > .inner.mwe-header-inner.mwe-header-logged {
        width: 100% !important;
        min-height: 72px !important;
        padding: 12px 14px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: 1fr !important;
        column-gap: 12px !important;
        row-gap: 0 !important;
        justify-items: stretch !important;
        align-items: center !important;
    }

    .mwe-header-logged #site-description {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        text-align: left !important;
        overflow: hidden !important;
    }

    .mwe-header-logged #site-description > a.logo.mwe-brand,
    .mwe-header-logged .site-description > a.logo.mwe-brand,
    .mwe-header-logged .mwe-brand {
        width: 180px !important;
        height: 40px !important;
        max-width: 100% !important;
        flex: 0 1 180px !important;
        margin: 0 !important;
        background-position: left center !important;
    }

    .mwe-header-logged .mwe-account-actions {
        grid-column: 2 !important;
        grid-row: 1 !important;
        justify-self: end !important;
        align-self: center !important;
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }

    .mwe-header-logged .mwe-account-cluster {
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }

    .mwe-header-logged .mwe-account-user {
        width: auto !important;
        min-width: 146px !important;
        max-width: 178px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 12px 0 7px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        overflow: hidden !important;
        border: 1px solid #d8e1eb !important;
        border-radius: 999px !important;
        background: #fff !important;
        box-shadow: 0 6px 18px rgba(17, 46, 94, .10) !important;
        color: #12355e !important;
        text-decoration: none !important;
    }

    .mwe-header-logged .mwe-account-user:hover,
    .mwe-header-logged .mwe-account-user:focus,
    .mwe-header-logged .mwe-account-profile.open .mwe-account-user {
        border-color: #bfd1e3 !important;
        background: #f7faff !important;
        box-shadow: 0 8px 22px rgba(17, 46, 94, .14) !important;
    }

    .mwe-header-logged .mwe-account-avatar {
        width: 32px !important;
        height: 32px !important;
        flex: 0 0 32px !important;
        border-radius: 50% !important;
        overflow: hidden !important;
        background: #eef4fa !important;
        box-shadow: inset 0 0 0 1px rgba(17, 46, 94, .10) !important;
    }

    .mwe-header-logged .mwe-account-avatar img {
        width: 32px !important;
        height: 32px !important;
        max-width: 32px !important;
        max-height: 32px !important;
        object-fit: cover !important;
        border-radius: 50% !important;
    }

    .mwe-header-logged .mwe-account-fallback {
        width: 32px !important;
        height: 32px !important;
        flex: 0 0 32px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 50% !important;
        background: #eef4fa !important;
        color: #0757a8 !important;
        font-size: 15px !important;
    }

    .mwe-header-logged .mwe-account-mobile-label {
        display: inline-flex !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
        color: #12355e !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .mwe-header-logged .mwe-account-name {
        display: none !important;
    }

    .mwe-header-logged .mwe-account-chevron {
        display: inline-flex !important;
        width: 12px !important;
        margin-left: auto !important;
        color: #7d8ea2 !important;
        font-size: 11px !important;
    }

    /* The menu now opens beneath the right-aligned account pill and grows left. */
    .mwe-header-logged .mwe-account-profile .dropdown {
        right: 0 !important;
        left: auto !important;
        transform: none !important;
        width: min(320px, calc(100vw - 28px)) !important;
        max-width: calc(100vw - 28px) !important;
    }
}

@media (max-width: 430px) {
    .headerbar > .inner.mwe-header-inner.mwe-header-logged {
        min-height: 68px !important;
        padding: 10px 12px !important;
        column-gap: 9px !important;
    }

    .mwe-header-logged #site-description > a.logo.mwe-brand,
    .mwe-header-logged .site-description > a.logo.mwe-brand,
    .mwe-header-logged .mwe-brand {
        width: 156px !important;
        height: 35px !important;
        flex-basis: 156px !important;
    }

    .mwe-header-logged .mwe-account-user {
        min-width: 140px !important;
        max-width: 154px !important;
        height: 42px !important;
        min-height: 42px !important;
        padding-right: 10px !important;
        gap: 7px !important;
    }

    .mwe-header-logged .mwe-account-avatar,
    .mwe-header-logged .mwe-account-avatar img,
    .mwe-header-logged .mwe-account-fallback {
        width: 30px !important;
        height: 30px !important;
        max-width: 30px !important;
        max-height: 30px !important;
        flex-basis: 30px !important;
    }

    .mwe-header-logged .mwe-account-mobile-label {
        font-size: 12.5px !important;
    }
}

@media (max-width: 360px) {
    .headerbar > .inner.mwe-header-inner.mwe-header-logged {
        padding-left: 9px !important;
        padding-right: 9px !important;
        column-gap: 7px !important;
    }

    .mwe-header-logged #site-description > a.logo.mwe-brand,
    .mwe-header-logged .site-description > a.logo.mwe-brand,
    .mwe-header-logged .mwe-brand {
        width: 145px !important;
        height: 32px !important;
        flex-basis: 145px !important;
    }

    .mwe-header-logged .mwe-account-user {
        min-width: 126px !important;
        max-width: 138px !important;
        padding-left: 6px !important;
        padding-right: 8px !important;
    }

    .mwe-header-logged .mwe-account-mobile-label {
        font-size: 12px !important;
    }
}

/* ========================================================================== 
   v0.5.9 - modern compact pagination on phones
   Keep phpBB's original page URLs and page-jump logic; only presentation changes.
   ========================================================================== */
.mwe-pagination-status,
.mwe-page-jump-label {
    display: none;
}

@media (max-width: 700px) {
    /* Main pagers become compact controls instead of showing a row of 5+ pages. */
    .action-bar > .pagination {
        color: #6b7d92 !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
    }

    .action-bar > .pagination .mwe-pagination-status {
        display: inline-flex !important;
        min-height: 38px;
        margin-top: 8px;
        padding: 0 12px;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        border: 1px solid #d8e2ed;
        border-radius: 10px;
        background: #fff;
        color: #4d627b;
        font-size: 12px;
        font-weight: 700;
        white-space: nowrap;
        vertical-align: top;
    }

    .action-bar > .pagination > ul {
        margin: 8px 0 0 6px !important;
        display: inline-flex !important;
        align-items: center;
        gap: 6px;
        vertical-align: top;
    }

    /* Number buttons are redundant on a narrow viewport: current page is shown
       in the status chip and arbitrary navigation remains available via page jump. */
    .action-bar > .pagination > ul > li:not(.arrow):not(.page-jump) {
        display: none !important;
    }

    .action-bar > .pagination > ul > li.arrow,
    .action-bar > .pagination > ul > li.page-jump {
        display: inline-flex !important;
        margin: 0 !important;
    }

    .action-bar > .pagination > ul > li.arrow > a,
    .action-bar > .pagination > ul > li.page-jump > a {
        min-width: 38px !important;
        width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px;
        box-sizing: border-box;
        border: 1px solid #d8e2ed !important;
        border-radius: 10px !important;
        background: #fff !important;
        color: #0b5fb7 !important;
        box-shadow: none !important;
    }

    .action-bar > .pagination > ul > li.page-jump > a {
        width: auto !important;
        min-width: 108px !important;
        padding: 0 12px !important;
    }

    .action-bar > .pagination .mwe-page-jump-label {
        display: inline !important;
        color: inherit !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        white-space: nowrap;
    }

    .action-bar > .pagination > ul > li.arrow > a:hover,
    .action-bar > .pagination > ul > li.arrow > a:focus,
    .action-bar > .pagination > ul > li.page-jump > a:hover,
    .action-bar > .pagination > ul > li.page-jump > a:focus {
        border-color: #b8cce3 !important;
        background: #f3f8fd !important;
        color: #0757a8 !important;
    }

    .action-bar > .pagination .page-jump .dropdown {
        right: 0 !important;
        left: auto !important;
        width: min(260px, calc(100vw - 28px)) !important;
        max-width: calc(100vw - 28px) !important;
    }

    /* Mini-pagination next to individual topics remains untouched. */
    .row .pagination .mwe-pagination-status,
    .row .pagination .mwe-page-jump-label {
        display: none !important;
    }
}

@media (max-width: 390px) {
    .action-bar > .pagination .mwe-pagination-status {
        padding-left: 9px;
        padding-right: 9px;
        font-size: 11.5px;
    }

    .action-bar > .pagination > ul {
        gap: 5px;
        margin-left: 5px !important;
    }

    .action-bar > .pagination > ul > li.page-jump > a {
        min-width: 92px !important;
        padding-left: 9px !important;
        padding-right: 9px !important;
    }

    .action-bar > .pagination .mwe-page-jump-label {
        font-size: 11.5px !important;
    }
}

@media (max-width: 350px) {
    .action-bar > .pagination > ul > li.page-jump > a {
        width: 38px !important;
        min-width: 38px !important;
        padding: 0 !important;
    }

    .action-bar > .pagination .mwe-page-jump-label {
        display: none !important;
    }
}

/* ========================================================================== 
   v0.5.10 - reliable mobile pagination with visible page numbers
   Uses phpBB's original pagination markup and URLs. The phone layout keeps
   only previous/current/next page numbers plus arrows and the page jump.
   ========================================================================== */
@media (max-width: 700px) {
    /* Remove the v0.5.9 helper UI if a cached custom pagination template is
       still present during rollout. */
    .action-bar > .pagination .mwe-pagination-status,
    .action-bar > .pagination .mwe-page-jump-label {
        display: none !important;
    }

    .action-bar > .pagination {
        width: 100% !important;
        margin: 10px 0 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        float: none !important;
        clear: both !important;
        text-align: center !important;
        color: #6b7d92 !important;
        font-size: 12px !important;
        line-height: 1.3 !important;
    }

    .action-bar > .pagination > ul {
        width: auto !important;
        max-width: 100% !important;
        margin: 7px 0 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        flex-wrap: nowrap !important;
        vertical-align: middle !important;
    }

    /* Start from a compact set. */
    .action-bar > .pagination > ul > li {
        display: none !important;
        margin: 0 !important;
    }

    /* Always retain navigation arrows, page jump and current page. */
    .action-bar > .pagination > ul > li.arrow,
    .action-bar > .pagination > ul > li.page-jump,
    .action-bar > .pagination > ul > li.active {
        display: inline-flex !important;
    }

    /* Retain the numeric page immediately before and after the current page.
       :has() is supported by current iOS Safari and modern desktop browsers. */
    .action-bar > .pagination > ul > li:not(.arrow):not(.page-jump):not(.ellipsis):has(+ li.active),
    .action-bar > .pagination > ul > li.active + li:not(.arrow):not(.page-jump):not(.ellipsis) {
        display: inline-flex !important;
    }

    .action-bar > .pagination > ul > li > a,
    .action-bar > .pagination > ul > li > span {
        min-width: 40px !important;
        width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        border: 1px solid #d6e0eb !important;
        border-radius: 10px !important;
        background: #fff !important;
        color: #315579 !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        text-decoration: none !important;
        box-shadow: none !important;
    }

    .action-bar > .pagination > ul > li.active > span {
        border-color: #176ac5 !important;
        background: #176ac5 !important;
        color: #fff !important;
    }

    .action-bar > .pagination > ul > li.arrow > a,
    .action-bar > .pagination > ul > li.page-jump > a {
        color: #1263b7 !important;
    }

    .action-bar > .pagination > ul > li > a:hover,
    .action-bar > .pagination > ul > li > a:focus {
        border-color: #b9cde2 !important;
        background: #f3f8fd !important;
        color: #0757a8 !important;
    }

    /* Turn phpBB's jump control into a compact, familiar ellipsis button. */
    .action-bar > .pagination > ul > li.page-jump > a .icon {
        display: none !important;
    }

    .action-bar > .pagination > ul > li.page-jump > a::before {
        content: "•••";
        display: block;
        font-size: 13px;
        font-weight: 800;
        letter-spacing: 1px;
        line-height: 1;
        color: inherit;
    }

    .action-bar > .pagination .page-jump .dropdown {
        position: fixed !important;
        top: 50% !important;
        right: auto !important;
        bottom: auto !important;
        left: 50% !important;
        width: min(300px, calc(100vw - 32px)) !important;
        max-width: calc(100vw - 32px) !important;
        transform: translate(-50%, -50%) !important;
        z-index: 500 !important;
        border-radius: 14px !important;
        box-shadow: 0 18px 50px rgba(16, 42, 70, .24) !important;
    }

    .action-bar > .pagination .page-jump .dropdown-contents {
        padding: 12px !important;
    }

    .action-bar > .pagination .page-jump-form {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .action-bar > .pagination .page-jump-form .inputbox {
        min-width: 0 !important;
        flex: 1 1 auto !important;
        height: 40px !important;
        border-radius: 8px !important;
    }

    .action-bar > .pagination .page-jump-form .button2 {
        height: 40px !important;
        min-width: 54px !important;
        border-radius: 8px !important;
    }

    /* Topic-list mini pagers keep their familiar small page-number layout. */
    .row .pagination > ul > li,
    .topiclist .pagination > ul > li {
        display: inline-block !important;
    }
}

@media (max-width: 380px) {
    .action-bar > .pagination > ul {
        gap: 5px !important;
    }

    .action-bar > .pagination > ul > li > a,
    .action-bar > .pagination > ul > li > span {
        min-width: 37px !important;
        width: 37px !important;
        height: 37px !important;
        min-height: 37px !important;
        border-radius: 9px !important;
        font-size: 12.5px !important;
    }
}

/* ========================================================================== 
   v0.5.11 - mobile pagination: always show first + last page
   Example: ‹ 1 … 261 [262] 263 524 ›
   ========================================================================== */
@media (max-width: 700px) {
    /* First and last page are important orientation anchors and must always be
       visible, even when phpBB only renders the pages around the current one. */
    .action-bar > .pagination > ul > li.mwe-page-first,
    .action-bar > .pagination > ul > li.mwe-page-last {
        display: inline-flex !important;
    }

    /* Put the jump control in a conventional position instead of at the start
       of the pager (phpBB outputs it before the numbered pages in the DOM). */
    .action-bar > .pagination > ul > li.arrow.previous {
        order: 10;
    }

    .action-bar > .pagination > ul > li.mwe-page-first {
        order: 20;
    }

    .action-bar > .pagination > ul > li.page-jump {
        order: 30;
    }

    .action-bar > .pagination > ul > li.active:not(.mwe-page-first):not(.mwe-page-last),
    .action-bar > .pagination > ul > li:not(.arrow):not(.page-jump):not(.ellipsis):not(.mwe-page-first):not(.mwe-page-last):has(+ li.active),
    .action-bar > .pagination > ul > li.active + li:not(.arrow):not(.page-jump):not(.ellipsis):not(.mwe-page-first):not(.mwe-page-last) {
        order: 40;
    }

    .action-bar > .pagination > ul > li.mwe-page-last {
        order: 50;
    }

    .action-bar > .pagination > ul > li.arrow.next {
        order: 60;
    }

    /* On page 1, the natural pattern is 1, 2, …, last rather than 1, …, 2. */
    .action-bar > .pagination > ul:has(> li.mwe-page-first.active) > li.page-jump {
        order: 45;
    }

    /* Keep the controls compact enough for an iPhone without horizontal drift. */
    .action-bar > .pagination > ul {
        max-width: 100% !important;
        row-gap: 6px !important;
    }
}

@media (max-width: 380px) {
    /* On very small phones retain the two anchors and current page; neighbours
       can disappear if necessary to keep everything on one clean line. */
    .action-bar > .pagination > ul > li:not(.arrow):not(.page-jump):not(.ellipsis):not(.active):not(.mwe-page-first):not(.mwe-page-last) {
        display: none !important;
    }
}

/* ========================================================================== 
   v0.5.12 - mobile pagination without jump-dropdown
   Start:  ‹ 1 2 3 … 524 ›
   End:    ‹ 1 … 522 523 524
   Middle: ‹ 1 … 261 262 263 … 524 ›
   ========================================================================== */
@media (max-width: 700px) {
    /* The page-jump popup is awkward on phones. Keep it on desktop only. */
    .action-bar > .pagination > ul > li.page-jump {
        display: none !important;
    }

    /* Make total-post count a separate quiet line, with pager underneath. */
    .action-bar > .pagination {
        display: block !important;
        width: 100% !important;
        margin: 10px 0 0 !important;
        padding: 0 !important;
        float: none !important;
        clear: both !important;
        text-align: right !important;
        color: #728399 !important;
        font-size: 12px !important;
        line-height: 1.3 !important;
    }

    .action-bar > .pagination > ul {
        width: 100% !important;
        max-width: 100% !important;
        margin: 9px 0 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        flex-wrap: nowrap !important;
        overflow: visible !important;
    }

    /* Reset the older mobile visibility/order rules. */
    .action-bar > .pagination > ul > li {
        order: initial !important;
        display: none !important;
        margin: 0 !important;
        flex: 0 0 auto !important;
    }

    /* Navigation arrows and orientation anchors. */
    .action-bar > .pagination > ul > li.arrow,
    .action-bar > .pagination > ul > li.mwe-page-first,
    .action-bar > .pagination > ul > li.mwe-page-last,
    .action-bar > .pagination > ul > li.active {
        display: inline-flex !important;
    }

    /* Near the beginning show pages 1, 2, 3. */
    .action-bar > .pagination > ul:has(> li.active.mwe-page-start) > li.mwe-page-start {
        display: inline-flex !important;
    }

    /* Near the end show the final three pages. */
    .action-bar > .pagination > ul:has(> li.active.mwe-page-end) > li.mwe-page-end {
        display: inline-flex !important;
    }

    /* In the middle keep immediate neighbours around the current page. */
    .action-bar > .pagination > ul:not(:has(> li.active.mwe-page-start)):not(:has(> li.active.mwe-page-end)) > li.mwe-page-number:has(+ li.active),
    .action-bar > .pagination > ul:not(:has(> li.active.mwe-page-start)):not(:has(> li.active.mwe-page-end)) > li.active + li.mwe-page-number {
        display: inline-flex !important;
    }

    /* Use phpBB's real ellipsis as a passive separator; never a popup trigger. */
    .action-bar > .pagination > ul > li.ellipsis {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 20px !important;
    }

    .action-bar > .pagination > ul > li.ellipsis > span {
        width: 20px !important;
        min-width: 20px !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: #76879a !important;
        box-shadow: none !important;
        font-weight: 700 !important;
    }

    .action-bar > .pagination > ul > li > a,
    .action-bar > .pagination > ul > li > span {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        border-radius: 10px !important;
        font-size: 12.5px !important;
    }

    .action-bar > .pagination > ul > li.active > span {
        background: #176ac5 !important;
        border-color: #176ac5 !important;
        color: #fff !important;
    }
}

@media (max-width: 380px) {
    .action-bar > .pagination > ul {
        gap: 4px !important;
    }

    .action-bar > .pagination > ul > li > a,
    .action-bar > .pagination > ul > li > span {
        width: 35px !important;
        min-width: 35px !important;
        height: 35px !important;
        min-height: 35px !important;
        font-size: 12px !important;
    }

    .action-bar > .pagination > ul > li.ellipsis,
    .action-bar > .pagination > ul > li.ellipsis > span {
        width: 15px !important;
        min-width: 15px !important;
    }
}

/* ========================================================================== 
   v0.5.13 - mobile pagination: page 1 is always directly selectable
   phpBB can omit page 1 from its generated range near the end of long topics.
   The template now includes a mobile fallback that is shown only when needed.
   ========================================================================== */
.mwe-mobile-first-fallback,
.mwe-mobile-leading-ellipsis {
    display: none;
}

@media (max-width: 700px) {
    /* Only reveal the synthetic page-1 link when phpBB did not output the real one. */
    .action-bar > .pagination > ul:not(:has(> li.mwe-page-first)) > li.mwe-mobile-first-fallback,
    .action-bar > .pagination > ul:not(:has(> li.mwe-page-first)) > li.mwe-mobile-leading-ellipsis {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 auto !important;
    }

    /* Keep the intuitive sequence: previous → 1 → … → nearby/current pages → next. */
    .action-bar > .pagination > ul > li.arrow.previous {
        order: -30 !important;
    }

    .action-bar > .pagination > ul > li.mwe-mobile-first-fallback {
        order: -20 !important;
    }

    .action-bar > .pagination > ul > li.mwe-mobile-leading-ellipsis {
        order: -10 !important;
        width: 20px !important;
        min-width: 20px !important;
    }

    .action-bar > .pagination > ul > li.mwe-mobile-leading-ellipsis > span {
        width: 20px !important;
        min-width: 20px !important;
        height: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: #76879a !important;
        box-shadow: none !important;
        font-weight: 700 !important;
    }

    .action-bar > .pagination > ul > li.arrow.next {
        order: 30 !important;
    }
}

@media (max-width: 380px) {
    .action-bar > .pagination > ul > li.mwe-mobile-leading-ellipsis,
    .action-bar > .pagination > ul > li.mwe-mobile-leading-ellipsis > span {
        width: 14px !important;
        min-width: 14px !important;
    }
}

/* ========================================================================== 
   v0.5.14 - stable mobile masthead/navigation across every phpBB page
   Prevents iOS text autosizing and page-specific flex/content changes from
   changing the perceived header/navigation dimensions while browsing.
   ========================================================================== */
html,
body {
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
}

@media (max-width: 700px) {
    /* Do not rely on nth-of-type: extension/event output can change the li order. */
    #page-header #nav-main > .mwe-activity-nav {
        display: none !important;
    }

    /* One fixed masthead geometry on all mobile pages. */
    #page-header .headerbar,
    #page-header .headerbar > .inner.mwe-header-inner,
    #page-header .headerbar > .inner.mwe-header-inner.mwe-header-logged {
        height: 76px !important;
        min-height: 76px !important;
        max-height: 76px !important;
        box-sizing: border-box !important;
    }

    #page-header .headerbar > .inner.mwe-header-inner.mwe-header-logged {
        width: 100% !important;
        padding: 10px 14px !important;
        grid-template-columns: minmax(0, 1fr) 150px !important;
        grid-template-rows: 56px !important;
        column-gap: 10px !important;
        align-items: center !important;
    }

    .mwe-header-logged #site-description {
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
        align-items: center !important;
    }

    .mwe-header-logged #site-description > a.logo.mwe-brand,
    .mwe-header-logged .site-description > a.logo.mwe-brand,
    .mwe-header-logged .mwe-brand {
        width: 168px !important;
        min-width: 0 !important;
        max-width: 168px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        flex: 0 1 168px !important;
        background-size: contain !important;
        background-position: left center !important;
    }

    .mwe-header-logged .mwe-account-actions,
    .mwe-header-logged .mwe-account-cluster,
    .mwe-header-logged .mwe-account-profile {
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
    }

    .mwe-header-logged .mwe-account-user {
        width: 150px !important;
        min-width: 150px !important;
        max-width: 150px !important;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
        box-sizing: border-box !important;
    }

    /* Fixed nav height and four equal mobile slots when signed in. */
    #page-header .mwe-main-navbar,
    #page-header .mwe-main-navbar > .inner {
        min-height: 56px !important;
    }

    #page-header #nav-main {
        width: 100% !important;
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: 0 !important;
        box-sizing: border-box !important;
    }

    #page-header #nav-main > .mwe-nav-fill,
    #page-header #nav-main > .mwe-activity-nav {
        display: none !important;
    }

    #page-header #nav-main > .mwe-primary-nav,
    #page-header #nav-main > .mwe-secondary-nav,
    #page-header #nav-main > .mwe-topics-menu {
        width: auto !important;
        min-width: 0 !important;
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    #page-header #nav-main > li > a,
    #page-header #nav-main > li.mwe-topics-menu > summary {
        width: 100% !important;
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
        padding: 6px 3px 5px !important;
        box-sizing: border-box !important;
        line-height: 1 !important;
    }

    #page-header #nav-main > li > a .icon,
    #page-header #nav-main > li.mwe-topics-menu > summary .icon {
        width: 18px !important;
        height: 18px !important;
        line-height: 18px !important;
        font-size: 17px !important;
    }

    #page-header #nav-main > .mwe-primary-nav > a span,
    #page-header #nav-main > .mwe-topics-menu > summary span,
    #page-header #nav-main > .mwe-secondary-nav > a .mwe-nav-label-mobile {
        font-size: 10.5px !important;
        line-height: 12px !important;
    }

    /* Active state must not alter box dimensions. */
    body:has(#portal-body) #page-header #nav-main > .mwe-portal-nav > a,
    body.section-index:not(:has(#portal-body)) #page-header #nav-main > .mwe-forum-nav > a,
    body.section-viewforum #page-header #nav-main > .mwe-forum-nav > a,
    body.section-viewtopic #page-header #nav-main > .mwe-forum-nav > a,
    body.section-posting #page-header #nav-main > .mwe-forum-nav > a {
        border: 0 !important;
        box-shadow: inset 0 -2px 0 rgba(255,255,255,.85) !important;
    }
}

@media (max-width: 360px) {
    #page-header .headerbar > .inner.mwe-header-inner.mwe-header-logged {
        padding-left: 9px !important;
        padding-right: 9px !important;
        grid-template-columns: minmax(0, 1fr) 142px !important;
        column-gap: 7px !important;
    }

    .mwe-header-logged #site-description > a.logo.mwe-brand,
    .mwe-header-logged .site-description > a.logo.mwe-brand,
    .mwe-header-logged .mwe-brand {
        width: 148px !important;
        max-width: 148px !important;
        flex-basis: 148px !important;
    }

    .mwe-header-logged .mwe-account-user {
        width: 142px !important;
        min-width: 142px !important;
        max-width: 142px !important;
    }
}

/* ========================================================================== 
   v0.5.15 - state-of-the-art deterministic mobile pagination
   Start:  1 2 3 … 524 >
   Middle: < 1 … 261 262 263 … 524 >
   End:    < 1 … 522 523 524
   ========================================================================== */
.mwe-mobile-pager {
    display: none;
}

@media (max-width: 700px) {
    /* Only replace phpBB's original pager after JS has successfully built the
       mobile version. This leaves a functional fallback if JS is unavailable. */
    .action-bar > .pagination.mwe-mobile-pagination-ready > ul[data-mwe-pagination="1"] {
        display: none !important;
    }

    .action-bar > .pagination.mwe-mobile-pagination-ready {
        display: block !important;
        width: 100% !important;
        text-align: right !important;
    }

    .action-bar > .pagination .mwe-mobile-pager {
        width: 100%;
        margin: 10px 0 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 5px;
        min-width: 0;
    }

    .mwe-mobile-pager-page,
    .mwe-mobile-pager-arrow {
        width: 38px;
        min-width: 38px;
        height: 38px;
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        border: 1px solid #d4dfeb;
        border-radius: 10px;
        background: #fff;
        color: #315579;
        font-size: 13px;
        font-weight: 700;
        line-height: 1;
        text-decoration: none;
        box-shadow: none;
        -webkit-tap-highlight-color: transparent;
    }

    .mwe-mobile-pager-page.is-current {
        border-color: #176ac5;
        background: #176ac5;
        color: #fff;
    }

    a.mwe-mobile-pager-page:hover,
    a.mwe-mobile-pager-page:focus,
    .mwe-mobile-pager-arrow:hover,
    .mwe-mobile-pager-arrow:focus {
        border-color: #b9cde2;
        background: #f3f8fd;
        color: #0757a8;
    }

    .mwe-mobile-pager-gap {
        width: 18px;
        min-width: 18px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #7a8a9d;
        font-size: 14px;
        font-weight: 800;
        line-height: 1;
    }
}

@media (max-width: 380px) {
    .action-bar > .pagination .mwe-mobile-pager {
        gap: 4px;
    }

    .mwe-mobile-pager-page,
    .mwe-mobile-pager-arrow {
        width: 35px;
        min-width: 35px;
        height: 35px;
        min-height: 35px;
        border-radius: 9px;
        font-size: 12px;
    }

    .mwe-mobile-pager-gap {
        width: 13px;
        min-width: 13px;
        height: 35px;
        font-size: 13px;
    }
}

/* ========================================================================== 
   v0.5.16 — mobile primary navigation consistency
   - four truly equal navigation items
   - clear "Ungelesen" action instead of mail metaphor
   - Topics summary aligned exactly like the other items
   ========================================================================== */
@media (max-width: 700px) {
    #page-header #nav-main {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        grid-auto-flow: unset !important;
        grid-auto-columns: unset !important;
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        max-height: 58px !important;
        padding: 0 4px !important;
        gap: 0 !important;
        overflow: visible !important;
    }

    #page-header #nav-main > .mwe-portal-nav,
    #page-header #nav-main > .mwe-forum-nav,
    #page-header #nav-main > .mwe-secondary-nav,
    #page-header #nav-main > .mwe-topics-menu {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 58px !important;
        min-height: 58px !important;
        max-height: 58px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #page-header #nav-main > .mwe-nav-fill,
    #page-header #nav-main > .mwe-activity-nav {
        display: none !important;
    }

    #page-header #nav-main > .mwe-portal-nav > a,
    #page-header #nav-main > .mwe-forum-nav > a,
    #page-header #nav-main > .mwe-secondary-nav > a,
    #page-header #quick-links > .mwe-topics-details > summary {
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        max-height: 58px !important;
        margin: 0 !important;
        padding: 6px 2px 5px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        box-sizing: border-box !important;
        border-radius: 0 !important;
        line-height: 1 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    #page-header #quick-links > .mwe-topics-details {
        display: block !important;
        position: relative !important;
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        max-height: 58px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #page-header #nav-main > .mwe-portal-nav > a .icon,
    #page-header #nav-main > .mwe-forum-nav > a .icon,
    #page-header #nav-main > .mwe-secondary-nav > a .icon,
    #page-header #quick-links > .mwe-topics-details > summary .icon {
        display: block !important;
        width: 19px !important;
        height: 19px !important;
        line-height: 19px !important;
        margin: 0 auto !important;
        font-size: 18px !important;
        text-align: center !important;
        flex: 0 0 19px !important;
    }

    #page-header #nav-main > .mwe-primary-nav > a > span,
    #page-header #nav-main > .mwe-secondary-nav > a > .mwe-nav-label-mobile,
    #page-header #quick-links > .mwe-topics-details > summary > span {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 11px !important;
        font-weight: 650 !important;
        line-height: 13px !important;
        text-align: center !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    #page-header #nav-main > .mwe-secondary-nav > a > .mwe-nav-label-desktop {
        display: none !important;
    }

    /* Active state: same footprint, only a restrained visual cue. */
    body:has(#portal-body) #page-header #nav-main > .mwe-portal-nav > a,
    body.section-index:not(:has(#portal-body)) #page-header #nav-main > .mwe-forum-nav > a,
    body.section-viewforum #page-header #nav-main > .mwe-forum-nav > a,
    body.section-viewtopic #page-header #nav-main > .mwe-forum-nav > a,
    body.section-posting #page-header #nav-main > .mwe-forum-nav > a {
        background: rgba(255,255,255,.08) !important;
        box-shadow: inset 0 -2px 0 rgba(255,255,255,.78) !important;
    }

    /* Topics dropdown anchors to the right edge of the four-slot nav. */
    #page-header #quick-links .mwe-topics-panel {
        right: 4px !important;
        left: auto !important;
        top: calc(100% + 7px) !important;
        width: min(92vw, 330px) !important;
        max-width: calc(100vw - 16px) !important;
    }
}

/* v0.5.17: only one header flyout may be open at a time. */
@media (max-width: 700px) {
    .mwe-account-profile.dropdown-visible,
    .mwe-account-notifications.dropdown-visible,
    .mwe-topics-details[open] {
        z-index: 220 !important;
    }
}

/* v0.5.18: compact, centered post options button */
.post-buttons.mwe-post-actions .mwe-post-more > .button {
    width: 32px !important;
    min-width: 32px !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    border: 1px solid #dbe4ee !important;
    background: #ffffff !important;
    color: #376b9f !important;
    box-shadow: none !important;
    line-height: 1 !important;
}

.post-buttons.mwe-post-actions .mwe-post-more > .button .icon,
.post-buttons.mwe-post-actions .mwe-post-more > .button .fa-ellipsis-v {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    line-height: 1 !important;
    color: currentColor !important;
    transform: none !important;
}

.post-buttons.mwe-post-actions .mwe-post-more > .button:hover,
.post-buttons.mwe-post-actions .mwe-post-more > .button:focus,
.mwe-post-more.dropdown-visible > .button {
    background: #f4f8fc !important;
    border-color: #c8d8e8 !important;
    color: #175fa7 !important;
    box-shadow: none !important;
}

@media (max-width: 700px) {
    .post-buttons.mwe-post-actions .mwe-post-more > .button {
        width: 34px !important;
        min-width: 34px !important;
        height: 32px !important;
        min-height: 32px !important;
        border-radius: 8px !important;
    }
}

/* ========================================================================== 
   v0.5.19 - Portal mini-pagination stays on one line on phones
   ========================================================================== */
@media (max-width: 700px) {
    /* Board3 "Aktuelle Beiträge": keep clone icon, early pages, ellipsis and
       final page in one compact row instead of allowing the last page to wrap. */
    #portal-center .mwe-portal-feed .list-inner > .pagination,
    #portal-body .mwe-portal-feed .list-inner > .pagination {
        float: none !important;
        clear: both !important;
        display: inline-flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 4px !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 7px 0 1px !important;
        padding: 0 !important;
        white-space: nowrap !important;
        vertical-align: middle !important;
    }

    #portal-center .mwe-portal-feed .list-inner > .pagination > span,
    #portal-body .mwe-portal-feed .list-inner > .pagination > span {
        flex: 0 0 auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 1px 0 0 !important;
        line-height: 1 !important;
    }

    #portal-center .mwe-portal-feed .list-inner > .pagination > ul,
    #portal-body .mwe-portal-feed .list-inner > .pagination > ul {
        float: none !important;
        display: inline-flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 4px !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
    }

    #portal-center .mwe-portal-feed .pagination > ul > li,
    #portal-body .mwe-portal-feed .pagination > ul > li {
        float: none !important;
        flex: 0 0 auto !important;
        display: inline-flex !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #portal-center .mwe-portal-feed .pagination > ul > li > a,
    #portal-center .mwe-portal-feed .pagination > ul > li > span,
    #portal-body .mwe-portal-feed .pagination > ul > li > a,
    #portal-body .mwe-portal-feed .pagination > ul > li > span {
        min-width: 22px !important;
        width: auto !important;
        height: 24px !important;
        min-height: 24px !important;
        padding: 0 6px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 5px !important;
        box-sizing: border-box !important;
        font-size: 11px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    #portal-center .mwe-portal-feed .pagination > ul > li.ellipsis > span,
    #portal-body .mwe-portal-feed .pagination > ul > li.ellipsis > span {
        min-width: 22px !important;
        padding: 0 3px !important;
        border-color: transparent !important;
        background: transparent !important;
    }
}

/* ========================================================================== 
   v0.5.20 - stable logged-out mobile masthead
   Keep logo + Login/Register in one fixed header row, matching the signed-in
   geometry. Prevents auth actions from overlapping the blue navigation bar.
   ========================================================================== */
@media (max-width: 700px) {
    #page-header .headerbar > .inner.mwe-header-inner.mwe-header-guest {
        width: 100% !important;
        height: 76px !important;
        min-height: 76px !important;
        max-height: 76px !important;
        padding: 10px 12px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: 56px !important;
        column-gap: 8px !important;
        row-gap: 0 !important;
        align-items: center !important;
        box-sizing: border-box !important;
    }

    .mwe-header-guest #site-description {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 100% !important;
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        text-align: left !important;
        min-width: 0 !important;
    }

    .mwe-header-guest #site-description > a.logo.mwe-brand,
    .mwe-header-guest .site-description > a.logo.mwe-brand,
    .mwe-header-guest .mwe-brand {
        width: 150px !important;
        min-width: 0 !important;
        max-width: 150px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        margin: 0 !important;
        flex: 0 1 150px !important;
        background-position: left center !important;
        background-size: contain !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest {
        grid-column: 2 !important;
        grid-row: 1 !important;
        justify-self: end !important;
        align-self: center !important;
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        height: 40px !important;
        min-height: 40px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 5px !important;
        overflow: visible !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest .mwe-account-login,
    .mwe-header-guest .mwe-account-actions.mwe-account-guest .mwe-account-register {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        padding: 0 9px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        border-radius: 10px !important;
        box-sizing: border-box !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        overflow: visible !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest .mwe-account-login {
        border: 1px solid #d7e1ec !important;
        background: #fff !important;
        color: #17395f !important;
        box-shadow: none !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest .mwe-account-register {
        border-color: #146dcc !important;
        background: #146dcc !important;
        color: #fff !important;
        box-shadow: 0 5px 12px rgba(20, 109, 204, .14) !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest .mwe-account-login span,
    .mwe-header-guest .mwe-account-actions.mwe-account-guest .mwe-account-register span {
        display: inline !important;
        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
        white-space: nowrap !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest .icon {
        flex: 0 0 auto !important;
        width: 14px !important;
        margin: 0 !important;
        font-size: 13px !important;
    }
}

@media (max-width: 390px) {
    #page-header .headerbar > .inner.mwe-header-inner.mwe-header-guest {
        padding-left: 9px !important;
        padding-right: 9px !important;
        column-gap: 6px !important;
    }

    .mwe-header-guest #site-description > a.logo.mwe-brand,
    .mwe-header-guest .site-description > a.logo.mwe-brand,
    .mwe-header-guest .mwe-brand {
        width: 138px !important;
        max-width: 138px !important;
        flex-basis: 138px !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest {
        gap: 4px !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest .mwe-account-login,
    .mwe-header-guest .mwe-account-actions.mwe-account-guest .mwe-account-register {
        height: 36px !important;
        min-height: 36px !important;
        padding-left: 7px !important;
        padding-right: 7px !important;
        font-size: 10.5px !important;
    }

    .mwe-header-guest .mwe-account-actions.mwe-account-guest .icon {
        display: none !important;
    }
}


/* ========================================================================== 
   v0.5.21 registration agreement buttons
   ========================================================================== */
.mwe-agreement-actions .submit-buttons {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

.mwe-agreement-actions button.mwe-agree-primary,
.mwe-agreement-actions button.mwe-agree-secondary {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px;
    max-width: 100%;
    margin: 0 !important;
    padding: 9px 18px !important;
    border-radius: 7px;
    box-sizing: border-box;
    box-shadow: none !important;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    text-shadow: none !important;
    white-space: normal;
    cursor: pointer;
}

.mwe-agreement-actions button.mwe-agree-primary {
    border: 1px solid #0a67cc;
    background: #0a67cc;
    color: #fff;
}

.mwe-agreement-actions button.mwe-agree-primary:hover,
.mwe-agreement-actions button.mwe-agree-primary:focus {
    border-color: #0757b8;
    background: #0757b8;
    color: #fff;
}

.mwe-agreement-actions button.mwe-agree-secondary {
    border: 1px solid #d1dbe6;
    background: #fff;
    color: #64778d;
}

.mwe-agreement-actions button.mwe-agree-secondary:hover,
.mwe-agreement-actions button.mwe-agree-secondary:focus {
    border-color: #b9c6d3;
    background: #f6f8fa;
    color: #41566f;
}

@media (max-width: 700px) {
    .mwe-agreement-actions {
        padding: 12px !important;
    }

    .mwe-agreement-actions .submit-buttons {
        width: 100% !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }

    .mwe-agreement-actions button.mwe-agree-primary,
    .mwe-agreement-actions button.mwe-agree-secondary {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 48px !important;
        padding: 10px 14px !important;
        margin: 0 !important;
        font-size: 12px !important;
        line-height: 1.3 !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
    }

    .mwe-agreement-actions button.mwe-agree-primary span,
    .mwe-agreement-actions button.mwe-agree-secondary span {
        display: block;
        width: 100%;
        max-width: 100%;
        white-space: normal;
        text-align: center;
    }
}

@media (max-width: 390px) {
    .mwe-agreement-actions button.mwe-agree-primary,
    .mwe-agreement-actions button.mwe-agree-secondary {
        font-size: 11.5px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

/* ========================================================================== 
   v0.5.22 - slightly slimmer mobile primary navigation
   Keeps the four touch targets balanced while reducing vertical footprint.
   ========================================================================== */
@media (max-width: 700px) {
    #page-header .mwe-main-navbar,
    #page-header .mwe-main-navbar > .inner {
        min-height: 52px !important;
        height: 52px !important;
    }

    #page-header #nav-main {
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
        padding: 0 4px !important;
    }

    #page-header #nav-main > .mwe-portal-nav,
    #page-header #nav-main > .mwe-forum-nav,
    #page-header #nav-main > .mwe-secondary-nav,
    #page-header #nav-main > .mwe-topics-menu,
    #page-header #quick-links > .mwe-topics-details {
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
    }

    #page-header #nav-main > .mwe-portal-nav > a,
    #page-header #nav-main > .mwe-forum-nav > a,
    #page-header #nav-main > .mwe-secondary-nav > a,
    #page-header #quick-links > .mwe-topics-details > summary,
    #page-header #nav-main > li > a,
    #page-header #nav-main > li.mwe-topics-menu > summary {
        height: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
        padding: 4px 2px 3px !important;
        gap: 2px !important;
    }

    #page-header #nav-main > .mwe-portal-nav > a .icon,
    #page-header #nav-main > .mwe-forum-nav > a .icon,
    #page-header #nav-main > .mwe-secondary-nav > a .icon,
    #page-header #quick-links > .mwe-topics-details > summary .icon,
    #page-header #nav-main > li > a .icon,
    #page-header #nav-main > li.mwe-topics-menu > summary .icon {
        width: 17px !important;
        height: 17px !important;
        line-height: 17px !important;
        font-size: 16px !important;
        flex-basis: 17px !important;
    }

    #page-header #nav-main > .mwe-primary-nav > a > span,
    #page-header #nav-main > .mwe-secondary-nav > a > .mwe-nav-label-mobile,
    #page-header #quick-links > .mwe-topics-details > summary > span,
    #page-header #nav-main > .mwe-primary-nav > a span,
    #page-header #nav-main > .mwe-topics-menu > summary span {
        font-size: 10.5px !important;
        line-height: 11.5px !important;
    }
}