:root{--a:#ff4b16;--ink:#11151a;--muted:#737b84;--line:#e1e5e8}
*{box-sizing:border-box}body.auth-page{margin:0;min-height:100vh;background:linear-gradient(180deg,#fff,#f7f8f9);color:var(--ink)}
button,input{font:inherit}.auth-header{width:min(calc(100% - 48px),1480px);height:78px;margin:auto;display:flex;align-items:center;justify-content:space-between}.auth-header .brand{min-width:0}.auth-header-back{font-size:16px;font-weight:700;color:#5f6770}
.auth-shell{width:min(calc(100% - 48px),1240px);margin:22px auto 60px;display:grid;grid-template-columns:1.05fr .95fr;min-height:650px;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 28px 70px rgba(17,21,26,.09)}
.auth-visual{padding:58px;background:linear-gradient(145deg,#11151a,#222a33);color:#fff}.auth-visual small{color:#ff9c7a;font-size:13px;font-weight:800;letter-spacing:1.3px}.auth-visual h1{margin:16px 0 0;font-size:46px;line-height:1.03;letter-spacing:-2px}.auth-visual>p{margin:17px 0 0;color:#c6cbd0;font-size:16px;line-height:1.65}
.auth-benefits{display:grid;gap:15px;margin-top:36px}.auth-benefit{display:flex;gap:12px;align-items:center}.auth-benefit-icon{width:42px;height:42px;border:1px solid rgba(255,255,255,.14);border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.06)}.auth-benefit-icon svg{width:21px;height:21px;fill:none;stroke:#ff8c66;stroke-width:1.7}.auth-benefit strong{display:block;font-size:15px}.auth-benefit small{display:block;margin-top:4px;color:#abb2b9;font-size:13px;letter-spacing:0;font-weight:500}
.auth-panel{padding:50px 54px;display:flex;flex-direction:column;justify-content:center}.auth-panel-heading small{color:var(--a);font-size:13px;font-weight:800;letter-spacing:1.2px}.auth-panel-heading h2{margin:9px 0 0;font-size:31px}.auth-panel-heading p{margin:10px 0 0;color:var(--muted);font-size:16px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:24px;padding:5px;border-radius:11px;background:#f1f3f4}.auth-tab{height:38px;border:0;border-radius:8px;background:transparent;font-size:15px;font-weight:750}.auth-tab.active{background:#fff;box-shadow:0 4px 12px rgba(17,21,26,.08)}
.auth-form{margin-top:20px}.auth-form[hidden]{display:none}.auth-field{display:flex;flex-direction:column;gap:7px;margin-top:14px}.auth-field>span{font-size:14px;font-weight:750}.auth-input-wrap{height:47px;padding:0 12px;border:1px solid #dce1e5;border-radius:10px;display:flex;align-items:center;gap:9px}.auth-input-wrap:focus-within{border-color:var(--a);box-shadow:0 0 0 3px rgba(255,75,22,.08)}.auth-input-wrap input{width:100%;border:0;outline:0;font-size:16px}.password-toggle{width:34px;height:30px;border:0;border-radius:15px;background:#f3f4f5;font-size:14px}
.auth-row{margin-top:13px;display:flex;justify-content:space-between;align-items:center}.auth-check{display:flex;align-items:center;gap:7px;color:#69717a;font-size:14px}.auth-link-button{border:0;background:none;color:var(--a);font-size:14px;font-weight:750}.auth-submit{width:100%;height:49px;margin-top:18px;border:0;border-radius:10px;background:var(--a);color:#fff;font-size:16px;font-weight:800}.auth-status{min-height:17px;margin-top:12px;font-size:13px}.auth-status.success{color:#178447}
.portal-switcher,.portal-panel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.portal-switcher{width:min(calc(100% - 48px),920px);margin:0 auto 55px}.portal-card,.portal-panel-option{border:1px solid var(--line);border-radius:14px;background:#fff}.portal-card{padding:18px;display:flex;gap:13px}.portal-card.active{border-color:#ffb29a;background:#fff8f4}.portal-card-icon{width:42px;height:42px;border-radius:11px;background:#f2f4f5;display:grid;place-items:center}.portal-card svg,.portal-panel-option svg{width:22px;height:22px;fill:none;stroke:#515961;stroke-width:1.6}.portal-card strong{font-size:15px}.portal-card p{margin:5px 0 0;color:#6c737a;font-size:16px}.portal-card a{display:inline-block;margin-top:9px;color:var(--a);font-size:14px;font-weight:800}
.portal-panel-page{width:min(calc(100% - 48px),960px);margin:35px auto 70px}.portal-panel-intro{text-align:center}.portal-panel-intro small{color:var(--a);font-size:13px;font-weight:800}.portal-panel-intro h1{margin:10px 0 0;font-size:42px}.portal-panel-intro p{margin:11px auto 0;max-width:620px;color:#6b737b;font-size:16px}.portal-panel-grid{max-width:900px;margin:28px auto 0}.portal-panel-option{min-height:280px;padding:24px;display:flex;flex-direction:column}.portal-panel-option h2{margin:18px 0 0;font-size:19px}.portal-panel-option p{margin:9px 0 0;color:#6b737b;font-size:16px}.portal-panel-option ul{padding-left:17px;color:#68717a;font-size:14px;line-height:1.7}.portal-panel-option a{height:44px;margin-top:auto;border-radius:9px;background:#171c22;color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800}.portal-panel-option.customer a{background:var(--a)}.portal-panel-option.internal a{background:#171c22}
.portal-role-badge{align-self:flex-start;display:inline-flex;margin-top:18px;padding:7px 10px;border-radius:999px;background:#fff5f1;color:#a54120;font-size:13px;font-weight:800}.auth-terms{margin-top:16px}.auth-warning{margin-top:16px;padding:11px;border-radius:9px;background:#fff8ec;color:#7e6330;font-size:14px}
@media(max-width:980px){.auth-shell{grid-template-columns:1fr}.portal-switcher,.portal-panel-grid{grid-template-columns:1fr}}@media(max-width:620px){.auth-shell{width:calc(100% - 20px)}.auth-visual{padding:32px 24px}.auth-visual h1{font-size:36px}.auth-panel{padding:32px 22px}.portal-switcher,.portal-panel-page{width:calc(100% - 20px)}}


/* ---------------------------------------------------------------
   Stage 18 — demo login credentials
   --------------------------------------------------------------- */

.demo-credentials{
  margin-top:15px;
  padding:12px 13px;
  border:1px dashed #e7b39f;
  border-radius:10px;
  background:#fff8f4;
  display:grid;
  gap:4px;
  color:#6f5b53;
  font-size:13px;
}

.demo-credentials strong{
  margin-bottom:2px;
  color:#a74221;
  font-size:15px;
}


/* V18.25 — two access types: customer and internal team */
.demo-credentials-multiple{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.demo-credentials-multiple>div{display:grid;gap:4px;padding:10px;border:1px solid #efd6cb;border-radius:8px;background:#fff}.demo-credentials-multiple strong{margin:0}.legacy-login-redirect{display:flex;min-height:100vh;flex-direction:column}.legacy-login-card{width:min(calc(100% - 40px),620px);margin:auto;padding:48px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:0 28px 70px rgba(17,21,26,.09);text-align:center}.legacy-login-icon{width:54px;height:54px;margin:0 auto 18px;border-radius:15px;background:#fff3ee;display:grid;place-items:center}.legacy-login-icon svg{width:26px;height:26px;fill:none;stroke:var(--a);stroke-width:1.7}.legacy-login-card>small{color:var(--a);font-size:13px;font-weight:800;letter-spacing:1.2px}.legacy-login-card h1{margin:12px 0 0;font-size:34px;line-height:1.08;letter-spacing:-1.2px}.legacy-login-card p{margin:15px auto 0;max-width:500px;color:var(--muted);font-size:16px;line-height:1.6}.legacy-login-action{display:flex;align-items:center;justify-content:center;max-width:320px;margin:24px auto 0;text-decoration:none}.portal-card a[aria-current="page"]{cursor:default}.portal-panel-option svg{flex:0 0 auto}.auth-tab:focus-visible,.auth-submit:focus-visible,.portal-card a:focus-visible,.portal-panel-option a:focus-visible,.legacy-login-action:focus-visible{outline:3px solid rgba(255,75,22,.25);outline-offset:3px}
@media(max-width:720px){.demo-credentials-multiple{grid-template-columns:1fr}.legacy-login-card{padding:34px 24px}.legacy-login-card h1{font-size:30px}}

/* V18.26 — clean, form-first mobile access */
.auth-mobile-switch{display:none}
.demo-credentials summary{cursor:pointer;list-style:none;font-weight:850;color:#a74221}
.demo-credentials summary::-webkit-details-marker{display:none}
.demo-credentials summary::after{content:"+";float:right;color:#8b5d4d}
.demo-credentials[open] summary::after{content:"−"}
.demo-credentials>div{display:grid;gap:4px}
.demo-credentials-multiple>summary{grid-column:1 / -1}

@media(max-width:620px){
  body.auth-page{min-height:100svh;background:#fff;padding-bottom:max(24px,env(safe-area-inset-bottom))}
  .auth-header{position:sticky;top:0;z-index:30;width:100%;height:62px;padding:0 16px;border-bottom:1px solid #eceff1;background:rgba(255,255,255,.97);backdrop-filter:blur(14px)}
  .auth-header .brand img{width:23px}.auth-header .brand-copy strong{font-size:16px}.auth-header .brand-copy small{display:none}
  .auth-header-back{display:inline-flex;align-items:center;min-height:42px;padding:0 4px;font-size:0;color:#5f6770}
  .auth-header-back::before{content:"← Back";font-size:15px;font-weight:750}
  .auth-shell{width:100%;min-height:0;margin:0;display:block;border:0;border-radius:0;box-shadow:none;background:#fff}
  .auth-visual{display:none}
  .auth-panel{min-height:calc(100svh - 62px);padding:28px 18px 34px;display:block}
  .auth-panel-heading small{font-size:12px;letter-spacing:1px}
  .auth-panel-heading h2{margin-top:8px;font-size:28px;line-height:1.08;letter-spacing:-.8px}
  .auth-panel-heading p{margin-top:8px;font-size:16px;line-height:1.5}
  .auth-mobile-switch{display:inline-flex;margin-top:12px;color:var(--a);font-size:15px;font-weight:800}
  .portal-role-badge{margin-top:16px;padding:6px 9px;font-size:12px}
  .auth-tabs{margin-top:20px;padding:4px}.auth-tab{height:42px;font-size:15px}
  .auth-form{margin-top:18px}
  .auth-field{gap:8px;margin-top:14px}.auth-field>span{font-size:15px}
  .auth-input-wrap{height:52px;padding:0 13px;border-radius:12px}.auth-input-wrap input{font-size:16px}
  .password-toggle{width:auto;min-width:48px;height:34px;padding:0 10px}
  .auth-warning{margin-top:14px;padding:10px 11px;font-size:13px;line-height:1.45}
  .auth-row{margin-top:15px;gap:10px;flex-wrap:wrap}.auth-check,.auth-link-button{font-size:14px}
  .auth-submit{height:52px;margin-top:17px;border-radius:12px;font-size:16px}
  .auth-status{font-size:14px;line-height:1.45}
  .demo-credentials{margin-top:14px;padding:12px;border-style:solid;background:#fffaf8;font-size:13px}
  .demo-credentials>summary{min-height:24px}
  .demo-credentials>div{margin-top:10px;padding-top:10px;border-top:1px solid #efd9d0}
  .demo-credentials-multiple{display:block}
  .demo-credentials-multiple>div{margin-top:10px;padding:10px;border:1px solid #efd6cb;border-radius:9px;background:#fff}
  .portal-switcher{display:none}

  .portal-panel-page{width:100%;margin:0;padding:26px 16px 44px}
  .portal-panel-intro{text-align:left}
  .portal-panel-intro small{font-size:12px;letter-spacing:1px}
  .portal-panel-intro h1{margin-top:8px;font-size:30px;line-height:1.08;letter-spacing:-.9px}
  .portal-panel-intro p{margin:8px 0 0;max-width:none;font-size:16px;line-height:1.5}
  .portal-panel-grid{grid-template-columns:1fr;gap:10px;margin-top:22px}
  .portal-panel-option{min-height:0;padding:17px;border-radius:15px;display:grid;grid-template-columns:42px minmax(0,1fr);column-gap:12px;align-items:center}
  .portal-panel-option svg{grid-row:1 / span 2;width:23px;height:23px;padding:9px;box-sizing:content-box;border-radius:12px;background:#f3f5f6}
  .portal-panel-option h2{margin:0;font-size:18px}
  .portal-panel-option p{margin:4px 0 0;font-size:15px;line-height:1.45}
  .portal-panel-option ul{display:none}
  .portal-panel-option a{grid-column:1 / -1;height:50px;margin-top:15px;border-radius:11px;font-size:15px}
}