:root{--bg: #f5f5f4;--surface: #ffffff;--text: #1c1c1c;--muted: #767676;--border: #e2e2e2;--primary: #1d4ed8;--danger: #d92d20;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}.app{display:flex;flex-direction:column;height:100dvh}.app-header{display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top) + 12px) 16px 12px;background:var(--surface);border-bottom:1px solid var(--border)}.app-header h1{font-size:18px;margin:0}.live-indicator{font-size:13px;font-weight:600}.live-indicator.live{color:#30a46c}.live-indicator.offline{color:var(--muted)}.app-main{flex:1;overflow-y:auto;padding-bottom:16px}.tab-bar{display:flex;border-top:1px solid var(--border);background:var(--surface);padding-bottom:env(safe-area-inset-bottom)}.tab-bar button{flex:1;border:none;background:none;padding:12px 0;font-size:14px;color:var(--muted)}.tab-bar button.active{color:var(--primary);font-weight:600}.login-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100dvh;padding:24px;text-align:center}.user-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;width:100%;max-width:320px;margin-top:16px}.user-button{padding:18px 8px;font-size:16px;border-radius:12px;border:1px solid var(--border);background:var(--surface)}.pin-display{display:flex;gap:12px;margin:20px 0}.pin-dot{width:16px;height:16px;border-radius:50%;border:2px solid var(--border)}.pin-dot.filled{background:var(--primary);border-color:var(--primary)}.pin-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%;max-width:280px}.pin-key{padding:18px 0;font-size:20px;border-radius:12px;border:1px solid var(--border);background:var(--surface)}button{cursor:pointer;font-family:inherit}.primary-button{background:var(--primary);color:#fff;border:none;border-radius:10px;padding:14px 20px;font-size:16px;font-weight:600;margin-top:16px;text-align:center;text-decoration:none;display:inline-block}.primary-button.block{display:block;width:100%}.danger-button{background:none;border:1px solid var(--danger);color:var(--danger);border-radius:10px;padding:12px 16px;font-weight:600}.danger-button.block{width:100%;margin-top:24px}.link-button{background:none;border:none;color:var(--primary);padding:8px 0;font-size:14px}.icon-button{border:1px solid var(--border);background:var(--surface);border-radius:8px;width:40px;height:40px;font-size:16px}.icon-button.danger{color:var(--danger);border-color:var(--danger)}.error{color:var(--danger);font-size:14px}.muted{color:var(--muted)}.center{text-align:center;padding:24px}.filter-bar{padding:12px 16px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:8px}.search-input{padding:10px 12px;border-radius:8px;border:1px solid var(--border);font-size:15px}.filter-row{display:flex;gap:8px}.filter-row select{flex:1;padding:8px;border-radius:8px;border:1px solid var(--border);font-size:14px}.ampel-filter-row{display:flex;gap:10px}.ampel-filter-chip{border:2px solid transparent;background:var(--bg);border-radius:20px;padding:6px 10px}.ampel-filter-chip.active{border-color:var(--primary)}.card-list{padding:12px 16px;display:flex;flex-direction:column;gap:10px}.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:12px 14px}.card-top{display:flex;align-items:center;gap:8px;font-weight:600}.card-aufgabe{margin-top:4px;font-size:14px;color:#444;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-meta{margin-top:6px;font-size:13px;color:var(--muted)}.card-bottom{margin-top:8px}.badge{display:inline-block;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600}.badge-neutral{background:#eee;color:#555}.badge-info{background:#dbeafe;color:#1d4ed8}.badge-success{background:#d1fae5;color:#067647}.badge-progress{background:#fef3c7;color:#92400e}.badge-done{background:#e5e7eb;color:#374151}.badge-warning{background:#fee2e2;color:#b42318}.fab{position:fixed;right:20px;bottom:calc(env(safe-area-inset-bottom) + 76px);width:56px;height:56px;border-radius:50%;background:var(--primary);color:#fff;font-size:28px;border:none;box-shadow:0 4px 12px #0003}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:flex-end;z-index:50}.modal{background:var(--surface);width:100%;max-height:92dvh;border-radius:16px 16px 0 0;display:flex;flex-direction:column}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--border)}.modal-header h2{font-size:17px;margin:0}.modal-body{padding:16px;overflow-y:auto;display:flex;flex-direction:column}.modal-body label{font-size:13px;font-weight:600;color:var(--muted);margin-top:14px;margin-bottom:4px}.modal-body input,.modal-body select,.modal-body textarea{padding:10px 12px;border-radius:8px;border:1px solid var(--border);font-size:15px;width:100%;font-family:inherit}.modal-footer{display:flex;gap:10px;padding:16px;border-top:1px solid var(--border);padding-bottom:calc(env(safe-area-inset-bottom) + 16px)}.modal-footer .primary-button{flex:1;margin-top:0}.row-with-add{display:flex;gap:8px}.row-with-add select,.row-with-add input{flex:1}.radio-group{display:flex;flex-wrap:wrap;gap:8px}.radio-pill{display:flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:20px;padding:8px 12px;font-size:13px;position:relative}.radio-pill input{width:auto;margin:0}.radio-pill:has(input:checked){background:#eef2ff;border-color:var(--primary)}.ampel-pill:has(input:checked){background:#f8f8f8}.history-section{margin-top:16px;border-top:1px solid var(--border);padding-top:8px}.history-list{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-direction:column;gap:10px}.history-list li{font-size:13px;background:var(--bg);padding:8px 10px;border-radius:8px}.history-meta{color:var(--muted);font-size:12px}.settings-page{padding:16px}.settings-section{margin-top:24px}.settings-section h3{font-size:15px;margin-bottom:8px}.manage-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.manage-list li{display:flex;gap:8px}.manage-list li input{flex:1;padding:8px 10px;border-radius:8px;border:1px solid var(--border)}