:root{--primary:#2563eb;--secondary:#0f766e;--bg:#0f172a;--text:#ffffff;--card:#ffffff;--cardText:#102033;--border:#dbe5f0;--muted:#6b7280;--danger:#ef4444;--success:#16a34a}
*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:Arial,sans-serif;background:var(--bg);color:var(--text)}img,video{max-width:100%;display:block}button,input{font:inherit}
.portal-page{min-height:100vh;padding:16px;background:linear-gradient(180deg,var(--bg),#13253e)}.portal-shell{display:grid;grid-template-columns:minmax(290px,420px) 1fr;gap:18px;max-width:1280px;margin:0 auto;align-items:start}.login-card,.banner,.card,.popup-inner,.modal-content{background:var(--card);color:var(--cardText);border-radius:24px;box-shadow:0 20px 40px rgba(0,0,0,.14);overflow:hidden}.login-card{padding:18px;position:sticky;top:16px}.brand-block{display:flex;align-items:center;gap:14px;margin-bottom:12px}.brand-mark,.brand-logo{width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,var(--primary),var(--secondary));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;object-fit:cover}.login-card h1{font-size:28px;margin:0 0 6px}.login-card p{margin:0 0 8px;color:var(--muted)}label{display:block;margin:10px 0 6px;font-weight:700}input{width:100%;padding:14px;border:1px solid var(--border);border-radius:16px;min-height:52px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;padding:14px 16px;border-radius:16px;min-height:52px;cursor:pointer;font-weight:700}.btn.primary{background:var(--primary);color:#fff}.btn.success{background:var(--success);color:#fff}.btn.ghost{background:#eef4ff;color:var(--cardText)}.status{padding:12px 14px;border-radius:16px;background:#eef4ff;color:#1e3a8a;margin-top:14px;line-height:1.45}.banner-stack,.cards-grid{display:grid;gap:16px}.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.banner{display:grid;grid-template-columns:minmax(180px,280px) 1fr}.banner-media,.card-media{background:#e5eef9;min-height:160px}.banner-body,.card-body{padding:16px}.card .card-media video,.banner .banner-media video,.card .card-media img,.banner .banner-media img{width:100%;height:100%;object-fit:cover}.card h3,.banner h3{margin:0 0 8px}.modal,.popup{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;padding:16px}.hidden{display:none}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.58)}.modal-content,.popup-inner{position:relative;max-width:780px;width:100%;max-height:90vh;overflow:auto;padding:20px}.close-modal{position:absolute;top:12px;right:12px;width:42px;height:42px;border-radius:999px;border:0;background:#0f172a;color:#fff;cursor:pointer}.media-inline img,.media-inline video{border-radius:18px;overflow:hidden}.link-btn{display:inline-flex;padding:12px 16px;border-radius:16px;background:var(--primary);color:#fff;text-decoration:none;font-weight:700}.portal-footer{margin-top:16px;font-size:13px;color:#dbe5f0;text-align:center}.loader-strip{height:4px;border-radius:999px;background:rgba(255,255,255,.2);overflow:hidden;margin-bottom:14px}.loader-strip span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--primary),#fff);transition:width .25s ease}
@media (max-width:1024px){.portal-shell{grid-template-columns:1fr}.login-card{position:relative;top:auto}.cards-grid{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.portal-page{padding:10px}.login-card,.banner,.card,.popup-inner,.modal-content{border-radius:20px}.login-card h1{font-size:24px}.actions,.cards-grid,.banner{grid-template-columns:1fr}.banner-media{min-height:180px}input,.btn{font-size:16px}.status{font-size:14px}}
