/* Морской бой и Домино: структура Дурака, настоящие растровые материалы. */
body:is(.домино,.море) #экран-лобби.фото-лобби {
  padding:calc(10px + var(--отступ-сверху,0px)) max(14px,calc((100% - 620px)/2)) calc(76px + var(--отступ-снизу,0px));
  gap:10px; align-items:stretch; overflow:auto;
}
.фото-лобби > * { flex-shrink:0; }
body .фото-лобби__заголовок h1 { font-size:clamp(34px,9vw,52px); line-height:1.08; letter-spacing:-.035em; }
.фото-лобби__заголовок p { margin-top:6px; font-size:14px; }
body .фото-лобби .карточка-профиля { width:100%; min-height:64px; padding:10px 14px; display:flex; gap:12px; align-items:center; text-align:left; border-radius:18px; }
.фото-лобби__аватар { width:42px; height:42px; flex:none; }
.фото-лобби__аватар img { width:100%; height:100%; filter:invert(.8); }
.фото-лобби__профиль { display:grid; gap:3px; flex:1; min-width:0; }
.фото-лобби__профиль strong { color:#f7f3e8; font-size:18px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.фото-лобби__профиль small { color:#a6afb5; font-size:12px; }
.фото-лобби .карточка-профиля > img { width:18px; height:24px; filter:invert(.8); }
body .фото-лобби__обложка { position:relative; width:100%; margin:0; aspect-ratio:1.55; border-radius:23px; overflow:hidden; background:#152720; box-shadow:0 12px 25px #0006,inset 0 0 0 1px #dcc89d50; }
.фото-лобби__обложка > img { width:100%; height:100%; object-fit:cover; display:block; }
.фото-лобби__обложка::after { content:''; position:absolute; inset:0; border-radius:inherit; border:1px solid #eee4cd40; background:linear-gradient(0deg,#02090bd9,transparent 53%); pointer-events:none; }
.фото-лобби__обложка figcaption { position:absolute; z-index:1; bottom:17px; left:20px; color:#fff9e9; font:500 clamp(20px,5.3vw,29px)/1.1 Georgia,serif; text-shadow:0 2px 8px #000a; }
.фото-лобби__входы { display:grid; gap:9px; }
body .фото-лобби .карточка-входа { width:100%; min-height:64px; padding:11px 13px; display:flex; align-items:center; gap:13px; text-align:left; border-radius:18px; }
.фото-лобби .карточка-входа__значок { width:33px; height:33px; flex:none; }
.фото-лобби .карточка-входа__значок img { width:100%; height:100%; filter:invert(.92); }
.фото-лобби .карточка-входа--играть-онлайн .карточка-входа__значок img,
.фото-лобби .карточка-входа--играть-онлайн .карточка-входа__стрелка img { filter:brightness(0); }
.фото-лобби .карточка-входа__текст { display:grid; gap:4px; flex:1; min-width:0; }
body .фото-лобби .карточка-входа__название { font-size:20px; line-height:1.15; }
body .фото-лобби .карточка-входа__подпись { font-size:12px; line-height:1.35; }
.фото-лобби .карточка-входа__стрелка { width:15px; flex:none; }
.фото-лобби .карточка-входа__стрелка img { width:100%; filter:invert(.7); }
body .фото-лобби .нижние-вкладки { padding-inline:max(12px,calc((100% - 620px)/2)); }
.фото-лобби [role=status]:empty { display:none; }
html.в-телеграме .фото-лобби > :is(.дом-верх,.море-верх) { display:none; }

/* Материал костяшки общий для руки, цепи и итогов, точки всегда точны. */
body.домино .дом-кость { border:0; background:transparent; border-radius:6px; isolation:isolate; padding:5px; gap:7px; box-shadow:0 3px 1px #8e7c58,1px 5px 7px #0009; }
.дом-кость::before { content:''; position:absolute; inset:0; z-index:-1; border-radius:inherit; background:#f2e8ca url('img/домино/кость-фото.jpg') center/100% 100%; }
body.домино .дом-кость::after { display:none; }
.дом-кость .дом-половина { padding:2px; gap:2px; }
.дом-кость .дом-половина .точка { background:radial-gradient(circle at 65% 75%,#4b4941 0,#191c17 45%,#020603 75%); box-shadow:inset 0 1px 2px #000,0 1px 0 #ffffeea0; }
body.домино .дом-на-столе::before { inset:auto; width:50%; height:200%; left:25%; top:-50%; transform:rotate(-90deg); }
body.домино .дом-зона-руки { container-type:size; }
body.домино .дом-рука { gap:7px; padding:8px 5px 12px; }
body.домино .дом-рука .дом-кость { width:max(28px,min(68px,calc((100cqh - 42px)/2),calc((100cqw - 12px - (var(--костей,7) - 1)*7px)/var(--костей,7)))); height:auto; aspect-ratio:1/2; }
body.домино .дом-рука button:disabled { opacity:1; filter:brightness(.82); }
body.домино .дом-рука button[data-можно=true] { border:0; box-shadow:0 3px 1px #8e7c58,0 0 0 2px #c8f16b,0 0 12px #c8f16b55,1px 5px 7px #0009; }
body.домино .дом-рука button[aria-pressed=true] { outline:3px solid #e2ffa0; outline-offset:3px; }
body.домино .дом-стол { border:0; padding:clamp(17px,4.5vw,27px); border-radius:27px; background:url('img/домино/стол-фото.jpg') center/100% 100% no-repeat; box-shadow:0 12px 24px #0008; }
.дом-стол-шапка { min-height:30px; align-items:center; padding:0 0 7px; }
#дом-базар { display:flex; align-items:center; gap:9px; font-size:12px; color:#eee8d8; }
#дом-базар::before { content:''; width:30px; height:19px; flex:none; border:2px solid #e9d9ae; border-radius:4px; background:repeating-linear-gradient(45deg,#303a33 0 1px,#1b2820 1px 3px); box-shadow:0 3px 0 #baab8b,0 5px 0 #e1d4b6,0 7px 4px #0009; }
.дом-закрытые { grid-column:1/-1; display:flex; justify-content:center; gap:3px; padding-top:4px; min-height:23px; overflow:hidden; }
.дом-закрытые i { width:11px; height:19px; border:1px solid #d2c4a6; border-radius:2px; background:repeating-linear-gradient(45deg,#304238 0 1px,#192a21 1px 3px); box-shadow:0 2px 1px #0008; flex-shrink:1; }
.дом-счёт:has(> :last-child:nth-child(2)) .дом-закрытые i { width:18px; height:29px; border-radius:3px; }
body.домино .дом-игрок { align-content:start; }
.дом-игрок:has(.дом-закрытые) { padding-bottom:7px; }
body.домино .дом-очередь { min-height:49px; border:1px solid #ffffff20; box-shadow:0 8px 18px #0003; }
.дом-пустой-стол { color:#d4d8ca99; }
.дом-цепь polyline { stroke-width:2px; stroke:#d7dfb730; stroke-dasharray:3 5; }
body.домино #дом-обзор .дом-цепь { background:url('img/домино/стол-фото.jpg') center/cover; padding:12px; }

/* Поле как в эталоне: крупная сетка, имя, понятная цель и заметный ход. */
body.море #экран-игры { --поле:min(calc(100vw - 24px),calc((100dvh - var(--отступ-сверху,0px) - var(--отступ-снизу,0px) - 225px)/1.49),500px); }
body.море .море-стол { min-width:220px; }
.море-стол > :first-child > .море-имя { min-height:44px; margin-bottom:7px; padding:6px 10px; border:1px solid #b7c9d333; border-radius:12px; background:linear-gradient(135deg,#23343a,#111d23); }
.море-стол > :first-child > .море-имя strong { display:flex; align-items:center; gap:8px; font-size:14px; }
.море-стол > :first-child > .море-имя strong::before { content:''; width:27px; height:27px; flex:none; background:url('img/дурак/значки/avatar.svg') center/contain no-repeat; filter:invert(.8); }
body.море .море-сетка { background-image:linear-gradient(#092236a8,#061b2dcc),url('img/морской-бой/вода.jpg'); border-color:#7cacc458; border-radius:12px; }
body.море .море-сетка > span { font-size:12px; color:#c5d7e7; }
body.море .море-клетка { border-color:#6d9ab956; }
body.море .море-корпус--потоплен { filter:grayscale(.75) brightness(1.12) drop-shadow(0 1px 3px #000c); }
body.море .море-свой .море-сетка > span { font-size:8px; }
body.море #море-очередь { padding:7px 8px; border-radius:9px; background:#d2f76b; color:#142112; font-size:clamp(14px,3.9vw,19px); line-height:1.12; }
body.море #море-очередь.ждём { background:#ffffff09; color:#c2ced1; border:1px solid #ffffff1c; }
#море-очередь.ждём::after { content:'…'; display:inline-block; margin-left:3px; animation:фото-ожидание 1.4s ease-in-out infinite; }
@keyframes фото-ожидание { 50% { opacity:.25; } }
body.море #море-цель { font-size:clamp(17px,4.5vw,23px); }
body.море .море-действия #море-выстрел { font-size:19px; min-height:49px; }
body.море .море-свой { background:linear-gradient(135deg,#1b2c34,#0b1820); border-color:#657c8855; }
body.море .море-свой .море-увеличить { font-size:12px; font-weight:600; }
@media(max-width:350px) {
 body .фото-лобби .карточка-входа__название { font-size:18px; }
 body .фото-лобби .карточка-входа { gap:9px; }
 .фото-лобби .карточка-входа__значок { width:28px; height:28px; }
 body.домино .дом-стол { padding:16px; }
}
@media(min-width:800px),(orientation:landscape) and (min-width:600px) {
 body.море #экран-игры { --поле:min(40vw,calc(100dvh - var(--отступ-сверху,0px) - var(--отступ-снизу,0px) - 170px),430px); }
}
@media(max-height:520px) and (min-width:600px) {
 body.море #экран-игры { --поле:max(160px,min(250px,calc(100dvh - var(--отступ-сверху,0px) - var(--отступ-снизу,0px) - 140px))); }
 body.море .море-стол > :first-child > .море-имя { min-height:30px; margin-bottom:4px; padding:3px 6px; }
 body.море .море-имя strong::before { width:20px; height:20px; }
 body.домино .дом-закрытые { display:none; }
 body.домино .дом-стол { padding:17px; }
}
@media(prefers-reduced-motion:reduce) { #море-очередь.ждём::after { animation:none; } }