@import url('/menu-composition-v2.css');
/* Umbras composed menu family. Existing shared flat controls own action states. */
.family-game-overlay{position:absolute;inset:0;z-index:3;display:grid;place-items:center;padding:32px;background:color-mix(in srgb,var(--ui-paper) 24%,transparent);isolation:isolate}
.family-game-overlay .game-menu-shell{width:min(1080px,100%);position:relative;isolation:isolate}
.family-game-overlay .game-menu-shell>.ui-surface-face{display:none}
.family-game-overlay[data-view=welcome] .game-menu-shell{width:min(740px,100%)}
.family-game-overlay[data-view=welcome] .family-layout{grid-template-columns:minmax(0,1fr)}
.family-panel{--ui-control-height-primary:88px;--ui-control-type-primary:40px;--ui-control-height-menu:56px;--ui-control-type-menu:24px;position:relative;isolation:isolate;display:flex;flex-direction:column;gap:28px;width:100%;max-height:calc(100dvh - 64px);padding:36px 40px 28px;color:var(--ui-ink);background:var(--ui-paper);border:1px solid var(--ui-ink);clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%);min-height:0;overflow:clip}
.family-panel::after{content:"";position:absolute;right:0;top:28px;width:40px;height:1px;background:var(--ui-ink);transform-origin:right top;transform:rotate(45deg);pointer-events:none}
.family-header{flex:none;display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0}
.family-header h1,.family-header h2{font-size:clamp(38px,4vw,56px);line-height:1.12;font-weight:400;letter-spacing:-.025em;margin:0;min-width:0;text-wrap:balance}
.family-header :is(h1,h2):focus{outline:none}
.family-back{width:112px!important;flex:none}
.family-intro{font-size:18px;line-height:1.5;margin:-12px 0 0;color:var(--ui-muted)}
.family-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px;min-height:0;overflow:clip}
.family-nav{display:flex;flex-direction:column;gap:12px;min-width:0;padding:3px 6px 6px 0}
.family-nav [aria-current=page]{--control-face:var(--ui-ink);--control-label:var(--ui-paper);--control-border:var(--ui-paper)}
.family-nav .family-home{margin-top:auto}
.family-panel-scroll{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:2px 8px 8px 2px;scroll-padding:8px}
.family-panel-scroll h2{font-size:28px;line-height:1.25;font-weight:400;letter-spacing:-.01em;margin:0 0 24px}
.family-panel-scroll h3{font-size:22px;line-height:1.3;font-weight:400;margin:0}
.family-panel-scroll p{font-size:17px;line-height:1.5;margin:8px 0 0;color:var(--ui-muted)}
.family-controls{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:20px 28px;align-items:center;font-size:18px;line-height:1.4;margin:0}
.family-controls dt,.family-controls dd{margin:0;min-width:0}.family-controls dt{display:flex;align-items:center;gap:12px}.family-controls dd{color:var(--ui-muted)}
.family-controls .ui-key-pair{--ui-key-size:30px;gap:18px}.family-controls .ui-key{min-width:30px;height:32px}.family-controls .ui-mouse-icon{height:36px;width:26px}
.family-settings{min-width:0}.family-setting-row{display:grid;grid-template-columns:minmax(0,1fr) 172px;align-items:center;gap:24px;padding:22px 0;border-top:1px solid var(--ui-rule)}
.family-setting-row p{font-size:16px;line-height:1.5;margin:6px 0 0}.family-setting-row .utility-toggle{width:172px}.family-setting-row .toggle-label-full{display:inline!important}.family-setting-row .toggle-label-compact{display:none!important}.family-setting-row .toggle-label{font-size:16px}.family-setting-row .toggle-track{width:72px;height:36px;font-size:13px}.family-setting-phase>span{font-size:20px;text-align:right}
.family-setting-phase .ui-key{font-size:13px;height:24px;min-width:24px;padding:0 4px}
.family-footer{flex:none;display:flex;flex-direction:column;gap:14px;padding:0 6px 6px 0}
.family-footer-meta{display:flex;justify-content:space-between;align-items:center;gap:20px;color:var(--ui-muted);font-size:14px;line-height:1.5;font-variant-numeric:tabular-nums}
.family-section-select{width:100%;height:48px;border:1px solid var(--ui-ink);border-radius:0;background:var(--ui-paper);color:var(--ui-ink);padding:0 12px;font:16px/1.3 'Umbras DIN','Segoe UI',Arial,sans-serif}
.family-select-label{display:none}
.family-panel[data-family-section=gallery] .family-layout{grid-template-columns:minmax(0,1fr)}
.family-panel[data-family-section=gallery] .family-nav,.family-panel[data-family-section=gallery] .family-select-label{display:none}
.family-gallery{display:grid;grid-template-columns:160px minmax(0,1fr);gap:28px;min-height:0}
.family-filmstrip{display:flex;flex-direction:column;gap:18px;max-height:470px;overflow:auto;overscroll-behavior:contain;padding:4px 8px 6px 4px;scroll-padding:4px}
.family-thumbnail{display:block;text-align:left;padding:0;border:1px solid transparent;background:none;color:var(--ui-ink);flex:none;min-width:0;width:100%;cursor:pointer;touch-action:manipulation}
.family-thumbnail img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:var(--ui-paper)}
.family-thumbnail span{display:block;padding:9px 8px;font-size:15px;line-height:1.4}
.family-thumbnail[aria-pressed=true]{border-color:var(--ui-ink)}
.family-thumbnail:focus-visible{outline:2px solid var(--ui-ink);outline-offset:2px}
.family-selected{min-width:0;margin:0;display:flex;flex-direction:column;gap:16px}
.family-image-stage{display:flex;align-items:center;justify-content:center;min-width:0;background:var(--ui-paper);border:1px solid var(--ui-rule)}
.family-image-stage img{display:block;width:100%;height:auto;max-height:440px;object-fit:contain}
.family-selected figcaption{display:flex;align-items:center;justify-content:space-between;gap:20px}.family-selected figcaption h2{font-size:23px;margin:0}.family-selected figcaption p{font-size:14px;margin:5px 0 0}.family-download{width:192px!important;flex:none}
.family-gallery-empty{padding:28px 0 40px}.family-gallery-empty h2{margin-bottom:12px}.family-gallery-empty p{max-width:48ch}
.family-content-page{margin-top:0!important;max-width:1080px}.family-content-panel{gap:28px;padding:32px 40px;max-height:calc(100dvh - 160px);--ui-control-height-primary:88px}
.family-content-panel>.panel-outline{display:none}.family-content-panel .family-panel-scroll{padding-right:10px}.family-content-panel .page-heading{margin:0}.family-content-panel .family-header h2{margin:0}.family-content-panel .back-control{margin:0;padding:0;font-size:18px}.family-content-panel .back-control>svg{display:none}
.family-content-panel .note{grid-template-columns:180px minmax(0,1fr);padding:24px 0}.family-content-panel .note:first-child{border-top:0;padding-top:0}.family-content-panel .diary-caption{margin-top:24px}.family-content-panel .patrons-layout{border-top:0;padding-top:0}
@media(hover:hover) and (pointer:fine){.family-thumbnail:hover{outline:1px solid var(--ui-ink);outline-offset:2px}}
@media(max-width:900px){.family-panel{padding:30px;gap:24px}.family-layout{grid-template-columns:170px minmax(0,1fr);gap:24px}.family-controls{gap:18px 20px}.family-controls .ui-key-pair{flex-direction:column;gap:8px;align-items:flex-start}.family-setting-row{grid-template-columns:minmax(0,1fr) 148px;gap:16px}.family-setting-row .utility-toggle{width:148px}.family-gallery{grid-template-columns:130px minmax(0,1fr);gap:20px}}
@media(max-width:700px){.family-game-overlay{padding:16px}.family-panel{--ui-control-height-primary:76px;--ui-control-type-primary:34px;gap:20px;padding:24px 22px 20px;max-height:calc(100dvh - 32px);clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}.family-panel::after{width:29px}.family-header{gap:16px}.family-header h1,.family-header h2{font-size:36px;line-height:1.16}.family-back{width:88px!important}.family-layout{grid-template-columns:1fr;gap:18px}.family-nav{display:none}.family-select-label{display:block}.family-panel-scroll{padding-right:6px}.family-panel-scroll h2{font-size:25px;margin-bottom:18px}.family-controls{grid-template-columns:184px minmax(0,1fr);gap:18px 14px;font-size:17px}.family-controls .ui-key-pair{flex-direction:row;gap:12px;--ui-key-size:24px}.family-controls .ui-key{font-size:14px;min-width:26px;height:28px}.family-controls .ui-key-pad .ui-key{min-width:0;height:100%}.family-setting-row{grid-template-columns:minmax(0,1fr);gap:14px;padding:18px 0}.family-setting-row h3{font-size:21px}.family-setting-row p{font-size:15px}.family-setting-row .utility-toggle{width:100%}.family-setting-row .toggle-label{font-size:16px}.family-setting-phase{grid-template-columns:minmax(0,1fr) auto}.family-setting-phase>span{font-size:18px}.family-footer{gap:10px;padding-right:4px}.family-footer-meta{font-size:12px;gap:12px}.family-gallery{display:flex;flex-direction:column;gap:18px}.family-selected{order:0;gap:14px}.family-filmstrip{order:1;flex-direction:row;gap:12px;max-height:none;overflow:auto;padding:3px 3px 6px}.family-thumbnail{width:112px}.family-thumbnail span{font-size:13px;padding:7px}.family-image-stage img{max-height:30dvh}.family-selected figcaption{align-items:flex-start;flex-direction:column;gap:12px}.family-selected figcaption h2{font-size:22px}.family-download{width:100%!important}.family-content-panel{max-height:calc(100dvh - 140px)}.family-content-panel .note{grid-template-columns:1fr;gap:12px}.family-content-panel .diary-caption{grid-template-columns:1fr}.family-content-page{max-width:100%}}
@media(max-width:350px){.family-panel{padding-left:18px;padding-right:18px}.family-header h1,.family-header h2{font-size:32px}.family-controls{grid-template-columns:100px minmax(0,1fr);gap:18px 14px}.family-controls .ui-key-pair{flex-direction:column;align-items:flex-start;gap:10px}.family-back{width:78px!important}.family-back .control-content{--ui-control-inset:8px}.family-header{gap:10px}}
@media(max-height:650px){.family-game-overlay{padding:12px}.family-panel{max-height:calc(100dvh - 24px);padding-top:22px;gap:18px}.family-footer-meta{display:none}.family-header h1{font-size:34px}.family-image-stage img{max-height:25dvh}}
@media(prefers-reduced-motion:reduce){.family-panel *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Keep the existing capture announcement available to assistive technology,
   without letting it cover an open menu or its fixed Resume action. */
#stage:has(.family-game-overlay:not([hidden])) #captureStatus{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){.family-setting-row{grid-template-columns:minmax(0,1fr) 124px;gap:14px}.family-setting-row .utility-toggle{width:124px}.family-setting-row .toggle-label-full{display:none!important}.family-setting-row .toggle-label-compact{display:inline!important}.family-setting-row .toggle-track{width:60px;height:32px}.family-setting-row .toggle-label{font-size:14px}}
@media(max-width:700px){.family-panel::after{top:20px}}
@media(max-width:350px){.family-panel[data-family-section=gallery] .family-header h1{font-size:28px}.family-setting-row:not(.family-setting-phase) p{display:none}}
@media(max-width:700px) and (max-height:650px){.family-panel[data-family-section=gallery]{gap:14px;padding-top:18px}.family-selected{gap:10px}.family-image-stage img{max-height:20dvh}.family-selected figcaption{gap:8px}.family-selected figcaption h2{font-size:20px}.family-selected figcaption p{font-size:12px}.family-filmstrip{gap:8px}.family-thumbnail{width:96px}.family-thumbnail span{font-size:12px;padding:5px}}
/* Content pages share the chrome while retaining their video/text/credits body.
   Reserve space for the preserved utilities rather than pushing them below view. */
body[data-page="true"] #app{padding-top:96px!important;padding-bottom:20px}
.family-content-panel{max-height:calc(100dvh - 208px)}
.family-content-panel .back-control>svg.control-face{display:block}
.family-setting-row .family-two-state .toggle-track{width:100%;height:36px;font-size:16px}

/* Entry metadata, shared with validated export labels; no publication badge. */
.family-content-panel .note-release-state{display:flex;flex-direction:column;gap:2px;margin:12px 0 0;font-size:16px;line-height:1.5;color:var(--ui-muted)}
.family-content-panel .note-release-state :is(dt,dd){margin:0}
.family-content-panel .note-release-state dd{color:var(--ui-ink)}

/* Pause is a rectangular in-game surface. Main-menu geometry stays upstream. */
.family-game-overlay{padding:24px}
.family-game-overlay .game-menu-shell{width:min(1040px,100%)}
.family-game-overlay[data-view=welcome] .game-menu-shell{width:min(880px,100%)}
.family-game-overlay .family-panel{--ui-control-height-primary:64px;--ui-control-type-primary:30px;--ui-control-height-compact:48px;--ui-control-type-compact:18px;gap:0;padding:28px;max-height:calc(100dvh - 48px);clip-path:none}
.family-game-overlay .family-panel::after{display:none}
.family-game-overlay .pause-header{margin-bottom:20px;gap:16px}
.family-game-overlay .pause-header h1{font-size:40px;line-height:1.15}
.pause-count{font-size:16px;line-height:1.4;color:var(--ui-muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.family-game-overlay .family-intro{margin:0 0 20px}
.pause-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;flex:none;margin-bottom:20px;border:1px solid var(--ui-ink)}
.pause-tab{min-width:0;min-height:48px;padding:10px 12px;background:var(--ui-paper);color:var(--ui-ink);border:0;border-radius:0;font:18px/1.3 'Umbras DIN','Segoe UI',Arial,sans-serif;cursor:pointer;touch-action:manipulation}
.pause-tab+.pause-tab{border-left:1px solid var(--ui-rule)}
.pause-tab[aria-selected=true]{background:var(--ui-ink);color:var(--ui-paper)}
.pause-tab:focus-visible{position:relative;z-index:1;outline:2px solid var(--ui-ink);outline-offset:3px}
.family-game-overlay .pause-content{flex:1 1 auto;padding:4px 6px 6px 4px;scrollbar-gutter:stable;outline-offset:-2px}
.family-game-overlay .pause-action{clip-path:none;border:1px solid var(--control-border,var(--ui-ink));border-radius:0;background:var(--control-face,var(--ui-paper));color:var(--control-label,var(--ui-ink));min-height:48px}
.family-game-overlay .pause-action :is(.control-face,.control-cast,.control-contact){display:none!important}
.family-game-overlay .pause-action.flat-control[data-control-variant] .control-content{padding:8px 16px;justify-content:center}
.family-game-overlay .pause-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,280px);align-items:center;gap:24px;margin-top:24px;padding:0}
.pause-navigation{min-width:0}
.pause-home{display:inline-flex;align-items:center;min-height:48px;padding:8px 4px;color:var(--ui-muted);font-size:18px;line-height:1.4;text-decoration:underline;text-underline-offset:4px;touch-action:manipulation}
.pause-home:focus-visible{outline:2px solid var(--ui-ink);outline-offset:3px}
.family-game-overlay [data-family-primary] .pause-action{width:100%}
.pause-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:220px;padding:20px 12px;text-align:center}
.family-game-overlay .pause-empty h2{font-size:28px;margin:0 0 8px}
.family-game-overlay .pause-empty p{margin:0;max-width:40ch}
.pause-empty [data-pause-capture]{width:220px;max-width:100%;margin-top:24px}
.family-game-overlay .pause-empty .pause-session-note{font-size:14px;margin-top:16px}
.family-game-overlay .pause-gallery{display:flex;flex-direction:column;gap:16px;min-width:0}
.family-game-overlay .family-selected{order:0;gap:12px}
.family-game-overlay .family-image-stage{height:clamp(180px,36dvh,360px);min-height:0}
.family-game-overlay .family-image-stage img{width:100%;height:100%;max-height:none;object-fit:contain}
.family-game-overlay .family-selected figcaption{flex-direction:row;align-items:center;gap:16px}
.family-game-overlay .family-selected figcaption h2{font-size:22px;margin:0}
.family-game-overlay .family-selected figcaption p{font-size:14px;line-height:1.4;margin:4px 0 0}
.family-game-overlay .family-download{width:180px!important;font-size:18px}
.family-game-overlay .family-filmstrip{order:1;flex-direction:row;gap:12px;max-height:none;overflow:auto;padding:4px 4px 8px}
.family-game-overlay .family-thumbnail{width:112px}
.family-game-overlay .family-thumbnail img{height:64px;aspect-ratio:auto;object-fit:contain}
.family-game-overlay .family-thumbnail span{font-size:13px;padding:6px}
.pause-control-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}
.pause-control-groups>section+section{border-left:1px solid var(--ui-rule);padding-left:28px}
.family-game-overlay .pause-control-groups h2{font-size:24px;margin-bottom:20px}
.family-game-overlay .family-controls{grid-template-columns:max-content minmax(0,1fr);gap:16px 24px;font-size:17px}
.family-game-overlay .family-controls .ui-key-pair{flex-direction:row;align-items:flex-start;gap:16px}
.family-game-overlay .family-setting-row{grid-template-columns:minmax(0,1fr) 180px;gap:24px;padding:18px 0}
.family-game-overlay .family-setting-row:first-child{border-top:0;padding-top:4px}
.family-game-overlay .family-setting-row h3{font-size:22px}
.family-game-overlay .family-setting-row p{display:block;font-size:15px}
.family-game-overlay .family-setting-row .utility-toggle{width:180px;min-height:48px}
.family-game-overlay .family-setting-row .toggle-label-full{display:inline!important}
.family-game-overlay .family-setting-row .toggle-label-compact{display:none!important}
.family-game-overlay .family-setting-row .family-two-state .toggle-track{height:40px;font-size:16px}
.family-game-overlay .family-setting-row .pause-audio-unavailable{justify-content:center;opacity:1;color:var(--ui-muted);cursor:default}
.family-host-settings,.family-host-controls{min-width:0}
.family-host-controls>h2{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.family-host-settings{margin-top:8px;padding-top:20px;border-top:1px solid var(--ui-rule)}
.family-host-settings :is(button,select){min-height:48px;border:1px solid var(--ui-ink);border-radius:0;background:var(--ui-paper);color:var(--ui-ink);font:17px/1.4 'Umbras DIN','Segoe UI',Arial,sans-serif;padding:8px 12px;max-width:100%}
.family-host-settings :is(button,select):focus-visible{outline:2px solid var(--ui-ink);outline-offset:3px}
.family-game-overlay[data-reduced=true] *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(hover:hover) and (pointer:fine){.pause-tab:not([aria-selected=true]):hover{background:color-mix(in srgb,var(--ui-ink) 8%,var(--ui-paper))}.pause-home:hover{color:var(--ui-ink)}}
@media(max-width:700px){
 .family-game-overlay{padding:12px}
 .family-game-overlay .family-panel{--ui-control-height-primary:56px;--ui-control-type-primary:26px;--ui-control-type-compact:16px;padding:20px 16px;max-height:calc(100dvh - 24px)}
 .family-game-overlay .pause-header{margin-bottom:16px;gap:12px}
 .family-game-overlay .pause-header h1{font-size:34px}
 .pause-count{font-size:13px}
 .pause-tabs{grid-template-columns:1.35fr 1fr 1fr;margin-bottom:16px}
 .pause-tab{font-size:15px;padding:10px 6px}
 .family-game-overlay .pause-content{padding:4px 4px 6px}
 .family-game-overlay .pause-footer{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:20px}
 .pause-home{font-size:16px}
 .pause-empty{min-height:200px;padding:12px 4px}
 .family-game-overlay .pause-empty h2{font-size:24px}
 .family-game-overlay .pause-empty p{font-size:15px}
 .family-game-overlay .pause-empty .pause-session-note{font-size:13px}
 .family-game-overlay .family-image-stage{height:28dvh}
 .family-game-overlay .family-selected{gap:10px}
 .family-game-overlay .family-selected figcaption{gap:10px;align-items:center}
 .family-game-overlay .family-selected figcaption h2{font-size:18px}
 .family-game-overlay .family-selected figcaption p{font-size:12px}
 .family-game-overlay .family-download{width:124px!important;font-size:14px}
 .family-game-overlay .family-download.flat-control[data-control-variant] .control-content{padding:6px}
 .family-game-overlay .family-filmstrip{gap:10px}
 .family-game-overlay .family-thumbnail{width:96px}
 .family-game-overlay .family-thumbnail img{height:54px}
 .family-game-overlay .family-thumbnail span{font-size:12px;padding:5px}
 .pause-control-groups{grid-template-columns:1fr;gap:24px}
 .pause-control-groups>section+section{padding:20px 0 0;border-left:0;border-top:1px solid var(--ui-rule)}
 .family-game-overlay .pause-control-groups h2{font-size:22px;margin-bottom:16px}
 .family-game-overlay .family-controls{gap:14px 16px;font-size:16px}
 .family-game-overlay .family-controls .ui-key-pair{flex-direction:row;gap:12px}
 .family-game-overlay .family-setting-row{grid-template-columns:minmax(0,1fr) 124px;gap:12px;padding:16px 0}
 .family-game-overlay .family-setting-row h3{font-size:18px}
 .family-game-overlay .family-setting-row p{font-size:13px}
 .family-game-overlay .family-setting-row .utility-toggle{width:124px}
 .family-game-overlay .family-setting-row .toggle-label{font-size:14px}
 .family-game-overlay .family-setting-row .family-two-state .toggle-track{font-size:14px}
}
@media(max-width:350px){
 .family-game-overlay .pause-header h1{font-size:30px}
 .family-game-overlay .family-controls .ui-key-pair{flex-direction:column}
 .family-game-overlay .family-panel[data-family-section=gallery] .pause-header h1{font-size:30px}
 .family-game-overlay .family-setting-row p{display:block}
 .family-game-overlay .family-selected figcaption h2{font-size:16px;white-space:nowrap}
}
@media(max-height:650px){
 .family-game-overlay{padding:12px}
 .family-game-overlay .family-panel{max-height:calc(100dvh - 24px);padding-top:18px;padding-bottom:18px}
 .family-game-overlay .pause-header{margin-bottom:14px}
 .family-game-overlay .pause-header h1{font-size:30px}
 .pause-tabs{margin-bottom:12px}
 .family-game-overlay .pause-footer{margin-top:16px}
 .pause-empty{min-height:180px;padding-top:8px;padding-bottom:8px}
 .pause-empty [data-pause-capture]{margin-top:18px}
 .family-game-overlay .family-image-stage{height:22dvh}
}

/* Welcome frame: one strong face/keyline and one receding cast. Its two
   opposed cuts borrow the retained game's angular language; actions stay square. */
.family-game-overlay[data-view=welcome]{padding:40px}
.family-game-overlay[data-view=welcome] .game-menu-shell{--welcome-cut:48px;--welcome-heel:20px;--welcome-shape:polygon(0 0,calc(100% - var(--welcome-cut)) 0,100% var(--welcome-cut),100% 100%,var(--welcome-heel) 100%,0 calc(100% - var(--welcome-heel)));width:min(1000px,100%);filter:drop-shadow(0 18px 24px color-mix(in srgb,var(--ui-ink) 16%,transparent));animation:shade-welcome-enter calc(var(--ui-duration-enter)*1.5) var(--ui-ease-enter) both}
.family-game-overlay[data-view=welcome] .game-menu-shell::before{content:"";position:absolute;inset:-5px -5px -5px -12px;z-index:-1;clip-path:var(--welcome-shape);background:var(--ui-ink);pointer-events:none}
.family-game-overlay[data-view=welcome] .game-menu-shell::after{content:"";position:absolute;inset:-5px;z-index:-2;clip-path:var(--welcome-shape);background:linear-gradient(145deg,color-mix(in srgb,var(--ui-ink) 54%,transparent),color-mix(in srgb,var(--ui-ink) 24%,transparent));transform:translate(16px,18px);pointer-events:none}
.family-game-overlay[data-view=welcome] .family-panel{max-height:calc(100dvh - 96px);padding:34px 40px 32px;border:0;clip-path:var(--welcome-shape);background:linear-gradient(145deg,color-mix(in srgb,var(--ui-ink) 4%,var(--ui-paper)),var(--ui-paper) 40%)}
.family-game-overlay[data-view=welcome] .pause-header{margin-bottom:16px}
.family-game-overlay[data-view=welcome] .pause-header h1{font-size:52px;line-height:1.08;letter-spacing:-.025em}
.family-game-overlay[data-view=welcome] .family-intro{font-size:17px;line-height:1.5;max-width:none;margin:0 0 24px;padding-bottom:22px;border-bottom:1px solid var(--ui-rule)}
.family-game-overlay[data-view=welcome] .pause-control-groups{gap:36px}
.family-game-overlay[data-view=welcome] .pause-control-groups .family-controls{grid-auto-rows:minmax(44px,auto);gap:14px 20px}
.family-game-overlay .flight-control-note{margin:24px 0 0;padding:18px 0 0;border-top:1px solid var(--ui-rule);font-size:16px;line-height:1.5;color:var(--ui-muted)}
.family-game-overlay .flight-control-note .ui-key{height:25px;min-width:25px;font-size:14px}
.family-game-overlay[data-view=welcome] .pause-footer{grid-template-columns:minmax(0,1fr) 280px;gap:24px;margin-top:24px}
.family-game-overlay[data-view=welcome] .pause-navigation{display:none}
.family-game-overlay[data-view=welcome] .welcome-entry-note{font-size:14px;line-height:1.5;color:var(--ui-muted);margin:0;max-width:34ch}
.family-game-overlay[data-view=welcome] [data-family-primary]{width:100%;justify-self:end}
@keyframes shade-welcome-enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){
 .family-game-overlay[data-view=welcome]{padding:22px}
 .family-game-overlay[data-view=welcome] .game-menu-shell{--welcome-cut:32px;--welcome-heel:14px;filter:drop-shadow(0 10px 16px color-mix(in srgb,var(--ui-ink) 14%,transparent))}
 .family-game-overlay[data-view=welcome] .game-menu-shell::before{inset:-4px -4px -4px -8px}
 .family-game-overlay[data-view=welcome] .game-menu-shell::after{inset:-4px;transform:translate(9px,11px)}
 .family-game-overlay[data-view=welcome] .family-panel{max-height:calc(100dvh - 60px);padding:24px 18px 22px}
 .family-game-overlay[data-view=welcome] .pause-header h1{font-size:34px;line-height:1.15}
 .family-game-overlay[data-view=welcome] .family-intro{font-size:15px;padding-bottom:18px;margin-bottom:18px}
 .family-game-overlay[data-view=welcome] .pause-control-groups{gap:22px}
 .family-game-overlay[data-view=welcome] .family-controls .ui-key-pair{flex-direction:column;gap:8px}
 .family-game-overlay[data-view=welcome] .pause-footer{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:18px}
 .family-game-overlay[data-view=welcome] .welcome-entry-note{font-size:13px;max-width:none}
 .family-game-overlay .flight-control-note{font-size:14px;margin-top:20px;padding-top:16px}
}
@media(max-width:350px){.family-game-overlay[data-view=welcome] .pause-header h1{font-size:28px}}