html[data-social-game="durak"] { --accent:#287963; --accent-strong:#15553f; --accent-soft:#e1f0e8; --page-a:#eff6f1; --page-b:#f8f2e8; --glow-a:rgba(45,123,91,.13); --glow-b:rgba(190,150,88,.12); }
html[data-social-game="durak"][data-theme="dark"] { --accent:#7bc6a9; --accent-strong:#a5e3c8; --accent-soft:#183d31; --accent-contrast:#10241c; --page-a:#111e19; --page-b:#1c211a; }
.durak-table { --durak-card-width:66px; --durak-card-height:92px; }
.durak-visually-hidden { 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; }
.durak-roster { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0; }
.durak-player { border:1px solid var(--line); border-radius:13px; background:var(--panel-solid); padding:9px 12px; min-width:0; box-shadow:inset 0 0 0 1px transparent; }
.durak-player.is-current { border-color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent); background:var(--accent-soft); }
.durak-player.is-out { opacity:.75; }
.durak-player-name { display:grid; grid-template-columns:8px minmax(0,1fr) auto; gap:8px; align-items:start; }
.durak-player-name .seat-dot { width:8px; height:8px; margin-top:7px; }
.durak-player-name strong { font-size:14px; line-height:1.4; min-height:20px; overflow-wrap:anywhere; }
.durak-player-name>b { font-size:19px; font-variant-numeric:tabular-nums; }
.durak-player-status { min-height:35px; margin-left:16px; display:flex; flex-direction:column; font-size:12px; line-height:1.5; color:var(--muted); }
.durak-player-status small { min-height:18px; color:var(--accent); font-size:11px; }
.durak-stage { padding:14px; background:linear-gradient(150deg,var(--panel-solid),var(--accent-soft)); }
.durak-table-status { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:59px; margin-bottom:8px; }
.durak-table-status>p { margin:0; max-width:48ch; min-width:0; line-height:1.5; overflow-wrap:anywhere; font-weight:650; }
.durak-stock { display:flex; flex-shrink:0; align-items:center; gap:10px; font-size:12px; color:var(--muted); }
.durak-stock strong { color:var(--ink); font-size:18px; font-variant-numeric:tabular-nums; }
.durak-stock small { display:block; white-space:nowrap; margin-top:4px; }
.durak-trump-symbol { font-size:36px; color:var(--ink); }
.durak-trump-symbol.is-red { color:#bc3d45; }
.durak-bottom-trump { display:block; --durak-card-width:42px; --durak-card-height:59px; }
.durak-bottom-trump .durak-card-corner { font-size:11px; }.durak-bottom-trump .durak-card-suit { font-size:22px; }.durak-bottom-trump .durak-card-bottom { font-size:10px; }
.durak-bout-caption { display:flex; justify-content:space-between; gap:10px; font-size:12px; color:var(--muted); min-height:22px; line-height:1.4; }
.durak-bout-caption>span:last-child { white-space:nowrap; }
.durak-pairs { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
.durak-pair { appearance:none; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-width:0; min-height:146px; border:1px solid var(--line); border-radius:12px; padding:8px 4px; background:rgba(255,255,255,.09); color:var(--ink); font:inherit; text-align:center; }
button.durak-pair { cursor:pointer; }
.durak-pair.is-selected { border-color:var(--accent); outline:2px solid var(--accent); outline-offset:-3px; background:var(--accent-soft); }
.durak-pair.is-empty { border-style:dashed; color:var(--muted); opacity:.65; }
.durak-pair.is-unavailable { opacity:.23; }
.durak-pair-cards { position:relative; display:block; width:calc(var(--durak-card-width) + 19px); height:calc(var(--durak-card-height) + 12px); }
.durak-attack-card { position:absolute!important; top:0; left:0; }
.durak-defense-card { position:absolute!important; top:12px; left:19px; box-shadow:-3px -2px 7px rgba(0,0,0,.15); }
.durak-cover-outline { position:absolute; inset:12px 0 0 19px; border:1px dashed var(--muted); border-radius:7px; pointer-events:none; }
.durak-pair-label { font-size:11px; min-height:16px; line-height:1.4; color:var(--muted); }
.durak-card { display:block; position:relative; width:var(--durak-card-width); height:var(--durak-card-height); border:1px solid #c6ccc8; border-radius:7px; background:#fffdf6; color:#1d2c27; user-select:none; box-shadow:0 2px 4px rgba(0,0,0,.08); }
.durak-card.is-red { color:#b73641; }
.durak-card-corner { position:absolute; left:5px; top:4px; display:flex; flex-direction:column; align-items:center; font-size:17px; line-height:1; gap:1px; }
.durak-card-corner>b { font-weight:750; }
.durak-card-suit { display:block; position:absolute; left:50%; top:50%; transform:translate(-50%,-45%); font-size:36px; line-height:1; }
.durak-card-bottom { position:absolute; right:5px; bottom:4px; font-size:12px; line-height:1; transform:rotate(180deg); }
.durak-hand-panel { margin-top:0; padding:14px; }
.durak-hand-panel>header { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.durak-hand-panel h2 { margin:0; font-size:20px; }.durak-hand-panel h2>span { color:var(--muted); margin-left:6px; font-size:15px; }
.durak-hand-trump { color:var(--muted); font-size:13px; white-space:nowrap; }
.durak-selection-help { min-height:21px; margin:7px 0; line-height:1.5; color:var(--muted); font-size:14px; }
.durak-hand { display:grid; grid-template-columns:repeat(auto-fill,minmax(66px,1fr)); gap:10px 6px; min-height:104px; padding:6px 0; align-items:start; }
.durak-hand-card { display:flex; justify-content:center; padding:0; border:0; background:none; border-radius:8px; min-height:var(--durak-card-height); cursor:pointer; }
.durak-hand-card .durak-card { transition:transform .12s; }
.durak-hand-card.is-selected .durak-card { outline:3px solid var(--accent); outline-offset:1px; transform:translateY(-4px); }
.durak-hand-card:disabled { opacity:.58; cursor:default; }.durak-hand-card:disabled .durak-card { box-shadow:none; }
.durak-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; min-height:44px; margin-top:8px; }
.durak-actions .button { min-height:44px; flex:1; }
.durak-waiting { color:var(--muted); font-size:13px; }
.durak-rules,.durak-history { margin-top:0; padding:12px 16px; font-size:14px; line-height:1.6; }
.durak-rules summary,.durak-history summary { cursor:pointer; font-weight:650; min-height:44px; padding-block:8px; box-sizing:border-box; }
.durak-rules p { color:var(--muted); }.durak-rules a { color:var(--accent); }
.durak-history ol { padding-left:20px; margin-bottom:0; }.durak-history li { margin-block:8px; overflow-wrap:anywhere; color:var(--muted); }
.durak-table button:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
@media(min-width:1000px) { .durak-roster { grid-template-columns:repeat(var(--durak-roster-columns,3),minmax(0,1fr)); } }
@media(min-width:601px) and (max-width:799px) { .durak-pairs { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:600px) {
  .durak-table { --durak-card-width:clamp(38px,11.3vw,44px); --durak-card-height:64px; }
  .durak-roster { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin-bottom:0; }
  .durak-player { padding:7px 8px; }.durak-player-name { gap:5px; }.durak-player-name strong { font-size:12px; min-height:17px; }.durak-player-status { margin-left:13px; min-height:30px; font-size:11px; line-height:1.35; }.durak-player-status small { font-size:10px; min-height:15px; }
  .durak-roster:has(>.durak-player:nth-child(3)) { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .durak-stage,.durak-hand-panel { padding:10px; }.durak-hand-panel { padding-block:8px; }
  .durak-table-status { align-items:flex-start; gap:10px; min-height:46px; margin-bottom:6px; }.durak-table-status>p { font-size:13px; }
  .durak-stock { gap:6px; font-size:11px; }.durak-trump-symbol { font-size:26px; }.durak-bottom-trump { display:block; --durak-card-width:32px; --durak-card-height:46px; }
  .durak-bottom-trump .durak-card-corner { font-size:9px; left:3px; top:3px; }.durak-bottom-trump .durak-card-suit { font-size:17px; }.durak-bottom-trump .durak-card-bottom { font-size:8px; right:3px; bottom:3px; }
  .durak-pairs { --durak-card-width:38px; --durak-card-height:54px; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }.durak-pair { min-height:92px; padding:2px 2px; gap:3px; }
  .durak-pair-cards { width:calc(var(--durak-card-width) + 14px); }.durak-defense-card { left:14px; }.durak-cover-outline { left:14px; }
  .durak-card-corner { font-size:12px; left:4px; }.durak-card-suit { font-size:25px; }.durak-card-bottom { font-size:9px; }
  .durak-hand-panel h2 { font-size:17px; }.durak-hand { grid-template-columns:repeat(auto-fill,minmax(44px,1fr)); gap:9px 4px; min-height:76px; }
  .durak-selection-help { min-height:38px; margin-block:5px; font-size:12px; line-height:1.5; }.durak-actions { gap:8px; margin-top:6px; }.durak-actions .button { padding-inline:10px; font-size:13px; }
  .durak-rules,.durak-history { padding:10px 12px; }
}
@media(prefers-reduced-motion:reduce) { .durak-hand-card .durak-card { transition:none; } }