/* Shared application chrome. Business state colours and document printing stay local. */
:root { --em-ink:#203249; --em-muted:#718396; --em-line:#dfe9f2; --em-blue:#287db8; --em-bg:#eff7ff; }
body { margin:0; background:var(--em-bg); color:var(--em-ink); font-family:"Malgun Gothic","Apple SD Gothic Neo",system-ui,sans-serif; }
header.em-header { display:flex; align-items:center; flex-wrap:wrap; gap:16px 24px; min-height:86px; padding:18px 32px; background:#fff; border-bottom:1px solid var(--em-line); color:var(--em-ink); }
.em-header .brand { display:flex; align-items:center; flex-shrink:0; gap:8px; margin:0; }
.em-header a.em-logo { display:flex; align-items:center; flex-shrink:0; padding:0; border:0; border-radius:0; background:none; text-decoration:none; }
.em-header .em-logo img { display:block; width:148px; height:auto; max-width:none; }
.em-header .app-version { display:none; }
.em-breadcrumbs { flex:1 1 280px; min-width:0; }
.em-breadcrumbs ol { display:flex; align-items:center; flex-wrap:wrap; gap:5px 8px; list-style:none; padding:0; margin:0; }
.em-breadcrumbs li { display:flex; align-items:center; gap:8px; min-width:0; max-width:100%; }
.em-breadcrumbs li+li::before { content:'›'; color:#8ea5bb; font-size:18px; flex-shrink:0; }
.em-breadcrumbs a,.em-breadcrumbs button { display:block; max-width:100%; padding:5px 2px; border:0; border-radius:4px; background:transparent; color:#59738c; font:inherit; font-size:14px; line-height:1.5; text-decoration:none; text-align:left; overflow-wrap:anywhere; cursor:pointer; }
.em-breadcrumbs [aria-current="page"] { color:var(--em-ink); font-weight:700; }
.em-breadcrumbs a:hover,.em-breadcrumbs button:hover { color:var(--em-blue); text-decoration:underline; text-underline-offset:4px; background:#f1f7fc; }
.em-header a:focus-visible,.em-header button:focus-visible { outline:3px solid #83b8e6; outline-offset:3px; }
.em-header .top-right,.em-header .header-actions,.em-header .online-user31 { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-left:auto; }
.em-header button:not(.em-breadcrumbs button),.em-header .home-link,.em-header>.alba-button { padding:8px 12px; border:1px solid var(--em-line); border-radius:7px; background:#fff; color:var(--em-ink); font:inherit; font-size:13px; line-height:1.4; text-decoration:none; white-space:nowrap; }
.em-header .home-link { margin-left:0; }
.em-header #save-state { color:var(--em-muted); font-size:11px; }
.em-header .demo { display:none; }
.em-section-nav { flex:0 0 auto; display:flex; align-items:center; flex-wrap:wrap; gap:16px; padding:8px 32px; border-bottom:1px solid var(--em-line); background:#f8fbff; }
.em-section-nav .notice { padding:0; background:transparent; color:var(--em-muted); }
.em-section-nav .nav { display:flex; flex-wrap:wrap; gap:6px; }
.em-section-nav .nav button { color:#59738c; border-radius:6px; }
.em-section-nav .nav button.active { background:#e5f0fc; color:#24669b; }
body button.primary,body .alba-button.primary { background:#287db8; border-color:#287db8; color:#fff; }
body .card,body .alba-panel { border-color:var(--em-line); border-radius:12px; }
body input:not([type=checkbox]):not([type=radio]),body select,body textarea { border-color:var(--em-line); border-radius:7px; }
@media(max-width:1100px) {
 header.em-header { padding:16px 24px; gap:12px 20px; }
 .em-header .top-right { flex:1 1 100%; justify-content:flex-end; }
 .em-section-nav { padding-inline:24px; }
}
@media(max-width:650px) {
 header.em-header { padding:16px; gap:12px 16px; }
 .em-header .em-logo img { width:138px; }
 .em-breadcrumbs { flex-basis:100%; order:2; }
 .em-header .top-right,.em-header .header-actions { order:3; flex:1 1 100%; justify-content:flex-start; }
 .em-header .online-user31,.em-header .home-link,.em-header>.alba-button { margin-left:auto; }
 .em-breadcrumbs a,.em-breadcrumbs button { font-size:13px; }
 .em-section-nav { padding-inline:16px; gap:6px; }
}
@media print { header.em-header,.em-section-nav { display:none; } }

body.production-detail-page header.em-header { padding:18px 32px; }
@media(max-width:650px) { body.production-detail-page header.em-header { padding:16px; } }
/* One shared first row; all module-specific tools belong to the row below. */
header.em-header { gap:14px 20px; padding:16px; }
.em-breadcrumbs { flex:1 1 200px; }
.em-account-actions { display:flex; align-items:center; gap:8px; margin-left:auto; }
.em-global-search { display:flex; align-items:center; gap:5px; margin:0; }
.em-global-search input { width:210px; min-width:0; padding:9px 10px; border:1px solid var(--em-line); font:inherit; font-size:13px; }
.em-quick-memo { position:relative; display:grid; grid-template-columns:1fr auto; gap:2px 8px; flex:1 1 280px; max-width:460px; min-width:200px; }
.em-quick-memo label { grid-column:1; font-size:11px; color:var(--em-muted); }
.em-quick-memo textarea { grid-column:1; grid-row:2/4; width:100%; height:46px; resize:none; padding:7px 9px; border:1px solid var(--em-line); color:var(--em-ink); background:#fffef7; font:12px/1.4 "Malgun Gothic",sans-serif; }
.em-quick-memo .em-memo-expand { grid-column:2; grid-row:2; padding:5px 7px!important; font-size:11px!important; }
#em-memo-status { grid-column:1/-1; font-size:10px; color:var(--em-muted); overflow-wrap:anywhere; }
#em-memo-status[data-error=true] { color:#b34242; }
.em-section-nav { gap:10px; padding:9px 16px; }
.em-section-nav .top-right { order:2; display:flex; flex-wrap:wrap; gap:8px; margin-left:auto; }
.em-section-nav .header-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-left:0; }
.em-section-nav button,.em-section-nav .home-link { padding:8px 12px; background:white; border:1px solid var(--em-line); border-radius:7px; color:var(--em-ink); font:13px/1.4 "Malgun Gothic",sans-serif; text-decoration:none; }
.em-section-nav .home-link { margin-left:auto; }
.em-section-nav #save-state { font-size:11px; color:var(--em-muted); align-self:center; }
.em-section-nav .demo { display:none; }
.em-tools-dialog { width:min(820px,94vw); max-height:90dvh; padding:24px; border:1px solid var(--em-line); border-radius:16px; color:var(--em-ink); background:white; box-shadow:0 20px 80px #18344d44; }
.em-tools-dialog::backdrop { background:#20324966; }
.em-tools-dialog h2 { margin:0 0 16px; font-size:21px; }
.em-tools-dialog textarea { width:100%; box-sizing:border-box; resize:vertical; border:1px solid var(--em-line); padding:14px; font:15px/1.7 "Malgun Gothic",sans-serif; }
.em-tools-dialog button { padding:9px 14px; border:1px solid var(--em-line); border-radius:7px; background:#f4f9ff; color:var(--em-ink); cursor:pointer; }
.em-tools-dialog p { font-size:13px; overflow-wrap:anywhere; }
.em-tool-actions { display:flex; flex-wrap:wrap; gap:8px; }
.em-search-results { display:grid; gap:10px; margin-bottom:16px; }
.em-search-results a { display:flex; flex-direction:column; gap:6px; padding:14px; border:1px solid var(--em-line); border-radius:9px; color:var(--em-ink); text-decoration:none; overflow-wrap:anywhere; }
.em-search-results a:hover { background:#f1f7ff; border-color:#83b8e6; }
.em-search-results small { color:#527c9e; }.em-search-results span { font-size:13px; color:var(--em-muted); white-space:pre-wrap; }
.em-search-focus { outline:3px solid #f3c24b; outline-offset:-3px; }
body.production-detail-page header.em-header { padding:16px; }
@media(min-width:1101px){ .em-header .em-breadcrumbs { max-width:360px; } }
@media(max-width:1100px){ .em-quick-memo { max-width:none; flex:1 1 250px; } .em-account-actions { flex:0 1 auto; }.em-global-search input{width:180px;} }
@media(max-width:650px){
 header.em-header { padding:12px 16px; gap:10px; }
 .em-header .em-breadcrumbs { order:1; flex:1 1 100%; }
 .em-quick-memo { order:2; flex:1 1 100%; }
 .em-account-actions { order:3; width:100%; margin:0; }.em-global-search{flex:1;}.em-global-search input{width:100%;flex:1;}
 .em-section-nav .top-right { justify-content:flex-start; margin:0; }
 .em-tools-dialog { padding:16px; }.em-quick-memo textarea{font-size:16px;}
}

.em-dialog-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; position:sticky; top:-24px; background:white; padding:12px 0; z-index:1; }
.em-dialog-heading h2 { margin:0; }
@media(max-width:650px){.em-dialog-heading{top:-16px;}}

/* Compact hosting meters sit immediately before the shared search form. */
.em-header .em-server-usage { display:grid; gap:3px; flex:0 0 auto; width:230px; padding:5px 9px; border-color:transparent; text-align:left; cursor:pointer; background:#f8fbff; font-size:11px; line-height:1.35; }
.em-header .em-server-usage:hover { border-color:#b9d3e8; background:#f0f7ff; }
.em-usage-line { display:flex; justify-content:space-between; align-items:baseline; gap:8px; color:var(--em-muted); }
.em-usage-value { color:var(--em-ink); font-variant-numeric:tabular-nums; }
.em-usage-value[data-level=warning] { color:#996113; }.em-usage-value[data-level=danger] { color:#b53a32; }
.em-usage-dialog { width:min(540px,94vw); }
.em-usage-details { display:grid; gap:12px; }
.em-usage-detail { display:grid; gap:8px; padding:14px; border:1px solid var(--em-line); border-radius:10px; font-size:13px; }
.em-usage-detail h3 { margin:0; font-size:13px; color:#59738c; }.em-usage-detail strong { font-size:16px; }
.em-usage-detail small,.em-usage-note { color:var(--em-muted); line-height:1.7; }
.em-usage-detail progress { width:100%; height:7px; accent-color:#287db8; }.em-usage-detail progress[data-level=warning]{accent-color:#c18b21;}.em-usage-detail progress[data-level=danger]{accent-color:#bd453a;}
@media(max-width:900px){.em-account-actions{flex-wrap:wrap;}.em-header .em-server-usage{margin-right:6px;}}
@media(max-width:650px){.em-header .em-server-usage{width:100%;margin:0;}.em-account-actions .em-global-search{min-width:0;}.em-usage-dialog{box-sizing:border-box;}}