:root{

  --table:      #241a13;
  --table-2:    #180f0a;
  --baize:      #177542;
  --baize-deep: #115c33;
  --baize-lit:  #1c8449;
  --baize-dark: #0d5330;
  --card:       #e7d3ac;
  --card-2:     #d6bd91;
  --card-edge:  #9d7c4e;
  --paper:      #f2e7ce;
  --red:        #e8412a;
  --red-ink:    #a81f0d;
  --green-ink:  #0f5c33;
  --yellow:     #f4b822;
  --blue:       #1b3a93;
  --red-plate:  #c22d12;
  --ink:        #16120e;
  --ink-soft:   #4d4136;
  --on-baize:   #f2e7ce;
  --on-baize-2: #cfe8d6;
  --on-plate-2: #fbe9e2;
  --on-table-2: #c0ab97;

  --skin:       #d99b6a;
  --skin-dark:  #b87c4f;
  --kit-white:  #f4efe2;

  --shadow-lift: 0 22px 44px -14px rgba(0,0,0,.62), 0 4px 10px rgba(0,0,0,.34);
  --shadow-flat: 0 8px 18px -8px rgba(0,0,0,.5), 0 2px 4px rgba(0,0,0,.24);

  --ease: cubic-bezier(.16,1,.3,1);
  --ease-snap: cubic-bezier(.08,.92,.24,1);

  --hair: .09em;
  --tabs-h: 38px;
}

*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none !important; }

html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; scrollbar-color: var(--card-edge) var(--table-2); }

body{
  margin:0;
  background: var(--table);
  color: var(--ink);
  font-family:'PT Sans', ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(1rem, .96rem + .22vw, 1.115rem);
  line-height:1.56;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}

::selection{ background: var(--yellow); color: var(--ink); text-shadow:none; }
:where(a,button,input,[tabindex]):focus-visible{
  outline: 3px solid var(--yellow);
  outline-offset: 3px;
  border-radius: 2px;
}
.sec--paper ::selection, .sec--card ::selection{ background: var(--red); color: var(--paper); }
::-webkit-scrollbar{ width:13px; height:13px; }
::-webkit-scrollbar-track{ background: var(--table-2); }
::-webkit-scrollbar-thumb{ background: var(--card-edge); border:3px solid var(--table-2); border-radius:0; }
::-webkit-scrollbar-thumb:hover{ background: var(--card-2); }

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background: var(--yellow); color: var(--ink);
  padding:.7rem 1.1rem; font-family:'Cuprum',sans-serif; font-weight:700;
  text-transform:uppercase; letter-spacing:var(--hair); text-decoration:none;
}
.skip:focus{ left:.6rem; top:.6rem; }

.sprite{ position:absolute; width:0; height:0; overflow:hidden; }

.grain{
  position:fixed; inset:0; width:100%; height:100%;
  pointer-events:none; z-index:90; opacity:.24; mix-blend-mode:multiply;
}

.halftone::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Ccircle cx='1.5' cy='1.5' r='1.15' fill='%23000'/%3E%3C/svg%3E");
  background-size:6px 6px;
  opacity:.07;
  mix-blend-mode:multiply;
}

h1,h2,h3{ margin:0; font-weight:400; }

.h2{
  font-family:'Podkova', ui-serif, Georgia, serif;
  font-weight:800;
  font-size: clamp(2rem, 1.25rem + 3.3vw, 3.7rem);
  line-height:1.02;
  letter-spacing:-.012em;
  text-wrap:balance;
  margin-bottom:.55em;
}
.sec--table .h2{ color: var(--paper); }
.sec--plate .h2{ color: var(--paper); }
.sec--paper .h2, .sec--card .h2{ color: var(--ink); }

.lead{
  max-width:56ch;
  font-size:1.08em;
  margin:0 0 2.4rem;
  text-wrap:pretty;
}
.sec--table .lead{ color: var(--on-table-2); }
.sec--plate .lead{ color: var(--on-plate-2); }
.sec--paper .lead, .sec--card .lead{ color: var(--ink-soft); }

