.login-screen .brand-mark{object-fit:contain;flex:0 0 auto}
      .login-screen .brand-copy{display:grid;gap:0;font-family:var(--english);line-height:.94}
      .login-screen .brand-copy strong{font-weight:850}
      .login-screen .brand-copy span{font-weight:800;letter-spacing:.02em;white-space:nowrap}
      .login-languages .language{display:inline-flex;align-items:center;justify-content:center;border:1px solid #fff;border-radius:999px;background:#fff;box-shadow:0 5px 15px #0b51b426;cursor:pointer;font-weight:700;white-space:nowrap;line-height:1.2}
      .login-languages .language.current{background:#ebf5fa}
      body.login-open { overflow: hidden; }
      body.login-open #site-root {
        opacity: 0;
        transform: translateX(-4vw);
        visibility: hidden;
        pointer-events: none;
        transition: opacity .32s ease, transform .42s cubic-bezier(.22,.7,.25,1), visibility 0s linear .42s;
      }
      .login-screen {
        position: fixed;
        z-index: 20;
        inset: 0;
        display: flex;
        flex-direction: column;
        overflow: auto;
        background: #e8f3ff url('./assets/login-background.webp') center center / cover no-repeat;
        color: #102044;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateX(24px);
        transition: opacity .34s ease, transform .42s cubic-bezier(.22,.7,.25,1), visibility 0s linear .42s;
      }
      .login-screen.is-visible {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateX(0);
        transition: opacity .34s ease, transform .42s cubic-bezier(.22,.7,.25,1), visibility 0s;
      }
      .login-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 62px;
        padding: 7px max(24px, calc((100vw - 1144px) / 2));
        border-bottom: 1px solid #e8edf5;
        background: rgba(255,255,255,.97);
      }
      .login-brand { display: inline-flex; align-items: center; gap: 9px; color: #075fe7; }
      .login-brand .brand-mark { width: 45px; height: 42px; }
      .login-brand .brand-copy strong { font-size: 26px; letter-spacing: -1.2px; }
      .login-brand .brand-copy span { padding-top: 3px; font-size: 9px; }
      .login-languages { display: flex; gap: 6px; }
      .login-languages .language { min-height: 34px; min-width: 70px; padding: 0 10px; font-size: 12px; }
      .login-main {
        display: grid;
        grid-template-columns: minmax(0, 1.04fr) minmax(390px, .96fr);
        align-items: center;
        gap: clamp(30px, 5vw, 70px);
        width: min(1180px, calc(100% - 56px));
        margin: auto;
        padding: 27px 0 30px;
        transform: translateY(7px);
      }
      @media(min-width:1001px){.login-promo{transform:translateX(18px)}}
      .login-promo h1 {
        margin: 0 0 13px;
        color: #0b2e82;
        font-size: clamp(34px, 3.5vw, 48px);
        font-weight: 850;
        line-height: 1.26;
        letter-spacing: -.035em;
      }
      .login-promo-intro { max-width: 550px; margin: 0 0 19px; color: #233350; font-size: 17px; font-weight: 550; line-height: 1.65; }
      .login-benefits { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
      .login-benefit { display: grid; grid-template-columns: 43px minmax(0,1fr); align-items: center; gap: 12px; }
      .login-benefit-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #e3efff; color: #1876d2; }
      .login-benefit-icon svg { width: 21px; height: 21px; }
      .login-benefit strong { display: block; margin-bottom: 2px; color: #142544; font-size: 14px; font-weight: 760; line-height: 1.4; }
      .login-benefit p { margin: 0; color: #556274; font-size: 12px; line-height: 1.55; }
      .login-service-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 21px; }
      .login-service-card { min-width: 0; padding: 14px 14px 13px; border: 1px solid #e7edf6; border-radius: 15px; background: #fff; box-shadow: 0 8px 20px rgba(24,63,125,.07); text-align: center; }
      .login-service-art { display: flex; align-items: center; justify-content: center; height: 57px; color: #1268cb; }
      .login-service-art svg { width: 58px; height: 54px; }
      .login-service-card h2 { margin: 5px 0 4px; color: #172645; font-size: 14px; font-weight: 780; line-height: 1.4; }
      .login-service-card p { margin: 0; color: #546173; font-size: 11px; line-height: 1.5; }
      .login-card { width: 100%; padding: 22px 28px 19px; border: 1px solid #eef1f6; border-radius: 16px; background: #fff; box-shadow: 0 14px 38px rgba(17,46,99,.1); }
      .auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 22px; border-bottom: 1px solid #e8edf4; }
      .auth-tab { position: relative; min-height: 39px; padding: 0 8px 11px; border: 0; background: transparent; color: #667085; font-size: 13px; font-weight: 700; cursor: pointer; }
      .auth-tab::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; border-radius: 4px; background: transparent; content: ""; }
      .auth-tab[aria-selected="true"] { color: #1c659c; }
      .auth-tab[aria-selected="true"]::after { background: #267bb1; }
      .auth-title { margin: 0 0 4px; color: #17243e; font-size: 25px; font-weight: 820; line-height: 1.35; }
      .auth-description { margin: 0 0 17px; color: #778196; font-size: 13px; line-height: 1.55; }
      .auth-form { display: grid; gap: 12px; }
      .auth-form[hidden] { display: none; }
      .auth-label { display: block; margin-bottom: 6px; color: #283650; font-size: 13px; font-weight: 700; }
      .auth-field { display: flex; align-items: center; min-height: 42px; overflow: hidden; border: 1px solid #dce2eb; border-radius: 8px; background: #fff; transition: border-color .16s ease, box-shadow .16s ease; }
      .auth-field:focus-within { border-color: #4090c3; box-shadow: 0 0 0 3px rgba(54,137,190,.12); }
      .auth-field-icon { display: grid; place-items: center; width: 40px; align-self: stretch; flex: 0 0 auto; border-right: 1px solid #eef1f6; background: #f8fafc; color: #7b8799; }
      .auth-field-icon svg { width: 17px; height: 17px; }
      .auth-field input { width: 100%; min-width: 0; height: 40px; padding: 0 11px; border: 0; outline: 0; background: transparent; color: #192741; font: 500 13px/1.3 var(--english), var(--myanmar); }
      :root[lang="my"] .auth-field input { font-family: var(--myanmar); }
      .auth-field input::placeholder { color: #a4acb8; opacity: 1; }
      .auth-password-toggle { display: grid; place-items: center; width: 38px; height: 40px; flex: 0 0 auto; border: 0; background: transparent; color: #7b8799; cursor: pointer; }
      .auth-password-toggle svg { width: 17px; height: 17px; }
      .auth-password-toggle .eye-off, .auth-password-toggle.is-showing .eye-on { display: none; }
      .auth-password-toggle.is-showing .eye-off { display: block; }
      .auth-options { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 1px; }
      .auth-remember { display: inline-flex; align-items: center; gap: 7px; color: #4a5569; font-size: 12px; }
      .auth-remember input { width: 15px; height: 15px; margin: 0; accent-color: #1976d2; }
      .auth-link { border: 0; background: transparent; color: #3978a7; font-size: 12px; font-weight: 700; text-decoration: none; cursor: pointer; }
      .auth-submit { min-height: 42px; margin-top: 2px; border: 0; border-radius: 7px; background: #176fda; box-shadow: 0 5px 12px rgba(23,111,218,.15); color: #fff; font-size: 14px; font-weight: 760; cursor: pointer; transition: background .18s ease, transform .18s ease; }
      .auth-submit:hover { transform: translateY(-1px); background: #0f62ca; }
      .auth-divider { display: flex; align-items: center; gap: 12px; margin: 13px 0; color: #8c95a4; font-size: 12px; }
      .auth-divider::before, .auth-divider::after { height: 1px; flex: 1; background: #e8edf4; content: ""; }
      .auth-create-button { width: 100%; min-height: 40px; border: 1px solid #8da7b4; border-radius: 7px; background: #fff; color: #356e8f; font-size: 13px; font-weight: 700; cursor: pointer; }
      .login-card[data-mode="register"] .auth-divider, .login-card[data-mode="register"] .auth-create-button { display: none; }
      .auth-feedback { min-height: 0; margin: 0; color: #a04438; font-size: 12px; line-height: 1.5; }
      .auth-feedback:not(:empty) { margin-top: 10px; padding: 8px 10px; border-radius: 7px; background: #fff4f1; }
      .auth-help { margin: 14px 0 0; color: #727d8e; text-align: center; font-size: 11px; line-height: 1.5; }
      .auth-help a { color: #315f89; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
      .auth-setup-demo { margin-top: 8px; }
      .auth-setup-demo a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 4px 8px; }
      @media (max-width: 1000px) {
        .login-main { width: min(900px, calc(100% - 42px)); grid-template-columns: minmax(0, 1fr) minmax(360px,.95fr); gap: 24px; }
        .login-card { padding-right: 22px; padding-left: 22px; }
        .login-promo h1 { font-size: clamp(31px, 4vw, 42px); }
      }
      @media (max-width: 760px) {
        .login-screen { transform: translateX(100%); }
        .login-screen.is-visible { transform: translateX(0); }
        body.login-open #site-root { transform: translateX(-12vw); }
        .login-header { min-height: 62px; padding: 6px 16px; }
        .login-brand { gap: 6px; }
        .login-brand .brand-mark { width: 39px; height: 37px; }
        .login-brand .brand-copy strong { font-size: 23px; }
        .login-brand .brand-copy span { font-size: 7px; }
        .login-languages { gap: 4px; }
        .login-languages .language { min-width: 60px; min-height: 31px; padding: 0 7px; font-size: 10px; }
        .login-main { display: block; width: min(470px, calc(100% - 28px)); margin: 0 auto; padding: 17px 0 22px; transform:none; }
        .login-promo { display: none; }
        .login-card { padding: 21px 18px 17px; border-radius: 14px; box-shadow: 0 8px 28px rgba(17,46,99,.08); }
        .auth-tabs { margin-bottom: 19px; }
        .auth-title { font-size: 23px; }
      }
      @media (max-width: 370px) {
        .login-header { padding-right: 10px; padding-left: 10px; }
        .login-brand .brand-mark { width: 34px; height: 33px; }
        .login-brand .brand-copy strong { font-size: 21px; }
        .login-brand .brand-copy span { font-size: 6px; }
        .login-languages .language { min-width: 54px; padding: 0 5px; font-size: 9px; }
        .login-main { width: calc(100% - 20px); padding-top: 12px; }
        .login-card { padding-right: 14px; padding-left: 14px; }
      }
      @media (prefers-reduced-motion: reduce) {
        html { scroll-behavior: auto; }
        *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
      }