/* begin.reactive.security: sign-up page. Builds on the reactive.security stylesheet and its tokens
   (--color-accent #ff553b, --color-ink #0b0b0b, --color-paper #eeeee8, Inter Variable, IBM Plex Mono). */

.skip-link{position:absolute;left:-9999px;top:8px;z-index:50;background:var(--color-accent);color:#080808;padding:10px 14px;border-radius:4px;font-size:12px}
.skip-link:focus{left:8px}
a.button{text-decoration:none}
:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}

/* Hero */
.begin-hero{min-height:680px}
.begin-kicker{color:#a8a89e;margin-bottom:34px}
.tier-facts{display:flex;gap:34px;margin:30px 0 0;padding:18px 0 0;border-top:1px solid #ffffff18;max-width:420px}
.tier-facts dt{color:#82827f}
.tier-facts dd{margin:6px 0 0;font-size:17px;letter-spacing:-.03em;color:#f4f3ed}

/* Sign-up section on paper, like the site's cycle section */
.begin-section{background:var(--color-paper);color:#0b0b0b;padding:120px 0 130px}
.begin-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:start}
.begin-intro{position:sticky;top:40px}
.begin-intro .eyebrow{color:#3a3a36}
.label-index{color:var(--color-accent)}
.begin-title{margin-top:36px;font-size:clamp(40px,4.4vw,62px);font-weight:520;letter-spacing:-.055em;line-height:1}
.begin-title .muted{color:#8b8b84}
.begin-copy{margin-top:26px;max-width:420px;color:#55554f;font-size:14px;line-height:1.8}
.step-index{list-style:none;margin:40px 0 0;padding:0;border-top:1px solid #d4d3cc;max-width:420px}
.step-index li{display:flex;gap:22px;align-items:baseline;padding:16px 0;border-bottom:1px solid #d4d3cc;font-size:19px;letter-spacing:-.03em;color:#8b8b84;transition:color .2s}
.step-index li span{font-family:var(--font-mono);font-size:10px;color:#8b8b84}
.step-index li.active{color:#0b0b0b}
.step-index li.active span{color:var(--color-accent)}
.step-index li.done{color:#3a3a36}
.step-index li.done span::after{content:" ✓";color:var(--color-accent)}

/* The dark panel, styled like the site's trial dialog and cycle explorer */
.begin-card{background:#151515;color:#eeeee8;border:1px solid #ffffff30;border-radius:8px;padding:40px;box-shadow:0 30px 90px #0000002e}
.step{border:0;margin:0;padding:0 0 38px;min-width:0}
.step+.step{border-top:1px solid #ffffff16;padding-top:34px}
.step-head{display:flex;flex-direction:column;gap:10px;margin-bottom:6px}
.step-num{font-family:var(--font-mono);font-size:10px;letter-spacing:.055em;color:var(--color-accent)}
.begin-step-title{font-size:30px;letter-spacing:-.045em;font-weight:520;line-height:1.1}
.step-copy{color:#a8a89e;font-size:12px;line-height:1.8;margin:12px 0 4px}
.begin-card label{color:#d8d8cc;margin:17px 0 8px;font-size:10px;display:block}
.begin-card input:not([type=checkbox]){color:#eaeae0;background:#0b0b0b;border:1px solid #ffffff26;border-radius:3px;width:100%;min-height:43px;padding:12px;font-size:13px;font-family:inherit}
.begin-card input:not([type=checkbox]):focus{border-color:var(--color-accent);outline:none}
.begin-card input[aria-invalid=true]{border-color:#ff553b99}
.optional{color:#75756e;font-family:var(--font-mono);font-size:9px;margin-left:6px}
.field-hint{color:#8f8f85;font-size:10px;line-height:1.7;margin-top:8px}
.kyc-note{display:flex;gap:12px;align-items:flex-start;margin:18px 0 4px;padding:13px 14px;border:1px solid #ff553b44;background:#ff553b0d;color:#d8d8cc;font-size:11px;line-height:1.7;border-radius:3px}
.kyc-note .signal-dot{margin-top:6px}
.kyc-note strong{color:#f4f3ed}

/* Technology chips */
.chip-group{margin-top:22px}
.chip-group .micro-label{color:#82827f;margin-bottom:10px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.begin-card .chip{margin:0;cursor:pointer;font-size:12px;color:#d8d8cc}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip span{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid #ffffff26;border-radius:3px;background:#0b0b0b;transition:border-color .15s,background .15s,color .15s}
.chip span::before{content:"";width:6px;height:6px;border-radius:50%;background:#3a3a36;transition:background .15s}
.chip:hover span{border-color:#ffffff55}
.chip input:checked+span{border-color:var(--color-accent);background:#ff553b14;color:#f4f3ed}
.chip input:checked+span::before{background:var(--color-accent)}
.chip input:focus-visible+span{outline:2px solid var(--color-accent);outline-offset:2px}
.chip-all span{border-style:dashed}

/* Pipeline preview, in the style of the site's cycle explorer */
.pipeline-preview{margin-top:26px;border:1px solid #ffffff1c;border-radius:6px;background:#0f0f0f;padding:18px}
.preview-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:8px;letter-spacing:.06em;color:#94948d}
.preview-top>span:first-child{display:flex;align-items:center;gap:8px}
.preview-top .signal-dot{width:4px;height:4px}
.preview-tag{border:1px solid #ffffff30;padding:4px 7px;border-radius:2px}
.preview-flow{display:grid;grid-template-columns:1.2fr auto 1fr auto 1fr;gap:12px;align-items:center;margin-top:18px}
.preview-col ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:5px;max-height:190px;overflow:auto}
.preview-col li{font-size:11px;color:#d8d8cc;padding:6px 9px;border:1px solid #ffffff1c;border-radius:3px;background:#151515}
.preview-col li.empty{color:#75756e;border-style:dashed;background:none}
.preview-col .micro-label,.preview-node .micro-label{font-size:8px;color:#82827f}
.preview-arrow{color:#55554f;font-size:16px}
.preview-node{border:1px solid #ffffff30;border-radius:4px;padding:14px;display:flex;flex-direction:column;gap:6px;min-height:110px;justify-content:center}
.preview-node strong{font-size:14px;font-weight:560;letter-spacing:-.02em}
.preview-node span{font-size:10px;color:#94948d}
.preview-node.accent{border-color:var(--color-accent);background:#ff553b0f}
.preview-node.accent strong{color:var(--color-accent)}

/* Agreement */
.terms-box{margin-top:18px;height:300px;overflow-y:auto;border:1px solid #ffffff26;border-radius:3px;background:#0b0b0b;padding:22px 24px;font-size:12px;line-height:1.85;color:#c9c9be;scroll-behavior:smooth}
.terms-box:focus-visible{outline:2px solid var(--color-accent)}
.terms-box .agreement h1{font-size:22px;letter-spacing:-.04em;line-height:1.2;color:#f4f3ed;margin:10px 0 14px;font-weight:560}
.terms-box .agreement h2{font-size:14px;color:#f4f3ed;margin:22px 0 8px;font-weight:600;letter-spacing:-.01em}
.terms-box .agreement p{margin:0 0 10px}
.terms-box .eyebrow{font-size:8px;color:#82827f}
.terms-progress{height:2px;background:#ffffff16;margin-top:10px;border-radius:2px;overflow:hidden}
.terms-progress span{display:block;height:100%;width:0;background:var(--color-accent);transition:width .15s}
.terms-status{margin:10px 0 6px;color:#82827f;font-size:9px}
.terms-status.done{color:var(--color-accent)}
.agreement-placeholder,.terms-box .agreement-placeholder{border:1px dashed #ff553b88;color:#ff9d8d;padding:10px 12px;font-family:var(--font-mono);font-size:10px;margin:8px 0 14px}
.agreement-end{font-family:var(--font-mono);font-size:9px;color:#82827f;border-top:1px solid #ffffff16;padding-top:12px;margin-top:20px}
.begin-card .ack{display:flex;gap:12px;align-items:flex-start;margin:14px 0 0;font-size:11.5px;line-height:1.7;color:#d8d8cc;cursor:pointer}
.ack input{appearance:none;flex:none;width:18px;height:18px;margin-top:2px;border:1px solid #ffffff40;border-radius:3px;background:#0b0b0b;display:grid;place-content:center;cursor:pointer}
.ack input::before{content:"";width:9px;height:9px;transform:scale(0);transition:transform .1s;background:var(--color-accent);clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0,43% 62%)}
.ack input:checked{border-color:var(--color-accent)}
.ack input:checked::before{transform:scale(1)}
.ack input:disabled{opacity:.35;cursor:not-allowed}
.ack:has(input:disabled){color:#75756e;cursor:not-allowed}
.inline-link{color:var(--color-accent)}

/* Verify */
.verify-options{display:flex;flex-direction:column;gap:12px;margin-top:20px}
.verify-options .button{justify-content:space-between}
.identity-options{display:grid;grid-template-columns:repeat(2,minmax(0,400px));gap:16px;align-items:start}
.identity-options:not(:has(> :not([hidden]))){display:none}
.google-slot{min-height:44px;min-width:0;max-width:400px}
@media (width<=639px){.identity-options{grid-template-columns:minmax(0,400px);gap:12px}}
/* Match Google's large, rectangular, filled-black sign-in button. */
.identity-button{display:flex;align-items:center;width:100%;max-width:400px;height:40px;padding:0;border:1px solid #202124;border-radius:4px;background:#202124;color:#fff;font-family:"Google Sans",Arial,sans-serif;font-size:14px;font-weight:500;letter-spacing:.25px;cursor:pointer;overflow:hidden;transition:background .15s,box-shadow .15s}
.identity-button[hidden]{display:none}
.identity-button-icon{display:grid;place-items:center;flex:none;width:36px;height:36px;margin-left:1px;border-radius:3px 0 0 3px;background:#fff}
.identity-button-icon svg{display:block;width:18px;height:18px}
.identity-button-label{flex:1;min-width:0;padding:0 12px;text-align:center;white-space:nowrap}
.identity-button:hover{background:#303134;box-shadow:0 1px 3px #0000004d}
.identity-button:active{background:#3c4043}
.identity-button:focus-visible{outline:2px solid var(--color-accent);outline-offset:3px}
.code-entry{border-top:1px solid #ffffff16;padding-top:6px}
.code-entry input{font-family:var(--font-mono);letter-spacing:.4em;font-size:18px!important;text-align:center}
.code-entry .button{margin-top:14px}
.verify-unavailable{color:#a8a89e;font-size:12px;border:1px dashed #ffffff30;padding:14px;border-radius:3px}
.locked .verify-options{opacity:.4;pointer-events:none}
.locked .verify-options::after{content:"Complete steps 01 to 03 to continue.";font-family:var(--font-mono);font-size:9px;color:#82827f}
.busy{opacity:.6;pointer-events:none}

/* Result */
.result h2{font-size:40px;letter-spacing:-.05em;line-height:1;font-weight:520;margin:14px 0 0}
.result .eyebrow{color:#82827f}
.result .lead{color:#a8a89e;font-size:13px;line-height:1.8;margin:18px 0 0;max-width:520px}
.result-icon{width:44px;height:44px;border:1px solid var(--color-accent);border-radius:50%;display:grid;place-items:center;color:var(--color-accent);margin-bottom:22px}
.result-icon svg{width:20px;height:20px}
.secret{margin-top:26px}
.secret-row{display:flex;gap:8px;margin-top:8px}
.secret-row code{flex:1;min-width:0;overflow-wrap:anywhere;font-family:var(--font-mono);font-size:12px;background:#0b0b0b;border:1px solid #ff553b66;border-radius:3px;padding:13px;color:#f4f3ed}
.secret-row button,.result .copy{flex:none}
.result .button{margin-top:22px}
.result pre{margin-top:10px;max-height:220px;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}
.result .warning{color:#ff9d8d;font-size:11px;margin-top:10px}

/* Standalone pages: agreement, review decision, welcome */
.terms-page,.plain-page{background:var(--color-ink)}
.terms-shell{max-width:780px;padding:70px 0 90px}
.agreement h1{font-size:44px;letter-spacing:-.05em;line-height:1.05;margin:20px 0 26px}
.agreement h2{font-size:18px;margin:30px 0 10px;font-weight:600}
.agreement p{color:#c9c9be;font-size:14px;line-height:1.85;margin:0 0 12px}
.plain-shell{max-width:620px;padding:90px 0}
.plain-shell .begin-card{margin-top:30px}

@media (width<=1100px){
  .begin-grid{grid-template-columns:1fr;gap:44px}
  .begin-intro{position:static}
  .preview-flow{grid-template-columns:1fr;gap:8px}
  .preview-arrow{transform:rotate(90deg);justify-self:center}
}
@media (width<=639px){
  .begin-section{padding:70px 0 80px}
  .begin-card{padding:24px 18px}
  .tier-facts{gap:20px}
  .begin-step-title{font-size:25px}
  .result h2{font-size:32px}
}

/* Agreement tables (Appendix A) */
.agreement .table-wrap{overflow-x:auto;margin:14px 0 18px}
.agreement table{border-collapse:collapse;width:100%;font-size:12px;line-height:1.6}
.agreement th,.agreement td{border:1px solid #ffffff26;padding:8px 10px;text-align:left;vertical-align:top;color:#c9c9be}
.agreement th{color:#f4f3ed;font-weight:600;background:#151515}
.terms-box .agreement table{font-size:11px}
.agreement ul{margin:0 0 14px;padding-left:20px;color:#c9c9be;font-size:14px;line-height:1.85}
.agreement li{margin-bottom:8px}

/* Full-screen form layout: the sign-up form is the page. */
.begin-section{background:#151515;color:#eeeee8;padding:56px 0 90px;min-height:calc(100vh - 81px)}
.begin-grid{display:block;max-width:980px}
.begin-top{margin-bottom:34px}
.begin-top .eyebrow{color:#82827f}
.begin-section .begin-title{margin-top:22px;font-size:clamp(38px,4.6vw,64px);color:#f4f3ed}
.begin-section .step-index{display:grid;grid-template-columns:repeat(4,1fr);max-width:none;margin-top:34px;border-top:0;gap:10px}
.begin-section .step-index li{display:block;border:0;border-top:2px solid #ffffff1c;padding:12px 0 0;font-size:14px;color:#75756e}
.begin-section .step-index li span{display:block;margin-bottom:4px}
.begin-section .step-index li.active{border-top-color:var(--color-accent);color:#f4f3ed}
.begin-section .step-index li.done{border-top-color:#ff553b77;color:#c9c9be}
.begin-card{background:none;border:0;box-shadow:none;padding:0;border-radius:0}
.begin-card .step+.step{border-top-color:#ffffff1c}
@media (width<=639px){
  .begin-section{padding:34px 0 60px}
  .begin-section .step-index{grid-template-columns:repeat(2,1fr)}
}
.agent-hint{margin:14px 0 0;color:#82827f;font-size:12px}
.header-signin{color:#d8d8cc;font-size:14px;text-decoration:none}.header-signin:hover,.header-signin:focus-visible{color:var(--color-accent)}
