:root{
  --bg:#FEFAF4;--card:#FFF;--text:#2B2D42;--muted:#7A7D8A;
  --border:#E8E4DC;--accent:#FF6B35;--shadow:0 2px 16px rgba(43,45,66,.09);
}
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Nunito',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;}

/* ── NAV ── */
nav{background:var(--card);border-bottom:1.5px solid var(--border);padding:0 1.5rem;display:flex;align-items:center;justify-content:space-between;height:60px;position:sticky;top:0;z-index:100;gap:12px;}
.nav-logo{font-family:'Fraunces',serif;font-size:18px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px;cursor:pointer;white-space:nowrap;}
.nav-links{display:flex;gap:3px;}
.nav-btn{background:none;border:none;padding:7px 11px;border-radius:10px;font-family:'Nunito',sans-serif;font-size:13px;font-weight:700;color:var(--muted);cursor:pointer;transition:all .15s;white-space:nowrap;}
.nav-btn:hover{background:var(--bg);color:var(--text);}
.nav-btn.active{background:var(--bg);color:var(--accent);}
.nav-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.role-badge{padding:4px 11px;border-radius:20px;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;}
.role-org{background:#FFF0E8;color:#CC4400;}
.role-leiding{background:#E8F0FF;color:#1A3BB3;}
.logout-btn{background:none;border:1.5px solid var(--border);padding:5px 12px;border-radius:10px;font-size:12px;font-weight:700;color:var(--muted);cursor:pointer;white-space:nowrap;}
.logout-btn:hover{border-color:var(--text);color:var(--text);}

/* ── PAGES ── */
.page{display:none;padding:2rem 1.5rem;max-width:980px;margin:0 auto;}
.page.active{display:block;}
.ph{margin-bottom:1.75rem;}
.ph h1{font-family:'Fraunces',serif;font-size:32px;font-weight:700;margin-bottom:4px;}
.ph p{color:var(--muted);font-size:15px;}

/* ── LOGIN ── */
#login-page{min-height:100vh;align-items:center;justify-content:center;padding:2rem;background:var(--bg);}
#login-page.lp-show{display:flex;}
#login-page.lp-hide{display:none!important;}
.lcard{background:var(--card);border:1.5px solid var(--border);border-radius:24px;padding:2.75rem 2.25rem;max-width:420px;width:100%;box-shadow:var(--shadow);}
.ltitle{font-family:'Fraunces',serif;font-size:30px;font-weight:700;margin-bottom:6px;line-height:1.2;}
.lsub{color:var(--muted);font-size:14px;margin-bottom:1.75rem;line-height:1.6;}
.flabel{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;margin-bottom:7px;display:block;}
.finput{width:100%;border:1.5px solid var(--border);border-radius:12px;padding:11px 14px;font-size:15px;font-family:'Nunito',sans-serif;background:var(--bg);color:var(--text);transition:border .15s;}
.finput:focus{outline:none;border-color:var(--accent);}
.fg{margin-bottom:1.1rem;}
.sbtn{width:100%;background:var(--text);color:white;border:none;border-radius:12px;padding:13px;font-size:15px;font-weight:800;font-family:'Nunito',sans-serif;cursor:pointer;transition:opacity .15s;margin-top:4px;}
.sbtn:hover{opacity:.82;}
.sbtn:disabled{opacity:.5;cursor:not-allowed;}
.ibox{background:#FFF8F0;border:1.5px solid #FFD6B0;border-radius:12px;padding:11px 14px;font-size:13px;color:#994400;margin-top:1rem;line-height:1.5;}
.ebox{background:#FFF0F0;border:1.5px solid #FFB0B0;border-radius:12px;padding:11px 14px;font-size:13px;color:#880000;margin-top:1rem;line-height:1.5;display:none;}
.backlink{background:none;border:none;color:var(--muted);font-size:13px;font-family:'Nunito',sans-serif;cursor:pointer;text-decoration:underline;margin-top:1rem;display:block;text-align:center;}

/* ── WELKOM OVERLAY ── */
#welkom-overlay{position:fixed;inset:0;z-index:200;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;}
#welkom-overlay.wo-show{display:flex;}
#welkom-overlay.wo-hide{display:none!important;}
#welkom-overlay.fade-out{opacity:0;pointer-events:none;transition:opacity .6s ease;}
.w-bg{position:absolute;inset:0;transition:background .15s ease;}
.w-content{position:relative;z-index:1;text-align:center;color:white;padding:2rem;display:flex;flex-direction:column;align-items:center;}
.w-pre{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.15em;color:rgba(255,255,255,.75);margin-bottom:1rem;opacity:0;transform:translateY(16px);transition:opacity .6s,transform .6s;}
.w-pre.show{opacity:1;transform:translateY(0);}
.slot-window{height:88px;overflow:hidden;width:100%;max-width:500px;position:relative;}
.slot-reel{display:flex;flex-direction:column;}
.slot-item{height:88px;display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-size:clamp(42px,9vw,70px);font-weight:700;color:white;white-space:nowrap;gap:12px;}
.w-emoji{font-size:clamp(36px,7vw,56px);margin-top:.5rem;opacity:0;transform:translateY(10px);}
.w-emoji.show{opacity:1;transform:translateY(0);transition:opacity .6s,transform .6s;}
.w-btn{margin-top:2.5rem;background:rgba(255,255,255,.18);border:2px solid rgba(255,255,255,.6);color:white;font-family:'Nunito',sans-serif;font-size:16px;font-weight:800;padding:13px 36px;border-radius:50px;cursor:pointer;opacity:0;transform:translateY(14px);transition:opacity .6s,transform .6s,background .2s;}
.w-btn.show{opacity:1;transform:translateY(0);}
.w-btn:hover{background:rgba(255,255,255,.32);}
.bubble{position:absolute;border-radius:50%;opacity:.11;animation:floatup linear infinite;}
@keyframes floatup{from{transform:translateY(110vh);}to{transform:translateY(-20vh);}}

/* ── TILES & CARDS ── */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:.875rem;margin-bottom:1.5rem;}
.info-tile{background:var(--card);border:1.5px solid var(--border);border-radius:14px;padding:1.1rem;}
.tlabel{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:5px;}
.tval{font-size:17px;font-weight:800;}
.card{background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:1.25rem;}

/* ── TEAM HERO ── */
.team-hero{border-radius:20px;padding:2.25rem 2rem;margin-bottom:1.5rem;color:white;position:relative;overflow:hidden;}
.th-label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;opacity:.7;margin-bottom:7px;}
.th-name{font-family:'Fraunces',serif;font-size:40px;font-weight:700;margin-bottom:4px;}
.th-person{font-size:15px;opacity:.82;}
.th-d1{position:absolute;right:-24px;bottom:-24px;width:130px;height:130px;border-radius:50%;opacity:.12;background:white;}
.th-d2{position:absolute;right:65px;bottom:45px;width:65px;height:65px;border-radius:50%;opacity:.08;background:white;}

/* ── TWO COLUMN ── */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-bottom:1.5rem;align-items:start;}
@media(max-width:680px){.two-col{grid-template-columns:1fr;}}

/* ── MINI CALENDAR ── */
.mcal-hdr{font-size:15px;font-weight:800;margin-bottom:.875rem;}
.mcal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
.mcd{text-align:center;font-size:10px;font-weight:800;text-transform:uppercase;color:var(--muted);padding:3px 0;}
.mcc{min-height:30px;border-radius:6px;border:1px solid var(--border);padding:2px 3px;background:var(--card);}
.mcc.empty{border-color:transparent;background:transparent;}
.mcc.kamp{background:#FFF5F0;border-color:#FFD0B0;}
.mcc-n{font-size:10px;font-weight:800;}
.mcc.kamp .mcc-n{color:var(--accent);font-weight:900;}
.mcc-dot{width:5px;height:5px;border-radius:50%;margin:2px auto 0;}
.m-evs{margin-top:.875rem;display:flex;flex-direction:column;gap:7px;}
.m-ev{display:flex;align-items:flex-start;gap:8px;}
.m-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;margin-top:3px;}

/* ── MAP ── */
.map-wrap{border-radius:12px;overflow:hidden;border:1.5px solid var(--border);position:relative;}
.map-wrap img{width:100%;height:260px;object-fit:cover;display:block;}
.map-overlay{position:absolute;bottom:8px;right:8px;background:rgba(255,255,255,.9);border-radius:8px;padding:4px 10px;font-size:11px;font-weight:700;color:var(--text);}

/* ── PAKLIJST ── */
.pak-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px;}
@media(max-width:500px){.pak-grid{grid-template-columns:1fr;}}
.pak-sec{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin:1rem 0 .4rem;grid-column:1/-1;}
.pak-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;cursor:pointer;transition:background .1s;user-select:none;}
.pak-item:hover{background:var(--bg);}
.pak-item input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent);cursor:pointer;flex-shrink:0;}
.pak-item label{font-size:14px;font-weight:600;cursor:pointer;line-height:1.3;}
.pak-item.done label{text-decoration:line-through;color:var(--muted);}

