/* 188 is scoped to login content. ERP header and navigation are untouched. */
#w150Login .w188-methods{display:flex;background:#f3f4f6;border-radius:10px;padding:4px;gap:4px;margin-top:20px}
#w150Login .w188-methods button{flex:1;min-width:0;min-height:44px;background:transparent;border:0;border-radius:8px;color:#6b7280;font:inherit;font-weight:700}
#w150Login .w188-methods button.selected{background:#fff;color:#191919;box-shadow:0 1px 4px #00000012}
#w150Login .w188-approval{margin-top:12px}#w150Login .w188-comparison{display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);align-items:center;gap:8px}
#w150Login .w188-comparison #w150Number{gap:2px;margin:0;font-size:52px;color:#191919}#w150Login .w188-comparison #w150Number>span{background:transparent;border:0;width:auto;height:auto;border-radius:0;color:inherit}
#w150Login .w188-equal{text-align:center;color:#9ca3af;font-size:24px}#w150Login .without-number{display:flex;justify-content:center}#w150Login .without-number>.w188-equal{display:none}
#w150Login .w188-phone{max-width:165px;width:100%;border:2px solid #d1d5db;border-radius:16px;padding:12px 8px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;box-sizing:border-box;background:#fff}
#w150Login .w188-phone-number{font-size:36px;line-height:1.1}#w150Login .w188-phone strong{font-size:12px;white-space:pre-line}#w150Login .w188-phone small{font-size:10px;color:#6b7280}
#w150Login .w188-phone-approve{display:block;background:#2db400;color:white;border-radius:6px;padding:8px 4px;font-size:11px;font-weight:700;width:100%;box-sizing:border-box}
#w150Login .w188-steps{padding:0 0 0 22px;line-height:1.6;font-size:13px;color:#374151;margin:16px 0 8px}#w150Login .w188-steps li{padding-left:2px;margin-bottom:6px}
#w150Login .w188-caution{font-size:11px;color:#9a6700;line-height:1.5}#w150Login #w150Countdown{margin:10px 0;font-size:13px}
#w150Login .works-otp{display:grid;grid-template-columns:repeat(var(--otp-cells,6),minmax(0,1fr));gap:6px;width:100%}#w150Login .works-otp input{width:100%;min-width:0;height:54px;font-size:26px;border-radius:10px;box-sizing:border-box}
#w150Login .works-otp.w188-code-fallback input{font-size:22px;letter-spacing:4px}#w150Login .w156-done>button{width:100%;min-height:54px;margin-top:24px;background:#2db400;color:#fff;border:0;border-radius:12px;font:inherit;font-weight:700}
#w150Login [hidden]{display:none!important}
/* 190: authentication is chosen before issuing a request, independently of phone/ID input. */
#w150Login .w190-auth-methods{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin-top:16px}
#w150Login .w190-auth-methods button{min-height:44px;width:100%;min-width:0;border:1px solid #d1d5db;border-radius:10px;background:#fff;color:#374151;text-align:left;padding:10px 12px;font:inherit;font-size:14px}
#w150Login .w190-auth-methods button:before{content:'○';margin-right:8px;color:#9ca3af}
#w150Login .w190-auth-methods button.selected{border-color:#2db400;background:#f4fbf1;color:#166534}
#w150Login .w190-auth-methods button.selected:before{content:'●';color:#2db400}
#w150Login .w190-sms-notice{font-size:12px;color:#92400e;line-height:1.5}

/* 213-4: one native OTP input receives typing, SMS autofill and paste; boxes are presentation only. */
#w150Login .works-otp{position:relative}
#w150Login .works-otp [data-otp-input]{position:absolute;inset:0;width:100%;height:100%;opacity:.01;color:transparent;caret-color:transparent;font-size:16px;z-index:1;border:0;letter-spacing:0}
#w150Login .works-otp .w213-otp-cell{display:grid;place-items:center;min-width:0;height:54px;border:2px solid #dadce0;border-radius:10px;box-sizing:border-box;font-size:26px;font-weight:800;pointer-events:none}
#w150Login .works-otp:focus-within .w213-otp-cell.active{border-color:#2db400;box-shadow:0 0 0 3px #2db40022}
#w150Login .works-otp.w188-code-fallback .w213-otp-cell{letter-spacing:4px;font-size:22px}

