/* C02 shared components; page-specific layout and functional visibility remain local. */
html[data-em-theme] { --navy:var(--em-primary); --pink:var(--em-accent); --bg:var(--em-background); --line:var(--em-border); color-scheme:light; }
html[data-em-theme] body { margin:0; padding:0; font-family:Arial,Helvetica,sans-serif; background:var(--em-background); color:var(--em-text); }
html[data-em-theme] .em-brand { background:var(--em-primary); color:#fff; padding:18px 22px; border:0; margin:0; }
html[data-em-theme] .em-brand-inner { display:flex; align-items:center; gap:18px; max-width:1120px; margin:auto; min-width:0; }
html[data-em-theme] .em-brand-logo { width:68px; height:68px; object-fit:contain; flex:none; }
html[data-em-theme] .em-brand-copy { min-width:0; }
html[data-em-theme] .em-brand-title { font-size:clamp(22px,3vw,29px); font-weight:800; line-height:1.2; letter-spacing:-.02em; overflow-wrap:anywhere; }
html[data-em-theme] .em-brand-title span { color:var(--em-accent); }
html[data-em-theme] .em-brand-claim { margin-top:6px; color:#fff; font-size:14px; font-weight:400; line-height:1.4; }
html[data-em-theme] body > header:not(.em-brand),html[data-em-theme] .mask-head,html[data-em-theme] body > .top:not(.test) { background:var(--em-primary); color:#fff; }
html[data-em-theme] header h1,html[data-em-theme] header p,html[data-em-theme] .mask-head h1,html[data-em-theme] .top h1 { color:inherit; }
html[data-em-theme] header a,html[data-em-theme] .top a { color:inherit; }
html[data-em-theme] .test,html[data-em-theme] .testbanner { background:#fff3cd; color:#6d4c00; }
html[data-em-theme] body.gnwm-login > .top { background:#fff3cd; color:#6d4c00; }
html[data-em-theme] :is(.box,.card,.tile,.panel,.context,dialog) { background:var(--em-surface); border-color:var(--em-border); border-radius:14px; color:var(--em-text); }
html[data-em-theme] .box { box-sizing:border-box; max-width:calc(100% - 28px); }
html[data-em-theme] :is(.card,.tile,.panel,.context,main,.wrap) { min-width:0; }
html[data-em-theme] :is(.box,.card,.tile) h1,html[data-em-theme] .tile h2,html[data-em-theme] .section { color:var(--em-primary-dark); }
html[data-em-theme] :is(.hint,.muted,.tile p) { color:var(--em-muted); }
html[data-em-theme] :is(a,button,input,select,textarea):focus-visible { outline:3px solid var(--em-primary); outline-offset:3px; }
html[data-em-theme] header :is(a,button):focus-visible { outline-color:var(--em-accent); }
html[data-em-theme] :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea) { border-color:var(--em-border); border-radius:8px; font:inherit; box-sizing:border-box; max-width:100%; }
html[data-em-theme] input[type=checkbox],html[data-em-theme] input[type=radio] { accent-color:var(--em-primary); }
html[data-em-theme] :is(button,.btn,input[type=submit]):where(:not(.danger):not(.red):not(.bad):not(.ok):not(.warn):not(.warning):not(.secondary):not(.mutedbtn):not(.club-option):not(.tab)) { background:var(--em-primary); color:#fff; border-radius:8px; }
html[data-em-theme] a { color:var(--em-primary); }
html[data-em-theme] .tabs a { background:var(--em-soft); color:var(--em-primary-dark); }
html[data-em-theme] .tabs a.active { background:var(--em-primary); color:#fff; }
html[data-em-theme] .top a,html[data-em-theme] .mask-head a,html[data-em-theme] body > header a { color:inherit; }
html[data-em-theme] :is(button,.btn):not(:disabled):hover { filter:brightness(.94); }
html[data-em-theme] :is(.btn.new,.btn.primary,.btn.pink,button.primary,button.pink) { background:var(--em-accent); color:var(--em-accent-text); }
html[data-em-theme] :is(.btn,button):disabled { cursor:not-allowed; opacity:.55; }
html[data-em-theme] :is(.danger,.btn.danger,button.danger) { background:#b42318; color:#fff; }
html[data-em-theme] :is(.secondary,.mutedbtn) { background:var(--em-muted); color:#fff; }
html[data-em-theme] :is(.info,.fixed,.who,.module-chip,.mailbtn) { background:var(--em-soft); color:var(--em-primary-dark); border-color:var(--em-border); }
html[data-em-theme] :is(.notice,.ok) { border-radius:8px; }
html[data-em-theme] :is(.error,.bad,.warning,.warn,.pending,.mail-warning,.live-warning) { border-radius:8px; }
html[data-em-theme] :is(th,td) { border-color:var(--em-border); }
html[data-em-theme] th { background:var(--em-soft); color:var(--em-text); }
html[data-em-theme] .em-table-scroll { overflow-x:auto; max-width:100%; -webkit-overflow-scrolling:touch; }
html[data-em-theme] .em-table-scroll:focus-visible { outline:3px solid var(--em-primary); outline-offset:2px; }
html[data-em-theme] .em-table-scroll table { margin-bottom:0; }
html[data-em-theme] :is(.tabs,.nav,.actions,.top-actions,.std-top-actions) { flex-wrap:wrap; }
html[data-em-theme] .links a { color:var(--em-primary); }
html[data-em-theme] .gnwm-cockpit-heading h1 { color:inherit; }
html[data-em-theme] .gnwm-page .box { margin-top:36px; margin-bottom:36px; }
@media(max-width:720px) {
  html[data-em-theme] .em-brand { padding:14px 16px; }
  html[data-em-theme] .em-brand-inner { gap:12px; }
  html[data-em-theme] .em-brand-logo { width:52px; height:52px; }
  html[data-em-theme] .em-brand-title { font-size:20px; }
  html[data-em-theme] .em-brand-claim { font-size:12px; }
  html[data-em-theme] :is(.top-row,.toprow,.topin,.std-top-row,.mask-head-inner) { flex-wrap:wrap; gap:12px; }
  html[data-em-theme] :is(.two,.context-row,.tiles) { grid-template-columns:minmax(0,1fr); }
  html[data-em-theme] :is(.wrap,main,.box) { box-sizing:border-box; max-width:100%; }
  html[data-em-theme] .box { margin:24px 14px; max-width:calc(100% - 28px); padding:22px; }
  html[data-em-theme] :is(.btn,button) { max-width:100%; white-space:normal; overflow-wrap:anywhere; }
  html[data-em-theme] :is(label,.field,.bar > *) { min-width:0; max-width:100%; }
  html[data-em-theme] input[type=file] { width:100%; min-width:0; }
  html[data-em-theme] #liveSearch { min-width:0 !important; width:100%; }
  html[data-em-theme] :is(h1,h2,.top-actions,.std-top-actions) { overflow-wrap:anywhere; }
}
@media print {
  html[data-em-theme] body { background:#fff; color:#000; }
  html[data-em-theme] .em-brand { background:#fff; color:#000; padding:8px 0; }
  html[data-em-theme] .em-brand-title span,html[data-em-theme] .em-brand-claim { color:#000; }
  html[data-em-theme] .em-brand-logo { width:36px; height:36px; }
  html[data-em-theme] .em-table-scroll { overflow:visible; }
}

/* UX-01: installation-independent geometry shared by every administrative view. */
html[data-em-theme] { --em-content-width:1120px; --em-gutter:18px; --em-space:24px; }
html[data-em-theme] *,html[data-em-theme] *::before,html[data-em-theme] *::after { box-sizing:border-box; }
html[data-em-theme] body { font-size:16px; line-height:1.5; overflow-wrap:anywhere; }
html[data-em-theme] .em-brand { display:block; width:100%; max-width:none; height:auto; padding:18px var(--em-gutter); text-align:left; }
html[data-em-theme] .em-brand-inner { width:100%; max-width:calc(var(--em-content-width) - 2 * var(--em-gutter)); min-height:68px; margin:0 auto; padding:0; }
html[data-em-theme] .em-brand-logo { display:block; margin:0; padding:0; border:0; max-width:none; }
html[data-em-theme] .em-brand-copy { flex:1; }
html[data-em-theme] .em-content { width:100%; max-width:var(--em-content-width); margin:0 auto; padding:var(--em-space) var(--em-gutter); }
html[data-em-theme] .em-content > .wrap { width:100%; max-width:none; margin:0; padding:0; }
html[data-em-theme] body.em-embedded > .em-brand { display:none; }
html[data-em-theme] .box { width:calc(100% - 28px); max-width:calc(var(--em-content-width) - 2 * var(--em-gutter)); margin:24px auto; }
html[data-em-theme] body.gnwm-page .box { max-width:520px; margin:36px auto; }
html[data-em-theme] :is(body > main:not(.box),body > .wrap,body > .container,body > .page,body > .content) { width:100%; max-width:var(--em-content-width); margin:0 auto; padding:var(--em-space) var(--em-gutter); }
html[data-em-theme] :is(.wrap,.topin,.toprow,.std-top-row,.mask-head-inner) { max-width:var(--em-content-width); margin-inline:auto; }
html[data-em-theme] body > header:not(.em-brand) { margin:0; padding:18px 0; }
html[data-em-theme] body > header:not(.em-brand) > :is(.wrap,.topin,.toprow,.std-top-row,.mask-head-inner) { width:100%; padding:0 var(--em-gutter); }
html[data-em-theme] body > header:not(.em-brand):not(:has(> .wrap,> .topin,> .toprow,> .std-top-row,> .mask-head-inner)) { padding-inline:max(var(--em-gutter),calc((100% - var(--em-content-width)) / 2 + var(--em-gutter))); }
html[data-em-theme] :is(header:not(.em-brand),main,.wrap,.box) h1 { font-size:28px; line-height:1.25; margin:0 0 12px; }
html[data-em-theme] h2 { font-size:22px; line-height:1.3; }
html[data-em-theme] :is(.test,.testbanner) { padding:8px var(--em-gutter); text-align:center; line-height:1.4; }
html[data-em-theme] :is(.panel,.card,.context,dialog) { padding:20px; }
html[data-em-theme] :is(button,.btn,input[type=submit]) { font:inherit; font-weight:700; padding:10px 14px; line-height:1.4; min-height:44px; text-align:center; vertical-align:middle; }
html[data-em-theme] :is(.bar,.toolbar,.actions,.top-actions,.top-row,.topin,.toprow) { gap:12px; flex-wrap:wrap; }
html[data-em-theme] :is(.bar,.toolbar,.actions,.grid,.two,.context-row,.top-row,.topin,.toprow) > * { min-width:0; }
html[data-em-theme] :is(.em-table-scroll,.tablewrap,.table-wrap,.table-scroll) { max-width:100%; min-width:0; overflow-x:auto; }
html[data-em-theme] :is(th,td) { padding:10px 12px; vertical-align:top; }
html[data-em-theme] table.em-table-grid { min-width:var(--em-table-min-width,560px); }
html[data-em-theme] table.em-table-grid th { min-width:96px; overflow-wrap:normal; word-break:normal; }
html[data-em-theme] :is(pre,code) { white-space:pre-wrap; overflow-wrap:anywhere; }
html[data-em-theme] :is(dialog,.modal,.modalbox,.modal-box,.modal-content) { max-width:calc(100vw - 28px); max-height:calc(100dvh - 28px); overflow:auto; }
html[data-em-theme] :is(img,svg,video) { max-width:100%; }
html[data-em-theme] input:not([type=checkbox]):not([type=radio]):not([type=hidden]),html[data-em-theme] select,html[data-em-theme] textarea { min-width:0; }
@media(max-width:720px) {
 html[data-em-theme] { --em-gutter:14px; --em-space:18px; }
 html[data-em-theme] .em-brand { padding:14px var(--em-gutter); }
 html[data-em-theme] .em-brand-inner { min-height:52px; gap:12px; }
 html[data-em-theme] .em-brand-logo { width:52px; height:52px; }
 html[data-em-theme] :is(header:not(.em-brand),main,.wrap,.box) h1 { font-size:24px; }
 html[data-em-theme] :is(.grid,.two,.context-row) { grid-template-columns:minmax(0,1fr); }
 html[data-em-theme] :is(.panel,.card,.context,dialog) { padding:16px; }
 html[data-em-theme] :is(.top-actions,.std-top-actions) { margin-left:0; }
 html[data-em-theme] input:not([type=checkbox]):not([type=radio]):not([type=hidden]),html[data-em-theme] select,html[data-em-theme] textarea { min-width:0 !important; max-width:100%; }
}
@media print {
 html[data-em-theme] .em-brand { padding:8px 0; }
 html[data-em-theme] .em-brand-inner { min-height:36px; }
 html[data-em-theme] :is(.em-table-scroll,.tablewrap,.table-wrap,.table-scroll) { overflow:visible; }
}

html[data-em-theme] .test:empty { display:none; }

/* UX-01 layout families: shared geometry, independent of customer configuration. */
html[data-em-theme][data-em-layout="wide"] { --em-content-width:1636px; }
html[data-em-theme][data-em-layout="cockpit"] { --em-content-width:1200px; }
html[data-em-theme][data-em-layout="form"] { --em-content-width:1040px; }
html[data-em-theme][data-em-layout="account"] { --em-content-width:1040px; }
html[data-em-theme] .em-brand { padding:12px var(--em-gutter); }
html[data-em-theme] .em-brand-inner { min-height:52px; gap:14px; flex-wrap:wrap; }
html[data-em-theme] .em-brand-logo { width:52px; height:52px; }
html[data-em-theme] .em-brand-copy { flex:1 1 300px; }
html[data-em-theme] .em-brand-title { font-size:22px; }
html[data-em-theme] .em-brand-claim { margin-top:3px; font-size:12px; }
html[data-em-theme] .em-brand-meta { display:flex; flex:0 1 auto; flex-direction:column; align-items:flex-end; gap:3px; font-size:12px; line-height:1.4; }
html[data-em-theme] .em-test-badge { display:inline-block; background:#fff3cd; color:#594000; border:1px solid #eedb9c; border-radius:6px; padding:4px 8px; font-weight:700; }
html[data-em-theme] .em-header-link { color:#fff; text-decoration:underline; }
html[data-em-theme] .em-header-account { font-size:12px; }
html[data-em-theme] .em-legacy-test[hidden] { display:none !important; }
html[data-em-theme] body > header:not(.em-brand) { padding-block:12px; }
html[data-em-theme] header:not(.em-brand) h1 { margin-bottom:6px; font-size:26px; }
html[data-em-theme] header:not(.em-brand) p { margin-block:4px; }
/* The editable worksheet owns its column widths, cell padding and drag handles. */
html[data-em-theme] .sheet :is(th,td) { padding:0; }
html[data-em-theme] .sheet th { min-width:0; }
html[data-em-theme] .sheetwrap { min-width:0; max-width:100%; }
html[data-em-theme] .sheet .resizer { touch-action:none; }
@media(max-width:900px) {
 html[data-em-theme] .em-brand-meta { flex-direction:row; align-items:center; flex-wrap:wrap; flex-basis:100%; gap:6px 12px; }
}
@media(max-width:720px) {
 html[data-em-theme] .em-brand { padding-block:10px; }
 html[data-em-theme] .em-brand-inner { gap:8px 10px; }
 html[data-em-theme] .em-brand-logo { width:40px; height:40px; }
 html[data-em-theme] .em-brand-copy { flex:1 1 240px; }
 html[data-em-theme] .em-brand-title { font-size:18px; }
 html[data-em-theme] .em-brand-meta { font-size:11px; }
 html[data-em-theme] .em-test-badge { padding:3px 6px; }
}

html[data-em-theme] .em-context-note { max-width:var(--em-content-width); margin:12px auto; padding:8px var(--em-gutter); color:var(--em-text); background:var(--em-soft); }

/* Keep search usable when toolbar actions wrap, and retain semantic warning emphasis. */
@media(max-width:800px) {
 html[data-em-theme] .toolbar > .search { flex:1 1 100%; width:100%; }
 html[data-em-theme] .toolbar > .search input { flex:1 1 auto; width:100%; }
}
html[data-em-theme][data-em-layout="wide"] .hu-grid { max-width:100% !important; }
html[data-em-theme] .tabs a.attention { background:#c51d25; color:#fff; }

/* UX-01 correction: one outer frame; responsive composition inside it. */
html[data-em-theme][data-em-layout] { --em-content-width:1636px; }
html[data-em-theme] body { overflow-wrap:normal; word-break:normal; }
html[data-em-theme] :is(button,.btn,.tab,.tabs a,.nav a) { overflow-wrap:normal; word-break:normal; min-width:min-content; max-width:100%; }
html[data-em-theme] :is(.cards > .card) { grid-template-columns:minmax(0,1fr); }
html[data-em-theme] .cards > .card > div { min-width:0; }
html[data-em-theme] .cards > .card > .actions { justify-content:flex-start; align-items:center; gap:8px; }
html[data-em-theme] .cards > .card > .actions > * { flex:0 0 auto; max-width:100%; }
html[data-em-theme] .cards > .card .badge { white-space:nowrap; }
html[data-em-theme] .cards > .card b { hyphens:auto; overflow-wrap:break-word; }
html[data-em-theme] .grid:has(> .panel > .cards) { grid-template-columns:minmax(300px,420px) minmax(0,1fr); align-items:start; }
@media(max-width:1199px) {
 html[data-em-theme] .grid:has(> .panel > .cards) { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:1024px) {
 html[data-em-theme] :is(.grid,.two,.context-row) { grid-template-columns:minmax(0,1fr); }
}

/* Mail log: technical payloads scroll locally; metadata gets usable columns. */
html[data-em-theme] .card:has(> details > .body) .meta { grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); }
html[data-em-theme] .card:has(> details > .body) .meta > * { min-width:0; overflow-wrap:break-word; }
html[data-em-theme] .card > details > .body { max-width:100%; overflow-x:auto; }