:root{--blue:#07399a;--deep:#052968;--yellow:#ffdc00;--ink:#102446;--bg:#fff1a8;--line:#dce4f1;--muted:#61718a}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--ink);background:var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}.hidden{display:none!important}.login{min-height:100dvh;background:radial-gradient(circle at 50% 40%,#124bb5,var(--blue) 65%,#06266c);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 20px;color:white}.brand{position:relative;width:min(76vw,330px)}.brand img{width:100%;display:block;border-radius:50%}.tm{position:absolute;right:-19px;top:4px;color:var(--yellow);font-size:27px;font-weight:900}.login-card{width:min(100%,380px);margin-top:42px;display:grid;gap:12px}.login-card input{width:100%;border:2px solid #fff7;border-radius:12px;padding:15px;background:white;color:var(--ink)}.primary{background:var(--yellow);color:var(--deep);font-weight:900;border:0;border-radius:13px;padding:15px 18px}.secondary{background:white;color:var(--blue);font-weight:700;border:1px solid var(--line);border-radius:12px;padding:11px 14px}.danger{background:#fff1f1;color:#a11f1f;border:1px solid #ffbdbd}.login small{text-align:center;color:#dbe7ff}.shell{max-width:940px;margin:auto;padding:0 16px 100px}.top{background:var(--blue);color:white;padding:12px 16px;position:sticky;top:0;z-index:5;box-shadow:0 3px 15px #001a4626}.top-inner{max-width:940px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.top img{width:45px;height:45px;object-fit:cover;border-radius:50%}.top-title{display:flex;align-items:center;gap:10px;font-weight:850;font-size:20px}.top button{background:#ffffff1c;color:white;border:1px solid #ffffff66;border-radius:10px;padding:8px}.nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;background:white;border-top:1px solid var(--line);z-index:9;padding-bottom:env(safe-area-inset-bottom)}.nav-inner{display:flex;max-width:940px;width:100%;justify-content:space-around}.nav button{background:transparent;border:0;color:#61718a;padding:11px 4px;min-width:60px;display:grid;gap:3px;font-size:12px}.nav button.active{color:var(--blue);font-weight:800}.nav span{font-size:21px}h1{font-size:27px;margin:25px 0 5px}h2{font-size:19px;margin:0 0 12px}.lead{color:var(--muted);margin:0 0 18px}.card{background:white;border:1px solid var(--line);border-radius:17px;padding:17px;margin:14px 0;box-shadow:0 3px 14px #142b5410}.hero{background:var(--blue);color:white}.hero .muted{color:#d9e4ff}.muted{color:var(--muted);font-size:13px}.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.tile{background:white;border:1px solid var(--line);border-radius:15px;padding:19px 13px;text-align:left;display:grid;gap:7px;color:var(--ink);font-weight:800}.tile span{font-size:27px}.tile small{color:var(--muted);font-weight:400}.line{border-top:1px solid var(--line);padding:13px 0;display:flex;align-items:center;justify-content:space-between;gap:10px}.line:first-of-type{border-top:0}.chip{font-size:11px;background:#e9f0ff;color:#13469e;border-radius:20px;padding:5px 9px;display:inline-block}.flex{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.between{justify-content:space-between}.stack{display:grid;gap:11px}.field{display:grid;gap:5px;font-size:13px;font-weight:650}.field input,.field select,.field textarea{padding:12px;border:1px solid #cbd7e9;border-radius:10px;width:100%;background:white;color:var(--ink)}textarea{min-height:90px}.actions{display:flex;gap:8px;flex-wrap:wrap}.small{font-size:12px;padding:8px 11px}.notice{background:#fff8d6;border:1px solid #f0d56d;padding:12px;border-radius:12px;font-size:13px}.error{background:#ffe6e6;color:#8d1414;padding:12px;border-radius:12px;margin:12px 0}.ok{background:#e3f7e9;color:#146033;padding:12px;border-radius:12px;margin:12px 0}.avatar{background:#eaf0fb;border-radius:50%;width:43px;height:43px;display:grid;place-items:center;font-weight:900;color:var(--blue)}.person{display:flex;gap:12px;align-items:center}.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.photo{position:relative;overflow:hidden;border-radius:12px;background:#e2e7f1;min-height:130px}.photo img{width:100%;height:180px;object-fit:cover;pointer-events:none;user-select:none;-webkit-user-drag:none}.watermark{position:absolute;bottom:12px;left:5px;right:5px;text-align:center;pointer-events:none;transform:rotate(-13deg);color:#fff;text-shadow:0 1px 4px #000;font-weight:900;font-size:12px;opacity:.85}.footer{margin:30px 0;text-align:center;color:var(--muted);font-size:12px}@media(min-width:680px){.tiles{grid-template-columns:repeat(3,1fr)}.gallery{grid-template-columns:repeat(3,1fr)}}

/* Boerenraod 2.0 */
.top-inner{justify-content:space-between}.top-title{margin:auto}.top-title img{width:58px;height:58px}.top .hamburger{font-size:27px;border:0;background:transparent;padding:5px 12px}.top .profile-link{border:0;background:transparent;padding:0}.top .avatar{width:43px;height:43px}.nav{background:#07399a;border-color:#07399a}.nav button{color:#e6edff}.nav button.active{color:#ffdc00}.drawer-backdrop{position:fixed;inset:0;background:#0007;z-index:11}.drawer{position:fixed;top:0;bottom:0;left:0;width:min(85vw,340px);background:#fff8d6;z-index:12;overflow:auto;box-shadow:6px 0 22px #0004;padding:16px}.drawer>button{display:flex;gap:16px;align-items:center;background:transparent;border:0;border-bottom:1px solid #d9d3ac;width:100%;padding:15px 8px;text-align:left;color:#07399a;font-weight:750}.drawer>button span{font-size:23px;min-width:30px}.drawer-title{font-weight:900;color:#07399a;display:flex;justify-content:space-between;align-items:center;padding:10px 4px 22px}.drawer-title button{background:transparent;border:0;font-size:23px;color:#07399a}.avatar{overflow:hidden;flex-shrink:0;background:#07399a;color:#ffdc00}.avatar img{width:100%;height:100%;object-fit:cover;display:block}.avatar.large{width:64px;height:64px;font-size:20px}.avatar.huge{width:112px;height:112px;font-size:32px}.profile-photo{display:flex;justify-content:center;padding:10px 0 20px}.switch{display:flex;gap:8px;margin:12px 0}.switch button{flex:1;border:1px solid #07399a;border-radius:10px;padding:11px;background:white;color:#07399a;font-weight:700}.switch .chosen{background:#07399a;color:white}.hero h2 small{font-size:12px;font-weight:500;color:#ffdc00}.hero .primary{margin-top:10px}.tile{min-height:110px}.card{border-color:#eadb7e}.gallery{margin-top:12px}.person{align-items:flex-start}.line{flex-wrap:wrap}

/* ================================================================
   BOERENRAOD 2.0 — APPLE MINIMAL
   Presentatie-only update. Geen wijzigingen aan functionaliteit.
   ================================================================ */
:root{
  --blue:#124a9b;--deep:#0b2c61;--yellow:#f6cd38;
  --ink:#18243a;--bg:#f5f6f8;--line:#e6e9ef;--muted:#748093;
}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Segoe UI',system-ui,sans-serif;line-height:1.45;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #8db5f7;outline-offset:2px}
.shell{max-width:980px;padding:0 18px calc(108px + env(safe-area-inset-bottom))}
h1{font-size:clamp(29px,5vw,37px);font-weight:800;letter-spacing:-.045em;line-height:1.13;margin:31px 0 7px;color:#152644}
h2{font-size:19px;font-weight:750;letter-spacing:-.025em;color:#182944}
.lead{font-size:15px;color:var(--muted);margin-bottom:23px}
.muted{color:var(--muted);font-size:13px}
.top{background:rgba(255,255,255,.96);color:var(--deep);box-shadow:none;border-bottom:1px solid #e9ecf1;padding:8px 16px;backdrop-filter:saturate(1.4) blur(16px);-webkit-backdrop-filter:saturate(1.4) blur(16px)}
.top-inner{min-height:52px;position:relative}
.top-title{position:absolute;left:50%;transform:translateX(-50%);margin:0;pointer-events:none}
.top-title img{width:47px;height:47px}
.top .hamburger{color:var(--blue);font-size:25px;padding:7px 12px;border-radius:13px;min-height:44px;min-width:44px}
.top .profile-link{margin-left:auto;min-height:44px;min-width:44px;display:grid;place-items:center}
.top .avatar{width:38px;height:38px;border:2px solid white;box-shadow:0 0 0 1px #e2e8f2}
.nav{background:rgba(255,255,255,.96);border-top:1px solid #e6eaf1;box-shadow:0 -6px 20px #182c4b08;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.nav-inner{max-width:980px}
.nav button{color:#8290a4;font-size:11px;min-width:65px;min-height:57px;gap:1px;padding:8px 8px 7px;border-radius:12px}
.nav button.active{color:var(--blue);font-weight:750}
.nav span{font-size:22px;line-height:1.3}
.card{background:#fff;border:1px solid #edf0f4;border-radius:21px;box-shadow:0 3px 18px #122b5108;padding:21px;margin:16px 0}
.hero{background:linear-gradient(135deg,#174f9d,#0e397b);border-color:transparent;color:white;box-shadow:0 8px 20px #0e397b1c}
.hero h2{color:#fff}
.hero h2 small{color:#d7e7ff}
.hero .muted{color:#dce8fa}
.primary{background:var(--blue);color:white;font-weight:750;border:0;border-radius:13px;min-height:44px;padding:12px 17px;box-shadow:none}
.hero .primary{background:#fff;color:var(--blue)}
.secondary{background:#f5f7fb;color:var(--blue);border:1px solid #e9edf4;border-radius:12px;font-weight:650;min-height:42px}
.danger{background:#fff0f1;color:#b1273c;border-color:#f7d7dd}
.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tile{min-height:112px;background:#fff;border:1px solid #eef0f4;border-radius:19px;padding:18px;text-align:left;gap:5px;box-shadow:0 2px 13px #132a4c07;font-weight:750;transition:transform .15s ease,background .15s ease}
.tile:active{transform:scale(.98);background:#f6f9fd}
.tile span{font-size:25px;line-height:1.3}
.tile small{font-size:12px;color:#7c8799;font-weight:450}
.line{border-top:1px solid #edf0f4;padding:15px 0;gap:12px}
.line b{font-weight:700}
.chip{background:#eaf1fd;color:#2859a3;font-size:11px;font-weight:600;border-radius:20px;padding:4px 9px}
.field{font-size:13px;gap:6px;font-weight:650;color:#2b3a54}
.field input,.field select,.field textarea{background:#f9fafc;border:1px solid #e0e6ef;border-radius:12px;padding:13px 14px;min-height:46px;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{background:#fff;border-color:#82abe7}
.notice{background:#fff9e9;border:1px solid #f6e7b4;border-radius:15px;padding:14px;color:#5c502f}
.ok,.error{border-radius:13px;padding:13px 15px}
.avatar{background:#e8eff9;color:var(--blue);font-weight:750}
.avatar.large{width:62px;height:62px}
.avatar.huge{width:120px;height:120px}
.person{align-items:center;gap:13px}
.switch{background:#e9edf3;border-radius:13px;padding:4px;gap:3px}
.switch button{background:transparent;color:#627086;border:0;border-radius:10px;padding:10px 8px;min-height:42px;font-weight:650}
.switch .chosen{background:white;color:var(--blue);box-shadow:0 1px 5px #102e551c}
.gallery{gap:11px}
.photo{border-radius:15px;background:#e9edf3;min-height:135px}
.photo img{height:190px}
.watermark{font-size:11px}
.drawer-backdrop{background:#0b1e3866}
.drawer{background:#f8f9fb;box-shadow:8px 0 30px #132b4930;padding:20px 17px}
.drawer-title{color:var(--deep);padding:12px 8px 18px}
.drawer-title button{color:var(--blue);min-height:44px;min-width:44px}
.drawer>button{border-bottom:1px solid #e6eaf0;color:#263e65;font-weight:650;padding:14px 10px;min-height:51px}
.drawer>button span{color:var(--blue)}
.login{background:linear-gradient(160deg,#153f86,#0a2a62)}
.login-card .primary{background:var(--yellow);color:#173a70}
@media(min-width:680px){.tiles{grid-template-columns:repeat(4,minmax(0,1fr))}.gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.shell{padding-left:26px;padding-right:26px}}
@media(max-width:380px){.shell{padding-left:13px;padding-right:13px}.card{padding:16px}.tile{padding:14px}.nav button{min-width:56px}}
@media(prefers-reduced-motion:reduce){.tile{transition:none}}

/* Boerenraod 2.0 — Warm Accent / Apple Minimal. Alleen vormgeving. */
:root{--bg:#fff4c9;--yellow:#ffda00;--blue:#0750b8;--deep:#0a3476;--ink:#142747;--muted:#65758c;--line:#ede6cc}
body{background:linear-gradient(180deg,#fff0ae 0,#fff6d7 420px,#fff9e9 100%);background-attachment:fixed}
.top{background:#fff6d7;border-bottom:1px solid #eadfac;box-shadow:none;color:var(--deep)}
.top button{color:var(--deep)}
.top-inner{min-height:54px}
.top .hamburger{color:var(--deep);display:grid;place-items:center;min-width:44px;min-height:44px}
.top .top-title img{width:54px;height:54px}
.shell{padding-top:14px}
h1{letter-spacing:-.045em;font-weight:800}
.card{background:#fff;border-color:#f0e8cf;box-shadow:0 5px 22px #7a62100b;border-radius:23px}
.home-intro h1{font-size:clamp(31px,4vw,43px);margin-top:15px}
.home-intro .lead{margin-bottom:22px}
.hero.home-feature{padding:19px 21px;background:linear-gradient(115deg,#1456b4,#07367f);color:#fff;border:0;border-radius:22px;min-height:0}
.feature-head,.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.feature-head h2,.section-head h2{margin:0}
.feature-head h2{font-size:17px}.feature-head h2 small{font-size:12px;color:#d9e8ff}
.feature-link,.section-link{border:0;background:transparent;color:inherit;padding:9px 2px;font-size:12px;font-weight:700;white-space:nowrap}
.section-link{color:var(--blue)}
.event-row{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid #102c4915;min-width:0}
.event-row:first-of-type{border-top:0}
.event-date{flex:0 0 53px;min-height:57px;border-radius:12px;background:#fff6d9;color:#b63a25;display:flex;flex-direction:column;align-items:center;justify-content:center}
.event-date strong{font-size:24px;line-height:1;font-weight:850}.event-date span{font-size:11px;text-transform:uppercase;font-weight:750;margin-top:4px}
.event-info{min-width:0;flex:1;display:grid;gap:3px}.event-info b{font-size:15px;line-height:1.25}.event-info small{font-size:12px;color:var(--muted)}
.event-time{background:#eaf2ff;color:#0750b8;padding:6px 8px;border-radius:10px;font-size:12px;font-weight:750}
.hero .event-row{border-color:#ffffff35}.hero .event-info small{color:#d9e8ff}.hero .event-date{background:#fff;color:#b63a25}
.home-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:13px 0}
.home-tiles .tile{position:relative;min-height:120px;border:1px solid #f2e9cb;border-radius:19px;padding:16px 17px;gap:6px;box-shadow:0 3px 16px #6d53100b}
.home-tiles .tile strong{font-size:15px}.home-tiles .tile small{font-size:12px}
.tile-icon{width:35px;height:35px;display:grid;place-items:center;background:#eaf2ff;color:#0750b8;border-radius:10px}
.tile-icon .ui-icon{width:22px;height:22px}.home-tiles .tile:nth-child(2) .tile-icon,.home-tiles .tile:nth-child(3) .tile-icon{background:#fff0a9;color:#174b9d}
.tile-chevron{position:absolute;right:15px;top:44%;font-size:24px;color:#a0aabd;font-weight:400}
.ui-icon{display:block;flex-shrink:0}
.nav{background:#fffffffa;border-top:1px solid #ece6d5;box-shadow:0 -4px 16px #655a3110}
.nav button{color:#75839b;min-height:60px;align-content:center;gap:4px}.nav button.active{color:var(--blue)}
.nav .nav-icon{display:flex;justify-content:center;align-items:center}.nav .ui-icon{width:23px;height:23px}
.drawer{background:#fff9e7}.drawer>button span.nav-icon{display:grid;place-items:center;min-width:30px}
.member-list{padding:4px 18px}.member-list .line{padding:14px 0}.member-list .person b{font-size:15px}.member-list .avatar.large{width:57px;height:57px}
.switch{background:#f3eacb}.switch .chosen{background:#fff}
.primary{background:var(--yellow);color:#153a72}.secondary{color:var(--blue)}
:focus-visible{outline:3px solid #3c83ed;outline-offset:2px}
@media(min-width:680px){.home-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}.home-tiles .tile{min-height:136px}}
@media(max-width:480px){.shell{padding-left:15px;padding-right:15px}.hero.home-feature{padding:16px}.feature-head h2{font-size:15px}.event-info b{font-size:13px}.event-time{font-size:11px}.home-tiles .tile{padding:14px 12px}.home-tiles .tile strong{font-size:14px}}


/* Boerenraod 2.0 — Warm Accent PLUS | 13 oktober 2026
   Meer herkenbaar S.O.K.-geel, zonder wijziging aan functies. */
:root {
  --bg: #ffe88a;
  --yellow: #ffdc00;
  --line: #e9dca9;
}
body {
  background: linear-gradient(180deg,
    #ffe477 0px,
    #ffe993 280px,
    #fff0b0 650px,
    #fff6d8 1100px);
  background-attachment: fixed;
}
.top {
  background: #fff0b4;
  border-bottom: 1px solid #e9d47f;
}
.card {
  border-color: #efdfab;
  box-shadow: 0 5px 20px rgba(104,78,0,.075);
}
.home-tiles .tile {
  border-color: #f0dfa6;
}
.home-tiles .tile:nth-child(2) .tile-icon,
.home-tiles .tile:nth-child(3) .tile-icon {
  background: #ffdc00;
  color: #07399a;
}
.event-date { background: #ffefac; }
.primary { background: #ffdc00; color: #092f74; }
.notice { background: #fff4c1; border-color: #ead17b; }
.drawer { background: #fff3c4; }
.switch { background: #f7e9b2; }
@media (prefers-contrast: more) {
  .card, .home-tiles .tile { border-color: #c5a84d; }
}

/* Boerenraod 2.0 — Apple Minimal: Doofpot albums en fotoviewer */
.album-create summary{font-weight:750;cursor:pointer;list-style:none}.album-create summary::-webkit-details-marker{display:none}.album-create form{margin-top:18px}
.photo-library{margin:24px 0}.library-heading,.album-detail-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:15px}.library-heading h2,.album-detail-head h2{margin:0}
.album-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.album-cover{border:0;background:white;border-radius:19px;padding:0;overflow:hidden;text-align:left;color:var(--ink);box-shadow:0 4px 18px #57430016;min-width:0}.album-cover-image{height:180px;background:#f0e9cf;display:grid;place-items:center;overflow:hidden}.album-cover-image img{width:100%;height:100%;object-fit:cover}.album-cover-image .ui-icon{width:46px;height:46px;color:var(--blue)}.album-cover-caption{padding:13px 15px;display:grid;gap:4px}.album-cover-caption strong{font-size:16px}.album-cover-caption small{color:var(--muted)}
.album-detail{padding:20px}.album-detail .gallery{margin:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.album-detail .photo{min-height:0;aspect-ratio:1;position:relative;border-radius:12px}.photo-open{width:100%;height:100%;padding:0;border:0;background:transparent;display:block;position:relative}.photo-open img{width:100%;height:100%;object-fit:cover;pointer-events:none}.photo-delete{position:absolute;right:7px;top:7px;z-index:2;min-width:36px;min-height:36px}.photo-open .watermark{font-size:10px;bottom:10px}
.photo-viewer{position:fixed;inset:0;z-index:1000;background:#080a0e;color:white;display:flex;flex-direction:column;touch-action:pan-y}.viewer-top,.viewer-bottom{display:flex;align-items:center;justify-content:space-between;padding:14px max(16px,env(safe-area-inset-left));min-height:64px}.viewer-top button,.viewer-bottom button{background:#ffffff1a;border:0;border-radius:50%;color:white;min-width:46px;min-height:46px;font-size:26px}.viewer-top span{font-size:14px}.viewer-spacer{width:46px}.viewer-stage{flex:1;min-height:0;position:relative;display:grid;place-items:center;overflow:hidden}.viewer-stage img{max-width:100%;max-height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}.viewer-watermark{position:absolute;bottom:16%;left:5%;right:5%;text-align:center;transform:rotate(-13deg);pointer-events:none;font-weight:800;font-size:clamp(14px,3vw,23px);text-shadow:0 2px 5px #000b;opacity:.82}.viewer-bottom{justify-content:space-around;padding-bottom:max(16px,env(safe-area-inset-bottom))}.viewer-bottom button:disabled{opacity:.25}
@media(min-width:680px){.album-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.album-detail .gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:480px){.album-cover-image{height:140px}.album-cover-caption{padding:11px}.album-detail{padding:14px}}

/* Boerenraod 2.0 — blauw/geel navigatiekader en beheer */
.top{background:#07399a;color:#fff;border-bottom:1px solid #052968;box-shadow:0 2px 12px #05296825}
.top button,.top .hamburger{color:#ffdc00}
.top .avatar{border:3px solid #ffdc00;box-shadow:0 0 0 2px #07399a;background:#fff;color:#07399a}
.nav{background:#07399a;border-top:1px solid #052968;box-shadow:0 -3px 15px #05296822}
.nav button{color:#d7e3fa}
.nav button.active{color:#ffdc00;font-weight:800}
.nav button.active .nav-icon{color:#ffdc00}
.photo-move{position:absolute;left:7px;top:7px;z-index:2;min-height:36px;background:#fffdf3eF;color:#07399a;font-size:11px;padding:7px 9px}
.album-detail-head .actions{width:100%;justify-content:flex-start}
.album-detail-head .actions button{min-height:38px}
@media(max-width:380px){.photo-move{font-size:10px;padding:6px}}

/* Ledenbeheer 2.0 */
.admin-member{align-items:flex-start;display:flex;flex-wrap:wrap;gap:12px;padding:17px 0}.admin-member-info{flex:1;min-width:200px}.admin-member .actions{justify-content:flex-end}.admin-commission-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}.admin-commission-edit{width:100%;margin-top:4px;padding:10px 13px;background:#fafbff;border:1px solid #e5eaf3;border-radius:13px}.admin-commission-edit summary{cursor:pointer;color:#07399a;font-weight:750}.admin-commission-checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:9px;margin-top:14px}.admin-commission-option{display:flex;gap:9px;align-items:center;padding:11px;border-radius:11px;background:#fff;border:1px solid #e4eaf3;cursor:pointer}.admin-commission-option input{width:18px;height:18px;accent-color:#07399a}.admin-commission-option small{display:block;color:#65758c}.admin-commission-option:has(input:disabled){opacity:.75;cursor:default}@media(max-width:520px){.admin-member .actions{width:100%;justify-content:flex-start}.admin-commission-checks{grid-template-columns:1fr}}

/* Commissies — compact overzicht, uitklapbare details */
.commission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0 28px;align-items:start}
.commission-item{background:#fff;border:1px solid #e8e3d2;border-radius:19px;box-shadow:0 4px 16px #5743000d;min-width:0;overflow:hidden}
.commission-item[open]{grid-column:1/-1}
.commission-summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;gap:8px;justify-content:space-between;padding:17px 19px;min-height:92px}
.commission-summary::-webkit-details-marker{display:none}
.commission-title{font-size:17px;line-height:1.3;font-weight:800;color:#172b4b;overflow-wrap:anywhere}
.commission-meta{display:flex;align-items:center;justify-content:space-between;color:#63748b;font-size:13px}
.commission-arrow{font-size:20px;line-height:1;color:#07399a;transition:transform .2s}
.commission-item[open] .commission-arrow{transform:rotate(180deg)}
.commission-detail{padding:0 19px 18px;border-top:1px solid #edf0f5}
.commission-description{margin:14px 0;color:#475b77}.commission-subtitle{font-size:14px;margin:15px 0 9px}
.commission-people{display:grid;gap:7px}.commission-person{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #edf0f5;flex-wrap:wrap}
.commission-manage{display:grid;gap:12px;margin-top:15px}.commission-manage>.card{margin:0;padding:12px 15px;border-radius:12px;box-shadow:none;background:#fafbff}.commission-manage>.secondary{justify-self:start}
.admin-commission-checks{grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:7px}
.admin-commission-option{padding:9px;gap:8px;font-size:14px;min-height:52px}
.admin-commission-option input{flex-shrink:0;width:17px;height:17px}
@media(min-width:800px){.commission-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1150px){.commission-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:520px){.commission-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.commission-summary{padding:13px;min-height:86px}.commission-title{font-size:15px}.commission-detail{padding:0 13px 14px}.admin-commission-checks{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-commission-option{font-size:12px;align-items:flex-start}.admin-commission-option small{font-size:11px}}
@media(max-width:340px){.commission-grid,.admin-commission-checks{grid-template-columns:1fr}}

/* Boerenraod 2.1 — commissies blijven in een vast raster; details eronder */
.commission-grid .commission-item{grid-column:auto;display:flex;flex-direction:column;justify-content:space-between;text-align:left;font:inherit;color:inherit;cursor:pointer;min-height:95px;padding:17px 19px;width:100%;border:1px solid #e8e3d2}
.commission-grid .commission-item.is-selected{border:2px solid #07399a;background:#f7faff;padding:16px 18px}
.commission-grid .commission-item:focus-visible{outline:3px solid #3c83ed;outline-offset:2px}
.commission-grid .commission-meta{width:100%;margin-top:12px}
.commission-grid .commission-item.is-selected .commission-arrow{transform:rotate(180deg)}
.commission-selected{margin:0 0 30px;padding:22px}
.commission-selected-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.commission-selected-head h2{margin:0}
.commission-search{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px}
.commission-search label{font-weight:700;color:#172b4b}
.commission-search input{flex:1;min-width:180px;max-width:460px;padding:12px 14px;border:1px solid #d8dfe9;border-radius:12px;background:#fff;color:#172b4b;font:inherit}
.commission-search .muted{font-size:13px}
@media(max-width:520px){.commission-grid .commission-item{padding:13px;min-height:90px}.commission-grid .commission-item.is-selected{padding:12px}.commission-selected{padding:16px}.commission-search{align-items:stretch}.commission-search label{width:100%}.commission-search input{max-width:none}}

/* 2.2: geselecteerde commissie boven het overzicht */
#commissionDetails{scroll-margin-top:88px}
.commission-selected+.commission-search{margin-top:26px}
.commission-grid{margin-bottom:28px}
@media(prefers-reduced-motion:reduce){#commissionDetails{scroll-behavior:auto}}

/* Boerenraod 2.3 — compacte, uniforme agenda- en taakkaarten */
.compact-section{padding:18px 20px}.compact-section>h2{margin:0 0 12px}.compact-record{background:#fff;border:1px solid #e8e3d2;border-radius:15px;margin:9px 0;overflow:hidden}.compact-record-summary{list-style:none;display:flex;align-items:center;gap:14px;padding:13px 15px;cursor:pointer;min-height:77px}.compact-record-summary::-webkit-details-marker{display:none}.compact-record-summary:focus-visible{outline:3px solid #3c83ed;outline-offset:-3px}.compact-record-main{display:flex;flex-direction:column;align-items:flex-start;gap:4px;flex:1;min-width:0}.compact-record-main>strong{font-size:15px;color:#172b4b;overflow-wrap:anywhere}.compact-record-main>small{font-size:12px;color:#63748b;line-height:1.4}.compact-date{flex:0 0 52px;background:#fff0b0;color:#07399a;border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:52px}.compact-date strong{font-size:23px;line-height:1.1}.compact-date small{font-size:11px;font-weight:800}.compact-task-icon{flex:0 0 43px;width:43px;height:43px;border-radius:12px;background:#fff0b0;color:#07399a;display:grid;place-items:center;font-size:25px;font-weight:800}.compact-task-icon.is-done{background:#e4f3e7;color:#247344}.compact-status{font-size:11px;font-weight:750;color:#07399a}.compact-status.is-done{color:#247344}.compact-chevron{color:#07399a;font-size:22px;transition:transform .2s}.compact-record[open] .compact-chevron{transform:rotate(180deg)}.compact-record-detail{padding:3px 15px 15px 81px;border-top:1px solid #edf0f5}.compact-record-detail p{overflow-wrap:anywhere}.compact-record-detail .actions{flex-wrap:wrap;justify-content:flex-start}.compact-record-detail button{min-height:36px}@media(max-width:520px){.compact-section{padding:14px}.compact-record-summary{gap:10px;padding:12px}.compact-date{flex-basis:46px;min-height:46px}.compact-date strong{font-size:21px}.compact-task-icon{flex-basis:40px;width:40px;height:40px}.compact-record-detail{padding:9px 12px 14px}}

/* Boerenraod 2.6 — integrale mobiele afwerking; alleen presentatie. */
html{min-width:0;scroll-padding-top:calc(84px + env(safe-area-inset-top,0px))}
body{min-width:0;overflow-x:hidden}
#app{min-width:0}
/* iOS standalone: statusbalk ligt over de webinhoud bij black-translucent. */
.top{padding-top:calc(8px + env(safe-area-inset-top,0px));padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px));z-index:10}
.top-inner{min-height:52px;gap:8px}
.top .hamburger,.top .profile-link{position:relative;z-index:1;flex:0 0 48px;min-width:48px;min-height:48px;display:grid;place-items:center;touch-action:manipulation}
.top-title{max-width:calc(100% - 116px)}
.top-title img{display:block;max-width:100%;width:47px;height:47px;object-fit:contain}
.drawer{padding-top:calc(16px + env(safe-area-inset-top,0px));padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));overscroll-behavior:contain}
.drawer-backdrop{z-index:11}
.nav{padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
.nav-inner{min-width:0}
.nav button{min-width:0;flex:1;touch-action:manipulation}
.shell{width:100%;min-width:0;padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))}
.shell>*{min-width:0}
.card,.tile,.compact-section,.compact-record,.album-detail,.commission-selected,.commission-item{min-width:0;max-width:100%}
.card img,.album-detail img,.photo img{max-width:100%}
.field input,.field select,.field textarea,.commission-search input{max-width:100%;min-width:0;font-size:16px}
button,summary,[data-action],[data-tab]{touch-action:manipulation}
.actions button,.switch button,.secondary,.primary{min-height:44px}
.compact-record-summary{min-height:64px}
.compact-record-main{min-width:0;overflow-wrap:anywhere}
.compact-record-detail{overflow-wrap:anywhere}
.commission-grid{min-width:0}
.commission-selected{scroll-margin-top:calc(84px + env(safe-area-inset-top,0px))}
#commissionDetails{scroll-margin-top:calc(84px + env(safe-area-inset-top,0px))}
.photo-viewer{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
.viewer-top button,.viewer-bottom button{min-width:44px;min-height:44px}
.login{padding-top:calc(28px + env(safe-area-inset-top,0px));padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))}
@media(max-width:520px){
 .shell{padding-left:14px;padding-right:14px}
 .tiles,.album-grid,.gallery,.commission-grid{min-width:0}
 .compact-section{padding:14px}
 .compact-record-detail{padding:12px}
 .admin-member-info{min-width:0;flex-basis:100%}
 .admin-member .actions{justify-content:flex-start;width:100%}
 .line{min-width:0;overflow-wrap:anywhere}
 .photo-library,.album-detail{min-width:0}
}
@media(max-width:360px){
 .top-title img{width:40px;height:40px}
 .nav button{font-size:10px;padding-left:2px;padding-right:2px}
 .nav .nav-icon{font-size:19px}
 .compact-record-summary{gap:8px}
 .commission-grid{gap:8px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}