:root{--bg: #f4f8ec;--hero: #1f9c82;--hero-deep: #157a63;--surface: #ffffff;--surface-sunken: #eaf2e0;--text: #1c3b2e;--text-on-hero: #f6fdf6;--text-muted: #62806e;--border: #dbe8d1;--accent: #1f9c82;--accent-hover: #167a63;--accent-soft: #d9f0e1;--accent-bright: #8fb08c;--warn: #e2703a;--warn-soft: #fbe3d3;--caution: #b8790f;--caution-soft: #f7ead0;--focus-ring: #2f6fed;--font-display: "Baloo 2", ui-rounded, "Segoe UI Rounded", system-ui, sans-serif;--font-body: "Nunito Sans", ui-sans-serif, system-ui, sans-serif;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-6: 24px;--space-8: 32px;--space-12: 48px;--space-16: 64px;--radius: 14px;--radius-lg: 28px;--shadow-card: 0 2px 6px rgba(20, 55, 42, .07), 0 16px 32px -16px rgba(20, 55, 42, .22)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #0f2019;--hero: #123529;--hero-deep: #0a2119;--surface: #17332a;--surface-sunken: #10241d;--text: #eaf5ee;--text-on-hero: #eaf5ee;--text-muted: #94b6a4;--border: #244339;--accent: #52c8a9;--accent-hover: #71d8bc;--accent-soft: #1c4437;--accent-bright: #a9c8a6;--warn: #e88a5c;--warn-soft: #3b2519;--caution: #e0ab52;--caution-soft: #40320f;--shadow-card: 0 2px 6px rgba(0, 0, 0, .3), 0 18px 32px -16px rgba(0, 0, 0, .55)}}:root[data-theme=dark]{--bg: #0f2019;--hero: #123529;--hero-deep: #0a2119;--surface: #17332a;--surface-sunken: #10241d;--text: #eaf5ee;--text-on-hero: #eaf5ee;--text-muted: #94b6a4;--border: #244339;--accent: #52c8a9;--accent-hover: #71d8bc;--accent-soft: #1c4437;--accent-bright: #a9c8a6;--warn: #e88a5c;--warn-soft: #3b2519;--caution: #e0ab52;--caution-soft: #40320f;--shadow-card: 0 2px 6px rgba(0, 0, 0, .3), 0 18px 32px -16px rgba(0, 0, 0, .55)}*,*:before,*:after{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}button{font-family:inherit;font-size:inherit;cursor:pointer}:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}.app{min-height:100%;margin:0 auto;padding-bottom:var(--space-16)}.app-hero{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--hero),var(--hero-deep));border-radius:0 0 var(--radius-lg) var(--radius-lg);padding:var(--space-8) var(--space-4) var(--space-6);text-align:center}.brand-link{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:none;padding:0;cursor:pointer;font:inherit;position:relative}.brand-link:focus-visible{outline:3px solid var(--focus-ring);outline-offset:4px;border-radius:var(--radius)}.app-brand{display:flex;align-items:center;justify-content:center;gap:var(--space-3)}.app-logo{display:flex;width:48px;height:48px;border-radius:50%;background:var(--surface);box-shadow:var(--shadow-card);overflow:hidden;flex-shrink:0}.app-title{font-family:var(--font-display);font-weight:700;font-size:clamp(2.1rem,5vw + 1rem,3rem);letter-spacing:-.01em;color:var(--text-on-hero);margin:0}.app-title em{color:var(--accent-bright);font-style:normal}.app-subtitle{font-family:var(--font-body);font-weight:700;font-size:.85rem;letter-spacing:.04em;color:var(--text-on-hero);opacity:.85;margin:0}.auth-block{margin-top:var(--space-2);display:flex;flex-direction:column;align-items:center;gap:var(--space-1);min-height:28px;justify-content:center}.auth-link{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:none;color:var(--text-on-hero);opacity:.75;font-family:var(--font-body);font-weight:700;font-size:.78rem;text-decoration:underline;text-underline-offset:2px;padding:var(--space-1)}.auth-link:hover{opacity:1}.auth-hint{font-family:var(--font-body);font-weight:700;font-size:.8rem;color:var(--text-on-hero);opacity:.85;margin:0}.auth-inline{width:100%;max-width:340px}.auth-label{display:block;font-family:var(--font-body);font-weight:700;font-size:.8rem;color:var(--text-on-hero);opacity:.85;margin-bottom:var(--space-1)}.auth-row{display:flex;gap:var(--space-2)}.auth-input{flex:1;min-width:0;border:2px solid transparent;border-radius:999px;padding:var(--space-1) var(--space-3);font-family:var(--font-body);font-weight:600;font-size:.85rem;background:var(--surface);color:var(--text)}.auth-input:focus-visible{outline:3px solid var(--focus-ring);outline-offset:1px}.auth-submit{padding:var(--space-1) var(--space-4);flex:none}.auth-error{margin:var(--space-1) 0 0;font-family:var(--font-body);font-weight:700;font-size:.75rem;color:var(--warn)}.mode-tabs{display:flex;justify-content:center;gap:var(--space-2);margin-top:var(--space-6)}.mode-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid transparent;background:#ffffff29;color:var(--text-on-hero);padding:var(--space-1) var(--space-3);border-radius:999px;font-family:var(--font-display);font-weight:600;font-size:.8rem;transition:background .15s ease-out,color .15s ease-out,transform .15s ease-out}.mode-tab:hover{background:#ffffff47}.mode-tab[aria-selected=true]{background:var(--accent-bright);color:#1c3b2e}main[data-mode-root]{max-width:640px;margin:0 auto;padding:var(--space-6) var(--space-4) 0}.specimen-card{position:relative;background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);overflow:hidden}.leaf-burst{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:5}.falling-leaf{position:absolute;top:-12%;left:var(--x, 50%);width:var(--size, 28px);height:var(--size, 28px);opacity:0;animation:leaf-fall var(--duration, 2.8s) ease-in-out var(--delay, 0ms) forwards}@keyframes leaf-fall{0%{transform:translate(0) rotate(0);opacity:0}8%{opacity:.95}45%{transform:translate(calc(var(--drift, 30px) * -.6),calc(var(--fall, 500px) * .45)) rotate(calc(var(--rotate, 260deg) * .5))}to{transform:translate(var(--drift, 30px),var(--fall, 500px)) rotate(var(--rotate, 260deg));opacity:0}}.specimen-figure{position:relative;aspect-ratio:1 / 1;background:var(--surface-sunken);display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:pan-y}.specimen-figure>[data-figure]{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.specimen-figure img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;opacity:1;transition:opacity .22s ease-out}.specimen-figure img.figure-img-entering,.specimen-figure img.figure-img-leaving{opacity:0}.specimen-placeholder{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);color:var(--text-muted);padding:var(--space-6);text-align:center}.specimen-placeholder svg{width:56px;height:56px;stroke:var(--text-muted)}.specimen-placeholder span{font-family:var(--font-body);font-weight:700;font-size:.7rem;letter-spacing:.04em;text-transform:uppercase}.specimen-tag{position:absolute;top:var(--space-4);left:var(--space-4);background:var(--accent-bright);color:#1c3b2e;font-family:var(--font-display);font-weight:700;font-size:.78rem;letter-spacing:.02em;text-transform:uppercase;padding:var(--space-1) var(--space-3);border-radius:999px}.specimen-number{position:absolute;bottom:var(--space-4);right:var(--space-4);width:52px;height:52px;border-radius:50%;background:var(--surface);box-shadow:var(--shadow-card);display:flex;align-items:center;justify-content:center}.specimen-number svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.specimen-number svg circle{fill:none;stroke-width:4}.specimen-number svg .track{stroke:var(--surface-sunken)}.specimen-number svg .progress{stroke:var(--accent-bright);stroke-linecap:round;transition:stroke-dashoffset .3s ease-out}.specimen-number span{position:relative;font-family:var(--font-display);font-weight:700;font-size:.68rem;color:var(--text)}.specimen-body{padding:var(--space-6)}.part-dots{display:flex;justify-content:center;gap:var(--space-2);margin-bottom:var(--space-4)}.part-dot{width:12px;height:14px;padding:0;border:none;background-color:var(--border);-webkit-mask-image:url(/images/_assets/tree-dot.png);mask-image:url(/images/_assets/tree-dot.png);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transition:background-color .15s ease-out,transform .15s ease-out}.part-dot[aria-current=true]{background-color:var(--accent-bright);transform:scale(1.15)}.reveal-panel{animation:reveal-in .22s ease-out}@keyframes reveal-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.tree-name{font-family:var(--font-display);font-size:1.7rem;font-weight:700;color:var(--accent);margin:0 0 var(--space-1)}.spotted-badge{display:inline-block;vertical-align:middle;font-family:var(--font-body);font-weight:700;font-size:.7rem;color:var(--accent-hover);background:var(--accent-soft);padding:var(--space-1) var(--space-2);border-radius:999px;margin-left:var(--space-2)}.tree-latin{font-style:italic;color:var(--text-muted);margin:0 0 var(--space-4)}.tree-info dt{font-family:var(--font-display);font-weight:700;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-top:var(--space-3)}.tree-info dd{margin:var(--space-1) 0 0}.toxicity-block{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--border)}.toxicity-row{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-2)}.tox-badge{display:inline-flex;align-items:center;gap:var(--space-1);font-family:var(--font-body);font-weight:700;font-size:.75rem;padding:var(--space-1) var(--space-3);border-radius:999px}.tox-badge[data-level=geen]{background:var(--accent-soft);color:var(--accent-hover)}.tox-badge[data-level=licht]{background:var(--caution-soft);color:var(--caution)}.tox-badge[data-level=giftig]{background:var(--warn-soft);color:var(--warn)}.tox-badge[data-level=zeer_giftig]{background:var(--warn);color:#fff}.toxicity-note{margin:0;font-size:.85rem;color:var(--text-muted)}.toxicity-block-ai{border:1px dashed var(--caution);border-radius:var(--radius);padding:var(--space-3);margin-top:var(--space-4);background:var(--caution-soft)}.toxicity-ai-disclaimer{margin:var(--space-2) 0 0;font-size:.78rem;font-weight:700;color:var(--caution)}.controls-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-top:var(--space-6)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid var(--border);background:var(--surface);color:var(--text);padding:var(--space-3) var(--space-4);border-radius:999px;font-family:var(--font-display);font-weight:600;transition:background .15s ease-out,border-color .15s ease-out,transform .15s ease-out}.btn:hover{border-color:var(--accent)}.btn:active{transform:scale(.97)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;flex:1}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn-ghost{background:transparent;border-color:transparent;color:var(--text-muted);font-family:var(--font-body);font-weight:700;font-size:.8rem}.btn-ghost:hover{color:var(--text);border-color:var(--border)}.btn-shuffle{display:inline-flex;align-items:center;gap:var(--space-3);padding:var(--space-1) var(--space-4) var(--space-1) var(--space-1)}.shuffle-badge{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--accent);color:#fff;flex-shrink:0}.shuffle-badge svg{width:19px;height:19px}.score-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-4)}.score-label{font-family:var(--font-body);font-weight:700;font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}.score-badge{display:flex;align-items:center;gap:var(--space-2);background:var(--surface);border-radius:999px;padding:var(--space-1) var(--space-3) var(--space-1) var(--space-1);box-shadow:var(--shadow-card)}.score-ring{position:relative;width:32px;height:32px}.score-ring svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.score-ring svg circle{fill:none;stroke-width:4}.score-ring svg .track{stroke:var(--surface-sunken)}.score-ring svg .progress{stroke:var(--accent-bright);stroke-linecap:round;transition:stroke-dashoffset .3s ease-out}.score-badge strong{font-family:var(--font-display);font-weight:700;font-size:.95rem;color:var(--text)}.score-bar-right{display:flex;align-items:center;gap:var(--space-2)}.streak-badge{font-family:var(--font-display);font-weight:700;font-size:.85rem;color:var(--warn);background:var(--warn-soft);padding:var(--space-1) var(--space-3);border-radius:999px;animation:reveal-in .22s ease-out}.streak-summary{text-align:center;font-family:var(--font-display);font-weight:700;color:var(--warn);margin:0 0 var(--space-4)}.perfect-badge{display:block;width:fit-content;margin:0 auto var(--space-4);font-family:var(--font-display);font-weight:700;color:var(--caution);background:var(--caution-soft);padding:var(--space-2) var(--space-4);border-radius:999px;text-align:center;animation:reveal-in .22s ease-out}.level-toggle{display:flex;justify-content:center;gap:var(--space-2);margin-bottom:var(--space-4)}.level-tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid var(--border);background:var(--surface);color:var(--text-muted);padding:var(--space-1) var(--space-4);border-radius:999px;font-family:var(--font-display);font-weight:600;font-size:.8rem;transition:background .15s ease-out,color .15s ease-out,border-color .15s ease-out}.level-tab:hover{border-color:var(--accent);color:var(--text)}.level-tab[aria-selected=true]{background:var(--accent);border-color:var(--accent);color:#fff}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin-top:var(--space-6)}@media(max-width:420px){.quiz-options{grid-template-columns:1fr}}.quiz-option{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid var(--border);background:var(--surface);color:var(--text);padding:var(--space-3) var(--space-4);border-radius:var(--radius);text-align:left;font-family:var(--font-body);font-weight:700;transition:background .15s ease-out,border-color .15s ease-out}.quiz-option:hover:not(:disabled){border-color:var(--accent)}.quiz-option:disabled{cursor:default}.quiz-option[data-state=correct]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-hover)}.quiz-option[data-state=incorrect]{background:var(--warn-soft);border-color:var(--warn);color:var(--warn)}.quiz-feedback{margin-top:var(--space-4);font-family:var(--font-body);font-weight:700;font-size:.85rem;color:var(--text-muted);min-height:1.2em}.summary-score{font-family:var(--font-display);font-size:clamp(2.5rem,8vw,3.5rem);font-weight:700;color:var(--accent);text-align:center;margin:var(--space-4) 0}.summary-score span{font-size:.4em;color:var(--text-muted);font-family:var(--font-body);font-weight:700}.summary-list{list-style:none;margin:var(--space-6) 0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.summary-list li{display:flex;justify-content:space-between;padding:var(--space-2) var(--space-3);border-radius:var(--radius);background:var(--surface-sunken);font-weight:700;font-size:.9rem}.summary-list li[data-correct=false]{color:var(--warn)}.admin-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:var(--space-3);margin-bottom:var(--space-6)}.admin-stat{background:var(--surface-sunken);border-radius:var(--radius);padding:var(--space-4);text-align:center}.admin-stat-clickable{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid transparent;width:100%;font:inherit;color:inherit;cursor:pointer;transition:border-color .15s ease-out}.admin-stat-clickable:hover{border-color:var(--accent)}.admin-user-row{flex-direction:column;align-items:stretch;gap:var(--space-2)}.admin-user-row-top{display:flex;justify-content:space-between;gap:var(--space-3)}.warn-badge{display:inline-block;vertical-align:middle;font-family:var(--font-body);font-weight:700;font-size:.7rem;color:var(--warn);background:var(--warn-soft);padding:var(--space-1) var(--space-2);border-radius:999px;margin-left:var(--space-2)}.admin-stat strong{display:block;font-family:var(--font-display);font-size:1.6rem;font-weight:700;color:var(--accent)}.admin-stat span{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}.collect-header{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6)}.collect-ring{position:relative;width:64px;height:64px;flex-shrink:0}.collect-ring svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.collect-ring svg circle{fill:none;stroke-width:6}.collect-ring svg .track{stroke:var(--surface-sunken)}.collect-ring svg .progress{stroke:var(--accent-bright);stroke-linecap:round;transition:stroke-dashoffset .3s ease-out}.collect-ring span{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:.85rem;color:var(--text)}.collect-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--space-2)}.collect-item{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-radius:var(--radius);background:var(--surface-sunken);font-weight:700;font-size:.82rem}.collect-item[data-spotted=true]{background:var(--accent-soft);color:var(--accent-hover)}.collect-item[data-spotted=false]{color:var(--text-muted);opacity:.7}.identify-intro{color:var(--text-muted);margin:0 0 var(--space-6)}.identify-organ{display:flex;align-items:center;justify-content:center;text-align:center;cursor:pointer}.identify-loading{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-8) 0;text-align:center;color:var(--text-muted)}.identify-spinner{width:36px;height:36px;border-radius:50%;border:4px solid var(--surface-sunken);border-top-color:var(--accent);animation:identify-spin .8s linear infinite}@keyframes identify-spin{to{transform:rotate(360deg)}}.identify-empty{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-6) 0;text-align:center;color:var(--text-muted)}.identify-result{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius);background:var(--surface-sunken);margin-top:var(--space-2)}.identify-result[data-top=true]{background:var(--accent-soft);padding:var(--space-4)}.identify-result[data-known=true]:not([data-top=true]){border:2px solid var(--accent-soft)}.identify-result-percent{flex-shrink:0;min-width:52px;text-align:right;font-family:var(--font-display);font-weight:700;color:var(--accent)}.identify-result-name strong{display:block;font-family:var(--font-display);color:var(--text)}.identify-result-name span{font-style:italic;color:var(--text-muted);font-size:.85rem}.identify-result-note{margin:var(--space-1) 0 0;font-size:.8rem;font-weight:700;color:var(--accent-hover)}.landing-tagline{position:relative;font-family:var(--font-body);font-weight:600;font-size:1.05rem;line-height:1.5;color:var(--text-on-hero);opacity:.92;max-width:30ch;margin:var(--space-4) auto 0}.landing-illustration{position:absolute;left:0;right:0;bottom:0;height:110px;pointer-events:none;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent,black 35%);mask-image:linear-gradient(to bottom,transparent,black 35%)}.landing-illustration img{width:100%;height:100%;object-fit:cover;object-position:center bottom;display:block;mix-blend-mode:luminosity;opacity:.55}.landing-card{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:var(--space-6)}.landing-steps{display:flex;flex-direction:column;gap:var(--space-4)}.landing-step{display:flex;align-items:flex-start;gap:var(--space-3)}.landing-step-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--accent);color:#fff;flex-shrink:0}.landing-step-icon svg{width:22px;height:22px}.landing-step strong{display:block;font-family:var(--font-display);font-size:1rem;color:var(--text);margin-bottom:2px}.landing-step p{margin:0;color:var(--text-muted);font-size:.9rem}.landing-cta-row{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}.landing-cta-row .btn{flex:1 1 160px}@media(max-width:380px){.landing-cta-row{flex-direction:column}.landing-cta-row .btn{flex:1}}.landing-footnote{text-align:center;margin:var(--space-4) 0 0;font-family:var(--font-body);font-weight:700;font-size:.72rem;letter-spacing:.03em;color:var(--text-muted)}footer.app-footer{text-align:center;margin-top:var(--space-12);font-family:var(--font-body);font-weight:700;font-size:.72rem;letter-spacing:.03em;color:var(--text-muted)}