:root{--blue:#3180fc;--nav:#18233f;--ink:#172033;--muted:#667085;--line:#dbe5f3;--soft:#f8fbff;--page:#f3f6fb;--danger:#d92d20;color:var(--ink);background:var(--page);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{background:var(--page);min-height:100%;margin:0}body{overflow-x:hidden}button,input,select,textarea{font:inherit}button{cursor:pointer}.login-page{background:linear-gradient(#121f3ac2,#121f3ad6),url(https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=1800&q=80) 50%/cover;place-items:center;min-height:100vh;padding:24px;display:grid}.login-panel{border:1px solid var(--line);background:#fff;border-radius:10px;gap:14px;width:min(420px,100%);padding:28px;display:grid;box-shadow:0 24px 80px #0000003d}.login-panel img{justify-self:center;width:230px;max-width:100%}.login-panel h1{margin:0;font-size:28px}.login-panel p{color:var(--danger);margin:0;font-weight:800}.trusted-device{color:var(--muted);grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;font-size:13px;font-weight:800;display:grid}.trusted-device input{width:18px;min-height:18px}.app{grid-template-columns:248px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{color:#fff;background:var(--nav);align-content:start;gap:8px;min-height:100%;padding:18px;display:grid}.brand{border-bottom:1px solid #ffffff24;gap:10px;margin-bottom:8px;padding-bottom:16px;display:grid}.brand img{background:#fff;border-radius:8px;width:188px;max-width:100%;padding:8px 10px}.brand span{color:#d8e5fb;font-size:13px}.sidebar button{color:#d8dee9;text-align:left;background:0 0;border:1px solid #0000;border-radius:8px;align-items:center;gap:10px;min-height:42px;padding:10px 12px;display:flex}.sidebar button:hover,.sidebar button.active{color:#fff;background:#3180fc33;border-color:#ffffff29}.content{align-content:start;gap:14px;width:min(1320px,100%);margin:0 auto;padding:22px 22px 42px;display:grid}.topbar{grid-template-columns:minmax(0,1fr) minmax(280px,380px);align-items:end;gap:14px;display:grid}.topbar h1{margin:0;font-size:28px;line-height:1.1}.topbar span,.muted{color:var(--muted);font-size:13px;font-weight:750}.search{border:1px solid var(--line);background:#fff;border-radius:8px;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px;min-height:42px;padding:0 12px;display:grid}.search input{border:0;outline:0}input,select,textarea{width:100%;min-width:0;color:var(--ink);border:1px solid var(--line);background:#fff;border-radius:7px}input,select{min-height:36px;padding:7px 9px}textarea{resize:vertical;min-height:64px;padding:9px}input:focus,select:focus,textarea:focus{border-color:var(--blue);outline:2px solid #3180fc2e}.metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.metric,.panel{border:1px solid var(--line);background:#fff;border-radius:8px;box-shadow:0 10px 28px #0f172a0b}.metric{gap:4px;min-height:72px;padding:14px;display:grid}.metric span{color:var(--muted);font-size:12px;font-weight:850}.metric strong{font-size:23px;line-height:1}.screen{gap:14px;display:grid}.two-column{grid-template-columns:minmax(360px,.55fr) minmax(520px,1fr)}.panel{min-width:0;padding:16px}.panel-title{align-items:center;gap:10px;margin-bottom:12px;display:flex}.panel-title svg{color:var(--blue)}.panel-title h2{margin:0;font-size:18px}label{color:#18233f;gap:5px;min-width:0;font-size:13px;font-weight:850;display:grid}.site-form{grid-template-columns:repeat(12,minmax(0,1fr));gap:12px;padding:18px;display:grid}.site-form>.panel-title,.cost-strip{grid-column:1/-1}.site-form>.primary{grid-column:1/-1;justify-self:end;width:fit-content;min-width:180px}.section{background:var(--soft);border:1px solid var(--line);border-radius:8px;gap:9px;padding:12px;display:grid}.section h3{grid-column:1/-1;margin:0 0 2px;font-size:15px}.client-section,.domain-section{grid-column:span 6;grid-template-columns:repeat(4,minmax(0,1fr));align-items:end}.hosting-section,.work-section,.renewal-section{grid-column:1/-1}.hosting-section{grid-template-columns:repeat(4,minmax(0,1fr));align-items:end}.work-section{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}.work-section label:has(textarea){grid-column:1/-1}.section-header{grid-column:1/-1;justify-content:space-between;align-items:center;gap:10px;display:flex}.section-header h3{margin:0}.billing-row{background:#fff;border:1px solid #c7d8ef;border-radius:8px;grid-column:1/-1;grid-template-columns:150px minmax(170px,1fr) minmax(140px,.8fr) 150px 120px 120px minmax(160px,1fr) 38px;align-items:end;gap:8px;padding:10px;display:grid}.cost-strip{background:#edf5ff;border:1px solid #c7ddff;border-radius:8px;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px;display:grid}.cost-strip span{color:var(--muted);font-size:13px;font-weight:850}.cost-strip strong{color:var(--blue);font-size:18px;display:block}.primary,.login-panel button{color:#fff;background:var(--blue);border:1px solid var(--blue);border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:9px 14px;font-weight:900;display:inline-flex}.secondary{min-height:36px;color:var(--blue);background:#edf5ff;border:1px solid #c7ddff;border-radius:8px;justify-content:center;align-items:center;gap:7px;padding:7px 10px;font-weight:900;display:inline-flex}.icon{width:36px;height:36px;color:var(--blue);background:#edf5ff;border:1px solid #c7ddff;border-radius:8px;place-items:center;display:inline-grid}.icon.danger{color:var(--danger);background:#fff4f2;border-color:#ffc9c2}.renewal-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.renewal-card{background:var(--soft);border:1px solid var(--line);border-radius:8px;align-content:start;gap:8px;min-height:82px;padding:10px;display:grid}.renewal-card>strong{color:var(--blue);font-size:13px}.renewal-item{gap:6px;display:grid}.renewal-item button{color:var(--ink);text-align:left;background:#fff;border:1px solid #c7ddff;border-radius:7px;gap:3px;padding:8px;display:grid}.renewal-item span,.renewal-item small{color:var(--muted);font-size:12px;font-weight:800}.renewal-item em{font-style:normal}.renewal-actions{grid-template-columns:1fr 1fr;gap:6px;display:grid}.renewal-actions button,.renewal-actions a{min-height:30px;color:var(--blue);background:#edf5ff;border:1px solid #c7ddff;border-radius:6px;justify-content:center;align-items:center;padding:5px 7px;font-size:11px;font-weight:900;text-decoration:none;display:inline-flex}.site-list{gap:8px;display:grid}.site-row{border:1px solid var(--line);background:#fff;border-radius:8px;grid-template-columns:minmax(220px,1.35fr) minmax(170px,1fr) minmax(140px,.82fr) minmax(140px,.82fr) minmax(140px,.82fr) 150px;align-items:center;gap:12px;min-height:82px;padding:12px;display:grid}.site-row>div{gap:4px;min-width:0;display:grid}.site-row a{width:fit-content;max-width:100%;color:var(--blue);align-items:center;gap:6px;font-weight:900;text-decoration:none;display:inline-flex}.site-row span,.site-row em{color:var(--muted);font-size:13px;font-style:normal}.urgent{background:#fff7ed;border:1px solid #fed7aa;border-radius:8px;padding:8px}.badge{width:fit-content;color:var(--blue);background:#edf5ff;border:1px solid #c7ddff;border-radius:999px;padding:4px 8px;font-size:12px;font-weight:900;display:inline-flex}.row-actions,.button-row{justify-content:end;gap:8px;display:flex}.empty-state{min-height:118px;color:var(--muted);background:var(--soft);border:1px dashed #c7ddff;border-radius:8px;place-items:center;gap:8px;display:grid}.cards{gap:8px;display:grid}.license-card{background:var(--soft);border:1px solid var(--line);border-radius:8px;grid-template-columns:minmax(150px,1fr) minmax(240px,1.2fr) 110px 38px 38px 38px;align-items:center;gap:10px;padding:12px;display:grid}.license-card div{min-width:0}.license-card span,.license-card em{color:var(--muted);font-size:13px;font-style:normal;display:block}.inline-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.email-preview{background:#eef4ff;border:1px solid #c7ddff;border-radius:8px;width:100%;min-height:760px}@media (width<=1320px){.site-row{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.row-actions{justify-content:start}}@media (width<=1120px){.site-form,.client-section,.domain-section,.hosting-section,.work-section,.renewal-section,.two-column{grid-template-columns:1fr}.client-section,.domain-section{grid-column:1/-1}.billing-row{grid-template-columns:1fr 1fr}}@media (width<=820px){.app{grid-template-columns:1fr}.sidebar{z-index:4;grid-template-columns:repeat(5,minmax(0,1fr));min-height:auto;position:sticky;top:0}.brand{grid-column:1/-1}.topbar,.metrics,.renewal-grid,.site-row,.license-card,.inline-row,.billing-row{grid-template-columns:1fr}.content{padding:14px}}