:root{
--bg:#8fd3ee;--card:#fffaf0;--ink:#26406f;--mut:#5d78a4;--line:#cfe5f2;--chip:#e2f2fa;
--acc:#ef6a5a;--acc2:#2f63c8;
--w1:#d4f0fa;--w2:#a6dbf1;--w3:#6cc0e8;--deep:#2f63c8;
--lily:#6aa860;--lily-d:#3f7d4c;--wood:#85583f;--wood-d:#55372a;--wood-l:#a06f52;
--sun:#f8c96b;--coral:#ef6a5a;--pink:#ea6f9f;--blue:#4f86f0;--lav:#b79ae6;
--round:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold","Hiragino Maru Gothic ProN","Varela Round","Nunito","Trebuchet MS",system-ui,-apple-system,"Segoe UI",sans-serif;
--shadow:0 10px 26px rgba(38,80,130,.16);
color-scheme:light}
*{box-sizing:border-box}
html{background:#8fd3ee}
body{margin:0;min-height:100vh;color:var(--ink);font:16px/1.55 var(--round);
background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22480%22 height=%22480%22%3E%3Cfilter id=%22f%22 color-interpolation-filters=%22sRGB%22 x=%220%22 y=%220%22 width=%22100%25%22 height=%22100%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%220.018 0.022%22 numOctaves=%223%22 seed=%2211%22 stitchTiles=%22stitch%22/%3E%3CfeColorMatrix type=%22matrix%22 values=%220 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 1 0 0 0%22/%3E%3CfeComponentTransfer%3E%3CfeFuncA type=%22table%22 tableValues=%220 0 0 .1 .5 1 .5 .1 0 0 0%22/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width=%22480%22 height=%22480%22 filter=%22url(%23f)%22 opacity=%22.42%22/%3E%3C/svg%3E"),radial-gradient(1200px 700px at 15% -10%,#d9f3fb 0,transparent 60%),linear-gradient(180deg,#a9def3 0,#7ccbec 55%,#62b8e2 100%);
background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M50 50 L88.9 34.3 A42 42 0 1 0 88.9 65.7 Z%22 fill=%22%236aa860%22 stroke=%22%233f7d4c%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cg stroke=%22%233f7d4c%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 opacity=%22.45%22 fill=%22none%22%3E%3Cpath d=%22M50 50 L77.6 73.1%22 /%3E%3Cpath d=%22M50 50 L56.3 85.5%22 /%3E%3Cpath d=%22M50 50 L32.0 81.2%22 /%3E%3Cpath d=%22M50 50 L16.2 62.3%22 /%3E%3Cpath d=%22M50 50 L16.2 37.7%22 /%3E%3Cpath d=%22M50 50 L32.0 18.8%22 /%3E%3Cpath d=%22M50 50 L56.3 14.5%22 /%3E%3Cpath d=%22M50 50 L77.6 26.9%22 /%3E%3C/g%3E%3Cellipse cx=%2238%22 cy=%2236%22 rx=%2216%22 ry=%228%22 fill=%22%238cc47a%22 opacity=%22.55%22 transform=%22rotate(-30 38 36)%22/%3E%3C/svg%3E") no-repeat left -34px top 21%/150px,url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M50 50 L88.9 34.3 A42 42 0 1 0 88.9 65.7 Z%22 fill=%22%237db96c%22 stroke=%22%23468a52%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cg stroke=%22%23468a52%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 opacity=%22.45%22 fill=%22none%22%3E%3Cpath d=%22M50 50 L77.6 73.1%22 /%3E%3Cpath d=%22M50 50 L56.3 85.5%22 /%3E%3Cpath d=%22M50 50 L32.0 81.2%22 /%3E%3Cpath d=%22M50 50 L16.2 62.3%22 /%3E%3Cpath d=%22M50 50 L16.2 37.7%22 /%3E%3Cpath d=%22M50 50 L32.0 18.8%22 /%3E%3Cpath d=%22M50 50 L56.3 14.5%22 /%3E%3Cpath d=%22M50 50 L77.6 26.9%22 /%3E%3C/g%3E%3Cellipse cx=%2238%22 cy=%2236%22 rx=%2216%22 ry=%228%22 fill=%22%23a3d68e%22 opacity=%22.55%22 transform=%22rotate(-30 38 36)%22/%3E%3C/svg%3E") no-repeat right -26px top 46%/118px,url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M50 50 L88.9 34.3 A42 42 0 1 0 88.9 65.7 Z%22 fill=%22%236aa860%22 stroke=%22%233f7d4c%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cg stroke=%22%233f7d4c%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 opacity=%22.45%22 fill=%22none%22%3E%3Cpath d=%22M50 50 L77.6 73.1%22 /%3E%3Cpath d=%22M50 50 L56.3 85.5%22 /%3E%3Cpath d=%22M50 50 L32.0 81.2%22 /%3E%3Cpath d=%22M50 50 L16.2 62.3%22 /%3E%3Cpath d=%22M50 50 L16.2 37.7%22 /%3E%3Cpath d=%22M50 50 L32.0 18.8%22 /%3E%3Cpath d=%22M50 50 L56.3 14.5%22 /%3E%3Cpath d=%22M50 50 L77.6 26.9%22 /%3E%3C/g%3E%3Cellipse cx=%2238%22 cy=%2236%22 rx=%2216%22 ry=%228%22 fill=%22%238cc47a%22 opacity=%22.55%22 transform=%22rotate(-30 38 36)%22/%3E%3C/svg%3E") no-repeat left 3% bottom -30px/130px,url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M50 50 L88.9 34.3 A42 42 0 1 0 88.9 65.7 Z%22 fill=%22%237db96c%22 stroke=%22%23468a52%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cg stroke=%22%23468a52%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 opacity=%22.45%22 fill=%22none%22%3E%3Cpath d=%22M50 50 L77.6 73.1%22 /%3E%3Cpath d=%22M50 50 L56.3 85.5%22 /%3E%3Cpath d=%22M50 50 L32.0 81.2%22 /%3E%3Cpath d=%22M50 50 L16.2 62.3%22 /%3E%3Cpath d=%22M50 50 L16.2 37.7%22 /%3E%3Cpath d=%22M50 50 L32.0 18.8%22 /%3E%3Cpath d=%22M50 50 L56.3 14.5%22 /%3E%3Cpath d=%22M50 50 L77.6 26.9%22 /%3E%3C/g%3E%3Cellipse cx=%2238%22 cy=%2236%22 rx=%2216%22 ry=%228%22 fill=%22%23a3d68e%22 opacity=%22.55%22 transform=%22rotate(-30 38 36)%22/%3E%3C/svg%3E") no-repeat right 6% bottom 4%/84px,url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cpath d=%22M50 50 L88.9 34.3 A42 42 0 1 0 88.9 65.7 Z%22 fill=%22%237db96c%22 stroke=%22%23468a52%22 stroke-width=%223%22 stroke-linejoin=%22round%22/%3E%3Cg stroke=%22%23468a52%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 opacity=%22.45%22 fill=%22none%22%3E%3Cpath d=%22M50 50 L77.6 73.1%22 /%3E%3Cpath d=%22M50 50 L56.3 85.5%22 /%3E%3Cpath d=%22M50 50 L32.0 81.2%22 /%3E%3Cpath d=%22M50 50 L16.2 62.3%22 /%3E%3Cpath d=%22M50 50 L16.2 37.7%22 /%3E%3Cpath d=%22M50 50 L32.0 18.8%22 /%3E%3Cpath d=%22M50 50 L56.3 14.5%22 /%3E%3Cpath d=%22M50 50 L77.6 26.9%22 /%3E%3C/g%3E%3Cellipse cx=%2238%22 cy=%2236%22 rx=%2216%22 ry=%228%22 fill=%22%23a3d68e%22 opacity=%22.55%22 transform=%22rotate(-30 38 36)%22/%3E%3C/svg%3E") no-repeat right 22% top -30px/96px;opacity:.92}
a{color:var(--acc2);text-decoration:none;font-weight:700}a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.wrap{max-width:1100px;margin:0 auto;padding:0 18px;position:relative}
::selection{background:#ffe08a}
:focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 6px var(--deep);border-radius:12px}

