/* SURTEP popisy produktu v12 (13. 10. 2026) — DOPLNĚK k v4–v11 (v Záhlaví zůstávají všechny odkazy): hry — karta O hře + Minimální požadavky s ikonami; „Rozměr v reálu“ — druhý panel (gramáž, výbava, v balení), role pro dlouhý pruh, popisek kratší strany vodorovně. Jen CSS, bez skriptů. */
.sp-popis .sp-hra{margin:44px 0;padding:0!important;border:0!important;border-radius:26px;overflow:hidden;background:radial-gradient(120% 140% at 100% 0,#3b3f9e 0,#1d2433 55%,#141826 100%);color:#e9ecf8;position:relative;box-shadow:0 30px 60px -34px rgba(29,36,51,.9)}
.sp-popis .sp-hra:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 0 calc(100% - 1px),rgba(255,255,255,.05) 0) 0 0/100% 28px,linear-gradient(90deg,transparent 0 calc(100% - 1px),rgba(255,255,255,.05) 0) 0 0/28px 100%;pointer-events:none;-webkit-mask:linear-gradient(115deg,#000,transparent 70%);mask:linear-gradient(115deg,#000,transparent 70%)}
.sp-popis .sp-hra-in{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:0}
.sp-popis .sp-hra-o{padding:34px 34px 30px;display:flex;flex-direction:column;gap:20px}
.sp-popis .sp-hra .sp-stitek{background:rgba(255,255,255,.1);color:#b9c4ff}
.sp-popis .sp-hra h2{color:#fff;font-size:30px;line-height:1.15;margin:8px 0 0}
.sp-popis .sp-hra-plat{display:flex;align-items:center;gap:16px}
.sp-popis .sp-hra-plat b{display:grid;place-items:center;min-width:86px;height:86px;padding:0 14px;border-radius:22px;background:linear-gradient(135deg,var(--sp-a,#4d6efc),#9b5cff);font-family:var(--sp-h);font-weight:800;font-size:26px;line-height:1;color:#fff;letter-spacing:.02em;box-shadow:0 16px 34px -14px rgba(123,92,255,.9),inset 0 1px 0 rgba(255,255,255,.35);animation:sp-v12-skok .9s var(--sp-ease) both}
.sp-popis .sp-hra-plat span{font-size:14px;color:#aab3cf;line-height:1.45}
.sp-popis .sp-hra-plat span strong{display:block;color:#fff;font-family:var(--sp-h);font-weight:700;font-size:18px;line-height:1.3}
.sp-popis .sp-hra-zanr{font-family:var(--sp-h);font-weight:700;font-size:20px;line-height:1.35;color:#fff}
.sp-popis .sp-hra-zanr small{display:block;font-family:var(--sp-h);font-weight:600;font-size:12px;line-height:1;letter-spacing:.12em;text-transform:uppercase;color:#8e98bd;margin-bottom:8px}
.sp-popis .sp-hra-cipy{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.sp-popis .sp-hra-cipy li{margin:0;padding:7px 13px;border-radius:99px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:14px;color:#dfe4fb}
.sp-popis .sp-hra-cipy li:before{display:none}
.sp-popis .sp-hra-pc{padding:30px 30px 30px;background:rgba(255,255,255,.04);border-left:1px solid rgba(255,255,255,.08)}
.sp-popis .sp-hra-pc h3{color:#fff;font-size:15px;letter-spacing:.12em;text-transform:uppercase;margin:4px 0 16px;display:flex;align-items:center;gap:10px}
.sp-popis .sp-hra-pc h3:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(185,196,255,.5),transparent)}
.sp-popis .sp-hra-pc ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.sp-popis .sp-hra-pc li{margin:0;display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:center;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.05);transition:background .3s,transform .4s var(--sp-ease);animation:sp-v12-vjezd .7s calc(var(--i,0) * .07s) var(--sp-ease) both}
.sp-popis .sp-hra-pc li:hover{background:rgba(255,255,255,.1);transform:translateX(4px)}
.sp-popis .sp-hra-pc li:before{display:none}
.sp-popis .sp-hra-pc li span{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#8e98bd;line-height:1.3}
.sp-popis .sp-hra-pc li strong{display:block;font-size:16px;color:#fff;font-weight:600;line-height:1.35;text-transform:none;letter-spacing:0;margin-top:2px}
.sp-popis .sp-hra-ik{--ic:none;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,rgba(77,110,252,.35),rgba(155,92,255,.35));border:1px solid rgba(185,196,255,.3);position:relative}
.sp-popis .sp-hra-ik:after{content:"";position:absolute;inset:9px;background:#dfe4ff;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.sp-popis .sp-hra-ik-cpu{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='6' y='6' width='12' height='12' rx='2'/%3E%3Crect x='9.5' y='9.5' width='5' height='5'/%3E%3Cpath d='M9 2v3M15 2v3M9 19v3M15 19v3M2 9h3M2 15h3M19 9h3M19 15h3'/%3E%3C/svg%3E")}
.sp-popis .sp-hra-ik-gpu{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='2' y='6' width='20' height='11' rx='2'/%3E%3Ccircle cx='9' cy='11.5' r='3'/%3E%3Cpath d='M15 9.5h4M15 13.5h4M5 17v3'/%3E%3C/svg%3E")}
.sp-popis .sp-hra-ik-ram{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 7h18v8H3zM6 15v3M10 15v3M14 15v3M18 15v3M7 10v2M11 10v2M15 10v2'/%3E%3C/svg%3E")}
.sp-popis .sp-hra-ik-disk{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cellipse cx='12' cy='6' rx='8' ry='3'/%3E%3Cpath d='M4 6v12c0 1.7 3.6 3 8 3s8-1.3 8-3V6M4 12c0 1.7 3.6 3 8 3s8-1.3 8-3'/%3E%3C/svg%3E")}
.sp-popis .sp-hra-ik-os{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='4' width='18' height='13' rx='2'/%3E%3Cpath d='M8 21h8M12 17v4M12 4v13M3 10.5h18'/%3E%3C/svg%3E")}
.sp-popis .sp-hra-ik-zvuk{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M11 5 6 9H3v6h3l5 4zM15.5 8.5a5 5 0 0 1 0 7M18.5 5.5a9 9 0 0 1 0 13'/%3E%3C/svg%3E")}
.sp-popis .sp-hra-ik-mech{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='2.5'/%3E%3C/svg%3E")}
.sp-popis .sp-hra-ik-dalsi{--ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 12h12M12 6v12'/%3E%3C/svg%3E")}
.sp-popis .sp-hra-pozn{margin:14px 2px 0;font-size:13px;color:#8e98bd}
@keyframes sp-v12-skok{from{opacity:0;transform:scale(.6) rotate(-8deg)}}
@keyframes sp-v12-vjezd{from{opacity:0;transform:translateX(18px)}}
@media (max-width:760px){.sp-popis .sp-hra-in{grid-template-columns:1fr}.sp-popis .sp-hra-pc{border-left:0;border-top:1px solid rgba(255,255,255,.08)}.sp-popis .sp-hra-o,.sp-popis .sp-hra-pc{padding:24px 20px}.sp-popis .sp-hra h2{font-size:24px}}
@media (prefers-reduced-motion:reduce){.sp-popis .sp-hra-plat b,.sp-popis .sp-hra-pc li{animation:none}}
.sp-popis .sp-rz-b{right:-14px;top:50%;transform:translate(50%,-50%)}
.sp-popis .sp-rz-panel{display:grid;gap:14px}
.sp-popis .sp-rz-vybava{display:block;padding:18px 20px;border-radius:18px;background:#fff;border:1px solid #e6e9f2}
.sp-popis .sp-rz-vybava ul{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0;padding:0;list-style:none}
.sp-popis .sp-rz-vybava li{margin:0;display:flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;border-radius:99px;background:var(--sp-tint,#f2f4fb);font-weight:600;font-size:15px}
.sp-popis .sp-rz-vybava li:before{content:"";position:static;flex:0 0 18px;width:18px;height:18px;border-radius:50%;background:var(--sp-a,#4d6efc) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center/12px no-repeat;transform:none}
@media (max-width:760px){.sp-popis .sp-rz-telo{grid-template-columns:1fr}}
.sp-popis .sp-rz-lev{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:center}
.sp-popis .sp-rz-lev .sp-rz-role{width:150px;height:150px;margin:0}
@media (max-width:760px){.sp-popis .sp-rz-lev{grid-template-columns:1fr}.sp-popis .sp-rz-lev .sp-rz-role{margin:0 auto}}
.sp-popis .sp-rz-lev .sp-rz-role i{width:70px;transform:rotate(18deg) translateX(46px)}
.sp-popis .sp-rz-lev .sp-rz-cisla{position:relative;z-index:1;margin-left:26px}