/* twindordeu.com — redesign layer "Leiter" (see DESIGN.md). Markup untouched. */
:root{
  --ink:#10161d;--s1:#161e27;--s2:#1c2631;--ln:#273241;
  --hi:#f2f5f1;--tx:#cdd5db;--mu:#8e9aa6;--ac:#c8d347;--on-ac:#151a07;
  --r-out:18px;--r-in:6px;--measure:68ch;--max:1240px;
  --disp:"Righteous","Trebuchet MS",sans-serif;--body:"Vollkorn",Georgia,serif;
}
body{
  background-color:var(--ink);
  background-image:
    radial-gradient(70% 55% at 92% -8%,color-mix(in oklch,var(--ac) 13%,transparent),transparent 70%),
    radial-gradient(60% 50% at -10% 105%,color-mix(in oklch,#3d6d9e 16%,transparent),transparent 70%);
  background-attachment:fixed;
  color:var(--tx);font:17px/1.7 var(--body);font-variant-numeric:oldstyle-nums proportional-nums;
}
a{color:var(--ac);text-underline-offset:3px;text-decoration-thickness:1px}
a:focus-visible,summary:focus-visible{outline:2px solid var(--ac);outline-offset:3px;border-radius:var(--r-in)}

/* header */
header{background:color-mix(in oklch,var(--ink) 86%,transparent);backdrop-filter:blur(8px);border-bottom-color:var(--ln)}
.hd{max-width:var(--max);padding-inline:clamp(16px,4vw,48px)}
.hbtn{font-family:var(--disp);font-weight:400;letter-spacing:.01em;border-radius:var(--r-in);border-color:var(--ln);transition:background-color .2s,border-color .2s}
.hbtn:hover{border-color:var(--mu)}
.hbtn.solid{background:var(--ac);border-color:var(--ac);color:var(--on-ac)}
.hbtn.solid:hover{background:color-mix(in oklch,var(--ac) 88%,white)}

/* type */
h1,h2,h3{font-family:var(--disp);font-weight:400;color:var(--hi);text-wrap:balance}
h1{font-size:clamp(40px,5.6vw,80px);line-height:1.02;letter-spacing:-.012em;margin:48px 0 24px;max-width:20ch}
h2,.doc h2{font-size:clamp(24px,2.3vw,32px);line-height:1.1;letter-spacing:-.005em;margin:0}
h3{font-size:21px;line-height:1.25;margin:32px 0 8px;color:var(--hi)}
p{text-wrap:pretty}
p,ul,ol,.note,details,.author{max-width:var(--measure)}
.upd,.doc__meta{font-size:14px;color:var(--mu);margin:0 0 16px}

/* layout */
main.wrap{max-width:var(--max);padding:0 clamp(16px,4vw,48px) 24px}
footer.wrap{max-width:var(--max);padding-inline:clamp(16px,4vw,48px)}
.hero-link{margin-bottom:0}
@media (min-width:1100px){
  main.wrap:not(.e404){display:grid;grid-template-columns:280px minmax(0,1fr);column-gap:64px;align-items:start}
  main.wrap:not(.e404)>*{grid-column:2}
  main.wrap:not(.e404)>:is(.hero-link,h1,.tw:has(.sum),.toc,.doc__toc){grid-column:1/-1}
  main.wrap:not(.e404)>:is(.upd,.doc__meta){grid-column:1;margin-top:8px}
  main.wrap:not(.e404)>h2{grid-column:1;padding-right:8px}
  main.wrap:has(>.hero-link)>:is(.hero-link,h1,.upd,p:nth-of-type(-n+3)){order:-1}
  footer.wrap{display:grid;grid-template-columns:280px minmax(0,1fr);column-gap:64px}
  footer.wrap>*{grid-column:2}
  footer.wrap>.age{grid-column:1;grid-row:1 / span 3}
}
main.wrap>h2,main.wrap>h2+*{margin-top:96px;padding-top:24px;border-top:1px solid var(--ln)}
@media (max-width:1099px){main.wrap>h2{margin-bottom:16px}main.wrap>h2+*{margin-top:0;padding-top:0;border-top:0}}

/* CTA */
.cta{display:inline-block;max-width:none;margin:8px 0 24px;padding:16px 32px;border-radius:var(--r-in);
  font-family:var(--disp);font-weight:400;font-size:20px;letter-spacing:.01em;color:var(--on-ac);background:var(--ac);
  transition:transform .2s,background-color .2s}
.cta:hover{background:color-mix(in oklch,var(--ac) 88%,white)}
.cta:active{transform:translateY(1px)}
main.wrap>.cta{justify-self:start}

/* key facts: full-bleed band, typographic grid */
.tw:has(.sum){width:100vw;margin:32px 0 0 calc(50% - 50vw);border:0;border-radius:0;overflow:visible;
  background:color-mix(in oklch,var(--s1) 88%,transparent);border-block:1px solid var(--ln);
  padding:48px max(clamp(16px,4vw,48px),calc((100vw - var(--max))/2 + 48px))}
table.sum,table.sum tbody{display:grid;min-width:0;width:100%}
table.sum tbody{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 48px}
table.sum tr{display:flex;flex-direction:column;gap:4px;border-top:1px solid var(--ln);padding-top:12px}
table.sum td{display:block;padding:0;border:0;width:auto!important}
table.sum td:first-child{font-size:14px;color:var(--mu);line-height:1.4}
table.sum td:last-child{color:var(--tx);font-size:15px;line-height:1.5}
table.sum tr:nth-child(n+6):nth-child(-n+12){order:-1}
table.sum tr:nth-child(n+6):nth-child(-n+12) td:last-child{font-family:var(--disp);font-size:clamp(22px,2vw,28px);line-height:1.15;color:var(--hi);font-variant-numeric:lining-nums tabular-nums}
table.sum tr:nth-child(6){grid-column:span 2}
table.sum tr:nth-child(6) td:last-child{color:var(--ac)}

/* tables */
.tw{border:0;border-radius:0;margin:0 0 32px}
table{font-size:15px;font-variant-numeric:lining-nums tabular-nums}
th{background:none;font-family:var(--body);font-weight:600;color:var(--hi);border-bottom:2px solid var(--ln);padding:8px 16px 8px 0}
td{padding:12px 16px 12px 0;border-bottom:1px solid color-mix(in oklch,var(--ln) 70%,transparent)}
td:first-child{color:var(--hi)}

/* signature: ladders and bars from the table's own numbers */
#vip+p+.tw td:first-child,#reload+p+.tw+.tw td:first-child,#punkty+p+.tw td:first-child{
  background:linear-gradient(var(--ac),var(--ac)) left calc(100% - 6px)/var(--step,0%) 3px no-repeat;padding-bottom:18px}
:is(#vip+p+.tw,#reload+p+.tw+.tw,#punkty+p+.tw) tr:nth-child(2){--step:10%}
:is(#vip+p+.tw,#reload+p+.tw+.tw,#punkty+p+.tw) tr:nth-child(3){--step:24%}
:is(#vip+p+.tw,#reload+p+.tw+.tw,#punkty+p+.tw) tr:nth-child(4){--step:38%}
:is(#vip+p+.tw,#reload+p+.tw+.tw,#punkty+p+.tw) tr:nth-child(5){--step:52%}
:is(#vip+p+.tw,#reload+p+.tw+.tw,#punkty+p+.tw) tr:nth-child(6){--step:66%}
:is(#vip+p+.tw,#reload+p+.tw+.tw,#punkty+p+.tw) tr:nth-child(7){--step:80%}
:is(#vip+p+.tw,#reload+p+.tw+.tw,#punkty+p+.tw) tr:nth-child(8){--step:94%}
#obrot+p+.tw td:last-child,#wyplata+.tw td:last-child{
  background:linear-gradient(90deg,color-mix(in oklch,var(--ac) 24%,transparent) var(--v,0%),transparent var(--v,0%)) left center/100% 70% no-repeat;padding-left:8px}
#obrot+p+.tw tr:nth-child(2){--v:100%}
#obrot+p+.tw tr:nth-child(3){--v:5%}
#wyplata+.tw tr:nth-child(2){--v:10%}
#wyplata+.tw tr:nth-child(3){--v:17%}
#wyplata+.tw tr:nth-child(4){--v:47%}
#wyplata+.tw tr:nth-child(5){--v:70%}
#wyplata+.tw tr:nth-child(6){--v:100%}

/* contents */
.toc,.doc__toc{background:none;border:0;border-radius:0;padding:32px 0;margin:0;border-bottom:1px solid var(--ln)}
.toc b,.doc__toc b{font-family:var(--disp);font-weight:400;font-size:20px;color:var(--hi);margin-bottom:16px}
.toc ol,.doc__toc ol{columns:4 200px;column-gap:32px;font-size:15px;padding-left:24px;max-width:none}
.toc a,.doc__toc a{color:var(--tx);text-decoration:none}
.toc a:hover,.doc__toc a:hover{color:var(--ac)}

/* notes, faq, author */
.note{background:color-mix(in oklch,var(--ac) 7%,var(--s1));border:0;border-radius:var(--r-in);padding:16px 24px}
details{background:none;border:0;border-bottom:1px solid var(--ln);border-radius:0;padding:16px 0;margin:0}
details:first-of-type{border-top:1px solid var(--ln)}
summary{font-weight:600;color:var(--hi);list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--disp);color:var(--ac);font-size:22px;line-height:1;transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
.author{background:var(--s1);border:0;border-radius:var(--r-out);padding:24px;gap:24px}
.author img{width:96px;height:96px;flex-basis:96px}
.author-b b{font-family:var(--disp);font-weight:400;font-size:22px;color:var(--hi)}

/* games, stores, payments */
.gcards{grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:24px 16px}
.gcard{background:none;border:0;border-radius:0}
.gcard img{border-radius:var(--r-in);max-width:200px}
.gcard div{padding:8px 0 0}
.gcard b{font-family:var(--body);font-weight:600;color:var(--hi)}
.store,.pay{background:var(--s1);border:1px solid var(--ln);border-radius:var(--r-in)}
.pays{gap:8px}

/* footer */
footer{border-top-color:var(--ln);font-size:14px;margin-top:96px}
.age{border-color:var(--ac);color:var(--ac);font-family:var(--disp);font-weight:400}
.foot-links a{color:var(--tx)}
.foot-links a:hover{color:var(--ac)}

/* 404 */
main.wrap.e404{padding-top:64px}
.e404__box{background:var(--s1);border:0;border-radius:var(--r-out);padding:48px;gap:0 48px;max-width:960px}
.e404__code{font-family:var(--disp);font-weight:400;font-size:clamp(72px,9vw,128px);letter-spacing:-.02em;color:var(--ac)}
.e404__title{font-size:clamp(28px,3vw,40px);max-width:none;margin:0 0 12px}
.e404__text{color:var(--mu)}
.e404__btn{border-radius:var(--r-in);font-family:var(--disp);font-weight:400;border-color:var(--ln)}
.e404__btn--go{background:var(--ac);border-color:var(--ac);color:var(--on-ac)}
.e404__jump{background:var(--s2);border-radius:var(--r-in);padding:16px 24px 8px;max-width:960px;margin-top:24px}
.e404__jump b{font-family:var(--disp);font-weight:400;color:var(--hi)}
.e404__jump a{color:var(--tx)}

@media (max-width:760px){
  table.sum tbody{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
  .tw:has(.sum){padding:32px 16px}
  .toc ol,.doc__toc ol{columns:1}
  .author{flex-direction:column}
  .e404__box{padding:24px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}body{background-attachment:scroll}}