.d21-login{background:var(--surface);grid-template-columns:minmax(0,792fr) minmax(0,648fr);min-height:100dvh;display:grid;position:relative}.lg-brand{height:100dvh;padding:16px;position:sticky;top:0}.lg-panel{background:var(--brand-surface);border-radius:14px;height:100%;position:relative;overflow:hidden}.lg-ring{border:1px solid var(--brand-line);border-radius:50%;position:absolute}.lg-ring.r1{inset-inline-end:-200px;width:640px;height:640px;top:240px}.lg-ring.r2{inset-inline-end:-80px;width:400px;height:400px;top:360px}.lg-node{background:var(--brand-surface);border:2px solid var(--brand-signature);inset-inline-end:340px;border-radius:6px;width:12px;height:12px;position:absolute;top:328px}.lg-mark{inset-inline-start:56px;width:72px;height:72px;display:block;position:absolute;top:56px}.lg-mark img{width:100%;height:100%;display:block}.lg-moment{inset-inline-start:56px;text-align:start;width:440px;max-width:calc(100% - 112px);position:absolute;bottom:56px}.lg-moment p.q{font:700 44px/63.8px "Amiri", var(--f-ui);color:var(--brand-on-surface);margin:0 0 19.6px}.lg-moment p.q:lang(en){font-size:36px;line-height:50px}.lg-moment i{background:var(--brand-on-surface-soft);width:40px;height:1px;margin-bottom:12px;display:block}.lg-moment span{font:400 14px/22px var(--f-ui);color:var(--brand-on-surface-soft);display:block}.lg-col{flex-direction:column;justify-content:center;align-items:center;min-height:100dvh;padding:48px 24px 32px;display:flex;position:relative}.lg-col>.desk-notice{width:360px;max-width:100%}@media (min-width:768px){.lg-col:has(>.desk-notice){padding-bottom:96px}}.lg-form{flex-direction:column;align-items:center;gap:20px;width:360px;max-width:100%;display:flex}.lg-form>*{width:100%}.lg-head{text-align:start;flex-direction:column;gap:6px;display:flex}.lg-head h1{font:600 28px/35px var(--f-ui);color:var(--text-primary);margin:0}.lg-head p{font:400 13.5px/22px var(--f-ui);color:var(--text-muted);margin:0}.lg-foot{bottom:32px;width:360px;max-width:calc(100% - 48px);min-height:40px;font:400 12.5px/20px var(--f-ui);color:var(--text-muted);text-align:center;margin:0 auto;position:absolute;inset-inline:0}.lg-langbar{top:16px;z-index:3;position:absolute;inset-inline-end:16px}.lg-seg{background:var(--surface-subtle);box-shadow:inset 0 0 0 1px var(--border-subtle);border-radius:10px;padding:3px;display:flex}.lg-seg button{appearance:none;cursor:pointer;min-width:0;font:400 13px/22px var(--f-ui);color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;background:0 0;border:0;border-radius:7px;flex:auto;padding:5px 8px;overflow:hidden}.lg-seg button:hover{color:var(--text-primary)}.lg-seg button[aria-selected=true]{background:var(--surface);color:var(--text-primary);box-shadow:var(--shadow-sheet);font-weight:500}.lg-fields{flex-direction:column;gap:14px;display:flex}.lg-field{flex-direction:column;gap:6px;display:flex}.lg-field>label{font:500 13px/22px var(--f-ui);color:var(--text-primary);text-align:start}.lg-input{border:1px solid var(--border-control);background:var(--surface);border-radius:9px;align-items:center;gap:8px;height:36px;padding:0 11px;display:flex}.lg-input:focus-within{border:1.5px solid var(--focus-ring);box-shadow:0 0 0 3px var(--surface-selected);padding:0 10.5px}.lg-input input{min-width:0;height:100%;font:400 14px/22px var(--f-num);color:var(--text-primary);background:0 0;border:0;outline:0;flex:1;padding:0}.lg-input input::placeholder{color:var(--text-disabled)}.d21-login[dir=rtl] .lg-input input[dir=ltr]{text-align:right}.lg-input .lg-show{appearance:none;cursor:pointer;font:400 13px/22px var(--f-ui);color:var(--text-muted);background:0 0;border:0;flex:none;padding:0}.lg-input .lg-show:hover{color:var(--text-primary)}.lg-input.is-disabled{background:var(--surface-disabled);border-color:var(--border-disabled)}.lg-input.is-disabled input{color:var(--text-disabled)}.lg-input :focus-visible{outline:none}.lg-btn{appearance:none;background:var(--brand-surface);height:40px;color:var(--text-inverse);font:500 13.5px/22px var(--f-ui);cursor:pointer;transition:transform .12s var(--ease), background-color .15s var(--ease);white-space:nowrap;border:0;border-radius:9px;justify-content:center;align-items:center;gap:7px;padding:0 14px;display:inline-flex}.lg-btn:hover:not(:disabled){background:var(--action-primary-hover)}.lg-btn:active:not(:disabled){transform:scale(.97)}.lg-btn:disabled{background:var(--surface-disabled);color:var(--text-disabled);box-shadow:inset 0 0 0 1px var(--border-disabled);cursor:not-allowed}.lg-btn:focus-visible,.lg-sbtn:focus-visible,.lg-key:focus-visible,.lg-seg button:focus-visible,.lg-show:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.lg-sbtn{appearance:none;height:28px;font:500 12.5px/18px var(--f-ui);color:var(--text-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:7px;justify-content:center;align-self:center;align-items:center;padding:0 10px;display:inline-flex;width:auto!important}.lg-sbtn:hover{background:var(--surface-hover)}.lg-langbar .lg-sbtn{color:var(--text-secondary)}.lg-langbar .lg-lang{border:1px solid var(--border-subtle);background:var(--surface);border-radius:8px;gap:6px;height:34px;padding:0 12px}.lg-langbar .lg-lang svg{stroke-width:1.5px;flex:none;width:16px;height:16px}.lg-busyrow{align-items:center;gap:5.5px;display:flex}.lg-busyrow .lg-btn{flex:1}.lg-sukun{border:2px solid var(--border-subtle);border-top-color:var(--brand-signature);border-radius:50%;flex:none;width:22px;height:22px;animation:.9s linear infinite lg-spin}@keyframes lg-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.lg-sukun{animation:none}.lg-btn{transition:none}}.lg-note{text-align:start;border-radius:10px;flex-direction:column;gap:2.5px;padding:12px 14px;display:flex}.lg-note-txt{flex-direction:column;gap:2.5px;min-width:0;display:flex}.lg-note.has-icon{flex-direction:row;align-items:flex-start;gap:10px}.lg-note-ico{width:18px;height:18px;color:var(--status-danger);stroke-width:1.5px;flex:none;margin-top:2px}.lg-note b{font:600 14px/22px var(--f-ui)}.lg-note span{font:400 13.5px/22px var(--f-ui);color:var(--text-secondary)}.lg-note.tone-danger{background:var(--status-danger-tint)}.lg-note.tone-danger b{color:var(--status-danger)}.lg-note.tone-warning{background:var(--status-warning-tint)}.lg-note.tone-warning b{color:var(--text-primary)}.lg-note.tone-info{background:var(--surface-subtle)}.lg-note.tone-info b{color:var(--text-primary)}.lg-pin{flex-direction:column;align-items:center;gap:16px;display:flex}.lg-pinlabel{text-align:center;width:100%;font:400 13.5px/22px var(--f-ui);color:var(--text-secondary)}.lg-dots{gap:14px;height:14px;display:flex}.lg-dots i{box-sizing:border-box;border:1.5px solid var(--border-control);border-radius:7px;width:14px;height:14px}.lg-dots i.on{background:var(--action-primary);border-color:var(--action-primary)}.lg-keypad{grid-template-columns:repeat(3,88px);gap:12px;display:grid}.lg-key{appearance:none;border:1px solid var(--border-strong);background:var(--surface);width:88px;height:56px;color:var(--text-primary);font:400 22px/22px var(--f-num);cursor:pointer;transition:transform .12s var(--ease), background-color .15s var(--ease);border-radius:12px;place-items:center;display:grid}.lg-key:hover:not(:disabled){background:var(--surface-hover)}.lg-key:active:not(:disabled){transform:scale(.97)}.lg-key.is-text{font:400 13.5px/22px var(--f-ui);color:var(--text-secondary);background:0 0;border:0;place-items:start center;padding-top:0}.lg-key:disabled{cursor:default}.lg-key.is-text:disabled{color:var(--text-disabled)}.lg-key-gap{width:88px;height:56px}@media (max-width:1279px){.d21-login{grid-template-columns:minmax(0,544fr) minmax(0,480fr)}.lg-ring.r1{inset-inline-end:-220px;width:520px;height:520px;top:340px}.lg-ring.r2{inset-inline-end:-120px;width:320px;height:320px;top:440px}.lg-node{inset-inline-end:219px;border-radius:5px;width:10px;height:10px;top:411px}.lg-mark{inset-inline-start:40px;width:64px;height:64px;top:40px}.lg-moment{inset-inline-start:40px;width:360px;max-width:calc(100% - 80px);bottom:40px}.lg-moment p.q{margin-bottom:20px;font-size:36px;line-height:52.2px}}@media (max-width:767px){.d21-login{background:var(--brand-surface);flex-direction:column;display:flex}.lg-brand{order:0;height:auto;padding:8px 24px 28px;position:relative}.lg-panel{background:0 0;border-radius:0;align-items:center;gap:12px;height:48px;display:flex;overflow:visible}.lg-ring,.lg-node,.lg-moment p.q,.lg-moment i{display:none}.lg-mark{flex:none;width:48px;height:48px;position:static}.lg-moment{width:auto;max-width:none;position:static}.lg-moment span{font:600 16px/24px var(--f-ui);color:var(--brand-on-surface)}.lg-col{background:var(--surface);min-height:0;box-shadow:var(--shadow-sheet);border-radius:20px 20px 0 0;flex:1;order:1;justify-content:flex-start;padding:12px 16px 96px}.lg-form{gap:16px;width:100%;padding-top:12px}.lg-head{gap:4px}.lg-head h1{font-size:22px;line-height:28.6px}.lg-input,.lg-btn{height:44px}.lg-foot{width:100%;max-width:none;min-height:0;margin-top:16px;font-size:12px;line-height:19px;position:static}.lg-langbar{top:18px;z-index:2;inset-inline-end:16px}.lg-langbar .lg-sbtn{color:var(--brand-on-surface)}.lg-langbar .lg-sbtn:hover{background:#fffdf71f}.lg-langbar .lg-lang{background:0 0;border-color:#fffdf752;min-width:44px;height:44px}.lg-langbar .lg-lang svg{display:none}.lg-panel{padding-inline-end:112px}.lg-moment{min-width:0}.lg-moment span{font-size:15px;line-height:20px;display:block}}