/* WORYVO shared responsive layout contract — R49.
   No fixed content heights or overflow hiding: long text must remain accessible. */
:root{--wv-page-width:1400px;--wv-page-gutter:clamp(12px,2.2vw,28px);--wv-layout-gap:clamp(12px,1.6vw,24px);--wv-rail-left:200px;--wv-rail-right:240px}
html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}
body{margin-inline:0}
:is(body>main,#wvEcosystemShell,.lifeStage,.people-shell,.placesPage,.cwLayout,#personalCenter,.creationPage){width:100%;max-width:var(--wv-page-width);margin-inline:auto;padding-inline:var(--wv-page-gutter);min-width:0}
:is(main,section,article,aside,nav,form,fieldset,details){min-width:0}
:is(p,h1,h2,h3,h4,a,label,small,strong,time,summary){overflow-wrap:anywhere}
:is(img,video,canvas,svg,iframe){max-width:100%}
:is(img,video){height:auto}
:is(input,textarea,select){max-width:100%;min-width:0;box-sizing:border-box}
fieldset{margin-inline:0}
textarea{resize:vertical}
button,summary,[role=button]{touch-action:manipulation}
:is(button,input,select,textarea){font:inherit}
:is(button,summary){min-height:40px}
:is(body>header,.wvEcosystemTop,.module-heading,.section-head){flex-wrap:wrap;gap:12px}
:is(body>header nav,.wvEcosystemTop nav){min-width:0;flex-wrap:wrap}
:is(.people-shell,.lifeStage){display:grid;grid-template-columns:var(--wv-rail-left) minmax(0,1fr) var(--wv-rail-right);gap:var(--wv-layout-gap)}
:is(.cwLayout,.placesSearchLayout){gap:var(--wv-layout-gap)}
:is(.profile-grid,.post-grid,.centerModuleGrid,.guestPathGrid,.creationTypeGrid,.wvEcosystemGrid){gap:var(--wv-layout-gap)}
:is(.profile-grid,.post-grid){grid-template-columns:repeat(4,minmax(0,1fr))}
:is(.people-hero,.centerHero,.cwHero,.event-discovery-intro){min-width:0;height:auto;overflow:visible}
:is(.people-hero,.centerHero,.cwHero,.event-discovery-intro) h1{font-size:clamp(24px,3.2vw,42px);line-height:1.15}
:is(.people-hero,.centerHero,.cwHero,.event-discovery-intro) p{font-size:clamp(14px,1.2vw,17px);line-height:1.65}
#eventCreateForm{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#eventCreateForm>p,#eventCreateForm>fieldset,#eventCreateForm>.event-form-actions{grid-column:1/-1}
#eventCreateForm label{display:flex;flex-direction:column;gap:6px}
#eventCreateForm :is(input,textarea,select){width:100%}
#eventCreateForm>fieldset{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#eventCreateForm>fieldset :is(legend,p){grid-column:1/-1}
dialog{max-width:calc(100% - 24px);max-height:calc(100dvh - 24px);overflow:auto}
:is(.wvPoweredBy,#wvCreditFooter){text-align:center;overflow-wrap:anywhere}
@media(max-width:1100px){:is(.people-shell,.lifeStage){grid-template-columns:180px minmax(0,1fr)}:is(.activity-rail,.lifeStage>aside:last-child){grid-column:1/-1}.profile-grid,.post-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){:is(.people-shell,.lifeStage,.cwLayout,.placesSearchLayout,.placesColumns,.centerColumns,.createColumns){display:grid;grid-template-columns:minmax(0,1fr)!important}:is(.filter-rail,.activity-rail,.lifeStage>aside){position:static;grid-column:auto}.profile-grid,.post-grid,.wvEcosystemGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.centerHero{grid-template-columns:minmax(0,1fr)!important}#eventCreateForm>fieldset{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){:is(.profile-grid,.post-grid,.wvEcosystemGrid,.centerModuleGrid,.guestPathGrid,.creationTypeGrid,#eventCreateForm,#eventCreateForm>fieldset){grid-template-columns:minmax(0,1fr)!important}#eventCreateForm>*{grid-column:auto}:is(body>header nav,.wvEcosystemTop nav){width:100%}#wvAppearanceOpen{right:10px;max-width:calc(100% - 20px)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* R50 — module-specific limits, without fixing content height. */
body:is([data-wv-area=education],[data-wv-area=work]) .layout{max-width:var(--wv-page-width);margin-inline:auto;grid-template-columns:var(--wv-rail-left) minmax(0,1fr);gap:var(--wv-layout-gap);padding-inline:var(--wv-page-gutter)}
body:is([data-wv-area=education],[data-wv-area=work]) .sidebar{height:auto;min-height:0;max-height:calc(100dvh - 24px);overflow:auto;top:12px;padding:18px 12px}
body:is([data-wv-area=education],[data-wv-area=work]) #main{padding:20px;min-width:0}
body:is([data-wv-area=education],[data-wv-area=work]) .hero{padding:clamp(16px,2vw,28px);min-height:0;gap:18px}
body:is([data-wv-area=education],[data-wv-area=work]) .hero h1{font-size:clamp(26px,3vw,42px);line-height:1.2}
body:is([data-wv-area=education],[data-wv-area=work]) :is(.filters,.manage-grid form){grid-template-columns:repeat(2,minmax(0,1fr))}
body:is([data-wv-area=education],[data-wv-area=work]) .manage-grid form :is(h3,p,button){grid-column:1/-1}
body[data-wv-area=communities] :is(.cwHero,.cwRight,.cwManagementGrid){gap:var(--wv-layout-gap);min-width:0}
body[data-wv-area=communities] .cwHero{padding:clamp(18px,3vw,36px);min-height:0}
body[data-wv-area=communities] .cwRight{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
body[data-wv-area=business] .businessCards{grid-template-columns:repeat(4,minmax(0,1fr))}
body[data-wv-area=events] #eventManage form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
body[data-wv-area=events] #eventManage form :is(fieldset,p,.event-form-actions){grid-column:1/-1}
@media(max-width:1100px){body[data-wv-area=business] .businessCards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){body:is([data-wv-area=education],[data-wv-area=work]) .layout{grid-template-columns:minmax(0,1fr)}body:is([data-wv-area=education],[data-wv-area=work]) .sidebar{position:static;max-height:none}body:is([data-wv-area=education],[data-wv-area=work]) #main{padding:12px 0}body[data-wv-area=business] .businessCards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){body:is([data-wv-area=education],[data-wv-area=work]) :is(.filters,.manage-grid,.manage-grid form,.cards),body[data-wv-area=business] .businessCards,body[data-wv-area=events] #eventManage form{grid-template-columns:minmax(0,1fr)}body[data-wv-area=events] #eventManage form>*{grid-column:auto}}
@media print{#wvEcosystemShell,body>header,.sidebar,#wvAppearanceOpen,#wvVoiceOpen,#wvCreditFooter{display:none!important}body,.layout,main{background:#fff!important;color:#000!important;max-width:none!important;display:block!important}.panel,article{break-inside:avoid}a{color:inherit!important}}
/* R51 — watching, chat, profile and dynamically generated data. */
:is(.togetherPage,.mediaPage,.showcase-main){width:100%;max-width:var(--wv-page-width);margin-inline:auto;padding-inline:var(--wv-page-gutter);min-width:0}
:is(.togetherColumns,.liveWatchGrid){display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,320px);gap:var(--wv-layout-gap)}
:is(.togetherHero,.mediaHero){height:auto;min-height:0;padding:clamp(18px,3vw,36px)}
:is(.togetherHero,.mediaHero,.showcase-main .people-hero) h1{font-size:clamp(26px,3.3vw,44px);line-height:1.15}
:is(.mediaGrid,.togetherColumns,.liveWatchGrid)>*{min-width:0}
:is(.mediaGrid,.showcase-main .profile-grid){grid-template-columns:repeat(3,minmax(0,1fr))}
:is(.showcase-tabs,.mediaHeroLinks,.liveViewActions){display:flex;flex-wrap:wrap;gap:10px}
:is(.togetherMessage,.mediaChat p,#liveChat p){white-space:pre-wrap;overflow-wrap:anywhere}
:is(#togetherMessages,#liveChat,.mediaChat){max-height:min(520px,65dvh);overflow:auto;overscroll-behavior:contain}
:is(#togetherMessageForm,#liveChatForm){display:flex;flex-wrap:wrap;gap:10px;align-items:end}
:is(#togetherMessageForm,#liveChatForm)>label{flex:1 1 200px;min-width:0}
:is(.showcase-main,.creationCard) .gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:10px}
:is(.showcase-main,.creationCard) .gallery img{width:100%;height:auto;object-fit:contain}
.wvTableViewport{width:100%;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;border:1px solid #e7deee;border-radius:10px;margin-block:12px;background:#fff}
.wvTableViewport:focus-visible{outline:3px solid #7441cf;outline-offset:3px}
.wvTableViewport table{width:100%;border-collapse:collapse}
.wvTableViewport :is(th,td){padding:10px 12px;vertical-align:top;overflow-wrap:normal}
.wvTableViewport th{background:#f7f3fc;color:#3f285d;text-align:start}
.wvTableViewport tr+tr{border-top:1px solid #e7deee}
@media(max-width:800px){:is(.togetherColumns,.liveWatchGrid){grid-template-columns:minmax(0,1fr)}:is(.mediaGrid,.showcase-main .profile-grid){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){:is(.mediaGrid,.showcase-main .profile-grid){grid-template-columns:minmax(0,1fr)}:is(#togetherMessageForm,#liveChatForm)>button{width:100%}.wvTableViewport :is(th,td){padding:8px}}
@media print{.wvTableViewport{overflow:visible;border:0}#togetherMessageForm,#liveChatForm{display:none}}
/* Auxiliary controls remain bounded when labels or browser text grow. */
:is(#wvVoiceOpen,#wvAppearanceOpen){max-width:min(240px,calc(100vw - 24px));white-space:normal;overflow-wrap:anywhere}
:is(#wvVoiceGuide,#wvAppearanceDialog){max-height:calc(100dvh - 24px);max-width:calc(100vw - 24px);padding:clamp(12px,3vw,24px)}
@media(max-height:500px){:is(#wvVoiceOpen,#wvAppearanceOpen){padding:6px 10px!important;font-size:12px!important}#wvVoiceOpen{bottom:108px!important}#wvAppearanceOpen{bottom:64px!important}}
/* R52 — keyboard entry and native validation, no field values in messages. */
.wvSkipLink{position:absolute;left:12px;top:12px;z-index:1000;transform:translateY(-200%);padding:12px 18px;background:#fff;color:#4b247d;border:2px solid #7441cf;border-radius:10px;text-decoration:none}
.wvSkipLink:focus{transform:none}
.wvValidationSummary{grid-column:1/-1;padding:12px 14px;border:1px solid #b74737;border-radius:10px;background:#fff3ee;color:#8c291e;font-size:14px;line-height:1.6}
:is(input,select,textarea)[data-wv-native-invalid="1"]{border:2px solid #b74737!important}
.wvValidationSummary[hidden]{display:none!important}
:focus-visible{outline:3px solid #7441cf;outline-offset:3px}
