
/* COE mobile-first UI refinements: all member data remains server-controlled */
:root{--coe-navy:#162d44;--coe-gold:#c58a2b;--coe-ink:#18334a;--coe-muted:#6e7e8e}
html{scroll-behavior:smooth}body{background:#f7f7f5!important;color:var(--coe-ink)}
header{background:#fff!important;color:var(--coe-navy)!important;border-bottom:1px solid #eae5dc!important;box-shadow:0 3px 20px #142c4410;position:sticky;top:0;z-index:25}
header .brand strong{letter-spacing:.015em!important;font-weight:850}header .brand small{color:#72808e!important}
#session-identity{font-weight:750;color:#213a51}#session-tools button{border:1px solid #eee4d3!important;color:#875e20!important;background:#fffaf2!important;border-radius:11px!important}
#session-tools button:hover{background:#fff0d4!important}
.app.logged-in #main-content{max-width:1160px;margin:0 auto;padding:0 26px 26px}
.app.logged-in #coe-home{padding:25px 0 60px;max-width:1050px;margin:auto}
.coe-home-banner{min-height:290px;background:linear-gradient(90deg,#081c30d9 0%,#1028409c 40%,#10284012 100%),url('/assets/coe-city.svg') center 54%/cover no-repeat!important;box-shadow:0 16px 36px #142c4428;isolation:isolate}
.coe-home-banner:before,.coe-home-banner:after{pointer-events:none}
.coe-home-banner h1{font-weight:900}.coe-home-banner blockquote{background:#0e1b29d9!important}
.coe-kpis{gap:15px!important}.coe-kpi{border:1px solid #e8e4dd!important;box-shadow:0 9px 22px #142c440b!important}
.coe-kpi .coe-kpi-name{font-weight:650}.coe-kpi strong{font-variant-numeric:tabular-nums}
.coe-kpi .coe-kpi-top{align-items:center}.coe-kpi p{margin-top:12px}
.coe-module-grid{gap:16px!important}.coe-module{border:1px solid #e9e3d9!important;box-shadow:0 8px 23px #142c440d!important}
.coe-module-art{height:105px!important;background-image:linear-gradient(105deg,#10243be6,#182f4980),url('/assets/coe-city.svg')!important;background-size:cover!important;background-position:center!important}
.coe-module:nth-child(2) .coe-module-art{background-position:50% 30%!important}
.coe-module:nth-child(3) .coe-module-art{background-position:80% 55%!important}
.coe-module:nth-child(4) .coe-module-art{background-position:25% 45%!important}
.coe-module:nth-child(5) .coe-module-art{background-position:70% 70%!important}
.coe-module:nth-child(6) .coe-module-art{background-position:40% 30%!important}
.coe-module-art:after{background:linear-gradient(95deg,#142a43a8,#a9732d1c)!important}
.coe-module-copy strong{font-size:17px}.coe-module-copy small{line-height:1.45}
.coe-alerts{border:1px solid #e9e3d9!important;box-shadow:0 7px 20px #142c4409}
.coe-bottom-nav{border:1px solid #ece6db;border-bottom:0;border-radius:18px 18px 0 0;box-shadow:0 -8px 28px #142c4410;max-width:1100px!important}
.app.logged-in #members-panel{max-width:1050px!important;margin:0 auto 70px!important;background:transparent!important;border:0!important;padding:25px 0!important;box-shadow:none!important}
#members-panel .members-head h2{font-size:clamp(26px,4vw,36px)!important;letter-spacing:-.035em;margin:0}
#members-panel .members-head{gap:14px;align-items:center}
#members-panel .members-summary{margin:17px 0!important;gap:12px}
#members-panel .members-stat{border:1px solid #e9e3d9!important;border-radius:17px!important;box-shadow:0 8px 20px #142c4409!important}
#members-panel .members-stat strong{font-size:31px!important;font-variant-numeric:tabular-nums}
#members-panel .members-meta{color:#7a8793}
#members-panel .members-scroll{background:#fff;border:1px solid #e9e4dc;border-radius:16px;overflow-x:auto}
#members-panel .members-table{width:100%;border-collapse:collapse}
#members-panel .members-table th{background:#fbf8f2;color:#536a7b;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.025em}
#members-panel .members-table th,#members-panel .members-table td{padding:14px 16px!important;border-bottom:1px solid #f1ece6}
#members-panel .members-table tbody tr:hover{background:#fffbf4}
#members-panel .members-table tbody tr:focus-visible{outline:3px solid #d49a35;outline-offset:-3px}
.app.logged-in[data-coe-view="power"] #members-panel>.members-head,.app.logged-in[data-coe-view="power"] #members-panel>#members-feedback,.app.logged-in[data-coe-view="power"] #members-panel>.members-summary,.app.logged-in[data-coe-view="power"] #member-nav,.app.logged-in[data-coe-view="power"] #members-panel>.members-tools{display:none!important}
.app.logged-in[data-coe-view="members"] #member-nav{display:none!important}
#coe-view-placeholder{background:transparent!important;border:0!important;padding:25px 0!important;margin:0 auto 70px!important}
.coe-screen-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.coe-screen-toolbar h2{font-size:clamp(26px,4vw,36px);margin:0;letter-spacing:-.035em}
.coe-screen-toolbar p{font-size:13px;color:#758494;margin:5px 0 0}
.coe-screen-toolbar .coe-small-pill{background:#fff9eb;color:#8b611f;border:1px solid #f1dfbf;padding:9px 12px;border-radius:99px;font-size:12px;font-weight:750}
.coe-link-button{background:#fff7e9!important;border:1px solid #e6d3b0!important;color:#8e5d17!important;border-radius:11px!important;font-weight:750;cursor:pointer}
.coe-detail-dialog{border:1px solid #e9e1d6;border-radius:20px;padding:0;width:min(500px,calc(100vw - 24px));max-height:85vh;box-shadow:0 18px 65px #0e22394a;background:#fff}
.coe-detail-dialog::backdrop{background:#0d2234a6}
.coe-detail-inner{padding:26px}.coe-detail-inner h2{font-size:26px;margin:0 0 5px}.coe-detail-inner p{color:#667b8b;line-height:1.5}.coe-detail-inner dl{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}.coe-detail-inner dt{color:#73818d;font-size:12px}.coe-detail-inner dd{margin:4px 0 0;font-size:16px;font-weight:750;overflow-wrap:anywhere}.coe-detail-inner .coe-detail-foot{border-top:1px solid #eee6dc;padding-top:14px;font-size:12px;color:#768393}
.coe-detail-inner button{border:1px solid #dfcaa9;border-radius:10px;background:#fff7ea;color:#8b5d1e;padding:10px 16px;cursor:pointer;font:inherit;font-weight:750}
#members-body tr{cursor:pointer}
#members-panel .members-stat span{font-size:12px}
@media(max-width:760px){
header{padding:10px 14px!important;gap:7px!important;flex-wrap:wrap;height:auto!important;min-height:76px}
header .brand{min-width:120px}header .brand strong{font-size:clamp(17px,4.5vw,24px)!important}
header img{width:44px!important;height:44px!important}
#session-tools{margin-left:auto;gap:5px!important;flex-wrap:wrap;justify-content:flex-end}
#session-tools button{padding:7px!important;font-size:10px!important}
.coe-language-picker select{max-width:100px!important}
.app.logged-in #main-content{padding:0 14px 18px}
.app.logged-in #coe-home{padding:16px 0 50px}
.coe-home-banner{min-height:235px!important;padding:23px!important}
.coe-home-banner blockquote{display:none!important}
.coe-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px!important}
.coe-kpi{min-height:125px!important;padding:14px!important}
.coe-module-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px!important}
.coe-module-art{height:86px!important}
.coe-module-body{padding:10px!important}.coe-module-copy strong{font-size:13px!important}
.coe-module-copy small{font-size:10px!important}
.coe-module-icon{display:none!important}
.coe-module-arrow{flex:0 0 25px}
#members-panel .members-summary{gap:7px}
#members-panel .members-stat{padding:12px 8px}
#members-panel .members-stat strong{font-size:24px!important}
#members-panel .members-table th,#members-panel .members-table td{padding:11px 10px!important;font-size:12px}
.coe-bottom-nav{padding:8px 3px max(10px,env(safe-area-inset-bottom))!important}
.coe-bottom-nav button{font-size:11px!important}
}
@media(max-width:390px){.coe-module-grid{grid-template-columns:1fr!important}}