/* 214: form-associated username/current-password fields; credentials are never restored by the app. */
#w150Login .w214-password-row{display:flex;align-items:center;gap:8px;width:100%;min-width:0;border-bottom:2px solid #dadce0}
#w150Login .w214-password-row:focus-within{border-color:#2db400}
#w150Login .w214-password-row input{flex:1;min-width:0;width:0;height:54px;border:0;border-radius:0;background:#fff;font-size:18px;padding:0 2px;outline:0}
#w150Login .w214-password-row button{flex:none;width:44px;height:44px;border:0;background:transparent;font-size:20px}
#w150Login .w156-actions button:disabled{opacity:.45}

/* 214 revised design: Works content only; ERP chrome is unchanged. */
#w150App #w150Login{padding:20px;background:#fff;gap:0}
#w150App #w150Login .w159-login-content{min-width:0;flex:1}
#w150App #w150Login h1{font-size:22px;line-height:1.35;margin:12px 0 8px}
#w150App #w150Login .w159-login-content>p{color:#4b5563;font-size:13.5px;line-height:1.5}
#w150App #w150Login .w156-mark{margin-top:8px;width:52px;height:52px;border-radius:16px;background:#dbeafe;box-shadow:none}#w150App #w150Login .w156-mark{margin-top:8px;width:52px;height:52px;border-radius:16px;background:#FFF4D1;box-shadow:none}
#w150App #w150Login .w214-back{display:block;padding:0;min-height:44px;border:0;background:transparent;color:#4b5563;font:inherit;font-size:13px;text-align:left;margin-bottom:8px}
#w150App #w150Login .w214-choices{display:flex;flex-direction:column;gap:12px;margin-top:22px}
#w150App #w150Login .w214-method{display:flex;align-items:center;gap:12px;min-height:88px;width:100%;padding:14px;border:1.5px solid #e5e7eb;border-radius:16px;background:#fff;text-align:left;font:inherit;color:#111827}
#w150App #w150Login .w214-method.recommended{border-color:#2563eb;background:#f8fbff}#w150App #w150Login .w214-method.recommended{border-color:#FFC21A;background:#FFF4D1}
#w150App #w150Login .w214-method>span:nth-child(2){flex:1;min-width:0}
#w150App #w150Login .w214-method b,#w150App #w150Login .w214-method small{display:block}
#w150App #w150Login .w214-method b{font-size:15px}#w150App #w150Login .w214-method small{font-size:12px;color:#4b5563;margin-top:4px}
#w150App #w150Login .w214-method em{font-size:10px;font-style:normal;border-radius:6px;background:#2563eb;color:white;padding:2px 6px;margin-left:7px}#w150App #w150Login .w214-method em{font-size:10px;font-style:normal;border-radius:6px;background:#FFC21A;color:#2B1D00;padding:2px 6px;margin-left:7px}
#w150App #w150Login .w214-method-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px;background:#eff6ff;font-size:22px}#w150App #w150Login .w214-method-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px;background:#FFF4D1;font-size:22px}
#w150App #w150Login .w214-field-label{display:block;width:100%;font-size:12.5px;font-weight:700;color:#4b5563;margin:10px 0 0}
#w150App #w150Login .w214-id-row,#w150App #w150Login .w214-password-row{display:flex;align-items:center;width:100%;min-width:0;height:54px;padding:0 12px;box-sizing:border-box;border:2px solid #e5e7eb;border-radius:14px;background:#fff}
#w150App #w150Login .w214-id-row:focus-within,#w150App #w150Login .w214-password-row:focus-within{border-color:#2563eb;box-shadow:0 0 0 4px #dbeafe}#w150App #w150Login .w214-id-row:focus-within,#w150App #w150Login .w214-password-row:focus-within{border-color:#FFC21A;box-shadow:0 0 0 4px #FFF4D1}
#w150App #w150Login #w150Account,#w150App #w150Login .w214-password-row input{border:0;box-shadow:none;height:48px;font-size:16px;background:transparent}
#w150App #w150Login .works-domain{font-size:12px;flex:none;color:#9ca3af}
#w150App #w150Login .w214-safe{font-size:12px;line-height:1.5;color:#6b7280;margin:12px 0}
#w150App #w150Login .w214-alternatives{display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;color:#6b7280}
#w150App #w150Login .w214-alternatives button{min-height:44px;border:0;background:transparent;color:#2563eb;font:inherit;font-weight:700}#w150App #w150Login .w214-alternatives button{min-height:44px;border:0;background:transparent;color:#946200;font:inherit;font-weight:700}
#w150App #w150Login .w156-actions{margin-top:auto;padding-top:20px;position:sticky;bottom:0;background:#fff}
#w150App #w150Login .w156-actions .primary{height:54px;background:#2563eb;border-radius:14px}#w150App #w150Login .w156-actions .primary{height:54px;background:#FFC21A;border-radius:14px;color:#2B1D00}
#w150App #w150Login .w156-actions .primary:disabled{background:#c7d2fe;opacity:1}#w150App #w150Login .w156-actions .primary:disabled{background:#FFF4D1;opacity:1}
#w150App #w150Login .works-otp{gap:12px;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:26px}
#w150App #w150Login .works-otp .w213-otp-cell{height:68px;border-radius:16px;border:2px solid transparent;background:#f3f4f6;font-size:30px;font-weight:800}
#w150App #w150Login .works-otp .w213-otp-cell.active{border-color:#2563eb;background:white;box-shadow:0 0 0 4px #dbeafe}#w150App #w150Login .works-otp .w213-otp-cell.active{border-color:#FFC21A;background:white;box-shadow:0 0 0 4px #FFF4D1}
#w150App #w150Login .works-otp .w213-otp-cell.active:empty:after{content:'';height:30px;width:2px;background:#2563eb;animation:w214-cursor 1s steps(1) infinite}#w150App #w150Login .works-otp .w213-otp-cell.active:empty:after{content:'';height:30px;width:2px;background:#FFC21A;animation:w214-cursor 1s steps(1) infinite;color:#2B1D00}
#w150App #w150Login .w214-invalid .w213-otp-cell{border-color:#fca5a5;background:#fef2f2;animation:w214-shake .35s}
#w150App #w150Login .w214-verifying .w213-otp-cell{border-color:#86efac;background:#f0fdf4;color:#16a34a}
#w150App #w150Login .w214-sms-time{font-variant-numeric:tabular-nums;color:#2563eb;margin-top:14px}#w150App #w150Login .w214-sms-time{font-variant-numeric:tabular-nums;color:#946200;margin-top:14px}
#w150App #w150Login .w214-hint{background:#f8fafc;border-radius:12px;padding:10px 12px;font-size:12.5px}
#w150App #w150Login .w214-sms-status{font-size:13px;font-weight:700;color:#16a34a}
#w150App #w150Login #w150Sms{color:#2563eb}#w150App #w150Login #w150Sms{color:#946200}#w150App #w150Login #w150Sms:disabled{color:#9ca3af}
#w150App[data-login-stage=sms] #w150MaskedPhone{display:none!important}
@keyframes w214-cursor{50%{opacity:0}}@keyframes w214-shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}

