*{box-sizing:border-box}body{margin:0;color:#10100e;background:#eee5da;font-family:Arial,Helvetica,sans-serif}.screen{position:relative;height:100dvh;min-height:0;overflow:hidden;container-type:inline-size}.background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-1}.logo{position:absolute;left:2.52%;top:3.1%;font-family:'Times New Roman',Times,serif;font-size:2.9cqw;letter-spacing:-.14cqw;line-height:1.05;font-weight:400;margin:0}.content{position:absolute;top:25.7%;left:2.52%;width:47.5%}.eyebrow{font-size:.88cqw;font-weight:600;letter-spacing:.27cqw;margin:0 0 1.2cqw;line-height:1.25}h1{font-family:'Times New Roman',Times,serif;font-weight:400;font-size:4.72cqw;letter-spacing:-.10cqw;line-height:.97;margin:0 0 1.45cqw}h1 span{display:block;white-space:nowrap}.intro{font-size:1.72cqw;line-height:1.43;margin:0 0 2.6cqw;letter-spacing:.01cqw}.signin{display:flex;align-items:center;justify-content:center;gap:1.4cqw;background:linear-gradient(110deg,#191917,#10100f);border:1px solid #292823;color:#fff;border-radius:1cqw;width:30.7cqw;height:5.12cqw;font:400 1.6cqw Arial,Helvetica,sans-serif;cursor:pointer;box-shadow:inset 0 1px 0 #ffffff0a}.signin svg{width:2.8cqw;height:2.8cqw;flex:none}.signin:hover{background:#272521}.signin:focus-visible{outline:3px solid #806f55;outline-offset:5px}.helper{font-size:1.22cqw;line-height:1.5;color:#55565a;margin:1.35cqw 0 0}.footer{position:absolute;bottom:5.9%;left:2.8%;font-size:1.22cqw;color:#55565a;margin:0}dialog{max-width:440px;width:calc(100% - 40px);padding:28px;border:1px solid #c5b9a8;border-radius:12px;background:#f6f0e8;color:#24221e;line-height:1.5}dialog::backdrop{background:#0006}dialog h2{margin:0;font:28px 'Times New Roman',serif}dialog button{font:inherit;padding:8px 20px;border:1px solid #777;border-radius:6px;background:#161615;color:white;cursor:pointer}
@media(min-width:601px) and (max-aspect-ratio:7/5){
.screen:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(244,237,227,.32),rgba(244,237,227,.20) 47%,transparent 68%);pointer-events:none}
.logo{font-size:3.8cqw}.content{width:66%;top:25%}.eyebrow{font-size:1.15cqw;letter-spacing:.3cqw;margin-bottom:1.6cqw}h1{font-size:6.15cqw;line-height:1;letter-spacing:-.15cqw;margin-bottom:2.4cqw}h1 span{white-space:normal}.intro{font-size:2.2cqw;line-height:1.45;margin-bottom:3.3cqw;width:86%}.intro br{display:initial}.signin{width:40cqw;height:6.6cqw;font-size:2.05cqw;gap:1.8cqw;border-radius:1.2cqw}.signin svg{width:3.6cqw;height:3.6cqw}.helper{font-size:1.6cqw;margin-top:1.7cqw}.footer{font-size:1.6cqw}}
@media(max-width:600px){.screen{min-height:100svh;padding:30px 24px 330px}.background{height:440px;top:auto;bottom:0;object-position:right bottom;object-fit:cover;z-index:-2}.screen:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#f3ede5 0%,#f3ede5 49%,#f3ede5e8 60%,transparent 78%)}.logo{position:static;font-size:34px;letter-spacing:-1.8px}.content{position:relative;top:auto;left:auto;width:100%;margin-top:62px}.eyebrow{font-size:10px;letter-spacing:2.6px;margin-bottom:18px}h1{font-size:clamp(34px,8.5vw,57px);letter-spacing:-1.5px;line-height:1.04;margin-bottom:22px}h1 span{white-space:normal}.intro{font-size:17px;line-height:1.5;margin-bottom:26px}.intro br{display:none}.signin{width:100%;height:56px;font-size:17px;border-radius:10px;gap:16px}.signin svg{width:29px;height:29px}.helper{font-size:13px;margin-top:16px}.footer{position:relative;bottom:auto;left:auto;font-size:13px;margin-top:38px;color:#393832}}

/* Keep the entire welcome screen inside the current browser viewport. */
@media(max-width:600px){
.screen{height:100dvh;min-height:0;padding:clamp(16px,3dvh,30px) 24px 0}
.background{height:45%;width:100%;bottom:0}
.content{margin-top:clamp(20px,5dvh,62px)}
.logo{font-size:clamp(26px,4dvh,34px)}
.eyebrow{margin-bottom:clamp(10px,2dvh,18px)}
h1{font-size:clamp(28px,4.2dvh,42px);margin-bottom:clamp(12px,2.5dvh,22px)}
.intro{font-size:clamp(14px,2dvh,17px);margin-bottom:clamp(14px,3dvh,26px)}
.signin{height:clamp(44px,6.6dvh,56px)}
.helper{margin-top:clamp(10px,1.9dvh,16px)}
.footer{position:absolute;left:24px;bottom:18px;margin:0;color:#fff;text-shadow:0 1px 4px #000}
}
@media(min-width:601px) and (max-height:650px){.content{top:20%}h1{font-size:min(4.72cqw,8.5dvh);margin-bottom:2dvh}.eyebrow{margin-bottom:2dvh}.intro{font-size:min(1.72cqw,3dvh);margin-bottom:3dvh}.signin{height:9dvh}.helper{margin-top:2dvh;font-size:min(1.22cqw,2.5dvh)}}

/* Slightly quieter overall UI scale, preserving the full-height photograph. */
.logo{transform:scale(.92);transform-origin:top left}
.content{transform:scale(.92);transform-origin:top left}
.footer{transform:scale(.92);transform-origin:bottom left}

/* Bound desktop typography independently of monitor width. */
@media(min-width:601px){
.logo{font-size:34px;letter-spacing:-1.7px;transform:none}
.content{width:min(560px,62%);transform:none}
.eyebrow{font-size:10px;letter-spacing:3px;margin-bottom:20px}
h1{font-size:clamp(36px,3.4vw,52px);line-height:1.04;letter-spacing:-1.6px;margin-bottom:24px}
h1 span{white-space:normal}
.intro{font-size:18px;line-height:1.5;width:100%;letter-spacing:0;margin-bottom:30px}
.signin{width:340px;max-width:100%;height:56px;font-size:17px;gap:16px;border-radius:10px}
.signin svg{width:28px;height:28px}
.helper{font-size:13px;line-height:1.55;margin-top:16px}
.footer{font-size:13px;transform:none}
}
@media(min-width:601px) and (min-aspect-ratio:7/5){.background{object-position:right center}}
/* Keep copy beside the desk, including on panoramic displays. */
@media(min-width:601px){.content{left:clamp(26px,8vw,160px);width:min(510px,48%)}}
@media(min-width:601px) and (min-aspect-ratio:7/5){.content{left:max(36px,calc(100vw - 146dvh));width:min(510px,38vw)}}

/* One centred composition: equal text and image columns with bounded scale. */
@media(min-width:601px){
.screen{isolation:isolate;background:#eee5da}
.screen:before,.screen:after{display:none}
.screen picture{position:absolute;left:50%;top:50%;width:600px;height:760px;transform:translateY(-50%);z-index:-1;overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 12%),linear-gradient(to bottom,transparent,#000 8%,#000 92%,transparent);mask-composite:intersect}
.background{position:absolute;width:760px;height:760px;max-width:none;left:auto;right:0;top:0;object-fit:cover;object-position:right center;z-index:auto}
.content{position:absolute;left:max(32px,calc(50% - 560px));top:50%;transform:translateY(-50%);width:calc(50% - 64px);max-width:480px}
.logo{left:max(32px,calc(50% - 560px));top:32px}
.footer{left:max(32px,calc(50% - 560px));bottom:32px}
h1{font-size:48px}
.intro{font-size:18px}
}
@media(min-width:601px) and (max-width:1000px){h1{font-size:38px}.intro{font-size:16px}.intro br{display:none}.screen picture{width:50%;height:700px}.background{height:700px;width:700px}}

/* A fixed-scale photographic canvas, viewed through the browser viewport.
   The centred 900px overlay never controls or scales the photograph. */
@media(min-width:601px){
.screen{background:#eee5da}
.screen picture{position:absolute;inset:0;width:100%;height:100%;transform:none;overflow:hidden;mask-image:none;z-index:-1}
.background{position:absolute;left:calc(50% - 1570px);top:calc(50% - 500px);right:auto;bottom:auto;width:3000px;height:1000px;object-fit:fill;max-width:none;z-index:auto}
.logo,.footer{left:calc(50% - 450px)}
.content{left:calc(50% - 450px);width:410px;max-width:410px;top:50%;transform:translateY(-50%)}
h1{font-size:44px}.intro{font-size:18px}.intro br{display:none}
}
@media(min-width:601px) and (max-width:964px){.logo,.footer,.content{left:32px}.content{width:calc(50% - 48px)}h1{font-size:38px}}

/* A little more room and slightly larger type within the fixed photograph. */
@media(min-width:1104px){
.logo,.footer,.content{left:calc(50% - 520px)}
.content{width:470px;max-width:470px}
h1{font-size:48px}.intro{font-size:20px}
.logo{font-size:36px}.eyebrow{font-size:11px}
.signin{font-size:18px}.helper,.footer{font-size:14px}
}
@media(min-width:601px) and (max-width:1103px){
.logo,.footer,.content{left:32px}
.content{width:calc(50% - 56px);max-width:470px}
h1{font-size:46px}.intro{font-size:19px}
.logo{font-size:36px}.eyebrow{font-size:11px}
.signin{font-size:18px}.helper,.footer{font-size:14px}
}

@media(min-width:1104px){h1{font-size:52px}}
@media(min-width:601px) and (max-width:1103px){h1{font-size:50px}}
@media(min-width:1104px){h1{font-size:62px;line-height:1.03;letter-spacing:-2px}.content{width:490px;max-width:490px}.intro{font-size:19px;max-width:430px}.eyebrow{letter-spacing:2px;font-size:10px;margin-bottom:24px}}@media(max-width:600px){h1{font-size:36px}.eyebrow{letter-spacing:1.6px;font-size:9px}}

/* Approved concept C with a larger headline. */
@media(min-width:1104px){h1{font-size:68px;letter-spacing:-2px}}
@media(min-width:601px) and (max-width:1103px){h1{font-size:53px;letter-spacing:-1.8px}}
@media(max-width:600px){h1{font-size:39px;letter-spacing:-1.5px}}

/* Align the clean antique-room image with the live copy. */
@media(min-width:601px){
.background{inset:0;width:100%;height:100%;object-fit:cover;object-position:center center}
.logo,.footer,.content{left:22.7%}
.content{width:31%;max-width:490px}
h1{font-size:68px}
.intro{font-size:19px}
}
@media(min-width:601px) and (max-aspect-ratio:17/10){
.background{object-position:60% center}
.logo,.footer,.content{left:14%}.content{width:43%;max-width:490px}
}
@media(max-width:600px){.background{inset:auto 0 0;width:100%;height:48%;object-fit:cover;object-position:76% bottom}}
@media(min-width:601px) and (max-width:1103px){h1{font-size:53px}.intro{font-size:17px}.logo,.footer,.content{left:7%}}
@media(max-width:600px){.screen:before{background:linear-gradient(#f3ede5 0%,#f3ede5 53%,#f3ede5e8 60%,transparent 78%)}}

/* Desktop and tablet: keep the copy anchored to the photograph's clear wall. */
@media(min-width:601px){
.screen{--copy-left:clamp(32px,calc(50vw - 55.7dvh),23vw);--copy-width:430px;--heading-size:68px}
.background{object-position:50% center}
.logo,.content,.footer{left:var(--copy-left)}
.content{width:var(--copy-width);max-width:calc(100vw - var(--copy-left) - 32px);top:48%;transform:translateY(-50%)}
h1{font-size:var(--heading-size);line-height:1.04;letter-spacing:-1.8px}h1 span{white-space:nowrap}
.eyebrow{font-size:10px;letter-spacing:2px;margin-bottom:24px}
.intro{font-size:19px;line-height:1.5;width:100%;margin-bottom:30px}.intro br{display:none}
.logo{top:32px}.footer{bottom:32px}
.signin{width:340px;max-width:100%;height:56px;font-size:18px}
.helper{font-size:14px;margin-top:16px}
}
@media(min-width:601px) and (max-width:899px){.screen{--copy-width:310px;--heading-size:46px}.intro{font-size:16px}.eyebrow{font-size:9px;letter-spacing:1.6px}.logo{font-size:30px}.helper{font-size:12px}.signin{font-size:16px;height:50px}}
@media(min-width:900px) and (max-width:1199px){.screen{--copy-width:360px;--heading-size:54px}.intro{font-size:17px}.helper{font-size:13px}}
@media(min-width:1200px) and (max-width:1399px){.screen{--copy-width:400px;--heading-size:62px}.intro{font-size:18px}}
@media(min-width:1800px){.screen{--copy-width:460px}.intro{max-width:460px}}
@media(min-width:2400px){.screen{--copy-width:490px;--heading-size:72px}}
@media(min-width:601px) and (max-aspect-ratio:6/5){.screen{--copy-left:6vw;--copy-width: min(410px,48vw)}.background{object-position:50% center}.content{top:44%}.footer{color:#fff;text-shadow:0 1px 4px #33271e,0 0 2px #33271e}}
@media(min-width:601px) and (max-height:650px){.content{top:50%}.screen{--heading-size:48px}.eyebrow{margin-bottom:14px}h1{margin-bottom:18px}.intro{font-size:16px;margin-bottom:20px}.signin{height:48px}.helper{font-size:12px;margin-top:12px}.logo{top:20px;font-size:30px}.footer{bottom:20px;font-size:12px}}
@media(min-width:601px) and (max-height:450px){.screen{min-height:450px}.content{top:225px}}

/* Approved portrait mobile composition, with live accessible copy. */
@media(max-width:600px){
.screen{height:100svh;min-height:720px;padding:0;isolation:isolate}
.screen picture{position:absolute;inset:0;z-index:-1}
.background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;z-index:0}
.screen:before,.screen:after{display:none}
.logo{position:absolute;top:4.3%;left:6%;font-size:28px;letter-spacing:-1.4px;transform:none}
.content{position:absolute;top:10.5%;left:7.3%;width:78%;max-width:none;margin:0;transform:none}
.eyebrow{font-size:7px;letter-spacing:1.7px;line-height:1.4;margin-bottom:14px}
h1{font-size:clamp(40px,11.8vw,60px);letter-spacing:-1.8px;line-height:1.02;margin-bottom:12px}h1 span{white-space:nowrap}
.intro{width:86%;max-width:none;font-size:13px;line-height:1.48;letter-spacing:0;margin-bottom:13px}.intro br{display:none}
.signin{width:86%;height:42px;font-size:14px;gap:11px;border-radius:8px}.signin svg{width:24px;height:24px}
.helper{font-size:10px;line-height:1.5;margin-top:8px;color:#55565a}
.footer{left:6%;bottom:3%;font-size:10px;line-height:1.5;transform:none;color:#fff;text-shadow:0 1px 4px #33271e}
}
@media(min-width:430px) and (max-width:600px){.logo{font-size:32px}.eyebrow{font-size:8px}.intro{font-size:15px}.signin{height:46px;font-size:16px}.helper,.footer{font-size:11px}}
@media(max-width:360px){.content{width:85%;left:7%}.eyebrow{font-size:6.5px;letter-spacing:1.4px}h1{font-size:39px}.intro{font-size:12px}.signin{font-size:13px}.helper{font-size:9px}}

@media(max-width:600px){
.screen{min-height:780px;background:#eee3d2}
.background{inset:auto 0 0;height:90%;object-position:center bottom;mask-image:linear-gradient(to bottom,transparent,#000 12%)}
}
@media(max-width:600px){.screen:before{display:block;content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,rgba(238,227,210,.85),rgba(238,227,210,.65) 39%,transparent 53%);}}
@media(max-width:600px){.screen picture{z-index:-2}}

/* Show the portrait photograph directly, without a wash or top fade. */
@media(max-width:600px){
.screen:before,.screen:after{display:none}
.background{inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;mask-image:none}
}

/* A subtle wash keeps mobile copy readable without hiding the photograph. */
@media(max-width:600px){
.screen:before{display:block;content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,rgba(246,238,225,.55) 0%,rgba(246,238,225,.46) 36%,rgba(246,238,225,.18) 44%,transparent 53%)}
}

.signin{text-decoration:none}.auth-error{font:14px/1.5 Arial,sans-serif;max-width:360px;color:#792f20}.auth-error:empty{display:none}