:root{color:#333;--green:#4caf50;--green-dark:#2e7d32;--surface:#fff;--muted:#6b7280;--border:#ddd;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:#f0f2f5;font-family:Arial,sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:#333;background:#f0f2f5;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}#app{min-height:100vh}header{z-index:10;background:var(--green);color:#fff;justify-content:space-between;align-items:center;gap:8px;min-height:52px;padding:6px 8px;display:flex;position:sticky;top:0;box-shadow:0 1px 5px #0000001f}header h2{margin:0;font-size:1.2rem}.icon-btn,.admin-btn,.primary-btn,.secondary-btn,.close-btn,.empty-state-btn{border:0;border-radius:7px;font-weight:700}.icon-btn{width:42px;min-height:38px;color:var(--green-dark);background:#fff}.admin-btn{color:var(--green-dark);background:#fff;border-radius:999px;padding:6px 14px;box-shadow:0 2px 6px #00000026}.primary-btn{background:var(--green);color:#fff;padding:8px 14px}.secondary-btn{color:var(--green-dark);background:#fff;border:1px solid #cfd8cf;padding:8px 14px}.app-main{padding:18px}.projects-host{width:100%}.projects-section,.project-view{max-width:1180px;margin:0 auto}.section-toolbar{justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;display:flex}.section-toolbar h1{margin:0;font-size:1.45rem}.project-toolbar{justify-content:flex-start}.project-toolbar h1{text-align:center;flex:1}.projects-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;display:grid}.project-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px;box-shadow:0 2px 8px #00000014}.project-card.selected{outline:2px solid var(--green)}.project-card h2{margin:0 0 8px;font-size:1.08rem}.project-card p{color:var(--muted);margin:0 0 14px;font-size:.92rem}.table-shell{background:var(--surface);border:1px solid var(--border);border-radius:8px;overflow:auto;box-shadow:0 2px 8px #0000000f}.table-shell table{border-collapse:collapse;width:100%;min-width:640px;font-size:var(--table-font-size,14px)}.table-shell th,.table-shell td{border-bottom:1px solid var(--border);border-left:1px solid var(--border);text-align:start;white-space:nowrap;padding:10px 12px}.table-shell th{background:#f7f9f7;font-weight:700}.table-shell tbody td{color:var(--muted);text-align:center}.empty-state{text-align:center;background:var(--surface);border-radius:10px;max-width:520px;margin:42px auto;padding:34px 22px;box-shadow:0 2px 8px #00000014}.empty-state h2{margin:0 0 10px}.empty-state p{color:var(--muted);margin:0 0 22px}.empty-state-btn{background:var(--green);color:#fff;padding:14px 24px}.app-drawer{z-index:200;background:var(--green-dark);color:#fff;flex-direction:column;width:260px;height:100%;transition:left .28s cubic-bezier(.4,0,.2,1),right .28s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;left:-280px;overflow-y:auto;box-shadow:4px 0 16px #0000002e}.app-drawer.open{left:0}[dir=ltr] .app-drawer{left:auto;right:-280px;box-shadow:-4px 0 16px #0000002e}[dir=ltr] .app-drawer.open{right:0}.drawer-header{border-bottom:1px solid #fff3;justify-content:space-between;align-items:center;padding:18px 16px 10px;font-size:17px;font-weight:700;display:flex}.drawer-header .icon-btn{width:34px;min-height:32px}.drawer-item{color:#fff;text-align:start;background:0 0;border:0;border-bottom:1px solid #ffffff26;align-items:center;gap:12px;width:100%;padding:14px 18px;display:flex}.drawer-item:hover{background:#ffffff1f}.drawer-overlay{z-index:199;background:#00000059;display:none;position:fixed;inset:0}.drawer-overlay.open{display:block}.modal{z-index:100;background:#00000080;justify-content:center;align-items:center;padding:18px;display:flex;position:fixed;inset:0}.modal-content{background:var(--surface);border-radius:10px;flex-direction:column;gap:10px;width:min(520px,100%);max-height:90vh;padding:20px;display:flex;overflow:auto;box-shadow:0 12px 40px #00000038}.modal-content h3{margin:0 0 6px}.modal-content label{margin-top:8px;font-weight:700;display:block}.modal-content input,.modal-content select{background:#fff;border:1px solid #ccc;border-radius:5px;width:100%;margin-top:6px;padding:9px}.modal-actions{gap:8px;margin-top:8px;display:flex}.modal-actions>button{flex:1}.close-btn{background:var(--green);color:#fff;width:100%;padding:12px}.settings-panel{background:var(--surface);border-radius:10px;max-width:620px;margin:0 auto;padding:20px;box-shadow:0 2px 8px #00000014}.settings-panel h2{margin-top:0}.settings-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:14px 0;display:flex}body.dark-mode{color:#e0e0e0;background:#121212}body.dark-mode .app-main{background:#121212}body.dark-mode .project-card,body.dark-mode .empty-state,body.dark-mode .settings-panel,body.dark-mode .modal-content,body.dark-mode .table-shell{color:#e0e0e0;background:#1e1e1e;border-color:#444}body.dark-mode .project-card p,body.dark-mode .empty-state p,body.dark-mode .table-shell tbody td{color:#aaa}body.dark-mode .table-shell th{background:#262626}body.dark-mode .secondary-btn,body.dark-mode .modal-content input,body.dark-mode .modal-content select,body.dark-mode .icon-btn,body.dark-mode .admin-btn{color:#e0e0e0;background:#2a2a2a;border-color:#555}@media (width<=600px){.app-main{padding:12px}.section-toolbar{flex-direction:column;align-items:stretch}.section-toolbar .primary-btn{width:100%}.project-toolbar{align-items:stretch}.project-toolbar h1{text-align:start}}.grid-toolbar{flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0;display:flex}.grid-toolbar input[type=search]{border:1px solid var(--border);background:var(--surface);min-width:0;color:inherit;box-sizing:border-box;border-radius:8px;flex:220px;padding:8px 10px}.search-count{text-align:center;min-width:24px;color:var(--muted);font-size:12px}.sort-header{width:100%;color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;padding:4px 6px}.sort-header:hover,.sort-header:focus-visible{background:#ffffff1f}.settings-row{align-items:center;gap:6px;padding:8px 0;display:flex}.settings-row>span{flex:1}.settings-panel input,.settings-panel select,.settings-panel textarea{box-sizing:border-box;max-width:100%}.danger-btn{color:#fff!important;background:#f44336!important}.danger-btn:hover{background:#d32f2f!important}body.dark-mode .grid-toolbar input[type=search]{color:#e0e0e0;background:#1e1e1e;border-color:#444}body.dark-mode .sort-header:hover,body.dark-mode .sort-header:focus-visible{background:#ffffff14}
