*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"新細明體","Microsoft JhengHei",sans-serif;font-size:15px;color:#182b3d}body{min-height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#aebbc7;padding:24px 10px}.login-window{width:596px;border:2px solid #627d96;background:#e6e6e6;box-shadow:4px 7px 22px #223a4e55}.login-window header{height:29px;background:linear-gradient(90deg,#285a87,#5786ab);color:white;font:13px "Microsoft JhengHei",sans-serif;display:flex;align-items:center;gap:7px;padding:0 7px}.app-icon{font:bold 18px Georgia;background:#f5f8fb;color:#285a87;width:20px;text-align:center;border:1px solid #b3c8d9}.artwork{position:relative;width:592px;height:380px}.artwork img{display:block;max-width:100%;object-fit:fill}.erastos-brand{position:absolute;left:38%;right:3%;top:43%;text-align:center;color:#fff;font-family:"Microsoft JhengHei",sans-serif;text-shadow:0 2px 4px #064a83,0 0 8px #0868a8}.erastos-brand h1{font-size:30px;line-height:1.3;margin:0;font-weight:700;white-space:nowrap}.erastos-brand p{font-size:15px;line-height:1.5;margin:7px 0 0;white-space:nowrap}form{display:grid;grid-template-columns:90px 215px 1fr;gap:0;padding:5px 0;min-height:63px;background:#e6e6e6;border-top:1px solid #9aafbd}.login-buttons{display:flex;flex-direction:column;gap:5px;padding:0 10px}button,input,select{font:14px "新細明體","Microsoft JhengHei",sans-serif;border-radius:0;color:#152f44}button{height:25px;border:1px solid #798e9e;background:linear-gradient(#fff,#e1e6ea);cursor:pointer;padding:2px 7px}button:hover{background:#dfeef9}button:disabled{opacity:.6;cursor:wait}.credentials,.preferences{display:grid;align-items:center;grid-template-columns:90px 110px;gap:5px 5px;grid-template-rows:23px 23px}.credentials label:nth-of-type(2){grid-column:1;grid-row:2}.credentials #password{grid-column:2;grid-row:2}.preferences{grid-template-columns:50px 1fr;padding-right:10px}.preferences label:nth-of-type(2){grid-column:1;grid-row:2}.preferences #language{grid-column:2;grid-row:2;width:100px}.preferences select:disabled{color:#677680;background:#ececec}input,select{width:100%;height:23px;border:1px solid #869baa;background:#fff;padding:1px 4px;min-width:0}input:focus,select:focus{outline:2px solid #4386b8;outline-offset:1px}#login-error{display:none;color:#9b2929;background:#fff0e9;padding:8px 12px;font:12px/1.6 "Microsoft JhengHei",sans-serif;border-top:1px solid #d9a292}.login-note{margin:12px 0 0;color:#496174;font:12px "Microsoft JhengHei",sans-serif}@media(max-width:620px){.login-window{width:min(596px,100%)}.artwork{width:100%;height:auto;aspect-ratio:592/380}.artwork img{width:100%;height:100%}form{grid-template-columns:85px minmax(0,1fr)}.credentials{grid-template-columns:90px minmax(0,1fr);padding-right:9px}.preferences{display:none}.erastos-brand h1{font-size:clamp(17px,4.8vw,30px)}.erastos-brand p{font-size:clamp(10px,2.4vw,15px);margin-top:4px}.login-window header{font-size:12px}}

/* Larger sign-in controls, with actions on the right in reading and tab order. */
form{grid-template-columns:minmax(0,1fr)112px 80px;gap:12px;padding:12px;align-items:start}
.credentials{grid-template-columns:90px minmax(0,1fr);grid-template-rows:36px 36px;gap:8px}
.credentials input{height:36px;padding:6px 8px;font-size:16px}
.preferences{grid-template-columns:43px minmax(0,1fr);grid-template-rows:36px 36px;gap:8px 4px;padding-right:0}
.preferences select,.preferences #language{width:100%;height:36px;padding:3px;font-size:13px}
.login-buttons{grid-column:3;display:flex;flex-direction:column;gap:8px;padding:0}
.login-buttons button{height:36px;width:80px;font-size:16px}
@media(max-width:620px){form{grid-template-columns:minmax(0,1fr)80px;gap:12px}.credentials{padding-right:0}.login-buttons{grid-column:2}}
@media(max-width:380px){form{padding:10px;gap:8px;grid-template-columns:minmax(0,1fr)66px}.credentials{grid-template-columns:1fr;grid-template-rows:auto 38px auto 38px;gap:5px}.credentials label:nth-of-type(2){grid-row:3}.credentials #password{grid-column:1;grid-row:4}.credentials input{height:38px}.login-buttons{padding-top:22px;gap:28px}.login-buttons button{width:66px;height:38px}}

@media(min-width:621px){form{grid-template-columns:minmax(0,1fr)128px 80px;gap:10px}.preferences{grid-template-columns:45px minmax(0,1fr)}}.preferences label{font-size:13px;white-space:nowrap}