:root{--papier:#0E1216;--wit:#161B20;--ink:#E9EAE6;--staal:#96A4B2;--zacht:#6F7D8A;--signaal:#F4783A;--raster:#2A3138;--klaar:#6DBF93;--blok:#E8847C;--display:"Space Grotesk",system-ui,sans-serif;--body:"Inter Tight",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--papier);color:var(--ink);font-family:var(--body);-webkit-text-size-adjust:100%}button,input,select{font:inherit}#app{height:100%}.cl-poort{min-height:100dvh;display:grid;place-items:center;padding:24px 16px}.cl-kaart{width:min(420px,100%);background:var(--wit);border:1px solid var(--raster);padding:28px 22px;display:flex;flex-direction:column;gap:14px}.cl-kaart h1{font-family:var(--display);font-size:1.8rem;margin:4px 0 0}.cl-kaart label{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--zacht)}.cl-kaart input{padding:12px;border:1px solid var(--raster);background:var(--papier);color:var(--ink);font-family:var(--body);font-size:1rem;letter-spacing:0;text-transform:none}.cl-kaart input:focus{outline:none;border-color:var(--staal)}.cl-knop-groot{padding:14px;background:var(--signaal);color:var(--papier);border:0;font-family:var(--display);font-weight:700;font-size:1rem;cursor:pointer}.cl-knop-groot:disabled{opacity:.6}.cl-foutmelding{color:var(--blok);border-left:3px solid var(--blok);padding:6px 10px;margin:0;font-size:.9rem}.cl-mut{margin:0;color:var(--zacht);font-size:.86rem;line-height:1.45}.cl-klein{font-size:.76rem}.cl-groot-bol{width:28px!important;height:28px!important}.cl-scherm{height:100dvh;display:flex;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.cl-paneel{display:flex;flex-direction:column;width:100%;max-width:880px;height:100%;min-height:0;background:var(--wit);border-left:1px solid var(--raster);border-right:1px solid var(--raster);position:relative}.cl-kop{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--raster)}.cl-titel{flex:1;display:flex;flex-direction:column;line-height:1.15;min-width:0}.cl-titel strong{font-family:var(--display);font-size:1.05rem}.cl-sub{font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--zacht);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cl-modus{display:flex;border:1px solid var(--raster)}.cl-modus button{background:none;border:0;color:var(--staal);padding:7px 10px;font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.cl-modus button[aria-pressed=true]{background:var(--ink);color:var(--papier)}.cl-breed,.cl-breed button{flex:1}.cl-ikoon{background:none;border:1px solid var(--raster);color:var(--staal);width:34px;height:34px;flex:none;cursor:pointer;font-size:.9rem}.cl-ikoon:hover,.cl-ikoon[aria-expanded=true]{color:var(--ink);border-color:var(--staal)}.cl-bol{width:14px;height:14px;border-radius:50%;background:var(--signaal);flex:none}.cl-bol.cl-praat{animation:cl-puls .9s ease-in-out infinite}.cl-bol.cl-luistert{background:var(--klaar);animation:cl-puls 1.4s ease-in-out infinite}.cl-bol.cl-denkt{animation:cl-knipper 1s ease-in-out infinite}@keyframes cl-puls{0%{box-shadow:0 0 #f4783a8c}70%{box-shadow:0 0 0 12px #f4783a00}to{box-shadow:0 0 #f4783a00}}@keyframes cl-knipper{0%,to{opacity:1}50%{opacity:.35}}.cl-instel{position:absolute;top:59px;right:0;bottom:0;left:0;z-index:5;padding:14px 16px 24px;background:var(--papier);display:flex;flex-direction:column;gap:10px;overflow:auto;border-top:1px solid var(--raster)}.cl-instelkop{display:flex;justify-content:space-between;align-items:center;font-family:var(--display)}.cl-instelrij{display:flex;align-items:center;gap:10px}.cl-instelrij input[type=range]{flex:1;accent-color:var(--signaal)}.cl-onder{justify-content:space-between;margin-top:12px;padding-top:12px;border-top:1px solid var(--raster)}.cl-label{font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--zacht);margin-top:8px}.cl-waarde{font-family:var(--mono);font-size:.72rem;color:var(--staal);min-width:48px;text-align:right}.cl-geheugen{display:flex;flex-direction:column;gap:4px}.cl-herinnering{display:grid;grid-template-columns:110px 1fr auto;gap:8px;align-items:center;background:var(--wit);border:1px solid var(--raster);padding:4px 4px 4px 10px;font-size:.84rem;min-height:34px}.cl-herinnering em{font-style:normal;font-family:var(--mono);font-size:.58rem;letter-spacing:.06em;text-transform:uppercase;color:var(--signaal)}.cl-herinnering .cl-ikoon{width:28px;height:28px;font-size:.7rem}.cl-bronnen{display:flex;flex-direction:column;gap:4px}.cl-bron{display:grid;grid-template-columns:12px 120px 1fr;gap:8px;align-items:center;font-size:.84rem;padding:6px 10px;background:var(--wit);border:1px solid var(--raster);color:var(--zacht)}.cl-bron strong{color:var(--staal);font-weight:500}.cl-bron-aan{color:var(--staal)}.cl-bron-aan strong{color:var(--ink)}.cl-stip{width:8px;height:8px;border-radius:50%;background:var(--raster)}.cl-bron-aan .cl-stip{background:var(--klaar)}.cl-stemmen{display:flex;flex-direction:column;gap:4px}.cl-stem{display:flex;gap:6px}.cl-stemnaam{flex:1;text-align:left;background:var(--wit);border:1px solid var(--raster);color:var(--ink);padding:8px 10px;font-size:.86rem;cursor:pointer;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:baseline}.cl-stemnaam em{font-style:normal;font-family:var(--mono);font-size:.6rem;text-transform:uppercase;color:var(--signaal)}.cl-stemnaam span{width:100%;color:var(--zacht);font-size:.74rem}.cl-stem.cl-gekozen .cl-stemnaam{border-color:var(--signaal)}.cl-stem .cl-ikoon{height:auto}.cl-uitnodig{display:grid;grid-template-columns:1fr 1fr auto auto;gap:6px}.cl-uitnodig input,.cl-uitnodig select,.cl-linkveld{padding:9px 10px;border:1px solid var(--raster);background:var(--wit);color:var(--ink);min-width:0}.cl-linkveld{width:100%;margin-top:6px;font-family:var(--mono);font-size:.74rem}.cl-link{background:none;border:0;color:var(--signaal);cursor:pointer;padding:0;text-decoration:underline}.cl-gesprek{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:8px;min-height:0;-webkit-overflow-scrolling:touch}.cl-leeg{color:var(--staal);font-size:.95rem;display:flex;flex-direction:column;gap:6px}.cl-leeg p{margin:0 0 8px;line-height:1.5}.cl-voorbeeld{text-align:left;background:var(--papier);border:1px solid var(--raster);color:var(--ink);padding:10px 12px;font-size:.9rem;cursor:pointer}.cl-voorbeeld:hover{border-color:var(--signaal)}.cl-regel{max-width:82%;padding:10px 13px;font-size:.98rem;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}.cl-ik{align-self:flex-end;background:var(--ink);color:var(--papier)}.cl-zij{align-self:flex-start;background:var(--papier);border:1px solid var(--raster)}.cl-wacht{color:var(--zacht);letter-spacing:.2em}.cl-melding{align-self:stretch;max-width:100%;font-family:var(--mono);font-size:.74rem;color:var(--staal);border-left:3px solid var(--klaar);background:var(--papier)}.cl-fout{align-self:stretch;max-width:100%;border-left:3px solid var(--blok);background:var(--papier);color:var(--blok);font-size:.88rem}.cl-voorstellen{display:flex;flex-direction:column;gap:8px;border:1px solid var(--signaal);padding:10px}.cl-voorstel{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;align-items:center;font-size:.9rem}.cl-knoppen{grid-column:2;display:flex;gap:6px}.cl-nr{font-family:var(--mono);font-size:.68rem;color:var(--signaal);border:1px solid var(--signaal);padding:1px 6px}.cl-balk{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid var(--raster);background:var(--papier);min-height:66px;flex-wrap:wrap}.cl-balktekst{flex:1;min-width:120px;font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;color:var(--staal);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.cl-balktekst.cl-live{font-family:var(--body);font-size:.95rem;letter-spacing:0;color:var(--ink)}.cl-start{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;padding:15px 18px;background:var(--signaal);color:var(--papier);border:0;font-family:var(--display);font-weight:700;font-size:1.05rem;cursor:pointer}.cl-start:disabled{opacity:.5;cursor:not-allowed}.cl-golf{display:flex;align-items:center;gap:3px;height:26px;width:34px;flex:none}.cl-golf i{display:block;width:4px;height:6px;background:var(--zacht);border-radius:2px}.cl-golf.cl-aan i{background:var(--klaar);animation:cl-golf 1s ease-in-out infinite}.cl-golf.cl-zegt i{background:var(--signaal);animation:cl-golf .7s ease-in-out infinite}.cl-golf i:nth-child(2){animation-delay:.1s}.cl-golf i:nth-child(3){animation-delay:.2s}.cl-golf i:nth-child(4){animation-delay:.3s}.cl-golf i:nth-child(5){animation-delay:.4s}@keyframes cl-golf{0%,to{height:6px}50%{height:24px}}.cl-invoer{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--raster);align-items:center}.cl-invoer input{flex:1;min-width:0;padding:12px;border:1px solid var(--raster);background:var(--papier);color:var(--ink);font-size:1rem}.cl-invoer input:focus{outline:none;border-color:var(--staal)}.cl-mic{width:46px;height:46px;flex:none;border:1px solid var(--raster);background:var(--papier);color:var(--ink);cursor:pointer;display:grid;place-items:center}.cl-mic.cl-aan{background:var(--klaar);color:var(--papier);border-color:var(--klaar);animation:cl-knipper 1.2s ease-in-out infinite}.cl-mic:disabled{opacity:.4}.cl-knop{display:inline-flex;align-items:center;justify-content:center;padding:10px 13px;border:1px solid var(--ink);background:var(--ink);color:var(--papier);font-family:var(--display);font-size:.84rem;font-weight:600;cursor:pointer;white-space:nowrap;text-decoration:none}.cl-knop.cl-stil{background:transparent;color:var(--staal);border-color:var(--raster)}.cl-knop.cl-rood{background:transparent;color:var(--blok);border-color:var(--blok)}.cl-knop:disabled{opacity:.5;cursor:not-allowed}@media(max-width:640px){.cl-paneel{border:0}.cl-regel{max-width:90%}.cl-uitnodig{grid-template-columns:1fr 1fr}.cl-bron{grid-template-columns:12px 96px 1fr}.cl-herinnering{grid-template-columns:84px 1fr auto}}