/* Respect native hidden state even when forms and labels use display:grid. */
[hidden]{display:none!important}
:root{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:#f6f1eb;color:#281b23}*{box-sizing:border-box}body{margin:0}.layout{display:grid;grid-template-columns:1fr minmax(320px,470px);min-height:100vh}.intro{background:linear-gradient(135deg,#421f34,#251820);color:#fff;padding:clamp(32px,7vw,110px);display:flex;flex-direction:column;justify-content:center}.mark{color:#dca66d;font-size:50px}.eyebrow{letter-spacing:.22em;color:#e1b280;font-size:12px;font-weight:700}.intro h1{font-size:clamp(32px,4vw,60px);line-height:1.08}.intro p{max-width:450px;line-height:1.6}.small{opacity:.75;font-size:13px}.pane{margin:auto;padding:30px;width:100%;max-width:480px}h2{font-size:26px}form,label{display:grid;gap:8px}form{gap:17px;margin:22px 0}input,select{padding:14px;border:1px solid #d4c9c5;border-radius:10px;background:white;font:inherit;width:100%}input:focus,select:focus{outline:2px solid #ae6a7f}button{background:#5f293f;color:white;padding:13px 17px;border:none;border-radius:10px;font:inherit;font-weight:650;cursor:pointer;min-height:44px}button:disabled{opacity:.5;cursor:wait}button.link{background:transparent;color:#6a2c42;padding:8px 0}.status,.notice{padding:12px;border-radius:9px;background:#e9e0db;font-size:14px;margin-bottom:15px}.error{background:#fff0ed;color:#842e23;padding:14px;border-radius:8px}#workspace>p{line-height:1.6}@media(max-width:750px){.layout{display:block}.intro{padding:26px 24px;min-height:210px}.intro h1{font-size:29px;margin:10px 0}.intro .small{display:none}.mark{font-size:30px}.pane{padding:26px 22px}}
/* Panel de usuarios legible en teléfonos sin desbordamiento horizontal. */
.member-list{display:grid;gap:12px}.member-row{border:1px solid #d9cdca;border-radius:12px;padding:14px;display:grid;gap:10px;min-width:0}.member-row>div{overflow-wrap:anywhere;font-weight:600}.member-row button,.member-row select{width:100%;min-width:0}#private-link{border:1px solid #d9cdca;border-radius:12px;padding:14px;overflow-wrap:anywhere}#whatsapp-link{display:inline-block;padding:12px 16px;border-radius:10px;color:#5f293f;font-weight:650}#private-service-status{margin-top:8px}
@media(min-width:780px){.member-row{grid-template-columns:repeat(2,minmax(0,1fr))}.member-row>div{grid-column:1/-1}}

/* STEVAR access v2 — compacto, claro y utilizable en iPhone */
.pane{max-width:660px}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.section-heading h3{margin:0;font-size:21px}
.section-heading .small{margin:3px 0 0}
button.secondary-button{background:#f0e7e2;color:#5f293f;border:1px solid #d9c8c7}
.directory-tools{margin:14px 0 10px;display:grid;gap:4px}
.directory-tools label{font-size:14px;font-weight:650}
.directory-tools input{padding:11px}
.member-list{display:grid;gap:8px;margin:10px 0 18px}
.member-row{border:1px solid #ddd0cb;border-radius:14px;background:#fff;padding:0;overflow:hidden;display:block}
.member-row>summary{list-style:none;cursor:pointer;padding:13px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.member-row>summary::-webkit-details-marker{display:none}
.member-summary::after{content:"⌄";font-weight:800;color:#654150}
.member-row[open] .member-summary::after{content:"⌃"}
.identity-stack{display:grid;gap:3px;min-width:0;flex:1 1 140px}
.identity-stack strong{font-size:14px;line-height:1.25;overflow-wrap:anywhere}
.identity-stack small{font-size:12px;color:#73666d;overflow-wrap:anywhere}
.role-pill{font-size:11px;background:#f3eae4;padding:5px 7px;border-radius:100px;white-space:nowrap}
.member-status{font-size:11px;font-weight:700;white-space:nowrap}
.member-status.on{color:#257058}.member-status.off{color:#a53737}.member-status.pending{color:#95610b}
.member-actions{display:grid;gap:9px;border-top:1px solid #e4dad6;padding:12px}
.member-actions button{width:100%;font-size:14px;padding:10px;min-height:43px}
.permission-editor{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}
.permission-editor select{padding:9px;min-width:0}
.form-panel{background:#fff;border:1px solid #ded3cd;border-radius:14px;padding:14px;margin:14px 0}
.form-panel>summary{font-weight:750;cursor:pointer;color:#62293e;font-size:17px}
.form-panel form{margin-bottom:4px}
.form-panel p{line-height:1.5}
.secret-panel{background:#fbf7f2;border:1px solid #d9cdca;border-radius:12px;padding:13px;margin:12px 0;overflow-wrap:anywhere}
.secret-value{background:#fff;border:1px dashed #bba5ad;padding:12px;border-radius:8px;font:600 14px ui-monospace,monospace;overflow-wrap:anywhere}
.action-inline{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.action-inline button,.action-inline a{flex:1 1 110px;min-height:43px;text-align:center}
#private-service-status{font-size:12px}
#new-password-form{max-width:460px}
@media(max-width:750px){
 .intro{min-height:150px;padding:17px 22px}.intro h1{font-size:24px}
 .intro .eyebrow{margin:4px 0}.intro .mark{font-size:22px}
 .pane{padding:20px 16px}.member-row{margin:0}
 .section-heading{align-items:flex-start}
 .section-heading button{padding:9px 11px;font-size:13px}
}

/* Acceso explícito a una demo local, no integrada con el backend real. */
.demo-entry{border:1px solid #dacac3;background:#fff;border-radius:14px;padding:16px;margin:18px 0}
.demo-entry h3{font-size:19px;margin:0 0 7px}.demo-entry p{font-size:14px;line-height:1.6;margin:0 0 13px}
.demo-entry-link{display:block;border-radius:10px;padding:12px 15px;background:#5f293f;color:white;text-decoration:none;text-align:center;font-weight:700}
.demo-entry-link:focus-visible{outline:3px solid #dca66d;outline-offset:3px}