/* ===== REV H6d TOP OVERRIDES (beat legacy auth.css) ===== */
.auth-container{ max-width:min(1160px,100%) !important; display:grid !important; grid-template-columns:1.15fr 1fr !important; }
/* ============================================================
   MANIFEST LOGIN — Option A split-panel sign-in
   Pairs with manifest-tokens.css. Keeps every class/id auth.js
   touches: .auth-alert(.show,.auth-alert-*), #loginBtn(.loading,
   .btn-text,.spinner), .auth-input-wrapper, .auth-password-toggle.
   ============================================================ */
/* superseded by Rev H5 rules at the bottom of this file */
.auth-stars{ display:none; }               /* auth.js writes stars here; hidden in Manifest */
/* superseded by Rev H5 rules at the bottom of this file */
@media (max-width:900px){ .auth-container{ grid-template-columns:1fr; } /* superseded by H6c */ }
/* brand side */
/* old base brand rule removed — Rev H6c unified below */
/* superseded by Rev H5 rules at the bottom of this file */
/* unified below */
/* unified below */
/* superseded */
/* superseded */
/* superseded */
/* superseded */
/* superseded */
/* superseded */
/* superseded */
/* form side */
/* superseded */
/* unified below */
/* unified below */
/* unified below */
/* unified below */
.m-form .m-lead{ color:var(--text-muted); font-size:13.5px; margin:7px 0 24px; }
.m-logo{ display:block; height:44px; width:44px; object-fit:contain; margin-bottom:18px; }
/* form groups (auth.js-compatible wrappers) */
.auth-form-group{ margin-bottom:16px; }
.auth-form-label{ font-size:12.5px; font-weight:600; color:var(--text-muted); display:block; margin-bottom:6px; }
.auth-input-wrapper{ position:relative; display:flex; align-items:center; }
.auth-input{
  width:100%; background:var(--input-bg); border:1px solid var(--fld); border-radius:7px;
  font:400 14px/1.4 Inter,sans-serif; color:var(--text-main); padding:12px 44px 12px 13px;
  transition:border-color .12s, box-shadow .12s;
}
.auth-input::placeholder{ color:var(--faint); }
.auth-input:hover{ border-color:var(--teal); }
.auth-input:focus{ outline:none; border-color:var(--input-focus); box-shadow:var(--focus-ring); }
.auth-input-icon{ display:none; }
.auth-password-toggle{
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  background:none; border:none; color:var(--faint); cursor:pointer; padding:6px; display:flex; border-radius:6px;
}
.auth-password-toggle:hover{ color:var(--teal); }
/* checkbox row */
.auth-checkbox-row{ display:flex; justify-content:space-between; align-items:center; margin:16px 0 20px; font-size:13.5px; flex-wrap:wrap; gap:10px; }
.auth-checkbox{ display:flex; gap:9px; align-items:center; color:var(--text-muted); cursor:pointer; }
.auth-checkbox input{ position:absolute; opacity:0; }
.auth-checkbox span{ position:relative; padding-left:26px; white-space:nowrap; }
.auth-checkbox span::before{
  content:""; position:absolute; left:0; top:0; width:17px; height:17px; border:1.5px solid var(--fld);
  border-radius:5px; background:var(--input-bg); transition:all .12s;
}
.auth-checkbox input:checked + span::before{ background:var(--teal); border-color:var(--teal); }
.auth-checkbox input:checked + span::after{
  content:""; position:absolute; left:5px; top:2px; width:4px; height:8px;
  border:solid var(--primary-contrast,#fff); border-width:0 2px 2px 0; transform:rotate(42deg);
}
.auth-checkbox input:focus-visible + span::before{ box-shadow:var(--focus-ring); }
.auth-forgot-link{ color:var(--teal); font-weight:600; text-decoration:none; }
.auth-forgot-link:hover{ text-decoration:underline; }
/* button + spinner (auth.js toggles .loading) */
.auth-btn{
  width:100%; display:inline-flex; align-items:center; justify-content:center; gap:9px;
  background:var(--primary); color:var(--primary-contrast); border:1px solid var(--primary);
  border-radius:7px; font:600 14.5px/1 Inter,sans-serif; padding:13px; cursor:pointer; transition:all .15s ease;
}
.auth-btn:hover{ background:var(--primary-hover); border-color:var(--primary-hover); }
.auth-btn:active{ transform:translateY(1px); }
.auth-btn .spinner{
  width:15px; height:15px; border:2px solid color-mix(in srgb, var(--primary-contrast) 40%, transparent);
  border-top-color:var(--primary-contrast); border-radius:50%; display:none; animation:authspin .7s linear infinite;
}
@keyframes authspin{ to{ transform:rotate(360deg); } }
.auth-btn.loading{ pointer-events:none; opacity:.85; }
.auth-btn.loading .btn-text{ opacity:.6; }
.auth-btn.loading .spinner{ display:inline-block; }
/* alert (auth.js sets auth-alert auth-alert-{type} show) */
.auth-alert{ display:none; font-size:12.5px; padding:10px 12px; border-radius:7px; margin-bottom:16px; border:1px solid transparent; }
.auth-alert.show{ display:block; animation:authshake .3s; }
.auth-alert-error{ background:var(--danger-bg); color:var(--danger); border-color:color-mix(in srgb, var(--danger) 35%, transparent); }
.auth-alert-success{ background:var(--success-bg); color:var(--success); border-color:color-mix(in srgb, var(--success) 35%, transparent); }
.auth-alert-info{ background:var(--info-bg); color:var(--info); border-color:color-mix(in srgb, var(--info) 35%, transparent); }
@keyframes authshake{ 25%{ transform:translateX(-4px);} 75%{ transform:translateX(4px);} }
/* divider + footer */
.auth-divider{ text-align:center; color:var(--faint); font-size:12px; margin:20px 0 4px; position:relative; }
.auth-divider::before, .auth-divider::after{ content:""; position:absolute; top:50%; width:42%; height:1px; background:var(--border-color); }
.auth-divider::before{ left:0; } .auth-divider::after{ right:0; }
.auth-footer{ text-align:center; font-size:13.5px; color:var(--text-muted); margin-top:14px; }
.auth-footer a{ color:var(--teal); font-weight:600; text-decoration:none; }
.auth-footer a:hover{ text-decoration:underline; }
/* legacy guard: neutralize auth.css body paint inside the Manifest layout */
.auth-page, .auth-page .auth-container, .auth-page /* superseded by H6c */
.auth-page a.auth-forgot-link, .auth-page .auth-footer a{ color:var(--teal); }
/* orbs: retired by Manifest */
.auth-orb{ display:none; }
@media (prefers-reduced-motion:reduce){ *{ animation:none!important; transition:none!important; } }

/* ============================================================
   FULL-BLEED FIX — beat legacy auth.css card clamps
   (old .auth-container{max-width:460px} + centered body squeezed
   the Manifest split panel; these rules restore 100% width)
   ============================================================ */
body{
  margin:0; min-height:100vh; display:block;
  background:var(--bg-color);
}
/* REV H6b — this block now defers entirely to the Option F rules at the bottom
   (it previously forced flex-column + 1.05fr split at 100vh, stacking the panels) */
@media (max-width:900px){
  .auth-page .auth-container{ grid-template-columns:1fr; }
}

/* ============================================================
   REGISTER — two-up rows + password strength meter (Manifest)
   ============================================================ */
.m-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:560px){ .m-row{ grid-template-columns:1fr; } }
.auth-page .auth-form-group{ margin-bottom:14px; }
/* beat legacy auth.css strength meter (its --auth-* vars are the old indigo theme) */
.auth-page .password-strength{ display:none; margin-top:8px; }
.auth-page .password-strength.show{ display:block; }
.auth-page .strength-bars{ display:flex; gap:6px; margin-bottom:5px; }
.auth-page .strength-bar{
  flex:1; height:4px; border-radius:3px;
  background:var(--line) !important; box-shadow:none !important; border:none !important;
  transition:background .2s ease;
}
.auth-page .strength-bar.active.weak{ background:var(--danger) !important; }
.auth-page .strength-bar.active.medium{ background:var(--warning) !important; }
.auth-page .strength-bar.active.strong{ background:var(--success) !important; }
.auth-page .strength-text{
  font-size:11.5px; font-weight:600; color:var(--text-muted) !important;
}
.auth-page .strength-text.weak{ color:var(--danger) !important; }
.auth-page .strength-text.medium{ color:var(--warning) !important; }
.auth-page .strength-text.strong{ color:var(--success) !important; }

