.login-card{width:min(760px,100%);padding:32px;text-align:left}.login-head{display:flex;align-items:center;gap:14px}.login-card .login-head img{width:56px;border-radius:16px}.login-head h1{margin:5px 0}.login-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.login-choice{border:1px solid #dfe6ea;background:#fff;padding:14px;border-radius:14px;text-align:left;cursor:pointer}.login-choice b,.login-choice span{display:block}.login-choice span{font-size:11px;color:#758293;margin-top:6px;line-height:1.45}.login-choice.active{border-color:#12b889;background:#effbf7;box-shadow:0 8px 22px #12b88924}.login-card .primary{width:100%}.password-row{display:flex;gap:8px}.password-row button{border:0;border-radius:11px;padding:0 14px;font-weight:800}.subnav{display:flex;gap:8px;padding:13px 28px 0;background:#f6f8fb;overflow-x:auto;position:sticky;top:92px;z-index:4}.subnav button{white-space:nowrap;border:0;border-radius:12px;padding:10px 16px;background:#edf1f3;color:#687687;font-weight:850}.subnav button.active{background:#13b889;color:#fff;box-shadow:0 8px 22px #13b8893d}
.header-action{border:0;border-radius:10px;padding:8px 11px;background:#e9fbf5;color:#078d69;font-weight:800}
.login-card .back-link{display:inline-flex;margin:0 0 20px;color:#64748b;text-decoration:none;font-size:12px;font-weight:800;line-height:1.4;transition:color .18s ease,transform .18s ease}.login-card .back-link:hover{color:#078d69;transform:translateX(-2px)}.login-card .back-link:focus-visible{outline:2px solid #12b889;outline-offset:4px;border-radius:4px}
.subscription-shortcut{border:0;border-radius:999px;padding:10px 15px;background:linear-gradient(135deg,#fbbf24,#f97316);color:#fff;font-weight:900;box-shadow:0 9px 24px #f59e0b55}.app aside{padding:20px 14px}.app aside #groupNav{display:grid!important;align-content:start!important;justify-content:start!important;gap:6px!important;flex:0 1 auto!important}.app aside #groupNav button{width:100%;min-height:0;padding:12px 14px}.app aside .logout{margin-top:auto!important;background:#ef4444!important;color:#fff!important;box-shadow:0 9px 24px #ef444455!important;text-align:center}
@media(max-width:850px){.login-card{padding:25px 18px}.login-choices{grid-template-columns:1fr}.subnav{top:76px;padding:10px 14px 0}.subnav button{padding:9px 13px}#groupNav button.active{background:#13b889;color:#fff;box-shadow:0 7px 18px #13b88938}}
.premium-required,.school-payment{text-align:center}.premium-icon{width:64px;height:64px;margin:0 auto 14px;border-radius:20px;display:grid;place-items:center;font-size:30px;color:#fff;background:linear-gradient(135deg,#fbbf24,#f97316);box-shadow:0 12px 28px #f59e0b44}.qris-wrap{margin:16px 0;padding:12px;border-radius:20px;background:#f7f9fa;border:1px solid #edf0f2}.qris-wrap img{display:block;width:100%;max-height:420px;object-fit:contain;border-radius:14px}.payment-total{padding:14px;border-radius:17px;background:#ecfdf7;color:#08795c;margin-bottom:14px}.payment-total small,.payment-total b{display:block}.payment-total b{font-size:28px;margin-top:4px}.school-payment ol{text-align:left;color:#677487;font-size:13px;line-height:1.7}.whatsapp-button{width:100%;border:0;border-radius:14px;padding:14px;background:#25d366;color:#fff;font-weight:900;cursor:pointer}.quote-card .primary{width:100%;margin-top:14px}