/* Scoped lobby system: common buttons, readable controls, no player overlays. */
.family-room{--line:#27334b;--muted:#a8b6cc;--panel:#101b2e;direction:rtl;grid-template-columns:minmax(0,1fr) 260px;grid-template-areas:"bar bar" "voice voice" "stage members" "chat members";gap:18px;padding:10px 0 40px;font-family:inherit}
.family-room [hidden]{display:none!important}
.family-room button,.family-room input{font:inherit;box-sizing:border-box}
.family-room button{min-height:46px;line-height:1.6;cursor:pointer;transition:background .18s,border-color .18s,transform .18s}
.family-room button:focus-visible,.family-room input:focus-visible{outline:3px solid #a5b4fc;outline-offset:3px}
.family-room button:disabled{cursor:wait;opacity:.6}
.family-room-bar{grid-area:bar;padding:24px;display:grid;grid-template-columns:1fr;border-radius:22px;background:linear-gradient(120deg,#17233a,#0e1728);border-color:var(--line);box-shadow:0 12px 30px #0002}
.family-room-bar h1{font-size:clamp(22px,3vw,30px);font-weight:800;margin:5px 0;color:#f8fafc;display:flex;align-items:center;gap:12px}
.family-room-bar h1 small{font-size:11px;font-weight:500;color:#a9b7d1;border:1px solid #3d4860;padding:2px 8px;border-radius:20px}
.family-room-bar>div>small{font-size:12px;color:#a5b4fc}
.family-room-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:10px;width:100%}
.family-room-actions button,.family-voice-actions button,.family-play-enable,.family-dialog button[type=submit],.family-invite-copy button{display:inline-flex;justify-content:center;align-items:center;gap:8px;padding:12px 16px;border:1px solid #38455e;border-radius:12px;background:#1b2941;color:#eef2ff;font-weight:600;font-size:13px;box-shadow:0 2px 0 #0002}
.family-room-actions button:hover,.family-voice-actions button:hover{background:#293953;border-color:#6c7b9d}
.family-room-actions [data-family-link-open],.family-dialog button[type=submit]{background:#a5b4fc;border-color:#a5b4fc;color:#111827}
.family-room-actions [data-family-link-open]:hover,.family-dialog button[type=submit]:hover{background:#c7d2fe}
.family-room-actions [data-family-mic]::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:#8491a7;flex-shrink:0}
.family-room-actions [data-family-mic].is-on{background:#103d35;border-color:#34d399;color:#a7f3d0}
.family-room-actions [data-family-mic].is-on::before{background:#34d399;box-shadow:0 0 0 4px #34d39922}
.family-room-actions button.danger{color:#fda4af;background:#351d2b;border-color:#683344;font-size:12px}
.family-voice-panel{grid-area:voice;display:flex;justify-content:space-between;align-items:center;gap:16px;border:1px solid var(--line);border-radius:18px;padding:18px 22px;background:#0d182a}
.family-voice-panel b{font-size:15px}.family-voice-panel p{font-size:12px;line-height:1.9;margin:5px 0 0;color:var(--muted);max-width:600px}
.family-voice-panel p.is-error{color:#fda4af}.family-live-dot{display:inline-block;width:7px;height:7px;background:#a5b4fc;border-radius:50%;margin-left:9px}
.family-voice-actions{display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0}.family-voice-actions button{font-size:12px;min-height:40px;padding:8px 12px}
.family-stage{grid-area:stage;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;aspect-ratio:auto;align-self:start;border:1px solid var(--line);border-radius:20px;background:#050a12;min-width:0;overflow:hidden}
.family-stage video,.family-empty-player{aspect-ratio:16/9;width:100%;height:auto;min-height:0;object-fit:contain;flex-shrink:0}
.family-empty-player{justify-content:center;background:radial-gradient(ellipse at center,#16213a,#070c17 75%);font-size:14px;text-align:center;padding:24px;box-sizing:border-box}
.family-empty-player span{color:#a5b4fc;font-size:42px;border:1px solid #425072;width:78px;height:78px;border-radius:50%;display:grid;place-items:center;background:#1a254055}
.family-sync-status{position:static;border:0;border-top:1px solid var(--line);border-radius:0;background:#0d1626;padding:12px 18px;line-height:1.8;color:var(--muted);font-size:12px}
.family-play-enable{margin:12px;align-self:center}
.family-audio{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.family-members{grid-area:members;border-color:var(--line);border-radius:20px;padding:22px;background:#101a2b;align-self:start;min-width:0}
.family-members h2{font-size:16px;display:flex;justify-content:space-between;gap:8px}.family-members h2 small{font-size:11px;color:var(--muted)}
.family-member{padding:16px 0;gap:10px}.family-member:last-child{border-bottom:0}.family-member>span{background:#263558;color:#c7d2fe;border:1px solid #455579;border-radius:50%;width:38px;height:38px;flex-shrink:0}.family-member b{font-size:13px;overflow-wrap:anywhere}.family-member small{font-size:11px;margin-top:3px}
.family-dialog{box-sizing:border-box;width:min(650px,calc(100% - 28px));padding:26px;border-color:#40516e;box-shadow:0 30px 120px #0009;direction:rtl;font:inherit}
.family-dialog h2{font-size:21px;margin:6px 0 20px}.family-dialog p{font-size:13px;line-height:2;color:#b4c2d8}.family-dialog label{display:block;font-size:13px;margin:12px 0 8px;color:#dbeafe}
.family-dialog input{background:#080f1d;border:1px solid #455579;border-radius:12px;color:#fff;min-height:50px;padding:12px;font-size:14px}
.family-dialog form>button:first-child{min-height:36px;height:36px;width:36px;font-size:20px;float:left;padding:0;display:grid;place-items:center}
.family-dialog [data-family-link-feedback]{color:#c7d2fe;min-height:25px}.family-dialog button[type=submit]{width:100%;margin-top:10px}
.family-archive button{min-height:95px}.family-archive b{font-size:13px;line-height:1.8}.family-archive small{font-size:11px}.family-archive button:disabled{cursor:not-allowed}
.family-chat{grid-area:chat;border:1px solid var(--line);border-radius:20px;background:#0d1727;padding:18px;min-width:0}.family-chat>header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.family-chat>header>div{display:flex;align-items:center}.family-chat h2{font-size:16px;margin:0}.family-chat>header small{color:var(--muted);font-size:11px}.family-chat-log{height:250px;overflow:auto;overscroll-behavior:contain;border:1px solid #283650;border-radius:14px;background:#070d17;padding:12px;scrollbar-color:#475569 transparent}.family-chat-empty{display:grid;place-items:center;height:100%;margin:0;color:var(--muted);font-size:12px}.family-chat-message{max-width:min(82%,620px);margin:8px 0;padding:10px 12px;border-radius:14px 14px 14px 4px;background:#17243a;border:1px solid #30405a}.family-chat-message.is-mine{margin-right:auto;background:#17382f;border-color:#2f6253;border-radius:14px 14px 4px 14px}.family-chat-message>div{display:flex;justify-content:space-between;gap:14px;align-items:center}.family-chat-message b{font-size:11px;color:#c7d2fe}.family-chat-message time{font-size:10px;color:#8795ab}.family-chat-message p{white-space:pre-wrap;overflow-wrap:anywhere;margin:5px 0 0;line-height:1.9;font-size:13px;color:#f1f5f9}.family-chat form{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:10px}.family-chat textarea{resize:vertical;min-height:52px;max-height:140px;padding:10px 12px;border:1px solid #3a4962;border-radius:12px;background:#080f1c;color:#fff;font:inherit;line-height:1.8}.family-chat form button{padding:10px 22px;border:1px solid #a5b4fc;border-radius:12px;background:#a5b4fc;color:#111827;font-weight:700}.family-chat-status{min-height:18px;margin:5px 2px 0;color:#fda4af;font-size:11px}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:900px){.family-room{grid-template-columns:1fr;grid-template-areas:"bar" "voice" "stage" "chat" "members"}.family-room-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.family-room-actions .danger{grid-column:1/-1}.family-voice-panel{align-items:flex-start;flex-direction:column}.family-voice-actions{width:100%}.family-voice-actions button{flex:1}.family-members,.family-chat{grid-column:1/-1}}
@media(max-width:600px){.family-chat{padding:13px;border-radius:16px}.family-chat-log{height:300px}.family-chat-message{max-width:90%}.family-chat form{grid-template-columns:1fr}.family-chat form button{min-height:48px}.family-room-actions [data-family-fullscreen]{grid-column:1/-1}}
@media(max-width:480px){.family-room{gap:12px}.family-room-bar,.family-members{padding:16px;border-radius:16px}.family-room-actions{gap:8px}.family-room-actions button{padding:11px 8px;font-size:12px;min-height:48px}.family-voice-panel{padding:16px;border-radius:16px}.family-dialog{padding:18px}.family-dialog h2{font-size:19px}.family-voice-actions button{font-size:11px}.family-room-bar h1{font-size:23px}}
@media(prefers-reduced-motion:reduce){.family-room button{transition:none}}