/* 214-2: one scroll owner for the whole login; the content column never scrolls independently. */
#w150App #w150Login{overflow:auto;overscroll-behavior:contain;max-height:none;padding:12px 18px}
#w150App #w150Login .w159-login-content{flex:0 0 auto;min-height:auto;height:auto;max-height:none;overflow:visible;overscroll-behavior:auto;padding-bottom:0}
#w150App #w150Login .w156-actions{flex:none;margin-top:auto;padding-top:8px;gap:8px;bottom:0}
#w150App #w150Login .w156-actions button{min-height:44px;padding:8px 12px}
#w150App #w150Login .w156-actions .primary{height:50px}
#w150App #w150Login .w214-back{margin:0;min-height:44px}
#w150App #w150Login .w156-mark{width:36px;height:36px;border-radius:12px;font-size:22px;margin:0}
#w150App #w150Login h1{margin:6px 0;font-size:22px}
#w150App #w150Login .w159-login-content>p{margin:0 0 8px;font-size:13px;line-height:1.4}
#w150App #w150Login #w150IdForm{margin-top:10px;gap:6px}
#w150App #w150Login .w214-field-label{margin:4px 0 0;font-size:12px}
#w150App #w150Login .w214-safe{margin:8px 0;font-size:11px;line-height:1.4}
#w150App #w150Login .w214-alternatives button{min-height:36px}
#w150App #w150Login .w214-choices{margin-top:14px;gap:10px}
#w150App #w150Login .w214-method{min-height:78px;padding:12px}
#w150App #w150Login .works-otp{margin-top:16px}
#w150App #w150Login .w214-hint{padding:8px 10px;font-size:12px}
#w150App #w150Login:has(.w214-password-row:not([hidden])) .w188-methods{display:none}
/* Approval is a short guide card, never a simulated PC/phone screen. */
#w150App #w150Login #w150Countdown{color:#2563eb;font-size:18px;font-weight:800;line-height:1.4;margin:8px 0 4px;text-align:left}#w150App #w150Login #w150Countdown{color:#946200;font-size:18px;font-weight:800;line-height:1.4;margin:8px 0 4px;text-align:left}
#w150App #w150Login #w150MaskedPhone{margin:0 0 6px;font-size:12px;text-align:left;color:#6b7280}
#w150App #w150Login .w188-approval{margin:6px 0 0}
#w150App #w150Login .w188-comparison{display:flex;align-items:center;gap:12px;padding:8px 10px;border:1px solid #dbeafe;border-radius:12px;background:#f8fbff}#w150App #w150Login .w188-comparison{display:flex;align-items:center;gap:12px;padding:8px 10px;border:1px solid #FFD24D;border-radius:12px;background:#FFF4D1}
#w150App #w150Login .w188-comparison #w150Number{font-size:36px;flex:none;gap:1px;color:#2563eb}#w150App #w150Login .w188-comparison #w150Number{font-size:36px;flex:none;gap:1px;color:#946200}
#w150App #w150Login .w188-equal,#w150App #w150Login .w188-phone-number{display:none}
#w150App #w150Login .w188-phone{display:block;max-width:none;width:auto;flex:1;border:0;border-radius:0;padding:0;box-shadow:none;background:transparent;text-align:left}
#w150App #w150Login .w188-phone strong{display:block;font-size:13px;white-space:normal}
#w150App #w150Login .w188-phone small{display:block;font-size:11px;margin-top:3px;line-height:1.4;color:#6b7280}
#w150App #w150Login .w188-steps{margin:10px 0 6px;padding-left:20px;font-size:12px;line-height:1.45}
#w150App #w150Login .w188-steps li{margin-bottom:4px}
#w150App #w150Login .w188-caution{font-size:11px;line-height:1.4;margin:4px 0}
#w150App[data-login-stage=approval] #w150Login .w156-actions{display:grid;grid-template-columns:1fr 1fr}
#w150App[data-login-stage=approval] #w150Sms{grid-column:1;grid-row:1;color:#2563eb}#w150App[data-login-stage=approval] #w150Sms{grid-column:1;grid-row:1;color:#946200}
#w150App[data-login-stage=approval] #w150Login .w156-actions button:not(#w150Sms){grid-column:2;grid-row:1}
/* The existing keyboard layout supplies the visible rectangle; do not subtract its height again. */
html.erp-keyboard-open #w150App #w150Login{padding:8px 14px}
html.erp-keyboard-open #w150App #w150Login .w156-mark,
html.erp-keyboard-open #w150App #w150Login .w214-safe,
html.erp-keyboard-open #w150App #w150Login .w214-alternatives,
html.erp-keyboard-open #w150App #w150Login .w214-hint,
html.erp-keyboard-open #w150App #w150Login .w188-methods{display:none}
html.erp-keyboard-open #w150App #w150Login h1{font-size:18px;margin:2px 0 4px}
html.erp-keyboard-open #w150App #w150Login .w159-login-content>p:not(.w214-sms-time):not(.w190-sms-notice){display:none}
html.erp-keyboard-open #w150App #w150Login .w214-field-label{font-size:11px;margin:0}
html.erp-keyboard-open #w150App #w150Login #w150IdForm{margin-top:6px;gap:4px}
html.erp-keyboard-open #w150App #w150Login .w214-id-row,
html.erp-keyboard-open #w150App #w150Login .w214-password-row{height:44px}
html.erp-keyboard-open #w150App #w150Login #w150Account,
html.erp-keyboard-open #w150App #w150Login .w214-password-row input{height:38px}
html.erp-keyboard-open #w150App #w150Login .works-otp{margin-top:8px}
html.erp-keyboard-open #w150App #w150Login .w156-actions{padding-top:6px}
