*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:#e6ebf1;background:#0e1117}
a{color:#8ab4ff;text-decoration:none}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid #1f2530;background:#0f1320;position:sticky;top:0;z-index:10}
.brand{display:flex;gap:12px;align-items:center}.logo{width:36px;height:36px}
.brand .title{font-weight:700}.brand .title span{opacity:.8;font-weight:600}.brand .subtitle{font-size:12px;opacity:.6;margin-top:2px}
.right{display:flex;gap:12px;align-items:center}
.user{display:flex;gap:12px;align-items:center}.user .name{font-weight:600}.user .addr{opacity:.8}
.btn{border:1px solid #2a3140;background:#131826;color:#e6ebf1;border-radius:10px;padding:8px 12px;cursor:pointer}
.btn:hover{background:#1a2233}.btn.primary{background:#2563eb;border-color:#2563eb}.btn.primary:hover{filter:brightness(1.1)}
.btn.ghost{background:transparent;border-color:#2a3140}.btn.danger{background:#b91c1c;border-color:#b91c1c}
.tabs{display:flex;gap:8px;padding:12px 20px;border-bottom:1px solid #1f2530}.tab{background:transparent;border:1px solid #2a3140;color:#cfd6e4;border-radius:10px;padding:6px 10px;cursor:pointer}
.tab.active{background:#1a2233}
.notice{margin:16px 20px;padding:10px;border:1px dashed #334155;border-radius:10px;background:#0f172a;color:#cbd5e1;font-size:13px}
main{padding:20px;max-width:1000px;margin:0 auto}
.card{border:1px solid #1f2530;background:#0f1320;border-radius:14px;padding:16px;margin-bottom:18px;display:none}
.card.visible{display:block}
.addr{opacity:.8;margin-bottom:10px}
.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pill{border:1px solid #1f2937;background:#111827;padding:10px;border-radius:10px}
.pill.emphasis{background:#0b1220;border-color:#1d2a3a;font-weight:600}
.total{margin-top:12px;font-weight:600}
.row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.input-group{display:flex;flex-direction:column;gap:6px;min-width:220px}
input,select{background:#0b1020;border:1px solid #233047;border-radius:10px;color:#dce3f3;padding:10px}
.msg{margin-top:10px}.msg.error{color:#ef4444}.msg.success{color:#22c55e}.msg.info{color:#60a5fa}
.login{display:grid;place-items:center;height:100vh}.login-card{border:1px solid #1f2530;background:#0f1320;border-radius:14px;padding:24px;min-width:320px}
.logo-row{display:flex;gap:100px;align-items:center;margin-bottom:8px}.login .title{font-weight:700}
.net-dropdown{position:relative}.net-dropdown .menu{position:absolute;right:0;top:38px;background:#0f1320;border:1px solid #1f2530;border-radius:10px;min-width:220px;display:none;padding:6px}
.net-dropdown .menu.open{display:block}.net-dropdown .menu-item{padding:8px;border-radius:8px;cursor:pointer}
.net-dropdown .menu-item:hover{background:#1a2233}

/* Topbar */
.topbar .logo{ width:98px; height:98px; }   /* 44/48/56, lo que prefieras */
.brand .title{ font-size:18px; }            /* (opcional) agranda el texto */
.brand .subtitle{ font-size:12px; }

/* Login */
.login .logo{ width:94px; height:94px; }    /* más grande en la tarjeta de login */
.logo-row{ gap:14px; }                      /* separa un poco más (opcional) */