/* wooden sign title */
header.top{padding:30px 0 6px}
header.top h1,.sethead h1,.plank{display:inline-block;margin:0;font-size:1.65rem;line-height:1.15;letter-spacing:.02em;color:#ffe3b0;
padding:.38em 1em .42em;border-radius:16px;border:3px solid var(--wood-d);
background:repeating-linear-gradient(176deg,rgba(255,255,255,.07) 0 2px,transparent 2px 9px),linear-gradient(180deg,var(--wood-l),var(--wood) 55%,#744a35);
box-shadow:0 5px 0 var(--wood-d),0 14px 24px rgba(40,50,90,.25);text-shadow:0 2px 0 rgba(55,30,15,.55);transform:rotate(-1.2deg)}
header.top p,.sethead p{margin:.8rem 0 0;color:#1f4a86;font-weight:700;text-shadow:0 1px 0 rgba(255,255,255,.55)}

.bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:20px 0}
input[type=search],input[type=text],input[type=number]{flex:1 1 260px;padding:12px 18px;border:3px solid #fff;border-radius:999px;background:var(--card);color:var(--ink);font:inherit;box-shadow:0 5px 14px rgba(40,90,140,.14)}
input::placeholder{color:#8aa0c2}
button,.btn{font:inherit;font-weight:800;cursor:pointer;border:3px solid #fff;background:var(--card);color:var(--ink);border-radius:999px;padding:8px 18px;box-shadow:0 5px 12px rgba(40,90,140,.14);transition:transform .12s,box-shadow .12s}
button:hover{transform:translateY(-2px);box-shadow:0 9px 16px rgba(40,90,140,.2)}
button:active{transform:translateY(1px)}
button.on{background:var(--deep);border-color:#fff;color:#fff}
button.primary{background:var(--coral);border-color:#fff;color:#fff}
h2.sec{display:inline-block;margin:30px 0 14px;padding:.25em .9em;font-size:1.1rem;color:#fff;background:linear-gradient(180deg,#7bbd6d,var(--lily));border:3px solid #fff;border-radius:999px;box-shadow:0 6px 14px rgba(40,100,70,.25);text-shadow:0 1px 0 rgba(30,80,40,.4)}

/* set tiles = little lily-pad cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.set{display:flex;flex-direction:column;position:relative;background:var(--card);border:3px solid #fff;border-radius:24px;padding:12px;color:var(--ink);box-shadow:var(--shadow);transition:transform .18s,box-shadow .18s}
.set:hover{transform:translateY(-4px) rotate(-.6deg);box-shadow:0 0 0 6px rgba(255,255,255,.5),0 16px 28px rgba(38,80,130,.24);text-decoration:none}
.set .lg{height:84px;display:flex;align-items:center;justify-content:center;margin-bottom:8px;border-radius:16px;background:radial-gradient(closest-side,#fff,#fff6e0 90%)}
.set .lg img{max-width:100%;max-height:84px;object-fit:contain}
.set .lg span{font-weight:800;text-align:center;color:var(--mut)}
.set b{font-size:.95rem;line-height:1.25}.set small{color:var(--mut);font-weight:700}
.hide{display:none!important}
.hits{background:var(--card);border:3px solid #fff;border-radius:24px;padding:6px 18px;margin:14px 0;box-shadow:var(--shadow)}
.hit{display:flex;gap:10px;justify-content:space-between;padding:8px 0;border-bottom:2px dotted var(--line);flex-wrap:wrap}.hit:last-child{border:0}
.hit span.m{color:var(--mut);font-size:.9rem}

.sethead{display:flex;gap:22px;align-items:center;flex-wrap:wrap;padding:24px 0 6px}
.sethead img{max-height:120px;max-width:280px;object-fit:contain;background:var(--card);border:3px solid #fff;border-radius:24px;padding:10px 16px;box-shadow:var(--shadow)}
.sethead p{margin:.7rem 0 0}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}.chips button{padding:5px 14px;background:var(--chip);font-size:.88rem}
.chips button.on{color:#fff}
table{width:100%;border-collapse:separate;border-spacing:0;background:var(--card);border:3px solid #fff;border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
th,td{text-align:left;padding:10px 14px;border-bottom:2px dotted var(--line)}
th{font-size:.78rem;text-transform:uppercase;letter-spacing:.07em;color:#fff;background:linear-gradient(180deg,#5aa4dc,#4a90cf);border-bottom:0;text-shadow:0 1px 0 rgba(20,60,110,.35)}
tbody tr:nth-child(even) td{background:#fff3da}
tbody tr:hover td{background:#e4f5e0}
tr:last-child td{border:0}td.n{white-space:nowrap;color:var(--mut);font-weight:800;font-variant-numeric:tabular-nums}td.c{width:1%;white-space:nowrap}
.rar{display:inline-block;padding:2px 11px;border-radius:999px;background:var(--chip);border:2px solid #fff;font-size:.82rem;font-weight:800;white-space:nowrap;box-shadow:0 2px 5px rgba(40,90,140,.14)}
.cp{padding:3px 13px;font-size:.82rem;border-width:2px}.cp.done{background:var(--lily);border-color:#fff;color:#fff}
.legend{margin:14px 0;color:#1f4a86;font-size:.92rem;font-weight:700}.legend code{background:rgba(255,255,255,.7);padding:1px 8px;border-radius:999px}
.nav{display:flex;justify-content:space-between;margin:24px 0;gap:10px;flex-wrap:wrap}
.nav a,.wrap>p>a{display:inline-block;padding:6px 16px;background:var(--card);border:3px solid #fff;border-radius:999px;box-shadow:0 5px 12px rgba(40,90,140,.14)}
.nav a:hover,.wrap>p>a:hover{text-decoration:none;transform:translateY(-2px)}
footer{margin:40px 0 32px;color:#1f4a86;font-size:.84rem;font-weight:700;text-align:center}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--wood-d);color:#ffe9c4;border:3px solid var(--wood-l);padding:9px 20px;border-radius:999px;font-weight:800;opacity:0;pointer-events:none;transition:opacity .2s;z-index:9}.toast.show{opacity:1}
@media(max-width:560px){th:nth-child(1),td.n{display:none}.sethead img{max-height:90px}header.top h1,.sethead h1{font-size:1.35rem}body::before{opacity:.7}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}