html,body,#root{height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:#f7f9fc;color:#1a1a1a}.material-symbols-rounded{font-variation-settings:"FILL" 0,"wght" 450,"GRAD" 0,"opsz" 24;font-size:22px;line-height:1}.notizen-layout{display:grid;grid-template-columns:auto 1fr;height:100%}.notizen-main{display:flex;flex-direction:column;align-items:center;padding:1rem}.sidebar{width:190px;background:#fff;border-right:1px solid #e4e8f0;display:flex;flex-direction:column}.sidebar-header{display:flex;justify-content:space-between;align-items:center;padding:.6rem;font-weight:700;border-bottom:1px solid #e4e8f0}.sidebar-content{overflow-y:auto;padding:.6rem}.menu-link{display:flex;align-items:center;gap:.4rem;padding:.5rem .6rem;margin-bottom:.5rem;background:#eef3ff;border-radius:8px;text-decoration:none;color:#1a1a1a;font-weight:600}.menu-link:hover{background:#dbe8ff}.thumb{position:relative;margin-bottom:.6rem;border-radius:10px;overflow:hidden;border:2px solid transparent;background:#eef3ff;cursor:pointer}.thumb.active{border-color:#0b5fff}.thumb-inner{padding:.5rem;text-align:center}.thumb img{width:100%;height:auto;display:block}.thumb-delete{position:absolute;top:6px;right:6px;background:#fffffff2;border:1px solid #e4e8f0;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;cursor:pointer}.thumb-delete:hover{background:#fdd}.toolbar-notes{display:flex;gap:.5rem;flex-wrap:wrap;background:#fff;border-radius:12px;padding:.6rem;box-shadow:0 2px 6px #00000014;margin-bottom:1rem}.tool-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:none;cursor:pointer;transition:background .2s ease,transform .1s ease;color:#fff}.tool-btn:hover{transform:scale(1.05)}.tool-btn.blue{background:#0b5fff}.tool-btn.green{background:#28a745}.tool-btn.red{background:#dc3545}.tool-btn.orange{background:#fd7e14}.tool-btn.purple{background:#6f42c1}.tool-btn.gray{background:#6c757d}.tool-btn.dark{background:#343a40}.tool-btn.active{box-shadow:0 0 0 3px #fff6}input[type=color],input[type=range]{margin-left:.5rem}.canvas-page{background:#fff;border:1px solid #d7dbe3;box-shadow:0 4px 14px #17181a1a;width:794px;height:1123px;touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair}.fullscreen .sidebar{display:none}.fullscreen .canvas-page{width:100vw;height:100vh;border:none;box-shadow:none}.fullscreen .toolbar-notes{position:fixed;top:10px;left:50%;transform:translate(-50%);z-index:999}.fab-fullscreen{position:fixed;bottom:20px;right:20px;background:#0b5fff;color:#fff;border:none;width:56px;height:56px;border-radius:50%;font-size:24px;display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 12px #0000004d;z-index:1000}.fab-fullscreen:hover{background:#1b6eff}.close-btn{position:fixed;bottom:20px;left:20px;background:#d00;color:#fff;border:none;padding:.6rem 1rem;border-radius:8px;font-size:1rem;cursor:pointer;box-shadow:0 4px 12px #0003;z-index:1000}.close-btn:hover{background:#a00}.page{max-width:1024px;margin:0 auto;padding:1rem}.toolbar{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem}.search-input{flex:1 1 280px;padding:.65rem .8rem;border:1px solid #e4e8f0;border-radius:10px;background:#fff}.counter{color:#5b677a;background:#eef3ff;border:1px solid #e4e8f0;padding:.45rem .6rem;border-radius:10px}.table-container{width:100%;overflow-x:auto;border:1px solid #e4e8f0;border-radius:12px;background:#fff}.table thead th{text-align:left;background:#f4f7ff;padding:.75rem .9rem;border-bottom:1px solid #e4e8f0}.table tbody td{padding:.75rem .9rem;border-bottom:1px solid #e4e8f0}.table tbody tr:hover td{background:#0b5fff0f}.table tbody tr.selected td{background:#0b5fff1f}@media(max-width:640px){.table thead{display:none}.table,.table tbody,.table tr,.table td{display:block;width:100%}.table tr{margin:.6rem;padding:.9rem;border:1px solid #e4e8f0;border-radius:12px;background:#fff}.table td:before{content:attr(data-label);display:block;font-size:.82rem;font-weight:600;color:#5b677a;margin-bottom:.1rem}}.dark{background:#121212;color:#e6eaf2}.dark .sidebar{background:#1e1e1e;border-color:#2a2f39}.dark .menu-link{background:#2a2f39;color:#e6eaf2}.dark .toolbar-notes{background:#1e1e1e}.dark .tool-btn{color:#fff}.dark .canvas-page{background:#222}.dark .search-input{background:#2a2a2a;color:#e6eaf2}.dark .table-container{background:#1e1e1e}.dark .table thead th{color:#e6eaf2;background:#2a2f39}.dark .table tbody td{color:#e6eaf2}.header-logo{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;background:#fff;border-radius:50%}.header-logo img{height:28px;width:auto}:root{--primary: #0b5fff;--primary-contrast: #ffffff;--bg: #f7f9fc;--surface: #ffffff;--text: #1a1a1a;--muted: #5b677a;--border: #e4e8f0;--hover: #eef3ff;--radius: 12px;--radius-sm: 10px;--header-height: 60px;--shadow-sm: 0 1px 2px rgba(23, 24, 26, .06);--shadow-md: 0 8px 24px rgba(23, 24, 26, .12)}.theme-dark{--bg: #0b0c10;--surface: #12151b;--text: #e6eaf2;--muted: #a8b3c5;--border: #1f242e;--hover: rgba(11,95,255,.14);--shadow-sm: 0 1px 2px rgba(0,0,0,.35);--shadow-md: 0 8px 24px rgba(0,0,0,.6)}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}html{font-size:16px}@media(max-width:380px){html{font-size:15px}}@media(max-width:340px){html{font-size:14px}}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}:where(button,a,[role=button],input,select,textarea):focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:var(--radius-sm)}.app{min-height:100%;display:grid;grid-template-rows:auto 1fr auto}.header{position:sticky;top:0;z-index:50;height:calc(var(--header-height) + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);background:var(--primary);color:var(--primary-contrast);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;padding-inline:.75rem;box-shadow:var(--shadow-md)}.menu-btn{width:42px;height:42px;display:grid;place-items:center;background:#ffffff1a;border:1px solid rgba(255,255,255,.25);color:var(--primary-contrast);border-radius:10px;cursor:pointer;transition:background .2s ease,transform .08s ease}.menu-btn:hover{background:#ffffff2e}.menu-btn:active{transform:scale(.98)}.menu-btn .bar{width:20px;height:2px;background:var(--primary-contrast);margin:3px 0;display:block}.brand{text-align:center;font-weight:700;letter-spacing:.2px}.brand a{color:var(--primary-contrast)}.project-badge .pill{background:#ffffff1f;border:1px solid rgba(255,255,255,.28);color:var(--primary-contrast)}.pill-clear{color:#fff;background:transparent}.pill-clear:hover{background:#ffffff29}.header-logo img{height:32px;width:auto;filter:drop-shadow(var(--shadow-sm))}.nav{position:absolute;top:calc(var(--header-height) + env(safe-area-inset-top));left:0;right:0;background:var(--primary);color:var(--primary-contrast);border-bottom:1px solid rgba(255,255,255,.25);box-shadow:var(--shadow-md)}.nav ul{list-style:none;margin:0;padding:.5rem .75rem;display:grid;gap:.25rem}.nav a{display:block;color:var(--primary-contrast);padding:.6rem .7rem;border-radius:10px;transition:background .15s ease}.nav a:hover{background:#ffffff1f}.material-symbols-rounded{font-variation-settings:"FILL" 0,"wght" 600,"GRAD" 0,"opsz" 24;font-size:24px;line-height:1}.quick-actions{position:fixed;left:50%;transform:translate(-50%);top:calc(var(--header-height) + env(safe-area-inset-top) + 12px);display:flex;align-items:center;gap:.75rem;padding:.4rem .6rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-md);z-index:40;touch-action:none}.icon-btn{display:inline-flex;flex-direction:column;align-items:center;gap:.35rem;color:var(--primary);font-weight:600}.icon-btn .material-symbols-rounded{display:grid;place-items:center;width:46px;height:46px;border-radius:999px;background:var(--primary);color:#fff;box-shadow:var(--shadow-sm);transition:transform .12s ease,box-shadow .2s ease,background .2s ease}.icon-btn:hover .material-symbols-rounded{transform:translateY(-1px);box-shadow:var(--shadow-md);background:#1b6eff}.icon-label{font-size:.8rem;color:var(--text)}@media(max-width:640px){.quick-actions{gap:.5rem;padding:.35rem .5rem;top:calc(var(--header-height) + env(safe-area-inset-top) + 8px)}.icon-btn .material-symbols-rounded{width:42px;height:42px}.icon-label{font-size:.75rem}}.quick-actions.draggable{transform:none}.quick-actions.dragging{box-shadow:0 8px 24px #17181a2e;cursor:grabbing}.qa-handle,.qa-reset{display:grid;place-items:center;width:34px;height:34px;border-radius:999px;border:1px solid var(--border);background:var(--hover);color:var(--text)}.main{padding:1rem;padding-top:calc(84px + env(safe-area-inset-top))}@media(max-width:640px){.main{padding-top:calc(76px + env(safe-area-inset-top))}}.home{min-height:calc(100vh - (var(--header-height) + 120px));display:grid;place-items:center;padding:1rem}.home-logo{max-width:min(60vw,360px);height:auto;animation:fadeIn .35s ease both}.page{margin:0 auto;max-width:1024px;padding:1rem}.toolbar{display:flex;gap:.6rem;align-items:center;margin:.5rem 0 1rem;flex-wrap:wrap}.search-input{flex:1 1 280px;max-width:520px;padding:.65rem .8rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);box-shadow:var(--shadow-sm)}.counter{color:var(--muted);background:var(--hover);border:1px solid var(--border);padding:.45rem .6rem;border-radius:10px}.table-container{width:100%;overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow-md)}.table{width:100%;border-collapse:collapse;min-width:560px}.table thead th{text-align:left;background:linear-gradient(180deg,var(--hover),transparent);color:var(--text);padding:.75rem .9rem;border-bottom:1px solid var(--border);font-weight:700}.table tbody td{padding:.75rem .9rem;border-bottom:1px solid var(--border);color:var(--text)}.table tbody tr:hover td{background:#0b5fff0f;transition:background .2s ease}.table-clickable tbody tr{cursor:pointer}.table tbody tr.selected td{background:#0b5fff1f;border-color:#bed0ff}@media(max-width:640px){.table{min-width:0}.table thead{display:none}.table,.table tbody,.table tr,.table td{display:block;width:100%}.table tr{margin:.6rem;padding:.9rem;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);background:var(--surface)}.table td{border:none;padding:.35rem 0}.table td:before{content:attr(data-label);display:block;font-size:.82rem;font-weight:600;color:var(--muted);margin-bottom:.1rem}}.footer{border-top:1px solid var(--border);background:var(--surface);padding:.95rem 1rem;text-align:center;color:var(--muted);font-size:.95rem}.center{display:grid;place-items:center}.hide{display:none!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@media print{.header,.footer,.nav,.quick-actions{display:none!important}.main{padding:0}}.qa-toggle{position:absolute;right:8px;top:calc(env(safe-area-inset-top) + 8px);display:grid;place-items:center;width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:#ffffff1f;color:#fff;cursor:pointer;transition:background .2s ease,transform .08s ease;z-index:60}.qa-toggle:hover{background:#ffffff2e}.qa-toggle:active{transform:scale(.98)}.qa-toggle .material-symbols-rounded{font-variation-settings:"FILL" 0,"wght" 700,"GRAD" 0,"opsz" 24;font-size:22px}