/* V2 artwork only. Shared controls, state and all V1 rules remain unchanged.
 * Native crops and periods: work/v2-periodic/measurements.json.
 * Every dimension below scales with the canvas width, never its content height. */
html[data-member-theme="v2"]:not([data-splash-color]){background:#83cce8;background-image:none}
html[data-member-theme="v2"]:not([data-splash-color]) body{background:transparent}
html[data-member-theme="v2"] #app{
 position:relative;isolation:isolate;display:flex;flex-direction:column;
 --v2-canvas:100vw;min-height:calc(var(--v2-canvas)*1.988889);min-height:max(100vh,calc(var(--v2-canvas)*1.988889));
 background-color:#cceef7;
 background-image:url('/images/themes/v2/left-v1.png'),url('/images/themes/v2/right-v1.png'),url('/images/themes/v2/center-v1.png');
 background-image:image-set(url('/images/themes/v2/left-v1.webp') type('image/webp'),url('/images/themes/v2/left-v1.png') type('image/png')),image-set(url('/images/themes/v2/right-v1.webp') type('image/webp'),url('/images/themes/v2/right-v1.png') type('image/png')),image-set(url('/images/themes/v2/center-v1.webp') type('image/webp'),url('/images/themes/v2/center-v1.png') type('image/png'));
 background-size:27.777778% auto,27.777778% auto,44.444445% auto;
 background-position:left calc(var(--v2-canvas)*1.34074074),right calc(var(--v2-canvas)*1.31759259),center calc(var(--v2-canvas)*1.33333333);background-repeat:repeat-y;
 padding-bottom:0;
}
html[data-member-theme="v2"] #app::before{
 content:"";position:absolute;z-index:-1;top:0;left:0;right:0;padding-top:134.074074%;pointer-events:none;
 background:url('/images/themes/v2/top-v1.png') center top/100% auto no-repeat;
 background-image:image-set(url('/images/themes/v2/top-v1.webp') type('image/webp'),url('/images/themes/v2/top-v1.png') type('image/png'));
 /* A 4 CSS px join only; the original corners and lace remain unfiltered. */
 -webkit-mask-image:linear-gradient(#000 calc(100% - 4px),transparent);mask-image:linear-gradient(#000 calc(100% - 4px),transparent);
}
html[data-member-theme="v2"] #app::after{
 content:"";display:block;position:relative;pointer-events:none;flex-shrink:0;
 width:calc(100% + 24px);margin:28px -12px 0;padding-top:calc((100% + 24px)*700/1080);
 background:url('/images/themes/v2/bottom-v1.png') center bottom/100% auto no-repeat;
 background-image:image-set(url('/images/themes/v2/bottom-v1.webp') type('image/webp'),url('/images/themes/v2/bottom-v1.png') type('image/png'));
 -webkit-mask-image:linear-gradient(transparent,#000 4px);mask-image:linear-gradient(transparent,#000 4px);
}
html[data-member-theme="v2"] #workspace[data-mode="home"]{background-image:none}

html[data-member-theme="v2"] #workspace{flex:1 0 auto}
@media(min-width:560px){html[data-member-theme="v2"] #app{--v2-canvas:560px}}

/* Inner pages start below the Canva lace inner edge (source y≈330 / 1080),
 * plus 12px breathing room. Subtract the existing main 16px top padding.
 * One workspace offset moves the entire page without altering component gaps. */
html[data-member-theme="v2"] #app{--v2-inner-page-start:calc(var(--v2-canvas)*330/1080 + 12px)}
html[data-member-theme="v2"] #workspace[data-mode="pairing"],
html[data-member-theme="v2"] #workspace[data-mode="bundles"],
html[data-member-theme="v2"] #workspace[data-mode="lookup"]{padding-top:calc(var(--v2-inner-page-start) - 16px)}