:root{--brand-base:#124c3f;--brand-dark:#103c32;--brand-on:#fff;--brand-muted-on:#fff;--brand-tint:#edf3e6}
.sidebar,.login-story{background:var(--brand-dark)}
.metric.primary{background:var(--brand-base);border-color:var(--brand-base);color:var(--brand-on)}
.metric.primary .label,.metric.primary small{color:var(--brand-muted-on)}
.btn{background:var(--brand-base);color:var(--brand-on)}
.btn:hover{background:var(--brand-dark);color:#fff}
.btn.secondary{background:var(--brand-tint);color:var(--brand-dark)}
.btn.danger{background:#9b4035;color:#fff}
.nav button.active,.mobile-nav button.active{background:var(--brand-tint);color:var(--brand-dark)}
.sidebar .mark{color:#fff;border-color:#ffffff60}
.sidebar-bottom strong{color:#fff}
.brand .brand-name{min-width:0;font-size:17px;font-weight:700;line-height:1.3;letter-spacing:.2px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.institution-logo{width:44px;height:44px;object-fit:contain;background:#fff;border-radius:10px;padding:3px;flex-shrink:0}
.mark{flex-shrink:0}
.institution-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px}
.institution-card{margin-bottom:0}
.institution-card-brand{background:var(--brand-dark);color:white;border-radius:10px;padding:18px;margin-bottom:18px;min-height:84px;display:flex;align-items:center}
.institution-summary{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.institution-summary>.brand{background:var(--brand-dark);color:white;padding:20px;border-radius:12px;max-width:100%}
.institution-summary>div>p{margin-bottom:0}
.institution-preview{display:grid;justify-items:center;gap:12px;padding:24px;border-radius:12px;margin:24px 0}
.institution-preview>strong{text-align:center;overflow-wrap:anywhere;max-width:100%;font-size:20px}
.institution-preview>small{color:inherit;opacity:.85}
.institution-preview img{width:72px;height:72px;object-fit:contain;border-radius:12px;background:#fff;padding:4px}
.institution-preview #institution-preview-logo>span{display:grid;place-items:center;width:60px;height:60px;border:1px solid currentColor;border-radius:12px;font-size:28px}
#institution-color{padding:4px;height:46px;cursor:pointer}
#institution-logo{font-size:12px;padding:10px;line-height:1.5}
#institution-form>small{display:block;font-size:11px;line-height:1.6;margin-top:8px}
@media(max-width:760px){
 body[data-role=student] .sidebar .brand .brand-name{font-size:16px}
 body[data-role=student] .institution-logo{width:34px;height:34px;border-radius:8px}
 body[data-role=student] .action .symbol{background:var(--brand-tint);color:var(--brand-dark)}
 .institution-card .row>.btn{flex:1}
}

.sidebar{overflow-y:auto}.institution-card .mark{color:inherit;border-color:currentColor}
.arrow-icon{display:inline-block;width:1em;height:1em;vertical-align:-.12em;flex-shrink:0}
.mark .arrow-icon,.symbol .arrow-icon{width:1em;height:1em}
#institution-logo{width:100%;min-width:0;max-width:100%;font-size:14px}
#institution-logo::file-selector-button{padding:10px 12px;margin-right:10px;border:1px solid var(--line);border-radius:8px;background:var(--brand-tint);color:var(--brand-dark);font:inherit;cursor:pointer}
#institution-logo-status{color:var(--brand-dark);font-weight:600}
