/* Snappy visual system — mobile-first, restrained, high contrast. */
@font-face{font-family:"Space Grotesk";src:url('/FONTS/SpaceGrotesk-Variable.woff2') format('woff2');font-weight:300 700;font-style:normal;font-display:swap}
:root{color-scheme:dark;--ink:#091413;--deep:#142b25;--panel:#193b31;--forest:#285a48;--green:#408a71;--mint:#b0e4cc;--text:#eef8f2;--muted:#b7cfc3;--border:#437462;--focus:#b0e4cc;--app-width:550px}
*{box-sizing:border-box}html{min-height:100%;background:var(--ink)}body{margin:0;color:var(--text);background:var(--ink);font-family:"Space Grotesk",Arial,sans-serif;font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:var(--mint);text-underline-offset:3px}a:hover{color:#fff}img{max-width:100%}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.15;letter-spacing:-.035em}h1{font-size:clamp(2rem,9vw,3rem);margin-bottom:1rem}h2{font-size:1.25rem}h3{font-size:1.05rem}p{color:var(--muted)}ul,ol{padding-left:1.3rem}li{margin:.65rem 0}hr{border:0;border-top:1px solid var(--border);margin:1.1rem 0}strong{color:var(--text)}
.top,.shell,.footer{width:min(100%,var(--app-width));margin-inline:auto}.top{min-height:65px;padding:1rem 1.15rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;border-bottom:1px solid var(--border);background:var(--deep)}.top .brand{font-size:1.2rem;font-weight:700;letter-spacing:-.04em;color:var(--mint);text-decoration:none}.top nav,.footer nav{display:flex;align-items:center;flex-wrap:wrap;gap:.65rem}.top nav a,.footer nav a,.top button{font-size:.82rem;color:var(--text);text-decoration:none}.top nav a:hover,.footer nav a:hover{color:var(--mint)}.top .link{border:0;background:none;padding:0}.shell{padding:1.35rem 1.15rem 2.5rem;min-height:calc(100svh - 142px);border-inline:1px solid rgba(176,228,204,.10);background:var(--ink)}.footer{padding:1.15rem;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:1rem;font-size:.82rem;color:var(--muted);background:var(--deep)}.hero{padding:3.8rem 0 2rem}.hero h1{max-width:12ch}.hero p:not(.eyebrow){font-size:1.08rem;max-width:36ch}.eyebrow{color:var(--mint);font-size:.7rem;letter-spacing:.19em;font-weight:700;text-transform:uppercase;margin-bottom:.75rem}.cards{display:grid;grid-template-columns:1fr;gap:.75rem;margin:1.25rem 0 1.6rem}.panel,.cards article{background:var(--deep);border:1px solid var(--border);border-radius:2px;padding:1.15rem;min-width:0}.cards .panel{display:block;text-decoration:none}.cards a.panel:hover{border-color:var(--mint)}.panel h2,.cards article h2{color:var(--text)}.panel p:last-child,.cards article p:last-child{margin-bottom:0}.button,button:not(.link){appearance:none;border:1px solid var(--mint);background:var(--mint);color:var(--ink);font-size:.9rem;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.79rem 1rem;min-height:44px;border-radius:2px;transition:background .15s ease,transform .15s ease,border-color .15s ease}.button:hover,button:not(.link):hover{background:#d3f5e6;border-color:#d3f5e6;color:var(--ink)}button:active,.button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:wait}.link{background:none!important;border:0!important;color:var(--mint)!important;padding:0!important;min-height:0!important;font-weight:500!important}form{margin:1rem 0}form.inline{display:inline;margin:0}label{display:block;font-weight:600;font-size:.87rem;margin:.75rem 0}input,select,textarea{background:var(--ink);color:var(--text);border:1px solid var(--border);border-radius:2px;display:block;padding:.73rem .8rem;width:100%;min-height:45px;max-width:100%;margin:.35rem 0;outline:0}input:focus,select:focus,textarea:focus{border-color:var(--focus);box-shadow:0 0 0 2px rgba(176,228,204,.18)}input::placeholder{color:#86a99a}input[type=file]{font-size:.8rem;max-width:100%;padding:.5rem}input[type=file]::file-selector-button{color:var(--ink);background:var(--mint);border:0;padding:.45rem;margin-right:.65rem;border-radius:2px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--focus);outline-offset:3px}.bingo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.tile{display:flex;flex-direction:column;justify-content:space-between;gap:.6rem;background:var(--panel);border:1px solid var(--border);border-radius:1px;padding:.65rem;min-height:135px;font-size:.79rem;overflow-wrap:anywhere}.tile form{margin:0}.tile .button,.tile button{width:100%;padding:.45rem .25rem;font-size:.76rem;min-height:39px}.photo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.photo-grid img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--border);border-radius:0}.room-panels{display:grid;gap:1rem}.part-list{list-style:none;margin:0;padding:0}.part-list li{padding:.9rem 0;border-top:1px solid var(--border)}.part-list li:first-child{border-top:0}.part-name{font-weight:700;display:block}.part-description{display:block;font-size:.83rem;color:var(--muted);margin:.25rem 0}.photo-form{display:grid;gap:.5rem}.photo-form input[type=file]{display:none}.photo-form .camera-open{width:100%;background:var(--forest);border-color:var(--green);color:white}.photo-form .camera-open:hover{background:var(--green);color:white}.room-heading{padding:.5rem 0 1rem}.quiet{font-size:.82rem;color:var(--muted)}table{width:100%;border-collapse:collapse;font-size:.78rem}th,td{padding:.7rem .4rem;border-bottom:1px solid var(--border);text-align:left;overflow-wrap:anywhere}th{color:var(--mint)}.table-scroll{overflow-x:auto;max-width:100%}details{padding:.6rem 0}summary{cursor:pointer}code{font-size:.82rem;overflow-wrap:anywhere}
/* Dedicated camera UI, stays in the same page to preserve the single-attempt rule. */
.camera-dialog{position:fixed;inset:0;z-index:1000;background:rgba(2,12,9,.9);display:grid;place-items:center;padding:0}.camera-dialog[hidden]{display:none}.camera-window{width:min(100%,550px);height:100dvh;max-height:100dvh;background:var(--ink);display:flex;flex-direction:column;position:relative}.camera-top{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--deep);border-bottom:1px solid var(--border)}.camera-top strong{font-size:1rem}.camera-stage{position:relative;min-height:0;flex:1;background:#010807;display:flex;align-items:center;justify-content:center;overflow:hidden}.camera-stage video,.camera-stage img{width:100%;height:100%;object-fit:contain}.camera-guide{position:absolute;inset:12%;border:1px solid rgba(176,228,204,.6);pointer-events:none}.camera-status{position:absolute;left:1rem;right:1rem;bottom:1rem;color:var(--mint);text-align:center;font-size:.86rem;text-shadow:0 1px 4px black}.camera-bottom{background:var(--deep);padding:1rem;display:grid;gap:.75rem}.camera-controls{display:flex;align-items:center;justify-content:space-around;gap:.75rem}.camera-controls button{flex:1}.camera-controls .shutter{flex:0 0 65px;width:65px;height:65px;min-height:65px;background:var(--mint);border:6px solid var(--deep);outline:2px solid var(--mint);border-radius:50%;padding:0;font-size:0}.camera-controls .shutter::after{content:"";width:38px;height:38px;border-radius:50%;background:var(--ink)}.camera-dialog button:disabled{opacity:.45}.camera-dialog .secondary{background:transparent;color:var(--mint);border-color:var(--border)}.camera-dialog .secondary:hover{background:var(--forest);color:white}.camera-footer{display:flex;gap:.5rem}.camera-footer button{flex:1}.camera-dialog button[hidden],.camera-dialog [hidden]{display:none!important}body.camera-active{overflow:hidden}
@media(min-width:620px){body{background:linear-gradient(90deg,#070e0c 0%,#091413 25%,#091413 75%,#070e0c 100%)}.top,.shell,.footer{box-shadow:0 0 0 1px rgba(176,228,204,.1)}.hero{padding-top:5rem}.shell{padding:1.8rem 1.65rem 3rem}.top{padding-inline:1.65rem}.footer{padding-inline:1.65rem}.camera-window{height:min(94dvh,850px);border:1px solid var(--border)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* v0.3.2 — mobile-first comfort and discoverability */
.shell{padding-top:1.8rem;padding-bottom:3.5rem}.panel,.cards article{padding:1.45rem}.room-panels{gap:1.25rem}.cards{gap:1rem}.part-list li{padding:1.15rem 0}.tile{padding:.8rem;min-height:150px}input,select,textarea{padding:.88rem .95rem;margin:.5rem 0 1rem}label{margin-top:1rem}.button,button:not(.link){padding:.9rem 1.2rem;min-height:48px}.panel form{margin-top:1.35rem}.hero-home{padding-top:3.5rem;padding-bottom:3rem}.hero-home h1{font-size:clamp(2.55rem,10vw,3.35rem);max-width:13ch}.hero-home>p:not(.eyebrow){font-size:1.06rem;line-height:1.75}.action-stack{display:flex;flex-direction:column;align-items:flex-start;gap:1.1rem;margin-top:2rem}.text-action{font-size:.9rem}.section-block{padding:2.5rem 0;border-top:1px solid var(--border)}.section-block h2{font-size:1.65rem;line-height:1.18;margin-bottom:1.4rem}.steps{display:grid;gap:0}.step,.feature-line{display:grid;grid-template-columns:48px 1fr;gap:1rem;padding:1.3rem 0;border-top:1px solid rgba(176,228,204,.15)}.step:first-child,.feature-line:first-of-type{border-top:0}.step h3,.feature-line h3{margin:0 0 .4rem}.step p,.feature-line p{margin:0;line-height:1.65}.step-number{color:var(--mint);font-size:1.05rem;font-weight:700}.feature-glyph{font-size:1.5rem;color:var(--mint)}.closing-cta{background:var(--deep);border:1px solid var(--border);padding:1.7rem;margin:1.5rem 0 2rem}.closing-cta h2{font-size:1.75rem}.closing-cta .button{margin-top:.6rem}.auth-panel{margin-top:1rem}.auth-panel h1{font-size:2rem}.auth-panel form>.button{width:100%;margin-top:1rem}.auth-links{display:flex;flex-direction:column;gap:.75rem;font-size:.9rem}.password-wrap{position:relative}.password-wrap input{padding-right:5.8rem}.password-wrap .password-toggle{position:absolute;right:.35rem;top:.35rem;min-height:36px;padding:.25rem .65rem;font-size:.8rem}.password-hints{border-left:2px solid var(--green);padding:.55rem 0 .55rem 1rem;margin:.75rem 0 1rem}.password-hints ul{padding-left:1.1rem;margin:.5rem 0}.password-hints li{font-size:.82rem;color:var(--muted);margin:.3rem 0}.password-hints li.met{color:var(--mint)}.password-hints li.met::marker{color:var(--mint)}.password-hints .quiet{margin:0;font-size:.8rem}.invite-panel #invite-url{font-size:.85rem}.invite-actions{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.invite-actions button{min-width:0}.invite-actions .secondary{background:var(--forest);border-color:var(--green);color:white}.invite-actions .secondary:hover{background:var(--green);color:white}.room-code{letter-spacing:.13em;color:var(--mint)}@media(min-width:620px){.shell{padding-inline:2rem}.panel,.cards article{padding:1.7rem}.closing-cta{padding:2rem}}
/* Ronde 2: status is gebaseerd op serverstappen, niet op een kunstmatige teller */
.preparation-steps{list-style:none;padding:0;display:grid;gap:12px;margin:24px 0}.preparation-steps li{border-left:3px solid #285a48;padding:12px 16px;background:#10231d;display:flex;flex-direction:column;gap:5px}.preparation-steps li span{color:#b0e4cc;font-size:.86rem}.preparation-steps li.is-current{border-color:#b0e4cc;background:#204637}.preparation-steps li.is-done{border-color:#408a71;opacity:.75}
/* Ronde 4: ingetogen studio-galerij */
.invention-card{display:grid;gap:12px}.studio-result{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;background:#182c25;border:1px solid #408a71}

/* v0.12 mobile-first game experience */
.game-app{display:grid;gap:1.1rem}.game-overview{padding:1rem 0 1.35rem;border-bottom:1px solid var(--border)}.game-overview h1{font-size:clamp(1.8rem,7vw,2.7rem);line-height:1.08;margin:.65rem 0 1.4rem}.game-topline,.progress-label,.rival-title{display:flex;justify-content:space-between;align-items:center;gap:.75rem}.game-state{font-size:.72rem;color:var(--mint);padding:.35rem .5rem;border:1px solid var(--green);text-transform:uppercase;letter-spacing:.08em}.score-strip{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--border)}.score-strip>span{padding:.85rem .5rem;display:grid;gap:.2rem;text-align:center}.score-strip>span+span{border-left:1px solid var(--border)}.score-strip b{font-size:1.5rem;color:var(--mint)}.score-strip small{font-size:.68rem;color:var(--muted)}.game-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;position:sticky;top:0;background:var(--ink);padding:.5rem 0;z-index:20}.game-tabs a{text-align:center;font-size:clamp(.65rem,2.6vw,.8rem);padding:.75rem .1rem;border-bottom:2px solid var(--green);color:var(--mint);text-decoration:none}.game-tabs a:focus-visible,.game-tabs a:hover{border-color:var(--mint);background:var(--deep)}.gameplay-section{scroll-margin-top:4rem;padding:1.5rem!important}.gameplay-section h2{font-size:1.55rem;margin:.4rem 0 .8rem}.game-primary{width:100%}.game-secondary{background:var(--forest)!important;border-color:var(--green)!important;color:var(--text)!important}.game-progress{height:6px;background:var(--forest);margin:.5rem 0 1.35rem;overflow:hidden}.game-progress>span{display:block;height:100%;background:var(--mint)}.progress-label{font-size:.82rem;color:var(--mint);margin-top:1.25rem}.game-part{display:grid;grid-template-columns:29px minmax(0,1fr);gap:.75rem;align-items:start}.part-index{width:28px;height:28px;border:1px solid var(--green);display:grid;place-items:center;font-size:.75rem;color:var(--mint)}.part-content{min-width:0}.part-content form{margin:.75rem 0 0}.part-content button{min-height:44px}.game-success{color:var(--mint);font-size:.8rem}.game-warning{color:#f7d6a1;font-size:.8rem}.power-panel{border-top:1px solid var(--green);padding-top:1.5rem;margin-top:1.2rem}.power-panel h3{margin:.4rem 0}.rival-card{border-top:1px solid var(--border);padding:1.25rem 0}.rival-card h3{margin:0}.rival-card:last-child{padding-bottom:0}.rival-title span{color:var(--mint);font-weight:700}.game-hint{padding:.8rem;border-left:2px solid var(--mint);background:var(--panel);font-size:.85rem}.member-summary{display:grid;gap:.6rem;margin:1rem 0}.member-summary>div{display:flex;align-items:center;gap:.7rem}.avatar-initial{display:grid;place-items:center;width:28px;height:28px;background:var(--forest);border:1px solid var(--green);color:var(--mint)}.tile-done{border-color:var(--mint)!important;background:var(--forest)!important}.tile{min-height:125px;padding:.6rem!important}.tile strong{font-size:.77rem}.tile .game-success{font-size:1.3rem}.game-timer{font-size:.85rem;margin:1rem 0 0}.game-app .photo-form{margin:.7rem 0 0}.game-app .photo-form .camera-open{font-size:.8rem;padding:.65rem .75rem;min-height:43px}.game-app section.panel{min-width:0}@media(min-width:620px){.gameplay-section{padding:1.8rem!important}}@media(prefers-reduced-motion:reduce){.game-tabs a{transition:none}}