:root {
  --orange: #FC6F13;
  --black: #111111;
  --charcoal: #242424;
  --gray: #666666;
  --light-gray: #F3F3F3;
  --pale-orange: #FFF4EC;
  --white: #FFFFFF;
  --border: #DEDEDE;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
* { box-sizing: border-box; }
html { min-width: 320px; background: var(--light-gray); }
body { margin: 0; color: var(--charcoal); font-family: Arial, Helvetica, sans-serif; line-height: 1.45; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
img { display: block; max-width: 100%; }
svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tech-login-page { min-height: 100dvh; background: var(--black); }
.tech-login-shell { width: min(100%, 620px); min-height: 100dvh; margin: 0 auto; padding: calc(22px + var(--safe-top)) 18px calc(36px + var(--safe-bottom)); background: linear-gradient(180deg, var(--black) 0 29%, var(--light-gray) 29%); }
.tech-back-link { display: inline-flex; margin: 0 0 20px; color: var(--white); font-size: .82rem; font-weight: 800; }
.tech-login-card { padding: 24px 20px; border: 1px solid rgba(252,111,19,.35); border-radius: 20px; background: var(--white); box-shadow: 0 18px 42px rgba(0,0,0,.20); }
.tech-logo { width: min(280px,82%); margin: 0 auto 24px; background: var(--black); }
.tech-eyebrow { margin: 0 0 8px; color: var(--orange); font-size: .7rem; font-weight: 900; letter-spacing: .10em; }
.tech-login-card h1 { margin: 0 0 9px; color: var(--black); font-size: clamp(2rem,8vw,2.65rem); line-height: 1; letter-spacing: -.035em; }
.tech-login-card > p:not(.tech-eyebrow):not(.tech-help) { margin: 0 0 18px; color: var(--gray); font-size: .94rem; }
.tech-alert { margin: 0 0 16px; padding: 13px; border-radius: 12px; background: var(--light-gray); color: var(--charcoal); font-size: .8rem; }
.tech-alert[data-mode="error"] { border: 1px solid rgba(252,111,19,.45); background: var(--pale-orange); color: var(--black); font-weight: 700; }
.tech-alert[data-mode="success"] { background: var(--black); color: var(--white); }
.tech-button { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; padding: 12px 16px; border: 0; border-radius: 12px; font-weight: 900; cursor: pointer; }
.tech-button-primary { background: var(--orange); color: var(--black); }
.tech-text-button { display: block; width: 100%; margin: 9px 0 0; padding: 10px; border: 0; background: transparent; color: var(--gray); font-weight: 800; text-decoration: underline; text-decoration-color: var(--orange); text-underline-offset: 3px; cursor: pointer; }
.tech-security-note { display: flex; gap: 8px; align-items: flex-start; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); color: var(--gray); font-size: .72rem; }
.tech-security-note svg { flex: 0 0 18px; width: 18px; height: 18px; color: var(--orange); }
.tech-help { margin: 15px 0 0; color: var(--gray); font-size: .75rem; text-align: center; }
.tech-help a { color: var(--black); font-weight: 900; text-decoration: underline; text-decoration-color: var(--orange); }

/* Authenticated field portal */
.tech-portal-page { min-height: 100dvh; background: var(--light-gray); }
.tech-portal-shell { width: min(100%,760px); min-height: 100dvh; margin: 0 auto; background: var(--white); box-shadow: 0 0 36px rgba(17,17,17,.10); }
.tech-portal-header { position: sticky; top: 0; z-index: 10; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 14px; align-items: center; padding: calc(12px + var(--safe-top)) 16px 12px; border-bottom: 3px solid var(--orange); background: var(--black); color: var(--white); }
.tech-portal-header img { width: min(245px,62vw); max-height: 52px; object-fit: contain; }
.tech-logout { min-height: 40px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.25); border-radius: 10px; background: rgba(255,255,255,.08); color: var(--white); font-weight: 800; cursor: pointer; }
.tech-portal-main { padding: 26px 18px calc(44px + var(--safe-bottom)); }
.tech-portal-heading { margin-bottom: 18px; }
.tech-portal-heading h1 { margin: 0 0 8px; color: var(--black); font-size: clamp(2rem,7vw,3rem); line-height: 1; letter-spacing: -.035em; }
.tech-portal-heading p:last-child { margin: 0; color: var(--gray); font-size: .92rem; }
.tech-user-strip { display: flex; gap: 12px; justify-content: space-between; align-items: center; margin-bottom: 16px; padding: 13px; border-radius: 13px; background: var(--pale-orange); }
.tech-user-strip span { color: var(--gray); font-size: .72rem; }
.tech-user-strip strong { display: block; color: var(--black); font-size: .88rem; overflow-wrap: anywhere; }
.tech-current-note { margin: 0 0 16px; padding: 13px; border-left: 4px solid var(--orange); background: var(--light-gray); color: var(--charcoal); font-size: .78rem; }
.tech-search { display: flex; gap: 9px; align-items: center; margin-bottom: 17px; padding: 0 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--white); }
.tech-search svg { width: 20px; height: 20px; color: var(--gray); }
.tech-search input { width: 100%; min-height: 48px; border: 0; outline: 0; color: var(--black); font-size: 16px; }
.tech-document-grid { display: grid; gap: 12px; }
.tech-document-card { display: grid; grid-template-columns: 52px minmax(0,1fr) 22px; gap: 12px; align-items: center; min-height: 94px; padding: 14px; border: 1px solid var(--border); border-radius: 15px; background: var(--white); box-shadow: 0 4px 14px rgba(17,17,17,.04); }
.tech-document-card.priority { border: 2px solid var(--orange); padding: 13px; background: linear-gradient(135deg,var(--white),var(--pale-orange)); }
.tech-doc-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 13px; background: var(--black); color: var(--orange); }
.tech-doc-icon svg { width: 27px; height: 27px; }
.tech-document-card h2 { margin: 0 0 3px; color: var(--black); font-size: 1rem; line-height: 1.15; }
.tech-document-card p { margin: 0; color: var(--gray); font-size: .72rem; }
.tech-document-card small { display: block; margin-top: 5px; color: var(--orange); font-size: .65rem; font-weight: 900; letter-spacing: .04em; }
.tech-chevron { width: 22px; height: 22px; color: var(--gray); }
.tech-no-results { margin: 18px 0; color: var(--gray); font-size: .85rem; text-align: center; }
.tech-footer { margin-top: 22px; padding: 17px; border-radius: 15px; background: var(--black); color: var(--white); text-align: center; }
.tech-footer p { margin: 0 0 9px; font-size: .8rem; }
.tech-footer a { color: var(--orange); font-weight: 900; }
@media (min-width: 620px) { .tech-document-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .tech-document-card.priority { grid-column: 1 / -1; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* v1.3.2 custom Identity and activation flow */
.tech-access-badge { display: inline-flex; gap: 7px; align-items: center; margin: 0 0 16px; padding: 7px 10px; border: 1px solid rgba(252,111,19,.28); border-radius: 999px; background: var(--pale-orange); color: var(--black); font-size: .68rem; font-weight: 900; letter-spacing: .02em; }
.tech-access-badge svg { width: 15px; height: 15px; color: var(--orange); }
.tech-alert[data-mode="warning"] { border: 1px solid rgba(252,111,19,.45); background: var(--pale-orange); color: var(--black); font-weight: 700; }
.tech-auth-panel { margin-top: 2px; }
.tech-auth-panel[hidden] { display: none !important; }
.tech-auth-panel h2 { margin: 0 0 6px; color: var(--black); font-size: 1.22rem; line-height: 1.15; }
.tech-auth-panel > p { margin: 0 0 16px; color: var(--gray); font-size: .82rem; }
.tech-field { display: grid; gap: 6px; margin-bottom: 13px; }
.tech-field > span:first-child { color: var(--black); font-size: .76rem; font-weight: 900; }
.tech-field input { width: 100%; min-height: 50px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 11px; outline: 0; background: var(--white); color: var(--black); font-size: 16px; }
.tech-field input:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(252,111,19,.14); }
.tech-field input:user-invalid { border-color: #B12B1E; }
.tech-password-control { position: relative; display: block; }
.tech-password-control input { padding-right: 66px; }
.tech-password-toggle { position: absolute; top: 50%; right: 7px; min-width: 50px; min-height: 36px; padding: 5px 8px; border: 0; border-radius: 8px; transform: translateY(-50%); background: var(--light-gray); color: var(--black); font-size: .7rem; font-weight: 900; cursor: pointer; }
.tech-field-help { margin: -2px 0 13px; color: var(--gray); font-size: .7rem; }
.tech-step-icon { display: grid; place-items: center; width: 46px; height: 46px; margin: 0 0 13px; border-radius: 50%; background: var(--black); color: var(--orange); }
.tech-step-icon svg { width: 24px; height: 24px; }
.tech-next-steps { margin: 0 0 16px; padding-left: 20px; color: var(--charcoal); font-size: .78rem; }
.tech-next-steps li + li { margin-top: 7px; }
.tech-next-steps code { padding: 2px 5px; border-radius: 5px; background: var(--light-gray); color: var(--black); font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: .72rem; font-weight: 800; }
.tech-button:disabled, .tech-text-button:disabled, .tech-password-toggle:disabled { cursor: not-allowed; opacity: .58; }
.tech-button:focus-visible, .tech-text-button:focus-visible, .tech-password-toggle:focus-visible, .tech-logout:focus-visible, .tech-document-card:focus-visible, .tech-back-link:focus-visible { outline: 3px solid rgba(252,111,19,.55); outline-offset: 3px; }
.tech-version { margin: 12px 0 0; color: #8b8b8b; font-size: .64rem; text-align: center; }
.tech-verified-strip { display: flex; gap: 9px; align-items: flex-start; margin: -3px 0 16px; padding: 11px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--light-gray); color: var(--gray); font-size: .75rem; }
.tech-verified-strip svg { flex: 0 0 18px; width: 18px; height: 18px; color: var(--orange); }
.tech-verified-strip[data-mode="success"] { border-color: rgba(252,111,19,.32); background: var(--pale-orange); color: var(--black); font-weight: 700; }
.tech-footer-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.tech-footer-actions a { display: inline-flex; min-height: 38px; align-items: center; padding: 7px 11px; border: 1px solid rgba(255,255,255,.18); border-radius: 9px; }
.tech-footer small { display: block; margin-top: 12px; color: #bdbdbd; font-size: .62rem; }

@media (min-width: 520px) {
  .tech-login-card { padding: 30px 28px; }
}