/* Keep the existing brand illustration visible beside or above the account form. */
@media(max-width:760px){
 main{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;justify-content:normal;gap:28px;min-height:0;padding:24px 28px 30px;max-width:620px}
 .visual-panel{display:block;width:100%;min-width:0;padding:0}
 .visual-panel .eyebrow{font-size:9px;letter-spacing:2px;gap:9px}
 .visual-panel .small-line{width:22px}
 .visual-panel h1{font-size:clamp(27px,4.8vw,35px);line-height:1.3;margin:13px 0 8px;letter-spacing:0}
 .visual-panel .intro{font-size:12px;line-height:1.5}
 .visual-panel .brand-art{height:clamp(140px,27vw,190px);margin:18px 0 13px;overflow:hidden}
 .visual-panel .art-grid{inset:15px 0 0}
 .visual-panel .trend-heading{font-size:8px;letter-spacing:1.5px}
 .visual-panel .trend-title{font-size:12px;margin-top:4px}
 .visual-panel .trend-demo{font-size:9px;padding:4px 6px}
 .visual-panel .chip-emblem{width:clamp(78px,16vw,108px);height:clamp(78px,16vw,108px);top:30px;right:14px;box-shadow:4px 5px 0 -1px #171a18,5px 6px 0 #6d5c2e}
 .visual-panel .chip-orbit{width:clamp(100px,20vw,132px);height:clamp(100px,20vw,132px);top:19px;right:2px}
 .visual-panel .trend-chart{height:calc(100% - 47px);bottom:18px}
 .visual-panel .trend-axis{font-size:8px;letter-spacing:1px}
 .visual-panel .brand-values{display:flex;flex-wrap:wrap;gap:10px 20px;font-size:10px;line-height:1.5}
 .visual-panel .brand-values>div{gap:6px}
 .visual-panel .brand-values svg{width:15px;height:15px;flex-shrink:0}
 .form-panel{max-width:none;justify-self:stretch;margin:0;padding-top:22px;border-top:1px solid var(--border)}
 .form-panel .tabs{margin-bottom:15px}
 .form-panel .form-heading p{display:block}
 html[data-theme=light] .form-panel:before{inset:8px -12px -12px}
 html[data-theme=light] .visual-panel .chip-emblem{box-shadow:4px 5px 0 -1px #c8cfce,5px 6px 0 #a4956a}
}
@media(max-width:380px){main{padding-inline:22px}.visual-panel h1{font-size:26px}.visual-panel .brand-values{gap:9px 14px}}
@media(max-width:760px) and (max-height:620px){main{padding-top:18px}.visual-panel .brand-art{height:125px}.visual-panel h1{font-size:25px}.visual-panel .chip-emblem{width:74px;height:74px}}
/* Compact phone introduction keeps the login controls within easy reach. */
@media(max-width:760px){
 main{padding:12px 22px 20px;gap:14px}
 .visual-panel{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 100px;column-gap:8px;align-items:center}
 .visual-panel .eyebrow{grid-column:1;font-size:8px;letter-spacing:1.5px}
 .visual-panel h1{grid-column:1;font-size:clamp(20px,4.4vw,27px);line-height:1.25;margin:8px 0 5px}
 .visual-panel .intro{grid-column:1;font-size:10px;margin:0}
 .visual-panel .brand-art{grid-column:2;grid-row:1/4;width:100px;height:115px;margin:0}
 .visual-panel .trend-heading,.visual-panel .trend-title,.visual-panel .trend-demo,.visual-panel .trend-axis{display:none}
 .visual-panel .chip-emblem{width:70px;height:70px;top:16px;right:9px}
 .visual-panel .chip-orbit{width:88px;height:88px;top:7px;right:0}
 .visual-panel .trend-chart{height:60px;bottom:4px;opacity:.6}
 .visual-panel .brand-values{grid-column:1/-1;font-size:9px;gap:10px 20px;margin-top:8px}
 .visual-panel .brand-values svg{width:12px;height:12px}
 .form-panel{padding-top:14px}
 .form-panel .tabs{margin-bottom:12px}
 .form-panel .form-heading p{font-size:12px;margin-bottom:14px}
 .form-panel .field{margin-bottom:12px}
 .form-panel .field input,.form-panel .captcha-image{height:44px}
 .form-panel .field label{margin-bottom:5px;font-size:12px}
 .form-panel .eye{top:8px}
 .form-panel .check-row{margin-bottom:12px}
 .form-panel .primary-button#submit-button.login-submit{height:48px;font-size:24px}
}
@media(max-width:760px) and (max-height:740px){
 .visual-panel .brand-art{height:90px}
 .visual-panel .chip-emblem{width:58px;height:58px;top:10px;right:14px}
 .visual-panel .chip-orbit{width:76px;height:76px;top:1px;right:5px}
 .visual-panel h1{font-size:20px;margin:6px 0 4px}
 .form-panel .form-heading p{display:none}
 .form-panel .form-heading h2{font-size:24px}
 .form-panel .field{margin-bottom:9px}
 .form-panel .field input,.form-panel .captcha-image{height:40px}
 .form-panel .eye{top:6px}
}
