[hidden]{display:none!important}main{position:relative;max-width:1060px;margin:auto;padding:18px 16px 95px}.panel{background:#0a3039e8;border:1px solid var(--line);border-radius:16px;padding:18px;margin:12px 0}#lobby{max-width:480px;margin:30px auto}h1{color:var(--gold);letter-spacing:5px}input,select{background:#041d26;color:var(--cream);border:1px solid var(--line);border-radius:9px;padding:10px;max-width:100%}label{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0}button{border:1px solid var(--line);border-radius:9px;background:#103d46;padding:10px 14px}button:focus-visible,input:focus-visible{outline:3px solid var(--gold)}.gold{background:linear-gradient(110deg,#fce6a1,#d7a34f);color:#14383b;font-weight:900}.avatar-list{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0}.avatar-list img,.seat img{height:42px;width:42px;border-radius:50%;object-fit:cover}.avatar-list button{padding:3px}.avatar-list [aria-pressed=true]{outline:2px solid var(--gold)}.room-bar,.seats{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.room-bar{justify-content:space-between;padding:10px}.seats{justify-content:center;margin:10px 0}.seat{display:flex;align-items:center;gap:8px;background:#0c303a;border:1px solid var(--line);border-radius:30px;padding:5px 14px 5px 5px;font-size:12px}.seat.active{border-color:var(--gold);box-shadow:0 0 14px #e8bb6833}.seat small{display:block;color:#a3d8cd}.table-wood{height:360px;min-height:360px;margin:15px 0}.table-felt{position:relative;height:100%}.lk-center{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;flex-direction:column;height:100%;gap:8px;text-align:center;padding:14px}.lk-center p{margin:0;max-width:90%}#timer{color:var(--gold)}.face-down{position:relative}.face-down img{height:100px;border-radius:6px;box-shadow:4px 4px #c8b380,7px 7px #08252c}.face-down b{position:absolute;right:-24px;bottom:8px;background:#092630;border:1px solid var(--gold);padding:5px;border-radius:20px}.hand-dock{position:relative;padding:16px;text-align:center}.lk-hand{display:flex;gap:6px;overflow-x:auto;padding:15px 4px 20px;min-height:125px}.lk-card{padding:0;border:0;background:transparent;flex:0 0 66px}.lk-card img{width:66px;height:100px;border-radius:5px;display:block}.lk-card.selected{transform:translateY(-10px);outline:3px solid var(--gold)}#ranks{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;max-width:580px;margin:auto}#ranks button{padding:0;background:transparent;border:0}#ranks img{width:100%;border-radius:4px}#result img{height:80px;margin:4px}#message{color:#ffda8d;position:relative;min-height:24px}summary{cursor:pointer}#connection{margin-left:auto;font-size:12px}#identityNote{font-size:12px;color:var(--mint)}@media(max-width:600px){main{padding:9px 8px 90px}.header{gap:8px;padding:8px;height:auto;flex-wrap:wrap}.header button{font-size:10px;padding:7px}.seats{gap:5px}.seat{font-size:10px;padding-right:9px}.seat img{height:30px;width:30px}.table-wood{height:320px;min-height:320px}.lk-center{font-size:12px}.panel{padding:12px}#ranks{grid-template-columns:repeat(5,1fr);max-width:300px}#ranks img{max-height:73px;width:auto;max-width:100%}.lk-card,.lk-card img{width:62px;flex-basis:62px}.lk-card img{height:94px}.chat-panel{bottom:78px}}
[id=game].final-challenge .table-wood{border-color:#ffe29a;box-shadow:0 0 25px #f1c87366}
.final-challenge #timer{font-size:42px;font-weight:900;line-height:1.1}
.final-challenge #challenge{font-size:22px;min-height:52px;padding:10px 30px}
.final-challenge #status{font-weight:800;color:var(--gold)}
/* Exact active-turn colours from Hezz Jouj turn-cards.css, scoped to LKDOUB. */
.seat.active,.hand-dock.turn-active{background:#176b45;color:#fffbea}
.seat.active{box-shadow:0 0 0 3px #176b45}
.hand-dock.turn-active{border-color:#176b45;box-shadow:0 0 0 3px #176b45}
.seat.active small{color:#e0f6e6}
#dragHint{font-size:12px;color:#d6ebe3;max-width:680px;margin:8px auto}
.lk-card img{pointer-events:none;user-select:none;-webkit-user-drag:none}
.lk-card.selected{touch-action:none;cursor:grab;-webkit-touch-callout:none}.lk-hand{user-select:none;-webkit-user-select:none}
#dropTarget{position:absolute;inset:16% 12%;display:grid;place-items:center;border:3px dashed var(--gold);border-radius:24px;background:#176b4566;opacity:0;pointer-events:none;z-index:9;transition:background .15s,opacity .15s}
#dropTarget span{padding:10px;border-radius:12px;background:#08252ce8;font-weight:900;color:#fffbea}
.drag-ready #dropTarget{opacity:1}.drag-ready #dropTarget.drop-hover{background:#176b45bb;border-color:#9cffe1;box-shadow:inset 0 0 25px #65ffbf55}
#dragStack{position:fixed;left:0;top:0;width:66px;height:100px;z-index:50;pointer-events:none;will-change:transform}
#dragStack img{position:absolute;width:66px;height:100px;transform:translate(calc(var(--i)*7px),calc(var(--i)*-3px));border-radius:5px;box-shadow:0 5px 14px #0008}
@media(prefers-reduced-motion:reduce){#dropTarget{transition:none}}
/* LKDOUB gameplay additions; shared reference styles remain untouched. */
#pendingCards{display:flex;gap:5px;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);padding:8px;background:#08252cf5;border-radius:10px}
#pendingCards img{height:76px;border-radius:4px;box-shadow:2px 3px 5px #0009}
.seat.active>img{border:2px solid #6effcf;outline:2px solid #087078;box-shadow:0 0 8px #6effcf,0 0 20px #22bf9899}
.seat.collecting>img{outline:3px solid var(--gold);box-shadow:0 0 22px #f1c87399}
#rankDisplay{display:flex;align-items:center;justify-content:center;gap:12px;min-height:66px}
#rankArt{height:64px;width:42px;border-radius:4px;box-shadow:0 3px 8px #0008}
#announced{font-weight:800;color:var(--gold)}
#challengeStatus{font-size:12px;min-height:32px}
#rankPicker{color:var(--cream);background:linear-gradient(145deg,#10414a,#071f29);border:1px solid var(--gold);border-radius:18px;padding:22px;width:min(640px,calc(100vw - 24px));max-height:90dvh;overflow:auto;text-align:center}
#rankPicker::backdrop{background:#001a22cc;backdrop-filter:blur(5px)}
#rankPicker h2{color:var(--gold);font-size:20px}#rankPicker #ranks{gap:8px}#rankPicker #ranks button{min-height:64px}#rankPicker #ranks button:hover{transform:translateY(-4px)}
.lk-hand{padding:22px 8px 18px;min-height:145px;overscroll-behavior-x:contain;scroll-padding-inline:10px;touch-action:pan-x pan-y}
.lk-card.selected{outline-offset:2px}.lk-card:disabled{opacity:1}
#revealCards{display:flex;justify-content:center;gap:8px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:12px;border-radius:12px;background:#08252cf5;z-index:4}
#revealCards img{height:100px;border-radius:5px;box-shadow:0 5px 15px #0009}
.resolving #status{font-size:17px;font-weight:900;color:var(--gold)}
.resolving .lk-center{justify-content:space-between;padding-top:20px;padding-bottom:16px}
.resolving #rankDisplay{visibility:hidden}.resolving #challenge{visibility:hidden}
#collectionStack{position:fixed;z-index:25;pointer-events:none;width:66px;height:100px;transform-origin:center}
#collectionStack img{width:100%;height:100%;border-radius:5px;box-shadow:3px 3px #d5c29b,6px 6px #0a3039,9px 9px #d5c29b}
.gathering{opacity:.2}.gathering img{box-shadow:3px 3px #d5c29b,6px 6px #0a3039}
@media(max-width:600px){#rankPicker #ranks{grid-template-columns:repeat(5,1fr)}#rankArt{height:54px;width:36px}#rankDisplay{min-height:56px}.lk-center{gap:5px}#challengeStatus{font-size:11px}.resolving #status{font-size:14px}#revealCards{gap:4px;padding:8px}#revealCards img{height:80px}.lk-hand{min-height:137px}}
@media(prefers-reduced-motion:reduce){#rankPicker #ranks button:hover{transform:none}.lk-card{transition:none}#collectionStack{display:none}.gathering{opacity:1}}
/* Comprehensive update: preserve the existing green/gold table and hand rules. */
.table-wood{height:410px;min-height:410px}.lk-center{padding-bottom:80px}
#challenge{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);visibility:visible!important;min-width:150px;min-height:52px;border:2px solid #d65353;background:#681f2a;color:#cf9399;font-size:20px;font-weight:900;opacity:1;z-index:10}
#challenge.challenge-open{background:linear-gradient(135deg,#ff524c,#bb152d);color:#fff7ef;border-color:#ffaaa2;box-shadow:0 0 15px #ff3b3b55}
.final-challenge #challenge{font-size:20px;padding:10px 30px}.resolving #rankDisplay{visibility:visible}
#rankDisplay{position:absolute;right:16px;top:64px;flex-direction:column;gap:4px;max-width:98px;font-size:11px}
#rankArt{height:58px;width:39px}#status{max-width:84%;font-size:13px}
.resolving .lk-center{padding-bottom:80px;justify-content:space-between}.resolving #challengeStatus{max-width:90%;margin-top:auto;padding-bottom:2px}
#announcement{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:9px;padding:13px 17px;border-radius:16px;border:1px solid #ff7272;background:#391d29ee;color:#ffe8e1;box-shadow:0 0 25px #ff222255;z-index:8;animation:kdoubCall 1000ms both}
#announcement img{width:42px;height:42px;border-radius:50%;border:2px solid #ff6b64}#announcement strong{font-size:26px;color:#ff514b;text-shadow:0 0 12px #ff332266}#announcement b{max-width:100px;overflow-wrap:anywhere;font-size:13px}
@keyframes kdoubCall{0%{opacity:0;scale:.92}15%,80%{opacity:1;scale:1}100%{opacity:0;scale:1.02}}
#revealCards{top:42%;background:transparent;gap:9px;perspective:600px;padding:0}
.flip-card{width:66px;height:100px;position:relative;translate:0 -6px}
#revealCards .flip-card img{position:absolute;inset:0;width:100%;height:100%;backface-visibility:hidden;border-radius:5px;animation-duration:260ms;animation-fill-mode:both;animation-delay:var(--flip-delay);animation-timing-function:ease-in-out}
.flip-front{animation-name:cardFront}.flip-back{animation-name:cardBack}
@keyframes cardFront{0%{transform:rotateY(-90deg);visibility:hidden}49%{visibility:hidden}50%{transform:rotateY(-90deg);visibility:visible}100%{transform:rotateY(0);visibility:visible}}
@keyframes cardBack{0%{transform:rotateY(0);visibility:visible}49%{visibility:visible}50%,100%{transform:rotateY(90deg);visibility:hidden}}
.dealing-card{position:fixed;width:40px;height:60px;border-radius:3px;z-index:20;pointer-events:none}.hand-dealing .lk-card{visibility:hidden}
#dealNotice{position:absolute;top:45%;font-weight:800;color:var(--gold);background:#08252ce8;padding:12px;border-radius:12px}
.small-note,#voiceStatus{font-size:11px;color:#b9d5cc;margin:7px 0;text-align:center}
#waiting{display:flex;gap:10px;flex-wrap:wrap}.waiting-person{display:flex;align-items:center;gap:7px;font-size:12px}.waiting-person img{height:32px;width:32px;border-radius:50%}
#removeChoices>div{display:flex;align-items:center;gap:14px;justify-content:space-between;padding:7px;font-size:12px}
.score-scroll{overflow-x:auto}.score-scroll table{width:100%;border-collapse:collapse;font-size:12px}.score-scroll td,.score-scroll th{text-align:left;padding:9px 7px;border-bottom:1px solid #ffffff18;white-space:nowrap}.score-scroll th{color:var(--gold)}.score-scroll td:nth-child(2){display:flex;align-items:center;gap:9px}.score-scroll img{height:32px;width:32px;border-radius:50%}
@media(max-width:600px){.table-wood{height:400px;min-height:400px}#rankDisplay{right:7px;top:48px;max-width:77px;font-size:10px}#rankArt{width:33px;height:50px}#announcement{padding:10px;gap:6px}#announcement strong{font-size:22px}#announcement img{width:34px;height:34px}#announcement b{max-width:75px;font-size:11px}.flip-card{width:54px;height:82px}#revealCards{gap:5px}.score-scroll td,.score-scroll th{padding:8px 5px;font-size:11px}.header #connection{font-size:10px}}
@media(prefers-reduced-motion:reduce){#announcement{animation:none}.flip-front{animation:none!important;visibility:visible}.flip-back{display:none}.flip-card{translate:none}.dealing-card{display:none}}
/* Compact top controls and native dialogs; table/hand theme stays unchanged. */
.header{height:auto;min-height:63px;padding-top:max(8px,env(safe-area-inset-top));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
.top-controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-left:auto}
.top-controls button{font-size:11px;min-height:38px;padding:8px 10px;white-space:nowrap}
#exitRoom{border-color:#dc827577;color:#ffd5cd}
.room-bar{gap:7px;font-size:12px}.room-bar button{padding:8px 10px;font-size:11px}
.lk-dialog{width:min(680px,calc(100vw - 24px));max-height:calc(90dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;border:1px solid var(--gold);border-radius:17px;background:linear-gradient(145deg,#10414a,#071f29);color:var(--cream);padding:18px;box-shadow:0 16px 55px #000a}
.lk-dialog::backdrop{background:#001a22bb;backdrop-filter:blur(4px)}
.dialog-heading{display:flex;gap:10px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:12px}
.dialog-heading h2{margin:0;color:var(--gold);font-size:20px}.dialog-heading button{min-height:40px;min-width:40px;flex-shrink:0}
.lk-dialog p{line-height:1.6;font-size:13px}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.latest-challenge{font-size:12px;text-align:center;color:var(--gold);padding:8px;min-height:0}.latest-challenge:empty{display:none}
#collectionStack{isolation:isolate;z-index:25;pointer-events:none}
@media(max-width:600px){.header{display:grid;grid-template-columns:1fr auto;gap:7px;padding-bottom:8px}.top-controls{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0;gap:4px}.header .top-controls button{font-size:10px;padding:6px 3px;min-height:42px;white-space:normal;line-height:1.25;min-width:0}.room-bar{padding:5px 2px;gap:5px}.room-bar>span{display:none}.room-bar b{font-size:11px;margin-right:auto}.room-bar button{font-size:10px;padding:7px}.lk-dialog{padding:14px}.dialog-heading h2{font-size:18px}}
.lk-dialog button,#rankPicker button{touch-action:manipulation}