:root{color-scheme:light;--bg-body: #f5f5f7;--bg-card: #ffffff;--bg-card-soft: #f9fafb;--border-subtle: #e5e7eb;--border-strong: #d1d5db;--text-main: #111827;--text-muted: #6b7280;--text-link: #2563eb;--accent: #2563eb;--accent-hover: #1d4ed8;--danger: #dc2626;--radius-card: 12px;--radius-input: 8px;--shadow-card: 0 10px 25px rgba(15, 23, 42, .06);--shadow-soft: 0 4px 12px rgba(15, 23, 42, .05);--font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%}body{font-family:var(--font-family);color:var(--text-main);background-color:#2d5a3d;background-image:url(/bg-chalkboard.jpg);background-size:cover;background-attachment:fixed;background-position:center}.app-root{min-height:100vh;display:flex;flex-direction:column}.app-header{position:sticky;top:0;z-index:10;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(to bottom,#1e3c28e0,#1e3c28bf);border-bottom:1px solid rgba(255,255,255,.12)}.app-header-inner{max-width:1080px;margin:0 auto;padding:.75rem 1.5rem;display:flex;align-items:center;justify-content:space-between}.app-logo{display:flex;align-items:center;gap:.6rem;font-weight:700;letter-spacing:.06em;font-size:1rem;text-transform:uppercase;color:#fff}.app-logo-img{height:32px;width:auto;display:block}.app-nav{display:flex;gap:.75rem}.app-nav-link{padding:.35rem .9rem;border-radius:999px;border:1px solid transparent;font-size:.85rem;text-decoration:none;color:#ffffffb3;transition:all .15s ease-in-out}.app-nav-link:hover{background:#ffffff1f;color:#fff}.app-nav-link-active{background:#ffffff2e;color:#fff;border-color:#ffffff4d}.app-main{flex:1;padding:1.5rem 1rem 2rem}.app-container{max-width:1080px;margin:0 auto}.card{background:var(--bg-card);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:1.5rem 1.75rem;margin-bottom:1.5rem;border:1px solid rgba(148,163,184,.25)}.card--narrow{max-width:480px;margin:2rem auto}.card-header{margin-bottom:1.25rem}.card-title{margin:0 0 .25rem;font-size:1.35rem;font-weight:600}.card-subtitle{margin:0;font-size:.9rem;color:var(--text-muted)}.form-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:.9rem 1rem}.form-field{grid-column:span 12;display:flex;flex-direction:column;gap:.35rem}.form-field--half{grid-column:span 6}.form-field--third{grid-column:span 4}.form-field--checkbox{justify-content:flex-end}@media(max-width:768px){.form-field--half,.form-field--third{grid-column:span 12}}.form-label{font-size:.85rem;color:var(--text-muted)}.form-label-required{margin-left:.2rem;color:var(--danger)}.form-input{border-radius:var(--radius-input);border:1px solid var(--border-subtle);padding:.55rem .7rem;font-size:.9rem;outline:none;background:#fff;transition:border-color .1s ease,box-shadow .1s ease,background-color .1s ease}.form-input:focus{border-color:var(--accent);box-shadow:0 0 0 1px #2563eb40}.form-input--textarea{min-height:120px;resize:vertical}.form-input--error{border-color:#ef4444;background:#fff5f5}.form-input--error:focus{border-color:#ef4444;box-shadow:0 0 0 1px #ef444440}.form-error{font-size:.8rem;color:#ef4444;margin-top:.2rem;line-height:1.3}.form-footer{grid-column:span 12;margin-top:.5rem;padding-top:.9rem;border-top:1px solid var(--border-subtle);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem}.form-footer-left{display:flex;align-items:center}.form-footer-right{display:flex;gap:.5rem}.btn-primary{border:none;border-radius:999px;background:var(--accent);color:#f9fafb;padding:.5rem 1.2rem;font-size:.9rem;font-weight:500;cursor:pointer;box-shadow:var(--shadow-soft);transition:background .15s ease,transform .08s ease,box-shadow .15s ease}.btn-primary:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 10px 20px #2563eb2e}.btn-primary:active{transform:translateY(0);box-shadow:var(--shadow-soft)}.btn-secondary{border-radius:999px;border:1px solid var(--border-strong);background:#fff;color:var(--text-main);padding:.45rem 1.1rem;font-size:.9rem;cursor:pointer;transition:background .12s ease,border-color .12s ease}.btn-secondary:hover{background:#f3f4f6;border-color:#9ca3af}.btn-link{background:none;border:none;padding:0;font-size:.9rem;color:var(--text-link);cursor:pointer;text-decoration:none}.btn-link:hover{text-decoration:underline}.btn-link--danger{color:var(--danger)}.checkbox-label{display:inline-flex;align-items:center;gap:.4rem;font-size:.9rem;color:var(--text-main)}.checkbox-label--muted{color:var(--text-muted)}.table-wrapper{margin-top:1rem;border-radius:10px;border:1px solid var(--border-subtle);overflow:hidden;background:var(--bg-card-soft)}.table-wrapper--scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.table{width:100%;border-collapse:collapse;font-size:.85rem}.table thead{background:#f3f4f6}.table th,.table td{padding:.5rem .75rem;border-bottom:1px solid var(--border-subtle);text-align:left}.table th{font-weight:500;color:#4b5563;white-space:nowrap}.table tbody tr:nth-child(2n){background:#f9fafb}.table-actions{white-space:nowrap;display:inline-flex;align-items:center;gap:.5rem}.table td.table-actions{padding-right:1.25rem}.table-empty{text-align:center;padding:.9rem;color:var(--text-muted)}.admin-layout{display:block}.admin-layout>.card{margin-bottom:1.5rem}.admin-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.6rem}.admin-toolbar__left{display:flex;align-items:center;gap:.75rem}.admin-toolbar__right{display:flex;align-items:center;gap:.5rem}.admin-count{font-size:.875rem;color:var(--text-muted, #666)}.th-filterable{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.th-filterable:hover{background:#e9ecf0}.th-filterable--active{color:#4f46e5;background:#eef2ff}.th-filterable--active:hover{background:#e0e7ff}.th-label{margin-right:.3rem}.th-filter-icon{font-size:.65rem;opacity:.55;vertical-align:middle}.th-filterable--active .th-filter-icon{opacity:1}.filter-dropdown{position:absolute;z-index:9999;background:#fff;border:1px solid #d1d5db;border-radius:8px;box-shadow:0 8px 24px #00000024;min-width:230px;max-width:340px;padding:.65rem;display:flex;flex-direction:column;gap:.5rem}.filter-dropdown__search{width:100%;padding:.35rem .5rem;border:1px solid #d1d5db;border-radius:6px;font-size:.85rem;box-sizing:border-box;outline:none}.filter-dropdown__search:focus{border-color:#6366f1;box-shadow:0 0 0 2px #6366f126}.filter-dropdown__list{max-height:230px;overflow-y:auto;display:flex;flex-direction:column;gap:.15rem}.filter-dropdown__option{display:flex;align-items:center;gap:.45rem;cursor:pointer;padding:.25rem .35rem;border-radius:4px;font-size:.875rem;-webkit-user-select:none;user-select:none}.filter-dropdown__option:hover{background:#f3f4f6}.filter-dropdown__label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.filter-dropdown__empty{font-size:.875rem;color:#9ca3af;padding:.3rem .35rem}.filter-dropdown__footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #e5e7eb;padding-top:.5rem}.drag-handle-col{width:32px}.drag-handle{cursor:grab;color:#9ca3af;font-size:1rem;text-align:center;-webkit-user-select:none;user-select:none}.drag-handle:active{cursor:grabbing}.row--dragging{opacity:.35;background:#f3f4f6}.row--drag-over td{border-top:2px solid #6366f1}.link{color:var(--text-link);text-decoration:none}.link:hover{text-decoration:underline}@media(max-width:768px){.btn-primary,.btn-secondary{min-height:40px}.table-wrapper--scroll{-webkit-overflow-scrolling:touch}}@media(max-width:600px){.app-header-inner{padding:.5rem 1rem;flex-wrap:wrap;gap:.4rem}.app-logo{font-size:.85rem;gap:.4rem}.app-logo-img{height:24px}.app-nav{gap:.35rem}.app-nav-link{padding:.25rem .55rem;font-size:.75rem}.app-main{padding:.875rem .625rem 1.5rem}.card{padding:1rem .875rem;border-radius:10px;margin-bottom:1rem}.card--narrow{margin:1rem auto}.card-title{font-size:1.15rem}.admin-toolbar{flex-direction:column;align-items:flex-start;gap:.5rem}.admin-toolbar__right{flex-wrap:wrap;gap:.4rem}.filter-dropdown{max-width:calc(100vw - 1rem);min-width:200px}.form-footer{flex-direction:column;align-items:flex-start}.form-footer-right{align-self:flex-end}}
