html,body{margin:0;min-height:100%;font-family:Tahoma,Arial,sans-serif;background:#08131c;color:#f4eee0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:default}#hokm{padding:0;font-family:Tahoma,Arial,sans-serif}#hokm .hk-app{border:0;border-radius:0;max-width:560px;min-height:100dvh;background:#0d1c27;box-shadow:none}#hokm .hk-header{height:32px;padding:4px 12px;border-bottom:1px solid #806b46}#hokm .hk-header strong{font-size:17px}#hokm #gate:empty{display:none}#hokm #notice:empty{display:none}#hokm #notice{position:fixed;bottom:12px;left:5%;right:5%;padding:10px;background:#142b3b;border:1px solid #a89362;border-radius:10px;z-index:30;pointer-events:none;text-align:center}#hokm .hk-app.in-match{height:var(--app-height,100dvh);min-height:0;overflow:hidden;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}#hokm .in-match #game{flex:1;min-height:0;display:flex;flex-direction:column;gap:3px}#table-toolbar{display:flex;justify-content:space-between;flex:none;height:28px;padding:0 12px}#table-toolbar button{font-size:10px;color:#f1dfb7;background:none;border:0;padding:2px 6px}#table-score{flex:none;display:grid;grid-template-columns:1fr .7fr 1fr;gap:4px;border:1px solid #9c8151;border-radius:9px;margin:0 5px;padding:4px 8px;background:#091322;text-align:center;direction:rtl}#table-score .score-team{display:flex;align-items:center;justify-content:space-around;font-size:12px;border:1px solid;border-radius:7px}#table-score .blue{color:#a3d6ff;background:#112b4a;border-color:#2868ad}#table-score .red{color:#ffc0ba;background:#3b1925;border-color:#a53649}#table-score strong{font-size:25px;color:white;line-height:1.2}#table-score .score-trump{font-size:13px;display:flex;gap:7px;align-items:center;justify-content:center}#table-score .score-trump b{font-family:Georgia,serif;font-size:26px;color:#f7eee0}#table-score .score-trump .red-suit{color:#ff686c}#table-score small{grid-column:1/-1;font-size:9px;color:#c0cddd}#chat-rail{height:78px;flex:none;display:flex;margin:0 4px;border:1px solid #304253;background:#0b1621;border-radius:6px;overflow:hidden;direction:rtl}#chat-rail .recent-chat{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}#chat-rail .chat-row{height:24px;flex:none;display:flex;gap:4px;align-items:center;padding:2px 5px;font-size:11px;border-bottom:1px solid #203240;direction:rtl;min-width:0}#chat-rail .chat-row:last-child{border:0}#chat-rail .chat-row b{color:#b5d6ff;max-width:65px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}#chat-rail .chat-row>span:last-child{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;min-width:0}#chat-rail>button{width:60px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:18px;background:#142534;color:#d0ddef;border:0;border-right:1px solid #304253}#chat-rail>button span{font-size:9px;margin-top:4px}.empty-chat{font-size:10px;color:#a8bdcd;padding:8px}.portrait{position:relative;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:radial-gradient(circle,#4a646b,#233847);width:40px;height:40px;flex:none;border:2px solid #75c5ff;color:#fff;font:20px Arial,sans-serif}.portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.chat-row .portrait{width:20px;height:20px;font-size:10px;border-width:1px}
#playing-table{position:relative;flex:1;min-height:180px;isolation:isolate;margin:2px 6px;background:radial-gradient(ellipse at 50% 35%,#176343,#083e30 70%,#062c24);border:5px solid #76562f;border-radius:48px 48px 38px 38px;box-shadow:inset 0 0 0 2px #d3b97a,inset 0 0 38px #001c1b,0 2px 4px #0009}#playing-table:before{content:'';position:absolute;inset:5px;pointer-events:none;border-radius:inherit;border:1px solid #c6b16d55;z-index:-1}.player-seat{position:absolute;z-index:4;display:flex;flex-direction:column;align-items:center;max-width:85px;text-align:center;gap:2px}.position-0{bottom:5px;left:50%;transform:translateX(-50%)}.position-2{top:5px;left:50%;transform:translateX(-50%)}.position-1{right:4px;top:43%;transform:translateY(-50%)}.position-3{left:4px;top:43%;transform:translateY(-50%)}.player-seat .portrait{width:40px;height:40px;border:2px solid #66c6ff;box-shadow:0 2px 5px #0008}.player-seat.team-red .portrait{border-color:#ff808a}.player-name{font-size:10px;line-height:1.3;max-width:82px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#05291ee8;padding:2px 6px;border-radius:7px}.player-seat small{font-size:8px;color:#dbdcb2;line-height:1}.player-seat.current-turn .portrait{outline:2px solid #ffdc79;outline-offset:3px;box-shadow:0 0 8px 3px #ffcc54b0}.player-seat.current-turn .player-name{background:#5a4518;color:#fff4bc}.card-backs{display:flex;direction:ltr;height:21px;justify-content:center;padding-left:8px;pointer-events:none}.card-backs i{width:15px;height:22px;display:block;border:1px solid #e8debb;border-radius:2px;margin-left:-5px;transform:rotate(-5deg);background:repeating-linear-gradient(45deg,#1b3d72 0 2px,#6283a2 2px 3px)}#table-center{position:absolute;left:23%;right:23%;top:25%;bottom:25%;z-index:3;cursor:pointer}#table-center:empty:after{content:' ';position:absolute;inset:30%;border:1px solid #c7ae5533;border-radius:50%}.center-card{position:absolute;width:clamp(40px,12vw,64px);aspect-ratio:169.075/244.64;animation:card-arrival .2s ease-out;filter:drop-shadow(0 2px 2px #001b1baa)}.center-card svg{width:100%;height:100%;display:block}.center-card small{display:block;font-size:8px;color:#eee7cb;text-align:center;white-space:nowrap}.from-0{left:37%;bottom:-3%;transform:rotate(-5deg);--arrival-y:50px}.from-2{left:35%;top:-4%;transform:rotate(4deg);--arrival-y:-50px}.from-1{right:-5%;top:34%;transform:rotate(12deg);--arrival-x:50px}.from-3{left:-6%;top:34%;transform:rotate(-12deg);--arrival-x:-50px}@keyframes card-arrival{from{opacity:.3;translate:var(--arrival-x,0) var(--arrival-y,0)}to{opacity:1;translate:0 0}}#turn-status{height:22px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 15px;color:#ffe7a0;font-size:11px}#turn-status strong{font-weight:500}#clock{font-variant-numeric:tabular-nums;white-space:nowrap;color:#fff2d0}#player-hand{flex:none;margin:0 6px 5px;min-height:0;background:#0a1724;border-radius:12px;padding:3px 5px}.hand-hint{font-size:9px;text-align:center;line-height:18px;color:#d4dce5;height:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hand-rows{display:flex;flex-direction:column;gap:4px;direction:ltr}.hand-row{display:flex;justify-content:center;gap:2px;direction:ltr}.hand-card{position:relative;flex:1;max-width:61px;min-width:0;aspect-ratio:169.075/244.64;border:0;padding:0;background:#fff7e4;border-radius:4px;box-shadow:0 1px 3px #0009;touch-action:none;user-select:none;transition:translate .12s,box-shadow .12s;color:#111}.hand-card svg{width:100%;height:100%;display:block;pointer-events:none}.hand-card:disabled{opacity:1}.hand-card.unavailable{filter:brightness(.8)}.hand-card.selected{translate:0 -6px;box-shadow:0 0 0 2px #ffe19b,0 0 10px #eec35c}.hand-card.dragging{z-index:40;transition:none;filter:drop-shadow(0 6px 8px #0009)}.trump-choices{display:flex;gap:5px;justify-content:center;margin-top:5px}.trump-choices button{min-height:32px;background:#e7d09d;color:#17283b;border:0;border-radius:6px;font-size:12px;padding:3px 9px}#room-lobby{padding:12px;overflow:auto}#room-lobby li{display:flex;gap:8px;align-items:center;padding:7px;font-size:13px}#room-lobby button,.result-panel button{background:#e9d2a2;color:#17283b;border:1px solid #fff0cb;border-radius:7px;padding:8px 12px;margin:4px}.result-panel{position:absolute;z-index:8;top:35%;left:15%;right:15%;padding:12px;background:#102534f5;border:1px solid #e3c383;border-radius:12px;display:flex;align-items:center;flex-direction:column;gap:9px;text-align:center;font-size:12px}
#settings,#admin{position:fixed;inset:7% max(8px,calc((100vw - 540px)/2));z-index:35;overflow:auto;background:#152b37;border:1px solid #b39a61;border-radius:12px;padding:15px}#settings select{max-width:100%}#chat-dialog{position:fixed;inset:auto 5px 5px;margin:auto;width:min(510px,96vw);height:min(320px,65dvh);padding:10px;background:#0d2131;color:#edf4fa;border:1px solid #b49c68;border-radius:12px;z-index:50;box-sizing:border-box}#chat-dialog[open]{display:flex;flex-direction:column;gap:8px}#chat-dialog::backdrop{background:#0005}#chat-dialog header{display:flex;justify-content:space-between;align-items:center;font-size:13px}#chat-dialog button{background:#dec58d;color:#132638;border:0;border-radius:5px;padding:7px 10px}#chat-history{flex:1;min-height:0;overflow:auto}#chat-history .chat-row{display:flex;gap:5px;padding:6px 0;align-items:start;font-size:12px;border-bottom:1px solid #294253;overflow-wrap:anywhere}#chat-history .chat-row>span:last-child{white-space:pre-wrap;min-width:0}#chat-dialog form{display:flex;flex-direction:row;gap:6px;margin:0;padding:0}#chat-dialog input{min-width:0;flex:1;font-size:16px;border:1px solid #6a8090;border-radius:6px;background:#132f42;color:#fff;padding:8px}#hokm .hk-buzz,#hokm .live-buzz{display:none!important}#hokm .in-match #playing-table{aspect-ratio:auto;height:auto}#hokm [data-skin="نیمه‌شب طلایی"] #playing-table{background:radial-gradient(ellipse,#1c4e68,#09263e);border-radius:32px}#hokm [data-skin="زرشکی مخملی"] #playing-table{background:radial-gradient(ellipse,#6e2842,#300f25);border-radius:48px 24px}#hokm [data-skin="فانتزی آرت‌دکو"] #playing-table{background:#123e3b url('/art.jpg') center/cover;border-radius:38px 18px}
@media(max-height:700px){.hand-card{max-width:48px}#chat-rail{height:69px}#chat-rail .chat-row{height:22px}.player-seat .portrait{width:34px;height:34px}#playing-table{min-height:150px}.card-backs{height:14px}.card-backs i{height:16px;width:11px}#table-score strong{font-size:22px}#hokm .hk-header{height:27px}}
@media(min-width:700px){#hokm .in-match{max-width:560px}.hand-card{max-width:57px}}
#hokm .hand-card:disabled{opacity:1}#hokm .hand-card.unavailable{filter:brightness(.92)}
#playing-table:after{content:'';position:absolute;inset:6px;border-radius:inherit;pointer-events:none;z-index:-1;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='5'%3E%3Cpath d='M0 0h1v1H0zm3 3h1v1H3z' fill='%23fff'/%3E%3C/svg%3E")}
#hokm .trump-choices button,#hokm .result-panel button{color:#13263d!important;background:#f6dc9e!important;font-size:15px;font-weight:700;min-height:39px;border:1px solid #a37e36}
#table-score .score-team{position:relative;flex-wrap:wrap;padding:3px 1px;font-size:13px;font-weight:700}#table-score .team-members{display:block;width:100%;font-size:10px;line-height:1.4;color:#fff;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:2px}#table-score strong{font-size:27px;font-weight:800}#table-score small{font-size:12px;font-weight:700;padding:2px}
#turn-status{position:absolute;top:9px;right:9px;z-index:6;height:auto;min-height:46px;width:110px;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:5px;background:#092331ee;border:1px solid #e0c889;border-radius:9px;font-size:12px;text-align:center}#clock{font-size:15px;font-weight:700}
#hokm .hand-card,.center-card{aspect-ratio:100/190}#hokm .hand-card svg,.center-card svg{width:100%;height:100%;overflow:visible;max-width:none;max-height:none}.center-card{width:clamp(43px,12vw,62px);filter:drop-shadow(0 2px 2px #001b1baa)}
#hokm [data-skin="فانتزی آرت‌دکو"] #playing-table{background-size:contain;background-repeat:no-repeat;background-color:#063830}#playing-table:after{opacity:.04}.result-panel{z-index:9}.result-panel strong{font-size:15px;line-height:1.6}.result-panel span{font-size:13px}
#chat-dialog form[hidden]{display:none}
@media(max-height:700px){#table-score small{font-size:11px}#table-score .team-members{font-size:9px}.hand-card{max-width:43px}#turn-status{width:93px;font-size:10px;min-height:38px}#clock{font-size:13px}}
@media(prefers-reduced-motion:reduce){.center-card,.hand-card{animation:none!important;transition:none!important}}

/* Keep Latin ranks inside the same card geometry in an RTL interface. */
#hokm .hand-card svg,#hokm .center-card svg{direction:ltr;overflow:hidden}
#hokm .hand-card svg text,#hokm .center-card svg text{direction:ltr;unicode-bidi:bidi-override;text-anchor:start}
#hokm .center-card{width:var(--played-card-width,43px);aspect-ratio:100/190}
#turn-status{background:#f5b93b;color:#152235;border:2px solid #ffe5a2;box-shadow:0 2px 9px #0008;gap:2px;min-height:58px}
#turn-status strong,#turn-status #clock{color:#152235;font-weight:800}
#hokm #turn-status button{background:#172c3c;color:#fff;border:1px solid #fff7;border-radius:4px;font-size:10px;padding:3px 6px;min-height:24px}
.player-seat.current-turn .portrait{outline:3px solid #8cffde;box-shadow:0 0 8px 3px #21ffc8,0 0 18px #39ffd5;outline-offset:3px}
.player-seat.current-turn .player-name{background:#083e37;color:#c8fff0;box-shadow:0 0 0 1px #80ffdb,0 0 7px #19ffba}

/* Compact score and a single overlapping hand leave the height to the table. */
#table-score{grid-template-columns:1fr .65fr 1fr;padding:3px 6px;gap:3px}
#table-score .score-team{font-size:11px;padding:1px;line-height:1.15}
#table-score strong{font-size:21px}#table-score .team-members{font-size:9px;padding:1px;line-height:1.3}
#table-score small{font-size:10px;padding:1px}
#table-score .score-trump{font-size:17px;font-weight:800;color:#fff1c7}
#table-score .score-trump b{font-size:34px;filter:drop-shadow(0 0 3px #ffe09a55)}
#table-toolbar{height:auto;min-height:28px;flex-wrap:wrap;justify-content:center;gap:1px 4px;padding:0 5px}
#table-toolbar button{font-size:10px;padding:3px}
#turn-status{inset:auto;position:absolute;z-index:6;width:82px;min-height:0;height:auto;padding:4px 3px;gap:1px;border-width:1px;border-radius:7px;font-size:10px;pointer-events:none}
#turn-status strong{font-size:10px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#turn-status #clock{font-size:13px;line-height:1.15}
#turn-status.turn-at-0{bottom:10px;left:calc(50% + 39px)}
#turn-status.turn-at-2{top:10px;left:calc(50% + 39px)}
#turn-status.turn-at-1{top:calc(43% + 55px);right:5px}
#turn-status.turn-at-3{top:calc(43% + 55px);left:5px}
#turn-status[hidden]{display:none}
#hokm .hand-rows{display:block;padding-top:12px}
#hokm .hand-row{position:relative;display:block;margin:0 auto;direction:ltr}
#hokm .hand-card{position:absolute;top:0;flex:none;max-width:none;min-width:0;aspect-ratio:169.075/244.640;border-radius:5px;transform:rotate(var(--fan-angle,0deg));transform-origin:50% 100%;box-shadow:0 1px 3px #000a}
#hokm .hand-card.selected{translate:0 -12px;box-shadow:0 0 0 2px #ffe19b,0 0 10px #eec35c}
#hokm .hand-card.dragging{z-index:40!important}
#hokm .center-card{aspect-ratio:169.075/244.640;transform:rotate(0deg)}
#hokm .hand-card svg,#hokm .center-card svg{overflow:hidden;border-radius:5px}
#player-hand{padding-bottom:1px}

/* Use the viewport for the table; connection status only appears on an error. */
#hokm .has-table .hk-header{height:0;padding:0;border:0;position:relative;z-index:20}
#hokm .has-table .hk-header strong{display:none}
#hokm .has-table #connection{position:absolute;top:0;left:3px;background:#172a37;font-size:9px}
#hokm .has-table #connection:empty{display:none}
#hokm .in-match #game{gap:2px}
#table-toolbar{margin:0;min-height:26px;line-height:1.2}
#player-hand{margin:0 4px 0;padding:0 3px;background:transparent}
.hand-hint:empty{display:none}
#hokm .hand-rows{padding-top:12px}
#hokm .hand-card:disabled{opacity:1}
#hokm .hand-card.unavailable:disabled{opacity:1;filter:brightness(.42)}
#table-center{inset:60px 24%;display:grid;grid-template-columns:repeat(2,var(--played-card-width,58px));grid-template-rows:repeat(2,max-content);align-content:center;justify-content:center;gap:16px 6px;direction:ltr}
#hokm .center-card{position:relative;inset:auto;transform:none;grid-column:1;grid-row:2}
#hokm .center-card.from-2{grid-column:1;grid-row:1}
#hokm .center-card.from-1{grid-column:2;grid-row:1}
#hokm .center-card.from-3{grid-column:2;grid-row:2}
#hokm .center-card small{font-size:8px;line-height:12px;max-width:100%;overflow:hidden;text-overflow:ellipsis}
#hokm .hand-card svg,#hokm .center-card svg{aspect-ratio:169.075/244.640;object-fit:contain}

#hokm .center-card{height:calc(var(--played-card-width,58px) * 244.640 / 169.075)}
#hokm .center-card small{position:absolute;top:100%;left:0;right:0}
#table-center{grid-template-rows:repeat(2,calc(var(--played-card-width,58px) * 244.640 / 169.075))}

#hokm #admin{position:fixed;inset:0;z-index:60;background:#0d1c27;overflow:auto;padding:16px;max-width:560px;margin:0 auto;box-sizing:border-box}#hokm #admin textarea{width:100%;box-sizing:border-box;background:#132922;color:#fff;border:1px solid #71806b;border-radius:8px;padding:10px;font-size:16px}#message-preview,#message-report p{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.8}#message-preview{padding:12px;border:1px solid #71806b;border-radius:8px}#message-form input[type=checkbox]{width:20px;height:20px}
#hokm .has-table #playing-table{background:var(--table-color,#06351d);border-color:transparent;border-image-source:var(--table-art,none);border-image-slice:80 fill;border-image-width:28px;border-image-repeat:stretch;box-shadow:none}
#hokm .has-table #playing-table:before,#hokm .has-table #playing-table:after{display:none}
#hokm #settings{inset:8px max(8px,calc((100vw - 540px)/2));z-index:55;background:#102330;color:#f5eedc;box-sizing:border-box}
.skin-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.skin-heading h2{margin:0;font-size:18px}
.skin-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#hokm .skin-choice{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0;padding:8px;background:#0b1721;color:#f5eedc;border:2px solid #4c5b65;border-radius:12px}
#hokm .skin-choice img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:contain;border-radius:7px}
#hokm .skin-choice span{font-size:13px;font-weight:bold;line-height:1.6}
#hokm .skin-choice[aria-pressed=true]{border-color:#ffdd83;box-shadow:0 0 0 1px #ffdd83}
#hokm .skin-choice:focus-visible{outline:3px solid #75dcff;outline-offset:2px}
#hokm .skin-choice:disabled{opacity:.65}#skin-status{min-height:24px;font-size:12px}


/* Directional card slots and non-modal chat composer. */
#table-center{inset:60px 8%;grid-template-columns:repeat(3,var(--center-card-width,44px));grid-template-rows:repeat(3,calc(var(--center-card-width,44px)*244.640/169.075));gap:4px 6px}
#hokm .center-card{width:var(--center-card-width,44px);height:calc(var(--center-card-width,44px)*244.640/169.075);grid-column:2;grid-row:3}
#hokm .center-card.from-2{grid-column:2;grid-row:1}#hokm .center-card.from-1{grid-column:3;grid-row:2}#hokm .center-card.from-3{grid-column:1;grid-row:2}
#hokm .hand-card.pending-hand{visibility:hidden;pointer-events:none}#hokm .center-card.pending-play{outline:1px solid #e6ca7a;border-radius:5px}
.hakem-crown{position:absolute;width:23px;height:19px;top:-9px;left:calc(50% + 10px);pointer-events:none;filter:drop-shadow(0 1px 1px #0009);z-index:2}.hakem-crown svg{width:100%;height:100%;display:block}
#hokm .player-seat .hakem-label{font-size:11px;font-weight:600;color:#ffe49a;background:#10251ee8;padding:1px 5px;border-radius:4px}
#table-score small{font-size:12px;font-weight:700;line-height:1.5;color:#fff0c6}
#chat-dialog{top:4px;bottom:auto;left:0;right:0;max-width:540px;max-height:180px;min-height:100px;z-index:50;box-shadow:0 3px 12px #0008}
#chat-dialog #chat-history{font-size:11px}#chat-dialog #chat-history .chat-row{padding:2px 0;font-size:11px}#chat-dialog header{font-size:12px}#chat-dialog #chat-form{flex:none}
.collecting-trick #table-result{visibility:hidden}.trump-flash{position:absolute;inset:12px;pointer-events:none;border-radius:30px;border:2px solid #8bfaff;box-shadow:inset 0 0 35px #37edff88,0 0 12px #8bfaff;background:#38eeff18;z-index:5}
@media(prefers-reduced-motion:reduce){.center-card{animation:none!important}.hand-card{transition:none!important}}

#table-center{top:70px;bottom:80px}.hakem-crown{top:-12px;left:calc(50% - 28px);transform:rotate(-22deg);transform-origin:50% 100%}

/* Transient dealing packets are separate from playable cards and never intercept input. */
.deal-flight{position:absolute;top:0;left:0;width:18px;height:26px;border:1px solid #f7edca;border-radius:2px;background:repeating-linear-gradient(45deg,#173c65 0 3px,#476c93 3px 4px);box-shadow:2px 2px 0 #d6d9d6,3px 3px 0 #21416a;pointer-events:none;z-index:7;contain:layout paint}
.trump-flash{background:#38eeff35;box-shadow:inset 0 0 45px #37edffcc,0 0 12px #8bfaff}

/* Single lightweight card backs during the dealing animation, without stacked shadows. */
.deal-flight{box-shadow:none;border:1px solid #f5ead1;border-radius:3px}
.deal-own-flight{background:transparent;border:0;font-style:normal}
.deal-own-flight svg{display:block;width:100%;height:100%;direction:ltr;border-radius:5px;overflow:hidden}

/* Compact header: native disclosure overlays the table without changing layout. */
#table-topbar{position:relative;z-index:25;flex:none;height:44px;margin:2px 4px 0;border:1px solid #c3a164;border-radius:9px;background:#091522;box-sizing:border-box;--chat-rail-height:74px}
#table-toolbar{position:absolute;right:2px;top:1px;width:42px;height:40px;min-height:0;padding:0;display:block;z-index:2}
#table-menu summary{display:grid;place-items:center;width:40px;height:40px;box-sizing:border-box;list-style:none;cursor:pointer;font:25px Arial;color:#f5d993;border:1px solid #ad925f;border-radius:7px;background:#10212b;user-select:none}
#table-menu summary::-webkit-details-marker{display:none}
#table-menu summary:focus-visible,#table-menu-actions button:focus-visible{outline:2px solid #80ddff;outline-offset:1px}
#table-menu-actions{position:absolute;top:calc(52px + var(--chat-rail-height));right:0;width:var(--table-menu-width,148px);box-sizing:border-box;display:flex;flex-direction:column;padding:4px;background:#0b1824;border:1px solid #c3a164;border-radius:10px;box-shadow:0 3px 8px #0006;max-height:min(var(--table-menu-max-height,230px),calc(var(--app-height,100dvh) - 240px));overflow:auto}
#table-menu:not([open]) #table-menu-actions{display:none}
#table-toolbar #table-menu-actions button{display:flex;align-items:center;justify-content:space-between;min-height:32px;flex:none;font-size:11px;white-space:nowrap;padding:5px 8px;color:#f4eee0;border:0;border-bottom:1px solid #ffffff18;background:transparent;text-align:right}
#table-toolbar #table-menu-actions button:last-child{border:0;color:#d5dfeb}
#table-toolbar #table-menu-actions [data-do=finish]{color:#ffb2b2}
#table-menu-actions [data-do=settings]:after{content:'⚙'}#table-menu-actions [data-do=music]:after{content:'♫'}#table-menu-actions [data-do=effects]:after{content:'◖'}#table-menu-actions [data-do=vibration]:after{content:'▣'}#table-menu-actions [data-do=finish]:after{content:'↪'}
#table-score{height:100%;box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(58px,max-content) minmax(0,1fr);align-items:center;gap:5px;margin:0 48px 0 6px;padding:3px 0;border:0;background:transparent;border-radius:0}
#table-score .score-team{box-sizing:border-box;display:flex;flex-wrap:nowrap;gap:5px;justify-content:center;min-width:0;height:30px;padding:2px;font-size:12px;white-space:nowrap}
#table-score strong{font-size:21px;line-height:1}
#table-score .score-trump{gap:3px;font-size:13px;white-space:nowrap}
#table-score .score-trump b{font-size:26px}
#table-score .match-points{grid-column:auto;box-sizing:border-box;font-size:22px;font-weight:800;padding:3px 6px;text-align:center;direction:ltr;white-space:nowrap;line-height:1.2;border:1px solid #d7b56b;border-radius:6px;background:#382d16;color:#fff2b8;font-variant-numeric:tabular-nums}
#chat-rail{height:74px;box-sizing:border-box;margin-top:2px}
#chat-rail .chat-row{height:24px;box-sizing:border-box;padding:1px 5px}
#chat-rail>button{width:44px}
@media(max-height:700px){#table-topbar{--chat-rail-height:68px}#chat-rail{height:68px}#chat-rail .chat-row{height:22px}#table-menu-actions{max-height:min(var(--table-menu-max-height,148px),148px)}}
@media(max-width:350px){#table-score{gap:3px;grid-template-columns:minmax(0,1fr) 54px minmax(50px,max-content) minmax(0,1fr)}#table-score .score-team{font-size:11px;gap:3px}#table-score .score-trump{font-size:12px}#table-score .score-trump b{font-size:23px}#table-score .match-points{font-size:20px;padding:3px 4px}}


/* Additional art is an independent layer: preserve its ratio, never move game elements. */
#hokm .has-table[data-table-fit=contain] #playing-table{border-image:none;background-color:var(--table-color);background-image:var(--table-art);background-position:center;background-size:contain;background-repeat:no-repeat}
.trump-impact{position:absolute;width:100px;height:100px;pointer-events:none;z-index:6;border-radius:50%;border:2px solid #b4fcff;background:repeating-conic-gradient(from 7deg,#c4faff99 0 1deg,transparent 1deg 29deg);box-shadow:inset 0 0 10px #8df5ff,0 0 12px #72edff;contain:layout paint}
#hokm .center-card{animation:none;filter:none;box-shadow:0 2px 4px #0005;border-radius:5px}.catchup-card{pointer-events:none}
#hokm .has-table[data-table-fit=contain] .center-card small{background:#10251ee8;color:#fff6dc;border-radius:4px}
#hokm .has-table[data-table-fit=contain] .player-seat small:not(.hakem-label){background:#10251ed9;border-radius:3px}