/* ── DATA TABLE ── */
.data-table{width:100%;border-collapse:collapse;background:var(--card);border:1.5px solid var(--border);border-radius:16px;overflow:hidden;}
.data-table th{background:var(--bg);padding:9px 14px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);text-align:left;border-bottom:1.5px solid var(--border);}
.data-table td{padding:10px 14px;font-size:14px;border-bottom:1px solid var(--border);}
.data-table tr:last-child td{border-bottom:none;}
.data-table tr:hover td{background:#FAFAF8;}
.tsel{border:1.5px solid var(--border);border-radius:8px;padding:5px 8px;font-family:'Nunito',sans-serif;font-size:13px;font-weight:700;background:var(--card);color:var(--text);cursor:pointer;}
.tsel:focus{outline:none;border-color:var(--accent);}

/* ── FILTER + TABS ── */
.filter-bar{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:1.25rem;}
.chip{background:var(--card);border:1.5px solid var(--border);border-radius:20px;padding:6px 13px;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;}
.chip:hover{border-color:var(--text);}
.chip.active{background:var(--text);color:white;border-color:var(--text);}
.tab-row{display:flex;gap:2px;margin-bottom:1.5rem;border-bottom:1.5px solid var(--border);}
.tab-btn{background:none;border:none;padding:10px 16px;font-size:14px;font-weight:700;font-family:'Nunito',sans-serif;color:var(--muted);cursor:pointer;border-bottom:2.5px solid transparent;margin-bottom:-1.5px;transition:all .15s;}
.tab-btn:hover{color:var(--text);}
.tab-btn.active{color:var(--text);border-bottom-color:var(--accent);}

/* ── DRAAIBOEK ── */
.db-item{background:var(--card);border:1.5px solid var(--border);border-radius:14px;margin-bottom:8px;overflow:hidden;}
.db-hdr{padding:.9rem 1.1rem;display:flex;align-items:center;gap:12px;cursor:pointer;user-select:none;}
.db-hdr:hover{background:var(--bg);}
.db-time{font-size:13px;font-weight:800;color:var(--muted);min-width:48px;font-variant-numeric:tabular-nums;}
.db-act{font-size:15px;font-weight:700;flex:1;}
.db-chev{color:var(--muted);transition:transform .2s;font-size:12px;}
.db-body{padding:.875rem 1.1rem;font-size:14px;color:var(--muted);line-height:1.65;border-top:1px solid var(--border);}

/* ── CAMPING ── */
.cg{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:1rem;}
.cc{background:var(--card);border:1.5px solid var(--border);border-radius:16px;overflow:hidden;transition:box-shadow .15s;}
.cc:hover{box-shadow:var(--shadow);}
.ci{height:86px;display:flex;align-items:center;justify-content:center;font-size:34px;}
.cb{padding:.875rem 1rem;}
.cn{font-size:15px;font-weight:800;margin-bottom:3px;}
.cl{font-size:13px;color:var(--muted);margin-bottom:8px;}
.cm{display:flex;justify-content:space-between;align-items:center;}
.cy{font-size:12px;font-weight:700;background:var(--bg);border:1px solid var(--border);border-radius:20px;padding:2px 9px;color:var(--muted);}
.ct{font-size:13px;font-weight:800;color:var(--accent);}

/* ── KALENDER ── */
.cal-wrap{background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:1.25rem;margin-bottom:1.5rem;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.cday-n{text-align:center;font-size:11px;font-weight:800;text-transform:uppercase;color:var(--muted);padding:4px 0;}
.ccell{min-height:50px;border-radius:8px;border:1.5px solid var(--border);padding:4px;background:var(--card);}
.ccell.empty{border-color:transparent;background:transparent;}
.ccell.kamp{background:#FFF5F0;border-color:#FFD0B0;}
.ccell-n{font-size:12px;font-weight:800;}
.ccell.kamp .ccell-n{color:var(--accent);font-weight:900;}
.cdots{display:flex;gap:3px;flex-wrap:wrap;margin-top:3px;}
.cdot{width:6px;height:6px;border-radius:50%;}
.ev-list{display:flex;flex-direction:column;gap:8px;}
.ev-item{background:var(--card);border:1.5px solid var(--border);border-radius:12px;padding:.875rem 1rem;display:flex;align-items:center;gap:12px;}

/* ── CAMPING MAP ── */
.addr-row{display:flex;gap:10px;margin-bottom:1.25rem;align-items:flex-end;flex-wrap:wrap;}
.addr-row .finput{flex:1;min-width:180px;}
.abtn{background:var(--text);color:white;border:none;border-radius:12px;padding:11px 16px;font-size:13px;font-weight:800;font-family:'Nunito',sans-serif;cursor:pointer;white-space:nowrap;}
.abtn:hover{opacity:.85;}
.map-ph{background:var(--card);border:1.5px solid var(--border);border-radius:16px;height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--muted);font-size:14px;margin-bottom:1rem;gap:8px;}

/* ── MEMBER ROW ── */
.mrow{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border);}
.mrow:last-child{border-bottom:none;}
.ava{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;color:white;flex-shrink:0;}

/* ── TOAST ── */
#toast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(80px);background:#2B2D42;color:white;padding:10px 22px;border-radius:50px;font-size:14px;font-weight:700;z-index:300;transition:transform .3s;pointer-events:none;}
#toast.show{transform:translateX(-50%) translateY(0);}

/* ── LOADING ── */
.spinner{display:inline-block;width:18px;height:18px;border:2.5px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle;margin-right:6px;}
@keyframes spin{to{transform:rotate(360deg);}}

@media(max-width:640px){.nav-links{display:none;}.page{padding:1.5rem 1rem;}}