:root{--bg:#0b0e10;--surface:#171c20;--surface2:#22282d;--line:#354047;--yellow:#edff35;--txt:#f6f7f5;--muted:#adb8bf;--green:#71e0a9;--red:#ff918e}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#090b0d;color:var(--txt);font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}button,input,textarea,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--yellow);outline-offset:3px}.hidden{display:none!important}#app{max-width:960px;margin:auto;min-height:100dvh;background:var(--bg);padding-bottom:104px;box-shadow:0 0 80px #0008}.appbar{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px clamp(15px,4vw,28px);background:#101417ef;backdrop-filter:blur(16px);border-bottom:1px solid #2b3237}.brand{display:flex;gap:10px;align-items:center}.brand img{border-radius:12px;object-fit:cover}.brand strong{display:block;font-size:22px;font-weight:900;letter-spacing:-.6px}.brand small{font-size:10px;color:#c1c7c3;letter-spacing:1.1px}.head-actions{display:flex;gap:8px}.icon-button{position:relative;border:1px solid #394248;border-radius:13px;color:white;background:#262b2e;width:44px;height:44px;font-size:19px}.notify-dot{position:absolute;right:7px;top:5px;background:var(--yellow);width:9px;height:9px;border-radius:50%}.main{padding:23px clamp(15px,4vw,30px) 40px}.loading{color:var(--muted);padding:30px;text-align:center}.eyebrow{color:var(--yellow);text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:900;margin:4px 0 9px}.page-title{margin:0 0 12px;font-size:clamp(25px,4vw,37px);line-height:1.14;letter-spacing:-1.25px}.sub{color:var(--muted);margin:0 0 22px}.hero{border:1px solid #525b41;border-radius:25px;background:linear-gradient(125deg,#303c32,#182124 65%,#161a1c);padding:26px 23px;position:relative;overflow:hidden}.hero:after{content:'🚴';font-size:112px;position:absolute;right:-13px;top:-19px;opacity:.09}.hero h2{font-size:30px;line-height:1.08;letter-spacing:-1px;margin:0 0 10px;max-width:520px}.hero p{max-width:480px}.hero .meta{color:#e6eddf;margin:12px 0 17px}.section-title{font-size:17px;font-weight:850;letter-spacing:-.4px;margin:27px 0 12px}.card{border:1px solid var(--line);background:var(--surface);border-radius:18px;padding:19px;margin:13px 0}.card h3{margin:0 0 9px;font-size:19px;letter-spacing:-.4px}.card h4{margin:0 0 8px;font-size:15px}.card p{margin:8px 0;color:#dce1dc}.muted{color:var(--muted)!important}.small{font-size:12px}.chip{display:inline-flex;align-items:center;gap:5px;border:1px solid #596256;border-radius:99px;font-size:12px;padding:5px 10px;color:#e4efdd}.pill{font-size:11px;padding:4px 9px;background:#313929;color:var(--yellow);border-radius:100px;font-weight:800}.bad{background:#49272a;color:#ffd3d3}.ok{background:#173b32;color:#8cf3ba}.btn{border:0;background:var(--yellow);color:#0d1113;padding:12px 16px;border-radius:12px;font-weight:850;display:inline-flex;align-items:center;justify-content:center;min-height:46px;gap:8px;text-align:center}.btn.secondary{background:#293238;color:white;border:1px solid #5a646b}.btn.danger{background:#532d30;color:#ffd2d1;border:1px solid #914e4f}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.wide{width:100%}.buttons{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0}.quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.quick a,.quick button{border:1px solid #3a464a;background:#21292d;color:var(--txt);min-height:110px;border-radius:17px;padding:17px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:left}.quick b{font-size:14px}.quick span{font-size:25px}.quick small{color:var(--muted)}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.vstack{display:grid;gap:9px}.divide{border:0;border-top:1px solid var(--line);margin:17px 0}.field{display:grid;gap:7px;margin:13px 0}.field label{font-size:12px;font-weight:750;color:#dde1dc}.field input,.field textarea,.field select{width:100%;background:#252d31;border:1px solid #59666a;color:white;border-radius:11px;padding:13px 14px;min-height:46px}.field textarea{resize:vertical;min-height:115px}.poll{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:15px 0}.poll button{border-radius:12px;border:1px solid #586265;color:white;background:#2a3236;min-height:73px;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:12px;gap:4px}.poll button b{font-size:21px}.poll button.selected{background:var(--yellow);color:#121718;border-color:var(--yellow)}.counts{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.count{background:#242d31;border-radius:12px;padding:11px 5px;text-align:center}.count strong{display:block;font-size:24px}.count small{color:#b7c3c5;font-size:11px}.post{border-top:1px solid var(--line);padding:14px 0}.post:first-child{border-top:0}.post h4{font-size:16px;margin:3px 0}.post p{white-space:pre-wrap;margin:6px 0 0;color:#dbe0de}.post time{color:var(--muted);font-size:11px}.table-wrap{overflow-x:auto}.data-table{width:100%;border-collapse:collapse;font-size:13px}.data-table td,.data-table th{padding:10px 6px;text-align:left;border-bottom:1px solid #394449}.data-table th{font-size:11px;color:var(--yellow)}.status-line{padding:10px 13px;border-radius:12px;border:1px solid #58614a;background:#273026;color:#e8f0db;font-size:13px}.status-line.warn{border-color:#8b6340;background:#34291f}.answer{border-left:3px solid var(--yellow);padding:8px 12px;background:#242b2b;border-radius:0 8px 8px 0;margin:8px 0}.answer p{margin:0}.mini{font-size:12px;color:var(--muted)}.bottom-nav{position:fixed;z-index:20;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,960px);background:#161b1ef2;border-top:1px solid #394146;display:grid;grid-template-columns:repeat(5,1fr);padding:9px 8px calc(12px + env(safe-area-inset-bottom));backdrop-filter:blur(18px)}.bottom-nav button{background:transparent;border:0;color:#b5bfc3;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;min-height:51px}.bottom-nav button span{font-size:22px;line-height:1.2}.bottom-nav button.on{color:var(--yellow)}.toast{position:fixed;z-index:60;bottom:93px;left:50%;transform:translateX(-50%);width:min(92vw,440px);background:#f0ff8b;color:#151a1b;padding:13px 17px;border-radius:12px;font-weight:750;box-shadow:0 10px 35px #000b;display:none}.toast.visible{display:block}.empty{color:var(--muted);padding:16px 0}.admin-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:7px}.admin-tabs button{border:1px solid #445057;color:#d5dede;border-radius:99px;padding:9px 13px;background:#20282b;white-space:nowrap}.admin-tabs button.on{background:var(--yellow);color:#101416;font-weight:800}.avatar{width:38px;height:38px;border-radius:50%;background:#39483c;display:grid;place-items:center;font-weight:800;color:var(--yellow)}.question{margin:12px 0}.question .who{color:var(--muted);font-size:12px}.footerlinks{margin:20px 0;color:#bfc6c7;font-size:12px}.footerlinks a{text-decoration:underline}.accent{color:var(--yellow)}@media(min-width:740px){.hero{padding:36px}.hero h2{font-size:39px}.quick{grid-template-columns:repeat(4,1fr)}.main{padding-top:29px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:15px}.two-col .card{margin:0}}@media(max-width:375px){.brand strong{font-size:18px}.brand small{font-size:9px}.brand img{width:42px;height:42px}.poll button{font-size:11px}.count strong{font-size:21px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}}

.brand-home{appearance:none;border:0;background:transparent;color:inherit;padding:0;text-align:left;cursor:pointer;min-width:0}.brand-home:focus-visible{outline:2px solid var(--yellow);border-radius:12px}.return-home{margin-bottom:18px}.appbar .brand-home img{flex-shrink:0}

/* iPhone PWA: houd logo, belletje en profiel onder de statusbalk/Dynamic Island. */
.appbar{padding-top:calc(13px + env(safe-area-inset-top, 0px));padding-left:max(clamp(15px,4vw,28px),env(safe-area-inset-left,0px));padding-right:max(clamp(15px,4vw,28px),env(safe-area-inset-right,0px));min-height:calc(72px + env(safe-area-inset-top,0px))}
@supports (padding-top:constant(safe-area-inset-top)){.appbar{padding-top:calc(13px + constant(safe-area-inset-top))}}
@media(max-width:420px){.appbar{gap:7px}.appbar .brand strong{font-size:clamp(17px,5vw,21px)}.appbar .brand small{font-size:9px;letter-spacing:.6px}.appbar .brand img{width:43px;height:43px}.head-actions{flex-shrink:0}.icon-button{width:41px;height:41px}}

/* Eerste-bezoek vraag voor pushmeldingen: veilige positie op iPhone, tablet en pc. */
.push-welcome-backdrop{position:fixed;inset:0;z-index:1000;background:#000b;display:flex;align-items:center;justify-content:center;padding:calc(20px + env(safe-area-inset-top,0px)) max(18px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px))}
.push-welcome-card{background:#1c2327;border:1px solid #697341;border-radius:23px;color:#fff;padding:26px 22px;width:min(100%,460px);max-height:85dvh;overflow-y:auto;box-shadow:0 18px 60px #000c}
.push-welcome-icon{font-size:38px}.push-welcome-card h2{margin:8px 0 10px;font-size:clamp(21px,5vw,27px);line-height:1.18}.push-welcome-card p{color:#dce4e4;line-height:1.5}.push-welcome-card .mini{font-size:12px;color:#b4bcbf}.push-welcome-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}.push-welcome-actions .btn{flex:1 1 165px}