.wrap{ width:min(1180px, 91vw); margin-inline:auto; position:relative; z-index:2; }

.sec{ position:relative; padding: clamp(3.6rem, 7.5vw, 7rem) 0; }
.sec--table{ background: var(--table); }
.sec--paper{ background: var(--paper); }
.sec--card{ background: var(--card-2); }
.sec--plate{ background: var(--red-plate); }
.sec--baize{ background: var(--baize-deep); }

.sec--paper, .sec--card, .sec--plate{ border-top:6px solid rgba(0,0,0,.22); }

.note{
  margin:2.6rem 0 0;
  padding:1rem 1.15rem;
  border:2px dashed var(--card-edge);
  font-size:.96em;
  color: var(--ink-soft);
  max-width:62ch;
}

.btn{
  -webkit-appearance:none; appearance:none;
  font-family:'Cuprum', sans-serif; font-weight:700;
  text-transform:uppercase; letter-spacing:var(--hair);
  border:0; cursor:pointer;
  padding:.82em 1.5em;
  font-size: 1.08rem; line-height:1;
  background: var(--yellow); color: var(--ink);
  box-shadow: var(--shadow-flat);
  transition: transform .18s var(--ease), box-shadow .18s var(--ease), background-color .18s var(--ease);
}
.btn:hover{ transform: translateY(-2px); box-shadow: 0 12px 22px -8px rgba(0,0,0,.55), 0 3px 5px rgba(0,0,0,.28); }
.btn:active{ transform: translateY(1px); box-shadow: 0 4px 9px -4px rgba(0,0,0,.5); }
.btn:disabled{ cursor:default; background: var(--card-2); color: #7a6a55; transform:none; box-shadow:none; }

.btn--pass{ background: var(--yellow); }
.btn--ghost{ background: transparent; color: var(--on-baize); box-shadow: inset 0 0 0 2px var(--on-baize-2); }
.btn--ghost:hover{ background: rgba(242,231,206,.12); box-shadow: inset 0 0 0 2px var(--on-baize); }
.btn--small{ font-size: .88rem; padding:.7em 1.15em; }
.btn--flag{ background: var(--yellow); }
.btn--play{ background: var(--paper); }

.sec--baize{

  min-height: calc(100svh - var(--tabs-h) - var(--consent-h, 0px));
  display:flex; flex-direction:column;
  padding: clamp(1.6rem,3vw,2.4rem) 0 clamp(1.6rem,3vw,2.4rem);
  overflow:hidden;

  box-shadow: inset 0 0 0 13px var(--card-2), inset 0 0 0 16px rgba(0,0,0,.34);
}
.stage{
  flex:1 1 auto; min-height:0;
  width:min(1240px, calc(100% - 3.4rem)); margin-inline:auto; position:relative; z-index:2;
  display:grid; grid-template-rows:auto minmax(240px,1fr) auto;
  gap: clamp(.6rem,1.4vw,1.1rem);
}

.stage__head{ grid-area:1 / 1; display:flex; flex-wrap:wrap; align-items:flex-end; gap:.35rem 2rem; }
.stage__h{
  font-family:'Podkova', ui-serif, Georgia, serif;
  font-weight:800;
  font-size: clamp(1.6rem, .95rem + 2.5vw, 2.9rem);
  line-height:1.06; letter-spacing:-.012em;
  color: var(--yellow);
  flex:0 0 auto;
}
.stage__lead{ margin:0; flex:1 1 20rem; max-width:46ch; color: var(--on-baize-2); font-size:.96em; line-height:1.45; }

.board{ grid-area:2 / 1; position:relative; min-height:0; }
.board__svg{ position:absolute; inset:0; display:block; width:100%; height:100%; touch-action:none; }

.stage__foot{ grid-area:3 / 1; display:grid; gap:.55rem; align-content:end; }
.board__svg .man{ cursor:default; }
.board__svg .man--drag{ cursor:grab; }
.board__svg .man--drag:active{ cursor:grabbing; }
.board__svg.is-dragging, .board__svg.is-dragging .man{ cursor:grabbing; }
.board__svg .man:focus{ outline:none; }
.board__svg .man:focus-visible .halo{ opacity:1; }
.halo{ opacity:0; transition:opacity .12s linear; }

.chalk{ opacity:.75; }
.board__svg .man--drag:hover .chalk,
.board__svg .man--drag:focus-visible .chalk{ opacity:0; }
.flagarm{ transition: transform .32s var(--ease-snap); }
.board__svg .man--drag:hover .halo{ opacity:.55; }

.hint{ pointer-events:none; }
.board__svg .man--drag.is-hinted .halo{ opacity:.55; }
.board__svg .man--drag.is-hinted .chalk{ opacity:0; }

.verdict{
  grid-area:2 / 1; align-self:end; justify-self:end;
  width:min(300px, 34%);
  background: var(--card); color: var(--ink);
  padding:calc(1rem + 8px) 1.1rem 1.05rem;

  box-shadow: inset 0 8px 0 var(--baize), var(--shadow-lift);
  transform: rotate(1.4deg);
  z-index:3;
  display:grid; grid-template-columns:auto minmax(0,1fr); gap:.2rem .8rem; align-items:start;
  transition: background-color .2s var(--ease), box-shadow .2s var(--ease);
}
.verdict[data-state="off"]{ background: var(--red-plate); color: var(--paper); box-shadow: var(--shadow-lift); }
.verdict__stamp{ grid-row:1 / span 2; align-self:center; width:38px; height:38px; margin:0; color: var(--ink); }

.verdict__stamp svg{ width:100%; height:100%; display:block; transform-origin:29.2% 87.5%;
  transition: transform .3s var(--ease-snap); }
.verdict[data-state="off"] .verdict__stamp{ color: var(--paper); }

.verdict[data-state="off"] .verdict__stamp svg{ transform: rotate(20deg); }
.verdict[data-flag="up"] .verdict__stamp svg{ transform: rotate(0deg); }
.verdict[data-state="level"] .verdict__stamp svg,
.verdict[data-state="on"] .verdict__stamp svg{ transform: rotate(38deg); }
.verdict__word{
  font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800; font-size:1.62rem; line-height:1.08;
  letter-spacing:-.02em; margin:0 0 .2rem; align-self:center;
}
.verdict[data-state="off"] .verdict__word{ color: var(--paper); }
.verdict[data-state="on"] .verdict__word,
.verdict[data-state="level"] .verdict__word{ color: var(--green-ink); }

.verdict__note{
  display:block; margin-top:.2rem;
  font-family:'PT Sans', ui-sans-serif, system-ui, sans-serif; font-weight:700;
  font-size:.88rem; line-height:1.3; letter-spacing:0;
}
.verdict__why{ margin:0; font-size:.88rem; line-height:1.4; color: var(--ink-soft); }
.verdict[data-state="off"] .verdict__why{ color: var(--on-plate-2); }

.plan{ margin:0; }
.plan__h{
  font-family:'Cuprum',sans-serif; font-weight:700; font-size: .68rem;
  text-transform:uppercase; letter-spacing:.1em; color: var(--on-baize-2);
  margin:0 0 .3rem;
}
.plan__svg{ display:block; width:100%; }

.controls{ display:flex; flex-wrap:wrap; align-items:center; gap:.7rem 1rem; }
.controls__hint{
  margin:0; font-size: .88rem; color: var(--on-baize-2);
  flex:1 1 16rem; max-width:44ch;
}
.live{
  margin:0; font-size: .88rem; color: var(--on-baize-2); min-height:1.2em;
}

.scrub{
  background: var(--card);
  padding: clamp(1.1rem,2.6vw,2rem);
  box-shadow: var(--shadow-lift);
  position:relative;
  display:grid; gap:1.2rem;
  grid-template-columns: minmax(0,1fr) minmax(210px, 280px);
  grid-template-areas: "pitch pitch" "rail panel";
  align-items:start;
}
.scrub__svg{ grid-area:pitch; display:block; width:100%; height:auto; }

.scrub__rail{ grid-area:rail; padding:0 24px; align-self:center; }
.scrub__track{
  position:relative; height:52px;
  background: var(--card-2);
  box-shadow: inset 0 3px 7px rgba(0,0,0,.32), inset 0 0 0 2px var(--card-edge);
  touch-action:none;
}
.scrub__notch{
  position:absolute; left:42%;  top:0; bottom:0; width:3px;
  background: var(--red); transform: translateX(-50%);
}
.scrub__notch span{
  position:absolute; left:50%; bottom:calc(100% + 6px); transform:translateX(-50%);
  font-family:'Cuprum',sans-serif; font-weight:700; font-size:.68rem;
  text-transform:uppercase; letter-spacing:.07em; white-space:nowrap; color: var(--red-ink);
}
.scrub__tab{
  position:absolute; left:0; top:-7px; height:66px; width:44px;
  transform: translateX(-50%);
  background: var(--blue); border:0; cursor:grab;
  box-shadow: var(--shadow-flat), inset 0 0 0 3px var(--paper), inset 0 0 0 5px var(--blue);
}
.scrub__tab:active{ cursor:grabbing; }
.scrub__tab::after{
  content:''; position:absolute; left:50%; top:50%; width:4px; height:26px;
  transform:translate(-50%,-50%); background: var(--paper);
}
.scrub__label{
  margin:.55rem 0 0; font-family:'Cuprum',sans-serif; font-weight:700;
  font-size: .68rem; text-transform:uppercase; letter-spacing:.1em; color: var(--ink-soft);
}

.grip-hint{
  position:absolute; left:0; top:0; z-index:2; width:52px; height:52px;
  pointer-events:none; opacity:0;
  transform-origin:45.8% 14.6%;
}
.grip-hint svg{ display:block; width:100%; height:100%; overflow:visible; }

.scrub__panel{
  grid-area:panel; background: var(--paper);
  padding:1rem 1.05rem; box-shadow: inset 0 0 0 2px var(--card-edge);
}
.scrub__now{
  font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800; font-size: 1.45rem; line-height:1.1; letter-spacing:-.012em;
  margin:0 0 .45rem; color: var(--ink);
}
.scrub__now[data-hot="1"]{ color: var(--red-ink); }
.scrub__verdict{ margin:0 0 1rem; font-size: .88rem; line-height:1.45; color: var(--ink-soft); }

.figs{
  display:grid; gap:1px;
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  background: var(--card-edge);
  box-shadow: 0 0 0 1px var(--card-edge);
}
.fig{
  margin:0; background: var(--paper);
  padding: clamp(1.1rem,2.2vw,1.6rem);
  display:grid; gap:.9rem; align-content:start;
}
.fig__svg{ display:block; width:100%; height:auto; background: var(--card); }
.fig__n{
  font-family:'Cuprum',sans-serif; font-weight:700; font-size: .68rem;
  text-transform:uppercase; letter-spacing:.12em; color: var(--red-ink); margin:0;
}
.fig__t{ margin:0; font-size:1rem; line-height:1.5; }
.fig__t b{ font-weight:700; background: var(--yellow); padding:0 .15em; }
.fig__j{ margin:0; font-size: .88rem; line-height:1.45; color: var(--ink-soft); font-style:italic; }

.punch{
  display:grid; gap: clamp(.8rem,1.8vw,1.3rem);
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
}
.punch__slot{
  position:relative; min-height:190px;
  background: var(--baize-dark);
  box-shadow: inset 0 12px 20px -6px rgba(0,0,0,.75), inset 0 -3px 0 rgba(255,255,255,.07), inset 0 0 0 2px rgba(0,0,0,.45);
}
.punch__truth{
  position:absolute; inset:0; display:grid; align-content:center; gap:.45rem;
  padding:1.1rem 1.2rem; color: var(--on-baize);
}
.punch__truth b{ color: var(--yellow); font-weight:700; }
.punch__truth p{ margin:0; font-size:.98rem; line-height:1.45; }
.punch__label{
  font-family:'Cuprum',sans-serif; font-weight:700; font-size: .68rem;
  text-transform:uppercase; letter-spacing:.12em; color: var(--on-baize-2);
}

.punch__card{
  position:absolute; inset:0; width:100%;
  -webkit-appearance:none; appearance:none; border:0; cursor:pointer;
  background: var(--paper);
  box-shadow: var(--shadow-lift);
  padding:1.1rem 1.2rem; text-align:left;
  font-family:'PT Sans',sans-serif; font-size: 1.08rem; line-height:1.4; color: var(--ink);
  display:grid; align-content:space-between; gap:.5rem;
  transition: transform .55s var(--ease), opacity .45s linear;
}
.punch__card::before{
  content:''; position:absolute; inset:7px; pointer-events:none;
  border:2px dotted var(--card-edge);
}
.punch__card:hover{ transform: translateY(-3px) rotate(-.4deg); }
.punch__card.is-out{
  transform: translateY(150px) rotate(7deg) scale(.9);
  opacity:0; pointer-events:none;
}
.punch__card.is-out::after{ display:none; }
.punch__myth{ font-weight:700; }
.punch__hint{
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:'Cuprum',sans-serif; font-weight:700; font-size: .78rem;
  text-transform:uppercase; letter-spacing:.1em; color: var(--red-ink);
}
.punch__hint svg{ width:20px; height:20px; flex:0 0 auto; }

.punch__card::after{
  content:''; position:absolute; left:50%; bottom:-1px; width:34px; height:17px;
  transform:translateX(-50%);
  background: var(--baize-dark); border-radius:17px 17px 0 0;
  box-shadow: inset 0 3px 4px rgba(0,0,0,.45);
}

.quiz{
  display:grid; gap:1.2rem;
  grid-template-columns: minmax(0,1fr) 128px;
  align-items:start;
}
.quiz__card{ background: var(--paper); box-shadow: var(--shadow-lift); }
.quiz__svg{ display:block; width:100%; height:auto; background: var(--baize); }
.quiz__body{ padding: clamp(1rem,2.2vw,1.5rem); }
.quiz__q{ margin:0 0 1rem; font-size:1.08rem; line-height:1.45; max-width:54ch; }
.quiz__btns{ display:flex; flex-wrap:wrap; gap:.7rem; }
.quiz__after{ margin-top:.2rem; }
.quiz__mark{
  font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800; font-size:1.45rem; line-height:1.1; letter-spacing:-.012em; margin:0 0 .5rem;
}
.quiz__mark[data-ok="1"]{ color: var(--green-ink); }
.quiz__mark[data-ok="0"]{ color: var(--red-ink); }
.quiz__exp{ margin:0 0 1rem; font-size:.98rem; line-height:1.5; color: var(--ink-soft); max-width:56ch; }

.quiz__score{ background: var(--card); padding:1rem .8rem; box-shadow: var(--shadow-flat); text-align:center; }
.quiz__scoreh{
  font-family:'Cuprum',sans-serif; font-weight:700; font-size: .68rem;
  text-transform:uppercase; letter-spacing:.12em; color: var(--ink-soft); margin:0 0 .7rem;
}
.quiz__holes{ width:44px; height:220px; display:block; margin:0 auto; }
.quiz__count{
  font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800; font-size:1.3rem; margin:.7rem 0 0; letter-spacing:-.012em;
  font-variant-numeric: tabular-nums;
}

.licence{
  position:relative; overflow:hidden;
  margin-top:1.4rem; background: var(--yellow); color: var(--ink);
  padding:1.2rem 1.4rem; box-shadow: var(--shadow-lift);
  display:grid; gap:.35rem; justify-items:start;
  max-width:34rem;
}
.licence__h{
  position:absolute; right:-.6rem; bottom:.9rem;
  font-family:'Cuprum',sans-serif; font-weight:700; font-size: .68rem;
  text-transform:uppercase; letter-spacing:.14em; margin:0;
  color: var(--paper); background: var(--ink);
  padding:.4em 1.1em; transform: rotate(-4deg);
}
.licence__name{ font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800; font-size: 1.75rem; line-height:1.1; letter-spacing:-.012em; margin:0; }
.licence__score{ margin:0 0 .5rem; font-size:.98rem; }

.boxes{
  display:grid; gap: clamp(.9rem,2vw,1.4rem);
  grid-template-columns: repeat(auto-fit, minmax(248px,1fr));
}
.minibox{
  background: var(--card); color: var(--ink);
  padding:1.1rem 1.15rem 1.25rem;
  box-shadow: var(--shadow-lift);
  display:grid; gap:.7rem; align-content:start;
  border-top:12px solid var(--ink);
}
.minibox--hockey{ border-top-color: var(--blue); }
.minibox--rugby{ border-top-color: var(--baize); }
.minibox--netball{ border-top-color: var(--red); }
.minibox--ultimate{ border-top-color: var(--yellow); }
.minibox__t{
  font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800; font-size: 1.45rem; line-height:1.1; letter-spacing:-.012em; margin:0;
}
.minibox__svg{ display:block; width:100%; height:auto; background: var(--paper); }
.minibox__p{ margin:0; font-size:.98rem; line-height:1.48; }
.minibox__p b{ font-weight:700; background: var(--yellow); padding:0 .15em; }
.minibox__j{ margin:0; font-size:.88rem; line-height:1.4; font-style:italic; color: var(--ink-soft); }

.colophon{ padding-block: clamp(2.6rem,5vw,4rem); }
.colophon__rule{
  margin:0 0 1rem; font-family:'Cuprum',sans-serif; font-weight:700;
  font-size: .78rem; text-transform:uppercase; letter-spacing:.08em; color: var(--ink-soft);
}
.colophon__joke{ margin:0 0 1rem; font-size: 1.08rem; line-height:1.5; max-width:58ch; }
.colophon__meta{ margin:0; font-size:.88rem; color: var(--ink-soft); }

@media (max-width: 900px){
  .scrub{ grid-template-columns:1fr; grid-template-areas:"pitch" "rail" "panel"; }
  .quiz{ grid-template-columns:1fr; }
  .quiz__score{ display:flex; align-items:center; justify-content:space-between; gap:1rem; text-align:left; }
  .quiz__holes{ width:200px; height:44px; margin:0; }
  .quiz__count{ margin:0; }
}

@media (max-width: 760px){
  .sec--baize{ padding-top: 2.3rem; }
  .stage{ grid-template-rows:auto minmax(220px,1fr) auto auto; }
  .stage__h{ line-height:1.04; }
  .controls__hint{ font-size: .78rem; }
  .live{ font-size: .78rem; }
  .verdict{
    grid-area:3 / 1; justify-self:stretch; width:auto; transform:none;
    display:grid; grid-template-columns:auto 1fr; gap:.15rem .8rem; align-items:center;
    padding:calc(.75rem + 8px) .85rem .8rem;
  }
  .verdict__stamp{ grid-row:1 / span 2; width:38px; height:38px; margin:0; }
  .verdict__word{ font-size: 1.45rem; margin:0; }
  .verdict__why{ font-size: .88rem; }
  .stage__foot{ grid-area:4 / 1; }
  .stage__head{ display:block; }
  .stage__lead{ margin-top:.45rem; font-size:.92em; }
  .plan__h{ font-size: .68rem; }

}

@media (max-width: 460px){
  .btn{ font-size: .98rem; }
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
}

.tabs{
  position: sticky; top: 0; z-index: 40; overflow:hidden;
  background: var(--card-2);
  box-shadow: 0 6px 16px -8px rgba(0,0,0,.6), inset 0 -3px 0 rgba(0,0,0,.22);
}
.tabs__list{
  width:min(1180px, 96vw); margin-inline:auto;
  list-style:none; margin-block:0; padding:0;
  display:flex; gap:2px;
  overflow-x:auto; overscroll-behavior-x:contain;
  scrollbar-width:none;
}
.tabs__list::-webkit-scrollbar{ display:none; }
.tabs__list a{
  display:block; white-space:nowrap;
  padding:.72em 1.05em .78em;
  font-family:'Cuprum',sans-serif; font-weight:700; font-size: .78rem;
  text-transform:uppercase; letter-spacing:.08em;
  color: var(--ink-soft); text-decoration:none;
  background: var(--card);
  transition: background-color .16s var(--ease), color .16s var(--ease);
}
.tabs__list a:hover{ background: var(--paper); color: var(--ink); }
.tabs__list a[aria-current="true"]{
  background: var(--baize); color: var(--paper);
}
.tabs__list li:first-child a{ padding-left:1.3em; }
.tabs__list{ padding-right:0; }
.tabs.is-scrollable .tabs__list{ padding-right:44px; }
.tabs__more{
  position:absolute; right:0; top:0; bottom:0; width:42px;
  display:none; align-items:center; justify-content:center;
  background: var(--card-2); box-shadow: -6px 0 0 var(--card-2), -8px 0 10px -6px rgba(0,0,0,.5);
  color: var(--ink-soft); pointer-events:none;
}
.tabs.is-scrollable .tabs__more{ display:flex; }
.tabs.is-end .tabs__more{ display:none; }
.tabs__more svg{ width:20px; height:20px; }

.sec{ scroll-margin-top: 46px; }

@media (max-width: 560px){
  .tabs__list a{ font-size: .78rem; padding:.66em .8em .72em; }
}

.sec--paper::after,
.sec--card::after{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:1;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Ccircle cx='1.5' cy='1.5' r='1.15' fill='%23000'/%3E%3C/svg%3E");
  background-size:6px 6px;
  opacity:.055;
  mix-blend-mode:multiply;
}

@media (max-width: 620px){
  .controls .btn{ font-size: .88rem; padding:.72em 1em; }
  .controls__hint{ flex-basis:100%; }
  .sec--baize{ box-shadow: inset 0 0 0 8px var(--card-2), inset 0 0 0 10px rgba(0,0,0,.34); }
  .live{
    position:absolute; width:1px; height:1px; margin:-1px;
    overflow:hidden; clip-path:inset(50%); white-space:nowrap;
  }
  .controls__hint{ font-size:.78rem; line-height:1.4; }
}

.boxfoot{
  position:relative;
  margin-top: clamp(2rem,4vw,3rem);
  width:min(38rem, 100%); margin-inline:auto;
  padding: 1.4rem 1.5rem 1.2rem;
  background: var(--card);
  box-shadow: inset 0 0 0 2px var(--card-edge), inset 0 0 0 7px var(--card),
              inset 0 0 0 9px var(--red);
  display:grid; justify-items:center; gap:.75rem;
  overflow:hidden;
}
.boxfoot__series{
  position:absolute; bottom:1rem; right:-2.6rem;
  transform: rotate(-5deg);
  background: var(--ink); color: var(--paper);
  font-family:'Cuprum',sans-serif; font-weight:700; font-size:.68rem;
  text-transform:uppercase; letter-spacing:.06em;
  padding:.45em 4.2em .45em 1.3em; margin:0;
}
.boxfoot__badges{
  list-style:none; margin:0; padding:0;
  display:flex; flex-wrap:wrap; justify-content:center; gap:.4rem;
}
.boxfoot__badges li{
  font-family:'Cuprum',sans-serif; font-weight:700; font-size:.68rem;
  text-transform:uppercase; letter-spacing:.05em;
  padding:.42em .8em; background: var(--ink); color: var(--card);
}
.boxfoot__badges li:nth-child(2){ background: var(--red); color: var(--paper); }
.boxfoot__line{
  margin:0; font-family:'Cuprum',sans-serif; font-weight:700;
  font-size:.68rem; text-transform:uppercase; letter-spacing:.09em; color: var(--ink-soft);
}
.boxfoot__barcode{ width:120px; height:34px; }

@media (max-width: 560px){
  .boxfoot__series{ right:-2.6rem; font-size:.68rem; }
}

.colophon__legal{ margin:1.6rem 0 0; text-align:center; font-size:.88rem; color: var(--ink-soft); }
.colophon__legal a, .colophon__btn{ color: var(--ink); text-decoration:underline; text-underline-offset:.18em; }
.colophon__btn{ background:none; border:0; padding:0; font:inherit; cursor:pointer; }

body{ padding-bottom: var(--consent-h, 0px); }
.consent{
  position:fixed; left:0; right:0; bottom:0; z-index:80;
  background: var(--card); color: var(--ink);
  border-top:2px dashed var(--card-edge);
  box-shadow: 0 -14px 30px -12px rgba(0,0,0,.55);
  padding: .85rem max(1rem, calc((100% - 1180px) / 2)) calc(.85rem + env(safe-area-inset-bottom, 0px));
  display:flex; flex-wrap:wrap; align-items:center; gap:.7rem 1.6rem;
  transform: translateY(100%); transition: transform .45s var(--ease);
}
.consent.is-in{ transform:none; }
.consent__text{ margin:0; flex:1 1 30rem; max-width:72ch; font-size:.88rem; line-height:1.45; }
.consent__link{ color: var(--red-ink); text-underline-offset:.18em; }
.consent__acts{ display:flex; gap:.6rem; flex:0 0 auto; }
.consent__btn{ min-width:8.5em; min-height:44px; background: var(--paper); color: var(--ink); box-shadow: inset 0 0 0 2px var(--ink), var(--shadow-flat); }
.consent__btn:hover{ box-shadow: inset 0 0 0 2px var(--ink), 0 12px 22px -8px rgba(0,0,0,.55); }
@media (max-width: 560px){
  .consent{ gap:.6rem; }
  .consent__text{ flex-basis:100%; font-size:.78rem; }
  .consent__acts{ width:100%; }
  .consent__btn{ flex:1 1 0; min-width:0; }
}

.tabs__list a[aria-current="page"]{ background: var(--baize); color: var(--paper); }
@media (max-width: 720px){ .tabs--doc .tabs__sec{ display:none; } }
.doc{ padding-top: clamp(2.4rem,5vw,4rem); }
.doc__h{
  font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800;
  font-size: clamp(2rem, 1.25rem + 3.3vw, 3.7rem); line-height:1.02; letter-spacing:-.012em;
  color: var(--ink); margin:0 0 .5rem; text-wrap:balance;
}
.doc__ed{
  margin:0 0 1.6rem; font-family:'Cuprum',sans-serif; font-weight:700; font-size:.78rem;
  text-transform:uppercase; letter-spacing:.08em; color: var(--ink-soft);
}
.doc__lead{ max-width:62ch; margin:0 0 1rem; font-size:1.08em; }
.doc__part{ max-width:66ch; margin-top:1.6rem; padding-top:1.5rem; border-top:2px dashed var(--card-edge); }
.doc__part h2{
  font-family:'Podkova', ui-serif, Georgia, serif; font-weight:700;
  font-size:1.45rem; line-height:1.15; margin:0 0 .6rem;
}
.doc__n{ color: var(--red-ink); margin-right:.3em; }
.doc__part p, .doc__part ul{ margin:0 0 .8rem; }
.doc__part ul{ padding-left:1.2rem; }
.doc__part li{ margin:.2rem 0; }
.doc a{ color: var(--red-ink); text-underline-offset:.18em; }

.nf{ justify-content:center; align-items:center; text-align:center; }
.nf__box{ position:relative; z-index:2; width:min(34rem, 91vw); display:grid; justify-items:center; gap:.9rem; }
.nf__flag{ width:64px; height:64px; color: var(--yellow); }
.nf__code{
  margin:0; font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800;
  font-size: clamp(5rem, 3rem + 12vw, 10rem); line-height:.9; letter-spacing:-.03em; color: var(--yellow);
}
.nf__h{
  font-family:'Podkova', ui-serif, Georgia, serif; font-weight:800;
  font-size: clamp(1.6rem, .95rem + 2.5vw, 2.9rem); line-height:1.08; color: var(--paper);
}
.nf__p{ margin:0; max-width:42ch; color: var(--on-baize-2); }
.nf__btn{ display:inline-block; margin-top:.4rem; text-decoration:none; }