/* BuildingCap v347: retain original controls and permission-driven visibility.
   Two independent rows prevent modules from competing with identity and KPIs. */
#bcDirectory {width:min(760px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:22px;border:1px solid #cfd6e4;border-radius:10px;background:#fff;color:#18202e;overflow:auto;font:14px/1.5 system-ui;z-index:10001}
#bcDirectory::backdrop {background:rgb(10 12 16 / 65%)}
#bcDirectory * {box-sizing:border-box}#bcDirectory header {display:flex;gap:16px;justify-content:space-between;align-items:flex-start}
#bcDirectory h2 {font-size:21px;margin:3px 0 12px}#bcDirectory small {font-size:11px;color:#646e7c}
#bcDirectory button {font:inherit;padding:7px 12px;min-height:36px;border:1px solid #ccd2db;border-radius:6px;background:#fff;color:#18202e;cursor:pointer}
#bcDirectory button[type=submit] {background:#a34d2f;border-color:#a34d2f;color:#fff}
#bcDirectory .bd-intro,#bcDirectory .bd-note {color:#5b6577;font-size:13px}
#bcDirectory .bd-row {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid #e4e7ec}
#bcDirectory .bd-row div {min-width:0}#bcDirectory .bd-row b,#bcDirectory .bd-row span {display:block;overflow-wrap:anywhere}
#bcDirectory .bd-row span {font-size:12px;color:#646e7c}
#bcDirectory .bd-fields {display:grid;grid-template-columns:1fr 1fr;gap:12px}#bcDirectory .bd-full {grid-column:1/-1}
#bcDirectory label {font-size:12px;font-weight:600}#bcDirectory input,#bcDirectory select {display:block;width:100%;min-height:38px;margin-top:4px;padding:8px;border:1px solid #cfd6e4;border-radius:5px;background:#fff;color:#18202e;font:14px system-ui}
#bcDirectory #bdError:empty {display:none}#bcDirectory #bdError {color:#9b2334;padding:12px;background:#fff0f1}
@media(max-width:600px){#bcDirectory {padding:16px}#bcDirectory .bd-fields {grid-template-columns:1fr}}
body > .top {
 display:grid;grid-template-columns:32px minmax(120px,1fr) auto auto;
 grid-template-areas:"mark brand progress account" "modules modules modules metrics";
 align-items:center;gap:6px 12px;padding:8px 16px;
 padding-top:calc(8px + env(safe-area-inset-top,0px));flex-shrink:0;
}
.top > .logo {grid-area:mark;width:32px;height:32px}
.top > .ttl {grid-area:brand;min-width:0;overflow:hidden}
.top .bcwm {height:20px;max-width:160px}
.top .ttl small {font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top > .tabs {grid-area:modules;min-width:0;max-width:100%;margin:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;gap:4px;padding:2px 0}
.top .tabs .tab {flex:0 0 auto;white-space:nowrap;min-height:34px;padding:6px 10px;font-size:12px;border-radius:6px}
.top > .geral {grid-area:progress;font-size:12px;gap:6px}
.top .geral .bar {width:72px;height:6px}
.top > .kpi-row {grid-area:metrics;flex-wrap:nowrap;justify-content:flex-end;gap:4px}
.top .kpi {min-width:46px;padding:4px 6px;border-radius:5px}
.top .kpi b {font-size:12px}.top .kpi span {font-size:9px}
.top > .topact {grid-area:account;min-width:0;gap:6px;justify-content:flex-end}
.top #uname {display:block;max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top > .grow {display:none}
.top #topTog {grid-area:toggle}
.top .whomenu {max-height:calc(100dvh - 90px);overflow-y:auto}
.top button:focus-visible,.top [role="button"]:focus-visible {outline:2px solid #e5b869;outline-offset:2px}
@media(max-width:1100px){
 body > .top {grid-template-columns:32px minmax(100px,1fr) auto;grid-template-areas:"mark brand account" "modules modules modules";gap:5px 10px}
 .top > .geral,.top > .kpi-row {display:none}
 .top #uname {max-width:190px}
}
@media(max-width:600px){
 body > .top {grid-template-columns:26px minmax(0,1fr) auto;grid-template-areas:"mark brand account" "toggle toggle toggle" "modules modules modules";padding:6px 10px;padding-top:calc(6px + env(safe-area-inset-top,0px));gap:4px 6px}
 .top > .logo,body.topmin .top > .logo {width:26px;height:26px}
 .top .bcwm,body.topmin .top .bcwm {height:17px;max-width:126px}
 .top .ttl small {max-width:100%;font-size:10px}
 .top #uname {display:none}
 .top .who {padding:3px}.top .who .car {display:none}
 .top .bell {min-width:32px;min-height:36px;padding:4px}
 .top .tabs .tab {min-height:40px;font-size:12px;padding:6px 10px}
 .top #topTog {display:block;width:100%;min-height:30px;margin:0;text-align:left;padding:4px 6px;font-size:12px}
 .top .whomenu {position:fixed;top:58px;right:8px;left:auto;min-width:0;width:min(300px,calc(100vw - 16px));max-height:calc(100dvh - 74px)}
 body.topmin > .top {padding:6px 10px;gap:4px 6px}
}
