/* ===================================================================
   screens2.css - v207 screens from the "קלפים · החפיסה" canvas.
   GameSheet: the chosen deck on a felt card in its own colour, then the ways to play.
   =================================================================== */
.modal>.gs{margin:0 !important;padding:0 !important;background:none !important;border:0 !important;box-shadow:none !important;min-height:0 !important;display:block !important}
.modal>.gs::before,.modal>.gs::after{display:none !important;content:none !important}
.gs-hero{position:relative;border-radius:20px;padding:16px 16px 16px;min-height:150px;color:#fff;overflow:hidden;
  background:radial-gradient(85% 110% at 85% 10%,color-mix(in srgb,var(--g) 80%,#F2D27A) 0%,var(--g) 35%,color-mix(in srgb,var(--g) 70%,#000) 75%,color-mix(in srgb,var(--g) 45%,#000) 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 4px 0 color-mix(in srgb,var(--g) 55%,#000),0 18px 30px -12px color-mix(in srgb,var(--g) 70%,transparent)}
.gs-hero::after{content:"";position:absolute;inset:6px;border-radius:15px;border:1.5px solid rgba(242,210,122,.55);pointer-events:none}
.gs-art{position:absolute;inset-inline-end:14px;top:14px;width:92px;height:120px;border-radius:12px;overflow:hidden;transform:rotate(4deg);
  box-shadow:0 0 0 3px #FFFDF9,0 0 0 4.5px rgba(242,210,122,.9),0 10px 18px -6px rgba(0,0,0,.55)}
.gs-art img{width:100%;height:100%;object-fit:cover;display:block}
.gs-txt{margin-inline-end:110px;position:relative;z-index:1;min-width:0}
.gs-txt h3{margin:0 !important;font-size:38px !important;font-weight:800;line-height:1 !important;letter-spacing:-.8px;color:#fff !important;text-shadow:0 3px 0 rgba(0,0,0,.2);overflow-wrap:anywhere;display:block !important}
.gs-pl{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:13px;font-weight:700;color:rgba(255,255,255,.88)}
.gs-pl svg{width:15px;height:15px;flex:none}
.gs-desc{font-size:13px;line-height:1.4;color:rgba(255,255,255,.9);margin-top:8px}
.gs-luck{font-size:12px;font-weight:700;color:#FFE9A8;margin-top:6px}
.gs-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.gs-modes>.btn{min-height:58px !important;height:auto !important;white-space:normal !important;line-height:1.2 !important;font-size:14.5px !important;padding:10px 12px !important;border-radius:16px !important;
  text-align:center;display:flex;align-items:center;justify-content:center}
.gs-modes>#m-bots{grid-column:1 / -1;min-height:62px !important;font-size:17px !important}
.gs-modes>.btn-navy{background:var(--card,#FFFDF9) !important;color:var(--ink,#231F1A) !important;border:0 !important;
  box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--g) 55%,transparent),0 3px 0 color-mix(in srgb,var(--g) 55%,#000) !important}
.gs-modes>.btn-navy:disabled{opacity:.5;box-shadow:inset 0 0 0 1.5px rgba(70,50,25,.18) !important}
.gs-modes>.btn-navy:only-of-type,.gs-modes>.btn-navy:last-child:nth-child(even){grid-column:1 / -1}
html.pv-night .gs-modes>.btn-navy{background:#2A241E !important;color:#F6EEE2 !important}
@media (max-width:370px){ .gs-txt h3{font-size:32px !important} .gs-art{width:80px;height:104px} .gs-txt{margin-inline-end:96px} }
.gs .btn-row{display:grid !important;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px !important}
.gs .btn-row>.btn{width:auto !important;min-width:0;min-height:44px;white-space:normal !important;line-height:1.15;font-size:13.5px !important;padding:6px 8px !important;border-radius:12px !important}
.gs .btn-row>.btn:last-child:nth-child(odd){grid-column:1 / -1}

/* ---- game over (canvas board Victory): a gold burst behind the win, a clean ranked table ---- */
.go-head.go-win{background:radial-gradient(60% 70% at 50% 30%,rgba(233,185,73,.38),rgba(233,185,73,0) 72%),repeating-conic-gradient(from 0deg at 50% 30%,rgba(233,185,73,.12) 0 6deg,transparent 6deg 18deg) !important;
  -webkit-mask:radial-gradient(75% 90% at 50% 30%,#000 45%,transparent 100%);mask:radial-gradient(75% 90% at 50% 30%,#000 45%,transparent 100%);padding-bottom:10px !important;border-radius:18px}
.go-head.go-win{flex-direction:column !important;align-items:center !important;text-align:center;gap:6px !important;padding-top:4px}
.go-head.go-win .go-ic{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;font-size:40px;background:#F2C14E;box-shadow:inset 0 -6px 0 #C8952A,0 10px 20px -8px rgba(0,0,0,.45);animation:t2disc .5s cubic-bezier(.2,1.4,.3,1) both}
.go-head.go-win h3{font-size:40px !important;line-height:1 !important;letter-spacing:-1px;margin:6px 0 0 !important}
.go-t{border-collapse:separate !important;border-spacing:0 2px;width:100%}
.go-t td,.go-t th{border:0 !important;background:none !important;height:42px;font-variant-numeric:tabular-nums}
.go-t th{height:30px;font-size:11.5px;opacity:.68;border-bottom:1px solid rgba(70,50,25,.12) !important}
.go-t tr.me td{background:rgba(233,185,73,.22) !important;font-weight:800}
.go-t tr.me td:first-child{border-radius:0 12px 12px 0}.go-t tr.me td:last-child{border-radius:12px 0 0 12px}
html:not([dir=rtl]) .go-t tr.me td:first-child{border-radius:12px 0 0 12px}html:not([dir=rtl]) .go-t tr.me td:last-child{border-radius:0 12px 12px 0}
.go-t tr td:first-child{font-weight:800;color:#B07A12;width:28px}
@media (prefers-reduced-motion:reduce){ .go-head.go-win .go-ic{animation:none} }