@charset "UTF-8";

/* Bloqueo inicial independiente de la disposición del workspace. */
#appShell[hidden], #authGate[hidden], #authForm[hidden],
#authRetry[hidden], #accountControls[hidden], #accountAdminOpen[hidden] { display: none !important; }
#appShell:not([hidden]) { display: contents; }
.auth-gate { min-height: 100dvh; display: grid; place-items: center; padding: 24px; }
.auth-card { width: min(100%, 440px); background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; box-shadow: var(--shadow); }
.auth-card h1 { margin-top: 0; font-size: 24px; }
.auth-card form, .account-create { display: grid; gap: 12px; }
.auth-card input, .account-dialog input { width: 100%; padding: 10px 12px; background: var(--bg); color: var(--fg); border: 1px solid var(--line); border-radius: 6px; min-width: 0; }
.auth-card p, .account-notice { color: var(--fg-dim); overflow-wrap: anywhere; }
.auth-card :focus-visible, .account-dialog :focus-visible, .account-controls :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.account-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.account-controls strong { overflow-wrap: anywhere; }
.account-dialog { width: min(850px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 24px; background: var(--bg-2); color: var(--fg); border: 1px solid var(--line); border-radius: var(--radius); overflow: auto; }
.account-dialog::backdrop { background: var(--bg); opacity: .8; }
.account-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.account-dialog h2 { margin-top: 0; font-size: 21px; }
.account-notice { padding: 12px; border: 1px solid var(--info-line); background: var(--info-bg); color: var(--info-fg); border-radius: 6px; }
.account-create { grid-template-columns: 1fr auto; align-items: center; }
.account-create label { grid-column: 1 / -1; }
.account-table-wrap { overflow-x: auto; }
.account-table { width: 100%; border-collapse: collapse; text-align: left; }
.account-table caption { text-align: left; font-weight: 600; padding: 10px 0; }
.account-table th, .account-table td { border-bottom: 1px solid var(--line); padding: 10px; overflow-wrap: anywhere; }
.account-table .btn { margin: 3px; }
.account-key-dialog { width: min(620px, calc(100% - 32px)); }
#accountAccessKey { font-family: monospace; margin-top: 10px; }
.account-key-actions { display: flex; flex-wrap: wrap; gap: 12px; }
#accountAdminStatus, #accountCopyStatus { overflow-wrap: anywhere; }
@media (max-width: 720px) {
  .account-controls { width: 100%; }
  .account-create { grid-template-columns: 1fr; }
  .account-dialog { padding: 16px; }
  .auth-card { padding: 20px; }
}