:root{--ink:#251d29;--muted:#746c77;--cream:#f6f3ed;--paper:#fffdfa;--purple:#492a62;--purple-dark:#20132c;--gold:#d5a94f;--junior:#90b5a3;--junior-bg:#edf5f0;--middle:#d3a55c;--middle-bg:#faf2e4;--senior:#9a84b1;--senior-bg:#f2edf7;--line:#e9e3da;--shadow:0 20px 60px rgba(42,26,48,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:"DM Sans",sans-serif}.shell{width:min(1380px,calc(100% - 48px));margin:auto}
.hero{height:530px;position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at 72% 28%,#563670 0,transparent 32%),linear-gradient(135deg,#1f132a 0%,#342040 48%,#18121d 100%)}
.hero:after{content:"";position:absolute;inset:auto 0 0;height:90px;background:var(--cream);clip-path:polygon(0 78%,18% 45%,38% 68%,57% 34%,74% 70%,100% 30%,100% 100%,0 100%)}
.nav{height:112px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:3;border-bottom:1px solid rgba(255,255,255,.12)}.brand-mark{display:flex;width:132px;height:64px;padding:4px 10px;background:#fff;border-radius:5px;transform:rotate(-1deg);box-shadow:0 8px 22px rgba(0,0,0,.2)}.brand img{width:100%;object-fit:contain;mix-blend-mode:multiply}.nav-pill{font-size:13px;letter-spacing:.03em;padding:9px 14px;border:1px solid rgba(255,255,255,.19);border-radius:50px;background:rgba(255,255,255,.06);backdrop-filter:blur(7px)}.nav-pill i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#a6cfb5;margin-right:7px;box-shadow:0 0 0 4px rgba(166,207,181,.12)}
.hero-content{position:relative;z-index:2;padding-top:64px}.eyebrow,.section-label{text-transform:uppercase;font-weight:700;font-size:11px;letter-spacing:.19em}.eyebrow{color:#e2c788}.eyebrow span{margin-right:8px}.hero h1{font-family:Fraunces,serif;font-size:74px;line-height:.91;margin:18px 0 20px;letter-spacing:-.045em;font-weight:600}.hero h1 em{color:#d9b66c;font-style:italic;font-weight:600}.hero-content>p{max-width:500px;color:#d9d0dc;font-size:16px;line-height:1.65;margin:0}.scroll-link{display:inline-flex;align-items:center;gap:12px;margin-top:26px;color:#fff;text-decoration:none;font-size:13px;font-weight:700}.scroll-link span{display:grid;place-items:center;border:1px solid rgba(255,255,255,.35);width:29px;height:29px;border-radius:50%}
.mist{position:absolute;border-radius:50%;filter:blur(45px);pointer-events:none}.mist-one{width:420px;height:80px;background:rgba(255,255,255,.07);top:275px;right:12%;transform:rotate(-7deg)}.mist-two{width:260px;height:55px;background:rgba(202,176,220,.09);top:140px;left:-30px}.castle{position:absolute;right:5%;bottom:44px;width:450px;height:220px;opacity:.13;display:flex;align-items:flex-end;gap:17px;filter:drop-shadow(0 -2px 12px #bda3ca)}.castle span{display:block;background:#e3d9e8;width:68px;height:125px;clip-path:polygon(0 20%,20% 20%,20% 5%,35% 5%,35% 20%,65% 20%,65% 0,80% 0,80% 20%,100% 20%,100% 100%,0 100%)}.castle span:nth-child(2){height:180px;width:86px}.castle span:nth-child(3){height:215px;width:100px}.castle span:nth-child(4){height:160px;width:80px}.castle span:nth-child(5){height:115px}
.main-content{padding:62px 0 92px}.intro-row{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:42px}.section-label{color:#8b6b9d;margin:0 0 10px}.intro-row h2{font-family:Fraunces,serif;font-size:42px;letter-spacing:-.035em;margin:0}.updated{font-size:13px;color:var(--muted);margin:9px 0 0}.updated strong{font-weight:600;color:#554d57}.legend{display:flex;gap:25px;background:rgba(255,255,255,.58);border:1px solid #e7e0d8;padding:14px 18px;border-radius:10px}.legend>span{font-size:12px;font-weight:700;white-space:nowrap}.legend small{display:block;color:#918891;font-weight:400;margin:3px 0 0 17px}.dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:7px}.dot.junior{background:var(--junior)}.dot.middle{background:var(--middle)}.dot.senior{background:var(--senior)}
.podium-section{margin-bottom:25px}.podium-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:16px}.podium-heading h3{font:600 23px Fraunces,serif;margin:0}.provisional{font-size:11px;color:#888087;border:1px solid #ddd6cd;border-radius:50px;padding:6px 10px}.leader-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.leader-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:17px 20px;display:flex;align-items:center;gap:15px;box-shadow:0 6px 18px rgba(40,29,42,.025)}.leader-card .rank{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font:700 18px Fraunces,serif}.leader-card.junior .rank{background:var(--junior-bg);color:#517464}.leader-card.middle .rank{background:var(--middle-bg);color:#906d33}.leader-card.senior .rank{background:var(--senior-bg);color:#705887}.leader-card p{margin:0;font-size:13px;color:var(--muted)}.leader-card strong{display:block;color:var(--ink);font-size:16px;margin-bottom:2px}.leader-card .points{margin-left:auto;text-align:right}.leader-card .points b{display:block;font:700 20px Fraunces,serif}.leader-card .points small{color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.results-card{background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}.toolbar{height:72px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.filter-group{display:flex;gap:7px}.filter{border:1px solid transparent;background:none;color:#746d76;font:600 12px "DM Sans";padding:9px 12px;border-radius:7px;cursor:pointer;transition:.2s}.filter:hover{background:#f5f1ed}.filter.active{background:var(--purple);color:#fff}.filter .dot{margin-bottom:-1px}.swipe-hint{font-size:11px;color:#989097}.swipe-hint span{font-size:15px;margin-right:5px}.table-wrap{overflow:auto;max-width:100%;scrollbar-color:#bdb3bf #f2eee8;scrollbar-width:thin}.table-wrap:focus{outline:2px solid #8b6b9d;outline-offset:-2px}table{border-collapse:separate;border-spacing:0;font-size:12px;min-width:3280px;width:100%;table-layout:fixed}th,td{height:54px;padding:0 9px;text-align:center;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}th:first-child,td:first-child{position:sticky;left:0;z-index:2;width:210px;text-align:left;padding-left:22px;background:var(--paper);box-shadow:8px 0 12px rgba(46,34,47,.025)}thead th{position:sticky;top:0;z-index:3;height:66px;font-size:11px;background:#f9f6f1;color:#4b434c}thead th:first-child{z-index:4;background:#f9f6f1}.group-number{display:block;font-weight:700;font-size:12px}.class-label{display:block;font-size:9px;color:#988f96;font-weight:500;margin-top:3px}th.junior{box-shadow:inset 0 3px var(--junior)}th.middle{box-shadow:inset 0 3px var(--middle)}th.senior{box-shadow:inset 0 3px var(--senior)}td.junior{background:var(--junior-bg)}td.middle{background:var(--middle-bg)}td.senior{background:var(--senior-bg)}tbody tr:hover td{filter:brightness(.98)}.game{font-weight:700}.game span{display:inline-grid;place-items:center;width:25px;height:25px;background:#f0eaf3;border-radius:6px;margin-right:10px;color:#77598b;font-size:11px}td.score{font-variant-numeric:tabular-nums;font-weight:600;color:#514850}td.pending{color:#aaa1a9;font-weight:400}tfoot td{height:62px;font-weight:800;border-bottom:0;background:#f4f0ea}tfoot td:first-child{background:#f4f0ea;font-size:13px}tfoot td.junior{background:#dfece5}tfoot td.middle{background:#f3e6d0}tfoot td.senior{background:#e7dfee}.hidden-column{display:none}.card-footer{display:flex;align-items:center;justify-content:space-between;min-height:58px;padding:12px 20px;color:#888088;font-size:11px;background:#fbf8f4}.card-footer>span{font-weight:600}.card-footer>span i{display:inline-block;width:6px;height:6px;background:var(--gold);border-radius:50%;margin:0 7px 1px 0}.card-footer p{margin:0}
footer{background:#1e1623;color:#bdb3c0;padding:31px 0}footer .shell{display:flex;justify-content:space-between;align-items:center}footer p{font:600 17px Fraunces,serif;color:#fff;margin:0}footer span{font-size:11px;letter-spacing:.06em}footer b{color:var(--gold);margin-left:7px}
@media(max-width:850px){.shell{width:min(100% - 28px,1380px)}.hero{height:500px}.nav{height:90px}.hero-content{padding-top:58px}.hero h1{font-size:54px}.castle{right:-190px}.intro-row{align-items:flex-start;gap:25px;flex-direction:column}.intro-row h2{font-size:35px}.legend{width:100%;overflow:auto}.leader-cards{grid-template-columns:1fr}.toolbar{height:auto;align-items:flex-start;gap:12px;padding:14px;flex-direction:column}.filter-group{width:100%;overflow:auto}.filter{white-space:nowrap}.swipe-hint{margin:0}.card-footer{align-items:flex-start;gap:5px;flex-direction:column}.card-footer p{line-height:1.4}footer .shell{gap:10px;flex-direction:column;align-items:flex-start}}
@media(max-width:480px){.hero h1{font-size:45px}.hero-content>p{font-size:14px}.nav-pill{font-size:11px}.brand-mark{width:104px;height:52px}.main-content{padding-top:45px}.legend{gap:16px}.legend small{display:none}.filter{padding:8px 10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Speelsere, kleurrijke hero */
.hero{height:550px;background:radial-gradient(circle at 82% 14%,rgba(57,194,179,.48) 0,transparent 25%),radial-gradient(circle at 58% 74%,rgba(220,96,153,.26) 0,transparent 28%),radial-gradient(circle at 14% 36%,rgba(116,87,205,.62) 0,transparent 29%),linear-gradient(125deg,#241440 0%,#50306f 45%,#173c51 100%)}
.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.7) 1px,transparent 1.5px);background-size:47px 47px;opacity:.15;transform:rotate(-7deg) scale(1.1)}
.hero:after{height:102px;clip-path:polygon(0 70%,9% 57%,20% 72%,31% 48%,43% 69%,56% 43%,68% 70%,80% 50%,91% 68%,100% 39%,100% 100%,0 100%)}
.nav{z-index:5;border-bottom-color:rgba(255,255,255,.16)}
.brand-mark{width:142px;height:68px;padding:5px 11px;background:linear-gradient(145deg,#fffdf5,#e7fff7);border:2px solid rgba(255,255,255,.8);border-radius:14px 7px 14px 7px;transform:rotate(-2deg);box-shadow:0 9px 0 rgba(20,13,33,.18),0 14px 28px rgba(0,0,0,.2)}
.nav-pill{font-weight:700;padding:10px 15px;border-color:rgba(255,255,255,.28);background:linear-gradient(110deg,rgba(255,255,255,.15),rgba(255,255,255,.06));box-shadow:0 8px 24px rgba(0,0,0,.12);backdrop-filter:blur(9px)}
.nav-pill i{width:8px;height:8px;background:#7ee0b2;box-shadow:0 0 0 4px rgba(126,224,178,.15),0 0 15px #7ee0b2}
.hero-content{z-index:3;padding-top:57px}.eyebrow{display:inline-flex;align-items:center;color:#fff0b5;background:rgba(27,16,40,.28);border:1px solid rgba(255,224,143,.24);padding:8px 13px;border-radius:50px;box-shadow:0 8px 24px rgba(0,0,0,.1)}.eyebrow span{color:#ffd86b}
.hero h1{font-size:76px;line-height:.9;margin:20px 0 21px;text-shadow:0 6px 22px rgba(15,8,25,.25)}.hero h1 em{display:inline-block;color:#ffe07f;transform:rotate(-1deg);text-shadow:3px 3px 0 rgba(196,91,137,.38)}.hero-content>p{color:#eee8f1}
.scroll-link{margin-top:25px;color:#251b2b;background:#fff5cd;padding:8px 9px 8px 16px;border-radius:50px;box-shadow:0 7px 0 rgba(20,14,31,.19),0 15px 30px rgba(0,0,0,.15);transition:.2s}.scroll-link:hover{transform:translateY(-2px);background:#fff}.scroll-link span{border:0;background:#df6b9c;color:#fff}
.hero-orb{position:absolute;border-radius:50%;z-index:1}.orb-one{width:155px;height:155px;right:14%;top:105px;background:linear-gradient(145deg,rgba(255,221,108,.28),rgba(222,97,154,.08));border:1px solid rgba(255,240,186,.22);box-shadow:inset 15px 10px 32px rgba(255,255,255,.08)}.orb-two{width:62px;height:62px;right:40%;top:185px;background:rgba(106,221,198,.13);border:1px solid rgba(151,241,221,.25)}
.sparkles{position:absolute;z-index:2;color:#ffe587;letter-spacing:22px;text-shadow:0 0 13px rgba(255,222,108,.85)}.sparkles small{font-size:.55em;color:#a9f0df}.sparkles-left{left:4%;top:175px;font-size:19px;transform:rotate(-12deg)}.sparkles-right{right:5%;top:94px;font-size:24px;transform:rotate(10deg)}
.magic-badges{position:absolute;z-index:3;right:9%;top:213px;width:440px;height:180px}.magic-badges span{position:absolute;display:grid;place-items:center;border:1px solid rgba(255,255,255,.35);box-shadow:0 10px 26px rgba(11,8,20,.2)}.badge-moon{right:40px;top:0;width:68px;height:68px;border-radius:46% 54% 48% 52%;background:linear-gradient(145deg,#ffe177,#e7a94f);color:#56335d;font-size:37px;transform:rotate(10deg)}.badge-star{left:95px;top:60px;width:47px;height:47px;border-radius:14px;background:linear-gradient(145deg,#dc6fa3,#9b559e);color:#ffe89a;font-size:22px;transform:rotate(-13deg)}.badge-gem{right:135px;bottom:4px;width:39px;height:39px;border-radius:50%;background:linear-gradient(145deg,#80e1c8,#459bab);color:#eafffa;font-size:17px}
.mist-one{background:rgba(255,255,255,.1)}.mist-two{background:rgba(202,176,220,.15)}.castle{opacity:.19}
@media(max-width:850px){.hero{height:520px}.hero-content{padding-top:52px}.hero h1{font-size:54px}.magic-badges{right:-190px;opacity:.72}.sparkles-right{display:none}.orb-one{right:-35px}}
@media(max-width:480px){.hero h1{font-size:45px}.brand-mark{width:110px;height:54px}.sparkles-left{display:none}.magic-badges{display:none}}

/* Compacte kop zonder hero */
.compact-header{position:relative;background:linear-gradient(105deg,#2c1944 0%,#593276 53%,#175064 100%);border-bottom:4px solid #e5b855;box-shadow:0 8px 24px rgba(38,24,47,.16);overflow:hidden}
.compact-header:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.55) 1px,transparent 1.5px);background-size:42px 42px;opacity:.13}
.compact-header-inner{position:relative;z-index:1;min-height:126px;display:flex;align-items:center;gap:28px}
.themed-logo{display:flex;width:230px;height:105px;flex:none;overflow:hidden;filter:drop-shadow(0 7px 10px rgba(18,8,25,.26))}
.themed-logo img{width:100%;height:100%;object-fit:contain;mix-blend-mode:screen}
.compact-title{color:#fff;display:flex;flex-direction:column;gap:5px}.compact-title span{font-size:10px;font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:#a8eadc}.compact-title strong{font:600 25px Fraunces,serif;color:#fff5ce}
.compact-header .nav-pill{margin-left:auto;color:#fff}
.main-content{padding-top:48px}
@media(max-width:700px){.compact-header-inner{min-height:104px;gap:15px}.themed-logo{width:156px;height:82px}.compact-title strong{font-size:18px}.compact-header .nav-pill{display:none}.main-content{padding-top:36px}}
@media(max-width:450px){.compact-title span{display:none}.compact-title strong{font-size:15px}.themed-logo{width:145px}}

/* Kleurrijkere compacte header en transparant origineel logo */
.compact-header{background:radial-gradient(circle at 78% -15%,rgba(255,217,95,.75) 0,transparent 24%),radial-gradient(circle at 12% 140%,rgba(222,79,155,.65) 0,transparent 36%),linear-gradient(112deg,#382057 0%,#704096 46%,#137180 100%);border-bottom:0}
.compact-header:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:15px;background:#f6f3ed;clip-path:polygon(0 68%,7% 40%,14% 72%,22% 35%,31% 70%,40% 42%,49% 75%,59% 38%,68% 71%,77% 36%,87% 70%,94% 43%,100% 68%,100% 100%,0 100%)}
.compact-header-inner{z-index:3;min-height:146px;gap:32px}
.themed-logo{width:270px;height:120px;filter:drop-shadow(0 8px 8px rgba(18,8,25,.3))}
.themed-logo img{mix-blend-mode:normal}
.compact-title strong{font-size:29px;text-shadow:2px 3px 0 rgba(42,19,58,.3)}
.compact-title span{display:inline-flex;width:max-content;color:#332040;background:#99ead8;padding:6px 10px;border-radius:20px;transform:rotate(-1deg);box-shadow:0 4px 0 rgba(39,22,50,.2)}
.compact-header .nav-pill{background:#ffdc70;color:#3d2551;border-color:#fff1b7;box-shadow:0 5px 0 rgba(40,24,55,.22);transform:rotate(1deg)}
.compact-header .nav-pill i{background:#e35098;box-shadow:0 0 0 4px rgba(227,80,152,.16)}
.header-shape{position:absolute;z-index:1;border:1px solid rgba(255,255,255,.24);transform:rotate(18deg)}
.shape-pink{width:150px;height:150px;border-radius:38% 62% 59% 41%;right:29%;top:-76px;background:rgba(234,84,155,.36)}
.shape-mint{width:95px;height:95px;border-radius:50% 40% 55% 45%;right:8%;bottom:-42px;background:rgba(77,219,192,.36)}
.header-stars{position:absolute;z-index:2;inset:0;pointer-events:none}.header-stars span{position:absolute;color:#ffe27c;text-shadow:0 0 12px rgba(255,221,101,.9)}.header-stars span:nth-child(1){left:31%;top:25px;font-size:17px}.header-stars span:nth-child(2){right:21%;top:30px;font-size:12px;color:#9cf0df}.header-stars span:nth-child(3){right:4%;top:27px;font-size:23px}.header-stars span:nth-child(4){left:48%;bottom:23px;font-size:10px;color:#f39bc8;transform:rotate(22deg)}
@media(max-width:700px){.compact-header-inner{min-height:116px;gap:15px}.themed-logo{width:175px;height:88px}.compact-title strong{font-size:18px}.compact-title span{font-size:8px;padding:5px 7px}.shape-pink{right:-40px}.header-stars span:nth-child(1){left:52%}}

/* Speelser koplettertype */
.compact-title strong,.intro-row h2,.podium-heading h3,.leader-card .rank,.leader-card .points b{font-family:"Baloo 2",cursive}
.compact-title strong{font-weight:800;letter-spacing:-.02em}
.intro-row h2{font-weight:800;letter-spacing:-.025em;line-height:1.05}
.podium-heading h3{font-weight:700;font-size:25px}
.section-label{font-family:"Baloo 2",cursive;font-size:12px;font-weight:800;letter-spacing:.14em}
.game{font-family:"Baloo 2",cursive;font-size:13px}

/* Identiteit geïntegreerd in de pagina, zonder banner of overgangslijn */
body{background:radial-gradient(circle at 8% 2%,rgba(221,97,154,.09),transparent 23%),radial-gradient(circle at 94% 8%,rgba(67,195,184,.11),transparent 25%),var(--cream)}
.main-content{padding-top:30px}
.page-identity{position:relative;min-height:142px;display:flex;align-items:center;gap:30px;margin-bottom:42px;padding:12px 28px 12px 18px;background:rgba(255,253,250,.72);border:1px solid rgba(226,217,208,.9);border-radius:22px;box-shadow:0 13px 40px rgba(48,31,52,.06);overflow:hidden}
.page-identity:after{content:"✦";position:absolute;right:22%;top:17px;color:#e5b653;font-size:15px;text-shadow:48px 78px 0 #df6a9e,-500px 90px 0 #64c8b9;opacity:.9}
.page-logo{position:relative;z-index:2;display:flex;width:265px;height:116px;flex:none;filter:drop-shadow(0 7px 7px rgba(53,29,62,.16))}
.page-logo img{width:100%;height:100%;object-fit:contain}
.page-theme{position:relative;z-index:2;display:flex;flex-direction:column;gap:4px}.page-theme>span{width:max-content;text-transform:uppercase;letter-spacing:.14em;font:800 10px "Baloo 2",cursive;color:#75458b}.page-theme strong{font:800 29px/1.05 "Baloo 2",cursive;color:#37223f;letter-spacing:-.025em}
.page-status{position:relative;z-index:2;margin-left:auto;white-space:nowrap;color:#3f2950;background:#ffe080;padding:10px 14px;border-radius:50px;font-size:12px;font-weight:800;box-shadow:0 4px 0 #e4b84e}.page-status i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#dd5d94;margin-right:7px;box-shadow:0 0 0 4px rgba(221,93,148,.13)}
.identity-blob{position:absolute;border-radius:50%;pointer-events:none}.blob-pink{width:130px;height:130px;right:30%;top:-92px;background:rgba(222,94,157,.14)}.blob-mint{width:105px;height:105px;right:-40px;bottom:-64px;background:rgba(67,195,184,.17)}
@media(max-width:750px){.page-identity{min-height:120px;gap:15px;margin-bottom:34px;padding:10px 16px}.page-logo{width:180px;height:92px}.page-theme strong{font-size:20px}.page-theme>span{font-size:8px}.page-status{display:none}.page-identity:after{right:8%}}
@media(max-width:480px){.main-content{padding-top:16px}.page-identity{align-items:flex-start;flex-direction:column;gap:0;padding:9px 15px 17px}.page-logo{width:180px;height:84px}.page-theme{margin-top:-3px}.page-theme strong{font-size:18px}.page-identity:after{right:8%;top:24px}}

/* Duidelijke horizontale schuifhint */
.swipe-hint{display:flex;align-items:center;gap:7px;margin:0;color:#503760!important;background:#f1e8f5;border:1px solid #ddcde5;border-radius:50px;padding:8px 12px;font-size:11px!important;white-space:nowrap;box-shadow:0 3px 0 rgba(91,57,108,.09)}
.swipe-hint strong{font-weight:800;color:#6c3f80}.swipe-hint span{display:grid;place-items:center;width:21px;height:21px;margin:0!important;border-radius:50%;background:#704389;color:#fff;font-size:12px!important}.swipe-hint span:last-child{animation:slideCue 1.5s ease-in-out infinite}
@keyframes slideCue{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
@media(max-width:700px){.swipe-hint{width:100%;justify-content:center;border-radius:9px}.swipe-hint strong{font-size:11px}}
@media(prefers-reduced-motion:reduce){.swipe-hint span:last-child{animation:none}}