@font-face{
  font-family:LocalSerif;
  src:local('Georgia');
  font-display:swap
}
:root{
  --forest:#123e30;
  --deep:#0c2b22;
  --ink:#173a2d;
  --muted:#627368;
  --paper:#f6f5ef;
  --white:#fffefa;
  --line:#dce1d6;
  --gold:#dcca83;
  --lime:#e8edc6;
  --radius:18px;
  --serif:LocalSerif,Georgia,'Times New Roman',serif;
  --sans:Arial,Helvetica,sans-serif
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:108px
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.65 var(--sans);
  -webkit-font-smoothing:antialiased
}
button,input,select{
  font:inherit
}
button,a{
  -webkit-tap-highlight-color:transparent
}
button{
  cursor:pointer
}
a{
  color:inherit;
  text-decoration:none
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{
  outline:3px solid #b7902d;
  outline-offset:5px
}
button:disabled{
  cursor:default
}
img,svg{
  display:block;
  max-width:100%
}
img{
  height:auto
}
h1,h2,h3,p{
  margin-top:0
}
h1,h2,h3{
  font-weight:400;
  line-height:1.14;
  letter-spacing:-.035em
}
h1,h2{
  font-family:var(--serif)
}
h3{
  font-family:var(--sans)
}
h2{
  font-size:clamp(32px,3.7vw,46px)
}
h3{
  font-size:21px;
  letter-spacing:-.02em
}
p{
  margin-bottom:1.2em
}
strong{
  font-weight:700
}
[hidden]{
  display:none!important
}
.wrap{
  width:min(1200px,calc(100% - 64px));
  margin-inline:auto
}
.skip{
  position:absolute;
  top:-80px;
  left:20px;
  z-index:200;
  background:var(--gold);
  padding:10px 18px;
  color:var(--deep)
}
.skip:focus{
  top:8px
}
.eyebrow{
  font:700 11px/1.6 var(--sans);
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 18px
}
.section{
  padding:78px 0
}
.section-top{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:32px
}
.section-top h2{
  margin-bottom:0
}
.section-top .eyebrow{
  margin-bottom:12px
}
.section-intro{
  max-width:680px;
  color:var(--muted);
  margin:-12px 0 28px
}
.text-link{
  font-size:14px;
  font-weight:700;
  display:inline-flex;
  gap:18px;
  align-items:center;
  white-space:nowrap;
  border-bottom:1px solid currentColor;
  padding-bottom:5px
}
.text-link:hover{
  color:#698133
}
.arrow{
  font-size:22px;
  font-weight:400;
  line-height:1
}
.button{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:26px;
  min-height:52px;
  padding:13px 23px;
  background:var(--forest);
  color:var(--white);
  border:1px solid transparent;
  border-radius:6px;
  font-size:14px;
  font-weight:700;
  transition:background .18s,transform .18s
}
.button:hover{
  background:#245c43;
  transform:translateY(-1px)
}
.button.gold{
  background:var(--gold);
  color:var(--deep)
}
.button.gold:hover{
  background:#eadb9f
}
.button.outline{
  background:transparent;
  border-color:#92a899;
  color:var(--white)
}
.button.small{
  min-height:43px;
  padding:10px 16px;
  font-size:13px
}
.topbar{
  background:var(--deep);
  color:#b8c7b9;
  border-bottom:1px solid #ffffff12;
  font-size:10px;
  letter-spacing:.11em;
  line-height:1.4
}
.topbar .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:32px;
  gap:12px
}
.topbar a{
  letter-spacing:.02em
}
.header{
  position:sticky;
  top:0;
  z-index:40;
  background:var(--deep);
  color:var(--white);
  border-bottom:1px solid #ffffff16
}
.header-inner{
  height:82px;
  display:flex;
  align-items:center;
  gap:36px
}
.brand{
  display:flex;
  align-items:center;
  flex-shrink:0;
  gap:11px;
  white-space:nowrap;
  font:25px/1 var(--serif);
  letter-spacing:-.8px
}
.brand-mark{
  color:var(--gold);
  flex-shrink:0;
  width:32px;
  height:32px
}
.brand em{
  font-style:normal;
  color:var(--gold)
}
.brand-wordmark{
  display:block
}
.nav{
  display:flex;
  align-items:center;
  gap:25px;
  margin-left:auto;
  font-size:12px
}
.nav a{
  padding:10px 0;
  border-bottom:1px solid transparent
}
.nav a:hover,.nav a[aria-current=page]{
  color:var(--gold);
  border-color:var(--gold)
}
.header-actions{
  display:flex;
  align-items:center;
  gap:16px
}
.icon-button{
  height:38px;
  width:38px;
  display:grid;
  place-items:center;
  border:1px solid #ffffff36;
  background:transparent;
  color:var(--white);
  border-radius:50%
}
.icon-button svg{
  width:17px;
  height:17px
}
.locale{
  font-size:11px;
  letter-spacing:.07em;
  display:flex;
  gap:7px;
  align-items:center
}
.flag{
  width:16px;
  height:11px;
  background:linear-gradient(#c67268 0 33.33%,#f6f4e6 33.33% 66.66%,#70a184 66.66%)
}
.menu-button{
  display:none;
  border:1px solid #ffffff40;
  border-radius:5px;
  color:var(--white);
  background:transparent;
  padding:6px 9px;
  font-size:12px
}
.hero{
  background:var(--deep);
  color:var(--white);
  overflow:hidden;
  position:relative
}
.hero-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  min-height:575px;
  align-items:center;
  gap:25px
}
.hero-copy{
  padding:55px 0 60px;
  position:relative;
  z-index:1
}
.hero .eyebrow{
  color:#c8d0bc;
  font-size:10px;
  display:flex;
  align-items:center;
  gap:12px
}
.hero .eyebrow:before{
  content:'';
  height:1px;
  width:26px;
  background:var(--gold)
}
.hero h1{
  font-size:clamp(45px,5.8vw,74px);
  line-height:1.03;
  letter-spacing:-.052em;
  margin-bottom:27px;
  max-width:670px
}
.hero h1 em{
  color:var(--gold);
  font-weight:400
}
.hero-description{
  font-size:16px;
  color:#c2cec4;
  line-height:1.75;
  max-width:470px;
  margin-bottom:30px
}
.hero-actions{
  display:flex;
  align-items:center;
  gap:24px;
  flex-wrap:wrap
}
.hero-actions .text-link{
  color:#eeeede;
  font-size:12px;
  gap:12px;
  border-bottom:0
}
.hero-meta{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:34px;
  color:#a4b9a9;
  font-size:10px
}
.hero-meta span+span:before{
  content:'·';
  margin-right:12px;
  color:var(--gold)
}
.hero-art{
  position:relative;
  align-self:stretch;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0
}
.hero-art:before{
  content:'';
  position:absolute;
  inset:5% -18% 0 -10%;
  background:radial-gradient(ellipse,#365a324c,transparent 67%);
  pointer-events:none
}
.hero-art img{
  width:560px;
  max-width:115%;
  position:relative;
  z-index:1
}
.art-note{
  position:absolute;
  bottom:52px;
  right:0;
  z-index:2;
  background:#163e32ee;
  border:1px solid #8eaa7745;
  border-radius:8px;
  padding:15px 20px;
  box-shadow:0 12px 45px #0002
}
.art-note .eyebrow{
  font-size:8px;
  margin-bottom:5px;
  letter-spacing:.13em
}
.art-note strong{
  font:17px/1.5 var(--serif);
  font-weight:400;
  color:#e8e5d5
}
.steps{
  border-bottom:1px solid var(--line);
  background:#eeefe5
}
.steps-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr)
}
.step{
  display:flex;
  align-items:center;
  gap:18px;
  padding:27px 25px
}
.step:first-child{
  padding-left:0
}
.step+.step{
  border-left:1px solid #d6dcca
}
.step-number{
  font:italic 28px var(--serif);
  color:#81916a
}
.step strong{
  display:block;
  font-size:13px;
  margin-bottom:2px
}
.step small{
  display:block;
  font-size:11px;
  color:var(--muted)
}
.step .arrow{
  margin-left:auto;
  color:#64754f;
  font-size:19px
}
.operator-list{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden
}
.operator-head,.operator-row{
  display:grid;
  grid-template-columns:1.15fr 1.25fr .85fr auto;
  gap:25px;
  align-items:center
}
.operator-head{
  padding:15px 24px;
  background:#ebeee3;
  color:var(--muted);
  font-size:9px;
  letter-spacing:.11em;
  text-transform:uppercase
}
.operator-row{
  padding:24px
}
.operator-row+.operator-row{
  border-top:1px solid var(--line)
}
.operator-brand{
  display:flex;
  align-items:center;
  gap:17px
}
.operator-monogram{
  width:52px;
  height:52px;
  flex:none;
  display:grid;
  place-items:center;
  background:#f1ecd9;
  border:1px solid #e4dfce;
  border-radius:12px;
  color:#3b4925;
  font:30px var(--serif)
}
.operator-monogram.vegas{
  background:#e6eadd;
  color:#365534
}
.operator-monogram.xcasino{
  background:#eee7ef;
  color:#655170
}
.operator-brand strong{
  display:block;
  font-size:18px;
  letter-spacing:-.02em
}
.operator-brand small{
  display:block;
  font-size:10px;
  color:var(--muted);
  margin-top:3px
}
.operator-detail{
  font-size:12px;
  color:var(--muted)
}
.operator-detail strong{
  color:var(--ink);
  font-size:12px;
  display:block;
  margin-bottom:3px;
  font-weight:500
}
.status{
  display:inline-flex;
  gap:7px;
  align-items:center;
  color:#3f6546;
  font-size:10px;
  background:#eef2e5;
  border-radius:99px;
  padding:5px 9px;
  white-space:nowrap
}
.status:before{
  content:'';
  height:5px;
  width:5px;
  background:#7d9651;
  border-radius:50%
}
.table-note{
  margin:14px 0 0;
  font-size:11px;
  line-height:1.7;
  color:var(--muted)
}
.table-note a{
  text-decoration:underline;
  text-underline-offset:3px
}
.games-section{
  background:#eaece2;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
.games-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px
}
.game-card{
  display:block;
  background:var(--white);
  border:1px solid #d9dfcf;
  border-radius:10px;
  overflow:hidden;
  transition:transform .2s,box-shadow .2s
}
.game-card:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 20px #173a2d0d
}
.game-art{
  height:166px;
  display:grid;
  place-items:center;
  background:#dae3cf;
  position:relative;
  overflow:hidden
}
.game-art:after{
  content:'';
  position:absolute;
  width:190px;
  height:190px;
  border:1px solid #173a2d16;
  border-radius:50%;
  top:23px;
  left:50%;
  transform:translateX(-50%)
}
.game-art.blackjack{
  background:#e9ddc7
}
.game-art.rulett{
  background:#d9e1d7
}
.game-art.elo-kaszino{
  background:#e1dfe9
}
.game-art svg{
  width:106px;
  height:106px;
  position:relative;
  z-index:1
}
.game-card-body{
  padding:21px
}
.game-card-body h3{
  font:25px var(--serif);
  margin-bottom:9px
}
.game-card-body p{
  color:var(--muted);
  font-size:12px;
  line-height:1.7;
  min-height:42px;
  margin-bottom:17px
}
.game-card-body>span{
  font-size:11px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.split-feature{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:75px;
  align-items:center
}
.split-copy h2{
  max-width:475px;
  font-size:clamp(36px,3.8vw,50px)
}
.split-copy p{
  max-width:450px;
  color:var(--muted);
  font-size:14px
}
.term-list{
  list-style:none;
  padding:0;
  margin:25px 0 30px
}
.term-list li{
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 0;
  font-size:12px
}
.term-list li:before{
  content:'✓';
  width:21px;
  height:21px;
  display:grid;
  place-items:center;
  border:1px solid #b8c4a3;
  border-radius:50%;
  color:#507244;
  font-size:11px
}
.calc{
  background:var(--forest);
  color:var(--white);
  border-radius:14px;
  padding:34px;
  box-shadow:0 12px 28px #143a2c10
}
.calc .eyebrow{
  color:#d9dbaa;
  font-size:9px;
  margin-bottom:12px
}
.calc h3{
  font:29px var(--serif);
  letter-spacing:-.025em;
  margin-bottom:8px
}
.calc>p{
  color:#b7c9bb;
  font-size:11px;
  margin-bottom:24px
}
.calc-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px
}
.field label{
  display:block;
  font-size:10px;
  color:#d2ddcd;
  margin-bottom:6px
}
.field input,.field select{
  width:100%;
  min-width:0;
  border:1px solid #ffffff25;
  color:var(--white);
  background:#0e3027;
  padding:11px;
  border-radius:5px;
  font-size:14px;
  height:44px
}
.field select option{
  background:#0e3027
}
.field.full{
  grid-column:1/-1
}
.calc-result{
  border-top:1px solid #ffffff26;
  margin-top:25px;
  padding-top:21px
}
.calc-result small{
  font-size:10px;
  color:#d7dfb7;
  display:block;
  margin-bottom:3px
}
.calc-result output{
  font:44px/1.3 var(--serif);
  letter-spacing:-.025em;
  color:#eee5ae;
  overflow-wrap:anywhere;
  display:block
}
.calc-formula{
  font-size:11px;
  color:#c1d0ba;
  margin:5px 0 10px
}
.calc-caution{
  font-size:10px;
  line-height:1.6;
  color:#bdcdbf;
  margin:12px 0 0
}
.calc-error{
  font-size:12px;
  color:#ffe4a9;
  min-height:20px;
  margin:8px 0 0
}
.calc-noscript{
  font-size:12px;
  color:#eee5ae
}
.guides-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:24px
}
.guide-card{
  background:var(--white);
  border:1px solid var(--line);
  padding:27px;
  border-radius:10px;
  display:flex;
  flex-direction:column
}
.guide-card:hover{
  border-color:#9bac83
}
.guide-card .tag{
  align-self:flex-start;
  font-size:8px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#6a795d;
  margin-bottom:24px
}
.guide-card h3{
  font:28px/1.17 var(--serif);
  margin-bottom:15px
}
.guide-card p{
  font-size:12px;
  color:var(--muted);
  line-height:1.7;
  flex:1
}
.guide-card footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:10px;
  color:var(--muted);
  padding-top:17px;
  border-top:1px solid var(--line)
}
.guide-card .arrow{
  font-size:20px;
  color:var(--ink)
}
.guide-card.featured{
  background:#e7eadb;
  border-color:#d8ddc8
}
.responsible-band{
  margin:20px 0 0;
  background:#e5e8d8;
  border:1px solid #d3dbc1;
  border-radius:12px;
  padding:34px 38px;
  display:flex;
  align-items:center;
  gap:30px
}
.responsible-symbol{
  font:29px var(--serif);
  border:1px solid #a8b395;
  width:64px;
  height:64px;
  flex:none;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#5a6b3f
}
.responsible-band h2{
  font-size:30px;
  margin-bottom:8px
}
.responsible-band p{
  font-size:12px;
  line-height:1.7;
  color:#5d6e52;
  max-width:620px;
  margin:0
}
.responsible-band .text-link{
  margin-left:auto;
  font-size:12px
}
.faq-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:85px
}
.faq-intro p{
  font-size:14px;
  color:var(--muted);
  max-width:310px
}
.faq-list details{
  border-bottom:1px solid #d8dece
}
.faq-list details:first-child{
  border-top:1px solid #d8dece
}
.faq-list summary{
  cursor:pointer;
  padding:20px 35px 20px 0;
  position:relative;
  font-size:14px;
  font-weight:500;
  list-style:none;
  line-height:1.5
}
.faq-list summary::-webkit-details-marker{
  display:none
}
.faq-list summary:after{
  content:'+';
  font-size:24px;
  position:absolute;
  right:4px;
  top:14px;
  color:#748360
}
.faq-list details[open] summary:after{
  content:'−'
}
.faq-list details p{
  font-size:13px;
  color:var(--muted);
  line-height:1.85;
  margin:0;
  padding:0 28px 22px 0
}
.faq-list details a{
  text-decoration:underline
}
.footer{
  background:var(--deep);
  color:#dce1d2;
  padding:59px 0 24px
}
.footer-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:45px
}
.footer .brand{
  font-size:24px;
  color:var(--white);
  margin-bottom:20px
}
.footer .brand-wordmark em{
  display:block;
  margin-top:4px;
  font-size:.68em;
  letter-spacing:.045em
}
.footer-brand p{
  font-size:11px;
  max-width:260px;
  line-height:1.85;
  color:#a5b8a6
}
.footer h3{
  font:700 10px/1.5 var(--sans);
  text-transform:uppercase;
  letter-spacing:.1em;
  color:#d9d5ae;
  margin:3px 0 19px
}
.footer ul{
  list-style:none;
  padding:0;
  margin:0
}
.footer li{
  font-size:11px;
  color:#b8c8b8;
  margin-bottom:11px
}
.footer li a:hover{
  color:var(--gold);
  text-decoration:underline
}
.footer-bottom{
  border-top:1px solid #ffffff18;
  margin-top:35px;
  padding-top:23px;
  font-size:9px;
  color:#8ba58e;
  display:flex;
  gap:28px;
  justify-content:space-between
}
.footer-bottom p{
  margin:0;
  max-width:660px
}
.breadcrumb{
  padding:25px 0 0;
  font-size:10px;
  color:#758372;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center
}
.breadcrumb a:hover{
  text-decoration:underline
}
.breadcrumb span:last-child{
  color:#4e664f
}
.page-heading{
  padding:43px 0 48px;
  border-bottom:1px solid var(--line)
}
.page-heading h1{
  font-size:clamp(37px,5.2vw,60px);
  max-width:890px;
  margin-bottom:22px
}
.page-heading .eyebrow{
  margin-bottom:14px
}
.page-heading .lead{
  font-size:17px;
  line-height:1.75;
  color:var(--muted);
  max-width:850px;
  margin-bottom:20px
}
.page-meta{
  font-size:10px;
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  color:#7b8877
}
.page-meta a{
  text-decoration:underline;
  text-underline-offset:3px
}
.article-layout{
  display:grid;
  grid-template-columns:minmax(0,760px) 260px;
  gap:95px;
  padding-top:50px;
  padding-bottom:75px;
  align-items:start
}
.article-body{
  min-width:0;
  font-size:16px;
  line-height:1.85
}
.article-body h2{
  font-size:34px;
  line-height:1.22;
  margin-bottom:21px
}
.article-body h3{
  font-size:21px;
  font-weight:600;
  line-height:1.35;
  margin:27px 0 12px
}
.article-body p{
  color:#425c48;
  margin-bottom:20px
}
.article-body section{
  margin-bottom:44px
}
.article-body a:not(.button){
  text-decoration:underline;
  text-decoration-color:#a0af85;
  text-underline-offset:4px
}
.article-body ul,.article-body ol{
  padding-left:24px;
  margin:20px 0
}
.article-body li{
  padding-left:5px;
  margin-bottom:12px;
  color:#425c48
}
.article-body strong{
  color:var(--ink)
}
.article-body table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
  line-height:1.65;
  margin:22px 0;
  background:var(--white)
}
.article-body th{
  background:#e6ebdc;
  font-weight:600
}
.article-body th,.article-body td{
  text-align:left;
  padding:14px 16px;
  border:1px solid #d7dfcd;
  vertical-align:top
}
.table-wrap{
  overflow-x:auto;
  max-width:100%;
  margin:24px 0;
  border-radius:6px
}
.table-wrap table{
  margin:0;
  min-width:440px
}
.article-aside{
  position:sticky;
  top:115px
}
.toc{
  padding-left:22px;
  border-left:1px solid #cad3bf
}
.toc h2{
  font:700 10px var(--sans);
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#6e7d61;
  margin:0 0 20px
}
.toc ol{
  list-style:none;
  padding:0;
  margin:0
}
.toc li{
  font-size:11px;
  line-height:1.6;
  margin-bottom:15px;
  color:#65775b
}
.toc a:hover{
  color:var(--ink);
  text-decoration:underline
}
.toc a[aria-current="location"]{
  color:var(--forest);
  font-weight:700;
  text-decoration:underline;
  text-decoration-color:#b7902d;
  text-underline-offset:4px
}
.search-page-label{
  display:block;
  color:var(--muted);
  font-size:11px;
  margin-bottom:4px
}
.article-figure{
  margin:34px 0 46px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--white)
}
.figure-scroll{
  overflow:auto;
  border-radius:12px
}
.figure-scroll img{
  width:100%;
  min-width:640px;
  height:auto
}
.article-figure figcaption{
  margin-top:16px;
  color:var(--muted);
  font-size:14px;
  line-height:1.6
}
.diagram-link{
  display:inline-block;
  margin-top:10px;
  font-size:12px;
  color:var(--forest);
  text-decoration:underline
}
.contact-card{
  margin:30px 0;
  padding:24px;
  background:var(--lime);
  border-radius:var(--radius)
}
.aside-box{
  background:#e8eddc;
  border-radius:8px;
  padding:23px;
  margin-top:32px
}
.aside-box h3{
  font:25px var(--serif);
  margin-bottom:10px
}
.aside-box p{
  font-size:11px;
  color:#67765a;
  line-height:1.75
}
.aside-box .text-link{
  font-size:10px;
  gap:12px
}
.sources{
  font-size:12px;
  background:#ebeee3;
  border:1px solid #dce2d2;
  border-radius:8px;
  padding:25px;
  margin-top:35px
}
.sources h2{
  font:600 15px var(--sans);
  letter-spacing:0;
  margin-bottom:14px
}
.sources ul{
  margin:0;
  padding-left:20px
}
.sources li{
  margin-bottom:8px
}
.sources p{
  font-size:10px;
  color:var(--muted);
  margin:16px 0 0
}
.related{
  background:#edf0e5;
  border-top:1px solid var(--line)
}
.related .section-top{
  margin-bottom:25px
}
.related h2{
  font-size:35px
}
.article-body .calc{
  margin:34px 0
}
.article-body .calc h3{
  margin:0 0 10px
}
.article-body .calc p{
  color:#c5d2ba;
  font-size:11px
}
.article-body .calc .calc-formula{
  margin:6px 0 10px
}
.article-body .calc-result{
  margin-top:24px
}
.note{
  border-left:3px solid #9aac6f;
  background:#edf0e3;
  padding:18px 23px;
  font-size:13px;
  line-height:1.8;
  margin:25px 0
}
.note p:last-child{
  margin-bottom:0
}
.operator-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:9px;
  overflow:hidden;
  margin-bottom:35px
}
.operator-facts div{
  background:#fffdf5;
  padding:20px
}
.operator-facts small{
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.07em;
  display:block;
  color:var(--muted);
  margin-bottom:8px
}
.operator-facts strong{
  font-size:14px;
  line-height:1.6;
  display:block
}
.hub-content{
  padding:50px 0 78px
}
.filters{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  margin-bottom:27px
}
.filter-button{
  border:1px solid #cdd7bf;
  background:transparent;
  color:#4f6645;
  padding:9px 17px;
  border-radius:99px;
  font-size:11px
}
.filter-button[aria-pressed=true]{
  background:var(--forest);
  color:var(--white);
  border-color:var(--forest)
}
.filter-status{
  font-size:11px;
  color:var(--muted);
  margin-bottom:20px
}
.hub-content .guides-grid{
  gap:22px
}
.hub-content .guide-card{
  min-height:270px
}
.hub-copy{
  max-width:800px;
  font-size:15px;
  color:var(--muted);
  margin:42px 0
}
.hub-copy h2{
  font-size:33px;
  color:var(--ink)
}
.search-dialog{
  border:1px solid #dce1cc;
  border-radius:14px;
  width:min(680px,calc(100% - 36px));
  max-height:82vh;
  padding:28px;
  background:var(--paper);
  color:var(--ink);
  box-shadow:0 25px 100px #0005;
  position:fixed;
  top:11vh;
  margin:0 auto
}
.search-dialog::backdrop{
  background:#082a21b3;
  backdrop-filter:blur(3px)
}
.search-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:20px
}
.search-top h2{
  font-size:29px;
  margin:0
}
.search-close{
  border:1px solid #bbc9ac;
  width:32px;
  height:32px;
  border-radius:50%;
  background:transparent;
  color:var(--ink);
  font-size:21px;
  line-height:1
}
.search-dialog input{
  width:100%;
  padding:14px 16px;
  background:var(--white);
  border:1px solid #b9c7ae;
  border-radius:6px;
  color:var(--ink);
  font-size:16px
}
.search-caption{
  font-size:11px;
  color:var(--muted);
  margin:11px 0
}
.search-results{
  list-style:none;
  padding:0;
  margin:17px 0 0;
  max-height:45vh;
  overflow-y:auto
}
.search-results li+li{
  border-top:1px solid var(--line)
}
.search-results a{
  display:block;
  padding:15px 8px;
  border-radius:3px
}
.search-results a:hover{
  background:#e7eddc
}
.search-results strong{
  display:block;
  font-size:15px;
  font-weight:500;
  margin-bottom:5px
}
.search-results small{
  font-size:11px;
  color:var(--muted);
  display:block;
  line-height:1.7
}
.search-empty{
  font-size:13px;
  padding:20px 0;
  color:var(--muted)
}
.not-found{
  text-align:center;
  padding:110px 20px 130px
}
.not-found .number{
  font:95px var(--serif);
  color:#889869;
  line-height:1.2
}
.not-found h1{
  font-size:42px;
  margin:18px 0
}
.not-found p{
  color:var(--muted)
}
.not-found .button{
  margin-top:15px
}
.screen-reader-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
@media(min-width:1400px){
  .hero-grid{
    min-height:620px
  }
  .hero-art img{
    width:580px
  }
  .hero h1{
    font-size:80px
  }
}
@media(max-width:1100px){
  .header-inner{
    gap:22px
  }
  .nav{
    gap:17px;
    font-size:11px
  }
  .brand{
    font-size:23px
  }
  .header-actions{
    gap:12px
  }
  .locale{
    display:none
  }
  .hero-grid{
    min-height:545px
  }
  .hero h1{
    font-size:63px
  }
  .hero-art img{
    max-width:122%
  }
  .art-note{
    right:-5px;
    bottom:60px;
    padding:13px 17px
  }
  .art-note strong{
    font-size:15px
  }
  .split-feature{
    gap:48px
  }
  .operator-row,.operator-head{
    gap:17px;
    grid-template-columns:1.1fr 1.15fr .85fr auto
  }
  .article-layout{
    grid-template-columns:minmax(0,1fr) 225px;
    gap:55px
  }
  .footer-grid{
    gap:28px
  }
  .game-card-body{
    padding:19px
  }
  .game-card-body h3{
    font-size:24px
  }
}
@media(max-width:850px){
  .wrap{
    width:calc(100% - 40px)
  }
  .header-inner{
    height:70px
  }
  .header .brand-wordmark em{
    display:block;
    margin-top:3px;
    font-size:.68em;
    letter-spacing:.045em
  }
  .nav{
    gap:15px
  }
  .nav a:nth-child(5){
    display:none
  }
  .hero-grid{
    grid-template-columns:1.07fr .93fr;
    min-height:510px
  }
  .hero h1{
    font-size:52px
  }
  .hero-description{
    font-size:14px
  }
  .hero-copy{
    padding:42px 0 47px
  }
  .hero-art img{
    max-width:135%
  }
  .hero-actions{
    gap:16px
  }
  .hero-actions .button{
    font-size:12px;
    padding:13px 16px;
    gap:17px
  }
  .hero-actions .text-link{
    font-size:11px
  }
  .art-note{
    right:0;
    bottom:37px
  }
  .art-note strong{
    font-size:13px
  }
  .hero-meta{
    margin-top:26px;
    font-size:9px;
    gap:8px
  }
  .hero-meta span+span:before{
    margin-right:8px
  }
  .step{
    padding:22px 17px;
    gap:12px
  }
  .step-number{
    font-size:23px
  }
  .step strong{
    font-size:11px
  }
  .step small{
    font-size:9px
  }
  .step .arrow{
    display:none
  }
  .section{
    padding:60px 0
  }
  .operator-head{
    display:none
  }
  .operator-row{
    grid-template-columns:1.2fr 1fr auto
  }
  .operator-state{
    display:none
  }
  .operator-detail strong{
    font-size:11px
  }
  .games-grid{
    grid-template-columns:repeat(2,1fr);
    gap:20px
  }
  .game-art{
    height:170px
  }
  .game-card-body p{
    min-height:0
  }
  .split-feature{
    gap:30px
  }
  .calc{
    padding:26px
  }
  .calc-fields{
    gap:12px
  }
  .calc-result output{
    font-size:38px
  }
  .guides-grid{
    gap:15px
  }
  .guide-card{
    padding:22px
  }
  .guide-card h3{
    font-size:24px
  }
  .responsible-band{
    padding:27px;
    gap:20px;
    flex-wrap:wrap
  }
  .responsible-band>div:nth-child(2){
    flex:1;
    min-width:250px
  }
  .responsible-band .text-link{
    margin-left:84px
  }
  .faq-grid{
    gap:45px;
    grid-template-columns:.85fr 1.15fr
  }
  .article-layout{
    grid-template-columns:1fr;
    gap:0;
    padding-top:37px
  }
  .article-aside{
    position:static;
    order:-1;
    margin-bottom:36px
  }
  .toc{
    background:#ebeee1;
    border:1px solid #d7dfca;
    border-radius:7px;
    padding:21px 24px
  }
  .toc ol{
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:20px
  }
  .toc h2{
    margin-bottom:15px
  }
  .toc li{
    margin-bottom:10px
  }
  .article-aside .aside-box{
    display:none
  }
  .article-body{
    max-width:760px
  }
  .page-heading{
    padding:33px 0 35px
  }
  .page-heading h1{
    font-size:48px
  }
  .page-heading .lead{
    font-size:16px
  }
  .footer-grid{
    grid-template-columns:1.3fr 1fr 1fr
  }
  .footer-grid>div:last-child{
    grid-column:2/4
  }
  .footer-grid>div:last-child ul{
    display:flex;
    gap:20px;
    flex-wrap:wrap
  }
  .footer-grid>div:last-child h3{
    margin-bottom:13px
  }
}
@media(max-width:650px){
  .wrap{
    width:calc(100% - 36px)
  }
  .topbar .wrap{
    min-height:30px;
    font-size:8px;
    letter-spacing:.05em
  }
  .topbar .top-extra{
    display:none
  }
  .header-inner{
    height:66px;
    gap:14px
  }
  .brand{
    font-size:22px;
    gap:8px
  }
  .brand-mark{
    height:26px;
    width:26px
  }
  .header-actions{
    margin-left:auto;
    gap:9px
  }
  .icon-button{
    width:32px;
    height:32px
  }
  .menu-button{
    display:block
  }
  .nav{
    display:flex;
    justify-content:space-between;
    gap:12px;
    overflow-x:auto;
    position:static;
    width:100%;
    font-size:11px;
    padding:0 18px 11px;
    margin:0;
    scrollbar-width:none
  }
  .nav a{
    white-space:nowrap
  }
  .nav a:nth-child(5){
    display:block
  }
  .header-inner{
    flex-wrap:wrap;
    height:auto;
    min-height:66px;
    padding-top:17px;
    padding-bottom:0
  }
  .header .wrap{
    width:100%
  }
  .header-inner>.brand{
    margin-left:18px
  }
  .header-actions{
    margin-right:18px;
    padding-bottom:17px
  }
  .nav{
    order:3
  }
  .js-ready .nav{
    display:none
  }
  .js-ready .nav.is-open{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    gap:6px 23px;
    padding:5px 20px 19px
  }
  .hero-grid{
    grid-template-columns:1fr;
    gap:0;
    min-height:0
  }
  .hero-copy{
    padding:42px 0 0
  }
  .hero h1{
    font-size:clamp(42px,11.7vw,66px);
    margin-bottom:22px;
    max-width:570px
  }
  .hero .eyebrow{
    font-size:8px;
    letter-spacing:.15em;
    margin-bottom:21px
  }
  .hero-description{
    font-size:14px;
    max-width:390px;
    margin-bottom:26px
  }
  .hero-actions .button{
    min-height:47px
  }
  .hero-meta{
    margin-top:25px;
    font-size:9px
  }
  .hero-art{
    height:315px;
    margin-top:0;
    margin-bottom:10px;
    align-items:center
  }
  .hero-art img{
    height:355px;
    width:390px;
    max-width:108%;
    object-fit:contain
  }
  .art-note{
    bottom:17px;
    right:5px;
    padding:12px 15px
  }
  .art-note .eyebrow{
    font-size:7px;
    margin-bottom:3px
  }
  .art-note strong{
    font-size:14px
  }
  .steps-grid{
    grid-template-columns:1fr
  }
  .step,.step:first-child{
    padding:15px 0;
    gap:15px
  }
  .step+.step{
    border-left:0;
    border-top:1px solid #d6dcca
  }
  .step-number{
    font-size:24px
  }
  .step strong{
    font-size:12px
  }
  .step small{
    font-size:10px
  }
  .step .arrow{
    display:block;
    margin-right:5px
  }
  .section{
    padding:46px 0
  }
  .section-top{
    align-items:start;
    gap:20px;
    flex-direction:column;
    margin-bottom:26px
  }
  .section-top h2{
    font-size:34px
  }
  .section-top>.text-link{
    font-size:11px;
    gap:13px
  }
  .eyebrow{
    font-size:9px;
    margin-bottom:13px
  }
  .section-intro{
    font-size:13px;
    line-height:1.8;
    margin-top:0
  }
  .operator-row{
    grid-template-columns:1fr auto;
    gap:16px;
    padding:21px 18px
  }
  .operator-detail{
    grid-column:1/-1;
    grid-row:2;
    padding-top:12px;
    border-top:1px dashed #dce2d2;
    display:flex;
    justify-content:space-between;
    gap:12px;
    font-size:10px
  }
  .operator-detail strong{
    margin:0;
    font-size:10px;
    max-width:55%
  }
  .operator-brand{
    gap:12px
  }
  .operator-monogram{
    height:43px;
    width:43px;
    border-radius:9px;
    font-size:26px
  }
  .operator-brand strong{
    font-size:16px
  }
  .operator-brand small{
    font-size:9px
  }
  .operator-row .button{
    font-size:10px;
    padding:9px 11px;
    gap:10px;
    min-height:39px
  }
  .operator-row .button .arrow{
    font-size:16px
  }
  .table-note{
    font-size:10px;
    line-height:1.85
  }
  .games-grid{
    gap:13px
  }
  .game-art{
    height:126px
  }
  .game-art svg{
    width:88px;
    height:88px
  }
  .game-card-body{
    padding:17px 14px
  }
  .game-card-body h3{
    font-size:22px
  }
  .game-card-body p{
    font-size:10px;
    min-height:50px;
    margin-bottom:15px
  }
  .game-card-body>span{
    font-size:9px
  }
  .game-card-body .arrow{
    font-size:18px
  }
  .split-feature{
    grid-template-columns:1fr;
    gap:30px
  }
  .split-copy h2{
    font-size:37px
  }
  .split-copy p{
    font-size:13px
  }
  .term-list{
    margin:19px 0 22px
  }
  .term-list li{
    padding:7px 0;
    font-size:11px
  }
  .calc{
    padding:26px 23px
  }
  .calc h3{
    font-size:28px
  }
  .calc-result output{
    font-size:40px
  }
  .guides-grid{
    grid-template-columns:1fr;
    gap:14px
  }
  .guide-card{
    padding:24px;
    min-height:0
  }
  .guide-card .tag{
    margin-bottom:17px
  }
  .guide-card h3{
    font-size:28px;
    max-width:340px;
    margin-bottom:11px
  }
  .guide-card p{
    font-size:12px;
    margin-bottom:20px
  }
  .guide-card footer{
    padding-top:14px
  }
  .responsible-band{
    padding:24px;
    gap:18px;
    margin-top:0
  }
  .responsible-symbol{
    width:47px;
    height:47px;
    font-size:22px
  }
  .responsible-band>div:nth-child(2){
    min-width:200px
  }
  .responsible-band h2{
    font-size:28px
  }
  .responsible-band p{
    font-size:11px
  }
  .responsible-band .text-link{
    margin-left:0;
    font-size:11px
  }
  .faq-grid{
    grid-template-columns:1fr;
    gap:25px
  }
  .faq-intro h2{
    font-size:34px;
    margin-bottom:17px
  }
  .faq-intro p{
    font-size:13px;
    max-width:100%;
    margin-bottom:0
  }
  .faq-list summary{
    font-size:13px;
    padding:18px 30px 18px 0
  }
  .faq-list details p{
    font-size:12px;
    padding-bottom:18px
  }
  .footer{
    padding-top:43px
  }
  .footer-grid{
    grid-template-columns:1fr 1fr;
    gap:27px 25px
  }
  .footer-brand{
    grid-column:1/-1
  }
  .footer-brand p{
    max-width:320px
  }
  .footer .brand{
    margin-bottom:15px
  }
  .footer-grid>div:last-child{
    grid-column:1/-1
  }
  .footer-grid>div:last-child ul{
    gap:7px 20px
  }
  .footer-grid>div:last-child li{
    margin-bottom:0
  }
  .footer h3{
    font-size:9px;
    margin-bottom:16px
  }
  .footer li{
    font-size:11px;
    margin-bottom:10px
  }
  .footer-bottom{
    flex-direction:column;
    gap:14px;
    margin-top:27px;
    font-size:9px;
    line-height:1.85
  }
  .breadcrumb{
    padding-top:19px;
    font-size:9px;
    gap:7px;
    line-height:1.8
  }
  .breadcrumb span:last-child{
    max-width:240px
  }
  .page-heading{
    padding:28px 0 31px
  }
  .page-heading h1{
    font-size:38px;
    line-height:1.14;
    margin-bottom:19px;
    overflow-wrap:anywhere
  }
  .page-heading .lead{
    font-size:15px;
    line-height:1.75;
    margin-bottom:19px
  }
  .page-meta{
    font-size:9px;
    gap:7px 14px
  }
  .article-layout{
    padding-top:27px;
    padding-bottom:45px
  }
  .toc{
    padding:19px 20px
  }
  .toc ol{
    grid-template-columns:1fr
  }
  .toc li{
    font-size:11px;
    margin-bottom:8px
  }
  .article-aside{
    margin-bottom:30px
  }
  .article-body{
    font-size:15px;
    line-height:1.85
  }
  .article-body h2{
    font-size:29px
  }
  .article-body h3{
    font-size:20px
  }
  .article-body section{
    margin-bottom:35px
  }
  .article-body ul,.article-body ol{
    padding-left:20px
  }
  .article-body th,.article-body td{
    padding:12px;
    font-size:12px
  }
  .operator-facts{
    grid-template-columns:1fr
  }
  .operator-facts div{
    padding:16px 18px
  }
  .operator-facts small{
    font-size:8px
  }
  .operator-facts strong{
    font-size:13px
  }
  .sources{
    padding:21px
  }
  .sources ul{
    padding-left:17px
  }
  .sources li{
    font-size:11px;
    overflow-wrap:anywhere
  }
  .hub-content{
    padding:34px 0 48px
  }
  .hub-content .guide-card{
    min-height:0
  }
  .hub-copy{
    margin-top:35px;
    font-size:14px
  }
  .hub-copy h2{
    font-size:30px
  }
  .filter-button{
    padding:8px 14px;
    font-size:10px
  }
  .search-dialog{
    padding:23px 20px;
    top:7vh;
    max-height:86vh
  }
  .search-top h2{
    font-size:25px
  }
  .search-results{
    max-height:50vh
  }
  .search-results strong{
    font-size:14px
  }
  .search-results small{
    font-size:11px
  }
  .not-found{
    padding:65px 0 80px
  }
  .not-found h1{
    font-size:35px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,*:before,*:after{
    animation:none!important;
    transition:none!important
  }
}
@media print{
  .header,.topbar,.footer,.article-aside,.related,.search-dialog,.hero-art,.filters,.menu-button{
    display:none!important
  }
  .wrap{
    width:100%;
    max-width:100%
  }
  body{
    background:white;
    color:black
  }
  .article-layout{
    display:block
  }
  .page-heading{
    padding-top:10px
  }
  .article-body{
    font-size:11pt
  }
  .article-body h2{
    font-size:20pt
  }
  .sources{
    break-inside:avoid
  }
  a{
    text-decoration:underline
  }
  .section{
    padding:20px 0
  }
}
/* Long-form guides and the demo information card. */
.game-art.demo{
  background:#e1dfe9
}
.article-body table caption{
  text-align:left;
  color:var(--muted);
  font-size:12px;
  margin-bottom:9px
}
.article-body blockquote{
  border-left:3px solid var(--gold);
  padding:4px 0 4px 22px;
  margin:26px 0;
  color:#425c48
}
.article-body dl{
  margin:22px 0
}
.article-body dt{
  font-weight:700;
  color:var(--ink);
  margin-top:22px
}
.article-body dd{
  margin:7px 0 18px;
  color:#425c48
}
.article-body .table-wrap{
  max-width:100%;
  overflow-x:auto
}
.article-body .table-wrap table{
  min-width:520px
}
@media(min-width:851px){
  .article-aside{
    max-height:calc(100vh - 140px);
    overflow-y:auto;
    padding-right:10px;
    scrollbar-width:thin
  }
  .hero-description{
    max-width:535px;
    font-size:15px
  }
  .nav{
    gap:20px
  }
}
@media(max-width:850px){
  .article-aside{
    max-height:none;
    overflow:visible;
    padding-right:0
  }
  .article-body .table-wrap{
    max-width:100%
  }
}