html,body{margin:0;padding:0;min-height:100%;font-family:Arial,sans-serif;color:#111}body{background:#f1d776 url("assets/achtergrond.svg") repeat}*{box-sizing:border-box}.topnav{display:flex;align-items:stretch;flex-wrap:wrap;background:#f2f2f2;box-shadow:0 8px 12px rgba(0,0,0,.4);position:relative;z-index:3}.topnav a,.menu{display:block;color:#000;text-align:center;padding:14px 16px;text-decoration:none;font-size:17px}.topnav .brand{background:#c00;color:#f2f2f2;font-weight:700}.topnav a:hover{background:#d9d9d9}.topnav .brand:hover{background:#a00}.topnav a[aria-current=page]:not(.brand){box-shadow:inset 0 -4px #c00}.menu{display:none;border:0;background:transparent;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #1f6e37;outline-offset:4px}.content{background:#fff;max-width:80%;min-height:60vh;margin:10px auto 18px;padding:15px;box-shadow:0 4px 8px rgba(0,0,0,.5),0 6px 20px rgba(0,0,0,.19);border-radius:10px;position:relative;z-index:1}.content h1{margin-top:0}.content p{line-height:1.55}.content a{color:#b10000}.home-pot{display:block;width:120px;height:165px;margin:24px auto}.footer{color:#c00;padding:0 10%;display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap;margin:12px 0 20px;font-size:14px}.footer small{font-size:12px}.bounce-toggle{border:1px solid #c00;color:#c00;background:#fff7d9;padding:6px 9px;border-radius:4px;cursor:pointer}.dvd{position:fixed;width:70px;height:97px;left:0;top:0;pointer-events:none;z-index:4;opacity:.78;will-change:transform}.dvd img{width:100%;height:100%;display:block}.time-answer{font-size:clamp(36px,8vw,90px);color:#c00;font-weight:700;margin:35px 0 10px}.time-explanation{font-size:24px}.time-list{padding-left:22px;line-height:2}.distance{font-size:clamp(40px,9vw,84px);font-weight:700;margin:26px 0 8px;overflow-wrap:anywhere}.muted{color:#555;font-size:14px}.actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:24px 0}.primary{padding:12px 18px;border:0;border-radius:5px;background:#c00;color:#fff;font-family:inherit;font-size:17px;cursor:pointer}.primary:hover{background:#a00}.primary:disabled{opacity:.6;cursor:wait}.location-status{min-height:44px}.simulation{position:relative;max-width:800px;aspect-ratio:1;background:#c8c8c8 url("assets/achtergrond.svg") center/260px 190px;border-radius:6px;overflow:hidden;margin:auto;border:1px solid #aaa}.simulation-title{position:absolute;top:8%;left:0;width:100%;text-align:center;font-size:clamp(27px,5vw,64px);margin:0;text-shadow:2px 2px #fff}.sim-pot{position:absolute;width:31%;height:47%;left:40%;top:26%;transform-origin:50% 65%;}.sim-pot img{position:absolute;width:100%;height:100%;inset:0;object-fit:contain}.slider-area{position:absolute;left:5%;right:5%;bottom:4%;padding:12px 15px;background:rgba(255,255,255,.92);border-radius:5px}.slider-area label{font-size:clamp(17px,3vw,29px);font-weight:700;display:block;margin-bottom:8px}.slider-line{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.slider-line input{width:min(330px,100%);height:34px;accent-color:#c00;cursor:pointer}.slider-line output{font-size:15px}.sim-reset{border:1px solid #c00;border-radius:4px;background:#fff;color:#c00;padding:8px 12px;cursor:pointer}.dvd-page{background:#111;min-height:100vh;color:#fff}.dvd-page .topnav,.dvd-page .footer{display:none}.dvd-page .dvd{width:135px;height:186px;opacity:1}.dvd-back{position:fixed;z-index:5;left:18px;bottom:18px;color:#fff;background:#333;padding:12px;text-decoration:none;border-radius:5px}.dvd-page .dvd-control{position:fixed;z-index:5;right:18px;bottom:18px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:600px){.topnav a:not(.brand){display:none}.menu{display:block;margin-left:auto}.topnav.expanded a{display:block;text-align:left;width:100%;order:2}.topnav.expanded .brand{width:auto;order:0}.topnav.expanded .menu{order:1}.content{max-width:calc(100% - 24px);padding:15px;min-height:65vh}.content h1{font-size:26px}.footer{padding:0 12px;font-size:12px}.dvd{width:48px;height:66px}.simulation{aspect-ratio:4/5}.simulation-title{font-size:28px}.sim-pot{width:36%;left:38%;height:39%;top:22%}.slider-area{left:3%;right:3%;bottom:3%;padding:10px}.slider-area label{font-size:19px}.slider-line{gap:8px}.slider-line input{width:100%}.slider-line output{font-size:13px}.sim-reset{font-size:12px;padding:6px}.time-explanation{font-size:19px}}@media(prefers-reduced-motion:reduce){.dvd{display:none}.dvd-page .dvd{display:block}}

