/* Extracted from auth.html on 2026-09-02 (Phase 3 of PLAN_95).
   Same rules, same cascade order; only the location changed. Link order in the page
   preserves the original document order, which was verified by proving that the
   component blocks share no selector with the main or hardening blocks. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0d1117;--bg2:#0f1620;--bg3:#111f2e;--bg4:#132030;
  --border:#1a2d45;--border2:#1e3a55;
  --blue:#0077cc;--bluelt:#33aaff;--bluehl:#88ddff;
  --green:#3a7a50;--greenlt:#5ab87a;
  --red:#8c3a3a;--redlt:#d45a3a;
  --text:#b8cce0;--text2:#9db0c7;--text3:#8b9fb8;
  --mono:'Inconsolata',monospace;--head:'Exo 2',sans-serif;
}
body.day{
  --bg:#f5f7fa;--bg2:#ffffff;--bg3:#eef1f5;--bg4:#e6ebf3;
  --border:#d0d6e0;--border2:#b9c4d4;
  --blue:#0077cc;--bluelt:#0066bb;--bluehl:#005a99;
  --green:#1e8a4a;--greenlt:#2eb06a;
  --red:#b03030;--redlt:#d4482e;
  --text:#1a2030;--text2:#4a5a75;--text3:#5a6b82;
}
body.day::before{background:radial-gradient(ellipse 70% 50% at 20% 20%,rgba(0,80,160,0.05) 0%,transparent 70%)}
body.day .btn-submit:hover{color:#fff}
/* Day design layer: elevation instead of hairlines, dark accent step for text. */
body.day .card{border-color:#dfe6f0;box-shadow:0 1px 2px rgba(16,24,40,.05),0 16px 42px rgba(16,24,40,.10)}
body.day .logo-name{color:var(--blue)}
body.day .auth-tab.active{color:var(--blue)}
body.day .forgot-link a:hover{color:var(--blue)}
body.day .invite-banner strong{color:var(--blue)}
body.day .auth-footer a:hover{color:var(--blue)}
body.day .field input,body.day .field select{border-color:#c7d1e0}
body.day::before{background:radial-gradient(ellipse 70% 50% at 20% 20%,rgba(0,80,160,0.08) 0%,transparent 70%),radial-gradient(ellipse 55% 40% at 85% 85%,rgba(0,60,130,0.04) 0%,transparent 60%)}
html,body{height:100%}
body{background:var(--bg);color:var(--text);font-family:var(--mono);font-size:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px;}
body::before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 50% at 20% 20%,rgba(0,80,160,0.08) 0%,transparent 70%),radial-gradient(ellipse 60% 40% at 80% 80%,rgba(0,60,130,0.05) 0%,transparent 60%);}
.accent-top{position:fixed;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent 0%,#0077cc 30%,#33aaff 50%,#0077cc 70%,transparent 100%);}
.logo-wrap{display:flex;align-items:center;gap:12px;margin-bottom:28px;text-decoration:none;}
.logo-hex{width:44px;height:44px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 0 16px rgba(0,119,204,0.4);}
.logo-name{font-family:var(--head);font-weight:800;font-size:20px;color:var(--bluelt);letter-spacing:0.5px;}
.logo-sub{font-size:10px;color:var(--text3);letter-spacing:2px;text-transform:uppercase;}
.card{background:var(--bg2);border:1px solid var(--border);border-top:2px solid var(--blue);width:100%;max-width:460px;position:relative;z-index:1;}
.card-header{background:var(--bg3);border-bottom:1px solid var(--border);padding:16px 20px;}
.card-title{font-family:var(--head);font-weight:700;font-size:14px;letter-spacing:2px;text-transform:uppercase;color:var(--text);}
.card-sub{font-size:12px;color:var(--text3);letter-spacing:1px;margin-top:3px;}
.card-body{padding:24px 20px;}
.auth-tabs{display:flex;border-bottom:1px solid var(--border);margin-bottom:24px;}
.auth-tab{flex:1;padding:10px;text-align:center;cursor:pointer;font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);border-bottom:2px solid transparent;margin-bottom:-1px;transition:all 0.15s;}
.auth-tab.active{color:var(--bluelt);border-bottom-color:var(--blue);}
.auth-tab:hover{color:var(--text2);}
.form-panel{display:none;}
.form-panel.active{display:block;}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:14px;}
.field label{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--text3);}
.field input,.field select{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:10px 12px;font-family:var(--mono);font-size:13px;outline:none;width:100%;transition:border-color 0.2s;-webkit-appearance:none;border-radius:0;}
.field input:focus,.field select:focus{border-color:var(--bluelt);background:var(--bg4);}
.field input::placeholder{color:var(--text3);}
.field select option{background:var(--bg3);color:var(--text);}
.field-hint{font-size:12px;color:var(--text3);letter-spacing:0.5px;margin-top:2px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.btn-submit{width:100%;background:var(--blue);color:#e8f4ff;font-family:var(--head);font-weight:700;font-size:12px;letter-spacing:2px;text-transform:uppercase;padding:13px;border:none;cursor:pointer;margin-top:6px;transition:background 0.15s;border-radius:0;}
.btn-submit:hover{background:var(--bluelt);color:#000;}
.btn-submit:disabled{opacity:0.5;cursor:not-allowed;}
.err-msg{background:rgba(140,58,58,0.15);border:1px solid var(--red);border-left:3px solid var(--redlt);color:var(--redlt);padding:10px 12px;font-size:12px;letter-spacing:0.5px;margin-bottom:14px;display:none;}
.err-msg.show{display:block;}
.ok-msg{background:rgba(58,122,80,0.15);border:1px solid var(--green);border-left:3px solid var(--greenlt);color:var(--greenlt);padding:10px 12px;font-size:12px;letter-spacing:0.5px;margin-bottom:14px;display:none;}
.ok-msg.show{display:block;}
.divider{display:flex;align-items:center;gap:10px;margin:16px 0;color:var(--text3);font-size:11px;letter-spacing:1px;}
.divider::before,.divider::after{content:'';flex:1;height:1px;background:var(--border);}
.forgot-link{text-align:center;margin-top:14px;font-size:12px;color:var(--text3);}
.forgot-link a{color:var(--blue);text-decoration:none;cursor:pointer;}
.forgot-link a:hover{color:var(--bluelt);}
.invite-banner{background:rgba(0,100,200,0.1);border:1px solid var(--blue);border-left:3px solid var(--bluelt);padding:12px 14px;margin-bottom:20px;font-size:11px;color:var(--text2);line-height:1.6;}
.invite-banner strong{color:var(--bluelt);}
.step-indicator{display:flex;gap:8px;justify-content:center;margin-bottom:24px;}
.step-dot{width:8px;height:8px;border-radius:50%;background:var(--border);transition:background 0.2s;}
.step-dot.active{background:var(--bluelt);}
.step-dot.done{background:var(--green);}
.signup-step{display:none;}
.signup-step.active{display:block;}
.section-hdr{font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--blue);border-bottom:1px solid var(--border);padding-bottom:8px;margin-bottom:14px;}
.company-option{background:var(--bg3);border:1px solid var(--border);padding:10px 12px;margin-bottom:6px;cursor:pointer;transition:all 0.15s;display:flex;align-items:center;justify-content:space-between;}
.company-option:hover,.company-option.selected{border-color:var(--blue);background:var(--bg4);}
.company-option .co-name{font-size:13px;color:var(--text);}
.company-option .co-meta{font-size:11px;color:var(--text3);}
.company-option .co-check{color:var(--green);font-size:16px;opacity:0;}
.company-option.selected .co-check{opacity:1;}
.new-company-form{background:rgba(0,100,200,0.06);border:1px solid rgba(0,119,204,0.2);padding:14px;margin-top:10px;}
.new-company-form .section-hdr{color:var(--text3);}
.spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(0,0,0,0.3);border-top-color:#000;border-radius:50%;animation:spin 0.6s linear infinite;vertical-align:middle;margin-right:6px;}
@keyframes spin{to{transform:rotate(360deg)}}
.auth-footer{margin-top:20px;text-align:center;font-size:11px;color:var(--text3);letter-spacing:1px;}
.auth-footer a{color:var(--text3);text-decoration:none;}
.auth-footer a:hover{color:var(--bluelt);}
