.login-error {
  margin: 0 0 15px;
  padding: 10px 12px;
  border: 1px solid #f2c8cc;
  border-radius: 8px;
  background: #fff1f2;
  color: #a92f3c;
  font-size: 11px;
  font-weight: 700;
}

.login .brand-icon {
  width: 42px;
  height: 42px;
}

.login button {
  margin-top: 20px;
}

@media (max-width: 760px) {
  .login form {
    width: min(390px, 100%);
  }
}

/* GFI MANAGEMENT INSIGHT typography and mobile containment */
html,body{max-width:100%;overflow-x:hidden}
body,button,input{font-family:"Noto Sans JP","Yu Gothic UI","Yu Gothic","Hiragino Kaku Gothic ProN","Meiryo",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
.login *{font-family:"Noto Sans JP","Yu Gothic UI","Yu Gothic","Hiragino Kaku Gothic ProN","Meiryo",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
.brand b{font-weight:900!important;letter-spacing:.055em!important}
.brand small{font-family:inherit!important;letter-spacing:.1em}
@media(max-width:760px){
  html,body{height:100%;overflow:hidden}
  body{background:linear-gradient(165deg,#eaf5fb 0%,#f7fafc 42%,#edf4f7 100%)}
  .login-layout{display:grid;grid-template-columns:1fr;grid-template-rows:minmax(145px,25vh) minmax(0,1fr);width:100%;height:100svh;min-height:0;overflow:hidden}
  .visual{display:flex;min-height:0;padding:max(14px,env(safe-area-inset-top)) 20px 13px;background:linear-gradient(135deg,rgba(7,31,47,.98),rgba(16,86,124,.94)),radial-gradient(circle at 80% 20%,#2399d0,transparent 45%)}
  .visual-inner{display:grid;grid-template-columns:minmax(82px,27vw) minmax(0,1fr);grid-template-rows:auto auto auto auto;column-gap:17px;align-content:center;width:min(520px,100%);margin:auto}
  .visual .hero-logo{grid-column:1;grid-row:1/5;align-self:center;width:100%;max-width:125px;margin:0;filter:drop-shadow(0 7px 17px rgba(0,0,0,.17))}
  .visual-inner>p:first-of-type{grid-column:2;grid-row:1;margin:0 0 4px;font-size:8px;font-weight:800;letter-spacing:.12em;color:#91c4de}
  .visual h1{grid-column:2;grid-row:2;margin:0;font-size:clamp(19px,5.8vw,25px);font-weight:900;line-height:1.3;letter-spacing:-.025em}
  .visual .line{grid-column:2;grid-row:3;width:32px;margin:7px 0;border-width:2px}
  .visual .lead{grid-column:2;grid-row:4;margin:0;color:#c7dce7;font-size:clamp(9px,2.8vw,11px);font-weight:600;line-height:1.55}
  .visual footer{display:none}
  .login{min-height:0;padding:12px 16px max(14px,env(safe-area-inset-bottom));align-items:center;background:transparent;overflow:hidden}
  .login form{width:min(420px,100%);padding:22px 23px 18px;border:1px solid #d7e5ec;border-top:4px solid #1487c8;border-radius:17px;box-shadow:0 16px 38px rgba(12,55,80,.13)}
  .brand{margin-bottom:15px}.brand b{font-size:21px!important}.brand small{font-size:8px!important;font-weight:800!important}
  .login .brand-icon{width:39px;height:39px}
  .login h2{font-size:23px;line-height:1.3}.note{font-size:11px;line-height:1.55;margin:4px 0 14px}
  .login>form>label span{font-size:13px}.login input[type=text],.login input[type=password],.login>form>label input{min-height:50px;font-size:16px;padding:13px 14px}
  .login>form>label{margin-top:11px}
  .login button{min-height:49px;margin-top:15px;font-size:15px;font-weight:800;border-radius:10px}
  .security{font-size:9px;line-height:1.4;margin-top:12px}
  .login-error{margin-bottom:10px;padding:8px 10px}
}
@media(max-width:370px){
  .visual-inner{grid-template-columns:74px minmax(0,1fr);column-gap:13px}
  .visual .lead{font-size:8.5px}.login{padding-left:10px;padding-right:10px}.login form{padding-left:18px;padding-right:18px}
}
@media(max-height:700px) and (max-width:760px){
  .login-layout{grid-template-rows:128px minmax(0,1fr)}
  .visual{padding-top:9px;padding-bottom:8px}.visual h1{font-size:18px}.visual .lead{font-size:8.5px}.visual .line{margin:4px 0}
  .login{padding-top:8px;padding-bottom:8px}.login form{padding-top:15px;padding-bottom:12px}.brand{margin-bottom:9px}.login .brand-icon{width:34px;height:34px}.brand b{font-size:19px!important}
  .eyebrow{margin-bottom:2px}.login h2{font-size:20px}.note{margin-bottom:7px}.login>form>label{margin-top:7px}.login input[type=text],.login input[type=password],.login>form>label input{min-height:44px;padding:9px 12px}.login button{min-height:44px;margin-top:10px}.security{margin-top:7px}
}