/* Compact layouts keep each reference's composition, colours and surfaces.
   Controls stay in normal flow so validation and SMS never need a second form. */
@media(max-width:1100px){
 html[data-hw-home-reference] .home-reference-stage{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:'header' 'copy' 'tabs' 'art' 'auth' 'links' 'tools';gap:22px;width:100%;max-width:700px;padding:24px clamp(16px,4vw,32px);min-height:100svh;align-content:start;background:var(--ref-bg)}
 html[data-hw-home-reference] .home-reference-stage>*{min-width:0}
 html[data-hw-home-reference] .welcome-header{grid-area:header;align-self:center}
 html[data-hw-home-reference] .welcome-copy{grid-area:copy}
 html[data-hw-home-reference] .welcome-copy h1{font-size:clamp(30px,5.8vw,48px)!important;line-height:1.08;text-align:var(--ref-copy-align);letter-spacing:-.04em}
 html[data-hw-home-reference] .welcome-copy .intro{font-size:15px!important;line-height:1.5;text-align:var(--ref-copy-align);margin-top:12px!important}
 html[data-hw-home-reference] .home-ref-title-line{overflow:visible}
 html[data-hw-home-reference] .welcome .welcome-discovery-tabs{grid-area:tabs;min-height:44px;justify-content:space-between;gap:8px}
 html[data-hw-home-reference] .welcome-discovery-tabs button{font-size:clamp(11px,2.6vw,14px);gap:6px;line-height:1.3;min-height:44px}
 html[data-hw-home-reference] .home-reference-icon{width:24px;height:24px}
 html[data-hw-home-reference] .welcome-discovery-tabs button img{width:24px;height:24px}
 html[data-hw-home-reference] .welcome .welcome-scene{grid-area:art;align-self:center;display:flex!important;align-items:center;gap:12px;overflow:hidden}
 html[data-hw-home-reference] .home-template-art{flex:0 1 auto;width:100%;max-width:100%;border-radius:var(--compact-art-radius,0px)}
 html[data-hw-home-reference] .welcome-scene[data-home-art-pair=true] .home-template-art{width:calc((100% - 12px)/2)}
 html[data-hw-home-reference] #authDialog.registration{grid-area:auth;align-self:center;width:100%!important;min-height:0!important;padding:20px!important;background:var(--compact-card-bg)!important;border:1px solid var(--compact-card-border)!important;border-radius:var(--compact-card-radius)!important;box-shadow:var(--compact-card-shadow)!important}
 html[data-hw-home-reference] #authDialog.registration[data-home-compact-surface=bare]{padding:0!important;border:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important}
 html[data-hw-home-reference] #authDialog .dialog-heading h2{font-size:clamp(24px,4.2vw,30px)!important;line-height:1.2;text-align:var(--ref-auth-align)}
 html[data-hw-home-reference] #authDialog>.registration-intro{font-size:14px;line-height:1.5;color:var(--ref-intro-color)!important;margin:8px 0 20px!important}
 html[data-hw-home-reference] #authDialog #phoneForm>label{font-size:13px;color:var(--ref-label-color)!important}
 html[data-hw-home-reference] #authDialog .phone-row{height:52px!important;min-height:52px!important;border-color:var(--ref-input-border)!important;border-radius:var(--compact-input-radius);background:var(--ref-input-bg)!important}
 html[data-hw-home-reference] #authDialog .phone-row input#phoneNumber{font-size:16px}
 html[data-hw-home-reference] #authDialog .phone-country{width:100px;flex-basis:100px}
 html[data-hw-home-reference] #authDialog input#phoneNumber::placeholder{color:var(--ref-placeholder-color)!important;opacity:var(--ref-placeholder-opacity)}
 html[data-hw-home-reference] #authDialog #sendSMS[data-home-ref-position]{min-height:52px!important;border-radius:var(--compact-button-radius);font-size:15px;font-weight:var(--ref-button-weight)}
 html[data-hw-home-reference] #authDialog .welcome-sms-note{color:var(--ref-note-color)!important}
 html[data-hw-home-reference] #authDialog #lostPhone{color:var(--ref-recovery-color)!important}
 html[data-hw-home-reference] .welcome-information{grid-area:links;padding-top:8px!important;gap:8px 16px!important}
 html[data-hw-home-reference] .welcome-information a{font-size:11px!important;line-height:1.6;white-space:normal}
 html[data-hw-home-reference] .welcome-footer-tools{grid-area:tools;justify-self:center}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-art-order=after]{grid-template-areas:'header' 'copy' 'tabs' 'auth' 'art' 'links' 'tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=triptych] .home-template-art{max-width:360px}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=landscape] .welcome-scene,html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=horizontal] .welcome-scene{margin-inline:calc(-1 * clamp(16px,4vw,32px));width:calc(100% + 2 * clamp(16px,4vw,32px));max-width:none}
 html[data-hw-home-reference=design-14] .home-reference-stage{background:var(--compact-page-panel);border-radius:24px}
 html[data-hw-home-reference=design-37] .home-reference-stage{border-inline-start:10px solid var(--ref-accent);grid-template-areas:'header' 'art' 'copy' 'tabs' 'auth' 'links' 'tools'}
 html[data-hw-home-reference=design-41] .home-reference-stage{border:2px solid color-mix(in srgb,var(--ref-accent) 25%,transparent);border-radius:24px}
 html[data-hw-home-reference=design-49] #authDialog.registration[data-home-compact-surface=band]{background:var(--compact-card-bg)!important;padding:22px!important;border-radius:0!important;margin-inline:calc(-1 * clamp(16px,4vw,32px))!important;width:calc(100% + 2 * clamp(16px,4vw,32px))!important}
}
/* Tablet compositions retain the reference's left/right or central balance. */
@media(min-width:720px) and (max-width:1100px){
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family]{max-width:1100px;column-gap:28px;row-gap:20px;grid-template-columns:minmax(0,1fr) minmax(300px,1fr);grid-template-areas:'header header' 'copy auth' 'tabs auth' 'art auth' 'links links' 'tools tools'}
 html[data-hw-home-reference] .welcome-copy h1{font-size:clamp(34px,4.8vw,52px)!important}
 html[data-hw-home-reference] .welcome-discovery-tabs button{font-size:12px;gap:5px}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=split]{grid-template-areas:'header header' 'copy art' 'tabs art' 'auth art' 'links links' 'tools tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=split][data-home-compact-side=right]{grid-template-columns:minmax(0,1fr) minmax(300px,1fr);grid-template-areas:'header header' 'art copy' 'art tabs' 'art auth' 'links links' 'tools tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=landscape]{grid-template-areas:'header header' 'copy auth' 'tabs auth' 'art art' 'links links' 'tools tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=horizontal]{grid-template-areas:'header header' 'copy art' 'tabs art' 'auth auth' 'links links' 'tools tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=horizontal][data-home-compact-art-order=after]{grid-template-areas:'header header' 'copy copy' 'tabs tabs' 'auth auth' 'art art' 'links links' 'tools tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=horizontal] .welcome-scene{margin:0;width:100%}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=horizontal] #authDialog[data-screen=phone]{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:0 24px;align-content:start;align-items:start}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=horizontal] #authDialog[data-screen=phone]>.dialog-heading{grid-column:1;grid-row:1}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=horizontal] #authDialog[data-screen=phone]>.registration-intro{grid-column:1;grid-row:2}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=horizontal] #authDialog[data-screen=phone]>#sheetBody{grid-column:2;grid-row:1 / span 3}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=centered]{grid-template-columns:minmax(0,1fr);grid-template-areas:'header' 'copy' 'tabs' 'art' 'auth' 'links' 'tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=centered][data-home-compact-art-order=after]{grid-template-areas:'header' 'copy' 'tabs' 'auth' 'art' 'links' 'tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=centered] :is(.welcome-copy,.welcome-discovery-tabs,#authDialog){width:min(100%,460px)!important;justify-self:center}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=centered][data-home-compact-pair=true]{grid-template-columns:minmax(0,1fr) minmax(300px,420px) minmax(0,1fr);grid-template-areas:'header header header' '. copy .' '. tabs .' '. auth .' 'links links links' 'tools tools tools'}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=centered][data-home-compact-pair=true] .welcome-scene{grid-area:2 / 1 / 5 / 4;display:grid!important;grid-template-columns:subgrid;column-gap:28px;pointer-events:none;z-index:-1}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=centered][data-home-compact-pair=true] .home-template-art{width:100%;grid-column:1}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=centered][data-home-compact-pair=true] .home-template-art~.home-template-art{grid-column:3}
 html[data-hw-home-reference] .home-reference-stage[data-home-compact-family=triptych]{grid-template-areas:'header header' 'copy copy' 'art auth' 'tabs auth' 'links links' 'tools tools'}
 html[data-hw-home-reference=design-37] .home-reference-stage[data-home-compact-family=horizontal]{border-inline-start:32px solid var(--ref-accent);grid-template-areas:'header header' 'art art' 'copy copy' 'tabs tabs' 'auth auth' 'links links' 'tools tools'}
 html[data-hw-home-reference=design-48] .home-reference-stage[data-home-compact-family=framed]{grid-template-areas:'header header' 'copy auth' 'tabs auth' '. art' 'links links' 'tools tools'}
 html[data-hw-home-reference=design-49] #authDialog.registration[data-home-compact-surface=band]{margin-inline:0!important;width:100%!important}
}
@media(max-width:1100px){
 html[data-hw-home-reference=design-07] .welcome-scene[data-home-art-pair=true] .home-template-art{width:calc((100% - 12px)*.31)}
 html[data-hw-home-reference=design-07] .welcome-scene[data-home-art-pair=true] .home-template-art~.home-template-art{width:calc((100% - 12px)*.69)}
 html[data-hw-home-reference=design-11] .welcome-scene[data-home-art-pair=true]{flex-direction:column}
 html[data-hw-home-reference=design-11] .welcome-scene[data-home-art-pair=true] .home-template-art{width:100%}
 html[data-hw-home-reference]:not([data-hw-auth-expanded]) #authDialog[data-home-hide-title=true]>.dialog-heading,
 html[data-hw-home-reference]:not([data-hw-auth-expanded]) #authDialog[data-home-hide-intro=true]>.registration-intro{display:none}
 html[data-hw-home-reference][data-hw-auth-expanded] #authDialog.registration[data-home-compact-surface]{padding:20px!important;background:var(--compact-card-bg)!important;border:1px solid var(--compact-card-border)!important;border-radius:var(--compact-card-radius)!important;box-shadow:var(--compact-card-shadow)!important}
 html[data-hw-home-reference][data-hw-auth-expanded] #authDialog.registration[data-home-compact-surface=bare]{padding:0!important;border:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important}
 html[data-hw-home-reference][data-hw-auth-expanded] #authDialog.registration[data-home-compact-surface=band]{padding:22px!important;border:0!important;border-radius:0!important;background:var(--compact-card-bg)!important;box-shadow:none!important}
}
@media(max-width:359px){
 html[data-hw-home-reference] .welcome-discovery-tabs button{flex-direction:column;gap:5px;font-size:11px}
 html[data-hw-home-reference] #authDialog.registration{padding:16px!important}
 html[data-hw-home-reference] #authDialog.registration[data-home-compact-surface=bare]{padding:0!important}
}

