@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@700;800&display=swap";html{background:#f3f6fa}body{min-width:320px;min-height:100vh}:root{color:#11203a;background:#f3f6fa;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}.loading{place-items:center;min-height:100vh;display:grid}.app-shell{grid-template-columns:248px 1fr;min-height:100vh;display:grid}aside{color:#fff;background:#071b33;flex-direction:column;width:248px;padding:30px 20px;display:flex;position:fixed;inset:0 auto 0 0}.logo{letter-spacing:.08em;align-items:center;gap:12px;font:800 15px Manrope;display:flex}.logo svg{color:#4f9df8}.logo span{display:grid}.logo small{color:#8295aa;letter-spacing:.25em;font-size:10px}nav{gap:8px;margin-top:54px;display:grid}nav a{color:#8fa4ba;border-radius:10px;align-items:center;gap:12px;padding:12px 14px;font-weight:600;display:flex}nav svg{width:19px}nav .active{color:#fff;background:#153251}.sync-card{background:#102b49;border:1px solid #244361;border-radius:14px;margin-top:auto;padding:15px}.sync-dot{background:#46d59a;border-radius:50%;width:8px;height:8px;margin-right:8px;display:inline-block}.sync-card p,.sync-card small{color:#91a7bc;margin:6px 0 0;font-size:12px}.logout{color:#8fa4ba;background:0 0;border:0;align-items:center;gap:10px;margin-top:18px;padding:10px;display:flex}.content{grid-column:2;min-width:0;padding:38px 44px 60px}header{justify-content:space-between;align-items:center;margin-bottom:28px;display:flex}h1,h2{margin:0;font-family:Manrope}header h1{font-size:30px}header p{color:#728099;margin:6px 0}.eyebrow{text-transform:uppercase;letter-spacing:.13em;font-weight:700;color:#2979d6!important;font-size:11px!important}.date-chip{color:#53637a;background:#fff;border:1px solid #dfe6ef;border-radius:10px;align-items:center;gap:8px;padding:10px 14px;font-size:13px;display:flex}.metrics{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px;display:grid}.metric{background:#fff;border:1px solid #e0e7ef;border-radius:15px;align-items:center;gap:14px;padding:20px;display:flex}.metric-icon{color:#2176d2;background:#e8f2ff;border-radius:12px;place-items:center;width:44px;height:44px;display:grid}.green .metric-icon{color:#159667;background:#e6f8f0}.red .metric-icon{color:#e34d59;background:#fff0f0}.amber .metric-icon{color:#d88617;background:#fff4df}.metric p{color:#738198;margin:0 0 5px;font-size:13px}.metric strong{font:700 24px Manrope}.panel{background:#fff;border:1px solid #e0e7ef;border-radius:16px;overflow:hidden}.panel-head{border-bottom:1px solid #e8edf3;justify-content:space-between;gap:20px;padding:22px 24px;display:flex}.panel-head h2{font-size:18px}.panel-head p{color:#7c899d;margin:5px 0 0;font-size:13px}.tools{gap:10px;display:flex}.search{position:relative}.search svg{color:#8592a4;width:17px;position:absolute;top:10px;left:11px}.search input,.tools select{background:#fff;border:1px solid #dbe3ec;border-radius:9px;height:38px;padding:0 12px}.search input{width:260px;padding-left:35px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:950px}th{text-align:left;color:#728096;text-transform:uppercase;background:#f8fafc;padding:12px 16px;font-size:11px}td{color:#405068;border-top:1px solid #edf1f5;padding:14px 16px;font-size:13px}td strong,td small{display:block}td small{color:#8a96a7;margin-top:3px;font-size:11px}.inventory{background:#eff4fa;border-radius:8px;place-items:center;width:31px;height:31px;font-weight:700;display:grid}.status{color:#15855d;white-space:nowrap;background:#e9f7f1;border-radius:20px;align-items:center;gap:7px;padding:6px 9px;font-size:12px;font-weight:600;display:inline-flex}.status i{background:currentColor;border-radius:50%;width:7px;height:7px}.status.s1{color:#d64550;background:#fff0f0}.status.s2{color:#65758a;background:#eef3f8}.status.s3{color:#c37a13;background:#fff4df}.empty{color:#a1aab7}.paid{color:#16865d}.edit{color:#37506b;background:#fff;border:1px solid #d8e1ea;border-radius:8px;padding:6px 10px}.modal-backdrop{z-index:10;background:#071526b8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:18px;width:min(590px,100%);padding:24px}.modal-head{justify-content:space-between;display:flex}.icon-btn{background:#f1f4f7;border:0;border-radius:9px;width:38px;height:38px}.form-grid{grid-template-columns:1fr 1fr;gap:16px;margin-top:24px;display:grid}.form-grid label{color:#53637a;gap:7px;font-size:12px;font-weight:700;display:grid}.form-grid input,.form-grid select,.form-grid textarea{border:1px solid #d8e1ea;border-radius:9px;padding:10px}.wide{grid-column:1/-1}.modal-actions{justify-content:flex-end;gap:10px;margin-top:22px;display:flex}.modal-actions button,.login-panel button{color:#fff;background:#1672d4;border:0;border-radius:9px;padding:11px 18px;font-weight:700}.modal-actions .secondary{color:#42536a;background:#eef2f6}.login-page{background:#071b33;grid-template-columns:minmax(380px,540px) 1fr;min-height:100vh;display:grid}.login-panel{background:#fff;flex-direction:column;justify-content:center;padding:10vh 10%;display:flex}.brand-mark{color:#1974d2;background:#e7f2ff;border-radius:16px;place-items:center;width:58px;height:58px;margin-bottom:30px;display:grid}.login-panel h1{font-size:37px}.muted{color:#748197}.login-panel form{gap:17px;margin-top:30px;display:grid}.login-panel label{gap:8px;font-size:13px;font-weight:700;display:grid}.login-panel input{border:1px solid #d7dfe8;border-radius:9px;padding:12px}.form-error{color:#c8424c}.demo-note{color:#8895a8;align-items:center;gap:7px;font-size:12px;display:flex}.login-visual{color:#fff;text-align:center;background:radial-gradient(circle,#164473,#071b33 60%);flex-direction:column;justify-content:center;align-items:center;padding:50px;display:flex}.login-visual h2{margin-top:28px;font-size:34px}.login-visual p{color:#9db3ca;max-width:520px;line-height:1.7}.orb{color:#5ea9f8;border:1px solid #4f7fad;border-radius:50%;place-items:center;width:210px;height:210px;display:grid;box-shadow:inset 0 0 80px #2b78ca55}.orb svg{width:96px;height:96px}@media (width<=1000px){.metrics{grid-template-columns:1fr 1fr}.panel-head{flex-direction:column}}@media (width<=760px){.app-shell{display:block}aside{width:auto;height:auto;padding:18px;position:static}nav,.sync-card{display:none}.content{padding:24px 16px}.metrics{grid-template-columns:1fr}.tools{flex-direction:column}.search input,.tools select{width:100%}.login-page{display:block}.login-panel{min-height:100vh}.login-visual,.date-chip{display:none}.form-grid{grid-template-columns:1fr}.wide{grid-column:auto}}
