/* GIM_Z77AW_TENANT_PWA_INSTALL_LAYER */
:root{--navy:#071426;--gold:#d8a31a;--orange:#f97316;--ink:#101827;--muted:#667085;--card:#ffffff;--line:#e7eaf0}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(160deg,#071426 0%,#101827 42%,#f6f4ef 42%,#fff 100%);color:var(--ink);min-height:100vh;padding-bottom:84px}
.tenant-app-shell{max-width:1060px;margin:0 auto;padding:18px}
.tenant-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}
.tenant-brand{display:flex;align-items:center;gap:12px;color:white;text-decoration:none}
.tenant-brand img{width:46px;height:46px;border-radius:14px;background:white;object-fit:cover}
.tenant-brand strong{display:block;font-size:18px}
.tenant-brand small{display:block;color:#d9e2f3;font-weight:700;max-width:60vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.install-btn{border:0;border-radius:999px;background:var(--gold);color:#071426;font-weight:1000;padding:12px 16px;box-shadow:0 14px 40px rgba(0,0,0,.22)}
.tenant-hero{background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.7);border-radius:28px;padding:26px;box-shadow:0 24px 80px rgba(0,0,0,.25);margin-bottom:16px}
.kicker{display:inline-flex;border-radius:999px;background:#fff3cf;color:#7a4d00;font-weight:1000;padding:8px 12px;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
h1{font-size:clamp(30px,6vw,58px);line-height:.98;margin:16px 0 12px;color:#071426}
.tenant-hero p{font-size:17px;color:#475467;line-height:1.55;margin:0}
.status-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.status-row span{border-radius:999px;background:#eef4ff;color:#102a56;font-weight:900;padding:9px 12px;font-size:13px}
.role-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.role-card{display:flex;min-height:170px;flex-direction:column;justify-content:space-between;text-decoration:none;background:var(--card);border:1px solid var(--line);border-radius:24px;padding:18px;color:#101827;box-shadow:0 18px 50px rgba(16,24,40,.1)}
.role-card span{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:1000;color:#667085}
.role-card strong{font-size:22px;line-height:1.05;color:#071426}
.role-card small{color:#667085;font-weight:700;line-height:1.45}
.role-card.gold{background:linear-gradient(145deg,#d8a31a,#facc15);color:#071426}
.role-card.gold span,.role-card.gold small{color:#3b2a00}
.role-card.admin{border-color:#071426}
.mini-panel{margin-top:16px;background:white;border:1px solid var(--line);border-radius:24px;padding:18px;box-shadow:0 18px 50px rgba(16,24,40,.08)}
.mini-panel h2{margin:0 0 8px;color:#071426}
.mini-panel p{margin:0 0 8px;color:#667085;line-height:1.5}
.fine{font-size:13px}
.tenant-nav{position:fixed;left:50%;bottom:12px;transform:translateX(-50%);width:min(760px,calc(100% - 24px));display:grid;grid-template-columns:repeat(5,1fr);background:#071426;border:1px solid rgba(255,255,255,.16);border-radius:24px;padding:8px;box-shadow:0 18px 60px rgba(0,0,0,.35);z-index:20}
.tenant-nav a{color:#cdd7e8;text-decoration:none;text-align:center;font-size:12px;font-weight:900;border-radius:16px;padding:10px 6px}
.tenant-nav a.active{background:var(--gold);color:#071426}
@media(max-width:820px){.role-grid{grid-template-columns:1fr 1fr}.tenant-top{align-items:flex-start}.tenant-brand small{max-width:48vw}}
@media(max-width:520px){.tenant-app-shell{padding:14px}.role-grid{grid-template-columns:1fr}.tenant-hero{padding:20px;border-radius:22px}.tenant-nav{grid-template-columns:repeat(5,1fr);bottom:8px}.tenant-nav a{font-size:11px;padding:9px 3px}.role-card{min-height:135px}}