/* Approved mobile panorama: keep the phone form directly below the artwork. */
@media(max-width:719px){
 html[data-hw-home-reference=design-29] .home-reference-stage{gap:16px;padding:18px 18px 24px;}
 html[data-hw-home-reference=design-29] .home-reference-stage .welcome-header[data-home-ref-position]{width:140px!important;height:39px!important;margin-bottom:4px;translate:-5px 0;}
 html[data-hw-home-reference=design-29] .home-reference-stage .welcome-copy h1{max-width:290px!important;margin-inline:auto!important;font-size:clamp(32px,9vw,44px)!important;line-height:1.08;text-align:center;}
 html[data-hw-home-reference=design-29] .home-reference-stage .welcome-copy .intro{max-width:270px!important;margin-inline:auto!important;font-size:15px!important;line-height:1.45;text-align:center;}
 html[data-hw-home-reference=design-29] .welcome .welcome-scene{position:relative;width:calc(100% + 36px);margin-inline:-18px;aspect-ratio:2.1;min-height:0;gap:0;}
 html[data-hw-home-reference=design-29] .welcome-scene .home-template-art{display:none!important;}
 html[data-hw-home-reference=design-29] .welcome-scene::before{content:'';display:block;width:100%;height:100%;position:absolute;inset:0;background:url('/assets/home-mobile-portraits.webp') center / contain no-repeat;mix-blend-mode:multiply;opacity:1;pointer-events:none;}
 html[data-hw-home-reference=design-29][data-hw-theme=dark] .welcome-scene::before{background-image:url('/assets/home-mobile-portraits-dark.webp');filter:none;mix-blend-mode:normal;opacity:1;mask-image:linear-gradient(transparent,#000 8%,#000 85%,transparent);}
 html[data-hw-home-reference=design-29] #authDialog .dialog-heading h2{font-size:clamp(23px,6.2vw,30px)!important;text-align:center;}
 html[data-hw-home-reference=design-29] #authDialog>.registration-intro{margin:8px 0 18px!important;text-align:center;}
 html[data-hw-home-reference=design-29] #authDialog #sendSMS{background:linear-gradient(105deg,#8953ff,#aa72f6)!important;}
 html[data-hw-home-reference=design-29] #authDialog #lostPhone{margin:4px auto 0!important;text-decoration:none;}
 html[data-hw-home-reference=design-29] .welcome-information{border-top:1px solid color-mix(in srgb,var(--ref-muted) 20%,transparent);padding-top:14px!important;}
}

/* Center the brand on phones without changing tablet or desktop geometry. */
@media(max-width:719px){
 html[data-hw-home-reference] .home-reference-stage .welcome-header[data-home-ref-position]{justify-self:center;margin-inline:auto!important;}
 html:not([data-hw-home-layout]) body>.welcome-header{justify-content:center;}
}

/* Approved session error card. Scoped to restoration errors only. */
html body #authDialog.registration.hw-session-error,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error{--session-card:#ffffffed;--session-line:#b895e5;--session-ink:#251d38;--session-muted:#716080;--session-icon:#efe5fb;--session-icon-ink:#8750c0;--session-wait:#e9def4;--session-wait-ink:#71528d;box-sizing:border-box;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;width:min(420px,100%)!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;padding:22px 24px 18px!important;border:1px solid var(--session-line)!important;border-radius:20px!important;background:var(--session-card)!important;box-shadow:none!important;color:var(--session-ink)!important;text-align:center!important;overflow:visible!important;}
html[data-hw-theme=dark] body #authDialog.registration.hw-session-error,
html[data-hw-theme=dark][data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error{--session-card:#151222ed;--session-line:#9c64d7;--session-ink:#fbf9ff;--session-muted:#c1addd;--session-icon:#302544;--session-icon-ink:#b49ad7;--session-wait:#513271;--session-wait-ink:#c1addd;}
html body #authDialog.registration.hw-session-error .hw-session-error-icon,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error .hw-session-error-icon{display:flex;align-items:center;justify-content:center;flex:none;width:60px;height:60px;margin:0 auto 14px;border-radius:50%;background:var(--session-icon);color:var(--session-icon-ink);}
html body #authDialog.registration.hw-session-error .hw-session-error-icon svg,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error .hw-session-error-icon svg{width:32px;height:32px;}
html body #authDialog.registration.hw-session-error>.dialog-heading,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error>.dialog-heading{position:static!important;inset:auto!important;transform:none!important;display:block!important;visibility:visible!important;width:100%!important;height:auto!important;margin:0!important;padding:0!important;}
html body #authDialog.registration.hw-session-error .dialog-heading h2,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error .dialog-heading h2{font-family:inherit!important;font-size:23px!important;font-weight:700!important;line-height:1.3!important;letter-spacing:-.04em!important;text-align:center!important;width:100%!important;height:auto!important;color:var(--session-ink)!important;white-space:normal!important;overflow-wrap:anywhere;}
html body #authDialog.registration.hw-session-error>.registration-intro,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error>.registration-intro{display:none!important;}
html body #authDialog.registration.hw-session-error #sheetBody,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error #sheetBody{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;width:100%!important;padding:0!important;margin:0!important;min-width:0;}
html body #authDialog.registration.hw-session-error #authError,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error #authError{order:0;position:static!important;inset:auto!important;width:auto!important;height:auto!important;margin:8px auto 22px!important;max-width:310px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--session-muted)!important;font-family:inherit!important;font-weight:400!important;text-align:center!important;font-size:16px!important;line-height:1.5!important;overflow-wrap:anywhere;}
html body #authDialog.registration.hw-session-error #retryAuth,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error #retryAuth{order:1;position:relative!important;inset:auto!important;transform:none!important;display:flex!important;align-items:center;justify-content:center;gap:10px;box-sizing:border-box;width:100%!important;min-width:0;min-height:48px!important;height:auto!important;padding:12px 16px!important;border:1px solid transparent!important;border-radius:10px!important;margin:0!important;background:#803aff!important;box-shadow:none!important;color:#fff!important;font-family:inherit!important;font-size:16px!important;font-weight:500!important;line-height:1.4!important;white-space:normal;overflow-wrap:anywhere;cursor:pointer;}
html body #authDialog.registration.hw-session-error #retryAuth:disabled,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error #retryAuth:disabled{background:var(--session-wait)!important;color:var(--session-wait-ink)!important;opacity:1!important;filter:none!important;cursor:default;}
html body #authDialog.registration.hw-session-error #retryAuth::after,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error #retryAuth::after{content:none!important;}
html body #authDialog.registration.hw-session-error #retryAuth:not(:disabled):hover,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error #retryAuth:not(:disabled):hover{background:#7130e6!important;}
html body #authDialog.registration.hw-session-error .hw-session-retry-clock,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error .hw-session-retry-clock{display:none;width:23px;height:23px;flex:none;}
html body #authDialog.registration.hw-session-error #retryAuth.is-waiting .hw-session-retry-clock,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error #retryAuth.is-waiting .hw-session-retry-clock{display:block;}
html body #authDialog.registration.hw-session-error #exitAuth,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error #exitAuth{order:2;display:block!important;position:static!important;width:auto!important;min-height:40px!important;height:auto!important;align-self:center;margin:12px 0 0!important;padding:8px 12px!important;border:0!important;border-radius:6px!important;background:transparent!important;box-shadow:none!important;color:var(--session-muted)!important;font-family:inherit!important;font-size:13px!important;font-weight:400!important;line-height:1.4!important;text-decoration:underline!important;text-underline-offset:3px;cursor:pointer;}
html body #authDialog.registration.hw-session-error button:focus-visible,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error button:focus-visible{outline:3px solid #b68aef!important;outline-offset:3px!important;}
@media(min-width:1101px){
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error{left:calc(var(--ref-x) + var(--ref-w) / 2)!important;transform:translateX(-50%)!important;width:420px!important;max-width:calc(100% - 32px)!important;}
}
@media(max-width:1100px){
html body #authDialog.registration.hw-session-error,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error{position:static!important;inset:auto!important;transform:none!important;width:100%!important;max-width:420px!important;justify-self:center;align-self:start;margin-inline:auto!important;}
}
@media(max-width:380px){
html body #authDialog.registration.hw-session-error,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error{padding:20px 18px 14px!important;}
html body #authDialog.registration.hw-session-error .dialog-heading h2,
html[data-hw-home-reference][data-hw-auth-expanded] body #authDialog.registration.hw-session-error .dialog-heading h2{font-size:21px!important;}
}
