/* portal.reactive.security: builds on the site stylesheet and begin.css. */

.portal-copy{margin-top:20px;max-width:560px;color:#a8a89e;font-size:14px;line-height:1.8}
.portal-small{font-size:12px;margin-top:34px}
.portal-feedback{margin-top:18px;color:#ff9d8d;font-size:12px;line-height:1.7;max-width:560px}
.portal-who{font-family:var(--font-mono);font-size:10px;color:#82827f}
@media (width<=639px){.portal-who{display:none}}

.portal-stats{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:12px;margin:6px 0 46px}
.portal-stat{border:1px solid #ffffff1c;border-radius:6px;background:#0f0f0f;padding:22px}
.portal-stat .micro-label{color:#82827f;font-size:9px}
.portal-figure{margin:12px 0 0;font-size:30px;letter-spacing:-.045em;font-weight:520;color:#f4f3ed;line-height:1.1}
.portal-of{font-size:15px;color:#82827f;letter-spacing:-.02em}
.portal-note{margin:10px 0 0;color:#82827f;font-size:11px;line-height:1.6}
.portal-meter{height:6px;margin-top:16px;border-radius:3px;background:#ffffff14;overflow:hidden}
.portal-meter span{display:block;height:100%;width:0;background:var(--color-accent);transition:width .4s}
.portal-meter.full span{background:#ff9d8d}
@media (width<=900px){.portal-stats{grid-template-columns:1fr}}

#account-view .step{padding-bottom:38px}
#account-view .step+.step{border-top:1px solid #ffffff1c;padding-top:34px}
#account-view .secret-row{max-width:720px;margin-top:16px}
.portal-generate{margin-top:24px}
.portal-config{margin-top:18px;max-height:300px;overflow:auto;background:#0b0b0b;border:1px solid #ffffff26;border-radius:3px;padding:14px;font-family:var(--font-mono);font-size:10.5px;line-height:1.7;color:#c9c9be}
#download{margin-top:14px}

/* Present for agents (accessibility tree, DOM) but not shown on screen. */
.agent-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

#agent-view .agent-actions{display:flex;gap:18px;align-items:center;margin:18px 0 0}
.agent-doc{max-width:860px;margin-top:26px;color:#c9c9be;font-size:13px;line-height:1.8}
.agent-doc h1{font-size:34px;letter-spacing:-.05em;line-height:1.1;color:#f4f3ed;margin:0 0 16px}
.agent-doc h2{font-size:20px;color:#f4f3ed;margin:34px 0 10px;letter-spacing:-.02em}
.agent-doc h3{font-size:15px;color:#f4f3ed;margin:22px 0 8px}
.agent-doc p,.agent-doc ul,.agent-doc ol{margin:0 0 12px}
.agent-doc code{font-family:var(--font-mono);font-size:11.5px;color:#f4f3ed;background:#0b0b0b;border:1px solid #ffffff1c;border-radius:3px;padding:1px 5px}
.agent-doc pre{background:#0b0b0b;border:1px solid #ffffff26;border-radius:3px;padding:14px;overflow:auto;font-family:var(--font-mono);font-size:11px;line-height:1.7;margin:0 0 14px}
.agent-doc pre code{border:0;padding:0;background:none}
.agent-doc table{border-collapse:collapse;width:100%;font-size:12px;margin:0 0 14px}
.agent-doc th,.agent-doc td{border:1px solid #ffffff26;padding:7px 9px;text-align:left;vertical-align:top}
.agent-doc th{color:#f4f3ed;background:#151515}
.agent-doc a{color:var(--color-accent)}

.signin-email{margin-top:30px;max-width:560px}
.signin-email label{display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:.05em;color:#d8d8cc;margin-bottom:8px}
.signin-row{display:flex;gap:8px}
.signin-row input{flex:1;min-width:0;color:#eaeae0;background:#0b0b0b;border:1px solid #ffffff26;border-radius:3px;min-height:46px;padding:12px;font-size:14px;font-family:inherit}
.signin-row input:focus{border-color:var(--color-accent);outline:none}
.signin-as{margin:26px 0 18px}
.signin-as strong{color:#f4f3ed;font-weight:560}
.signin-change{all:unset;cursor:pointer;color:#a8a89e;text-decoration:underline;text-underline-offset:3px;font-size:inherit}
.signin-change:hover,.signin-change:focus-visible{color:var(--color-accent)}
.signin-sent{max-width:560px;border:1px solid #ff553b44;background:#ff553b0d;border-radius:4px;padding:4px 16px 14px}

.key-block{margin-top:26px;max-width:720px}
.key-block .micro-label{color:#82827f;font-size:9px;margin-bottom:8px}
.key-confirm{margin-top:12px;border:1px solid #ff553b55;background:#ff553b0d;border-radius:4px;padding:14px 16px}
.key-confirm p{color:#d8d8cc;font-size:12.5px;line-height:1.7;margin:0}
.key-actions{display:flex;gap:16px;align-items:center;margin-top:12px}
.key-new{margin-top:16px}
.key-new code{border-color:#ff553b}
.key-warning{color:#ff9d8d;font-size:11.5px;line-height:1.7;margin:10px 0 0}
.key-status{color:#ff9d8d;font-size:11.5px;margin:8px 0 0;min-height:1em}
.key-actions .signin-change{font-size:12.5px}