*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg: #f0f4f8;--color-white: #ffffff;--color-text: #2d3748;--color-muted: #718096;--color-border: #e2e8f0;--color-shadow: rgba(0,0,0,.07);--color-yellow: #fef3c7;--color-yellow-dark: #d97706;--color-blue: #dbeafe;--color-blue-dark: #2563eb;--color-green: #d1fae5;--color-green-dark: #059669;--color-purple: #ede9fe;--color-purple-dark: #7c3aed;--color-orange: #ffedd5;--color-orange-dark: #ea580c;--color-teal: #ccfbf1;--color-teal-dark: #0d9488;--color-pink: #fce7f3;--color-pink-dark: #db2777;--color-navy: #e0e7ff;--color-navy-dark: #4338ca;--color-rose: #ffe4e6;--color-rose-dark: #e11d48;--color-indigo: #e0e7ff;--color-indigo-dark: #6366f1;--radius: 16px;--radius-sm: 8px;--gap: 16px}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:var(--color-bg);color:var(--color-text);font-size:15px;line-height:1.5}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;gap:16px;color:var(--color-muted)}.loading-spinner{width:36px;height:36px;border:3px solid var(--color-border);border-top-color:var(--color-blue-dark);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.view-toggle{display:flex;justify-content:center;gap:8px;padding:12px 16px;background:var(--color-white);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:100}.toggle-btn{display:flex;align-items:center;gap:6px;padding:8px 20px;border-radius:20px;border:2px solid var(--color-border);background:transparent;cursor:pointer;font-size:14px;font-weight:600;color:var(--color-muted);transition:all .2s}.toggle-btn.active{background:var(--color-blue-dark);color:#fff;border-color:var(--color-blue-dark)}.naam-scherm{display:flex;align-items:center;justify-content:center;min-height:80vh}.naam-card{background:var(--color-white);border-radius:var(--radius);padding:40px;box-shadow:0 4px 24px var(--color-shadow);text-align:center;max-width:400px;width:100%}.naam-card h2{font-size:1.5rem;margin-bottom:8px}.naam-card p{color:var(--color-muted);margin-bottom:20px}.naam-card input{width:100%;padding:10px 14px;border:2px solid var(--color-border);border-radius:var(--radius-sm);font-size:16px;margin-bottom:16px;outline:none;transition:border-color .2s}.naam-card input:focus{border-color:var(--color-blue-dark)}.student-view{max-width:1400px;margin:0 auto;padding:20px 16px 0}.student-grid{display:flex;flex-direction:column;gap:var(--gap)}.grid-row{display:grid;gap:var(--gap)}.top-row{grid-template-columns:1fr 2fr}.routes-row{grid-template-columns:repeat(3,1fr)}.bottom-row{grid-template-columns:repeat(4,1fr)}.reflection-row{grid-template-columns:1fr}@media (max-width: 1100px){.top-row,.routes-row,.bottom-row{grid-template-columns:repeat(2,1fr)}}@media (max-width: 640px){.top-row,.routes-row,.bottom-row{grid-template-columns:1fr}}.quest-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;background:linear-gradient(135deg,#1e3a5f,#2563eb);color:#fff;padding:20px 24px;border-radius:var(--radius);margin-bottom:8px}.quest-header-left{display:flex;align-items:center;gap:16px}.header-icon{color:#93c5fd}.quest-title{font-size:1.8rem;font-weight:800;letter-spacing:1px}.quest-subtitle{font-size:.9rem;color:#bfdbfe;margin-top:2px}.quest-header-right{display:flex;gap:16px;flex-wrap:wrap}.header-stat{display:flex;align-items:center;gap:6px;background:#ffffff26;border-radius:20px;padding:6px 14px;font-size:.85rem;color:#e0f2fe}.quest-card{background:var(--color-white);border-radius:var(--radius);box-shadow:0 2px 12px var(--color-shadow);overflow:hidden;border:1px solid var(--color-border)}.wide-card{grid-column:1 / -1}.card-header{display:flex;align-items:flex-start;gap:12px;padding:16px 20px;font-weight:600}.card-header h2{font-size:1rem;font-weight:700}.card-header p{font-size:.8rem;opacity:.8;margin-top:2px}.card-header-yellow{background:var(--color-yellow);color:var(--color-yellow-dark)}.card-header-blue{background:var(--color-blue);color:var(--color-blue-dark)}.card-header-green{background:var(--color-green);color:var(--color-green-dark)}.card-header-purple{background:var(--color-purple);color:var(--color-purple-dark)}.card-header-orange{background:var(--color-orange);color:var(--color-orange-dark)}.card-header-teal{background:var(--color-teal);color:var(--color-teal-dark)}.card-header-pink{background:var(--color-pink);color:var(--color-pink-dark)}.card-header-navy{background:var(--color-navy);color:var(--color-navy-dark)}.card-header-rose{background:var(--color-rose);color:var(--color-rose-dark)}.card-header-indigo{background:var(--color-indigo);color:var(--color-indigo-dark)}.card-body{padding:16px 20px}.form-group{margin-bottom:12px}.form-group label{display:block;font-size:.85rem;font-weight:600;color:var(--color-muted);margin-bottom:4px}.form-group textarea,.form-group input[type=text],.form-group input[type=date]{width:100%;padding:8px 12px;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);font-size:.9rem;font-family:inherit;resize:vertical;outline:none;transition:border-color .2s;background:#fafbfc}.form-group textarea:focus,.form-group input:focus{border-color:var(--color-blue-dark);background:#fff}.form-group textarea:disabled,.form-group input:disabled{opacity:.6;background:#f7f7f7}.reflectie-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width: 640px){.reflectie-grid{grid-template-columns:1fr}}.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border-radius:8px;border:none;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .2s;white-space:nowrap}.btn-primary{background:var(--color-blue-dark);color:#fff}.btn-primary:hover{background:#1d4ed8}.btn-secondary{background:var(--color-border);color:var(--color-text)}.btn-secondary:hover{background:#cbd5e0}.btn-ghost{background:transparent;color:var(--color-muted);border:1.5px dashed var(--color-border)}.btn-ghost:hover{border-color:var(--color-blue-dark);color:var(--color-blue-dark)}.btn:disabled{opacity:.5;cursor:not-allowed}.wide-btn{width:100%;justify-content:center}.success-msg{color:var(--color-green-dark);font-weight:600;font-size:.9rem;margin-top:8px}.empty-msg{color:var(--color-muted);font-style:italic;font-size:.85rem}.blokken-row{display:flex;gap:8px;align-items:stretch;flex-wrap:wrap}.blok-item{flex:1;min-width:120px;background:var(--color-blue);border-radius:10px;padding:14px 12px;text-align:center;position:relative}.blok-nummer{font-size:.7rem;font-weight:700;color:var(--color-blue-dark);text-transform:uppercase;margin-bottom:4px}.blok-vak{font-weight:700;font-size:.9rem;color:var(--color-text)}.blok-titel{font-size:.78rem;color:var(--color-muted);margin-top:3px}.blok-arrow{display:none}.blokken-note{margin-top:12px;font-size:.82rem;color:var(--color-muted);font-style:italic}.opdrachten-lijst{list-style:none;margin-bottom:12px}.opdracht-item{margin-bottom:8px}.opdracht-label{display:flex;align-items:flex-start;gap:8px;cursor:pointer;font-size:.9rem}.opdracht-label input{margin-top:3px;accent-color:var(--color-blue-dark);flex-shrink:0}.plek-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.plek-btn{padding:12px;border-radius:10px;border:2px solid var(--color-border);background:#fafbfc;cursor:pointer;font-size:.9rem;font-weight:600;transition:all .2s;color:var(--color-text)}.plek-btn:hover{border-color:var(--color-teal-dark);background:var(--color-teal)}.plek-btn.selected{border-color:var(--color-teal-dark);background:var(--color-teal);color:var(--color-teal-dark)}.plek-btn:disabled{opacity:.5;cursor:not-allowed}.hulp-lijst{list-style:none}.hulp-item{padding:10px 14px;margin-bottom:6px;border-radius:8px;background:var(--color-pink);font-size:.88rem;color:var(--color-pink-dark);font-weight:500}.quest-footer{display:flex;justify-content:center;gap:32px;flex-wrap:wrap;background:linear-gradient(135deg,#1e3a5f,#2563eb);color:#bfdbfe;padding:20px;margin-top:20px;font-size:.9rem;border-radius:var(--radius) var(--radius) 0 0}.admin-panel{display:flex;min-height:calc(100vh - 52px)}.admin-sidebar{width:240px;flex-shrink:0;background:var(--color-white);border-right:1px solid var(--color-border);padding:20px;display:flex;flex-direction:column;gap:16px}.admin-sidebar h2{font-size:1rem;font-weight:700}.planning-lijst{list-style:none;display:flex;flex-direction:column;gap:4px}.planning-item{display:flex;align-items:center;gap:4px}.planning-naam{flex:1;display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:6px;border:none;background:transparent;cursor:pointer;font-size:.85rem;text-align:left;transition:background .15s}.planning-naam:hover{background:var(--color-bg)}.planning-item.actief .planning-naam{background:var(--color-blue);color:var(--color-blue-dark);font-weight:600}.pub-icon{opacity:.6}.del-btn{padding:5px;border:none;background:transparent;cursor:pointer;color:var(--color-muted);border-radius:4px;transition:color .2s}.del-btn:hover{color:#e11d48}.admin-main{flex:1;padding:20px 24px;overflow-y:auto}.admin-header-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:12px}.admin-header-bar h2{font-size:1.2rem;font-weight:700}.admin-actions{display:flex;align-items:center;gap:12px}.pub-toggle{display:flex;align-items:center;gap:6px;font-size:.9rem;cursor:pointer}.pub-toggle input{accent-color:var(--color-blue-dark)}.admin-sectie{background:var(--color-white);border:1px solid var(--color-border);border-radius:10px;padding:16px 20px;margin-bottom:14px}.admin-sectie.collapsible{padding:0}.sectie-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;padding:14px 20px;border:none;background:transparent;cursor:pointer;font-size:.95rem;font-weight:600;color:var(--color-text)}.sectie-toggle:hover{background:var(--color-bg)}.sectie-body{padding:4px 20px 16px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.blok-form-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}.blok-nr{font-size:.8rem;font-weight:700;color:var(--color-muted);width:50px;flex-shrink:0}.blok-form-row input{flex:1}.opdracht-sectie{margin-bottom:16px}.opdracht-sectie h4{font-size:.85rem;text-transform:uppercase;color:var(--color-muted);margin-bottom:8px;font-weight:700}.lijst-row{display:flex;align-items:center;gap:6px;margin-bottom:6px}.lijst-row input{flex:1}.icon-btn{padding:6px;border:none;background:transparent;cursor:pointer;color:var(--color-muted);border-radius:4px}.icon-btn:hover{color:#e11d48}.reacties-tabel-wrapper{overflow-x:auto;margin-top:12px}.reacties-tabel{width:100%;border-collapse:collapse;font-size:.85rem}.reacties-tabel th,.reacties-tabel td{padding:8px 12px;border:1px solid var(--color-border);text-align:left}.reacties-tabel th{background:var(--color-bg);font-weight:600}.reactie-data{font-size:.75rem;max-width:300px;white-space:pre-wrap;word-break:break-word}.app-root{min-height:100vh}