/* Ajustes para la app real (responsive, sobre app.css del diseño) */
html,body{background:var(--nc-light)}
.screen{width:100%;max-width:480px;height:auto;min-height:100vh;margin:0 auto;overflow:visible;padding-bottom:calc(var(--nc-tabbar) + 16px)}
.screen.sin-tab{padding-bottom:24px}
.content{overflow:visible}
.tabbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;z-index:5}
.tab{background:none;border:0;cursor:pointer;text-decoration:none}
.btn{width:100%;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.btn:disabled{opacity:.5}
.input{width:100%;font:500 16px var(--nc-font-body);color:var(--nc-text);padding:0 14px}
textarea.input{height:auto;min-height:150px;padding:12px 14px;line-height:1.5}
select.input{appearance:auto}
.input:focus{outline:none;border-color:var(--nc-green);box-shadow:0 0 0 3px var(--nc-green-100)}
.err-msg{color:var(--nc-red-700);font:600 14px var(--nc-font-body)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{cursor:pointer}
.rubros{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rubro{background:#fff;border:2px solid var(--nc-border);border-radius:var(--nc-r-md);padding:14px 12px;font:700 14px var(--nc-font-body);text-align:left;cursor:pointer;color:var(--nc-text)}
.rubro.on{border-color:var(--nc-green);background:var(--nc-green-100)}
.otp{letter-spacing:12px;font:800 28px var(--nc-font-head);text-align:center;height:64px}
.tag-ej{font:700 11px var(--nc-font-body);background:var(--nc-yellow-100);color:var(--nc-yellow-800);padding:2px 6px;border-radius:6px;margin-left:6px}
.link{background:none;border:0;font:600 14px var(--nc-font-body);color:var(--nc-green-700);cursor:pointer;padding:0}
.prev td,.prev th{padding:6px 4px;font-size:13px;text-align:left;border-bottom:1px solid var(--nc-border)}
.prev input{width:100%;border:1px solid var(--nc-border);border-radius:6px;padding:6px;font:500 14px var(--nc-font-body)}
.prev tr.error td{background:var(--nc-red-100)} .prev tr.duplicado td{background:var(--nc-yellow-100)}
.desglose div{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed var(--nc-border);font-size:15px}
.entorno{background:var(--nc-yellow);color:var(--nc-navy);text-align:center;font:700 12px var(--nc-font-body);padding:4px}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--nc-navy);color:#fff;padding:10px 16px;border-radius:12px;font:600 14px var(--nc-font-body);z-index:9}
.cant{display:flex;align-items:center;gap:8px}.cant button{width:36px;height:36px;border-radius:10px;border:1.5px solid var(--nc-border);background:#fff;font:800 18px var(--nc-font-head);cursor:pointer}
/* Estados vacíos (Diseñador, semana 4) */
.vacio{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:24px 32px}
.vacio h2{font:800 22px var(--nc-font-display,Montserrat),sans-serif;margin:4px 0 0}
.vacio p{font-size:15px;color:var(--nc-text-2);margin:0 0 6px}
.vacio .btn{width:100%}
/* El tabbar no tapa el último elemento de la lista */
.screen:not(.sin-tab) .content{padding-bottom:72px}
.item .ic{color:var(--nc-navy,#0F2D4A)}

/* Ventana propia (reemplaza prompt/confirm) */
.modal-fondo{position:fixed;inset:0;background:rgba(15,45,74,.45);display:flex;align-items:flex-end;justify-content:center;z-index:20;padding:16px}
.modal{background:#fff;border-radius:var(--nc-r-lg) var(--nc-r-lg) 12px 12px;padding:20px;width:100%;max-width:440px;display:flex;flex-direction:column;gap:12px;box-shadow:0 10px 30px rgba(0,0,0,.2)}
@media (min-width:700px){.modal-fondo{align-items:center}.modal{border-radius:var(--nc-r-lg)}}
.btn:disabled{cursor:not-allowed}
/* Acceso: en pantallas anchas, columna centrada y legible */
.acceso{width:100%;max-width:440px;margin:0 auto}
@media (min-width:700px){.screen.sin-tab:has(.acceso){max-width:520px}.acceso{padding-top:72px!important}.acceso h1{font-size:32px!important}.acceso .btn{height:56px;font-size:17px}}