/* Wordscapes Solitaire homepage — Karol's approved design (4 Nov 2026), applied as given. Fonts self-hosted (same families). */
@font-face{font-family:"Fraunces";font-style:normal;font-weight:500 900;font-display:swap;src:url(/wordscapes-solitaire/assets/fonts/fraunces-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:500 900;font-display:swap;src:url(/wordscapes-solitaire/assets/fonts/fraunces-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Fraunces";font-style:italic;font-weight:600 800;font-display:swap;src:url(/wordscapes-solitaire/assets/fonts/fraunces-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";font-style:italic;font-weight:600 800;font-display:swap;src:url(/wordscapes-solitaire/assets/fonts/fraunces-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Sora";font-style:normal;font-weight:400 800;font-display:swap;src:url(/wordscapes-solitaire/assets/fonts/sora-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Sora";font-style:normal;font-weight:400 800;font-display:swap;src:url(/wordscapes-solitaire/assets/fonts/sora-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500 800;font-display:swap;src:url(/wordscapes-solitaire/assets/fonts/jetbrains-mono-normal-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500 800;font-display:swap;src:url(/wordscapes-solitaire/assets/fonts/jetbrains-mono-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
  --navy-950:#060a1c; --navy-900:#0b1230; --navy-800:#141c48;
  --red:#ef233c; --red-d:#a2001d; --red-lt:#ff5b6e;
  --blue:#2c5df0; --blue-d:#102a7a;
  --gold:#ffd23f; --gold-d:#c98a00;
  --green:#22c55e; --green-d:#15803d;
  --pink:#ec4899; --pink-d:#a3195b;
  --purple:#8b5cf6; --purple-d:#5b2fc9;
  --teal:#06b6d4; --teal-d:#0e6e82;
  --white:#f3f6ff; --ink-soft:#d7deff;
  --line:rgba(255,255,255,.1);
  --font-dh:"Fraunces",serif; --font-b:"Sora",sans-serif; --font-m:"JetBrains Mono",monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy-950);color:var(--white);font-family:var(--font-b);-webkit-font-smoothing:antialiased;overflow-x:hidden}
.wrap{max-width:900px;margin:0 auto;padding:0 28px}
a{text-decoration:none;color:inherit}
button{font:inherit;cursor:pointer;border:none}
input{font:inherit}

@keyframes float{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-24px) scale(1.07)}}
@keyframes drift{from{background-position:0 0}to{background-position:-800px 500px}}
@keyframes shimmer{0%{transform:translateX(-120%) skewX(-18deg)}100%{transform:translateX(220%) skewX(-18deg)}}
@keyframes ringpulse{0%,100%{box-shadow:0 0 0 0 rgba(236,72,153,.5)}50%{box-shadow:0 0 0 10px rgba(236,72,153,0)}}

.shine{position:relative;overflow:hidden}
.shine::after{content:"";position:absolute;top:0;left:0;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);animation:shimmer 3.2s ease-in-out infinite}
.stars{position:absolute;inset:0;opacity:.5;background-image:
  radial-gradient(1.6px 1.6px at 15% 25%,#fff,transparent),
  radial-gradient(1.6px 1.6px at 65% 15%,#fff,transparent),
  radial-gradient(1.2px 1.2px at 85% 55%,#fff,transparent),
  radial-gradient(1.2px 1.2px at 35% 70%,#fff,transparent);
  background-size:340px 340px;animation:drift 100s linear infinite}

/* NAV */
.nav{position:sticky;top:0;z-index:60;background:rgba(6,10,28,.93);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-in{max-width:1180px;margin:0 auto;padding:13px 28px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-dh);font-weight:800;font-size:18px;letter-spacing:-.01em;color:#fff;flex-shrink:0}
.brand .mark{width:28px;height:28px;border-radius:9px;background:linear-gradient(140deg,var(--red-lt),var(--red) 50%,var(--blue-d));display:flex;align-items:center;justify-content:center;flex-shrink:0}
.brand .mark::after{content:"\2605";color:#fff;font-size:11px}
.tabs{display:flex;align-items:center;gap:3px;flex:1;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{flex-shrink:0;white-space:nowrap;font-family:var(--font-b);font-weight:700;font-size:12.5px;color:var(--ink-soft);padding:8px 13px;border-radius:999px}
.tab.on{color:var(--navy-950);background:linear-gradient(120deg,var(--gold),#fff0b0);box-shadow:0 8px 18px -8px rgba(255,210,63,.55)}
.nav-cta{flex-shrink:0;font-family:var(--font-m);font-weight:700;font-size:11.5px;color:#fff;background:rgba(255,255,255,.08);border:1px solid var(--line);padding:9px 16px;border-radius:999px}

.bcrow{position:relative;z-index:2;max-width:1180px;margin:0 auto;padding:12px 28px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-family:var(--font-m);font-weight:700;font-size:11.5px;background:rgba(255,255,255,.03);border-bottom:1px solid var(--line)}
.bcrow a{color:#6a8dff}
.bcrow .sep{color:#5c669a}
.bcrow .here{color:var(--pink)}

/* HERO */
.hero{position:relative;overflow:hidden;background:
  radial-gradient(1100px 600px at 85% -15%,rgba(236,72,153,.22),transparent 60%),
  radial-gradient(900px 560px at -10% 100%,rgba(139,92,246,.25),transparent 60%),
  linear-gradient(180deg,var(--navy-900),var(--navy-950));
  padding:30px 0 10px}
.blob{position:absolute;border-radius:50%;filter:blur(90px);mix-blend-mode:screen;opacity:.55;animation:float 13s ease-in-out infinite}
.blob.b1{width:420px;height:420px;background:var(--pink);top:-180px;right:-100px}
.blob.b2{width:360px;height:360px;background:var(--purple);bottom:-220px;left:-100px;animation-delay:-6s}
.hero-in{position:relative;z-index:2}
h1.head{font-family:var(--font-dh);font-weight:800;font-size:34px;line-height:1.1;letter-spacing:-.02em;color:#fff;margin:0}
h1.head .accent{display:block;font-style:italic;font-weight:700;background:linear-gradient(100deg,var(--pink),var(--purple) 60%,var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent}

/* SECTIONS */
.sec{padding:34px 0}
h2.sh{font-family:var(--font-dh);font-weight:800;font-size:26px;letter-spacing:-.01em;color:#fff;margin:0 0 16px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#find-book h2.sh{margin-bottom:4px}
.sh .glow{background:linear-gradient(100deg,var(--pink),var(--gold) 55%,var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent;font-style:italic;font-family:var(--font-dh)}
.subt{display:block;font-family:var(--font-m);font-weight:700;font-size:13px;color:var(--teal);margin:0 0 16px}
.bodytext{color:var(--ink-soft);font-weight:600;font-size:14.5px;line-height:1.8;margin:10px 0}
.bodytext a{color:var(--gold);text-decoration:underline}

/* FINDER (Lost Word Finder) */
.findercard-outer{padding:3px;border-radius:19px;background:linear-gradient(120deg,var(--pink),var(--purple),var(--teal));box-shadow:0 24px 48px -24px rgba(236,72,153,.4);animation:ringpulse 3.4s infinite}
.findercard{background:var(--navy-900);border-radius:16px;padding:26px}
.flabel{display:block;font-family:var(--font-m);font-weight:800;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.lettersbox{width:100%;border:2px solid var(--line);background:var(--navy-950);border-radius:12px;outline:none;font-family:var(--font-m);font-weight:800;font-size:15px;letter-spacing:.07em;color:var(--pink);padding:13px 15px;text-transform:uppercase}
.lettersbox.lb-teal{color:var(--teal)}
.lettersbox:focus{border-color:var(--gold)}
.lettersbox::placeholder{color:#8f98c7;letter-spacing:.02em;text-transform:none}
.fgap{margin-top:16px}
.fbtnrow{display:flex;gap:10px;margin-top:18px}
.fbtn{font-family:var(--font-m);font-weight:800;font-size:13px;color:var(--navy-950);background:linear-gradient(120deg,var(--gold),#fff0b0);padding:12px 24px;border-radius:11px;box-shadow:0 10px 20px -8px rgba(255,210,63,.55);display:inline-flex;align-items:center;gap:7px}
.fbtn.ghost{color:#fff;background:rgba(255,255,255,.08);border:1px solid var(--line);box-shadow:none}
.fmeta{margin:14px 0 0;font-family:var(--font-m);font-size:12.5px;color:var(--teal);font-weight:700;min-height:16px}
.resultlist{margin:10px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.resultlist .wd a{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-family:var(--font-m);font-size:12.5px;font-weight:800;color:var(--pink);letter-spacing:.06em}
.resultlist .wd a:hover{border-color:var(--pink)}
.resultlist .wbook{color:var(--ink-soft);font-weight:600;letter-spacing:0;font-size:12px;text-align:right}
.moreline{margin:12px 0 0}

/* LIBRARY search (single-row finder) */
#lsearch .findercard-outer{background:linear-gradient(120deg,var(--pink),var(--gold),var(--purple))}
#lsearch .findercard{padding:18px;display:flex;gap:10px;flex-wrap:wrap}
#lsearch .lettersbox{flex:1;min-width:200px;width:auto;font-weight:700;font-size:14px;letter-spacing:.03em;color:var(--white);text-transform:none}
#lsearch .fbtn{padding:13px 22px;border-radius:12px;white-space:nowrap}
#lsearch-msg{margin-top:12px;color:var(--red-lt)}

/* PATTERN LIST */
.patternlist{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.patternrow{display:flex;gap:10px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line)}
.patternrow:last-child{border-bottom:none}
.pcode{font-family:var(--font-m);font-weight:800;font-size:13.5px;color:var(--gold);min-width:60px}
.pdesc{font-size:13.5px;color:var(--ink-soft);font-weight:600}

/* SHELF LIST = the 23 native Library disclosures (V1.4) */
.shelflist{display:flex;flex-direction:column;gap:9px}
.wss-libgrp{border-radius:13px;background:linear-gradient(160deg,rgba(236,72,153,.08),rgba(139,92,246,.08));border:1px solid var(--line);transition:border-color .15s, transform .15s}
.wss-libgrp:hover,.wss-libgrp[open]{border-color:var(--pink)}
.wss-libgrp:not([open]):hover{transform:translateX(3px)}
.wss-libgrp summary{list-style:none;cursor:pointer;padding:15px 18px}
.wss-libgrp summary::-webkit-details-marker{display:none}
.wss-libgrp .mhead{display:flex;align-items:center;justify-content:space-between;gap:12px;scroll-margin-top:90px}
.wss-libgrp .mhead h3{margin:0;font-family:var(--font-b);font-weight:800;font-size:14.5px;color:#fff}
.wss-libgrp .mhead .ln{flex:1;height:1px;background:repeating-linear-gradient(90deg,var(--line) 0 4px,transparent 4px 8px);margin:0 4px}
.wss-libgrp .mhead .mc{font-family:var(--font-m);font-weight:700;font-size:12px;color:var(--gold);white-space:nowrap}
.wss-libgrp .mhead .mc::after{content:" \25BE";color:var(--ink-soft)}
.wss-libgrp[open] .mhead .mc::after{content:" \25B4"}
.lbgrid{list-style:none;margin:0;padding:0 18px 18px;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.lbcard{display:block;height:100%;padding:13px 15px;border-radius:11px;background:var(--navy-900);border:1px solid var(--line)}
.lbcard:hover{border-color:var(--gold)}
.lbcard .lbn{display:block;font-family:var(--font-m);font-weight:800;font-size:12.5px;color:var(--pink)}
.lbcard .lbw{display:block;font-family:var(--font-m);font-weight:700;font-size:11px;color:var(--gold);margin-top:3px}
.lbcard p{margin:8px 0 0;font-size:12.5px;line-height:1.5;color:var(--ink-soft);font-weight:600}
.lbcard p b{color:#fff}

.btnrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.pbtn{font-family:var(--font-m);font-weight:800;font-size:12.5px;color:var(--navy-950);background:linear-gradient(120deg,var(--gold),#fff0b0);padding:12px 20px;border-radius:11px;box-shadow:0 10px 20px -8px rgba(255,210,63,.55)}
.pbtn.ghost{color:#fff;background:rgba(255,255,255,.08);border:1px solid var(--line);box-shadow:none}

.divider{display:flex;align-items:center;justify-content:center;margin:6px 0 26px}
.divider .diamond{width:9px;height:9px;transform:rotate(45deg);background:linear-gradient(135deg,var(--pink),var(--teal));box-shadow:0 0 14px rgba(236,72,153,.6)}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line);max-width:300px}
.divider .diamond{margin:0 14px}

/* FAQ */
.faqgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.faqcard{padding:18px 20px;border-radius:15px;background:linear-gradient(160deg,var(--g1),var(--g2));box-shadow:0 16px 28px -16px var(--g1)}
.faqcard .qrow{display:flex;align-items:flex-start;gap:9px}
.faqcard .qmark{flex-shrink:0;width:27px;height:27px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13.5px;color:#fff}
.faqcard h3{font-family:var(--font-b);font-weight:800;font-size:14px;color:#fff;margin:0 0 6px;line-height:1.4}
.faqcard p{font-size:12.5px;color:rgba(255,255,255,.92);font-weight:600;line-height:1.6;margin:0}

.srcnote{margin-top:24px;text-align:center;font-size:12px;color:var(--ink-soft);font-weight:600;line-height:1.7}
.srcnote a{color:var(--gold);text-decoration:underline}

/* FOOTER */
.foot{background:var(--navy-950);color:rgba(255,255,255,.65);padding:40px 0 26px;margin-top:10px;border-top:5px solid;border-image:linear-gradient(90deg,var(--pink),var(--gold),var(--purple),var(--gold),var(--pink)) 1}
.foot .wrap.footwrap{max-width:1040px;margin:0 auto;padding:0 28px}
.footgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px}
@media(max-width:720px){.footgrid{grid-template-columns:1fr}}
.footbrand{display:flex;align-items:center;gap:9px;font-family:var(--font-dh);font-weight:800;font-size:16px;color:#fff;margin-bottom:10px}
.footbrand .mark{width:24px;height:24px;border-radius:8px;background:linear-gradient(140deg,var(--red-lt),var(--red) 50%,var(--blue-d))}
.footdesc{font-size:12.5px;line-height:1.7;max-width:340px}
.footdesc a{color:var(--gold);text-decoration:underline}
.footcol h4{font-family:var(--font-m);font-weight:700;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin:0 0 12px}
.footcol a{display:block;font-size:13px;font-weight:600;color:rgba(255,255,255,.75);margin-bottom:9px}
.footcol a:hover{color:#fff}
.footbottom{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);font-size:11.5px;color:rgba(255,255,255,.45);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:6px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
@media(max-width:560px){h1.head{font-size:27px}h2.sh{font-size:21px}#lsearch .findercard{flex-direction:column}#lsearch .fbtn{width:100%;justify-content:center}#lsearch .lettersbox{min-width:0;width:100%}}

/* integration */
[data-ico]::before{content:attr(data-ico)}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--gold);color:var(--navy-950);padding:10px 14px;border-radius:10px;font-weight:800}
.skip:focus{left:8px}
.tab span{font-size:12px}
@media(max-width:640px){.nav-in{gap:10px 14px}.tabs{order:3;flex-basis:100%}.findercard{padding:20px 18px}.faqgrid{grid-template-columns:1fr}.resultlist .wd a{flex-wrap:wrap}}
@media(max-width:380px){.wrap,.foot .wrap.footwrap,.bcrow{padding-left:16px;padding-right:16px}.fbtn{padding:12px 18px}.lbgrid{grid-template-columns:1fr}}

[hidden]{display:none!important}
.findercard-outer + .bodytext{margin-top:20px}

@media(max-width:640px){.bookcard,.wss-libgrp .mhead{scroll-margin-top:var(--kd-navh,150px)}}
/* ===== Library Rewards (Karol design) — on top of the shared Finder/Library design layer ===== */
h2.sh{margin:0 0 8px}
.bodytext{margin:0 0 18px}
.introtext{color:var(--ink-soft);font-weight:600;font-size:14.5px;line-height:1.8;margin:14px 0 0;max-width:640px;position:relative;z-index:2}
#find-reward .findercard-outer{background:linear-gradient(120deg,var(--pink),var(--gold),var(--purple))}
#find-reward .findercard{padding:24px}
.flabel{margin-bottom:9px}
.ffrow{display:flex;gap:10px;flex-wrap:wrap}
.ffrow .lettersbox{flex:1;min-width:200px;width:auto;font-weight:700;font-size:14.5px;letter-spacing:0;color:var(--white);text-transform:none}
.ffrow .fbtn{padding:13px 24px;border-radius:12px;white-space:nowrap}
.fbtnrow{margin-top:14px}
.fmeta{margin-top:16px}
#wss-reward-results ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
#wss-reward-results li{background:linear-gradient(135deg,var(--purple-d),var(--pink-d));border-radius:13px;padding:16px 18px}
#wss-reward-results li a{display:block;font-family:var(--font-dh);font-weight:800;font-size:17px;color:#fff;margin:0 0 6px;text-decoration:underline;text-decoration-color:rgba(255,255,255,.35);text-underline-offset:3px}
#wss-reward-results li small{display:block;font-family:var(--font-m);font-size:12px;font-weight:700;color:rgba(255,255,255,.9);padding:4px 0;border-top:1px solid rgba(255,255,255,.15)}
#wss-reward-results li a + small{border-top:none}

/* the 19 reward groups = the design's coloured shelf rows (native exclusive disclosures, all closed by default) */
.rwlist{display:flex;flex-direction:column;gap:9px}
.rwlist details{--c1:var(--gold-d);--c2:var(--gold);border-radius:13px;background:linear-gradient(160deg,var(--c1),var(--c2));border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 22px -14px var(--c1);transition:transform .15s}
.rwlist details:nth-child(5n+2){--c1:var(--teal-d);--c2:var(--teal)}
.rwlist details:nth-child(5n+3){--c1:var(--pink-d);--c2:var(--pink)}
.rwlist details:nth-child(5n+4){--c1:var(--purple-d);--c2:var(--purple)}
.rwlist details:nth-child(5n+5){--c1:var(--green-d);--c2:var(--green)}
.rwlist details:not([open]):hover{transform:translateX(3px)}
.wss-disc summary{list-style:none;cursor:pointer;padding:15px 18px;font-family:var(--font-b);font-weight:800;font-size:14.5px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px}
.wss-disc summary::-webkit-details-marker{display:none}
.wss-disc summary::after{content:"\25BE";font-family:var(--font-m);font-size:12px;color:#fff;background:rgba(6,10,28,.3);padding:5px 11px;border-radius:999px}
.wss-disc[open] summary::after{content:"\25B4"}
.wss-disc .catbl-wrap{margin:0 12px 12px;background:var(--navy-900);border-radius:11px;overflow-x:auto}

/* coin / booster = the design's big stat cards */
.bigstat{border-radius:16px;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 20px 38px -20px var(--c1)}
.bigstat.coin{--c1:var(--gold-d);--c2:var(--gold)}
.bigstat.boost{--c1:var(--purple-d);--c2:var(--purple)}
.bigstat summary{padding:20px 22px;font-size:15px}

/* tables */
.catbl{width:100%;border-collapse:collapse;font-size:13px}
.catbl th{text-align:left;font-family:var(--font-m);font-weight:800;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);padding:11px 14px;border-bottom:1px solid var(--line)}
.catbl td{padding:10px 14px;border-bottom:1px solid var(--line);color:var(--ink-soft);font-weight:600}
.catbl tr:last-child td{border-bottom:none}
.catbl td a{color:#fff;font-weight:800}
.catbl td a:hover{color:var(--gold)}
@media(max-width:560px){
  .ffrow{flex-direction:column}.ffrow .fbtn{width:100%;justify-content:center}.ffrow .lettersbox{min-width:0;width:100%}
  .catbl thead{display:none}.catbl tr{display:block;padding:10px 14px;border-bottom:1px solid var(--line)}.catbl tr:last-child{border-bottom:none}
  .catbl td{display:flex;justify-content:space-between;gap:12px;padding:3px 0;border:none}.catbl td::before{content:attr(data-l);font-family:var(--font-m);font-size:10.5px;font-weight:800;color:var(--gold);text-transform:uppercase}
}
/* ===== Lost Words by length pages (Karol design) — on top of the shared layer + rewards form/disclosure styles ===== */
h2.sh{font-size:25px;margin:0 0 6px}
.sec{padding:30px 0}
.bodytext{font-size:14px;line-height:1.75;margin:0 0 16px}
#find-length .findercard{padding:22px}
.ffrow .lettersbox.lb-up{font-weight:800;letter-spacing:.05em;color:var(--pink);text-transform:uppercase}
.ffrow .lettersbox.lb-up::placeholder{text-transform:none}
#wss-length-results ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
#wss-length-results li a{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;padding:10px 14px;font-family:var(--font-m);font-size:12.5px;font-weight:800;color:var(--pink);letter-spacing:.06em}
#wss-length-results li a:hover{border-color:var(--pink)}
#wss-length-results li small{color:var(--ink-soft);font-weight:600;letter-spacing:0;text-align:right}
#wss-length-results li small::after{content:" \203A"}

/* A–Z jump */
.azjump{display:flex;flex-wrap:wrap;gap:7px;margin:22px 0 0}
.azjc{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-family:var(--font-m);font-weight:800;font-size:13px;color:#fff;background:rgba(255,255,255,.08);border:1px solid var(--line);transition:all .15s}
a.azjc:hover{background:linear-gradient(120deg,var(--gold),#fff0b0);color:var(--navy-950);transform:translateY(-2px)}
.azjc.off{opacity:.3;cursor:default}

/* the letter groups = the design's coloured alphabet rows (closed native disclosures holding every word link) */
.alist{display:flex;flex-direction:column;gap:9px}
.alist details{--c1:var(--gold-d);--c2:var(--gold);scroll-margin-top:90px;border-radius:13px;background:linear-gradient(160deg,var(--c1),var(--c2));border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 22px -14px var(--c1);transition:transform .15s}
.alist details:nth-child(5n+2){--c1:var(--teal-d);--c2:var(--teal)}
.alist details:nth-child(5n+3){--c1:var(--pink-d);--c2:var(--pink)}
.alist details:nth-child(5n+4){--c1:var(--purple-d);--c2:var(--purple)}
.alist details:nth-child(5n+5){--c1:var(--green-d);--c2:var(--green)}
.alist details:not([open]):hover{transform:translateX(3px)}
.alist .wss-disc summary::after{content:"Open \203A";font-weight:800}
.alist .wss-disc[open] summary::after{content:"Close \2715"}
.aztags{display:flex;flex-wrap:wrap;gap:8px;margin:0 12px 12px;padding:14px;background:var(--navy-900);border-radius:11px}
.aztag{font-family:var(--font-m);font-weight:800;font-size:12.5px;letter-spacing:.04em;color:#fff;background:rgba(255,255,255,.07);border:1px solid var(--line);padding:7px 12px;border-radius:9px;transition:transform .12s,border-color .12s}
.aztag:hover{border-color:var(--gold);transform:translateY(-2px)}
.pbtn{display:inline-block}
@media(max-width:640px){.alist details{scroll-margin-top:150px}}
/* ===== PEAK SEO/UX finalization (4 Nov 2026) — UX-1..UX-6, appended to every Wordscapes Solitaire stylesheet (scoped: only these pages load it) ===== */
/* UX-3 keyboard focus */
:focus-visible,.kd summary:focus-visible,.kd a:focus-visible,.kd button:focus-visible,.kd input:focus-visible,.kd [tabindex]:focus-visible{outline:2px solid #FFE17B!important;outline-offset:2px!important}
/* UX-5 fragments: scroll-margin-top = sticky header height + 12px (header: 62px desktop, 104px two-row mobile, 142px three-row narrow) */
/* fallback values = measured header height + 12px; wsol.js sets the exact live value */
:root{--kd-smt:83px}
@media(max-width:640px){:root{--kd-smt:137px}}
@media(max-width:360px){:root{--kd-smt:175px}}
.kd [id]{scroll-margin-top:var(--kd-smt)!important}
.kd .dwtbl td.tdate{position:relative}.kd .dwtbl span[id^="d-"]{position:absolute!important;top:0;left:0;width:1px;height:1px;scroll-margin-top:var(--kd-smt)!important}
/* UX-2 search action rows (Rewards + 2–9-letter pages): input, primary, Clear on one row from 768px */
@media(min-width:768px){
  .kd .ffrow{flex-wrap:nowrap!important;gap:12px!important;align-items:stretch}
  .kd .ffrow .lettersbox{flex:1 1 auto;min-width:0!important;width:auto!important}
  .kd .ffrow .fbtn{flex:0 0 auto;width:auto!important}
}
.kd .ffrow{gap:12px}
.kd .ffrow .lettersbox,.kd .ffrow .fbtn{min-height:44px}
@media(max-width:767px){.kd .ffrow{flex-wrap:wrap}.kd .ffrow .lettersbox{flex:1 1 100%;min-width:0!important;width:100%!important}.kd .ffrow .fbtn{flex:1 1 auto;justify-content:center}}
/* UX-4 practical targets (~44px) */
.kd .tab,.kd .nav-cta{min-height:44px;display:inline-flex;align-items:center}
.kd .btnlink,.kd .pbtn,.kd .qbtn,.kd .fbtn,.kd .slv-go,.kd .slv-clear,.kd .go,.kd .pcta,.kd .shelfchip,.kd .uplink,.kd .nextbtn,.kd .pagebtn,.kd .tlink{min-height:44px;display:inline-flex;align-items:center}
.kd .azjump{gap:8px}
.kd .azjc{width:44px;height:44px}
.kd .bk-word,.kd .aztag{min-height:40px;display:inline-flex;align-items:center}
.kd .wss-disc summary,.kd .slv-adv summary{min-height:44px}
.kd .wbtns{margin-top:18px;justify-content:center}

/* focus ring must not be animated by 'transition:all' */
.kd .shelfchip,.kd .azjc,.kd .shelfrow,.kd .wss-libgrp,.kd .bk-word,.kd .aztag,.kd .lcard,.kd .rcard,.kd .acard,.kd .gcard,.kd .rngcard{transition-property:background,background-color,color,border-color,transform,box-shadow!important}
/* ===== UX-1 contrast (mission spec): opaque inset #0B1430 / #FFFFFF / radius 8px / padding 4px 8px — only behind text that fails
   against the worst point of its gradient. Gradients themselves are unchanged. ===== */
.kd .ins,
.kd .bookcard .bkname,.kd .bookcard .bkdesc,.kd .bookcard .lgtitle,
.kd .toolcard h3,.kd .toolcard p,.kd .toolcard .tlink,
.kd-home .gcard h3,.kd-home .gcard p,.kd-home .gcard .gnum,
.kd .faqcard h3,.kd .faqcard p,
.kd .latestcard .ldate b,.kd .latestcard .lmeta,
.kd .rcard .rday,.kd .rcard .rdate,.kd .rcard .rword,.kd .rcard .rlen,
.kd .acard .arange,.kd .acard .acount,
.kd .lcard .lnum,.kd .lcard .llabel,.kd .lcard .lcount,.kd .lcard .lbrowse,
.kdg .gcard h3,.kdg .gcard p,.kdg .hx-step h3,.kdg .hx-step p,.kdg .hx-step .num,
.kdg .faqc h3,.kdg .faqc p,.kdg .evcard h3,.kdg .evcard p,
.kdg .rngcard .rc-lvl,.kdg .rngcard .rc-span,
.kdg .loccard .loc-title,.kdg .loccard .loc-meta,.kdg .loccard .loc-region,.kdg .loccard .loc-body{
  background:#0B1430!important;color:#FFFFFF!important;border-radius:8px!important;padding:4px 8px!important;
  -webkit-text-fill-color:#FFFFFF;text-shadow:none!important}
/* block-level text keeps its own line; inline labels shrink to their text */
.kd .bookcard .bkname,.kd .bookcard .bkdesc,.kd .toolcard h3,.kd .toolcard p,.kd-home .gcard h3,.kd-home .gcard p,.kd .faqcard h3,.kd .faqcard p,
.kdg .gcard h3,.kdg .gcard p,.kdg .hx-step h3,.kdg .hx-step p,.kdg .faqc p,.kdg .evcard h3,.kdg .evcard p,.kd .acard .arange,
.kdg .loccard .loc-meta,.kdg .loccard .loc-region,.kdg .loccard .loc-body,.kdg .rngcard .rc-lvl,.kdg .rngcard .rc-span{display:table!important;max-width:100%}
.kd .rcard .rday,.kd .rcard .rdate,.kd .rcard .rword,.kd .rcard .rlen,.kd .lcard .lnum,.kd .lcard .llabel,.kd .lcard .lcount,.kd .bookcard .lgtitle,.kd .latestcard .ldate b,.kd .latestcard .lmeta,.kd .ins{display:inline-block}
.kd .rcard>span{margin-bottom:4px}
.kdg .faqc h3{display:flex!important;align-items:center}
.kdg .faqc p{margin-top:6px!important}
.kd .bookcard .bktop{align-items:flex-start}
.kd .gcard p,.kd .faqcard p,.kd .toolcard p,.kdg .faqc p,.kdg .evcard p{margin-top:6px}
.kdg .loccard p{margin-top:6px!important}
/* tag/pill elements whose own background is the gradient: navy inset fill, colour kept as a 2px edge */
.kd .tlen{background:#0B1430!important;color:#fff!important;border:2px solid var(--c2)}
.kdg .lp{background:#0B1430!important;color:#fff!important;border:2px solid var(--teal)}
.kdg .lp2{border-color:var(--pink)}.kdg .lp5{border-color:var(--purple)}.kdg .lp0{border-color:var(--gold)}.kdg .lp1{border-color:var(--green)}
.kdg .btag{background:#0B1430!important;color:#fff!important;border:2px solid var(--purple)}
.kdg .bt-wild{border-color:var(--gold)}.kdg .bt-remove{border-color:var(--pink)}.kdg .bt-rand{border-color:var(--teal)}.kdg .bt-show{border-color:var(--green)}
.kdg .pc{background:#0B1430!important;color:#fff!important;border:2px solid var(--pink)}
.kdg .pk-tiers li{background:#0B1430!important;border:2px solid var(--purple)}
/* Library word chips (mission spec) */
.kd .bk-word{background:#17213F!important;color:#FFFFFF!important;font-weight:700!important;padding:6px 10px!important;border-color:rgba(255,255,255,.25)}
/* table headers: label inset on the gradient header */
.kd thead th .thi{display:inline-block;background:#0B1430;color:#fff;border-radius:8px;padding:4px 8px}
/* buttons with gradient fills: label inset */
.kd .btnlink.first .ins,.kd .nextbtn .ins{padding:4px 8px}
.kd-home .tab.on .tl{background:#0B1430;color:#fff;border-radius:8px;padding:4px 8px}
.kd .wss-disc summary .ins{display:inline-block}
.kd .footbottom{color:rgba(255,255,255,.66)}

/* ===== UX-4 informative text >= 14px, body line-height >= 1.5 ===== */
.kd :is(.lgtitle,.rday,.rlen,.tlen,.llabel,.lbw,.lbn,.acount,.loc-meta,.loc-region,.loc-body,.flabel,.hint,.slv-lab,.statusmeta,.nav-cta,.bcrow,.shelfchip,.fmetasmall,.srcnote,.mc,.uplink,.lbrowse,.lmeta,.pagebtn,.btag,.pricebadge,.tab,.go,.qbtn,.tlink,.footdesc,.pbtn,.pcta,.btnlink,.slv-go,.slv-clear,.fbtn,.subt,.nextbtn,.totalstrip,.azjc,.ldate,.num,.gnum,.lp,.pc,.pcode,.pdesc,.bkdesc,.rc-span,.rc-lvl,.aztag,.bk-word,.wbook,.rdate,.tdate,.fmeta,.smsg,.slv-note,.footbottom,.thi){font-size:14px!important}
.kd :is(.statusmeta time,.bcrow a,.bcrow span,.footcol a,.lbcard p,.lbcard b,.catbl th,.catbl td,.dwtbl th,.dwtbl td,.dwtbl b,.rcard time,.gcard p,.faqcard p,.faqc p,.evcard p,.toolcard p,.hx-step p,.hx-step h3,.pk-tiers li,.slv-adv summary,small,.ldate b,.ldate time,.wmeta .star,.resultlist .wd a,.resultlist .wbook,#wss-reward-results li small,#wss-length-results li a,#wss-length-results li small,#scards .mhead h3,#scards .mhead .mc,.slv-word){font-size:14px!important}
.kd .footcol .fh4{font-family:var(--font-m);font-weight:700;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin:0 0 12px}
:where(.kd main) :where(p,li,td,dd){line-height:1.6}
.kd .introtext{color:var(--ink-soft);font-weight:600;font-size:14.5px;line-height:1.8;margin:14px 0 0;max-width:660px;position:relative;z-index:2}

.kd .tab .tl{font-size:14px!important}