/* ===== Rev H5 (Option F): centered framed card + Port of Mombasa scene ===== */
.auth-page{ min-height:100vh; display:flex !important; flex-direction:row !important; align-items:center; justify-content:center; padding:26px 30px;
  background:radial-gradient(1100px 640px at 72% -8%, rgba(20,184,166,.08), transparent 60%), var(--bg-color); }
.auth-container{ position:relative; width:min(1160px,100%); max-width:min(1160px,100%) !important; border-radius:22px; overflow:hidden;
  display:grid !important; grid-template-columns:1.15fr 1fr !important; min-height:600px; margin:0 auto;
  border:1.5px solid rgba(20,184,166,.5);
  box-shadow:0 0 24px rgba(20,184,166,.14), 0 34px 90px rgba(0,0,0,.45); }
/* superseded by H6c */
[data-theme="light"] .m-brand, .m-brand:where(:not([data-theme="dark"] *)){ }
html[data-theme="light"] /* superseded by H6c */
/* unified below */
/* unified below */
/* superseded by H6c */
html[data-theme="light"] /* superseded by H6c */
/* superseded by H6c */
html[data-theme="light"] /* superseded by H6c */
/* superseded by H6c */
/* superseded by H6c */
html[data-theme="light"] /* superseded by H6c */
/* superseded */
/* superseded by H6c */
/* port scene */
.m-brand .m-route{ margin:24px 0 4px; width:100%; position:relative; z-index:1; }
.m-brand .m-route svg{ width:100%; height:auto; display:block; overflow:visible; }
.m-route .water{ fill:#0a2530; } .m-route .quay{ fill:#16242e; }
.m-route .crane{ stroke:#2dd4bf; stroke-width:2; fill:none; }
.m-route .road{ stroke:#22303c; stroke-width:16; } .m-route .road-dash{ stroke:#2dd4bf; stroke-width:1.5; stroke-dasharray:4 6; opacity:.5; }
.m-route .cont{ fill:#134e4a; rx:1.5; }
.m-route .hull2{ fill:#254b60; } .m-route .bridge{ fill:#2dd4bf; }
.m-route .ship{ animation:sail 16s ease-in-out infinite; }
.m-route .ship path{ fill:#1f3a4d; }
@keyframes sail{ 0%{ transform:translateX(-150px);} 55%,100%{ transform:translateX(0);} }
.m-route .spreader1{ fill:#2dd4bf; animation:sp1 3.2s ease-in-out infinite; }
.m-route .spreader2{ fill:#2dd4bf; animation:sp1 3.2s ease-in-out 1.6s infinite; }
@keyframes sp1{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(7px);} }
.m-route .c1{ animation:light 8s infinite; } .m-route .c2{ animation:light 8s .5s infinite; }
.m-route .c3{ animation:light 8s 1s infinite; } .m-route .c4{ animation:light 8s 1.5s infinite; }
.m-route .c5{ animation:light 8s 2s infinite; } .m-route .c6{ animation:light 8s 2.5s infinite; }
.m-route .c7{ animation:light 8s 3s infinite; } .m-route .c8{ animation:light 8s 3.5s infinite; }
@keyframes light{ 0%,15%{ opacity:.25;} 30%,70%{ opacity:1;} 85%,100%{ opacity:.25;} }
.m-route .truck{ animation:drive 11s linear infinite; }
@keyframes drive{ 0%{ transform:translate(0,0); opacity:0;} 8%{ opacity:1;} 80%{ opacity:1;} 100%{ transform:translate(190px,-64px); opacity:0;} }
.m-route .wake{ animation:wake 16s infinite; fill:none; }
@keyframes wake{ 0%,55%{ opacity:0;} 62%,90%{ opacity:.5;} 100%{ opacity:0;} }
.m-route .rlt{ font:700 9px Inter,sans-serif; letter-spacing:.12em; fill:#5d7290; }
.m-route .rlt.dim{ fill:#2a5b66; }
html[data-theme="light"] .m-route .water{ fill:#bfe0dc; } html[data-theme="light"] .m-route .quay{ fill:#d5e8e4; }
/* form side */
/* superseded by H6c */
/* unified below */
/* unified below */
/* unified below */
.m-logo{ display:block; height:44px; width:44px; object-fit:contain; margin-bottom:18px; }
@media (max-width:900px){
  .auth-page{ padding:12px; } .auth-container{ grid-template-columns:1fr; border-radius:16px; }
  /* superseded by H6c */
}
@media (prefers-reduced-motion: reduce){
  .m-route .ship, .m-route .spreader1, .m-route .spreader2, .m-route .truck,
  .m-route .c1,.m-route .c2,.m-route .c3,.m-route .c4,.m-route .c5,.m-route .c6,.m-route .c7,.m-route .c8, .m-route .wake{ animation:none !important; }
  .m-route .c1,.m-route .c3,.m-route .c5,.m-route .c7{ opacity:1; }
}

/* ===== Rev H6 — Concept B skin: grid-map brand column + glass form card ===== */
/* brand column: faint grid-map backdrop + Concept B rhythm */
/* superseded by H6c */
.m-brand::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.55;
  background-image:linear-gradient(to right, rgba(148,163,184,.07) 1px, transparent 1px),
                   linear-gradient(to bottom, rgba(148,163,184,.07) 1px, transparent 1px);
  background-size:3.5rem 3.5rem;
  -webkit-mask-image:radial-gradient(ellipse 65% 55% at 50% 0%, #000 65%, transparent 100%);
          mask-image:radial-gradient(ellipse 65% 55% at 50% 0%, #000 65%, transparent 100%); }
.m-brand > *{ position:relative; z-index:1; }
html[data-theme="light"] .m-brand::before{ opacity:.35;
  background-image:linear-gradient(to right, rgba(13,148,136,.12) 1px, transparent 1px),
                   linear-gradient(to bottom, rgba(13,148,136,.12) 1px, transparent 1px); }
/* superseded by H6c */
.m-cities i{ width:4px; height:4px; border-radius:50%; background:#334155; }
html[data-theme="light"] /* superseded by H6c */
/* superseded by H6c */
html[data-theme="light"] /* superseded by H6c */
/* metric footer: Concept B bordered grid */
/* superseded by H6c */
/* superseded by H6c */
.m-stats div:nth-child(3) b{ color:#2dd4bf; }
/* superseded by H6c */
/* glass form card (replaces flat inner frame) */
/* superseded by H6c */
.m-form::before{
  inset:0; left:50%; transform:translateX(-50%); width:min(440px,92%); height:auto; aspect-ratio:auto;
  border-radius:20px; border:1px solid rgba(20,184,166,.30);
  background:linear-gradient(180deg, rgba(30,41,59,.42), rgba(15,26,43,.30));
  box-shadow:0 0 26px rgba(20,184,166,.16);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  transition:border-color .3s;
}
.m-form:hover::before{ border-color:rgba(20,184,166,.5); }
html[data-theme="light"] .m-form::before{ background:rgba(255,255,255,.72); }
/* superseded by H6c */
/* inputs: dark + teal focus ring (Concept B) */
.auth-page .m-form .auth-input-wrapper{ background:rgba(2,6,23,.65); border:1px solid rgba(51,65,85,.6); border-radius:12px; transition:border-color .2s, box-shadow .2s; }
.auth-page .m-form .auth-input-wrapper:focus-within{ border-color:#14b8a6; box-shadow:0 0 0 3px rgba(20,184,166,.15); }
.auth-page .m-form .auth-input{ background:transparent; border:none; box-shadow:none !important; }
.auth-page .m-form .auth-input::placeholder{ color:#475569; }
html[data-theme="light"] .m-form .auth-input-wrapper{ background:#fff; border-color:#d5e3e0; }
/* submit button: Concept B teal with soft glow */
.auth-page .m-form .auth-btn{ border-radius:12px; box-shadow:0 10px 24px rgba(20,184,166,.18); transition:transform .15s, box-shadow .2s, background .2s; }
.auth-page .m-form .auth-btn:hover{ box-shadow:0 12px 28px rgba(20,184,166,.28); }
.auth-page .m-form .auth-btn:active{ transform:scale(.99); }
/* forgot link + remember-me label */
.auth-page .m-form .auth-forgot-link{ font-size:12px; font-weight:600; }
@media (max-width:900px){ .m-form::before{ display:none; } /* superseded by H6c */ }

/* ===== Rev H6c — UNIFIED brand/form rules (single source of truth) ===== */
.auth-container{ display:grid !important; grid-template-columns:1.15fr 1fr !important; }
.m-brand{ background:linear-gradient(160deg,#0e1d24,#0b1a21 60%,#091720); color:#e2e8f0;
  padding:40px 44px; display:flex; flex-direction:column; align-items:stretch; width:100%; box-sizing:border-box; }
html[data-theme="light"] .m-brand{ background:linear-gradient(160deg,#E7F2F0,#D9EDEA 55%,#CBE4E0); color:var(--teal-ink); }
.m-brand > *{ width:100%; }
.m-cities{ display:flex; align-items:center; gap:10px; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#2dd4bf; margin:0 0 16px; }
.m-cities span{ white-space:nowrap; }
.m-cities i{ width:4px; height:4px; border-radius:50%; background:#334155; flex:none; }
html[data-theme="light"] .m-cities{ color:var(--teal-ink); }
.m-mark{ display:flex; align-items:center; gap:12px; font-weight:800; font-size:16px; }
.m-mark img{ height:34px; width:34px; object-fit:contain; }
.m-route{ margin:22px 0 0; width:100%; }
.m-route svg{ width:100%; height:auto; display:block; }
.m-eyebrow{ font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:#2dd4bf; margin:20px 0 0; }
html[data-theme="light"] .m-eyebrow{ color:var(--teal-ink); }
.m-brand h2{ font-size:clamp(26px,2.4vw,32px); line-height:1.15; letter-spacing:-.02em; font-weight:800; margin:10px 0 0; color:#fff !important; }
html[data-theme="light"] .m-brand h2{ color:var(--teal-ink) !important; }
.m-sub{ margin-top:12px; color:#94a3b8; font-size:13.5px; max-width:46ch; line-height:1.6; }
html[data-theme="light"] .m-brand .m-sub{ color:var(--teal-ink); opacity:.8; }
.m-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:22px; padding-top:20px; border-top:1px solid rgba(148,163,184,.15); }
.m-stats b{ font-size:19px; font-weight:800; display:block; color:#fff; }
.m-stats div:nth-child(3) b{ color:#2dd4bf; }
html[data-theme="light"] .m-stats b{ color:var(--teal-ink); }
.m-stats span{ font-size:10.5px; opacity:.6; margin-top:2px; display:block; }
.m-foot{ margin-top:auto; padding-top:24px; font-size:11.5px; opacity:.7; display:flex; gap:14px; flex-wrap:wrap; }
.m-form{ display:flex !important; flex-direction:row; align-items:center; justify-content:center; padding:44px; width:100%; box-sizing:border-box; }
.m-form .box{ width:100%; max-width:375px; }
.auth-page .m-form h1{ color:#fff !important; }
.m-form h1{ font-size:23px; font-weight:800; letter-spacing:-.02em; color:#fff !important; }
.auth-page .m-form .m-lead{ color:var(--text-muted); }