:root{--bg:#050505;--panel:#111;--panel2:#181818;--gold:#d4af37;--gold2:#f3d876;--text:#f8f5eb;--muted:#aaa69b;--line:#3a321d;--danger:#ff827f;--ok:#8bd49c;--shadow:0 24px 80px rgba(0,0,0,.58)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:#050505;color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;overflow:hidden}button,input{font:inherit}.hidden{display:none!important}.shell{width:100%;height:100%;position:relative;background:radial-gradient(circle at 15% 0%,#211b09 0,#090909 34%,#050505 100%)}
.top-tools{position:fixed;z-index:40;left:10px;right:10px;top:max(8px,env(safe-area-inset-top));display:flex;justify-content:space-between;align-items:center;pointer-events:none}.mini-brand,.tool-actions{display:flex;align-items:center;gap:8px}.mini-brand{background:rgba(8,8,8,.9);border:1px solid rgba(212,175,55,.35);padding:6px 9px;border-radius:999px;font-size:11px;font-weight:850;backdrop-filter:blur(12px);pointer-events:auto}.mini-logo{width:22px;height:22px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold2);font-weight:1000}.tool-actions{pointer-events:auto}.btn{border:1px solid var(--line);background:rgba(16,16,16,.95);color:var(--text);padding:8px 11px;border-radius:10px;font-weight:850;cursor:pointer;box-shadow:0 8px 28px rgba(0,0,0,.24)}.btn.gold{background:linear-gradient(135deg,#b89020,#f0d36c);color:#181205;border-color:#e5c75d}.btn.block{width:100%;padding:12px}.net{font-size:10px;font-weight:900;padding:7px 9px;border-radius:999px;background:rgba(12,22,14,.92);border:1px solid #2e5135;color:#a9dfb4}.net.offline{background:#241313;border-color:#66302d;color:#ffaaa8}
.setup,.offline,.modal{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:22px}.setup-card,.offline-card,.modal-card{width:min(520px,100%);background:rgba(14,14,14,.97);border:1px solid #514523;border-radius:24px;padding:28px;box-shadow:var(--shadow)}.hero-logo{width:78px;height:78px;border:2px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold2);font-size:42px;font-weight:1000;margin-bottom:18px}.hero-logo.small{width:58px;height:58px;font-size:31px}.setup h1,.offline h2,.modal h2{margin:0 0 10px}.setup p,.offline p,.modal p{color:var(--muted);line-height:1.55}.setup label{display:block;font-size:11px;text-transform:uppercase;color:var(--muted);font-weight:900;margin:18px 0 7px}.setup input{width:100%;background:#090909;border:1px solid #403923;color:var(--text);border-radius:12px;padding:12px;outline:none;margin-bottom:12px}.setup input:focus{border-color:var(--gold)}.error{background:#281515;color:#ffb2af;border:1px solid #5a2b29;border-radius:10px;padding:10px 12px;margin-bottom:12px;font-size:12px}.note{font-size:11px!important;margin:12px 0 0!important}.modal{background:rgba(0,0,0,.68);z-index:60}.modal-card{position:relative}.close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:#ddd;font-size:27px;cursor:pointer}.update{position:fixed;z-index:70;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:#151208;border:1px solid #5b4d24;border-radius:14px;padding:9px 10px 9px 13px;box-shadow:var(--shadow);font-size:12px}
.app-stage{position:absolute;inset:0;background:#050505}.app-stage iframe{width:100%;height:100%;border:0;background:#050505;display:block}.loading{position:absolute;z-index:20;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:radial-gradient(circle at 50% 20%,#1f1908,#080808 42%,#050505);transition:opacity .22s}.loading.done{opacity:0;pointer-events:none}.loading small{color:var(--muted)}.spinner{width:32px;height:32px;border:3px solid rgba(243,216,118,.2);border-top-color:var(--gold2);border-radius:50%;animation:spin .7s linear infinite;margin-bottom:6px}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:640px){.mini-brand span:last-child{display:none}.top-tools{left:7px;right:7px}.btn{padding:7px 9px;font-size:11px}.setup-card,.offline-card,.modal-card{padding:23px;border-radius:20px}}
@media(display-mode:standalone){.mini-brand{display:none}.top-tools{justify-content:flex-end}.btn#installBtn{display:none!important}}

/* v1.1 - Instalación antes del login */
.welcome{position:absolute;inset:0;z-index:35;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 18% 5%,#302607 0,#0a0a09 34%,#050505 72%)}
.welcome-card{width:min(940px,100%);min-height:460px;display:grid;grid-template-columns:minmax(230px,.72fr) minmax(0,1.28fr);overflow:hidden;border:1px solid #514523;border-radius:28px;background:rgba(12,12,11,.97);box-shadow:var(--shadow)}
.welcome-logo{display:grid;place-items:center;font-size:112px;font-weight:1000;color:var(--gold2);background:linear-gradient(145deg,#211a06,#090909);border-right:1px solid #2f2816}
.welcome-copy{padding:54px 56px;display:flex;flex-direction:column;justify-content:center}.eyebrow{font-size:11px;font-weight:950;letter-spacing:.16em;color:var(--gold2);margin-bottom:12px}.welcome h1{font-size:clamp(30px,4vw,48px);line-height:1.03;margin:0 0 18px;max-width:650px}.welcome p{color:var(--muted);line-height:1.6;margin:0;max-width:680px}.welcome-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.primary-install,.continue{min-height:48px;padding:12px 20px;font-size:14px}.continue{background:#121212;border-color:#4c4328}.install-hint{font-size:11px!important;margin-top:14px!important;color:#827d70!important}
@media(max-width:720px){.welcome{padding:14px}.welcome-card{grid-template-columns:1fr;min-height:0}.welcome-logo{height:145px;font-size:76px;border-right:0;border-bottom:1px solid #2f2816}.welcome-copy{padding:30px 25px 34px}.welcome-actions{flex-direction:column}.welcome-actions .btn{width:100%}.welcome h1{font-size:31px}}
