/* =========================================================
   WYNPLAY — VISUAL IDENTITY 2026 / RED EDITION
   Complete UI system rewrite
   Direction: editorial discovery + Wynplay red / black / white
   ========================================================= */

:root{
  color-scheme:light;
  --canvas:#fffafa;
  --canvas-2:#fff1f2;
  --paper:#ffffff;
  --paper-2:#fff7f7;
  --ink:#171111;
  --ink-soft:#2d2525;
  --muted:#5c4a4a;
  --muted-2:#7a6666;
  --line:#f3d6d6;
  --line-strong:#e9bcbc;
  --brand:#b91c1c;
  --brand-dark:#991b1b;
  --brand-soft:#fff1f2;
  --signal:#ef4444;
  --signal-soft:#fee2e2;
  --aqua:#dc2626;
  --aqua-soft:#fee2e2;
  --coral:#ef4444;
  --coral-soft:#fff1f2;
  --warn:#c81e2b;
  --warn-soft:#fff1f2;
  --danger:#7f1d1d;
  --danger-soft:#fee2e2;
  --success:#b91c1c;
  --success-soft:#fff1f2;
  --focus:rgba(185,28,28,.24);
  --shadow-xs:0 1px 2px rgba(23,17,17,.06);
  --shadow-sm:0 8px 24px rgba(65,18,18,.08);
  --shadow-md:0 18px 50px rgba(65,18,18,.12);
  --shadow-hard:5px 5px 0 rgba(23,17,17,.95);
  --radius-xs:10px;
  --radius-sm:14px;
  --radius:20px;
  --radius-lg:28px;
  --radius-xl:38px;
  --max:1180px;
  --reading:760px;
  --pad:clamp(18px,4vw,42px);
  --display:"Arial Rounded MT Bold","Avenir Next",Avenir,"Segoe UI",system-ui,sans-serif;
  --sans:Inter,"Avenir Next","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;text-size-adjust:100%;-webkit-text-size-adjust:100%;background:var(--canvas)}
body{margin:0;min-width:320px;background:var(--canvas);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.65;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(circle at 5% 0%,rgba(185,28,28,.10),transparent 28rem),radial-gradient(circle at 95% 12%,rgba(239,68,68,.08),transparent 24rem),linear-gradient(180deg,#ffffff 0%,var(--canvas) 44rem)}
body:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.18;background-image:linear-gradient(rgba(23,17,17,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(23,17,17,.035) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,black,transparent 44rem)}
body.menu-open{overflow:hidden}
img,svg{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit}
a{color:inherit;text-decoration-color:rgba(185,28,28,.40);text-decoration-thickness:.08em;text-underline-offset:.2em;transition:color .18s var(--ease),background-color .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease)}
a:hover{text-decoration-color:currentColor}
p{margin:0;color:var(--muted)}
p+p{margin-top:.8rem}
strong{color:var(--ink);font-weight:800}
h1,h2,h3{margin:0;color:var(--ink);font-family:var(--display);font-weight:800;letter-spacing:-.045em;text-wrap:balance}
h1{font-size:clamp(2.55rem,7vw,5.75rem);line-height:.96;max-width:980px}
h2{font-size:clamp(1.65rem,4vw,2.9rem);line-height:1.03;max-width:900px}
h3{font-size:clamp(1.16rem,2.2vw,1.52rem);line-height:1.16;letter-spacing:-.03em}
ul,ol{color:var(--muted)}
::selection{background:var(--brand);color:#fff}

.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:-100px;z-index:1000;padding:11px 16px;background:var(--ink);color:#fff;border-radius:999px;font-weight:800;text-decoration:none;box-shadow:var(--shadow-md);transition:top .2s var(--ease)}
.skip-link:focus{top:16px}
.record.is-filter-hidden,.record[hidden],.empty-state[hidden],.directory-card[hidden]{display:none!important}

/* ---------------- Header / navigation ---------------- */
.site-head{position:sticky;top:0;z-index:90;background:rgba(255,250,250,.94);border-bottom:1px solid rgba(233,188,188,.72);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);transition:box-shadow .2s var(--ease),background .2s var(--ease)}
.site-head.is-scrolled{box-shadow:0 8px 30px rgba(65,18,18,.08);background:rgba(255,255,255,.97)}
.head-inner{width:min(100%,calc(var(--max) + (var(--pad) * 2)));min-height:74px;margin:0 auto;padding:12px var(--pad);display:flex;align-items:center;justify-content:space-between;gap:18px;position:relative}
.wordmark{display:inline-flex;align-items:center;gap:11px;color:var(--ink);font-family:var(--display);font-size:1.14rem;font-weight:900;letter-spacing:-.04em;text-decoration:none;white-space:nowrap}
.wordmark img{width:40px;height:40px;border-radius:12px;box-shadow:var(--shadow-xs)}
.wordmark span{line-height:1}
.menu-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:0 15px;border:1px solid var(--ink);border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer;font-weight:800;box-shadow:2px 2px 0 var(--ink)}
.menu-button:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.menu-button .menu-lines{display:grid;gap:4px;width:18px}.menu-button .menu-lines span{display:block;height:2px;border-radius:999px;background:currentColor;transition:transform .2s var(--ease),opacity .2s var(--ease)}
.menu-button[aria-expanded="true"]{background:var(--ink);color:#fff;box-shadow:none;transform:none}
.menu-button[aria-expanded="true"] .menu-lines span:first-child{transform:translateY(3px) rotate(45deg)}
.menu-button[aria-expanded="true"] .menu-lines span:last-child{transform:translateY(-3px) rotate(-45deg)}
.primary-nav{position:absolute;left:var(--pad);right:var(--pad);top:68px;display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:10px;background:var(--paper);border:1px solid var(--ink);border-radius:22px;box-shadow:var(--shadow-hard);max-height:calc(100dvh - 94px);overflow:auto}
.primary-nav.is-open{display:grid}
.primary-nav a{display:flex;align-items:center;min-height:47px;padding:10px 13px;border:1px solid transparent;border-radius:13px;color:var(--ink-soft);font-size:.96rem;font-weight:760;text-decoration:none}
.primary-nav a:hover,.primary-nav a:focus-visible{background:var(--brand-soft);border-color:#fecaca;color:var(--brand-dark)}
.primary-nav a[aria-current="page"]{background:var(--ink);color:#fff}
.primary-nav .lang-link{justify-content:center;background:var(--brand);border-color:var(--brand-dark);color:#fff;font-weight:900}
.menu-scrim{position:fixed;inset:74px 0 0;z-index:79;border:0;background:rgba(23,17,17,.42);backdrop-filter:blur(3px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s var(--ease),visibility .2s var(--ease)}
body.menu-open .menu-scrim{opacity:1;visibility:visible;pointer-events:auto}

/* ---------------- Global layout ---------------- */
main{width:min(100%,calc(var(--max) + (var(--pad) * 2)));margin:0 auto;padding:0 var(--pad) clamp(70px,9vw,120px)}
.hero,.page-hero{position:relative;padding:clamp(42px,8vw,92px) 0 clamp(38px,6vw,66px);border-bottom:1px solid var(--line)}
.hero.has-page-icon,.page-hero.has-page-icon{padding-right:clamp(0px,20vw,250px)}
.page-hero.compact{padding-top:clamp(38px,6vw,70px);padding-bottom:clamp(30px,5vw,52px)}
.page-icon{position:absolute;right:0;top:50%;display:grid;place-items:center;width:clamp(116px,15vw,184px);aspect-ratio:1;transform:translateY(-44%) rotate(3deg);border:2px solid var(--ink);border-radius:34% 66% 57% 43% / 44% 41% 59% 56%;background:linear-gradient(145deg,#fff1f2,#fecaca);font-size:clamp(3.4rem,7vw,6rem);box-shadow:10px 12px 0 rgba(185,28,28,.18);overflow:hidden}
.page-icon:after{content:"";position:absolute;inset:auto -20% -25% 30%;height:55%;border-radius:50%;background:rgba(185,28,28,.14);filter:blur(2px)}
.hero-lede,.page-hero>p:not(.micro){max-width:760px;margin-top:20px;color:var(--ink-soft);font-size:clamp(1.06rem,2vw,1.28rem);line-height:1.62}
.micro,.language-eyebrow{display:inline-flex;align-items:center;gap:8px;margin:0 0 13px;color:var(--brand-dark);font-size:.76rem;line-height:1;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.micro:before,.language-eyebrow:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)}
.crumbs{margin:0 0 24px;font-size:.87rem;color:var(--muted)}
.crumbs ol{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.crumbs li{display:flex;align-items:center;gap:8px}.crumbs li+li:before{content:"/";color:var(--line-strong);font-weight:700}
.crumbs a{color:var(--muted);font-weight:700;text-decoration:none}.crumbs a:hover{color:var(--brand-dark)}
.home-crumbs{margin-bottom:18px}
.hero-side{display:none!important}
.plain-actions{display:flex;flex-wrap:wrap;align-items:center;gap:11px;margin-top:28px}
.plain-actions a,.source-button,.text-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 17px;border:1px solid var(--ink);border-radius:999px;background:var(--paper);color:var(--ink);font-weight:850;text-decoration:none;cursor:pointer;box-shadow:2px 2px 0 var(--ink)}
.plain-actions a:first-child,.source-button{background:var(--brand);color:#fff;border-color:var(--ink)}
.plain-actions a:hover,.source-button:hover,.text-button:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.quick-index{display:flex;gap:9px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;margin:0 calc(-1 * var(--pad));padding:20px var(--pad)}
.quick-index::-webkit-scrollbar{display:none}.quick-index a{flex:0 0 auto;display:inline-flex;align-items:center;min-height:40px;padding:8px 13px;border:1px solid var(--line-strong);border-radius:999px;background:rgba(255,255,255,.72);color:var(--ink-soft);font-size:.9rem;font-weight:750;text-decoration:none;scroll-snap-align:start}.quick-index a:hover{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-dark)}

/* ---------------- Summary / filter ---------------- */
.quality-summary{position:relative;margin:clamp(34px,5vw,58px) 0;padding:clamp(24px,4vw,38px);border:1px solid var(--ink);border-radius:var(--radius-lg);background:linear-gradient(135deg,#171111 0%,#231717 100%);color:#fff;overflow:hidden;box-shadow:8px 8px 0 var(--brand)}
.quality-summary:after{content:"";position:absolute;width:210px;height:210px;right:-70px;top:-110px;border-radius:50%;background:linear-gradient(135deg,#ef4444,#7f1d1d);opacity:.72;filter:blur(2px)}
.quality-summary .micro{position:relative;z-index:1;color:#fca5a5}.quality-summary .micro:before{background:var(--signal);box-shadow:0 0 0 4px rgba(239,68,68,.18)}
.quality-summary h2{position:relative;z-index:1;color:#fff;font-size:clamp(1.45rem,3vw,2.35rem);max-width:640px}
.quality-summary>p:last-child{position:relative;z-index:1;max-width:850px;margin-top:14px;color:#e7dada;line-height:1.68}
.section-title{display:grid;gap:10px;padding:clamp(44px,7vw,76px) 0 20px}.section-title h2{max-width:780px}.section-title p:last-child{max-width:740px}.section-title:after{content:"";display:block;width:74px;height:5px;margin-top:9px;border-radius:999px;background:#ef4444;box-shadow:78px 0 0 #991b1b}
.count-line{font-size:1rem}.count-line strong{display:inline-block;margin-right:6px;color:var(--brand);font-family:var(--display);font-size:clamp(1.7rem,4vw,2.5rem);font-weight:900}
.filter-zone{display:grid;grid-template-columns:minmax(0,.78fr) minmax(320px,1.22fr);gap:clamp(22px,4vw,48px);align-items:end;margin:clamp(34px,5vw,58px) 0;padding:clamp(22px,4vw,38px);border:1px solid #efcaca;border-radius:var(--radius-lg);background:linear-gradient(135deg,#fff1f2 0%,#fff7f7 62%,#ffffff 100%);box-shadow:var(--shadow-sm)}
.filter-intro h2{font-size:clamp(1.5rem,3.2vw,2.45rem)}.filter-intro>p:last-child{max-width:34rem;margin-top:11px}.filter-controls{display:grid;gap:14px}.filter-controls--search-only{align-self:center}
.search-line,.select-grid label{display:grid;gap:8px}.search-line span,.select-grid span{color:var(--ink-soft);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;font-weight:900}
input,select,textarea{width:100%;min-height:54px;border:1px solid var(--line-strong);border-radius:15px;background:var(--paper);color:var(--ink);padding:0 15px;font-size:16px;box-shadow:var(--shadow-xs);transition:border-color .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease)}
textarea{min-height:130px;padding:14px 15px;resize:vertical}input::placeholder,textarea::placeholder{color:#9a8585}
input:hover,select:hover,textarea:hover{border-color:var(--brand)}
input:focus,select:focus,textarea:focus,a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-color:var(--brand)}
.filter-details{border:0}.filter-details summary{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:7px 0;border-bottom:1px solid var(--line-strong);cursor:pointer;list-style:none;color:var(--ink);font-weight:850}.filter-details summary::-webkit-details-marker{display:none}.filter-details summary:after{content:"+";display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--ink);border-radius:50%;background:var(--signal);color:var(--ink);font-size:1.1rem}.filter-details[open] summary:after{content:"−"}.select-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding-top:14px}

/* ---------------- Promotion cards ---------------- */
.ledger{display:grid;gap:20px;margin:18px 0 clamp(44px,7vw,78px)}
.record{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:stretch;padding:0;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--paper);box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease)}
.record:hover{transform:translateY(-2px);border-color:#dbaaaa;box-shadow:0 16px 36px rgba(65,18,18,.12)}
.record:before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:#b91c1c}
.record.soon:before{background:#ef4444}.record.upcoming:before{background:#7f1d1d}.record.expired:before{background:var(--line-strong)}
.record-body{min-width:0;padding:clamp(21px,3vw,30px) clamp(20px,3vw,32px) clamp(20px,3vw,28px) clamp(25px,3vw,36px)}
.record-body h3{max-width:840px}.record-body h3 a{text-decoration:none}.record-body h3 a:hover{color:var(--brand-dark)}
.record-body>p:not(.record-meta):not(.record-source-links){max-width:860px;margin-top:13px;color:var(--muted);line-height:1.62}
.record-status-row{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin:0 0 13px}
.record-status-pill{display:inline-flex;align-items:center;gap:7px;min-height:29px;padding:5px 10px;border-radius:999px;background:#fff1f2;color:#b91c1c;font-size:.75rem;line-height:1;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.record-status-pill:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.record.soon .record-status-pill{background:#fee2e2;color:#dc2626}.record.upcoming .record-status-pill{background:#f7e7e7;color:#7f1d1d}
.record-deadline{font-size:.82rem;color:var(--muted);font-weight:750}
.record-meta{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0 0!important}
.record-fact{display:inline-flex;align-items:center;min-height:29px;padding:5px 9px;border:1px solid var(--line);border-radius:9px;background:#fffafa;color:#5c4a4a;font-size:.78rem;line-height:1.2;font-weight:720}
.record-briefs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:20px}
.record-toggle{border:1px solid var(--line);border-radius:13px;background:#fffdfd;overflow:hidden}
.record-toggle summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;padding:10px 13px;cursor:pointer;list-style:none;color:var(--ink-soft);font-size:.88rem;font-weight:820;transition:background .18s var(--ease),color .18s var(--ease)}
.record-toggle summary::-webkit-details-marker{display:none}.record-toggle summary:after{content:"+";flex:0 0 auto;display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:var(--brand-soft);color:var(--brand-dark);font-size:1rem;font-weight:900}.record-toggle[open] summary{background:var(--brand-soft);color:var(--brand-dark)}.record-toggle[open] summary:after{content:"−";background:var(--brand);color:#fff}
.record-toggle__content{padding:0 13px 13px}.record-toggle__content p,.record-toggle__content ul,.record-toggle__content ol{margin:11px 0 0;font-size:.9rem;line-height:1.58}.record-toggle__content ul,.record-toggle__content ol{padding-left:1.15rem}.record-toggle__content li+li{margin-top:6px}
.record-source-links{margin-top:17px!important;color:var(--muted-2);font-size:.83rem}.record-source-links a{color:var(--brand-dark);font-weight:800}
.record-link{align-self:stretch;display:flex;align-items:center;justify-content:center;width:188px;padding:20px 22px;background:var(--ink);color:#fff;font-size:.9rem;line-height:1.35;font-weight:850;text-align:center;text-decoration:none;transition:background .2s var(--ease),color .2s var(--ease)}
.record-link:hover{background:var(--brand);color:#fff}.record.soon .record-link:hover{background:#dc2626}.record.upcoming .record-link:hover{background:var(--brand-dark)}
.empty-state:not([hidden]){display:block!important;margin:24px 0;padding:22px;border:1px dashed var(--line-strong);border-radius:var(--radius);background:rgba(255,255,255,.68);color:var(--muted);text-align:center;font-weight:700}

/* ---------------- Directories / hubs ---------------- */
.directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:22px 0 clamp(48px,8vw,88px)}
.directory-card{position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-areas:"icon title" "icon desc";align-items:start;gap:5px 14px;min-height:150px;padding:21px;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--paper);text-decoration:none;box-shadow:var(--shadow-xs);overflow:hidden}
.directory-card:after{content:"↗";position:absolute;right:14px;top:12px;color:var(--brand);font-size:1.05rem;font-weight:900;opacity:0;transform:translate(-3px,3px);transition:opacity .2s var(--ease),transform .2s var(--ease)}
.directory-card:hover{transform:translateY(-3px);border-color:var(--ink);box-shadow:5px 5px 0 var(--brand)}.directory-card:hover:after{opacity:1;transform:none}
.directory-icon{grid-area:icon;display:grid;place-items:center;width:47px;height:47px;border:1px solid #b91c1c;border-radius:14px;background:#fff1f2;font-size:1.45rem;line-height:1}
.directory-title{grid-area:title;align-self:center;padding-right:24px;color:var(--ink);font-family:var(--display);font-size:1.02rem;font-weight:850;letter-spacing:-.02em}
.directory-desc{grid-area:desc;color:var(--muted);font-size:.88rem;line-height:1.5}
.split-note{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:32px;align-items:center;margin:clamp(36px,6vw,68px) 0;padding:clamp(24px,4vw,36px);border:1px solid #efcaca;border-radius:var(--radius-lg);background:var(--brand-soft)}
.split-note h2{font-size:clamp(1.45rem,3vw,2.2rem)}.split-note>div:last-child p{font-size:1.03rem;color:var(--ink-soft)}
.guide-section,.text-flow{max-width:900px;margin:clamp(42px,7vw,76px) 0}.guide-section h2,.text-flow h2{font-size:clamp(1.45rem,3vw,2.3rem);margin-bottom:14px}.guide-section p,.text-flow p{max-width:var(--reading);font-size:1rem;line-height:1.72}.guide-section ul,.guide-section ol,.text-flow ul,.text-flow ol{max-width:var(--reading);margin:17px 0 0;padding-left:1.25rem;line-height:1.68}.guide-section li+li,.text-flow li+li{margin-top:8px}.text-flow h2:not(:first-child){margin-top:42px}
.note-checklist,.entry-checklist{list-style:none!important;padding:0!important;display:grid;gap:10px}.note-checklist li,.entry-checklist li{position:relative;padding:13px 14px 13px 42px;border:1px solid var(--line);border-radius:13px;background:var(--paper)}.note-checklist li:before,.entry-checklist li:before{content:"✓";position:absolute;left:13px;top:13px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:.72rem;font-weight:900}
.related-links,.content-hub-links{max-width:none}.related-links ul,.latest-link-list{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:900px}.related-links li,.latest-link-list li{margin:0!important}.related-links a,.latest-link-list a{display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:11px 14px;border:1px solid var(--line);border-radius:13px;background:var(--paper);color:var(--ink);font-weight:800;text-decoration:none}.related-links a:after,.latest-link-list a:after{content:"→";color:var(--brand)}.related-links a:hover,.latest-link-list a:hover{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-dark)}
.approved-combined-hubs .related-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;list-style:none;margin:10px 0 0;padding:0}.approved-combined-hubs .related-links li{padding:14px;border:1px solid var(--line);border-radius:13px;background:var(--paper)}.approved-combined-hubs .related-links a{display:inline;padding:0;border:0;background:none}.approved-combined-hubs .related-links a:after{display:none}.approved-combined-hubs .related-links span{color:var(--muted);font-size:.9rem}

/* ---------------- FAQ ---------------- */
.faq-list,.faq-block{max-width:900px;margin:clamp(42px,7vw,76px) 0}.faq-list h2,.faq-block h2{margin-bottom:18px}.faq-list details,.faq-block details{border-top:1px solid var(--line)}.faq-list details:last-child,.faq-block details:last-child{border-bottom:1px solid var(--line)}.faq-list summary,.faq-block summary{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:17px 2px;cursor:pointer;list-style:none;color:var(--ink);font-weight:850}.faq-list summary::-webkit-details-marker,.faq-block summary::-webkit-details-marker{display:none}.faq-list summary:after,.faq-block summary:after{content:"+";display:grid;place-items:center;flex:0 0 auto;width:29px;height:29px;border-radius:50%;background:var(--brand-soft);color:var(--brand-dark);font-size:1.1rem}.faq-list details[open] summary:after,.faq-block details[open] summary:after{content:"−";background:var(--ink);color:#fff}.faq-list details p,.faq-block details p{max-width:760px;padding:0 44px 18px 2px;line-height:1.68}

/* ---------------- Pagination ---------------- */
.promo-pagination,.pagination{margin:clamp(36px,6vw,70px) 0;display:grid;gap:14px;justify-items:center}.promo-pagination__status{font-size:.9rem;font-weight:750;color:var(--muted)}.promo-pagination__controls{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:7px;max-width:100%}.promo-pagination__button,.pagination a,.pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;padding:8px 10px;border:1px solid var(--line-strong);border-radius:11px;background:var(--paper);color:var(--ink-soft);font-size:.88rem;font-weight:800;text-decoration:none}.promo-pagination__button:hover,.pagination a:hover{border-color:var(--brand);background:var(--brand-soft);color:var(--brand-dark)}.promo-pagination__button.is-current,.pagination .current{background:var(--ink);border-color:var(--ink);color:#fff}.promo-pagination__button.is-direction{min-width:94px;padding-inline:14px}.promo-pagination__button[aria-disabled="true"]{opacity:.42;cursor:not-allowed}.promo-pagination__gap{color:var(--muted-2);padding:8px 3px}

/* ---------------- Ads / utility ---------------- */
.ad-placement{display:flex;align-items:center;justify-content:center;min-height:110px;margin:clamp(28px,5vw,54px) 0;padding:12px;border:1px dashed #e3bebe;border-radius:var(--radius);background:rgba(255,255,255,.54);overflow:hidden}.ad-placement--mobile{min-height:280px}.ad-placement .adsbygoogle{max-width:100%}
.back-to-top{position:fixed;right:clamp(16px,3vw,28px);bottom:clamp(16px,3vw,28px);z-index:70;display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--brand-dark);border-radius:50%;background:var(--brand);color:#fff;font-size:1.25rem;font-weight:900;cursor:pointer;box-shadow:3px 3px 0 var(--ink);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .2s var(--ease),visibility .2s var(--ease),transform .2s var(--ease)}.back-to-top.is-visible{opacity:1;visibility:visible;transform:none}.back-to-top:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ink)}

/* ---------------- Footer ---------------- */
.site-foot{margin-top:0;padding:clamp(52px,8vw,88px) var(--pad) 28px;background:var(--ink);color:#fff;border-top:8px solid var(--brand)}
.foot-inner{width:min(100%,var(--max));margin:0 auto;display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr);gap:clamp(38px,7vw,90px)}
.foot-brand{color:#fff}.foot-brand img{box-shadow:none}.foot-inner>div>p{max-width:390px;margin-top:15px;color:#cbb7b7;line-height:1.62}.foot-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 18px;align-content:start}.foot-links a{min-height:32px;color:#eadede;font-size:.9rem;font-weight:700;text-decoration:none}.foot-links a:hover{color:var(--signal)}
.legal-line{width:min(100%,var(--max));margin:44px auto 0;padding-top:20px;border-top:1px solid #4d2a2a;color:#a88c8c;font-size:.78rem;line-height:1.5}

/* ---------------- Language landing ---------------- */
body.language-landing{min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto;background:var(--ink);color:#fff}
body.language-landing:before{background:radial-gradient(circle at 10% 10%,rgba(185,28,28,.42),transparent 32rem),radial-gradient(circle at 90% 25%,rgba(239,68,68,.14),transparent 28rem),var(--ink)}
body.language-landing:after{opacity:.08;background-image:linear-gradient(rgba(255,255,255,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.3) 1px,transparent 1px);mask-image:none}
.language-header{border-bottom:1px solid #4d2a2a}.language-header__inner{width:min(100%,calc(var(--max) + (var(--pad) * 2)));min-height:78px;margin:0 auto;padding:14px var(--pad);display:flex;align-items:center;justify-content:space-between;gap:16px}.language-wordmark{color:#fff}.language-wordmark img{width:42px;height:42px}.language-header__hint{display:inline-flex;padding:7px 11px;border:1px solid #6b4444;border-radius:999px;color:#d8caca;font-size:.76rem;font-weight:900;letter-spacing:.11em}
.language-main{width:min(100%,calc(1040px + (var(--pad) * 2)));margin:0 auto;padding:clamp(36px,6vw,68px) var(--pad) clamp(50px,8vw,90px)}
.language-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"crumb crumb" "eyebrow mark" "title mark" "intro mark";column-gap:50px;align-items:center;padding:0 0 clamp(36px,6vw,60px);border:0}.language-hero .crumbs{grid-area:crumb;color:#b79f9f}.language-hero__mark{grid-area:mark;display:grid;place-items:center;width:clamp(118px,15vw,170px);aspect-ratio:1;border:2px solid #ef4444;border-radius:42px;background:linear-gradient(145deg,#ef4444,#b91c1c);color:#fff;font-size:clamp(3.5rem,7vw,6rem);transform:rotate(5deg);box-shadow:12px 12px 0 var(--brand)}.language-eyebrow{grid-area:eyebrow;color:#f87171}.language-eyebrow:before{background:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.18)}.language-hero h1{grid-area:title;color:#fff;font-size:clamp(2.7rem,7vw,5.9rem)}.language-hero h1 span{display:block}.language-hero h1 span[lang="en"]{color:#ad9292}.language-intro{grid-area:intro;max-width:690px;margin-top:22px;color:#d3c3c3;font-size:clamp(1.03rem,2vw,1.2rem)}.language-intro span{display:block}.language-intro span+span{margin-top:6px;color:#ad9292}
.language-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.language-card{display:grid;gap:32px;min-height:300px;padding:clamp(22px,4vw,34px);border:1px solid #654141;border-radius:var(--radius-lg);background:#211818;color:#fff;text-decoration:none;box-shadow:var(--shadow-md);overflow:hidden}.language-card--es{background:linear-gradient(145deg,#dc2626,#991b1b)}.language-card--en{background:linear-gradient(145deg,#2a2020,#171111)}.language-card:hover{transform:translateY(-5px);border-color:#ef4444;box-shadow:0 20px 50px rgba(0,0,0,.28)}
.language-card__topline{display:flex;align-items:center;justify-content:space-between;gap:12px}.language-code{display:grid;place-items:center;width:46px;height:46px;border:1px solid currentColor;border-radius:14px;background:#ffffff;color:var(--brand-dark);font-size:.82rem;font-weight:950}.language-card--en .language-code{background:#fff}.language-card__status{color:#eadede;font-size:.8rem;font-weight:800}.language-card__body{display:grid;gap:9px;align-self:end}.language-card__title{color:#fff;font-family:var(--display);font-size:clamp(1.9rem,4vw,3rem);letter-spacing:-.04em}.language-card__copy{max-width:430px;color:#ffe0e0;line-height:1.55}.language-card--en .language-card__copy{color:#c7b1b1}.language-card__action{display:flex;align-items:center;justify-content:space-between;padding-top:18px;border-top:1px solid rgba(255,255,255,.22);font-weight:850}.language-card__action span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--signal);color:var(--ink)}
.language-trust{display:flex;justify-content:center;gap:10px 30px;flex-wrap:wrap;margin-top:25px;color:#ad9292;font-size:.8rem;text-align:center}.language-trust span[lang="en"]{color:#977f7f}
.language-footer{width:min(100%,calc(var(--max) + (var(--pad) * 2)));margin:0 auto;padding:20px var(--pad) 28px;border-top:1px solid #4d2a2a;display:flex;align-items:center;justify-content:space-between;gap:18px;color:#957c7c;font-size:.8rem}.language-footer p{color:inherit}.language-footer nav{display:flex;gap:16px}.language-footer a{color:#c4aaaa;text-decoration:none}.language-footer a:hover{color:var(--signal)}

/* ---------------- Responsive ---------------- */
@media (min-width:1100px){
  .menu-button{display:none}
  .primary-nav{position:static;display:flex!important;align-items:center;justify-content:flex-end;gap:2px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;max-height:none;overflow:visible}
  .primary-nav a{min-height:42px;padding:9px 10px;border-radius:999px;font-size:.86rem}
  .primary-nav a[aria-current="page"]{background:var(--brand-soft);color:var(--brand-dark)}
  .primary-nav .lang-link{min-width:42px;margin-left:4px;background:var(--brand);border:1px solid var(--brand-dark);color:#fff}
  .menu-scrim{display:none!important}
}

@media (max-width:900px){
  .hero.has-page-icon,.page-hero.has-page-icon{padding-right:0;padding-top:clamp(34px,6vw,56px)}
  .page-icon{position:relative;right:auto;top:auto;float:none;width:88px;margin:0 0 24px;transform:rotate(3deg);border-radius:28px;font-size:2.7rem;box-shadow:7px 7px 0 rgba(185,28,28,.18)}
  .page-hero .crumbs,.hero .crumbs{margin-bottom:20px}
  .page-icon+.micro{display:flex}
  .filter-zone{grid-template-columns:1fr;align-items:start}
  .directory{grid-template-columns:repeat(2,minmax(0,1fr))}
  .foot-inner{grid-template-columns:1fr}.foot-links{grid-template-columns:repeat(3,minmax(0,1fr))}
  .language-hero{grid-template-columns:1fr;grid-template-areas:"crumb" "mark" "eyebrow" "title" "intro";gap:0}.language-hero__mark{width:96px;margin:6px 0 28px;border-radius:28px;font-size:3rem;box-shadow:8px 8px 0 var(--brand)}
}

@media (max-width:760px){
  :root{--pad:18px;--radius:17px;--radius-lg:22px}
  body{font-size:15px;line-height:1.62}
  h1{font-size:clamp(2.3rem,12vw,4.25rem)}
  h2{font-size:clamp(1.55rem,8vw,2.45rem)}
  .head-inner{min-height:68px}.wordmark img{width:36px;height:36px}.menu-button{min-height:43px;padding-inline:13px}.primary-nav{top:62px;grid-template-columns:1fr;box-shadow:4px 4px 0 var(--ink)}
  .menu-scrim{inset:68px 0 0}
  .hero,.page-hero{padding-bottom:34px}.page-icon{width:78px;font-size:2.35rem}
  .quality-summary{margin:30px 0;padding:22px;border-radius:21px;box-shadow:5px 5px 0 var(--brand)}.quality-summary:after{width:140px;height:140px;right:-60px;top:-80px}
  .filter-zone{margin:32px 0;padding:20px;border-radius:21px}.select-grid{grid-template-columns:1fr}
  .record{grid-template-columns:1fr;gap:0}.record-body{padding:21px 20px 18px 24px}.record-link{width:auto;min-height:52px;padding:14px 20px;justify-content:space-between;text-align:left}.record-link:after{content:"↗";font-size:1.1rem}.record-briefs{grid-template-columns:1fr}.record-meta{gap:6px}.record-fact{font-size:.74rem}.record-body>p:not(.record-meta):not(.record-source-links){font-size:.95rem}
  .directory{grid-template-columns:1fr;gap:12px}.directory-card{min-height:128px}
  .split-note{grid-template-columns:1fr;gap:14px}
  .related-links ul,.latest-link-list,.approved-combined-hubs .related-links{grid-template-columns:1fr}
  .promo-pagination__controls{justify-content:flex-start;flex-wrap:nowrap;width:100%;overflow-x:auto;padding:2px 1px 8px;scrollbar-width:none}.promo-pagination__controls::-webkit-scrollbar{display:none}.promo-pagination__button{flex:0 0 auto}.promo-pagination__status{justify-self:start}
  .foot-links{grid-template-columns:repeat(2,minmax(0,1fr))}.site-foot{padding-inline:var(--pad)}
  .language-main{padding-top:28px}.language-options{grid-template-columns:1fr}.language-card{min-height:260px;gap:24px}.language-footer{align-items:flex-start;flex-direction:column}
  .back-to-top{width:44px;height:44px}
}

@media (max-width:420px){
  .wordmark span{font-size:1rem}.menu-button .menu-text{display:none}.menu-button{min-width:44px;width:44px;padding:0;border-radius:50%}
  .record-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.record-fact{justify-content:flex-start}
  .foot-links{grid-template-columns:1fr 1fr;gap:6px 12px}
}


/* ---------------- Unified dark identity ----------------
   The language landing already uses the Wynplay dark visual system.
   Apply the same black / red / white identity to every content page.
   ---------------- */
html[data-theme="dark"]{background:#171111;color-scheme:dark}
html[data-theme="dark"] body:not(.language-landing){
  color-scheme:dark;
  --canvas:#171111;
  --canvas-2:#1d1414;
  --paper:#211818;
  --paper-2:#2a2020;
  --ink:#fffafa;
  --ink-soft:#eadede;
  --muted:#cbb7b7;
  --muted-2:#ad9292;
  --line:#4d2a2a;
  --line-strong:#654141;
  --brand:#dc2626;
  --brand-dark:#f87171;
  --brand-soft:#321717;
  --signal:#ef4444;
  --signal-soft:#401a1a;
  --aqua:#ef4444;
  --aqua-soft:#401a1a;
  --coral:#f87171;
  --coral-soft:#321717;
  --warn:#f87171;
  --warn-soft:#321717;
  --danger:#fca5a5;
  --danger-soft:#401a1a;
  --success:#f87171;
  --success-soft:#321717;
  --focus:rgba(248,113,113,.34);
  --shadow-xs:0 1px 2px rgba(0,0,0,.20);
  --shadow-sm:0 10px 28px rgba(0,0,0,.24);
  --shadow-md:0 20px 52px rgba(0,0,0,.32);
  --shadow-hard:5px 5px 0 #0b0707;
}
html[data-theme="dark"] body:not(.language-landing):before{
  background:radial-gradient(circle at 6% 0%,rgba(185,28,28,.28),transparent 30rem),radial-gradient(circle at 96% 12%,rgba(239,68,68,.12),transparent 26rem),linear-gradient(180deg,#1d1414 0%,#171111 44rem)
}
html[data-theme="dark"] body:not(.language-landing):after{
  opacity:.07;
  background-image:linear-gradient(rgba(255,255,255,.28) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.28) 1px,transparent 1px);
  mask-image:linear-gradient(to bottom,black,transparent 52rem)
}
html[data-theme="dark"] body:not(.language-landing) .site-head{background:rgba(23,17,17,.94);border-bottom-color:#4d2a2a}
html[data-theme="dark"] body:not(.language-landing) .site-head.is-scrolled{background:rgba(23,17,17,.98);box-shadow:0 8px 30px rgba(0,0,0,.28)}
html[data-theme="dark"] body:not(.language-landing) .wordmark{color:#fffafa}
html[data-theme="dark"] body:not(.language-landing) .menu-button{border-color:#654141;background:#211818;color:#fffafa;box-shadow:3px 3px 0 #0b0707}
html[data-theme="dark"] body:not(.language-landing) .menu-button:hover{box-shadow:5px 5px 0 #0b0707}
html[data-theme="dark"] body:not(.language-landing) .menu-button[aria-expanded="true"]{background:#dc2626;color:#fff;border-color:#ef4444}
html[data-theme="dark"] body:not(.language-landing) .primary-nav{background:#211818;border-color:#654141;box-shadow:5px 5px 0 #0b0707}
html[data-theme="dark"] body:not(.language-landing) .primary-nav a[aria-current="page"]{background:#321717;color:#fca5a5}
html[data-theme="dark"] body:not(.language-landing) .menu-scrim{background:rgba(0,0,0,.64)}
html[data-theme="dark"] body:not(.language-landing) .skip-link{background:#dc2626;color:#fff}
html[data-theme="dark"] body:not(.language-landing) .page-icon{border-color:#ef4444;background:linear-gradient(145deg,#dc2626,#7f1d1d);box-shadow:10px 12px 0 rgba(127,29,29,.48)}
html[data-theme="dark"] body:not(.language-landing) .page-icon:after{background:rgba(255,255,255,.10)}
html[data-theme="dark"] body:not(.language-landing) .quick-index a{background:rgba(42,32,32,.88)}
html[data-theme="dark"] body:not(.language-landing) .filter-zone{border-color:#654141;background:linear-gradient(135deg,#2a1818 0%,#211818 62%,#1b1313 100%);box-shadow:0 16px 42px rgba(0,0,0,.22)}
html[data-theme="dark"] body:not(.language-landing) input,
html[data-theme="dark"] body:not(.language-landing) select,
html[data-theme="dark"] body:not(.language-landing) textarea{background:#171111;border-color:#654141;color:#fffafa}
html[data-theme="dark"] body:not(.language-landing) input::placeholder,
html[data-theme="dark"] body:not(.language-landing) textarea::placeholder{color:#957c7c}
html[data-theme="dark"] body:not(.language-landing) .record{background:#211818;border-color:#4d2a2a;box-shadow:0 10px 28px rgba(0,0,0,.22)}
html[data-theme="dark"] body:not(.language-landing) .record:hover{border-color:#8b5151;box-shadow:0 18px 38px rgba(0,0,0,.30)}
html[data-theme="dark"] body:not(.language-landing) .record-status-pill{background:#321717;color:#fca5a5}
html[data-theme="dark"] body:not(.language-landing) .record.soon .record-status-pill{background:#401a1a;color:#f87171}
html[data-theme="dark"] body:not(.language-landing) .record.upcoming .record-status-pill{background:#2c1a1a;color:#fca5a5}
html[data-theme="dark"] body:not(.language-landing) .record-fact{background:#1b1313;color:#cbb7b7;border-color:#4d2a2a}
html[data-theme="dark"] body:not(.language-landing) .record-toggle{background:#1b1313;border-color:#4d2a2a}
html[data-theme="dark"] body:not(.language-landing) .record-link{background:#120d0d;color:#fff;border-left:1px solid #4d2a2a}
html[data-theme="dark"] body:not(.language-landing) .record-link:hover{background:#dc2626;color:#fff}
html[data-theme="dark"] body:not(.language-landing) .empty-state:not([hidden]){background:rgba(33,24,24,.72)}
html[data-theme="dark"] body:not(.language-landing) .directory-card{background:#211818;border-color:#4d2a2a;box-shadow:0 2px 10px rgba(0,0,0,.14)}
html[data-theme="dark"] body:not(.language-landing) .directory-card:hover{border-color:#8b5151;box-shadow:5px 5px 0 #7f1d1d}
html[data-theme="dark"] body:not(.language-landing) .directory-icon{background:#321717;border-color:#b91c1c}
html[data-theme="dark"] body:not(.language-landing) .split-note{border-color:#654141;background:#2a1818}
html[data-theme="dark"] body:not(.language-landing) .note-checklist li,
html[data-theme="dark"] body:not(.language-landing) .entry-checklist li,
html[data-theme="dark"] body:not(.language-landing) .related-links a,
html[data-theme="dark"] body:not(.language-landing) .latest-link-list a,
html[data-theme="dark"] body:not(.language-landing) .approved-combined-hubs .related-links li{background:#211818;border-color:#4d2a2a}
html[data-theme="dark"] body:not(.language-landing) .faq-list details[open] summary:after,
html[data-theme="dark"] body:not(.language-landing) .faq-block details[open] summary:after{background:#dc2626;color:#fff}
html[data-theme="dark"] body:not(.language-landing) .promo-pagination__button,
html[data-theme="dark"] body:not(.language-landing) .pagination a,
html[data-theme="dark"] body:not(.language-landing) .pagination span{background:#211818;border-color:#654141;color:#eadede}
html[data-theme="dark"] body:not(.language-landing) .promo-pagination__button.is-current,
html[data-theme="dark"] body:not(.language-landing) .pagination .current{background:#dc2626;border-color:#ef4444;color:#fff}
html[data-theme="dark"] body:not(.language-landing) .ad-placement{background:rgba(33,24,24,.54);border-color:#654141}
html[data-theme="dark"] body:not(.language-landing) .back-to-top{box-shadow:3px 3px 0 #0b0707}
html[data-theme="dark"] body:not(.language-landing) .back-to-top:hover{box-shadow:5px 5px 0 #0b0707}
html[data-theme="dark"] body:not(.language-landing) .site-foot{background:#120d0d;border-top-color:#b91c1c}

html[data-theme="dark"] body:not(.language-landing) .plain-actions a,
html[data-theme="dark"] body:not(.language-landing) .source-button,
html[data-theme="dark"] body:not(.language-landing) .text-button{border-color:#654141;box-shadow:2px 2px 0 #0b0707}
html[data-theme="dark"] body:not(.language-landing) .plain-actions a:hover,
html[data-theme="dark"] body:not(.language-landing) .source-button:hover,
html[data-theme="dark"] body:not(.language-landing) .text-button:hover{box-shadow:4px 4px 0 #0b0707}

@media (min-width:1100px){
  html[data-theme="dark"] body:not(.language-landing) .primary-nav{background:transparent;border:0;box-shadow:none}
}
@media (max-width:900px){
  html[data-theme="dark"] body:not(.language-landing) .page-icon{box-shadow:7px 7px 0 rgba(127,29,29,.48)}
}


/* =========================================================
   WYNPLAY — MOBILE UX PASS / 2026-08
   Touch-first refinement: ads, pagination, typography, rhythm,
   cards, navigation and safe-area behavior.
   ========================================================= */

/* AdSense should read as media, never as a bordered UI card. */
.ad-placement,
html[data-theme="dark"] body:not(.language-landing) .ad-placement{
  width:100%;
  margin:clamp(24px,4vw,44px) 0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  line-height:0;
  overflow:hidden;
}
.ad-placement .adsbygoogle{
  display:block;
  max-width:100%;
  margin-inline:auto;
}
.ad-placement:has(.adsbygoogle[data-ad-status="unfilled"]){
  display:none;
  min-height:0;
  margin:0;
}

/* Desktop AdSense: keep responsive units measurable.
   The base .ad-placement starts as flex; desktop responsive <ins> elements
   must occupy the available line width before adsbygoogle.push({}). */
.ad-placement--desktop{
  display:block;
  width:100%;
}
.ad-placement--desktop .adsbygoogle{
  display:block!important;
  width:100%!important;
  max-width:100%;
}

/* Compact pagination structure: directions + a small useful page window. */
.promo-pagination__controls{
  display:grid;
  grid-template-columns:auto minmax(0,auto) auto;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
}
.promo-pagination__pages{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-width:0;
}

@media (max-width:760px){
  :root{
    --pad:16px;
    --radius:16px;
    --radius-lg:20px;
  }

  html{
    scroll-padding-top:76px;
    -webkit-tap-highlight-color:transparent;
  }
  body{
    min-width:0;
    font-size:16px;
    line-height:1.58;
  }
  html[data-theme="dark"] body:not(.language-landing){
    --shadow-xs:0 1px 2px rgba(0,0,0,.16);
    --shadow-sm:0 8px 24px rgba(0,0,0,.20);
    --shadow-md:0 16px 40px rgba(0,0,0,.26);
  }
  a,button,summary,label,input,select,textarea{
    touch-action:manipulation;
  }
  p,li,.directory-desc,.record-body>p{
    text-wrap:pretty;
  }
  h1,h2,h3{
    text-wrap:balance;
    overflow-wrap:anywhere;
  }
  h1{
    font-size:clamp(2.08rem,9vw,2.75rem);
    line-height:1.02;
    letter-spacing:-.043em;
  }
  h2{
    font-size:clamp(1.55rem,6.8vw,2rem);
    line-height:1.08;
    letter-spacing:-.038em;
  }
  h3{
    font-size:clamp(1.12rem,4.8vw,1.35rem);
    line-height:1.2;
  }

  /* Header: compact, stable and comfortable around notches. */
  .site-head{
    padding-top:env(safe-area-inset-top,0px);
  }
  .head-inner{
    min-height:64px;
    padding:9px max(var(--pad),env(safe-area-inset-right,0px)) 9px max(var(--pad),env(safe-area-inset-left,0px));
    gap:12px;
  }
  .wordmark{
    gap:9px;
    font-size:1.04rem;
  }
  .wordmark img{
    width:36px;
    height:36px;
    border-radius:11px;
  }
  .menu-button{
    min-width:46px;
    min-height:46px;
    padding-inline:13px;
    box-shadow:none!important;
  }
  .primary-nav{
    left:max(12px,env(safe-area-inset-left,0px));
    right:max(12px,env(safe-area-inset-right,0px));
    top:58px;
    gap:4px;
    padding:8px;
    border-radius:18px;
    max-height:calc(100dvh - 78px - env(safe-area-inset-top,0px));
    box-shadow:0 18px 50px rgba(0,0,0,.42)!important;
  }
  .primary-nav a{
    min-height:48px;
    padding:11px 13px;
    border-radius:12px;
    font-size:1rem;
  }
  .menu-scrim{
    inset:calc(64px + env(safe-area-inset-top,0px)) 0 0;
  }

  /* Main canvas and hero rhythm. */
  main{
    width:100%;
    padding-left:max(var(--pad),env(safe-area-inset-left,0px));
    padding-right:max(var(--pad),env(safe-area-inset-right,0px));
    padding-bottom:calc(76px + env(safe-area-inset-bottom,0px));
  }
  [id]{scroll-margin-top:82px}
  .hero,.page-hero{
    padding-top:28px;
    padding-bottom:30px;
  }
  .page-hero.compact{
    padding-top:26px;
    padding-bottom:28px;
  }
  .hero.has-page-icon,.page-hero.has-page-icon{
    padding-top:26px;
  }
  .page-icon{
    width:68px;
    margin:0 0 22px;
    border-width:1px;
    border-radius:22px;
    font-size:2rem;
    box-shadow:5px 5px 0 rgba(127,29,29,.44)!important;
  }
  .crumbs{
    margin-bottom:18px;
    font-size:.78rem;
    line-height:1.45;
  }
  .crumbs ol{gap:6px}
  .crumbs li{gap:6px}
  .micro,.language-eyebrow{
    margin-bottom:11px;
    font-size:.7rem;
    letter-spacing:.11em;
  }
  .micro:before,.language-eyebrow:before{
    width:8px;
    height:8px;
    box-shadow:0 0 0 3px var(--brand-soft);
  }
  .hero-lede,.page-hero>p:not(.micro){
    margin-top:15px;
    max-width:42rem;
    font-size:1rem;
    line-height:1.62;
  }
  .plain-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:9px;
    margin-top:22px;
  }
  .plain-actions a,.source-button,.text-button{
    min-height:50px;
    width:100%;
    padding:12px 16px;
    box-shadow:none!important;
  }
  .quick-index{
    gap:8px;
    margin-inline:calc(-1 * var(--pad));
    padding:16px var(--pad) 10px;
    scroll-padding-inline:var(--pad);
  }
  .quick-index a{
    min-height:42px;
    padding:9px 13px;
    font-size:.86rem;
  }

  /* Sections and filtering: less card-inside-card density. */
  .section-title{
    gap:8px;
    padding:38px 0 17px;
  }
  .section-title:after{
    width:58px;
    height:4px;
    box-shadow:62px 0 0 #991b1b;
  }
  .filter-zone{
    gap:18px;
    margin:28px 0;
    padding:18px;
    border-radius:18px;
    box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
  }
  .filter-intro h2{font-size:1.45rem}
  .filter-intro>p:last-child{
    margin-top:8px;
    font-size:.94rem;
    line-height:1.55;
  }
  .filter-controls{gap:12px}
  .search-line,.select-grid label{gap:7px}
  .search-line span,.select-grid span{
    font-size:.7rem;
    letter-spacing:.09em;
  }
  input,select,textarea{
    min-height:52px;
    border-radius:13px;
    padding-inline:14px;
    font-size:16px;
    box-shadow:none;
  }
  textarea{padding-block:13px}
  .filter-details summary{
    min-height:48px;
  }

  /* Promotion cards: clear hierarchy, lighter shadow, 48px+ touch targets. */
  .ledger{
    gap:14px;
    margin:14px 0 42px;
  }
  .record{
    grid-template-columns:1fr;
    gap:0;
    border-radius:18px;
    box-shadow:0 7px 22px rgba(0,0,0,.18)!important;
  }
  .record:hover{
    transform:none;
    box-shadow:0 7px 22px rgba(0,0,0,.18)!important;
  }
  .record:before{width:4px}
  .record-body{
    padding:19px 17px 17px 20px;
  }
  .record-status-row{
    gap:7px;
    margin-bottom:11px;
  }
  .record-status-pill{
    min-height:27px;
    padding:5px 9px;
    font-size:.69rem;
    letter-spacing:.055em;
  }
  .record-deadline{
    font-size:.78rem;
  }
  .record-body>p:not(.record-meta):not(.record-source-links){
    margin-top:10px;
    font-size:.94rem;
    line-height:1.58;
  }
  .record-meta{
    display:flex!important;
    flex-wrap:wrap;
    gap:6px;
    margin-top:13px!important;
  }
  .record-fact{
    min-height:28px;
    max-width:100%;
    padding:5px 8px;
    border-radius:8px;
    font-size:.72rem;
    line-height:1.25;
  }
  .record-briefs{
    grid-template-columns:1fr;
    gap:8px;
    margin-top:16px;
  }
  .record-toggle{
    border-radius:12px;
  }
  .record-toggle summary{
    min-height:48px;
    padding:11px 12px;
    font-size:.87rem;
  }
  .record-toggle__content{
    padding:0 12px 13px;
  }
  .record-toggle__content p,.record-toggle__content ul,.record-toggle__content ol{
    font-size:.9rem;
    line-height:1.57;
  }
  .record-source-links{
    margin-top:14px!important;
    font-size:.8rem;
    line-height:1.5;
  }
  .record-link,
  html[data-theme="dark"] body:not(.language-landing) .record-link{
    width:100%;
    min-height:54px;
    padding:14px 18px;
    justify-content:space-between;
    border-top:1px solid #5b2929;
    border-left:0;
    background:#b91c1c;
    color:#fff;
    font-size:.9rem;
    text-align:left;
  }
  .record-link:after{
    content:"↗";
    font-size:1.05rem;
  }

  /* Hubs, guides and FAQs. */
  .directory{
    grid-template-columns:1fr;
    gap:10px;
    margin:18px 0 46px;
  }
  .directory-card{
    min-height:0;
    padding:17px;
    gap:4px 12px;
    border-radius:16px;
    box-shadow:none!important;
  }
  .directory-card:hover{transform:none}
  .directory-icon{
    width:44px;
    height:44px;
    border-radius:12px;
    font-size:1.3rem;
  }
  .directory-title{
    font-size:1rem;
  }
  .directory-desc{
    font-size:.86rem;
    line-height:1.48;
  }
  .split-note{
    grid-template-columns:1fr;
    gap:13px;
    margin:32px 0;
    padding:19px;
    border-radius:18px;
  }
  .split-note>div:last-child p{font-size:.96rem}
  .guide-section,.text-flow,.faq-list,.faq-block{
    margin:38px 0;
  }
  .guide-section h2,.text-flow h2{
    margin-bottom:11px;
    font-size:1.55rem;
  }
  .guide-section p,.text-flow p{
    font-size:.96rem;
    line-height:1.67;
  }
  .guide-section ul,.guide-section ol,.text-flow ul,.text-flow ol{
    margin-top:14px;
    padding-left:1.15rem;
    line-height:1.62;
  }
  .note-checklist,.entry-checklist{gap:8px}
  .note-checklist li,.entry-checklist li{
    padding:12px 12px 12px 39px;
    border-radius:12px;
  }
  .note-checklist li:before,.entry-checklist li:before{
    left:11px;
    top:12px;
  }
  .related-links ul,.latest-link-list,.approved-combined-hubs .related-links{
    grid-template-columns:1fr;
    gap:8px;
  }
  .related-links a,.latest-link-list a{
    min-height:50px;
    padding:11px 13px;
    border-radius:12px;
    font-size:.93rem;
  }
  .faq-list h2,.faq-block h2{margin-bottom:13px}
  .faq-list summary,.faq-block summary{
    min-height:58px;
    gap:12px;
    padding:15px 2px;
    font-size:.96rem;
    line-height:1.35;
  }
  .faq-list summary:after,.faq-block summary:after{
    width:28px;
    height:28px;
  }
  .faq-list details p,.faq-block details p{
    padding:0 36px 16px 2px;
    font-size:.94rem;
    line-height:1.62;
  }

  /* Mobile pagination: primary thumb actions first, compact context second. */
  .promo-pagination,.pagination{
    gap:11px;
    margin:36px 0 44px;
  }
  .promo-pagination__status{
    justify-self:center;
    margin:0;
    padding:6px 11px;
    border:1px solid var(--line);
    border-radius:999px;
    background:var(--paper);
    color:var(--muted);
    font-size:.78rem;
    line-height:1.2;
    font-weight:800;
  }
  .promo-pagination__controls{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:
      "prev next"
      "pages pages";
    gap:9px 8px;
    width:100%;
  }
  .promo-pagination__prev{grid-area:prev}
  .promo-pagination__next{grid-area:next}
  .promo-pagination__pages{
    grid-area:pages;
    gap:5px;
    min-height:42px;
    overflow:visible;
  }
  .promo-pagination__button.is-direction{
    width:100%;
    min-width:0;
    min-height:50px;
    padding:11px 12px;
    border-radius:13px;
    font-size:.86rem;
  }
  .promo-pagination__prev{justify-content:flex-start}
  .promo-pagination__next{justify-content:flex-end}
  .promo-pagination__prev:not([aria-disabled="true"]):before{content:"←";margin-right:7px}
  .promo-pagination__next:not([aria-disabled="true"]):after{content:"→";margin-left:7px}
  .promo-pagination__page{
    min-width:38px;
    min-height:38px;
    padding:6px 8px;
    border-radius:10px;
    font-size:.82rem;
  }
  .promo-pagination__gap{
    min-width:16px;
    padding:6px 1px;
    text-align:center;
  }
  .promo-pagination__button[aria-disabled="true"]{
    opacity:.34;
  }

  /* Ads: no frame, no baseline gap, exact mobile creative reservation. */
  .ad-placement,
  html[data-theme="dark"] body:not(.language-landing) .ad-placement{
    min-height:0;
    margin:26px 0;
  }
  .ad-placement--mobile{
    min-height:250px;
  }
  .ad-placement--mobile .adsbygoogle{
    width:300px!important;
    height:250px!important;
    max-width:100%;
  }

  /* Footer and floating utility. */
  .site-foot{
    padding:44px max(var(--pad),env(safe-area-inset-right,0px)) calc(24px + env(safe-area-inset-bottom,0px)) max(var(--pad),env(safe-area-inset-left,0px));
    border-top-width:5px;
  }
  .foot-inner{
    grid-template-columns:1fr;
    gap:30px;
  }
  .foot-inner>div>p{
    margin-top:12px;
    font-size:.91rem;
  }
  .foot-links{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px 12px;
  }
  .foot-links a{
    display:flex;
    align-items:center;
    min-height:42px;
    font-size:.86rem;
  }
  .legal-line{
    margin-top:28px;
    padding-top:17px;
    font-size:.75rem;
  }
  .back-to-top{
    right:max(14px,env(safe-area-inset-right,0px));
    bottom:max(14px,env(safe-area-inset-bottom,0px));
    width:46px;
    height:46px;
    box-shadow:0 8px 22px rgba(0,0,0,.30)!important;
  }

  /* Language selector landing receives the same mobile discipline. */
  .language-header__inner{
    min-height:66px;
    padding:10px max(var(--pad),env(safe-area-inset-right,0px)) 10px max(var(--pad),env(safe-area-inset-left,0px));
  }
  .language-header__hint{font-size:.68rem}
  .language-main{
    width:100%;
    padding:28px max(var(--pad),env(safe-area-inset-right,0px)) 48px max(var(--pad),env(safe-area-inset-left,0px));
  }
  .language-hero{padding-bottom:30px}
  .language-hero__mark{
    width:78px;
    margin:4px 0 22px;
    border-radius:22px;
    font-size:2.35rem;
    box-shadow:6px 6px 0 var(--brand);
  }
  .language-hero h1{
    font-size:clamp(2.15rem,10vw,2.8rem);
    line-height:1.02;
  }
  .language-intro{
    margin-top:16px;
    font-size:.98rem;
    line-height:1.58;
  }
  .language-options{gap:12px}
  .language-card{
    min-height:0;
    gap:20px;
    padding:20px;
    border-radius:18px;
    box-shadow:0 12px 30px rgba(0,0,0,.24);
  }
  .language-card:hover{transform:none}
  .language-card__title{font-size:1.8rem}
  .language-card__copy{font-size:.94rem}
  .language-footer{
    padding:18px max(var(--pad),env(safe-area-inset-right,0px)) calc(22px + env(safe-area-inset-bottom,0px)) max(var(--pad),env(safe-area-inset-left,0px));
    gap:14px;
  }
}

@media (max-width:380px){
  :root{--pad:14px}
  h1{font-size:2rem}
  .wordmark span{font-size:.96rem}
  .promo-pagination__page{min-width:34px;min-height:36px;padding-inline:6px}
  .promo-pagination__pages{gap:4px}
  .foot-links{grid-template-columns:1fr}
}

@media (hover:none) and (pointer:coarse){
  .record:hover,.directory-card:hover,.language-card:hover,
  .plain-actions a:hover,.source-button:hover,.text-button:hover,
  .menu-button:hover,.back-to-top:hover{
    transform:none;
  }
  a:active,button:active,summary:active{
    opacity:.82;
  }
}

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


/* =========================================================
   WYNPLAY — LIGHT / DARK THEME SYSTEM / 2026-08
   Light is the default. Dark is an explicit, persisted choice.
   ========================================================= */
html[data-theme="light"]{color-scheme:light;background:var(--canvas)}

/* Always-visible, touch-friendly theme switch. */
.theme-toggle{
  flex:0 0 auto;
  display:inline-grid;
  place-items:center;
  width:58px;
  height:44px;
  margin-left:auto;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.theme-toggle__track{
  position:relative;
  display:block;
  width:50px;
  height:30px;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:var(--paper-2);
  box-shadow:inset 0 1px 2px rgba(23,17,17,.05),var(--shadow-xs);
  transition:background-color .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.theme-toggle__icon{
  position:absolute;
  top:50%;
  z-index:1;
  display:grid;
  place-items:center;
  width:18px;
  height:18px;
  transform:translateY(-50%);
  font-size:13px;
  line-height:1;
  font-family:system-ui,sans-serif;
  font-weight:900;
  pointer-events:none;
  transition:opacity .2s var(--ease),color .2s var(--ease);
}
.theme-toggle__icon--sun{left:6px;color:#b45309;opacity:.96}
.theme-toggle__icon--moon{right:5px;color:var(--muted);opacity:.72;font-size:15px}
.theme-toggle__knob{
  position:absolute;
  z-index:2;
  left:3px;
  top:3px;
  width:22px;
  height:22px;
  border:1px solid rgba(23,17,17,.10);
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 7px rgba(23,17,17,.18);
  transform:translateX(0);
  transition:transform .22s var(--ease),background-color .2s var(--ease),border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.theme-toggle:hover .theme-toggle__track{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft),var(--shadow-xs)}
.theme-toggle:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.theme-toggle:active .theme-toggle__knob{width:24px}

html[data-theme="dark"] .theme-toggle__track{
  border-color:#654141;
  background:#321717;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.28),0 1px 2px rgba(0,0,0,.22);
}
html[data-theme="dark"] .theme-toggle__icon--sun{color:#fbbf24;opacity:.82}
html[data-theme="dark"] .theme-toggle__icon--moon{color:#fca5a5;opacity:.96}
html[data-theme="dark"] .theme-toggle__knob{
  border-color:#fecaca;
  background:#fffafa;
  box-shadow:0 2px 9px rgba(0,0,0,.36);
  transform:translateX(20px);
}
html[data-theme="dark"] .theme-toggle:hover .theme-toggle__track{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.13),0 1px 2px rgba(0,0,0,.22)}

/* The language chooser used to be dark-only. Give it a complete light identity. */
html[data-theme="light"] body.language-landing{
  background:var(--canvas);
  color:var(--ink);
}
html[data-theme="light"] body.language-landing:before{
  background:radial-gradient(circle at 10% 8%,rgba(185,28,28,.10),transparent 30rem),radial-gradient(circle at 90% 22%,rgba(239,68,68,.07),transparent 26rem),linear-gradient(180deg,#fff 0%,var(--canvas) 44rem);
}
html[data-theme="light"] body.language-landing:after{
  opacity:.16;
  background-image:linear-gradient(rgba(23,17,17,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(23,17,17,.035) 1px,transparent 1px);
  mask-image:linear-gradient(to bottom,black,transparent 48rem);
}
html[data-theme="light"] .language-header{border-bottom-color:var(--line)}
html[data-theme="light"] .language-wordmark{color:var(--ink)}
html[data-theme="light"] .language-header__hint{border-color:var(--line-strong);color:var(--muted);background:rgba(255,255,255,.64)}
html[data-theme="light"] .language-hero .crumbs{color:var(--muted)}
html[data-theme="light"] .language-hero__mark{border-color:var(--brand-dark);background:linear-gradient(145deg,#ef4444,#b91c1c);box-shadow:12px 12px 0 rgba(185,28,28,.16)}
html[data-theme="light"] .language-eyebrow{color:var(--brand-dark)}
html[data-theme="light"] .language-eyebrow:before{background:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)}
html[data-theme="light"] .language-hero h1{color:var(--ink)}
html[data-theme="light"] .language-hero h1 span[lang="en"]{color:var(--muted-2)}
html[data-theme="light"] .language-intro{color:var(--ink-soft)}
html[data-theme="light"] .language-intro span+span{color:var(--muted)}
html[data-theme="light"] .language-card{
  border-color:var(--line-strong);
  background:var(--paper);
  color:var(--ink);
  box-shadow:var(--shadow-sm);
}
html[data-theme="light"] .language-card--es{background:linear-gradient(145deg,#fff 0%,#fff5f5 100%)}
html[data-theme="light"] .language-card--en{background:linear-gradient(145deg,#fff 0%,#fffafa 100%)}
html[data-theme="light"] .language-card:hover{border-color:var(--brand);box-shadow:0 16px 38px rgba(65,18,18,.13)}
html[data-theme="light"] .language-code{border-color:var(--line-strong);background:var(--brand-soft);color:var(--brand-dark)}
html[data-theme="light"] .language-card--en .language-code{background:var(--paper-2)}
html[data-theme="light"] .language-card__status{color:var(--muted)}
html[data-theme="light"] .language-card__title{color:var(--ink)}
html[data-theme="light"] .language-card__copy,
html[data-theme="light"] .language-card--en .language-card__copy{color:var(--muted)}
html[data-theme="light"] .language-card__action{border-top-color:var(--line);color:var(--ink)}
html[data-theme="light"] .language-card__action span{background:var(--brand);color:#fff}
html[data-theme="light"] .language-trust,
html[data-theme="light"] .language-trust span[lang="en"]{color:var(--muted-2)}
html[data-theme="light"] .language-footer{border-top-color:var(--line);color:var(--muted-2)}
html[data-theme="light"] .language-footer a{color:var(--muted)}
html[data-theme="light"] .language-footer a:hover{color:var(--brand-dark)}

/* Keep header controls balanced on narrow screens. */
@media (max-width:760px){
  .head-inner{gap:8px}
  .theme-toggle{width:54px;height:44px}
  .theme-toggle__track{width:48px;height:28px}
  .theme-toggle__knob{width:20px;height:20px}
  html[data-theme="dark"] .theme-toggle__knob{transform:translateX(20px)}
  .language-header__inner{gap:8px}
}
@media (max-width:380px){
  .theme-toggle{width:50px}
  .theme-toggle__track{width:46px}
  html[data-theme="dark"] .theme-toggle__knob{transform:translateX(18px)}
  .language-header__hint{padding-inline:8px}
}

@media print{
  body{background:#fff}.site-head,.site-foot,.filter-zone,.ad-placement,.back-to-top,.record-link,.menu-scrim,.theme-toggle{display:none!important}main{width:100%;padding:0}.hero,.page-hero{padding:20px 0}.record{break-inside:avoid;box-shadow:none}.record-body{padding:16px}.record-briefs{display:block}.record-toggle{margin-top:8px}.record-toggle[open] .record-toggle__content{display:block}
}

/* 2026-08-07 — Hero icon/title alignment + simplified promotion-card metadata */
.hero.has-page-icon,
.page-hero.has-page-icon{
  display:grid;
  grid-template-columns:clamp(82px,9vw,112px) minmax(0,1fr);
  grid-template-rows:auto auto auto auto;
  column-gap:clamp(18px,2.2vw,28px);
  align-items:start;
  padding-right:0;
}
.hero.has-page-icon>.crumbs,
.page-hero.has-page-icon>.crumbs{
  grid-column:1/-1;
  grid-row:1;
}
.hero.has-page-icon>.page-icon,
.page-hero.has-page-icon>.page-icon{
  position:relative;
  right:auto;
  top:auto;
  grid-column:1;
  grid-row:3;
  align-self:start;
  width:clamp(76px,8vw,96px);
  margin:0;
  transform:rotate(3deg);
  font-size:clamp(2.25rem,4vw,3rem);
  box-shadow:7px 8px 0 rgba(185,28,28,.18);
}
.hero.has-page-icon>.micro,
.page-hero.has-page-icon>.micro{
  grid-column:1/-1;
  grid-row:2;
  align-self:start;
  margin-bottom:14px;
}
.hero.has-page-icon>h1,
.page-hero.has-page-icon>h1{
  grid-column:2;
  grid-row:3;
  align-self:start;
}
.hero.has-page-icon>.hero-lede,
.page-hero.has-page-icon>.hero-lede{
  grid-column:1/-1;
  grid-row:4;
  margin-top:24px;
}
.hero.has-page-icon>.directory-card,
.page-hero.has-page-icon>.directory-card{
  grid-column:1/-1;
}

/* Metadata is now intentionally reduced to the country/eligibility chip. */
.record-meta.record-meta--facts{
  display:flex!important;
  margin-top:13px!important;
}
.record-meta.record-meta--facts .record-fact{
  min-height:30px;
}

@media (max-width:760px){
  .hero.has-page-icon,
  .page-hero.has-page-icon{
    grid-template-columns:54px minmax(0,1fr);
    column-gap:14px;
    padding-top:26px;
  }
  .hero.has-page-icon>.page-icon,
  .page-hero.has-page-icon>.page-icon{
    width:52px;
    margin:2px 0 0;
    border-radius:18px;
    font-size:1.55rem;
    box-shadow:4px 4px 0 rgba(185,28,28,.18)!important;
  }
  html[data-theme="dark"] body:not(.language-landing) .hero.has-page-icon>.page-icon,
  html[data-theme="dark"] body:not(.language-landing) .page-hero.has-page-icon>.page-icon{
    box-shadow:4px 4px 0 rgba(127,29,29,.48)!important;
  }
  .hero.has-page-icon>.micro,
  .page-hero.has-page-icon>.micro{
    margin:0 0 12px;
    font-size:.68rem;
    letter-spacing:.1em;
  }
  .hero.has-page-icon>h1,
  .page-hero.has-page-icon>h1{
    font-size:clamp(1.78rem,7.7vw,2.3rem);
    line-height:1.03;
  }
  .hero.has-page-icon>.hero-lede,
  .page-hero.has-page-icon>.hero-lede{
    margin-top:20px;
  }
  .record-meta.record-meta--facts{
    display:flex!important;
    gap:0;
    margin-top:12px!important;
  }
  .record-meta.record-meta--facts .record-fact{
    min-height:29px;
    padding:5px 9px;
    font-size:.73rem;
  }
}

/* =========================================================
   WYNPLAY — INDIVIDUAL PROMOTION PAGES / 2026-08-09
   Dedicated editorial rhythm for promotion detail pages.
   ========================================================= */

main[data-promotion-page="true"]{
  --promo-reading:820px;
  --promo-panel:960px;
}

main[data-promotion-page="true"] > .page-hero{
  width:min(100%,1040px);
  margin-inline:auto;
  padding-top:clamp(46px,6vw,76px);
  padding-bottom:clamp(42px,5vw,62px);
}
main[data-promotion-page="true"] > .page-hero h1{
  max-width:900px;
  font-size:clamp(2.7rem,5.8vw,4.85rem);
  line-height:1.04;
  letter-spacing:-.04em;
}
main[data-promotion-page="true"] > .page-hero .hero-lede,
main[data-promotion-page="true"] > .page-hero > p:not(.micro){
  max-width:800px;
  margin-top:clamp(22px,3vw,30px);
  font-size:clamp(1.08rem,1.7vw,1.25rem);
  line-height:1.72;
}
main[data-promotion-page="true"] > .page-hero .micro{
  margin-bottom:16px;
}

main[data-promotion-page="true"] > .guide-section,
main[data-promotion-page="true"] > .faq-list{
  width:min(100%,var(--promo-panel));
  max-width:var(--promo-panel);
  margin:clamp(24px,3.6vw,38px) auto 0;
  padding:clamp(28px,3.6vw,42px) clamp(24px,4vw,46px);
  border:1px solid var(--line);
  border-radius:clamp(20px,2vw,28px);
  background:rgba(255,255,255,.88);
  box-shadow:0 12px 34px rgba(65,18,18,.07);
}
main[data-promotion-page="true"] > .promotion-essentials{
  margin-top:clamp(38px,5vw,58px);
  border-color:#edc4c4;
  background:linear-gradient(145deg,#fff7f7 0%,#ffffff 72%);
  box-shadow:0 16px 38px rgba(65,18,18,.09);
}
main[data-promotion-page="true"] > .guide-section h2,
main[data-promotion-page="true"] > .faq-list h2{
  max-width:var(--promo-reading);
  margin:0 0 clamp(20px,2.5vw,28px);
  font-size:clamp(1.65rem,3vw,2.45rem);
  line-height:1.1;
  letter-spacing:-.035em;
}
main[data-promotion-page="true"] > .guide-section h3{
  max-width:var(--promo-reading);
  margin:clamp(28px,3vw,36px) 0 12px;
  line-height:1.25;
}
main[data-promotion-page="true"] > .guide-section p,
main[data-promotion-page="true"] > .guide-section ul,
main[data-promotion-page="true"] > .guide-section ol,
main[data-promotion-page="true"] > .faq-list details{
  max-width:var(--promo-reading);
}
main[data-promotion-page="true"] > .guide-section p{
  font-size:1.02rem;
  line-height:1.78;
}
main[data-promotion-page="true"] > .guide-section p + p{
  margin-top:1.05rem;
}
main[data-promotion-page="true"] > .guide-section ul,
main[data-promotion-page="true"] > .guide-section ol{
  margin:20px 0 0;
  padding-left:1.45rem;
  line-height:1.72;
}
main[data-promotion-page="true"] > .guide-section li{
  padding-left:.18rem;
}
main[data-promotion-page="true"] > .guide-section li + li{
  margin-top:10px;
}
main[data-promotion-page="true"] > .guide-section h2 + p,
main[data-promotion-page="true"] > .guide-section h2 + ul,
main[data-promotion-page="true"] > .guide-section h2 + ol,
main[data-promotion-page="true"] > .guide-section h3 + p,
main[data-promotion-page="true"] > .guide-section h3 + ul,
main[data-promotion-page="true"] > .guide-section h3 + ol{
  margin-top:0;
}

/* The first information panel should scan like a useful summary, not a legal list. */
main[data-promotion-page="true"] > .promotion-essentials > ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 14px;
  max-width:100%;
  margin-top:0;
  padding:0;
  list-style:none;
}
main[data-promotion-page="true"] > .promotion-essentials > ul > li{
  margin:0;
  padding:13px 15px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.82);
  color:var(--muted);
  line-height:1.55;
}
main[data-promotion-page="true"] > .promotion-essentials > p:last-child{
  margin-top:22px;
}
main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:11px 18px;
  border:1px solid var(--ink);
  border-radius:999px;
  background:var(--ink);
  color:#fff;
  font-weight:850;
  text-decoration:none;
  box-shadow:3px 3px 0 var(--brand);
}
main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a:hover{
  transform:translate(-1px,-1px);
  background:var(--brand);
  box-shadow:5px 5px 0 var(--ink);
}

main[data-promotion-page="true"] > .related-links{
  background:linear-gradient(145deg,var(--brand-soft),#fff 76%);
  border-color:#edc4c4;
}
main[data-promotion-page="true"] > .related-links > p{
  margin-bottom:20px;
}
main[data-promotion-page="true"] > .related-links ul{
  max-width:none;
  margin-top:0;
  gap:12px;
}
main[data-promotion-page="true"] > .related-links a{
  min-height:58px;
  padding:13px 16px;
  border-radius:14px;
}

main[data-promotion-page="true"] > .faq-list{
  margin-bottom:clamp(20px,4vw,44px);
}
main[data-promotion-page="true"] > .faq-list details{
  margin-inline:0;
}
main[data-promotion-page="true"] > .faq-list summary{
  min-height:58px;
  padding:18px 2px;
  line-height:1.45;
}
main[data-promotion-page="true"] > .faq-list details p{
  padding:2px 46px 22px 2px;
  line-height:1.75;
}

/* Keep ads visually separated from editorial copy on promotion pages. */
main[data-promotion-page="true"] .ad-placement{
  width:min(100%,var(--promo-panel));
  margin:clamp(30px,5vw,50px) auto;
}

html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .guide-section,
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .faq-list{
  border-color:#4d2a2a;
  background:rgba(33,24,24,.92);
  box-shadow:0 14px 38px rgba(0,0,0,.24);
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .promotion-essentials,
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .related-links{
  border-color:#654141;
  background:linear-gradient(145deg,#2a1818 0%,#211818 76%);
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .promotion-essentials > ul > li{
  border-color:#4d2a2a;
  background:#1b1313;
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a{
  border-color:#ef4444;
  background:#dc2626;
  box-shadow:3px 3px 0 #0b0707;
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a:hover{
  background:#ef4444;
  box-shadow:5px 5px 0 #0b0707;
}

@media (max-width:760px){
  main[data-promotion-page="true"] > .page-hero{
    padding-top:30px;
    padding-bottom:34px;
  }
  main[data-promotion-page="true"] > .page-hero h1{
    max-width:none;
    font-size:clamp(2.15rem,9.6vw,3rem);
    line-height:1.07;
    letter-spacing:-.038em;
  }
  main[data-promotion-page="true"] > .page-hero .micro{
    margin-bottom:14px;
    line-height:1.25;
  }
  main[data-promotion-page="true"] > .page-hero .hero-lede,
  main[data-promotion-page="true"] > .page-hero > p:not(.micro){
    margin-top:19px;
    font-size:1.03rem;
    line-height:1.68;
  }
  main[data-promotion-page="true"] > .guide-section,
  main[data-promotion-page="true"] > .faq-list{
    margin-top:18px;
    padding:23px 18px 25px;
    border-radius:19px;
    box-shadow:0 8px 24px rgba(65,18,18,.07);
  }
  main[data-promotion-page="true"] > .promotion-essentials{
    margin-top:28px;
  }
  main[data-promotion-page="true"] > .guide-section h2,
  main[data-promotion-page="true"] > .faq-list h2{
    margin-bottom:18px;
    font-size:clamp(1.5rem,7vw,1.92rem);
    line-height:1.13;
  }
  main[data-promotion-page="true"] > .guide-section h3{
    margin-top:25px;
    margin-bottom:11px;
  }
  main[data-promotion-page="true"] > .guide-section p{
    font-size:1rem;
    line-height:1.72;
  }
  main[data-promotion-page="true"] > .guide-section p + p{
    margin-top:.95rem;
  }
  main[data-promotion-page="true"] > .guide-section ul,
  main[data-promotion-page="true"] > .guide-section ol{
    margin-top:17px;
    padding-left:1.25rem;
    line-height:1.67;
  }
  main[data-promotion-page="true"] > .guide-section li + li{
    margin-top:9px;
  }
  main[data-promotion-page="true"] > .promotion-essentials > ul{
    grid-template-columns:1fr;
    gap:8px;
    padding:0;
  }
  main[data-promotion-page="true"] > .promotion-essentials > ul > li{
    padding:12px 13px;
  }
  main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a{
    width:100%;
    min-height:50px;
    padding-inline:16px;
    text-align:center;
  }
  main[data-promotion-page="true"] > .related-links ul{
    grid-template-columns:1fr;
    gap:9px;
  }
  main[data-promotion-page="true"] > .related-links a{
    min-height:54px;
    padding:12px 14px;
  }
  main[data-promotion-page="true"] > .faq-list summary{
    gap:12px;
    min-height:56px;
    padding:16px 0;
  }
  main[data-promotion-page="true"] > .faq-list details p{
    padding:0 0 20px;
  }
}

@media (max-width:420px){
  main[data-promotion-page="true"] > .guide-section,
  main[data-promotion-page="true"] > .faq-list{
    padding:21px 16px 23px;
    border-radius:17px;
  }
  main[data-promotion-page="true"] > .page-hero h1{
    font-size:clamp(2rem,10vw,2.55rem);
  }
}

/* Compatibility fallbacks and internal-card affordance. */
main[data-promotion-page="true"] > .page-hero h1{font-size:4.2rem;font-size:clamp(2.7rem,5.8vw,4.85rem)}
main[data-promotion-page="true"] > .guide-section h2,
main[data-promotion-page="true"] > .faq-list h2{font-size:2.15rem;font-size:clamp(1.65rem,3vw,2.45rem)}
.record-link[href^="/"]{cursor:pointer}

@media (max-width:760px){
  main[data-promotion-page="true"] > .page-hero h1{font-size:2.55rem;font-size:clamp(2.15rem,9.6vw,3rem)}
  main[data-promotion-page="true"] > .guide-section h2,
  main[data-promotion-page="true"] > .faq-list h2{font-size:1.75rem;font-size:clamp(1.5rem,7vw,1.92rem)}
  .record-link[href^="/"]:after{content:"→"}
}

/* =========================================================
   WYNPLAY — TYPOGRAPHY REFINEMENT / 2026-08-09
   Humanist system sans, calmer display scale and improved reading rhythm.
   ========================================================= */
:root{
  --display:"Segoe UI Variable Display","Avenir Next","SF Pro Display","Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --sans:"Segoe UI Variable Text","SF Pro Text","Avenir Next","Segoe UI",Roboto,system-ui,-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
  --reading:720px;
}

html{font-kerning:normal}
body{
  font-family:var(--sans);
  font-size:17px;
  line-height:1.7;
  font-optical-sizing:auto;
  font-synthesis-weight:none;
  letter-spacing:0;
}
button,input,select,textarea{font-family:var(--sans)}
p{line-height:inherit}
p+p{margin-top:.95rem}
strong{font-weight:700}

h1,h2,h3{
  font-family:var(--display);
  font-weight:700;
  font-optical-sizing:auto;
  text-wrap:balance;
}
h1{
  font-size:clamp(2.7rem,5.4vw,4.85rem);
  line-height:1.055;
  letter-spacing:-.032em;
}
h2{
  font-size:clamp(1.7rem,3.2vw,2.6rem);
  line-height:1.12;
  letter-spacing:-.026em;
}
h3{
  font-size:clamp(1.15rem,2vw,1.42rem);
  line-height:1.28;
  letter-spacing:-.018em;
}

.wordmark{font-size:1.12rem;font-weight:750;letter-spacing:-.025em}
.primary-nav a{font-size:.95rem;font-weight:650;line-height:1.35}
.micro,.language-eyebrow{font-size:.76rem;font-weight:750;letter-spacing:.105em}
.crumbs{font-size:.88rem;line-height:1.5}
.hero-lede,.page-hero>p:not(.micro){font-size:clamp(1.08rem,1.65vw,1.24rem);line-height:1.72}
.quick-index a{font-size:.91rem;font-weight:650}
.count-line strong{font-weight:750}
.search-line span,.select-grid span{font-weight:750;letter-spacing:.085em}
.filter-details summary{font-weight:700}

.record-status-pill{font-weight:750;letter-spacing:.05em}
.record-deadline{font-size:.84rem;font-weight:650}
.record-fact{font-size:.8rem;font-weight:620;line-height:1.35}
.record-body>p:not(.record-meta):not(.record-source-links){font-size:.98rem;line-height:1.68}
.record-toggle summary{font-size:.9rem;font-weight:700}
.record-toggle__content p,.record-toggle__content ul,.record-toggle__content ol{font-size:.94rem;line-height:1.68}
.record-source-links{font-size:.86rem;line-height:1.58}
.record-source-links a{font-weight:700}
.record-link{font-size:.92rem;font-weight:700;line-height:1.42}

.directory-title{font-size:1.05rem;font-weight:700;letter-spacing:-.012em}
.directory-desc{font-size:.92rem;line-height:1.62}
.split-note>div:last-child p{font-size:1.02rem;line-height:1.7}
.guide-section h2,.text-flow h2{font-size:clamp(1.65rem,3vw,2.35rem);line-height:1.16;letter-spacing:-.024em}
.guide-section p,.text-flow p{font-size:1.04rem;line-height:1.78}
.guide-section ul,.guide-section ol,.text-flow ul,.text-flow ol{font-size:1rem;line-height:1.74}
.faq-list summary,.faq-block summary{font-size:1rem;font-weight:700;line-height:1.45}
.faq-list details p,.faq-block details p{font-size:.98rem;line-height:1.74}
.promo-pagination__status{font-size:.9rem;font-weight:650}
.promo-pagination__button,.pagination a,.pagination span{font-size:.9rem;font-weight:650}
.foot-inner>div>p{font-size:.96rem;line-height:1.68}
.foot-links a{font-size:.92rem;font-weight:600}
.legal-line{font-size:.8rem;line-height:1.6}

.language-hero h1{font-size:clamp(2.85rem,5.7vw,5rem);line-height:1.04;letter-spacing:-.032em}
.language-intro{font-size:clamp(1.05rem,1.7vw,1.2rem);line-height:1.7}
.language-card__title{font-weight:700;letter-spacing:-.026em}
.language-card__copy{font-size:.98rem;line-height:1.65}
.language-card__action{font-weight:700}

/* Promotion detail pages: editorial reading scale takes precedence over legacy fallbacks. */
main[data-promotion-page="true"]{
  --promo-reading:760px;
}
main[data-promotion-page="true"] > .page-hero h1{
  max-width:880px;
  font-size:clamp(2.75rem,5vw,4.35rem);
  line-height:1.085;
  letter-spacing:-.03em;
}
main[data-promotion-page="true"] > .page-hero .hero-lede,
main[data-promotion-page="true"] > .page-hero > p:not(.micro){
  max-width:760px;
  font-size:clamp(1.1rem,1.55vw,1.22rem);
  line-height:1.78;
}
main[data-promotion-page="true"] > .guide-section h2,
main[data-promotion-page="true"] > .faq-list h2{
  font-size:clamp(1.65rem,2.6vw,2.25rem);
  line-height:1.18;
  letter-spacing:-.024em;
}
main[data-promotion-page="true"] > .guide-section h3{
  font-size:clamp(1.16rem,1.7vw,1.35rem);
  line-height:1.32;
  letter-spacing:-.012em;
}
main[data-promotion-page="true"] > .guide-section p{
  font-size:1.05rem;
  line-height:1.82;
}
main[data-promotion-page="true"] > .guide-section ul,
main[data-promotion-page="true"] > .guide-section ol{
  font-size:1rem;
  line-height:1.78;
}
main[data-promotion-page="true"] > .promotion-essentials > ul > li{line-height:1.62}
main[data-promotion-page="true"] > .faq-list summary{font-size:1rem;font-weight:700;line-height:1.48}
main[data-promotion-page="true"] > .faq-list details p{font-size:.99rem;line-height:1.78}

@media (max-width:760px){
  body{font-size:16px;line-height:1.68}
  h1{font-size:clamp(2.05rem,8.6vw,2.72rem);line-height:1.09;letter-spacing:-.028em}
  h2{font-size:clamp(1.5rem,6vw,1.95rem);line-height:1.16;letter-spacing:-.022em}
  h3{font-size:clamp(1.1rem,4.4vw,1.3rem);line-height:1.3;letter-spacing:-.012em}
  .wordmark{font-size:1.02rem}
  .primary-nav a{font-size:.95rem;line-height:1.4}
  .crumbs{font-size:.8rem;line-height:1.5}
  .micro,.language-eyebrow{font-size:.71rem;letter-spacing:.095em}
  .hero-lede,.page-hero>p:not(.micro){font-size:1.01rem;line-height:1.7}
  .quick-index a{font-size:.88rem}

  .record-deadline{font-size:.8rem}
  .record-fact{font-size:.76rem;line-height:1.35}
  .record-body>p:not(.record-meta):not(.record-source-links){font-size:.97rem;line-height:1.66}
  .record-toggle summary{font-size:.9rem}
  .record-toggle__content p,.record-toggle__content ul,.record-toggle__content ol{font-size:.93rem;line-height:1.66}
  .record-source-links{font-size:.83rem;line-height:1.58}
  .record-link{font-size:.92rem;line-height:1.45}

  .directory-title{font-size:1.01rem}
  .directory-desc{font-size:.9rem;line-height:1.58}
  .guide-section h2,.text-flow h2{font-size:1.52rem;line-height:1.18}
  .guide-section p,.text-flow p{font-size:1rem;line-height:1.72}
  .guide-section ul,.guide-section ol,.text-flow ul,.text-flow ol{font-size:.98rem;line-height:1.7}
  .faq-list summary,.faq-block summary{font-size:.98rem;line-height:1.42}
  .faq-list details p,.faq-block details p{font-size:.96rem;line-height:1.7}
  .foot-inner>div>p{font-size:.94rem;line-height:1.65}
  .foot-links a{font-size:.89rem}

  .language-hero h1{font-size:clamp(2.15rem,9vw,2.75rem);line-height:1.08}
  .language-intro{font-size:1rem;line-height:1.68}
  .language-card__title{font-size:1.75rem;line-height:1.12}
  .language-card__copy{font-size:.96rem;line-height:1.64}

  main[data-promotion-page="true"] > .page-hero h1{
    font-size:clamp(2.05rem,8.8vw,2.72rem);
    line-height:1.1;
    letter-spacing:-.027em;
  }
  main[data-promotion-page="true"] > .page-hero .hero-lede,
  main[data-promotion-page="true"] > .page-hero > p:not(.micro){font-size:1.02rem;line-height:1.74}
  main[data-promotion-page="true"] > .guide-section h2,
  main[data-promotion-page="true"] > .faq-list h2{font-size:clamp(1.48rem,6.2vw,1.82rem);line-height:1.2}
  main[data-promotion-page="true"] > .guide-section h3{font-size:1.16rem;line-height:1.34}
  main[data-promotion-page="true"] > .guide-section p{font-size:1rem;line-height:1.76}
  main[data-promotion-page="true"] > .guide-section ul,
  main[data-promotion-page="true"] > .guide-section ol{font-size:.98rem;line-height:1.72}
  main[data-promotion-page="true"] > .faq-list summary{font-size:.98rem;line-height:1.46}
  main[data-promotion-page="true"] > .faq-list details p{font-size:.96rem;line-height:1.72}
}

@media (max-width:420px){
  h1{font-size:2rem}
  main[data-promotion-page="true"] > .page-hero h1{font-size:2.08rem;line-height:1.11}
}

/* Wynplay CSS deployment build 20260809-v9-lote6-cf1 — Cloudflare cache-bust marker. */

/* Wynplay production CSS fingerprint: 20260809-prod-hotfix-1 */

/* =========================================================
   WYNPLAY — PROMOTION DETAIL UX POLISH / 2026-08-09
   Scoped to individual promotion pages only.
   Improves hierarchy, scanning, touch targets and mobile rhythm.
   ========================================================= */
main[data-promotion-page="true"]{
  --promo-reading:760px;
  --promo-panel:940px;
  --promo-section-gap:clamp(18px,2.4vw,26px);
}

/* Hero: calmer scale, clearer status and a more compact visual anchor. */
main[data-promotion-page="true"] > .page-hero{
  width:min(100%,1000px);
  padding-top:clamp(42px,5.4vw,64px);
  padding-bottom:clamp(36px,4.6vw,52px);
}
main[data-promotion-page="true"] > .page-hero.has-page-icon{
  padding-right:clamp(150px,18vw,205px);
}
main[data-promotion-page="true"] > .page-hero .page-icon{
  right:4px;
  width:clamp(118px,13vw,158px);
  border-width:1px;
  border-radius:30px;
  transform:translateY(-43%) rotate(2deg);
  box-shadow:0 18px 42px rgba(65,18,18,.11),6px 7px 0 rgba(185,28,28,.12);
}
main[data-promotion-page="true"] > .page-hero .crumbs{
  margin-bottom:18px;
}
main[data-promotion-page="true"] > .page-hero .micro{
  width:max-content;
  margin-bottom:15px;
  padding:8px 11px;
  border:1px solid var(--line-strong);
  border-radius:999px;
  background:rgba(255,255,255,.78);
  letter-spacing:.085em;
}
main[data-promotion-page="true"] > .page-hero .micro:before{
  width:7px;
  height:7px;
  box-shadow:0 0 0 3px var(--brand-soft);
}
main[data-promotion-page="true"] > .page-hero h1{
  max-width:850px;
  font-size:clamp(2.65rem,4.65vw,4.05rem);
  line-height:1.075;
  letter-spacing:-.029em;
  text-wrap:balance;
}
main[data-promotion-page="true"] > .page-hero .hero-lede,
main[data-promotion-page="true"] > .page-hero > p:not(.micro){
  max-width:740px;
  margin-top:22px;
  color:var(--ink-soft);
  font-size:clamp(1.08rem,1.45vw,1.18rem);
  line-height:1.75;
}

/* Sections: lighter, consistent surfaces with a predictable reading rhythm. */
main[data-promotion-page="true"] > .guide-section,
main[data-promotion-page="true"] > .faq-list{
  width:min(100%,var(--promo-panel));
  margin:var(--promo-section-gap) auto 0;
  padding:clamp(27px,3.2vw,36px) clamp(24px,3.7vw,38px);
  border:1px solid var(--line);
  border-radius:22px;
  background:rgba(255,255,255,.84);
  box-shadow:0 8px 26px rgba(65,18,18,.055);
}
main[data-promotion-page="true"] > .guide-section h2,
main[data-promotion-page="true"] > .faq-list h2{
  position:relative;
  max-width:var(--promo-reading);
  margin:0 0 21px;
  padding-left:16px;
  font-size:clamp(1.58rem,2.35vw,2.08rem);
  line-height:1.2;
  letter-spacing:-.022em;
}
main[data-promotion-page="true"] > .guide-section h2:before,
main[data-promotion-page="true"] > .faq-list h2:before{
  content:"";
  position:absolute;
  left:0;
  top:.16em;
  width:4px;
  height:.82em;
  border-radius:999px;
  background:var(--brand);
}
main[data-promotion-page="true"] > .guide-section h3{
  margin:28px 0 11px;
  font-size:clamp(1.12rem,1.5vw,1.28rem);
  line-height:1.35;
  letter-spacing:-.01em;
}
main[data-promotion-page="true"] > .guide-section p{
  font-size:1.04rem;
  line-height:1.8;
}
main[data-promotion-page="true"] > .guide-section p + p{
  margin-top:.9rem;
}
main[data-promotion-page="true"] > .guide-section ul,
main[data-promotion-page="true"] > .guide-section ol{
  margin-top:16px;
  line-height:1.72;
}
main[data-promotion-page="true"] > .guide-section ul:not(:first-child) > li::marker{
  color:var(--brand);
}
main[data-promotion-page="true"] > .guide-section li + li{
  margin-top:8px;
}

/* Entry steps: explicit visual sequence without changing HTML/content. */
main[data-promotion-page="true"] > .guide-section ol{
  counter-reset:wynplay-promo-step;
  list-style:none;
  padding-left:0;
}
main[data-promotion-page="true"] > .guide-section ol > li{
  counter-increment:wynplay-promo-step;
  position:relative;
  min-height:34px;
  padding-left:44px;
}
main[data-promotion-page="true"] > .guide-section ol > li:before{
  content:counter(wynplay-promo-step);
  position:absolute;
  left:0;
  top:.02em;
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:1px solid var(--line-strong);
  border-radius:10px;
  background:var(--brand-soft);
  color:var(--brand-dark);
  font-size:.82rem;
  font-weight:800;
  line-height:1;
}

/* Essentials panel: prioritize scanning and make the official action unmistakable. */
main[data-promotion-page="true"] > .promotion-essentials{
  position:relative;
  overflow:hidden;
  margin-top:clamp(30px,4vw,42px);
  padding-top:clamp(30px,3.4vw,38px);
  border-color:var(--line-strong);
  background:linear-gradient(145deg,#fff8f8 0%,rgba(255,255,255,.96) 70%);
  box-shadow:0 12px 34px rgba(65,18,18,.075);
}
main[data-promotion-page="true"] > .promotion-essentials:before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:4px;
  background:var(--brand);
}
main[data-promotion-page="true"] > .promotion-essentials > ul{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
main[data-promotion-page="true"] > .promotion-essentials > ul > li{
  min-width:0;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.9);
  color:var(--ink-soft);
  font-size:1rem;
  line-height:1.55;
}
main[data-promotion-page="true"] > .promotion-essentials > ul > li:nth-child(6){
  grid-column:1 / -1;
}
main[data-promotion-page="true"] > .promotion-essentials > ul > li strong{
  display:block;
  margin-bottom:3px;
  color:var(--muted-2);
  font-size:.72rem;
  font-weight:800;
  line-height:1.3;
  letter-spacing:.07em;
  text-transform:uppercase;
}
main[data-promotion-page="true"] > .promotion-essentials > p:last-child{
  margin-top:20px;
}
main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a{
  min-height:52px;
  padding:12px 19px;
  border:1px solid var(--brand-dark);
  border-radius:13px;
  background:var(--brand);
  color:#fff;
  font-size:.98rem;
  font-weight:800;
  box-shadow:0 9px 22px rgba(185,28,28,.18);
}
main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a:hover{
  transform:translateY(-1px);
  background:var(--brand-dark);
  box-shadow:0 12px 26px rgba(185,28,28,.23);
}
main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a:focus-visible,
main[data-promotion-page="true"] > .related-links a:focus-visible,
main[data-promotion-page="true"] > .faq-list summary:focus-visible,
main[data-promotion-page="true"] > .guide-section:last-of-type a:focus-visible{
  outline:3px solid var(--focus);
  outline-offset:3px;
}

/* Related pages: compact navigation cards with clearer affordance. */
main[data-promotion-page="true"] > .related-links{
  border-color:var(--line-strong);
  background:linear-gradient(145deg,var(--brand-soft),rgba(255,255,255,.92) 78%);
}
main[data-promotion-page="true"] > .related-links > p{
  max-width:700px;
  margin-bottom:18px;
  line-height:1.7;
}
main[data-promotion-page="true"] > .related-links ul{
  gap:10px;
}
main[data-promotion-page="true"] > .related-links a{
  min-height:56px;
  padding:12px 14px;
  border-color:var(--line-strong);
  border-radius:12px;
  background:rgba(255,255,255,.82);
  font-size:.94rem;
  font-weight:700;
}
main[data-promotion-page="true"] > .related-links a:hover{
  transform:translateY(-1px);
  box-shadow:0 7px 18px rgba(65,18,18,.07);
}

/* Official sources: make outbound verification links easier to identify and tap. */
main[data-promotion-page="true"] > .guide-section:last-of-type ul{
  display:grid;
  gap:8px;
  padding:0;
  list-style:none;
}
main[data-promotion-page="true"] > .guide-section:last-of-type ul > li{
  margin:0;
}
main[data-promotion-page="true"] > .guide-section:last-of-type ul a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-height:48px;
  padding:10px 13px;
  border:1px solid var(--line);
  border-radius:11px;
  background:var(--paper);
  color:var(--ink-soft);
  font-weight:700;
  text-decoration:none;
}
main[data-promotion-page="true"] > .guide-section:last-of-type ul a:after{
  content:"↗";
  flex:0 0 auto;
  color:var(--brand);
  font-weight:900;
}
main[data-promotion-page="true"] > .guide-section:last-of-type ul a:hover{
  border-color:var(--brand);
  background:var(--brand-soft);
  color:var(--brand-dark);
}

/* FAQ: each question is a distinct, comfortable touch target. */
main[data-promotion-page="true"] > .faq-list{
  margin-bottom:clamp(24px,4vw,42px);
}
main[data-promotion-page="true"] > .faq-list details{
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.7);
}
main[data-promotion-page="true"] > .faq-list details + details{
  margin-top:9px;
}
main[data-promotion-page="true"] > .faq-list details:last-child{
  border-bottom:1px solid var(--line);
}
main[data-promotion-page="true"] > .faq-list summary{
  min-height:56px;
  padding:14px 14px;
  font-size:.98rem;
  font-weight:700;
}
main[data-promotion-page="true"] > .faq-list summary:after{
  width:28px;
  height:28px;
}
main[data-promotion-page="true"] > .faq-list details[open]{
  border-color:var(--line-strong);
  background:var(--paper);
}
main[data-promotion-page="true"] > .faq-list details p{
  max-width:720px;
  padding:0 52px 16px 14px;
  font-size:.98rem;
  line-height:1.72;
}

/* Dark mode parity. */
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .page-hero .micro{
  border-color:#573333;
  background:rgba(33,24,24,.78);
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .guide-section,
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .faq-list{
  border-color:#432929;
  background:rgba(31,23,23,.9);
  box-shadow:0 10px 28px rgba(0,0,0,.18);
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .promotion-essentials,
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .related-links{
  border-color:#5c3535;
  background:linear-gradient(145deg,#291919 0%,#211818 78%);
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .promotion-essentials > ul > li,
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .faq-list details,
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .guide-section:last-of-type ul a,
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .related-links a{
  border-color:#493030;
  background:#1b1414;
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .faq-list details[open]{
  border-color:#654141;
  background:#241919;
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .guide-section ol > li:before{
  border-color:#573333;
  background:#321d1d;
  color:#fca5a5;
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a{
  border-color:#ef4444;
  background:#dc2626;
  box-shadow:0 9px 22px rgba(0,0,0,.24);
}
html[data-theme="dark"] body:not(.language-landing) main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a:hover{
  background:#ef4444;
}

@media (max-width:760px){
  main[data-promotion-page="true"] > .page-hero{
    padding-top:28px;
    padding-bottom:30px;
  }
  main[data-promotion-page="true"] > .page-hero.has-page-icon{
    padding-right:0;
  }
  main[data-promotion-page="true"] > .page-hero .page-icon{
    width:72px;
    margin-bottom:20px;
    border-radius:20px;
    transform:rotate(2deg);
    font-size:2.15rem;
    box-shadow:0 10px 25px rgba(65,18,18,.1),4px 5px 0 rgba(185,28,28,.11);
  }
  main[data-promotion-page="true"] > .page-hero .crumbs{
    margin-bottom:16px;
  }
  main[data-promotion-page="true"] > .page-hero .micro{
    margin-bottom:13px;
    padding:7px 9px;
    font-size:.69rem;
  }
  main[data-promotion-page="true"] > .page-hero h1{
    font-size:clamp(2.02rem,8.5vw,2.6rem);
    line-height:1.105;
  }
  main[data-promotion-page="true"] > .page-hero .hero-lede,
  main[data-promotion-page="true"] > .page-hero > p:not(.micro){
    margin-top:17px;
    font-size:1rem;
    line-height:1.7;
  }
  main[data-promotion-page="true"] > .guide-section,
  main[data-promotion-page="true"] > .faq-list{
    margin-top:14px;
    padding:21px 17px 22px;
    border-radius:17px;
    box-shadow:0 6px 18px rgba(65,18,18,.045);
  }
  main[data-promotion-page="true"] > .promotion-essentials{
    margin-top:23px;
    padding-top:24px;
  }
  main[data-promotion-page="true"] > .guide-section h2,
  main[data-promotion-page="true"] > .faq-list h2{
    margin-bottom:17px;
    padding-left:13px;
    font-size:clamp(1.45rem,6vw,1.72rem);
    line-height:1.22;
  }
  main[data-promotion-page="true"] > .guide-section h2:before,
  main[data-promotion-page="true"] > .faq-list h2:before{
    width:3px;
  }
  main[data-promotion-page="true"] > .guide-section h3{
    margin-top:23px;
    font-size:1.13rem;
  }
  main[data-promotion-page="true"] > .guide-section p{
    font-size:1rem;
    line-height:1.72;
  }
  main[data-promotion-page="true"] > .guide-section ul,
  main[data-promotion-page="true"] > .guide-section ol{
    font-size:1rem;
    line-height:1.68;
  }
  main[data-promotion-page="true"] > .guide-section ol > li{
    padding-left:40px;
  }
  main[data-promotion-page="true"] > .guide-section ol > li:before{
    width:28px;
    height:28px;
    border-radius:9px;
  }
  main[data-promotion-page="true"] > .promotion-essentials > ul{
    grid-template-columns:1fr;
    gap:7px;
  }
  main[data-promotion-page="true"] > .promotion-essentials > ul > li:nth-child(6){
    grid-column:auto;
  }
  main[data-promotion-page="true"] > .promotion-essentials > ul > li{
    padding:11px 12px;
  }
  main[data-promotion-page="true"] > .promotion-essentials > p:last-child > a{
    width:100%;
    min-height:52px;
    border-radius:12px;
  }
  main[data-promotion-page="true"] > .related-links a,
  main[data-promotion-page="true"] > .guide-section:last-of-type ul a{
    min-height:50px;
  }
  main[data-promotion-page="true"] > .faq-list summary{
    min-height:54px;
    padding:13px 12px;
  }
  main[data-promotion-page="true"] > .faq-list details p{
    padding:0 12px 15px;
    font-size:1rem;
  }
}

@media (max-width:420px){
  main[data-promotion-page="true"] > .guide-section,
  main[data-promotion-page="true"] > .faq-list{
    padding:19px 15px 20px;
    border-radius:15px;
  }
  main[data-promotion-page="true"] > .page-hero h1{
    font-size:2rem;
  }
}

@media (prefers-reduced-motion:reduce){
  main[data-promotion-page="true"] a,
  main[data-promotion-page="true"] summary{
    transition:none!important;
  }
}

/* 2026-08-09 — Individual promotion pages: keep hero icon inside its grid column. */
main[data-promotion-page="true"] > .page-hero.has-page-icon{
  padding-right:0;
}
main[data-promotion-page="true"] > .page-hero .page-icon{
  right:auto;
  top:auto;
  width:clamp(68px,7vw,86px);
  margin:0;
  transform:rotate(2deg);
  border-radius:24px;
  font-size:clamp(1.9rem,3.2vw,2.45rem);
  box-shadow:0 12px 28px rgba(65,18,18,.10),5px 6px 0 rgba(185,28,28,.11);
}

@media (max-width:760px){
  main[data-promotion-page="true"] > .page-hero .page-icon{
    width:48px;
    margin:2px 0 0;
    border-radius:16px;
    font-size:1.45rem;
    box-shadow:0 8px 18px rgba(65,18,18,.09),3px 4px 0 rgba(185,28,28,.10);
  }
}